/* ═══════════════════════════════════════════════════════════════
   Global Theme Variables
   This file contains the single source of truth for website colors.
═══════════════════════════════════════════════════════════════ */

:root {
  /* ── Brand Palette ── */
  --primary-color: #ea740c;
  --primary-dark: #d46500;
  --primary-light: #ff9a3c;

  --secondary-color: #1e3a5f;
  --secondary-light: #2d5a8e;

  --third-color: #edf0f3;
  --accent-color: #10b981;

  --header-height: 74px;
  --line-clamp: 2;

  /* ── Derived Neutrals ── */
  --text-primary: #0f172a;
  --text-secondary: #475569;
  --text-muted: #94a3b8;
  --bg-subtle: #f8fafc;
  --bg-muted: #f1f5f9;
  --border-light: #e2e8f0;
  --border-default: #cbd5e1;

  /* ── Gradients ── */
  --gradient-primary: linear-gradient(135deg, #ea740c 0%, #ff9a3c 100%);
  --gradient-secondary: linear-gradient(135deg, #1e3a5f 0%, #2d5a8e 100%);
  --gradient-accent: linear-gradient(135deg, #ea740c 0%, #1e3a5f 100%);
  --gradient-warm: linear-gradient(
    135deg,
    #ff9a3c 0%,
    #ea740c 50%,
    #d46500 100%
  );

  /* ── Shadows ── */
  --shadow-sm: 0 1px 3px rgba(30, 58, 95, 0.06);
  --shadow-md: 0 4px 16px rgba(30, 58, 95, 0.08);
  --shadow-lg: 0 12px 40px rgba(30, 58, 95, 0.12);
  --shadow-xl: 0 24px 56px rgba(30, 58, 95, 0.16);

  /* ── Admin Dashboard Mappings ── */
  --primary: var(--primary-color);
  --primary-light: color-mix(in srgb, var(--primary-color) 10%, transparent);
  --primary-hover: color-mix(in srgb, var(--primary-color) 85%, black);

  /* ── Bootstrap 5 Overrides ── */
  --bs-primary: var(--primary-color) !important;
}

/* Global Bootstrap overrides to ensure the color applies perfectly */
.text-primary,
.link-primary {
  color: var(--primary-color) !important;
}

.bg-primary {
  background-color: var(--primary-color) !important;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--primary-color);
  --bs-btn-border-color: var(--primary-color);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: color-mix(in srgb, var(--primary-color) 85%, black);
  --bs-btn-hover-border-color: color-mix(
    in srgb,
    var(--primary-color) 85%,
    black
  );
  --bs-btn-focus-shadow-rgb: 0, 0, 0;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: color-mix(in srgb, var(--primary-color) 80%, black);
  --bs-btn-active-border-color: color-mix(
    in srgb,
    var(--primary-color) 80%,
    black
  );
}

.btn-outline-primary {
  --bs-btn-color: var(--primary-color);
  --bs-btn-border-color: var(--primary-color);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primary-color);
  --bs-btn-hover-border-color: var(--primary-color);
  --bs-btn-focus-shadow-rgb: 0, 0, 0;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primary-color);
  --bs-btn-active-border-color: var(--primary-color);
}