/* ===================================================== */
/* تم دیجی‌کالا – رنگ و ظاهر یکدست */ /* مشخص کردن استایل کلی سایت */
 /* ===================================================== */

/* پس‌زمینه کل صفحه */
body.digikala-theme {
    background: #f5f5f5; /* رنگ پس‌زمینه روشن */
    color: #333; /* رنگ متن */
    font-family: "Tahoma", sans-serif; /* فونت صفحه */
}

/* --------------------- Navbar ---------------------- */ /* استایل نوار بالای صفحه */
body.digikala-theme .navbar {
    background: #fff !important; /* پس‌زمینه سفید */
    border-bottom: 1px solid #e0e0e0; /* خط جداکننده پایین Navbar */
}

body.digikala-theme .navbar .navbar-brand,
body.digikala-theme .navbar .nav-link {
    color: #ef394e !important; /* رنگ قرمز لوگو و لینک‌ها */
    font-weight: 600; /* ضخامت فونت */
}

body.digikala-theme .navbar .btn-outline-light {
    background: #ef394e; /* رنگ پس‌زمینه دکمه */
    color: #fff; /* رنگ متن دکمه */
    border: none; /* بدون حاشیه */
    border-radius: 8px; /* گرد شدن گوشه‌ها */
    transition: 0.3s; /* انیمیشن تغییرات */
}
body.digikala-theme .navbar .btn-outline-light:hover {
    background: #d32f2f; /* رنگ پس‌زمینه هنگام هاور */
}

/* کارت‌ها */
body.digikala-theme .card {
    border: 1px solid #2c3e50 !important;  /* نوار مشکی دور کارت */
    border-top-right-radius: 40px !important; /* گوشه بالا راست */
    border-bottom-left-radius: 40px !important; /* گوشه پایین چپ */
    border-top-left-radius: 12px !important; /* گوشه بالا چپ */
    border-bottom-right-radius: 0 !important; /* گوشه پایین راست */
    background: linear-gradient(145deg, #ffffff, #f3f6f9); /* گرادیان سفید به آبی روشن */
    box-shadow: 0 10px 30px rgba(0,0,0,0.15); /* سایه */
    transition: all 0.3s ease; /* انیمیشن تغییرات */
    overflow: hidden; /* جلوگیری از خروج محتوا */
}

/* نوار قرمز کنار کارت */
body.digikala-theme .card::before {
    content: ""; /* محتوا خالی */
    position: absolute; /* موقعیت مطلق */
    right: 0; /* راست */
    top: 0; /* بالا */
    width: 6px; /* عرض نوار */
    height: 100%; /* ارتفاع کامل کارت */
    background: linear-gradient(to bottom, #ef394e, #d32f2f); /* گرادیان قرمز */
    border-top-right-radius: 10px; /* گوشه بالا راست نوار */
    border-bottom-left-radius: 10px; /* گوشه پایین چپ نوار */
}

/* افکت هاور کارت */
body.digikala-theme .card:hover {
    transform: translateY(-5px); /* بالا رفتن کارت */
    box-shadow: 0 8px 25px rgba(0,0,0,0.15); /* سایه کمتر */
}

/* گرد کردن تصاویر کارت */
body.digikala-theme .card-img-top {
    border-top-left-radius: 10px; /* گوشه بالا چپ تصویر */
    border-top-right-radius: 10px; /* گوشه بالا راست تصویر */
}

/* تیتر کارت */
body.digikala-theme .card-body h5 {
    color: #ef394e; /* رنگ تیتر */
    font-weight: 700; /* ضخامت تیتر */
}

/* دکمه پایین کارت */
body.digikala-theme .card-footer .btn {
    background: linear-gradient(135deg, #ef394e, #d32f2f); /* گرادیان قرمز */
    border: none; /* بدون حاشیه */
    color: #fff; /* رنگ متن سفید */
    border-radius: 8px; /* گرد شدن گوشه‌ها */
    padding: 10px 20px; /* فاصله داخلی */
    transition: 0.3s; /* انیمیشن تغییرات */
}
body.digikala-theme .card-footer .btn:hover {
    transform: translateY(-3px); /* بالا رفتن دکمه هنگام هاور */
    box-shadow: 0 6px 20px rgba(0,0,0,0.2); /* سایه */
    background: linear-gradient(135deg, #d32f2f, #b71c1c); /* گرادیان تیره‌تر هنگام هاور */
}

/* --------------------- کارت اسلایدر ---------------- */ 
body.digikala-theme #wowslider-container1,
body.digikala-theme .ws_images ul li img {
    border-radius: 10px; /* گرد شدن گوشه‌ها */
    border: 1px solid #e0e0e0; /* حاشیه خاکستری */
    box-shadow: 0 2px 10px rgba(0,0,0,0.08); /* سایه سبک */
    background: #fff; /* پس‌زمینه سفید */
}

/* bullets و shadow */ 
body.digikala-theme .ws_bullets span,
body.digikala-theme .ws_shadow {
    background: rgba(239, 57, 78, 0.8); /* رنگ قرمز نیمه شفاف */
}

/* --------------------- باکس ورود ------------------ */
body.digikala-theme .login-box {
    background: #fff; /* پس‌زمینه سفید */
    border: 1px solid #e0e0e0; /* حاشیه خاکستری */
    border-radius: 12px; /* گوشه‌ها گرد */
    padding: 20px; /* فاصله داخلی */
    box-shadow: 0 2px 8px rgba(0,0,0,0.08); /* سایه سبک */
    text-align: center; /* متن وسط چین */
}

body.digikala-theme .login-box h4 {
    color: #ef394e; /* رنگ تیتر */
    margin-bottom: 15px; /* فاصله پایین */
}

/* دکمه ورود */
body.digikala-theme .login-box .btn-login {
    background: linear-gradient(135deg, #ef394e, #d32f2f); /* گرادیان قرمز */
    color: #fff; /* رنگ متن سفید */
    border-radius: 25px; /* گرد شدن گوشه‌ها */
    padding: 10px 25px; /* فاصله داخلی */
    font-weight: 600; /* ضخامت فونت */
    transition: 0.3s; /* انیمیشن تغییرات */
}
body.digikala-theme .login-box .btn-login:hover {
    transform: translateY(-3px); /* بالا رفتن دکمه هنگام هاور */
    box-shadow: 0 6px 20px rgba(0,0,0,0.2); /* سایه */
    background: linear-gradient(135deg, #d32f2f, #b71c1c); /* گرادیان تیره‌تر هنگام هاور */
}

/* --------------------- جدول سبد خرید ------------------ */
body.digikala-theme .cart-table {
    width: 100%; /* عرض کامل */
    border-collapse: collapse; /* حذف فاصله بین سلول‌ها */
    background: #fff; /* پس‌زمینه سفید */
    border: 1px solid #e0e0e0; /* حاشیه خاکستری */
    box-shadow: 0 2px 8px rgba(0,0,0,0.08); /* سایه سبک */
}

body.digikala-theme .cart-table th,
body.digikala-theme .cart-table td {
    padding: 12px 10px; /* فاصله داخلی سلول‌ها */
    text-align: center; /* وسط چین متن */
    border-bottom: 1px solid #f0f0f0; /* خط پایین سلول‌ها */
}

body.digikala-theme .cart-table th {
    color: #ef394e; /* رنگ تیتر جدول */
    font-weight: 600; /* ضخامت تیتر */
}

body.digikala-theme .cart-table tr:last-child td {
    border-bottom: none; /* حذف خط آخر */
}

/* --------------------- ریسپانسیو ------------------ */
@media(max-width: 767px) {
    body.digikala-theme .card,
    body.digikala-theme .login-box,
    body.digikala-theme #wowslider-container1 {
        max-width: 100%; /* حداکثر عرض 100% در موبایل */
    }
}

/* ====== مشکی شدن نوشته‌های Navbar ====== */
body.digikala-theme .navbar .navbar-brand,
body.digikala-theme .navbar .nav-link {
    color: #000 !important; /* مشکی */
    font-weight: 600; /* ضخامت فونت */
}

body.digikala-theme .navbar .nav-link:hover {
    color: #ef394e !important; /* هاور قرمز */
}