/* Free Front Desk (site 9): the admin, members' app and join pages in the site's own look. Loaded after the shared styles (header.php); club.css and am.css come later, hence !important on what they set. Cool paper white, ink navy, cobalt, floor-tape yellow, Barlow. */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&family=Barlow+Condensed:wght@600;700;800&display=swap');

:root {
	--bc-bg: #f5f7fb; --bc-surface: #ffffff; --bc-ink: #12233f; --bc-ink-2: #435270; --bc-muted: #66748e; --bc-faint: #8a97ad; --bc-line: rgba(18, 35, 63, 0.1);
	--bc-accent: #2545d4; --bc-brand-grad: linear-gradient(120deg, #2545d4, #2545d4);
	--bc-font: "Barlow", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--cl-rail: #12233f; --ffd-tape: #ffc21a; --ffd-accent: #2545d4;
}
html[data-theme="dark"] {
	--bc-bg: #101a2c; --bc-surface: #182438; --bc-ink: #eff3fa; --bc-ink-2: #b9c4d8; --bc-muted: #8f9db5; --bc-faint: #6f7e98; --bc-line: rgba(255, 255, 255, 0.1);
	--bc-accent: #7f97ff; --bc-brand-grad: linear-gradient(120deg, #7f97ff, #7f97ff); --cl-rail: #0c1524; --ffd-accent: #7f97ff;
}
body, input, select, textarea, button { font-family: var(--bc-font); }
.cl-top h1, .bc-set-section > h2, .bc-set-head h2, .cm-next h2, .cm-hero-id h1 { font-family: "Barlow Condensed", "Barlow", sans-serif; font-weight: 700; letter-spacing: 0; }

/* The rail: flat navy, a line of tape on the active link */
.cl-rail::before { display: none !important; }
.cl-nav-link.is-on { box-shadow: inset 3px 0 0 var(--ffd-tape) !important; border-radius: 10px; }
.cl-nav-link.is-on i { color: var(--ffd-accent) !important; }
.cl-new { background: var(--ffd-tape) !important; color: #12233f !important; }
.cl-nav-link.is-on .cl-new { color: #12233f !important; }
.cl-nav-group--mgmt::before { background: var(--ffd-tape) !important; }

/* The hero: flat, navy */
.cm-hero:not(.has-cover) { background: #12233f !important; }
.cm-hero:not(.has-cover)::before, .cm-hero::after { display: none !important; }
.cm-hero .cm-num, .cm-hero-num { color: #fff; }

/* Buttons and small bits in cobalt instead of the rainbow */
.bc-set-btn--primary, .bc-sheet-btn--primary, .bc-amp-page .bc-amp-btn--primary, .bc-amp-page .bc-amp-btn--primary:hover, .cm-btn--primary { background: #2545d4 !important; color: #fff !important; box-shadow: none !important; }
.cm-progress i { background: #2545d4 !important; }
.cm .ci-msg--out { background: #2545d4 !important; }
.cm-next::before, .cm-class::before { background: #2545d4 !important; }
.cm-class.is-booked::before { background: #16a34a !important; }

/* The members' app: no aurora behind the cards */
.cm { --cm-c1: #2545d4; --cm-c2: #2545d4; --cm-c3: #ffc21a; --cm-grad: linear-gradient(135deg, #2545d4, #2545d4); background: var(--bc-bg) !important; }
.cm::before { display: none !important; }
.cm-next h2 { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; color: var(--bc-ink) !important; }
.cm-tabs a.is-on i { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; color: var(--ffd-tape) !important; }
.cm-person.is-on { background: #12233f !important; box-shadow: none !important; }
html[data-theme="dark"] .cm-next h2 { color: #fff !important; }

/* Join and other members' pages: a navy stage with a line of tape */
.bc-amp-stage { background: #12233f !important; }
.bc-amp-stage::before { display: none !important; }
.bc-amp-stage::after { background: linear-gradient(180deg, rgba(18, 35, 63, 0) 40%, var(--bc-bg) 100%) !important; }
.bc-amp-cover { background: #12233f !important; }
.bc-amp-page .bc-amp-kicker { color: var(--ffd-accent) !important; }
.bc-amp-page .bc-amp-card { box-shadow: 0 30px 80px -30px rgba(18, 35, 63, .45), 0 0 0 1px var(--bc-line) !important; }

/* Dark mode: the rail and hero must stay readable */
html[data-theme="dark"] .cm-hero:not(.has-cover) { background: #0c1524 !important; }

/* The admin dashboard and member hero: flat navy, and the rail navy too */
.cl-rail { background: #12233f !important; }
html[data-theme="dark"] .cl-rail { background: #0c1524 !important; }
.am-hero { background: #12233f !important; }
.am-hero::before, .am-hero::after { display: none !important; }
html[data-theme="dark"] .am-hero { background: #0c1524 !important; }

/* Phone: the closed menu must not cast a shadow on the page */
.cl-app:not(.is-menu) .cl-rail { box-shadow: none !important; }