/* ============================================================
   Tenant theme — Babcock University
   Single source of truth for brand colors. Loaded by both
   includes/header.php (admin) and partials/header.php (storefront)
   before per-page CSS so any stylesheet using var(--primary) etc.
   inherits the tenant palette automatically.
   ============================================================ */

:root {
  /* Brand */
  --primary:        #003B7A;   /* Babcock royal blue */
  --primary-dark:   #002A5C;
  --primary-light:  #1A5598;
  --primary-2:      #1A5598;   /* legacy alias used by storefront gradients */
  --primary-soft:   #E6EEF7;   /* tinted backgrounds, badges */

  --accent:         #C9A227;   /* Babcock gold */
  --accent-dark:    #A88420;
  --accent-light:   #E0B941;
  --accent-soft:    #F7EDC9;

  /* Neutrals */
  --ink:            #0a0a0a;
  --ink-2:          #1f2937;
  --muted:          #64748b;
  --muted-2:        #94a3b8;
  --surface:        #ffffff;
  --surface-alt:    #f5f7fb;
  --surface-2:      #eef2f7;
  --border:         #e2e6ea;
  --border-strong:  #cbd2da;

  /* Status (kept generic across tenants) */
  --success:        #1f8a4d;
  --success-dark:   #166936;
  --warning:        #b8860b;
  --warning-soft:   #fff4cc;
  --danger:         #c0392b;
  --danger-dark:    #962d22;
  --danger-soft:    #fde7e4;
  --info:           #1A5598;

  /* Misc */
  --radius:         10px;
  --radius-sm:      6px;
  --radius-lg:      16px;
  --shadow-sm:      0 1px 2px rgba(10,20,40,.06);
  --shadow:         0 4px 12px rgba(10,20,40,.08);
  --shadow-lg:      0 12px 32px rgba(10,20,40,.12);
}

/* Convenience utility classes used across rebrand surfaces */
.brand-bg   { background: var(--primary); color: #fff; }
.brand-fg   { color: var(--primary); }
.accent-bg  { background: var(--accent); color: #fff; }
.accent-fg  { color: var(--accent); }
.brand-grad { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%); color:#fff; }

/* ============================================================
   Universal navigation drawer (partials/_bv_nav.php)
   Used on every customer-facing page so the admin/vendor entry
   point is always one tap away — especially on mobile where
   topbars hide their secondary links.
   ============================================================ */

.bv-nav-toggle{
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px;
  border:1px solid var(--border); background:#fff; color:var(--ink);
  cursor:pointer; transition:.12s; flex:0 0 auto;
  font-size:20px; line-height:1; font-family:inherit;
}
.bv-nav-toggle:hover{ border-color:var(--primary); color:var(--primary) }
.bv-nav-toggle:focus-visible{ outline:none; box-shadow:0 0 0 3px rgba(0,59,122,.25) }

.bv-drawer{
  position:fixed; inset:0; z-index:200;
  pointer-events:none;
}
.bv-drawer .bv-drawer-backdrop{
  position:absolute; inset:0;
  background:rgba(2,10,28,.45); backdrop-filter:blur(2px);
  opacity:0; transition:opacity .22s ease;
}
.bv-drawer .bv-drawer-panel{
  position:absolute; top:0; right:0; bottom:0;
  width:min(380px, 92vw);
  background:#fff;
  display:flex; flex-direction:column;
  transform:translateX(100%);
  transition:transform .26s cubic-bezier(.2,.7,.2,1);
  box-shadow:-18px 0 48px rgba(0,0,0,.25);
}
.bv-drawer.open{ pointer-events:auto }
.bv-drawer.open .bv-drawer-backdrop{ opacity:1 }
.bv-drawer.open .bv-drawer-panel{ transform:translateX(0) }

.bv-drawer header{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 18px; border-bottom:1px solid var(--border);
}
.bv-drawer-brand{ display:flex; align-items:center; gap:10px }
.bv-drawer-brand img{ width:36px; height:36px; border-radius:6px }
.bv-drawer-brand strong{ font-weight:800; color:var(--primary); letter-spacing:.5px; font-size:15px }
.bv-drawer-brand small{ display:block; color:var(--muted); font-size:10px; letter-spacing:2px }
.bv-drawer-close{
  width:32px; height:32px; border-radius:50%; border:none;
  background:var(--surface-2); color:var(--ink-2); font:inherit;
  cursor:pointer; transition:.12s;
}
.bv-drawer-close:hover{ background:var(--border-strong); color:var(--ink) }

.bv-drawer-me{
  padding:14px 18px; background:var(--primary-soft);
  border-bottom:1px solid var(--border);
}
.bv-drawer-me .l{ font-size:11px; font-weight:800; letter-spacing:.5px; color:var(--primary); display:block }
.bv-drawer-me strong{ display:block; margin-top:2px; font-size:15px; color:var(--ink) }

.bv-drawer nav{ flex:1; overflow-y:auto; padding:8px 8px }
.bv-drawer nav a{
  display:flex; align-items:flex-start; gap:14px;
  padding:12px 14px; margin:2px 0;
  border-radius:10px; text-decoration:none; color:var(--ink-2);
  transition:.12s;
}
.bv-drawer nav a:hover{ background:var(--surface-alt) }
.bv-drawer nav a .ic{ font-size:22px; line-height:1; flex:0 0 auto; width:28px; text-align:center }
.bv-drawer nav a strong{ display:block; color:var(--ink); font-weight:800; font-size:14.5px; line-height:1.2 }
.bv-drawer nav a small{ display:block; color:var(--muted); font-size:12.5px; margin-top:3px; line-height:1.35; font-weight:500 }
.bv-drawer nav a.danger strong{ color:var(--danger-dark) }
.bv-drawer-sep{
  margin:12px 6px 4px; padding:0 8px;
  font-size:11px; font-weight:800; letter-spacing:.6px;
  text-transform:uppercase; color:var(--muted-2);
}
.bv-drawer-foot{
  padding:10px 18px; border-top:1px solid var(--border);
  font-size:11.5px; color:var(--muted-2); text-align:center;
}