/*
 * ساعِد — كل ألوان الموقع في هذا الملف وحده.
 * الوضع الفاتح هو الأساس، والوضع الليلي يتبع إعداد الجهاز (prefers-color-scheme)
 * ما لم يختر الزائر وضعاً بزر التبديل (data-theme على عنصر html).
 * العنصر ذو الصنف .is-light يبقى فاتحاً في الوضعين (لقطات واجهة متجر العميل).
 */

:root,
.is-light {
  color-scheme: light;

  /* الخلفيات والأسطح */
  --bg: #F3F5F9;
  --bg-alt: #E9EDF4;
  --surface: #FBFCFE;          /* بطاقات التطبيقات */
  --panel: #FFFFFF;            /* لوحات الأمثلة */
  --panel-row: #FBFCFE;        /* صفوف داخل اللوحات */
  --watermark: #E3E8F1;
  --watermark-2: #DCE2EC;

  /* النصوص */
  --ink: #13294B;
  --ink-soft: #33425E;
  --ink-list: #1D3157;
  --muted: #52617A;

  /* الخطوط الفاصلة */
  --line: #E2E6EE;
  --line-strong: #C9D3E3;

  /* الألوان الرئيسة */
  --blue: #3E8EF7;
  --accent: #13294B;
  --on-accent: #FFFFFF;
  --link-hover: #33425E;

  /* شريط الدعوة الداكن أسفل صفحات التطبيقات */
  --cta-bg: #13294B;
  --cta-ink: #FFFFFF;
  --cta-btn-bg: #FFFFFF;
  --cta-btn-ink: #13294B;

  /* الحالات */
  --info-ink: #1F5FBF;
  --info-bg: #EAF2FE;
  --ok-ink: #1E7A45;
  --ok-bg: #EAF7EF;
  --warn-ink: #9A5A00;
  --warn-bg: #FFF6E5;
  --danger-ink: #B23A12;
  --danger-bg: #FFF1EC;
  --danger: #E5484D;
  --success: #2DA44E;
  --warn: #F08A24;

  /* ألوان التطبيقات (ثابتة في الوضعين) */
  --app-naqra: #3E8EF7;
  --app-nafitha: #7B61FF;
  --app-upsell: #14A06F;
  --app-fiu: #F2557A;
  --app-mostawda: #F08A24;
  --app-rasd: #0FA3B1;
  --app-mudif: #13294B;
  --white: #FFFFFF;

  /* عناصر واجهة المتجر في الأمثلة */
  --mock-img: #ECEAE4;
  --mock-img-2: #E6E3DC;
  --mock-img-3: #D2CFC7;
  --mock-img-4: #EFEDE7;
  --mock-ink: #2E2E2C;
  --mock-ink-2: #3A3936;
  --mock-line: #C9C6BD;
  --mock-paper: #F7F4F1;
  --mock-dark: #2B1D2A;
  --mock-gold: #F2A33A;
  --mock-indigo: #4C6FFF;
  --mock-mint: #2FBF8F;
  --mock-cream: #FFFBF3;
  --mock-bubble: #EEF2F9;
  --mock-glass: rgba(255, 255, 255, .85);
  --mock-scrim: rgba(11, 11, 11, .5);

  /* الظلال */
  --shadow-card-hover: rgba(11, 11, 11, .12);
  --shadow-panel: rgba(19, 41, 75, .06);
  --shadow-pop: rgba(0, 0, 0, .12);
  --shadow-strong: rgba(0, 0, 0, .28);
}

/* القيم الليلية مكتوبة مرة لكل حالة: إعداد الجهاز، أو اختيار الزائر */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0E1626;
    --bg-alt: #132036;
    --surface: #17253E;
    --panel: #17253E;
    --panel-row: #1C2D4B;
    --watermark: #141F33;
    --watermark-2: #1A2843;
    --ink: #E8EEF8;
    --ink-soft: #C3CEE2;
    --ink-list: #D7E0EF;
    --muted: #A3B3CE;
    --line: #26365A;
    --line-strong: #33456B;
    --blue: #5AA2FF;
    --accent: #5AA2FF;
    --on-accent: #0B1324;
    --link-hover: #C3CEE2;
    --cta-bg: #1C2D4B;
    --cta-ink: #E8EEF8;
    --cta-btn-bg: #5AA2FF;
    --cta-btn-ink: #0B1324;
    --info-ink: #8DBBFF;
    --info-bg: #16305A;
    --ok-ink: #6FD49A;
    --ok-bg: #123A2A;
    --warn-ink: #F5B860;
    --warn-bg: #3A2A10;
    --danger-ink: #FF9C7A;
    --danger-bg: #3D1E16;
    --danger: #FF6B6F;
    --success: #3FB960;
    --warn: #F5A54A;
    --app-mudif: #24467E;
    --mock-bubble: #1C2D4B;
    --shadow-card-hover: rgba(0, 0, 0, .35);
    --shadow-panel: rgba(0, 0, 0, .25);
    --shadow-pop: rgba(0, 0, 0, .35);
    --shadow-strong: rgba(0, 0, 0, .5);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0E1626;
  --bg-alt: #132036;
  --surface: #17253E;
  --panel: #17253E;
  --panel-row: #1C2D4B;
  --watermark: #141F33;
  --watermark-2: #1A2843;
  --ink: #E8EEF8;
  --ink-soft: #C3CEE2;
  --ink-list: #D7E0EF;
  --muted: #A3B3CE;
  --line: #26365A;
  --line-strong: #33456B;
  --blue: #5AA2FF;
  --accent: #5AA2FF;
  --on-accent: #0B1324;
  --link-hover: #C3CEE2;
  --cta-bg: #1C2D4B;
  --cta-ink: #E8EEF8;
  --cta-btn-bg: #5AA2FF;
  --cta-btn-ink: #0B1324;
  --info-ink: #8DBBFF;
  --info-bg: #16305A;
  --ok-ink: #6FD49A;
  --ok-bg: #123A2A;
  --warn-ink: #F5B860;
  --warn-bg: #3A2A10;
  --danger-ink: #FF9C7A;
  --danger-bg: #3D1E16;
  --danger: #FF6B6F;
  --success: #3FB960;
  --warn: #F5A54A;
  --app-mudif: #24467E;
  --mock-bubble: #1C2D4B;
  --shadow-card-hover: rgba(0, 0, 0, .35);
  --shadow-panel: rgba(0, 0, 0, .25);
  --shadow-pop: rgba(0, 0, 0, .35);
  --shadow-strong: rgba(0, 0, 0, .5);
}