/* BookedBro app look for the team pages (/staff and /admin).
   Loaded after barber-01.css so the same markup gets BookedBro's style:
   dark ink, cyan accent, Geist type, like bookedbro.com. Customer booking pages keep each business's own look. */
:root{
  --bg:#06080c; --panel:#0e1219; --panel-2:#141924; --line:#1d2330; --line-2:#2a3242;
  --ink:#f5f7fb; --mute:#aab4c3; --dim:#7d8899;
  --acc:#8be0ef; --acc-ink:#041218; --acc-soft:rgba(139,224,239,.10); --acc-deep:#2fa9c6;
  --ok:#5fd4a0; --bad:#f07b6e;
  --sans:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif; --mono:"Geist Mono",ui-monospace,Menlo,monospace;
  color-scheme:dark;
}
html{background:var(--bg)}
body{font-family:var(--sans);background:
  radial-gradient(1000px 480px at 50% -16%,rgba(47,169,198,.10),transparent 62%),var(--bg);
  -webkit-font-smoothing:antialiased}
body::before{display:none}
.topline{height:1px;background:linear-gradient(90deg,transparent,rgba(139,224,239,.5) 30%,rgba(47,169,198,.5) 70%,transparent)}

/* header: logo + wordmark */
header{padding:34px 16px 4px}
.bb-logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.bb-logo svg{width:40px;height:40px}
.bb-logo span{font:800 30px/1 var(--sans);letter-spacing:-.04em}
.bb-logo span b{font-weight:800;color:var(--acc)}
.rule{display:none}
.tag{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.2em;text-indent:.2em;color:var(--acc);margin-top:14px}
.biz-line{margin:10px 0 0;font:600 20px/1.2 var(--sans);letter-spacing:-.02em;color:var(--ink)}
header p{font-size:13px;letter-spacing:0}

/* cards and type */
.card,.stat{background:linear-gradient(180deg,rgba(20,25,36,.85),rgba(14,18,25,.9));border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 32px -18px rgba(0,0,0,.6)}
h2{font-family:var(--sans);font-weight:700;font-size:17px;letter-spacing:-.01em;text-transform:none}
h2::before{width:14px;height:2px;background:var(--acc)}
h3{font-family:var(--sans);font-weight:600}
label{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;color:var(--dim)}
input,select,textarea{background:rgba(255,255,255,.035);border-color:var(--line-2);border-radius:12px;color:var(--ink)}
input:focus,select:focus,textarea:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(139,224,239,.10)}
button{border-radius:999px;font-family:var(--sans);font-weight:600;letter-spacing:.02em;text-transform:none;font-size:14px;
  background:var(--acc);color:var(--acc-ink);box-shadow:none}
button:hover:not(:disabled){filter:brightness(1.05)}
button.s{border-radius:999px;color:var(--ink);background:rgba(255,255,255,.03);border:1px solid var(--line-2);box-shadow:none;font-size:12px;letter-spacing:.01em;text-transform:none}
button.s:hover{border-color:var(--acc);color:var(--acc)}
button.s.armed{border-color:var(--bad);color:var(--bad)}
button.danger{border-radius:999px;box-shadow:none}
.m{color:var(--mute)}
a.btn{border-radius:999px}

/* dashboard */
.tab{border-radius:999px;font-family:var(--sans);font-weight:600;letter-spacing:.01em;text-transform:none;font-size:13px;box-shadow:none;background:rgba(255,255,255,.03);color:var(--mute)}
.tab.sel{border-color:var(--acc);color:var(--acc-ink);background:var(--acc)}
.stat{border-radius:16px}
.stat .k{font-family:var(--mono);font-size:10px;color:var(--dim)}
.stat .v,.daynav .ttl,.slot .t,.big{font-family:var(--sans);font-weight:700;letter-spacing:-.02em}
.stat .v{font-size:32px}
.slot .t{font-size:20px}
.slot .t small{font-family:var(--sans)}
.chip{border-radius:12px}
.chip.sel{background:var(--acc-soft)}
.opt{border-radius:14px}
.opt.sel{background:var(--acc-soft)}
.badge{font-family:var(--mono)}
.powered b i{color:var(--acc)}
.toast{border-radius:14px}