/*
 * CampusFlow global colour system
 * Midnight Navy + Teal is the single source of truth for every web surface.
 */
:root {
  color-scheme: light;

  /* Brand palette */
  --cf-midnight: #0f2942;
  --cf-midnight-soft: #123c4b;
  --cf-navy: var(--cf-midnight);
  --cf-navy-light: #164e63;
  --cf-teal: #0f766e;
  --cf-teal-mid: #0d9488;
  --cf-teal-bright: #14b8a6;
  --cf-mint: #ccfbf1;
  --cf-teal-wash: #f0fdfa;

  /* Neutral surfaces and type */
  --cf-cloud: #f8fafc;
  --cf-paper: var(--cf-cloud);
  --cf-paper-bright: #ffffff;
  --cf-white: #ffffff;
  --cf-ink: #0f172a;
  --cf-muted: #64748b;
  --cf-muted-light: #94a3b8;
  --cf-border: #b7e3de;
  --cf-line-light: #e3f3f1;
  --cf-line-dark: rgba(204, 251, 241, 0.18);

  /* Status colours are reserved for state feedback */
  --cf-success: #16a34a;
  --cf-success-soft: #dcfce7;
  --cf-warning: #d97706;
  --cf-warning-soft: #fef3c7;
  --cf-danger: #dc2626;
  --cf-danger-soft: #fee2e2;

  /* Shared treatments */
  --cf-header-gradient: linear-gradient(
    135deg,
    var(--cf-midnight) 0%,
    var(--cf-midnight-soft) 72%,
    var(--cf-teal) 145%
  );
  --cf-shadow-sm: 0 1px 3px rgba(15, 118, 110, 0.08);
  --cf-shadow-md: 0 4px 16px rgba(15, 118, 110, 0.12);
  --cf-shadow-lg: 0 8px 32px rgba(15, 41, 66, 0.16);

  /* Compatibility aliases used by the application UI */
  --primary: var(--cf-teal);
  --primary-dark: var(--cf-midnight);
  --primary-mid: var(--cf-teal-mid);
  --primary-light: var(--cf-mint);
  --primary-xlight: var(--cf-teal-wash);
  --accent: var(--cf-teal-bright);
  --success: var(--cf-success);
  --success-light: var(--cf-success-soft);
  --danger: var(--cf-danger);
  --danger-light: var(--cf-danger-soft);
  --warning: var(--cf-warning);
  --warning-light: var(--cf-warning-soft);
  --text-main: var(--cf-ink);
  --text-muted: var(--cf-muted);
  --text-light: var(--cf-muted-light);
  --text-on-primary: var(--cf-white);
  --bg-body: var(--cf-cloud);
  --bg-card: var(--cf-paper-bright);
  --bg-subtle: var(--cf-cloud);
  --border: var(--cf-border);
  --border-light: var(--cf-line-light);
  --shadow-sm: var(--cf-shadow-sm);
  --shadow-md: var(--cf-shadow-md);
  --shadow-lg: var(--cf-shadow-lg);
  --white: var(--cf-white);
}

/* Keep the major shells visually continuous across every CampusFlow role. */
.header,
.header-solid,
.booking-live-hero,
.admin-sidebar,
.stats-app-header,
.attendant-header {
  background: var(--cf-header-gradient);
}

.auth-bg {
  background:
    radial-gradient(circle at 86% 8%, rgba(20, 184, 166, 0.24), transparent 34%),
    var(--cf-header-gradient);
}