/* ═══════════════════════════════════════════════════════
   tokens.css — متغيرات نظام التصميم
   بوابة الشكاوى الخدمية — منطقة منبج
   ═══════════════════════════════════════════════════════ */

:root {
  /* ── ألوان الهوية البصرية السورية الرسمية ── */
  /* القمحي الذهبي — Golden Wheat */
  --golden-wheat-dark: #988561;
  --golden-wheat-medium: #B9A779;
  --golden-wheat-light: #EDEBE0;

  /* أخضر الغابة — Forest */
  --forest-dark: #002623;
  --forest-medium: #054239;
  --forest-light: #428177;

  /* الفحمي — Charcoal */
  --charcoal-dark: #161616;
  --charcoal-medium: #3D3A3B;
  --charcoal-white: #FFFFFF;

  /* عنابي عميق — Deep Umber */
  --deep-umber-dark: #260F14;
  --deep-umber-medium: #4A151E;
  --deep-umber-light: #6B1F2A;

  /* ── الألوان الرئيسية للتطبيق ── */
  --primary: #054239;
  --primary-hover: #002623;
  --primary-active: #001A18;
  --primary-soft: #E6EFEF;
  --primary-softer: #F2F7F7;

  --gold: #B9A779;
  --gold-soft: #EDEBE0;
  --gold-hover: #988561;

  --sea: #428177;
  --sea-soft: #E9F2F1;

  --rust: #6B1F2A;
  --rust-soft: #F6EAEC;

  /* ── الخلفية والسطح ── */
  --background: #F8F7F3;
  --surface: #FFFFFF;
  --surface-hover: #FAF9F6;
  --surface-elevated: #FFFFFF;

  /* ── ألوان النص ── */
  --text: #161616;
  --text-secondary: #3D3A3B;
  --muted: #6B6869;
  --placeholder: #9E9C9D;

  /* ── ألوان الحدود ── */
  --border: #D8D4C8;
  --border-hover: #B9A779;
  --border-focus: #054239;

  /* ── ألوان الحالة ── */
  --success: #054239;
  --success-soft: #E6EFEF;
  --success-border: #99C2BC;
  --warning: #988561;
  --warning-soft: #EDEBE0;
  --warning-border: #B9A779;
  --danger: #6B1F2A;
  --danger-soft: #F6EAEC;
  --danger-border: #D8B2B7;
  --info: #428177;
  --info-soft: #E9F2F1;

  /* ── ألوان الأولويات ── */
  --priority-low: #428177;
  --priority-low-bg: #E9F2F1;
  --priority-low-border: #B2D1CD;
  --priority-normal: #054239;
  --priority-normal-bg: #E6EFEF;
  --priority-normal-border: #99C2BC;
  --priority-important: #988561;
  --priority-important-bg: #EDEBE0;
  --priority-important-border: #B9A779;
  --priority-urgent: #6B1F2A;
  --priority-urgent-bg: #F6EAEC;
  --priority-urgent-border: #D8B2B7;
  --priority-critical: #4A151E;
  --priority-critical-bg: #EFE4E6;
  --priority-critical-border: #B87A85;

  /* ── الخط ── */
  --font-family: "OfficialArabic", "Noto Sans Arabic", "Segoe UI", Arial, sans-serif;
  --font-size-hero: clamp(1.75rem, 4vw, 2.25rem);
  --font-size-h2: clamp(1.25rem, 3vw, 1.625rem);
  --font-size-h3: clamp(1.1rem, 2.5vw, 1.375rem);
  --font-size-body: 1rem;
  --font-size-sm: 0.875rem;
  --font-size-xs: 0.8125rem;
  --font-weight-regular: 400;
  --font-weight-bold: 700;
  --font-weight-black: 900;
  --line-height-tight: 1.4;
  --line-height-normal: 1.7;
  --line-height-relaxed: 1.9;

  /* ── المسافات ── */
  --space-2: 0.125rem;
  --space-4: 0.25rem;
  --space-6: 0.375rem;
  --space-8: 0.5rem;
  --space-12: 0.75rem;
  --space-16: 1rem;
  --space-20: 1.25rem;
  --space-24: 1.5rem;
  --space-32: 2rem;
  --space-40: 2.5rem;
  --space-48: 3rem;

  /* ── الحواف ── */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  /* ── الظلال ── */
  --shadow-xs: 0 1px 2px rgba(37, 40, 34, 0.04);
  --shadow-sm: 0 1px 3px rgba(37, 40, 34, 0.06), 0 1px 2px rgba(37, 40, 34, 0.04);
  --shadow-md: 0 4px 6px rgba(37, 40, 34, 0.05), 0 2px 4px rgba(37, 40, 34, 0.04);
  --shadow-lg: 0 10px 15px rgba(37, 40, 34, 0.06), 0 4px 6px rgba(37, 40, 34, 0.04);
  --shadow-focus: 0 0 0 3px rgba(95, 104, 75, 0.2);
  --shadow-focus-danger: 0 0 0 3px rgba(163, 58, 50, 0.2);

  /* ── الحركات ── */
  --transition-fast: 150ms ease;
  --transition-normal: 250ms ease;
  --transition-slow: 400ms ease;
  --transition-spring: 300ms cubic-bezier(0.34, 1.56, 0.64, 1);

  /* ── العرض الأقصى ── */
  --max-width-form: 680px;
  --max-width-page: 780px;

  /* ── حجم اللمس الأدنى ── */
  --touch-target: 44px;
}