/* ==========================================================================
   Madar Unified Brand Design Tokens
   Unified color palette, typography, inputs, buttons, focus & radii.
   ========================================================================== */
:root {
  /* Brand Navy Palette */
  --madar-navy-950: #090d16;
  --madar-navy-900: #0f172a;
  --madar-navy-850: #172033;
  --madar-navy-800: #1e293b;
  --madar-navy-700: #334155;

  /* Brand Slate Neutral Palette */
  --madar-slate-600: #475569;
  --madar-slate-500: #64748b;
  --madar-slate-400: #94a3b8;
  --madar-slate-300: #cbd5e1;
  --madar-slate-200: #e2e8f0;
  --madar-slate-100: #f1f5f9;
  --madar-slate-50:  #f8fafc;

  /* Brand Blue Accents */
  --madar-blue-500:  #0284c7;
  --madar-blue-600:  #0369a1;
  --madar-blue-700:  #075985;
  --madar-blue-100:  #e0f2fe;
  --madar-blue-50:   #f0f9ff;

  /* Semantic Alerts */
  --madar-danger:         #dc2626;
  --madar-danger-bg:      #fef2f2;
  --madar-danger-border:  #fecaca;

  --madar-success:        #059669;
  --madar-success-bg:     #ecfdf5;
  --madar-success-border: #a7f3d0;

  --madar-warning:        #d97706;
  --madar-warning-bg:     #fffbeb;
  --madar-warning-border: #fde68a;

  --madar-info:           #0284c7;
  --madar-info-bg:        #f0f9ff;
  --madar-info-border:    #bae6fd;

  /* Typography */
  --madar-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Controls & Focus */
  --madar-focus-ring: 0 0 0 3px rgba(2, 132, 199, 0.18);
  --madar-input-border: #cbd5e1;
  --madar-input-bg: #ffffff;
  --madar-input-height: 44px;

  /* Border Radii */
  --madar-radius-xs: 4px;
  --madar-radius-sm: 6px;
  --madar-radius-md: 8px;
  --madar-radius-lg: 12px;
  --madar-radius-xl: 16px;
  --madar-radius-full: 9999px;

  /* Elevations */
  --madar-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --madar-shadow-md: 0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.07);
  --madar-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.05);
  --madar-shadow-card: 0 12px 30px -10px rgba(15, 23, 42, 0.08), 0 4px 6px -2px rgba(15, 23, 42, 0.03);
}