/**
 * CMS Design System Variables
 * Standardized colors, spacing, and typography
 */

:root {
  /* Primary Colors (Gold/Cinnamon) */
  --primary-color: #0a2347;
  --primary-rgb: 188, 159, 105;
  --primary-light: #0a2347;
  --primary-dark: #0a2347;
  --primary-soft: rgba(188, 159, 105, 0.1);

  /* Secondary Colors */
  --secondary-color: #6c757d;
  --secondary-soft: rgba(108, 117, 125, 0.1);

  /* Status Colors */
  --success-color: #28a745;
  --success-soft: rgba(40, 167, 69, 0.1);
  --warning-color: #ffc107;
  --warning-soft: rgba(255, 193, 7, 0.1);
  --danger-color: #BF3432;
  --danger-soft: rgba(220, 53, 69, 0.1);
  --info-color: #17a2b8;
  --info-soft: rgba(23, 162, 184, 0.1);

  /* Neutral Colors / Backgrounds */
  --bg-body: #f5f7fa;
  --bg-card: #ffffff;
  --bg-header: #ffffff;
  --border-color: #e9ecef;
  --text-main: #333333;
  --text-muted: #6c757d;
  --text-white: #ffffff;

  /* Typography */
  --font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  --font-size-base: 1rem;
  --font-size-sm: 0.875rem;
  --font-size-xs: 0.75rem;
  --font-size-lg: 1.25rem;
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;

  /* Spacing & Borders */
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 1rem;
  --spacing-4: 1.5rem;
  --spacing-5: 3rem;

  --border-radius: 8px;
  --border-radius-sm: 4px;
  --border-radius-lg: 12px;
  --border-radius-full: 50px;

  /* Shadows & Elevation */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  --shadow-header: 0 2px 10px rgba(0, 0, 0, 0.05);

  /* Transitions */
  --transition-base: all 0.2s ease-in-out;
}