/* =========================================================
   iSmartLib R2Z16 — System-Wide Screen UI Standard
   Scope: interactive screen UI only.
   Print label templates are intentionally not linked.
   ========================================================= */

:root{
    --isl-ui-font-body:14px;
    --isl-ui-font-control:14px;
    --isl-ui-font-button:13.5px;
    --isl-ui-font-table:13px;
    --isl-ui-font-label:12.5px;
    --isl-ui-font-helper:12px;
    --isl-ui-font-floor:11.5px;
    --isl-ui-radius:10px;
}

/* Screen-root foundation */
.isl-ui-standards-root{
    width:100%;
    min-width:0;
    max-width:none;
    font-size:var(--isl-ui-font-body);
    line-height:1.5;
}

.isl-ui-standards-root,
.isl-ui-standards-root *,
.isl-ui-standards-root *::before,
.isl-ui-standards-root *::after{
    box-sizing:border-box;
}

.isl-ui-standards-root > *,
.isl-ui-standards-root section,
.isl-ui-standards-root article,
.isl-ui-standards-root form,
.isl-ui-standards-root fieldset{
    min-width:0;
}

/* Standard page hierarchy */
.isl-ui-standards-root h1{
    font-size:clamp(22px,2vw,30px);
    line-height:1.15;
}

.isl-ui-standards-root h2{
    font-size:clamp(18px,1.45vw,22px);
    line-height:1.2;
}

.isl-ui-standards-root h3{
    font-size:clamp(15px,1.15vw,18px);
    line-height:1.25;
}

/* Dynamic readability floors */
.isl-ui-standards-root .isl-ui-font-floor{
    font-size:var(--isl-ui-font-floor) !important;
    line-height:1.4 !important;
}

.isl-ui-standards-root .isl-ui-helper-floor{
    font-size:var(--isl-ui-font-helper) !important;
    line-height:1.4 !important;
}

.isl-ui-standards-root .isl-ui-label-floor{
    font-size:var(--isl-ui-font-label) !important;
    line-height:1.35 !important;
}

.isl-ui-standards-root .isl-ui-body-floor{
    font-size:13px !important;
    line-height:1.45 !important;
}

.isl-ui-standards-root .isl-ui-table-floor{
    font-size:var(--isl-ui-font-table) !important;
    line-height:1.4 !important;
}

.isl-ui-standards-root .isl-ui-control-floor{
    font-size:var(--isl-ui-font-control) !important;
    line-height:1.35 !important;
}

/* Consistent forms */
.isl-ui-standards-root input:not([type="checkbox"]):not([type="radio"]),
.isl-ui-standards-root select,
.isl-ui-standards-root textarea{
    max-width:100%;
    min-width:0;
    font-size:var(--isl-ui-font-control);
}

.isl-ui-standards-root button,
.isl-ui-standards-root .btn,
.isl-ui-standards-root [role="button"]{
    font-size:var(--isl-ui-font-button);
    line-height:1.25;
}

/* Tables */
.isl-ui-table-scroll{
    width:100%;
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
}

.isl-ui-table-scroll > table{
    width:100%;
    max-width:none;
    margin:0;
}

.isl-ui-standards-root table{
    font-size:var(--isl-ui-font-table);
}

.isl-ui-standards-root th,
.isl-ui-standards-root td{
    min-width:0;
    vertical-align:middle;
}

/* Media is never allowed to create horizontal overflow */
.isl-ui-standards-root img,
.isl-ui-standards-root video,
.isl-ui-standards-root canvas{
    max-width:100%;
    height:auto;
}

/* Responsive grid/flex classes are applied from the R2Z16 runtime */
.isl-ui-auto-grid,
.isl-ui-auto-flex{
    min-width:0;
}

.isl-ui-auto-flex{
    flex-wrap:wrap;
}

.isl-ui-auto-grid > *,
.isl-ui-auto-flex > *{
    min-width:0;
}

/* Enterprise SVG replacement for legacy text/initial fake icons */
.isl-ui-svg-icon{
    display:inline-grid !important;
    place-items:center !important;
    width:1.35em !important;
    height:1.35em !important;
    min-width:1.35em !important;
    line-height:1 !important;
    font-size:1em !important;
    vertical-align:middle !important;
}

.isl-ui-svg-icon > svg{
    display:block;
    width:100% !important;
    height:100% !important;
    fill:none !important;
    stroke:currentColor !important;
    stroke-width:1.8 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
}

/* Desktop / laptop full-width behavior */
@media (min-width:901px){
    .isl-ui-standards-root{
        width:100%;
        max-width:none;
    }
}

/* Tablet */
@media (max-width:900px){
    .isl-ui-standards-root .isl-ui-auto-grid{
        grid-template-columns:minmax(0,1fr) !important;
    }

    .isl-ui-standards-root .isl-ui-auto-flex{
        row-gap:10px;
    }

    .isl-ui-standards-root table{
        white-space:nowrap;
    }
}

/* Mobile */
@media (max-width:760px){
    .isl-ui-standards-root{
        font-size:14px;
    }

    .isl-ui-standards-root h1{
        font-size:clamp(22px,7vw,27px);
    }

    .isl-ui-standards-root h2{
        font-size:clamp(18px,5.5vw,21px);
    }

    .isl-ui-standards-root input:not([type="checkbox"]):not([type="radio"]),
    .isl-ui-standards-root select,
    .isl-ui-standards-root textarea{
        width:100%;
        min-width:0;
        font-size:16px !important;
    }

    .isl-ui-standards-root button,
    .isl-ui-standards-root .btn,
    .isl-ui-standards-root [role="button"]{
        min-height:42px;
    }

    .isl-ui-standards-root .isl-ui-mobile-full{
        width:100% !important;
        max-width:100% !important;
    }

    .isl-ui-table-scroll{
        border-radius:8px;
    }

    .isl-ui-standards-root table{
        font-size:13px;
    }
}

/* Small phone */
@media (max-width:480px){
    .isl-ui-standards-root{
        font-size:13.5px;
    }

    .isl-ui-standards-root h1{
        font-size:22px;
    }

    .isl-ui-standards-root h2{
        font-size:18px;
    }

    .isl-ui-standards-root .isl-ui-auto-flex{
        gap:8px;
    }
}

/* Print must retain the dedicated document/label CSS */
@media print{
    .isl-ui-table-scroll{
        overflow:visible !important;
    }
}