/* ============================================================
   البوسطا — متغيرات الهوية البصرية
   كل الألوان والخطوط والمقاسات في هذا الملف فقط.
   ============================================================ */

:root {

  /* ---------- الألوان الأساسية ---------- */
  --color-bg-deep:        #0A0A0F;
  --color-bg-elevated:    #13131A;
  --color-bg-card:        rgba(255, 255, 255, 0.06);
  --color-bg-card-hover:  rgba(255, 255, 255, 0.10);
  --color-border-soft:    rgba(255, 255, 255, 0.10);
  --color-border-strong:  rgba(255, 255, 255, 0.18);

  /* ---------- ألوان التمييز ---------- */
  --color-accent-red:       #FF2D55;
  --color-accent-red-dim:   rgba(255, 45, 85, 0.18);
  --color-accent-red-hover: #FF4A6B;

  --color-accent-gold:        #E8B84B;
  --color-accent-gold-dim:    rgba(232, 184, 75, 0.16);
  --color-accent-gold-border: rgba(232, 184, 75, 0.40);

  /* ---------- ألوان النصوص ---------- */
  --color-text-primary:   #FFFFFF;
  --color-text-secondary: #B0B0B8;
  --color-text-muted:     #6E6E78;
  --color-text-disabled:  #4A4A52;

  /* ---------- حالات المنشور ---------- */
  --color-status-draft:      #8A8A94;
  --color-status-pending:    #E8B84B;
  --color-status-published:  #34C759;
  --color-status-hidden:     #FF3B30;
  --color-status-failed:     #FF3B30;

  /* ---------- الخط ---------- */
  --font-main: 'Cairo', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  --font-size-xs:   11px;
  --font-size-sm:   13px;
  --font-size-base: 15px;
  --font-size-md:   17px;
  --font-size-lg:   20px;
  --font-size-xl:   24px;
  --font-size-2xl:  30px;

  --font-weight-light:    300;
  --font-weight-regular:  400;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;
  --font-weight-black:    900;

  --line-height-tight: 1.3;
  --line-height-base:  1.55;
  --line-height-loose: 1.8;

  /* ---------- المسافات ---------- */
  --space-2xs: 2px;
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  12px;
  --space-lg:  16px;
  --space-xl:  24px;
  --space-2xl: 32px;
  --space-3xl: 48px;

  /* ---------- الاستدارات ---------- */
  --radius-sm:     8px;
  --radius-md:     12px;
  --radius-card:   18px;
  --radius-lg:     24px;
  --radius-pill:   999px;
  --radius-circle: 50%;

  /* ---------- مناطق الأمان (الهاتف) ---------- */
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-right:  env(safe-area-inset-right, 0px);
  --safe-left:   env(safe-area-inset-left, 0px);

  /* ---------- الظلال ---------- */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.5);
  --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.6);

  /* ---------- الطبقات (z-index) ---------- */
  --z-bg:      1;
  --z-content: 5;
  --z-overlay: 10;
  --z-tabs:    30;
  --z-modal:   50;
  --z-toast:   100;

  /* ---------- الحركة ---------- */
  --ease-out:   cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in:    cubic-bezier(0.55, 0, 1, 0.45);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);

  --duration-fast: 150ms;
  --duration-base: 250ms;
  --duration-slow: 400ms;

  /* ---------- أحجام مكونات ---------- */
  --action-icon-size:   30px;
  --action-button-size: 46px;
  --tab-height:         56px;
  --card-max-width:     420px;
}