/* Public theme contract. Page CSS owns layout; these tokens own appearance.
 * Keep document paper and rich text content outside the interface adapters.
 */
:root {
    --ui-font-family:Tajawal,Arial,sans-serif;
    --ui-base-font-size:var(--brand-font-size,15px);
    --ui-text:var(--brand-text,#172033);
    --ui-heading:var(--brand-heading,#102a43);
    --ui-page-bg:#f4f7fb;
    --ui-primary:var(--brand-primary,#94744b);
    --ui-primary-text:var(--brand-primary-text,#fff);
    --ui-header-bg:var(--brand-header-bg,#f7fbff);
    --ui-sidebar-bg:var(--brand-sidebar-bg,#0b1f33);
    --ui-sidebar-text:var(--brand-sidebar-text,#eef6ff);
    --ui-footer-bg:var(--brand-footer-bg,#fff);
    --ui-footer-text:var(--brand-footer-text,#667085);
    --ui-portal-card-bg:var(--brand-portal-card-bg,#fff);
    --ui-portal-card-text:var(--brand-portal-card-text,#172033);
    --ui-surface-subtle:#f7f9fc;
    --ui-table-heading:#dfe9ff;
    --ui-table-heading-text:#0f2144;
    --ui-table-stripe:#f4f7ff;
    --ui-table-hover:#edf2f7;
    --ui-card-radius:var(--ui-radius);
    --ui-card-padding:18px;
    --ui-shadow:0 16px 40px #102a4314;
    --ui-disabled-bg:#f1f4f7;
    --ui-icon-secondary-bg:#f1f3f5;
    --ui-icon-secondary-text:#667085;
    --ui-icon-secondary-border:#e1e5e9;
    --ui-icon-secondary-hover-border:var(--ui-primary);
    --ui-icon-hover-bg:#fff;
    --ui-icon-fade-duration:240ms;
}
html[data-ui-theme] {
    --app-font-size:var(--ui-base-font-size)!important;
    --app-font-family:var(--ui-font-family)!important;
    --app-text:var(--ui-text)!important;
    --app-muted:var(--ui-muted)!important;
    --app-border:var(--ui-border)!important;
    --app-surface:var(--ui-surface)!important;
    --app-bg:var(--ui-page-bg)!important;
    --app-header:var(--ui-heading)!important;
    --app-header-bg:var(--ui-header-bg)!important;
    --app-accent:var(--ui-primary)!important;
    --app-button-text:var(--ui-primary-text)!important;
    --app-sidebar-bg:var(--ui-sidebar-bg)!important;
    --app-sidebar-text:var(--ui-sidebar-text)!important;
    --app-footer-bg:var(--ui-footer-bg)!important;
    --app-footer-text:var(--ui-footer-text)!important;
    --app-danger:var(--ui-danger)!important;
    --shadow:var(--ui-shadow)!important;
    --portal-bg:var(--ui-page-bg)!important;
    --portal-surface:var(--ui-surface)!important;
    --portal-text:var(--ui-text)!important;
    --portal-muted:var(--ui-muted)!important;
    --portal-border:var(--ui-border)!important;
    --portal-accent:var(--ui-primary)!important;
    --portal-accent-text:var(--ui-primary-text)!important;
    --portal-card-bg:var(--ui-portal-card-bg)!important;
    --portal-card-text:var(--ui-portal-card-text)!important;
}
@media screen {
    html[data-ui-theme] body[data-ui-scope="application"] {
        color:var(--ui-text); background-color:var(--ui-page-bg);
        font-family:var(--ui-font-family); font-size:var(--ui-base-font-size);
    }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.panel,.project-card,.flow-stage,.module-card,.stat-card,.card,.crm-summary>div,.svc-settings>div,.attendance-stats>div,dialog,.modal,.modal-content) {
        background-color:var(--ui-surface)!important; color:var(--ui-text);
        border-color:var(--ui-border)!important; border-radius:var(--ui-card-radius)!important;
    }
    html[data-ui-theme] body[data-ui-scope="application"].portal-body {
        --portal-accent:var(--ui-primary)!important; --portal-accent-text:var(--ui-primary-text)!important; --portal-muted:var(--ui-muted)!important;
    }
    html[data-ui-theme] body[data-ui-scope="application"] .employee-frame { background-color:var(--ui-surface); }
    html[data-ui-theme] body[data-ui-scope="application"] .employee-header { background:var(--ui-sidebar-bg); color:var(--ui-sidebar-text); }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.panel,.module-card) { padding:var(--ui-card-padding); }
    html[data-ui-theme] body[data-ui-scope="application"] .portal-card {
        background:var(--ui-portal-card-bg)!important; color:var(--ui-portal-card-text)!important;
        border-color:var(--ui-border)!important; border-radius:var(--ui-card-radius)!important;
    }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.form-grid,.module-filters,.maale-list-filters,.toolbar,.ui-reference-grid) { gap:var(--ui-gap); }
    html[data-ui-theme] body[data-ui-scope="application"] :is(input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]):not([type=range]):not([type=submit]):not([type=reset]):not([type=button]),select,textarea,.maale-filter-trigger):not(.maale-filter-native):not(:where(.contract-format-tools *,.agreement-paper *,.contract-word-host *)) {
        min-height:var(--ui-field-height)!important; height:var(--ui-control-height,var(--ui-field-height))!important; border:1px solid var(--ui-border);
        border-radius:var(--ui-radius)!important; background-color:var(--ui-surface); color:var(--ui-text);
        font-family:var(--ui-font-family); font-size:var(--ui-font-size); box-sizing:border-box;
    }
    html[data-ui-theme] body[data-ui-scope="application"] textarea { --ui-control-height:auto; }
    html[data-ui-theme] body[data-ui-scope="application"] :is(input,select,textarea):disabled { background-color:var(--ui-disabled-bg); color:var(--ui-muted); }
    html[data-ui-theme] body[data-ui-scope="application"] select.maale-filter-native {
        position:absolute!important; width:1px!important; min-width:0!important; height:1px!important; min-height:0!important;
        padding:0!important; opacity:0; clip-path:inset(50%); pointer-events:none;
    }
    html[data-ui-theme] body[data-ui-scope="application"] .maale-filter-trigger { width:100%; box-sizing:border-box; }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.button,.ui-button,.portal-primary,.primary-btn,.page-header-action--add,.request-create-button):not(:where(.agreement-paper *,.contract-word-host *)) {
        background:var(--ui-primary)!important; color:var(--ui-primary-text)!important;
        border-radius:var(--ui-radius)!important; min-height:var(--ui-field-height); font-family:var(--ui-font-family); font-size:var(--ui-font-size);
    }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.button.secondary,.ui-button--secondary,.button--secondary) {
        background:var(--ui-surface)!important; color:var(--ui-text)!important; border-color:var(--ui-border)!important;
    }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.button.danger,.ui-button--danger,.button--danger) {
        background:var(--ui-danger)!important; color:#fff!important;
    }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.icon-button,.page-header-action,.maale-list-row-action) { border-radius:var(--ui-radius); }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.maale-list-table,.attendance-table,.finance-table,.employees-table,.project-table,.ui-list table,table):not(:where(.agreement-paper *,.contract-word-host *)) thead th {
        background:var(--ui-table-heading)!important; color:var(--ui-table-heading-text)!important; border-color:var(--ui-border)!important;
    }
    html[data-ui-theme] body[data-ui-scope="application"] table:not(:where(.agreement-paper *,.contract-word-host *)) :is(td,th) { border-color:var(--ui-border); color:var(--ui-text); font-family:var(--ui-font-family); }
    html[data-ui-theme] body[data-ui-scope="application"] table:not(:where(.agreement-paper *,.contract-word-host *)) tbody tr:nth-child(even) { background-color:var(--ui-table-stripe); }
    html[data-ui-theme] body[data-ui-scope="application"] .maale-filter-options { background:var(--ui-surface); border-color:var(--ui-border); border-radius:var(--ui-card-radius); }
    html[data-ui-theme] body[data-ui-scope="application"] .maale-filter-option { color:var(--ui-muted); border-radius:var(--ui-radius); }
    html[data-ui-theme] body[data-ui-scope="application"] .maale-filter-option[aria-selected="true"] { background:var(--ui-table-heading); color:var(--ui-table-heading-text); border-color:var(--ui-border); }
    html[data-ui-theme] body[data-ui-scope="application"] .maale-filter-option:hover:not(:disabled):not([aria-selected="true"]) { background:var(--ui-table-hover); border-color:var(--ui-border); }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.panel h2,.panel h3,.project-title h2,.project-value,.portal-card h1) { color:var(--ui-heading); }

    /* Icon actions fade between filled and outlined states without moving. */
    html[data-ui-theme] body[data-ui-scope="application"] :is(.ui-button--primary.ui-button--icon-only,.page-header-action--add,.request-create-button,.icon-button.primary) {
        --ui-icon-button-bg:var(--ui-primary);
        --ui-icon-button-text:var(--ui-primary-text);
        --ui-icon-button-border:var(--ui-primary);
        --ui-icon-button-hover-border:var(--ui-primary);
        --ui-icon-button-hover-text:var(--ui-primary);
    }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.ui-button--icon-only:not(.ui-button--danger),.icon-button:not(.danger):not(.soft-danger),.page-header-action,.request-export-button,.maale-list-row-action:not([data-quote-action="delete"])) {
        background:var(--ui-icon-button-bg,var(--ui-icon-secondary-bg))!important;
        color:var(--ui-icon-button-text,var(--ui-icon-secondary-text))!important;
        border:1px solid var(--ui-icon-button-border,var(--ui-icon-secondary-border))!important;
        box-sizing:border-box;
        transform:none!important; box-shadow:none!important;
        transition:background-color var(--ui-icon-fade-duration) ease,color var(--ui-icon-fade-duration) ease,border-color var(--ui-icon-fade-duration) ease!important;
    }
    html[data-ui-theme] body[data-ui-scope="application"] :is(.ui-button--icon-only:not(.ui-button--danger),.icon-button:not(.danger):not(.soft-danger),.page-header-action,.request-export-button,.maale-list-row-action:not([data-quote-action="delete"])):hover:not(:disabled):not([aria-disabled="true"]) {
        background:var(--ui-icon-hover-bg)!important;
        color:var(--ui-icon-button-hover-text,var(--ui-icon-secondary-hover-border))!important;
        border-color:var(--ui-icon-button-hover-border,var(--ui-icon-secondary-hover-border))!important;
    }
}
@media (prefers-reduced-motion:reduce) {
    html[data-ui-theme] body[data-ui-scope="application"] :is(.ui-button--icon-only:not(.ui-button--danger),.icon-button:not(.danger):not(.soft-danger),.page-header-action,.request-export-button,.maale-list-row-action:not([data-quote-action="delete"])) { transition:none!important; }
}

/* Canonical data-list presentation, independent of each module's layout classes.
 * Editable form grids, document paper and tree indentation keep their own layout. */
:root { --ui-list-cell-block:13px; --ui-list-cell-inline:14px; --ui-list-heading-block:6px; --ui-list-heading-inline:10px; }
@media screen {
 html[data-ui-theme] body[data-ui-scope="application"] table.maale-list-table:not(:where(form *,[data-ui-table-exempt] *, .agreement-paper *, .contract-word-host *, .price-offer-a4 *, .quote-offer-a4 *,[role="treegrid"])) {
  border-collapse:collapse; background:var(--ui-surface); color:var(--ui-text);
 }
 html[data-ui-theme] body[data-ui-scope="application"] table.maale-list-table:not(:where(form *,[data-ui-table-exempt] *, .agreement-paper *, .contract-word-host *, .price-offer-a4 *, .quote-offer-a4 *,[role="treegrid"])) > thead > tr > th {
  padding:var(--ui-list-heading-block) var(--ui-list-heading-inline); vertical-align:middle; border-bottom:1px solid var(--ui-border);
 }
 html[data-ui-theme] body[data-ui-scope="application"] table.maale-list-table:not(:where(form *,[data-ui-table-exempt] *, .agreement-paper *, .contract-word-host *, .price-offer-a4 *, .quote-offer-a4 *,[role="treegrid"])) > :is(tbody,tfoot) > tr > :is(td,th) {
  padding:var(--ui-list-cell-block) var(--ui-list-cell-inline); vertical-align:middle; border-bottom:1px solid var(--ui-border);
 }
 html[data-ui-theme] body[data-ui-scope="application"] table.maale-list-table:not(:where(form *,[data-ui-table-exempt] *, .agreement-paper *, .contract-word-host *, .price-offer-a4 *, .quote-offer-a4 *)) > tbody > tr:not(.is-selected):not(.selected):not([aria-selected="true"]):hover { background:var(--ui-table-hover); }
 .table-wrap:has(> .maale-list-table) { max-width:100%; min-width:0; overflow-x:auto; }
}

/* Opt-in compact list density; shared table rules consume these tokens. */
.maale-list-table--compact{--ui-list-cell-block:7px}
/* Dense data lists use native selection boxes, not text-field dimensions. */
html[data-ui-theme] body[data-ui-scope="application"] .maale-list-table--compact input[type="checkbox"]:not([role="switch"]) { width:16px!important; height:16px!important; min-width:16px!important; min-height:16px!important; padding:0; margin:0; vertical-align:middle; }