/* =============================================================
   AABU — Centralized Color Theme
   Government University Official Palette
   Primary: Deep Navy #062d52 | Secondary: Antique Gold #C9A84C
   =============================================================
   To update the entire site's color scheme, edit ONLY this file.
   All other CSS files consume these variables via var(--color-*).
   ============================================================= */

:root {
  /* --- Primary Deep Navy --- */
  --color-primary: #062d52;
  --color-primary-dark: #031626;
  --color-primary-light: #0b4c8c;
  --color-primary-rgb: 6, 45, 82;
  --color-primary-dark-rgb: 3, 22, 38;
  --color-primary-light-rgb: 11, 76, 140;

  /* --- Secondary Antique Gold (warmer to complement deep navy) --- */
  --color-secondary: #c9a84c;
  --color-secondary-dark: #a8872e;
  --color-secondary-light: #dfc06a;
  --color-secondary-rgb: 201, 168, 76;
  --color-secondary-dark-rgb: 168, 135, 46;
  --color-secondary-light-rgb: 223, 192, 106;

  /* --- Text Hierarchy (deep navy tinted) --- */
  --color-text-primary: #0d2740;
  --color-text-secondary: #3d5068;
  --color-text-muted: #647a92;
  --color-text-primary-rgb: 13, 39, 64;
  --color-text-secondary-rgb: 61, 80, 104;
  --color-text-muted-rgb: 100, 122, 146;

  /* --- Borders --- */
  --color-border: #c2cdd8;
  --color-border-light: #dde4ec;
  --color-border-rgb: 194, 205, 216;
  --color-border-light-rgb: 221, 228, 236;

  /* --- Section Backgrounds (deep navy tinted) --- */
  --color-bg-light: #e8edf5;
  --color-bg-section: #f1f4f9;
  --color-bg-soft: #f7f9fc;

  /* --- Status Colors --- */
  --color-success: #1a7a40;
  --color-success-rgb: 26, 122, 64;
  --color-error: #c0392b;
  --color-error-rgb: 192, 57, 43;

  /* --- Base --- */
  --color-white: #ffffff;
  --color-black: #000000;

  /* =============================================================
     Semantic / Component Aliases
     These map semantic usage to the core palette above.
     Change the palette above; these follow automatically.
     ============================================================= */

  /* Hero gradient stops */
  --gradient-hero: linear-gradient(
    135deg,
    var(--color-primary-dark) 0%,
    var(--color-primary) 50%,
    var(--color-secondary) 100%
  );
  --gradient-hero-subtle: linear-gradient(
    135deg,
    var(--color-primary-dark) 0%,
    var(--color-primary) 100%
  );

  /* Section heading icon background */
  --gradient-section-icon: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-secondary) 100%
  );

  /* Card / panel accent gradient */
  --gradient-card-accent: linear-gradient(
    135deg,
    var(--color-primary) 0%,
    var(--color-primary-light) 100%
  );

  /* Decorative bar / underline */
  --gradient-accent-bar: linear-gradient(
    90deg,
    var(--color-secondary) 0%,
    var(--color-secondary-light) 100%
  );

  /* Button / CTA primary */
  --color-btn-primary-bg: var(--color-primary);
  --color-btn-primary-text: var(--color-white);
  --color-btn-primary-hover: var(--color-primary-dark);

  /* Button / CTA secondary (gold) */
  --color-btn-secondary-bg: var(--color-secondary);
  --color-btn-secondary-text: var(--color-primary-dark);
  --color-btn-secondary-hover: var(--color-secondary-dark);

  /* Navigation */
  --color-nav-bg: var(--color-primary);
  --color-nav-text: var(--color-white);
  --color-nav-hover: rgba(var(--color-secondary-rgb), 0.15);
  --color-nav-active: var(--color-secondary);

  /* Links */
  --color-link: var(--color-primary-light);
  --color-link-hover: var(--color-secondary-dark);

  /* Header */
  --color-header-bg: var(--color-primary);
  --color-header-text: var(--color-white);
  --color-header-gold: var(--color-secondary);

  /* Footer */
  --color-footer-bg: var(--color-primary-dark);
  --color-footer-text: rgba(255, 255, 255, 0.85);
  --color-footer-gold: var(--color-secondary);

  /* Borders / Dividers */
  --color-divider: var(--color-secondary);
  --color-section-border: rgba(var(--color-primary-rgb), 0.12);

  /* Stacked page sections — subtle divider + alternating band backgrounds */
  --section-separator-color: var(--color-border-light);
  --section-separator-width: 1px;
  --section-separator-accent-width: 4rem;
  --section-separator-accent-height: 0.25rem;
  --section-stack-padding: 2.75rem 0 2rem;
  --section-stack-alt-bg: var(--color-bg-soft);
  /* Background color for every other section band */
  --section-band-bg: var(--color-bg-section);

  /* Shadows using primary color */
  --shadow-sm: 0 2px 8px rgba(var(--color-primary-rgb), 0.1);
  --shadow-md: 0 4px 16px rgba(var(--color-primary-rgb), 0.14);
  --shadow-lg: 0 8px 32px rgba(var(--color-primary-rgb), 0.18);
  --shadow-gold: 0 4px 16px rgba(var(--color-secondary-rgb), 0.3);

  /* Skeleton loading */
  --color-skeleton-base: var(--color-bg-light);
  --color-skeleton-shine: var(--color-bg-section);

  /* Stat cards */
  --stat-bg: rgba(var(--color-primary-rgb), 0.06);
  --stat-accent: var(--color-primary);
}
