/*
 * BLACKTWENTY brand override -- colors/fonts/shapes adapted from the
 * BT Republic Events Quotation reference, keeping the BLACKTWENTY
 * name/icon. Loaded globally (see includes/header.php) AFTER theme.css
 * and user.css, so these declarations win the cascade without editing
 * the generated Falcon vendor file directly.
 *
 * Approach: Falcon/Bootstrap build every component's colors from
 * --falcon-* custom properties. Most of those properties are only
 * SET (not var()-referenced) at the component level, so overriding the
 * root tokens alone doesn't cascade everywhere -- this file overrides
 * the root tokens for broad effect, then redeclares the same
 * component-level custom property names (--falcon-btn-bg, etc.) that
 * Falcon's own rules already consume, for the specific components that
 * hardcode the primary blue (#2c7be5).
 */

@font-face { font-family: "Bebas Neue"; src: url("../fonts/bebas-neue-400.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-400.woff2") format("woff2"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-600.woff2") format("woff2"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-700.woff2") format("woff2"); font-style: normal; font-weight: 700; font-display: swap; }
@font-face { font-family: "Montserrat"; src: url("../fonts/montserrat-800.woff2") format("woff2"); font-style: normal; font-weight: 800; font-display: swap; }

:root {
  --bt-ink: #0b0b0b;
  --bt-panel: #1a1a1a;
  --bt-panel2: #141414;
  --bt-line: #3b3b3b;
  --bt-muted: #a7a7a7;
  --bt-white: #ffffff;
  --bt-yellow: #ffdd6e;
  --bt-yellow-hover: #ffe89a;
  --bt-yellow-rgb: 255, 221, 110;
  --bt-red: #b51111;
  --bt-font-display: "Bebas Neue", Impact, "Arial Narrow", sans-serif;
  --bt-font-body: "Montserrat", Arial, sans-serif;
}

/* ---- Root design tokens: broad cascade for anything using var(--falcon-*) directly ---- */
[data-bs-theme=dark] {
  --falcon-primary: var(--bt-yellow);
  --falcon-primary-rgb: var(--bt-yellow-rgb);
  --falcon-primary-text-emphasis: var(--bt-yellow);
  --falcon-link-color: var(--bt-yellow);
  --falcon-link-color-rgb: var(--bt-yellow-rgb);
  --falcon-link-hover-color: var(--bt-yellow-hover);
  --falcon-link-hover-color-rgb: 255, 232, 154;
  --falcon-alert-link-color: var(--bt-yellow);

  --falcon-body-bg: var(--bt-ink);
  --falcon-body-bg-rgb: 11, 11, 11;
  --falcon-quaternary-bg: var(--bt-panel2);
  --falcon-quaternary-bg-rgb: 20, 20, 20;
  --falcon-emphasis-bg: var(--bt-panel);
  --falcon-emphasis-bg-rgb: 26, 26, 26;
  --falcon-body-font-family: var(--bt-font-body);
  --falcon-font-sans-serif: var(--bt-font-body);
  --falcon-font-base: var(--bt-font-body);

  --falcon-navbar-vertical-default-bg-color: var(--bt-panel2);
  --falcon-navbar-vertical-default-link-active-color: var(--bt-yellow);
  --falcon-navbar-vertical-default-link-hover-color: var(--bt-white);
  --falcon-bg-navbar-glass: rgba(11, 11, 11, .96);

  --falcon-dropdown-link-active-bg: var(--bt-yellow);
  --falcon-dropdown-link-active-color: var(--bt-ink);
}

body { font-family: var(--bt-font-body); }

h1, h2, h3, h4, h5, h6,
.card-title,
.navbar-vertical-content .navbar-brand strong,
.section-title,
.display-1, .display-2, .display-3, .display-4 {
  font-family: var(--bt-font-display);
  letter-spacing: .02em;
}

/* ---- Buttons ---- */
.btn-primary {
  --falcon-btn-color: var(--bt-ink);
  --falcon-btn-bg: var(--bt-yellow);
  --falcon-btn-border-color: var(--bt-yellow);
  --falcon-btn-hover-color: var(--bt-ink);
  --falcon-btn-hover-bg: var(--bt-yellow-hover);
  --falcon-btn-hover-border-color: var(--bt-yellow-hover);
  --falcon-btn-active-color: var(--bt-ink);
  --falcon-btn-active-bg: #f5cf4f;
  --falcon-btn-active-border-color: #f5cf4f;
  --falcon-btn-disabled-color: var(--bt-ink);
  --falcon-btn-disabled-bg: var(--bt-yellow);
  --falcon-btn-disabled-border-color: var(--bt-yellow);
  font-weight: 700;
}
.btn-outline-primary {
  --falcon-btn-color: var(--bt-yellow);
  --falcon-btn-border-color: var(--bt-yellow);
  --falcon-btn-hover-color: var(--bt-ink);
  --falcon-btn-hover-bg: var(--bt-yellow);
  --falcon-btn-hover-border-color: var(--bt-yellow);
  --falcon-btn-active-color: var(--bt-ink);
  --falcon-btn-active-bg: var(--bt-yellow);
  --falcon-btn-active-border-color: var(--bt-yellow);
  --falcon-btn-disabled-color: var(--bt-yellow);
  --falcon-btn-disabled-border-color: var(--bt-yellow);
}
.btn-falcon-primary {
  --falcon-btn-falcon-primary-color: var(--bt-yellow);
  --falcon-btn-falcon-primary-hover-color: var(--bt-yellow-hover);
  --falcon-btn-falcon-primary-active-color: var(--bt-yellow-hover);
}

/* ---- Forms ---- */
.form-control:focus,
.form-select:focus {
  border-color: var(--bt-yellow);
  box-shadow: var(--falcon-box-shadow-inset, inset 0 1px 2px rgba(0,0,0,.4)), 0 0 0 .25rem rgba(var(--bt-yellow-rgb), .25);
}
.form-check-input:focus {
  border-color: var(--bt-yellow);
  box-shadow: 0 0 0 .25rem rgba(var(--bt-yellow-rgb), .25);
}
.form-check-input:checked {
  background-color: var(--bt-yellow);
  border-color: var(--bt-yellow);
}
.form-check-input:checked[type=checkbox] {
  --falcon-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%230b0b0b' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
.form-check-input:checked[type=radio] {
  --falcon-form-check-radio-checked-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%230b0b0b'/%3e%3c/svg%3e");
}
.form-range::-webkit-slider-thumb { background-color: var(--bt-yellow); }
.form-range::-moz-range-thumb { background-color: var(--bt-yellow); }
.form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--bt-panel2), 0 0 0 .25rem rgba(var(--bt-yellow-rgb), .25); }
.form-range:focus::-moz-range-thumb { box-shadow: 0 0 0 1px var(--bt-panel2), 0 0 0 .25rem rgba(var(--bt-yellow-rgb), .25); }

/* ---- Nav / tabs / pills ---- */
.nav-pills {
  --falcon-nav-pills-link-active-color: var(--bt-ink);
  --falcon-nav-pills-link-active-bg: var(--bt-yellow);
}
.nav-link:focus-visible {
  box-shadow: 0 0 0 .25rem rgba(var(--bt-yellow-rgb), .25);
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
  color: var(--bt-yellow);
  border-color: var(--bt-line) var(--bt-line) var(--bt-panel);
}

/* ---- Dropdowns ---- */
.dropdown-menu {
  --falcon-dropdown-link-active-color: var(--bt-ink);
  --falcon-dropdown-link-active-bg: var(--bt-yellow);
}
.dropdown-menu-dark {
  --falcon-dropdown-link-active-color: var(--bt-ink);
  --falcon-dropdown-link-active-bg: var(--bt-yellow);
}

/* ---- Pagination ---- */
.pagination {
  --falcon-pagination-hover-color: var(--bt-ink);
  --falcon-pagination-hover-bg: var(--bt-yellow);
  --falcon-pagination-hover-border-color: var(--bt-yellow);
  --falcon-pagination-active-color: var(--bt-ink);
  --falcon-pagination-active-bg: var(--bt-yellow);
  --falcon-pagination-active-border-color: var(--bt-yellow);
}

/* ---- Progress bars ---- */
.progress, .progress-stacked {
  --falcon-progress-bar-color: var(--bt-ink);
  --falcon-progress-bar-bg: var(--bt-yellow);
}

/* ---- List group ---- */
.list-group {
  --falcon-list-group-active-color: var(--bt-ink);
  --falcon-list-group-active-bg: var(--bt-yellow);
  --falcon-list-group-active-border-color: var(--bt-yellow);
}

/* ---- Close button / accordion focus rings ---- */
.btn-close { --falcon-btn-close-focus-shadow: 0 0 0 .25rem rgba(var(--bt-yellow-rgb), .25); }
.accordion { --falcon-accordion-btn-focus-box-shadow: 0 0 0 .25rem rgba(var(--bt-yellow-rgb), .25); --falcon-accordion-active-color: var(--bt-yellow); }

/* ---- Sidebar brand logo (matches login page treatment) ---- */
.navbar-vertical .navbar-brand span {
  font-family: var(--bt-font-display);
  letter-spacing: .03em;
}

.navbar-vertical-content .nav-link.active,
.navbar-vertical-content .nav-link[aria-expanded=true] {
  color: var(--bt-yellow) !important;
}

/* ---- Links / badges ---- */
a { }
.badge.bg-primary,
.bg-primary { background-color: var(--bt-yellow) !important; color: var(--bt-ink) !important; }
.text-primary { color: var(--bt-yellow) !important; }
.border-primary { border-color: var(--bt-yellow) !important; }

/* ---- Cards: subtle sharpening to match the brand's angular language ---- */
.card { border-radius: 6px; }

/*
 * Tables: Falcon's dark theme never actually overrides --falcon-table-color
 * (it's hardcoded to #5e6e82, a light-mode grey, with no [data-bs-theme=dark]
 * variant anywhere in theme.css) -- a latent contrast gap that was invisible
 * while dark mode was opt-in, but reads as unusably faint now that dark mode
 * is the permanent default.
 */
/*
 * footer_section.php locks its own <section data-bs-theme="light">, so it
 * reads Falcon's light-mode --falcon-dark (#0b1727, navy) for .bg-dark
 * regardless of the page's overall theme -- override directly so the
 * footer matches the near-black brand ink rather than navy.
 */
footer .bg-dark,
section.bg-dark {
  background-color: var(--bt-ink) !important;
}

[data-bs-theme=dark] .table {
  --falcon-table-color: var(--bt-muted);
  --falcon-table-striped-color: var(--bt-muted);
  --falcon-table-active-color: var(--bt-white);
  --falcon-table-hover-color: var(--bt-white);
}

/* ---- Auth pages (login / magic-link) ---- */
.bt-auth-theme {
  min-height: 100vh;
  background:
    radial-gradient(ellipse at 78% 0%, rgba(255, 221, 110, .16), transparent 20rem),
    radial-gradient(ellipse at 96% 12%, rgba(255, 255, 255, .08), transparent 15rem),
    linear-gradient(#111, #181818 58%, #0b0b0b);
}
.bt-auth-theme .bg-auth-circle-shape,
.bt-auth-theme .bg-auth-circle-shape-2,
.bt-auth-theme .bg-auth-card-shape {
  display: none;
}
.bt-auth-theme .card {
  border: 1px solid var(--bt-line);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .35);
}
.bt-auth-theme .bg-card-gradient {
  position: relative;
  overflow: hidden;
  background: linear-gradient(155deg, #1c1c1c, #0e0e0e) !important;
  border-right: 1px solid var(--bt-line);
  border-top: 4px solid var(--bt-red);
}
.bt-auth-theme .bg-card-gradient::before {
  content: "";
  position: absolute;
  top: 20px;
  right: -60px;
  width: 260px;
  height: 140px;
  opacity: .5;
  background:
    linear-gradient(155deg, transparent 42%, var(--bt-red) 43% 45%, transparent 46%),
    linear-gradient(25deg, transparent 55%, var(--bt-yellow) 56% 57%, transparent 58%);
  pointer-events: none;
}
.bt-auth-theme .bg-card-gradient a.link-light {
  color: var(--bt-yellow) !important;
  font-family: var(--bt-font-display);
  font-size: 26px;
  font-weight: 400;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.bt-auth-theme .bg-card-gradient a.link-light img { filter: none; }
.bt-auth-theme .bg-card-gradient p { color: var(--bt-muted) !important; font-size: 12px; line-height: 1.6; }
.bt-auth-theme .bg-card-gradient a:not(.link-light) { color: var(--bt-yellow) !important; }
.bt-auth-theme .bt-eyebrow {
  margin: 0 0 6px;
  color: var(--bt-yellow);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-family: var(--bt-font-body);
}
.bt-auth-theme h3 {
  font-size: 40px;
  font-weight: 400;
  text-transform: uppercase;
  color: var(--bt-white);
}
.bt-auth-theme .form-control {
  border: 1px solid #465158;
  background: #080c0e;
  color: var(--bt-white);
}
.bt-auth-theme .form-control:focus { background: #080c0e; color: var(--bt-white); }
.bt-auth-theme .col-md-7 p.text-center { color: var(--bt-muted); }