/* Local :root override removed — global styles.css now provides the
   luxe design tokens (bone/ocean/sage/Fraunces/DM Sans). */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body {
  background: var(--bg); color: var(--ink);
  font-family: var(--sans); font-weight: 300;
  line-height: 1.6; -webkit-font-smoothing: antialiased;
  display: flex; flex-direction: column; margin: 0; padding: 0;
}
h1,h2,h3,h4,h5 { font-family: var(--serif); font-weight: 400; line-height: 1.15; color: var(--ink); letter-spacing: 0.03em; }
h1 { font-size: clamp(28px,4vw,44px); letter-spacing: 0.04em; }
h2 { font-size: clamp(22px,3vw,32px); letter-spacing: 0.035em; }
h3 { font-size: 20px; letter-spacing: 0.03em; }
p { line-height: 1.7; }

/* ── Topbar — local layout-only adjustments. Visual styling
   (black background, white text, etc.) is inherited from styles.css. ── */
.topbar {
  padding: 12px 24px;
  flex-shrink: 0;
}

/* ── Shared components — circular ocean brand mark inherited from global ── */
.brand { display:flex;align-items:center;gap:12px;text-decoration:none;flex-shrink:0; }
/* .brand-name, .brand-tag — visual styling inherited from styles.css */
/* margin-left: auto pushes the whole action group (Sessions + Open Journal +
   the user bubble injected by user.js) to the right edge of the topbar,
   leaving the brand on the left. Without this, everything bunches to the
   left because there's no .nav element between brand and actions to act
   as a flex spacer. */
.nav-actions { display:flex;align-items:center;gap:8px;flex-shrink:0;margin-left:auto; }
/* .eyebrow, .muted, .mini, .btn — global luxe rules from styles.css */
.chip { display:inline-flex;align-items:center;padding:3px 10px;border-radius:999px;font-size:11px;font-weight:500;letter-spacing:.04em;background:var(--surface);color:var(--muted);border:1px solid var(--border);white-space:nowrap; }
.chip.green { background:var(--green-light);color:var(--green);border-color:rgba(45,106,79,.2); }
.chip.amber { background:var(--amber-light);color:var(--amber);border-color:rgba(181,98,10,.2); }
.chip.blue { background:var(--accent-light);color:var(--accent);border-color:rgba(61,90,128,.2); }
.chip.red { background:var(--red-light);color:var(--red);border-color:rgba(184,50,50,.2); }
.chip.purple { background:var(--purple-light);color:var(--purple);border-color:rgba(91,63,166,.2); }
.chip.gold { background:var(--gold-light);color:var(--gold);border-color:rgba(181,134,10,.2); }
input[type="text"],input[type="email"],input[type="password"],input[type="number"],textarea,select {
  width:100%;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:11px 14px;font-size:14px;font-family:var(--sans);font-weight:300;
  color:var(--ink);outline:none;transition:border-color .2s;appearance:none;
}
input:focus,textarea:focus,select:focus { border-color:var(--accent); }
textarea { resize:vertical;min-height:120px;line-height:1.6; }
label { font-size:12.5px;letter-spacing:0;text-transform:none;color:var(--muted);font-weight:500;display:block;margin-bottom:6px; }
::-webkit-scrollbar { width:5px;height:5px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--border);border-radius:3px; }
@keyframes spin { to { transform:rotate(360deg); } }
@keyframes fadeUp { from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn { from{opacity:0}to{opacity:1} }

/* ── Hub layout ── */
.hub-shell {
  /* Flex row (mirrors the therapist shell). The sidebar is position:fixed
     (shared styles.css) and .hub-main is offset by margin-left:230px, so the
     shell must NOT be a grid that traps hub-main in a fixed first column —
     that collapsed every client section. hub-main (flex:1) fills the row. */
  display: flex;
  flex-direction: row;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  visibility: hidden;
}
.hub-shell.sidebar-collapsed { grid-template-columns: 62px 1fr; }

/* ── Sidebar — LUXE ivory shiplap ── */
.hub-sidebar {
  background:
    repeating-linear-gradient(0deg,
      rgba(20, 19, 15, 0.05) 0,
      rgba(20, 19, 15, 0.05) 1px,
      transparent 1px,
      transparent 80px),
    var(--ivory);
  border-right: 1px solid var(--line-w);
  padding: 10px 10px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow-y: auto;
  overflow-x: hidden;
  transition: padding 0.22s ease;
}
.sidebar-toggle {
  display: flex; align-items: center; justify-content: center;
  padding: 5px; background: none; border: none;
  color: var(--muted); cursor: pointer; font-size: 17px;
  flex-shrink: 0; transition: color 0.15s, background 0.15s;
  border-radius: 0;
  width: 30px; height: 30px;
}
.sidebar-toggle:hover { color: var(--ink); background: var(--bone); }
.sidebar-section-label {
  font-size: 9.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--whisper);
  font-weight: 600;
  /* Generous top space creates a clear section break; small bottom space
     visually attaches the label to the items it heads. Horizontal padding
     matches .sidebar-item (14px) so labels left-align with item icons. */
  padding: 22px 14px 6px;
  line-height: 1.6;                 /* full cap-height + descender room — no clipping */
  white-space: nowrap;
  /* Allow the label to render at its natural height; the collapsed-state
     rule below overrides this when needed. */
  max-height: 64px;
  transition: opacity 0.15s, max-height 0.22s, padding 0.22s, font-size 0.15s, background 0.15s, margin 0.22s, height 0.22s;
}
/* First label (Overview) sits closer to the user bubble — no need for the
   big section break above the very first item. */
.sidebar-section-label:first-of-type { padding-top: 8px; }
.sidebar-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 14px; border-radius: 0;
  font-size: 13.5px; color: var(--ink-soft);
  cursor: pointer; border: none; background: transparent;
  text-align: left; font-family: var(--sans); font-weight: 400;
  transition: background 0.15s, color 0.15s, padding 0.22s, justify-content 0.22s;
  width: 100%; text-decoration: none; white-space: nowrap;
  position: relative;
}
.sidebar-item:hover { background: var(--bone); color: var(--ink); }
.sidebar-item.active {
  background: var(--paper);
  color: var(--ink);
  font-weight: 500;
  box-shadow: 0 1px 2px rgba(31,61,82,0.05), 0 0 0 1px var(--line-w);
}
.sidebar-item.active::before {
  content: '';
  position: absolute;
  left: -1px; top: 8px; bottom: 8px;
  width: 2px;
  background: var(--ocean-d);
  border-radius: 2px;
}
.sidebar-item.active .si-icon { color: var(--ocean-d); opacity: 1; }
.sidebar-item .si-icon { font-size: 14px; width: 20px; text-align: center; flex-shrink: 0; opacity: 0.7; color: var(--muted); transition: width 0.22s, opacity 0.22s, color 0.22s; }
.sidebar-item .si-label { transition: opacity 0.15s, max-width 0.22s; overflow: hidden; }
.sidebar-item:hover .si-icon { color: var(--ocean-d); }
.sidebar-badge {
  margin-left: auto; background: var(--ocean-d); color: #fff;
  font-size: 10px; font-weight: 500; padding: 2px 7px;
  border-radius: 999px; min-width: 20px; text-align: center;
  transition: opacity 0.15s;
  letter-spacing: 0.02em;
}
.sidebar-badge.amber { background: var(--amber); }
.sidebar-divider { height: 1px; background: var(--line-w); margin: 10px 14px; transition: margin 0.22s; }
.sidebar-profile {
  padding: 12px 14px; border-bottom: 1px solid var(--line-w);
  display: flex; align-items: center; gap: 10px; flex-shrink: 0;
  transition: padding 0.22s, gap 0.22s;
}
.sidebar-avatar { transition: opacity 0.15s, max-width 0.22s, width 0.22s, margin 0.22s; }
.sidebar-items-wrap {
  flex: 1; display: flex; flex-direction: column; gap: 4px;
  padding: 4px 10px 8px; min-height: 0; overflow-y: auto; overflow-x: hidden;
}
.sidebar-signout {
  padding: 4px 10px 10px; flex-shrink: 0;
  border-top: 1px solid var(--line-w);
}
.sidebar-avatar {
  width: 36px; height: 36px; border-radius: 50%;
  background: var(--ocean-w); color: var(--ocean-d);
  border: 1px solid var(--line-w);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--serif);
  font-size: 13px; font-weight: 500; flex-shrink: 0;
  overflow: hidden;
}
.sidebar-avatar img { width: 100%; height: 100%; object-fit: cover; }
/* Sidebar identity — name with ellipsis fallback for long handles. */
.sidebar-profile-info {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 1px;
  transition: opacity 0.15s, max-width 0.22s;
}
.sidebar-profile-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  letter-spacing: -0.005em;
}
.sidebar-profile-role {
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Collapsed sidebar ── */
.hub-sidebar.collapsed { padding: 0; }
.hub-sidebar.collapsed .sidebar-items-wrap { padding: 4px 6px 8px; }
.hub-sidebar.collapsed .sidebar-section-label { font-size: 0; padding: 0; max-height: 1px; height: 1px; opacity: 1; background: var(--line); margin: 10px 8px; border-radius: 1px; pointer-events: none; }
.hub-sidebar.collapsed .si-label { opacity: 0; max-width: 0; }
.hub-sidebar.collapsed .sidebar-badge { opacity: 0; pointer-events: none; }
.hub-sidebar.collapsed .sidebar-item { padding: 11px 8px; justify-content: center; gap: 0; }
.hub-sidebar.collapsed .sidebar-item .si-icon { width: auto; opacity: 1; }
.hub-sidebar.collapsed .sidebar-toggle { margin-left: 0; }
.hub-sidebar.collapsed .sidebar-divider { margin: 8px 4px; }
.hub-sidebar.collapsed .sidebar-profile { gap: 0; padding: 10px 8px; }
.hub-sidebar.collapsed .sidebar-avatar { opacity: 0; max-width: 0; width: 0; overflow: hidden; margin: 0; }
.hub-sidebar.collapsed .sidebar-signout .sidebar-item { padding: 11px 8px; justify-content: center; gap: 0; }

/* ── Main content ── */
.hub-main {
  padding: 0 0 0;
  background: var(--bg);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  /* Fill the flex-row shell beside the fixed sidebar. */
  flex: 1;
  min-width: 0;
}
/* Reliable bottom breathing room — padding-bottom on a flex overflow container is clipped in WebKit */
.hub-main::after { content: ''; display: block; height: 56px; flex-shrink: 0; }
/* Journal section — the section itself carries the app-wide page gutter
   (the editorial #section-journal.active rule in styles.css), so the
   hub-main wrapper must add none: a second inset here pushed "Your
   Journal" right and below the Schedule/Sessions header position. */
.hub-main.journal-active {
  padding: 0 0 20px;
}
.hub-main.journal-active::after { display: none; }
.section { display: none; }
.section.active { display: flex; flex-direction: column; gap: 24px; }
/* Full-height sections: fill hub-main so their internal panes scroll */
.hub-main.journal-active .section.active { flex: 1; min-height: 0; }
/* flex: 1 so the master-detail shell stretches to the bottom of the screen —
   without it the section sat at content height and the module (and its
   list/detail divider) stopped halfway down the page. */
#section-assignments.active { flex: 1; min-height: 0; }
#section-clinicians.active { flex: 1; min-height: 0; }

/* ── Layout parity with the clinician dashboard ────────────────────────
   The clinician shell gives its master-detail sections full hub-main
   height (flex:1; min-height:0), a generous min-height floor on the big
   working surfaces, and suppresses the 56px bottom spacer per-section so
   panes scroll internally. The client shell previously did this only for
   journal/assignments/clinicians, which left Sessions, Boards, Private
   Notes, and Billing collapsed to content height — cramped, with a
   dangling spacer. These rules bring the client in line. Container class
   names differ on the client, so selectors target the real surfaces. */

/* Sessions — fill height; both tab panels grow (clinician fills via .drv-shell, no clamp) */
#section-sessions.active { flex: 1; min-height: 0; }
#sessionsIndividualPanel,
#sessionsGroupPanel { flex: 1; min-height: 0; }
.hub-main:has(#section-sessions.active)::after { display: none; }

/* Boards — mirrors the journal layout: the workspace fills the first screen
   (#boards-mount height:78vh, set inline) and the section scrolls so the
   "Board Trends" .jlog-section sits below, reachable by scrolling down. */
#section-boards.active { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; }
.hub-main:has(#section-boards.active)::after { display: none; }
#section-boards #boardTrendsSection { flex-shrink: 0; }
/* Force the workspace to fill the first screen, overriding the whiteboard's
   own .wb-host/.wb-root height:100%/min-height:600 which can shrink it. */
/* Fill to the bottom of the screen — a percentage height on a flex-item's
   child resolves unreliably in WebKit (falls back to min-height, cutting the
   board short), so pin to the viewport like the journal app does. */
#section-boards #boards-mount { height: calc(100vh - 92px) !important; min-height: 520px !important; flex: 0 0 auto !important; border-bottom: 1px solid var(--muted) !important; }
#section-boards #boards-mount .wb-root { height: 100% !important; min-height: 0 !important; }

/* Private Notes — was a bare .panel that never filled; now fills + scrolls internally */
#section-notes.active { flex: 1; min-height: 0; }
.hub-main #section-notes .panel { flex: 1; min-height: 0; display: flex; flex-direction: column; }
#section-notes #privateNotesList { flex: 1; min-height: 0; overflow-y: auto; }
.hub-main:has(#section-notes.active)::after { display: none; }

/* Assignments — already flex:1; add the clinician's generous floor, 320px
   side column, bottom padding, and spacer suppression (this is the one
   true master-detail grid, so it gets the clamp like the clinician's .asgn-shell) */
#section-assignments.active { padding-bottom: 40px; }
.hub-main:has(#section-assignments.active)::after { display: none; }

/* Billing — no direct clinician counterpart; fill height without forcing a
   large min-height that would leave a stat/invoice list looking empty */
#section-billing.active { flex: 1; min-height: 0; }
.bill-panel.active { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.hub-main:has(#section-billing.active)::after { display: none; }

.section-hero {
  display: flex; align-items: flex-start; justify-content: space-between;
  flex-wrap: wrap; gap: 16px; margin-bottom: 4px;
}
.section-hero h1 { font-size: clamp(24px, 3vw, 32px); margin-bottom: 4px; }
.section-hero p { font-size: 14px; color: var(--muted); }

/* ── Cards ── */
.card { background: var(--card); border: 1px solid var(--border); border-radius: 0; padding: 24px; box-shadow: 0 2px 16px var(--shadow); }
.card-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; flex-wrap: wrap; gap: 12px; }
.card-header h3 { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; font-family: var(--sans); margin: 0; }

/* ── Stat row ── */
.stat-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; }
.stat-card { background: var(--card); border: 1px solid var(--border); border-radius: 0; padding: 20px; box-shadow: 0 2px 12px var(--shadow); }
.stat-card .stat-num { font-family: var(--serif); font-size: 28px; color: var(--ink); margin: 6px 0 2px; line-height: 1.1; }
.stat-card .stat-label { font-size: 12px; color: var(--muted); }

/* ── Panel ── */
.panel { padding: 22px 24px; background: var(--card); border: 1px solid var(--border); border-radius: 0; box-shadow: 0 2px 16px var(--shadow); }
.panel-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.panel-header h3 { font-size: 15px; font-weight: 600; letter-spacing: -0.01em; font-family: var(--sans); margin: 0; }
.panel-header .link { font-size: 12px; color: var(--muted); text-decoration: none; }
.panel-header .link:hover { color: var(--accent); }

/* ── Client Calendar ── */
.client-week-grid {
  display: grid;
  grid-template-columns: 60px repeat(7, 1fr);
  border: 1px solid var(--border);
  border-radius: 0;
  overflow: hidden;
}
.client-wh { background: var(--surface); padding: 10px 8px; font-size: 12px; font-weight: 500; text-align: center; border-bottom: 1px solid var(--border); color: var(--muted); line-height: 1.3; }
.client-wh strong { display: block; font-size: 13px; font-weight: 600; color: var(--ink); margin-top: 2px; }
/* Hover speaks ocean, never ink — the day numbers stay ink, the states don't. */
.client-wh:hover { background: var(--ocean-w); color: var(--ocean-d); }
.client-wh.today { background: transparent; color: var(--ocean-d); font-weight: 600; }
.client-wh.today strong { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; margin-top: 3px; background: var(--ocean); color: #F4F6F8; border-radius: 50%; font-size: 12px; line-height: 1; font-weight: 600; }
.client-wt { padding: 0 8px; font-size: 11px; color: var(--muted); text-align: center; border-right: 1px solid var(--border); height: 56px; display: flex; align-items: center; justify-content: center; }
.client-wc { border-right: 1px solid var(--border); border-bottom: 1px solid rgba(216,208,192,0.4); height: 56px; position: relative; }
/* The washes: pastel blocks with a color spine — ocean for sessions,
   sage for the client's own time. No solids, no shadows, no radius. */
.client-ev { position: absolute; left: 3px; right: 3px; top: 2px; bottom: 2px; background: var(--ocean-w); color: color-mix(in srgb, var(--ocean) 55%, var(--ink)); border-left: 2px solid var(--ocean); border-radius: 0; font-size: 10.5px; font-weight: 500; padding: 2px 7px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: flex; align-items: center; cursor: pointer; }
.client-ev:hover { background: color-mix(in srgb, var(--ocean) 16%, var(--ocean-w)); border-left-width: 3px; }
.client-ev.green { background: var(--green-light); border-left-color: var(--green); color: color-mix(in srgb, var(--green) 60%, var(--ink)); }
.client-ev.green:hover { background: color-mix(in srgb, var(--green) 14%, var(--green-light)); }
/* Color tags speak the product legend: ocean (default), sage, gold, purple.
   Rows saved before the pills (blue / green / amber) keep rendering. */
.client-ev.sage { background: var(--green-light); border-left-color: var(--green); color: color-mix(in srgb, var(--green) 60%, var(--ink)); }
.client-ev.sage:hover { background: color-mix(in srgb, var(--green) 14%, var(--green-light)); }
.client-ev.gold, .client-ev.amber { background: var(--gold-light); border-left-color: var(--gold); color: color-mix(in srgb, var(--gold) 55%, var(--ink)); }
.client-ev.gold:hover, .client-ev.amber:hover { background: color-mix(in srgb, var(--gold) 14%, var(--gold-light)); }
.client-ev.purple { background: var(--purple-light); border-left-color: var(--purple); color: color-mix(in srgb, var(--purple) 60%, var(--ink)); }
.client-ev.purple:hover { background: color-mix(in srgb, var(--purple) 14%, var(--purple-light)); }

/* New Event modal: the live week strip and the color pills. --evt-accent is
   set on the card from the chosen tag, so the strip, pills, and focus rings
   all take the same color. */
.cev-prev { background: var(--surface); border-bottom: 1px solid var(--border); padding: 14px 24px 16px; }
.cev-prev-l { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-bottom: 9px; }
.cev-week { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.cev-day { min-width: 0; }
.cev-dl { font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-bottom: 5px; }
.cev-chip { font-size: 10.5px; line-height: 1.3; padding: 6px 8px; margin-bottom: 4px; background: var(--card); border: 1px solid var(--border); color: var(--muted); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.cev-chip b { font-weight: 600; display: block; overflow: hidden; text-overflow: ellipsis; }
.cev-chip.live { color: var(--ink); border-left: 3px solid var(--evt-accent, var(--ocean)); border-color: color-mix(in srgb, var(--evt-accent, var(--ocean)) 45%, var(--border)); border-left-color: var(--evt-accent, var(--ocean)); background: color-mix(in srgb, var(--evt-accent, var(--ocean)) 12%, var(--card)); }
.cev-chip.live b { color: color-mix(in srgb, var(--evt-accent, var(--ocean)) 60%, var(--ink)); }
.cev-empty { font-size: 10.5px; color: var(--muted); opacity: 0.6; padding: 6px 0; }
.cev-pills { display: flex; flex-wrap: wrap; gap: 7px; }
.cev-pill { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface); border-radius: 999px; padding: 6px 12px; font-size: 11.5px; color: var(--ink); cursor: pointer; font-family: inherit; }
.cev-pill i { width: 11px; height: 11px; border-radius: 50%; display: block; }
.cev-pill.on { border-color: var(--evt-accent, var(--ocean)); background: color-mix(in srgb, var(--evt-accent, var(--ocean)) 12%, var(--card)); color: color-mix(in srgb, var(--evt-accent, var(--ocean)) 60%, var(--ink)); font-weight: 600; }
#clientEvtOverlay input:focus, #clientEvtOverlay select:focus, #clientEvtOverlay textarea:focus { outline: none; border-color: var(--evt-accent, var(--ocean)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--evt-accent, var(--ocean)) 20%, transparent); }
.client-ev.client-ev--shared { background: transparent; color: var(--ocean-d); border: 1.5px dashed var(--ocean); border-radius: 0; }
/* Today's column carries a faint ocean wash; the gold now-line says where the day is. */
.client-wc:hover { background: color-mix(in srgb, var(--ocean) 4%, transparent); }
.client-wc.today-col { background: color-mix(in srgb, var(--ocean) 5%, transparent); }
.client-wc.today-col:hover { background: color-mix(in srgb, var(--ocean) 8%, transparent); }
.client-nowline { position: absolute; left: 0; right: 0; height: 1px; background: #C9A56A; pointer-events: none; z-index: 2; }
.client-nowline::before { content: ''; position: absolute; left: -2px; top: -3px; width: 7px; height: 7px; border-radius: 50%; background: #C9A56A; }

/* ── Schedule layout (matches clinician) ── */
.cal-controls { display: flex; align-items: center; gap: 12px; }
.cal-controls h3 { font-size: 18px; }
.cal-view-toggle { display: flex; border: 1px solid var(--border); border-radius: 0; overflow: hidden; }
.cal-view-btn { padding: 6px 14px; font-size: 12px; font-family: var(--sans); border: none; background: transparent; cursor: pointer; color: var(--muted); transition: all 0.15s; }
.cal-view-btn.active { background: var(--ink); color: #fff; }
.client-schedule-layout { display: flex; flex-direction: column; gap: 20px; }
/* Day note — a note box for one day. A date, a writing surface, a Save.
   The old 180px label rail held a heading, a state line and a standing
   instruction beside a 420px well; all of that was scaffolding around a
   textarea. */
.client-day-notes-panel { display: block; border: 0; border-top: 1px solid var(--border); background: none; padding: 22px 0 0; margin-bottom: 56px; }
.cdnp-head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.cdnp-date { font-family: var(--serif, Georgia, serif); font-size: 19px; font-weight: 400; letter-spacing: -0.01em; color: var(--ink); }
.cdnp-status { font-family: var(--sans); font-size: 11px; color: var(--muted); }
.client-day-notes-panel textarea { width: 100%; box-sizing: border-box; display: block; resize: vertical; min-height: 150px; border: 1px solid var(--border); border-radius: 0; background: var(--card); padding: 13px 15px; font-family: var(--sans); font-size: 14px; line-height: 1.7; color: var(--ink); }
.client-day-notes-panel textarea:focus { outline: none; border-color: var(--ink); }
.cdnp-foot { display: flex; justify-content: flex-end; margin-top: 12px; }
.cdnp-foot .btn { font-size: 12.5px; }
/* ── Upcoming list ── */
.upcoming-mini { display: flex; flex-direction: column; gap: 7px; margin-top: 14px; }
.upcoming-row { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 0; font-size: 13px; }
.upcoming-row .u-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); flex-shrink: 0; }
.upcoming-row .u-time { font-size: 12px; color: var(--muted); min-width: 55px; }
.upcoming-row .u-name { flex: 1; }
.upcoming-row .u-dur  { font-size: 11px; color: var(--muted); }
.launch-btn { background: var(--green); color: #fff; border: none; padding: 9px 18px; border-radius: 0; font-size: 13px; font-family: var(--sans); cursor: pointer; font-weight: 500; transition: opacity 0.15s; }
.launch-btn:hover { opacity: 0.85; }

/* ── Sessions tab ── */
.session-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.session-row:last-child { border-bottom: none; padding-bottom: 0; }
.sr-time { font-size: 12px; color: var(--muted); min-width: 90px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.sr-client { flex: 1; min-width: 0; }
.sr-client strong { display: block; font-size: 14px; font-weight: 500; }
.sr-client span { font-size: 12px; color: var(--muted); }
.sr-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
/* Sessions section tab bar */
.svt-tabs { display:flex; gap:4px; flex-shrink:0; margin-bottom:20px; border-bottom:1px solid var(--border); padding-bottom:0; }
.svt-tab { padding:8px 18px; border-radius:var(--radius-sm) var(--radius-sm) 0 0; border:none; background:transparent; cursor:pointer; font-size:13px; font-family:var(--sans); color:var(--muted); display:flex; align-items:center; gap:6px; transition:all 0.15s; border-bottom:2px solid transparent; margin-bottom:-1px; }
.svt-tab:hover { color:var(--ink); background:var(--surface); }
.svt-tab.active { color:var(--accent); border-bottom-color:var(--accent); font-weight:500; }
/* Past session cards */
.session-card { background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 16px 18px; margin-bottom: 8px; transition: border-color 0.15s; }
.session-card:last-child { margin-bottom: 0; }
.session-card:hover { border-color: color-mix(in srgb, var(--accent) 40%, var(--border)); }
.sc-header { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.sc-date { font-size: 13px; font-weight: 600; color: var(--ink); min-width: 110px; }
.sc-pills { display: flex; gap: 6px; flex: 1; flex-wrap: wrap; align-items: center; }
.sc-pill { font-size: 11px; color: var(--muted); background: var(--card); border: 1px solid var(--border); border-radius: 99px; padding: 2px 9px; }
.sc-preview { font-size: 13px; color: var(--muted); margin-top: 8px; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-style: italic; }
.sc-ai-btn { font-size: 12px; flex-shrink: 0; margin-left: auto; }
/* Sessions stats bar */
.sessions-stats { display: flex; gap: 20px; padding: 4px 0 18px; flex-wrap: wrap; }
.sessions-stat { display: flex; flex-direction: column; gap: 2px; }
.sessions-stat-val { font-size: 20px; font-weight: 700; font-family: var(--sans); letter-spacing: -0.03em; color: var(--ink); }
.sessions-stat-lbl { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
/* AI panel */
.cs-ai-panel { width: 100%; margin-top: 12px; padding: 16px 18px; background: var(--card); border-radius: 0; border: 1px solid var(--border); font-size: 13px; }
.cs-ai-section { padding: 10px 0; border-bottom: 1px solid var(--border); display: flex; flex-direction: column; gap: 6px; }
.cs-ai-section:first-child { padding-top: 0; }
.cs-ai-section:last-child { border-bottom: none; padding-bottom: 0; }
.cs-ai-label { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .09em; color: var(--muted); }
.cs-mood-text { font-size: 13px; font-weight: 500; color: var(--ink); }
.cs-ai-text { font-size: 13px; color: var(--ink); line-height: 1.55; }
.cs-theme-chip { display: inline-flex; align-items: center; background: var(--accent-light); color: var(--accent); border-radius: 99px; padding: 3px 10px; font-size: 11px; font-weight: 500; margin: 2px 2px 0 0; }
.cs-risk-box { background: rgba(180,30,30,0.06); border: 1px solid rgba(180,30,30,0.2); border-radius: 0; padding: 10px 14px; color: #b41e1e; font-size: 13px; line-height: 1.5; }
.cs-rec-box { background: color-mix(in srgb, var(--green) 8%, transparent); border: 1px solid color-mix(in srgb, var(--green) 25%, transparent); border-radius: 0; padding: 10px 14px; color: var(--green); font-size: 13px; line-height: 1.5; }

/* ── Multi-clinician session columns ── */
.past-sessions-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px; }
.psc-column { display: flex; flex-direction: column; }
.psc-clinician-header { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; padding-bottom: 12px; border-bottom: 2px solid var(--border); }
.psc-clinician-avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 13px; overflow: hidden; flex-shrink: 0; }
.psc-clinician-avatar img { width: 100%; height: 100%; object-fit: cover; }
.psc-clinician-meta { display: flex; flex-direction: column; gap: 1px; }
.psc-clinician-name { font-size: 13px; font-weight: 600; color: var(--ink); font-family: var(--sans); letter-spacing: -0.01em; }
.psc-clinician-count { font-size: 11px; color: var(--muted); }
/* Clickable session card */
.session-card.clickable { cursor: pointer; }
.session-card.clickable:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent-light) 60%, var(--surface)); }
.session-card.clickable:hover .sc-date { color: var(--accent); }
.sc-chevron { margin-left: auto; color: var(--muted); font-size: 13px; flex-shrink: 0; transition: transform 0.15s; }
.session-card.clickable:hover .sc-chevron { transform: translateX(2px); color: var(--accent); }

/* ── Clinician cards ── */
.clinician-card { background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 16px; display: flex; gap: 14px; align-items: flex-start; transition: border-color 0.15s, box-shadow 0.15s; margin-bottom: 10px; }
.clinician-card:last-child { margin-bottom: 0; }
.clinician-card:hover { border-color: var(--accent); box-shadow: 0 2px 12px rgba(61,90,128,0.08); }
.c-avatar { width: 46px; height: 46px; border-radius: 50%; flex-shrink: 0; background: var(--accent); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 16px; box-shadow: 0 2px 8px rgba(61,90,128,0.22); overflow: hidden; }
.c-avatar.green { background: var(--green); box-shadow: 0 2px 8px rgba(45,106,79,0.22); }
.c-avatar img { width: 100%; height: 100%; object-fit: cover; }
.c-body { flex: 1; min-width: 0; }
.c-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; margin-bottom: 5px; }
.c-name { font-size: 14px; font-weight: 600; color: var(--ink); line-height: 1.25; letter-spacing: -0.01em; }
.c-spec { font-size: 12px; color: var(--muted); line-height: 1.5; }

/* ── Assignment items ── */
.assign-item { display: flex; align-items: center; gap: 11px; padding: 11px 0; border-bottom: 1px solid var(--border); }
.assign-item:first-child { padding-top: 0; }
.assign-item:last-child  { border-bottom: none; padding-bottom: 0; }
.assign-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.assign-dot.amber   { background: var(--amber); }
.assign-dot.neutral { background: transparent; border: 2px solid var(--border); }
.assign-dot.green   { background: var(--green); }
.assign-title { font-size: 13px; font-weight: 500; flex: 1; }
.assign-due   { font-size: 11px; color: var(--muted); white-space: nowrap; }

/* ── Journal entry cards ── */
.jentry-card { display: block; text-decoration: none; background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: 0; padding: 14px 16px; margin-bottom: 10px; transition: border-color 0.15s, box-shadow 0.15s; cursor: pointer; }
.jentry-card:last-child { margin-bottom: 0; }
.jentry-card.entry-green { border-left-color: var(--green); }
.jentry-card:hover { border-color: var(--accent); box-shadow: 0 2px 12px rgba(61,90,128,0.08); }
.je-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.je-date { font-size: 11px; color: var(--muted); font-weight: 500; letter-spacing: 0.04em; }
.je-excerpt { font-size: 13px; color: var(--ink); line-height: 1.6; }

/* ── Prescription cards ── */
.prx-card { background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: 0; padding: 14px 16px; margin-bottom: 10px; }
.prx-card:last-child { margin-bottom: 0; }
.prx-card.prx-warning { border-left-color: var(--amber); }
.prx-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.prx-name { font-size: 14px; font-weight: 600; font-family: var(--sans); letter-spacing: -.01em; line-height: 1.3; }
.prx-sub  { font-size: 12px; color: var(--muted); margin-top: 2px; }
.prx-detail { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; font-size: 12px; color: var(--muted); margin-bottom: 10px; }
.prx-detail strong { color: var(--ink); font-weight: 500; }
.prx-btn { display: inline-flex; align-items: center; gap: 5px; padding: 6px 13px; border-radius: 0; font-size: 12px; font-family: var(--sans); font-weight: 500; cursor: pointer; border: 1px solid var(--border); background: var(--card); color: var(--ink); transition: all .15s; }
.prx-btn:hover { border-color: var(--accent); color: var(--accent); }
.prx-btn:disabled { opacity: .45; cursor: default; pointer-events: none; }

/* ── Prescription page — full layout ── */
.stat-card .stat-label.amber { color: var(--amber); }
.stat-card .stat-label.green { color: var(--green); }
.stat-card .stat-label.red   { color: var(--red); }
.alert-banner { border-radius: 0; padding: 13px 16px; display: flex; align-items: flex-start; gap: 12px; font-size: 13px; line-height: 1.55; }
.alert-banner.amber { background: var(--amber-light); border: 1px solid rgba(181,98,10,.22); }
.alert-banner.red   { background: var(--red-light);   border: 1px solid rgba(184,50,50,.22); }
.alert-banner i { flex-shrink: 0; margin-top: 1px; font-size: 15px; }
.alert-banner.amber i { color: var(--amber); }
.alert-banner.red   i { color: var(--red); }
.alert-banner strong { display: block; font-weight: 600; margin-bottom: 2px; }
.rx-tab-bar { display: flex; border-bottom: 1px solid var(--border); padding: 0 20px; gap: 0; flex-shrink: 0; flex-wrap: wrap; }
.rx-tab { padding: 12px 15px; font-size: 13px; border: none; background: transparent; cursor: pointer; color: var(--muted); font-family: var(--sans); border-bottom: 2px solid transparent; margin-bottom: -1px; transition: all .15s; white-space: nowrap; font-weight: 400; }
.rx-tab:hover { color: var(--ink); }
.rx-tab.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 500; }
#rxTabContent { padding: 24px 26px 28px; animation: fadeIn .18s ease; }
.rx-empty { padding: 52px 24px 56px; text-align: center; }
.rx-empty-icon { font-size: 40px; color: var(--border); margin-bottom: 16px; line-height: 1; display: block; }
.rx-empty-title { font-size: 15px; font-weight: 600; font-family: var(--sans); letter-spacing: -0.01em; color: var(--ink); margin-bottom: 6px; }
.rx-empty-body { font-size: 13px; color: var(--muted); line-height: 1.7; max-width: 340px; margin: 0 auto; }
.rx-med-card { background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 20px 22px; margin-bottom: 14px; transition: border-color .15s, box-shadow .15s; }
.rx-med-card:last-child { margin-bottom: 0; }
.rx-med-card:hover { border-color: var(--accent); box-shadow: 0 2px 16px rgba(61,90,128,.07); }
.rx-med-card.expired { opacity: .6; }
.rx-med-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.rx-med-name { font-size: 17px; font-weight: 600; font-family: var(--sans); letter-spacing: -0.01em; line-height: 1.2; }
.rx-med-sub { font-size: 13px; color: var(--muted); margin-top: 3px; }
.rx-prog-label { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); font-weight: 600; margin-bottom: 4px; display: flex; justify-content: space-between; }
.rx-prog-track { background: var(--border); border-radius: 99px; height: 7px; overflow: hidden; margin-bottom: 14px; }
.rx-prog-fill { height: 100%; border-radius: 99px; transition: width .4s; }
.rx-prog-fill.green  { background: var(--green); }
.rx-prog-fill.amber  { background: var(--amber); }
.rx-prog-fill.red    { background: var(--red); }
.rx-prog-fill.accent { background: var(--accent); }
.rx-detail-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px,1fr)); gap: 10px 20px; margin-bottom: 14px; }
.rx-detail-item label { font-size: 10px; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); font-weight: 600; display: block; margin-bottom: 2px; }
.rx-detail-item span { font-size: 13px; font-weight: 500; color: var(--ink); }
.rx-instructions { font-size: 12px; color: var(--muted); background: var(--bg); border: 1px solid var(--border); border-radius: 0; padding: 10px 12px; line-height: 1.6; margin-bottom: 14px; }
.rx-card-foot { display: flex; gap: 8px; align-items: center; padding-top: 14px; border-top: 1px solid var(--border); flex-wrap: wrap; }
.rfq-group-label { font-size: 11px; text-transform: uppercase; letter-spacing: .12em; color: var(--muted); font-weight: 600; margin: 18px 0 10px; display: flex; align-items: center; gap: 8px; }
.rfq-group-label:first-child { margin-top: 0; }
.rfq-group-label::after { content: ''; flex: 1; height: 1px; background: var(--border); }
.rfq-row { display: flex; align-items: flex-start; gap: 14px; padding: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 0; margin-bottom: 8px; }
.rfq-row:last-child { margin-bottom: 0; }
.rfq-icon { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 15px; flex-shrink: 0; }
.rfq-icon.pending  { background: var(--amber-light); color: var(--amber); }
.rfq-icon.approved { background: var(--green-light);  color: var(--green); }
.rfq-icon.denied   { background: var(--red-light);    color: var(--red); }
.rfq-body { flex: 1; min-width: 0; }
.rfq-med  { font-size: 14px; font-weight: 600; font-family: var(--sans); letter-spacing: -0.01em; }
.rfq-meta { font-size: 12px; color: var(--muted); margin-top: 2px; }
.rfq-note { font-size: 12px; color: var(--ink); margin-top: 6px; font-style: italic; }
.rx-pharm-card { background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 20px 22px; }
.rx-pharm-row { display: flex; align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.rx-pharm-row:last-child { border-bottom: none; }
.rx-pharm-row i { width: 18px; text-align: center; color: var(--muted); flex-shrink: 0; font-size: 15px; }
.rx-pharm-lbl { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); min-width: 72px; font-weight: 600; flex-shrink: 0; }
.rx-pharm-val { flex: 1; color: var(--ink); font-weight: 500; }
.rx-form-stack { display: flex; flex-direction: column; gap: 14px; }
.rx-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.rx-form-stack label { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 500; display: block; margin-bottom: 5px; }
.rx-form-stack input, .rx-form-stack textarea { width: 100%; background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 10px 13px; font-size: 13px; font-family: var(--sans); font-weight: 300; color: var(--ink); outline: none; transition: border-color .2s; box-sizing: border-box; }
.rx-form-stack input:focus, .rx-form-stack textarea:focus { border-color: var(--accent); }
.rx-form-stack textarea { resize: vertical; min-height: 72px; }
.rx-interact-item { border-radius: 0; padding: 14px 16px; margin-bottom: 10px; }
.rx-interact-item:last-child { margin-bottom: 0; }
.rx-interact-item.contraindicated { background: var(--red-light);   border: 1px solid rgba(184,50,50,.25); }
.rx-interact-item.high            { background: var(--amber-light); border: 1px solid rgba(181,98,10,.25); }
.rx-interact-item.moderate        { background: #fff8e8;            border: 1px solid rgba(181,134,10,.2); }
.rx-interact-meds { font-size: 13px; font-weight: 600; font-family: var(--sans); letter-spacing: -0.01em; display: flex; align-items: center; gap: 8px; margin-bottom: 6px; flex-wrap: wrap; }
.rx-interact-body { font-size: 13px; line-height: 1.6; color: var(--ink); }
.rx-interact-cta  { font-size: 12px; color: var(--muted); margin-top: 6px; display: flex; align-items: center; gap: 5px; }
.rx-allclear { background: var(--green-light); border: 1px solid rgba(45,106,79,.2); border-radius: 0; padding: 20px 22px; display: flex; align-items: center; gap: 16px; }
.rx-allclear-icon { width: 44px; height: 44px; background: var(--green); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.rx-hist-search { display: flex; align-items: center; gap: 8px; border: 1px solid var(--border); border-radius: 0; padding: 8px 12px; background: var(--surface); margin-bottom: 16px; }
.rx-hist-search i { color: var(--muted); flex-shrink: 0; }
.rx-hist-search input { border: none; background: transparent; font-size: 13px; font-family: var(--sans); color: var(--ink); outline: none; flex: 1; }
.rx-hist-row { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.rx-hist-row:last-child { border-bottom: none; }
.rx-hist-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; background: var(--border); }
.rx-hist-dot.cancelled { background: var(--red); }
.rx-hist-info { flex: 1; min-width: 0; }
.rx-hist-name { font-weight: 600; font-family: var(--sans); letter-spacing: -0.01em; }
.rx-hist-sub  { font-size: 12px; color: var(--muted); margin-top: 1px; }
.rx-modal-overlay { position: fixed; inset: 0; background: rgba(26,24,20,.48); backdrop-filter: blur(4px); z-index: 400; display: none; align-items: center; justify-content: center; padding: 24px; }
.rx-modal-overlay.open { display: flex; }
.rx-modal { background: var(--card); border-radius: 0; width: min(500px,100%); max-height: 88vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(26,24,20,.22); animation: fadeUp .2s ease; }
.rx-modal-hd { display: flex; align-items: center; justify-content: space-between; padding: 20px 24px; border-bottom: 1px solid var(--border); position: sticky; top: 0; background: var(--card); z-index: 1; }
.rx-modal-hd h3 { font-size: 16px; font-family: var(--sans); font-weight: 600; letter-spacing: -0.01em; margin: 0; }
.rx-modal-bd { padding: 24px; display: flex; flex-direction: column; gap: 16px; }
.rx-modal-ft { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid var(--border); }
.rx-modal-info { background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 14px 16px; }
.rx-modal-info .info-row { display: flex; justify-content: space-between; font-size: 13px; padding: 4px 0; }
.rx-modal-info .info-row:not(:last-child) { border-bottom: 1px solid var(--border); }
.rx-modal-info .info-row label { color: var(--muted); font-size: 12px; font-weight: 500; }
.rx-modal-info .info-row span  { font-weight: 600; color: var(--ink); }
.rx-modal-bd label { font-size: 11px; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); font-weight: 500; display: block; margin-bottom: 5px; }
.rx-modal-bd textarea { width: 100%; background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 10px 13px; font-size: 13px; font-family: var(--sans); color: var(--ink); outline: none; resize: vertical; min-height: 88px; transition: border-color .2s; box-sizing: border-box; }
.rx-modal-bd textarea:focus { border-color: var(--accent); }

/* ── Note items ── */
.note-item { display: flex; gap: 11px; align-items: flex-start; padding: 11px 0; border-bottom: 1px solid var(--border); }
.note-item:first-child { padding-top: 0; }
.note-item:last-child  { border-bottom: none; padding-bottom: 0; }
.note-bar { width: 3px; border-radius: 99px; align-self: stretch; flex-shrink: 0; min-height: 26px; }
.note-bar.purple { background: var(--purple); }
.note-bar.blue   { background: var(--accent); }
.note-bar.green  { background: var(--green); }
.note-bar.gold   { background: var(--gold); }
.note-title { font-size: 13px; font-weight: 500; line-height: 1.3; }
.note-body  { font-size: 12px; color: var(--muted); margin-top: 2px; }

/* ── AI Summary Card ── */
.ai-summary-card {
  background: color-mix(in srgb, var(--accent) 7%, var(--bg));
  border: 1px solid color-mix(in srgb, var(--accent) 22%, transparent);
  border-left: 3px solid var(--accent);
  border-radius: 0; padding: 14px 16px; margin-top: 14px;
}
.ai-summary-card .ais-header { display: flex; align-items: center; gap: 7px; justify-content: space-between; margin-bottom: 10px; }
.ai-summary-card .ais-label { font-size: 11px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent); display: flex; align-items: center; gap: 5px; }
.ai-summary-card .ais-dismiss { font-size: 11px; color: var(--muted); background: none; border: none; cursor: pointer; padding: 0; }
.ai-summary-card ul { margin: 0; padding-left: 18px; display: flex; flex-direction: column; gap: 5px; }
.ai-summary-card li { font-size: 13px; line-height: 1.55; color: var(--ink); }
.ai-summary-card .ais-loading { font-size: 13px; color: var(--muted); display: flex; align-items: center; gap: 8px; }

/* ── Group Sessions ── */
.gs-session-card { border: 1px solid var(--border); border-radius: 0; margin-bottom: 12px; overflow: hidden; }
.gs-session-header { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: var(--surface); cursor: pointer; user-select: none; }
.gs-session-header h4 { font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: -0.01em; margin: 0; flex: 1; }
.gs-session-date { font-size: 11px; color: var(--muted); }
.gs-session-body { padding: 14px 16px; border-top: 1px solid var(--border); }
.gs-reflection-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); margin-bottom: 6px; }
.gs-reflection-textarea { width: 100%; border: 1px solid var(--border); border-radius: 0; padding: 9px 12px; font-family: var(--sans); font-size: 13px; color: var(--ink); background: var(--bg); resize: vertical; min-height: 70px; box-sizing: border-box; margin-bottom: 10px; }
.gs-reflection-textarea:focus { outline: none; border-color: var(--accent); }
.gs-share-row { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.gs-share-toggle { position: relative; display: inline-block; width: 36px; height: 20px; }
.gs-share-toggle input { opacity: 0; width: 0; height: 0; }
.gs-share-slider { position: absolute; inset: 0; background: var(--border); border-radius: 20px; cursor: pointer; transition: background .2s; }
.gs-share-slider:before { content: ''; position: absolute; width: 14px; height: 14px; left: 3px; bottom: 3px; background: #fff; border-radius: 50%; transition: transform .2s; }
.gs-share-toggle input:checked + .gs-share-slider { background: var(--accent); }
.gs-share-toggle input:checked + .gs-share-slider:before { transform: translateX(16px); }
.gs-share-label { font-size: 12px; color: var(--muted); }
.gs-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.gs-new-form { background: var(--surface); border: 1px dashed var(--border); border-radius: 0; padding: 16px; margin-bottom: 12px; display: none; }
.gs-new-form label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: var(--muted); display: block; margin-bottom: 5px; }
.gs-new-form input { width: 100%; border: 1px solid var(--border); border-radius: 0; padding: 8px 12px; font-family: var(--sans); font-size: 13px; color: var(--ink); background: var(--card); box-sizing: border-box; margin-bottom: 12px; }
.gs-new-form input:focus { outline: none; border-color: var(--accent); }
.gs-new-actions { display: flex; gap: 8px; }

/* ── New Session Modal ── */
.ns-modal-overlay { position:fixed;inset:0;background:rgba(26,24,20,.5);backdrop-filter:blur(4px);z-index:1200;display:none;align-items:center;justify-content:center;padding:24px; }
.ns-modal-overlay.open { display:flex; }
.ns-modal { background:var(--card);border-radius:var(--radius-lg);width:min(560px,100%);max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px rgba(26,24,20,.22);animation:fadeUp .2s ease; }
.ns-modal-hd { display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--card);z-index:1; }
.ns-modal-hd h3 { font-size:16px;font-weight:600;letter-spacing:-0.01em;margin:0; }
.ns-modal-body { padding:24px;display:flex;flex-direction:column;gap:14px; }
.ns-modal-body label { font-size:11px;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;display:block;margin-bottom:5px; }
.ns-modal-body input,.ns-modal-body select,.ns-modal-body textarea { width:100%;border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 12px;font-family:var(--sans);font-size:13px;color:var(--ink);background:var(--bg);box-sizing:border-box;transition:border-color .15s; }
.ns-modal-body input:focus,.ns-modal-body select:focus,.ns-modal-body textarea:focus { outline:none;border-color:var(--accent); }
.ns-modal-body textarea { resize:vertical;min-height:72px; }
.ns-modal-row { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.ns-modal-info { background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 14px;font-size:12px;color:var(--muted);line-height:1.6; }
.ns-modal-info strong { color:var(--ink); }
.ns-modal-ft { display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 24px;border-top:1px solid var(--border); }
.ns-path-cards { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.ns-path-card { background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:24px 16px;cursor:pointer;text-align:center;transition:border-color .15s,box-shadow .15s;font-family:var(--sans); }
.ns-path-card:hover { border-color:var(--accent);box-shadow:0 2px 12px rgba(67,56,202,.08); }
.ns-path-icon { font-size:24px;color:var(--accent);margin-bottom:10px; }
.ns-path-label { font-size:14px;font-weight:600;color:var(--ink);letter-spacing:-0.01em;margin-bottom:4px; }
.ns-path-desc { font-size:12px;color:var(--muted);line-height:1.5; }

/* ── Note Modal ── */
.note-modal-overlay { position: fixed; inset: 0; background: rgba(26,24,20,0.5); z-index: 900; display: flex; align-items: center; justify-content: center; animation: fadeIn .15s ease; }
.note-modal { background: var(--card); border-radius: 0; padding: 28px 30px; width: 420px; max-width: 92vw; box-shadow: 0 12px 48px rgba(0,0,0,0.18); }
.note-modal h3 { font-family: var(--sans); font-size: 16px; font-weight: 600; letter-spacing: -0.01em; margin: 0 0 20px; }
.note-modal label { font-size: 11px; font-weight: 500; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; display: block; margin-bottom: 5px; }
.note-modal input, .note-modal textarea, .note-modal select { width: 100%; border: 1px solid var(--border); border-radius: 0; padding: 9px 12px; font-family: var(--sans); font-size: 13px; color: var(--ink); background: var(--bg); margin-bottom: 16px; box-sizing: border-box; transition: border-color .15s; }
.note-modal input:focus, .note-modal textarea:focus, .note-modal select:focus { outline: none; border-color: var(--accent); }
.note-modal textarea { height: 84px; resize: vertical; }
.note-modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 6px; }

/* ── Toast ── */
.toast { position: fixed; bottom: 24px; right: 24px; background: var(--ink); color: #fff; padding: 12px 20px; border-radius: 0; font-size: 13px; font-family: var(--sans); box-shadow: 0 4px 20px rgba(26,24,20,0.2); transform: translateY(80px); opacity: 0; transition: all 0.3s; z-index: 9999; }
.toast.show { transform: translateY(0); opacity: 1; }

/* ── Appointment Popover ── */
#clientApptPop { opacity:0; transform:translate(-50%,-52%); transition:opacity .18s,transform .18s; }
#clientApptPop.open { opacity:1; transform:translate(-50%,-50%); }
.appt-pop-header { padding:14px 16px 10px; }
.appt-pop-body { padding:0 16px 10px; }
.appt-pop-footer { display:flex;gap:8px;align-items:center;padding:10px 16px;border-top:1px solid var(--border); }

/* ── Clinicians section ── */
.friends-hero { background: var(--ink); border-radius: 0; padding: 40px 48px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.friends-hero-text { flex: 1; min-width: 200px; }
.friends-hero h1 { color: #fff; font-family: var(--serif); font-size: clamp(26px, 3vw, 34px); letter-spacing: 0.015em; line-height: 1.1; margin: 6px 0 4px; }
.friends-hero-sub { font-size: 13px; color: rgba(255,255,255,.5); line-height: 1.6; margin-top: 6px; max-width: 380px; }
.fh-eyebrow { font-family: var(--sans); font-size: 10.5px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.fh-stats { display: flex; border: 1px solid rgba(255,255,255,.12); border-radius: 0; overflow: hidden; flex-shrink: 0; }
.fh-stat { padding: 13px 20px; display: flex; flex-direction: column; gap: 3px; border-right: 1px solid rgba(255,255,255,.1); min-width: 78px; }
.fh-stat:last-child { border-right: none; }
.fh-num { font-size: 22px; font-weight: 600; font-family: var(--sans); color: #fff; line-height: 1.1; letter-spacing: -0.02em; }
.fh-label { font-size: 10px; color: rgba(255,255,255,.4); letter-spacing: .1em; text-transform: uppercase; font-weight: 500; }
.fr-body { background: var(--card); border-radius: 0; border: 1px solid var(--border); overflow: hidden; margin-top: 20px; }
.fr-tabs { display: flex; border-bottom: 2px solid var(--border); padding: 0 4px; overflow-x: auto; scrollbar-width: none; }
.fr-tab { padding: 13px 18px; font-size: 13px; border: none; background: transparent; cursor: pointer; color: var(--muted); font-family: var(--sans); border-bottom: 2px solid transparent; margin-bottom: -2px; transition: all .15s; display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.fr-tab.active { color: var(--accent); border-bottom-color: var(--accent); font-weight: 500; }
.fr-tab-count { font-size: 11px; padding: 1px 6px; border-radius: 20px; background: var(--surface); font-weight: 600; min-width: 18px; text-align: center; }
.fr-tab.active .fr-tab-count { background: var(--accent-light); color: var(--accent); }
.fr-panel { display: none; padding: 24px; }
.fr-panel.active { display: block; }

/* Directory visibility banner (driven by profiles.directory_visible) */
.dv-banner { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; padding: 14px 18px; border-radius: 0; background: var(--surface); border: 1px solid var(--border); }
.dv-banner.visible { background: color-mix(in srgb, var(--green) 8%, var(--card)); border-color: color-mix(in srgb, var(--green) 30%, var(--border)); }
.dv-banner-icon { font-size: 18px; color: var(--muted); flex-shrink: 0; }
.dv-banner.visible .dv-banner-icon { color: var(--green); }
.dv-banner-body { flex: 1; min-width: 0; }
.dv-banner-title { font-size: 13.5px; font-weight: 600; color: var(--ink); letter-spacing: -0.01em; margin-bottom: 2px; }
.dv-banner-sub { font-size: 12px; color: var(--muted); line-height: 1.5; }
.dv-banner-cta { font-size: 12px; padding: 7px 14px; flex-shrink: 0; }
@media (max-width: 720px) { .dv-banner { flex-direction: column; align-items: stretch; text-align: left; } .dv-banner-cta { align-self: flex-start; } }
.fr-two-col { display: grid; grid-template-columns: 1fr 300px; gap: 24px; align-items: start; }
.fr-search-wrap { position: relative; margin-bottom: 16px; }
.fr-search-wrap input { width: 100%; padding: 10px 14px 10px 38px; border: 1px solid var(--border); border-radius: 0; font-family: var(--sans); font-size: 13px; background: var(--surface); color: var(--ink); outline: none; box-sizing: border-box; }
.fr-search-wrap input:focus { border-color: var(--accent); }
.fr-search-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 14px; pointer-events: none; }
.fr-list { display: flex; flex-direction: column; }
.fr-row { display: flex; align-items: center; gap: 13px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.fr-row:last-child { border-bottom: none; }
.fr-avatar { width: 42px; height: 42px; border-radius: 50%; background: var(--accent-light); color: var(--accent); font-size: 14px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; font-family: var(--sans); }
.fr-avatar .p-dot { position: absolute; bottom: 1px; right: 1px; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--card); }
.fr-info { flex: 1; min-width: 0; }
.fr-name { font-size: 14px; font-weight: 500; font-family: var(--sans); color: var(--ink); letter-spacing: -0.01em; }
.fr-status-line { font-size: 12px; color: var(--muted); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fr-actions { display: flex; gap: 6px; flex-shrink: 0; }
.fr-actions .btn { padding: 6px 12px; font-size: 12px; }
.fr-req-col-head { font-size: 12px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); margin-bottom: 16px; }
.fr-req-card { background: var(--surface); border-radius: 0; padding: 16px 18px; display: flex; align-items: center; gap: 13px; margin-bottom: 12px; border: 1px solid var(--border); }
.fr-req-card:last-child { margin-bottom: 0; }
.fr-req-av { width: 44px; height: 44px; border-radius: 50%; background: var(--accent-light); color: var(--accent); font-size: 15px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; font-family: var(--sans); }
.fr-req-info { flex: 1; min-width: 0; }
.fr-req-name { font-size: 14px; font-weight: 500; font-family: var(--sans); letter-spacing: -0.01em; }
.fr-req-meta { font-size: 12px; color: var(--muted); margin-top: 2px; }
.fr-req-btns { display: flex; gap: 6px; flex-shrink: 0; }
.fr-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 48px 24px; gap: 10px; color: var(--muted); text-align: center; }
.fr-empty i { font-size: 36px; opacity: 0.3; }
.fr-empty p { font-size: 13px; line-height: 1.6; max-width: 280px; }
.fr-filter-btn { font-size: 11px; padding: 4px 12px; border-radius: 999px; border: 1px solid var(--border); background: transparent; cursor: pointer; font-family: var(--sans); color: var(--muted); transition: all 0.15s; display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.fr-filter-btn.active { background: var(--ink); color: #fff; border-color: var(--ink); }
.fr-filter-btn:hover:not(.active) { background: var(--surface); color: var(--ink); }

/* ── Assignments section: full-width lanes, detail swaps in place ── */
.da-segs { display: flex; gap: 26px; font-size: 14.5px; border-bottom: 1px solid var(--border); margin-bottom: 16px; }
.da-seg { padding-bottom: 10px; color: var(--muted); cursor: pointer; }
.da-seg:hover { color: var(--ink); }
.da-seg.active { color: var(--ink); font-weight: 600; border-bottom: 2px solid var(--ink); margin-bottom: -1px; }
.da-view { display: none; }
.da-view.active { display: block; }
.da-filter-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.da-clin-chip { font-size: 12px; font-family: var(--sans); border: 1px solid var(--border); background: var(--bg); padding: 6px 14px; color: var(--ink-soft); cursor: pointer; transition: border-color .15s, background .15s; }
.da-clin-chip:hover { border-color: var(--ink); color: var(--ink); }
.da-clin-chip.active { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.da-asgn-search { width: 100%; box-sizing: border-box; padding: 10px 14px; font-size: 13px; border: 1px solid var(--border); border-radius: 0; background: var(--surface); font-family: var(--sans); color: var(--ink); margin-bottom: 6px; }
.da-asgn-search:focus { border-color: var(--accent); outline: none; }
.da-swimlane-hdr { font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin: 16px 0 8px; display: flex; align-items: center; gap: 8px; }
.da-swimlane-hdr .count { background: var(--ocean-w); border: 1px solid rgba(94,110,132,.36); color: var(--ocean-d); font-size: 10px; font-weight: 600; padding: 1px 7px; border-radius: 999px; letter-spacing: 0; }
.da-swimlane-hdr.done { color: var(--green); }
.da-swimlane-hdr.done .count { background: var(--green-light); color: var(--green); border-color: rgba(90,107,87,.26); }
.da-card { border: 1px solid var(--border); background: var(--card); padding: 16px 20px; margin-bottom: 8px; display: grid; grid-template-columns: 1fr auto; gap: 2px 24px; align-items: center; cursor: pointer; transition: border-color .15s; user-select: none; }
.da-card:hover { border-color: var(--accent); }
.da-card.quiet { background: var(--surface); }
.da-card.quiet .da-card-title { color: var(--ink-soft); }
.da-card.dragging { opacity: .4; }
.da-card.drag-over { border-top: 2px solid var(--accent); }
.da-card-title { font-family: var(--serif); font-size: 19px; font-weight: 600; line-height: 1.3; color: var(--ink); }
.da-card-meta { font-size: 12.5px; color: var(--muted); margin-top: 6px; }
.da-meta-row { line-height: 1.65; }
.da-meta-row:first-child { margin-bottom: 1px; }
.da-card-meta b { color: var(--ink-soft); font-weight: 600; }
/* "From" labels the name so it reads as a person, not a stray string. */
.da-from { color: var(--whisper, #A7A096); }
.da-card-meta .due-soon { color: var(--amber); font-weight: 600; }
.da-card-desc { font-size: 12.5px; color: var(--ink-soft); line-height: 1.5; margin-top: 8px; max-width: 680px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.da-card-right { grid-row: 1 / span 3; grid-column: 2; display: flex; flex-direction: column; align-items: flex-end; gap: 7px; }
.da-card-prog { font-size: 11.5px; color: var(--muted); }
/* detail */
.da-det-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.da-dcols { display: flex; gap: 32px; align-items: flex-start; flex-wrap: wrap; margin-top: 6px; }
.da-dcol-l { flex: 1.25; min-width: 300px; }
.da-dcol-r { flex: 1; min-width: 280px; }
.da-sub-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.da-sub-card.slot { background: var(--surface); border-style: dashed; color: var(--muted); font-size: 12.5px; }
.da-await { font-size: 12px; color: var(--muted); display: inline-flex; gap: 5px; align-items: center; }
.da-detail-title { font-family: var(--serif); font-size: 26px; font-weight: 400; line-height: 1.3; max-width: 720px; margin-top: 10px; }
.da-share-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); background:var(--ink); color:#fff; font-size:13px; font-family:var(--sans); padding:10px 20px; border-radius:var(--radius-sm); z-index:9999; opacity:0; transition:opacity .2s; pointer-events:none; }
.da-detail-meta { font-size: 13px; color: var(--muted); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 10px 0 16px; }
.da-detail-meta b { color: var(--ink-soft); font-weight: 600; }
.da-detail-meta .da-from { color: var(--whisper, #A7A096); }
.da-desc { font-size: 13.5px; color: var(--ink-soft); line-height: 1.65; background: var(--surface); border: 1px solid var(--border); border-radius: 0; padding: 15px 19px; white-space: pre-wrap; max-width: 820px; margin-bottom: 16px; }
.da-section-lbl { font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 10px; }
.da-sub-card { border: 1px solid var(--border); border-radius: 0; padding: 13px 15px; background: var(--surface); margin-bottom: 9px; }
.da-sub-num { font-size: 11px; font-weight: 600; color: var(--accent); text-transform: uppercase; letter-spacing: .07em; margin-bottom: 6px; }
.da-sub-notes { font-size: 13px; color: var(--ink); line-height: 1.55; margin-bottom: 6px; white-space: pre-wrap; }
.da-sub-file { font-size: 12px; color: var(--accent); text-decoration: none; display: inline-flex; align-items: center; gap: 5px; margin-bottom: 6px; }
.da-sub-file:hover { text-decoration: underline; }
.da-sub-time { font-size: 11px; color: var(--muted); }
.da-feedback-box { background: var(--accent-light); border: 1px solid rgba(61,90,128,.18); border-radius: 0; padding: 14px 16px; }
.da-feedback-who { font-size: 11px; color: var(--accent); font-weight: 500; text-transform: uppercase; letter-spacing: .07em; margin-bottom: 7px; display: flex; align-items: center; gap: 5px; }
.da-feedback-text { font-size: 13px; color: var(--ink); line-height: 1.6; white-space: pre-wrap; }
.da-submit-form { background: var(--card); border: 1px solid var(--border); border-radius: 0; padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; }
.da-submit-form h4 { font-size: 14px; font-weight: 600; font-family: var(--sans); letter-spacing: -0.01em; }
.da-file-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.da-file-label { display: inline-flex; align-items: center; gap: 6px; padding: 7px 13px; border: 1px solid var(--border); border-radius: 0; font-size: 13px; font-family: var(--sans); color: var(--muted); cursor: pointer; transition: all 0.15s; background: var(--surface); }
.da-file-label:hover { border-color: var(--ink); color: var(--ink); }
.da-file-name { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 200px; }
/* My Lists */
.da-lists-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.da-lists-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 14px; align-items: start; }
.da-general-section { background: var(--card); border: 1px solid var(--accent); border-radius: 0; padding: 18px 20px; }
.da-topic-section { background: var(--card); border: 1px solid var(--border); border-radius: 0; padding: 18px 20px; }
.da-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.da-section-head-title { font-size: 16.5px; font-weight: 400; font-family: var(--serif); margin: 0 0 2px; }
.da-section-head-sub { font-size: 12px; color: var(--muted); margin: 0; }
.da-task-list { display: flex; flex-direction: column; }
.da-task-item { display: flex; align-items: center; gap: 11px; padding: 8px 10px; border-radius: 0; border: 1px solid transparent; transition: background 0.12s; }
.da-task-item:hover { background: var(--surface); border-color: var(--border); }
.da-task-item input[type=checkbox] { width: 15px; height: 15px; flex-shrink: 0; accent-color: var(--accent); cursor: pointer; }
.da-task-text { font-size: 13px; flex: 1; min-width: 0; line-height: 1.4; }
.da-task-item.done .da-task-text { color: var(--muted); text-decoration: line-through; }
.da-task-del { opacity: 0; background: none; border: none; color: var(--muted); font-size: 12px; cursor: pointer; padding: 2px 4px; border-radius: 4px; transition: opacity 0.15s, color 0.15s; flex-shrink: 0; }
.da-task-item:hover .da-task-del { opacity: 1; }
.da-task-del:hover { color: var(--red); background: var(--red-light); }
.da-add-row { display: flex; gap: 8px; margin-top: 10px; }
.da-add-input { flex: 1; padding: 8px 12px; font-size: 13px; border-radius: 0; border: 1px solid var(--border); background: var(--surface); font-family: var(--sans); transition: border-color 0.15s; }
.da-add-input:focus { border-color: var(--accent); background: var(--card); outline: none; }
.da-add-btn { padding: 8px 13px; background: var(--accent); color: #fff; border: none; border-radius: 0; font-size: 13px; font-family: var(--sans); cursor: pointer; transition: opacity 0.15s; flex-shrink: 0; }
.da-add-btn:hover { opacity: 0.85; }
.da-progress { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--border); }
.da-progress-bar { flex: 1; height: 4px; background: var(--border); border-radius: 2px; overflow: hidden; }
.da-progress-fill { height: 100%; background: var(--accent); border-radius: 2px; transition: width 0.4s ease; }
.da-progress-text { font-size: 11px; color: var(--muted); white-space: nowrap; }
.da-task-item { cursor: pointer; }
.da-task-meta { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 2px; }
.da-task-meta-chip { font-size: 10px; padding: 1px 7px; border-radius: 999px; display: inline-flex; align-items: center; gap: 3px; white-space: nowrap; }
.da-task-meta-chip.due { background: var(--amber-light); color: var(--amber); border: 1px solid rgba(181,98,10,.15); }
.da-task-meta-chip.due.overdue { background: var(--red-light); color: var(--red); border-color: rgba(184,50,50,.15); }
.da-task-meta-chip.priority-high { background: var(--red-light); color: var(--red); border: 1px solid rgba(184,50,50,.15); }
.da-task-meta-chip.priority-med { background: var(--amber-light); color: var(--amber); border: 1px solid rgba(181,98,10,.15); }
.da-task-meta-chip.priority-low { background: var(--accent-light); color: var(--accent); border: 1px solid rgba(61,90,128,.15); }
.da-task-meta-chip.has-notes { background: var(--surface); color: var(--muted); border: 1px solid var(--border); }
.da-task-item.done .da-task-meta-chip { opacity: 0.45; }
.da-fchip { font-size: 12px; padding: 6px 14px; border-radius: 0; border: 1px solid var(--border); background: var(--bg); cursor: pointer; font-family: var(--sans); color: var(--ink-soft); transition: border-color .15s, background .15s; }
.da-fchip:hover { border-color: var(--ink); color: var(--ink); }
.da-fchip.active { background: var(--ink); color: var(--bg); border-color: var(--ink); }
.da-lists-empty { text-align: center; padding: 36px 20px; color: var(--muted); border: 1px dashed var(--border); border-radius: 0; margin-top: 4px; }
.da-lists-empty p { font-size: 13px; line-height: 1.7; max-width: 220px; margin: 0 auto; }

/* ── Clinicians module: Journal tab (shared entries + clinician feedback) ── */
.clinj-card { border: 1px solid var(--border); border-radius: 0; background: var(--card); padding: 16px 18px; margin-bottom: 12px; }
.clinj-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.clinj-subject { font-size: 14px; font-weight: 600; color: var(--ink); display: block; letter-spacing: -0.01em; }
.clinj-meta { font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.clinj-fb { border-left: 3px solid var(--accent); background: var(--accent-light); padding: 10px 14px; }
.clinj-fb-label { font-size: 10.5px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--accent); margin-bottom: 6px; display: flex; align-items: center; gap: 5px; }
.clinj-fb-text { font-size: 13px; line-height: 1.65; color: var(--ink); white-space: pre-wrap; }
.clinj-fb-empty { font-size: 12px; color: var(--muted); background: var(--surface); border: 1px dashed var(--border); padding: 10px 14px; display: flex; align-items: center; }
.clinj-actions { margin-top: 12px; display: flex; justify-content: flex-end; }
/* Spinner */
.da-spinner { display: inline-block; width: 16px; height: 16px; border: 2px solid var(--border); border-top-color: var(--muted); border-radius: 50%; animation: da-spin .8s linear infinite; }
.spinner { display: inline-block; width: 13px; height: 13px; border: 2px solid rgba(255,255,255,0.35); border-top-color: #fff; border-radius: 50%; animation: da-spin .8s linear infinite; vertical-align: middle; margin-right: 6px; }
@keyframes da-spin { to { transform: rotate(360deg); } }
@keyframes da-fadeup { from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)} }

/* ── Stepped responsive ── */
@media (max-width: 1200px) {
  .hub-shell { grid-template-columns: 200px 1fr; }
  .hub-shell.sidebar-collapsed { grid-template-columns: 62px 1fr; }
}
@media (max-width: 1020px) {
  .hub-shell { grid-template-columns: 170px 1fr; }
  .hub-shell.sidebar-collapsed { grid-template-columns: 62px 1fr; }
  /* The rail is still a column here. Dropping the group labels left sixteen
     undifferentiated rows, which is harder to scan than the labels are
     expensive — so they stay and tighten instead. */
  .sidebar-section-label { font-size: 9px; letter-spacing: 0.16em; padding-top: 12px; padding-bottom: 4px; }
}
@media (max-width: 900px) {
  .hub-shell { grid-template-columns: 1fr; }
  .hub-sidebar { position: relative; height: auto; flex-direction: row; flex-wrap: wrap; padding: 10px 12px; gap: 4px; }
  /* Wrapped into a row, a label still separates its group as long as it
     claims the full width — the items then flow underneath it. */
  .sidebar-section-label { flex: 0 0 100%; width: 100%; margin: 8px 0 2px; padding: 0; font-size: 9px; letter-spacing: 0.16em; }
  .sidebar-section-label:first-child { margin-top: 0; }
  .sidebar-profile { display: none; }
  .hub-main { padding: 0; }
  .ov-hero { padding: 32px 20px 0; }
  .ov-stat-tiles { margin: 0 -20px; }
  .ov-stat-tile:first-child { padding-left: 20px; }
  .ov-stat-tile:last-child { padding-right: 20px; }
  .ov-body { padding: 20px 16px 32px; grid-template-columns: 1fr; }
  .section:not(#section-overview) { padding: 20px 16px 32px; }
}
@media (max-width: 680px) {
  .hub-main { padding: 0; }
}

/* ── Friends Widget ── */
.ov-grid-3 { display: grid; grid-template-columns: 1fr 1fr 240px; gap: 20px; align-items: start; }
.fw-body { overflow-y: auto; max-height: 228px; scrollbar-width: thin; scrollbar-color: var(--border) transparent; }
.friend-row { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--border); }
.friend-row:last-child { border-bottom: none; }
.friend-av { width: 30px; height: 30px; border-radius: 50%; background: var(--accent-light); color: var(--accent); font-size: 11px; font-weight: 600; display: flex; align-items: center; justify-content: center; flex-shrink: 0; position: relative; }
.p-dot { width: 8px; height: 8px; border-radius: 50%; border: 2px solid var(--card); position: absolute; bottom: -1px; right: -1px; }
.p-dot.online { background: var(--green); }
.p-dot.offline { background: var(--border); }
.friend-name-cell { font-size: 13px; font-weight: 500; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fw-pending { display: flex; align-items: center; gap: 8px; padding: 8px 0 10px; border-bottom: 1px solid var(--border); margin-bottom: 2px; font-size: 12px; color: var(--gold); }
.friend-msg-btn { padding: 4px 9px; font-size: 11px; border-radius: 20px; border: 1px solid var(--border); background: transparent; color: var(--muted); cursor: pointer; font-family: var(--sans); transition: all .15s; flex-shrink: 0; }
.friend-msg-btn:hover { background: var(--accent); color: #fff; border-color: var(--accent); }

/* ══════════════════════════════════════════
   Overview Tab — Hero, Two-col Body,
   Mini Calendar, Friends Column
   ══════════════════════════════════════════ */

/* ── Hero banner — LUXE editorial paper card, HARD edges, touches sidebar ── */
.ov-hero {
  background: var(--paper);
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  padding: 56px 64px 0;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
  box-shadow:
    0 1px 0 rgba(92,143,168,0.06),
    0 20px 48px -22px rgba(31,61,82,0.22);
}
/* Ocean gradient rail on top — the luxe signature */
.ov-hero::before {
  content: '';
  position: absolute; left: 0; right: 0; top: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--ocean-d) 0%, var(--ocean) 35%, var(--ocean-f) 65%, var(--ocean) 100%);
}
.ov-hero-inner {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 20px;
  flex-wrap: wrap; margin-bottom: 28px;
}
.ov-hero-text { flex: 1; min-width: 180px; }
.ov-hero-text h2 {
  font-family: var(--serif);
  font-weight: 300;
  font-variation-settings: "opsz" 96, "SOFT" 50;
  font-size: clamp(28px, 4vw, 48px);
  color: var(--ink);
  letter-spacing: -0.025em;
  line-height: 1.0;
  margin: 8px 0 6px;
}
.ov-hero-text h2 em {
  font-style: italic;
  color: var(--ocean-d);
  font-variation-settings: "opsz" 96, "SOFT" 100, "wght" 300;
}
.ov-hero-sub { font-size: 14px; color: var(--ink-soft); margin-top: 4px; font-family: var(--serif); font-weight: 350; font-variation-settings: "opsz" 24, "SOFT" 50; }
.ov-hero-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: flex-start; }

/* ── Stat tiles inside hero — editorial column grid ── */
.ov-stat-tiles {
  display: flex;
  border-top: 1px solid var(--line-w);
  margin: 0 -64px;
  padding: 0 0;
}
.ov-stat-tile {
  padding: 22px 24px 22px; display: flex; flex-direction: column; gap: 6px;
  border-right: 1px solid var(--line-w); min-width: 86px;
  flex: 1;
}
.ov-stat-tile:first-child { padding-left: 64px; }
.ov-stat-tile:last-child { border-right: none; padding-right: 64px; }
.ov-st-label {
  font-size: 10.5px; color: var(--muted); letter-spacing: 0.22em;
  text-transform: uppercase; font-weight: 600;
  font-family: var(--sans);
  margin-bottom: 8px;
}
.ov-st-num {
  font-family: var(--serif);
  font-weight: 300;
  font-variation-settings: "opsz" 72, "SOFT" 50;
  font-size: 36px;
  color: var(--ink);
  line-height: 1;
  letter-spacing: -0.025em;
  font-feature-settings: "tnum";
}
.ov-st-num em {
  font-style: italic;
  color: var(--ocean-f);
  font-variation-settings: "opsz" 72, "SOFT" 100, "wght" 300;
}
.ov-st-sub { font-size: 11.5px; color: var(--muted); font-weight: 400; letter-spacing: 0; margin-top: 6px; }

/* ── Overview body (left content + right clinicians sidebar) ── */
.ov-body {
  display: grid;
  grid-template-columns: 1fr 280px;
  padding: 32px 64px 48px;
  gap: 22px;
  align-items: stretch;
}
/* All non-overview sections also need horizontal padding now
   that hub-main no longer has any. Side gutters were originally 64px
   which left every panel floating inside a huge frame — tightened to
   28px so content feels properly proportioned to the chrome around it. */
.section:not(#section-overview) { padding: 20px 28px 28px; }
.section:not(#section-overview) > * { max-width: 100%; }
/* Journal needs even tighter side gutters because its 3-panel grid
   is already visually self-contained — small gutters keep it from
   floating away from the menu sidebar. */
#section-journal { padding: 16px 12px 20px; }
.ov-content { display: flex; flex-direction: column; gap: 20px; }
.ov-sidebar { display: flex; flex-direction: column; }
.ov-sidebar .card { flex: 1; display: flex; flex-direction: column; }
.ov-sidebar .card .card-header { flex-shrink: 0; }
#ovClinList { flex: 1; overflow-y: auto; }

/* ── Overview Week Time-Slot Calendar ── */
.ovwk-tgrid {
  display: grid;
  grid-template-columns: 44px repeat(7, 1fr);
  overflow: hidden;
  border-top: 1px solid var(--border);
}
.ovwk-thdr {
  background: var(--surface);
  padding: 8px 4px 7px;
  font-size: 10px;
  font-weight: 600;
  text-align: center;
  color: var(--muted);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--border);
  line-height: 1.3;
}
.ovwk-thdr.today { color: var(--accent); }
.ovwk-thdr.time-lbl { background: var(--surface); }
.ovwk-ttime {
  font-size: 9px;
  color: var(--muted);
  height: 36px;
  display: flex;
  align-items: flex-start;
  padding: 4px 5px 0 0;
  justify-content: flex-end;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid rgba(216,208,192,0.35);
  white-space: nowrap;
}
.ovwk-tcell {
  height: 36px;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid rgba(216,208,192,0.35);
  position: relative;
  transition: background 0.1s;
}
.ovwk-tcell:hover { background: rgba(61,90,128,0.04); }
.ovwk-tcell.today-col { background: rgba(61,90,128,0.03); }
.ovwk-tcell:last-child { border-right: none; }
.ovwk-tev {
  position: absolute;
  left: 2px; right: 2px; top: 2px; bottom: 2px;
  background: var(--accent);
  color: #fff;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 500;
  padding: 0 5px;
  cursor: pointer;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: var(--sans);
  box-shadow: 0 1px 3px rgba(61,90,128,0.25);
  z-index: 1;
  display: flex;
  align-items: center;
}
.ovwk-tev:hover { opacity: 0.82; }
.ovwk-tev.green  { background: var(--green); }
.ovwk-tev.purple { background: var(--purple); }
.ovwk-tev.gold   { background: var(--gold); }
.ovwk-tev.amber  { background: var(--amber); }
.ovwk-tev.red    { background: #c0392b; }

/* ── Overview responsive ── */
@media (max-width: 900px) {
  .ov-body { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .ov-hero { padding: 24px 22px 20px; }
  .ov-stat-tiles {
    display: grid; grid-template-columns: 1fr 1fr;
    border-radius: 0;
  }
  .ov-stat-tile { border-bottom: 1px solid var(--line-w); }
  .ov-stat-tile:nth-child(odd) { border-right: 1px solid var(--line-w); }
  .ov-stat-tile:last-child,
  .ov-stat-tile:nth-last-child(2) { border-bottom: none; }
}

/* Astrasera editorial rail lock.
   This dashboard-specific file loads after the global skin, so the final
   geometry for the luxury fixed rail lives here as well. Styling only. */
@media (min-width: 901px) {
  .hub-shell {
    overflow: visible !important;
  }

  .hub-sidebar {
    width: 270px !important;
    min-height: 100vh !important;
    height: 100vh !important;
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    z-index: 130 !important;
  }

  .hub-main {
    margin-left: 270px !important;
  }

  header.topbar {
    padding-left: calc(270px + 36px) !important;
  }

  .hub-sidebar.collapsed {
    width: 72px !important;
  }

  .hub-sidebar.collapsed + .hub-main,
  .hub-shell.sidebar-collapsed .hub-main {
    margin-left: 72px !important;
  }

  body:has(.hub-sidebar.collapsed) header.topbar,
  body:has(.hub-shell.sidebar-collapsed) header.topbar {
    padding-left: calc(72px + 36px) !important;
  }
}

/* Collapsed rail spacing lock.
   Dashboard-specific CSS loads after the global skin, so collapsed geometry
   is finalized here too. Styling only; all buttons/routes remain unchanged. */
@media (min-width: 901px) {
  .hub-sidebar.collapsed {
    width: 72px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
  }

  .hub-sidebar.collapsed .sidebar-profile {
    min-height: 76px !important;
    padding: 18px 0 12px !important;
    justify-content: center !important;
    gap: 0 !important;
    flex: 0 0 auto !important;
  }

  .hub-sidebar.collapsed .sidebar-avatar,
  .hub-sidebar.collapsed .sidebar-profile-info {
    display: none !important;
  }

  .hub-sidebar.collapsed .sidebar-toggle,
  .hub-sidebar.collapsed .sidebar-profile-toggle {
    display: inline-flex !important;
    width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
  }

  .hub-sidebar.collapsed .sidebar-items-wrap {
    flex: 0 1 auto !important;
    min-height: 0 !important;
    gap: 8px !important;
    padding: 12px 10px 10px !important;
    overflow-y: visible !important;
    overflow-x: hidden !important;
  }

  .hub-sidebar.collapsed .sidebar-section-label,
  .hub-sidebar.collapsed .sidebar-divider {
    display: none !important;
    height: 0 !important;
    max-height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
  }

  .hub-sidebar.collapsed .sidebar-item {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 0 auto !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0 !important;
    border-radius: 12px !important;
  }

  .hub-sidebar.collapsed .sidebar-item .si-icon {
    width: 24px !important;
    height: 24px !important;
    font-size: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .hub-sidebar.collapsed .si-label,
  .hub-sidebar.collapsed .sidebar-badge {
    display: none !important;
    width: 0 !important;
    max-width: 0 !important;
    min-width: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
  }

  .hub-sidebar.collapsed .sidebar-signout {
    margin-top: auto !important;
    padding: 10px 10px 14px !important;
    flex: 0 0 auto !important;
  }
}

/* ── Billing — the house ledger grammar ─────────────────────────────
   Seam rules with the count in the right slot, one row per invoice,
   states as small-caps words, and token-clean pay rows. Replaces the
   card stack whose rhythm lived entirely in inline styles. */
.bil-block + .bil-block { margin-top: 36px; }
.bil-seam { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--ink); padding-bottom: 7px; }
.bil-seam-gap { margin-top: 30px; }
.bil-seam-l { font-size: 10px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); }
.bil-seam-r { font-size: 11px; color: var(--muted); }
.bil-seam-r a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.bil-empty { font-size: 13px; color: var(--muted); padding: 22px 0; }
.bil-foot { font-size: 11px; color: var(--muted); margin-top: 12px; line-height: 1.55; }

/* Invoice rows: date · what for · state · amount · action */
.binv-row { display: grid; grid-template-columns: 64px 1fr 132px 76px 64px; gap: 16px; align-items: baseline;
            padding: 14px 0; border-bottom: 1px solid var(--border); cursor: pointer; transition: background .14s ease; }
.binv-row:hover { background: var(--surface, rgba(0,0,0,0.03)); }
.binv-d { font-family: var(--serif, Georgia, serif); font-size: 13.5px; color: var(--muted); }
.binv-t { min-width: 0; font-size: 13.5px; color: var(--ink); line-height: 1.45; }
.binv-t i { display: block; font-style: normal; font-size: 11px; color: var(--muted); margin-top: 3px; }
.binv-st { font-size: 9.5px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); white-space: nowrap; }
.binv-st.due  { color: var(--red, #A5472F); }
.binv-st.paid { color: var(--green, #5A6B57); }
.binv-amt { font-family: var(--serif, Georgia, serif); font-size: 14.5px; color: var(--ink); text-align: right; white-space: nowrap; }
.binv-amt.muted { color: var(--muted); }
.binv-act { font-size: 11px; color: var(--accent); text-align: right; white-space: nowrap; }

/* Expanded invoice detail — the math, reimbursement state, timeline */
.binv-detail { grid-column: 1 / -1; cursor: default; padding: 6px 0 18px; }
.binv-cols { display: flex; gap: 44px; align-items: flex-start; flex-wrap: wrap; }
.binv-col { flex: 1; min-width: 240px; }
.binv-k { font-size: 9.5px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid var(--ink); padding-bottom: 5px; margin-bottom: 2px; }
.binv-li { display: flex; justify-content: space-between; gap: 14px; padding: 8px 0; border-bottom: 1px solid var(--border); font-size: 12.5px; }
.binv-li .lab { color: var(--muted); }
.binv-li .val { color: var(--ink); text-align: right; }
.binv-li.total { border-bottom: 1px solid var(--ink); }
.binv-li.total .lab { color: var(--ink); font-weight: 500; }
.binv-li.total .val { font-family: var(--serif, Georgia, serif); font-size: 14.5px; }
.binv-ready { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--green, #5A6B57); margin: 12px 0 4px; }
.binv-ready.warn { color: var(--red, #A5472F); }
.binv-ready .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.binv-actions { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }

/* Buttons — black primary + ghost, matching the house pair */
.bil-btn { display: inline-flex; align-items: center; gap: 7px; background: var(--ink); color: var(--bg); border: 1px solid var(--ink);
           font-size: 12.5px; font-weight: 500; font-family: var(--sans); padding: 9px 16px; cursor: pointer; text-decoration: none; transition: opacity .15s ease; }
.bil-btn:hover { opacity: 0.85; }
.bil-btn[disabled], .bil-btn.off { opacity: 0.45; cursor: default; pointer-events: none; }
.bil-btn.ghost { background: transparent; color: var(--ink); border-color: var(--border); }

/* How to pay rows */
.bpay-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--border); }
.bpay-l { display: flex; align-items: baseline; gap: 12px; min-width: 0; flex-wrap: wrap; }
.bpay-nm { font-size: 13.5px; font-weight: 500; color: var(--ink); white-space: nowrap; }
.bpay-hd { font-size: 12.5px; color: var(--muted); }
.bpay-copy { font-size: 11.5px; color: var(--accent); background: none; border: 0; cursor: pointer; font-family: var(--sans); padding: 4px 6px; }
.bpay-row.off .bpay-nm { color: var(--muted); }

/* Superbill readiness checklist */
.bck-row { display: flex; align-items: baseline; gap: 11px; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 13px; color: var(--ink); }
.bck-ck { font-family: var(--serif, Georgia, serif); width: 14px; flex-shrink: 0; }
.bck-row.ok .bck-ck { color: var(--green, #5A6B57); }
.bck-row.miss .bck-ck { color: var(--red, #A5472F); }
.bck-fix { margin-left: auto; font-size: 11px; color: var(--accent); white-space: nowrap; }
.bck-fix a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

/* Superbill rows */
.bsb-row { display: grid; grid-template-columns: 58px 1fr 128px 78px; gap: 14px; align-items: baseline; padding: 12px 0; border-bottom: 1px solid var(--border); }
.bsb-d { font-family: var(--serif, Georgia, serif); font-size: 13px; color: var(--muted); }
.bsb-t { min-width: 0; font-size: 12.5px; color: var(--ink); line-height: 1.4; }
.bsb-t i { display: block; font-style: normal; font-size: 10.5px; color: var(--muted); margin-top: 2px; }
.bsb-st { font-size: 9px; font-weight: 600; letter-spacing: 0.11em; text-transform: uppercase; white-space: nowrap; color: var(--green, #5A6B57); }
.bsb-st.warn { color: var(--red, #A5472F); }
.bsb-act { font-size: 11px; color: var(--accent); text-align: right; white-space: nowrap; cursor: pointer; }

/* Insurance info rows */
.bins-row { display: flex; justify-content: space-between; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.bins-row .lab { color: var(--muted); }
.bins-row .val { font-weight: 500; color: var(--ink); }

/* Rates rows */
.brate-row { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--border); }
.brate-n { font-size: 13px; color: var(--ink); }
.brate-n i { font-style: normal; font-size: 11px; color: var(--muted); margin-left: 8px; }
.brate-a { font-family: var(--serif, Georgia, serif); font-size: 14.5px; color: var(--ink); white-space: nowrap; }

/* Insurance two-column layout */
.bil-cols { display: flex; gap: 48px; align-items: flex-start; }
.bil-col { flex: 1; min-width: 0; }
.bil-portal .bil-steps { font-size: 12px; color: var(--muted); line-height: 1.65; margin-top: 14px; max-width: 52ch; }

@media (max-width: 900px) {
  .bil-cols { flex-direction: column; gap: 34px; }
  .binv-row { grid-template-columns: 56px 1fr; }
  .binv-st, .binv-amt, .binv-act { grid-column: 2; text-align: left; }
  .bsb-row { grid-template-columns: 52px 1fr; }
  .bsb-st, .bsb-act { grid-column: 2; text-align: left; }
}


/* ── Coverage details form (Billing → Insurance) ── */
.cov-form { border: 1px solid var(--border); background: var(--card); padding: 18px 20px; }
.cov-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 13px 18px; }
.cov-f label { display: block; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-weight: 600; margin-bottom: 5px; }
.cov-f input, .cov-f select { width: 100%; box-sizing: border-box; font-size: 13px; font-family: var(--sans); border: 1px solid var(--border); background: var(--surface); color: var(--ink); padding: 9px 12px; }
.cov-actions { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 16px; }