/*
================================================================================
  Egyptian Theater Festival - Custom Theme Overrides
  ملف التخصيص السريع للتصميم والألوان والخطوط
  مهرجان نقابة المهن التمثيلية للمسرح المصري
================================================================================
  💡 كيفية التعديل السريع:
  1. غير أكواد الألوان (HEX مثل #d4af37 أو #5c0d1b) أدناه في قسم :root.
  2. احفظ الملف (Ctrl + S).
  3. حدّث صفحة الموقع في المتصفح (F5 أو Ctrl + F5).
  4. التعديل فوري ولا يحتاج لإعادة تشغيل الخادم إطلاقاً!
================================================================================
*/

:root {
  /* -------------------------------------------------------------
     🎨 1. الألوان الذهبية (Gold Palette)
     تتحكم في العناوين البارزة، الأزرار، الإطارات المشعة، وأيقونات النجوم
     ------------------------------------------------------------- */
  --egyptian-gold: #d4af37;           /* اللون الذهبي الملكي الأساسي */
  --gold-light: #f5d77f;              /* ذهبي فاتح للنصوص والتوهج */
  --gold-dark: #aa8218;               /* ذهبي داكن لظلال الأزرار */
  --gold-glow: rgba(212, 175, 55, 0.4); /* توهج الإضاءة الذهبية */

  /* -------------------------------------------------------------
     🎭 2. ألوان المخمل المسرحي (Theatrical Velvet & Red)
     تتحكم في خلفيات الأزرار الثانوية، تدرج الستارة، وبطاقات التنبيه
     ------------------------------------------------------------- */
  --theatrical-velvet: #5c0d1b;       /* أحمر عنابي مخملي مسرحي */
  --theatrical-velvet-dark: #3b0710;  /* عنابي داكن جداً لقاعدة التدرج */
  --theatrical-red: #a81c34;          /* أحمر متوهج للأيقونات والتنبيهات */

  /* -------------------------------------------------------------
     🌌 3. ألوان خلفية الموقع والبطاقات (Backgrounds)
     ------------------------------------------------------------- */
  --bg-deep: #070a10;                 /* أسود مسرحي عميق للخلفية العامة */
  --bg-card: rgba(18, 24, 38, 0.78);  /* لون خلفية كروت العروض الشفافة */
  --bg-card-hover: rgba(28, 38, 58, 0.9); /* لون الكارت عند تحريك الماوس عليه */
  
  /* -------------------------------------------------------------
     ✍️ 4. ألوان النصوص (Typography Colors)
     ------------------------------------------------------------- */
  --text-main: #f8fafc;               /* أبيض ناصع للنصوص الأساسية */
  --text-gold: #f5d77f;               /* أصفر ذهبي للعناوين الهامة */
  --text-muted: #94a3b8;              /* رمادي فاتح للنصوص الفرعية */
  
  /* -------------------------------------------------------------
     📐 5. الحدود والحواف (Borders & Radius)
     ------------------------------------------------------------- */
  --border-gold: rgba(212, 175, 55, 0.35); /* لون الإطارات الذهبية */
  --border-subtle: rgba(255, 255, 255, 0.1); /* إطارات ناعمة للكروت */
  --card-radius: 16px;                     /* درجة انحناء زوايا الكروت */
}

/* =============================================================
   شعار المهرجان في شريط التنقل العلوي (Navbar Brand Logo)
   ============================================================= */
.brand-logo {
  height: 40px;
  width: auto;
  border-radius: 50%;
  box-shadow: 0 0 12px var(--gold-glow);
  transition: transform 0.3s ease;
}

.brand-logo:hover {
  transform: scale(1.1) rotate(5deg);
}

/* =============================================================
   شعار المهرجان الكبير في الواجهة الرئيسية (Hero Emblem)
   ============================================================= */
.hero-festival-emblem {
  max-width: 120px;
  height: auto;
  filter: drop-shadow(0 0 20px var(--gold-glow));
  animation: floatEmblem 4s ease-in-out infinite;
}

@keyframes floatEmblem {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

/* =============================================================
   تخصيص صندوق إدخال كود التذكرة (Ticket Quick-Code Box)
   ============================================================= */
#quickCodeCard {
  box-shadow: 0 15px 45px rgba(0, 0, 0, 0.6), 0 0 30px var(--gold-glow);
}

/* =============================================================
   كروت خطوات التصويت (Voting Steps)
   ============================================================= */
.step-card {
  transition: transform 0.25s ease, border-color 0.25s ease;
}

.step-card:hover {
  transform: translateY(-4px);
  border-color: var(--egyptian-gold) !important;
}

/* =============================================================
   كروت العروض المسرحية (Play Cards)
   ============================================================= */
.play-card-header {
  border-bottom: 1px solid var(--border-subtle);
  padding-bottom: 10px;
}

.play-poster-thumb {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.play-poster-thumb:hover {
  transform: scale(1.06);
  box-shadow: 0 6px 18px rgba(212, 175, 55, 0.45);
}