/**
 * E-PINTAS MIMIKA - Theme Design Tokens
 * ----------------------------------------------------
 * File ini mengatur variabel tema global untuk seluruh halaman publik.
 * Untuk menambahkan tema baru di masa depan:
 * 1. Buat file baru (misal: theme-emerald.css, theme-dark.css)
 * 2. Timpa variabel di selector :root atau [data-theme="nama-tema"]
 * 3. Ganti link CSS tema di layouts/public.blade.php
 */

:root {
  /* Brand Color Tokens */
  --theme-primary: #002f6c;
  --theme-primary-hover: #001f47;
  --theme-primary-dark: #001c44;
  --theme-primary-light: #0284c7;
  --theme-secondary: #f59e0b;
  --theme-secondary-hover: #d97706;
  --theme-secondary-gradient: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
  --theme-primary-gradient: linear-gradient(135deg, #002f6c 0%, #154689 100%);
  --theme-cargo-gradient: linear-gradient(135deg, #064e3b 0%, #047857 100%);

  /* State & Functional Colors */
  --theme-success: #10b981;
  --theme-info: #06b6d4;
  --theme-warning: #f59e0b;
  --theme-danger: #ef4444;

  /* Typography Colors */
  --theme-text-main: #002f6c;
  --theme-text-body: #1e293b;
  --theme-text-muted: #64748b;
  --theme-text-light: #ffffff;

  /* Surfaces, Borders & Glassmorphism */
  --theme-bg-body: #ffffff;
  --theme-bg-alt: #f8fafc;
  --theme-bg-glass: rgba(255, 255, 255, 0.96);
  --theme-border-color: rgba(0, 47, 108, 0.12);
  --theme-border-subtle: #e2e8f0;

  /* Header & Navigation Bar */
  --theme-header-bg: rgba(255, 255, 255, 0.88);
  --theme-header-scrolled-bg: rgba(255, 255, 255, 0.96);
  --theme-header-border: rgba(0, 47, 108, 0.12);
  --theme-header-shadow: 0 10px 30px rgba(0, 47, 108, 0.08);
  --theme-header-scrolled-shadow: 0 12px 35px rgba(0, 47, 108, 0.12);

  /* Hero Section */
  --theme-hero-gradient: linear-gradient(135deg, rgba(30, 64, 175, 0.9) 0%, rgba(30, 58, 138, 0.95) 100%);

  /* Shadows & Radius */
  --theme-radius-sm: 8px;
  --theme-radius-md: 12px;
  --theme-radius-lg: 16px;
  --theme-radius-xl: 20px;
  --theme-radius-full: 50px;
  --theme-card-shadow: 0 8px 25px rgba(0, 47, 108, 0.05);
  --theme-card-hover-shadow: 0 15px 35px rgba(0, 47, 108, 0.12);
}
