/* ==========================================================================
   حِلْية — HILYA | المتغيرات التصميمية ونظام الثيمات (CSS Variables)
   ========================================================================== */

:root {
  /* لوحة الألوان المعتمدة (Design Tokens) */
  --color-bg-main: #FAF8F9;
  --color-card-bg: #FFFFFF;
  
  /* باذنجاني داكن - النصوص والأزرار الأساسية (نسبة التباين > 9:1) */
  --color-primary: #392535;
  --color-primary-hover: #4D3348;
  --color-primary-active: #2C1B29;
  --color-primary-text: #FFFFFF;

  /* وردي بودري - المساحات والبطاقات والشارات */
  --color-surface-rose: #E8D7DE;
  --color-surface-rose-light: #F6EFF2;
  --color-surface-rose-dark: #D4BFC8;

  /* مريمي / رمادي مخضر هادئ - الخلفيات المريحة */
  --color-surface-sage: #DCE3DE;
  --color-surface-sage-light: #F0F4F1;
  --color-surface-sage-dark: #C4CEC7;

  /* شامبين معدني - لمسات زخرفية وأيقونات راقية */
  --color-champagne: #B69B70;
  --color-champagne-light: #DFCDB1;
  --color-champagne-dark: #8E744A;

  /* النصوص والحدود */
  --color-text-main: #392535;
  --color-text-muted: #6D626A;
  --color-text-subtle: #8D828A;
  --color-border: #E8D7DE;
  --color-border-light: #F2E9ED;
  --color-border-strong: #C9B8C1;

  /* الحالات الوظيفية */
  --color-success: #206E4A;
  --color-success-bg: #EAF5EF;
  --color-danger: #9B2635;
  --color-danger-bg: #FBECEE;
  --color-warning: #945B18;
  --color-warning-bg: #FCF4EB;

  /* الطباعة والخطوط */
  --font-heading: 'Alexandria', 'Traditional Arabic', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-body: 'Noto Sans Arabic', 'Segoe UI', Tahoma, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-numeric: 'Alexandria', 'Noto Sans Arabic', sans-serif;

  /* مقياس الأحجام */
  --font-size-xs: 0.75rem;    /* 12px */
  --font-size-sm: 0.875rem;   /* 14px */
  --font-size-base: 1rem;     /* 16px */
  --font-size-md: 1.125rem;   /* 18px */
  --font-size-lg: 1.25rem;    /* 20px */
  --font-size-xl: 1.5rem;     /* 24px */
  --font-size-2xl: 1.875rem;  /* 30px */
  --font-size-3xl: 2.25rem;   /* 36px */
  --font-size-4xl: 3rem;      /* 48px */
  --font-size-hero: clamp(2.25rem, 5vw, 3.75rem);

  /* ارتفاع السطور */
  --line-height-tight: 1.25;
  --line-height-normal: 1.65;
  --line-height-relaxed: 1.85;

  /* مقياس التباعد */
  --space-2xs: 0.25rem;  /* 4px */
  --space-xs: 0.5rem;    /* 8px */
  --space-sm: 0.75rem;   /* 12px */
  --space-md: 1rem;      /* 16px */
  --space-lg: 1.5rem;    /* 24px */
  --space-xl: 2rem;      /* 32px */
  --space-2xl: 3rem;     /* 48px */
  --space-3xl: 4.5rem;   /* 72px */
  --space-4xl: 6rem;     /* 96px */

  /* الاستدارات */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 9999px;

  /* الظلال البوتيكية الناعمة */
  --shadow-sm: 0 2px 8px rgba(57, 37, 53, 0.04);
  --shadow-md: 0 6px 20px rgba(57, 37, 53, 0.07);
  --shadow-lg: 0 16px 36px rgba(57, 37, 53, 0.09);
  --shadow-float: 0 20px 48px rgba(57, 37, 53, 0.14);

  /* حلقة التركيز المرئية لإتاحة الوصول */
  --focus-ring: 0 0 0 3px rgba(182, 155, 112, 0.55), 0 0 0 1px #392535;

  /* الانتقالات */
  --transition-fast: 160ms cubic-bezier(0.2, 0, 0, 1);
  --transition-normal: 250ms cubic-bezier(0.2, 0, 0, 1);
  --transition-slow: 400ms cubic-bezier(0.2, 0, 0, 1);

  /* قياسات الحاوية */
  --container-max: 1280px;
  --container-narrow: 840px;
  --header-height: 76px;
  --header-height-mobile: 66px;
  --announcement-height: 36px;
  --bottom-bar-height: 72px;
}