/* Batch 10 — Apple/macOS-inspired overlay for the Super Admin app (loaded after styles.css).
 * Same tokens as the clinic app theme: system font, hairlines, 8px controls, no gradients. */
:root {
  /* Design System v2 (Phase 2): values come from admin/tokens.css (same generated tokens as the app). */
  --dd-font: var(--font-text);
  --dd-bg: var(--canvas); --dd-surface: var(--surface-1); --dd-sidebar: var(--surface-3); --dd-hairline: var(--line); --dd-hairline-strong: var(--line-strong);
  --dd-text-1: var(--ink-1); --dd-text-2: var(--ink-2); --dd-text-3: var(--ink-3); --dd-accent: var(--accent); --dd-accent-soft: var(--accent-soft);
  --dd-success: var(--success); --dd-success-soft: var(--success-soft); --dd-warning: var(--warning); --dd-warning-soft: var(--warning-soft); --dd-danger: var(--danger); --dd-danger-soft: var(--danger-soft);
  --admin-bg: var(--dd-bg); --admin-card: var(--dd-surface); --admin-ink: var(--dd-text-1); --admin-muted: var(--dd-text-3); --admin-line: var(--dd-hairline); --admin-accent: var(--dd-accent); --admin-accent-soft: var(--dd-accent-soft); --admin-sidebar: var(--dd-sidebar);
  --bg: var(--dd-bg); --ink: var(--dd-text-1); --muted: var(--dd-text-3); --teal: var(--dd-accent); --teal-dark: var(--dd-accent);
  --shadow: 0 1px 2px rgba(0,0,0,.04); --shadow-soft: 0 1px 2px rgba(0,0,0,.04);
}
body, button, input, select, textarea { font-family: var(--dd-font) !important; }
body { background: var(--dd-bg) !important; color: var(--dd-text-1); -webkit-font-smoothing: antialiased; }
em { font-style: normal; }
/* Sidebar: light, translucent, regular weight */
body:not(.login) .sidebar { background: rgba(240,240,243,.92) !important; color: var(--dd-text-1) !important; border-right: 1px solid var(--dd-hairline) !important; backdrop-filter: saturate(180%) blur(20px) !important; }
.brand-block strong { color: var(--dd-text-1) !important; font-size: 15px !important; }
.brand-block small { color: var(--dd-text-3) !important; }
.sidebar-collapse { color: var(--dd-text-3) !important; border-color: var(--dd-hairline-strong) !important; min-height: 28px !important; }
.admin-nav-group > label { color: var(--dd-text-3) !important; font-weight: 600 !important; letter-spacing: .04em !important; }
.sidebar .nav { min-height: 32px !important; border-radius: 8px !important; color: var(--dd-text-1) !important; font-weight: 500 !important; font-size: 13px !important; }
.sidebar .nav:hover { background: rgba(0,0,0,.05) !important; color: var(--dd-text-1) !important; }
.sidebar .nav.active { background: var(--dd-accent-soft) !important; color: var(--dd-accent) !important; font-weight: 600 !important; }
.sidebar .nav .admin-nav-icon { background: transparent !important; color: currentColor !important; }
.sidebar-bottom { border-top-color: var(--dd-hairline) !important; }
/* Top bar */
.topbar { min-height: 64px !important; padding: 14px 34px !important; background: rgba(245,245,247,.85) !important; backdrop-filter: saturate(180%) blur(20px); }
.topbar h1 { font-size: 22px !important; font-weight: 600 !important; letter-spacing: -.01em !important; }
.topbar .eyebrow, .eyebrow { color: var(--dd-text-3) !important; font-weight: 600 !important; letter-spacing: .04em !important; }
.env-pill { background: var(--dd-success-soft) !important; color: var(--dd-success) !important; font-weight: 600 !important; font-size: 11px !important; border-radius: 6px !important; }
.profile-menu summary { border-radius: 8px !important; padding: 6px 12px !important; font-weight: 500 !important; }
/* Surfaces */
body:not(.login) .panel { border: 1px solid var(--dd-hairline) !important; border-radius: 12px !important; box-shadow: none !important; }
.panel h2, .panel-head h2 { font-weight: 600 !important; letter-spacing: -.01em; }
.admin-command-hero, .command-hero { background: var(--dd-surface) !important; color: var(--dd-text-1) !important; border: 1px solid var(--dd-hairline) !important; box-shadow: none !important; }
.admin-command-hero *, .command-hero * { color: inherit; }
.admin-command-hero .eyebrow, .command-hero .eyebrow { color: var(--dd-text-3) !important; }
.admin-command-hero h2, .command-hero h2 { font-size: 22px !important; font-weight: 600 !important; }
[class*="hero"] { background-image: none !important; }
/* Controls */
body:not(.login) button { min-height: 32px !important; border-radius: 8px !important; font-weight: 500 !important; font-size: 13px !important; box-shadow: none !important; }
body:not(.login) button.primary, button.primary { background: var(--dd-accent) !important; border-color: var(--dd-accent) !important; color: #fff !important; background-image: none !important; }
body:not(.login) input, body:not(.login) select, body:not(.login) textarea { min-height: 32px; border-radius: 8px !important; border-color: var(--dd-hairline-strong) !important; font-size: 13px; }
input:focus, select:focus, textarea:focus, button:focus-visible { outline: 3px solid rgba(0,113,227,.3) !important; outline-offset: 1px; }
.search-field { border-radius: 8px !important; }
/* Data tables: flat rows, hairlines */
.data-table { border: 1px solid var(--dd-hairline) !important; border-radius: 10px !important; overflow: hidden; }
.data-table .table-head { background: #fafafa !important; color: var(--dd-text-3) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .03em !important; }
.data-table .client-row, .data-table > div:not(.table-head) { border: 0 !important; border-top: 1px solid var(--dd-hairline) !important; border-radius: 0 !important; margin: 0 !important; box-shadow: none !important; background: var(--dd-surface) !important; }
.data-table .client-row:hover { background: #fafafa !important; }
.client-row strong { font-weight: 600 !important; }
.status { border-radius: 6px !important; font-size: 11px !important; font-weight: 600 !important; padding: 2px 8px !important; }
.status.active { background: var(--dd-success-soft) !important; color: var(--dd-success) !important; }
.status.trial { background: var(--dd-warning-soft) !important; color: var(--dd-warning) !important; }
.status.deactivated, .status.suspended, .status.cancelled { background: var(--dd-danger-soft) !important; color: var(--dd-danger) !important; }
.client-row .module-chip, .client-row [class*="chip"], .client-row span > span { border-radius: 6px; }
/* Metrics */
[class*="metric"] strong, .overview-metrics strong { font-weight: 600 !important; letter-spacing: -.02em; }
/* Login */
body.login { background: var(--dd-bg) !important; background-image: none !important; }
.login-card { border-radius: 14px !important; border: 1px solid var(--dd-hairline) !important; box-shadow: 0 8px 30px rgba(0,0,0,.06) !important; max-width: 400px; }
.login-card h1 { font-size: 26px !important; font-weight: 600 !important; letter-spacing: -.02em !important; line-height: 1.2 !important; }
.login-card button { min-height: 40px !important; border-radius: 10px !important; background: var(--dd-accent) !important; background-image: none !important; box-shadow: none !important; font-weight: 500 !important; }
.login-card input { min-height: 40px !important; border-radius: 10px !important; font-weight: 400 !important; }
.login-card label { font-weight: 500 !important; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }
.admin-command-hero h1, .admin-command-hero h2, .admin-command-hero strong, .command-hero h1, .command-hero h2, .command-hero strong { color: var(--dd-text-1) !important; }
.admin-command-hero p, .admin-command-hero span:not(.eyebrow), .command-hero p { color: var(--dd-text-2) !important; opacity: 1 !important; }
.admin-command-hero button:not(.primary), .command-hero button:not(.primary) { background: var(--dd-surface) !important; color: var(--dd-text-1) !important; border: 1px solid var(--dd-hairline-strong) !important; opacity: 1 !important; }
.client-row span > span, .client-row .modules span, .client-row [class*="module"] { background: rgba(0,0,0,.05) !important; color: var(--dd-text-2) !important; font-weight: 500 !important; border-radius: 6px !important; font-size: 11px !important; }
.data-table .table-head { margin: 0 !important; border-radius: 0 !important; }
