/* ==========================================================================
   MOTCA ECOSYSTEMS - UNIFIED UI SYSTEM  (v1.0 - 2026-10-21)
   One design for every module. Loaded LAST on every page so it wins.
   Rules: MOTCA identity (docs/ui-identity.md) - navy primary, gold accents only - neutral gray bg - 1px borders,
   whisper shadows - typography carries hierarchy - 4px spacing grid.
   Tokens are prefixed --ui-* ; never hard-code colors in pages again.
   ========================================================================== */
/* Plus Jakarta Sans + JetBrains Mono, self-hosted (assets/fonts/, SIL OFL) — same files Google Fonts served, font-display: swap */
/* JetBrains Mono · cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-cyrillic-ext-a07c36cf.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* JetBrains Mono · cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-cyrillic-add2d251.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* JetBrains Mono · greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-greek-2565db8a.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* JetBrains Mono · vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-vietnamese-856c310c.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* JetBrains Mono · latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-latin-ext-9326b4c9.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* JetBrains Mono · latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-latin-b87346fd.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* JetBrains Mono · cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-cyrillic-ext-a07c36cf.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* JetBrains Mono · cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-cyrillic-add2d251.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* JetBrains Mono · greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-greek-2565db8a.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* JetBrains Mono · vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-vietnamese-856c310c.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* JetBrains Mono · latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-latin-ext-9326b4c9.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* JetBrains Mono · latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-latin-b87346fd.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* JetBrains Mono · cyrillic-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-cyrillic-ext-a07c36cf.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* JetBrains Mono · cyrillic */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-cyrillic-add2d251.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* JetBrains Mono · greek */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-greek-2565db8a.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* JetBrains Mono · vietnamese */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-vietnamese-856c310c.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* JetBrains Mono · latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-latin-ext-9326b4c9.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* JetBrains Mono · latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/jetbrains-mono/jetbrains-mono-latin-b87346fd.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Plus Jakarta Sans · cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-cyrillic-ext-7146e4ff.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* Plus Jakarta Sans · vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-vietnamese-523ed8c5.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* Plus Jakarta Sans · latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-ext-3c951162.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Plus Jakarta Sans · latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-e2e017e1.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Plus Jakarta Sans · cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-cyrillic-ext-7146e4ff.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* Plus Jakarta Sans · vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-vietnamese-523ed8c5.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* Plus Jakarta Sans · latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-ext-3c951162.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Plus Jakarta Sans · latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-e2e017e1.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Plus Jakarta Sans · cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-cyrillic-ext-7146e4ff.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* Plus Jakarta Sans · vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-vietnamese-523ed8c5.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* Plus Jakarta Sans · latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-ext-3c951162.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Plus Jakarta Sans · latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-e2e017e1.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Plus Jakarta Sans · cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-cyrillic-ext-7146e4ff.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* Plus Jakarta Sans · vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-vietnamese-523ed8c5.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* Plus Jakarta Sans · latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-ext-3c951162.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Plus Jakarta Sans · latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-e2e017e1.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Plus Jakarta Sans · cyrillic-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-cyrillic-ext-7146e4ff.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* Plus Jakarta Sans · vietnamese */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-vietnamese-523ed8c5.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* Plus Jakarta Sans · latin-ext */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-ext-3c951162.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* Plus Jakarta Sans · latin */
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("../fonts/plus-jakarta-sans/plus-jakarta-sans-latin-e2e017e1.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* ---------- 1. TOKENS ---------- */
/* MOTCA identity (docs/ui-identity.md §1): neutral gray bg, deep national navy, emblem gold accent. */
:root {
  --ui-font: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --ui-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --ui-bg: #f6f7f9;
  --ui-surface: #ffffff;
  --ui-surface-2: #f1f3f6;
  --ui-text: #111a2e;
  --ui-text-2: #3a4659;
  --ui-muted: #5f6b7d;   /* audit C-01: 5.0:1 on surface-2, 5.6:1 on white at 12 px (was #667085 = 4.3:1 on surface-2) */
  --ui-border: #e4e7ec;
  --ui-border-strong: #d0d5dd;

  --ui-primary: #1b3a8a;
  --ui-primary-hover: #152f72;
  --ui-primary-fill: #1b3a8a;        /* solid button fill: white text must reach 4.5:1 in both themes */
  --ui-primary-fill-hover: #152f72;
  --ui-primary-soft: #eaeffa;
  --ui-accent: #c9a227;
  --ui-accent-soft: #faf4e1;
  --ui-success: #0f6e4f; --ui-success-soft: #e6f3ee;   /* audit C-01: success text on its soft badge 5.5:1 (was #12805c = 4.3:1) */
  --ui-warning: #b45309; --ui-warning-soft: #fdf1e3;
  --ui-danger:  #c0262d; --ui-danger-soft:  #fbe9ea;
  --ui-info:    #0e7490; --ui-info-soft:    #e3f2f6;

  --ui-radius-sm: 10px;   /* controls */
  --ui-radius: 10px;      /* controls / tiles */
  --ui-radius-lg: 12px;   /* cards */
  --ui-radius-xl: 16px;   /* modals */
  --ui-shadow-xs: 0 1px 2px rgba(17, 26, 46, .05);
  --ui-shadow-md: 0 4px 12px rgba(17, 26, 46, .08);
  --ui-shadow-lg: 0 18px 44px -12px rgba(17, 26, 46, .22);
  --ui-ring: 0 0 0 3px rgba(27, 58, 138, .20);
  --ui-ease: cubic-bezier(.2, .7, .2, 1);
}
.dark, html.dark {
  --ui-bg: #0b0f17;
  --ui-surface: #121826;
  --ui-surface-2: #182032;
  --ui-text: #e8ecf3;
  --ui-text-2: #c5ccd8;
  --ui-muted: #98a2b3;
  --ui-border: #232c3d;
  --ui-border-strong: #313c52;
  --ui-primary: #6d8fe6;
  --ui-primary-hover: #86a3ec;
  --ui-primary-fill: #4a6fd0;        /* dark: 4.69:1 with white text (the lighter link/icon primary stays #6d8fe6) */
  --ui-primary-fill-hover: #3f63c7;
  --ui-primary-soft: #1a2440;
  --ui-accent: #d9b648;
  --ui-accent-soft: #2a2414;
  --ui-success: #3fb68b; --ui-warning: #e0a04a; --ui-danger: #ef6b70; --ui-info: #38a9c4;
  --ui-success-soft: #0f2a21; --ui-warning-soft: #2e2212; --ui-danger-soft: #331a1c; --ui-info-soft: #0c2830;
  --ui-shadow-xs: 0 1px 2px rgba(0, 0, 0, .35);
  --ui-shadow-md: 0 6px 16px rgba(0, 0, 0, .4);
  --ui-shadow-lg: 0 20px 48px -12px rgba(0, 0, 0, .6);
  --ui-ring: 0 0 0 3px rgba(109, 143, 230, .35);
}

/* ---------- 2. BRIDGE: every page's private palette -> system tokens ---------- */
:root {
  /* licence dashboard */
  --lic-navy: var(--ui-text); --lic-navy2: #1a3566; --lic-brand: var(--ui-primary); --lic-sky: #6d8fe6;
  --lic-ok: var(--ui-success); --lic-warn: var(--ui-warning); --lic-danger: var(--ui-danger);
  --lic-ink: var(--ui-text); --lic-muted: var(--ui-muted); --lic-line: var(--ui-border); --lic-paper: var(--ui-surface-2);
  /* M.O.T */
  --mot-pass: var(--ui-success); --mot-pass-soft: var(--ui-success-soft);
  --mot-adv: var(--ui-warning); --mot-adv-soft: var(--ui-warning-soft);
  --mot-fail: var(--ui-danger); --mot-fail-soft: var(--ui-danger-soft);
  --mot-ink: var(--ui-text); --mot-ink-soft: var(--ui-muted); --mot-paper: var(--ui-surface); --mot-line: var(--ui-border);
  /* incidents */
  --inc-blue: var(--ui-primary); --inc-green: var(--ui-success); --inc-amber: var(--ui-warning);
  --inc-violet: #152f72; --inc-red: var(--ui-danger); --inc-teal: var(--ui-info); --inc-heading: var(--ui-text);
  /* public vehicles dashboard */
  --pbd-primary: var(--ui-primary); --pbd-success: var(--ui-success); --pbd-info: var(--ui-info);
  --pbd-warning: var(--ui-warning); --pbd-danger: var(--ui-danger); --pbd-track: var(--ui-surface-2);
  --pbd-line: var(--ui-border); --pbd-muted: var(--ui-muted);
  /* custom-style.css generic names */
  --bg: var(--ui-bg); --card: var(--ui-surface); --card-bg: var(--ui-surface); --text: var(--ui-text);
  --muted: var(--ui-muted); --border: var(--ui-border); --primary: var(--ui-primary);
  --primary-dark: var(--ui-primary-hover); --success: var(--ui-success); --danger: var(--ui-danger);
  --warning: var(--ui-warning); --sky: var(--ui-info); --soft: var(--ui-surface-2);
  --body-bg: var(--ui-bg); --color-background-primary: var(--ui-surface);
  --shadow: var(--ui-shadow-md);
}
html.dark, .dark {
  --lic-ink: var(--ui-text); --lic-muted: var(--ui-muted); --lic-line: var(--ui-border); --lic-paper: var(--ui-surface-2);
  --mot-line: var(--ui-border); --mot-paper: var(--ui-surface);
  --bg: var(--ui-bg); --card: var(--ui-surface); --card-bg: var(--ui-surface); --text: var(--ui-text);
  --muted: var(--ui-muted); --border: var(--ui-border); --primary: var(--ui-primary); --soft: var(--ui-surface-2);
  --body-bg: var(--ui-bg); --color-background-primary: var(--ui-surface);
}
.mform { --mf-ring: rgba(27, 58, 138, .16); }
.pvd-page, .dark .pvd-page {
  --pvd-bg: var(--ui-bg); --pvd-card: var(--ui-surface); --pvd-border: var(--ui-border); --pvd-border-soft: var(--ui-border);
  --pvd-text: var(--ui-text); --pvd-muted: var(--ui-muted); --pvd-heading: var(--ui-text);
  --pvd-primary: var(--ui-primary); --pvd-accent: var(--ui-primary); --pvd-green: var(--ui-success); --pvd-green-bg: var(--ui-success-soft);
  --pvd-amber: var(--ui-warning); --pvd-amber-bg: var(--ui-warning-soft); --pvd-red: var(--ui-danger); --pvd-red-bg: var(--ui-danger-soft);
  --pvd-slate-bg: var(--ui-surface-2); --pvd-violet: var(--ui-primary-hover);
  --pvd-radius: var(--ui-radius-lg); --pvd-shadow: var(--ui-shadow-xs);
}
.arc-dash, .dark .arc-dash {
  --arc-card: var(--ui-surface); --arc-border: var(--ui-border); --arc-heading: var(--ui-text);
  --arc-muted: var(--ui-muted); --arc-soft: var(--ui-surface-2); --arc-shadow: var(--ui-shadow-xs);
  --arc-brand: var(--ui-primary); --arc-brand-2: #6d8fe6;
}
.arc-modal, .dark .arc-modal {
  --am-card: var(--ui-surface); --am-border: var(--ui-border); --am-heading: var(--ui-text);
  --am-muted: var(--ui-muted); --am-foot: var(--ui-surface-2);
}
.apt-kpi--violet { --apt-kpi-accent: #152f72; --apt-kpi-soft: rgba(26, 70, 181, .12); }
.apt-kpi--amber  { --apt-kpi-accent: var(--ui-warning); }
.apt-kpi--green  { --apt-kpi-accent: var(--ui-success); }
.apt-kpi--sky    { --apt-kpi-accent: var(--ui-info); }

/* ---------- 3. BASE: one font, one background, one text color ---------- */
html, body { font-family: var(--ui-font) !important; }
body {
  background: var(--ui-bg) !important;
  color: var(--ui-text-2);
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
/* every legacy display font (Urbanist, Spline Sans, Sora, Archivo, Space Grotesk, Inter) -> system font */
.font-urbanist, .font-spline_sans, .lic-font, .lic-hero__title, .lic-tile__value, .lic-cap__t,
.lic-split__num, .lic-ledger__v, .lic-alert__n, .lic-grade, .pvd-page, .card-description,
.form-input, .form-select, .form-label, .badge, .btn, .mov-wrap, #apiPane, h1, h2, h3, h4, h5, h6, button, input, select, textarea {
  font-family: var(--ui-font) !important;
}
/* data that must stay monospaced uses ONE mono font */
.lic-hero__date, .lic-tile__idx, .lic-cap__meta, .lic-no, .pvd-mono, .pbd-plate, code, kbd, pre, .ui-mono {
  font-family: var(--ui-mono) !important;
}
h1, h2, h3, h4, h5, h6, .text-heading { color: var(--ui-text); letter-spacing: -.01em; }
.tabular, td, .card-title + *, [class*="__value"], [class*="__num"] { font-variant-numeric: tabular-nums; }
::selection { background: rgba(27, 58, 138, .18); }
a { transition: color .15s var(--ui-ease); }

/* keyboard focus is always visible (accessibility) */
:focus-visible { outline: none; box-shadow: var(--ui-ring) !important; border-radius: var(--ui-radius-sm); }

/* calm scrollbars */
* { scrollbar-width: thin; scrollbar-color: var(--ui-border-strong) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: var(--ui-border-strong); border-radius: 999px; border: 3px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-track { background: transparent; }

/* ---------- 4. APP SHELL ---------- */
/* sidebar */
.app-menu {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border);
  box-shadow: var(--ui-shadow-xs);
  border-radius: var(--ui-radius-lg) !important;
}
.app-menu > div:first-child { border-bottom: 1px solid var(--ui-border); }
.app-menu .top-layer {
  height: 40px !important;
  border-radius: 8px !important;
  margin-right: 12px;
  color: var(--ui-muted) !important;
  font-weight: 500;
  font-size: 14px;
  position: relative;
  transition: background .15s var(--ui-ease), color .15s var(--ui-ease);
}
.app-menu .top-layer i { color: inherit !important; font-size: 18px; }
.app-menu .top-layer:hover {
  background: var(--ui-surface-2) !important;
  color: var(--ui-text) !important;
}
.app-menu .top-layer.active,
.app-menu .top-layer.active:hover {
  background: var(--ui-primary-soft) !important;
  color: var(--ui-primary) !important;
  font-weight: 600;
}
.app-menu .top-layer.active::before {
  content: ""; position: absolute; left: -8px; top: 8px; bottom: 8px; width: 3px;
  border-radius: 0 3px 3px 0; background: var(--ui-primary);
}
[data-sidebar-size="sm"] .app-menu .top-layer { margin-right: 0; }
[data-sidebar-size="sm"] .app-menu .top-layer.active::before { display: none; }
/* sidebar footer promo box: quiet card instead of loud green block */
.app-menu .bg-success.rounded-\[10px\] {
  background: var(--ui-primary-soft) !important;
  color: var(--ui-primary) !important;
}
.app-menu .bg-success.rounded-\[10px\] * { color: var(--ui-primary) !important; }
/* sub-menu links */
.app-menu ul ul a, .app-menu .dropdown-menu a {
  color: var(--ui-muted); font-size: 13.5px; border-radius: 6px;
}
.app-menu ul ul a:hover, .app-menu ul ul a.active { color: var(--ui-primary) !important; }

/* top header */
.header {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border);
  box-shadow: var(--ui-shadow-xs) !important;
  border-radius: var(--ui-radius-lg);
}
.header p.text-lg { font-size: 16px; font-weight: 600; color: var(--ui-text); letter-spacing: -.01em; }
.header .bg-info {
  background: var(--ui-surface) !important;
  color: var(--ui-text) !important;
  border: 1px solid var(--ui-border);
  box-shadow: var(--ui-shadow-xs);
}
.header .bg-info:hover { background: var(--ui-surface-2) !important; opacity: 1 !important; }
.header .bg-info i, .header .bg-info span { color: var(--ui-text) !important; }
.header .hdr-avatar { background: var(--ui-primary-soft) !important; color: var(--ui-primary) !important; }
.header .hdr-avatar i { color: var(--ui-primary) !important; }
.header .themeMode, .header [data-popover-target] { color: var(--ui-muted); border-radius: 8px; }
.header .themeMode:hover, .header [data-popover-target]:hover { background: var(--ui-surface-2) !important; }
.header .bg-primary-500 { background: var(--ui-danger) !important; }

/* page loader: calm overlay */
/* Purple bar-loader removed — pages load straight into content. */
#loader { display: none !important; }

/* ---------- 5. SURFACES ---------- */
.card, .bg-white.rounded-15, .bg-white.rounded-10, .bg-white.rounded-20 {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border);
  box-shadow: var(--ui-shadow-xs);
  border-radius: var(--ui-radius-lg) !important;
}
.dark .card, .dark .dark\:bg-dark-card { background: var(--ui-surface) !important; }
.card-title { font-size: 16px !important; font-weight: 600 !important; line-height: 1.3 !important; color: var(--ui-text) !important; }
.card-description { font-size: 13px !important; color: var(--ui-muted) !important; }
.bg-body-light, .dark\:bg-dark-body { background: var(--ui-bg) !important; }
.dark .dark\:bg-dark-card-shade, .dark .dark\:bg-dark-card-two { background: var(--ui-surface-2) !important; }
.dark .dk-border-one, .dark [class*="dark:border-dark-border"] { border-color: var(--ui-border) !important; }

/* tiles inside cards: filled, no border nesting */
.card .card { background: var(--ui-surface-2) !important; border-color: transparent; box-shadow: none; }

/* dropdowns, popovers, modals */
[id^="dropdown"], .dropdown-menu, [data-popover], [role="tooltip"]:not(.tooltip-hidden) {
  border: 1px solid var(--ui-border) !important;
  box-shadow: var(--ui-shadow-md) !important;
  border-radius: var(--ui-radius) !important;
}
[id*="modal"] > div > div.bg-white, [id*="Modal"] > div > div.bg-white, .modal-content, .arc-modal {
  border-radius: var(--ui-radius-lg) !important;
  box-shadow: var(--ui-shadow-lg) !important;
  border: 1px solid var(--ui-border);
}
[modal-backdrop], .modal-backdrop, [drawer-backdrop] { background: rgba(15, 31, 56, .45) !important; backdrop-filter: blur(2px); }

/* ---------- 6. FORMS ---------- */
.form-label {
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--ui-text) !important;
  line-height: 1.2 !important;
  margin-bottom: 7px !important;
}
.form-input, .arc-input, .mfield__input, input.form-control, select.form-control, textarea.form-control {
  background-color: var(--ui-surface) !important;
  border: 1px solid var(--ui-border-strong) !important;
  border-radius: 8px !important;
  color: var(--ui-text) !important;
  font-size: 14px !important;
  min-height: 44px;
  transition: border-color .15s var(--ui-ease), box-shadow .15s var(--ui-ease);
}
/* custom chevron on native selects (choices/select2 manage their own) */
select.form-input, select.form-select, select.form-control {
  -webkit-appearance: none; appearance: none; padding-right: 36px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235b6b80' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
textarea.form-input { min-height: 96px; line-height: 1.5; }
.form-input:hover, .arc-input:hover { border-color: #94a3b8 !important; }
.form-input:focus, .arc-input:focus, .mfield__input:focus,
.form-input:focus-within {
  border-color: var(--ui-primary) !important;
  box-shadow: var(--ui-ring) !important;
  outline: none !important;
}
.form-input::placeholder, .arc-input::placeholder { color: #94a3b8 !important; font-weight: 400; }
.form-input[readonly], .form-input:disabled { background-color: var(--ui-surface-2) !important; color: var(--ui-muted) !important; }
input[disabled]:not([type=checkbox]):not([type=radio]) { border-color: var(--ui-border) !important; color: var(--ui-muted) !important; background-color: var(--ui-surface-2) !important; }
.form-select { font-weight: 500 !important; color: var(--ui-text) !important; }
.form-input.form-select { font-weight: 400 !important; }
input[type=checkbox], input[type=radio] { accent-color: var(--ui-primary); }
.file-input-label { border-color: var(--ui-border-strong) !important; border-radius: 8px !important; }
.is-invalid, .form-input.error, .form-input:user-invalid { border-color: var(--ui-danger) !important; }
.is-invalid:focus, .form-input.error:focus { box-shadow: 0 0 0 3px rgba(220, 38, 38, .18) !important; }
/* choices.js / select2 dropdowns follow the input look */
.choices__inner, .select2-container .select2-selection {
  background: var(--ui-surface) !important; border: 1px solid var(--ui-border-strong) !important;
  border-radius: 8px !important; min-height: 40px !important; font-size: 14px !important;
}
.choices.is-focused .choices__inner, .select2-container--focus .select2-selection { border-color: var(--ui-primary) !important; box-shadow: var(--ui-ring); }
.choices__list--dropdown, .select2-dropdown { border: 1px solid var(--ui-border) !important; border-radius: var(--ui-radius) !important; box-shadow: var(--ui-shadow-md) !important; }
.choices__list--dropdown .choices__item--selectable.is-highlighted, .select2-results__option--highlighted { background: var(--ui-primary-soft) !important; color: var(--ui-primary) !important; }

/* ---------- 7. BUTTONS ---------- */
.btn {
  border-radius: 8px !important;
  font-weight: 500 !important;
  font-size: 14px;
  min-height: 40px;
  padding: 0 16px !important;
  gap: 8px;
  letter-spacing: 0;
  transition: background .15s var(--ui-ease), border-color .15s var(--ui-ease), box-shadow .15s var(--ui-ease), transform .05s;
}
.btn:active { transform: translateY(1px); }
.btn.btn-sm { min-height: 32px; padding: 0 12px !important; font-size: 13px !important; border-radius: 6px !important; }
.btn.btn-lg { min-height: 44px; padding: 0 20px !important; font-size: 15px !important; }
.btn.b-solid { box-shadow: var(--ui-shadow-xs); }
.btn.b-solid:hover { opacity: 1 !important; filter: brightness(.94); }
.btn-primary-solid, .btn-info-solid { background: var(--ui-primary-fill, var(--ui-primary)) !important; }
.btn-primary-solid:hover, .btn-info-solid:hover { background: var(--ui-primary-fill-hover, var(--ui-primary-hover)) !important; filter: none; }
.btn.b-outline { background: var(--ui-surface); border-color: var(--ui-border-strong) !important; color: var(--ui-text) !important; }
.btn.b-outline:hover { background: var(--ui-surface-2) !important; color: var(--ui-text) !important; border-color: var(--ui-border-strong) !important; }
.btn.b-light { box-shadow: none; }
.btn-icon { border-radius: 8px !important; }
button:disabled, .btn:disabled, .btn.disabled { opacity: .55 !important; cursor: not-allowed !important; }
/* raw tailwind buttons used across workload pages: same shape */
button.bg-info, a.bg-info, button.bg-primary-500, a.bg-primary-500 {
  border-radius: 8px; font-weight: 500;
}

/* ---------- 8. BADGES / STATUS ---------- */
.badge {
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 4px 10px !important;
  line-height: 1.2 !important;
  gap: 6px;
}
.badge-success-light { background: var(--ui-success-soft) !important; color: var(--ui-success) !important; }
.badge-danger-light  { background: var(--ui-danger-soft) !important;  color: var(--ui-danger) !important; }
.badge-warning-light { background: var(--ui-warning-soft) !important; color: var(--ui-warning) !important; }
.badge-info-light, .badge-primary-light { background: var(--ui-primary-soft) !important; color: var(--ui-primary) !important; }
.badge-disable-light { background: var(--ui-surface-2) !important; color: var(--ui-muted) !important; }

/* ---------- 9. TABLES (one look for every list) ---------- */
.main-content table:not(.mot-table):not([class*="no-ui"]) {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100%;
  font-size: 14px;
  color: var(--ui-text-2);
}
.main-content table:not(.mot-table):not([class*="no-ui"]) thead th {
  background: var(--ui-surface-2) !important;
  color: var(--ui-text-2) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  padding: 14px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
  white-space: nowrap;
  text-align: left;
  position: sticky; top: 0; z-index: 1;
}
.main-content table:not(.mot-table):not([class*="no-ui"]) thead th:first-child { border-top-left-radius: var(--ui-radius); }
.main-content table:not(.mot-table):not([class*="no-ui"]) thead th:last-child  { border-top-right-radius: var(--ui-radius); }
.main-content table:not(.mot-table):not([class*="no-ui"]) tbody td {
  padding: 15px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
  vertical-align: middle;
  line-height: 1.45 !important;
  color: var(--ui-text-2);
}
/* legacy blue header cells (th.bg-info / bg-[#E6F6FD]) → unified tinted header */
.main-content table:not(.mot-table):not([class*="no-ui"]) thead th.bg-info { color: var(--ui-text-2) !important; }
.main-content table:not(.mot-table):not([class*="no-ui"]) tbody tr { transition: background .12s var(--ui-ease); }
.main-content table:not(.mot-table):not([class*="no-ui"]) tbody tr:hover td { background: var(--ui-surface-2); }
.main-content table:not(.mot-table):not([class*="no-ui"]) tbody tr:last-child td { border-bottom: 0 !important; }
.main-content table tbody td img.rounded-50, .main-content table tbody td img.rounded-full { border: 1px solid var(--ui-border); }
/* table wrappers get a framed card edge */
.main-content .overflow-x-auto:has(> table) {
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius);
  background: var(--ui-surface);
}
/* DataTables */
.dataTables_wrapper .dataTables_filter input, .dataTables_wrapper .dataTables_length select, .dt-input {
  border: 1px solid var(--ui-border-strong) !important; border-radius: 8px !important; min-height: 36px; padding: 0 10px; background: var(--ui-surface);
}
.dataTables_wrapper .dataTables_paginate .paginate_button.current, .dt-paging-button.current {
  background: var(--ui-primary) !important; color: #fff !important; border-color: var(--ui-primary) !important; border-radius: 8px !important;
}

/* ---------- 10. PAGINATION (one style) ---------- */
.showing-result { color: var(--ui-muted) !important; font-size: 13px !important; }
.paginate, .count-paginate, .pagination a, .pagination span {
  min-width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--ui-border) !important; border-radius: 8px !important;
  background: var(--ui-surface); color: var(--ui-text-2) !important; font-size: 13px; font-weight: 500;
  transition: background .12s var(--ui-ease), border-color .12s var(--ui-ease);
}
.paginate:hover, .count-paginate:hover, .pagination a:hover { background: var(--ui-surface-2) !important; color: var(--ui-text) !important; }
.paginate.active, .count-paginate.active, .pagination .active > * {
  background: var(--ui-primary) !important; border-color: var(--ui-primary) !important; color: #fff !important;
}

/* ---------- 11. TABS & BREADCRUMBS ---------- */
[role="tablist"] { border-bottom: 1px solid var(--ui-border); gap: 4px; }
[role="tablist"] [role="tab"] {
  font-weight: 500; color: var(--ui-muted); border-radius: 8px 8px 0 0; border-bottom: 2px solid transparent !important;
}
[role="tablist"] [role="tab"][aria-selected="true"] { color: var(--ui-primary) !important; border-bottom-color: var(--ui-primary) !important; }

/* ---------- 12. ALERTS / TOASTS (SweetAlert, toastr, template alerts) ---------- */
.swal2-popup { font-family: var(--ui-font) !important; border-radius: var(--ui-radius-lg) !important; padding: 24px !important; }
.swal2-title { font-size: 18px !important; color: var(--ui-text) !important; font-weight: 600 !important; }
.swal2-html-container { font-size: 14px !important; color: var(--ui-muted) !important; }
.swal2-styled { border-radius: 8px !important; font-weight: 500 !important; font-size: 14px !important; padding: 10px 18px !important; box-shadow: none !important; }
.swal2-styled.swal2-confirm { background: var(--ui-primary) !important; }
.swal2-styled.swal2-cancel { background: var(--ui-surface) !important; color: var(--ui-text) !important; border: 1px solid var(--ui-border-strong) !important; }
.swal2-styled.swal2-deny { background: var(--ui-danger) !important; }
.swal2-toast { box-shadow: var(--ui-shadow-md) !important; border: 1px solid var(--ui-border) !important; }
#toast-container > div, .toast { border-radius: var(--ui-radius) !important; box-shadow: var(--ui-shadow-md) !important; font-family: var(--ui-font) !important; opacity: 1 !important; }

/* ---------- 13. SKELETON & EMPTY STATE helpers (use in any page) ---------- */
.ui-empty { text-align: center; padding: 48px 16px; color: var(--ui-muted); }
.ui-empty i { font-size: 32px; color: var(--ui-border-strong); display: block; margin-bottom: 8px; }
.ui-empty strong { display: block; color: var(--ui-text); font-size: 15px; font-weight: 600; margin-bottom: 4px; }
/* tables rendered empty by JS show a friendly state */
.main-content tbody.list-data:empty::after {
  content: "No records to show"; display: block; padding: 40px 16px; text-align: center; color: var(--ui-muted); font-size: 14px;
}

/* ---------- 14. KPI / STAT CARDS used across dashboards ---------- */
[class*="kpi"]:not([class*="__"]), [class*="-stat-card"] { border-radius: var(--ui-radius-lg) !important; }
[class*="__value"], [class*="kpi__val"], [class*="-kpi-value"] { color: var(--ui-text) !important; font-weight: 700 !important; letter-spacing: -.02em; }

/* ---------- 15. RESPONSIVE + MOTION ---------- */
@media (max-width: 1279px) {
  .header { border-radius: 0; border-left: 0; border-right: 0; border-top: 0; }
}
@media (max-width: 640px) {
  .card { padding: 16px !important; }
  .main-content table:not(.mot-table) thead th, .main-content table:not(.mot-table) tbody td { padding: 10px 12px !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}


/* ---------- 17. AUTH (sign-in) ---------- */
.auth-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(360px, 42%) 1fr; background: var(--ui-bg); }
.auth-brand {
  position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between;
  padding: 32px 40px; color: #eaeffa;
  background: radial-gradient(1200px 500px at -10% -10%, rgba(109, 143, 230,.35), transparent 60%),
              radial-gradient(800px 400px at 110% 110%, rgba(27, 58, 138,.45), transparent 60%),
              linear-gradient(160deg, #111a2e 0%, #142c57 100%);
}
.auth-brand::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.07) 1px, transparent 1px); background-size: 22px 22px; }
.auth-brand > * { position: relative; z-index: 1; }
.auth-brand__top { display: flex; align-items: center; gap: 12px; }
.auth-brand__top strong { display: block; font-size: 15px; color: #fff; font-weight: 700; }
.auth-brand__top small { display: block; font-size: 12px; color: #a9bde6; }
.auth-mark { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--ui-primary); color: #fff; font-size: 20px; box-shadow: 0 6px 18px rgba(27, 58, 138,.45); }
.auth-brand__mid { max-width: 440px; }
.auth-emblem { width: 120px; height: auto; margin-bottom: 28px; filter: drop-shadow(0 10px 24px rgba(0,0,0,.35)); }
.auth-brand__mid h1 { color: #fff !important; font-size: 28px; line-height: 1.25; font-weight: 700; letter-spacing: -.02em; margin: 0 0 12px; }
.auth-brand__mid p { color: #b8c8ea; font-size: 15px; line-height: 1.6; margin: 0 0 24px; }
.auth-points { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.auth-points li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: #dce4f5; }
.auth-points i { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); }
.auth-brand__foot { color: #8fa5d3; font-size: 12px; }
.auth-form-wrap { display: grid; place-items: center; padding: 32px 20px; }
.auth-card { width: 100%; max-width: 400px; }
.auth-card__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 28px; }
.auth-card__head h2 { font-size: 26px; font-weight: 700; margin: 0 0 6px; color: var(--ui-text); }
.auth-card__head p { margin: 0; font-size: 14px; color: var(--ui-muted); line-height: 1.5; }
.auth-icon-btn { width: 36px; height: 36px; border-radius: 8px; display: grid; place-items: center; border: 1px solid var(--ui-border); background: var(--ui-surface); color: var(--ui-muted); flex-shrink: 0; }
.auth-icon-btn:hover { background: var(--ui-surface-2); color: var(--ui-text); }
.auth-form { display: grid; gap: 18px; }
.auth-field { position: relative; }
.auth-field > i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--ui-muted); font-size: 17px; pointer-events: none; z-index: 1; }
.auth-field .form-input { height: 46px !important; padding-left: 42px !important; padding-right: 44px !important; width: 100%; }
.auth-eye { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 6px; display: grid; place-items: center; cursor: pointer; color: var(--ui-muted); }
.auth-eye:hover { background: var(--ui-surface-2); color: var(--ui-text); }
.auth-submit { height: 46px; margin-top: 6px; font-size: 15px !important; font-weight: 600 !important; justify-content: center; }
.auth-note { margin-top: 20px; font-size: 12.5px; color: var(--ui-muted); display: flex; gap: 6px; align-items: center; }
@media (max-width: 960px) {
  .auth-shell { grid-template-columns: 1fr; grid-template-rows: auto 1fr; }
  .auth-brand { padding: 16px 20px; }
  .auth-brand__mid, .auth-brand__foot { display: none; }
}

/* ---------- 16. PRINT: system chrome never prints ---------- */
@media print {
  .app-menu, .header, #loader, .menu-hamburger-container { display: none !important; }
  body { background: #fff !important; color: #000 !important; }
  .card { box-shadow: none !important; border-color: #ccc !important; }
}

/* ==========================================================================
   COMPONENT LIBRARY (ui-*) — Phase 1
   Clean, token-based components. New markup should use these classes; the
   legacy bridge above keeps un-migrated pages looking right in the meantime.
   No !important here — ui-* classes own their own namespace.
   ========================================================================== */

/* ---------- Buttons ---------- */
.ui-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--ui-font);font-size:14px;font-weight:600;line-height:1;
  height:40px;padding:0 16px;border-radius:var(--ui-radius-sm);border:1px solid transparent;
  background:var(--ui-surface-2);color:var(--ui-text);cursor:pointer;white-space:nowrap;
  transition:background .15s var(--ui-ease),border-color .15s var(--ui-ease),box-shadow .15s var(--ui-ease),transform .05s var(--ui-ease);}
.ui-btn:focus-visible{outline:none;box-shadow:var(--ui-ring);}
.ui-btn:active{transform:translateY(1px);}
.ui-btn i{font-size:16px;}
.ui-btn--primary{background:var(--ui-primary-fill,var(--ui-primary));color:#fff;}
.ui-btn--primary:hover{background:var(--ui-primary-hover);}
.ui-btn--secondary{background:var(--ui-surface);color:var(--ui-text);border-color:var(--ui-border-strong);}
.ui-btn--secondary:hover{background:var(--ui-surface-2);}
.ui-btn--ghost{background:transparent;color:var(--ui-text-2);}
.ui-btn--ghost:hover{background:var(--ui-surface-2);}
.ui-btn--danger{background:var(--ui-danger);color:#fff;}
.ui-btn--danger:hover{filter:brightness(.94);}
.ui-btn--sm{height:32px;padding:0 12px;font-size:13px;border-radius:var(--ui-radius-sm);}
.ui-btn--icon{width:40px;height:40px;padding:0;}
.ui-btn--icon.ui-btn--sm{width:32px;height:32px;}
.ui-btn[disabled],.ui-btn.is-loading{opacity:.6;pointer-events:none;}
.ui-btn.is-loading{position:relative;color:transparent;}
.ui-btn.is-loading::after{content:"";position:absolute;width:16px;height:16px;border-radius:50%;
  border:2px solid rgba(255,255,255,.5);border-top-color:#fff;animation:ui-spin .6s linear infinite;}
.ui-btn--secondary.is-loading::after,.ui-btn--ghost.is-loading::after{border-color:var(--ui-border-strong);border-top-color:var(--ui-primary);}
@keyframes ui-spin{to{transform:rotate(360deg);}}

/* ---------- Form controls ---------- */
.ui-field{display:block;margin-bottom:16px;}
.ui-field__label{display:block;font-size:13px;font-weight:500;color:var(--ui-text-2);margin-bottom:6px;}
.ui-field__label .req{color:var(--ui-danger);}
.ui-field__help{font-size:12px;color:var(--ui-muted);margin-top:6px;}
.ui-field__error{font-size:12px;color:var(--ui-danger);margin-top:6px;}
.ui-input,.ui-select,.ui-textarea{width:100%;font-family:var(--ui-font);font-size:14px;color:var(--ui-text);
  height:40px;padding:0 12px;background:var(--ui-surface);border:1px solid var(--ui-border-strong);
  border-radius:var(--ui-radius-sm);transition:border-color .15s var(--ui-ease),box-shadow .15s var(--ui-ease);}
.ui-textarea{height:auto;min-height:96px;padding:10px 12px;line-height:1.5;resize:vertical;}
.ui-select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235b6b80' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;}
.ui-input::placeholder,.ui-textarea::placeholder{color:var(--ui-muted);}
.ui-input:focus,.ui-select:focus,.ui-textarea:focus{outline:none;border-color:var(--ui-primary);box-shadow:var(--ui-ring);}
.ui-field.has-error .ui-input,.ui-field.has-error .ui-select,.ui-field.has-error .ui-textarea{border-color:var(--ui-danger);}
.ui-input[disabled],.ui-select[disabled],.ui-textarea[disabled]{background:var(--ui-surface-2);color:var(--ui-muted);cursor:not-allowed;}
.ui-input-group{position:relative;display:flex;align-items:center;}
.ui-input-group .ui-input{padding-left:38px;}
.ui-input-group__icon{position:absolute;left:12px;color:var(--ui-muted);font-size:16px;pointer-events:none;}

/* ---------- Card ---------- */
.ui-card{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);
  box-shadow:var(--ui-shadow-xs);}
.ui-card__head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:16px 20px;border-bottom:1px solid var(--ui-border);}
.ui-card__title{font-size:15px;font-weight:600;color:var(--ui-text);line-height:1.3;}
.ui-card__desc{font-size:12px;color:var(--ui-muted);margin-top:2px;}
.ui-card__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ui-card__body{padding:20px;}
.ui-card__foot{padding:14px 20px;border-top:1px solid var(--ui-border);display:flex;justify-content:flex-end;gap:10px;}

/* ---------- KPI ---------- */
.ui-kpi{display:flex;align-items:center;gap:14px;background:var(--ui-surface);border:1px solid var(--ui-border);
  border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-xs);padding:18px 20px;}
.ui-kpi__icon{flex:none;width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  font-size:18px;background:var(--ui-primary-soft);color:var(--ui-primary);}
.ui-kpi__icon--success{background:var(--ui-success-soft);color:var(--ui-success);}
.ui-kpi__icon--warning{background:var(--ui-warning-soft);color:var(--ui-warning);}
.ui-kpi__icon--danger{background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-kpi__icon--info{background:var(--ui-info-soft);color:var(--ui-info);}
.ui-kpi__body{min-width:0;}
.ui-kpi__label{font-size:12px;color:var(--ui-muted);font-weight:500;}
.ui-kpi__value{font-size:26px;font-weight:700;color:var(--ui-text);line-height:1.1;font-variant-numeric:tabular-nums;margin-top:2px;}
.ui-kpi__trend{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:600;margin-top:4px;}
.ui-kpi__trend.up{color:var(--ui-success);}
.ui-kpi__trend.down{color:var(--ui-danger);}

/* ---------- Table ---------- */
.ui-table-wrap{overflow-x:auto;}
.ui-table{width:100%;border-collapse:collapse;font-size:14px;}
.ui-table thead th{position:sticky;top:0;background:var(--ui-surface-2);color:var(--ui-muted);
  font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.4px;text-align:left;
  padding:0 16px;height:40px;white-space:nowrap;border-bottom:1px solid var(--ui-border);}
.ui-table tbody td{padding:0 16px;height:48px;color:var(--ui-text-2);border-bottom:1px solid var(--ui-border);vertical-align:middle;}
.ui-table tbody tr:hover{background:var(--ui-surface-2);}
.ui-table .num{text-align:right;font-variant-numeric:tabular-nums;}
.ui-table__primary{display:block;font-weight:600;color:var(--ui-text);line-height:1.3;}
.ui-table__sub{display:block;font-size:12px;color:var(--ui-muted);line-height:1.3;margin-top:2px;}

/* ---------- Badge ---------- */
.ui-badge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;line-height:1;
  padding:4px 10px;border-radius:999px;background:var(--ui-surface-2);color:var(--ui-text-2);}
.ui-badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor;}
.ui-badge--success{background:var(--ui-success-soft);color:var(--ui-success);}
/* audit C-01: legacy Tailwind grey helper text inside tables (text-gray-400 = 2.5:1) reads as muted text */
table .text-gray-400,.ui-table .text-gray-400,.ui-table-wrap .text-gray-400{color:var(--ui-muted) !important;}
.ui-badge--warning{background:var(--ui-warning-soft);color:var(--ui-warning);}
.ui-badge--danger{background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-badge--info{background:var(--ui-info-soft);color:var(--ui-info);}
.ui-badge--primary{background:var(--ui-primary-soft);color:var(--ui-primary);}

/* ---------- Toolbar ---------- */
.ui-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.ui-toolbar__spacer{margin-left:auto;}
.ui-toolbar .ui-input,.ui-toolbar .ui-select{width:auto;min-width:160px;}

/* ---------- Pagination ---------- */
.ui-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding-top:14px;}
.ui-pagination__info{font-size:13px;color:var(--ui-muted);}
.ui-pagination__pages{display:flex;align-items:center;gap:4px;}
.ui-pagination__pages a,.ui-pagination__pages button{min-width:34px;height:34px;display:inline-flex;align-items:center;
  justify-content:center;padding:0 8px;border-radius:var(--ui-radius-sm);border:1px solid var(--ui-border);
  background:var(--ui-surface);color:var(--ui-text-2);font-size:13px;font-weight:600;cursor:pointer;}
.ui-pagination__pages a:hover{background:var(--ui-surface-2);}
.ui-pagination__pages a.active,.ui-pagination__pages .active{background:var(--ui-primary);color:#fff;border-color:var(--ui-primary);}

/* ---------- Tabs / breadcrumb ---------- */
.ui-tabs{display:flex;gap:4px;border-bottom:1px solid var(--ui-border);}
.ui-tabs__tab{padding:10px 14px;font-size:14px;font-weight:600;color:var(--ui-muted);border-bottom:2px solid transparent;cursor:pointer;}
.ui-tabs__tab:hover{color:var(--ui-text);}
.ui-tabs__tab.active{color:var(--ui-primary);border-bottom-color:var(--ui-primary);}
.ui-breadcrumb{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ui-muted);}
.ui-breadcrumb a{color:var(--ui-muted);}
.ui-breadcrumb a:hover{color:var(--ui-text);}
.ui-breadcrumb .sep{opacity:.5;}

/* ---------- Dropdown ---------- */
.ui-dropdown{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius);
  box-shadow:var(--ui-shadow-md);padding:6px;min-width:180px;}
.ui-dropdown__item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--ui-radius-sm);
  font-size:14px;color:var(--ui-text-2);cursor:pointer;}
.ui-dropdown__item:hover{background:var(--ui-surface-2);color:var(--ui-text);}
.ui-dropdown__item.danger{color:var(--ui-danger);}
.ui-dropdown__sep{height:1px;background:var(--ui-border);margin:6px 0;}

/* ---------- Modal / drawer ---------- */
.ui-overlay{position:fixed;inset:0;z-index:9999;background:rgba(15,31,56,.45);
  display:flex;align-items:flex-start;justify-content:center;padding:24px 16px;overflow-y:auto;}
.ui-modal{background:var(--ui-surface);border-radius:16px;box-shadow:var(--ui-shadow-lg);width:100%;max-width:560px;margin:auto;
  display:flex;flex-direction:column;max-height:calc(100vh - 48px);}
.ui-modal__head,.ui-drawer__head{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;border-bottom:1px solid var(--ui-border);}
.ui-modal__title,.ui-drawer__title{font-size:15px;font-weight:600;color:var(--ui-text);}
.ui-modal__body,.ui-drawer__body{padding:20px;overflow-y:auto;}
.ui-modal__foot,.ui-drawer__foot{padding:14px 20px;border-top:1px solid var(--ui-border);display:flex;justify-content:flex-end;gap:10px;}
.ui-x{width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--ui-muted);font-size:20px;cursor:pointer;}
.ui-x:hover{background:var(--ui-surface-2);color:var(--ui-danger);}
.ui-drawer{position:fixed;top:0;right:0;bottom:0;z-index:9999;width:min(480px,100%);background:var(--ui-surface);
  box-shadow:var(--ui-shadow-lg);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .2s var(--ui-ease);}
.ui-drawer.open{transform:translateX(0);}

/* ---------- Empty / skeleton / avatar / alert ---------- */
.ui-empty{text-align:center;padding:48px 24px;color:var(--ui-muted);}
.ui-empty__icon{font-size:40px;color:var(--ui-border-strong);margin-bottom:10px;}
.ui-empty__title{font-size:15px;font-weight:600;color:var(--ui-text);margin-bottom:4px;}
.ui-empty__hint{font-size:13px;margin-bottom:16px;}
@keyframes ui-shimmer{100%{transform:translateX(100%);}}
.ui-avatar{width:36px;height:36px;border-radius:999px;overflow:hidden;flex:none;display:inline-flex;align-items:center;
  justify-content:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-weight:700;font-size:14px;}
.ui-avatar img{width:100%;height:100%;object-fit:cover;}
.ui-alert{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border-radius:var(--ui-radius);
  font-size:14px;border:1px solid var(--ui-border);background:var(--ui-surface-2);color:var(--ui-text-2);}
.ui-alert i{font-size:18px;margin-top:1px;}
.ui-alert--success{background:var(--ui-success-soft);color:var(--ui-success);border-color:transparent;}
.ui-alert--warning{background:var(--ui-warning-soft);color:var(--ui-warning);border-color:transparent;}
.ui-alert--danger{background:var(--ui-danger-soft);color:var(--ui-danger);border-color:transparent;}
.ui-alert--info{background:var(--ui-info-soft);color:var(--ui-info);border-color:transparent;}

/* ---------- Page header + content shell helpers ---------- */
.ui-page{max-width:1600px;margin:0 auto;padding:24px;}
@media (max-width:1024px){.ui-page{padding:16px;}}
.ui-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px;}
.ui-page-header__title{font-size:22px;font-weight:600;color:var(--ui-text);line-height:1.2;}
.ui-page-header__desc{font-size:13px;color:var(--ui-muted);margin-top:4px;}
.ui-page-header__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.ui-grid-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
@media (max-width:1024px){.ui-grid-kpi{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.ui-grid-kpi{grid-template-columns:1fr;}}

/* ---------- KPI strip (one card, equal cells split by vertical borders) ---------- */
/* Reference 02/03/05/07: frameless strip, vertical dividers, 56px OUTLINED icon tiles. */
.ui-kpi-strip{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;background:transparent;}
.ui-kpi-cell{display:flex;align-items:center;gap:14px;padding:6px 24px;border-left:1px solid var(--ui-border);min-width:0;}
.ui-kpi-cell:first-child{border-left:0;padding-left:0;}
.ui-kpi-cell__icon{flex:none;width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:24px;background:transparent;border:1px solid var(--ui-border-strong);color:var(--ui-primary);}
.ui-kpi-cell__icon--success{color:var(--ui-success);}
.ui-kpi-cell__icon--warning{color:var(--ui-warning);}
.ui-kpi-cell__icon--danger{color:var(--ui-danger);}
.ui-kpi-cell__icon--info{color:var(--ui-info);}
.ui-kpi-cell__label{font-size:15px;color:var(--ui-muted);font-weight:400;line-height:1.2;}
.ui-kpi-cell__value{font-size:22px;font-weight:700;color:var(--ui-text);line-height:1.2;font-variant-numeric:tabular-nums;margin-top:3px;}
.ui-kpi-cell__sub{display:block;font-size:12px;color:var(--ui-muted);margin-top:3px;}
a.ui-kpi-cell{text-decoration:none;}
.ui-kpi-cell__trend{display:inline-flex;align-items:center;gap:3px;font-size:12px;font-weight:600;margin-top:3px;}
.ui-kpi-cell__trend.up{color:var(--ui-success);} .ui-kpi-cell__trend.down{color:var(--ui-danger);}
@media (max-width:1100px){.ui-kpi-strip{grid-auto-flow:row;grid-auto-columns:unset;grid-template-columns:repeat(2,1fr);}
  .ui-kpi-cell{border-left:0;border-top:1px solid var(--ui-border);} .ui-kpi-cell:first-child,.ui-kpi-cell:nth-child(2){border-top:0;}
  .ui-kpi-cell:nth-child(odd){border-left:0;} .ui-kpi-cell:nth-child(even){border-left:1px solid var(--ui-border);}}
@media (max-width:560px){.ui-kpi-strip{grid-template-columns:1fr;}.ui-kpi-cell{border-left:0;}
  .ui-kpi-cell:not(:first-child){border-top:1px solid var(--ui-border);}}

/* ---------- Connected-systems tiles ---------- */
.ui-conn{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--ui-border);border-radius:var(--ui-radius);background:var(--ui-surface-2);}
.ui-conn__dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--ui-muted);}
.ui-conn__dot--ok{background:var(--ui-success);}
.ui-conn b{display:block;font-size:14px;font-weight:600;color:var(--ui-text);}
.ui-conn small{display:block;font-size:12px;color:var(--ui-muted);}

/* ---------- Topbar inner (components/topbar.php) ---------- */
.ui-topbar{justify-content:space-between;gap:16px;}
.ui-topbar__left{display:flex;align-items:center;gap:14px;min-width:0;}
.ui-topbar__right{display:flex;align-items:center;gap:8px;}
.ui-topbar__titles{min-width:0;}
.ui-topbar .ui-breadcrumb{font-size:12px;line-height:1.1;margin-bottom:1px;}
.ui-topbar .ui-topbar__title{font-size:16px !important;font-weight:600;color:var(--ui-text);line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0;}
.ui-iconbtn{width:38px;height:38px;flex:none;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--ui-radius-sm);
  color:var(--ui-text-2);font-size:20px;background:transparent;border:0;cursor:pointer;transition:background .15s var(--ui-ease);}
.ui-iconbtn:hover{background:var(--ui-surface-2);color:var(--ui-text);}
.ui-topbar__badge{position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;
  background:var(--ui-danger);color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;line-height:1;}
.ui-topbar__user{display:flex;align-items:center;gap:9px;padding:4px 10px 4px 4px;border-radius:999px;border:1px solid var(--ui-border);
  background:var(--ui-surface);color:var(--ui-text);transition:background .15s var(--ui-ease);}
.ui-topbar__user:hover{background:var(--ui-surface-2);}
.ui-topbar__user .ui-avatar{width:30px;height:30px;font-size:13px;}
.ui-topbar__username{font-size:13px;font-weight:600;white-space:nowrap;}
@media (max-width:640px){.ui-topbar__username,.ui-topbar .ui-breadcrumb{display:none;}.ui-topbar__title{font-size:16px;}}

/* hamburger visibility (avoids ui-iconbtn display overriding tailwind hidden) */
.ui-ham-desk{display:none;}
.ui-ham-mob{display:inline-flex;}
@media (min-width:1280px){.ui-ham-desk{display:inline-flex;}.ui-ham-mob{display:none;}}

/* ==========================================================================
   APP SIDEBAR (components/sidebar.php) — full shell, matches 280px app-menu geometry
   ========================================================================== */
.ui-sidebar{position:fixed;top:0;left:0;bottom:0;width:280px;z-index:40;display:flex;flex-direction:column;
  background:var(--ui-surface);border-right:1px solid var(--ui-border);}
@media (min-width:1280px){
  .ui-sidebar{top:0;left:0;bottom:0;width:280px;border:0;border-right:1px solid var(--ui-border);
    border-radius:0;box-shadow:none;}
}
.ui-sidebar__brand{display:flex;align-items:center;gap:10px;padding:16px;border-bottom:1px solid var(--ui-border);flex:none;}
.ui-sidebar__logo{width:34px;height:34px;border-radius:8px;object-fit:contain;flex:none;}
.ui-sidebar__brandtxt b{display:block;font-size:14px;font-weight:700;color:var(--ui-text);line-height:1.2;}
.ui-sidebar__brandtxt small{display:block;font-size:11px;color:var(--ui-muted);margin-top:1px;}
.ui-sidebar__nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:10px;display:flex;flex-direction:column;gap:2px;}
.ui-sidebar__label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--ui-muted);
  padding:12px 10px 4px;}
.ui-nav-item{position:relative;display:flex;align-items:center;gap:11px;height:40px;padding:0 10px;border-radius:8px;width:100%;
  color:var(--ui-muted);font-size:14px;font-weight:500;cursor:pointer;background:transparent;border:0;text-align:left;
  transition:background .15s var(--ui-ease),color .15s var(--ui-ease);}
.ui-nav-item i{font-size:18px;flex:none;}
.ui-nav-item:hover{background:var(--ui-surface-2);color:var(--ui-text);}
.ui-nav-item.active{background:var(--ui-primary-soft);color:var(--ui-primary);font-weight:600;}
.ui-nav-item.active::before{content:"";position:absolute;left:-10px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--ui-primary);}
.ui-nav-item__txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-nav-group__chev{font-size:16px!important;transition:transform .15s var(--ui-ease);}
.ui-nav-group.open .ui-nav-group__chev{transform:rotate(180deg);}
.ui-nav-group__items{display:none;flex-direction:column;gap:2px;padding:2px 0 2px 30px;}
.ui-nav-group.open .ui-nav-group__items{display:flex;}
.ui-nav-group__items .ui-nav-item{height:36px;font-size:13.5px;}
.ui-nav-group__items .ui-nav-item.active::before{display:none;}
.ui-sidebar__footer{flex:none;padding:10px;border-top:1px solid var(--ui-border);}
/* Sidebar "Home" (back to all systems) — same language as nav items + KPI icon tiles */
.ui-sidebar__home{display:flex;align-items:center;gap:10px;padding:8px 10px 8px 8px;border-radius:10px;
  background:var(--ui-surface-2);color:var(--ui-text);text-decoration:none;
  transition:background .15s var(--ui-ease),color .15s var(--ui-ease);}
.ui-sidebar__home-ico{flex:none;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;
  background:var(--ui-surface);color:var(--ui-primary);box-shadow:var(--ui-shadow-xs);
  transition:background .15s var(--ui-ease),color .15s var(--ui-ease);}
.ui-sidebar__home-ico i{font-size:17px;line-height:1;color:var(--ui-primary) !important;transition:color .15s var(--ui-ease);}
.ui-sidebar__home-txt{display:flex;flex-direction:column;min-width:0;line-height:1.2;}
.ui-sidebar__home-txt b{font-size:13.5px;font-weight:600;color:var(--ui-text);}
.ui-sidebar__home-txt small{font-size:12px;color:var(--ui-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ui-sidebar__home-go{margin-left:auto;font-size:18px;color:var(--ui-muted);transition:transform .15s var(--ui-ease),color .15s var(--ui-ease);}
.ui-sidebar__home:hover{background:var(--ui-primary-soft);}
.ui-sidebar__home:hover .ui-sidebar__home-ico,.ui-sidebar__home:focus-visible .ui-sidebar__home-ico{background:var(--ui-primary) !important;color:#fff !important;}
.ui-sidebar__home:hover .ui-sidebar__home-ico i,.ui-sidebar__home:focus-visible .ui-sidebar__home-ico i,.ui-sidebar__home:hover .ui-sidebar__home-ico i::before,.ui-sidebar__home:focus-visible .ui-sidebar__home-ico i::before{color:#fff !important;}
.ui-sidebar__home:hover .ui-sidebar__home-txt b,.ui-sidebar__home:hover .ui-sidebar__home-go{color:var(--ui-primary);}
.ui-sidebar__home:hover .ui-sidebar__home-go{transform:translateX(2px);}
.ui-sidebar__home:focus-visible{box-shadow:var(--ui-ring);}
@media (min-width:1280px){
  [data-sidebar-size="sm"] .ui-sidebar__home{justify-content:center;padding:6px;background:transparent;}
  [data-sidebar-size="sm"] .ui-sidebar__home-txt,[data-sidebar-size="sm"] .ui-sidebar__home-go{display:none;}
}
/* Collapsed 72px rail (xl only) */
@media (min-width:1280px){
  [data-sidebar-size="sm"] .ui-sidebar{width:70px;}
  [data-sidebar-size="sm"] .ui-sidebar__brandtxt,
  [data-sidebar-size="sm"] .ui-sidebar__label,
  [data-sidebar-size="sm"] .ui-nav-item__txt,
  [data-sidebar-size="sm"] .ui-nav-group__chev,
  [data-sidebar-size="sm"] .ui-sidebar__userinfo,
  [data-sidebar-size="sm"] .ui-sidebar__usercog{display:none;}
  [data-sidebar-size="sm"] .ui-nav-item{justify-content:center;padding:0;}
  [data-sidebar-size="sm"] .ui-nav-item.active::before{display:none;}
  [data-sidebar-size="sm"] .ui-nav-group__items{padding-left:0;}
  [data-sidebar-size="sm"] .ui-sidebar__brand{justify-content:center;}
}


/* ID Card dashboard welcome header — theme-aware (was white text on a dark banner) */
.idc-welcome{background:transparent;border:0;box-shadow:none;padding:0;}
.idc-welcome__title{font-size:22px;line-height:1.25;font-weight:600;color:var(--ui-text) !important;letter-spacing:-.01em;}
.idc-welcome__sub{margin-top:6px;font-size:13.5px;color:var(--ui-muted) !important;}
.idc-welcome__date{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 12px;border-radius:8px;
  border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-text-2) !important;font-size:13px;white-space:nowrap;}
.idc-welcome__date i{color:var(--ui-muted);font-size:15px;}

/* ---------- Dark-intent banners stay dark (readability bug: .card surface override
   was flattening bg-heading banners to light while their text stayed white) ---------- */
.card.bg-heading, .bg-heading.card { background: #111a2e !important; color: #fff !important; border-color: transparent !important; }
.card.bg-heading * { color: #fff; }

/* Box-in-box rule: a table already inside a .card must not get the extra wrapper border. */
.card .overflow-x-auto:has(> table), .ui-card .overflow-x-auto:has(> table) { border: 0 !important; background: transparent !important; border-radius: 0 !important; }
/* ID-card welcome title aligns to the same left edge as subtitle + kpi strip */
.idc-welcome__title { display: flex; align-items: center; gap: 8px; justify-content: flex-start; padding-left: 0; margin-left: 0; }

/* ---------- Dashboard primitives (reference 02: "Active 70K ●" tiles, meters, ledgers) ---------- */
/* Filled stat tile: label + status dot on top, value in TEXT colour (colour only on the dot). */
.ui-stat-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.ui-stat{background:var(--ui-surface-2);border-radius:var(--ui-radius);padding:12px 14px;min-width:0;}
.ui-stat__top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13px;color:var(--ui-muted);}
.ui-stat__value{display:block;font-size:24px;font-weight:700;color:var(--ui-text);line-height:1.2;margin-top:6px;font-variant-numeric:tabular-nums;}
.ui-stat__sub{display:block;font-size:12px;color:var(--ui-muted);margin-top:2px;}
.ui-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex:none;background:var(--ui-muted);}
.ui-dot--success{background:var(--ui-success);} .ui-dot--warning{background:var(--ui-warning);}
.ui-dot--danger{background:var(--ui-danger);} .ui-dot--info{background:var(--ui-info);} .ui-dot--primary{background:var(--ui-primary);}
/* Meter: thin track + one-hue fill (animated via inline width set by JS from data-w). */
.ui-meter{height:8px;border-radius:999px;background:var(--ui-surface-2);overflow:hidden;}
.ui-meter__fill{height:100%;width:0;border-radius:inherit;background:var(--ui-primary);transition:width .8s ease;}
.ui-meter__fill--success{background:var(--ui-success);}
.ui-meter__legend{display:flex;justify-content:space-between;font-size:12px;color:var(--ui-muted);margin-top:6px;}
/* Ledger: key/value rows split by dividers, optional outlined icon tile. */
.ui-ledger{list-style:none;margin:0;padding:0;}
.ui-ledger li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--ui-border);}
.ui-ledger li:last-child{border-bottom:0;}
.ui-ledger__k{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ui-text-2);min-width:0;}
.ui-ledger__ico{flex:none;width:32px;height:32px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--ui-border-strong);color:var(--ui-primary);font-size:16px;}
.ui-ledger__v{font-size:14px;font-weight:600;color:var(--ui-text);font-variant-numeric:tabular-nums;white-space:nowrap;}
/* Card head: title + muted desc left, one small action right. */
.ui-cardhead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px;}
.ui-cardhead .card-title{margin:0;}
.ui-stat-grid--auto{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));}
/* Segmented control (series toggle) */
.ui-seg{display:inline-flex;padding:3px;gap:2px;border-radius:8px;background:var(--ui-surface-2);border:1px solid var(--ui-border);}
.ui-seg button{height:30px;padding:0 12px;border-radius:6px;font-size:13px;font-weight:500;color:var(--ui-muted);background:transparent;border:0;cursor:pointer;}
.ui-seg button:hover{color:var(--ui-text);}
.ui-seg button.is-active{background:var(--ui-surface);color:var(--ui-text);box-shadow:var(--ui-shadow-xs);}
/* Ranking list: name + value over a one-hue meter */
.ui-rank__row{padding:8px 0;}
.ui-rank__top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;color:var(--ui-text-2);margin-bottom:6px;}
.ui-rank__top b{font-weight:600;color:var(--ui-text);font-variant-numeric:tabular-nums;}
.ui-rank__n{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin-right:8px;border-radius:6px;
  font-size:11px;font-weight:600;background:var(--ui-surface-2);color:var(--ui-muted);}
.ui-table thead th.num{text-align:right;}
.ui-badge{white-space:nowrap;}
/* App / section launcher tiles (Sections hub) — whole tile is the link, one outlined icon tile. */
.ui-app-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px;}
.ui-app-tile{display:flex;flex-direction:column;gap:14px;height:100%;padding:20px;border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);
  background:var(--ui-surface);box-shadow:var(--ui-shadow-xs);text-decoration:none;transition:border-color .15s,box-shadow .15s;}
.ui-app-tile:hover{border-color:var(--ui-primary);box-shadow:var(--ui-shadow-md);}
.ui-app-tile__icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:22px;
  border:1px solid var(--ui-border-strong);color:var(--ui-primary);}
.ui-app-tile__body{display:flex;flex-direction:column;gap:4px;flex:1;}
.ui-app-tile__title{font-size:15px;font-weight:600;color:var(--ui-text);line-height:1.3;}
.ui-app-tile__desc{font-size:13px;color:var(--ui-muted);line-height:1.45;}
.ui-app-tile__go{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--ui-primary);}
.ui-app-tile__icon i,.ui-app-tile__go i{color:inherit !important;}
.ui-meter__fill--warning{background:var(--ui-warning);}
.ui-rank.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;}
@media (max-width:640px){.ui-rank.grid-2{grid-template-columns:1fr;}}
a.ui-ledger__k{text-decoration:none;color:var(--ui-text);font-weight:500;} a.ui-ledger__k:hover{color:var(--ui-primary);}
.ui-ledger__chev{color:var(--ui-muted);font-size:18px;}
/* Topbar on sidebar-less pages (profile): spans the content column, no sidebar offset. */
.ui-push-right{margin-left:auto;}

/* ---------- 1f: file pickers = dashed dropzone; date fields carry a calendar icon ---------- */
.file-container.file-input-label{border:1.5px dashed var(--ui-border-strong) !important;background:var(--ui-surface) !important;
  border-radius:var(--ui-radius-sm);min-height:44px;transition:border-color .15s,background .15s;}
.file-container.file-input-label:hover,.file-container.file-input-label:focus-within{border-color:var(--ui-primary) !important;background:var(--ui-primary-soft) !important;}
.file-container.file-input-label > span:first-child{background:transparent !important;border-right:0 !important;color:var(--ui-primary) !important;}
.file-container.file-input-label > span:first-child::before{color:var(--ui-primary) !important;}
.file-container.file-input-label .file-name{color:var(--ui-muted);}
.form-input.dateText,input.dateText{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6b80' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;background-position:right 12px center !important;background-size:18px 18px !important;padding-right:40px !important;min-height:44px;}
html.dark .form-input.dateText,html.dark input.dateText{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238ea0b8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M16 3v4M8 3v4M3 10h18'/%3E%3C/svg%3E") !important;}
input[type=date].form-input,input[type=datetime-local].form-input{min-height:44px;}
@media (max-width:767px){.ui-table-wrap td,.ui-table-wrap th{white-space:nowrap;}}

/* ---------- 1g: form section headings = tiny blue dot + (icon) + 15/600, sentence case ----------
   Replaces the uppercase + coloured left-bar style (incidents .inc-fsection, MOT .mform__section,
   archive .archive-section-label, GD detail .gvp-section-title). */
.inc-fsection,.mform__section,.archive-section-label{
  display:flex !important;align-items:center;gap:8px;font-size:15px !important;font-weight:600 !important;
  letter-spacing:0 !important;text-transform:none !important;color:var(--ui-text) !important;animation:none !important;}
.inc-fsection::before,.archive-section-label::before{content:"";width:6px !important;height:6px !important;border-radius:50% !important;
  background:var(--ui-primary) !important;flex:none;}
.mform__section .n{width:auto !important;height:auto !important;background:transparent !important;border:0 !important;
  color:var(--ui-primary) !important;font-size:17px !important;}
.mform__section::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ui-primary);flex:none;}
.gvp-section-title{font-size:16px !important;font-weight:600 !important;color:var(--ui-text) !important;letter-spacing:0 !important;text-transform:none !important;}
.gvp-section-title i{color:var(--ui-primary);}
.mform__section .n i{color:var(--ui-primary) !important;}
/* MOT forms: panel titles + field labels follow the system (sentence case, 16/600 and 13/500) */
.mot-panel__title{font-size:16px !important;font-weight:600 !important;letter-spacing:0 !important;text-transform:none !important;color:var(--ui-text) !important;}
.mot-panel__title i{color:var(--ui-primary) !important;}
.mfield__label{font-size:13px !important;font-weight:500 !important;letter-spacing:0 !important;text-transform:none !important;color:var(--ui-text-2) !important;}
.mot-vhead__card-head{text-transform:none !important;letter-spacing:0 !important;}
.mot-vhead__card-head i{color:var(--ui-primary) !important;}
/* List toolbar: flexible search + fixed-min fields; legacy .form-input works inside groups */
.ui-toolbar__search{flex:1 1 200px;min-width:200px;}
.ui-toolbar__field{flex:0 1 210px;min-width:150px;}
.ui-toolbar__field .select2-container{width:100% !important;}
.ui-input-group .form-input{padding-left:38px !important;width:100%;}
.ui-input-group__icon{z-index:1;}
/* Read-only picker inputs (flatpickr .dateText) are interactive — don't look disabled */
.form-input.dateText[readonly]{background-color:var(--ui-surface) !important;cursor:pointer;}
/* Form template bits */
.ui-section-ic{color:var(--ui-primary);font-size:17px;}
.inc-fsection .ui-section-ic + *{margin-left:0;}
.ui-formbar{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-top:8px;padding-top:16px;border-top:1px solid var(--ui-border);}
.ui-link-sm{font-size:13px;font-weight:500;color:var(--ui-primary);display:inline-flex;align-items:center;gap:2px;}
.ui-link-sm:hover{text-decoration:underline;}
.ui-btn--danger-ghost{color:var(--ui-danger) !important;}
.ui-btn--danger-ghost:hover{background:var(--ui-danger-soft) !important;}
.inc-fsection,.mform__section,.archive-section-label{margin:4px 0 16px !important;}

/* ---------- Detail page (template d) ---------- */
.ui-dhead{display:flex;align-items:flex-start;gap:18px;flex-wrap:wrap;}
.ui-dhead__logo{width:72px;height:72px;border-radius:12px;object-fit:contain;border:1px solid var(--ui-border);background:var(--ui-surface-2);padding:6px;flex:none;}
.ui-dhead__body{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;align-items:flex-start;}
.ui-dhead__meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px;color:var(--ui-muted);margin-top:6px;}
.ui-dhead__meta b{color:var(--ui-text);font-weight:600;}
.ui-dhead__actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;}
.ui-tabs__tab{display:inline-flex;align-items:center;gap:6px;background:transparent;border-top:0;border-left:0;border-right:0;}
.ui-tabs__tab .ui-badge{font-size:11px;padding:2px 7px;}
.ui-dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 24px;margin:0;}
.ui-dl dt{font-size:13px;color:var(--ui-muted);font-weight:400;}
.ui-dl dd{font-size:15px;font-weight:600;color:var(--ui-text);margin:4px 0 0;word-break:break-word;}
.ui-dl__wide{grid-column:1/-1;}
@media (max-width:1100px){.ui-dl{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:480px){.ui-dl{grid-template-columns:1fr;}}
/* Plate number chip (mono, outlined) */
.ui-plate{display:inline-flex;align-items:center;height:26px;padding:0 9px;border-radius:6px;border:1px solid var(--ui-border-strong);
  background:var(--ui-surface);font-family:var(--ui-mono);font-size:12.5px;font-weight:600;color:var(--ui-text);letter-spacing:.3px;white-space:nowrap;}
.ui-dl{margin-top:20px !important;}
.ui-toolbar__field > select:not(.select2-hidden-accessible),.ui-toolbar__field > input,.ui-toolbar__field > .select2,.ui-toolbar__field > .select2-container{width:100% !important;}
@media (max-width:560px){.ui-kpi-cell{padding:12px 0 !important;}}
@media (max-width:640px){.ui-toolbar__field,.ui-toolbar__search{flex:1 1 100%;}.ui-toolbar > .ui-btn{flex:1 1 auto;justify-content:center;}}
@media (max-width:560px){.ui-kpi-strip .ui-kpi-cell{border-left:0 !important;border-radius:0 !important;}}
/* 1d safety: icons inside secondary (white) buttons inherit text colour even if markup says text-white */
.btn.b-outline i.text-white,.ui-btn--secondary i.text-white,.ui-btn--ghost i.text-white{color:inherit !important;}

/* ---------- Legacy row action icons (.btn-icon *-icon-light) → ghost icon buttons ---------- */
.btn-icon{width:32px !important;height:32px !important;border-radius:8px !important;display:inline-flex !important;align-items:center;justify-content:center;
  background:transparent !important;color:var(--ui-text-2) !important;border:0 !important;transition:background .15s,color .15s;}
.btn-icon i{font-size:17px !important;color:inherit !important;}
.btn-icon:hover{background:var(--ui-surface-2) !important;color:var(--ui-primary) !important;}
.btn-icon[class*="danger"]{color:var(--ui-danger) !important;}
.btn-icon[class*="danger"]:hover{background:var(--ui-danger-soft) !important;color:var(--ui-danger) !important;}
.ui-kpi-cell.is-current .ui-kpi-cell__label{color:var(--ui-primary);font-weight:500;}
.ui-perpage{width:auto !important;min-width:150px;height:36px !important;}

/* ---------- select2 → system select (44px, 1px strong border, chevron, focus ring) ---------- */
.select2-container--default .select2-selection--single{height:44px !important;border:1px solid var(--ui-border-strong) !important;border-radius:var(--ui-radius-sm) !important;
  background:var(--ui-surface) !important;display:flex;align-items:center;}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:42px !important;padding-left:12px !important;padding-right:36px !important;color:var(--ui-text) !important;font-size:14px;}
.select2-container--default .select2-selection--single .select2-selection__placeholder{color:var(--ui-muted) !important;}
.select2-container--default .select2-selection--single .select2-selection__arrow{height:42px !important;width:34px !important;background:transparent !important;border:0 !important;right:2px !important;}
.select2-container--default .select2-selection--single .select2-selection__arrow b{border:0 !important;width:16px !important;height:16px !important;margin:-8px 0 0 -8px !important;
  background:no-repeat center/16px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b6b80' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;}
.select2-container--default.select2-container--focus .select2-selection--single,.select2-container--default.select2-container--open .select2-selection--single{border-color:var(--ui-primary) !important;box-shadow:var(--ui-ring);}
.select2-dropdown{border:1px solid var(--ui-border) !important;border-radius:var(--ui-radius) !important;box-shadow:var(--ui-shadow-md) !important;background:var(--ui-surface) !important;overflow:hidden;}
.select2-container--default .select2-results__option{font-size:14px;padding:8px 12px;color:var(--ui-text-2);}
.select2-container--default .select2-results__option--highlighted[aria-selected],.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable{background:var(--ui-primary-soft) !important;color:var(--ui-text) !important;}
.select2-container--default .select2-results__option[aria-selected=true],.select2-container--default .select2-results__option--selected{background:var(--ui-surface-2) !important;color:var(--ui-text) !important;font-weight:500;}
.select2-search--dropdown .select2-search__field{border:1px solid var(--ui-border-strong) !important;border-radius:var(--ui-radius-sm) !important;height:36px;padding:0 10px;background:var(--ui-surface);color:var(--ui-text);}

/* ---------- Multi-step forms (template c): dashkit step tabs → numbered stepper ----------
   Opt-in via .ui-stepper on the .dashkit-tab row (registration/transfer forms). States:
   active = filled primary, done (before active) = ✓ outlined primary, pending = neutral. */
.ui-stepper{counter-reset:uistep;display:flex !important;align-items:center;gap:0 !important;flex-wrap:wrap;
  padding:0 0 18px !important;margin-bottom:20px;border:0 !important;border-bottom:1px solid var(--ui-border) !important;}
.ui-stepper .dashkit-tab-btn{counter-increment:uistep;display:flex !important;align-items:center;gap:10px;background:transparent !important;
  border:0 !important;box-shadow:none !important;padding:4px 0 !important;color:var(--ui-muted) !important;}
.ui-stepper .dashkit-tab-btn > div{display:none !important;}
.ui-stepper .dashkit-tab-btn h6{display:block !important;font-size:14px;font-weight:500;color:inherit;white-space:nowrap;}
.ui-stepper .dashkit-tab-btn::before{content:counter(uistep);flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;
  font-size:13px;font-weight:600;border:1.5px solid var(--ui-border-strong);background:var(--ui-surface);color:var(--ui-muted);}
.ui-stepper .dashkit-tab-btn:not(:last-child)::after{content:"";width:48px;height:2px;border-radius:2px;background:var(--ui-border);margin:0 14px;}
.ui-stepper .dashkit-tab-btn.active{color:var(--ui-text) !important;}
.ui-stepper .dashkit-tab-btn.active h6{font-weight:600;}
.ui-stepper .dashkit-tab-btn.active::before{background:var(--ui-primary);border-color:var(--ui-primary);color:#fff;}
.ui-stepper .dashkit-tab-btn:has(~ .dashkit-tab-btn.active){color:var(--ui-text-2) !important;}
.ui-stepper .dashkit-tab-btn:has(~ .dashkit-tab-btn.active)::before{content:"\2713";border-color:var(--ui-primary);color:var(--ui-primary);}
.ui-stepper .dashkit-tab-btn:has(~ .dashkit-tab-btn.active)::after{background:var(--ui-primary);}
.ui-stepper .dashkit-tab-btn:hover{color:var(--ui-text) !important;}
/* Owner/holder photo picker (#imagePlaceHolder): collapsed to a 2px line below 2xl → 96px dashed photo tile */
#imagePlaceHolder{width:96px !important;height:96px !important;min-height:96px;border:1.5px dashed var(--ui-border-strong) !important;
  border-radius:12px !important;background-color:var(--ui-surface-2) !important;background-size:cover !important;background-position:center !important;margin-bottom:16px;}
#imagePlaceHolder:hover{border-color:var(--ui-primary) !important;}
.ui-btn i{color:inherit !important;}
/* 1d follow-up: secondary buttons lost their border width with the colour class — set it explicitly */
.btn.b-outline{border-width:1px !important;border-style:solid !important;}

/* ---------- GD vehicle detail (.gov-vehicle-profile / .gvp-*) → detail template ---------- */
.gov-vehicle-profile{background:transparent !important;padding:0 !important;}
.gvp-header,.gvp-section,.gvp-summary div,.gvp-documents a{border-radius:var(--ui-radius-lg) !important;box-shadow:var(--ui-shadow-xs) !important;border:1px solid var(--ui-border) !important;background:var(--ui-surface) !important;}
.gvp-header{padding:24px !important;align-items:flex-start !important;}
.gvp-label{background:transparent !important;padding:0 !important;color:var(--ui-muted) !important;letter-spacing:0 !important;text-transform:none !important;font-size:13px !important;font-weight:500 !important;}
.gvp-header h1{font-size:24px !important;font-weight:600 !important;color:var(--ui-text) !important;}
.gvp-header p{color:var(--ui-muted) !important;font-size:14px !important;}
.gvp-actions{gap:10px !important;justify-content:flex-end;}
.gvp-summary{grid-template-columns:repeat(5,minmax(0,1fr)) !important;gap:12px !important;}
@media (max-width:1100px){.gvp-summary{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}}
.gvp-summary div{padding:16px !important;}
.gvp-summary i{background:transparent !important;border:1px solid var(--ui-border-strong);color:var(--ui-primary) !important;width:36px !important;height:36px !important;font-size:18px !important;border-radius:8px !important;margin-bottom:10px !important;}
.gvp-summary span,.gvp-detail-list span{font-size:13px !important;color:var(--ui-muted) !important;font-weight:400 !important;text-transform:none !important;letter-spacing:0 !important;}
.gvp-summary strong,.gvp-detail-list strong{font-size:15px !important;font-weight:600 !important;color:var(--ui-text) !important;}
.gvp-detail-list div{border-color:var(--ui-border) !important;}
.gvp-documents i{background:transparent !important;color:var(--ui-primary) !important;}
.gvp-documents h4{color:var(--ui-text) !important;font-weight:600 !important;font-size:14px !important;}
.gvp-documents p{color:var(--ui-muted) !important;font-size:12.5px !important;}
.ui-link{color:var(--ui-primary);text-decoration:none;}
.ui-link:hover{text-decoration:underline;}
.ui-btn--danger-outline{background:var(--ui-surface) !important;color:var(--ui-danger) !important;border:1px solid var(--ui-danger) !important;}
.ui-btn--danger-outline:hover{background:var(--ui-danger-soft) !important;}
.ui-thumb{width:40px;height:40px;border-radius:8px;object-fit:cover;border:1px solid var(--ui-border);background:var(--ui-surface-2);display:block;}
.ui-text-danger{color:var(--ui-danger) !important;}
.ui-table__sub i{font-size:12px;vertical-align:-1px;margin-right:2px;}
/* ui-table cells never inherit pre/pre-line from legacy wrappers (template newlines showed as blank lines) */
.ui-table tbody td,.ui-table thead th{white-space:normal;}
.ui-table tbody td.whitespace-nowrap,.ui-table td .ui-plate,.ui-table td .ui-badge{white-space:nowrap;}
@media (max-width:767px){.ui-table-wrap td,.ui-table-wrap th{white-space:nowrap !important;}}
/* Same photo placeholder without the #imagePlaceHolder id (renew/transfer forms) */
.bg-no-repeat.bg-100\%.border-gray-200.bg-primary-200.cursor-pointer.h-full{width:96px !important;height:96px !important;border:1.5px dashed var(--ui-border-strong) !important;
  border-radius:12px !important;background-color:var(--ui-surface-2) !important;background-size:cover !important;background-position:center !important;margin-bottom:16px;}

/* ---------- MOT sub-pages: bespoke slate table / green pills → system table + badges ---------- */
.mot-table-wrap{border:1px solid var(--ui-border) !important;border-radius:var(--ui-radius) !important;}
.mot-table thead th{background:var(--ui-surface-2) !important;color:var(--ui-muted) !important;font-size:13px !important;font-weight:600 !important;letter-spacing:0 !important;text-transform:none !important;}
.mot-table tbody tr{border-color:var(--ui-border) !important;}
.mot-table tbody tr:nth-child(even){background:transparent !important;}
.mot-table tbody tr:hover{background:var(--ui-surface-2) !important;}
.mot-td{font-size:14px !important;color:var(--ui-text-2) !important;}
.mot-pill{font-size:12px !important;font-weight:600 !important;letter-spacing:0 !important;text-transform:capitalize;}
.mot-pill--pass{background:var(--ui-success-soft) !important;color:var(--ui-success) !important;}
.mot-pill--adv{background:var(--ui-warning-soft) !important;color:var(--ui-warning) !important;}
.mot-pill--fail{background:var(--ui-danger-soft) !important;color:var(--ui-danger) !important;}
.mot-scope .btn.b-solid.btn-success-solid{background:var(--ui-primary) !important;border-color:var(--ui-primary) !important;}
.mot-icon-preview{background:var(--ui-surface-2) !important;color:var(--ui-primary) !important;}
.mfield__icon{color:var(--ui-muted) !important;}
.mot-table-wrap{overflow-x:auto !important;}

/* ---------- Report pages (template e) shared legacy pattern ----------
   grey filter/summary panels → bordered surface; oversized report title → 22/600; grey pagination box → none */
.main-content .bg-gray-200.rounded-lg.p-4{background:var(--ui-surface) !important;border:1px solid var(--ui-border);}
.main-content .text-3xl.font-bold:is(.sm\:text-4xl){font-size:22px !important;font-weight:600 !important;color:var(--ui-text);line-height:1.25;}
.main-content nav.border.border-gray-400.rounded-lg.p-2.bg-gray-200{background:transparent !important;border:0 !important;padding:0 !important;}
/* Incident detail: tinted KPI icons → outlined tiles; uppercase dt labels → 13px sentence case */
.inc-kpi__icon{background:transparent !important;border:1px solid var(--ui-border-strong) !important;}
.inc-kpi__label{font-size:13px !important;font-weight:400 !important;letter-spacing:0 !important;text-transform:none !important;color:var(--ui-muted) !important;}
.inc-dl dt{font-size:13px !important;font-weight:400 !important;letter-spacing:0 !important;text-transform:none !important;color:var(--ui-muted) !important;}
.inc-dl dd{font-size:15px !important;font-weight:600 !important;color:var(--ui-text) !important;}
.card div:not(.ui-toolbar):not(.ui-table-wrap) + .ui-table-wrap{margin-top:16px;}
@media (max-width:560px){.ui-cardhead{flex-wrap:wrap;}.ui-seg{max-width:100%;overflow-x:auto;}}

/* =====================================================================
   DETAIL TEMPLATE (components/detail.php) — ref 04 person / 06 vehicle / 08 license
   ===================================================================== */
.ui-dback{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ui-muted);margin:0 0 12px;text-decoration:none;}
.ui-dback:hover{color:var(--ui-primary);}
.ui-dcard{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-xs);padding:20px 20px 0;margin-bottom:16px;}
.ui-dh{display:flex;gap:20px;align-items:flex-start;padding-bottom:20px;}
.ui-dh__media{flex:none;width:120px;height:120px;border-radius:12px;object-fit:cover;border:1px solid var(--ui-border);background:var(--ui-surface-2);}
.ui-dh__media--icon{display:flex;align-items:center;justify-content:center;background:var(--ui-primary-soft);border-color:transparent;color:var(--ui-primary);font-size:48px;}
.ui-dh__media--html{display:flex;align-items:center;justify-content:center;overflow:hidden;padding:6px;}
.ui-dh__media--html img{max-width:100%;max-height:100%;}
.ui-dh__body{flex:1;min-width:0;}
.ui-dh__top{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;}
.ui-dh__titles{min-width:0;}
.ui-dh__title{font-size:20px;font-weight:700;color:var(--ui-text);line-height:1.3;margin:2px 0 0;word-break:break-word;}
.ui-dh__verified{color:var(--ui-primary);font-size:18px;vertical-align:-2px;}
.ui-dh__meta{display:flex;flex-wrap:wrap;gap:4px 18px;margin-top:6px;font-size:14px;color:var(--ui-muted);}
.ui-dh__meta b{font-weight:500;color:var(--ui-text-2);}
.ui-dh__status{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:14px;font-weight:600;}
.ui-dh__status i{font-size:18px;}
.ui-dh__status + .ui-dh__status{margin-left:14px;}
.ui-dh__status .dot{width:7px;height:7px;border-radius:999px;background:currentColor;flex:0 0 auto;}
.ui-dh__status--primary{color:var(--ui-primary);}
.ui-dh__status--success{color:var(--ui-success);} .ui-dh__status--danger{color:var(--ui-danger);}
.ui-dh__status--warning{color:var(--ui-warning);} .ui-dh__status--info{color:var(--ui-info);} .ui-dh__status--neutral{color:var(--ui-muted);}
.ui-dh__actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;flex:none;max-width:60%;}
.ui-dh__facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px 24px;margin:16px 0 0;padding-top:16px;border-top:1px solid var(--ui-border);}
.ui-dh__facts dt{font-size:13px;color:var(--ui-muted);}
.ui-dh__facts dd{font-size:15px;font-weight:600;color:var(--ui-text);margin:2px 0 0;}
.ui-dh__facts span{display:block;font-size:12px;color:var(--ui-muted);margin-top:1px;}
/* tabs: active = filled primary pill */
.ui-dtabs{display:flex;gap:4px;overflow-x:auto;padding:12px 0;border-top:1px solid var(--ui-border);scrollbar-width:thin;}
.ui-dtab{flex:none;display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 16px;border-radius:8px;border:0;background:transparent;
  font-size:14px;font-weight:500;color:var(--ui-muted);cursor:pointer;white-space:nowrap;}
.ui-dtab:hover{color:var(--ui-text);background:var(--ui-surface-2);}
.ui-dtab.is-active{background:var(--ui-primary);color:#fff;}
.ui-dtab__count{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;
  font-size:11px;font-weight:600;background:var(--ui-primary-soft);color:var(--ui-primary);}
.ui-dtab.is-active .ui-dtab__count{background:rgba(255,255,255,.22);color:#fff;}
/* body grid */
.ui-dbody{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;align-items:start;}
.ui-dbody__main,.ui-dbody__side{display:flex;flex-direction:column;gap:16px;min-width:0;}
.ui-dpanel[hidden]{display:none !important;}
.ui-icard{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-xs);padding:20px 24px;}
.ui-icard__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:16px;}
.ui-icard__title{font-size:15px;font-weight:600;color:var(--ui-text);margin:0;}
.ui-icard__desc{font-size:13px;color:var(--ui-muted);margin-top:2px;}
.ui-icard__desc b{color:var(--ui-text-2);font-weight:600;}
.ui-icard__actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;}
.ui-icard--render{display:flex;flex-direction:column;align-items:center;}
.ui-icard--render .ui-icard__head{align-self:stretch;}
/* label/value grid */
.ui-igrid{display:grid;gap:18px 24px;margin:0;}
.ui-igrid--4{grid-template-columns:repeat(4,minmax(0,1fr));}
.ui-igrid--3{grid-template-columns:repeat(3,minmax(0,1fr));}
.ui-igrid--2{grid-template-columns:repeat(2,minmax(0,1fr));}
.ui-igrid dt{font-size:13px;color:var(--ui-muted);font-weight:400;}
.ui-igrid dd{font-size:15px;font-weight:600;color:var(--ui-text);margin:3px 0 0;word-break:break-word;}
.ui-igrid .is-wide{grid-column:span 2;}
/* side: dashed mini tiles */
.ui-mtiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.ui-mtiles--3{grid-template-columns:repeat(3,minmax(0,1fr));}   /* six tiles in two rows (dashboard summaries) */
.ui-mtile{display:flex;align-items:center;gap:10px;padding:12px;border:1px dashed var(--ui-border-strong);border-radius:var(--ui-radius);}
.ui-mtile__ic{flex:none;width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:18px;}
.ui-mtile b{display:block;font-size:15px;font-weight:700;color:var(--ui-text);font-variant-numeric:tabular-nums;}
.ui-mtile span{display:block;font-size:12px;color:var(--ui-muted);}
/* timeline */
.ui-tl{list-style:none;margin:0;padding:0;}
.ui-tl li{display:flex;gap:12px;padding:0 0 14px;position:relative;}
.ui-tl li:not(:last-child)::before{content:"";position:absolute;left:4px;top:14px;bottom:0;width:2px;background:var(--ui-border);}
.ui-tl__dot{flex:none;width:10px;height:10px;border-radius:50%;background:var(--ui-primary);margin-top:5px;}
.ui-tl b{display:block;font-size:14px;font-weight:600;color:var(--ui-text);}
.ui-tl span,.ui-tl time{display:block;font-size:12.5px;color:var(--ui-muted);}
/* file chips (documents grid) */
/* icon buttons in headers */
.ui-btn--icon.ui-btn--secondary{width:40px;padding:0;justify-content:center;}
/* responsive */
@media (max-width:1200px){.ui-igrid--4{grid-template-columns:repeat(3,minmax(0,1fr));}}
@media (max-width:1024px){.ui-dbody{grid-template-columns:1fr;}.ui-dh__top{flex-direction:column;}.ui-dh__actions{max-width:none;justify-content:flex-start;}}
@media (max-width:768px){.ui-igrid--4,.ui-igrid--3{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){
  .ui-dcard{padding:16px 16px 0;}
  .ui-dh{flex-direction:column;gap:14px;}
  .ui-dh__media{width:96px;height:96px;}
  .ui-igrid--4,.ui-igrid--3,.ui-igrid--2{grid-template-columns:1fr;}
  .ui-igrid .is-wide{grid-column:auto;}
  .ui-icard{padding:16px;}
  .ui-mtiles{grid-template-columns:1fr;}
}
.ui-dtab.is-active,.ui-dtab.is-active i{color:#fff !important;}
.ui-dtab i{font-size:16px !important;color:inherit !important;}
.ui-dh__media--icon i{font-size:48px !important;color:var(--ui-primary) !important;line-height:1;}
/* pages whose side column holds a physical render (plate / licence / ID card) */
.ui-dbody--render{grid-template-columns:minmax(0,1fr) minmax(420px,460px);}
@media (max-width:1100px){.ui-dbody--render{grid-template-columns:1fr;}}
.ui-icard--render .ui-icard__actions{flex-wrap:nowrap;}
.ui-icard--render > :not(.ui-icard__head){max-width:100%;overflow-x:auto;}
[role="tablist"] .ui-dtab[role="tab"]{border-bottom:0 !important;margin-bottom:0 !important;}
[role="tablist"] .ui-dtab[role="tab"][aria-selected="true"],[role="tablist"] .ui-dtab[role="tab"][aria-selected="true"] i{color:#fff !important;}
.ui-mbars{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;height:120px;margin-top:8px;}
.ui-mbars__col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;}
.ui-mbars__col span{display:block;width:100%;max-width:18px;border-radius:4px 4px 0 0;background:var(--ui-primary);opacity:.85;}
.ui-mbars__col span.is-zero{background:var(--ui-border);opacity:1;}
.ui-mbars__col small{font-size:10.5px;color:var(--ui-muted);}
.ui-ival{display:inline;} .ui-igrid dd .pvd-edit{vertical-align:middle;}
.ui-ophoto{width:100%;max-width:220px;aspect-ratio:1;object-fit:cover;border-radius:12px;border:1px solid var(--ui-border);display:block;margin:0 auto;}
.ui-dtab__count.is-alert{background:var(--ui-warning-soft);color:var(--ui-warning);}
.ui-mtile__ic i,.ui-fchip__ic i{font-size:18px !important;line-height:1 !important;color:var(--ui-primary) !important;display:block;}
.ui-mtile__ic,.ui-fchip__ic{align-self:center;}
.ui-mtiles + .ui-icard__desc{margin-top:16px !important;}
.ui-table thead th.num,.main-content table thead th.num{text-align:right !important;}

/* =====================================================================
   MOTCA IDENTITY — gold placements (docs/ui-identity.md §2) — gold nowhere else
   ===================================================================== */
.ui-nav-item.active::before{background:var(--ui-accent) !important;}
.ui-dh__verified,.ri-verified-badge-fill,.ui-official{color:var(--ui-accent) !important;}
/* dashboards: first (primary) KPI gets a 2px gold underline; page header gold hairline */
body:not(:has(.list-data)) .ui-kpi-strip > .ui-kpi-cell:first-child{position:relative;}
body:not(:has(.list-data)) .ui-kpi-strip > .ui-kpi-cell:first-child::after{content:"";position:absolute;left:24px;right:24px;bottom:0;height:2px;border-radius:2px;background:var(--ui-accent);left:0 !important;}

/* =====================================================================
   MOTCA SIGNATURE COMPONENTS (docs/ui-identity.md §3) — replace VRLS signatures (§4)
   ===================================================================== */
/* 1) Icon tiles: FILLED soft, 40px, radius 10 — never outlined */
.ui-kpi-cell__icon,.ui-ledger__ico,.ui-app-tile__icon,.inc-shead__ic,.inc-kpi__icon,.pvd-card-ic,.gvp-summary i,
.ui-mtile__ic,.ui-fchip__ic,.ui-dh__media--icon{
  background:var(--ui-primary-soft) !important;border:0 !important;color:var(--ui-primary) !important;border-radius:10px !important;}
.ui-kpi-cell__icon{width:44px !important;height:44px !important;font-size:20px !important;}
.ui-kpi-cell__icon i,.ui-ledger__ico i,.ui-app-tile__icon i,.inc-kpi__icon i{color:inherit !important;}
.ui-kpi-cell__icon--success,.inc-kpi__icon.inc-ic-green{background:var(--ui-success-soft) !important;color:var(--ui-success) !important;}
.ui-kpi-cell__icon--warning,.inc-kpi__icon.inc-ic-amber{background:var(--ui-warning-soft) !important;color:var(--ui-warning) !important;}
.ui-kpi-cell__icon--danger,.inc-kpi__icon.inc-ic-red{background:var(--ui-danger-soft) !important;color:var(--ui-danger) !important;}
.ui-kpi-cell__icon--info,.inc-kpi__icon.inc-ic-teal{background:var(--ui-info-soft) !important;color:var(--ui-info) !important;}
.ui-dh__media--icon{border-radius:12px !important;}
/* 2) KPI strip: ONE white card, filled tiles, label 13 muted, value 24/700 */
.ui-kpi-strip{background:var(--ui-surface) !important;border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-xs);padding:16px 0;}
.ui-kpi-cell{padding:6px 24px !important;}
.ui-kpi-cell:first-child{padding-left:24px !important;}
.ui-kpi-cell__label{font-size:13px !important;color:var(--ui-muted) !important;}
.ui-kpi-cell__value{font-size:24px !important;font-weight:700 !important;}
.ui-kpi-cell__trend{padding:1px 8px;border-radius:999px;background:var(--ui-success-soft);}
.ui-kpi-cell__trend.down{background:var(--ui-danger-soft);}
@media (max-width:560px){.ui-kpi-strip{padding:4px 16px;} .ui-kpi-cell,.ui-kpi-cell:first-child{padding:12px 0 !important;}}
/* 3) Mini stat tiles: solid surface-2, no border — never dashed */
.ui-mtile{border:0 !important;background:var(--ui-surface-2) !important;}
.ui-mtile__ic{background:var(--ui-surface) !important;}
.ui-stat{border:0;background:var(--ui-surface-2);}
/* 4) Tabs: underline — muted text, active = text colour + 2px GOLD bar; count = small neutral pill */
.ui-dtabs{gap:20px;padding:0;border-top:1px solid var(--ui-border);}
.ui-dtab,[role="tablist"] .ui-dtab[role="tab"]{height:48px;padding:0 2px;border-radius:0 !important;background:transparent !important;
  color:var(--ui-muted) !important;border-bottom:2px solid transparent !important;margin-bottom:-1px;}
.ui-dtab:hover{background:transparent !important;color:var(--ui-text) !important;}
.ui-dtab.is-active,[role="tablist"] .ui-dtab[role="tab"][aria-selected="true"]{background:transparent !important;color:var(--ui-text) !important;
  border-bottom-color:var(--ui-accent) !important;font-weight:600;}
.ui-dtab.is-active i,[role="tablist"] .ui-dtab[role="tab"][aria-selected="true"] i{color:var(--ui-primary) !important;}
.ui-dtab__count,.ui-dtab.is-active .ui-dtab__count{background:var(--ui-surface-2) !important;color:var(--ui-text-2) !important;border:1px solid var(--ui-border);}
.ui-tabs__tab.active,[role="tablist"] [role="tab"][aria-selected="true"]{border-bottom-color:var(--ui-accent) !important;color:var(--ui-text) !important;}
.ui-seg button.is-active{box-shadow:inset 0 -2px 0 var(--ui-accent),var(--ui-shadow-xs);}
/* 5) Section headings: 28px filled icon tile + 15/600 — not blue dots */
.inc-fsection::before,.archive-section-label::before,.mform__section::before{
  content:"\ecef" !important;font-family:"remixicon" !important;font-size:15px !important;font-style:normal;line-height:28px;text-align:center;
  width:28px !important;height:28px !important;border-radius:8px !important;background:var(--ui-primary-soft) !important;color:var(--ui-primary) !important;}
.inc-fsection:has(> i)::before,.mform__section:has(.n)::before{display:none !important;}
.inc-fsection > i,.mform__section .n{width:28px !important;height:28px !important;border-radius:8px !important;display:inline-flex !important;
  align-items:center;justify-content:center;background:var(--ui-primary-soft) !important;color:var(--ui-primary) !important;font-size:15px !important;flex:none;}
.mform__section .n i{color:inherit !important;font-size:15px !important;}
.ui-icard__title.has-ic{display:flex;align-items:center;gap:10px;}
.ui-icard__ic{flex:none;width:28px;height:28px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:15px;}
.ui-icard__ic i{color:inherit !important;}
.ui-icard__head .ui-icard__desc{margin-left:0;}
.ui-icard__title.has-ic + .ui-icard__desc{margin-left:38px;}
/* 6) Status: soft badge + strong text + 6px dot — never solid pills */
.ui-badge{background:var(--ui-surface-2);color:var(--ui-text-2);font-weight:600;gap:6px;}
.ui-badge .dot{width:6px !important;height:6px !important;}
.ui-badge--success{background:var(--ui-success-soft) !important;color:var(--ui-success) !important;}
.ui-badge--warning{background:var(--ui-warning-soft) !important;color:var(--ui-warning) !important;}
.ui-badge--danger{background:var(--ui-danger-soft) !important;color:var(--ui-danger) !important;}
.ui-badge--info{background:var(--ui-info-soft) !important;color:var(--ui-info) !important;}
.ui-badge--primary{background:var(--ui-primary-soft) !important;color:var(--ui-primary) !important;}
.badge.danger,.badge.success,.badge[class*="-solid"]{background:var(--ui-danger-soft) !important;color:var(--ui-danger) !important;}
/* 7) Table header: surface-2, 12px 600 UPPERCASE muted, letter-spacing .04em (neutral, not blue-tinted) */
.ui-table thead th,.main-content table:not(.mot-table):not([class*="no-ui"]) thead th,.mot-table thead th{
  background:var(--ui-surface-2) !important;color:var(--ui-muted) !important;font-size:12px !important;font-weight:600 !important;
  text-transform:uppercase !important;letter-spacing:.04em !important;}
/* 8) Stepper: numbered, GOLD check on completed, navy current, thin navy progress connectors */
.ui-stepper .dashkit-tab-btn.active::before{background:var(--ui-primary) !important;border-color:var(--ui-primary) !important;}
.ui-stepper .dashkit-tab-btn:has(~ .dashkit-tab-btn.active)::before{content:"\eb7b" !important;font-family:"remixicon" !important;
  border-color:var(--ui-accent) !important;color:var(--ui-accent) !important;background:var(--ui-accent-soft) !important;}
.ui-stepper .dashkit-tab-btn:not(:last-child)::after{height:2px !important;background:var(--ui-border) !important;}
.ui-stepper .dashkit-tab-btn:has(~ .dashkit-tab-btn.active)::after{background:var(--ui-primary) !important;}
/* 9) Record ID chip */
.ui-rid{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;border:1px solid var(--ui-border);
  background:var(--ui-surface-2);font-family:var(--ui-mono);font-size:13px;font-weight:600;color:var(--ui-text-2);white-space:nowrap;vertical-align:middle;letter-spacing:.01em;}
.ui-dh__title .ui-rid{margin-left:8px;position:relative;top:-2px;}
.ui-table__primary + .ui-rid,.ui-table td .ui-rid{margin-top:3px;}
.ui-plate{border-radius:999px !important;background:var(--ui-surface-2) !important;border-color:var(--ui-border) !important;}
/* 10) Empty states: line icon in a 48px surface-2 circle */
.ui-empty__icon{width:48px;height:48px;border-radius:50%;background:var(--ui-surface-2);display:inline-flex !important;align-items:center;justify-content:center;
  font-size:22px !important;color:var(--ui-muted) !important;margin-bottom:10px;}
.ui-icard--wide-render > :not(.ui-icard__head){width:100%;}
.ui-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;}
.ui-cat{padding:14px 10px;border-radius:var(--ui-radius);background:var(--ui-surface-2);text-align:center;opacity:.6;}
.ui-cat.is-on{opacity:1;background:var(--ui-primary-soft);box-shadow:inset 0 0 0 1px var(--ui-primary);}
.ui-cat__emoji{font-size:28px;line-height:1;filter:grayscale(1);}
.ui-cat.is-on .ui-cat__emoji{filter:none;}
.ui-cat b{display:block;font-size:17px;font-weight:700;color:var(--ui-text);margin-top:6px;}
.ui-cat span{display:block;font-size:11.5px;color:var(--ui-muted);}
.ui-cat em{display:inline-flex;gap:3px;align-items:center;font-style:normal;font-size:11px;font-weight:600;color:var(--ui-accent);margin-top:4px;}
/* employee avatar (upload trigger) as the 120px media tile */
.ui-dh__media--html:has(.ui-avatar-media){padding:0;background:transparent;border:0;}
.ui-avatar-media{position:relative;width:120px;height:120px;cursor:pointer;}
.ui-avatar-media .avatar-circle{width:120px !important;height:120px !important;border-radius:12px !important;overflow:hidden;border:1px solid var(--ui-border);background:var(--ui-surface-2);}
.ui-avatar-media .avatar-circle img{width:100%;height:100%;object-fit:cover;}
.ui-avatar-media .avatar-overlay{position:absolute;inset:0;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(17,26,46,.45);opacity:0;transition:opacity .15s;}
.ui-avatar-media:hover .avatar-overlay{opacity:1;}
.ui-avatar-media .avatar-overlay i{color:#fff !important;font-size:24px;}
@media (max-width:560px){.ui-avatar-media,.ui-avatar-media .avatar-circle{width:96px !important;height:96px !important;}}
.ui-mtile__ic{display:flex !important;align-items:center !important;justify-content:center !important;background:var(--ui-primary-soft) !important;}
.apt-fac-chips{display:flex;flex-wrap:wrap;gap:8px;}
.apt-flightcard{border:1px solid var(--ui-border) !important;border-radius:var(--ui-radius) !important;background:var(--ui-surface) !important;padding:14px !important;}
.apt-flightcard__head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}

/* ===== Detail richness (audit · related · activity · lifecycle · initials) ===== */
.ui-dh__media--initials{font-size:40px;font-weight:700;letter-spacing:.02em;color:var(--ui-primary);font-family:var(--ui-font);}
.ui-audit,.ui-rel,.ui-act,.ui-life{list-style:none;margin:0;padding:0;}
.ui-audit li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;}
.ui-audit li + li{border-top:1px solid var(--ui-border);}
.ui-audit__ic,.ui-act__ic,.ui-rel__ic{flex:none;line-height:1;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--ui-primary-soft) !important;color:var(--ui-primary) !important;font-size:16px;}
.ui-audit__ic i,.ui-act__ic i,.ui-rel__ic i{color:inherit !important;}
.ui-audit b,.ui-act b{display:block;font-size:13.5px;font-weight:600;color:var(--ui-text);}
.ui-audit li > div > span,.ui-act li > div > span{display:block;font-size:12.5px;color:var(--ui-muted);}
.ui-audit em{font-style:normal;color:var(--ui-text-2);font-weight:500;}
.ui-rel li + li{margin-top:8px;}
.ui-rel__row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;background:var(--ui-surface-2);color:inherit;text-decoration:none;min-width:0;}
a.ui-rel__row:hover{background:var(--ui-primary-soft);}
.ui-rel__txt{flex:1;min-width:0;}
.ui-rel__txt b{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:14px;font-weight:600;color:var(--ui-text);}
.ui-rel__txt small{display:block;font-size:12.5px;color:var(--ui-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-rel__ic{background:var(--ui-surface) !important;}
.ui-rel__chev{color:var(--ui-muted);font-size:18px;}
.ui-act li{display:flex;gap:12px;position:relative;padding-bottom:14px;}
.ui-act li:not(:last-child)::before{content:"";position:absolute;left:15px;top:34px;bottom:2px;width:2px;background:var(--ui-border);}
.ui-act__ic{width:32px;height:32px;font-size:15px;}
.ui-act--approve .ui-act__ic,.ui-act--pay .ui-act__ic{background:var(--ui-success-soft) !important;color:var(--ui-success) !important;}
.ui-act--delete .ui-act__ic{background:var(--ui-danger-soft) !important;color:var(--ui-danger) !important;}
.ui-act--print .ui-act__ic,.ui-act--inspect .ui-act__ic{background:var(--ui-surface-2) !important;color:var(--ui-text-2) !important;}
.ui-act__all{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-weight:600;color:var(--ui-primary);text-decoration:none;margin-top:2px;}
.ui-life li{display:flex;gap:12px;position:relative;padding-bottom:16px;}
.ui-life li:not(:last-child)::before{content:"";position:absolute;left:11px;top:26px;bottom:2px;width:2px;background:var(--ui-border);}
.ui-life li.is-done:not(:last-child)::before{background:var(--ui-primary);}
.ui-life__mk{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--ui-border-strong);background:var(--ui-surface);font-size:14px;}
.ui-life .is-done .ui-life__mk{border-color:var(--ui-accent);background:var(--ui-accent-soft);color:var(--ui-accent);}
.ui-life .is-current .ui-life__mk{border-color:var(--ui-primary);box-shadow:inset 0 0 0 4px var(--ui-surface);background:var(--ui-primary);}
.ui-life .is-danger .ui-life__mk{border-color:var(--ui-danger);background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-life b{display:block;font-size:13.5px;font-weight:600;color:var(--ui-text);}
.ui-life li > div > span{display:block;font-size:12.5px;color:var(--ui-muted);}
.ui-life .is-todo b{color:var(--ui-muted);font-weight:500;}
.ui-ocard{display:flex;align-items:center;gap:12px;}
.ui-ocard__ph{flex:none;width:56px;height:56px;border-radius:12px;object-fit:cover;background:var(--ui-primary-soft);color:var(--ui-primary);display:grid;place-items:center;font-weight:700;font-size:18px;}
.ui-ocard b{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:15px;font-weight:600;color:var(--ui-text);}
.ui-ocard div > span{display:block;font-size:13px;color:var(--ui-muted);}
.ui-dbody__main .ui-audit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 16px;}
.ui-dbody__main .ui-audit li + li{border-top:0;}
.ui-dbody__main .ui-audit li{padding:8px 0;}
@media (max-width:1024px){.ui-dbody__main .ui-audit{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:560px){.ui-dbody__main .ui-audit{grid-template-columns:1fr;}}
.ui-ophoto--initials{display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:56px;font-weight:700;border:0;}
.ui-dbody__side .ui-empty,.ui-icard .ui-rel + .ui-empty{padding:14px 8px;}
.ui-dbody__side .ui-empty__icon{width:40px;height:40px;font-size:18px;}
.ui-dbody__side .ui-empty__title{font-size:13.5px;}
.ui-icard .ui-empty{padding:20px 8px;}
/* employee: initials avatar + read-only ID card preview (mirrors prints/printid.php layout, 54×86mm) */
.ui-avatar-media .avatar-circle svg.ui-avatar-initials,.ui-avatar-initials{width:100% !important;height:100% !important;display:block;background:var(--ui-primary-soft);}
.ui-avatar-initials text{fill:var(--ui-primary);font:700 44px var(--ui-font);}
.ui-idprev{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}
.ui-idprev__card{--mm:3.1px;position:relative;width:calc(54*var(--mm));height:calc(86*var(--mm));background-size:100% 100%;border-radius:8px;box-shadow:0 1px 3px rgba(16,24,40,.18);overflow:hidden;color:#000;font-family:Georgia,'Times New Roman',serif;}
.ui-idprev__photo{position:absolute;left:calc(17*var(--mm));top:calc(24*var(--mm));width:calc(20*var(--mm));height:calc(21*var(--mm));background:#eaeffa;display:grid;place-items:center;overflow:hidden;}
.ui-idprev__photo img{width:100%;height:100%;object-fit:cover;}
.ui-idprev__photo span{font:700 22px var(--ui-font);color:#1b3a8a;}
.ui-idprev__name,.ui-idprev__t1,.ui-idprev__t2{position:absolute;left:0;right:0;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 4px;}
.ui-idprev__name{top:calc(46.6*var(--mm));font-size:calc(3.5*var(--mm));}
.ui-idprev__t1{top:calc(50.8*var(--mm));font-size:calc(2.8*var(--mm));}
.ui-idprev__t2{top:calc(54.8*var(--mm));font-size:calc(2.8*var(--mm));}
.ui-idprev__no{position:absolute;left:calc(37.4*var(--mm));top:calc(58*var(--mm));font-size:calc(2.8*var(--mm));line-height:1;writing-mode:vertical-rl;white-space:nowrap;z-index:1;}
.ui-idprev__qr{position:absolute;left:calc(19*var(--mm));top:calc(58*var(--mm));width:calc(18*var(--mm));height:calc(18*var(--mm));}
@media (max-width:560px){.ui-idprev__card{--mm:2.9px;}}
.valid-badge.is-expired{background:var(--ui-danger-soft);color:var(--ui-danger);}

/* =====================================================================
   MOTCA POPUP (components/modal.php · .claude/skills/ui-modal)
   One design for every modal/dialog: white 16px card, filled icon tile,
   16/600 title + muted subtitle, ghost close, right-aligned footer.
   ===================================================================== */
.ui-pop{background:rgba(17,26,46,.55) !important;padding:16px;}
.ui-pop__card{position:relative;display:flex;flex-direction:column;width:100%;max-height:calc(100vh - 32px);margin:0 !important;
  background:var(--ui-surface) !important;border:1px solid var(--ui-border);border-radius:16px !important;box-shadow:var(--ui-shadow-lg);overflow:hidden;color:var(--ui-text);}
.ui-pop__card--sm{max-width:440px;} .ui-pop__card--md{max-width:640px;} .ui-pop__card--lg{max-width:880px;} .ui-pop__card--xl{max-width:1080px;}
.ui-pop__head{display:flex;align-items:flex-start;gap:12px;padding:18px 20px 16px 24px;border-bottom:1px solid var(--ui-border);flex:none;}
.ui-pop__ic{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:18px;}
.ui-pop__ic i{color:inherit !important;}
.ui-pop__ic--danger{background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-pop__titles{flex:1;min-width:0;padding-top:1px;}
.ui-pop__title{margin:0;font-size:16px;font-weight:600;line-height:1.35;color:var(--ui-text);}
.ui-pop__title .ui-rid{margin-left:6px;vertical-align:1px;}
.ui-pop__sub{margin:2px 0 0;font-size:13px;color:var(--ui-muted);line-height:1.45;}
.ui-pop__x{flex:none;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;color:var(--ui-muted);font-size:20px;background:transparent;border:0;cursor:pointer;margin:-2px -4px 0 0;}
.ui-pop__x:hover{background:var(--ui-surface-2);color:var(--ui-text);}
.ui-pop__x:focus-visible{outline:2px solid var(--ui-primary);outline-offset:2px;}
.ui-pop__card > form{display:flex;flex-direction:column;min-height:0;flex:1;}
.ui-pop__body{padding:20px 24px;overflow-y:auto;min-height:0;flex:1;}
.ui-pop__body .form-label{font-size:13px;font-weight:500;color:var(--ui-text-2);margin-bottom:6px;}
.ui-pop__foot{display:flex;justify-content:flex-end;align-items:center;gap:10px;padding:14px 24px;border-top:1px solid var(--ui-border);background:var(--ui-surface);flex:none;flex-wrap:wrap;}
.ui-pop__foot > .ui-pop__foot-note{margin-right:auto;font-size:12.5px;color:var(--ui-muted);}
.ui-pop__body > .ui-pop__foot{margin:20px -24px -20px;position:sticky;bottom:-20px;}
@media (max-width:560px){
  .ui-pop{padding:0;align-items:flex-end !important;}
  .ui-pop__card{max-width:none;max-height:92vh;border-radius:16px 16px 0 0 !important;}
  .ui-pop__foot{padding:12px 16px;} .ui-pop__foot .ui-btn{flex:1;justify-content:center;}
  .ui-pop__body{padding:16px;} .ui-pop__body > .ui-pop__foot{margin:16px -16px -16px;bottom:-16px;}
}
/* Safety net: any legacy .modal not yet on the component gets the same card/backdrop. */
.modal:not(.ui-pop).z-modal{background:rgba(17,26,46,.55) !important;}
.modal:not(.ui-pop) > .modal-content{border-radius:16px !important;border:1px solid var(--ui-border) !important;box-shadow:var(--ui-shadow-lg) !important;background:var(--ui-surface) !important;border-left-width:1px !important;}

/* ---------- SweetAlert2 in the MOTCA identity ---------- */
.swal2-container.swal2-backdrop-show{background:rgba(17,26,46,.55) !important;}
.swal2-popup{border-radius:16px !important;border:1px solid var(--ui-border) !important;background:var(--ui-surface) !important;color:var(--ui-text) !important;
  font-family:var(--ui-font) !important;padding:24px 24px 20px !important;box-shadow:var(--ui-shadow-lg) !important;width:min(440px,calc(100vw - 32px)) !important;}
.swal2-title{font-size:18px !important;font-weight:600 !important;color:var(--ui-text) !important;padding:8px 0 0 !important;}
.swal2-html-container{font-size:14px !important;color:var(--ui-text-2) !important;margin:8px 0 0 !important;}
.swal2-icon{transform:scale(.72);margin:4px auto -6px !important;}
.swal2-actions{gap:10px;margin-top:20px !important;width:100%;justify-content:flex-end !important;}
.swal2-styled{margin:0 !important;border-radius:10px !important;font-weight:600 !important;font-size:14px !important;padding:10px 18px !important;box-shadow:none !important;}
.swal2-styled.swal2-confirm{background:var(--ui-primary) !important;color:#fff !important;}
.swal2-styled.swal2-confirm:hover{background:var(--ui-primary-hover) !important;}
.swal2-styled.swal2-confirm.is-danger{background:var(--ui-danger) !important;}
.swal2-styled.swal2-cancel,.swal2-styled.swal2-deny{background:var(--ui-surface) !important;color:var(--ui-text) !important;border:1px solid var(--ui-border-strong) !important;}
.swal2-styled:focus-visible{outline:2px solid var(--ui-primary) !important;outline-offset:2px;}
.swal2-input,.swal2-textarea,.swal2-select{border-radius:10px !important;border:1px solid var(--ui-border-strong) !important;font-size:14px !important;box-shadow:none !important;background:var(--ui-surface) !important;color:var(--ui-text) !important;}
.swal2-actions .swal2-cancel{order:1;} .swal2-actions .swal2-deny{order:2;} .swal2-actions .swal2-confirm{order:3;} .swal2-actions .swal2-loader{order:4;}
/* Popup identity for the bespoke families (archive · airports ops · photo upload) — same card/head/foot as .ui-pop */
.arc-modal,.apt-modal,.upload-modal{background:rgba(17,26,46,.55) !important;}
.arc-modal-card,.apt-modal__card,.upload-modal .modal-card{background:var(--ui-surface) !important;border:1px solid var(--ui-border) !important;border-radius:16px !important;box-shadow:var(--ui-shadow-lg) !important;color:var(--ui-text) !important;}
.arc-modal-head,.apt-modal__head,.upload-modal .modal-header{display:flex;align-items:flex-start !important;gap:12px;padding:18px 20px 16px 24px !important;border-bottom:1px solid var(--ui-border) !important;background:transparent !important;}
.arc-modal-head .ui-pop__titles{flex:1;}
.arc-modal-head h2,.apt-modal__head h3,.upload-modal .modal-title{font-size:16px !important;font-weight:600 !important;color:var(--ui-text) !important;letter-spacing:0 !important;line-height:1.35;margin:0;}
.arc-modal-head .sub{font-size:13px !important;color:var(--ui-muted) !important;}
.apt-modal__head h3{display:flex;align-items:center;gap:12px !important;flex:1;}
.apt-modal__head h3 > i:first-child{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary) !important;font-size:18px;}
.arc-modal-x,.apt-modal__x,.upload-modal .close-btn{width:32px !important;height:32px !important;border-radius:8px !important;color:var(--ui-muted) !important;background:transparent !important;display:grid !important;place-items:center;cursor:pointer;flex:none;}
.arc-modal-x:hover,.apt-modal__x:hover,.upload-modal .close-btn:hover{background:var(--ui-surface-2) !important;color:var(--ui-text) !important;}
.arc-modal-x:focus-visible{outline:2px solid var(--ui-primary);outline-offset:2px;}
.arc-modal-body,.apt-modal__body{padding:20px 24px !important;}
.arc-modal-foot,.apt-modal__foot,.upload-modal .modal-actions{display:flex;justify-content:flex-end;gap:10px;padding:14px 24px !important;border-top:1px solid var(--ui-border) !important;background:var(--ui-surface) !important;}
.arc-mbtn{border-radius:10px !important;font-weight:600 !important;font-size:14px !important;height:40px;padding:0 16px !important;display:inline-flex;align-items:center;gap:6px;box-shadow:none !important;background-image:none !important;}
.arc-mbtn-ghost,.upload-modal .btn-secondary{background:var(--ui-surface) !important;color:var(--ui-text) !important;border:1px solid var(--ui-border-strong) !important;}
.arc-mbtn-primary,.arc-mbtn-info,.upload-modal .btn-primary{background:var(--ui-primary) !important;color:#fff !important;border:1px solid var(--ui-primary) !important;}
.arc-mbtn-danger{background:var(--ui-danger) !important;color:#fff !important;border:1px solid var(--ui-danger) !important;}
.upload-modal .btn-primary:disabled{opacity:.5;}
.upload-modal .modal-card{overflow:hidden;}
/* multi-field legacy edit popups: 2-column field grid on tablet+ (fields keep their markup) */
@media (min-width:640px){
  :is(#edit_vehicle_info,#edit_contact_info,#edit_vehicle_ins_info,#edit_documents_info) .ui-pop__body .grid-cols-12 .grid-cols-12 > .col-span-full{grid-column:span 6 / span 6;}
}
/* legacy light-blue table headers (bg-[#E6F6FD]) → MOTCA neutral uppercase header */
th[class*="E6F6FD"]{background:var(--ui-surface-2) !important;color:var(--ui-muted) !important;text-transform:uppercase;font-size:12px !important;font-weight:600 !important;letter-spacing:.04em;border-color:var(--ui-border) !important;}
/* footers nested anywhere inside a popup body span the full card width */
.ui-pop__body .ui-pop__foot{margin:20px -24px -20px;position:sticky;bottom:-20px;z-index:1;}
@media (max-width:560px){.ui-pop__body .ui-pop__foot{margin:16px -16px -16px;bottom:-16px;}}

/* =====================================================================
   FORM SECTIONS (template c) — icon-tile section headings, field grids,
   side photo/document panel, right-aligned footer. Field markup unchanged.
   ===================================================================== */
.ui-stepper{position:relative;}
.ui-stepper::before{content:"";position:absolute;left:0;right:0;bottom:-1px;height:3px;border-radius:3px;background:var(--ui-surface-2);}
.ui-stepper::after{content:"";position:absolute;left:0;bottom:-1px;height:3px;border-radius:3px;background:var(--ui-primary);width:50%;transition:width .25s var(--ui-ease, ease);}
.ui-stepper:has(> .dashkit-tab-btn:nth-child(2):last-child.active)::after{width:100%;}
.ui-stepper:has(> .dashkit-tab-btn:nth-child(3):last-child)::after{width:33.4%;}
.ui-stepper:has(> .dashkit-tab-btn:nth-child(2).active):has(> .dashkit-tab-btn:nth-child(3):last-child)::after{width:66.7%;}
.ui-stepper:has(> .dashkit-tab-btn:nth-child(3):last-child.active)::after{width:100%;}
.ui-flayout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;align-items:start;}
.ui-fside{position:sticky;top:16px;max-height:calc(100vh - 32px);overflow:auto;overscroll-behavior:contain;border:1px solid var(--ui-border);border-radius:12px;padding:16px;background:var(--ui-surface);}
.ui-fsec{padding:20px 0 4px;}
.ui-fsec + .ui-fsec{border-top:1px solid var(--ui-border);}
.ui-fsec--boxed{padding:16px 16px 4px;border:1px solid var(--ui-border) !important;border-radius:12px;background:var(--ui-surface-2);margin-top:16px;}
.ui-fsec__head{display:flex;align-items:flex-start;gap:12px;margin-bottom:16px;}
.ui-fsec__ic{flex:none;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:15px;}
.ui-fsec__ic i{color:inherit !important;}
.ui-fsec__title{font-size:15px;font-weight:600;color:var(--ui-text);line-height:28px;margin:0;}
.ui-fsec__sub{font-size:12.5px;color:var(--ui-muted);margin:-4px 0 0;line-height:1.4;}
.ui-ffoot{display:flex;justify-content:flex-end;align-items:center;gap:10px;padding-top:16px;margin-top:8px;border-top:1px solid var(--ui-border);clear:both;}
.ui-ffoot__note{margin-right:auto;font-size:12.5px;color:var(--ui-muted);}
.ui-ffoot--sticky{position:sticky;bottom:0;z-index:5;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;padding:12px 16px;box-shadow:var(--ui-shadow-md);}   /* long forms: the workflow buttons stay in view */
.ui-mtiles--5{grid-template-columns:repeat(5,minmax(0,1fr));}   /* ten summary tiles in two rows (day totals) */
.ui-input-group--suffix .ui-input,.ui-input-group--suffix .form-input{padding-left:12px !important;padding-right:42px;}
.ui-input-group__suffix{position:absolute;right:12px;font-size:12px;font-weight:600;color:var(--ui-muted);pointer-events:none;}
.ui-dropdown__item--danger{color:var(--ui-danger);} .ui-dropdown__item.is-disabled{opacity:.55;cursor:default;pointer-events:none;}
.ui-ffoot .next-tab,.ui-ffoot .prev-tab{float:none !important;}
.ui-fphoto{display:flex;flex-direction:column;gap:10px;}
.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old),.ui-fphoto .ui-fphoto__tile{width:100% !important;height:auto !important;aspect-ratio:4/5;border-radius:12px !important;border:1px dashed var(--ui-border-strong) !important;
  background-color:var(--ui-surface-2) !important;background-size:cover !important;background-position:center !important;position:relative;}
.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old)[style*="default-img"],.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old):not([style*="background-image"]){background-image:none !important;}
.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old)[style*="default-img"]::before,.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old):not([style*="background-image"])::before{content:"\ee47";font-family:"remixicon";position:absolute;inset:0;display:grid;place-items:center;font-size:34px;color:var(--ui-muted);}
.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old)[style*="default-img"]::after,.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old):not([style*="background-image"])::after{content:"Add photo";position:absolute;left:0;right:0;bottom:24%;text-align:center;font-size:13px;font-weight:600;color:var(--ui-text-2);}
.ui-fphoto__hint{font-size:12.5px;color:var(--ui-muted);margin:0;}
.ui-fside .ui-fsec__head{margin-bottom:12px;}
@media (max-width:1024px){.ui-flayout{grid-template-columns:1fr;}.ui-fside{position:static;}.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old){max-width:180px;}}
@media (max-width:560px){.ui-ffoot{flex-wrap:wrap;}.ui-ffoot .ui-btn,.ui-ffoot .btn{flex:1;justify-content:center;}}
.ui-fsec--boxed + .ui-flayout{margin-top:16px;}
.ui-fphoto #imagePlaceHolder_old::after{content:"No photo yet" !important;}
.ui-fphoto #imagePlaceHolder_old::before{content:"\eb31" !important;}
.ui-fphoto #imagePlaceHolder_old{cursor:default !important;}

/* =====================================================================
   FORM GRID (docs/ui-form-grid.md) — 12 columns, every field sized by the
   value users type: ui-w-xs 2 · sm 3 · md 4 · lg 6 · full 12. Rows sum to 12.
   ui-c-N = exact desktop span when a row is closed by widening one field.
   Checked by scripts/ui-grid-check.js (run from ui-shots).
   ===================================================================== */
.ui-fgrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px 20px;align-items:start;}
.ui-fgrid > *{min-width:0;margin-bottom:0 !important;grid-column:span 12;}
.ui-fgrid .form-label{margin-bottom:6px;}
.ui-fgrid > .ui-w-xs{grid-column:span 2;} .ui-fgrid > .ui-w-sm{grid-column:span 3;} .ui-fgrid > .ui-w-md{grid-column:span 4;}
.ui-fgrid > .ui-w-lg{grid-column:span 6;} .ui-fgrid > .ui-w-full{grid-column:span 12;}
.ui-fgrid > .ui-c-1{grid-column:span 1;} .ui-fgrid > .ui-c-2{grid-column:span 2;} .ui-fgrid > .ui-c-3{grid-column:span 3;}
.ui-fgrid > .ui-c-4{grid-column:span 4;} .ui-fgrid > .ui-c-5{grid-column:span 5;} .ui-fgrid > .ui-c-6{grid-column:span 6;}
.ui-fgrid > .ui-c-7{grid-column:span 7;} .ui-fgrid > .ui-c-8{grid-column:span 8;} .ui-fgrid > .ui-c-9{grid-column:span 9;}
.ui-fgrid > .ui-c-10{grid-column:span 10;} .ui-fgrid > .ui-c-11{grid-column:span 11;} .ui-fgrid > .ui-c-12{grid-column:span 12;}
.ui-fgrid > .ui-fsec__head,.ui-fgrid > .ui-fgrid__break{grid-column:1 / -1;}
.ui-fgrid input[readonly]:not(.dateText):not([type=file]):not(#date):not([name*="date"]):not([name*="dob"]):not(td *){background:var(--ui-surface-2);}
.ui-fgrid input[readonly]:is(.dateText,#date,[name*="date"],[name*="dob"]){background:var(--ui-surface) !important;cursor:pointer;}
@media (min-width:1024px) and (max-width:1279px){
  .ui-fgrid > .ui-w-xs{grid-column:span 3;} .ui-fgrid > .ui-w-sm{grid-column:span 4;} .ui-fgrid > .ui-w-md{grid-column:span 6;}
  .ui-fgrid > .ui-w-lg,.ui-fgrid > .ui-w-full{grid-column:span 12;}
  .ui-fgrid > [class*="ui-c-"]{grid-column:auto;}
  .ui-fgrid > .ui-w-xs[class*="ui-c-"]{grid-column:span 3;} .ui-fgrid > .ui-w-sm[class*="ui-c-"]{grid-column:span 4;}
  .ui-fgrid > .ui-w-md[class*="ui-c-"]{grid-column:span 6;} .ui-fgrid > .ui-w-lg[class*="ui-c-"],.ui-fgrid > .ui-w-full[class*="ui-c-"]{grid-column:span 12;}
}
@media (min-width:640px) and (max-width:1023px){
  .ui-fgrid{grid-template-columns:repeat(6,minmax(0,1fr));}
  .ui-fgrid > *{grid-column:span 6;}
  .ui-fgrid > .ui-w-xs,.ui-fgrid > .ui-w-sm{grid-column:span 3 !important;}
  .ui-fgrid > .ui-w-md,.ui-fgrid > .ui-w-lg,.ui-fgrid > .ui-w-full{grid-column:span 6 !important;}
}
@media (max-width:639px){
  .ui-fgrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px;}
  .ui-fgrid > *{grid-column:span 2 !important;}
  .ui-fgrid > .ui-w-xs:has(+ .ui-w-xs),.ui-fgrid > .ui-w-xs + .ui-w-xs{grid-column:span 1 !important;}
}
/* side panel photo tile: 160×200 (ID-card ratio), not a tall empty box */
.ui-fphoto :is(#imagePlaceHolder,#imagePlaceHolder_old),.ui-fphoto .ui-fphoto__tile{width:160px !important;height:200px !important;aspect-ratio:auto;flex:none;}
.ui-fphoto{align-items:flex-start;}
.ui-fside .file-container{min-height:56px;}
@media (max-width:1024px){.ui-fside{display:grid;grid-template-columns:160px minmax(0,1fr);gap:4px 20px;align-items:start;}.ui-fside > .ui-fsec__head{grid-column:1 / -1;}.ui-fside > .ui-fphoto{grid-row:span 2;}.ui-fside > .mt-4{margin-top:0 !important;}}
@media (max-width:560px){.ui-fside{display:block;}}
/* edit-form context strip */
.ui-fctx{display:flex;align-items:center;gap:12px;padding:12px 16px;margin-bottom:16px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-surface);}
.ui-fctx__ic{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:17px;}
.ui-fctx__ic i{color:inherit !important;}
.ui-fctx__main{flex:1;min-width:0;}
.ui-fctx__title{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:15px;color:var(--ui-text);}
.ui-fctx__title b{font-weight:600;}
.ui-fctx__meta{font-size:12.5px;color:var(--ui-muted);margin-top:2px;}
@media (max-width:560px){.ui-fctx{flex-wrap:wrap;}}
.ui-fgrid > .ui-fgrid__action{display:flex;justify-content:flex-end;align-items:flex-end;align-self:end;gap:10px;}
/* role privileges matrix */
.ui-privhead{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0 12px;border-top:1px solid var(--ui-border);margin-top:4px;}
.ui-privmod{border:1px solid var(--ui-border);border-radius:12px;padding:14px 16px 16px;margin:12px 0;background:var(--ui-surface);}
.ui-privmod__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.ui-privmod__title{margin:0;font-size:14px;font-weight:600;color:var(--ui-text);}
.ui-privmod .grid{gap:8px !important;}
.ui-privitem{padding:10px 12px;border-radius:10px;background:var(--ui-surface-2);}
.ui-privitem label{font-weight:500 !important;color:var(--ui-text-2) !important;font-size:13.5px;line-height:1.3 !important;}
.ui-privitem:has(input:checked){background:var(--ui-primary-soft);}
.ui-privitem:has(input:checked) label{color:var(--ui-primary) !important;}
.ui-fgrid > .ui-fcheck{display:flex;align-items:center;gap:10px;align-self:end;min-height:44px;margin-top:0 !important;}
.ui-fgrid > .ui-fcheck label{margin:0 !important;font-weight:500 !important;color:var(--ui-text-2) !important;}
/* support page */
.ui-help-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.ui-help-card{display:flex;flex-direction:column;gap:6px;padding:20px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-surface);color:var(--ui-text);text-decoration:none;transition:border-color .15s;}
.ui-help-card:hover{border-color:var(--ui-primary);}
.ui-help-card b{font-size:15px;font-weight:600;margin-top:6px;}
.ui-help-card > span:last-child{font-size:13px;color:var(--ui-muted);}
.ui-faq{display:flex;flex-direction:column;gap:8px;margin-top:4px;}
.ui-faq__item{border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-surface);}
.ui-faq__item.open{border-color:var(--ui-primary);}
.ui-faq__q{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:14px 16px;font-size:14.5px;font-weight:600;color:var(--ui-text);text-align:left;background:none;border:0;cursor:pointer;}
.ui-faq__q i{font-size:20px;color:var(--ui-muted);transition:transform .15s;}
.ui-faq__q.open i{transform:rotate(180deg);}
.ui-faq__a{padding:0 16px 16px;font-size:14px;line-height:1.55;color:var(--ui-text-2);}
@media (max-width:860px){.ui-help-grid{grid-template-columns:1fr;}}
.ui-faq__q::after{display:none !important;content:none !important;}
.ui-field__error[data-auto]{margin:6px 0 0;font-size:12.5px;color:var(--ui-danger);display:flex;align-items:center;gap:4px;}
.ui-field__error[data-auto]::before{content:"\eca1";font-family:"remixicon";font-size:14px;}
[aria-invalid="true"].form-input,[aria-invalid="true"].form-select,[aria-invalid="true"]{border-color:var(--ui-danger) !important;}
/* reports: filter card + KPI strip card + table card */
.ui-tbwrap{padding:0 20px 20px;border-bottom:1px solid var(--ui-border);}   /* the toolbar box of a p-0 report card (replaces .ui-rfilterbox) */
.card.p-0:has(> .ui-tbwrap) > .overflow-x-auto{margin-top:0 !important;padding:16px 20px 4px;}
.card.p-0:has(> .ui-tbwrap) > .flex-center-between{padding:0 20px 16px;margin-top:12px !important;}
@media (max-width:640px){.ui-tbwrap{padding:0 16px 16px;}}
.ui-rfilterbox,.ui-rfilters{background:transparent !important;padding:0 !important;}
.ui-rfilterbox{padding:0 20px 20px !important;border-bottom:1px solid var(--ui-border);}
.ui-rfilters{padding:0 !important;}
.card.p-0:has(> .ui-rfilterbox) > .overflow-x-auto{margin-top:0 !important;padding:16px 20px 4px;}
.card.p-0:has(> .ui-rfilterbox) > .flex-center-between{padding:0 20px 16px;margin-top:12px !important;}
.ui-rkpi-wrap{padding:16px 20px 0;}   /* the report KPI strip sits between the toolbar and the (scrolling) table, never inside the table wrap */
.ui-rkpi{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;padding:16px 20px;margin-top:0;}
/* report tabs (reports/_*_report_header.php, _reportTabs.php) */
.ui-rtabs{margin:0 0 18px;padding:0 20px;border-bottom:1px solid var(--ui-border);}   /* no negative bleed: the tab bar spans its card because the filter box drops its side padding (below) */
.ui-rfilterbox:has(> .ui-rtabs){padding-left:0 !important;padding-right:0 !important;} .ui-rfilterbox:has(> .ui-rtabs) > :not(.ui-rtabs){margin-left:20px;margin-right:20px;}
.ui-rtabs .ui-tabs{border-bottom:0;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none;}
.ui-rtabs .ui-tabs__tab{white-space:nowrap;padding:14px 14px 12px;margin-bottom:-1px;text-decoration:none;}
.ui-rtabs--card{margin:0 0 16px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;padding:0 12px;}
.ui-rkpi .ui-kpi-cell__icon{width:44px;height:44px;font-size:20px;background:var(--ui-primary-soft);border:0;}
.ui-rkpi .ui-kpi-cell__value{font-size:20px;}
@media (max-width:639px){
  .ui-rfilter > .ui-fgrid__action .ui-btn{width:100%;justify-content:center;}
  .card.p-0:has(> .ui-rfilterbox) > .flex-center-between{flex-direction:column;align-items:stretch;gap:12px;}
  .ui-rfilterbox{padding:0 16px 16px !important;} .ui-rtabs{margin:0 0 16px;padding:0 16px;} .ui-rfilterbox:has(> .ui-rtabs) > :not(.ui-rtabs){margin-left:16px;margin-right:16px;}
  .card.p-0:has(> .ui-rfilterbox) > .overflow-x-auto{padding:16px 16px 4px;}
}
.ui-rfilterbox:not(:has(.ui-rtabs)){padding-top:20px !important;}
.mot-panel .ui-rfilter{margin-top:4px;}

/* =====================================================================
   ROW CELLS (components/cells.php) — list + report rows
   ===================================================================== */
.ui-cellp{display:flex;align-items:center;gap:12px;min-width:0;}
.ui-cellp__txt{min-width:0;display:flex;flex-direction:column;}
.ui-cellp__txt .ui-table__sub{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.ui-cellp__txt .ui-rid{margin-top:0 !important;height:20px;font-size:11.5px;padding:0 8px;}
.ui-cellp__sep{color:var(--ui-border-strong);}
.ui-avatar--sm{width:36px;height:36px;font-size:13px;}
.ui-avatar--initials{background:var(--ui-primary-soft);color:var(--ui-primary);font-weight:700;justify-content:center;letter-spacing:.02em;}
.ui-ctile{width:36px;height:36px;flex:none;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:17px;}
a.ui-table__primary{color:var(--ui-text);text-decoration:none;}
a.ui-table__primary:hover{color:var(--ui-primary);text-decoration:underline;text-underline-offset:2px;}
.ui-table__primary--plain{font-weight:500;}
.ui-num{font-variant-numeric:tabular-nums;font-family:var(--ui-mono);font-size:13px;}
.ui-muted{color:var(--ui-muted);}
.ui-ract{display:inline-flex;align-items:center;gap:2px;justify-content:flex-end;}
.ui-iconbtn--sm{width:32px;height:32px;font-size:16px;}
.ui-rmenu{position:relative;display:inline-flex;}
.ui-rmenu__list{position:absolute;right:0;top:calc(100% + 4px);z-index:60;min-width:180px;padding:6px;box-shadow:var(--ui-shadow-md);}
.ui-rmenu__list[hidden]{display:none;}
.ui-rmenu__list .ui-dropdown__item{white-space:nowrap;cursor:pointer;font-size:13.5px;}
.ui-empty-row td{padding:0 !important;border:0 !important;}
.ui-empty--row{padding:40px 16px;}
.ui-empty--row .ui-empty__icon{margin:0 auto 10px;}
.ui-table tbody tr.ui-skel-row td{padding-top:16px;padding-bottom:16px;}
@media print{.ui-ract,.ui-rmenu{display:none !important;}.ui-avatar,.ui-ctile{display:none !important;}.ui-badge{border:0;background:none !important;color:#000 !important;padding:0;}.ui-badge .dot{display:none;}}
@media (max-width:639px){
  .ui-fgrid.ui-rfilter > .ui-fgrid__action.ui-fgrid__action{grid-column:1 / -1 !important;}
  .ui-empty--row{position:sticky;left:0;width:calc(100vw - 72px);}
}
.ui-thumbcell{width:64px;padding-right:0 !important;}
.ui-thumb{width:44px;height:52px;border-radius:10px;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--ui-border);background:var(--ui-surface-2);}
.ui-thumb img{width:100%;height:100%;object-fit:cover;}
.ui-thumb--initials{background:var(--ui-primary-soft);color:var(--ui-primary);font-weight:700;font-size:13px;border:0;}
.ui-table .ui-badge .dot,.ui-badge > .dot{margin:0 !important;display:inline-block;flex:none;}
.ui-table__primary--plain{white-space:nowrap;}
/* security.php monitor tabs → identity underline tabs (ids/classes kept for its JS) */
#monitorTab{gap:4px !important;border-bottom:1px solid var(--ui-border);}
#monitorTab .dashkit-tab-btn{background:transparent !important;border:0 !important;border-bottom:2px solid transparent !important;border-radius:0 !important;padding:12px 14px !important;margin-bottom:-1px;color:var(--ui-muted) !important;}
#monitorTab .dashkit-tab-btn:hover{color:var(--ui-text) !important;}
#monitorTab .dashkit-tab-btn.active{color:var(--ui-text) !important;border-bottom-color:var(--ui-accent) !important;}

/* =====================================================================
   PHOTO & DOCUMENT PANEL (components/photo_panel.php)
   Side card 300px, sticky; "Photo" + "Document" sub-sections; centered 3:4 tile.
   :is(#imagePlaceHolder,#imagePlaceHolder_old) only lifts specificity above the
   legacy id rules — no layout depends on the ids.
   ===================================================================== */
.ui-flayout:has(> .ui-pp){grid-template-columns:minmax(0,1fr) 300px;}
.ui-pp.ui-fside{position:sticky;top:88px;max-height:calc(100vh - 104px);overflow:auto;overscroll-behavior:contain;padding:20px;border:1px solid var(--ui-border);border-radius:14px;background:var(--ui-surface);display:block;}
.ui-pp .ui-pp__sec{display:flex;flex-direction:column;align-items:stretch;}
.ui-pp .ui-pp__h{font-size:13px;font-weight:600;color:var(--ui-text);margin:0 0 10px;}
.ui-pp .ui-pp__div{border:0;border-top:1px solid var(--ui-border);margin:18px 0;}
.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id]){position:relative;display:block;width:100% !important;max-width:220px !important;height:auto !important;min-height:0 !important;
  aspect-ratio:3/4;margin:0 auto !important;border-radius:12px !important;border:1.5px dashed var(--ui-border-strong) !important;background-color:var(--ui-surface-2) !important;
  background-image:none !important;overflow:hidden;cursor:pointer;transition:border-color .15s,background-color .15s;}
.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id])::before,.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id])::after{content:none !important;display:none !important;}
.ui-pp .ui-pp__empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:12px;text-align:center;}
.ui-pp .ui-pp__ic{width:48px;height:48px;border-radius:999px;background:var(--ui-primary-soft);color:var(--ui-primary);display:inline-flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:6px;}
.ui-pp .ui-pp__t1{font-size:14px;font-weight:600;color:var(--ui-text);}
.ui-pp .ui-pp__t2{font-size:12.5px;color:var(--ui-muted);}
.ui-pp .ui-pp__t3{display:none;font-size:14px;font-weight:600;color:var(--ui-primary);}
.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id]):not(.is-readonly)[data-state="empty"]:is(:hover,:focus-visible,.is-drag){border-color:var(--ui-primary) !important;background-color:var(--ui-primary-soft) !important;outline:none;}
.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id]).is-drag{border-color:var(--ui-primary) !important;}
.ui-pp .ui-pp__tile.is-drag .ui-pp__t1,.ui-pp .ui-pp__tile.is-drag .ui-pp__t2{display:none;}
.ui-pp .ui-pp__tile.is-drag .ui-pp__t3{display:block;}
.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id]).is-drag[data-state="chosen"]{border:1.5px dashed var(--ui-primary) !important;}
.ui-pp .ui-pp__tile.is-readonly{cursor:default;}
.ui-pp .ui-pp__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:none;}
.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id])[data-state="chosen"]{border:0 !important;}   /* a filled tile inside the side card — no third border */
.ui-pp .ui-pp__tile[data-state="chosen"] .ui-pp__img{display:block;}
.ui-pp .ui-pp__tile[data-state="chosen"] .ui-pp__empty{display:none;}
.ui-pp .ui-pp__tile.is-drag[data-state="chosen"] .ui-pp__empty{display:flex;background:color-mix(in srgb,var(--ui-primary-soft) 88%,transparent);z-index:2;}
.ui-pp .ui-pp__ov{position:absolute;inset:0;display:none;align-items:flex-end;justify-content:center;gap:8px;padding:12px;background:linear-gradient(to top,rgba(0,0,0,.45),rgba(0,0,0,.45));}
.ui-pp .ui-pp__tile[data-state="chosen"]:is(:hover,:focus-within) .ui-pp__ov{display:flex;}
.ui-pp .ui-pp__btn{display:inline-flex;align-items:center;gap:4px;height:30px;padding:0 10px;border-radius:8px;border:0;background:rgba(255,255,255,.95);color:#0f1f38;font-size:12.5px;font-weight:600;cursor:pointer;}
.ui-pp .ui-pp__btn:hover{background:#fff;}
.ui-pp .ui-pp__btn[data-pp="remove"]{color:#b42318;}
.ui-pp .ui-pp__tile:not(.has-new) .ui-pp__btn[data-pp="remove"]{display:none;}
.ui-pp .ui-pp__meta{font-size:12.5px;color:var(--ui-muted);text-align:center;margin-top:8px;min-height:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-pp .ui-pp__meta:empty{display:none;}
.ui-pp .ui-pp__hint{font-size:12px;color:var(--ui-muted);text-align:center;margin:8px 0 0;}
.ui-pp .ui-pp__err{font-size:12.5px;color:var(--ui-danger);text-align:center;margin:6px 0 0;}
.ui-pp .ui-pp__sec--doc .ui-pp__err{text-align:left;}
/* document */
.ui-pp .ui-pp__doc.file-container{display:block !important;min-height:0 !important;border:0 !important;padding:0 !important;background:none !important;height:auto !important;overflow:visible !important;}
.ui-pp .ui-pp__zone{display:flex;align-items:center;gap:12px;width:100%;padding:14px;border:1.5px dashed var(--ui-border-strong);border-radius:12px;background:var(--ui-surface-2);cursor:pointer;transition:border-color .15s,background-color .15s;}
.ui-pp .ui-pp__zone:is(:hover,.is-drag){border-color:var(--ui-primary);background:var(--ui-primary-soft);}
.ui-pp .ui-pp__zic{width:36px;height:36px;flex:none;border-radius:10px;background:var(--ui-surface);color:var(--ui-primary);display:inline-flex;align-items:center;justify-content:center;font-size:18px;}
.ui-pp .ui-pp__zt{display:flex;flex-direction:column;min-width:0;}
.ui-pp .ui-pp__zt b{font-size:13.5px;font-weight:600;color:var(--ui-text);}
.ui-pp .ui-pp__zt small{font-size:12px;color:var(--ui-muted);}
.ui-pp .ui-pp__doc.has-file .ui-pp__zone{display:none;}
.ui-pp .ui-pp__chips:empty{display:none;}
.ui-pp .ui-pp__doc.has-file .ui-pp__chips{margin-top:0;}
.ui-pp .ui-pp__chip[hidden]{display:none;}
/* 1024–1279 (and tablet): the panel becomes a horizontal strip above the fields */
@media (max-width:1279px){
  .ui-flayout:has(> .ui-pp){grid-template-columns:minmax(0,1fr);}
  .ui-flayout > .ui-pp{order:-1;}
  .ui-pp.ui-fside{position:static;display:grid;grid-template-columns:120px minmax(0,1fr);column-gap:24px;align-items:start;}
  .ui-pp.ui-fside > .ui-fsec__head{grid-column:1 / -1;}
  .ui-pp.ui-fside > .ui-pp__sec--photo{grid-column:1;grid-row:span 10;}
  .ui-pp.ui-fside > :is(.ui-pp__sec--doc,.ui-pp__div){grid-column:2;}
  .ui-pp.ui-fside > .ui-pp__div{margin:12px 0;}
  .ui-pp.ui-fside > .ui-pp__sec--photo + .ui-pp__div{display:none;}
  .ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id]){max-width:120px !important;}
  .ui-pp .ui-pp__ic{width:36px;height:36px;font-size:18px;margin-bottom:2px;}
  .ui-pp .ui-pp__t1{font-size:12.5px;}
  .ui-pp .ui-pp__t2{display:none;}
  .ui-pp .ui-pp__hint{text-align:left;}
  .ui-pp.ui-fside:not(:has(.ui-pp__sec--doc)){grid-template-columns:120px minmax(0,1fr);}
}
/* phones: full-width panel above the fields, 160px tile centred */
@media (max-width:639px){
  .ui-pp.ui-fside{display:block;padding:16px;}
  .ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id]){max-width:160px !important;}
  .ui-pp .ui-pp__t2{display:block;}
  .ui-pp .ui-pp__hint{text-align:center;}
  .ui-pp.ui-fside > .ui-pp__sec--photo + .ui-pp__div{display:block;margin:16px 0;}
}
/* panel used inside a card (profile) */
.ui-pp.ui-pp--inline.ui-fside{position:static;border:0;padding:0;background:none;}
.ui-pp .ui-pp__btn i{color:inherit !important;font-size:14px;}

/* =====================================================================
   PAGE SHELL + SPACING RHYTHM — the only vertical gaps allowed
   topbar → .ui-page (24px / 16px <640, max 1600) → ui-page-header → content
   ===================================================================== */
:root{--ui-backdrop:rgba(17,26,46,.55);
  --ui-gap-page-top:24px;   /* topbar → page header */
  --ui-gap-header:20px;     /* page header → first card / strip / toolbar */
  --ui-gap-block:20px;      /* between cards, strips, toolbars, tables */
  --ui-gap-section:28px;    /* between form sections inside a card (1px divider) */
  --ui-gap-sechead:16px;    /* section heading → its fields */
  --ui-gap-field-row:16px;  /* ui-fgrid row gap */
  --ui-gap-field-col:20px;  /* ui-fgrid column gap */
  --ui-card-pad:24px;
}
@media (max-width:639px){:root{--ui-card-pad:16px;--ui-gap-page-top:16px;}}
/* outer wrappers add nothing: the page owns the gutter (24px, aligned with the topbar card) */
.main-content{padding-left:0 !important;padding-right:0 !important;}
.ui-topbar{margin-bottom:0 !important;}
@media (min-width:1280px){
  html[data-sidebar-size="lg"] .ui-topbar{margin-left:calc(280px + 16px + 24px) !important;margin-right:24px !important;}
  html[data-sidebar-size="sm"] .ui-topbar{margin-left:calc(70px + 16px + 24px) !important;margin-right:24px !important;}
}
.ui-page{max-width:1600px;margin:0 auto;padding:var(--ui-gap-page-top) 24px 32px;}
@media (max-width:639px){.ui-page{padding:var(--ui-gap-page-top) 16px 24px;}}
.ui-page > :first-child{margin-top:0 !important;}
/* block gap after every VISIBLE block (hidden modals/scripts placed first don't push the header down) */
.ui-page > :not(script,style,link,template,input[type="hidden"],[hidden],dialog,.modal,.ui-pop,[class*="-modal"]) ~ *, .ui-page__body > :not(script,style,link,template,input[type="hidden"],[hidden],dialog,.modal,.ui-pop,[class*="-modal"]) ~ *{margin-top:var(--ui-gap-block);}
.ui-page .ui-page-header{margin-bottom:var(--ui-gap-header);}
.ui-page > .ui-page-header + *, .ui-page__body > .ui-page-header + *{margin-top:0;}
.ui-page-header__title{font-size:22px;font-weight:600;}
.ui-page-header__desc{font-size:13.5px;}
/* card padding token */
.ui-page .ui-card-pad, .ui-page form.card, .ui-page .card.ui-formcard{padding:var(--ui-card-pad);}
/* form sections inside a card: 28px between, 1px divider; heading → fields 16px */
.ui-page .ui-fsec:not(.ui-fsec--boxed){padding:0;}
.ui-page .ui-fsec + .ui-fsec:not(.ui-fsec--boxed), .ui-page .ui-fsec + .ui-flayout, .ui-page .ui-flayout + .ui-fsec{margin-top:var(--ui-gap-section);padding-top:var(--ui-gap-section);border-top:1px solid var(--ui-border);}
.ui-page .ui-fsec + .ui-fsec--boxed, .ui-page .ui-fsec--boxed + .ui-fsec{margin-top:var(--ui-gap-section);}
.ui-page .ui-fsec--boxed{padding:16px;}
.ui-page .ui-flayout .ui-fsec + .ui-fsec:not(.ui-fsec--boxed){margin-top:var(--ui-gap-section);}
.ui-page .ui-fsec__head{margin-bottom:var(--ui-gap-sechead);}
.ui-fgrid{row-gap:var(--ui-gap-field-row) !important;column-gap:var(--ui-gap-field-col) !important;}
/* number inputs: no spinners, right-aligned */
input[type=number]{-moz-appearance:textfield;appearance:textfield;text-align:right;}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
/* alert slots render nothing when empty */
.inc-alert:empty,.ui-alert:empty,[id^="msg"]:empty,.flash:empty,.alert-area:empty{display:none !important;}
.ui-alert{position:relative;}
.ui-alert__x{margin-left:auto;border:0;background:transparent;color:inherit;opacity:.7;cursor:pointer;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;}
.ui-alert__x:hover{opacity:1;background:rgba(0,0,0,.06);}
.ui-page form.card.ui-formcard{margin:0;}
.ui-page form.card.ui-formcard > .ui-ffoot{margin:24px calc(-1 * var(--ui-card-pad)) calc(-1 * var(--ui-card-pad));padding:16px var(--ui-card-pad);border-radius:0 0 14px 14px;}

/* =====================================================================
   PAGINATION (components/pagination.php + assets/js/ui-pagination.js)
   one row under the table, inside its card: info left · rows-per-page + buttons right
   ===================================================================== */
.ui-pg{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;padding:16px;border-top:1px solid var(--ui-border);margin:0;}
.ui-pg[data-state="empty"]{display:none;}
.ui-pg[data-state="loading"] .ui-pg__nav:empty{display:none;}
.ui-pg__info{font-size:13px;color:var(--ui-muted);min-width:0;}
.ui-pg__info b{font-weight:600;color:var(--ui-text);font-variant-numeric:tabular-nums;}
.ui-pg__ctrl{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-left:auto;}
.ui-pg__per{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:var(--ui-muted);margin:0;}
.ui-pg .ui-pg__select{height:40px;width:auto;min-width:76px;padding:0 32px 0 12px;font-size:13px;}
.ui-pg__nav{display:inline-flex;align-items:center;gap:4px;margin:0;padding:0;border:0;background:none;}
.ui-pg__pages{display:inline-flex;align-items:center;gap:4px;}
.ui-pg__btn{min-width:36px;height:36px;padding:0 8px;border-radius:10px;border:0;background:transparent;color:var(--ui-text-2);font-size:13px;font-weight:500;
  font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background-color .12s;}
.ui-pg__btn:hover:not(:disabled):not(.is-current){background:var(--ui-surface-2);color:var(--ui-text);}
.ui-pg__btn:focus-visible{outline:2px solid var(--ui-primary);outline-offset:1px;}
.ui-pg__btn.is-current{background:var(--ui-primary);color:#fff;}
.ui-pg__btn:disabled{opacity:.4;cursor:default;}
.ui-pg__btn--icon{font-size:18px;}
.ui-pg__gap{min-width:24px;height:36px;display:inline-flex;align-items:center;justify-content:center;color:var(--ui-muted);font-size:13px;}
.ui-pg .ui-pg__compact{display:none;font-size:13px;color:var(--ui-muted);padding:0 6px;white-space:pre;}
.ui-pg__compact b{color:var(--ui-text);font-weight:600;}
.ui-pg__go{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--ui-muted);margin:0 0 0 8px;}
.ui-pg .ui-pg__goinput{width:56px;height:36px;border:1px solid var(--ui-border-strong);border-radius:10px;background:var(--ui-surface);color:var(--ui-text);padding:0 8px;font-size:13px;text-align:center;}
.ui-pg[data-state="single"] .ui-pg__nav{display:none;}
.ui-pg.is-loading .ui-pg__btn{pointer-events:none;opacity:.4;}
@media (max-width:639px){
  .ui-pg{flex-direction:column;align-items:stretch;}
  .ui-pg__info{width:100%;}
  .ui-pg__ctrl{margin-left:0;justify-content:space-between;width:100%;}
  .ui-pg__pages,.ui-pg__go{display:none;}
  .ui-pg .ui-pg__compact{display:inline;}
}
/* host sits inside the table card: no outer margins of its own */
.card > .ui-pg, .ui-card > .ui-pg{margin:0;}

/* =====================================================================
   EMPTY STATE (components/empty_state.php + uiEmpty() in assets/js/ui.js)
   ===================================================================== */
.ui-empty2{display:flex;flex-direction:column;align-items:center;text-align:center;padding:48px 16px;}
.ui-empty2__ic{width:48px;height:48px;border-radius:999px;background:var(--ui-surface-2);color:var(--ui-muted);display:inline-flex;align-items:center;justify-content:center;font-size:22px;margin-bottom:14px;}
.ui-empty2--danger .ui-empty2__ic{background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-empty2__title{font-size:15px;font-weight:600;color:var(--ui-text);}
.ui-empty2__hint{font-size:13.5px;color:var(--ui-muted);margin-top:4px;max-width:420px;}
.ui-empty2__acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px;}
.ui-empty2__acts .ui-btn{height:36px;}
.ui-empty2--compact{padding:32px 16px;}
.ui-empty2--compact .ui-empty2__ic{width:36px;height:36px;font-size:17px;margin-bottom:10px;}
.ui-empty-row > td{padding:0 !important;border:0 !important;background:transparent !important;}
.ui-empty-row:hover > td{background:transparent !important;}

/* active-filter chips above the table */
.ui-filterchips[hidden]{display:none;}
.ui-filterchip__clear{border:0;background:none;color:var(--ui-muted);font-size:12.5px;text-decoration:underline;cursor:pointer;padding:0 4px;}
.ui-stack > * + *{margin-top:var(--ui-gap-block);}
.ui-page--narrow{max-width:1200px;}

/* =====================================================================
   MODAL BODY RHYTHM — 24px padding, 20px between groups (16px on phones)
   ===================================================================== */
.ui-pop__body,.ui-modal__body,.ui-drawer__body{padding:24px;}
.ui-pop__body > * + *:not(.ui-pop__foot):not([type="hidden"]),.ui-modal__body > * + *{margin-top:20px;}
.ui-pop__body > .ui-pop__foot,.ui-pop__body .ui-pop__foot{margin:24px -24px -24px;bottom:-24px;}
@media (max-width:560px){
  .ui-pop__body,.ui-modal__body,.ui-drawer__body{padding:16px;}
  .ui-pop__body > .ui-pop__foot,.ui-pop__body .ui-pop__foot{margin:16px -16px -16px;bottom:-16px;}
}
/* the chip row sits inside the table card, aligned with the table */
.card > .ui-filterchips,.ui-card > .ui-filterchips{margin:0 0 12px;}
/* pages without a sidebar (profile): topbar centred over the narrow page, page-top gap = token */
@media (max-width:1279px){.ui-topbar.ui-topbar--solo{margin:0 !important;max-width:none;}}
@media (min-width:1280px){html[data-sidebar-size] .ui-topbar.ui-topbar--solo{margin-left:auto !important;margin-right:auto !important;}}

/* =====================================================================
   ACCOUNT POPUP (components/account_popup.php + assets/js/ui-account.js)
   anchored 320px panel under the topbar avatar; bottom sheet < 640px
   ===================================================================== */
.ui-acct-trigger{cursor:pointer;}
.ui-acct-trigger:focus-visible{outline:2px solid var(--ui-primary);outline-offset:2px;}
.ui-acct-trigger__chev{font-size:16px;color:var(--ui-muted);transition:transform .15s var(--ui-ease);margin-left:-2px;}
.ui-acct-trigger.is-open{background:var(--ui-surface-2);}
.ui-acct-trigger.is-open .ui-acct-trigger__chev{transform:rotate(180deg);}
.ui-acct[hidden]{display:none !important;}
.ui-acct{position:fixed;inset:0;z-index:1200;pointer-events:none;}
.ui-acct__backdrop{display:none;}
.ui-acct__panel{position:fixed;width:320px;max-width:calc(100vw - 16px);max-height:calc(100vh - 88px);overflow:auto;pointer-events:auto;
  background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:16px;box-shadow:var(--ui-shadow-md);color:var(--ui-text);
  opacity:0;transform:translateY(-4px);transition:opacity .14s var(--ui-ease),transform .14s var(--ui-ease);outline:none;}
.ui-acct.is-open .ui-acct__panel{opacity:1;transform:none;}
.ui-acct__grab{display:none;}
.ui-acct__head{display:flex;gap:12px;align-items:flex-start;padding:16px;}
.ui-acct .ui-avatar.ui-acct__avatar{width:48px;height:48px;font-size:17px;font-weight:600;}
.ui-acct__who{min-width:0;flex:1;}
.ui-acct__name{font-size:15px;font-weight:600;line-height:1.3;display:flex;align-items:center;gap:8px;flex-wrap:wrap;word-break:break-word;}
.ui-acct__status{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:500;color:var(--ui-success);}
.ui-acct__status .dot{width:7px;height:7px;border-radius:50%;background:currentColor;}
.ui-acct__status.is-off{color:var(--ui-muted);}
.ui-acct__meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px;}
.ui-acct__uname{font-family:var(--ui-mono);font-size:11.5px;font-weight:500;padding:2px 7px;border-radius:6px;background:var(--ui-surface-2);color:var(--ui-text-2);}
.ui-acct__meta .ui-badge{font-size:11.5px;padding:3px 8px;}
.ui-acct__email{font-size:12.5px;color:var(--ui-muted);margin-top:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-acct__facts{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 16px 12px;}
.ui-acct__fact{background:var(--ui-surface-2);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;min-width:0;}
.ui-acct__facts .ui-acct__fact:only-child{grid-column:1 / -1;}
.ui-acct__flabel{font-size:11.5px;color:var(--ui-muted);}
.ui-acct__fact b{font-size:13px;font-weight:600;color:var(--ui-text);font-variant-numeric:tabular-nums;}
.ui-acct__fsub{font-size:11.5px;color:var(--ui-muted);}
.ui-acct__menu{padding:8px;border-top:1px solid var(--ui-border);}
.ui-acct__item{display:flex;align-items:center;gap:10px;height:40px;padding:0 10px;border-radius:8px;font-size:14px;font-weight:500;color:var(--ui-text);text-decoration:none;}
.ui-acct__item i{font-size:18px;color:var(--ui-muted);width:20px;text-align:center;}
.ui-acct__item:hover,.ui-acct__item:focus-visible{background:var(--ui-surface-2);outline:none;}
.ui-acct__item:focus-visible{box-shadow:inset 0 0 0 2px var(--ui-primary);}
.ui-acct__item--danger,.ui-acct__item--danger i{color:var(--ui-danger);}
.ui-acct__item--danger:hover{background:var(--ui-danger-soft);}
.ui-acct__sep{height:1px;background:var(--ui-border);margin:6px 2px;}
.ui-acct__theme{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 10px;min-height:40px;}
.ui-acct__tlabel{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500;}
.ui-acct__tlabel i{font-size:18px;color:var(--ui-muted);width:20px;text-align:center;}
.ui-acct__seg{display:inline-flex;padding:2px;border-radius:8px;background:var(--ui-surface-2);}
.ui-acct__seg button{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 8px;border:0;border-radius:6px;background:transparent;
  font-size:12px;font-weight:500;color:var(--ui-text-2);cursor:pointer;}
.ui-acct__seg button i{font-size:13px;}
.ui-acct__seg button.is-on{background:var(--ui-surface);color:var(--ui-text);box-shadow:var(--ui-shadow-xs, 0 1px 2px rgba(15,31,56,.08));}
.ui-acct__seg button:focus-visible{outline:2px solid var(--ui-primary);outline-offset:1px;}
.ui-acct__foot{padding:10px 16px 12px;border-top:1px solid var(--ui-border);font-size:12px;color:var(--ui-muted);text-align:center;}
/* phones: the same bottom sheet as the ui-modal component */
.ui-acct--sheet{pointer-events:auto;}
.ui-acct--sheet .ui-acct__backdrop{display:block;position:absolute;inset:0;background:rgba(17,26,46,.55);opacity:0;transition:opacity .16s var(--ui-ease);}
.ui-acct--sheet.is-open .ui-acct__backdrop{opacity:1;}
.ui-acct--sheet .ui-acct__panel{left:0;right:0 !important;bottom:0;top:auto !important;width:100%;max-width:none;max-height:92vh;border-radius:16px 16px 0 0;
  border-bottom:0;transform:translateY(24px);padding-bottom:env(safe-area-inset-bottom);}
.ui-acct--sheet.is-open .ui-acct__panel{transform:none;}
.ui-acct--sheet .ui-acct__grab{display:block;width:40px;height:4px;border-radius:4px;background:var(--ui-border-strong);margin:8px auto 0;}
.ui-acct--sheet .ui-acct__item{height:44px;}
@media (prefers-reduced-motion:reduce){.ui-acct__panel,.ui-acct__backdrop,.ui-acct-trigger__chev{transition:none;}}

/* =====================================================================
   FILE VIEWER (assets/js/ui-file-viewer.js) — ui-modal xl look; full-screen sheet < 640px
   ===================================================================== */
html.ui-fv-open{overflow:hidden;}
.ui-fv{position:fixed;inset:0;z-index:1300;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(17,26,46,.62);}
.ui-fv[hidden]{display:none;}
.ui-fv__card{display:flex;flex-direction:column;width:100%;max-width:1080px;height:min(88vh,860px);background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:16px;box-shadow:var(--ui-shadow-lg);overflow:hidden;}
.ui-fv__head{display:flex;align-items:center;gap:12px;padding:14px 16px 14px 20px;border-bottom:1px solid var(--ui-border);flex:none;}
.ui-fv__ic{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:18px;}
.ui-fv__titles{flex:1;min-width:0;}
.ui-fv__title{margin:0;font-size:16px;font-weight:600;color:var(--ui-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ui-fv__sub{margin:2px 0 0;font-size:12.5px;color:var(--ui-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ui-fv__acts{display:flex;align-items:center;gap:8px;flex:none;}
.ui-fv__tools{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 12px;border-bottom:1px solid var(--ui-border);background:var(--ui-surface-2);flex:none;}
.ui-fv__tools[hidden]{display:none;}
.ui-fv__tools button{height:30px;min-width:32px;padding:0 10px;border:1px solid var(--ui-border);border-radius:8px;background:var(--ui-surface);color:var(--ui-text-2);font-size:12.5px;font-weight:500;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;}
.ui-fv__tools button.is-on{border-color:var(--ui-primary);color:var(--ui-primary);background:var(--ui-primary-soft);}
.ui-fv__tools button:focus-visible{outline:2px solid var(--ui-primary);outline-offset:1px;}
.ui-fv__pct{min-width:44px;text-align:center;font-size:12.5px;color:var(--ui-muted);font-variant-numeric:tabular-nums;}
.ui-fv__stage{position:relative;flex:1;min-height:0;display:flex;background:var(--ui-surface-2);}
.ui-fv__body{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:pinch-zoom pan-x pan-y;cursor:grab;}
.ui-fv__body.is-drag{cursor:grabbing;}
.ui-fv__body img{max-width:none;user-select:none;transition:transform .12s ease;transform-origin:center center;}
.ui-fv__body.is-fit img{max-width:calc(100% - 32px);max-height:calc(100% - 32px);object-fit:contain;cursor:default;}
.ui-fv__body iframe{width:100%;height:100%;border:0;background:#fff;}
.ui-fv__skel{width:min(520px,80%);height:60%;}
.ui-fv__skel .ui-skeleton{display:block;width:100%;height:100%;border-radius:12px;}
.ui-fv__card2{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;padding:24px;max-width:360px;}
.ui-fv__card2 b{font-size:15px;color:var(--ui-text);word-break:break-all;}
.ui-fv__card2 span{font-size:13px;color:var(--ui-muted);}
.ui-fv__card2 .ui-btn{margin-top:8px;}
.ui-fv__bigic{width:64px;height:64px;border-radius:16px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:30px;}
.ui-fv__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:40px;height:40px;border-radius:999px;border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-text);font-size:20px;display:grid;place-items:center;cursor:pointer;box-shadow:var(--ui-shadow-xs, none);}
.ui-fv__nav[hidden]{display:none;}
.ui-fv__nav--prev{left:12px;} .ui-fv__nav--next{right:12px;}
.ui-fv__strip{display:flex;gap:8px;padding:10px 16px;border-top:1px solid var(--ui-border);overflow-x:auto;flex:none;}
.ui-fv__strip[hidden]{display:none;}
.ui-fv__thumb{flex:none;width:56px;height:56px;border-radius:10px;border:2px solid transparent;background:var(--ui-surface-2);overflow:hidden;cursor:pointer;display:grid;place-items:center;color:var(--ui-muted);font-size:20px;padding:0;}
.ui-fv__thumb img{width:100%;height:100%;object-fit:cover;}
.ui-fv__thumb.is-on{border-color:var(--ui-primary);}
.ui-fv__printframe{position:fixed;width:0;height:0;border:0;visibility:hidden;}
[data-ui-file]{cursor:pointer;}
@media (max-width:639px){
  .ui-fv{padding:0;}
  .ui-fv__card{max-width:none;height:100%;border-radius:0;border:0;}
  .ui-fv__acts .ui-btn span{display:none;}
  .ui-fv__acts .ui-btn{padding:0 9px;}
  .ui-fv__head{padding:10px 10px 10px 14px;gap:8px;}
  .ui-fv__ic{display:none;}
}

/* =====================================================================
   Account modal (components/account_modal.php · assets/js/ui-account-modal.js)
   One window for My profile / Security / Activity on every page. xl card (960px),
   fixed header + gold-underline tabs, scrolling body, sticky footer per tab;
   full-screen sheet under 640px. Tokens only.
   ===================================================================== */
.ui-acm[hidden],.ui-acm-confirm[hidden]{display:none !important;}
.ui-acm .ui-pop__card{max-width:960px;height:min(780px,calc(100vh - 32px));max-height:calc(100vh - 32px);}
.ui-acm__x{position:absolute;top:14px;right:14px;z-index:2;}
.ui-acm__head{padding:22px 24px 0;flex:none;border-bottom:0;}
.ui-acm__hero{display:flex;gap:16px;align-items:flex-start;padding-right:44px;}
.ui-acm .ui-avatar.ui-acm__avatar{width:56px;height:56px;font-size:20px;font-weight:700;background:var(--ui-primary-soft);color:var(--ui-primary);border:1px solid var(--ui-border);}
.ui-acm .ui-avatar.ui-acm__avatar img{width:100%;height:100%;object-fit:cover;}
.ui-acm__who{min-width:0;flex:1;}
.ui-acm__name{margin:0;font-size:20px;font-weight:700;line-height:1.3;display:flex;align-items:center;gap:10px;flex-wrap:wrap;color:var(--ui-text);}
.ui-acm__name .ui-rid{font-weight:600;}
.ui-acm__meta{display:flex;align-items:center;gap:8px 14px;flex-wrap:wrap;margin-top:6px;font-size:13.5px;color:var(--ui-muted);}
.ui-acm__email{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}
.ui-acm__status{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ui-success);}
.ui-acm__status .dot{width:7px;height:7px;border-radius:50%;background:currentColor;}
.ui-acm__status.is-off{color:var(--ui-muted);}
.ui-acm__facts.ui-dh__facts{margin:16px 0 0;padding:14px 0 16px;grid-template-columns:repeat(4,minmax(0,1fr));}
.ui-acm__facts dd{font-variant-numeric:tabular-nums;}
.ui-acm__skel .ui-skeleton{display:block;}
.ui-acm__skel .ui-acm__avatar{border-radius:999px;}
.ui-acm__tabs.ui-dtabs{padding:0 24px;flex:none;border-top:1px solid var(--ui-border);border-bottom:1px solid var(--ui-border);}
.ui-acm__body.ui-pop__body{padding:20px 24px 24px;display:flex;flex-direction:column;}
.ui-acm__body > * + *{margin-top:0;}
.ui-acm__panel[hidden]{display:none;}
.ui-acm__panel{display:flex;flex-direction:column;flex:1;min-height:0;}
.ui-acm__panel:focus-visible{outline:none;}
.ui-acm__loading{display:flex;flex-direction:column;}
.ui-acm__form{display:flex;flex-direction:column;flex:1;}
.ui-acm__cols{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px;align-items:start;}
.ui-acm__cols--sec{grid-template-columns:minmax(0,1fr) 320px;}
.ui-acm__main{display:flex;flex-direction:column;gap:20px;min-width:0;}
.ui-acm__side{display:flex;flex-direction:column;gap:20px;min-width:0;}
.ui-acm__fsec,.ui-acm__card{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;padding:20px;min-width:0;}
.ui-acm__card .ui-fsec__head{margin-bottom:14px;}
.ui-acm__card .ui-table-wrap{border:1px solid var(--ui-border);border-radius:10px;overflow:auto;}
.ui-acm__card .ui-pg{margin-top:12px;}
.ui-acm__photo.ui-fside{position:sticky;top:0;max-height:calc(100vh - 16px);overflow:auto;padding:16px;}
.ui-acm__photo .ui-pp__sec--photo{display:flex;flex-direction:column;align-items:center;}
.ui-acm__photo .ui-pp__sec--photo .ui-pp__h{align-self:flex-start;}
.ui-acm__photoerr{grid-column:1 / -1;}
.ui-acm__form .form-input.is-readonly{background:var(--ui-surface-2);color:var(--ui-text-2);cursor:default;}
.ui-acm__form .form-input.is-invalid{border-color:var(--ui-danger) !important;box-shadow:0 0 0 3px var(--ui-danger-soft);}
.ui-acm__form .ui-field__error{margin:6px 0 0;font-size:12.5px;color:var(--ui-danger);}
.ui-acm__form .ui-field__help{margin:6px 0 0;}
.ui-acm__foot.ui-pop__foot{margin-top:auto;}
.ui-acm__body .ui-acm__foot.ui-pop__foot{margin:20px -24px -24px;position:sticky;bottom:-24px;z-index:1;}
/* password */
.ui-acm__pw{position:relative;}
.ui-acm__pw .form-input{padding-right:44px;}
.ui-acm__eye{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:8px;border:0;background:transparent;color:var(--ui-muted);display:grid;place-items:center;font-size:18px;cursor:pointer;}
.ui-acm__eye:hover{background:var(--ui-surface-2);color:var(--ui-text);}
.ui-acm__eye:focus-visible{outline:2px solid var(--ui-primary);outline-offset:1px;}
.ui-acm__meter{height:6px;border-radius:999px;background:var(--ui-surface-2);margin-top:8px;overflow:hidden;}
.ui-acm__meter span{display:block;height:100%;width:0;border-radius:999px;background:var(--ui-danger);transition:width .2s var(--ui-ease),background .2s var(--ui-ease);}
.ui-acm__meter.is-fair span{background:var(--ui-warning);} .ui-acm__meter.is-good span{background:var(--ui-info);} .ui-acm__meter.is-strong span{background:var(--ui-success);}
.ui-acm__rules{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13px;color:var(--ui-muted);}
.ui-acm__rules li{display:flex;align-items:center;gap:8px;}
.ui-acm__rules li i{font-size:16px;color:var(--ui-border-strong);}
.ui-acm__rules li.is-ok{color:var(--ui-success);} .ui-acm__rules li.is-ok i{color:var(--ui-success);}
/* sign-ins timeline table */
.ui-acm__tl td:first-child{position:relative;padding-left:26px !important;}
.ui-acm__tl td:first-child::before{content:"";position:absolute;left:10px;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:var(--ui-success);}
.ui-acm__tl tr.is-fail td:first-child::before{background:var(--ui-danger);}
.ui-acm__tl tbody tr + tr td:first-child::after{content:"";position:absolute;left:13px;top:-50%;height:100%;border-left:2px solid var(--ui-border);z-index:-1;}
/* devices */
.ui-acm__devs .ui-rel__row{align-items:center;gap:10px;}
.ui-acm__devs .ui-badge{flex:none;}
.ui-acm__revoke{flex:none;color:var(--ui-danger);}
.ui-acm__revoke:hover{background:var(--ui-danger-soft);color:var(--ui-danger);}
/* activity */
.ui-acm__tiles .ui-mtiles{grid-template-columns:repeat(3,minmax(0,1fr));}
.ui-acm__listhead{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap;margin-bottom:14px;}
.ui-acm__listhead .ui-fsec__head{margin-bottom:0;}
.ui-acm__filter{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ui-muted);white-space:nowrap;}
.ui-acm__filter select{min-width:180px;height:40px !important;}
.ui-acm__live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
/* toasts (window.uiToast in assets/js/ui.js) */
.ui-toasts{position:fixed;right:16px;bottom:16px;z-index:1400;display:flex;flex-direction:column;gap:8px;pointer-events:none;max-width:calc(100vw - 32px);}
.ui-toast{pointer-events:auto;display:flex;align-items:center;gap:10px;min-width:260px;max-width:380px;padding:10px 10px 10px 12px;border-radius:12px;background:var(--ui-surface);
  border:1px solid var(--ui-border);box-shadow:var(--ui-shadow-lg);color:var(--ui-text);font-size:14px;opacity:0;transform:translateY(8px);transition:opacity .18s var(--ui-ease),transform .18s var(--ui-ease);}
.ui-toast.is-in{opacity:1;transform:none;}
.ui-toast__ic{flex:none;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--ui-success-soft);color:var(--ui-success);font-size:16px;}
.ui-toast__ic i{color:inherit !important;}
.ui-toast--error .ui-toast__ic{background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-toast--info .ui-toast__ic{background:var(--ui-primary-soft);color:var(--ui-primary);}
.ui-toast__msg{flex:1;min-width:0;}
.ui-toast__x{flex:none;width:28px;height:28px;border-radius:8px;border:0;background:transparent;color:var(--ui-muted);display:grid;place-items:center;font-size:18px;cursor:pointer;}
.ui-toast__x:hover{background:var(--ui-surface-2);color:var(--ui-text);}
@media (max-width:1023px){
  .ui-acm__cols,.ui-acm__cols--sec{grid-template-columns:1fr;}
  .ui-acm__photo.ui-fside{position:static;}
  .ui-acm__facts.ui-dh__facts{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:639px){
  .ui-acm{padding:0 !important;align-items:stretch !important;}
  .ui-acm .ui-pop__card{max-width:none;height:100%;max-height:none;border-radius:0 !important;border:0;}
  .ui-acm__head{padding:16px 16px 0;}
  .ui-acm__hero{gap:12px;}
  .ui-acm__name{font-size:18px;}
  .ui-acm__tabs.ui-dtabs{padding:0 16px;gap:14px;}
  .ui-acm__body.ui-pop__body{padding:16px;}
  .ui-acm__body .ui-acm__foot.ui-pop__foot{margin:16px -16px -16px;bottom:-16px;}
  .ui-acm__fsec,.ui-acm__card{padding:16px;}
  .ui-acm__tiles .ui-mtiles{grid-template-columns:repeat(2,minmax(0,1fr));}
  .ui-acm__listhead .ui-acm__filter{width:100%;} .ui-acm__filter select{flex:1;}
  .ui-toasts{right:8px;left:8px;bottom:8px;} .ui-toast{min-width:0;max-width:none;}
}
@media (prefers-reduced-motion:reduce){.ui-toast,.ui-acm__meter span{transition:none;}}

/* =====================================================================
   ID card designs (workload/cardDesignList.php · cardDesignView.php · assets/js/idcard-design.js)
   Gallery cards with HTML previews of each design, the layout editor with live preview, artwork panel.
   ===================================================================== */
.ui-cdz-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:16px;}
.ui-cdz{display:flex;flex-direction:column;gap:14px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;padding:18px;}
.ui-cdz__previews{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;align-items:flex-start;}
.ui-cdz__previews--large{gap:20px;padding:8px 0 4px;}
.ui-cdz__side{display:flex;flex-direction:column;align-items:center;gap:6px;}
.ui-cdz__label{font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);}
.ui-cdz__head{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;}
.ui-cdz__title{margin:0;font-size:15px;font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.ui-cdz__facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0;}
.ui-cdz__facts dt{font-size:12px;color:var(--ui-muted);} .ui-cdz__facts dd{margin:2px 0 0;font-size:14px;font-weight:600;color:var(--ui-text);font-variant-numeric:tabular-nums;}
.ui-cdz__acts{display:flex;gap:8px;flex-wrap:wrap;}
/* the rendered card (mm → px done by JS) */
.ui-cdz-card{position:relative;overflow:hidden;border-radius:6px;box-shadow:0 1px 3px rgba(16,24,40,.25);background-repeat:no-repeat;background-position:center;color:#000;line-height:1.2;}
.ui-cdz-card > *{position:absolute;box-sizing:border-box;}
.ui-cdz-f{display:flex;align-items:center;white-space:nowrap;overflow:hidden;}
.ui-cdz-f.is-multi{display:-webkit-box;-webkit-box-orient:vertical;white-space:normal;}
.ui-cdz-cover{display:block;}
.ui-cdz-photo{display:grid;place-items:center;background:#eaeffa;color:#1b3a8a;font-weight:700;font-family:var(--ui-font);overflow:hidden;}
.ui-cdz-barcode{background:repeating-linear-gradient(90deg,currentColor 0 2px,transparent 2px 3px,currentColor 3px 4px,transparent 4px 7px,currentColor 7px 8px,transparent 8px 9px);opacity:.9;}
.ui-cdz-qrtile{display:block;border-radius:6px;}
.ui-cdz-qr{width:100%;height:100%;background:
  linear-gradient(currentColor,currentColor) 0 0/28% 28% no-repeat,linear-gradient(currentColor,currentColor) 100% 0/28% 28% no-repeat,linear-gradient(currentColor,currentColor) 0 100%/28% 28% no-repeat,
  repeating-linear-gradient(90deg,currentColor 0 6%,transparent 6% 12%) 35% 40%/60% 10% no-repeat,repeating-linear-gradient(0deg,currentColor 0 6%,transparent 6% 12%) 40% 35%/10% 60% no-repeat;color:#0b1f4f;}
.ui-idprev__qr.ui-cdz-qr{background-color:#fff;}
/* editor */
/* Layout workspace: sticky preview (left, narrower) + editor (right). ≥1440: 500 px + rest · 1280–1439: 5/12 + 7/12 · <1280: preview on top. */
.ui-cdz-editor{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:20px;align-items:start;}
.ui-cdz-editor__preview{position:sticky;top:88px;max-height:calc(100vh - 104px);overflow:auto;overscroll-behavior:contain;}
.ui-cdz-collapse{display:none;flex:none;}
.ui-cdz-pv__bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
.ui-cdz-pv__opts{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:14px;}
.ui-cdz-pv__opts .ui-switch{gap:10px;} .ui-switch__lbl{font-size:13px;font-weight:500;color:var(--ui-text-2);}
.ui-cdz__previews--stack{flex-direction:column;align-items:center;}
.ui-cdz-f{display:block;white-space:nowrap;overflow:hidden;} .ui-cdz-f span{display:block;overflow:hidden;}
.ui-cdz-bc{overflow:hidden;} .ui-cdz-bc .ui-cdz-barcode{position:relative;width:100%;} .ui-cdz-bc .ui-cdz-f{position:relative;left:0 !important;top:0 !important;}
.ui-cdz-card [data-cdz-hit]{cursor:pointer;transition:outline-color .12s var(--ui-ease);}
.ui-cdz-card.is-boxes [data-cdz-hit]{outline:1px dashed rgba(27,58,138,.6);outline-offset:-1px;}
.ui-cdz-card [data-cdz-hit].is-hot,.ui-cdz-card.is-boxes [data-cdz-hit]:hover{outline:2px solid var(--ui-primary);outline-offset:-1px;background-color:rgba(27,58,138,.1);}
.ui-cdz-card [data-cdz-hit].is-issue{outline:2px solid #d97706;outline-offset:-1px;background-color:rgba(217,119,6,.16);}
.ui-cdz-tag{position:absolute;z-index:3;font:600 9px/1 var(--ui-font);color:#fff;background:var(--ui-primary);padding:3px 5px;border-radius:4px;pointer-events:none;white-space:nowrap;}
.ui-cdz-issues{margin:0 0 14px;padding:12px 14px;border-radius:10px;background:var(--ui-warning-soft);color:var(--ui-warning);font-size:13.5px;} .ui-cdz-issues[hidden]{display:none;}
.ui-cdz-issues__head{display:flex;align-items:center;gap:8px;font-weight:600;} .ui-cdz-issues__head i{font-size:18px;} .ui-cdz-issues__head span{font-weight:400;color:var(--ui-text-2);}
.ui-cdz-issues ul{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:4px;} .ui-cdz-issues li{display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--ui-text);} .ui-cdz-issues li::before{content:"";width:6px;height:6px;border-radius:50%;background:#d97706;flex:none;}
.ui-cdz-issues li span{flex:1;min-width:0;}
.ui-cdz-goto{flex:none;border:0;background:transparent;color:var(--ui-primary);font:600 12px var(--ui-font);cursor:pointer;padding:2px 4px;border-radius:6px;} .ui-cdz-goto:hover{background:var(--ui-primary-soft);}
.ui-cdz-acknote{margin:0 0 8px;font-size:14px;color:var(--ui-text-2);}
/* editor column */
.ui-cdz-fields{display:flex;flex-direction:column;gap:20px;}
.ui-cdz-fields__group{border:1px solid var(--ui-border);border-radius:10px;padding:16px;background:var(--ui-surface);}
.ui-cdz-fields__group h4{margin:0 0 14px;font-size:14px;font-weight:600;color:var(--ui-text);display:flex;align-items:center;gap:8px;}
.ui-cdz-fields__group h4 i{color:var(--ui-primary);}
.ui-cdz-fields{--ui-gap-field-col:16px;} .ui-cdz-fields .ui-fgrid select.form-input,.ui-cdz-fields .ui-fgrid input.form-input{width:100%;}
.ui-cdz-fields .ui-fgrid .form-input{height:40px !important;min-height:40px;padding:0 12px;font-size:13.5px;}
.ui-cdz-fields .ui-fgrid .form-label{font-size:13px;font-weight:500;color:var(--ui-text-2);margin-bottom:6px;display:block;}
.ui-cdz-fields .ui-fgrid > .ui-fcheck{min-height:40px;align-self:end;} .ui-cdz-fields .ui-fgrid > .ui-fcheck input{width:16px;height:16px;flex:none;margin:0;accent-color:var(--ui-primary);} .ui-cdz-fields .ui-fgrid > .ui-fcheck label{font-size:13.5px;}
.ui-cdz-fields .ui-fgrid > .ui-fcheck--help{align-items:flex-start;min-height:0;} .ui-cdz-fields .ui-fgrid > .ui-fcheck--help input{margin-top:3px;} .ui-cdz-fields .ui-fgrid > .ui-fcheck--help .ui-field__help{margin-top:4px;}
.ui-cdz-fnote{display:flex;align-items:flex-end;min-height:40px;} .ui-cdz-fnote .ui-field__help{margin:0 0 10px;}
.ui-cdz-fsub{display:flex;align-items:baseline;gap:10px;margin:4px 0 -4px;font-size:13px;font-weight:600;color:var(--ui-text);} .ui-cdz-fsub small{font-weight:400;color:var(--ui-muted);font-size:12px;}
.ui-cdz-unit{position:relative;} .ui-cdz-unit .form-input{padding-right:36px !important;text-align:right;font-variant-numeric:tabular-nums;}
.ui-cdz-unit span{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:12px;color:var(--ui-muted);pointer-events:none;}
.ui-cdz-colour{display:flex;align-items:center;gap:12px;} .ui-cdz-colour .form-input{flex:1;min-width:0;text-transform:lowercase;}
.ui-cdz-swatch{width:32px;height:32px;flex:none;padding:0;border:1px solid var(--ui-border-strong);border-radius:8px;background:none;cursor:pointer;}
.ui-cdz-swatch::-webkit-color-swatch-wrapper{padding:2px;} .ui-cdz-swatch::-webkit-color-swatch{border:0;border-radius:5px;} .ui-cdz-swatch::-moz-color-swatch{border:0;border-radius:5px;}
.ui-cdz-fields[data-readonly] .form-input{background:var(--ui-surface-2);}
.ui-cdz-foot{position:sticky;bottom:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px 16px;flex-wrap:wrap;margin:20px -24px -20px;padding:14px 24px 16px;border-top:1px solid var(--ui-border);background:var(--ui-surface);border-radius:0 0 var(--ui-radius-lg) var(--ui-radius-lg);}
.ui-cdz-foot__state{font-size:13px;color:var(--ui-muted);} .ui-cdz-foot__state b{color:var(--ui-text);} .ui-cdz-foot__state.is-dirty{color:var(--ui-text-2);}
.ui-cdz-foot__note{display:block;font-size:12px;color:var(--ui-muted);margin-top:2px;}
.ui-cdz-foot__acts{display:flex;gap:10px;flex:none;}
.ui-cdz-art{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:16px;align-items:start;padding:12px 0;border-top:1px solid var(--ui-border);}
.ui-cdz-art:first-of-type{border-top:0;padding-top:0;}
.ui-cdz-art__img{border:1px solid var(--ui-border);border-radius:10px;padding:8px;background:var(--ui-surface-2);display:grid;place-items:center;min-height:120px;}
.ui-cdz-art__img img{max-width:100%;height:auto;border-radius:6px;}
.ui-cdz-art__meta{display:flex;flex-direction:column;gap:8px;} .ui-cdz-art__meta b{font-size:14px;}
@media (max-width:640px){.ui-cdz-gallery{grid-template-columns:1fr;}.ui-cdz__facts{grid-template-columns:repeat(2,minmax(0,1fr));}.ui-cdz-art{grid-template-columns:1fr;}.ui-cdz__previews--large{gap:12px;}.ui-cdz-fields__cell--wide,.ui-cdz-fields__cell--check{grid-column:span 2;}}
/* bell: reported-card scan alerts (components/topbar.php) */
.ui-scanalert{padding:10px 12px 8px;background:var(--ui-danger-soft);}
.ui-scanalert__head{display:flex;align-items:center;gap:8px;margin-bottom:6px;font-size:13.5px;color:var(--ui-danger);}
.ui-scanalert__head .ui-btn{margin-left:auto;}
.ui-scanalert__ic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--ui-surface);color:var(--ui-danger);font-size:15px;}
.ui-scanalert__row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px 0;border-top:1px solid rgba(192,38,45,.15);font-size:13px;}
.ui-scanalert__row small{flex-basis:100%;color:var(--ui-muted);font-size:12px;}
/* ID card actions + history (components/idcard_modals.php · employee ID card tab) */
.ui-idc-prev{border:1px solid var(--ui-border);border-radius:10px;overflow:hidden;background:var(--ui-surface-2);height:min(560px,62vh);}
.ui-idc-prev iframe{width:100%;height:100%;border:0;display:block;}
.ui-idc-reason{margin-top:14px;}
.ui-idc-radios{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:4px;}
.ui-idc-radios label{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--ui-border-strong);border-radius:10px;cursor:pointer;font-size:14px;font-weight:500;}
.ui-idc-radios label:has(input:checked){border-color:var(--ui-danger);background:var(--ui-danger-soft);color:var(--ui-danger);}
.ui-idc-radios label i{font-size:18px;} .ui-idc-radios label small{margin-left:auto;color:var(--ui-muted);font-weight:400;}
.ui-idc-cards{display:flex;flex-direction:column;gap:12px;}
.ui-idc-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px;padding:14px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-surface);}
.ui-idc-card.is-current{border-color:var(--ui-primary);box-shadow:0 0 0 3px var(--ui-primary-soft);}
.ui-idc-card__thumbs{display:flex;gap:6px;align-items:flex-start;}
.ui-idc-card__head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px;} .ui-idc-card__head b{font-size:14.5px;}
.ui-idc-card__meta{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px;color:var(--ui-muted);} .ui-idc-card__meta b{color:var(--ui-text-2);font-weight:500;}
.ui-idc-card .ui-act{margin-top:10px;}
.ui-idc-scans td small{color:var(--ui-muted);}
@media (max-width:640px){.ui-idc-radios{grid-template-columns:1fr;}.ui-idc-card{grid-template-columns:1fr;}.ui-idc-prev{height:60vh;}}
.ui-cdz__previews--stack{flex-direction:column;align-items:center;}
.ui-idc-card__thumbs .ui-cdz__label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.ui-idc-card__thumbs .ui-cdz__side{position:relative;}
/* Prepare 2027 cards (workload/prepareCardsForm.php) */
.ui-prep{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:16px;align-items:start;}
@media (max-width:1100px){.ui-prep{grid-template-columns:1fr;}}
@media print{body.ui-print-batch .ui-sidebar,body.ui-print-batch .header,body.ui-print-batch .ui-prep,body.ui-print-batch .ui-page-header__actions,body.ui-print-batch .ui-icard__actions,body.ui-print-batch .ui-toasts{display:none !important;}
  body.ui-print-batch #prepResult{border:0;box-shadow:none;padding:0;}body.ui-print-batch .main-content{margin:0 !important;padding:0 !important;}}
/* Card design element switches (workload/cardDesignView.php · assets/js/idcard-design.js) */
.ui-switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer;position:relative;}
.ui-switch input{position:absolute;opacity:0;width:0;height:0;}
.ui-switch__track{width:40px;height:22px;border-radius:999px;background:var(--ui-border-strong);position:relative;transition:background .15s var(--ui-ease);flex:none;}
.ui-switch__track::after{content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.3);transition:transform .15s var(--ui-ease);}
.ui-switch input:checked + .ui-switch__track{background:var(--ui-primary);} .ui-switch input:checked + .ui-switch__track::after{transform:translateX(18px);}
.ui-switch input:focus-visible + .ui-switch__track{outline:2px solid var(--ui-primary);outline-offset:2px;}
.ui-switch input:disabled + .ui-switch__track{opacity:.5;cursor:not-allowed;}
.ui-switch__txt{font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--ui-muted);width:28px;}
/* element switch rows: FRONT / BACK groups, 48 px rows 8 px apart, fixed columns so every row lines up */
.ui-cdz-elements{display:flex;flex-direction:column;gap:28px;}
.ui-cdz-elements__group{display:flex;flex-direction:column;gap:8px;}
.ui-cdz-elements__side{margin:0 0 2px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);}
.ui-cdz-el{border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface);transition:box-shadow .2s var(--ui-ease);}
.ui-cdz-el.is-flash{box-shadow:0 0 0 3px var(--ui-primary-soft);border-color:var(--ui-primary);}
.ui-cdz-el__row{display:grid;grid-template-columns:28px minmax(0,1fr) 76px 72px;gap:12px;align-items:center;height:48px;padding:0 16px;}
.ui-cdz-el__ic{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:15px;}
.ui-cdz-el__name{min-width:0;font-size:14px;font-weight:500;color:var(--ui-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ui-cdz-el__name small{font-size:10px;font-weight:600;letter-spacing:.04em;padding:1px 5px;border-radius:999px;background:var(--ui-accent-soft);color:var(--ui-warning);margin-left:4px;vertical-align:1px;}
.ui-cdz-el__row .ui-switch{width:76px;} .ui-cdz-el__row .ui-btn{width:72px;justify-content:center;}
.ui-cdz-el.is-off .ui-cdz-el__ic{background:var(--ui-surface-2);color:var(--ui-muted);} .ui-cdz-el.is-off .ui-cdz-el__name{color:var(--ui-muted);}
.ui-cdz-el__body{padding:16px;border-top:1px solid var(--ui-border);background:var(--ui-surface-2);border-radius:0 0 10px 10px;} .ui-cdz-el__body .form-input{background:var(--ui-surface);}
.ui-cdz-ghost{position:absolute;border:1.5px dotted rgba(192,38,45,.75);border-radius:2px;background:rgba(192,38,45,.06);display:flex;align-items:flex-start;overflow:hidden;}
.ui-cdz-ghost span{font:600 7px/1 Arial,sans-serif;color:#c0262d;background:rgba(255,255,255,.8);padding:1px 2px;}
.ui-cdz-note{display:flex;align-items:flex-start;gap:6px;margin:0 0 10px;} .ui-cdz-note i{color:var(--ui-primary);}
.ui-cdz-warn{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;} .ui-cdz-warn[hidden]{display:none;}
.ui-cdz-warn .ui-alert{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;font-size:13.5px;}
.ui-cdz-warn .ui-alert--warning{background:var(--ui-warning-soft);color:var(--ui-warning);} .ui-cdz-warn .ui-alert--danger{background:var(--ui-danger-soft);color:var(--ui-danger);} .ui-cdz-warn .ui-alert--info{background:var(--ui-primary-soft);color:var(--ui-primary);}
.ui-cdz-warn .ui-alert i{font-size:17px;flex:none;}
@media (min-width:1440px){.ui-cdz-editor{grid-template-columns:500px minmax(0,1fr);}}
@media (max-width:1279px){
  .ui-cdz-editor{grid-template-columns:1fr;}
  .ui-cdz-editor__preview{position:static;max-height:none;overflow:visible;}
  .ui-cdz-collapse{display:inline-flex;}
  .ui-cdz-editor__preview.is-collapsed .ui-cdz-pv{display:none;} .ui-cdz-editor__preview.is-collapsed .ui-icard__head{margin-bottom:0;}
}
@media (max-width:640px){
  .ui-cdz-el__row{grid-template-columns:28px minmax(0,1fr) 76px 64px;gap:8px;padding:0 12px;} .ui-cdz-el__row .ui-btn{width:64px;padding:0 8px;}
  .ui-cdz-fields .ui-fgrid > *{grid-column:span 2 !important;} .ui-cdz-fields .ui-fgrid > .ui-cdz-pair{grid-column:span 1 !important;}
  .ui-cdz-foot{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;} .ui-cdz-foot__acts{width:100%;} .ui-cdz-foot__acts .ui-btn{flex:1;justify-content:center;}
}
.ui-cdz-acklist{text-align:left;margin:0;padding-left:18px;font-size:14px;} .ui-cdz-acklist li{margin:4px 0;}
.ui-cdz-el__body[hidden]{display:none;}
/* sign-in security section (user edit form, account security tab) */
.ui-sec-state{display:flex;align-items:center;gap:10px;min-height:44px;flex-wrap:wrap;font-size:13.5px;}
.auth-alert{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:13.5px;margin-bottom:16px;} .auth-alert i{font-size:17px;flex:none;}
.ui-acm__hint{margin:0 0 12px;font-size:13px;color:var(--ui-muted);}
/* two-step sign-in: sign-in step + Account wizard */
.auth-mfa__head{display:flex;gap:12px;align-items:flex-start;margin-bottom:4px;} .auth-mfa__head h3{margin:0 0 4px;font-size:16px;font-weight:600;} .auth-mfa__head p{margin:0;font-size:13px;color:var(--ui-muted);}
.auth-check{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ui-text-2);cursor:pointer;} .auth-check input{width:16px;height:16px;accent-color:var(--ui-primary);margin:0;}
.ui-acm__btns{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:12px;} .ui-acm__hint--inline{margin:0;}
.ui-acm__totp .ui-fsec__head{align-items:center;} .ui-acm__totp .ui-fsec__head .ui-badge{margin-left:auto;flex:none;}
.ui-acm__steps{display:flex;gap:16px;list-style:none;margin:0 0 16px;padding:0;font-size:13px;color:var(--ui-muted);} .ui-acm__steps li{display:flex;align-items:center;gap:8px;} .ui-acm__steps b{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--ui-surface-2);font-size:12px;font-weight:600;color:var(--ui-muted);}
.ui-acm__steps li.is-current{color:var(--ui-text);font-weight:600;} .ui-acm__steps li.is-current b{background:var(--ui-primary);color:#fff;} .ui-acm__steps li.is-done b{background:var(--ui-accent-soft);color:var(--ui-accent);}
.ui-acm__scan{display:flex;gap:20px;align-items:flex-start;margin-bottom:16px;} .ui-acm__scan img{flex:none;border:1px solid var(--ui-border);border-radius:10px;background:#fff;padding:6px;} .ui-acm__scan .ui-acm__hint{margin:0 0 8px;}
.ui-acm__key{display:inline-block;font-family:var(--ui-mono);font-size:14px;letter-spacing:.06em;padding:6px 10px;border-radius:8px;background:var(--ui-surface-2);margin:0 0 8px;user-select:all;}
.ui-acm__codelist{columns:2;gap:16px;margin:8px 0 0;padding-left:22px;font-size:14px;} .ui-acm__codelist li{margin:4px 0;} .ui-acm__codelist code{font-family:var(--ui-mono);font-size:14px;letter-spacing:.04em;}
.ui-acm__totpform .ui-fgrid{margin-top:8px;}
@media (max-width:640px){.ui-acm__scan{flex-direction:column;align-items:center;text-align:center;} .ui-acm__codelist{columns:1;}}
/* ---- global search: topbar box + palette ---- */
.ui-topbar__search{position:relative;flex:0 1 360px;min-width:0;margin:0 16px;display:flex;align-items:center;}
.ui-topbar__search > i{position:absolute;left:12px;color:var(--ui-muted);font-size:16px;pointer-events:none;}
.ui-topbar__searchbox{width:100%;height:38px;padding:0 56px 0 36px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface-2);font:inherit;font-size:14px;color:var(--ui-text);}
.ui-topbar__searchbox:focus{outline:2px solid var(--ui-primary);outline-offset:-1px;background:var(--ui-surface);}
.ui-topbar__searchbox::-webkit-search-cancel-button{display:none;}
.ui-topbar__kbd{position:absolute;right:10px;font:600 11px var(--ui-mono);color:var(--ui-muted);background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:6px;padding:2px 6px;}
.ui-topbar__searchbtn{display:none;}
@media (max-width:1023px){.ui-topbar__search{display:none;} .ui-topbar__searchbtn{display:inline-flex;}}
.ui-srch{align-items:flex-start !important;justify-content:center;padding:8vh 16px 16px;}
html.ui-srch-open{overflow:hidden;}
.ui-srch__card{width:100%;max-width:680px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:16px;box-shadow:var(--ui-shadow-lg);overflow:hidden;display:flex;flex-direction:column;max-height:76vh;}
.ui-srch__bar{display:flex;align-items:center;gap:10px;padding:0 16px;border-bottom:1px solid var(--ui-border);} .ui-srch__bar > i{font-size:20px;color:var(--ui-muted);}
.ui-srch__input{flex:1;height:56px;border:0;background:transparent;font:inherit;font-size:16px;color:var(--ui-text);outline:none;} .ui-srch__input::-webkit-search-cancel-button{display:none;}
.ui-srch kbd{font:600 11px var(--ui-mono);color:var(--ui-muted);background:var(--ui-surface-2);border:1px solid var(--ui-border);border-radius:6px;padding:2px 6px;}
.ui-srch__list{overflow:auto;padding:8px;min-height:120px;} .ui-srch__list .ui-skel{gap:8px;padding:4px;}
.ui-srch__group{padding:4px 0 8px;} .ui-srch__group + .ui-srch__group{border-top:1px solid var(--ui-border);margin-top:4px;padding-top:10px;}
.ui-srch__ghead{display:flex;align-items:center;gap:8px;padding:4px 10px 6px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);} .ui-srch__ghead i{font-size:14px;color:var(--ui-primary);}
.ui-srch__more{margin-left:auto;font-weight:500;text-transform:none;letter-spacing:0;} .ui-srch__clear{margin-left:auto;border:0;background:transparent;color:var(--ui-primary);font:500 12px var(--ui-font);text-transform:none;letter-spacing:0;cursor:pointer;}
.ui-srch__item{display:flex;align-items:center;gap:12px;padding:8px 10px;border-radius:10px;color:var(--ui-text);text-decoration:none;} .ui-srch__item.is-active,.ui-srch__item:hover{background:var(--ui-primary-soft);} .ui-srch__item.is-static{cursor:default;}
.ui-srch__item .ui-rid{flex:none;min-width:92px;justify-content:center;} .ui-rid--empty{color:var(--ui-muted);}
.ui-srch__txt{flex:1;min-width:0;display:flex;flex-direction:column;} .ui-srch__txt b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .ui-srch__txt small{font-size:12.5px;color:var(--ui-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ui-srch__item > i{color:var(--ui-muted);flex:none;}
.ui-srch__recent{display:flex;align-items:center;gap:10px;width:100%;padding:8px 10px;border:0;background:transparent;border-radius:10px;font:inherit;font-size:14px;color:var(--ui-text);cursor:pointer;text-align:left;} .ui-srch__recent:hover{background:var(--ui-surface-2);} .ui-srch__recent i{color:var(--ui-muted);}
.ui-srch__empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:28px 16px;text-align:center;color:var(--ui-muted);font-size:13.5px;} .ui-srch__empty i{font-size:28px;color:var(--ui-muted);}
.ui-srch__foot{display:flex;justify-content:space-between;align-items:center;padding:8px 16px;border-top:1px solid var(--ui-border);font-size:12px;color:var(--ui-muted);background:var(--ui-surface-2);}
@media (max-width:640px){.ui-srch{padding:0;align-items:stretch !important;} .ui-srch__card{max-height:100vh;border-radius:0;} .ui-srch__item .ui-rid{min-width:64px;} .ui-srch__foot span:first-child{display:none;}}
/* sign-in page language switch */
.auth-lang{display:flex;align-items:center;gap:6px;justify-content:center;margin:14px 0 0;font-size:13px;color:var(--ui-muted);} .auth-lang i{margin-right:4px;}
.auth-lang__opt{color:var(--ui-muted);text-decoration:none;padding:4px 10px;border-radius:999px;border:1px solid transparent;} .auth-lang__opt:hover{color:var(--ui-text);} .auth-lang__opt.is-active{color:var(--ui-primary);background:var(--ui-primary-soft);font-weight:600;}
/* ---- notifications: bell dropdown + page ---- */
.ui-notify__panel{border:1px solid var(--ui-border);box-shadow:var(--ui-shadow-lg);overflow:hidden;}
.ui-notify__head{display:flex;align-items:center;gap:8px;padding:12px 14px;border-bottom:1px solid var(--ui-border);font-size:14px;} .ui-notify__head b{font-weight:600;}
.ui-notify__readall{margin-left:auto;border:0;background:transparent;color:var(--ui-primary);font:500 12.5px var(--ui-font);cursor:pointer;} .ui-notify__readall[hidden]{display:none;}
.ui-notify__list{max-height:360px;overflow:auto;}
.ui-notif{display:flex;gap:12px;align-items:flex-start;padding:10px 14px;border-bottom:1px solid var(--ui-border);text-decoration:none;color:var(--ui-text);background:var(--ui-primary-soft);} .ui-notif.is-read{background:transparent;} .ui-notif:hover{background:var(--ui-surface-2);}
.ui-notif__ic{flex:none;width:32px;height:32px;border-radius:8px;display:grid;place-items:center;background:var(--ui-warning-soft);color:var(--ui-warning);font-size:16px;} .ui-notif--danger .ui-notif__ic{background:var(--ui-danger-soft);color:var(--ui-danger);} .ui-notif--info .ui-notif__ic{background:var(--ui-primary-soft);color:var(--ui-primary);}
.ui-notif__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;text-decoration:none;color:inherit;} .ui-notif__body b{font-size:13.5px;font-weight:600;line-height:1.3;} .ui-notif__body small{font-size:12.5px;color:var(--ui-text-2);} .ui-notif__meta{font-size:11.5px;color:var(--ui-muted);}
.ui-notif.is-read .ui-notif__body b{font-weight:500;color:var(--ui-text-2);}
.ui-notify__empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 14px;color:var(--ui-muted);font-size:13px;} .ui-notify__empty i{font-size:24px;}
.ui-notify__all{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px;font-size:13px;font-weight:600;color:var(--ui-primary);text-decoration:none;background:var(--ui-surface-2);}
.ui-topbar__badge[hidden]{display:none;}
.ui-notif__mark{flex:none;}
.ui-notif-set{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--ui-border);font-size:14px;cursor:pointer;} .ui-notif-set input{width:16px;height:16px;accent-color:var(--ui-primary);margin:0;} .ui-notif-set__ic{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);}
.ui-flat-shell{max-width:1320px;margin:0 auto;padding:16px 24px;} @media (max-width:640px){.ui-flat-shell{padding:12px 16px;}}
/* ---- quality of life: help overlay, column chooser, saved filters, copied chip, bell width ---- */
.ui-notify__panel{width:380px !important;max-width:92vw;} .ui-notify__readall{white-space:nowrap;}
.ui-rid{cursor:copy;} .ui-rid.is-copied{background:var(--ui-success-soft);color:var(--ui-success);}
.ui-help__text{margin:0 0 16px;font-size:14.5px;line-height:1.55;color:var(--ui-text-2);} .ui-help__h{margin:0 0 8px;font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ui-muted);}
.ui-help__keys{margin:0;display:flex;flex-direction:column;gap:8px;} .ui-help__keys > div{display:flex;align-items:center;gap:14px;} .ui-help__keys dt{flex:0 0 150px;display:flex;align-items:center;gap:4px;margin:0;} .ui-help__keys dd{margin:0;font-size:14px;} .ui-help__hint{color:var(--ui-muted);font-size:12.5px;}
.ui-help kbd{font:600 12px var(--ui-mono);color:var(--ui-text);background:var(--ui-surface-2);border:1px solid var(--ui-border);border-bottom-width:2px;border-radius:6px;padding:2px 7px;}
.ui-help-btn{margin-left:4px;}
.ui-colbar{display:flex;justify-content:flex-end;position:relative;margin:0 0 8px;} .ui-colbar .has-hidden,.ui-filtbar .has-saved{color:var(--ui-primary);}
.ui-colpop{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:220px;max-height:360px;overflow:auto;padding:10px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:12px;box-shadow:var(--ui-shadow-md);display:flex;flex-direction:column;gap:6px;} .ui-colpop[hidden]{display:none;}
.ui-colpop label{display:flex;align-items:center;gap:10px;font-size:13.5px;padding:4px 6px;border-radius:8px;cursor:pointer;} .ui-colpop label:hover{background:var(--ui-surface-2);} .ui-colpop input{width:15px;height:15px;accent-color:var(--ui-primary);margin:0;} .ui-colpop > .ui-btn{margin-top:4px;align-self:flex-start;}
.ui-filtbar{position:relative;margin-left:auto;} .ui-filtpop{min-width:260px;} .ui-filtpop__row{display:flex;align-items:center;gap:6px;} .ui-filtpop__apply{flex:1;display:flex;align-items:center;gap:8px;border:0;background:transparent;font:500 13.5px var(--ui-font);color:var(--ui-text);padding:6px 8px;border-radius:8px;cursor:pointer;text-align:left;} .ui-filtpop__apply:hover{background:var(--ui-primary-soft);color:var(--ui-primary);} .ui-filtpop__empty{margin:0 0 6px;font-size:12.5px;color:var(--ui-muted);}
@media (max-width:640px){.ui-help__keys dt{flex-basis:110px;} .ui-colpop{right:auto;left:0;}}

/* =====================================================================
   Notifications — bell dropdown rows + the section-scoped window (components/notify_bell.php · ui-notify.js)
   Rows: 32px filled icon tile · title · one-line detail · Record ID chip + type · relative time · unread dot.
   Window: lg card, header with Mark all read, gold-underline tabs, type chips, settings switches, shared pager.
   ===================================================================== */
.ui-notif{position:relative;padding-right:28px;}
.ui-notif__dot{position:absolute;right:12px;top:16px;width:8px;height:8px;border-radius:50%;background:var(--ui-primary);box-shadow:0 0 0 3px var(--ui-primary-soft);}
.ui-notif.is-read .ui-notif__dot{display:none;}
.ui-notif__meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:2px;}
.ui-notif__meta .ui-rid{height:20px;padding:0 8px;font-size:11.5px;}
.ui-notify__group{padding:8px 14px 4px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);background:var(--ui-surface-2);border-bottom:1px solid var(--ui-border);}
.ui-notif--summary{align-items:center;background:transparent;} .ui-notif--summary .ui-notif__ic{background:var(--ui-primary-soft);color:var(--ui-primary);}
.ui-notif__count{flex:none;min-width:24px;height:24px;padding:0 8px;border-radius:999px;display:grid;place-items:center;font:600 12px var(--ui-mono);background:var(--ui-primary);color:#fff;}
.ui-notif.is-read .ui-notif__count{background:var(--ui-surface-2);color:var(--ui-muted);}
.ui-notify__all{border:0;width:100%;cursor:pointer;font-family:var(--ui-font);} .ui-notify__all:hover{background:var(--ui-primary-soft);}
/* the window */
.ui-nfm[hidden],.ui-nfm__chips[hidden],.ui-nfm__list[hidden],.ui-nfm__settings[hidden],.ui-nfm__summary[hidden],.ui-nfm__foot[hidden]{display:none !important;}
.ui-nfm .ui-pop__card{height:min(720px,calc(100vh - 32px));}
.ui-nfm__head.ui-pop__head{align-items:center;}
.ui-nfm__head .ui-pop__titles{flex:1;min-width:0;} .ui-nfm__head .ui-pop__sub{margin:2px 0 0;}
.ui-nfm__actions{display:flex;align-items:center;gap:8px;margin-right:4px;}
.ui-nfm__tabs.ui-dtabs{padding:0 24px;flex:none;border-top:0;border-bottom:1px solid var(--ui-border);}
.ui-nfm__body.ui-pop__body{padding:16px 24px 20px;display:flex;flex-direction:column;gap:14px;}
.ui-nfm__list{display:flex;flex-direction:column;gap:8px;}
.ui-nfm__list .ui-notif{border:1px solid var(--ui-border);border-radius:10px;align-items:center;padding:10px 44px 10px 14px;}
.ui-nfm__list .ui-notif:not(.is-read){border-color:var(--ui-primary-soft);}
.ui-nfm__list .ui-notif__dot{right:auto;left:-4px;top:50%;transform:translateY(-50%);box-shadow:0 0 0 2px var(--ui-surface);}
.ui-nfm__list .ui-notif__mark{position:absolute;right:8px;top:50%;transform:translateY(-50%);}
.ui-nfm__list .ui-notif.is-read .ui-notif__mark{display:none;}
.ui-nfm__list .ui-empty{margin:12px 0;}
.ui-nfm__setgrp{border:1px solid var(--ui-border);border-radius:12px;padding:16px 18px;} .ui-nfm__setgrp + .ui-nfm__setgrp{margin-top:14px;}
.ui-nfm__setgrp h3{margin:0;font-size:15px;font-weight:600;color:var(--ui-text);} .ui-nfm__setgrp p{margin:4px 0 10px;font-size:12.5px;color:var(--ui-muted);}
.ui-nfm__set.ui-switch{display:flex;gap:12px;padding:10px 0;border-bottom:1px solid var(--ui-border);} .ui-nfm__set.ui-switch:last-child{border-bottom:0;}
.ui-nfm__set .ui-switch__lbl{font-size:14px;color:var(--ui-text);} .ui-nfm__set .ui-notif-set__ic{flex:none;}
.ui-nfm__sumgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.ui-nfm__sum{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--ui-border);border-radius:12px;text-decoration:none;color:var(--ui-text);background:var(--ui-surface);}
.ui-nfm__sum:hover{background:var(--ui-surface-2);} .ui-nfm__sum.is-unread{border-color:var(--ui-primary-soft);background:var(--ui-primary-soft);}
.ui-nfm__sum .ui-notif__ic{width:36px;height:36px;border-radius:10px;background:var(--ui-surface);color:var(--ui-primary);} .ui-nfm__sum.is-unread .ui-notif__ic{background:#fff;}
.ui-nfm__sumtxt{flex:1;min-width:0;display:flex;flex-direction:column;} .ui-nfm__sumtxt b{font-size:13.5px;font-weight:600;} .ui-nfm__sumtxt small{font-size:12px;color:var(--ui-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-nfm__sumn{font:700 14px var(--ui-mono);color:var(--ui-primary);min-width:20px;text-align:right;} .ui-nfm__sum:not(.is-unread) .ui-nfm__sumn{color:var(--ui-muted);}
.ui-nfm__sum > i{color:var(--ui-muted);}
.ui-nfm__h{margin:6px 0 -6px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);}
.ui-nfm__foot.ui-pop__foot{justify-content:flex-start;padding:10px 24px;} .ui-nfm__foot .ui-pg{width:100%;margin:0;}
.ui-nfm__live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}
html.dark .ui-nfm__sum.is-unread .ui-notif__ic{background:var(--ui-surface);}
@media (max-width:639px){
  .ui-nfm .ui-pop__card{height:100vh;max-height:100vh;border-radius:0;}
  .ui-nfm__head .ui-pop__title{font-size:15px;} .ui-nfm__actions .ui-btn span{display:none;}
  .ui-nfm__tabs.ui-dtabs{padding:0 16px;} .ui-nfm__body.ui-pop__body{padding:14px 16px 16px;} .ui-nfm__head.ui-pop__head{padding:14px 12px 12px 16px;}
  .ui-nfm__actions .ui-btn{padding:0 10px;} .ui-nfm__actions .ui-btn i{margin:0;}
  .ui-nfm__sumgrid{grid-template-columns:1fr;} .ui-nfm__foot.ui-pop__foot{padding:10px 16px;}
}

/* =====================================================================
   Skeleton system (components/skeleton.php ui_skeleton() · assets/js/ui.js uiSkeleton() / uiLoad())
   One shimmer, shapes that match the real content: text line, title, avatar, icon tile, chip, button,
   KPI cell, chart block, table row, card, list row, form field, detail header. Containers carry
   aria-busy="true". Content swapped in gets .ui-fade-in. prefers-reduced-motion: no shimmer, no fade.
   No full-page overlay: pages render straight into content (#loader stays off); only async parts show skeletons.
   ===================================================================== */
.ui-skeleton{display:block;position:relative;overflow:hidden;background:var(--ui-surface-2);border-radius:6px;height:14px;animation:none;}
.ui-skeleton::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(148,163,184,.22),transparent);animation:ui-shimmer 1.3s infinite;}
html.dark .ui-skeleton::after{background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);}
.ui-skel{display:flex;flex-direction:column;gap:10px;min-width:0;}
.ui-skel[aria-busy="true"]{pointer-events:none;}
.ui-skeleton--text{height:14px;width:100%;} .ui-skeleton--sm{height:12px;} .ui-skeleton--title{height:20px;width:42%;border-radius:6px;}
.ui-skeleton--avatar{width:40px;height:40px;border-radius:50%;flex:none;} .ui-skeleton--avatar.is-lg{width:56px;height:56px;}
.ui-skeleton--tile{width:36px;height:36px;border-radius:9px;flex:none;} .ui-skeleton--tile.is-sm{width:32px;height:32px;border-radius:8px;}
.ui-skeleton--chip{width:84px;height:24px;border-radius:999px;} .ui-skeleton--btn{width:120px;height:40px;border-radius:10px;}
.ui-skeleton--box{height:40px;border-radius:10px;width:100%;} .ui-skeleton--img{width:100%;aspect-ratio:4/3;border-radius:10px;height:auto;}
/* KPI cell: tile + label + value (matches .ui-kpi 36px tile · 13px label · 26px value) */
.ui-skel-kpi{display:flex;align-items:center;gap:14px;background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);padding:16px 18px;min-width:0;}
.ui-skel-kpi > div{flex:1;min-width:0;display:flex;flex-direction:column;gap:8px;} .ui-skel-kpi .ui-skeleton--sm{width:44%;} .ui-skel-kpi .ui-skeleton--val{height:22px;width:56%;}
/* chart block: 6 bars of different heights + an axis line */
.ui-skel-chart{position:relative;display:flex;align-items:flex-end;gap:10px;height:260px;padding:12px 8px 20px;border-bottom:1px solid var(--ui-border);}
.ui-skel-chart .ui-skeleton{flex:1;border-radius:6px 6px 0 0;} .ui-skel-chart.is-sm{height:180px;}
/* table rows (tbody) */
.ui-skel-row td{padding:14px 16px !important;border-bottom:1px solid var(--ui-border);} .ui-skel-row .ui-skeleton{height:12px;}
.ui-skel-row td:first-child .ui-skeleton{height:24px;border-radius:999px;}
/* card: title + lines */
.ui-skel-card{background:var(--ui-surface);border:1px solid var(--ui-border);border-radius:var(--ui-radius-lg);padding:20px;display:flex;flex-direction:column;gap:12px;}
/* list rows: tile + two lines (search results, notifications, activity) */
.ui-skel-li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--ui-border);border-radius:10px;}
.ui-skel-li > div{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px;}
.ui-skel-li .ui-skeleton--text{width:52%;} .ui-skel-li .ui-skeleton--sm{width:70%;}
/* form fields: label + 40px control, on the form grid */
.ui-skel-field{display:flex;flex-direction:column;gap:8px;} .ui-skel-field .ui-skeleton--sm{width:38%;}
/* detail header: avatar + title + chip + meta, then a facts grid */
.ui-skel-detail{display:flex;flex-direction:column;gap:16px;}
.ui-skel-detail__hero{display:flex;align-items:center;gap:16px;} .ui-skel-detail__hero > div{flex:1;display:flex;flex-direction:column;gap:9px;}
.ui-skel-detail__hero .ui-skeleton--title{width:34%;} .ui-skel-detail__hero .ui-skeleton--sm{width:48%;}
.ui-skel-detail__facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding-top:14px;border-top:1px solid var(--ui-border);}
.ui-skel-detail__facts > div{display:flex;flex-direction:column;gap:7px;} .ui-skel-detail__facts .ui-skeleton--sm{width:50%;} .ui-skel-detail__facts .ui-skeleton--text{width:72%;height:15px;}
@media (max-width:639px){.ui-skel-detail__facts{grid-template-columns:repeat(2,minmax(0,1fr));}}
/* chart hosts: an empty chart container shows a chart skeleton until the library draws into it */
div[id$="chart" i]:empty{position:relative;min-height:240px;overflow:hidden;}
div[id$="chart" i]:empty::before{content:"";position:absolute;inset:12px 8px 20px;border-radius:6px;background:
  linear-gradient(to top,var(--ui-surface-2) 0 38%,transparent 38%) 0 100%/14% 100% no-repeat,
  linear-gradient(to top,var(--ui-surface-2) 0 62%,transparent 62%) 17% 100%/14% 100% no-repeat,
  linear-gradient(to top,var(--ui-surface-2) 0 48%,transparent 48%) 34% 100%/14% 100% no-repeat,
  linear-gradient(to top,var(--ui-surface-2) 0 80%,transparent 80%) 51% 100%/14% 100% no-repeat,
  linear-gradient(to top,var(--ui-surface-2) 0 55%,transparent 55%) 68% 100%/14% 100% no-repeat,
  linear-gradient(to top,var(--ui-surface-2) 0 70%,transparent 70%) 85% 100%/14% 100% no-repeat;}
div[id$="chart" i]:empty::after{content:"";position:absolute;inset:12px 8px 20px;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(148,163,184,.18),transparent);animation:ui-shimmer 1.3s infinite;}
/* content fade-in once real data replaces a skeleton */
.ui-fade-in{animation:ui-fadein .18s ease-out both;}
@keyframes ui-fadein{from{opacity:0;transform:translateY(2px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.ui-skeleton::after,div[id$="chart" i]:empty::after{animation:none;display:none;} .ui-fade-in{animation:none;}}

/* =====================================================================
   Sign-in — two steps in one card (index.php · assets/js/login.js)
   Step 1 username / email + password → Continue; step 2 slides in: six code boxes, 30-second ring, backup code,
   remember device, Back. Inline errors (no popups). Works at 390 px. Reduced motion: no slide / shake.
   ===================================================================== */
.auth-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.auth-steps{display:grid;position:relative;overflow:hidden;margin:0 -12px;padding:0 12px;}   /* the slide never widens the page */
.auth-step{grid-area:1 / 1;transition:transform .32s var(--ui-ease),opacity .28s var(--ui-ease);}
.auth-step:not(.is-active){opacity:0;pointer-events:none;visibility:hidden;transform:translateX(-28px);}
.auth-steps.is-step2 .auth-step:not(.is-active){transform:translateX(-28px);} .auth-steps:not(.is-step2) #mfaStep{transform:translateX(28px);}
.auth-step.is-active{opacity:1;transform:none;visibility:visible;}
.auth-field .auth-eye{border:0;background:transparent;font-size:17px;} .auth-field .auth-eye:focus-visible{outline:2px solid var(--ui-primary);outline-offset:1px;}
.auth-error.ui-alert{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;font-size:13.5px;margin:0;} .auth-error[hidden]{display:none;} .auth-error i{font-size:17px;flex:none;}
.auth-submit.is-loading{color:transparent;} .auth-submit.is-loading span{visibility:hidden;}
.auth-who{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;height:28px;padding:0 10px 0 8px;border-radius:999px;background:var(--ui-surface-2);border:1px solid var(--ui-border);font:500 12.5px var(--ui-font);color:var(--ui-text-2);} .auth-who[hidden]{display:none;}
.auth-who span{font-family:var(--ui-mono);font-weight:600;color:var(--ui-text);}
.auth-otp-wrap{border:0;padding:0;margin:0;min-width:0;} .auth-otp-wrap[hidden]{display:none;}
.auth-otp{display:flex;gap:10px;justify-content:space-between;}
.auth-otp__box{width:100%;max-width:52px;height:58px;border:1px solid var(--ui-border-strong);border-radius:10px;background:var(--ui-surface);color:var(--ui-text);font-size:24px;font-weight:600;text-align:center;caret-color:var(--ui-primary);padding:0;transition:border-color .15s var(--ui-ease),box-shadow .15s var(--ui-ease),background .15s var(--ui-ease);}
.auth-otp__box:focus{outline:none;border-color:var(--ui-primary);box-shadow:var(--ui-ring);}
.auth-otp__box.is-filled{border-color:var(--ui-primary);background:var(--ui-primary-soft);}
.auth-otp__box.is-error{border-color:var(--ui-danger);background:var(--ui-danger-soft);color:var(--ui-danger);}
.auth-otp__hint{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12.5px;color:var(--ui-muted);} .auth-otp__hint b{font-family:var(--ui-mono);color:var(--ui-text);min-width:2ch;display:inline-block;text-align:right;}
.auth-ring{width:22px;height:22px;transform:rotate(-90deg);flex:none;} .auth-ring__bg{fill:none;stroke:var(--ui-border);stroke-width:3;} .auth-ring__fg{fill:none;stroke:var(--ui-primary);stroke-width:3;stroke-linecap:round;transition:stroke-dashoffset 1s linear,stroke .3s;} .auth-ring__fg.is-low{stroke:var(--ui-warning);}
.auth-backup[hidden]{display:none;} .auth-backup__input{letter-spacing:.12em;font-size:18px !important;text-transform:uppercase;} .auth-backup .ui-field__help{margin:6px 0 0;}
.auth-mfa__links{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;}
.auth-link{border:0;background:transparent;padding:0;font:500 13.5px var(--ui-font);color:var(--ui-primary);cursor:pointer;display:inline-flex;align-items:center;gap:4px;} .auth-link:hover{text-decoration:underline;} .auth-link:focus-visible{outline:2px solid var(--ui-primary);outline-offset:2px;border-radius:4px;} .auth-link[hidden]{display:none;}
@keyframes auth-shake{10%,90%{transform:translateX(-2px);}20%,80%{transform:translateX(4px);}30%,50%,70%{transform:translateX(-6px);}40%,60%{transform:translateX(6px);}}
.is-shake{animation:auth-shake .42s cubic-bezier(.36,.07,.19,.97) both;}
@media (max-width:420px){.auth-otp{gap:6px;} .auth-otp__box{height:52px;font-size:20px;border-radius:8px;} .auth-card__head h2{font-size:22px;} .auth-form-wrap{padding:20px 16px;}}
@media (prefers-reduced-motion:reduce){.auth-step{transition:none;} .is-shake{animation:none;} .auth-ring__fg{transition:none;}}

/* =====================================================================
   Help & FAQ window (components/help_modal.php · assets/js/ui-help.js) — lg card, search, categories | answers,
   support footer; full-screen sheet with a category dropdown under 640 px. The sidebar item sits last in every menu.
   ===================================================================== */
.ui-hlp[hidden]{display:none !important;}
.ui-hlp .ui-pop__card{height:min(760px,calc(100vh - 32px));}
.ui-hlp__head.ui-pop__head{align-items:center;}
.ui-hlp__search{position:relative;flex:none;padding:14px 24px;border-bottom:1px solid var(--ui-border);}
.ui-hlp__search > i{position:absolute;left:38px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--ui-muted);pointer-events:none;}
.ui-hlp__input{width:100%;height:44px;border:1px solid var(--ui-border-strong);border-radius:10px;padding:0 44px 0 42px;background:var(--ui-surface);color:var(--ui-text);font:400 15px var(--ui-font);}
.ui-hlp__input:focus{outline:none;border-color:var(--ui-primary);box-shadow:var(--ui-ring);}
.ui-hlp__search kbd{position:absolute;right:36px;top:50%;transform:translateY(-50%);}
.ui-hlp__main{flex:1;min-height:0;display:grid;grid-template-columns:232px minmax(0,1fr);}
.ui-hlp__cats{overflow-y:auto;padding:12px;border-right:1px solid var(--ui-border);display:flex;flex-direction:column;gap:2px;}
.ui-hlp__cat{display:flex;align-items:center;gap:10px;width:100%;min-height:38px;padding:7px 10px;border:0;border-radius:8px;background:transparent;color:var(--ui-text-2);font:500 13.5px var(--ui-font);text-align:left;cursor:pointer;position:relative;}
.ui-hlp__cat i{font-size:16px;color:var(--ui-muted);flex:none;} .ui-hlp__cat span:first-of-type{flex:1;min-width:0;line-height:1.3;}
.ui-hlp__cat:hover{background:var(--ui-surface-2);color:var(--ui-text);}
.ui-hlp__cat.is-active{background:var(--ui-primary-soft);color:var(--ui-primary);} .ui-hlp__cat.is-active i{color:var(--ui-primary);}
.ui-hlp__cat.is-active::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:2px;background:var(--ui-accent);}
.ui-hlp__n{flex:none;font:600 11.5px var(--ui-mono);min-width:22px;height:20px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:var(--ui-surface-2);color:var(--ui-muted);}
.ui-hlp__catsel{display:none;}
.ui-hlp__list{overflow-y:auto;padding:16px 24px 24px;display:flex;flex-direction:column;gap:8px;min-width:0;}
.ui-hlp__h{margin:0 0 4px;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);}
.ui-hlp__item{border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-surface);}
.ui-hlp__item.is-open{border-color:var(--ui-primary);box-shadow:0 0 0 3px var(--ui-primary-soft);}
.ui-hlp__q{display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--ui-text);border-radius:12px;}
.ui-hlp__q > span{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;} .ui-hlp__q b{font-size:14.5px;font-weight:600;line-height:1.35;} .ui-hlp__q small{font-size:12px;color:var(--ui-muted);}
.ui-hlp__q > i{font-size:20px;color:var(--ui-muted);transition:transform .15s var(--ui-ease);flex:none;} .ui-hlp__item.is-open .ui-hlp__q > i{transform:rotate(180deg);}
.ui-hlp__q:focus-visible{outline:none;box-shadow:var(--ui-ring);}
.ui-hlp__q mark{background:var(--ui-accent-soft);color:inherit;border-radius:3px;padding:0 1px;}
.ui-hlp__a{padding:0 16px 16px 16px;display:flex;flex-direction:column;gap:12px;}
.ui-hlp__steps{margin:0;padding:0;list-style:none;counter-reset:hs;display:flex;flex-direction:column;gap:8px;}
.ui-hlp__steps li{counter-increment:hs;position:relative;padding-left:34px;font-size:14px;line-height:1.55;color:var(--ui-text-2);}
.ui-hlp__steps li::before{content:counter(hs);position:absolute;left:0;top:0;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font:600 12px var(--ui-mono);}
.ui-hlp__callout{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;font-size:13.5px;line-height:1.5;background:var(--ui-primary-soft);color:var(--ui-text);} .ui-hlp__callout i{font-size:17px;flex:none;color:var(--ui-primary);}
.ui-hlp__callout--warning{background:var(--ui-warning-soft);} .ui-hlp__callout--warning i{color:var(--ui-warning);}
.ui-hlp__callout--info{background:var(--ui-surface-2);} .ui-hlp__callout--info i{color:var(--ui-info);}
.ui-hlp__keys,.ui-hlp__links,.ui-hlp__vote{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--ui-muted);}
.ui-hlp__keys kbd{font:600 12px var(--ui-mono);padding:2px 8px;border:1px solid var(--ui-border-strong);border-bottom-width:2px;border-radius:6px;background:var(--ui-surface);color:var(--ui-text);}
.ui-hlp__rel{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding-top:10px;border-top:1px solid var(--ui-border);} .ui-hlp__rel > span{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ui-muted);}
.ui-hlp__rel .auth-link{text-align:left;}
.ui-hlp__vote{padding-top:10px;border-top:1px solid var(--ui-border);}
.ui-hlp__thumb{width:34px;height:34px;border-radius:8px;border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-muted);display:grid;place-items:center;font-size:16px;cursor:pointer;}
.ui-hlp__thumb:hover{color:var(--ui-text);background:var(--ui-surface-2);} .ui-hlp__thumb.is-on{background:var(--ui-primary-soft);border-color:var(--ui-primary);color:var(--ui-primary);}
.ui-hlp__thumb:focus-visible{outline:none;box-shadow:var(--ui-ring);} .ui-hlp__counts{margin-left:auto;font-family:var(--ui-mono);font-size:11.5px;}
.ui-hlp__foot{flex:none;display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 24px;border-top:1px solid var(--ui-border);background:var(--ui-surface-2);border-radius:0 0 16px 16px;}
.ui-hlp__footic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:18px;flex:none;}
.ui-hlp__foot > div:first-of-type{display:flex;flex-direction:column;} .ui-hlp__foot b{font-size:13.5px;font-weight:600;color:var(--ui-text);} .ui-hlp__foot small{font-size:12.5px;color:var(--ui-muted);}
.ui-hlp__contacts{margin-left:auto;display:flex;gap:14px;flex-wrap:wrap;font-size:13px;} .ui-hlp__contacts a,.ui-hlp__contacts span{display:inline-flex;align-items:center;gap:6px;color:var(--ui-text-2);text-decoration:none;} .ui-hlp__contacts a{color:var(--ui-primary);font-weight:500;}
.ui-nav-item--help{margin-top:12px;border-top:1px solid var(--ui-border);border-radius:0 0 10px 10px;padding-top:10px;}
@media (max-width:639px){
  .ui-hlp.ui-pop{padding:0;align-items:stretch !important;}
  .ui-hlp .ui-pop__card{height:100vh;max-height:100vh;border-radius:0;}
  .ui-hlp__main{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr);}
  .ui-hlp__cats{display:none;} .ui-hlp__catsel{display:block;padding:12px 16px 0;} .ui-hlp__catsel .ui-select{width:100%;}
  .ui-hlp__search{padding:12px 16px;} .ui-hlp__search > i{left:30px;} .ui-hlp__search kbd{display:none;} .ui-hlp__input{padding-right:12px;}
  .ui-hlp__list{padding:12px 16px 20px;} .ui-hlp__foot{padding:10px 16px;border-radius:0;} .ui-hlp__contacts{margin-left:0;}
}
.ui-toolbar__field--grow{flex:1 1 280px;}
.ui-srch__scope{flex:none;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:999px;background:var(--ui-primary-soft);color:var(--ui-primary);font:600 12px var(--ui-font);white-space:nowrap;max-width:40%;overflow:hidden;text-overflow:ellipsis;} .ui-srch__scope i{font-size:14px;}
@media (max-width:639px){.ui-srch__scope{display:none;}}
/* the bell dropdown never widens a phone page: hidden → no box; shown → at most the viewport minus the gutters */
.ui-notify__panel.invisible{display:none;}
@media (max-width:639px){.ui-notify__panel{max-width:calc(100vw - 16px) !important;}}
/* maps without the internet (assets/js/ui.js uiMapOffline): the imagery is the only external part */
.ui-map-offline{position:absolute;inset:0;z-index:500;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:16px;text-align:center;background:var(--ui-surface-2);border-radius:inherit;color:var(--ui-text-2);}
.ui-map-offline b{font-size:14px;font-weight:600;color:var(--ui-text);} .ui-map-offline small{font-size:12.5px;color:var(--ui-muted);max-width:340px;line-height:1.45;}
.ui-map-offline__ic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--ui-surface);color:var(--ui-muted);font-size:22px;border:1px solid var(--ui-border);}
.inc-mapwrap{position:relative;min-height:220px;border-radius:12px;}

/* =====================================================================
   One filter bar for every list and report (assets/js/ui-listbar.js + components/toolbar.php)
   row 1: scope tabs · search + Search · tools (Filters (n) · Choose columns · Saved views)
   row 2: the filters on the 12-col form grid, collapsible; chips under the bar.
   ===================================================================== */
.ui-toolbar.ui-listbar{display:block;gap:0;margin:0 0 16px;}
.ui-listbar__row1{display:flex;align-items:center;gap:12px;flex-wrap:nowrap;min-height:44px;}
.ui-listbar__scope{flex:0 0 auto;}
.ui-listbar__search{display:flex;align-items:center;gap:8px;flex:1 1 320px;min-width:260px;}
.ui-listbar__search .ui-input-group{flex:1 1 auto;min-width:200px;position:relative;}
.ui-listbar__search .ui-input-group .ui-input{width:100%;padding-left:38px;}
.ui-listbar__search .ui-input-group__icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--ui-muted);pointer-events:none;}
.ui-listbar__go{flex:0 0 auto;}
.ui-listbar__tools{display:flex;align-items:center;gap:8px;margin-left:auto;flex:0 0 auto;}
.ui-listbar__tools .ui-btn{white-space:nowrap;}
.ui-listbar__n{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--ui-primary);color:#fff;font-size:11.5px;font-weight:700;line-height:1;}
.ui-listbar__n[hidden]{display:none;}
.ui-listbar.has-active .ui-listbar__filters{border-color:var(--ui-primary);color:var(--ui-primary);}
.ui-listbar__dd{position:relative;}
.ui-listbar__pop{position:absolute;right:0;top:calc(100% + 6px);z-index:70;min-width:260px;padding:10px;box-shadow:var(--ui-shadow-md);border-radius:12px;}
.ui-listbar__pop[hidden]{display:none;}
.ui-listbar__cols.has-hidden{color:var(--ui-primary);border-color:var(--ui-primary);}
.ui-listbar__row2{margin-top:14px;padding-top:14px;border-top:1px solid var(--ui-border);}
.ui-listbar__row2[hidden]{display:none;}
.ui-listbar__grid{align-items:end;}
.ui-listbar__f{min-width:0;display:flex;flex-direction:column;gap:6px;}
.ui-listbar__lab{font-size:12.5px;font-weight:500;color:var(--ui-muted);line-height:1.2;margin:0;}
.ui-listbar__f .ui-select,.ui-listbar__f .ui-input,.ui-listbar__f .form-input,.ui-listbar__f select,.ui-listbar__f input:not([type=checkbox]):not([type=radio]){width:100%;min-width:0;max-width:none;}
.ui-listbar__f .ui-select,.ui-listbar__f .ui-input,.ui-listbar__f .form-input,.ui-listbar__f select,.ui-listbar__f input:not([type=checkbox]):not([type=radio]),.ui-listbar__f .ui-daterange__btn,.ui-listbar__f .ui-listbar__multi-btn,.ui-listbar__f .select2-container .select2-selection{height:40px !important;min-height:40px !important;max-height:40px;padding-top:0;padding-bottom:0;line-height:38px;box-sizing:border-box;}   /* one control height on row 2 */
.ui-listbar__f textarea{height:auto !important;}
.ui-listbar__flag .ui-listbar__check{min-height:40px;height:40px;}
.ui-listbar__search .ui-input,.ui-listbar__go,.ui-listbar__tools .ui-btn{height:40px;min-height:40px;}
.ui-listbar__f .select2-container{width:100% !important;}
.ui-listbar__resetcell{align-items:flex-end;justify-content:center;min-height:44px;}
.ui-listbar__reset{border:0;background:none;color:var(--ui-muted);font:500 13px var(--ui-font);display:inline-flex;align-items:center;gap:6px;cursor:pointer;height:44px;padding:0 6px;border-radius:8px;}
.ui-listbar__reset:hover{color:var(--ui-danger);background:var(--ui-surface-2);}
.ui-listbar__flag .ui-listbar__check{min-height:44px;display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ui-text-2);}
.ui-listbar__flag .ui-listbar__check i{color:var(--ui-muted);}
.ui-listbar__multi{position:relative;}
.ui-listbar__multi-btn{display:flex;align-items:center;justify-content:space-between;text-align:left;cursor:pointer;width:100%;}
.ui-listbar__multi-btn::after{content:"";width:8px;height:8px;border-right:1.5px solid var(--ui-muted);border-bottom:1.5px solid var(--ui-muted);transform:rotate(45deg);margin:-4px 2px 0 8px;flex:none;}
.ui-listbar__multi.is-set .ui-listbar__multi-btn{border-color:var(--ui-primary);color:var(--ui-primary);}
.ui-listbar__multi-pop{left:0;right:auto;min-width:240px;max-height:320px;overflow:auto;display:grid;gap:4px;padding:10px;}
.ui-listbar__multi-pop .ui-check{padding:6px 8px;border-radius:8px;} .ui-listbar__multi-pop .ui-check:hover{background:var(--ui-surface-2);}
.ui-listbar__chips:empty{display:none;}
.ui-listbar__chips .ui-filterchips{margin:12px 0 0 !important;padding:0 !important;}
.ui-listbar__sheethead,.ui-listbar__sheetfoot{display:none;}
/* date range: one control, popover with presets + the original from / to inputs */
.ui-daterange{position:relative;}
.ui-daterange__btn{display:flex;align-items:center;gap:8px;text-align:left;cursor:pointer;color:var(--ui-muted);font:inherit;font-size:14px;}
.ui-daterange.is-set .ui-daterange__btn{color:var(--ui-text);}
.ui-daterange__txt{flex:1 1 auto;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ui-daterange__chev{margin-left:auto;color:var(--ui-muted);}
.ui-daterange__pop{position:absolute;left:0;top:calc(100% + 6px);z-index:70;min-width:min(340px,92vw);padding:12px;box-shadow:var(--ui-shadow-md);border-radius:12px;}
.ui-daterange__pop[hidden]{display:none;}
.ui-daterange__presets{display:flex;flex-wrap:wrap;gap:6px;}
.ui-daterange__preset{height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--ui-border);background:var(--ui-surface);color:var(--ui-text-2);font:500 12.5px var(--ui-font);cursor:pointer;}
.ui-daterange__preset:hover{border-color:var(--ui-primary);color:var(--ui-primary);background:var(--ui-primary-soft);}
.ui-daterange__custom{display:none;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;}
.ui-daterange__custom.is-open{display:grid;}
.ui-daterange__custom label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--ui-muted);}
.ui-daterange__custom .ui-input{width:100%;}
.ui-daterange__foot{display:flex;justify-content:flex-end;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid var(--ui-border);}
/* column chooser popover */
.ui-listbar__pop.ui-colpop{right:0;left:auto;max-height:70vh;overflow:auto;}
.ui-colpop__head{display:flex;flex-direction:column;gap:2px;padding:4px 6px 8px;font-size:13px;} .ui-colpop__head .ui-muted{font-size:12px;}
.ui-colpop__row{display:flex;align-items:center;gap:10px;font-size:13.5px;padding:6px 8px;border-radius:8px;cursor:pointer;} .ui-colpop__row:hover{background:var(--ui-surface-2);}
.ui-colpop__row.is-fixed{color:var(--ui-muted);cursor:default;} .ui-colpop__row i{margin-left:auto;font-size:14px;color:var(--ui-muted);}
.ui-colpop__row span{flex:1 1 auto;}
.ui-colpop__foot{display:flex;gap:8px;justify-content:space-between;margin-top:6px;padding-top:8px;border-top:1px solid var(--ui-border);}
/* narrow screens */
@media (max-width:1023px){
  .ui-listbar__row1{flex-wrap:wrap;}
  .ui-listbar__search{flex:1 1 100%;min-width:0;order:1;flex-wrap:wrap;}
  .ui-listbar__search .ui-input-group{min-width:0;}                         /* the input shrinks, the Search button never runs outside the card */
  .ui-listbar__scope{order:0;max-width:100%;overflow-x:auto;scrollbar-width:none;} .ui-listbar__tools{order:2;margin-left:0;width:100%;justify-content:flex-end;flex-wrap:wrap;}
}
.ui-listbar__scope{max-width:100%;min-width:0;}
@media (max-width:640px){
  .ui-listbar__tools .ui-btn span:not(.ui-listbar__n){display:none;}
  .ui-listbar__tools .ui-btn{padding:0 12px;}
  .ui-listbar.is-sheet .ui-listbar__row2{position:fixed;left:0;right:0;bottom:0;z-index:1300;margin:0;padding:0 16px 16px;background:var(--ui-surface);border:1px solid var(--ui-border);border-bottom:0;border-radius:16px 16px 0 0;max-height:84vh;overflow:auto;box-shadow:var(--ui-shadow-lg);}
  .ui-listbar.is-sheet .ui-listbar__sheethead{display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;background:var(--ui-surface);padding:14px 0 10px;margin:0 0 6px;border-bottom:1px solid var(--ui-border);font-size:15px;}
  .ui-listbar.is-sheet .ui-listbar__sheetfoot{display:flex;gap:10px;position:sticky;bottom:0;background:var(--ui-surface);padding:12px 0 0;margin-top:14px;border-top:1px solid var(--ui-border);}
  .ui-listbar.is-sheet .ui-listbar__sheetfoot .ui-btn{flex:1 1 0;justify-content:center;}
  .ui-listbar.is-sheet .ui-listbar__resetcell{display:none;}
  .ui-listbar__backdrop{position:fixed;inset:0;z-index:1290;background:rgba(17,26,46,.55);}
  .ui-listbar__backdrop[hidden]{display:none;}
  html.ui-listbar-sheet{overflow:hidden;}
  .ui-daterange__pop{position:fixed;left:16px;right:16px;top:auto;bottom:16px;z-index:1400;min-width:0;}
}

/* ---------- Part 2: hidden / typed columns, density, saved views, export window ---------- */
table[data-ui-cols] [data-col-hidden]{display:none !important;}
.ui-table td[data-col-kind="num"],.main-content table td[data-col-kind="num"],.ui-table th[data-col-kind="num"],.main-content table th[data-col-kind="num"]{text-align:right;font-variant-numeric:tabular-nums;}
.ui-table th[data-col-kind="date"],.main-content table th[data-col-kind="date"]{width:148px;}
.ui-table td[data-col-kind="date"],.main-content table td[data-col-kind="date"]{white-space:nowrap;}
.ui-table td .ui-table__primary,.ui-table td .ui-table__sub,.main-content table td .ui-table__primary,.main-content table td .ui-table__sub{max-width:var(--ui-col-max,360px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-cellp__txt{min-width:0;} .ui-cellp__txt > *{max-width:100%;}
html[data-ui-density="compact"] .ui-table tbody td,html[data-ui-density="compact"] .main-content table:not(.no-ui) tbody td{height:40px !important;padding-top:4px !important;padding-bottom:4px !important;font-size:13px !important;}
html[data-ui-density="compact"] .ui-table thead th,html[data-ui-density="compact"] .main-content table:not(.no-ui) thead th{height:36px;}
html[data-ui-density="compact"] .ui-table__sub{font-size:11.5px;} html[data-ui-density="compact"] .ui-avatar--sm{width:28px;height:28px;font-size:11px;}
html[data-ui-density="compact"] .ui-iconbtn--sm{width:28px;height:28px;}
.ui-colpop__list{display:flex;flex-direction:column;gap:2px;max-height:48vh;overflow:auto;}
.ui-colpop__row.is-dragging{opacity:.4;} .ui-colpop__grip{color:var(--ui-border-strong);cursor:grab;font-size:15px;} .ui-colpop__row:hover .ui-colpop__grip{color:var(--ui-muted);}
.ui-colpop__pin{font-size:14px;color:var(--ui-muted);}
.ui-colpop__row[draggable="true"]{cursor:grab;}
.ui-colpop__dens{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:8px;padding-top:8px;border-top:1px solid var(--ui-border);font-size:12.5px;color:var(--ui-muted);}
.ui-viewpop{min-width:320px;} .ui-viewpop__list{display:flex;flex-direction:column;gap:2px;max-height:48vh;overflow:auto;}
.ui-viewpop__row{display:flex;align-items:center;gap:2px;border-radius:8px;padding:2px;} .ui-viewpop__row:hover,.ui-viewpop__row.is-active{background:var(--ui-surface-2);}
.ui-viewpop__apply{flex:1 1 auto;display:grid;grid-template-columns:18px 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;text-align:left;border:0;background:transparent;padding:6px 6px;cursor:pointer;color:var(--ui-text);font:500 13.5px var(--ui-font);}
.ui-viewpop__apply i{grid-row:1 / span 2;color:var(--ui-primary);} .ui-viewpop__apply small{font-size:11.5px;color:var(--ui-muted);font-weight:400;} .ui-viewpop__apply small:empty{display:none;}
.ui-viewpop .ui-iconbtn.is-on{color:var(--ui-primary);}
.ui-iconbtn--danger:hover{color:var(--ui-danger);background:var(--ui-danger-soft);}
.ui-viewform{display:flex;flex-direction:column;gap:10px;text-align:left;} .ui-viewform .ui-input{width:100%;}
.ui-check{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ui-text-2);cursor:pointer;} .ui-check input{width:16px;height:16px;accent-color:var(--ui-primary);margin:0;}
.ui-export__sec + .ui-export__sec{margin-top:16px;} .ui-export__lab{font-size:12.5px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ui-muted);margin-bottom:8px;}
.ui-export__opts{display:flex;flex-direction:column;gap:6px;}
.ui-export__opt{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--ui-border);border-radius:10px;cursor:pointer;} .ui-export__opt:has(input:checked){border-color:var(--ui-primary);background:var(--ui-primary-soft);}
.ui-export__opt.is-off{opacity:.5;cursor:default;} .ui-export__opt input{margin-top:3px;accent-color:var(--ui-primary);} .ui-export__opt b{display:block;font-size:14px;font-weight:600;color:var(--ui-text);} .ui-export__opt small{display:block;font-size:12px;color:var(--ui-muted);margin-top:2px;}
.ui-export__est{margin:16px 0 0;font-size:13px;color:var(--ui-text-2);} .ui-export__prog{margin-top:14px;} .ui-export__prog[hidden]{display:none;} .ui-export__prog p{margin:8px 0 0;font-size:13px;color:var(--ui-text-2);}
.ui-export .ui-pop__body > * + *{margin-top:0;}
.ui-listbar.is-tight .ui-listbar__tools .ui-btn > span:not(.ui-listbar__n){display:none;}
.ui-listbar.is-tight .ui-listbar__tools .ui-btn{padding:0 12px;}
.ui-listbar__viewchips{margin-top:10px;}

/* ---------- Part 3: row actions (fixed icon set) + selection column + bulk bar ---------- */
.ui-ract .ui-iconbtn{width:36px;height:36px;font-size:17px;color:var(--ui-muted);}
.ui-ract .ui-iconbtn:hover{color:var(--ui-primary);background:var(--ui-primary-soft);}
.ui-ract .ui-iconbtn--danger{color:var(--ui-muted);} .ui-ract .ui-iconbtn--danger:hover{color:var(--ui-danger);background:var(--ui-danger-soft);}
html[data-ui-density="compact"] .ui-ract .ui-iconbtn{width:32px;height:32px;font-size:16px;}
.ui-selcol{width:44px !important;padding-left:16px !important;padding-right:4px !important;}
.ui-selcol input{width:16px;height:16px;margin:0;accent-color:var(--ui-primary);cursor:pointer;vertical-align:middle;}
tr.is-selected > td{background:var(--ui-primary-soft) !important;}
.ui-bulkbar{position:fixed;left:50%;bottom:20px;transform:translateX(-50%) translateY(20px);z-index:900;display:flex;align-items:center;gap:8px;padding:8px 8px 8px 16px;border-radius:14px;background:var(--ui-text);color:#fff;box-shadow:var(--ui-shadow-lg);opacity:0;pointer-events:none;transition:opacity .15s var(--ui-ease),transform .15s var(--ui-ease);max-width:calc(100vw - 32px);flex-wrap:wrap;}
.ui-bulkbar.is-on{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0);}
.ui-bulkbar__n{font-weight:600;font-size:14px;white-space:nowrap;} .ui-bulkbar__sep{width:1px;height:22px;background:rgba(255,255,255,.2);margin:0 4px;}
.ui-bulkbar .ui-btn{height:36px;background:rgba(255,255,255,.08);border-color:transparent;color:#fff;} .ui-bulkbar .ui-btn:hover{background:rgba(255,255,255,.16);}
.ui-bulkbar .ui-btn.is-danger:hover{background:var(--ui-danger);} .ui-bulkbar__all{background:none;border:0;color:#fff;text-decoration:underline;font:500 13px var(--ui-font);cursor:pointer;padding:0 6px;}
.ui-bulkbar .ui-iconbtn{color:#fff;} .ui-bulkbar .ui-iconbtn:hover{background:rgba(255,255,255,.16);}
.dark .ui-bulkbar{background:var(--ui-surface-2);color:var(--ui-text);border:1px solid var(--ui-border);} .dark .ui-bulkbar .ui-btn,.dark .ui-bulkbar .ui-iconbtn,.dark .ui-bulkbar__all{color:var(--ui-text);}
@media print{.ui-selcol,.ui-bulkbar{display:none !important;}}

/* ---------- Part 6: Photos / Documents tabs (components/media_tabs.php) ---------- */
.ui-media__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;}
.ui-media__card{position:relative;margin:0;border:1px solid var(--ui-border);border-radius:12px;overflow:hidden;background:var(--ui-surface);}
.ui-media__card.is-cover{border-color:var(--ui-accent);box-shadow:0 0 0 1px var(--ui-accent) inset;}
.ui-media__card.is-dragging{opacity:.45;} .ui-media__card[draggable="true"]{cursor:grab;}
.ui-media__img{display:block;} .ui-media__img img{display:block;width:100%;height:140px;object-fit:cover;background:var(--ui-surface-2);}
.ui-media__cover{position:absolute;top:8px;left:8px;display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 8px;border-radius:999px;background:var(--ui-accent-soft);color:var(--ui-accent);font-size:11.5px;font-weight:700;}
.ui-media__card figcaption{padding:8px 10px;font-size:12.5px;color:var(--ui-text);display:flex;flex-direction:column;gap:2px;} .ui-media__card figcaption small{color:var(--ui-muted);font-size:11.5px;}
.ui-media__cap{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-media__acts{position:absolute;top:6px;right:6px;display:flex;gap:2px;align-items:center;padding:2px;border-radius:10px;background:rgba(255,255,255,.92);opacity:0;transition:opacity .12s var(--ui-ease);}
.dark .ui-media__acts{background:rgba(18,24,38,.92);}
.ui-media__card:hover .ui-media__acts,.ui-media__card:focus-within .ui-media__acts{opacity:1;} @media (hover:none){.ui-media__acts{opacity:1;}}
.ui-media__grip{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;color:var(--ui-muted);cursor:grab;}
.ui-media__list{display:flex;flex-direction:column;gap:8px;}
.ui-media__doc{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--ui-border);border-radius:12px;background:var(--ui-surface);}
.ui-media__dic{width:40px;height:40px;flex:none;border-radius:10px;background:var(--ui-primary-soft);color:var(--ui-primary);display:inline-flex;align-items:center;justify-content:center;font-size:20px;}
.ui-media__dbody{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px;} .ui-media__dbody b{font-size:14px;font-weight:600;color:var(--ui-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-media__dbody span{font-size:12.5px;color:var(--ui-muted);} .ui-media__dbody em{font-size:12.5px;color:var(--ui-text-2);font-style:normal;}
.ui-media__dacts{display:flex;align-items:center;gap:4px;flex:none;}
.ui-media__drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:26px 16px;border:2px dashed var(--ui-border-strong);border-radius:12px;background:var(--ui-surface-2);color:var(--ui-text-2);cursor:pointer;text-align:center;}
.ui-media__drop i{font-size:28px;color:var(--ui-primary);} .ui-media__drop b{font-size:14px;color:var(--ui-text);} .ui-media__drop small{font-size:12px;color:var(--ui-muted);}
.ui-media__drop.is-over,.ui-media__drop:hover{border-color:var(--ui-primary);background:var(--ui-primary-soft);}
.ui-media__picks{display:flex;flex-direction:column;gap:8px;margin-top:12px;max-height:40vh;overflow:auto;} .ui-media__picks:empty{display:none;}
.ui-media__pick{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--ui-border);border-radius:10px;} .ui-media__pick.is-bad{border-color:var(--ui-danger);}
.ui-media__pick img{width:56px;height:56px;object-fit:cover;border-radius:8px;background:var(--ui-surface-2);flex:none;} .ui-media__pick > div{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:4px;}
.ui-media__pick b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;} .ui-media__pick small{font-size:11.5px;color:var(--ui-muted);} .ui-media__pick .form-input{height:36px;padding:0 10px;font-size:13px;}
@media (max-width:640px){.ui-media__grid{grid-template-columns:repeat(2,minmax(0,1fr));} .ui-media__img img{height:110px;} .ui-media__doc{flex-wrap:wrap;} .ui-media__dacts{width:100%;justify-content:flex-end;}}

/* ---------- Part 7: sort state, sticky header, scroll shadow, frozen column, hover actions, row focus, peek drawer ---------- */
.ui-table th[data-sort],.main-content table th[data-sort]{cursor:pointer;user-select:none;}
.ui-table th[data-sort] .ui-sorticon,.main-content table th[data-sort] .ui-sorticon{margin-left:4px;font-size:13px;color:var(--ui-border-strong);vertical-align:middle;}
.ui-table th[data-sort]:hover .ui-sorticon,.main-content table th[data-sort]:hover .ui-sorticon{color:var(--ui-muted);}
.ui-table th[aria-sort="ascending"],.ui-table th[aria-sort="descending"],.main-content table th[aria-sort="ascending"],.main-content table th[aria-sort="descending"]{color:var(--ui-primary) !important;}
.ui-table th[aria-sort] .ui-sorticon,.main-content table th[aria-sort] .ui-sorticon{color:var(--ui-primary);}
.ui-table-wrap{position:relative;}
.ui-table-wrap.is-tall{max-height:calc(100vh - 170px);overflow:auto;}
.ui-table-wrap.is-tall thead th,.ui-table-wrap.is-tall .main-content table thead th{position:sticky;top:0;z-index:3;}
.ui-table-wrap.has-right::after,.ui-table-wrap.has-left::before{content:"";position:sticky;top:0;bottom:0;width:0;pointer-events:none;z-index:4;display:block;}
.ui-table-wrap.has-right{box-shadow:inset -14px 0 14px -14px rgba(17,26,46,.28);}
.ui-table-wrap.has-left{box-shadow:inset 14px 0 14px -14px rgba(17,26,46,.28);}
.ui-table-wrap.has-left.has-right{box-shadow:inset 14px 0 14px -14px rgba(17,26,46,.28),inset -14px 0 14px -14px rgba(17,26,46,.28);}
@media (max-width:640px){
  .ui-table-wrap table th:first-child,.ui-table-wrap table td:first-child{position:sticky;left:0;z-index:2;background:var(--ui-surface);}
  .ui-table-wrap table th:first-child.ui-selcol + th,.ui-table-wrap table td:first-child.ui-selcol + td{position:sticky;left:44px;z-index:2;background:var(--ui-surface);box-shadow:4px 0 6px -4px rgba(17,26,46,.18);}
  .ui-table-wrap table thead th:first-child,.ui-table-wrap table thead th.ui-selcol + th{z-index:3;background:var(--ui-surface-2);}
  .ui-table-wrap table tbody tr:hover td:first-child,.ui-table-wrap table tbody tr.is-focused td:first-child,.ui-table-wrap table tbody tr:hover td.ui-selcol + td,.ui-table-wrap table tbody tr.is-focused td.ui-selcol + td{background:var(--ui-surface-2);}
}
@media (hover:hover){
  .ui-table tbody tr .ui-ract,.main-content table tbody tr .ui-ract{opacity:.35;transition:opacity .12s var(--ui-ease);}
  .ui-table tbody tr .ui-ract:has(.ui-btn),.main-content table tbody tr .ui-ract:has(.ui-btn){opacity:1;}   /* text buttons (Edit / View) stay readable at rest — only icon clusters fade until hover */
  .ui-table tbody tr:hover .ui-ract,.ui-table tbody tr:focus-within .ui-ract,.ui-table tbody tr.is-focused .ui-ract,.main-content table tbody tr:hover .ui-ract,.main-content table tbody tr:focus-within .ui-ract,.main-content table tbody tr.is-focused .ui-ract{opacity:1;}
}
.ui-table tbody tr.is-focused > td,.main-content table tbody tr.is-focused > td{background:var(--ui-primary-soft) !important;}
.ui-table tbody tr.is-focused > td:first-child,.main-content table tbody tr.is-focused > td:first-child{box-shadow:inset 3px 0 0 var(--ui-primary);}
.ui-table-wrap:focus-visible{outline:2px solid var(--ui-primary);outline-offset:2px;border-radius:8px;}
/* peek drawer */
.ui-peek{position:fixed;top:0;right:0;bottom:0;z-index:1250;width:min(560px,100%);background:var(--ui-surface);box-shadow:var(--ui-shadow-lg);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .2s var(--ui-ease);}
.ui-peek.is-open{transform:translateX(0);}
.ui-peek__backdrop{position:fixed;inset:0;z-index:1240;background:rgba(17,26,46,.35);} .ui-peek__backdrop[hidden]{display:none;}
.ui-peek__head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--ui-border);} .ui-peek__head b{flex:1 1 auto;font-size:14px;color:var(--ui-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-peek__ic{width:28px;height:28px;border-radius:8px;background:var(--ui-primary-soft);color:var(--ui-primary);display:inline-flex;align-items:center;justify-content:center;font-size:15px;flex:none;}
.ui-peek__body{flex:1 1 auto;overflow:auto;padding:16px;background:var(--ui-bg);}
.ui-peek__body .ui-dcard{margin-bottom:12px;} .ui-peek__body .ui-dtabs,.ui-peek__body .ui-dh__actions,.ui-peek__body .ui-detail-back,.ui-peek__body script{display:none !important;}
.ui-peek__body .ui-dbody{display:block;} .ui-peek__body .ui-dbody__side{margin-top:12px;} .ui-peek__body .ui-card,.ui-peek__body section{margin-bottom:12px;}
.ui-peek__body .ui-dh{flex-wrap:wrap;} .ui-peek__body .ui-dh__facts{grid-template-columns:repeat(2,minmax(0,1fr));}
.ui-peek__foot{display:flex;justify-content:flex-end;gap:8px;padding:12px 16px;border-top:1px solid var(--ui-border);}
.ui-peek__note{padding:14px;font-size:13px;color:var(--ui-muted);}
@media (max-width:640px){.ui-peek{width:100%;}}

/* ---------- ui/detail-actions: one action bar for every detail / list / report header (assets/js/ui-actionbar.js) ---------- */
.ui-actionbar{display:flex;align-items:center;gap:8px;flex-wrap:nowrap !important;flex:none;max-width:none !important;}
.ui-actionbar .ui-ab__gap{display:block;width:8px;flex:none;} .ui-actionbar .ui-ab__gap[hidden]{display:none;}
.ui-actionbar .ui-ab__icon{width:40px;height:40px;padding:0;justify-content:center;flex:none;position:relative;}
.ui-actionbar .ui-ab__icon i{font-size:18px;margin:0;}
.ui-actionbar .ui-ab__label-sr{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.ui-actionbar .ui-ab__primary{flex:none;white-space:nowrap;}
.ui-btn--danger-ghost{background:transparent;border:1px solid var(--ui-border);color:var(--ui-danger);}
.ui-btn--danger-ghost:hover,.ui-btn--danger-ghost:focus-visible{background:var(--ui-danger-soft);border-color:var(--ui-danger);color:var(--ui-danger);}
.ui-actionbar .ui-ab__icon.is-on{background:var(--ui-primary-soft);border-color:var(--ui-primary);color:var(--ui-primary);}
.ui-actionbar .ui-ab__more{flex:none;} .ui-actionbar .ui-ab__more[hidden]{display:none;}
.ui-actionbar .ui-ab__menu{position:absolute;right:0;top:calc(100% + 6px);z-index:80;min-width:220px;padding:6px;box-shadow:var(--ui-shadow-md);}
.ui-actionbar .ui-ab__menu[hidden]{display:none;}
.ui-actionbar{position:relative;}
.ui-ab__menu .ui-dropdown__item{width:100%;text-align:left;border:0;background:transparent;font:500 13.5px var(--ui-font);cursor:pointer;}
.ui-ab__menu .ui-dropdown__item:focus-visible{outline:2px solid var(--ui-primary);outline-offset:-2px;}
.ui-ab__menu .ui-dropdown__item.is-on i{color:var(--ui-primary);}
/* tooltip: hover + keyboard focus */
[data-tip]{position:relative;}
[data-tip]::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%) translateY(4px);background:var(--ui-text);color:#fff;font:500 12px/1.3 var(--ui-font);padding:6px 9px;border-radius:7px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s var(--ui-ease),transform .12s var(--ui-ease);z-index:90;}
[data-tip]::before{content:"";position:absolute;left:50%;bottom:calc(100% + 3px);transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--ui-text);opacity:0;transition:opacity .12s var(--ui-ease);pointer-events:none;z-index:90;}
[data-tip]:hover::after,[data-tip]:focus-visible::after,[data-tip]:hover::before,[data-tip]:focus-visible::before{opacity:1;}
[data-tip]:hover::after,[data-tip]:focus-visible::after{transform:translateX(-50%) translateY(0);}
.dark [data-tip]::after{background:var(--ui-surface-2);color:var(--ui-text);border:1px solid var(--ui-border);} .dark [data-tip]::before{border-top-color:var(--ui-border);}
.ui-actionbar > :first-child[data-tip]::after{left:0;transform:translateX(0) translateY(4px);} .ui-actionbar > :first-child[data-tip]:hover::after,.ui-actionbar > :first-child[data-tip]:focus-visible::after{transform:translateX(0) translateY(0);}
.ui-actionbar > .ui-ab__more[data-tip]::after,.ui-actionbar > [data-tip]:last-of-type::after{left:auto;right:0;transform:translateX(0) translateY(4px);} .ui-actionbar > .ui-ab__more[data-tip]:hover::after,.ui-actionbar > .ui-ab__more[data-tip]:focus-visible::after,.ui-actionbar > [data-tip]:last-of-type:hover::after,.ui-actionbar > [data-tip]:last-of-type:focus-visible::after{transform:translateX(0) translateY(0);}
/* the header never wraps: the title truncates before actions are hidden */
.ui-dh__top{flex-wrap:nowrap;align-items:center;}
.ui-dh__titles{min-width:0;flex:1 1 auto;}
.ui-dh__title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;word-break:normal;display:flex;align-items:center;gap:8px;min-width:0;}
.ui-dh__title > :first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-dh__title .ui-rid{flex:none;margin-left:0;top:0;}
.ui-dh__meta{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
@media (max-width:1024px){.ui-dh__top{flex-direction:row;}.ui-dh__actions{max-width:none;justify-content:flex-end;}}
.ui-page-header{flex-wrap:nowrap;} .ui-page-header > div:first-child{min-width:0;} .ui-page-header__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ui-page-header__actions.ui-actionbar{flex-wrap:nowrap;gap:8px;}
@media (max-width:639px){.ui-page-header__actions.ui-actionbar .ui-ab__primary{height:40px;}}
.ui-actionbar > [hidden],.ui-actionbar > .ui-ab__icon[hidden],.ui-actionbar > .ui-ab__primary[hidden]{display:none !important;}

/* ---- dark-mode contrast (axe color-contrast ≥ 4.5:1, chore/consistency-guard) ---- */
.ui-btn--primary:hover,.ui-btn--primary:focus-visible{background:var(--ui-primary-fill-hover,var(--ui-primary-hover));}
html.dark .text-gray-500,html.dark .text-gray-400{color:var(--ui-muted) !important;}
html.dark .text-primary-500,html.dark .text-primary-600{color:var(--ui-primary) !important;}
html.dark .text-danger,html.dark .mov-badge{color:var(--ui-danger) !important;}
html.dark .text-success{color:var(--ui-success) !important;}
html.dark .text-warning{color:var(--ui-warning) !important;}

/* ---- dark-mode contrast (ui/toolbar-standard Part 3): token-level fixes for the axe findings ---- */
:root{--ui-danger-fill:#c0262d;}
html.dark{--ui-danger-fill:#cc3f45;}   /* white text 4.81:1, fill 3.69:1 on the dark surface */
.ui-btn--danger{background:var(--ui-danger-fill);}
html.dark .text-gray-600{color:var(--ui-text-2) !important;}
html.dark .ui-ract .ui-btn,html.dark .ui-ract .ui-iconbtn{color:var(--ui-text-2);}
html.dark .inc-st-solved{color:var(--ui-success) !important;}
html.dark .inc-badge-violet,html.dark .inc-tbadge.inc-badge-violet{color:var(--ui-primary) !important;}
html.dark .mot-seg input:checked + span{color:var(--ui-bg) !important;}
.arc-ref-suggest,#arc_ref_spin i{color:var(--ui-primary) !important;}
/* photo / file tiles: filled, never a bordered box inside the side panel (identity: no dashed tiles) */
.ui-pp .ui-pp__tile:is(#imagePlaceHolder,#imagePlaceHolder_old,[id]){border:0 !important;background:var(--ui-surface-2) !important;}
.ppl-filepick{border:0 !important;}
/* the identity font wins over Tailwind's font-sans stack and the legacy file-input label font */
.font-sans,.file-container,.file-container .file-name,.file-input-label{font-family:var(--ui-font) !important;}
/* token utilities for markup that used Tailwind arbitrary colours (bg-[#…] / text-[#…]) — ui/toolbar-standard Part 3 */
.ui-bg-primary-soft{background-color:var(--ui-primary-soft) !important;} .ui-bg-surface-2{background-color:var(--ui-surface-2) !important;} .ui-bg-surface{background-color:var(--ui-surface) !important;}
.ui-tx-muted{color:var(--ui-muted) !important;} .ui-tx-text{color:var(--ui-text) !important;} .ui-tx-primary{color:var(--ui-primary) !important;}
.ui-bd-border{border-color:var(--ui-border) !important;}

/* ---- Physical licence card preview (workload/licenseViewForm.php) — the card face is a printed design, not UI chrome ---- */
.ui-lcard__face { background: radial-gradient(120% 140% at 85% -10%, color-mix(in srgb, color-mix(in srgb, var(--ui-primary) 52%, white) 45%, transparent) 0%, transparent 45%), radial-gradient(120% 120% at -10% 110%, color-mix(in srgb, color-mix(in srgb, var(--ui-primary) 72%, black) 55%, transparent) 0%, transparent 50%), linear-gradient(135deg, #0B2C57 0%, #06203F 55%, #0A2540 100%); }   /* physical: card face */
.ui-lcard__lines { background: repeating-linear-gradient(46deg, color-mix(in srgb, var(--ui-surface) 5%, transparent) 0 1px, transparent 1px 7px); }
.ui-lcard__holo { background: conic-gradient(from 0deg, var(--ui-danger-soft), color-mix(in srgb, var(--ui-primary) 12%, white), var(--ui-success-soft), var(--ui-accent-soft), var(--ui-info-soft), color-mix(in srgb, var(--ui-primary) 12%, white), var(--ui-danger-soft)); }

/* ---- Help & Training Centre v2 (components/help_modal.php · assets/js/ui-help.js) ---- */
.ui-hlp .ui-pop__card--xl{max-width:1240px;}
.ui-hlp__headtools{display:flex;gap:8px;align-items:center;margin-right:8px;}
.ui-hlp__tabs{flex:none;padding:0 24px;gap:2px;overflow-x:auto;scrollbar-width:none;}
.ui-hlp__tabs .ui-tabs__tab{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:10px 12px;border:0;background:none;font:600 14px var(--ui-font);}
.ui-hlp__tabs .ui-tabs__tab i{font-size:16px;} .ui-hlp__tabs .ui-tabs__tab.active{color:var(--ui-text);border-bottom-color:var(--ui-accent);}
.ui-hlp__main{grid-template-columns:224px minmax(0,1fr) 220px;}
.ui-hlp__cats[hidden]{display:none;}
.ui-hlp__cat.is-shared{color:var(--ui-muted);} .ui-hlp__cat.is-shared i{color:var(--ui-info);}
.ui-hlp__side{overflow-y:auto;padding:16px 16px 16px 0;border-left:1px solid var(--ui-border);margin-left:16px;padding-left:16px;}
.ui-hlp__side:empty{display:none;}
.ui-hlp__sidebox b{display:block;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);margin-bottom:8px;}
.ui-hlp__sidebox p{margin:0;font-size:13px;line-height:1.5;color:var(--ui-text-2);}
.ui-hlp__outline{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px;}
.ui-hlp__outline a{font-size:13px;color:var(--ui-text-2);text-decoration:none;display:block;padding:3px 0 3px 10px;border-left:2px solid var(--ui-border);line-height:1.35;}
.ui-hlp__outline a:hover{color:var(--ui-primary);border-left-color:var(--ui-primary);} .ui-hlp__outline .lvl3 a{padding-left:20px;}
.ui-hlp__g{margin:10px 0 2px;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);display:flex;align-items:center;gap:8px;}
.ui-hlp__h{display:flex;align-items:center;gap:8px;}
.ui-hlp__cards{display:flex;flex-direction:column;gap:8px;}
.ui-hlp__item--card{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;text-align:left;cursor:pointer;color:var(--ui-text);font:inherit;}
.ui-hlp__item--card:hover{border-color:var(--ui-primary);background:var(--ui-surface);} .ui-hlp__item--card:focus-visible{outline:none;box-shadow:var(--ui-ring);}
.ui-hlp__itemic{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none;background:var(--ui-primary-soft);color:var(--ui-primary);font-size:17px;}
.ui-hlp__itembody{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;} .ui-hlp__itembody b{font-size:14.5px;font-weight:600;line-height:1.35;} .ui-hlp__itembody small{font-size:12.5px;color:var(--ui-muted);line-height:1.4;}
.ui-hlp__item--card > i{font-size:20px;color:var(--ui-muted);flex:none;}
.ui-hlp__badges{display:flex;flex-wrap:wrap;gap:6px;align-items:center;} .ui-hlp__badges:empty{display:none;}
.ui-hlp__badge{display:inline-flex;align-items:center;gap:4px;font:600 11.5px var(--ui-font);padding:2px 8px;border-radius:999px;background:var(--ui-surface-2);color:var(--ui-muted);}
.ui-hlp__badge i{font-size:12px;} .ui-hlp__badge--perm{font-family:var(--ui-mono);font-weight:500;} .ui-hlp__badge--shared{background:var(--ui-info-soft);color:var(--ui-info);}
.ui-hlp__crumb{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--ui-muted);margin-bottom:4px;} .ui-hlp__crumb .auth-link{display:inline-flex;align-items:center;gap:4px;}
.ui-hlp__article{display:flex;flex-direction:column;gap:14px;max-width:760px;}
.ui-hlp__ahead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;} .ui-hlp__aacts{display:flex;gap:8px;margin-left:auto;}
.ui-hlp__body{font-size:14.5px;line-height:1.6;color:var(--ui-text-2);display:flex;flex-direction:column;gap:10px;}
.ui-hlp__body h2,.ui-hlp__article--start h2{margin:14px 0 2px;font-size:20px;font-weight:600;color:var(--ui-text);line-height:1.3;} .ui-hlp__body h2:first-child{margin-top:0;}
.ui-hlp__body h3,.ui-hlp__article--start h3{margin:10px 0 0;font-size:15px;font-weight:600;color:var(--ui-text);} .ui-hlp__body h4{margin:6px 0 0;font-size:14px;font-weight:600;color:var(--ui-text);}
.ui-hlp__body p,.ui-hlp__article--start p{margin:0;} .ui-hlp__body strong{color:var(--ui-text);} .ui-hlp__body code,.ui-md__table code{font:500 12.5px var(--ui-mono);background:var(--ui-surface-2);padding:1px 6px;border-radius:6px;color:var(--ui-text);}
.ui-hlp__body a{color:var(--ui-primary);text-decoration:underline;text-underline-offset:2px;}
.ui-md__steps{margin:0;padding:0;list-style:none;counter-reset:hs;display:flex;flex-direction:column;gap:8px;}
.ui-md__steps li{counter-increment:hs;position:relative;padding-left:34px;} .ui-md__steps li::before{content:counter(hs);position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--ui-primary-soft);color:var(--ui-primary);font:700 12px var(--ui-mono);}
.ui-md__list{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:5px;}
.ui-md__callout{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:10px;font-size:13.5px;line-height:1.5;background:var(--ui-surface-2);color:var(--ui-text);} .ui-md__callout i{font-size:16px;flex:none;margin-top:1px;color:var(--ui-info);}
.ui-md__callout--tip{background:var(--ui-primary-soft);} .ui-md__callout--tip i{color:var(--ui-primary);} .ui-md__callout--warning{background:var(--ui-warning-soft);} .ui-md__callout--warning i{color:var(--ui-warning);}
.ui-md__fig{margin:4px 0;border:1px solid var(--ui-border);border-radius:12px;overflow:hidden;background:var(--ui-surface-2);} .ui-md__fig img{display:block;width:100%;height:auto;} .ui-md__fig figcaption{padding:8px 12px;font-size:12.5px;color:var(--ui-muted);border-top:1px solid var(--ui-border);background:var(--ui-surface);}
.ui-md__tablewrap{overflow-x:auto;border:1px solid var(--ui-border);border-radius:10px;} .ui-md__table{width:100%;border-collapse:collapse;font-size:13.5px;}
.ui-md__table th{text-align:left;background:var(--ui-surface-2);font:600 11.5px var(--ui-font);letter-spacing:.04em;text-transform:uppercase;color:var(--ui-muted);padding:8px 10px;} .ui-md__table td{padding:8px 10px;border-top:1px solid var(--ui-border);vertical-align:top;line-height:1.45;} .ui-md__table tr.is-hl td{background:var(--ui-accent-soft);}
.ui-hlp__flow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:4px 0;} .ui-hlp__step{display:inline-flex;align-items:center;gap:8px;padding:8px 12px 8px 8px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface);font-size:13.5px;} .ui-hlp__step b{font-weight:600;color:var(--ui-text);}
.ui-hlp__stepn{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--ui-primary);color:#fff;font:700 12px var(--ui-mono);} .ui-hlp__flowarrow{color:var(--ui-muted);font-size:18px;}
.ui-hlp__check{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;} .ui-hlp__check li{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:8px 12px;border:1px solid var(--ui-border);border-radius:10px;background:var(--ui-surface);}
.ui-hlp__checkitem{display:flex;align-items:center;gap:10px;flex:1;min-width:200px;font-size:14px;color:var(--ui-text);cursor:pointer;} .ui-hlp__checkitem input{width:18px;height:18px;accent-color:var(--ui-primary);} .ui-hlp__checkitem input:checked + span{color:var(--ui-muted);text-decoration:line-through;}
.ui-hlp__check .auth-link{display:inline-flex;align-items:center;gap:4px;font-size:13px;}
.ui-hlp__startacts{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px;}
.ui-hlp__gloss{margin:0;display:grid;grid-template-columns:minmax(140px,220px) 1fr;gap:10px 16px;} .ui-hlp__gloss dt{font-weight:600;color:var(--ui-text);font-size:14px;padding-top:2px;} .ui-hlp__gloss dd{margin:0;font-size:14px;color:var(--ui-text-2);line-height:1.5;padding-bottom:10px;border-bottom:1px solid var(--ui-border);} .ui-hlp__gloss dd p{margin:0;}
.ui-hlp__abbr{font:500 11.5px var(--ui-mono);background:var(--ui-surface-2);padding:1px 6px;border-radius:6px;margin-left:4px;} .ui-hlp__from{display:block;font-size:11.5px;color:var(--ui-info);margin-top:2px;}
.ui-hlp__rel .auth-link i{margin-right:4px;}
/* 3-minute tour */
.ui-tour{position:fixed;inset:0;z-index:1300;} .ui-tour__spot{position:fixed;border-radius:12px;box-shadow:0 0 0 9999px rgba(17,26,46,.6),0 0 0 3px var(--ui-accent);transition:all .25s var(--ui-ease);pointer-events:none;}
.ui-tour__bubble{position:fixed;width:360px;max-width:calc(100vw - 32px);background:var(--ui-surface);color:var(--ui-text);border:1px solid var(--ui-border);border-radius:14px;box-shadow:var(--ui-shadow-lg);padding:16px 18px;display:flex;flex-direction:column;gap:8px;}
.ui-tour__bubble b{font-size:15px;font-weight:600;} .ui-tour__bubble p{margin:0;font-size:13.5px;line-height:1.5;color:var(--ui-text-2);} .ui-tour__foot{display:flex;align-items:center;gap:6px;margin-top:4px;} .ui-tour__n{font:600 12px var(--ui-mono);color:var(--ui-muted);margin-right:auto;}
/* print one article */
@media print{ html.ui-hlp-print body > *:not(#uiHelpc){display:none !important;} html.ui-hlp-print #uiHelpc{position:static;display:block !important;background:none;padding:0;} html.ui-hlp-print .ui-hlp__card{max-width:none;height:auto;max-height:none;border:0;box-shadow:none;}
  html.ui-hlp-print .ui-hlp__head,html.ui-hlp-print .ui-hlp__search,html.ui-hlp-print .ui-hlp__tabs,html.ui-hlp-print .ui-hlp__cats,html.ui-hlp-print .ui-hlp__side,html.ui-hlp-print .ui-hlp__foot,html.ui-hlp-print .ui-hlp__aacts,html.ui-hlp-print .ui-hlp__vote,html.ui-hlp-print .ui-hlp__crumb{display:none !important;}
  html.ui-hlp-print .ui-hlp__main{display:block;} html.ui-hlp-print .ui-hlp__list{overflow:visible;padding:0;} html.ui-hlp-print .ui-hlp__article{max-width:none;} }
@media (max-width:1100px){ .ui-hlp__main{grid-template-columns:200px minmax(0,1fr);} .ui-hlp__side{display:none;} }
@media (max-width:640px){ .ui-hlp__tabs{padding:0 12px;} .ui-hlp__tabs .ui-tabs__tab{padding:10px 8px;font-size:13px;} .ui-hlp__headtools{display:none;} .ui-hlp__gloss{grid-template-columns:1fr;} .ui-hlp__gloss dt{padding-top:6px;} .ui-tour__bubble{left:16px !important;right:16px;width:auto;} }
.ui-hlp__scopes{margin-top:auto;padding-top:12px;border-top:1px solid var(--ui-border);display:flex;flex-direction:column;gap:2px;} .ui-hlp__scopeh{display:block;padding:0 10px 4px;font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--ui-muted);}
.ui-hlp__cat--scope{color:var(--ui-muted);} .ui-hlp__cat--scope i{color:var(--ui-info);}
.ui-help-btn--topbar{margin-right:4px;}

/* =====================================================================================================
   Chip lists (ui/chips-and-overlap) — ONE rule for every list of chips / tags: facilities, document chips,
   active filters, saved views, notification types, timeline filters, region picker, empty-state suggestions.
   .ui-chips  flex-wrap · 8px gap both ways · start-aligned (--center for centred card bodies: the whole list)
   .ui-chip   32px tall · 0 12px · 16px icon · radius 999 · no min-width · text never wraps (ellipsis at 220px)
   Variants are semantic only: neutral (default) · --primary · --success · --warning · --danger (+ .dot / icon
   per the badge spec). assets/js/ui-chips.js sorts (alphabetical unless data-order="keep"), caps to the chips
   that fit in 2 lines (N ≤ 8 on profiles / dashboards, N ≤ 3 in table cells, data-max overrides) and adds the
   "+N more" chip that expands inline. Checked by scripts/ui-design-check.js (docs/ui-identity.md §6).
   ===================================================================================================== */
.ui-chips,.ui-fchips,.ui-filterchips,.ui-listbar__viewchips,.ui-nfm__chips,.inc-tl__chips,.ui-empty2__chips,.reg-pick,.apt-info__fac,.ui-pp .ui-pp__chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:flex-start;min-width:0;margin-left:0;margin-right:0;padding-left:0;padding-right:0;}
.ui-chips--center,.ui-empty2__chips{justify-content:center;}
.ui-chips[hidden],.ui-chips:empty,.ui-filterchips[hidden],.ui-listbar__viewchips[hidden],.ui-nfm__chips[hidden],.inc-tl__chips[hidden],.ui-pp .ui-pp__chips:empty{display:none;}
.ui-filterchips{margin:0 0 12px;padding-top:12px;}
.ui-chip{box-sizing:border-box;display:inline-block;height:32px;line-height:30px;max-width:220px;min-width:0;padding:0 12px;margin:0;border-radius:999px;border:1px solid var(--ui-border);background:var(--ui-surface-2);color:var(--ui-text-2);font-family:var(--ui-font);font-size:12.5px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle;text-decoration:none;cursor:default;text-align:left;}
.ui-chip > i,.ui-chip > span > i,.ui-chip .ui-fchip__ic{display:inline;font-size:16px;line-height:1;vertical-align:-3px;color:var(--ui-muted);margin:0 4px 0 0;width:auto;height:auto;background:none;}
.ui-chip .ui-fchip__ic i{font-size:16px;vertical-align:0;margin:0;}
.ui-chip > span{display:inline;}
.ui-chip b{font-weight:500;color:inherit;display:inline;}
.ui-chip small,.ui-chip .ui-pp__cs{display:inline;font-size:11.5px;color:var(--ui-muted);margin-left:4px;}
.ui-chip .ui-pp__cn{display:inline;color:var(--ui-text);font-weight:500;}
.ui-chip .dot{display:inline-block;width:6px;height:6px;border-radius:999px;background:currentColor;vertical-align:1px;margin-right:6px;}
a.ui-chip,button.ui-chip,label.ui-chip,.ui-chip[role="button"],.ui-chip[data-view-apply],.ui-chip[tabindex]{cursor:pointer;}
a.ui-chip:hover,button.ui-chip:hover,label.ui-chip:hover,.ui-chip[role="button"]:hover{border-color:var(--ui-primary);color:var(--ui-primary);background:var(--ui-surface);}
.ui-chip:focus-visible{outline:2px solid var(--ui-primary);outline-offset:1px;}
.ui-chip--primary,.ui-chip.is-active,.ui-chip.is-current,.reg-pick__chip:has(input:checked){background:var(--ui-primary-soft);border-color:var(--ui-primary-soft);color:var(--ui-primary);font-weight:600;}
.ui-chip--primary > i,.ui-chip.is-active > i,.ui-chip.is-current > i,.reg-pick__chip:has(input:checked) i{color:var(--ui-primary);}
.ui-chip--success{background:var(--ui-success-soft);border-color:var(--ui-success-soft);color:var(--ui-success);} .ui-chip--success > i{color:var(--ui-success);}
.ui-chip--warning{background:var(--ui-warning-soft);border-color:var(--ui-warning-soft);color:var(--ui-warning);} .ui-chip--warning > i{color:var(--ui-warning);}
.ui-chip--danger{background:var(--ui-danger-soft);border-color:var(--ui-danger-soft);color:var(--ui-danger);} .ui-chip--danger > i{color:var(--ui-danger);}
.ui-chip.is-missing{background:var(--ui-surface);border-color:var(--ui-border);color:var(--ui-muted);cursor:default;}
.ui-chip.is-missing:hover{border-color:var(--ui-border);color:var(--ui-muted);}
.ui-chip--more{background:var(--ui-surface);border-style:dashed;color:var(--ui-muted);cursor:pointer;font-weight:600;}
.ui-chip--more:hover{border-color:var(--ui-primary);color:var(--ui-primary);}
.ui-chip__n,.inc-chip__n,.ui-nfm__chipn{display:inline-block;font:600 11px/18px var(--ui-mono);height:18px;padding:0 6px;border-radius:999px;background:var(--ui-surface);color:var(--ui-muted);vertical-align:1px;margin-left:4px;}
.ui-chip__n.is-unread,.ui-nfm__chipn.is-unread{background:var(--ui-primary);color:#fff;}
.ui-chip__x,.ui-filterchip__x,.ui-pp__x{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;margin:0 -4px 0 2px;border:0;border-radius:999px;background:transparent;color:inherit;cursor:pointer;vertical-align:-5px;padding:0;}
.ui-chip__x:hover,.ui-filterchip__x:hover,.ui-pp__x:hover{background:rgba(0,0,0,.08);color:var(--ui-danger);}
.ui-filterchip__l{color:var(--ui-text-2);font-weight:500;margin-right:2px;}
.ui-pp .ui-pp__view{color:var(--ui-primary);font-weight:600;margin-left:6px;text-decoration:none;}
.ui-pp .ui-pp__chips{margin-top:8px;} .ui-pp .ui-pp__doc.has-file .ui-pp__chips{margin-top:0;}
.ui-chip[hidden],.ui-chip.ui-chip--hidden{display:none;}
.reg-pick__chip{position:relative;} .reg-pick__chip input{position:absolute;opacity:0;width:0;height:0;pointer-events:none;}
.reg-pick__chip > span{display:inline;padding:0;border:0;background:none;color:inherit;}
.reg-pick__chip .ri-checkbox-circle-fill{display:none;} .reg-pick__chip:has(input:checked) .ri-checkbox-circle-fill{display:inline;} .reg-pick__chip:has(input:checked) .ri-checkbox-blank-circle-line{display:none;}
td .ui-chips{gap:6px;}

/* =====================================================================================================
   Cards never overlap (ui/chips-and-overlap): a content card is auto-height, a grid row of cards aligns to
   the start (no stretched row can leave a shorter card's content running over the next row), a sticky side
   column is bounded to the viewport with its own scroll, and no content card carries a fixed height or a
   negative margin. Checked on every screenshot by scripts/ui-overlap-check.js.
   ===================================================================================================== */
.ui-page .card,.ui-page .ui-card{height:auto;min-height:0;}
.ui-page .grid:has(> .card),.ui-page .grid:has(> .ui-card),.ui-page .grid:has(> [class*="col-span"] > .card),.ui-page .grid:has(> [class*="col-span"] > .ui-card){align-items:start;}