/* ============================================================
   ICD DESIGN SYSTEM — InspectionMIS Custom Design v2.0
   Mobile-first, responsive, zero Bootstrap dependency
   ============================================================ */

/* Remix Icons — bundled locally (no CDN; works fully offline) */
@import url('../fonts/remixicon.css');

/* ── 01. DESIGN TOKENS ───────────────────────────────────── */
:root {
  --icd-primary: #4F46E5;
  --icd-primary-rgb: 79,70,229;
  --icd-primary-hover: #4338CA;
  --icd-primary-light: #EEF2FF;
  --icd-primary-subtle: #C7D2FE;

  --icd-success: #10B981;
  --icd-success-rgb: 16,185,129;
  --icd-success-light: #ECFDF5;
  --icd-success-subtle: #6EE7B7;

  --icd-warning: #F59E0B;
  --icd-warning-rgb: 245,158,11;
  --icd-warning-light: #FFFBEB;
  --icd-warning-subtle: #FDE68A;

  --icd-danger: #EF4444;
  --icd-danger-rgb: 239,68,68;
  --icd-danger-light: #FEF2F2;
  --icd-danger-subtle: #FECACA;

  --icd-info: #06B6D4;
  --icd-info-rgb: 6,182,212;
  --icd-info-light: #ECFEFF;
  --icd-info-subtle: #A5F3FC;

  /* Canonical performance bands — the ONE source of truth for grading colour.
     green ≥ 80  ·  orange 60–79  ·  red < 60. Orange (not amber/yellow) for the middle band. */
  --perf-high: #16A34A;  --perf-high-soft: #DCFCE7;
  --perf-mid:  #F97316;  --perf-mid-soft:  #FFEDD5;
  --perf-low:  #DC2626;  --perf-low-soft:  #FEE2E2;

  --icd-secondary: #6B7280;
  --icd-secondary-rgb: 107,114,128;
  --icd-secondary-light: #F3F4F6;

  --icd-purple: #8B5CF6;
  --icd-pink: #EC4899;
  --icd-orange: #F97316;
  --icd-teal: #14B8A6;

  /* Layout */
  --icd-sidebar-width: 260px;
  --icd-sidebar-collapsed: 70px;
  --icd-topbar-height: 64px;

  /* Sidebar */
  --icd-sidebar-bg: #0F172A;
  --icd-sidebar-border: rgba(255,255,255,0.06);
  --icd-sidebar-hover: rgba(255,255,255,0.06);
  --icd-sidebar-active-bg: rgba(79,70,229,0.18);
  --icd-sidebar-active-border: #4F46E5;
  --icd-sidebar-text: #94A3B8;
  --icd-sidebar-text-hover: #CBD5E1;
  --icd-sidebar-text-active: #FFFFFF;
  --icd-sidebar-title: #475569;

  /* Topbar */
  --icd-topbar-bg: #FFFFFF;
  --icd-topbar-border: #E2E8F0;
  --icd-topbar-icon: #64748B;

  /* Content */
  --icd-body-bg: #F1F5F9;
  --icd-card-bg: #FFFFFF;
  --icd-border: #E2E8F0;
  --icd-border-focus: #4F46E5;

  /* Text */
  --icd-text: #1E293B;
  --icd-text-secondary: #475569;
  --icd-text-muted: #94A3B8;
  --icd-text-disabled: #CBD5E1;

  /* Shadows */
  --icd-shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
  --icd-shadow-sm: 0 1px 3px rgba(0,0,0,0.08),0 1px 2px rgba(0,0,0,0.04);
  --icd-shadow: 0 4px 6px -1px rgba(0,0,0,0.07),0 2px 4px -1px rgba(0,0,0,0.04);
  --icd-shadow-md: 0 10px 15px -3px rgba(0,0,0,0.08),0 4px 6px -2px rgba(0,0,0,0.04);
  --icd-shadow-lg: 0 20px 25px -5px rgba(0,0,0,0.08),0 10px 10px -5px rgba(0,0,0,0.02);
  --icd-shadow-focus: 0 0 0 3px rgba(79,70,229,0.2);

  /* Elevated depth — soft, brand-tinted shadows for a premium feel */
  --icd-shadow-card: 0 1px 2px rgba(16,24,40,0.04), 0 1px 3px rgba(16,24,40,0.06);
  --icd-shadow-card-hover: 0 12px 24px -8px rgba(16,24,40,0.12), 0 4px 8px -4px rgba(16,24,40,0.06);
  --icd-shadow-primary: 0 8px 20px -6px rgba(79,70,229,0.40);
  --icd-shadow-primary-sm: 0 4px 12px -3px rgba(79,70,229,0.35);

  /* Gradients — used on accents (stat icons, primary buttons, active nav, brand) */
  --icd-gradient-primary: linear-gradient(135deg,#6366F1 0%,#4F46E5 100%);
  --icd-gradient-success: linear-gradient(135deg,#34D399 0%,#059669 100%);
  --icd-gradient-info:    linear-gradient(135deg,#22D3EE 0%,#0891B2 100%);
  --icd-gradient-warning: linear-gradient(135deg,#FBBF24 0%,#D97706 100%);
  --icd-gradient-danger:  linear-gradient(135deg,#FB7185 0%,#E11D48 100%);
  --icd-gradient-sidebar: linear-gradient(180deg,#111C33 0%,#0B1220 100%);

  /* Shape */
  --icd-radius-xs: 3px;
  --icd-radius-sm: 5px;
  --icd-radius: 8px;
  --icd-radius-lg: 12px;
  --icd-radius-xl: 16px;
  --icd-radius-full: 9999px;

  /* Transitions */
  --icd-t-fast: 100ms ease;
  --icd-t: 200ms ease;
  --icd-t-slow: 350ms cubic-bezier(0.4,0,0.2,1);

  /* Bootstrap Compatibility Aliases */
  --bs-primary: #4F46E5;
  --bs-primary-rgb: 79,70,229;
  --bs-secondary: #6B7280;
  --bs-success: #10B981;
  --bs-success-rgb: 16,185,129;
  --bs-warning: #F59E0B;
  --bs-warning-rgb: 245,158,11;
  --bs-danger: #EF4444;
  --bs-danger-rgb: 239,68,68;
  --bs-info: #06B6D4;
  --bs-info-rgb: 6,182,212;
  --bs-light: #F8FAFC;
  --bs-dark: #0F172A;
  --bs-body-color: #1E293B;
  --bs-body-bg: #F1F5F9;
  --bs-border-color: #E2E8F0;
  --bs-border-radius: 8px;
  --bs-border-radius-sm: 5px;
  --bs-border-radius-lg: 12px;
  --bs-card-bg: #FFFFFF;
  --bs-link-color: #4F46E5;
  --bs-link-hover-color: #4338CA;
  --mis-sidebar-bg: #0F172A;
  --mis-body-bg: #F1F5F9;
}

/* ── 02. RESET & BASE ─────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  font-size:0.875rem;line-height:1.6;color:var(--icd-text);
  background:var(--icd-body-bg);-webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;overflow-x:hidden;
}
a{color:var(--icd-primary);text-decoration:none;transition:color var(--icd-t)}
a:hover{color:var(--icd-primary-hover)}
img{max-width:100%;height:auto;display:block}
svg{vertical-align:middle}
ul,ol{list-style:none;padding:0;margin:0}
hr{border:none;border-top:1px solid var(--icd-border);margin:1rem 0}
button{font-family:inherit;cursor:pointer}
input,select,textarea{font-family:inherit}
:focus-visible{outline:2px solid var(--icd-primary);outline-offset:2px}

/* ── 03. TYPOGRAPHY ──────────────────────────────────────── */
h1,.h1{font-size:2rem;font-weight:700;line-height:1.25}
h2,.h2{font-size:1.5rem;font-weight:700;line-height:1.3}
h3,.h3{font-size:1.25rem;font-weight:600;line-height:1.35}
h4,.h4{font-size:1.1rem;font-weight:600;line-height:1.4}
h5,.h5{font-size:1rem;font-weight:600;line-height:1.4}
h6,.h6{font-size:0.875rem;font-weight:600;line-height:1.5}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{color:var(--icd-text);margin-bottom:0.5rem}
p{margin-bottom:1rem}
p:last-child{margin-bottom:0}
small,.small{font-size:0.8rem}
.lead{font-size:1.125rem;font-weight:400}
.display-4{font-size:clamp(2rem,5vw,3.5rem);font-weight:700;line-height:1.1}
.display-5{font-size:clamp(1.5rem,4vw,3rem);font-weight:700;line-height:1.15}
.display-6{font-size:clamp(1.25rem,3vw,2.5rem);font-weight:700;line-height:1.2}
.fs-10{font-size:10px!important}.fs-11{font-size:11px!important}
.fs-12{font-size:12px!important}.fs-13{font-size:13px!important}
.fs-14{font-size:14px!important}.fs-15{font-size:15px!important}
.fs-16{font-size:16px!important}.fs-17{font-size:17px!important}
.fs-18{font-size:18px!important}.fs-20{font-size:20px!important}
.fs-22{font-size:22px!important}.fs-24{font-size:24px!important}
.fw-light{font-weight:300!important}.fw-normal{font-weight:400!important}
.fw-medium{font-weight:500!important}.fw-semibold{font-weight:600!important}
.fw-bold{font-weight:700!important}
.text-truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.text-nowrap{white-space:nowrap!important}
.text-wrap{white-space:normal!important}
.text-break{word-wrap:break-word!important;word-break:break-word!important}
.text-uppercase{text-transform:uppercase!important}
.text-lowercase{text-transform:lowercase!important}
.text-capitalize{text-transform:capitalize!important}
.text-start{text-align:left!important}.text-center{text-align:center!important}
.text-end{text-align:right!important}
.lh-1{line-height:1!important}.lh-sm{line-height:1.25!important}
.lh-base{line-height:1.5!important}.lh-lg{line-height:2!important}
.letter-spacing-1{letter-spacing:0.05em}.letter-spacing-2{letter-spacing:0.1em}

/* ── 04. COLOR UTILITIES ─────────────────────────────────── */
.text-primary{color:var(--icd-primary)!important}
.text-secondary{color:var(--icd-secondary)!important}
.text-success{color:var(--icd-success)!important}
.text-warning{color:var(--icd-warning)!important}
.text-danger{color:var(--icd-danger)!important}
.text-info{color:var(--icd-info)!important}
.text-muted{color:var(--icd-text-muted)!important}
.text-body{color:var(--icd-text)!important}
.text-dark{color:#0F172A!important}.text-light{color:#F8FAFC!important}
.text-white{color:#fff!important}.text-black{color:#000!important}
.text-purple{color:var(--icd-purple)!important}
.text-pink{color:var(--icd-pink)!important}
.text-orange{color:var(--icd-orange)!important}
.text-teal{color:var(--icd-teal)!important}
.text-reset{color:inherit!important}

.bg-primary{background-color:var(--icd-primary)!important;color:#fff}
.bg-secondary{background-color:var(--icd-secondary)!important;color:#fff}
.bg-success{background-color:var(--icd-success)!important;color:#fff}
.bg-warning{background-color:var(--icd-warning)!important;color:#fff}
.bg-danger{background-color:var(--icd-danger)!important;color:#fff}
.bg-info{background-color:var(--icd-info)!important;color:#fff}
.bg-dark{background-color:#0F172A!important;color:#fff}
.bg-light{background-color:#F8FAFC!important}
.bg-white{background-color:#fff!important}
/* text-bg-* (Bootstrap 5.2 combined bg+contrast; used by RIBModal headers). Gradient variants. */
.text-bg-primary{background:var(--icd-gradient-primary);color:#fff}
.text-bg-secondary{background:var(--icd-secondary);color:#fff}
.text-bg-success{background:var(--icd-gradient-success);color:#fff}
.text-bg-info{background:var(--icd-gradient-info);color:#fff}
.text-bg-warning{background:var(--icd-gradient-warning);color:#fff}
.text-bg-danger{background:var(--icd-gradient-danger);color:#fff}
.text-bg-dark{background:#0F172A;color:#fff}
.text-bg-light{background:#F8FAFC;color:var(--icd-text)}
.bg-transparent{background-color:transparent!important}
.bg-primary-subtle{background-color:var(--icd-primary-light)!important}
.bg-success-subtle{background-color:var(--icd-success-light)!important}
.bg-warning-subtle{background-color:var(--icd-warning-light)!important}
.bg-danger-subtle{background-color:var(--icd-danger-light)!important}
.bg-info-subtle{background-color:var(--icd-info-light)!important}
.bg-secondary-subtle{background-color:var(--icd-secondary-light)!important}
.bg-light-subtle{background-color:rgba(241,245,249,0.6)!important}
.bg-body{background-color:var(--icd-body-bg)!important}
.bg-pattern{background-image:radial-gradient(circle at 80% 50%,rgba(255,255,255,0.08) 0%,transparent 60%)}
.bg-gradient-primary{background:linear-gradient(135deg,var(--icd-primary) 0%,#7C3AED 100%)}
.bg-gradient-success{background:linear-gradient(135deg,var(--icd-success) 0%,#059669 100%)}
.bg-gradient-warning{background:linear-gradient(135deg,var(--icd-warning) 0%,#D97706 100%)}
.bg-gradient-danger{background:linear-gradient(135deg,var(--icd-danger) 0%,#DC2626 100%)}
.bg-gradient-info{background:linear-gradient(135deg,var(--icd-info) 0%,#0284C7 100%)}

/* ── 05. GRID SYSTEM ─────────────────────────────────────── */
.container{width:100%;padding-right:1rem;padding-left:1rem;margin-right:auto;margin-left:auto}
.container-fluid{width:100%;padding-right:1rem;padding-left:1rem;margin-right:auto;margin-left:auto}
@media(min-width:576px){.container{max-width:540px}}
@media(min-width:768px){.container{max-width:720px}}
@media(min-width:992px){.container{max-width:960px}}
@media(min-width:1200px){.container{max-width:1140px}}
@media(min-width:1400px){.container{max-width:1320px}}

.row{display:flex;flex-wrap:wrap;margin-right:-0.75rem;margin-left:-0.75rem}
.row>*{flex-shrink:0;width:100%;max-width:100%;padding-right:0.75rem;padding-left:0.75rem}
.g-0,.gx-0{--bs-gutter-x:0}.g-0,.gy-0{--bs-gutter-y:0}
.g-1,.gx-1{margin-left:-0.25rem;margin-right:-0.25rem}
.g-1>*,.gx-1>*{padding-left:0.25rem;padding-right:0.25rem}
.g-2,.gx-2{margin-left:-0.5rem;margin-right:-0.5rem}
.g-2>*,.gx-2>*{padding-left:0.5rem;padding-right:0.5rem}
.g-3,.gx-3{margin-left:-0.75rem;margin-right:-0.75rem}
.g-3>*,.gx-3>*{padding-left:0.75rem;padding-right:0.75rem}
.g-4,.gx-4{margin-left:-1rem;margin-right:-1rem}
.g-4>*,.gx-4>*{padding-left:1rem;padding-right:1rem}
.col{flex:1 0 0;min-width:0}
.col-auto{flex:0 0 auto;width:auto}
.col-1{flex:0 0 auto;width:8.333%}.col-2{flex:0 0 auto;width:16.667%}
.col-3{flex:0 0 auto;width:25%}.col-4{flex:0 0 auto;width:33.333%}
.col-5{flex:0 0 auto;width:41.667%}.col-6{flex:0 0 auto;width:50%}
.col-7{flex:0 0 auto;width:58.333%}.col-8{flex:0 0 auto;width:66.667%}
.col-9{flex:0 0 auto;width:75%}.col-10{flex:0 0 auto;width:83.333%}
.col-11{flex:0 0 auto;width:91.667%}.col-12{flex:0 0 auto;width:100%}
@media(min-width:576px){
  .col-sm-1{flex:0 0 auto;width:8.333%}.col-sm-2{flex:0 0 auto;width:16.667%}
  .col-sm-3{flex:0 0 auto;width:25%}.col-sm-4{flex:0 0 auto;width:33.333%}
  .col-sm-5{flex:0 0 auto;width:41.667%}.col-sm-6{flex:0 0 auto;width:50%}
  .col-sm-7{flex:0 0 auto;width:58.333%}.col-sm-8{flex:0 0 auto;width:66.667%}
  .col-sm-9{flex:0 0 auto;width:75%}.col-sm-10{flex:0 0 auto;width:83.333%}
  .col-sm-11{flex:0 0 auto;width:91.667%}.col-sm-12{flex:0 0 auto;width:100%}
  .col-sm{flex:1 0 0}.col-sm-auto{flex:0 0 auto;width:auto}
}
@media(min-width:768px){
  .col-md-1{flex:0 0 auto;width:8.333%}.col-md-2{flex:0 0 auto;width:16.667%}
  .col-md-3{flex:0 0 auto;width:25%}.col-md-4{flex:0 0 auto;width:33.333%}
  .col-md-5{flex:0 0 auto;width:41.667%}.col-md-6{flex:0 0 auto;width:50%}
  .col-md-7{flex:0 0 auto;width:58.333%}.col-md-8{flex:0 0 auto;width:66.667%}
  .col-md-9{flex:0 0 auto;width:75%}.col-md-10{flex:0 0 auto;width:83.333%}
  .col-md-11{flex:0 0 auto;width:91.667%}.col-md-12{flex:0 0 auto;width:100%}
  .col-md{flex:1 0 0}.col-md-auto{flex:0 0 auto;width:auto}
}
@media(min-width:992px){
  .col-lg-1{flex:0 0 auto;width:8.333%}.col-lg-2{flex:0 0 auto;width:16.667%}
  .col-lg-3{flex:0 0 auto;width:25%}.col-lg-4{flex:0 0 auto;width:33.333%}
  .col-lg-5{flex:0 0 auto;width:41.667%}.col-lg-6{flex:0 0 auto;width:50%}
  .col-lg-7{flex:0 0 auto;width:58.333%}.col-lg-8{flex:0 0 auto;width:66.667%}
  .col-lg-9{flex:0 0 auto;width:75%}.col-lg-10{flex:0 0 auto;width:83.333%}
  .col-lg-11{flex:0 0 auto;width:91.667%}.col-lg-12{flex:0 0 auto;width:100%}
  .col-lg{flex:1 0 0}.col-lg-auto{flex:0 0 auto;width:auto}
}
@media(min-width:1200px){
  .col-xl-1{flex:0 0 auto;width:8.333%}.col-xl-2{flex:0 0 auto;width:16.667%}
  .col-xl-3{flex:0 0 auto;width:25%}.col-xl-4{flex:0 0 auto;width:33.333%}
  .col-xl-5{flex:0 0 auto;width:41.667%}.col-xl-6{flex:0 0 auto;width:50%}
  .col-xl-7{flex:0 0 auto;width:58.333%}.col-xl-8{flex:0 0 auto;width:66.667%}
  .col-xl-9{flex:0 0 auto;width:75%}.col-xl-10{flex:0 0 auto;width:83.333%}
  .col-xl-11{flex:0 0 auto;width:91.667%}.col-xl-12{flex:0 0 auto;width:100%}
  .col-xl{flex:1 0 0}.col-xl-auto{flex:0 0 auto;width:auto}
}

/* ── 06. FLEX & DISPLAY UTILITIES ────────────────────────── */
.d-none{display:none!important}.d-block{display:block!important}
.d-inline{display:inline!important}.d-inline-block{display:inline-block!important}
.d-flex{display:flex!important}.d-inline-flex{display:inline-flex!important}
.d-grid{display:grid!important}.d-table{display:table!important}
/* Bootstrap stacks — used for button toolbars/rows in 25+ files (were undefined,
   so those rows didn't lay out horizontally). */
.hstack{display:flex;flex-direction:row;align-items:center;align-self:stretch}
.vstack{display:flex;flex-direction:column;align-items:stretch;align-self:stretch;flex:1 1 auto}
.material-shadow{box-shadow:var(--icd-shadow,0 1px 3px rgba(15,23,42,0.08))}
@media(min-width:576px){
  .d-sm-none{display:none!important}.d-sm-block{display:block!important}
  .d-sm-flex{display:flex!important}.d-sm-inline-block{display:inline-block!important}
}
@media(min-width:768px){
  .d-md-none{display:none!important}.d-md-block{display:block!important}
  .d-md-flex{display:flex!important}.d-md-inline-block{display:inline-block!important}
}
@media(min-width:992px){
  .d-lg-none{display:none!important}.d-lg-block{display:block!important}
  .d-lg-flex{display:flex!important}.d-lg-inline-block{display:inline-block!important}
}
@media(min-width:1200px){
  .d-xl-none{display:none!important}.d-xl-block{display:block!important}
  .d-xl-flex{display:flex!important}.d-xl-inline-block{display:inline-block!important}
}
.flex-row{flex-direction:row!important}.flex-column{flex-direction:column!important}
.flex-row-reverse{flex-direction:row-reverse!important}
.flex-column-reverse{flex-direction:column-reverse!important}
.flex-wrap{flex-wrap:wrap!important}.flex-nowrap{flex-wrap:nowrap!important}
.flex-grow-0{flex-grow:0!important}.flex-grow-1{flex-grow:1!important}
.flex-shrink-0{flex-shrink:0!important}.flex-shrink-1{flex-shrink:1!important}
.flex-fill{flex:1 1 auto!important}
.justify-content-start{justify-content:flex-start!important}
.justify-content-end{justify-content:flex-end!important}
.justify-content-center{justify-content:center!important}
.justify-content-between{justify-content:space-between!important}
.justify-content-around{justify-content:space-around!important}
.justify-content-evenly{justify-content:space-evenly!important}
.align-items-start{align-items:flex-start!important}
.align-items-end{align-items:flex-end!important}
.align-items-center{align-items:center!important}
.align-items-baseline{align-items:baseline!important}
.align-items-stretch{align-items:stretch!important}
.align-self-start{align-self:flex-start!important}
.align-self-end{align-self:flex-end!important}
.align-self-center{align-self:center!important}
.align-self-stretch{align-self:stretch!important}
.align-content-start{align-content:flex-start!important}
.align-content-end{align-content:flex-end!important}
.align-content-center{align-content:center!important}
.align-content-between{align-content:space-between!important}
.align-content-around{align-content:space-around!important}
.align-middle{vertical-align:middle!important}
.align-top{vertical-align:top!important}
.align-bottom{vertical-align:bottom!important}
.gap-0{gap:0!important}.gap-1{gap:0.25rem!important}
.gap-2{gap:0.5rem!important}.gap-3{gap:0.75rem!important}
.gap-4{gap:1rem!important}.gap-5{gap:1.5rem!important}
.gap-6{gap:2rem!important}
.column-gap-0{column-gap:0!important}.column-gap-1{column-gap:0.25rem!important}
.column-gap-2{column-gap:0.5rem!important}.column-gap-3{column-gap:0.75rem!important}

/* ── 07. SPACING ─────────────────────────────────────────── */
.m-0{margin:0!important}.m-1{margin:0.25rem!important}.m-2{margin:0.5rem!important}
.m-3{margin:0.75rem!important}.m-4{margin:1rem!important}.m-5{margin:1.5rem!important}
.m-auto{margin:auto!important}
.mt-0{margin-top:0!important}.mt-1{margin-top:0.25rem!important}.mt-2{margin-top:0.5rem!important}
.mt-3{margin-top:0.75rem!important}.mt-4{margin-top:1rem!important}.mt-5{margin-top:1.5rem!important}
.mb-0{margin-bottom:0!important}.mb-1{margin-bottom:0.25rem!important}.mb-2{margin-bottom:0.5rem!important}
.mb-3{margin-bottom:0.75rem!important}.mb-4{margin-bottom:1rem!important}.mb-5{margin-bottom:1.5rem!important}
.ms-0{margin-left:0!important}.ms-1{margin-left:0.25rem!important}.ms-2{margin-left:0.5rem!important}
.ms-3{margin-left:0.75rem!important}.ms-4{margin-left:1rem!important}.ms-5{margin-left:1.5rem!important}
.ms-auto{margin-left:auto!important}
.me-0{margin-right:0!important}.me-1{margin-right:0.25rem!important}.me-2{margin-right:0.5rem!important}
.me-3{margin-right:0.75rem!important}.me-4{margin-right:1rem!important}.me-5{margin-right:1.5rem!important}
.me-auto{margin-right:auto!important}
.mx-0{margin-left:0!important;margin-right:0!important}
.mx-1{margin-left:0.25rem!important;margin-right:0.25rem!important}
.mx-2{margin-left:0.5rem!important;margin-right:0.5rem!important}
.mx-3{margin-left:0.75rem!important;margin-right:0.75rem!important}
.mx-4{margin-left:1rem!important;margin-right:1rem!important}
.mx-5{margin-left:1.5rem!important;margin-right:1.5rem!important}
.mx-auto{margin-left:auto!important;margin-right:auto!important}
.my-0{margin-top:0!important;margin-bottom:0!important}
.my-1{margin-top:0.25rem!important;margin-bottom:0.25rem!important}
.my-2{margin-top:0.5rem!important;margin-bottom:0.5rem!important}
.my-3{margin-top:0.75rem!important;margin-bottom:0.75rem!important}
.my-4{margin-top:1rem!important;margin-bottom:1rem!important}
.my-5{margin-top:1.5rem!important;margin-bottom:1.5rem!important}

.p-0{padding:0!important}.p-1{padding:0.25rem!important}.p-2{padding:0.5rem!important}
.p-3{padding:0.75rem!important}.p-4{padding:1rem!important}.p-5{padding:1.5rem!important}
.pt-0{padding-top:0!important}.pt-1{padding-top:0.25rem!important}.pt-2{padding-top:0.5rem!important}
.pt-3{padding-top:0.75rem!important}.pt-4{padding-top:1rem!important}.pt-5{padding-top:1.5rem!important}
.pb-0{padding-bottom:0!important}.pb-1{padding-bottom:0.25rem!important}.pb-2{padding-bottom:0.5rem!important}
.pb-3{padding-bottom:0.75rem!important}.pb-4{padding-bottom:1rem!important}.pb-5{padding-bottom:1.5rem!important}
.ps-0{padding-left:0!important}.ps-1{padding-left:0.25rem!important}.ps-2{padding-left:0.5rem!important}
.ps-3{padding-left:0.75rem!important}.ps-4{padding-left:1rem!important}.ps-5{padding-left:1.5rem!important}
.pe-0{padding-right:0!important}.pe-1{padding-right:0.25rem!important}.pe-2{padding-right:0.5rem!important}
.pe-3{padding-right:0.75rem!important}.pe-4{padding-right:1rem!important}.pe-5{padding-right:1.5rem!important}
.px-0{padding-left:0!important;padding-right:0!important}
.px-1{padding-left:0.25rem!important;padding-right:0.25rem!important}
.px-2{padding-left:0.5rem!important;padding-right:0.5rem!important}
.px-3{padding-left:0.75rem!important;padding-right:0.75rem!important}
.px-4{padding-left:1rem!important;padding-right:1rem!important}
.px-5{padding-left:1.5rem!important;padding-right:1.5rem!important}
.py-0{padding-top:0!important;padding-bottom:0!important}
.py-1{padding-top:0.25rem!important;padding-bottom:0.25rem!important}
.py-2{padding-top:0.5rem!important;padding-bottom:0.5rem!important}
.py-3{padding-top:0.75rem!important;padding-bottom:0.75rem!important}
.py-4{padding-top:1rem!important;padding-bottom:1rem!important}
.py-5{padding-top:1.5rem!important;padding-bottom:1.5rem!important}

/* ── 08. BORDERS & SHADOWS ───────────────────────────────── */
.border{border:1px solid var(--icd-border)!important}
.border-0{border:0!important}
.border-dashed{border-style:dashed!important}
.border-top-dashed{border-top-style:dashed!important}
.border-top{border-top:1px solid var(--icd-border)!important}
.border-bottom{border-bottom:1px solid var(--icd-border)!important}
.border-start{border-left:1px solid var(--icd-border)!important}
.border-end{border-right:1px solid var(--icd-border)!important}
.border-primary{border-color:var(--icd-primary)!important}
.border-success{border-color:var(--icd-success)!important}
.border-warning{border-color:var(--icd-warning)!important}
.border-danger{border-color:var(--icd-danger)!important}
.border-info{border-color:var(--icd-info)!important}
.border-white{border-color:#fff!important}
.border-1{border-width:1px!important}.border-2{border-width:2px!important}
.border-3{border-width:3px!important}
.rounded{border-radius:var(--icd-radius)!important}
.rounded-0{border-radius:0!important}
.rounded-1{border-radius:var(--icd-radius-sm)!important}
.rounded-2{border-radius:var(--icd-radius)!important}
.rounded-3{border-radius:var(--icd-radius-lg)!important}
.rounded-sm{border-radius:var(--icd-radius-sm)!important}
.rounded-lg{border-radius:var(--icd-radius-lg)!important}
.rounded-xl{border-radius:var(--icd-radius-xl)!important}
.rounded-circle{border-radius:50%!important}
.rounded-pill{border-radius:var(--icd-radius-full)!important}
.rounded-top{border-radius:var(--icd-radius) var(--icd-radius) 0 0!important}
.rounded-bottom{border-radius:0 0 var(--icd-radius) var(--icd-radius)!important}
.shadow-none{box-shadow:none!important}
.shadow-xs{box-shadow:var(--icd-shadow-xs)!important}
.shadow-sm{box-shadow:var(--icd-shadow-sm)!important}
.shadow{box-shadow:var(--icd-shadow)!important}
.shadow-md{box-shadow:var(--icd-shadow-md)!important}
.shadow-lg{box-shadow:var(--icd-shadow-lg)!important}

/* ── 09. SIZING ──────────────────────────────────────────── */
.w-25{width:25%!important}.w-50{width:50%!important}
.w-75{width:75%!important}.w-100{width:100%!important}
.w-auto{width:auto!important}.mw-100{max-width:100%!important}
.h-25{height:25%!important}.h-50{height:50%!important}
.h-75{height:75%!important}.h-100{height:100%!important}
.h-auto{height:auto!important}.mh-100{max-height:100%!important}
.min-vw-100{min-width:100vw!important}.min-vh-100{min-height:100vh!important}
.vw-100{width:100vw!important}.vh-100{height:100vh!important}

/* ── 10. POSITION & OVERFLOW ─────────────────────────────── */
.position-static{position:static!important}
.position-relative{position:relative!important}
.position-absolute{position:absolute!important}
.position-fixed{position:fixed!important}
.position-sticky{position:sticky!important}
.top-0{top:0!important}.bottom-0{bottom:0!important}
.start-0{left:0!important}.end-0{right:0!important}
.top-50{top:50%!important}.start-50{left:50%!important}
.translate-middle{transform:translate(-50%,-50%)!important}
.translate-middle-x{transform:translateX(-50%)!important}
.translate-middle-y{transform:translateY(-50%)!important}
.overflow-hidden{overflow:hidden!important}.overflow-auto{overflow:auto!important}
.overflow-scroll{overflow:scroll!important}.overflow-visible{overflow:visible!important}
.overflow-x-auto{overflow-x:auto!important}.overflow-y-auto{overflow-y:auto!important}
.opacity-0{opacity:0!important}.opacity-25{opacity:0.25!important}
.opacity-50{opacity:0.5!important}.opacity-75{opacity:0.75!important}
.opacity-100{opacity:1!important}
.visibility-hidden{visibility:hidden!important}
.visible{visibility:visible!important}
.user-select-none{-webkit-user-select:none;user-select:none}
.cursor-pointer{cursor:pointer!important}
.cursor-default{cursor:default!important}
.cursor-not-allowed{cursor:not-allowed!important}
.pe-none{pointer-events:none!important}.pe-auto{pointer-events:auto!important}
.float-start{float:left!important}.float-end{float:right!important}
.float-none{float:none!important}.clearfix::after{content:'';display:table;clear:both}
.object-fit-cover{object-fit:cover!important}.object-fit-contain{object-fit:contain!important}

/* ── 11. BUTTONS ─────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:0.375rem;
  padding:0.5rem 1rem;font-size:0.875rem;font-weight:500;line-height:1.4;
  border-radius:var(--icd-radius);border:1px solid transparent;
  cursor:pointer;transition:all var(--icd-t);white-space:nowrap;
  -webkit-user-select:none;user-select:none;text-decoration:none;vertical-align:middle;
}
.btn:disabled,.btn.disabled{opacity:0.55;cursor:not-allowed;pointer-events:none}
.btn:focus-visible{outline:none;box-shadow:var(--icd-shadow-focus)}

.btn-primary{background:var(--icd-gradient-primary);border-color:transparent;color:#fff;box-shadow:var(--icd-shadow-primary-sm)}
.btn-primary:hover{filter:brightness(1.05);color:#fff;transform:translateY(-1px);box-shadow:var(--icd-shadow-primary)}
.btn-primary:active{transform:translateY(0);filter:brightness(0.98)}

.btn-secondary{background:var(--icd-secondary);border-color:var(--icd-secondary);color:#fff}
.btn-secondary:hover{background:#4B5563;border-color:#4B5563;color:#fff;transform:translateY(-1px)}

.btn-success{background:var(--icd-success);border-color:var(--icd-success);color:#fff}
.btn-success:hover{background:#059669;border-color:#059669;color:#fff;transform:translateY(-1px)}

.btn-warning{background:var(--icd-warning);border-color:var(--icd-warning);color:#fff}
.btn-warning:hover{background:#D97706;border-color:#D97706;color:#fff;transform:translateY(-1px)}

.btn-danger{background:var(--icd-danger);border-color:var(--icd-danger);color:#fff}
.btn-danger:hover{background:#DC2626;border-color:#DC2626;color:#fff;transform:translateY(-1px)}

.btn-info{background:var(--icd-info);border-color:var(--icd-info);color:#fff}
.btn-info:hover{background:#0284C7;border-color:#0284C7;color:#fff;transform:translateY(-1px)}

.btn-dark{background:#0F172A;border-color:#0F172A;color:#fff}
.btn-dark:hover{background:#1E293B;border-color:#1E293B;color:#fff;transform:translateY(-1px)}

.btn-light{background:#F8FAFC;border-color:var(--icd-border);color:var(--icd-text)}
.btn-light:hover{background:#F1F5F9;color:var(--icd-text)}

.btn-outline-primary{background:transparent;border-color:var(--icd-primary);color:var(--icd-primary)}
.btn-outline-primary:hover{background:var(--icd-primary);color:#fff}
.btn-outline-secondary{background:transparent;border-color:var(--icd-secondary);color:var(--icd-secondary)}
.btn-outline-secondary:hover{background:var(--icd-secondary);color:#fff}
.btn-outline-success{background:transparent;border-color:var(--icd-success);color:var(--icd-success)}
.btn-outline-success:hover{background:var(--icd-success);color:#fff}
.btn-outline-warning{background:transparent;border-color:var(--icd-warning);color:var(--icd-warning)}
.btn-outline-warning:hover{background:var(--icd-warning);color:#fff}
.btn-outline-danger{background:transparent;border-color:var(--icd-danger);color:var(--icd-danger)}
.btn-outline-danger:hover{background:var(--icd-danger);color:#fff}
.btn-outline-info{background:transparent;border-color:var(--icd-info);color:var(--icd-info)}
.btn-outline-info:hover{background:var(--icd-info);color:#fff}
.btn-outline-dark{background:transparent;border-color:#0F172A;color:#0F172A}
.btn-outline-dark:hover{background:#0F172A;color:#fff}
.btn-outline-light{background:transparent;border-color:var(--icd-border);color:var(--icd-text)}
.btn-outline-light:hover{background:#F1F5F9}

.btn-soft-primary{background:var(--icd-primary-light);color:var(--icd-primary);border-color:transparent}
.btn-soft-primary:hover{background:var(--icd-primary);color:#fff}
.btn-soft-secondary{background:var(--icd-secondary-light);color:var(--icd-secondary);border-color:transparent}
.btn-soft-secondary:hover{background:var(--icd-secondary);color:#fff}
.btn-soft-success{background:var(--icd-success-light);color:var(--icd-success);border-color:transparent}
.btn-soft-success:hover{background:var(--icd-success);color:#fff}
.btn-soft-warning{background:var(--icd-warning-light);color:var(--icd-warning);border-color:transparent}
.btn-soft-warning:hover{background:var(--icd-warning);color:#fff}
.btn-soft-danger{background:var(--icd-danger-light);color:var(--icd-danger);border-color:transparent}
.btn-soft-danger:hover{background:var(--icd-danger);color:#fff}
.btn-soft-info{background:var(--icd-info-light);color:var(--icd-info);border-color:transparent}
.btn-soft-info:hover{background:var(--icd-info);color:#fff}

.btn-ghost-secondary{background:transparent;border-color:transparent;color:var(--icd-topbar-icon)}
.btn-ghost-secondary:hover{background:var(--icd-topbar-icon-hover-bg);color:var(--icd-text)}

.btn-link{background:none;border-color:transparent;color:var(--icd-primary);padding:0}
.btn-link:hover{color:var(--icd-primary-hover);text-decoration:underline}

.btn-xs{padding:0.25rem 0.5rem;font-size:0.75rem}
.btn-sm{padding:0.375rem 0.75rem;font-size:0.8125rem}
.btn-lg{padding:0.625rem 1.25rem;font-size:1rem}
.btn-xl{padding:0.75rem 1.5rem;font-size:1.1rem}

.btn-icon{width:2.25rem;height:2.25rem;padding:0;border-radius:var(--icd-radius)}
.btn-icon.btn-sm{width:1.875rem;height:1.875rem}
.btn-icon.btn-lg{width:2.75rem;height:2.75rem}
.btn-icon.rounded-circle{border-radius:50%}

.btn-topbar{width:2.25rem;height:2.25rem;padding:0;font-size:1rem}

.btn-label{display:inline-flex;overflow:hidden;padding:0}
.btn-label .label-icon{
  display:flex;align-items:center;justify-content:center;
  width:2.25rem;background:rgba(0,0,0,0.1);flex-shrink:0;
}
.btn-label span:last-child{padding:0.5rem 0.875rem}
.btn-label.btn-sm .label-icon{width:1.875rem}

.waves-effect{position:relative;overflow:hidden}

.btn-close{
  width:1.5rem;height:1.5rem;padding:0;background:none;border:none;
  color:var(--icd-text-muted);font-size:1.1rem;cursor:pointer;border-radius:var(--icd-radius-sm);
  display:inline-flex;align-items:center;justify-content:center;transition:all var(--icd-t);
}
.btn-close::before{content:'×';font-size:1.4rem;line-height:1}
.btn-close:hover{color:var(--icd-text);background:var(--icd-secondary-light)}

/* ── 12. CARDS ────────────────────────────────────────────── */
.card{
  background:var(--icd-card-bg);border:1px solid var(--icd-border);
  border-radius:var(--icd-radius-lg);box-shadow:var(--icd-shadow-card);
  position:relative;word-wrap:break-word;transition:box-shadow var(--icd-t),transform var(--icd-t);
}
.card-body{padding:1.25rem}
.card-header{
  padding:0.875rem 1.25rem;background:transparent;
  border-bottom:1px solid var(--icd-border);
  display:flex;align-items:center;gap:0.75rem;
  border-radius:var(--icd-radius-lg) var(--icd-radius-lg) 0 0;
}
.card-footer{
  padding:0.875rem 1.25rem;background:transparent;
  border-top:1px solid var(--icd-border);
  border-radius:0 0 var(--icd-radius-lg) var(--icd-radius-lg);
}
.card-title{font-size:1rem;font-weight:600;margin-bottom:0;color:var(--icd-text)}
.card-subtitle{font-size:0.8125rem;color:var(--icd-text-muted);margin-top:0.25rem;margin-bottom:0}
.card-text{color:var(--icd-text-secondary)}
.card-link{color:var(--icd-primary)}
.card-img-top{border-radius:var(--icd-radius-lg) var(--icd-radius-lg) 0 0;width:100%}
.card-img-bottom{border-radius:0 0 var(--icd-radius-lg) var(--icd-radius-lg);width:100%}
.card-hover{transition:transform var(--icd-t),box-shadow var(--icd-t)}
.card-hover:hover,.card-animate:hover{transform:translateY(-3px);box-shadow:var(--icd-shadow-card-hover)}
.card-border-primary{border-top:3px solid var(--icd-primary)}
.card-border-success{border-top:3px solid var(--icd-success)}
.card-border-warning{border-top:3px solid var(--icd-warning)}
.card-border-danger{border-top:3px solid var(--icd-danger)}
.card-border-info{border-top:3px solid var(--icd-info)}

/* ── 13. FORMS ────────────────────────────────────────────── */
.form-label,.icd-label{
  display:block;font-size:0.8125rem;font-weight:500;
  color:var(--icd-text-secondary);margin-bottom:0.375rem;
}
.icd-label.required::after{content:'*';color:var(--icd-danger);margin-left:0.25rem}

.form-control,.icd-control{
  display:block;width:100%;padding:0.5rem 0.875rem;font-size:0.875rem;line-height:1.5;
  color:var(--icd-text);background:var(--icd-card-bg);border:1.5px solid var(--icd-border);
  border-radius:var(--icd-radius);transition:border-color var(--icd-t),box-shadow var(--icd-t);
  appearance:none;-webkit-appearance:none;
}
.form-control:focus,.icd-control:focus{
  border-color:var(--icd-border-focus);outline:none;
  box-shadow:0 0 0 3px rgba(79,70,229,0.12);
}
.form-control::placeholder,.icd-control::placeholder{color:var(--icd-text-muted)}
.form-control:disabled,.icd-control:disabled{
  background:#F8FAFC;color:var(--icd-text-muted);cursor:not-allowed;
}
.form-control.is-invalid,.icd-control.is-invalid{border-color:var(--icd-danger)}
.form-control.is-invalid:focus,.icd-control.is-invalid:focus{box-shadow:0 0 0 3px rgba(239,68,68,0.12)}
.form-control.is-valid,.icd-control.is-valid{border-color:var(--icd-success)}

.form-select,.icd-select-native{
  display:block;width:100%;padding:0.5rem 2.25rem 0.5rem 0.875rem;font-size:0.875rem;line-height:1.5;
  color:var(--icd-text);background:var(--icd-card-bg) 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='%2394A3B8' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") no-repeat right 0.75rem center / 16px;
  border:1.5px solid var(--icd-border);border-radius:var(--icd-radius);
  transition:border-color var(--icd-t),box-shadow var(--icd-t);
  appearance:none;-webkit-appearance:none;cursor:pointer;
}
.form-select:focus,.icd-select-native:focus{
  border-color:var(--icd-border-focus);outline:none;
  box-shadow:0 0 0 3px rgba(79,70,229,0.12);
}

.form-control-sm,.icd-control-sm{padding:0.375rem 0.75rem;font-size:0.8125rem}
.form-control-lg,.icd-control-lg{padding:0.625rem 1rem;font-size:1rem}

textarea.form-control,textarea.icd-control{resize:vertical;min-height:5rem}

.form-group,.icd-field{margin-bottom:1rem}

.input-group{display:flex;align-items:stretch;width:100%}
.input-group>.form-control,.input-group>.form-select,.input-group>.icd-control{
  flex:1 1 auto;min-width:0;border-radius:0;
}
.input-group>.form-control:first-child,.input-group>.icd-control:first-child{border-radius:var(--icd-radius) 0 0 var(--icd-radius)}
.input-group>.form-control:last-child,.input-group>.icd-control:last-child{border-radius:0 var(--icd-radius) var(--icd-radius) 0}
.input-group-text{
  display:flex;align-items:center;padding:0.5rem 0.875rem;font-size:0.875rem;
  color:var(--icd-text-muted);background:#F8FAFC;border:1.5px solid var(--icd-border);
  border-radius:var(--icd-radius);white-space:nowrap;
}
.input-group .input-group-text:first-child{border-right:none;border-radius:var(--icd-radius) 0 0 var(--icd-radius)}
.input-group .input-group-text:last-child{border-left:none;border-radius:0 var(--icd-radius) var(--icd-radius) 0}
.input-group .btn{border-radius:0 var(--icd-radius) var(--icd-radius) 0}
.input-group .btn:first-child{border-radius:var(--icd-radius) 0 0 var(--icd-radius)}

.form-check{display:flex;align-items:center;gap:0.5rem;min-height:1.5rem;padding:0}
.form-check-input{
  width:1rem;height:1rem;border:1.5px solid var(--icd-border);border-radius:var(--icd-radius-xs);
  background:var(--icd-card-bg);cursor:pointer;transition:all var(--icd-t);flex-shrink:0;
  appearance:none;-webkit-appearance:none;
}
.form-check-input[type="radio"]{border-radius:50%}
.form-check-input:checked{background:var(--icd-primary);border-color:var(--icd-primary)}
.form-check-input[type="checkbox"]:checked{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 8l3.5 3.5L13 4'/%3E%3C/svg%3E");
  background-size:0.875rem;background-position:center;background-repeat:no-repeat;
}
.form-check-input[type="radio"]:checked{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3.5' fill='%23fff'/%3E%3C/svg%3E");
  background-size:0.875rem;background-position:center;background-repeat:no-repeat;
}
.form-check-input:focus{outline:none;box-shadow:0 0 0 3px rgba(79,70,229,0.15)}
.form-check-label{font-size:0.875rem;cursor:pointer;color:var(--icd-text-secondary)}

.form-switch .form-check-input{
  width:2.25rem;height:1.25rem;border-radius:var(--icd-radius-full);position:relative;
  background:var(--icd-border);border-color:var(--icd-border);
}
.form-switch .form-check-input::before{
  content:'';position:absolute;width:0.875rem;height:0.875rem;background:#fff;
  border-radius:50%;top:50%;left:2px;transform:translateY(-50%);
  transition:left var(--icd-t),background var(--icd-t);box-shadow:var(--icd-shadow-xs);
}
.form-switch .form-check-input:checked{background:var(--icd-primary);border-color:var(--icd-primary)}
.form-switch .form-check-input:checked::before{left:calc(100% - 2px - 0.875rem)}

.form-text,.invalid-feedback,.valid-feedback{
  display:block;font-size:0.8rem;margin-top:0.25rem;
}
.form-text{color:var(--icd-text-muted)}
.invalid-feedback{color:var(--icd-danger)}
.valid-feedback{color:var(--icd-success)}

/* ── 14. TABLES ──────────────────────────────────────────── */
.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--icd-radius)}
.table{
  width:100%;border-collapse:collapse;caption-side:bottom;
  font-size:0.875rem;color:var(--icd-text);
}
.table th,.table td{padding:0.75rem 1rem;vertical-align:middle;border-bottom:1px solid var(--icd-border)}
.table th{font-weight:600;font-size:0.8125rem;color:var(--icd-text-secondary);text-transform:uppercase;letter-spacing:0.04em;white-space:nowrap}
.table thead th{background:#F8FAFC;border-bottom:2px solid var(--icd-border)}
.table tbody tr:last-child td{border-bottom:0}
.table-hover tbody tr:hover>*{background:rgba(79,70,229,0.03)}
.table-striped tbody tr:nth-of-type(odd)>*{background:rgba(241,245,249,0.5)}
.table-bordered th,.table-bordered td{border:1px solid var(--icd-border)}
.table-borderless th,.table-borderless td{border:none}
.table-sm th,.table-sm td{padding:0.5rem 0.75rem}
.table-nowrap th,.table-nowrap td{white-space:nowrap}
.align-middle th,.align-middle td,.align-middle{vertical-align:middle}

/* ── 15. BADGES ──────────────────────────────────────────── */
.badge{
  display:inline-flex;align-items:center;gap:0.25rem;
  padding:0.25rem 0.625rem;font-size:0.75rem;font-weight:600;
  border-radius:var(--icd-radius-full);white-space:nowrap;line-height:1;
}
.badge-primary,.bg-primary.badge{background:var(--icd-primary);color:#fff}
.badge-secondary,.bg-secondary.badge{background:var(--icd-secondary);color:#fff}
.badge-success,.bg-success.badge{background:var(--icd-success);color:#fff}
.badge-warning,.bg-warning.badge{background:var(--icd-warning);color:#fff}
.badge-danger,.bg-danger.badge{background:var(--icd-danger);color:#fff}
.badge-info,.bg-info.badge{background:var(--icd-info);color:#fff}
.badge-dark,.bg-dark.badge{background:#0F172A;color:#fff}
.badge-light,.bg-light.badge{background:#F1F5F9;color:var(--icd-text)}
.badge-soft-primary{background:var(--icd-primary-light);color:var(--icd-primary)}
.badge-soft-success{background:var(--icd-success-light);color:var(--icd-success)}
.badge-soft-warning{background:var(--icd-warning-light);color:var(--icd-warning)}
.badge-soft-danger{background:var(--icd-danger-light);color:var(--icd-danger)}
.badge-soft-info{background:var(--icd-info-light);color:var(--icd-info)}
.badge-soft-secondary{background:var(--icd-secondary-light);color:var(--icd-secondary)}

/* ── 16. ALERTS ──────────────────────────────────────────── */
.alert{
  padding:0.875rem 1.125rem;border-radius:var(--icd-radius);
  border:1px solid transparent;display:flex;gap:0.75rem;align-items:flex-start;
  font-size:0.875rem;
}
.alert-heading{font-weight:600;margin-bottom:0.25rem}
.alert-primary{background:var(--icd-primary-light);border-color:var(--icd-primary-subtle);color:var(--icd-primary)}
.alert-success{background:var(--icd-success-light);border-color:var(--icd-success-subtle);color:#065F46}
.alert-warning{background:var(--icd-warning-light);border-color:var(--icd-warning-subtle);color:#92400E}
.alert-danger{background:var(--icd-danger-light);border-color:var(--icd-danger-subtle);color:#991B1B}
.alert-info{background:var(--icd-info-light);border-color:var(--icd-info-subtle);color:#155E75}
.alert-secondary{background:var(--icd-secondary-light);border-color:#D1D5DB;color:#374151}
.alert-dismissible .btn-close{margin-left:auto;flex-shrink:0}

/* ── 17. PROGRESS ────────────────────────────────────────── */
.progress{
  height:0.5rem;background:#E2E8F0;border-radius:var(--icd-radius-full);
  overflow:hidden;display:flex;
}
.progress-bar{
  background:var(--icd-gradient-primary);border-radius:var(--icd-radius-full);
  transition:width 0.6s ease;display:flex;align-items:center;justify-content:center;
  font-size:0.75rem;font-weight:600;color:#fff;
}
.progress-bar-success,.progress-bar.bg-success{background:var(--icd-gradient-success)}
.progress-bar-warning,.progress-bar.bg-warning{background:var(--icd-gradient-warning)}
.progress-bar-danger,.progress-bar.bg-danger{background:var(--icd-gradient-danger)}
.progress-bar-info,.progress-bar.bg-info{background:var(--icd-gradient-info)}
.progress-bar.bg-primary{background:var(--icd-gradient-primary)}
.progress-sm{height:0.25rem}.progress-md{height:0.625rem}.progress-lg{height:0.875rem}

/* ── 18. SPINNERS ────────────────────────────────────────── */
.spinner-border{
  display:inline-block;width:2rem;height:2rem;border:2.5px solid rgba(79,70,229,0.2);
  border-top-color:var(--icd-primary);border-radius:50%;animation:icd-spin 0.7s linear infinite;
}
.spinner-border-sm{width:1rem;height:1rem;border-width:2px}
.spinner-border-primary{border-color:rgba(79,70,229,0.2);border-top-color:var(--icd-primary)}
.spinner-border-white{border-color:rgba(255,255,255,0.35);border-top-color:#fff}
.spinner-grow{
  display:inline-block;width:2rem;height:2rem;background:var(--icd-primary);
  border-radius:50%;animation:icd-pulse 1s ease-in-out infinite;
}
.spinner-grow-sm{width:1rem;height:1rem}
@keyframes icd-spin{to{transform:rotate(360deg)}}
@keyframes icd-pulse{0%,100%{transform:scale(0);opacity:0}50%{transform:scale(1);opacity:1}}

/* ── 19. MODALS ──────────────────────────────────────────── */
/* Bootstrap-style .modal classes still used by manual modals (e.g. StaffTab) and by the hosted
   forms' internal .modal-body / .modal-footer layout. The imperative host is ICDModalHost
   (.icd-modal-*); the .modal element here is a self-dimming, centered overlay. */
.modal{
  position:fixed;inset:0;z-index:1050;display:none;
  align-items:center;justify-content:center;padding:1rem;overflow:auto;
  background:rgba(15,23,42,0.55);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
}
.modal-dialog{
  position:relative;width:100%;max-width:560px;animation:icd-modal-in var(--icd-t-slow);
}
.modal-dialog-scrollable{max-height:calc(100vh - 2rem);display:flex;flex-direction:column}
.modal-dialog-scrollable .modal-content{max-height:calc(100vh - 2rem);overflow-y:auto}
.modal-dialog-centered{align-items:center}
.modal-sm{max-width:380px}
.modal-lg{max-width:760px}
.modal-xl{max-width:1000px}
.modal-xxl{max-width:1200px}
.modal-content{
  background:var(--icd-card-bg);border-radius:var(--icd-radius-xl);
  box-shadow:0 32px 64px -20px rgba(16,24,40,0.32),0 8px 20px -12px rgba(16,24,40,0.18);
  border:1px solid var(--icd-border);overflow:hidden;
}
.modal-header{
  padding:1.125rem 1.5rem;border-bottom:1px solid var(--icd-border);
  display:flex;align-items:center;gap:1rem;
}
.modal-title{font-size:1.0625rem;font-weight:700;margin:0;flex:1;letter-spacing:-0.01em}
.modal-body{padding:1.5rem;overflow-y:auto}
.modal-footer{
  padding:1rem 1.5rem;border-top:1px solid var(--icd-border);background:#FAFBFC;
  display:flex;align-items:center;justify-content:flex-end;gap:0.75rem;flex-wrap:wrap;
}
/* Colored modal headers (RIBModal HeaderCssClass="bg-info" etc.) → gradient bars w/ white text */
.modal-header.bg-primary,.modal-header.bg-info,.modal-header.bg-success,
.modal-header.bg-warning,.modal-header.bg-danger,.modal-header.bg-dark{border-bottom:none;color:#fff}
.modal-header.bg-primary{background:var(--icd-gradient-primary)}
.modal-header.bg-info{background:var(--icd-gradient-info)}
.modal-header.bg-success{background:var(--icd-gradient-success)}
.modal-header.bg-warning{background:var(--icd-gradient-warning)}
.modal-header.bg-danger{background:var(--icd-gradient-danger)}
.modal-header.bg-primary .modal-title,.modal-header.bg-info .modal-title,
.modal-header.bg-success .modal-title,.modal-header.bg-warning .modal-title,
.modal-header.bg-danger .modal-title,.modal-header.bg-dark .modal-title,
.modal-header[class*="bg-"] .btn-close{color:#fff}
.modal-header[class*="bg-"] .btn-close{opacity:0.85}
.modal-header[class*="bg-"] .btn-close:hover{opacity:1;background:rgba(255,255,255,0.18)}
/* text-bg-* headers (RIBModal default) — drop the internal colored bottom border */
.modal-header[class*="text-bg-"]{border-bottom:none}
@keyframes icd-modal-in{from{opacity:0;transform:translateY(-16px) scale(0.98)}to{opacity:1;transform:none}}
@keyframes icd-fade-in{from{opacity:0}to{opacity:1}}

/* ── 20. DROPDOWNS ───────────────────────────────────────── */
.dropdown{position:relative}
.dropdown-toggle::after{
  display:inline-block;content:'';width:0;height:0;vertical-align:0.2em;
  border-top:0.3em solid;border-right:0.3em solid transparent;border-left:0.3em solid transparent;
  margin-left:0.375em;
}
.dropdown-menu{
  display:none;
  position:absolute;z-index:1000;min-width:200px;padding:0.375rem;
  background:var(--icd-card-bg);border:1px solid var(--icd-border);
  border-radius:var(--icd-radius-lg);box-shadow:var(--icd-shadow-md);
  animation:icd-dropdown-in var(--icd-t-fast);top:calc(100% + 4px);left:0;
}
.dropdown-menu.show{display:block}
.dropdown-menu-end{left:auto;right:0}
.dropdown-menu-lg{min-width:320px}
.dropdown-item{
  display:flex;align-items:center;gap:0.625rem;padding:0.5rem 0.75rem;
  font-size:0.875rem;color:var(--icd-text-secondary);border-radius:var(--icd-radius-sm);
  transition:all var(--icd-t-fast);cursor:pointer;border:none;background:none;width:100%;
}
.dropdown-item:hover,.dropdown-item:focus{background:var(--icd-primary-light);color:var(--icd-primary)}
.dropdown-item.active{background:var(--icd-primary-light);color:var(--icd-primary);font-weight:500}
.dropdown-item i{font-size:1rem;width:1.25rem;text-align:center;flex-shrink:0}
.dropdown-header{padding:0.5rem 0.75rem;font-size:0.75rem;font-weight:600;color:var(--icd-text-muted);text-transform:uppercase;letter-spacing:0.06em}
.dropdown-divider{margin:0.375rem 0;border-top:1px solid var(--icd-border)}
@keyframes icd-dropdown-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ── 21. NAV & TABS ──────────────────────────────────────── */
.nav{display:flex;flex-wrap:wrap;padding:0;margin:0;list-style:none}
.nav-link{
  display:flex;align-items:center;gap:0.5rem;padding:0.5rem 0.875rem;
  font-size:0.875rem;color:var(--icd-text-muted);border-radius:var(--icd-radius);
  transition:all var(--icd-t);cursor:pointer;border:none;background:none;
}
.nav-link:hover{color:var(--icd-text)}
.nav-link.active{color:var(--icd-primary);font-weight:500}
.nav-tabs{border-bottom:2px solid var(--icd-border);gap:0.25rem}
.nav-tabs .nav-link{border-radius:var(--icd-radius) var(--icd-radius) 0 0;padding:0.625rem 1rem;border-bottom:2px solid transparent;margin-bottom:-2px}
.nav-tabs .nav-link:hover{color:var(--icd-text);border-bottom-color:var(--icd-border)}
.nav-tabs .nav-link.active{color:var(--icd-primary);border-bottom-color:var(--icd-primary);background:transparent;font-weight:600}
.nav-pills{gap:0.25rem}
.nav-pills .nav-link{border-radius:var(--icd-radius)}
.nav-pills .nav-link.active{background:var(--icd-primary);color:#fff}
.nav-tabs-custom{background:transparent}
.tab-content{padding-top:1.25rem}
.tab-pane{display:none}.tab-pane.active.show,.tab-pane.show{display:block;animation:icd-fade-in var(--icd-t)}
.fade{opacity:0;transition:opacity var(--icd-t)}.fade.show{opacity:1}

/* ── 22. PAGINATION ──────────────────────────────────────── */
.pagination{display:flex;align-items:center;gap:0.25rem;list-style:none;padding:0;margin:0}
.page-item .page-link{
  display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;
  font-size:0.875rem;border-radius:var(--icd-radius-sm);border:1px solid var(--icd-border);
  background:var(--icd-card-bg);color:var(--icd-text-secondary);
  transition:all var(--icd-t-fast);cursor:pointer;
}
.page-item .page-link:hover{background:var(--icd-primary-light);border-color:var(--icd-primary);color:var(--icd-primary)}
.page-item.active .page-link{background:var(--icd-primary);border-color:var(--icd-primary);color:#fff}
.page-item.disabled .page-link{opacity:0.4;cursor:not-allowed;pointer-events:none}

/* ── 23. AVATARS ─────────────────────────────────────────── */
.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-weight:600;background:var(--icd-primary-light);color:var(--icd-primary);flex-shrink:0}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.avatar-xxs{width:1.5rem;height:1.5rem;font-size:0.625rem}
.avatar-xs{width:2rem;height:2rem;font-size:0.75rem}
.avatar-sm{width:2.5rem;height:2.5rem;font-size:0.875rem}
.avatar,.avatar-md{width:3rem;height:3rem;font-size:1rem}
.avatar-lg{width:3.5rem;height:3.5rem;font-size:1.25rem}
.avatar-xl{width:4.5rem;height:4.5rem;font-size:1.5rem}
.avatar-group{display:flex;padding-left:0.75rem}
.avatar-group .avatar{margin-left:-0.75rem;border:2px solid var(--icd-card-bg)}
/* Inner element of an avatar box — centers/sizes the icon or initials and inherits
   the bg/shape utility classes on the same element (was undefined → broken icon chips). */
.avatar-title{display:flex;align-items:center;justify-content:center;width:100%;height:100%;color:#fff;font-weight:500}

/* Soft tinted backgrounds (Velzon "bg-soft-*" → ICD token tints). Were undefined. */
.bg-soft-primary{background-color:var(--icd-primary-light)!important}
.bg-soft-secondary{background-color:var(--icd-secondary-light)!important}
.bg-soft-success{background-color:var(--icd-success-light)!important}
.bg-soft-info{background-color:var(--icd-info-light)!important}
.bg-soft-warning{background-color:var(--icd-warning-light)!important}
.bg-soft-danger{background-color:var(--icd-danger-light)!important}

/* ── 24. SIDEBAR LAYOUT ──────────────────────────────────── */
#layout-wrapper{display:flex;min-height:100vh}

.app-menu,.navbar-menu{
  position:fixed;top:0;left:0;width:var(--icd-sidebar-width);height:100vh;
  background:var(--icd-gradient-sidebar);z-index:100;transition:transform var(--icd-t-slow),width var(--icd-t-slow);
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:inset -1px 0 0 rgba(255,255,255,0.04);
}

.navbar-brand-box{
  padding:1rem;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--icd-sidebar-border);min-height:var(--icd-topbar-height);flex-shrink:0;
}
.navbar-brand-box .logo{display:flex;align-items:center;gap:0.75rem}
.navbar-brand-box .logo img{height:40px;width:auto;object-fit:contain}
.logo-sm{display:none}
/* Show exactly one logo per theme (was showing both → duplicate logos) */
.logo-dark{display:flex;align-items:center}
.logo-light{display:none}
[data-layout-mode="dark"] .logo-dark{display:none}
[data-layout-mode="dark"] .logo-light{display:flex;align-items:center}

#scrollbar{flex:1;overflow-y:auto;overflow-x:hidden;padding:1rem 0}
#scrollbar::-webkit-scrollbar{width:4px}
#scrollbar::-webkit-scrollbar-track{background:transparent}
#scrollbar::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:var(--icd-radius-full)}
#scrollbar::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.2)}

.menu-title{
  display:block;padding:0.5rem 1.25rem;font-size:0.7rem;font-weight:700;
  text-transform:uppercase;letter-spacing:0.08em;color:var(--icd-sidebar-title);
  margin-top:0.5rem;
}

#navbar-nav{padding:0 0.75rem}

#navbar-nav .nav-item{margin-bottom:2px}
#navbar-nav .nav-link,.menu-link{
  display:flex;align-items:center;gap:0.75rem;padding:0.625rem 0.875rem;
  color:var(--icd-sidebar-text);font-size:0.875rem;font-weight:500;border-radius:var(--icd-radius);
  transition:all var(--icd-t);cursor:pointer;text-decoration:none;white-space:nowrap;
}
#navbar-nav .nav-link i,.menu-link i{font-size:1.1rem;flex-shrink:0;width:1.25rem;text-align:center}
#navbar-nav .nav-link:hover,.menu-link:hover{
  background:var(--icd-sidebar-hover);color:var(--icd-sidebar-text-hover);
}
#navbar-nav .nav-link.active,.menu-link.active{
  background:var(--icd-gradient-primary);color:#fff;font-weight:600;
  box-shadow:0 6px 16px -4px rgba(79,70,229,0.55);
}
#navbar-nav .nav-link.active i,.menu-link.active i{color:#fff}

.sidebar-background{display:none}

/* ── 25. TOPBAR ──────────────────────────────────────────── */
#page-topbar{
  position:fixed;top:0;left:var(--icd-sidebar-width);right:0;
  height:var(--icd-topbar-height);background:var(--icd-topbar-bg);
  border-bottom:1px solid var(--icd-topbar-border);z-index:99;
  box-shadow:var(--icd-shadow-xs);transition:left var(--icd-t-slow);
}
.layout-width{height:100%}
.navbar-header{
  height:100%;display:flex;align-items:center;justify-content:space-between;
  padding:0 1.25rem;gap:0.75rem;
}
.horizontal-logo{display:none}

.hamburger-icon{display:flex;flex-direction:column;gap:4px;width:20px;cursor:pointer}
.hamburger-icon span{display:block;height:2px;background:var(--icd-topbar-icon);border-radius:2px;transition:all var(--icd-t)}
.topnav-hamburger{background:none;border:1px solid var(--icd-border);border-radius:var(--icd-radius);padding:0.375rem 0.625rem}
.topnav-hamburger:hover{background:var(--icd-secondary-light)}

/* Topbar icons */
.header-item{display:flex;align-items:center}
.header-profile-user{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 0 0 1px var(--icd-border),0 2px 4px rgba(16,24,40,0.08)}
.user-name-text{font-weight:600;font-size:0.875rem;color:var(--icd-text)}
.user-name-sub-text{font-size:0.75rem;color:var(--icd-text-muted)}
/* User chip in the topbar — subtle hover affordance */
.topbar-user>.btn{padding:0.3rem 0.5rem;border-radius:var(--icd-radius-lg);transition:background var(--icd-t)}
.topbar-user>.btn:hover{background:var(--icd-secondary-light)}
.btn-topbar{color:var(--icd-topbar-icon);transition:background var(--icd-t),color var(--icd-t)}
.btn-topbar:hover{background:var(--icd-secondary-light);color:var(--icd-primary)}

/* ── 26. MAIN CONTENT ────────────────────────────────────── */
.main-content{
  margin-left:var(--icd-sidebar-width);min-height:100vh;
  /* flex:1 + min-width:0 so the content area always fills the space next to the
     fixed sidebar — without this, narrow pages shrink to content width and leave
     a large empty gap on the right. */
  flex:1 1 auto;min-width:0;
  display:flex;flex-direction:column;transition:margin-left var(--icd-t-slow);
}
.page-content{
  flex:1;padding:calc(var(--icd-topbar-height) + 1.5rem) 1.5rem 1.5rem;
}
.container-fluid{padding:0}

/* Page header */
.page-title-box{margin-bottom:1.5rem}
.page-title-box h4,.page-title-box .page-title{font-size:1.125rem;font-weight:700;color:var(--icd-text);margin:0}
.breadcrumb{display:flex;align-items:center;gap:0.5rem;list-style:none;padding:0;margin:0.375rem 0 0;font-size:0.8125rem}
.breadcrumb-item{color:var(--icd-text-muted)}
.breadcrumb-item a{color:var(--icd-text-muted)}
.breadcrumb-item a:hover{color:var(--icd-primary)}
.breadcrumb-item.active{color:var(--icd-text-secondary)}
.breadcrumb-item+.breadcrumb-item::before{content:'/';color:var(--icd-text-muted)}

/* Footer */
.footer{
  padding:0.875rem 1.5rem;background:var(--icd-topbar-bg);border-top:1px solid var(--icd-topbar-border);
  font-size:0.8125rem;color:var(--icd-text-muted);
}

/* Vertical overlay for mobile */
.vertical-overlay{
  display:none;position:fixed;inset:0;background:rgba(15,23,42,0.45);
  z-index:99;cursor:pointer;backdrop-filter:blur(2px);
}

/* Back to top */
#back-to-top{
  position:fixed;bottom:1.5rem;right:1.5rem;width:2.5rem;height:2.5rem;
  display:none;z-index:90;box-shadow:var(--icd-shadow-md);padding:0;
}
#back-to-top.show{display:flex;align-items:center;justify-content:center;animation:icd-fade-in var(--icd-t)}

/* ── 27. ICD SELECT COMPONENT ────────────────────────────── */
.icd-select-wrapper{position:relative;width:100%}
.icd-select-control{
  display:flex;align-items:center;justify-content:space-between;gap:0.5rem;
  padding:0.5rem 0.875rem;background:var(--icd-card-bg);border:1.5px solid var(--icd-border);
  border-radius:var(--icd-radius);cursor:pointer;transition:all var(--icd-t);min-height:2.375rem;
  -webkit-user-select:none;user-select:none;
}
.icd-select-control:hover{border-color:#94A3B8}
.icd-select-wrapper.is-open .icd-select-control{border-color:var(--icd-primary);box-shadow:0 0 0 3px rgba(79,70,229,0.12)}
.icd-select-wrapper.is-invalid .icd-select-control{border-color:var(--icd-danger)}
.icd-select-wrapper.is-disabled .icd-select-control{background:#F8FAFC;cursor:not-allowed;opacity:0.7}
.icd-select-value{font-size:0.875rem;color:var(--icd-text);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.icd-select-value.placeholder{color:var(--icd-text-muted)}
.icd-select-arrow{
  color:var(--icd-text-muted);flex-shrink:0;font-size:1.125rem;
  transition:transform var(--icd-t);
}
.icd-select-wrapper.is-open .icd-select-arrow{transform:rotate(180deg)}
.icd-select-clear{
  background:none;border:none;padding:0;color:var(--icd-text-muted);cursor:pointer;
  display:flex;align-items:center;font-size:1rem;transition:color var(--icd-t);flex-shrink:0;
}
.icd-select-clear:hover{color:var(--icd-danger)}

.icd-select-dropdown{
  position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:1050;
  background:var(--icd-card-bg);border:1px solid var(--icd-border);
  border-radius:var(--icd-radius-lg);box-shadow:var(--icd-shadow-md);overflow:hidden;
  animation:icd-dropdown-in var(--icd-t-fast);
}
.icd-select-search{
  display:flex;align-items:center;gap:0.5rem;padding:0.625rem 0.875rem;
  border-bottom:1px solid var(--icd-border);position:sticky;top:0;background:var(--icd-card-bg);
}
.icd-select-search i{color:var(--icd-text-muted);font-size:1rem;flex-shrink:0}
.icd-select-search input{
  flex:1;border:none;outline:none;font-size:0.875rem;color:var(--icd-text);background:transparent;
}
.icd-select-search input::placeholder{color:var(--icd-text-muted)}
.icd-select-options{max-height:220px;overflow-y:auto;padding:0.375rem}
.icd-select-options::-webkit-scrollbar{width:4px}
.icd-select-options::-webkit-scrollbar-thumb{background:var(--icd-border);border-radius:var(--icd-radius-full)}
.icd-select-option{
  padding:0.5rem 0.75rem;font-size:0.875rem;color:var(--icd-text-secondary);
  border-radius:var(--icd-radius-sm);cursor:pointer;transition:all var(--icd-t-fast);
  display:flex;align-items:center;justify-content:space-between;gap:0.5rem;
}
.icd-select-option:hover{background:var(--icd-primary-light);color:var(--icd-primary)}
.icd-select-option.selected{background:var(--icd-primary-light);color:var(--icd-primary);font-weight:500}
.icd-select-option.selected::after{content:'\EB7B';font-family:'remixicon';font-size:0.875rem}
.icd-select-option.clear-opt{color:var(--icd-text-muted);font-style:italic}
.icd-select-empty{padding:1.25rem;text-align:center;color:var(--icd-text-muted);font-size:0.875rem}

/* Multi-select (chips + checkbox options) */
.icd-multiselect.is-open{z-index:1051}
.icd-multiselect .icd-select-control{min-height:42px;height:auto;flex-wrap:wrap;padding-top:0.25rem;padding-bottom:0.25rem}
.icd-ms-chips{display:flex;flex-wrap:wrap;gap:0.3rem;flex:1;min-width:0;align-items:center}
.icd-ms-chip{display:inline-flex;align-items:center;gap:0.25rem;background:var(--icd-primary-light);color:var(--icd-primary);font-size:0.75rem;font-weight:600;padding:0.15rem 0.55rem;border-radius:999px;line-height:1.4}
.icd-ms-chip-x{background:none;border:none;color:var(--icd-primary);cursor:pointer;padding:0;display:flex;font-size:0.9rem;opacity:0.65}
.icd-ms-chip-x:hover{opacity:1}
.icd-multiselect .icd-select-option{display:flex;align-items:center;gap:0.5rem}
.icd-ms-check{font-size:1.15rem;flex-shrink:0;color:var(--icd-text-muted)}
.ri-checkbox-fill.icd-ms-check{color:var(--icd-primary)}
.icd-ms-backdrop{position:fixed;inset:0;z-index:1050;background:transparent}

/* ── 28. ICD TABLE COMPONENT ─────────────────────────────── */
.icd-table-wrapper{background:var(--icd-card-bg);border:1px solid var(--icd-border);border-radius:var(--icd-radius-lg);overflow:hidden}
.icd-table-toolbar{
  display:flex;align-items:center;gap:0.75rem;padding:0.875rem 1.125rem;
  border-bottom:1px solid var(--icd-border);flex-wrap:wrap;
}
.icd-table-search{
  display:flex;align-items:center;gap:0.5rem;flex:1;min-width:200px;
  background:#F8FAFC;border:1.5px solid var(--icd-border);border-radius:var(--icd-radius);
  padding:0.375rem 0.75rem;transition:all var(--icd-t);
}
.icd-table-search:focus-within{background:var(--icd-card-bg);border-color:var(--icd-primary);box-shadow:0 0 0 3px rgba(79,70,229,0.1)}
.icd-table-search i{color:var(--icd-text-muted);font-size:1rem;flex-shrink:0}
.icd-table-search input{border:none;outline:none;background:transparent;font-size:0.875rem;color:var(--icd-text);flex:1}
.icd-table-search input::placeholder{color:var(--icd-text-muted)}
.icd-table-count{font-size:0.8125rem;color:var(--icd-text-muted);white-space:nowrap}
.icd-table-actions{display:flex;align-items:center;gap:0.5rem;margin-left:auto}

.icd-table thead th{
  background:#F8FAFC;border-bottom:2px solid var(--icd-border);
  font-size:0.75rem;font-weight:700;color:var(--icd-text-secondary);
  text-transform:uppercase;letter-spacing:0.06em;padding:0.75rem 1rem;
  white-space:nowrap;-webkit-user-select:none;user-select:none;
}
.icd-table thead th.sortable{cursor:pointer;transition:background var(--icd-t-fast)}
.icd-table thead th.sortable:hover{background:#EEF2FF}
.icd-table thead th .sort-icon{margin-left:0.375rem;opacity:0.4;font-size:0.875rem;vertical-align:middle}
.icd-table thead th.sort-asc .sort-icon,.icd-table thead th.sort-desc .sort-icon{opacity:1;color:var(--icd-primary)}
.icd-table tbody td{padding:0.75rem 1rem;vertical-align:middle;border-bottom:1px solid rgba(226,232,240,0.7)}
.icd-table tbody tr:last-child td{border-bottom:none}
.icd-table tbody tr:hover>td{background:rgba(79,70,229,0.025)}

/* Neutralize leftover non-functional Grid.js demo chrome (the library is not loaded,
   so these render as empty boxes / fake controls). The .icd-table swap styles the cells;
   these rules hide the dead sort buttons, pagination and search wrappers. */
.gridjs-sort,.gridjs-pagination,.gridjs-summary,.gridjs-pages,.gridjs-footer{display:none!important}
.gridjs-th-content{display:inline}

.icd-table-footer{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0.75rem;
  padding:0.875rem 1.125rem;border-top:1px solid var(--icd-border);
}
.icd-table-footer-info{font-size:0.8125rem;color:var(--icd-text-muted)}
.icd-pagination{display:flex;align-items:center;gap:0.25rem}
.icd-page-btn{
  display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;
  font-size:0.8125rem;border-radius:var(--icd-radius-sm);border:1px solid var(--icd-border);
  background:var(--icd-card-bg);color:var(--icd-text-secondary);cursor:pointer;
  transition:all var(--icd-t-fast);-webkit-user-select:none;user-select:none;
}
.icd-page-btn:hover{background:var(--icd-primary-light);border-color:var(--icd-primary);color:var(--icd-primary)}
.icd-page-btn.active{background:var(--icd-primary);border-color:var(--icd-primary);color:#fff}
.icd-page-btn.disabled,.icd-page-btn:disabled{opacity:0.4;cursor:not-allowed;pointer-events:none}

/* Skeleton rows */
.icd-skeleton{display:block;background:linear-gradient(90deg,#F1F5F9 25%,#E2E8F0 50%,#F1F5F9 75%);background-size:400px 100%;border-radius:var(--icd-radius-sm);animation:icd-shimmer 1.4s ease infinite}
@keyframes icd-shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}
.icd-skeleton-row td{border-bottom:1px solid var(--icd-border)}

/* Empty state */
.icd-empty{
  padding:3.5rem 2rem;text-align:center;color:var(--icd-text-muted);
  display:flex;flex-direction:column;align-items:center;gap:0.35rem;
}
.icd-empty i{
  font-size:1.875rem;margin-bottom:0.85rem;color:var(--icd-primary);
  width:4.25rem;height:4.25rem;display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:radial-gradient(circle at 50% 30%,var(--icd-primary-light) 0%,#fff 75%);
  box-shadow:inset 0 0 0 1px var(--icd-border),0 10px 24px -10px rgba(79,70,229,0.28);
}
.icd-empty p{font-size:0.95rem;margin:0;color:var(--icd-text-secondary);font-weight:600}
.icd-empty .icd-empty-sub,.icd-empty small{font-size:0.8125rem;color:var(--icd-text-muted);font-weight:400}

/* ── 29. ICD CARD COMPONENT ──────────────────────────────── */
.icd-card{background:var(--icd-card-bg);border:1px solid var(--icd-border);border-radius:var(--icd-radius-lg);box-shadow:var(--icd-shadow-card);overflow:hidden}
.icd-card-header{
  display:flex;align-items:center;gap:0.875rem;padding:1rem 1.25rem;
  border-bottom:1px solid var(--icd-border);
}
.icd-card-icon{
  width:2.375rem;height:2.375rem;border-radius:var(--icd-radius);
  background:var(--icd-gradient-primary);color:#fff;
  box-shadow:0 4px 10px -3px rgba(79,70,229,0.45);
  display:flex;align-items:center;justify-content:center;font-size:1.05rem;flex-shrink:0;
}
.icd-card-title{font-size:0.9375rem;font-weight:600;color:var(--icd-text);margin:0;flex:1}
.icd-card-subtitle{font-size:0.8rem;color:var(--icd-text-muted);margin:0}
.icd-card-actions{display:flex;align-items:center;gap:0.5rem;margin-left:auto}
.icd-card-body{padding:1.25rem}
.icd-card-footer{padding:0.875rem 1.25rem;border-top:1px solid var(--icd-border);background:#FAFBFC}

/* ── Reusable section header (dividers inside cards, modals & forms).
   Icon + uppercase label + trailing hairline; consistent rhythm everywhere. ── */
.icd-section{
  display:flex;align-items:center;gap:0.55rem;
  margin:1.5rem 0 0.85rem;
  color:var(--icd-text-secondary);font-weight:700;
  font-size:0.75rem;text-transform:uppercase;letter-spacing:0.07em;
}
.icd-section:first-child{margin-top:0.25rem}
.icd-section i{font-size:1.05rem;color:var(--icd-primary)}
.icd-section::after{content:"";flex:1;height:1px;background:var(--icd-border)}
/* When a section header immediately follows a form/table, tighten the top gap. */
.icd-section.mt-tight{margin-top:1rem}

/* ── 30. ICD STAT CARD ───────────────────────────────────── */
.icd-stat{
  background:var(--icd-card-bg);border:1px solid var(--icd-border);
  border-radius:var(--icd-radius-lg);box-shadow:var(--icd-shadow-card);
  padding:1.25rem 1.375rem;display:flex;align-items:flex-start;gap:1rem;
  transition:transform var(--icd-t),box-shadow var(--icd-t),border-color var(--icd-t);
  position:relative;overflow:hidden;
}
.icd-stat:hover{transform:translateY(-3px);box-shadow:var(--icd-shadow-card-hover);border-color:transparent}
.icd-stat-icon{
  width:3rem;height:3rem;border-radius:var(--icd-radius-lg);
  display:flex;align-items:center;justify-content:center;font-size:1.375rem;flex-shrink:0;
  color:#fff;box-shadow:0 6px 14px -4px rgba(16,24,40,0.22);
}
.icd-stat-content{flex:1;min-width:0}
.icd-stat-label{font-size:0.78rem;color:var(--icd-text-muted);font-weight:600;letter-spacing:0.02em;text-transform:uppercase;margin-bottom:0.4rem}
.icd-stat-value{font-size:1.875rem;font-weight:800;color:var(--icd-text);line-height:1;margin-bottom:0.5rem;letter-spacing:-0.02em}
/* Long identifiers (e.g. case codes) — shrink + wrap so they never overflow the tile */
.icd-stat-code .icd-stat-value{font-size:1.15rem;line-height:1.25;letter-spacing:0;word-break:break-word}
.icd-stat-trend{display:inline-flex;align-items:center;gap:0.25rem;font-size:0.8125rem;font-weight:500;padding:0.2rem 0.5rem;border-radius:var(--icd-radius-full)}
.icd-stat-trend.up{color:var(--icd-success);background:var(--icd-success-light)}
.icd-stat-trend.down{color:var(--icd-danger);background:var(--icd-danger-light)}
.icd-stat-trend.neutral{color:var(--icd-secondary);background:var(--icd-secondary-light)}

/* ── 31. ICD PAGE HEADER ─────────────────────────────────── */
.icd-page-header{margin-bottom:1.5rem}
.icd-page-header-inner{
  display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.icd-page-title{
  font-size:1.25rem;font-weight:800;color:var(--icd-text);margin:0 0 0.375rem;
  letter-spacing:-0.02em;display:flex;align-items:center;gap:0.625rem;
}
.icd-page-title::before{
  content:'';width:4px;height:1.15em;border-radius:var(--icd-radius-full);
  background:var(--icd-gradient-primary);flex-shrink:0;
}
.icd-breadcrumb{display:flex;align-items:center;gap:0.5rem;list-style:none;padding:0;margin:0;font-size:0.8125rem}
.icd-breadcrumb-item{color:var(--icd-text-muted)}
.icd-breadcrumb-item a{color:var(--icd-text-muted);transition:color var(--icd-t)}
.icd-breadcrumb-item a:hover{color:var(--icd-primary)}
.icd-breadcrumb-item.active{color:var(--icd-text-secondary);font-weight:500}
.icd-breadcrumb-item+.icd-breadcrumb-item::before{content:'\EA6E';font-family:'remixicon';font-size:0.875rem;color:var(--icd-text-muted)}
.icd-page-actions{display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap;flex-shrink:0}

/* ── 32. ICD MODAL ───────────────────────────────────────── */
.icd-modal-overlay{
  position:fixed;inset:0;background:rgba(15,23,42,0.55);
  z-index:1040;display:flex;align-items:center;justify-content:center;
  padding:1rem;animation:icd-fade-in var(--icd-t);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
}
.icd-modal{
  background:var(--icd-card-bg);border-radius:var(--icd-radius-xl);
  box-shadow:0 32px 64px -20px rgba(16,24,40,0.32),0 8px 20px -12px rgba(16,24,40,0.18);
  width:100%;max-width:560px;
  animation:icd-modal-in var(--icd-t-slow);overflow:hidden;
  max-height:calc(100vh - 2rem);display:flex;flex-direction:column;
}
.icd-modal.sm{max-width:380px}
.icd-modal.lg{max-width:760px}
.icd-modal.xl{max-width:1000px}
.icd-modal-header{
  display:flex;align-items:center;gap:1rem;padding:1.125rem 1.5rem;
  border-bottom:1px solid var(--icd-border);flex-shrink:0;
}
.icd-modal-title{font-size:1.0625rem;font-weight:700;margin:0;flex:1;color:var(--icd-text);letter-spacing:-0.01em}
.icd-modal-body{padding:1.5rem;overflow-y:auto;flex:1}
.icd-modal-footer{
  padding:1rem 1.5rem;border-top:1px solid var(--icd-border);background:#FAFBFC;
  display:flex;align-items:center;justify-content:flex-end;gap:0.75rem;flex-wrap:wrap;flex-shrink:0;
}

/* ── 33. ICD INPUT & TEXTAREA ────────────────────────────── */
.icd-input-wrapper{position:relative}
.icd-input-icon-left .icd-control,.icd-input-icon-left .form-control{padding-left:2.5rem}
.icd-input-icon-right .icd-control,.icd-input-icon-right .form-control{padding-right:2.5rem}
.icd-input-icon{
  position:absolute;top:50%;transform:translateY(-50%);
  color:var(--icd-text-muted);font-size:1rem;pointer-events:none;
}
.icd-input-icon.left{left:0.75rem}
.icd-input-icon.right{right:0.75rem}

/* ── 34. TOAST SYSTEM ────────────────────────────────────── */
.mis-toast-container{
  position:fixed;top:1.25rem;right:1.25rem;z-index:9999;
  display:flex;flex-direction:column;gap:0.625rem;max-width:360px;width:100%;
}
.mis-toast{
  background:var(--icd-card-bg);border-radius:var(--icd-radius-lg);
  box-shadow:0 16px 32px -12px rgba(16,24,40,0.22),0 4px 10px -4px rgba(16,24,40,0.10);
  border:1px solid var(--icd-border);
  overflow:hidden;position:relative;animation:toast-in 0.3s cubic-bezier(0.4,0,0.2,1);
}
.mis-toast.removing{animation:toast-out 0.24s ease forwards}
.mis-toast-inner{display:flex;align-items:flex-start;gap:0.875rem;padding:0.9rem 1rem}
.mis-toast-icon{
  width:2.25rem;height:2.25rem;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;font-size:1.15rem;
}
.mis-toast-body{flex:1;min-width:0}
.mis-toast-heading{font-size:0.875rem;font-weight:600;color:var(--icd-text);margin-bottom:0.125rem}
.mis-toast-message{font-size:0.8125rem;color:var(--icd-text-secondary);line-height:1.4}
.mis-toast-close{background:none;border:none;color:var(--icd-text-muted);cursor:pointer;padding:2px;margin:-4px;border-radius:var(--icd-radius-sm);transition:all var(--icd-t-fast);flex-shrink:0;font-size:1rem;display:flex;align-items:center}
.mis-toast-close:hover{background:var(--icd-secondary-light);color:var(--icd-text)}
.mis-toast-progress{height:3px;position:absolute;bottom:0;left:0;right:0;border-radius:0 0 var(--icd-radius-lg) var(--icd-radius-lg);overflow:hidden;background:rgba(0,0,0,0.05)}
.mis-toast-progress-bar{height:100%;animation:toast-progress linear forwards;transform-origin:left}

.mis-toast-success{border-left:3px solid var(--icd-success)}
.mis-toast-success .mis-toast-icon{color:var(--icd-success);background:var(--icd-success-light)}
.mis-toast-success .mis-toast-progress-bar{background:var(--icd-gradient-success)}
.mis-toast-error{border-left:3px solid var(--icd-danger)}
.mis-toast-error .mis-toast-icon{color:var(--icd-danger);background:var(--icd-danger-light)}
.mis-toast-error .mis-toast-progress-bar{background:var(--icd-gradient-danger)}
.mis-toast-warning{border-left:3px solid var(--icd-warning)}
.mis-toast-warning .mis-toast-icon{color:var(--icd-warning);background:var(--icd-warning-light)}
.mis-toast-warning .mis-toast-progress-bar{background:var(--icd-gradient-warning)}
.mis-toast-info{border-left:3px solid var(--icd-info)}
.mis-toast-info .mis-toast-icon{color:var(--icd-info);background:var(--icd-info-light)}
.mis-toast-info .mis-toast-progress-bar{background:var(--icd-gradient-info)}

@keyframes toast-in{from{opacity:0;transform:translateX(100%) scale(0.9)}to{opacity:1;transform:none}}
@keyframes toast-out{from{opacity:1;transform:none}to{opacity:0;transform:translateX(100%) scale(0.9)}}
@keyframes toast-progress{from{width:100%}to{width:0}}

/* ── 35. CHART / SCP CLASSES ─────────────────────────────── */
.scp-wrapper{position:relative;width:100%}
.scp-container{width:100%;height:320px}
.scp-legend{display:flex;flex-wrap:wrap;gap:0.75rem;margin-top:0.75rem}
.scp-legend-item{display:flex;align-items:center;gap:0.375rem;font-size:0.8125rem;color:var(--icd-text-secondary)}
.scp-legend-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}

/* ── 36. THINKING DOTS (AI) ──────────────────────────────── */
.thinking-dots{display:inline-flex;gap:4px;align-items:center;padding:0.25rem 0}
.thinking-dots span{width:6px;height:6px;border-radius:50%;background:var(--icd-primary);animation:thinking-pulse 1.4s ease-in-out infinite}
.thinking-dots span:nth-child(2){animation-delay:0.2s}
.thinking-dots span:nth-child(3){animation-delay:0.4s}
@keyframes thinking-pulse{0%,80%,100%{transform:scale(0.6);opacity:0.4}40%{transform:scale(1);opacity:1}}

/* ── 37. LANDING PAGE ────────────────────────────────────── */
.auth-page-wrapper{min-height:100vh;background:var(--icd-body-bg);display:flex;align-items:center;justify-content:center;padding:1rem}
.auth-card{background:var(--icd-card-bg);border-radius:var(--icd-radius-xl);box-shadow:var(--icd-shadow-lg);padding:2.5rem;width:100%;max-width:440px;border:1px solid var(--icd-border)}
.auth-logo{text-align:center;margin-bottom:2rem}
.auth-logo img{height:60px;width:auto}
.auth-title{font-size:1.375rem;font-weight:700;text-align:center;margin-bottom:0.375rem}
.auth-subtitle{text-align:center;color:var(--icd-text-muted);font-size:0.875rem;margin-bottom:2rem}

/* OTP input */
.otp-group{display:flex;gap:0.75rem;justify-content:center}
.otp-input{
  width:3rem;height:3.5rem;text-align:center;font-size:1.5rem;font-weight:700;
  border:2px solid var(--icd-border);border-radius:var(--icd-radius);
  color:var(--icd-text);background:var(--icd-card-bg);transition:all var(--icd-t);
}
.otp-input:focus{border-color:var(--icd-primary);box-shadow:var(--icd-shadow-focus);outline:none}

/* ── 38. MISC UTILITIES ──────────────────────────────────── */
.link-primary{color:var(--icd-primary)!important}
.link-primary:hover{color:var(--icd-primary-hover)!important}
.link-secondary{color:var(--icd-secondary)!important}
.link-success{color:var(--icd-success)!important}
.link-danger{color:var(--icd-danger)!important}
.link-warning{color:var(--icd-warning)!important}

.list-group{border-radius:var(--icd-radius-lg);overflow:hidden;border:1px solid var(--icd-border)}
.list-group-item{padding:0.875rem 1.125rem;background:var(--icd-card-bg);border-bottom:1px solid var(--icd-border);display:flex;align-items:center;gap:0.875rem;font-size:0.875rem;color:var(--icd-text-secondary)}
.list-group-item:last-child{border-bottom:none}
.list-group-item.active{background:var(--icd-primary-light);color:var(--icd-primary)}
.list-group-item-action:hover{background:#F8FAFC;cursor:pointer}

/* Collapsible content is hidden until opened (icd.js toggles inline display on click).
   Without this, every .collapse / accordion section renders expanded on load. */
.collapse:not(.show){display:none}
.accordion-collapse:not(.show){display:none}
.accordion-item{border:1px solid var(--icd-border);border-radius:var(--icd-radius)!important;margin-bottom:0.5rem;overflow:hidden}
.accordion-button{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  padding:0.875rem 1.125rem;background:var(--icd-card-bg);border:none;cursor:pointer;
  font-weight:500;color:var(--icd-text);font-size:0.875rem;transition:all var(--icd-t);
}
.accordion-button:not(.collapsed){background:var(--icd-primary-light);color:var(--icd-primary)}
.accordion-button::after{content:'\EA4E';font-family:'remixicon';transition:transform var(--icd-t);font-size:1rem}
.accordion-button:not(.collapsed)::after{transform:rotate(180deg)}
.accordion-body{padding:1rem 1.125rem;border-top:1px solid var(--icd-border);font-size:0.875rem;color:var(--icd-text-secondary)}

.visually-hidden,.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ── 39. DARK MODE ───────────────────────────────────────── */
[data-layout-mode="dark"]{
  --icd-body-bg:#0F172A;--icd-card-bg:#1E293B;--icd-topbar-bg:#1E293B;
  --icd-topbar-border:#334155;--icd-border:#334155;--icd-text:#F1F5F9;
  --icd-text-secondary:#CBD5E1;--icd-text-muted:#64748B;--icd-text-disabled:#475569;
  --icd-sidebar-bg:#0A0F1A;--icd-sidebar-border:rgba(255,255,255,0.04);
  --bs-body-bg:#0F172A;--bs-body-color:#F1F5F9;--bs-border-color:#334155;--bs-card-bg:#1E293B;
}
[data-layout-mode="dark"] .form-control,[data-layout-mode="dark"] .icd-control{background:#0F172A;color:#F1F5F9}
[data-layout-mode="dark"] .form-select,[data-layout-mode="dark"] .icd-select-native{background-color:#0F172A;color:#F1F5F9}
[data-layout-mode="dark"] .icd-select-control{background:#0F172A;border-color:#334155}
[data-layout-mode="dark"] .icd-select-dropdown,[data-layout-mode="dark"] .dropdown-menu{background:#1E293B;border-color:#334155}
[data-layout-mode="dark"] .icd-select-search{background:#1E293B;border-color:#334155}
[data-layout-mode="dark"] .icd-select-search input{color:#F1F5F9}
[data-layout-mode="dark"] .icd-table-search{background:#0F172A;border-color:#334155}
[data-layout-mode="dark"] .icd-table-search input{color:#F1F5F9}
[data-layout-mode="dark"] .icd-table thead th{background:#0F172A}
[data-layout-mode="dark"] thead th{background:#0F172A!important}
[data-layout-mode="dark"] .btn-light{background:#334155;border-color:#475569;color:#CBD5E1}
[data-layout-mode="dark"] .mis-toast{background:#1E293B;border-color:#334155}
[data-layout-mode="dark"] .auth-card{background:#1E293B;border-color:#334155}
[data-layout-mode="dark"] .input-group-text{background:#0F172A;border-color:#334155;color:#94A3B8}
[data-layout-mode="dark"] .topnav-hamburger{border-color:#334155}
[data-layout-mode="dark"] .topnav-hamburger:hover{background:#334155}
[data-layout-mode="dark"] .hamburger-icon span{background:#94A3B8}
[data-layout-mode="dark"] .list-group-item{background:#1E293B;border-color:#334155}

/* ── 40. RESPONSIVE ──────────────────────────────────────── */
@media (max-width: 991.98px) {
  .app-menu,.navbar-menu{transform:translateX(-100%);box-shadow:var(--icd-shadow-lg)}
  .app-menu.show,.navbar-menu.show{transform:translateX(0)}
  .vertical-overlay.show{display:block;animation:icd-fade-in var(--icd-t)}
  #page-topbar{left:0}
  .main-content{margin-left:0}
  .page-content{padding:calc(var(--icd-topbar-height) + 1rem) 1rem 1rem}
  .horizontal-logo{display:flex}
  .navbar-brand-box{display:none}
  .footer{padding:0.75rem 1rem}
}
@media (max-width: 767.98px) {
  .page-content{padding:calc(var(--icd-topbar-height) + 0.75rem) 0.75rem 0.75rem}
  .icd-page-header-inner{flex-direction:column}
  .icd-page-actions{width:100%}
  .icd-table-toolbar{flex-direction:column;align-items:stretch}
  .icd-table-search{min-width:0}
  .icd-table-actions{margin-left:0;justify-content:flex-end}
  .icd-table-footer{flex-direction:column;align-items:center}
  .mis-toast-container{max-width:calc(100vw - 1.5rem);right:0.75rem;left:0.75rem}
  .modal-dialog{max-width:100%;margin:0.5rem}
  .icd-modal{border-radius:var(--icd-radius-lg)}
  .icd-page-title{font-size:1.125rem}
  .icd-page-actions{width:100%}
  .icd-page-actions>*{flex:1 1 auto}
  .auth-card{padding:1.5rem}
  .otp-group{gap:0.5rem}
  .otp-input{width:2.5rem;height:3rem;font-size:1.25rem}
}
@media (max-width: 575.98px) {
  .navbar-header{padding:0 0.875rem}
  .page-content{padding:calc(var(--icd-topbar-height) + 0.5rem) 0.625rem 0.625rem}
  h1,.h1{font-size:1.625rem}.h2{font-size:1.25rem}
  .d-none-xs{display:none!important}
  .icd-stat{flex-direction:column;gap:0.75rem;padding:1.125rem}
  .icd-stat-icon{align-self:flex-start}
  .icd-stat-value{font-size:1.625rem}
  .card-body,.icd-card-body{padding:1rem}
  .modal-body{padding:1.25rem}
  /* Stack footer actions full-width for comfortable tapping (primary on top) */
  .modal-footer,.icd-modal-footer{flex-direction:column-reverse;align-items:stretch;padding:0.875rem 1rem}
  .modal-footer>.btn,.icd-modal-footer>.btn{width:100%}
}

/* ── 41. PRINT ───────────────────────────────────────────── */
@media print {
  .app-menu,.navbar-menu,#page-topbar,.footer,#back-to-top,.mis-toast-container{display:none!important}
  .main-content{margin-left:0!important}
  .page-content{padding:0!important}
  .card,.icd-card,.icd-table-wrapper{box-shadow:none!important;border:1px solid #ddd!important}
  body{background:#fff!important;color:#000!important}
}

/* ── 42. INVESTIGATION CASE HERO + STATUS TIMELINE ───────── */
.inv-hero{background:var(--icd-card-bg,#fff);border:1px solid var(--icd-border);border-radius:var(--icd-radius-lg,12px);box-shadow:var(--icd-shadow-card);padding:1.5rem 1.6rem;margin-bottom:1.5rem}
.inv-hero-main{display:flex;align-items:flex-start;gap:1.1rem}
.inv-hero-icon{flex:0 0 auto;width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:1.6rem;color:#fff;background:var(--icd-gradient-primary,linear-gradient(135deg,#6366F1,#4F46E5));box-shadow:0 8px 18px -6px rgba(79,70,229,.5)}
.inv-hero-info{flex:1 1 auto;min-width:0}
.inv-hero-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.6px;color:var(--icd-text-muted);font-weight:700}
.inv-hero-code{font-size:1.5rem;font-weight:800;letter-spacing:-.01em;margin:.1rem 0 .4rem;color:var(--icd-text);word-break:break-word;line-height:1.15}
.inv-hero-meta{display:flex;flex-wrap:wrap;gap:.3rem 1.1rem;font-size:.8rem;color:var(--icd-text-muted)}
.inv-hero-meta span{display:inline-flex;align-items:center}
.inv-hero-meta i{opacity:.75;margin-right:.3rem;font-size:.95rem}
.inv-status{flex:0 0 auto;display:inline-flex;align-items:center;gap:.5rem;font-size:.8rem;font-weight:600;padding:.4rem .85rem;border-radius:999px;white-space:nowrap;line-height:1}
.inv-status-dot{width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 22%,transparent)}
.inv-status-sm{padding:.22rem .6rem;font-size:.72rem;gap:.35rem}
.inv-status-sm .inv-status-dot{width:6px;height:6px;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 22%,transparent)}
.inv-status-pending{color:#b45309;background:rgba(245,158,11,.13)}
.inv-status-active{color:#047857;background:rgba(16,185,129,.13)}
.inv-status-concluded{color:#0369a1;background:rgba(6,182,212,.14)}
.inv-status-archived,.inv-status-draft{color:#475569;background:rgba(100,116,139,.13)}
.inv-status-default{color:var(--icd-primary);background:var(--icd-primary-light,rgba(79,70,229,.1))}
.inv-hero-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem;margin-top:1.3rem;padding-top:1.3rem;border-top:1px solid var(--icd-border)}
.inv-metric{display:flex;align-items:center;gap:.65rem}
.inv-metric-ic{flex:0 0 auto;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:1.15rem;color:var(--c);background:color-mix(in srgb,var(--c) 13%,transparent)}
.inv-metric strong{display:block;font-size:1.3rem;font-weight:800;line-height:1;color:var(--icd-text)}
.inv-metric small{font-size:.72rem;color:var(--icd-text-muted)}
/* Status timeline (case-status page) */
.cs-timeline{position:relative;padding-left:1.75rem;margin-top:.25rem}
.cs-timeline::before{content:"";position:absolute;left:6px;top:.4rem;bottom:.4rem;width:2px;background:var(--icd-border)}
.cs-tl-item{position:relative;padding:0 0 1.4rem}
.cs-tl-item:last-child{padding-bottom:0}
.cs-tl-dot{position:absolute;left:-1.75rem;top:.2rem;width:14px;height:14px;border-radius:50%;background:currentColor;border:3px solid var(--icd-card-bg,#fff);box-shadow:0 0 0 2px currentColor}
.cs-dot-pending{color:#f59e0b}.cs-dot-active{color:#10b981}.cs-dot-concluded{color:#06b6d4}.cs-dot-archived,.cs-dot-draft{color:#64748b}.cs-dot-default{color:var(--icd-primary)}
.cs-tl-meta{display:flex;flex-wrap:wrap;gap:.25rem 1rem;margin-top:.4rem;font-size:.76rem;color:var(--icd-text-muted)}
.cs-tl-meta i{opacity:.8;margin-right:.25rem}
@media (max-width:640px){.inv-hero-main{flex-wrap:wrap}.inv-status{order:-1}}

/* ── 42. EXTRA COMPATIBILITY ─────────────────────────────── */
.waves-effect,.waves-light{}
.text-body-secondary{color:var(--icd-text-secondary)!important}
.text-body-tertiary{color:var(--icd-text-muted)!important}
.bg-body-secondary{background:var(--icd-secondary-light)!important}
.border-light{border-color:var(--icd-border)!important}
.border-opacity-25{opacity:0.25}
.view-all{text-align:center}
.notification-actions{padding:0.5rem 0.75rem;border-top:1px solid var(--icd-border);font-size:0.8125rem}
.light-dark-mode{cursor:pointer}
.page-title-right{margin-left:auto}
/* Legacy Velzon-era markup compatibility (so older screens render on the ICD system) */
.card-animate{transition:transform var(--icd-t),box-shadow var(--icd-t)}
.card-animate:hover{transform:translateY(-3px);box-shadow:var(--icd-shadow-lg,var(--icd-shadow))}
.counter-value{font-variant-numeric:tabular-nums}
.card-border-primary{border-top:2px solid var(--icd-primary)}
.card-border-success{border-top:2px solid var(--icd-success)}

/* ── 43. ICD TABS (component variant) ───────────────────── */
.icd-tabs{display:flex;gap:0.25rem;border-bottom:2px solid var(--icd-border);flex-wrap:wrap}
.icd-tab{
  background:none;border:none;padding:0.625rem 1rem;font-size:0.875rem;font-weight:500;
  color:var(--icd-text-muted);cursor:pointer;border-bottom:2px solid transparent;
  margin-bottom:-2px;border-radius:var(--icd-radius) var(--icd-radius) 0 0;
  transition:color var(--icd-t),border-color var(--icd-t);white-space:nowrap;
}
.icd-tab:hover{color:var(--icd-text)}
.icd-tab.active{color:var(--icd-primary);border-bottom-color:var(--icd-primary);font-weight:600}
[data-layout-mode="dark"] .icd-tab{color:var(--icd-sidebar-text)}
[data-layout-mode="dark"] .icd-tab.active{color:#818CF8}
[data-layout-mode="dark"] .icd-tabs{border-bottom-color:#334155}

/* ── 44. ICD STEPPER ─────────────────────────────────────── */
.icd-stepper{display:flex;align-items:center;gap:0;margin-bottom:1.5rem}
.icd-stepper-item{display:flex;flex-direction:column;align-items:center;gap:0.25rem;flex:1}
.icd-stepper-num{
  width:2rem;height:2rem;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:0.8125rem;font-weight:600;
  border:2px solid var(--icd-border);
  background:var(--icd-card-bg);color:var(--icd-text-muted);
  transition:all var(--icd-t);
}
.icd-stepper-label{font-size:0.75rem;color:var(--icd-text-muted);font-weight:500;white-space:nowrap}
.icd-stepper-item.active .icd-stepper-num{background:var(--icd-primary);border-color:var(--icd-primary);color:#fff}
.icd-stepper-item.active .icd-stepper-label{color:var(--icd-primary)}
.icd-stepper-item.done .icd-stepper-num{background:var(--icd-success);border-color:var(--icd-success);color:#fff}
.icd-stepper-item.done .icd-stepper-label{color:var(--icd-success)}
.icd-stepper-line{flex:1;height:2px;background:var(--icd-border);margin:0 0.5rem;margin-bottom:1.25rem;transition:background var(--icd-t)}

/* ── 44. ICD PROGRESS BAR ────────────────────────────────── */
.icd-progress{
  display:flex;height:6px;border-radius:var(--icd-radius-full);
  overflow:hidden;background:var(--icd-secondary-light);gap:1px;
  margin-top:0.75rem;
}
.icd-progress-bar{height:100%;transition:width 0.4s ease}

/* ── 46. AUTH PAGE ───────────────────────────────────────── */
.auth-root{
  min-height:100vh;display:flex;align-items:stretch;
  background:var(--icd-body-bg);
}
.auth-brand{
  flex:0 0 42%;display:flex;flex-direction:column;justify-content:center;
  padding:3rem 3.5rem;
  background:linear-gradient(145deg,var(--icd-primary) 0%,#3730A3 60%,#1E1B4B 100%);
  position:relative;overflow:hidden;
}
.auth-brand::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 20% 80%,rgba(139,92,246,0.3) 0%,transparent 60%),
             radial-gradient(ellipse at 80% 20%,rgba(6,182,212,0.2) 0%,transparent 50%);
}
.auth-brand::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,0.06) 1px,transparent 1.5px);
  background-size:22px 22px;
}
.auth-brand-content{position:relative;z-index:1;color:#fff}
.auth-brand-logo{height:52px;width:auto;margin-bottom:2rem}
.auth-brand-title{font-size:1.75rem;font-weight:700;line-height:1.25;margin-bottom:0.75rem;color:#fff}
.auth-brand-sub{font-size:0.9375rem;color:rgba(255,255,255,0.72);line-height:1.6;margin-bottom:2.5rem}
.auth-feature{display:flex;align-items:flex-start;gap:0.875rem;margin-bottom:1.25rem}
.auth-feature-icon{
  width:2.5rem;height:2.5rem;border-radius:var(--icd-radius-lg);flex-shrink:0;
  background:linear-gradient(135deg,rgba(255,255,255,0.24),rgba(255,255,255,0.08));
  border:1px solid rgba(255,255,255,0.16);box-shadow:0 6px 16px -6px rgba(0,0,0,0.35);
  display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;color:#fff;
}
.auth-feature-text .af-title{font-weight:600;font-size:0.9375rem;color:#fff;margin-bottom:0.125rem}
.auth-feature-text .af-desc{font-size:0.8125rem;color:rgba(255,255,255,0.62)}
.auth-brand-deco{
  position:absolute;bottom:-60px;right:-60px;
  width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,rgba(255,255,255,0.10),rgba(255,255,255,0.02));
  animation:auth-float 9s ease-in-out infinite;
}
.auth-brand-deco::after{
  content:'';position:absolute;top:-140px;left:-180px;
  width:160px;height:160px;border-radius:50%;
  background:radial-gradient(circle at 40% 40%,rgba(139,92,246,0.18),transparent 70%);
  animation:auth-float 11s ease-in-out infinite reverse;
}
@keyframes auth-float{0%,100%{transform:translate(0,0)}50%{transform:translate(-14px,-18px)}}
.auth-form-panel{
  flex:1;display:flex;align-items:center;justify-content:center;
  padding:2rem 1.5rem;
  background:var(--icd-body-bg);
}
.auth-form-box{width:100%;max-width:420px}
.auth-form-logo{
  display:none;text-align:center;margin-bottom:1.5rem;
}
.auth-form-logo img{height:48px;width:auto}
.auth-card{
  background:var(--icd-card-bg);border:1px solid var(--icd-border);
  border-radius:var(--icd-radius-xl);padding:2.25rem;
  box-shadow:0 24px 56px -20px rgba(16,24,40,0.18),0 2px 6px rgba(16,24,40,0.05);
}
.auth-card-title{font-size:1.375rem;font-weight:700;color:var(--icd-text);margin-bottom:0.375rem}
.auth-card-sub{font-size:0.875rem;color:var(--icd-text-muted);margin-bottom:1.75rem}
.auth-divider{display:flex;align-items:center;gap:0.75rem;margin:1.25rem 0}
.auth-divider::before,.auth-divider::after{content:'';flex:1;height:1px;background:var(--icd-border)}
.auth-divider span{font-size:0.75rem;color:var(--icd-text-muted);white-space:nowrap}
.auth-footer{text-align:center;margin-top:1.25rem;font-size:0.8125rem;color:var(--icd-text-muted)}
.auth-pwd-toggle{
  position:absolute;right:0.75rem;top:50%;transform:translateY(-50%);
  background:none;border:none;cursor:pointer;color:var(--icd-text-muted);
  font-size:1rem;padding:0.25rem;display:flex;align-items:center;
  transition:color var(--icd-t);
}
.auth-pwd-toggle:hover{color:var(--icd-text)}
.icd-field-icon{position:relative}
.icd-field-icon .icd-input{padding-right:2.5rem}
@media(max-width:767.98px){
  .auth-brand{display:none}
  .auth-form-logo{display:block}
  .auth-form-panel{padding:1.5rem 1rem}
  .auth-card{padding:1.75rem 1.25rem}
}

/* ── 47. LANDING PAGE ────────────────────────────────────── */
.land-root{min-height:100vh;display:flex;flex-direction:column}

/* top nav */
.land-nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  display:flex;align-items:center;padding:0 2rem;height:70px;
  background:rgba(15,23,42,0.92);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,0.06);
  transition:background var(--icd-t);
}
.land-nav-logo img{height:44px;width:auto}
.land-nav-links{
  display:flex;align-items:center;gap:0.25rem;
  list-style:none;margin:0 0 0 2rem;padding:0;flex:1;
}
.land-nav-link{
  color:rgba(255,255,255,0.72);font-size:0.875rem;font-weight:500;
  padding:0.5rem 0.875rem;border-radius:var(--icd-radius);
  text-decoration:none;transition:all var(--icd-t);white-space:nowrap;
}
.land-nav-link:hover,.land-nav-link.active{color:#fff;background:rgba(255,255,255,0.08)}
.land-nav-actions{display:flex;align-items:center;gap:0.625rem;flex-shrink:0;margin-left:auto}
.land-nav-toggle{
  display:none;background:none;border:none;cursor:pointer;
  color:#fff;font-size:1.5rem;padding:0.25rem;line-height:1;
}

/* mobile nav drawer */
.land-nav-drawer{
  display:none;position:fixed;top:70px;left:0;right:0;z-index:999;
  background:rgba(15,23,42,0.97);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  padding:1rem;border-bottom:1px solid rgba(255,255,255,0.06);
  flex-direction:column;gap:0.25rem;
}
.land-nav-drawer.open{display:flex}
.land-nav-drawer .land-nav-link{display:block;padding:0.75rem 1rem;border-radius:var(--icd-radius)}
.land-nav-drawer-actions{display:flex;gap:0.5rem;padding:0.5rem 0;flex-wrap:wrap}
@media(max-width:991.98px){
  .land-nav-links,.land-nav-actions{display:none}
  .land-nav-toggle{display:flex;align-items:center}
}

/* hero */
.land-hero{
  padding:calc(70px + 5rem) 0 5rem;
  background:linear-gradient(135deg,#0F172A 0%,#1E1B4B 50%,#0F172A 100%);
  position:relative;overflow:hidden;text-align:center;
}
.land-hero::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 30% 50%,rgba(79,70,229,0.25) 0%,transparent 60%),
             radial-gradient(ellipse at 70% 30%,rgba(6,182,212,0.15) 0%,transparent 50%);
}
.land-hero-content{position:relative;z-index:1;max-width:760px;margin:0 auto;padding:0 1.5rem}
.land-hero-badge{
  display:inline-flex;align-items:center;gap:0.5rem;
  background:rgba(79,70,229,0.2);border:1px solid rgba(79,70,229,0.35);
  color:var(--icd-primary-subtle);padding:0.375rem 1rem;border-radius:var(--icd-radius-full);
  font-size:0.8125rem;font-weight:500;margin-bottom:1.75rem;
}
.land-hero-title{
  font-size:clamp(2rem,5vw,3.25rem);font-weight:800;line-height:1.15;
  color:#fff;margin-bottom:1.25rem;
}
.land-hero-title span{
  background:linear-gradient(135deg,var(--icd-primary-subtle),#67E8F9);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.land-hero-desc{
  font-size:1.0625rem;color:rgba(255,255,255,0.65);line-height:1.7;
  margin-bottom:2.5rem;max-width:600px;margin-left:auto;margin-right:auto;
}
.land-hero-actions{display:flex;gap:0.875rem;justify-content:center;flex-wrap:wrap}
.land-hero-stats{
  display:flex;gap:2.5rem;justify-content:center;flex-wrap:wrap;
  margin-top:3.5rem;padding-top:2.5rem;
  border-top:1px solid rgba(255,255,255,0.08);
}
.land-stat-num{font-size:1.875rem;font-weight:800;color:#fff;line-height:1}
.land-stat-label{font-size:0.8125rem;color:rgba(255,255,255,0.5);margin-top:0.25rem}

/* features */
.land-features{padding:5rem 0;background:var(--icd-body-bg)}
.land-section-label{
  text-align:center;font-size:0.8125rem;font-weight:600;letter-spacing:0.08em;
  text-transform:uppercase;color:var(--icd-primary);margin-bottom:0.75rem;
}
.land-section-title{text-align:center;font-size:clamp(1.5rem,3vw,2rem);font-weight:700;color:var(--icd-text);margin-bottom:0.75rem}
.land-section-desc{text-align:center;color:var(--icd-text-muted);max-width:520px;margin:0 auto 3rem;line-height:1.6}
.land-feature-card{
  padding:1.75rem;background:var(--icd-card-bg);border:1px solid var(--icd-border);
  border-radius:var(--icd-radius-xl);height:100%;
  transition:transform var(--icd-t),box-shadow var(--icd-t),border-color var(--icd-t);
}
.land-feature-card:hover{transform:translateY(-4px);box-shadow:var(--icd-shadow-md);border-color:var(--icd-border-focus)}
.land-feature-icon{
  width:3rem;height:3rem;border-radius:var(--icd-radius-lg);
  display:flex;align-items:center;justify-content:center;font-size:1.375rem;
  margin-bottom:1.25rem;
}
.land-feature-title{font-size:1.0625rem;font-weight:700;color:var(--icd-text);margin-bottom:0.5rem}
.land-feature-desc{font-size:0.875rem;color:var(--icd-text-muted);line-height:1.65}

/* surveys section */
.land-surveys{
  padding:4rem 0;
  background:linear-gradient(135deg,#0F172A 0%,#1E1B4B 100%);
}
.land-survey-card{
  background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);
  border-radius:var(--icd-radius-xl);padding:1.5rem;text-align:center;
  transition:all var(--icd-t);cursor:pointer;
}
.land-survey-card:hover{background:rgba(255,255,255,0.09);border-color:rgba(255,255,255,0.2);transform:translateY(-2px)}
.land-survey-icon{width:3.5rem;height:3.5rem;margin:0 auto 1rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.6rem;background:rgba(255,255,255,0.08);color:#fff}
.land-survey-title{font-size:1rem;font-weight:600;color:#fff;margin-bottom:0.375rem}
.land-survey-desc{font-size:0.8125rem;color:rgba(255,255,255,0.55)}

/* footer */
.land-footer{
  background:#0F172A;padding:3.5rem 0 2rem;
  border-top:1px solid rgba(255,255,255,0.06);
}
.land-footer-logo{height:40px;width:auto;margin-bottom:1rem;opacity:0.85}
.land-footer-desc{font-size:0.875rem;color:rgba(255,255,255,0.45);line-height:1.65;max-width:280px}
.land-footer-heading{font-size:0.8125rem;font-weight:600;color:rgba(255,255,255,0.7);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:1rem}
.land-footer-list{list-style:none;padding:0;margin:0}
.land-footer-list li{margin-bottom:0.5rem}
.land-footer-list a{font-size:0.875rem;color:rgba(255,255,255,0.45);text-decoration:none;transition:color var(--icd-t)}
.land-footer-list a:hover{color:rgba(255,255,255,0.85)}
.land-footer-bottom{
  padding-top:2rem;margin-top:2rem;
  border-top:1px solid rgba(255,255,255,0.06);
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0.75rem;
}
.land-footer-copy{font-size:0.8125rem;color:rgba(255,255,255,0.35)}
.land-social{display:flex;gap:0.625rem}
.land-social a{
  width:2rem;height:2rem;border-radius:50%;
  background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.1);
  display:flex;align-items:center;justify-content:center;
  color:rgba(255,255,255,0.5);font-size:0.875rem;
  text-decoration:none;transition:all var(--icd-t);
}
.land-social a:hover{background:var(--icd-primary);border-color:var(--icd-primary);color:#fff}

/* ================= ML risk intelligence pages (/ml, /ml/admin) ================= */
.icd-stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;margin-bottom:1rem}
.icd-stat{background:var(--icd-card-bg);border:1px solid var(--icd-border);border-radius:var(--icd-radius-lg);
  box-shadow:var(--icd-shadow-card);padding:1rem 1.15rem}
.icd-stat-label{font-size:.75rem;font-weight:600;color:var(--icd-text-muted);text-transform:uppercase;
  letter-spacing:.03em;display:flex;align-items:center;gap:.4rem}
.icd-stat-label i{color:var(--icd-primary)}
.icd-stat-value{font-size:1.6rem;font-weight:700;color:var(--icd-text);margin:.35rem 0 .15rem;line-height:1.1}
.icd-stat-sub{font-size:.78rem;color:var(--icd-text-muted)}

/* Prediction result */
.icd-pred{display:flex;flex-direction:column;gap:.6rem}
.icd-pred-band{display:flex;align-items:baseline;justify-content:space-between;padding:.6rem .9rem;border-radius:var(--icd-radius-lg)}
.icd-pred-band-label{font-weight:600}
.icd-pred-band-prob{font-size:1.5rem;font-weight:800}
.icd-pred-low{background:var(--icd-success-light);color:#047857}
.icd-pred-med{background:var(--icd-warning-light);color:#B45309}
.icd-pred-high{background:var(--icd-danger-light);color:#B91C1C}
.icd-pred-meter{height:10px;border-radius:999px;background:var(--icd-border);overflow:hidden}
.icd-pred-meter-fill{height:100%;border-radius:999px}
.icd-pred-meter-fill.icd-pred-low{background:var(--icd-success)}
.icd-pred-meter-fill.icd-pred-med{background:var(--icd-warning)}
.icd-pred-meter-fill.icd-pred-high{background:var(--icd-danger)}
.icd-pred-note{font-size:.82rem;color:var(--icd-text-secondary)}
.icd-pred-note code{background:rgba(var(--icd-primary-rgb),.08);padding:.02rem .32rem;border-radius:5px}

/* Job + audit lists */
.icd-joblist,.icd-auditlist,.icd-driftlist{display:flex;flex-direction:column;gap:.5rem}
.icd-jobrow,.icd-auditrow{display:flex;align-items:flex-start;gap:.6rem}
.icd-jobrow-main,.icd-auditrow-main{min-width:0}
.icd-jobrow-msg,.icd-auditrow-detail{font-size:.85rem;color:var(--icd-text);line-height:1.3}
.icd-jobrow-meta,.icd-auditrow-meta{font-size:.74rem;color:var(--icd-text-muted);margin-top:.1rem;display:flex;gap:.35rem;flex-wrap:wrap}

/* Live training progress */
.icd-progress-phase{font-size:.95rem;color:var(--icd-text);display:flex;align-items:center;margin-bottom:.5rem}
.icd-progress-log{max-height:200px;overflow-y:auto;border-top:1px dashed var(--icd-border);padding-top:.5rem;display:flex;flex-direction:column;gap:.25rem}
.icd-progress-line{font-size:.78rem;color:var(--icd-text-secondary);display:flex;gap:.5rem;align-items:baseline}
.icd-progress-time{color:var(--icd-text-muted);font-variant-numeric:tabular-nums}
.icd-progress-tag{font-weight:600;color:var(--icd-primary);min-width:110px}

/* Drift meters — severity-tiered (Stable / Watch / Drift) with a threshold marker */
.icd-drift-head{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem .6rem;margin-bottom:.4rem}
.icd-drift-summary{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem;font-size:.78rem;color:var(--icd-text-muted)}
.icd-drift-summary strong{color:var(--icd-text);font-variant-numeric:tabular-nums}
.icd-drift-legend{display:flex;flex-wrap:wrap;gap:.9rem;margin:0 0 .7rem;font-size:.72rem;color:var(--icd-text-muted)}
.icd-drift-legend-item{display:inline-flex;align-items:center;gap:.32rem}
.icd-drift-legend-item .dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.icd-drift-legend-item .dot.tier-stable{background:var(--icd-success)}
.icd-drift-legend-item .dot.tier-watch{background:var(--icd-warning)}
.icd-drift-legend-item .dot.tier-drift{background:var(--icd-danger)}
.icd-driftrow{display:flex;align-items:center;gap:.6rem}
.icd-drift-name{font-size:.8rem;color:var(--icd-text);width:150px;min-width:150px;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.icd-drift-meter{position:relative;flex:1;height:9px;border-radius:999px;background:var(--icd-border)}
.icd-drift-fill{position:relative;z-index:1;height:100%;border-radius:999px;transition:width .3s ease}
.icd-drift-fill.tier-stable{background:var(--icd-success)}
.icd-drift-fill.tier-watch{background:var(--icd-warning)}
.icd-drift-fill.tier-drift{background:var(--icd-danger)}
.icd-drift-tick{position:absolute;top:-2px;bottom:-2px;z-index:2;width:2px;border-radius:2px;background:var(--icd-text);opacity:.4}
.icd-drift-psi{font-size:.78rem;color:var(--icd-text-secondary);width:52px;text-align:right;font-variant-numeric:tabular-nums}
.icd-drift-chip{font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:.08rem .42rem;border-radius:999px;min-width:54px;text-align:center}
.icd-drift-chip.tier-stable{background:var(--icd-success-light);color:#047857}
.icd-drift-chip.tier-watch{background:var(--icd-warning-light);color:#B45309}
.icd-drift-chip.tier-drift{background:var(--icd-danger-light);color:#B91C1C}

/* Audit timeline — expandable detail (keeps raw exceptions out of the flow) */
.icd-auditrow-detail{white-space:pre-wrap;word-break:break-word}
.icd-auditrow-detail.is-clip{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.icd-auditrow-full{margin-top:.3rem;max-height:220px;overflow:auto;background:rgba(var(--icd-primary-rgb),.04);border:1px solid var(--icd-border);border-radius:8px;padding:.5rem .6rem;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.72rem;line-height:1.4;color:var(--icd-text-secondary);white-space:pre-wrap;word-break:break-word}
.icd-linkbtn{background:none;border:none;color:var(--icd-primary);font-size:.74rem;font-weight:600;padding:.15rem 0;cursor:pointer}
.icd-linkbtn:hover{text-decoration:underline}
.icd-empty-sm{display:flex;align-items:center;gap:.5rem;color:var(--icd-text-muted);font-size:.85rem;padding:.5rem 0}
.icd-empty-sm i{font-size:1.15rem;opacity:.7}

/* ===================== Tasks (HoD ↔ inspector workflow) ===================== */
/* Toolbar: scope segments + status filter */
.icd-task-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.icd-seg{display:inline-flex;background:var(--icd-bg,#f1f5f9);border:1px solid var(--icd-border);border-radius:999px;padding:3px}
.icd-seg-btn{border:none;background:transparent;padding:.35rem .9rem;border-radius:999px;font-size:.82rem;font-weight:600;color:var(--icd-text-muted);cursor:pointer;transition:all .12s}
.icd-seg-btn.active{background:var(--icd-primary);color:#fff;box-shadow:var(--icd-shadow-primary-sm)}
.icd-task-statusfilter{width:auto;min-width:170px}

/* List table */
.icd-task-table td,.icd-task-table th{padding:.6rem .75rem}
.icd-task-row{cursor:pointer;transition:background .1s}
.icd-task-row:hover{background:rgba(var(--icd-primary-rgb),.05)}

/* Detail header */
.icd-task-title{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.icd-task-title h4{margin:0;font-weight:700;color:var(--icd-text)}
.icd-task-badges{display:flex;gap:.4rem;flex-shrink:0}
.icd-task-desc{margin:.6rem 0 0;color:var(--icd-text-secondary);white-space:pre-wrap}
.icd-task-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem;margin:1rem 0;padding:.85rem 0;border-top:1px solid var(--icd-border);border-bottom:1px solid var(--icd-border)}
.icd-task-meta>div{display:flex;flex-direction:column;gap:.1rem}
.icd-task-meta span{font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:var(--icd-text-muted)}
.icd-task-meta strong{font-size:.9rem;color:var(--icd-text)}
.icd-task-actions{display:flex;flex-wrap:wrap;gap:.5rem}

/* Score result */
.icd-score-head{display:flex;align-items:baseline;justify-content:space-between;padding:.7rem 1rem;border-radius:var(--icd-radius-lg);margin-bottom:.9rem}
.icd-score-marks{font-size:1.9rem;font-weight:800;line-height:1}
.icd-score-marks span{font-size:1rem;font-weight:600;opacity:.6}
.icd-score-pct{font-size:.95rem}
.icd-grade-exc{background:var(--icd-success-light);color:#047857}
.icd-grade-good{background:#eff6ff;color:#1d4ed8}
.icd-grade-sat{background:var(--icd-warning-light);color:#b45309}
.icd-grade-needs{background:#fff7ed;color:#c2410c}
.icd-grade-poor{background:var(--icd-danger-light);color:#b91c1c}

/* Criteria list */
.icd-crit-list{display:flex;flex-direction:column;gap:.55rem}
.icd-crit{display:flex;align-items:center;gap:.75rem}
.icd-crit-name{flex:0 0 40%;font-size:.86rem;color:var(--icd-text);display:flex;align-items:center;gap:.4rem}
.icd-crit-auto{font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--icd-info);background:var(--icd-info-light);padding:.05rem .35rem;border-radius:5px}
.icd-crit-bar{flex:1;height:8px;border-radius:999px;background:var(--icd-border);overflow:hidden}
.icd-crit-fill{height:100%;border-radius:999px;background:var(--icd-primary)}
.icd-crit-mark{flex:0 0 auto;font-size:.82rem;font-variant-numeric:tabular-nums;color:var(--icd-text);min-width:64px;text-align:right}
.icd-crit-comment{font-size:.76rem;color:var(--icd-text-muted);margin:-.2rem 0 .2rem calc(40% + .75rem);font-style:italic}

/* Timeline */
.icd-timeline{display:flex;flex-direction:column}
.icd-tl-item{display:flex;gap:.7rem;padding-bottom:1rem;position:relative}
.icd-tl-item:not(:last-child)::before{content:"";position:absolute;left:13px;top:28px;bottom:0;width:2px;background:var(--icd-border)}
.icd-tl-dot{flex:0 0 28px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.8rem;z-index:1}
.icd-tl-created{background:var(--icd-text-muted)}.icd-tl-started{background:var(--icd-info)}
.icd-tl-submitted{background:var(--icd-warning)}.icd-tl-changes{background:var(--icd-danger)}
.icd-tl-completed{background:var(--icd-success)}.icd-tl-cancelled{background:#64748b}.icd-tl-comment{background:var(--icd-primary)}
.icd-tl-body{flex:1;min-width:0}
.icd-tl-head{display:flex;justify-content:space-between;gap:.5rem;align-items:baseline}
.icd-tl-head strong{font-size:.85rem;color:var(--icd-text)}
.icd-tl-time{font-size:.72rem;color:var(--icd-text-muted);white-space:nowrap}
.icd-tl-by{font-size:.74rem;color:var(--icd-text-muted)}
.icd-tl-comment{font-size:.82rem;color:var(--icd-text-secondary);background:var(--icd-bg,#f8fafc);border-radius:8px;padding:.4rem .6rem;margin-top:.3rem}

/* Overlay modal (create / prompt / score) */
.icd-ov{position:fixed;inset:0;background:rgba(15,23,42,.45);display:flex;align-items:center;justify-content:center;z-index:1050;padding:1rem}
.icd-ov-panel{background:var(--icd-card-bg);border-radius:var(--icd-radius-lg);box-shadow:var(--icd-shadow-lg);width:100%;max-width:480px;max-height:92vh;display:flex;flex-direction:column;overflow:hidden}
.icd-ov-lg{max-width:640px}
.icd-ov-head{display:flex;align-items:center;justify-content:space-between;padding:.9rem 1.1rem;border-bottom:1px solid var(--icd-border)}
.icd-ov-head h5{margin:0;font-weight:700;font-size:1rem}
.icd-ov-x{border:none;background:transparent;font-size:1.2rem;color:var(--icd-text-muted);cursor:pointer;line-height:1}
.icd-ov-body{padding:1.1rem;overflow-y:auto}
.icd-ov-foot{display:flex;justify-content:flex-end;gap:.5rem;padding:.85rem 1.1rem;border-top:1px solid var(--icd-border)}

/* Create form + rubric editor */
.icd-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}
.icd-fc{display:flex;flex-direction:column;gap:.25rem}
.icd-fc.icd-col-2{grid-column:1 / -1}
.icd-fc label{font-size:.78rem;font-weight:600;color:var(--icd-text-secondary)}
.icd-rubric{margin-top:1rem;border-top:1px dashed var(--icd-border);padding-top:.85rem}
.icd-rubric-head{display:flex;align-items:center;justify-content:space-between;font-weight:600;font-size:.88rem;margin-bottom:.5rem}
.icd-rubric-rows{display:flex;flex-direction:column;gap:.4rem}
.icd-rubric-row{display:flex;gap:.4rem;align-items:center}
.icd-rubric-max{max-width:80px}
.icd-rubric-scoring{max-width:170px}
.icd-rubric-del{border:none;background:transparent;color:var(--icd-danger);cursor:pointer;font-size:1rem}
.icd-rubric-note{font-size:.74rem;color:var(--icd-text-muted);margin:.6rem 0 0}

/* Score modal */
.icd-score-form{display:flex;flex-direction:column;gap:.5rem}
.icd-score-row{display:flex;align-items:center;gap:.6rem}
.icd-score-cname{flex:1;font-size:.86rem;color:var(--icd-text);display:flex;align-items:center;gap:.4rem}
.icd-score-input{max-width:90px;text-align:right}
.icd-score-auto{font-size:.78rem;color:var(--icd-info);font-style:italic}
.icd-score-cmax{font-size:.82rem;color:var(--icd-text-muted);min-width:44px}
.icd-score-total{margin-top:.75rem;padding-top:.6rem;border-top:1px solid var(--icd-border);font-size:.84rem;color:var(--icd-text-secondary)}
/* Task performance score bars (graded colours) */
.icd-crit-fill.icd-perf-exc{background:var(--icd-success)}
.icd-crit-fill.icd-perf-good{background:#3b82f6}
.icd-crit-fill.icd-perf-sat{background:var(--icd-warning)}
.icd-crit-fill.icd-perf-needs{background:#f97316}
.icd-crit-fill.icd-perf-poor{background:var(--icd-danger)}
/* Monthly score trend (mini column chart) */
.icd-trend{display:flex;align-items:flex-end;gap:.5rem;overflow-x:auto;padding-top:.4rem}
.icd-trend-col{display:flex;flex-direction:column;align-items:center;gap:.3rem;min-width:42px;flex:1}
.icd-trend-val{font-size:.72rem;font-weight:700;color:var(--icd-text);font-variant-numeric:tabular-nums}
.icd-trend-bar-wrap{height:120px;width:26px;display:flex;align-items:flex-end;background:var(--icd-bg,#f1f5f9);border-radius:6px;overflow:hidden}
.icd-trend-bar{width:100%;border-radius:6px 6px 0 0;min-height:3px}
.icd-trend-bar.icd-perf-exc{background:var(--icd-success)}
.icd-trend-bar.icd-perf-good{background:#3b82f6}
.icd-trend-bar.icd-perf-sat{background:var(--icd-warning)}
.icd-trend-bar.icd-perf-needs{background:#f97316}
.icd-trend-bar.icd-perf-poor{background:var(--icd-danger)}
.icd-trend-label{font-size:.68rem;color:var(--icd-text-muted);white-space:nowrap}

/* ===================== Report components (shared ICD styling) ===================== */
/* Section header row (title + controls) */
.icd-rhead{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;margin-bottom:1rem}
.icd-rhead-title{display:inline-flex;align-items:center;gap:.5rem;margin:0;font-size:.95rem;font-weight:700;color:var(--icd-text)}
.icd-rhead-title i{color:var(--icd-primary)}
/* Card grid */
.icd-rgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:1rem}
.icd-rcard{display:flex;flex-direction:column;background:var(--icd-card-bg,#fff);border:1px solid var(--icd-border);border-radius:var(--icd-radius-lg);overflow:hidden;transition:box-shadow .15s ease,transform .15s ease}
.icd-rcard:hover{transform:translateY(-2px);box-shadow:var(--icd-shadow-card-hover,0 10px 28px rgba(0,0,0,.10))}
.icd-rcard-head{display:flex;align-items:center;gap:.6rem;padding:.8rem 1rem;border-left:4px solid var(--rc,#64748b);border-bottom:1px solid var(--icd-border)}
.icd-rcard-ico{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-size:1.05rem;color:var(--rc,#64748b);background:color-mix(in srgb,var(--rc,#64748b) 13%,transparent);flex:0 0 auto}
.icd-rcard-title{margin:0;font-weight:600;font-size:.9rem;color:var(--icd-text);line-height:1.2;flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.icd-rcard-act{margin-left:auto;background:none;border:none;color:var(--icd-text-muted);cursor:pointer;font-size:1.15rem;flex:0 0 auto;line-height:1;padding:0}
.icd-rcard-act:hover{color:var(--rc,var(--icd-primary))}
.icd-rcard-body{padding:1rem;display:flex;flex-direction:column;gap:.85rem;flex:1 1 auto}
/* metric row */
.icd-rmetrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(64px,1fr));gap:.7rem}
.icd-rmetric{display:flex;flex-direction:column;gap:.15rem}
.icd-rmetric-v{font-size:1.02rem;font-weight:700;color:var(--icd-text);line-height:1;font-variant-numeric:tabular-nums}
.icd-rmetric-k{font-size:.7rem;color:var(--icd-text-muted)}
/* highlighted number block */
.icd-rbig{text-align:center;padding:1rem;border-radius:10px;background:color-mix(in srgb,var(--rc,var(--icd-primary)) 8%,transparent)}
.icd-rbig-v{font-size:1.9rem;font-weight:800;line-height:1;color:var(--rc,var(--icd-text))}
.icd-rbig-k{font-size:.74rem;color:var(--icd-text-muted);margin-top:.35rem}
/* meter */
.icd-meter{height:8px;border-radius:999px;background:var(--icd-border);overflow:hidden}
.icd-meter-fill{height:100%;border-radius:999px;background:var(--rc,var(--icd-primary));transition:width .3s ease}
.icd-meter-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.35rem;font-size:.78rem;color:var(--icd-text-muted)}
.icd-meter-head strong{color:var(--rc,var(--icd-text));font-variant-numeric:tabular-nums}
/* perf/status tiers set --rc (semantic, reserved) */
.rc-exc{--rc:var(--perf-high)}
.rc-good{--rc:var(--perf-mid)}
.rc-avg{--rc:var(--perf-low)}
.rc-poor{--rc:var(--perf-low)}
.rc-info{--rc:var(--icd-info)}
.rc-primary{--rc:var(--icd-primary)}
.rc-success{--rc:var(--icd-success)}
.rc-warning{--rc:var(--icd-warning)}
.rc-danger{--rc:var(--icd-danger)}
.rc-secondary{--rc:#64748b}
/* KPI summary tiles */
.icd-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem;margin-top:1rem}
.icd-kpi{padding:1rem;border-radius:var(--icd-radius-lg);border:1px solid var(--icd-border);background:var(--icd-card-bg,#fff);text-align:center}
.icd-kpi-v{font-size:1.6rem;font-weight:800;color:var(--rc,var(--icd-primary));line-height:1;font-variant-numeric:tabular-nums}
.icd-kpi-k{font-size:.76rem;color:var(--icd-text-muted);margin-top:.35rem}
/* report table */
.icd-rtable{width:100%;border-collapse:separate;border-spacing:0}
.icd-rtable thead th{font-size:.72rem;text-transform:uppercase;letter-spacing:.03em;color:var(--icd-text-muted);font-weight:700;padding:.6rem .75rem;border-bottom:1px solid var(--icd-border);background:rgba(var(--icd-primary-rgb),.04);white-space:nowrap}
.icd-rtable tbody td{padding:.55rem .75rem;border-bottom:1px solid var(--icd-border);font-size:.85rem;color:var(--icd-text);vertical-align:middle}
.icd-rtable tbody tr:hover{background:rgba(var(--icd-primary-rgb),.03)}
.icd-rtable .srt{cursor:pointer;-webkit-user-select:none;user-select:none}
.icd-rtable .srt:hover{color:var(--icd-primary)}
.icd-rtable .rc-row{border-left:3px solid var(--rc,transparent)}

/* ── ICDCollapseSection: native animated accordion for template sections (no Bootstrap JS) ── */
.icd-cs{--icd-cs-accent:var(--icd-primary);border:1px solid var(--icd-border);border-radius:14px;background:var(--icd-card-bg);margin-bottom:.85rem;overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease}
.icd-cs.open{border-color:rgba(var(--icd-primary-rgb),.35);box-shadow:0 1px 3px rgba(15,23,42,.05)}
.icd-cs-head{display:flex;align-items:center;gap:.8rem;width:100%;text-align:left;padding:.9rem 1.05rem;background:transparent;border:0;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .15s ease}
.icd-cs-head:hover{background:rgba(var(--icd-primary-rgb),.035)}
.icd-cs-head:focus-visible{outline:2px solid var(--icd-cs-accent);outline-offset:-2px}
.icd-cs-num,.icd-cs-ico{flex-shrink:0;width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.95rem;background:color-mix(in srgb,var(--icd-cs-accent) 12%,transparent);color:var(--icd-cs-accent)}
.icd-cs-titles{display:flex;flex-direction:column;min-width:0;flex:1}
.icd-cs-title{font-weight:650;font-size:.96rem;color:var(--icd-text);line-height:1.25}
.icd-cs-sub{font-size:.78rem;color:var(--icd-text-muted);margin-top:.1rem}
.icd-cs-meta{flex-shrink:0;display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--icd-text-muted);cursor:default}
.icd-cs-chev{flex-shrink:0;font-size:1.35rem;color:var(--icd-text-muted);transition:transform .28s cubic-bezier(.4,0,.2,1)}
.icd-cs.open>.icd-cs-head .icd-cs-chev{transform:rotate(180deg);color:var(--icd-cs-accent)}
.icd-cs-outer{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1)}
.icd-cs.open>.icd-cs-outer{grid-template-rows:1fr}
.icd-cs-inner{overflow:hidden;min-height:0}
.icd-cs-body{padding:.25rem 1.05rem 1.05rem}
/* Nested subsection variant — lighter chrome, indented, thin accent rail */
.icd-cs-nested{border:0;border-left:2px solid color-mix(in srgb,var(--icd-cs-accent) 40%,transparent);border-radius:0;background:transparent;margin:.35rem 0 .35rem .35rem;box-shadow:none}
.icd-cs-nested.open{box-shadow:none;border-color:var(--icd-cs-accent)}
.icd-cs-nested>.icd-cs-head{padding:.6rem .85rem}
.icd-cs-nested .icd-cs-num,.icd-cs-nested .icd-cs-ico{width:26px;height:26px;font-size:.8rem;border-radius:7px}
.icd-cs-nested .icd-cs-title{font-size:.88rem;font-weight:600}
.icd-cs-nested .icd-cs-body{padding:.15rem .85rem .6rem}
/* Expand/Collapse-all toolbar helper */
.icd-cs-tools{display:flex;align-items:center;gap:.4rem;margin-bottom:.75rem}
@media (prefers-reduced-motion:reduce){.icd-cs-outer,.icd-cs-chev{transition:none}}
