/* ============================================================================
   Suncoast Technology — site-wide glass theme.
   Loaded LAST on every page, so it re-skins the shared components to the
   homepage's frosted-glass look without rewriting each page's layout.
   !important is used on VISUAL properties only (font, color, surface, radius,
   shadow) — never on layout (display/grid/flex/position), so nothing reflows.
   ========================================================================== */
:root{
  --sc-brand:#F97316; --sc-brand-2:#FB923C; --sc-brand-deep:#ea580c; --sc-brand-tint:rgba(249,115,22,0.12);
  --sc-ink:#F3F7FF; --sc-ink-soft:#C8D4E6; --sc-muted:rgba(148,163,184,0.72); --sc-faint:rgba(148,163,184,0.45);
  --sc-line:rgba(255,255,255,0.08); --sc-line2:rgba(255,255,255,0.13);
  --sc-glass:rgba(255,255,255,0.045); --sc-glass2:rgba(255,255,255,0.06); --sc-glass-strong:rgba(255,255,255,0.09); --sc-glass-bd:rgba(255,255,255,0.10);
  --sc-edge:inset 0 1px 0 rgba(255,255,255,0.09);
  --sc-shadow:0 1px 2px rgba(0,0,0,0.30),0 18px 40px rgba(0,0,0,0.45);
  --sc-shadow-brand:0 8px 24px rgba(249,115,22,0.32);
  --sc-ease:cubic-bezier(.22,1,.36,1);
  --sc-sys:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

/* ── Type: system sans everywhere ─────────────────────────────────────────── */
html body, body input, body select, body textarea, body button, body a, body p,
body span, body div, body li, body ul, body ol, body td, body th, body label,
body h1, body h2, body h3, body h4, body h5, body h6,
body strong, body b, body em, body small, body figcaption, body blockquote{
  font-family:var(--sc-sys) !important;
}
body{ letter-spacing:-.005em; }
/* keep intentional monospace (tokens, code) */
body code, body pre, body .mono, body kbd, body samp{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace !important; }
/* headings: tight, modern */
body h1, body h2, body h3, body h4,
body .page-title, body .brand-name, body .modal-title, body .section-title,
body .sign-title, body .doc-title, body .state-title, body .cat-title, body .hero-headline,
body .nav-brand, body .footer-brand, body .stat-val, body .pricing-price, body .diff-number, body .kpi-val, body .num{
  letter-spacing:-.03em !important; font-style:normal !important;
}

/* ── Calmer canvas ────────────────────────────────────────────────────────── */
body .grid-overlay{ display:none !important; }

/* ── Cards & surfaces → frosted glass ─────────────────────────────────────── */
body .card, body .stat-card, body .scard, body .panel, body .tile, body .box,
body .kpi, body .kpi-card, body .widget, body .section-card, body .glass{
  background:var(--sc-glass) !important;
  border:1px solid var(--sc-glass-bd) !important;
  -webkit-backdrop-filter:blur(16px) saturate(140%) !important; backdrop-filter:blur(16px) saturate(140%) !important;
  box-shadow:var(--sc-edge),var(--sc-shadow) !important;
  border-radius:16px !important;
}

/* ── Buttons → pill ───────────────────────────────────────────────────────── */
body .btn, body button.btn, body .btn-sm, body .btn-lg, body .pricing-cta, body .cta,
body .sign-btn, body .form-submit, body .portal-btn, body .contact-btn, body .btn-glow, body .btn-ghost{
  border-radius:999px !important; font-weight:600 !important; letter-spacing:-.01em !important;
  transition:transform .15s var(--sc-ease), filter .2s, background .2s !important;
}
body .btn-primary, body .btn-purple, body .btn-glow, body .cta-primary, body .form-submit,
body .sign-btn, body .portal-btn, body .btn.primary, body button[type=submit].btn{
  background:var(--sc-brand) !important; color:#fff !important; border:none !important;
  box-shadow:var(--sc-shadow-brand),inset 0 1px 0 rgba(255,255,255,0.22) !important;
}
body .btn-primary:hover, body .btn-purple:hover, body .btn-glow:hover, body .cta-primary:hover,
body .form-submit:hover, body .sign-btn:hover, body .portal-btn:hover{ filter:brightness(1.05) !important; }
body .btn-ghost, body .btn.secondary, body .cta-ghost, body .contact-btn{
  background:var(--sc-glass) !important; color:var(--sc-ink-soft) !important;
  border:1px solid var(--sc-glass-bd) !important; box-shadow:var(--sc-edge) !important;
}
body .btn-ghost:hover, body .contact-btn:hover{ background:var(--sc-glass-strong) !important; color:#fff !important; }

/* ── Form fields → glass ──────────────────────────────────────────────────── */
body .field input, body .field select, body .field textarea,
body input[type=text], body input[type=email], body input[type=password],
body input[type=number], body input[type=date], body input[type=tel], body input[type=search],
body input[type=url], body select, body textarea{
  background:var(--sc-glass-strong) !important; border:1px solid var(--sc-line2) !important;
  border-radius:14px !important; color:var(--sc-ink) !important; box-shadow:var(--sc-edge) !important;
}
body .field input:focus, body .field select:focus, body .field textarea:focus,
body input:focus, body select:focus, body textarea:focus{
  border-color:var(--sc-brand) !important; box-shadow:0 0 0 4px rgba(249,115,22,0.15) !important; outline:none !important;
}

/* ── Modals → glass ───────────────────────────────────────────────────────── */
body .modal-gem{ background:linear-gradient(135deg,rgba(249,115,22,0.45),rgba(255,255,255,0.10) 45%,rgba(249,115,22,0.18)) !important; }
body .modal-inner, body .modal-card, body .modal-content{ background:#080d16 !important; }
body .modal-close{ background:var(--sc-glass) !important; border:1px solid var(--sc-glass-bd) !important; border-radius:10px !important; color:var(--sc-muted) !important; }

/* ── Sidebar nav (admin) ──────────────────────────────────────────────────── */
body .sidebar{ background:rgba(5,9,15,0.72) !important; -webkit-backdrop-filter:blur(24px) saturate(150%) !important; backdrop-filter:blur(24px) saturate(150%) !important; border-right:1px solid var(--sc-line) !important; }
body .nav-item{ border-radius:10px !important; }
body .nav-item.active{ background:var(--sc-brand-tint) !important; color:var(--sc-brand-2) !important; }
body .user-avatar{ background:var(--sc-brand-tint) !important; border:1px solid rgba(249,115,22,0.25) !important; color:var(--sc-brand-2) !important; }

/* ── Tabs, pills, badges → rounded glass ──────────────────────────────────── */
body .tabs{ border-radius:999px !important; background:var(--sc-glass) !important; border:1px solid var(--sc-glass-bd) !important; box-shadow:var(--sc-edge) !important; }
body .tab{ border-radius:999px !important; }
body .tab.active{ background:var(--sc-glass-strong) !important; color:#fff !important; }
body .badge, body .pill, body .chip, body .tag{ border-radius:999px !important; }

/* ── Page title accent stays orange ───────────────────────────────────────── */
body .page-title em, body .section-title em{ color:var(--sc-brand) !important; }
body .page-label, body .section-label{ color:var(--sc-muted) !important; }

/* ── Tables → quiet lines ─────────────────────────────────────────────────── */
body table th{ color:var(--sc-faint) !important; }
body table td, body table th{ border-color:var(--sc-line) !important; }
