/**
 * Shared brand + UI theme tokens
 * Single source of truth — do not hardcode these hex values in Blade/CSS/JS.
 * Component styles live in packages/theme/common-ui.css (loaded separately by each app).
 */

:root {
  /* ========== Brand (from horizontal-logo2.svg) ========== */
  --brand-primary: #062b69;          /* logo navy */
  --brand-secondary: #f9ad03;        /* logo gold */
  --brand-accent: #ffbf37;           /* logo highlight gold */
  --brand-primary-light: #eef1f8;
  --brand-primary-bg: #f5f7fb;
  --brand-primary-hover: #041e4a;    /* darker navy */
  --brand-tertiary: #d06919;
  --brand-danger: #ff6769;
  --brand-neutral: #e6ecf0;
  --brand-primary-foreground: #ffffff;
  --brand-text-secondary: #5a6b8a;
  --brand-text-secondary-muted: #2d2c2fb5;
  --brand-secondary-light: #fcf5d3;  /* logo soft highlight */
  --brand-accent-soft: #062b691f;
  --brand-indigo: #3f51b5;
  --brand-indigo-light: #e8eaf6;
  --brand-teal: #1bcfb4;
  --brand-teal-alt: #20cfb5;
  --brand-violet: #5144f8;
  --brand-id-header: #e26565;
  --brand-id-footer: #90b1e0;
  --brand-id-text: #062b69;

  /* ========== Neutrals ========== */
  --color-white: #ffffff;
  --color-black: #000000;
  --color-gray-50: #f9fafb;
  --color-gray-100: #f3f4f6;
  --color-gray-150: #f4f5f7;
  --color-gray-200: #e5e7eb;
  --color-gray-250: #eef0f4;
  --color-gray-300: #e2e8f0;
  --color-gray-350: #e1e5eb;
  --color-gray-400: #cbd5e1;
  --color-gray-450: #9ca3af;
  --color-gray-500: #6b7280;
  --color-gray-550: #64748b;
  --color-gray-600: #4b5563;
  --color-gray-650: #6c757d;
  --color-gray-700: #374151;
  --color-gray-750: #333333;
  --color-gray-800: #1e293b;
  --color-gray-850: #111827;
  --color-gray-900: #000000;
  --color-gray-875: #0f172a;
  --color-slate-400: #94a3b8;
  --color-border: #e5e7eb;
  --color-border-light: #f1f5f9;
  --color-border-muted: #eee;
  --color-surface: #f8f9fa;
  --color-surface-alt: #fafafa;
  --color-surface-muted: #f5f5f5;
  --color-surface-soft: #fcfcfd;
  --color-divider: #e0e0e0;
  --color-muted: #757575;
  --color-text: #1e293b;
  --color-text-muted: #64748b;
  --color-text-subtle: #94a3b8;

  /* ========== Status ========== */
  --color-success: #10b981;
  --color-success-alt: #28a745;
  --color-success-material: #4caf50;
  --color-success-dark: #2e7d32;
  --color-success-bg: #e8f5e9;
  --color-success-bg-soft: #d1fae5;
  --color-success-bg-alt: #e8fdf0;
  --color-success-bg-mint: #edfcf1;
  --color-warning: #f2a654;
  --color-warning-alt: #f59e0b;
  --color-warning-material: #ff9800;
  --color-warning-dark: #d97706;
  --color-warning-orange: #ef6c00;
  --color-warning-bg: #fff8e1;
  --color-warning-bg-soft: #fef3c7;
  --color-warning-bg-alt: #fff3cd;
  --color-warning-border: #ffeeba;
  --color-warning-text: #856404;
  --color-danger: #ef4444;
  --color-danger-alt: #f96868;
  --color-danger-material: #f72585;
  --color-danger-bootstrap: #dc3545;
  --color-danger-dark: #d32f2f;
  --color-danger-swal: #d33;
  --color-danger-bg: #fee2e2;
  --color-danger-bg-alt: #fce4e4;
  --color-danger-border: #ef9a9a;
  --color-info: #3085d6;
  --color-info-alt: #2196f3;
  --color-info-bootstrap: #0d6efd;
  --color-info-legacy: #007bff;
  --color-info-material: #198ae3;
  --color-pink: #fe7c96;
  --color-yellow: #fed713;
  --color-orange: #f97316;
  --color-orange-bg: #fff7ed;
  --color-cyan-bg: #cff4fc;
  --color-cyan-text: #055160;
  --color-cyan-bootstrap: #17a2b8;
  --color-surface-ghost: #fafbfc;
  --color-success-bg-pale: #f0fdf4;
  --color-success-bg-lime: #dcfce7;
  --color-success-text-dark: #166534;
  --color-success-bright: #5fd068;
  --color-success-emerald: #059669;
  --color-gray-325: #d1d5db;
  --color-gray-330: #d1d5dc;
  --color-surface-warm: #f9f9f9;
  --color-danger-bg-soft: #fef2f2;
  --color-warning-amber: #f57f17;
  --color-warning-amber-dark: #b45309;
  --color-info-bg: #e3f2fd;
  --color-info-dark: #1976d2;
  --color-gray-480: #9e9e9e;
  --color-surface-cool: #f5f6fa;
  --color-gray-580: #475569;
  --color-gray-590: #29363f;
  --color-border-soft: #d8e0e6;
  --color-warning-bg-warm: #fffaf0;
  --color-border-faint: #f1f1f1;
  --color-border-soft-alt: #e1e1e1;
  --color-surface-mist: #f3f3f3;
  --color-surface-slate: #f8fafc;
  --color-surface-sky: #f4fbff;
  --color-surface-sky-overlay: #f4fbffde;
  --color-surface-mint: #e5f8f0;
  --color-surface-mint-soft: #f6fffb;
  --color-surface-blue-soft: #c9ddeb;
  --color-gray-820: #1f2937;
  --color-gray-470: #898989;
  --color-teal-bg: #f0fdfa;
  --color-info-bg-soft: #d1ecf1;
  --color-cyan-text-dark: #0c5460;
  --color-warning-bright: #ffbc34;
  --color-success-vivid: #05bb6c;
  --color-indigo-600: #4f46e5;
  --color-blue-50: #eff6ff;
  --color-blue-100: #dbeafe;
  --color-blue-450: #4f8ef7;
  --color-blue-500: #3b82f6;
  --color-blue-600: #2563eb;
  --color-blue-800: #1e40af;
  --color-indigo-deep: #1a237e;
  --color-slate-425: #8a94a6;
  --color-slate-430: #a4adc1;
  --color-slate-725: #334155;
  --color-slate-735: #3e4b5b;
  --color-slate-540: #5c657a;
  --color-slate-545: #5d677d;
  --color-amber-50: #fffbeb;
  --color-amber-200: #fde68a;
  --color-amber-800: #92400e;
  --color-amber-900: #78350f;
  --color-green-200: #bbf7d0;
  --color-green-400: #34d399;
  --color-green-500: #22c55e;
  --color-green-700: #137333;
  --color-green-bright: #2ecc71;
  --color-cyan-400: #38bdf8;
  --color-sky-200: #bae6fd;
  --color-sky-700: #0369a1;
  --color-teal-600: #0d9488;
  --color-teal-700: #0f766e;
  --color-red-450: #e74a5f;
  --color-red-500: #dc2626;
  --color-red-700: #b91c1c;
  --color-red-900: #991b1b;
  --color-red-google: #d93025;
  --color-orange-100: #ffedd5;
  --color-orange-700: #b06000;
  --color-warning-deep: #cc7a00;
  --color-warning-border-soft: #ffe8b3;
  --color-yellow-soft: #fef7e0;
  --color-surface-charcoal: #2b2f3e;
  --color-surface-ink: #0b151e;
  --color-surface-steel: #3b4253;
  --color-surface-steel-dark: #1a222c;
  --color-surface-panel: #f0f2f5;
  --color-surface-cooler: #fcfdfe;
  --color-blue-ice: #e8f0fe;
  --color-green-mint: #e6f4ea;
  --color-gray-430: #abaeb3;
  --color-gray-google: #80868b;
  --color-border-cloud: #edf2f7;
  --color-border-cool: #e8eaf0;
  --color-text-deep: #1e2a4a;
  --color-success-deep: #1e875a;
  --color-terminal-bg: #161b22;
  --color-terminal-header: #21262d;
  --color-terminal-muted: #8b949e;
  --color-terminal-border: #30363d;
  --color-terminal-foreground: #e6edf3;
  --color-terminal-info: #7dc4e7;
  --color-terminal-success: #56d364;
  --color-terminal-warning: #e3b341;
  --color-terminal-error: #f85149;
  --color-terminal-wait: #484f58;

  /* ========== Layout ========== */
  --brand-radius: 0.625rem;
  --brand-font-family: 'Inter', sans-serif;

  /* ========== Font family alias ========== */
  --font-family-base: var(--brand-font-family);

  /* ========== Aliases (apps) ========== */
  --primary-color: var(--brand-primary);
  --secondary-color: var(--brand-secondary);
  --light-primary-color: var(--brand-primary-light);
  --tertiary-color: var(--brand-tertiary);
  --fourth-color: var(--brand-danger);
  --fifth-color: var(--brand-neutral);

  --theme-color: var(--brand-primary);
  --primary-color-sidebar: var(--brand-primary);
  --primary-hover-color: var(--brand-primary-hover);
  --primary-background-color: var(--brand-primary-bg);
  --secondary-color1: var(--brand-accent);
  --secondary-color2: var(--brand-secondary);
  --secondary-color3: var(--brand-secondary-light);
  --text--primary-color: var(--brand-accent-soft);
  --text--secondary-color: var(--brand-text-secondary);
  --text-white-color: var(--brand-primary-foreground);

  --primary: var(--brand-primary);
  --primary-foreground: var(--brand-primary-foreground);
  --radius: var(--brand-radius);

  /* Semantic shortcuts used in UI */
  --success: var(--color-success-material);
  --info: var(--color-info-alt);
  --warning: var(--color-warning-material);
  --danger: var(--color-danger-material);
}

/* Apply brand font globally so every page inherits it */
body,
input,
button,
select,
textarea {
  font-family: var(--brand-font-family) !important;
}