/* ============================================================
   CaseLens Design System
   iOS Human Interface Guidelines — PHP/Twig edition
   ============================================================ */

/* ── Design tokens ─────────────────────────────────────────── */
:root {
  --bg:        #F2F2F7;
  --card:      #FFFFFF;
  --fill:      rgba(120,120,128,0.16);
  --fill2:     rgba(120,120,128,0.12);
  --sep:       rgba(60,60,67,0.18);
  --label:     #000000;
  --label2:    rgba(60,60,67,0.60);
  --label3:    rgba(60,60,67,0.38);
  --label4:    rgba(60,60,67,0.18);

  --navy:      #0B1825;
  --navy-mid:  #122236;
  --navy-soft: #1C3554;
  --gold:      #C4992A;
  --gold-lt:   rgba(196,153,42,0.14);

  --green:     #1DB954;
  --green-bg:  rgba(29,185,84,0.12);
  --red:       #FF3B30;
  --red-bg:    rgba(255,59,48,0.12);
  --orange:    #FF9500;
  --orange-bg: rgba(255,149,0,0.12);
  --blue:      #0A84FF;
  --blue-bg:   rgba(10,132,255,0.12);
  --purple:    #BF5AF2;
  --purple-bg: rgba(191,90,242,0.12);

  --sh-xs:  0 1px 3px rgba(0,0,0,0.05);
  --sh-sm:  0 1px 2px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.06);
  --sh-md:  0 2px 8px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.09);
  --sh-lg:  0 8px 32px rgba(0,0,0,0.12), 0 2px 8px rgba(0,0,0,0.05);

  --r-xs:  6px; --r-sm: 10px; --r: 14px; --r-lg: 16px; --r-xl: 22px; --pill: 9999px;

  --spring:   cubic-bezier(0.34,1.4,0.64,1);
  --ease-out: cubic-bezier(0.22,1,0.36,1);
  --dur:      220ms; --dur-fast: 140ms;

  --sidebar-w:    260px;
  --sidebar-icon: 68px;
  --navbar-h:     54px;
}

/* ── Reset ─────────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { -webkit-text-size-adjust:100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  background: var(--bg); color: var(--label);
  height:100vh; height:100dvh;
  display:flex; overflow:hidden;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; text-decoration: none; }
a, button, [onclick] { -webkit-tap-highlight-color: transparent; }
button, [onclick] { -webkit-user-select:none; user-select:none; touch-action:manipulation; }
:focus-visible { outline:3px solid rgba(196,153,42,.55); outline-offset:2px; border-radius:4px; }
button:focus-visible { outline:3px solid rgba(196,153,42,.55); }

/* ── Animations ────────────────────────────────────────────── */
@keyframes viewIn   { from{opacity:0;transform:translateY(8px) scale(.99)} to{opacity:1;transform:none} }
@keyframes pulse    { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.28;transform:scale(.85)} }
@keyframes spin     { to{transform:rotate(360deg)} }
@keyframes glow     { 0%,100%{box-shadow:0 0 0 0 rgba(196,153,42,.25)} 50%{box-shadow:0 0 0 5px transparent} }
@keyframes ring-glow{
  0%,100%{box-shadow:0 4px 18px rgba(11,24,37,.4),0 0 0 2.5px rgba(196,153,42,.5)}
  50%     {box-shadow:0 6px 22px rgba(11,24,37,.5),0 0 0 4px rgba(196,153,42,.35)}
}
@keyframes fadeIn   { from{opacity:0} to{opacity:1} }
@keyframes slideUp  { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:none} }

/* ── Layout shell ──────────────────────────────────────────── */
.sidebar {
  width:var(--sidebar-w);
  background:linear-gradient(175deg,#09141E 0%,#0B1825 50%,#0D1E30 100%);
  height:100dvh; display:flex; flex-direction:column;
  flex-shrink:0; border-right:1px solid rgba(255,255,255,.04);
  transition:width var(--dur) var(--ease-out);
  position:relative; z-index:20; overflow:hidden;
}
.sidebar>*{position:relative;z-index:1;}

.main-wrap { flex:1; display:flex; flex-direction:column; min-width:0; height:100dvh; }

/* ── Sidebar internals ─────────────────────────────────────── */
.sidebar-logo {
  padding:22px 16px 16px; display:flex; align-items:center; gap:11px;
  border-bottom:1px solid rgba(255,255,255,.06); flex-shrink:0;
}
.logo-mark {
  width:34px; height:34px; border-radius:9px; flex-shrink:0;
  background:linear-gradient(135deg,#D4AD50,var(--gold));
  display:flex; align-items:center; justify-content:center;
  font-size:15px; color:var(--navy);
  box-shadow:0 2px 10px rgba(196,153,42,.38);
}
.logo-text { font-size:18px; font-weight:700; color:#fff; letter-spacing:-.03em; white-space:nowrap; }
.logo-text b { color:var(--gold); }

.sidebar-nav {
  flex:1; padding:10px; overflow-y:auto; overflow-x:hidden; scrollbar-width:none;
}
.sidebar-nav::-webkit-scrollbar{display:none;}

.nav-section {
  font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(255,255,255,.22); padding:14px 12px 5px; white-space:nowrap;
}
.nav-item {
  display:flex; align-items:center; gap:11px;
  padding:10px 12px; border-radius:12px; margin-bottom:1px;
  cursor:pointer; border:none; background:none;
  color:rgba(255,255,255,.42);
  font-size:14.5px; font-weight:600; font-family:inherit;
  width:100%; text-align:left; white-space:nowrap; overflow:hidden;
  transition:background var(--dur-fast),color var(--dur-fast),transform var(--dur-fast);
  text-decoration:none;
}
.nav-item:hover  { background:rgba(255,255,255,.07); color:rgba(255,255,255,.75); }
.nav-item:active { transform:scale(.97); }
.nav-item.active { background:rgba(255,255,255,.12); color:#fff; }
.nav-icon {
  width:32px; height:32px; border-radius:9px;
  background:rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0; transition:background var(--dur-fast);
  font-size:15px;
}
.nav-item.active .nav-icon { background:var(--gold); box-shadow:0 2px 8px rgba(196,153,42,.35); }
.nav-item.active .nav-icon svg { color:var(--navy); }
.nav-label { flex:1; }
.nav-badge {
  font-size:10px; font-weight:700; background:var(--red); color:white;
  padding:2px 6px; border-radius:var(--pill); line-height:1.4; flex-shrink:0;
}
.nav-scan {
  background:rgba(196,153,42,.14) !important; color:var(--gold) !important;
  border:1px solid rgba(196,153,42,.2); margin:7px 0;
}
.nav-scan .nav-icon { background:rgba(196,153,42,.2); }
.nav-scan:hover { background:rgba(196,153,42,.22) !important; }

.sidebar-bottom {
  padding:10px 10px calc(14px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(255,255,255,.06); flex-shrink:0;
}
.sidebar-user {
  display:flex; align-items:center; gap:10px;
  padding:10px 12px; border-radius:12px; cursor:pointer; overflow:hidden;
  transition:background var(--dur-fast); text-decoration:none;
}
.sidebar-user:hover  { background:rgba(255,255,255,.07); }
.sidebar-user:active { transform:scale(.97); }
.s-av {
  width:32px; height:32px; border-radius:50%; flex-shrink:0;
  background:rgba(196,153,42,.15); border:1.5px solid rgba(196,153,42,.5);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:var(--gold);
}
.s-name { font-size:13px; font-weight:600; color:rgba(255,255,255,.85); white-space:nowrap; }
.s-role { font-size:11px; color:rgba(255,255,255,.28); }

/* Collapsed sidebar (1040px) */
.sidebar.collapsed { width:var(--sidebar-icon); }
.sidebar.collapsed .nav-label,.sidebar.collapsed .nav-badge,
.sidebar.collapsed .nav-section,.sidebar.collapsed .logo-text,
.sidebar.collapsed .s-name,.sidebar.collapsed .s-role { opacity:0; pointer-events:none; width:0; overflow:hidden; }
.sidebar.collapsed .nav-item { justify-content:center; padding:10px 0; }
.sidebar.collapsed .nav-icon { margin:0 auto; }
.sidebar.collapsed .sidebar-user { justify-content:center; }

/* ── Navbar ─────────────────────────────────────────────────── */
.navbar {
  height:var(--navbar-h);
  background:rgba(242,242,247,0.88);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  border-bottom:0.5px solid rgba(60,60,67,0.2);
  display:flex; align-items:center; gap:14px;
  padding:0 20px; flex-shrink:0; z-index:10;
  transition:box-shadow .3s;
}
.navbar.scrolled { box-shadow:0 1px 12px rgba(0,0,0,.08); }
.nav-hamburger {
  display:none; width:36px; height:36px; background:none; border:none;
  cursor:pointer; border-radius:10px; align-items:center; justify-content:center;
  color:var(--navy); transition:background var(--dur-fast);
}
.nav-hamburger:hover  { background:var(--fill2); }
.nav-hamburger:active { transform:scale(.92); }
.navbar-title { font-size:17px; font-weight:700; color:var(--label); letter-spacing:-.02em; flex-shrink:0; }
.navbar-search {
  flex:1; max-width:380px;
  background:var(--fill2); border-radius:var(--pill);
  padding:8px 14px; display:flex; align-items:center; gap:8px;
  transition:background .18s,box-shadow .18s;
}
.navbar-search:focus-within { background:var(--card); box-shadow:0 0 0 2px rgba(196,153,42,.42),var(--sh-xs); }
.navbar-search input { background:none; border:none; outline:none; color:var(--label); font-size:15px; flex:1; font-family:inherit; }
.navbar-search input::placeholder { color:var(--label3); }
.navbar-actions { margin-left:auto; display:flex; gap:6px; align-items:center; }
.navbar-btn {
  width:34px; height:34px; border-radius:10px;
  background:var(--fill2); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  color:var(--label2); position:relative;
  transition:background var(--dur-fast),transform var(--dur-fast);
}
.navbar-btn:hover  { background:var(--fill); }
.navbar-btn:active { transform:scale(.92); }
.notif-dot {
  position:absolute; top:6px; right:6px; width:7px; height:7px;
  border-radius:50%; background:var(--red); border:1.5px solid var(--card);
}
.nav-avatar {
  width:32px; height:32px; border-radius:50%;
  background:var(--navy); border:1.5px solid rgba(196,153,42,.5);
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:var(--gold);
  cursor:pointer; flex-shrink:0; text-decoration:none;
  transition:border-color var(--dur-fast),box-shadow var(--dur-fast);
}
.nav-avatar:hover { border-color:var(--gold); box-shadow:0 0 0 3px rgba(196,153,42,.2); }

/* ── Content area ───────────────────────────────────────────── */
.content {
  flex:1; overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  scroll-behavior:smooth;
  overscroll-behavior-y:contain;
}
.content::-webkit-scrollbar { width:4px; }
.content::-webkit-scrollbar-thumb { background:rgba(0,0,0,.1); border-radius:2px; }

.sp {
  padding:20px 20px calc(104px + env(safe-area-inset-bottom));
  max-width:1160px; margin:0 auto;
}

/* ── Page header ────────────────────────────────────────────── */
.large-title {
  font-size:32px; font-weight:700; color:var(--label);
  letter-spacing:-.045em; line-height:1.1; text-wrap:balance;
}
.page-header {
  display:flex; align-items:flex-start; justify-content:space-between;
  gap:12px; flex-wrap:wrap; margin-bottom:4px;
}
.page-actions {
  display:flex; align-items:center; gap:8px;
  flex-wrap:wrap; flex-shrink:0; padding-top:4px;
}
.page-sub {
  font-size:14px; color:var(--label3); margin-top:4px; margin-bottom:20px;
}

/* ── Flash alerts ───────────────────────────────────────────── */
.flash-strip {
  border-radius:var(--r-sm); padding:12px 16px; margin-bottom:16px;
  display:flex; align-items:flex-start; gap:10px;
  font-size:14px; font-weight:500; animation:slideUp .22s var(--ease-out) both;
}
.flash-strip.flash-error   { background:var(--red-bg);    color:var(--red); }
.flash-strip.flash-success { background:var(--green-bg);  color:var(--green); }
.flash-strip.flash-warning { background:var(--orange-bg); color:var(--orange); }
.flash-strip.flash-info    { background:var(--blue-bg);   color:var(--blue); }
.flash-icon { flex-shrink:0; font-size:16px; }

/* ── Buttons ────────────────────────────────────────────────── */
.btn {
  padding:9px 18px; border-radius:var(--pill); border:none;
  cursor:pointer; font-family:inherit; font-size:15px; font-weight:600;
  display:inline-flex; align-items:center; gap:6px;
  transition:all var(--dur-fast) var(--ease-out);
  -webkit-tap-highlight-color:transparent; white-space:nowrap;
  text-decoration:none;
}
.btn:active { transform:scale(.94); }
.btn-primary { background:var(--navy); color:white; box-shadow:var(--sh-sm); }
.btn-primary:hover { background:var(--navy-mid); box-shadow:var(--sh-md); }
.btn-tinted  { background:rgba(11,24,37,.08); color:var(--navy); font-weight:600; }
.btn-tinted:hover { background:rgba(11,24,37,.13); }
.btn-gold    { background:linear-gradient(135deg,#D4AD50,var(--gold)); color:var(--navy); font-weight:700; box-shadow:0 2px 8px rgba(196,153,42,.3); }
.btn-gold:hover { box-shadow:0 4px 16px rgba(196,153,42,.4); }
.btn-plain   { background:none; color:var(--navy); padding:9px 12px; }
.btn-plain:hover { background:var(--fill2); }
.btn-danger  { background:var(--red-bg); color:var(--red); }
.btn-danger:hover { background:rgba(255,59,48,.2); }
.btn-sm { padding:7px 14px; font-size:13px; }
.btn-xs { padding:5px 12px; font-size:12px; font-weight:600; }
.btn-back {
  color:var(--navy); background:none; border:none; padding:4px 0;
  font-size:17px; font-weight:400; display:inline-flex; align-items:center;
  gap:3px; cursor:pointer; font-family:inherit; text-decoration:none;
}

/* ── iOS grouped list ───────────────────────────────────────── */
.ios-section-label {
  font-size:12px; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
  color:var(--label3); padding:16px 4px 7px;
}
.ios-group {
  background:var(--card); border-radius:var(--r-lg);
  overflow:hidden; box-shadow:var(--sh-xs); margin-bottom:16px;
}
.ios-row {
  display:flex; align-items:center; gap:12px;
  padding:12px 16px; min-height:52px;
  border-bottom:0.5px solid var(--sep);
  background:var(--card); cursor:pointer;
  transition:background var(--dur-fast);
  -webkit-tap-highlight-color:transparent;
  text-decoration:none; color:inherit;
}
.ios-row:last-child { border-bottom:none; }
.ios-row:active { background:rgba(0,0,0,.05); }
.ios-row-icon {
  width:30px; height:30px; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  font-size:16px; flex-shrink:0;
}
.ios-row-body { flex:1; min-width:0; }
.ios-row-title { font-size:17px; font-weight:400; color:var(--label); }
.ios-row-sub   { font-size:13px; color:var(--label3); margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ios-row-trail { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.ios-row-value { font-size:17px; color:var(--label3); }
.ios-chevron svg { opacity:.3; }

/* ── Segmented control ──────────────────────────────────────── */
.seg-ctrl {
  display:flex; background:rgba(120,120,128,.12); border-radius:9px;
  padding:2px; overflow-x:auto; scrollbar-width:none; margin-bottom:14px;
}
.seg-ctrl::-webkit-scrollbar { display:none; }
.seg-btn {
  flex:1; min-width:max-content; padding:7px 14px; border-radius:7px; border:none;
  cursor:pointer; font-family:inherit; font-size:13px; font-weight:500;
  background:none; color:var(--label2); white-space:nowrap;
  transition:background var(--dur-fast),color var(--dur-fast),box-shadow var(--dur-fast);
}
.seg-btn.active {
  background:white; color:var(--label); font-weight:600;
  box-shadow:0 1px 3px rgba(0,0,0,.12),0 1px 1px rgba(0,0,0,.06);
}
.seg-btn:active { transform:scale(.95); }

/* ── Search field ───────────────────────────────────────────── */
.search-field {
  background:var(--fill2); border-radius:var(--r-sm);
  padding:10px 14px; display:flex; align-items:center; gap:8px;
  margin-bottom:14px; transition:background .18s,box-shadow .18s;
}
.search-field:focus-within { background:var(--card); box-shadow:0 0 0 2px rgba(196,153,42,.4),var(--sh-xs); }
.search-field input { background:none; border:none; outline:none; color:var(--label); font-size:15px; flex:1; font-family:inherit; }
.search-field input::placeholder { color:var(--label3); }

/* ── Badges ─────────────────────────────────────────────────── */
.badge {
  display:inline-flex; font-size:11px; font-weight:600;
  padding:3px 9px; border-radius:var(--pill); white-space:nowrap;
}
.b-active    { background:var(--green-bg);  color:var(--green); }
.b-hearing   { background:var(--orange-bg); color:var(--orange); }
.b-pending   { background:var(--fill2);     color:var(--label3); }
.b-urgent    { background:var(--red-bg);    color:var(--red); }
.b-closed    { background:var(--fill2);     color:var(--label3); }
.b-criminal  { background:var(--red-bg);    color:var(--red); }
.b-civil     { background:var(--blue-bg);   color:var(--blue); }
.b-property  { background:var(--green-bg);  color:var(--green); }
.b-corporate { background:var(--purple-bg); color:var(--purple); }
.b-family    { background:var(--orange-bg); color:var(--orange); }
.b-labour    { background:var(--blue-bg);   color:var(--blue); }
.b-revenue   { background:var(--gold-lt);   color:var(--gold); }
.b-paid      { background:var(--green-bg);  color:var(--green); }
.b-overdue   { background:var(--red-bg);    color:var(--red); }
.b-draft     { background:var(--fill2);     color:var(--label2); }
.b-gold      { background:var(--gold-lt);   color:var(--gold); }
.b-verified  { background:var(--green-bg);  color:var(--green); }
.b-incomplete{ background:var(--orange-bg); color:var(--orange); }
.b-vip       { background:var(--gold-lt);   color:var(--gold); font-weight:700; }

/* ── Toggle switch ──────────────────────────────────────────── */
.tog { width:51px; height:31px; border-radius:var(--pill); border:none; padding:0; cursor:pointer; flex-shrink:0; transition:background .2s; position:relative; }
.tog.on  { background:var(--green); }
.tog.off { background:rgba(120,120,128,.3); }
.tog-k   { position:absolute; top:2px; width:27px; height:27px; border-radius:50%; background:white; box-shadow:0 3px 8px rgba(0,0,0,.18),0 1px 2px rgba(0,0,0,.12); transition:left .2s var(--spring); }
.tog.on  .tog-k { left:22px; }
.tog.off .tog-k { left:2px; }

/* ── Form inputs ────────────────────────────────────────────── */
.form-lbl { font-size:13px; font-weight:500; color:var(--label2); margin-bottom:6px; display:block; }
.form-inp {
  width:100%; padding:12px 14px; border-radius:var(--r-sm);
  border:none; background:var(--card); box-shadow:0 0 0 1px rgba(60,60,67,.18);
  font-family:inherit; font-size:16px; color:var(--label); outline:none;
  transition:box-shadow .18s; -webkit-appearance:none;
}
.form-inp:focus { box-shadow:0 0 0 2px rgba(196,153,42,.5); }
.form-inp.error { box-shadow:0 0 0 2px rgba(255,59,48,.5); }
select.form-inp {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%233c3c43' stroke-opacity='.38' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; padding-right:36px; cursor:pointer;
}
textarea.form-inp { resize:vertical; min-height:88px; line-height:1.5; font-size:15px; }
.form-group { margin-bottom:16px; }
.form-row   { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-err   { font-size:12px; color:var(--red); margin-top:5px; }

/* ── Stat grid ──────────────────────────────────────────────── */
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.stat-card {
  background:var(--card); border-radius:var(--r-lg);
  padding:18px 16px; box-shadow:var(--sh-xs);
  transition:transform var(--dur-fast),box-shadow var(--dur-fast);
  position:relative; overflow:hidden;
}
.stat-card:active { transform:scale(.97); }
.stat-icon-badge {
  width:36px; height:36px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:18px; margin-bottom:8px;
}
.stat-num {
  font-size:32px; font-weight:700; color:var(--label);
  font-variant-numeric:tabular-nums; line-height:1;
  letter-spacing:-.04em; margin-bottom:4px;
}
.stat-lbl   { font-size:13px; color:var(--label3); font-weight:500; }
.stat-delta { font-size:12px; margin-top:5px; font-weight:500; }
.delta-up   { color:var(--green); }
.delta-dn   { color:var(--red); }
.delta-wn   { color:var(--orange); }

/* ── Hearing card ───────────────────────────────────────────── */
.hearing-card {
  background:linear-gradient(140deg,#091520 0%,#0B1825 55%,#0E2035 100%);
  border-radius:var(--r-xl); padding:22px 20px; position:relative; overflow:hidden;
  margin-bottom:16px; border:1px solid rgba(255,255,255,.05); box-shadow:var(--sh-md);
}
.hearing-card::before {
  content:''; position:absolute; top:-80px; right:-60px;
  width:260px; height:260px; border-radius:50%;
  background:radial-gradient(circle,rgba(196,153,42,.18) 0%,transparent 70%);
  pointer-events:none;
}
.hc-eye  { font-size:11px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:rgba(196,153,42,.8); margin-bottom:7px; }
.hc-case { font-size:20px; font-weight:700; color:white; line-height:1.25; margin-bottom:3px; letter-spacing:-.02em; }
.hc-sub  { font-size:13px; color:rgba(255,255,255,.35); margin-bottom:18px; }
.hc-row  { display:flex; gap:20px; flex-wrap:wrap; }
.hc-d-lbl{ font-size:10px; color:rgba(255,255,255,.3); text-transform:uppercase; letter-spacing:.06em; font-weight:600; margin-bottom:2px; }
.hc-d-val{ font-size:14px; color:white; font-weight:600; }
.hc-badge{
  position:absolute; top:20px; right:20px;
  background:linear-gradient(135deg,#D4AD50,var(--gold));
  color:var(--navy); font-size:11px; font-weight:700;
  padding:4px 12px; border-radius:var(--pill);
  box-shadow:0 2px 8px rgba(196,153,42,.4); animation:glow 3s ease-in-out infinite;
}

/* ── Dashboard ──────────────────────────────────────────────── */
.dash-greeting { font-size:28px; font-weight:700; color:var(--label); letter-spacing:-.03em; }
.dash-sub      { font-size:14px; color:var(--label3); margin-top:4px; }
.dash-actions  { display:flex; gap:8px; margin-top:14px; flex-wrap:wrap; }
.dash-two { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:16px; }
.qa-grid  { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-bottom:16px; }
.qa-item  {
  background:var(--card); border-radius:var(--r-lg); padding:16px 10px 14px;
  box-shadow:var(--sh-xs); display:flex; flex-direction:column; align-items:center; gap:8px;
  cursor:pointer; border:none; font-family:inherit;
  transition:transform var(--dur-fast),box-shadow var(--dur-fast);
  -webkit-tap-highlight-color:transparent; text-decoration:none;
}
.qa-item:hover  { box-shadow:var(--sh-sm); }
.qa-item:active { transform:scale(.91); }
.qa-icon { width:50px; height:50px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:24px; }
.qa-lbl  { font-size:12px; font-weight:600; color:var(--label2); text-align:center; line-height:1.3; }

/* AI insight card */
.ai-card {
  background:linear-gradient(140deg,#071A0E 0%,#0A1A26 100%);
  border-radius:var(--r-xl); padding:20px;
  border:1px solid rgba(29,185,84,.12); margin-bottom:16px; box-shadow:var(--sh-sm);
}
.ai-lbl  { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.1em; color:#4ADE80; margin-bottom:7px; display:flex; align-items:center; gap:6px; }
.ai-text { font-size:14px; color:rgba(255,255,255,.65); line-height:1.65; }
.ai-chips{ display:flex; gap:6px; flex-wrap:wrap; margin-top:12px; }
.ai-chip { font-size:11px; font-weight:600; padding:3px 10px; border-radius:var(--pill); }
.ai-chip-g { background:rgba(74,222,128,.12); color:#4ADE80; }
.ai-chip-a { background:rgba(196,153,42,.12); color:var(--gold); }

/* ── Case list ──────────────────────────────────────────────── */
.case-row {
  display:flex; align-items:center; gap:12px;
  padding:13px 16px; border-bottom:0.5px solid var(--sep);
  background:var(--card); cursor:pointer;
  transition:background var(--dur-fast); -webkit-tap-highlight-color:transparent;
  text-decoration:none; color:inherit;
}
.case-row:last-child { border-bottom:none; }
.case-row:active { background:rgba(0,0,0,.05); }
.case-type-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.case-info  { flex:1; min-width:0; }
.case-nm    { font-size:15px; font-weight:600; color:var(--label); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:2px; }
.case-no    { font-size:13px; color:var(--label3); }
.case-meta  { display:flex; flex-direction:column; align-items:flex-end; gap:4px; flex-shrink:0; }
.case-date  { font-size:12px; color:var(--label3); font-variant-numeric:tabular-nums; }
.case-chevron { color:var(--label4); }

/* ── Section card ───────────────────────────────────────────── */
.sec-card  { background:var(--card); border-radius:var(--r-lg); padding:18px; box-shadow:var(--sh-xs); }
.sec-label { font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.07em; color:var(--label3); margin-bottom:14px; }

/* ── Clients grid ───────────────────────────────────────────── */
.clients-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:14px; }
.cc { background:var(--card); border-radius:var(--r-xl); box-shadow:var(--sh-xs); overflow:hidden; transition:transform var(--dur-fast),box-shadow var(--dur-fast); }
.cc:hover  { box-shadow:var(--sh-sm); }
.cc:active { transform:scale(.98); }
.cc-head   { padding:18px 18px 14px; display:flex; align-items:flex-start; gap:12px; border-bottom:0.5px solid var(--sep); }
.cc-av     { width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; flex-shrink:0; }
.cc-name   { font-size:17px; font-weight:600; color:var(--label); margin-bottom:2px; letter-spacing:-.01em; }
.cc-type   { font-size:13px; color:var(--label3); margin-bottom:6px; }
.cc-strip  { display:flex; border-bottom:0.5px solid var(--sep); }
.cc-s      { flex:1; padding:12px 0; text-align:center; border-right:0.5px solid var(--sep); }
.cc-s:last-child { border-right:none; }
.cc-s-num  { font-size:19px; font-weight:700; color:var(--label); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
.cc-s-lbl  { font-size:10px; color:var(--label3); text-transform:uppercase; letter-spacing:.06em; font-weight:500; }
.cc-body   { padding:14px 18px 16px; }
.cc-btns   { display:flex; gap:8px; }
.cc-btn    { flex:1; padding:9px 8px; border-radius:10px; border:none; cursor:pointer; font-family:inherit; font-size:13px; font-weight:600; display:flex; align-items:center; justify-content:center; gap:5px; transition:all var(--dur-fast); text-decoration:none; }
.cc-btn:active { transform:scale(.94); }
.cc-btn-navy  { background:var(--navy); color:white; }
.cc-btn-green { background:var(--green-bg); color:var(--green); }
.cc-btn-gray  { background:var(--fill2); color:var(--label2); }

/* ── Calendar ───────────────────────────────────────────────── */
.cal-layout { display:grid; grid-template-columns:300px 1fr; gap:16px; align-items:start; }
.cal-nav    { display:flex; justify-content:space-between; align-items:center; margin-bottom:14px; }
.cal-month  { font-size:17px; font-weight:700; color:var(--label); letter-spacing:-.02em; }
.cal-arr    { width:28px; height:28px; border-radius:var(--r-sm); background:var(--fill2); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--label2); transition:background var(--dur-fast); }
.cal-arr:hover { background:var(--fill); }
.day-names  { display:grid; grid-template-columns:repeat(7,1fr); margin-bottom:4px; }
.day-name   { text-align:center; font-size:11px; font-weight:500; color:var(--label3); padding:4px 0; }
.day-grid   { display:grid; grid-template-columns:repeat(7,1fr); gap:2px; }
.day-cell   { aspect-ratio:1; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:10px; cursor:pointer; transition:background var(--dur-fast); }
.day-cell:hover { background:var(--fill2); }
.day-num    { font-size:15px; font-weight:500; color:var(--label); font-variant-numeric:tabular-nums; }
.day-today .day-inner { background:var(--red); border-radius:50%; width:32px; height:32px; display:flex; align-items:center; justify-content:center; }
.day-today .day-num { color:white; font-weight:700; }
.day-other .day-num { color:var(--label3); }
.day-has   .day-num { font-weight:700; }
.e-dots { display:flex; gap:2px; margin-top:2px; }
.e-dot  { width:4px; height:4px; border-radius:50%; }
.d-gold { background:var(--gold); } .d-red{background:var(--red);} .d-blue{background:var(--blue);}
.agenda-sec  { font-size:11px; font-weight:600; color:var(--label3); padding:14px 0 6px; letter-spacing:.05em; text-transform:uppercase; }
.agenda-item { background:var(--card); border-radius:var(--r); padding:14px 16px; margin-bottom:10px; box-shadow:var(--sh-xs); border-left:3px solid rgba(0,0,0,.06); transition:transform var(--dur-fast),box-shadow var(--dur-fast); cursor:pointer; }
.agenda-item:hover  { box-shadow:var(--sh-sm); transform:translateX(2px); }
.agenda-item:active { transform:scale(.98); }
.agenda-item.court  { border-left-color:var(--gold); }
.agenda-item.dead   { border-left-color:var(--red); }
.agenda-time   { font-size:11px; font-weight:600; color:var(--label3); margin-bottom:3px; text-transform:uppercase; letter-spacing:.05em; }
.agenda-name   { font-size:15px; font-weight:600; color:var(--label); margin-bottom:2px; }
.agenda-detail { font-size:13px; color:var(--label3); }

/* ── Calendar (new grid UI) ─────────────────────────────────── */
.cal-nav-btn    { width:32px;height:32px;border-radius:var(--r-sm);background:var(--fill2);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--label2);font-size:18px;text-decoration:none;transition:background var(--dur-fast); }
.cal-nav-btn:hover { background:var(--fill); }
.cal-month-label { font-size:17px;font-weight:700;color:var(--label);letter-spacing:-.02em; }
.cal-grid-head  { display:grid;grid-template-columns:repeat(7,1fr);margin-bottom:4px; }
.cal-day-lbl    { text-align:center;font-size:11px;font-weight:500;color:var(--label3);padding:4px 0; }
.cal-grid       { display:grid;grid-template-columns:repeat(7,1fr);gap:2px; }
.cal-cell       { min-height:72px;padding:6px 4px 4px;border-radius:8px;cursor:default;transition:background var(--dur-fast);position:relative; }
.cal-cell:hover { background:var(--fill2); }
.cal-cell-empty { background:transparent !important; }
.cal-cell-today { background:rgba(196,153,42,.06); }
.cal-cell-has   { }
.cal-day-num    { font-size:13px;font-weight:500;color:var(--label);font-variant-numeric:tabular-nums;margin-bottom:4px;text-align:center; }
.cal-day-today  { background:var(--gold);color:white;font-weight:700;border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;margin:0 auto 4px; }
.cal-event      { display:flex;align-items:center;gap:3px;font-size:10px;color:var(--label2);margin-bottom:2px;overflow:hidden; }
.cal-ev-title   { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.cal-ev-dot     { width:5px;height:5px;border-radius:50%;flex-shrink:0; }
.cal-ev-upcoming  { background:var(--blue); }
.cal-ev-completed { background:var(--green); }
.cal-ev-adjourned { background:var(--orange); }
.cal-ev-cancelled { background:var(--label3); }
.cal-more       { font-size:9px;color:var(--label3);text-align:center;margin-top:2px; }
.cal-legend     { display:flex;gap:12px;flex-wrap:wrap;margin-top:12px;justify-content:center; }
.cal-leg-item   { display:flex;align-items:center;gap:5px;font-size:12px;color:var(--label3); }
.cal-date-chip  { width:36px;flex-shrink:0;text-align:center; }
.cal-chip-mon   { font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--red);font-weight:600; }
.cal-chip-day   { font-size:20px;font-weight:700;color:var(--label);line-height:1;font-variant-numeric:tabular-nums; }

/* ── Documents (new list/grid UI) ──────────────────────────── */
.doc-layout { display:grid; grid-template-columns:1fr 380px; gap:16px; align-items:start; }
.doc-grid   { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:12px; }
.doc-card   { background:var(--card); border-radius:var(--r-lg); padding:14px; box-shadow:var(--sh-xs); cursor:pointer; transition:transform var(--dur-fast),box-shadow var(--dur-fast); }
.doc-card:hover  { box-shadow:var(--sh-sm); }
.doc-card:active { transform:scale(.95); }
.doc-thumb  { width:100%; height:88px; border-radius:10px; background:linear-gradient(135deg,#F5F0E4,#EDE8D8); display:flex; align-items:center; justify-content:center; font-size:28px; margin-bottom:10px; position:relative; overflow:hidden; }
.doc-thumb::before { content:''; position:absolute; top:0; left:0; right:0; height:10px; background:rgba(0,0,0,.05); }
.doc-nm { font-size:13px; font-weight:600; color:var(--label); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:3px; }
.doc-mt { font-size:11px; color:var(--label3); }
.doc-card       { background:var(--card);border-radius:var(--r-lg);padding:14px 16px;box-shadow:var(--sh-xs);display:flex;align-items:flex-start;gap:12px;transition:box-shadow var(--dur-fast); }
.doc-card:hover { box-shadow:var(--sh-sm); }
.doc-card-icon  { width:44px;height:44px;border-radius:10px;background:var(--fill2);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.doc-card-body  { flex:1;min-width:0; }
.doc-card-name  { font-size:14px;font-weight:600;color:var(--label);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:3px; }
.doc-card-meta  { font-size:12px;color:var(--label3);margin-bottom:6px; }
.doc-card-actions { flex-shrink:0;margin-left:auto; }
.doc-grid       { display:flex;flex-direction:column;gap:8px; }

/* ── Billing ────────────────────────────────────────────────── */
.bil-hero   { background:linear-gradient(140deg,#071510 0%,var(--navy) 100%); border-radius:var(--r-xl); padding:24px 22px; margin-bottom:16px; box-shadow:var(--sh-md); border:1px solid rgba(255,255,255,.04); position:relative; overflow:hidden; }
.bil-hero::before { content:''; position:absolute; top:-80px; right:-60px; width:280px; height:280px; border-radius:50%; background:radial-gradient(circle,rgba(196,153,42,.12) 0%,transparent 70%); pointer-events:none; }
.bil-amount { font-size:44px; font-weight:700; color:white; font-variant-numeric:tabular-nums; line-height:1; letter-spacing:-.04em; margin-bottom:5px; }
.bil-period { font-size:11px; color:var(--gold); font-weight:600; letter-spacing:.1em; text-transform:uppercase; margin-bottom:6px; }
.bil-delta  { font-size:13px; color:#4ADE80; font-weight:500; }
.bil-bars   { display:flex; gap:6px; align-items:flex-end; height:48px; margin-top:16px; }
.bil-bar-c  { display:flex; flex-direction:column; align-items:center; gap:3px; }
.bil-bar    { width:20px; border-radius:4px 4px 0 0; background:rgba(255,255,255,.1); }
.bil-bar.cur{ background:linear-gradient(to top,rgba(196,153,42,.8),var(--gold)); }
.bil-bar-l  { font-size:8px; color:rgba(255,255,255,.25); font-weight:600; }
.bil-bar-l.cur { color:var(--gold); }
.bil-kpi    { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.bil-grid   { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.kpi-card   { background:var(--card); border-radius:var(--r-lg); padding:18px 16px; box-shadow:var(--sh-xs); }
.kpi-num    { font-size:28px; font-weight:700; color:var(--label); font-variant-numeric:tabular-nums; letter-spacing:-.03em; line-height:1; margin-bottom:4px; }
.kpi-val    { font-size:22px; font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:-.02em; line-height:1; margin-bottom:4px; }
.kpi-lbl    { font-size:12px; font-weight:500; text-transform:uppercase; letter-spacing:.07em; color:var(--label3); }
.entry-row  { display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:0.5px solid var(--sep); transition:background var(--dur-fast); }
.entry-row:last-child { border-bottom:none; }
.entry-dot  { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.entry-info { flex:1; min-width:0; }
.entry-nm   { font-size:14px; font-weight:600; color:var(--label); }
.entry-desc { font-size:12px; color:var(--label3); }
.entry-time { font-size:15px; font-weight:700; color:var(--label); font-variant-numeric:tabular-nums; }
.entry-amt  { font-size:12px; color:var(--label3); text-align:right; }
.inv-row    { display:flex; align-items:center; gap:12px; padding:13px 0; border-bottom:0.5px solid var(--sep); }
.inv-row:last-child { border-bottom:none; }
.inv-ico    { width:40px; height:40px; border-radius:11px; display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0; }
.inv-info   { flex:1; min-width:0; }
.inv-num    { font-size:11px; color:var(--label3); font-weight:600; }
.inv-cl     { font-size:14px; font-weight:600; color:var(--label); }
.inv-date   { font-size:12px; color:var(--label3); }
.inv-amt    { font-size:15px; font-weight:700; color:var(--label); font-variant-numeric:tabular-nums; }

/* ── Analytics ──────────────────────────────────────────────── */
.an-kpi   { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:16px; }
.an-kpi-c { background:var(--card); border-radius:var(--r-lg); padding:18px 16px; box-shadow:var(--sh-xs); transition:transform var(--dur-fast); }
.an-kpi-c:active { transform:scale(.97); }
.an-kpi-lbl { font-size:12px; font-weight:500; text-transform:uppercase; letter-spacing:.08em; color:var(--label3); margin-bottom:6px; }
.an-kpi-val { font-size:28px; font-weight:700; color:var(--label); font-variant-numeric:tabular-nums; letter-spacing:-.03em; line-height:1; margin-bottom:4px; }
.an-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
.an-chart-title { font-size:13px; font-weight:600; color:var(--label3); text-transform:uppercase; letter-spacing:.06em; margin-bottom:14px; }
.an-av { width:28px;height:28px;border-radius:50%;background:rgba(10,132,255,.12);color:var(--blue);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0; }
.br-row  { margin-bottom:12px; }
.br-top  { display:flex; justify-content:space-between; margin-bottom:5px; }
.br-lbl  { font-size:14px; font-weight:500; color:var(--label); }
.br-cnt  { font-size:13px; color:var(--label3); }
.br-track { height:6px; background:var(--fill2); border-radius:3px; overflow:hidden; }
.br-fill  { height:100%; border-radius:3px; }
.donut-wrap   { display:flex; align-items:center; gap:20px; }
.donut-legend { flex:1; display:flex; flex-direction:column; gap:9px; }
.dl-row { display:flex; align-items:center; gap:8px; }
.dl-dot { width:8px; height:8px; border-radius:2px; flex-shrink:0; }
.dl-lbl { font-size:13px; color:var(--label); flex:1; }
.dl-val { font-size:13px; font-weight:600; color:var(--label2); font-variant-numeric:tabular-nums; }
.dl-pct { font-size:12px; color:var(--label3); width:30px; text-align:right; }

/* ── Profile ────────────────────────────────────────────────── */
.profile-layout { display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start; }
.prof-av        { width:80px;height:80px;border-radius:50%;background:rgba(196,153,42,.15);color:var(--gold);display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700;margin:0 auto 14px;border:3px solid rgba(196,153,42,.3); }
.prof-stats     { display:flex;background:var(--fill2);border-radius:12px;overflow:hidden;margin-top:16px; }
.prof-stat      { flex:1;padding:12px 0;text-align:center;border-right:0.5px solid var(--sep); }
.prof-stat:last-child { border-right:none; }
.prof-stat-num  { font-size:20px;font-weight:700;color:var(--label);font-variant-numeric:tabular-nums;line-height:1;margin-bottom:4px; }
.prof-stat-lbl  { font-size:10px;color:var(--label3);text-transform:uppercase;letter-spacing:.06em;font-weight:500; }
.scan-layout    { display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start; }
.scan-drop      { border:2px dashed var(--sep);border-radius:var(--r-xl);padding:36px 20px;text-align:center;cursor:pointer;transition:all var(--dur-fast);margin-bottom:16px;background:var(--fill); }
.scan-drop:hover { border-color:var(--gold);background:rgba(196,153,42,.04); }
.scan-drop-icon { margin-bottom:12px; }
.scan-drop-label { font-size:15px;font-weight:500;color:var(--label2);margin-bottom:6px; }
.scan-drop-sub  { font-size:12px;color:var(--label3); }
.ph-hero { background:linear-gradient(150deg,var(--navy) 0%,var(--navy-soft) 100%); border-radius:var(--r-xl); padding:24px 22px; position:relative; overflow:hidden; margin-bottom:14px; box-shadow:var(--sh-md); border:1px solid rgba(255,255,255,.05); }
.ph-hero::before { content:''; position:absolute; top:-60px; right:-60px; width:220px; height:220px; background:radial-gradient(circle,rgba(196,153,42,.12) 0%,transparent 70%); pointer-events:none; }
.ph-av    { width:68px; height:68px; border-radius:50%; border:3px solid rgba(196,153,42,.5); display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:700; color:var(--gold); margin-bottom:13px; position:relative; box-shadow:0 4px 16px rgba(0,0,0,.28); }
.ph-online{ position:absolute; bottom:2px; right:2px; width:13px; height:13px; border-radius:50%; background:var(--green); border:2px solid var(--navy); }
.ph-name  { font-size:19px; font-weight:700; color:white; letter-spacing:-.02em; margin-bottom:2px; }
.ph-role  { font-size:13px; color:rgba(255,255,255,.4); margin-bottom:2px; }
.ph-bar   { font-size:12px; color:var(--gold); font-weight:500; margin-bottom:16px; }
.ph-stats { display:flex; background:rgba(255,255,255,.07); border-radius:12px; overflow:hidden; }
.ph-s     { flex:1; padding:12px 0; text-align:center; border-right:1px solid rgba(255,255,255,.07); }
.ph-s:last-child { border-right:none; }
.ph-s-num { font-size:20px; font-weight:700; color:white; font-variant-numeric:tabular-nums; }
.ph-s-lbl { font-size:9px; color:rgba(255,255,255,.3); text-transform:uppercase; letter-spacing:.07em; font-weight:500; }
.tm-row   { display:flex; align-items:center; gap:12px; padding:12px 16px; border-bottom:0.5px solid var(--sep); background:var(--card); }
.tm-row:last-child { border-bottom:none; }
.tm-av    { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; flex-shrink:0; }

/* ── Case detail tabs ───────────────────────────────────────── */
.cd-tab-bar { display:flex; background:var(--fill2); border-radius:var(--r-sm); padding:2px; overflow-x:auto; scrollbar-width:none; margin-bottom:18px; }
.cd-tab-bar::-webkit-scrollbar { display:none; }
.cd-tab     { flex-shrink:0; padding:7px 16px; border-radius:9px; border:none; cursor:pointer; font-family:inherit; font-size:13px; font-weight:500; background:none; color:var(--label2); transition:all var(--dur-fast); }
.cd-tab.active { background:var(--card); color:var(--label); font-weight:600; box-shadow:0 1px 4px rgba(0,0,0,.1),0 1px 1px rgba(0,0,0,.06); }
.cd-tab:active { transform:scale(.95); }

/* ── Mobile tab bar ─────────────────────────────────────────── */
.tab-bar {
  display:none; position:fixed; bottom:0; left:0; right:0;
  background:rgba(249,249,249,0.92);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border-top:0.5px solid rgba(60,60,67,0.2);
  padding:8px 0 max(14px,calc(8px + env(safe-area-inset-bottom)));
  z-index:100;
}
.tab-items { display:flex; justify-content:space-around; align-items:flex-end; }
.tab-item  {
  display:flex; flex-direction:column; align-items:center; gap:3px;
  flex:1; cursor:pointer; background:none; border:none; font-family:inherit;
  padding:2px 4px; -webkit-tap-highlight-color:transparent;
  transition:transform var(--dur-fast); text-decoration:none;
}
.tab-item:active { transform:scale(.86); }
.tab-icon  { width:26px; height:26px; display:flex; align-items:center; justify-content:center; color:var(--label3); transition:color var(--dur-fast),transform var(--dur-fast); }
.tab-item.active .tab-icon { color:var(--navy); transform:scale(1.1); }
.tab-item.active .tab-icon svg { transform:scale(1.08); }
.tab-lbl   { font-size:10px; font-weight:500; color:var(--label3); transition:color var(--dur-fast); }
.tab-item.active .tab-lbl { color:var(--navy); font-weight:700; }
.tab-scan  {
  width:52px; height:52px; border-radius:50%;
  background:var(--navy); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  margin-top:-12px; flex-shrink:0;
  animation:ring-glow 3s ease-in-out infinite;
  transition:all var(--dur-fast) var(--spring);
  -webkit-tap-highlight-color:transparent;
  text-decoration:none;
}
.tab-scan:active { transform:scale(.88); }

/* ── Overlay + Drawer ───────────────────────────────────────── */
.overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:40; backdrop-filter:blur(2px); }
.overlay.open { display:block; }
.drawer  { position:fixed; top:0; left:0; bottom:0; width:var(--sidebar-w); background:linear-gradient(175deg,#09141E,#0B1825); z-index:50; display:flex; flex-direction:column; transform:translateX(-100%); transition:transform var(--dur) var(--ease-out); overflow-y:auto; }
.drawer.open { transform:translateX(0); }
.drawer .nav-section { color:rgba(255,255,255,.22); font-size:10px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:14px 12px 5px; }

/* ── Utility helpers ────────────────────────────────────────── */
.text-sm   { font-size:13px; }
.text-xs   { font-size:11px; }
.text-muted { color:var(--label3); }
.text-label { color:var(--label2); }
.fw-600 { font-weight:600; }
.fw-700 { font-weight:700; }
.mt-4   { margin-top:4px; }  .mt-8{margin-top:8px;} .mt-12{margin-top:12px;} .mt-16{margin-top:16px;}
.mb-4   { margin-bottom:4px; } .mb-8{margin-bottom:8px;} .mb-12{margin-bottom:12px;} .mb-16{margin-bottom:16px;}
.flex   { display:flex; }
.items-center { align-items:center; }
.gap-8  { gap:8px; } .gap-12{gap:12px;}
.tabular { font-variant-numeric:tabular-nums; }
.truncate { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.empty-state {
  text-align:center; padding:48px 24px; color:var(--label3);
}
.empty-icon { font-size:44px; margin-bottom:12px; }
.empty-text { font-size:15px; font-weight:500; color:var(--label2); margin-bottom:6px; }
.empty-sub  { font-size:13px; }

/* ── Client detail ──────────────────────────────────────────── */
.back-link { font-size:14px; color:var(--blue); text-decoration:none; display:inline-flex; align-items:center; gap:4px; }
.back-link:hover { text-decoration:underline; }
.client-hero { background:var(--card); border-radius:var(--r-xl); box-shadow:var(--sh-xs); padding:24px; display:flex; align-items:flex-start; gap:20px; margin-bottom:20px; }
.client-hero-av { width:68px; height:68px; border-radius:50%; background:rgba(196,153,42,.15); color:var(--gold); display:flex; align-items:center; justify-content:center; font-size:24px; font-weight:700; flex-shrink:0; }
.client-hero-info { flex:1; min-width:0; }
.client-hero-name { font-size:22px; font-weight:700; color:var(--label); margin-bottom:4px; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.client-hero-meta { font-size:14px; color:var(--label3); margin-bottom:8px; }
.client-hero-contacts { display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; font-size:13px; color:var(--label2); }
.stat-strip { background:var(--card); border-radius:var(--r-xl); box-shadow:var(--sh-xs); display:flex; overflow:hidden; }
.ss-item { flex:1; padding:16px 12px; text-align:center; border-right:0.5px solid var(--sep); }
.ss-item:last-child { border-right:none; }
.ss-num { font-size:22px; font-weight:700; color:var(--label); font-variant-numeric:tabular-nums; letter-spacing:-.02em; margin-bottom:4px; }
.ss-lbl { font-size:11px; color:var(--label3); text-transform:uppercase; letter-spacing:.06em; font-weight:500; }
.two-col-layout { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.section-card { background:var(--card); border-radius:var(--r-xl); box-shadow:var(--sh-xs); overflow:hidden; }
.ios-list { }
.ios-row { display:flex; align-items:center; gap:10px; padding:13px 16px; border-bottom:0.5px solid var(--sep); }
.ios-row:last-child { border-bottom:none; }
.ios-row-link:hover { background:var(--fill); }
.cc-warn { font-size:12px; color:var(--orange); background:rgba(255,149,0,.1); border-radius:8px; padding:8px 12px; margin:8px 16px; }

/* ── Forms (client / case shared styles) ──────────────────────── */
.form-card { background:var(--card); border-radius:var(--r-xl); box-shadow:var(--sh-xs); overflow:hidden; max-width:760px; }
.form-section { padding:24px 24px 8px; border-bottom:0.5px solid var(--sep); }
.form-section:last-of-type { border-bottom:none; }
.form-section-title { font-size:13px; font-weight:600; color:var(--label3); text-transform:uppercase; letter-spacing:.06em; margin-bottom:16px; }
.form-label { font-size:13px; font-weight:500; color:var(--label2); margin-bottom:6px; display:block; }
.form-hint { font-size:12px; color:var(--label3); margin-top:4px; }
.form-actions { padding:16px 24px; display:flex; justify-content:flex-end; gap:10px; background:var(--fill); border-top:0.5px solid var(--sep); }
.req { color:var(--red); margin-left:2px; }
.toggle-sw { position:relative; display:inline-block; width:51px; height:31px; flex-shrink:0; }
.toggle-sw input { opacity:0; width:0; height:0; position:absolute; }
.toggle-sw-track { position:absolute; inset:0; border-radius:31px; background:rgba(120,120,128,.3); transition:background .2s; cursor:pointer; }
.toggle-sw input:checked ~ .toggle-sw-track { background:var(--green); }
.toggle-sw-thumb { position:absolute; top:2px; left:2px; width:27px; height:27px; border-radius:50%; background:white; box-shadow:0 3px 8px rgba(0,0,0,.2); transition:left .2s var(--spring); }
.toggle-sw input:checked ~ .toggle-sw-track .toggle-sw-thumb { left:22px; }
.b-verified  { background:rgba(29,185,84,.12); color:var(--green); }
.b-incomplete { background:rgba(255,59,48,.1); color:var(--red); }

/* ── Responsive ─────────────────────────────────────────────── */
@media(max-width:1200px) {
  .an-kpi { grid-template-columns:repeat(2,1fr); }
  .bil-kpi { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:1040px) {
  .sidebar { width:var(--sidebar-icon); }
  .sidebar .nav-label,.sidebar .nav-badge,.sidebar .nav-section,
  .sidebar .logo-text,.sidebar .s-name,.sidebar .s-role { opacity:0; pointer-events:none; width:0; overflow:hidden; }
  .sidebar .nav-item  { justify-content:center; padding:10px 0; }
  .sidebar .nav-icon  { margin:0 auto; }
  .sidebar .sidebar-user { justify-content:center; }
  .cal-layout,.doc-layout,.scan-layout,.profile-layout,.an-grid,.dash-two { grid-template-columns:1fr; }
}
@media(max-width:768px) {
  .sidebar { display:none; }
  .tab-bar { display:block; }
  .content { padding-bottom:calc(72px + env(safe-area-inset-bottom)); }
  .sp { padding:14px 14px calc(96px + env(safe-area-inset-bottom)); }
  .navbar { padding:0 14px; }
  .nav-hamburger { display:flex; }
  .navbar-search { display:none; }
  .stat-grid  { grid-template-columns:repeat(2,1fr); gap:10px; }
  .qa-grid    { grid-template-columns:repeat(4,1fr); gap:8px; }
  .an-kpi     { grid-template-columns:repeat(2,1fr); }
  .bil-kpi    { grid-template-columns:repeat(2,1fr); }
  .bil-bars   { display:none; }
  .clients-grid { grid-template-columns:1fr; }
  .cal-layout,.doc-layout,.scan-layout,.profile-layout,.an-grid,.dash-two { grid-template-columns:1fr !important; }
  .bil-grid   { grid-template-columns:1fr; }
  .form-row   { grid-template-columns:1fr; }
}
@media(max-width:420px) {
  .qa-grid      { grid-template-columns:repeat(2,1fr); }
  .stat-num     { font-size:26px; }
  .dash-greeting{ font-size:24px; }
  .large-title  { font-size:24px; }
  .hc-case      { font-size:17px; }
  .bil-amount   { font-size:34px; }
  .page-header  { flex-direction:column; }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; }
}