/* ==========================================================================
   Crown Sports & Events — shared design system
   Palette: navy / black / white / gold. Brand colours are overridden at runtime
   from Settings → Branding (see layouts: <style> :root { --crown-* }).
   ========================================================================== */
:root {
  --crown-navy:       #0b1730;
  --crown-navy-2:     #14284d;
  --crown-navy-3:     #1d3866;
  --crown-black:      #05070d;
  --crown-gold:       #c9a84c;
  --crown-gold-2:     #e8ca7a;
  --crown-gold-dark:  #9a7a28;
  --crown-ink:        #1a1f2e;
  --crown-muted:      #6b7280;
  --crown-muted-2:    #9ca3af;
  --crown-bg:         #f7f8fa;
  --crown-card:       #ffffff;
  --crown-border:     #e8eaef;
  --crown-border-2:   #d1d5de;
  --crown-radius:     10px;
  --crown-radius-sm:  6px;
  --crown-radius-lg:  16px;
  --crown-shadow:     0 1px 3px rgba(11,23,48,.06), 0 4px 16px rgba(11,23,48,.07);
  --crown-shadow-lg:  0 8px 32px rgba(11,23,48,.14);
  --crown-font:       'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --crown-font-display: 'Outfit', 'Inter', system-ui, sans-serif;

  --bs-body-font-family:   var(--crown-font);
  --bs-body-color:         var(--crown-ink);
  --bs-primary:            var(--crown-navy);
  --bs-primary-rgb:        11, 23, 48;
  --bs-link-color:         var(--crown-navy-3);
  --bs-link-hover-color:   var(--crown-gold-dark);
  --bs-border-color:       var(--crown-border);
  --bs-border-radius:      var(--crown-radius-sm);
}

html { scroll-behavior: smooth; }
body { font-family: var(--crown-font); color: var(--crown-ink); background: var(--crown-bg);
       -webkit-font-smoothing: antialiased; font-size: 15px; line-height: 1.65; }
h1,h2,h3 { font-family: var(--crown-font-display); letter-spacing: -.02em; line-height: 1.2; }
h4,h5,h6 { font-family: var(--crown-font); font-weight: 600; }
h1,h2,h3,h4,h5,h6 { color: var(--crown-navy); }
.display-font { font-family: var(--crown-font-display); }
a { text-underline-offset: 3px; }
:focus-visible { outline: 2px solid var(--crown-gold); outline-offset: 2px; }
.skip-link { position: absolute; left: -999px; top: 8px; background: var(--crown-gold);
             color: #000; padding: .5rem 1rem; z-index: 2000; border-radius: 6px; }
.skip-link:focus { left: 8px; }

/* ---- Buttons ----------------------------------------------------------- */
.btn { font-weight: 600; border-radius: 8px; font-size: .875rem; letter-spacing: .01em; }
.btn-lg { font-size: 1rem; padding: .75rem 1.75rem; }
.btn-sm { font-size: .8rem; }
.btn-primary {
  --bs-btn-bg: var(--crown-navy); --bs-btn-border-color: var(--crown-navy);
  --bs-btn-hover-bg: var(--crown-navy-2); --bs-btn-hover-border-color: var(--crown-navy-2);
  --bs-btn-active-bg: var(--crown-navy-3); --bs-btn-disabled-bg: var(--crown-navy); }
.btn-outline-primary {
  --bs-btn-color: var(--crown-navy); --bs-btn-border-color: var(--crown-navy);
  --bs-btn-hover-bg: var(--crown-navy); --bs-btn-hover-border-color: var(--crown-navy); }
.btn-gold {
  --bs-btn-color: var(--crown-navy); --bs-btn-bg: var(--crown-gold);
  --bs-btn-border-color: var(--crown-gold); --bs-btn-hover-color: var(--crown-navy);
  --bs-btn-hover-bg: var(--crown-gold-2); --bs-btn-hover-border-color: var(--crown-gold-2);
  --bs-btn-active-bg: var(--crown-gold-dark); --bs-btn-active-border-color: var(--crown-gold-dark);
  --bs-btn-active-color: #fff; }
.btn-outline-gold {
  --bs-btn-color: var(--crown-gold); --bs-btn-border-color: var(--crown-gold);
  --bs-btn-hover-color: var(--crown-navy); --bs-btn-hover-bg: var(--crown-gold);
  --bs-btn-hover-border-color: var(--crown-gold); }
.btn-icon { display: inline-flex; align-items: center; gap: .4rem; }

/* ---- Cards ------------------------------------------------------------- */
.card { border-color: var(--crown-border); border-radius: var(--crown-radius);
        box-shadow: var(--crown-shadow); }
.card-header { background: transparent; border-bottom-color: var(--crown-border); font-weight: 600; }
.card-crown { background: var(--crown-card); border: 1px solid var(--crown-border);
              border-radius: var(--crown-radius); box-shadow: var(--crown-shadow); }

/* ---- Forms ------------------------------------------------------------- */
.form-label { font-weight: 600; font-size: .82rem; color: var(--crown-ink); margin-bottom: .3rem; }
.form-label.required::after { content: " *"; color: #c0392b; }
.form-control, .form-select { border-color: var(--crown-border-2); border-radius: 8px; font-size: .9rem; }
.form-control:focus, .form-select:focus {
  border-color: var(--crown-navy-3); box-shadow: 0 0 0 .2rem rgba(11,23,48,.1); }
.form-text { font-size: .78rem; }

/* ---- Tables ------------------------------------------------------------ */
.table { --bs-table-bg: transparent; }
.table > thead > tr > th { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em;
  color: var(--crown-muted); font-weight: 700; border-bottom-width: 1px; white-space: nowrap; background: #fafbfd; }
.table-hover > tbody > tr:hover > * { --bs-table-bg-state: #f5f7fc; }
.table td { vertical-align: middle; }
.table-actions { white-space: nowrap; text-align: right; }

/* ---- Badges / misc ----------------------------------------------------- */
.badge { font-weight: 600; letter-spacing: .01em; font-size: .72rem; }
.badge.text-bg-warning { color: #4a3500 !important; }
.text-gold { color: var(--crown-gold) !important; }
.text-gold-dark { color: var(--crown-gold-dark) !important; }
.bg-navy { background: var(--crown-navy) !important; color: #fff; }
.bg-black-crown { background: var(--crown-black) !important; color: #fff; }
.divider-gold { width: 48px; height: 3px; background: var(--crown-gold); border-radius: 3px; }
.empty-state { text-align: center; padding: 3rem 1rem; color: var(--crown-muted); }
.empty-state .bi { font-size: 2.4rem; color: #c3c9d6; display: block; margin-bottom: .6rem; }
.avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--crown-navy);
          color: var(--crown-gold); display: inline-flex; align-items: center; justify-content: center;
          font-weight: 700; font-size: .82rem; flex: none; }
.avatar-sm { width: 28px; height: 28px; font-size: .7rem; }

/* ---- KPI tiles --------------------------------------------------------- */
.kpi { background: var(--crown-card); border: 1px solid var(--crown-border); border-radius: var(--crown-radius);
       padding: 1rem 1.15rem; box-shadow: var(--crown-shadow); height: 100%;
       position: relative; overflow: hidden; }
.kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0;
               width: 3px; background: var(--crown-gold); }
.kpi .kpi-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .07em;
                  color: var(--crown-muted); font-weight: 700; }
.kpi .kpi-value { font-family: var(--crown-font-display); font-size: 1.9rem; line-height: 1.1;
                  color: var(--crown-navy); font-weight: 700; margin-top: .2rem; }
.kpi .kpi-sub { font-size: .78rem; color: var(--crown-muted); }
.kpi.kpi-danger::before { background: #d64545; }
.kpi.kpi-success::before { background: #2e9e6a; }

/* ---- Toasts ------------------------------------------------------------ */
.toast-stack { position: fixed; top: 1rem; right: 1rem; z-index: 2100;
               display: flex; flex-direction: column; gap: .5rem;
               max-width: min(92vw, 380px); }

/* ---- Utilities --------------------------------------------------------- */
.min-w-0 { min-width: 0; }

@media print {
  .no-print, .sidebar, .topbar { display: none !important; }
  body { background: #fff; }
}