@import url('/css/mobile-android.css');
/* BrightChair design tokens — dental practice vertical.
   Palette (per spec):
     tooth white  #FFFFFF  (surface)
     mint         #10B981  (primary)
     navy         #0F3A4A  (accent)
     bg           #F0FDF4  (page background)
   Tagline: "Fill chairs. Recall patients. Grow with confidence."
*/
:root {
  --bc-white: #FFFFFF;
  --bc-mint: #10B981;
  --bc-mint-dark: #0F9E73;
  --bc-mint-soft: rgba(16, 185, 129, 0.1);
  --bc-navy: #0F3A4A;
  --bc-navy-dark: #0B2A38;
  --bc-bg: #F0FDF4;
  --bc-ink: #0F172A;
  --bc-muted: #64748B;
  --bc-border: rgba(15, 23, 42, 0.08);
  --bc-radius: 14px;

  /* Aliases for shared components */
  --brand-primary: var(--bc-mint);
  --brand-accent: var(--bc-navy);
  --brand-surface: var(--bc-white);
  --brand-bg: var(--bc-bg);
}

body.brightchair-gradient {
  background: linear-gradient(180deg, var(--bc-bg) 0%, #FFFFFF 100%);
  color: var(--bc-ink);
}

/* Primary button */
.bc-btn-primary {
  background: var(--bc-mint);
  color: #ffffff;
  border: none;
  border-radius: 10px;
  padding: 12px 22px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.2s;
}
.bc-btn-primary:hover { background: var(--bc-mint-dark); }

/* Accent (navy) link */
.bc-link-accent { color: var(--bc-navy); text-decoration: none; font-weight: 600; }
.bc-link-accent:hover { color: var(--bc-navy-dark); text-decoration: underline; }

/* ── Keyboard focus ring (App Parity 2026-06-12) ──────────────────────────
   Visible ONLY for keyboard navigation (:focus-visible) — mouse/touch users
   see no change. currentColor adapts the ring to its context. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, summary:focus-visible, [tabindex]:focus-visible,
[role="button"]:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}