/* =========================================================
   Tiger TV Theme - Fixed for Zid
   Primary: #b79419 | Background: #0f0c01
========================================================= */

:root {
  --brand: #b79419;
  --bg: #0f0c01;
  --text: #f2f2f2;
  --muted: rgba(255,255,255,.70);
  --card-bg: rgba(255,255,255,.06);
  --card-border: rgba(255,255,255,.10);
  --line: rgba(255,255,255,.08);
}

/* 1. إصلاح الخلفية العامة - لضمان عدم ظهور بياض عند التصفح */
html, body, #main-wrapper, .main-content, main {
  background-color: var(--bg) !important;
  color: var(--text) !important;
}

/* 2. الهيدر (القائمة العلوية) - إجبار اللون الداكن */
header, .top-nav, .main-nav, .navbar, .sticky-header, #sticky-mobile {
  background-color: var(--bg) !important;
  border-bottom: 1px solid var(--line) !important;
}

/* 3. إصلاح كروت المنتجات (Product Cards) */
/* زد تستخدم أحياناً كلاسات مختلفة، هذا الاستهداف أشمل */
.product-card, .product-item, .product-card-wrapper {
  background: var(--card-bg) !important;
  border: 1px solid var(--card-border) !important;
  border-radius: 16px !important;
  transition: 0.3s ease-in-out !important;
}

.product-card:hover, .product-card-wrapper:hover {
  border-color: var(--brand) !important;
  transform: translateY(-5px) !important;
}

/* 4. أزرار الشراء - تحسين الاستجابة */
.btn-add-to-cart, .product-add-to-cart-btn, .btn-primary, .buy-btn {
  background-color: var(--brand) !important;
  color: var(--bg) !important;
  border: none !important;
  font-weight: bold !important;
  border-radius: 12px !important;
}

/* 5. صفحة المنتج التفصيلية - حل مشكلة البياض في الوصف */
.product-details-container, .product-description, .tab-content, .p-details {
  background: transparent !important;
  color: var(--text) !important;
}

/* 6. الموبايل - القائمة الجانبية (Mobile Menu) */
.mobile-menu, .side-menu, #slide-navbar-collapse {
  background-color: var(--bg) !important;
}

.mobile-menu a, .side-menu a {
  color: var(--text) !important;
}

/* 7. الفوتر - Footer */
footer {
  background-color: #050505 !important; /* أغمق قليلاً من الخلفية */
  border-top: 1px solid var(--line) !important;
}

/* 8. إخفاء العناصر غير المرغوب فيها */
.copyrights, .add-to-wishlist {
  display: none !important;
}

/* 9. إصلاح النصوص داخل المدخلات (Search/Inputs) */
input, textarea, select {
  background-color: rgba(255,255,255,0.05) !important;
  color: #fff !important;
  border: 1px solid var(--card-border) !important;
}
/* =========================================================
   Tiger TV - Premium Product Card Enhancements
========================================================= */

/* 1. استهداف بطاقة المنتج عن طريق "سمة" الرابط */
[data-product-id], 
.product-card, 
div[class*="product-card"], 
.product-item {
    background: #0f0c01 !important; /* لون تايجر تي في */
    border: 2px solid #b79419 !important; /* تحديد ذهبي واضح */
    border-radius: 20px !important;
    padding: 15px !important;
    box-shadow: 0 10px 20px rgba(183, 148, 25, 0.15) !important;
    transition: 0.3s !important;
}

/* 2. زر أضف للسلة - الاستهداف بالقوة القصوى */
[class*="add-to-cart"], 
button[type="submit"], 
.btn-add-to,
.product-add-to-cart-btn {
    background: linear-gradient(45deg, #b79419, #f9df7b, #b79419) !important;
    background-size: 200% auto !important;
    color: #000 !important;
    font-weight: 900 !important;
    border-radius: 50px !important; /* شكل بيضاوي عصري */
    border: none !important;
    box-shadow: 0 5px 15px rgba(183, 148, 25, 0.4) !important;
    animation: glow-pulse 2s infinite !important; /* تأثير النبض المضيء */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 45px !important;
}

/* 3. حركة النبض واللمعان للزر */
@keyframes glow-pulse {
    0% { transform: scale(1); box-shadow: 0 0 5px #b79419; }
    50% { transform: scale(1.02); box-shadow: 0 0 20px #f9df7b; }
    100% { transform: scale(1); box-shadow: 0 0 5px #b79419; }
}

/* 4. السعر - جعله ضخماً وذهبي */
[class*="price"], 
.product-price, 
.strong {
    color: #f9df7b !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8) !important;
}

/* 5. اسم المنتج - أبيض عريض */
[class*="title"], 
.product-title {
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 18px !important;
}

/* 6. منع أي عنصر من فرض لون أبيض خلف المنتج */
.main-content, .products-grid, section {
    background-color: #0f0c01 !important;
}
/* 1. ضبط خلفية النافذة المنبثقة بالكامل باللون الذهبي المطلوب */
.MuiDialog-paper {
    background-color: #b6931a !important;
}

/* 2. تحويل جميع النصوص، العناوين، والتسميات التوضيحية بداخلها إلى اللون الأسود */
.MuiDialog-paper,
.MuiDialogTitle-root,
.MuiDialogTitle-root *,
.MuiTypography-root,
.MuiFormLabel-root,
.MuiInputLabel-root,
label#input-email-label {
    color: #000000 !important;
}

/* 3. جعل حقل إدخال البريد الإلكتروني أبيض بالكامل من الداخل والخلفية */
.MuiInputBase-root.MuiOutlinedInput-root {
    background-color: #ffffff !important;
}

/* 4. التأكد من أن النص المكتوب داخل الحقل يظهر باللون الأسود الواضح */
input#input-email {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important; /* لدعم متصفحات آيفون وكروم */
}

/* 5. ضبط لون النص المساعد (Placeholder) ليكون رمادي داكن واضح فوق الخلفية البيضاء */
input#input-email::placeholder {
    color: #555555 !important;
    opacity: 1 !important;
}

/* 6. تعديل لون زر "تسجيل الدخول بـ واتساب" السفلي ليكون بخلفية بيضاء ونصوص سوداء */
button.MuiButton-outlinedSecondary {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
}
button.MuiButton-outlinedSecondary * {
    color: #000000 !important;
    fill: #000000 !important;
}

/* 7. تعديل لون أيقونة الإغلاق (X) في الأعلى لتصبح سوداء وواضحة */
button.MuiIconButton-colorSecondary {
    color: #000000 !important;
}
button.MuiIconButton-colorSecondary svg {
    fill: #000000 !important;
}
/* 1. ضبط لون النص المكتوب داخل حقل رقم الهاتف وتحديد اللون الأسود */
input#phone-input-mobile_number {
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
}

/* 2. ضبط لون نص مفتاح الدولة (مثل +90) ليظهر باللون الأسود الواضح */
.MuiInputBase-inputAdornedStart, 
.MuiSelect-select,
[class*="MuiSelect-select"] {
    color: #000000 !important;
}

/* 3. إظهار النص الإرشادي المخفي في الخلفية (أدخل رقم واتساب...) باللون الأسود */
.MuiDialogContent-root p.MuiTypography-body2,
.MuiDialogContent-root .MuiBox-root p {
    color: #000000 !important;
}

/* 4. تعديل لون التسمية التوضيحية العلوية الخاصة برقم الهاتف */
label#phone-input-mobile_number-label {
    color: #000000 !important;
}

/* 5. تعديل زر التبديل السفلي "تسجيل الدخول بالبريد الإلكتروني" ليصبح بخلفية بيضاء ونص أسود */
button.MuiButton-outlinedSecondary,
button[class*="MuiButton-outlinedSecondary"] {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #000000 !important;
}

/* 6. تحويل أيقونة المغلف والنصوص داخل الزر السفلي إلى اللون الأسود */
button.MuiButton-outlinedSecondary *,
button[class*="MuiButton-outlinedSecondary"] * {
    color: #000000 !important;
    fill: #000000 !important;
}