/* ===== Play Phonez — ألوان مريحة للعين ===== */
:root {
    --green: #4a9e32;           /* أخضر مُنقّح من اللوجو — أقل صفار */
    --green-hover: #3a7f26;     /* hover */
    --green-soft: #6cbd53;      /* أخضر فاتح (بادج، أيقونات) */
    --green-bg: #eaf3e5;        /* خلفية أخضر خفيف جداً */

    --navy: #3D5468;            /* كحلي مُنقّح — أدفأ */
    --navy-light: #4F6577;      /* كحلي فاتح */
    --navy-dark: #2F4354;       /* كحلي غامق */

    --text: #3A4D5C;            /* نص رئيسي — كحلي ناعم */
    --text-secondary: #6B7F8D;  /* نص ثانوي */
    --text-muted: #8A9BA7;      /* نص خافت */

    --bg: #FAFCF8;              /* خلفية دافئة — off-white مخضر بالكاد */
    --card-bg: #FFFFFF;
    --card-border: #E5EBE0;     /* border ناعم */
    --card-shadow: rgba(60, 80, 95, 0.06);
    --divider: #E8EDE3;
}

/* ===== الخلفية العامة ===== */
body {
    background-color: var(--bg) !important;
    color: var(--text) !important;
    -webkit-font-smoothing: antialiased;
}

/* ===== العناوين ===== */
h1, h2, .page-title, .section-title {
    color: var(--navy) !important;
}
h3, h4, h5, h6 {
    color: var(--navy-light) !important;
}

/* ===== الروابط ===== */
a {
    color: var(--green);
    transition: color 0.25s ease;
}
a:hover {
    color: var(--navy);
}

/* ===== أزرار ===== */
.btn-primary, .border-black, button[type="submit"],
a.border-black, .view-all-btn {
    background-color: var(--green) !important;
    border-color: var(--green) !important;
    color: white !important;
    transition: all 0.25s ease !important;
}
.btn-primary:hover, .border-black:hover,
a.border-black:hover, .view-all-btn:hover {
    background-color: var(--green-hover) !important;
    border-color: var(--green-hover) !important;
    box-shadow: 0 8px 20px rgba(125, 174, 48, 0.25) !important;
}

/* ===== بادج "جديد" ===== */
.new-badge {
    background-color: var(--green) !important;
    color: white !important;
}

/* ===== التوصيل ===== */
.delivery-section {
    background: var(--green-bg) !important;
    border-color: var(--divider) !important;
}

/* ===== section-title ===== */
.section-title {
    background: var(--navy) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}

/* ===== بطاقات المنتجات ===== */
.product-swiper .swiper-slide .bg-white {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    box-shadow: 0 2px 12px var(--card-shadow) !important;
}
.product-swiper .swiper-slide .bg-white:hover {
    border-color: #d0dbc8 !important;
    box-shadow: 0 6px 20px rgba(60, 80, 95, 0.1) !important;
}

/* شريط بطاقة المنتج */
.product-swiper .swiper-slide .bg-white::before {
    background: linear-gradient(90deg,
        var(--green) 0%,
        var(--navy-light) 50%,
        var(--green) 100%) !important;
}

/* ===== dragon-card ===== */
.dragon-card {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    box-shadow: 0 2px 12px var(--card-shadow) !important;
    color: var(--text) !important;
}
.dragon-card:hover {
    border-color: #d0dbc8 !important;
    box-shadow: 0 6px 20px rgba(60, 80, 95, 0.1) !important;
}

/* ===== أزرار dragon ===== */
.dragon-btn {
    background: var(--green) !important;
    color: white !important;
    border: none !important;
    box-shadow: 0 3px 10px rgba(125, 174, 48, 0.2) !important;
}
.dragon-btn:hover {
    background: var(--green-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 5px 15px rgba(125, 174, 48, 0.35) !important;
}

/* ===== النصوص ===== */
.text-gray-700 { color: var(--text) !important; }
.text-gray-600 { color: var(--text-secondary) !important; }
.text-gray-500 { color: var(--text-muted) !important; }

/* ===== override Tailwind red → green ===== */
.bg-red-600 { background-color: var(--green) !important; }
.text-red-600 { color: var(--green) !important; }
.border-red-600 { border-color: var(--green) !important; }
.hover\:bg-red-600:hover { background-color: var(--green) !important; }
.hover\:text-red-600:hover { color: var(--green) !important; }
.ring-red-600 { --tw-ring-color: var(--green) !important; }
.focus\:ring-red-600:focus { --tw-ring-color: var(--green) !important; }

/* ===== focus ===== */
input:focus, select:focus, textarea:focus {
    border-color: var(--green) !important;
    box-shadow: 0 0 0 3px rgba(125, 174, 48, 0.15) !important;
    outline: none !important;
}

/* ===== scroll-bar (ناعم) ===== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb {
    background: var(--navy-light);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--navy);
}