@font-face {
    font-family: 'MyFont'; 
    src: url('../font/Dubai-Medium.woff');
}
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family: 'MyFont' !important;
}

body{
background:#f7f7f7;
font-family: 'MyFont',sans-serif;
}


/* رسپانسیو شده ی منو همبرگری */
/* همبرگر */

.hamburger{
display:none;
flex-direction:column;
gap:5px;
cursor:pointer;
}

.hamburger span{
width:26px;
height:3px;
background:#fff;
display:block;
}

@media (max-width:1000px){

.hamburger{
display:flex;
}

.nav-menu{
position:fixed;
top:0;
right:-280px;
width:260px;
height:100vh;
background:#fff;
transition:0.3s;
padding-top:80px;
z-index:2000;
}

.nav-menu.mobile-active{
right:0;
}

.nav-menu ul{
flex-direction:column;
}

.nav-menu ul li{
display:block;
border-bottom:1px solid #eee;
}

.nav-menu ul li a{
color:#333;
}

}



/* هدر */

.main-header{
background:#00415f;
color:white;
padding:10px 20px;
position:sticky;
top:0;
z-index:1000;
}

.header-container{
display:flex;
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
}

/* لوگو */
.logo img{
height:70px;
border-radius: 15px;
}

/* منو */

.nav-menu ul{
display:flex;
list-style:none;
}

.nav-menu ul li{
position:relative;
}

.nav-menu ul li a{
display:block;
padding:10px 15px;
color:white;
text-decoration:none;
}

.nav-menu ul li a:hover{
background:#1e4e79;
border-radius:5px;
}



/* نگهدارنده اصلی منو */
.dropdown {
    position: relative;
}

/* منوی سطح اول (عمودی کردن اجباری) */
.dropdown-menu {
    display: none !important; /* مخفی در حالت عادی */
    position: absolute;
    top: 100%;
    right: 0;
    background: #1e4e79;
    list-style: none;
    min-width: 200px;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    z-index: 9999;
    flex-direction: column !important; /* جلوگیری از افقی شدن */
}

/* نمایش منو هنگام هاور */
.dropdown:hover > .dropdown-menu {
    background-color:#004070 ;
    display: flex !important;
}

/* آیتم‌های داخل منوی اصلی */
.stuord-nav-item {
    position: relative;
    width: 100%;
    display: block !important;
}

.stuord-nav-item a {
    display: block !important;
    padding: 12px 15px !important;
    color: white !important;
    text-decoration: none;
    text-align: right;
    transition: 0.3s;
    white-space: nowrap;
}

.stuord-nav-item:hover > a {
    background: #0b3352;
}

/* ===== سطح دوم (زیرمنوهایی که کنار باز میشن) ===== */
.stuord-sub-menu {
    display: none !important;
    position: absolute;
    top: 0;
    right: 100%; /* باز شدن به سمت راست/چپ منوی فعلی */
    background: #0b3352;
    list-style: none;
    min-width: 180px;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 4px;
    box-shadow: -5px 0 15px rgba(0,0,0,0.2);
    z-index: 10000;
    flex-direction: column !important;
}

/* نمایش زیرمنو هنگام هاور روی آیتم پدر */
.stuord-nav-item:hover > .stuord-sub-menu {

    display: flex !important;
}

/* استایل لینک‌های زیرمنو */
.stuord-sub-menu li a {
    padding: 10px 15px !important;
    font-size: 13px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.stuord-sub-menu li:last-child a {
    border-bottom: none;
}

/* علامت فلش برای دسته‌هایی که زیرمنو دارن */
.has-submenu > a::before {
    content: "";
    float: left;
    font-size: 10px;
    margin-top: 2px;
    opacity: 0.7;
}


.nav-menu ul li {
    display: inline-block; /* منوی اصلی افقی بماند */
}

.dropdown-menu li {
    display: block !important; /* آیتم‌های داخلی حتما زیر هم باشند */
}




/* سرچ */

.search-box{
display:flex;
}

.search-box input{
padding:7px;
border:none;
border-radius:4px;
}

.search-box button{
padding:1px 10px;
border:none;
background:#2fa4ff;
color:white;
margin-right:5px;
border-radius:4px;
cursor:pointer;
}

/* آیکون ها */

.header-icons img{
width:45px;
margin-left:30px;
padding-left: 2px;
display: inline-block;
cursor:pointer;
}


/* ================================================================
================================================================ */

/* فوتر */

.main-footer{
background:#1c1c1c;
color:white;
margin-top:40px;
}

.footer-container{
display:flex;
justify-content:space-between;
padding:30px;
flex-wrap:wrap;
}

.footer-container div{
margin:10px;
}

.footer-links ul{
list-style:none;
}

.footer-links a{
color:white;
text-decoration:none;
}

.footer-bottom{
text-align:center;
padding:10px;
background:#111;
}

/* ریسپانسیو */

@media(max-width:900px){

.nav-menu{
display:none;
width:100%;
}

.nav-menu ul{
flex-direction:column;
}
.search-box{
margin-top:10px;
}

}
/* صفحه لاگین */

.login-page{
display:flex;
justify-content:center;
align-items:center;
min-height:80vh;
background:#0f2a44;
padding:20px;
}

.login-box{

background:white;
width:100%;
max-width:400px;
padding:30px;
border-radius:12px;
box-shadow:0 10px 25px rgba(0,0,0,0.3);
animation:fadeIn 0.6s ease;

}

.login-box h2{
text-align:center;
margin-bottom:20px;
color:#0f2a44;
}

.input-group{
margin-bottom:15px;
display:flex;
flex-direction:column;
}

.input-group label{
margin-bottom:5px;
font-size:14px;
}

.input-group input{
padding:10px;
border:1px solid #ccc;
border-radius:6px;
font-size:14px;
}

.input-group input:focus{
border-color:#2fa4ff;
outline:none;
}

/* پسورد */

.password-wrapper{
position:relative;
display:flex;
align-items:center;
}

.password-wrapper input{
width:100%;
}

.eye-icon{
position:absolute;
left:10px;
cursor:pointer;
font-size:18px;
}

/* دکمه */

.login-btn{
width:100%;
padding:10px;
background:#2fa4ff;
color:white;
border:none;
border-radius:6px;
cursor:pointer;
font-size:16px;
transition:0.3s;
}

.login-btn:hover{
background:#27ae60; /* سبز ظریف */
}

/* لینک ثبت نام */

.register-link{
text-align:center;
margin-top:15px;
font-size:14px;
}

.register-link a{
color:#27ae60;
text-decoration:none;
}

/* انیمیشن */

@keyframes fadeIn{
from{
opacity:0;
transform:translateY(20px);
}
to{
opacity:1;
transform:translateY(0);
}
}

/* رسپانسیو */

@media(max-width:480px){

.login-box{
padding:20px;
}

}
/* تنظیمات اضافی برای فرم‌های بلندتر */
.login-box h2 {
    margin-bottom: 25px;
    border-bottom: 2px solid #27ae60; /* یه خط سبز خوشگل زیر عنوان */
    padding-bottom: 10px;
}

#error-msg {
    background: #fdeaea;
    padding: 8px;
    border-radius: 4px;
    text-align: center;
}
/* ===== admin panel ===== */

.admin-container{
    width:90%;
    max-width:900px;
    margin:40px auto;
    background:#ffffff;
    padding:30px;
    border-radius:10px;
    box-shadow:0 5px 20px rgba(0,0,0,0.1);
}

.admin-container h2{
    text-align:center;
    color:#0f2a44;
    margin-bottom:25px;
}

.variant-item{

border:2px dashed #ccc;
padding:10px;
margin-bottom:15px;
border-radius:6px;
}
/* قسمت ادیت ادمین */
/* =========================
   فرم ویرایش محصول
========================= */

.edit-form label{
    display:block;
    margin-bottom:6px;
    font-weight:bold;
    color:#333;
}

.edit-form input,
.edit-form textarea,
.edit-form select{
    width:100%;
    padding:9px;
    margin-bottom:15px;
    border:1px solid #ccc;
    border-radius:8px;
    box-sizing:border-box;
}

.edit-form textarea{
    min-height:120px;
    resize:vertical;
}


/* =========================
   عکس اصلی محصول
========================= */

.main-product-img{
    width:130px;
    height:130px;
    object-fit:cover;
    border-radius:10px;
    border:1px solid #ddd;
    margin-bottom:15px;
}


/* =========================
   مدل های محصول
========================= */

.variant-row{
    display:flex;
    align-items:flex-end;
    gap:12px;
    background:#f9f9f9;
    border:1px solid #ddd;
    border-radius:10px;
    padding:12px;
    margin-bottom:12px;
}

.variant-field{
    flex:1;
}

.variant-field label{
    font-size:13px;
    margin-bottom:5px;
}

.variant-field input{
    margin-bottom:0;
}

.variant-delete-box{
    width:80px;
    text-align:center;
}

.variant-delete-box label{
    font-size:13px;
    margin-bottom:5px;
}


/* دکمه حذف مدل */

.delete-btn{
    display:block;
    background:#ff4d4d;
    color:white;
    padding:5px 10px;
    border-radius:8px;
    border: none;
    margin-bottom: 20px;
    text-decoration:none;
    font-size:13px;
}

.delete-btn:hover{
    background:#cc0000;
}


/* دکمه افزودن مدل */

.add-variant-btn{
    background:#3498db;
    color:white;
    border:none;
    padding:9px 15px;
    border-radius:8px;
    cursor:pointer;
    margin-bottom:15px;
}

.add-variant-btn:hover{
    background:#217dbb;
}


/* =========================
   گالری تصاویر
========================= */

.gallery-box{
    display:flex;
    flex-wrap:wrap;
    gap:15px;
    margin-top:10px;
    margin-bottom:20px;
}

.gallery-item{
    width:120px;
    background:#fff;
    border:1px solid #ddd;
    border-radius:10px;
    padding:8px;
    text-align:center;
    box-sizing:border-box;
}

.gallery-item img{
    width:100%;
    height:90px;
    object-fit:cover;
    border-radius:8px;
    display:block;
}


/* دکمه حذف عکس گالری */

.gallery-delete{
    display:block;
    width: 100px;
    margin-top:8px;
    background:#ff4d4d;
    color:white;
    padding:5px 0;
    border-radius:7px;
    text-decoration:none;
    font-size:13px;
    border: none;
}

.gallery-delete:hover{
    background:#cc0000;
}


/* 
   دکمه ذخیره*/

.save-edit-btn{
    background:#2ecc71;
    color:white;
    border:none;
    padding:11px 18px;
    border-radius:8px;
    cursor:pointer;
    font-size:15px;
}

.save-edit-btn:hover{
    background:#27ae60;
}

/* ===== form ===== */

.admin-form input,
.admin-form select,
.admin-form textarea{

    width:100%;
    padding:10px;
    margin-top:5px;
    margin-bottom:15px;
    border:1px solid #ddd;
    border-radius:6px;
    font-size:14px;

}

.admin-form input:focus,
.admin-form select:focus,
.admin-form textarea:focus{

    border-color:#1eff00;
    outline:none;
}

/* ===== button ===== */

.admin-btn{

    background:#0f2a44;
    color:white;
    padding:12px 20px;

    border:none;
    border-radius:6px;

    cursor:pointer;
    font-size:14px;

}

.admin-btn:hover{
    background:#1f8f6a;
}

/* ===== table ===== */

.admin-table{

    width:90%;
    margin:40px auto;
    border-collapse:collapse;
    background:white;

    box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.admin-table th{

    background:#0f2a44;
    color:white;
    padding:12px;
}

.admin-table td{

    padding:12px;
    border-bottom:1px solid #eee;
    text-align:center;
}

.admin-table tr:hover{
    background:#f7f7f7;
}

/* ===== action buttons ===== */

.btn-edit{

    background:#1f8f6a;
    color:white;
    padding:6px 12px;
    border-radius:4px;
    text-decoration:none;
}

.btn-delete{

    background:#c0392b;
    color:white;
    padding:6px 12px;
    border-radius:4px;
    text-decoration:none;
}

.btn-edit:hover{
    background:#167a58;
}

.btn-delete:hover{
    background:#a93226;
}

/* ===== responsive ===== */

@media (max-width:768px){

.admin-container{
    width:95%;
}

.admin-table{
    font-size:13px;
}

}
.admin-link a{

background:#64a5ff;
color:#fff;
padding:8px 14px;
border-radius:6px;
margin-right:10px;
font-size:14px;
transition:0.3s;

}

.admin-link a:hover{

background:#9dcbff;

}

.user-box{
display:flex;
align-items:center;
padding-left: 100px;
gap:10px;
display: block;
}




.admin-btn-header{
background:#4c96ff;
color:#fff;
padding:6px 12px;
border-radius:6px;
text-decoration:none;
font-size:13px;

}

.admin-btn-header:hover{
background:#0f2238;
}

.logout-btn{
background:#c0392b;
color:#fff;
margin-right: 60%;
padding:8px 16px;

border-radius:6px;
text-decoration:none;
font-size:13px;



}

.logout-btn:hover{
background:#922b21;
}

.shop{

width:95%;
margin:auto;
padding:40px 0;

}

.shop-title{

font-size:26px;
margin-bottom:25px;
    display: flex;
    flex-direction: column;

}


/* کد های مربوط به بخش فیلتر و دسته بندی */



.dyshop-filter-panel{

    align-self: flex-start; /* می‌چسبه سمت چپ */
    margin-right: auto;
    margin-left: 0;
    display:flex;
    align-items:center;
    gap:12px;
    width:fit-content;
    margin-bottom:25px;
    padding:12px 14px;
    background:#fff;
    border:1px solid rgba(31,58,95,0.15);
    border-radius:14px;
    box-shadow:0 6px 18px rgba(0,0,0,0.06);

}


.dyshop-filter-group{

    display:flex;
    flex-direction:column;
    gap:5px;

}


.dyshop-filter-label{

    font-size:15px;
    font-weight:700;
    color:#1f3a5f;

}


.dyshop-filter-select{

    width:160px;
    height:38px;

    padding:0 12px;

    border-radius:10px;
    border:1px solid #ddd;

    font-size:13px;
    font-weight:600;

    background:#fff;

    cursor:pointer;

    transition:0.2s;

}


.dyshop-filter-select:hover{

    border-color:#1f3a5f;

}


.dyshop-filter-select:focus{

    outline:none;

    border-color:#1f3a5f;
    box-shadow:0 0 0 3px rgba(31,58,95,0.12);

}


.dyshop-reset-btn{

    height:38px;

    padding:0 16px;

    border:none;

    border-radius:10px;

    background:#1f3a5f;
    color:#fff;

    font-size:13px;
    font-weight:700;

    cursor:pointer;

    transition:0.25s;

}


.dyshop-reset-btn:hover{

    background:#fff;
    color:#1f3a5f;

    box-shadow:0 0 0 1px #1f3a5f inset;

}
/* زسپانسیو */
@media (max-width: 992px) {

    .dyshop-filter-panel {
        width: fit-content;

        margin-left: auto;
        margin-right: 0;
        margin-bottom: 22px;

        padding: 11px 12px;

        gap: 10px;
    }

    .dyshop-filter-select {
        width: 150px;
        height: 37px;

        font-size: 12.5px;
    }

    .dyshop-reset-btn {
        height: 37px;

        padding: 0 14px;

        font-size: 12.5px;
    }

    .dyshop-filter-label {
        font-size: 11.5px;
    }

}


/* موبایل */
@media (max-width: 768px) {

    .dyshop-filter-panel {
        width: 100%;

        margin-left: 0;
        margin-right: 0;
        margin-bottom: 20px;

        padding: 12px;

        display: flex;
        flex-wrap: wrap;

        justify-content: flex-start;
        align-items: flex-end;

        gap: 10px;

        border-radius: 13px;
    }

    .dyshop-filter-group {
        flex: 1 1 calc(50% - 10px);

        min-width: 145px;
    }

    .dyshop-filter-select {
        width: 100%;
        height: 38px;

        font-size: 12.5px;
    }

    .dyshop-reset-btn {
        flex: 1 1 100%;

        width: 100%;
        height: 38px;

        margin-top: 2px;

        font-size: 13px;
    }

}


/* موبایل‌های خیلی کوچک */
@media (max-width: 480px) {

    .dyshop-filter-panel {
        padding: 10px;

        gap: 9px;
    }

    .dyshop-filter-group {
        flex: 1 1 100%;

        min-width: 100%;
    }

    .dyshop-filter-select {
        height: 37px;

        font-size: 12px;
    }

    .dyshop-reset-btn {
        height: 37px;

        font-size: 12.5px;
    }

    .dyshop-filter-label {
        font-size: 11.5px;
    }

}



.products{

display:grid;

grid-template-columns:repeat(5,1fr);

gap:20px;

}

.product-card{

background:white;

border-radius:12px;

overflow:hidden;

box-shadow:0 4px 15px rgba(0,0,0,0.08);

transition:0.3s;

display:flex;

flex-direction:column;

}

.product-card:hover{

transform:translateY(-6px);

box-shadow:0 10px 25px rgba(0,0,0,0.15);

}

.product-image{

position:relative;

width:100%;

height:200px;

overflow:hidden;

}

.product-image img{

width:100%;

height:100%;

object-fit:cover;

display:block;

}

.discount-badge-shop{

position:absolute;

top:10px;

right:10px;

background:#e63946;

color:white;

padding:4px 10px;

font-size:12px;

border-radius:6px;

}

.product-info{

padding:12px;

display:flex;

flex-direction:column;

gap:8px;

flex-grow:1;

}

.product-title{

font-size:15px;

font-weight:bold;

}

.product-desc{

font-size:13px;

color:#666;

line-height:1.5;

height:45px;

overflow:hidden;

}

.price-box{

display:flex;

align-items:center;

gap:40px;


}

.old-price{

text-decoration:line-through;

color:#999;
font-size:15px;

}

.new-price{

color:#0c0077;

font-size:16px;

font-weight:bold;

}

.product-buttons{

display:flex;

justify-content:space-between;

margin-top:auto;

}

.add-cart{

background:#3a86ff;

color:white;

border:none;

padding:6px 12px;

border-radius:6px;

cursor:pointer;

font-size:13px;

}

.add-cart:hover{

background:#2f6fe0;

}

.view-btn{

background:#06d6a0;

color:white;

padding:6px 12px;

border-radius:6px;

text-decoration:none;

font-size:13px;

}

.view-btn:hover{

background:#05b889;

}


/* responsive */

@media (max-width:1200px){

.products{
grid-template-columns:repeat(4,1fr);
}

}
/* اصلاح دکمه های محصول در موبایل */

@media (max-width: 768px){

.product-buttons{
    display:flex;
    gap:8px;
}

.product-buttons button,
.product-buttons a{
    flex:1;
    text-align: center;
    white-space:nowrap;
    font-size:13px;
    padding:8px 6px;
}

}

@media (max-width:900px){

.products{
grid-template-columns:repeat(3,1fr);
}

}

@media (max-width:600px){

.products{
grid-template-columns:repeat(2,1fr);
}

}

.shop-filter{

display:flex;

justify-content:flex-end;

margin-bottom:20px;

}

.shop-filter select{

padding:8px 12px;

border-radius:8px;

border:1px solid #ddd;

font-size:14px;

background:white;

cursor:pointer;

outline:none;

transition:0.2s;

}

.shop-filter select:hover{

border-color:#3a86ff;

}

.shop-filter select:focus{

border-color:#3a86ff;

box-shadow:0 0 5px rgba(58,134,255,0.3);

}

.shop-main-title {
    text-align: center;
    color: #1f3a5f;
    font-size: 30px;
    margin: 30px 0;
    border-bottom: 2px solid #e0dcd5;
    padding-bottom: 10px;
}

/* کانتینر اصلی */
.main-shop-wrapper {
    background-color: #00223d;
    border: 2px solid #e0dcd5;
    border-radius: 20px;
    padding: 30px;
    margin: 40px auto;
    max-width: 1300px;
    box-shadow: 0 10px 30px rgba(31, 58, 95, 0.08);
}

.discount-header {
    margin-bottom: 25px;
    border-bottom: 2px dashed #c3ffc1;
    padding-bottom: 10px;
}

.discount-header h2 {
    color: #fffcf4;
    font-size: 1.8rem;
    margin: 0;
}

/* اسکرول افقی */
.discount-scroll {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    padding: 10px 5px;
    scroll-behavior: smooth;
}

.discount-scroll::-webkit-scrollbar { height: 8px; }
.discount-scroll::-webkit-scrollbar-thumb { background: #89baff; border-radius: 10px; }

/* کارت محصول */
.discount-card {
    min-width: 230px;
    background: #fdfaf6;
    border-radius: 12px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    transition: 0.3s;
    overflow: hidden;
        
}

.discount-card:hover { transform: translateY(-5px); }

.image-box { position: relative; }

.image-box img { width: 100%; height: 160px; object-fit: cover; }

.discount-badge_detail {
    position: absolute;
    top: 8px;
    left: 250px;

    background: #e74c3c;
    color: #fff;
    padding: 4px 8px;
    border-radius: 5px;
    font-weight: bold;
    font-size: 0.8rem;
    min-width: 42px;
    text-align: center;
    visibility: visible;
}
.badge-hidden {
    visibility: hidden !important;
}
.card-body { padding: 12px; }

.card-body h3 { font-size: 0.95rem; color: #000855; margin-bottom: 5px; }

.desc { font-size: 0.8rem; color: #666; height: 35px; overflow: hidden; padding-bottom: 10px;}

.price-box { margin-top: 10px;
            white-space: nowrap; 
            overflow: hidden;
            text-overflow: ellipsis;
            min-height: 52px;
         }


.old-price-index { text-decoration: line-through; color: #999; font-size: 0.7rem; display: block; margin-top: 15px;}

.new-price-index { color: #1f3a5f; font-weight: bold; font-size: 1rem; margin-top: 15px; }

/* استایل دکمه‌های زیر کارت */
.card-actions {
    display: flex;
    gap: 10px;
    margin-top: 15px;
}

.btn-view, .btn-add {
    flex: 1; /* هر کدوم نصف فضای پایین رو بگیرن */
    padding: 8px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 0.85rem;
    text-align: center;
    transition: 0.3s;
    text-decoration: none;
}

/* دکمه مشاهده */
.btn-view {
    background-color: #e0dcd5;
    color: #2c3e50;
}
.btn-view:hover { background-color: #d1cbc0; }

/* دکمه افزودن به سبد */
.btn-add {
    background-color: #1f8f6a; 
    color: #ffffff;
}
.btn-add:hover { background-color: #1a7a5a; }

/* متمایز کردن رنگِ سربرگ جدیدترین‌ها */
.newest-section .discount-header {
    border-bottom: 2px dashed #b7ffb0; 
}
.newest-section .discount-header h2 {
    color: #f4ffce;
}
.discount-badge-inline {
    background: #e74c3c;
    color: #fff;
    padding: 2px 6px;
    border-radius: 4px;
    font-size: 0.75rem;
    font-weight: bold;
    display: inline-block;
    margin-top: 5px;
}
.view-all-btn {
    background-color: #bbfffc;
    color: #000638;
    padding: 8px 15px;
    border-radius: 20px; 
    text-decoration: none;
    font-size: 0.85rem;
    transition: 0.3s;
    border: 1px none;
    float: left;
}

.view-all-btn:hover {
    background-color: transparent;
    color: #dceeff;
}

.hero-wrapper{

display:flex;
align-items:stretch;
justify-content:flex-start;
gap:35px;

width:100%;
max-width:1450px;

margin:0 auto;
padding:0 25px;

}


/* هیرو */

.hero-section{

flex:1;
order:1;
min-width:0;

}

/* ستون پیشنهادات */

.hero-offer-side{

width:250px;
flex-shrink:0;

display:flex;
flex-direction:column;
justify-content:flex-start;

margin-right:10px;

}


/* هدر پیشنهادات */

.offer-side-header{

background:linear-gradient(135deg,#ff512f,#ff7b00);

color:white;

padding:9px;

border-radius:18px;

font-size:18px;
font-weight:900;

text-align:center;

margin-bottom:13px;

box-shadow:
0 10px 25px rgba(255,100,0,.35);

letter-spacing:.5px;

}


/* باکس */

.hero-offer-box{

background:white;
border-radius:20px;
padding:10px;

display:flex;
flex-direction:column;


height:auto;
min-height:320px;


box-shadow:0 15px 40px rgba(0,0,0,.12);

position:relative;

}


.hero-offer-box:hover{

transform:translateY(-5px);

}

/* تایمر */
.offer-progress{
    width:100%;
    height:7px;
    background:#e5e5e5;
    border-radius:30px;
    overflow:hidden;
    position:relative;
    backdrop-filter:blur(4px);
}

.offer-progress-bar{
    position:absolute;
    top:0;
    right:0;

    width:0%;
    height:100%;

    border-radius:30px;

    background:
    linear-gradient(
        90deg,
        #ff512f,
        #ff7b00,
        #ffb347
    );

    box-shadow:
    0 0 10px rgba(255,120,0,.6);

    transition:width 3.5s linear;
}





/* badge تخفیف */

.offer-discount-badge{

position:absolute;
top:18px;
left:18px;
background:#e63946;
color:white;
padding:6px 10px;
border-radius:10px;
font-size:13px;
font-weight:bold;

}

/* تصویر */

.hero-offer-img{

width:100%;
height:160px;
object-fit:contain;
margin-bottom:12px;

}

/* عنوان */

.hero-offer-title{

font-size:15px;
line-height:1.9;
margin-bottom:10px;
color:#222;
margin-right: 8px;

}

/* موجودی */

.hero-offer-stock{

background:#fff3cd;
color:#d62828;
padding:8px;
border-radius:10px;
font-size:16px;
font-weight:bold;
margin-bottom:14px;
text-align:center;

}

/* قیمت */

.offer-price-row{

display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:10px;

}

.offer-price-label{

font-size:14px;
color:#555;

}

.hero-old-price{

font-size:15px;
font-weight:bold;

color:#888;

text-decoration:line-through;
text-decoration-thickness:2px;

}


.hero-new-price{

font-size:18px;
font-weight:900;
color:#0a4fd6;

}


/* دارک مود */

body.dark-mode .hero-offer-box{

background:#1e1e1e;

}

body.dark-mode .hero-offer-title{

color:#f1f1f1;

}

body.dark-mode .offer-price-label{

color:#ccc;

}

body.dark-mode .hero-old-price{

color:#aaa;

}

body.dark-mode .hero-offer-stock{

background:#382525;
color:#ff8b8b;

}

body.dark-mode .offer-progress{

background:#333;

}
body.dark-mode .hero-new-price{
    color: rgb(178, 178, 255);
}

/* موبایل */

@media(max-width:950px){

.hero-wrapper{

flex-direction:column;

}

.hero-offer-side{

width:100%;

}

}

.hero-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding:10px 1%;
    background-color: #fdfaf6;
    margin-bottom: 40px;
    border-radius: 20px;
}

.hero-content {
    flex: 1;
    padding-right: 40px;
}

.hero-content h2 {
    font-size: 2rem;
    color: #1f3a5f;
    margin-bottom: 10px;
}

.hero-subtitle {
    font-size: 1.2rem;
    color: #535353;
    font-weight: bold;
    margin-bottom: 20px;
}

.hero-desc {
    color: #555;
    line-height: 1.8;
    margin-bottom: 30px;
    font-size: 1.1rem;
}

.hero-btns {
    display: flex;
    gap: 15px;
}

.hero-image {
    flex: 1;
    text-align: left;
}

.hero-image img {
    width: 100%;
    max-width: 400px;

}
.hero-offer-box{
text-decoration:none !important;
}

.hero-offer-box *{
text-decoration:none !important;
}

/* استایل دکمه‌های هیرو */
.btn-about, .btn-shop {
    padding: 12px 25px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
    transition: 0.3s;
}

.btn-about { background: #e0dcd5; color: #2c3e50; }
.btn-about:hover { background: #cfc9bf; }

.btn-shop { background: #1f8f6a; color: #fff; }
.btn-shop:hover { background: #1a7a5a; }

/* رسپانسیو برای موبایل */
@media (max-width: 768px) {
    .hero-section { flex-direction: column; text-align: center; }
    .hero-content { padding-right: 0; margin-bottom: 30px; }
}
/* کنترل ترتیب هیرو و پیشنهادات در موبایل */
@media (max-width: 768px) {

    .hero-wrapper {
        display: flex !important;
        flex-direction: column !important;
    }

    /* اول هیرو بیاد */
    .hero-section {
        order: 1 !important;
    }

    /* بعد باکس پیشنهادات بیاد */
    .hero-offer-side {
        order: 2 !important;
        width: 100% !important;
        margin: 0 !important;
        position: static !important;
    }

    .hero-offer-box {
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        transform: none !important;
        width: 100% !important;
    }
}

/* استایل بخش دسته بندی محصولات در اندکس */
.category-section{
padding:60px 0;
background:#f8f9fb;
}

.section-title{
text-align:center;
font-size:26px;
margin-bottom:40px;
font-weight:700;
}

.category-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
gap:25px;
max-width:1200px;
margin:auto;
padding:0 15px;
}

.category-card{
background:white;
border-radius:18px;
padding:20px 15px;
text-align:center;
text-decoration:none;
color:#333;
transition:0.3s;
box-shadow:0 5px 15px rgba(0,0,0,0.05);
}

.category-card:hover{
transform:translateY(-6px);
box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.category-img{
width:100%;
aspect-ratio:1/1;
overflow:hidden;
border-radius:14px;
margin-bottom:12px;
}

.category-img img{
width:100%;
height:100%;
object-fit:cover;
border-radius:14px;
}

.category-parent{
display:inline-block;
font-size:12px;
background:#eef2ff;
color:#4f46e5;
padding:4px 10px;
border-radius:20px;
margin-bottom:6px;
}

.category-card h3{
font-size:15px;
margin:5px 0 0;
font-weight:600;
}
@media (max-width:900px){

.category-grid{
grid-template-columns:repeat(3,1fr);
}

}

@media (max-width:600px){

.category-grid{
grid-template-columns:repeat(2,1fr);
gap:15px;
}

.category-card{
padding:14px;
}

.section-title{
font-size:22px;
}

}
.category-section{
padding:60px 0;
background:#f8f9fb;
}

.section-title{
text-align:center;
font-size:26px;
margin-bottom:35px;
}

.category-slider{
position:relative;
max-width:1200px;
margin:auto;
}

.category-wrapper{
overflow:hidden;
}

.category-track{
display:flex;
gap:20px;
transition:0.4s;
}

.category-card{
min-width:170px;
background:white;
border-radius:16px;
padding:15px;
text-align:center;
text-decoration:none;
color:#333;
box-shadow:0 5px 15px rgba(0,0,0,0.05);
}

.category-img{
width:100%;
aspect-ratio:1/1;
overflow:hidden;
border-radius:12px;
margin-bottom:10px;
}

.category-img img{
width:100%;
height:100%;
object-fit:cover;
}

.category-parent{
font-size:11px;
background:#eef2ff;
color:#4f46e5;
padding:3px 8px;
border-radius:20px;
}

.category-card h3{
font-size:14px;
margin-top:6px;
}

/* دکمه ها */

.cat-btn{
position:absolute;
top:40%;
transform:translateY(-50%);
background:white;
border:none;
width:38px;
height:38px;
border-radius:50%;
box-shadow:0 5px 15px rgba(0,0,0,0.15);
cursor:pointer;
font-size:18px;
z-index:5;
}

.cat-prev{
left:-15px;
}

.cat-next{
right:-15px;
}
.category-wrapper{
overflow-x:auto;
overflow-y:hidden;
scroll-behavior:smooth;
-webkit-overflow-scrolling:touch;
scrollbar-width:none;
}

.category-wrapper::-webkit-scrollbar{
display:none;
}

.category-track{
display:flex;
gap:20px;
width:max-content;
}

.category-card{
flex:0 0 170px;
background:#fff;
border-radius:16px;
padding:15px;
text-align:center;
text-decoration:none;
color:#333;
box-shadow:0 5px 15px rgba(0,0,0,0.05);
}
.cat-btn.is-disabled,
.cat-btn:disabled{
opacity:0.35;
cursor:not-allowed;
pointer-events:none;
}
.category-wrapper{
direction:ltr;
}

.category-track{
direction:ltr;
}

.category-card{
direction:rtl;
}

/* ============================================= */

.brands-section {
    padding: 20px 5%;
    background-color: #fdfaf6;
    margin: 40px 0;
}

.brands-container {
    display: flex;
    gap: 20px;
    padding-bottom: 20px;


}

.brands-container::-webkit-scrollbar {
    display: none;
}


.brand-item {
    min-width: 150px; /* سایزِ حداقل برای هر لوگو */
    height: 100px;
    background: #fff;
    border-radius: 15px; 
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    transition: 0.3s;
}

.brand-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 15px rgba(0,0,0,0.1);
}

.brand-item img {
    max-width: 70%;
    max-height: 70%;
    filter: grayscale(100%); 
    transition: 0.3s;
}

.brand-item:hover img {
    filter: grayscale(0%); 
}


.why-us-section {
    padding: 50px 5%;
    margin-bottom: 40px;
}

.why-us-container {
    background-color: #ffffff;
    color: #000000;
    padding: 40px;
    border-radius: 30px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
}

.feature-item {
    text-align: center;
    width: 200px;
}

.feature-item img {
    width: 80px;
    height: 80px;
    margin-bottom: 15px;

}

.feature-item h3 {
    font-size: 1rem;
    font-weight: 400;
}
.about-page { padding: 50px 10%; line-height: 1.8; color: #444; background-color: rgb(203, 223, 230);}

.about-hero {
    text-align: center;
    padding: 60px 0;
    background: #000c33;
    border-radius: 20px;
    margin-bottom: 50px;
}

.about-hero h1 { font-size: 3rem; color: #ffffff; }
.about-hero p{
    color: #bbbbbb;
}

.about-text { max-width: 800px; margin: 0 auto 50px; }

.about-values {
    display: flex;
    gap: 20px;
    justify-content: center;
}

.value-card {
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border-top: 5px solid #1f8f6a; 
    width: 300px;
    text-align: center;
}


.contact-page { padding: 50px 10%; max-width: 600px; margin: 0 auto; }

.contact-header { text-align: center; margin-bottom: 40px; }

.contact-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.contact-form input, .contact-form textarea {
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 10px;
}

.submit-btn {
    background-color: #1f8f6a;
    color: white;
    padding: 15px;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-weight: bold;
    transition: 0.3s;
}

.submit-btn:hover { background-color: #1a7a5a; }

.modal {
    display: none; /* اولش مخفیه */
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.5); /* تاریک کردنِ پس‌زمینه */
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.modal-content {
    background: #fff;
    padding: 30px;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    width: 300px;
}

.close-btn {
    background: #1f8f6a;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 10px;
    margin-top: 15px;
    cursor: pointer;
}
.site-footer { background-color: #000136; color: white; padding-bottom: 20px; }

.footer-container {
    display: flex;
    justify-content: space-around;
    padding: 20px 5%;
    flex-wrap: wrap; /* برای موبایل ستون‌ها میفتن زیر هم */
}

.footer-col { width: 300px; margin-bottom: 20px; }

.footer-col h3 { border-bottom: 2px solid white; display: inline-block; padding-bottom: 5px; margin-bottom: 15px;  color: rgb(255, 255, 255);}

.footer-col ul { list-style: none; padding: 0; }

.footer-col ul li a { color: white; text-decoration: none; display: block; margin: 5px 0; }

.footer-col p { margin: 5px 0; font-size: 0.9em; }


.footer-bottom { 
    text-align: center; 
    border-top: 1px solid rgba(255,255,255,0.2); 
    padding: 20px; 
    margin-top: 20px; 
    font-size: 0.85em;
}
.footer-bottom2{ 
    text-align: center; 

    padding: 10px; 
    margin-top: 20px; 
    font-size: 0.85em;
    background-color: transparent;
    color: rgb(221, 232, 255);
}


/* تم کلی صفحه محصول */
.product-page1 {
    background-color: #f9f9f9;
    padding: 10px 5%;
    font-family: Tahoma, sans-serif;
    
}

.product-detail-layout {
    display: flex;
    gap: 55px;
    align-items: flex-start;
    flex-wrap: wrap;
}

.product-image11 {
    flex: 0 0 340px;
    max-width: 340px;
    position: relative;
}

.product-image11 img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 14px;
    object-fit: cover;
}

/* اینم استایل همون کلاس خودت که خواستی */
.discount-badge1
 {
    width: 20%;
    text-align: center;
    position: absolute;
    top: 10px;
    right: 10px;
    background: #e53935; /* یه قرمز خوش‌رنگ */
    color: #fff;
    padding: 5px 10px;
    border-radius: 6px;
    font-size: 14px;
    z-index: 10; /* این مطمئن میشه همیشه میاد رو عکس */
    pointer-events: none; /* این خط نمیذاره کلیک کاربر روی این باکس سایت رو گیج کنه */
}
.product-info11 {
    flex: 1;
    min-width: 320px; 
    padding-top: 8px;
}
.product-info11-h1{
    font-size: 45px;
}
.stock-status {
    font-size: 1.15rem;
    font-weight: bold;
    margin: 12px 0;
}


.old-price-detail {

    text-decoration: line-through;
    color: gray;
    display: inline-block;
    margin-left: 10px;
    font-size: 1rem;
}

.new-price-detail {
    color: rgb(0, 9, 128);
    margin: 10px 0;
    font-size: 1.5rem;
}
.detail-cart-row {
    display: flex;
    align-items: center;
    gap: 16px; /* قبلاً 12 بود */
    flex-wrap: wrap;
    margin-top: 24px; /* قبلاً 18 بود */
}

.detail-qty-box {
    display: inline-flex;
    align-items: center;
    border: 1px solid #dcdcdc;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    height: 48px; /* قبلاً 42 */
}

.detail-qty-btn {
    width: 42px;   /* قبلاً 38 */
    height: 48px;  /* قبلاً 42 */
    border: none;
    background: #f3f3f3;
    color: #333;
    font-size: 22px;
    cursor: pointer;
    padding: 0;
    flex: 0 0 42px;
}

.detail-qty-btn:hover {
    background: #e7e7e7;
}

.detail-qty-input {
    width:38px;   
    height: 48px;  
    border: none;
    outline: none;
    text-align: center;
    font-size: 16px;
    background: #fff;
    padding: 0;
}

.detail-add-cart-btn {
    display: inline-block;
    width: auto !important;
    min-width: 210px; /* قبلاً 170 */
    max-width: 260px; /* قبلاً 220 */
    height: 48px;     /* قبلاً 42 */
    border: none;
    border-radius: 12px;
    background: #28a745;
    color: #fff;
    padding: 0 22px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    flex: 0 0 auto;
}

.detail-add-cart-btn:hover {
    background: #218838;
}

.disabled-btn {
    background: #999 !important;
    filter: grayscale(1);
    cursor: not-allowed;
}
/* بخش ادامه برای محصولات مدل دار در دیتیل محصول */
.variant-section{
margin-top:20px;
}

.variant-boxes{
display:flex;
gap:10px;
flex-wrap:wrap;
margin-top:10px;
}

.variant-box{
padding:8px 14px;
border:1px solid #ccc;
border-radius:8px;
cursor:pointer;
background:#fff;
}

.variant-box:hover{
border-color:#28a745;
}

.variant-box.active{
background:#28a745;
color:#fff;
border-color:#28a745;
}

/* گالری */

.gallery-main{
position:relative;
}

.gallery-main img{
width:100%;
height: 380px;
border-radius:10px;
}

.gallery-btn{
position:absolute;
top:50%;
transform:translateY(-50%);
background:white;
border:none;
border-radius: 15px;
font-size:25px;
cursor:pointer;
font-weight: bolder;
padding:6px 12px;
}

.gallery-btn.prev{
left:5px;
}

.gallery-btn.next{
right:5px;
}

.gallery-thumbs {
    width: 50px;
    height: 50px;
    display: flex;
    gap: 10px;
    margin-top: 15px;
}

.thumb {
    width: 70px;
    height: 70px;
    object-fit: cover;
    cursor: pointer;
    border-radius: 8px;
    opacity: 0.6; /* محو بودن اولیه */
    transition: 0.3s;
    border: 2px solid transparent;
}

.thumb.active-thumb {
    opacity: 1; /* پررنگ شدن عکس انتخاب شده */
    border-color: #28a745;
}






@media (max-width: 768px) {
    .product-detail-layout {
        flex-direction: column;
        gap: 28px;
    }

    .product-image11 {
        max-width: 100%;
        width: 100%;
    }

    .product-info11 {
        min-width: 100%;
        padding-top: 0;
    }

    .detail-cart-row {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .detail-add-cart-btn {
        width: 100% !important;
        max-width: 100%;
    }

    .detail-qty-box {
        width: fit-content;
    }
    
}



/* استایل مربوط به تاگل پسورد در ثبتنام و ورود*/
.password-wrapper {
    position: relative;
}

.password-wrapper input {
    width: 100%;
    padding-left: 40px;
    box-sizing: border-box;
}

.toggle-password {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 18px;
    user-select: none;
}
.field-error{
color:red;
font-size:13px;
display:block;
margin-top:5px;
}



.toast-msg {
    position: fixed;
    bottom: 20px;
    right: 20px;
    min-width: 260px;
    max-width: 340px;
    padding: 14px 18px;
    border-radius: 12px;
    color: #fff;
    font-size: 14px;
    line-height: 1.8;
    z-index: 9999;
    box-shadow: 0 10px 30px rgba(0,0,0,0.18);
    opacity: 0;
    transform: translateY(25px) scale(0.95);
    transition: all 0.35s ease;
    direction: rtl;
}

.toast-msg.show {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.toast-msg.hide {
    opacity: 0;
    transform: translateY(15px) scale(0.96);
}

.toast-msg.success {
    background: linear-gradient(135deg, #27ae60, #2ecc71);
}

.toast-msg.error {
    background: linear-gradient(135deg, #c0392b, #e74c3c);
}

.toast-msg.info {
    background: linear-gradient(135deg, #2980b9, #3498db);
}



/* کانتینر اصلی */
.ds-cart-wrapper {
    max-width: 900px;
    margin: 50px auto;
    padding: 30px;
    background: #fdfdfd;
    border-radius: 20px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.08);
}

.ds-cart-title { color: #1f8f6a; margin-bottom: 30px; text-align: center; }

/* جدول محصولات */
.ds-cart-table { width: 100%; border-spacing: 0 15px; }
.ds-cart-table th { color: #ffffff; font-weight: 500; padding: 10px; background-color: #000763;}
.ds-cart-table td { background: #fff; padding: 15px; border-top: 1px solid #eee; border-bottom: 1px solid #eee; text-align: center; }


/* عکس محصول */
.ds-product-thumb { width: 60px; height: 60px; object-fit: cover; border-radius: 10px; }

/* دکمه حذف */
.ds-remove-btn { 
    background: #ffeaea; color: #ff4d4d; border: none; 
    padding: 8px 15px; border-radius: 8px; cursor: pointer; font-size: 13px; transition: 0.3s;
}
.ds-remove-btn:hover { background: #ff4d4d; color: #fff; }

/* فوتر سبد خرید */
.ds-cart-footer { text-align: left; margin-top: 30px; padding-top: 20px;  }
.ds-cart-footer h3{color: #000286; font-size: 25px;}
.ds-checkout-btn {
    background: #1f8f6a; color: white; border: none; padding: 15px 40px; 
    border-radius: 12px; cursor: pointer; font-size: 16px; font-weight: bold; transition: 0.3s;
}
.ds-checkout-btn:hover { background: #176e52; transform: scale(1.02); }

/* پیام سبد خالی */
.ds-empty-msg { text-align: center; color: #aaa; font-style: italic; padding: 40px; }




/* استایل اختصاصی و بدون متغیر برای گلی جون */

.checkout-page {
    background-color: #f4f7f6;
    padding: 40px 0;

    color: #333;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.checkout-grid {
    display: grid;
    grid-template-columns: 2fr 1.2fr; /* ستون پیش‌فاکتور کمی عریض‌تر شد */
    gap: 30px;

}

.card {
    background: #ffffff;
    border-radius: 15px;
    padding: 30px; /* فضای داخلی بیشتر */
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);

    display: flex;
    flex-direction: column;
}

.checkout-h4 , .checkout-h3{
    color: #2c3e50; /* رنگ آبی تیره جذاب */
    margin-bottom: 25px;
    border-bottom: 2px solid #eee;
    padding-bottom: 15px;
}

.input-row {
    display: flex;
    gap: 15px;
}

.input-group {
    flex: 1;
    margin-bottom: 20px;
}

.input-group label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: bold;
    color: #555;
}

.input-group input, .input-group textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #fafafa;
    font-family: inherit;
}

/* استایل حمل و نقل */
.shipping-options {
    display: flex;
    gap: 15px;
    margin-top: 10px;
}

.shipping-card {
    flex: 1;
    border: 2px solid #eee;
    padding: 15px;
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
    display: flex;
    align-items: center;
    gap: 10px;
}

.shipping-card:has(input:checked) {
    border-color: #3498db; /* رنگ آبی روشن برای انتخاب */
    background: #eef6ff;
}

.method-name { font-weight: bold; display: block; color: #333; }
.method-price { font-size: 12px; color: #777; }

/* استایل پیش‌فاکتور */
#cartItemsPreview {
    flex-grow: 1; /* باعث میشه این بخش فضای خالی رو پر کنه */
}

.preview-item {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px dashed #eee;
}

.preview-item img {
    width: 65px; /* کمی بزرگتر */
    height: 65px;
    object-fit: cover;
    border-radius: 8px;
}

.p-info { flex-grow: 1; }
.p-name { display: block; font-size: 14px; font-weight: 600; color: #333; }
.p-qty { font-size: 12px; color: #999; margin-top: 4px; }
.p-price { font-weight: bold; font-size: 14px; color: #2c3e50; }

.summary-details {
    margin-top: 30px;
    background: #f9f9f9;
    padding: 20px;
    border-radius: 10px;
}

.summary-line {
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
    font-size: 14px;
    color: #444;
}

.total {
    font-weight: bold;
    color: #e67e22; /* رنگ نارنجی برای قیمت نهایی */
    font-size: 20px;
    margin-top: 10px;
}

.btn-submit-order {
    width: 100%;
    padding: 18px;
    background: #27ae60;
    color: white;
    border: none;
    border-radius: 10px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    margin-top: 25px;
    transition: 0.3s;
}

.btn-submit-order:hover {
    background: #219150;
    transform: translateY(-2px);
}

.terms {
    margin-top: 15px;
    font-size: 12px;
    color: #888;
    text-align: center;
}

/* Responsive */
@media (max-width: 992px) {
    .checkout-grid { grid-template-columns: 1fr; }
}



.dyshop-hidden {
    display: none !important;
}
 
.dyshop-highlight{
background:#ffe066;
padding:2px 4px;
border-radius:4px;
}






/* استایل های بخش فاکتور نهایی و invoice.php */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: 'Tahoma', 'Arial', sans-serif;
    background-color: #f0f2f5;
    color: #334155;
    line-height: 1.6;
    direction: rtl;
}

.syf-invoice-page {
    min-height: 100vh;
    padding: 40px 15px;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    display: flex;
    justify-content: center;
}

.syf-invoice-shell {
    width: 100%;
    max-width: 1000px;
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);
    padding: 40px;
}

/* --- هدر موفقیت --- */
.syf-invoice-success-box {
    text-align: center;
    padding: 32px 24px;
    margin-bottom: 30px;
    background: linear-gradient(135deg, #1daf00d5 5%, #10c200 100%);
    border-radius: 20px;
    color: white;
    box-shadow: 0 14px 28px rgba(10, 108, 67, 0.22);
    position: relative;
    overflow: hidden;
}

.syf-invoice-success-box::before {
    content: "";
    position: absolute;
    top: -60px;
    left: -60px;
    width: 180px;
    height: 180px;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 50%;
}

.syf-invoice-success-box::after {
    content: "";
    position: absolute;
    bottom: -70px;
    right: -70px;
    width: 220px;
    height: 220px;
    background: rgba(255, 255, 255, 0.06);
    border-radius: 50%;
}

.syf-invoice-success-mark {
    width: 78px;
    height: 78px;
    margin: 0 auto 16px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.syf-invoice-success-circle {
    position: absolute;
    inset: 0;
    display: block;
    width: 78px;
    height: 78px;
    background: rgba(255, 255, 255, 0.18);
    border: 2px solid rgba(255, 255, 255, 0.22);
    border-radius: 50%;
    backdrop-filter: blur(1px);
    animation: syfScaleUp 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.syf-invoice-success-check {
    position: relative;
    width: 26px;
    height: 14px;
    border-left: 4px solid #ffffff;
    border-bottom: 4px solid #ffffff;
    transform: rotate(-45deg) scale(0.5);
    opacity: 0;
    z-index: 2;
    margin-top: -2px;
    animation: syfCheckIn 0.35s ease-out 0.28s forwards;
}

.syf-invoice-success-content {
    position: relative;
    z-index: 2;
}

.syf-invoice-title {
    font-size: 28px;
    font-weight: 800;
    margin-bottom: 16px;
    color: #ffffff;
    line-height: 1.8;
}

.syf-invoice-track-row {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center;
    background: rgba(10, 116, 0, 0.514);
    padding: 10px 14px;
    border-radius: 12px;
}

.syf-invoice-track-label {
    font-size:19px;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.85);
}

.syf-invoice-track-code {
    display: inline-block;
    font-size: 21px;
    font-weight: 800;
    padding: 2px 6px;
    border-radius: 8px;
    color: #ffffff;
    direction: ltr;
    letter-spacing: 0.5px;
}

/* --- گرید اطلاعات گیرنده --- */
.syf-invoice-top-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 20px;
}

.syf-invoice-info-card,
.syf-invoice-address-card,
.syf-invoice-note-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 15px;
    padding: 20px;
}

.syf-invoice-address-card {
    margin-bottom: 24px;
}

.syf-invoice-info-head {
    font-weight: bold;
    margin-bottom: 15px;
    color: #0f172a;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 10px;
    font-size: 16px;
}

.syf-invoice-info-body {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.syf-invoice-info-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-bottom: 8px;
}

.syf-invoice-info-item span {
    color: #64748b;
    font-size: 14px;
}

.syf-invoice-info-item strong {
    color: #0f172a;
    font-size: 14px;
    font-weight: 800;
    text-align: left;
}

.syf-invoice-address-text {
    color: #334155;
    font-size: 14px;
    line-height: 2;
}

/* ---  در فاکتورجدول محصولات --- */
.syf-invoice-products-wrap {
    margin: 30px 0;
}

.syf-invoice-section-head {
    margin-bottom: 20px;
    display: flex;
    justify-content: space-between;
    align-items: end;
    gap: 12px;
}

.syf-invoice-section-head h2 {
    font-size: 22px;
    color: #0f172a;
    font-weight: 800;
}

.syf-invoice-section-head span {
    font-size: 15px;
    color: #64748b;
}

.syf-invoice-products-table {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    overflow: hidden;
    background: #ffffff;
}

.syf-invoice-products-header {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    background: #f1f5f9;
    font-weight: bold;
    color: #475569;
    border-bottom: 1px solid #e2e8f0;
}

.syf-invoice-products-header > div {
    padding: 15px;
    font-size: 14px;
}

.syf-invoice-products-body {
    display: block;
}

.syf-invoice-product-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;
    align-items: center;
    padding: 0;
    border-bottom: 1px solid #e2e8f0;
}

.syf-invoice-product-row:last-child {
    border-bottom: none;
}

.syf-col-product,
.syf-col-price,
.syf-col-qty,
.syf-col-total {
    padding: 18px 15px;
}

.syf-col-price,
.syf-col-qty,
.syf-col-total {
    color: #334155;
    font-size: 14px;
    font-weight: 700;
}

.syf-col-price strong,
.syf-col-total strong {
    color: #0f172a;
    font-size: 15px;
}

.syf-col-price small,
.syf-col-total small {
    color: #64748b;
    font-size: 12px;
    margin-right: 4px;
}

.syf-invoice-product-main {
    display: flex;
    align-items: center;
    gap: 15px;
}

.syf-invoice-product-image-wrap {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    overflow: hidden;
    flex: 0 0 64px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
}

.syf-invoice-product-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
    display: block;
}

.syf-invoice-product-meta {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.syf-invoice-product-name {
    color: #0f172a;
    font-size: 15px;
    font-weight: 800;
    line-height: 1.8;
}

.syf-invoice-product-sub {
    color: #64748b;
    font-size: 12px;
}

.syf-qty-pill {
    background: #e2e8f0;
    padding: 5px 15px;
    border-radius: 20px;
    display: inline-block;
    font-weight: bold;
    color: #0f172a;
    min-width: 42px;
    text-align: center;
}

/* مهم: در دسکتاپ نباید این لیبل‌ها دیده شوند */
.syf-mobile-label {
    display: none;
}

/* --- جمع‌بندی --- */
.syf-invoice-summary-section {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px;
    margin-bottom: 10px;
}

.syf-invoice-summary-card {
    background: #f8fafc;
    padding: 20px;
    border-radius: 15px;
    width: 300px;
    margin-left: auto;
    border: 1px solid #e2e8f0;
}

.syf-invoice-summary-row {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    color: #334155;
    font-size: 14px;
}

.syf-invoice-summary-row strong {
    color: #0f172a;
}

.syf-invoice-summary-final {
    font-size: 18px;
    font-weight: 800;
    color: #087443;
    margin-top: 15px;
    padding-top: 15px;
    border-top: 2px solid #cbd5e1;
}

.syf-invoice-summary-final strong {
    color: #087443;
    font-size: 20px;
}

.syf-invoice-note-card {
    margin-top: 16px;
}

.syf-invoice-note-card p {
    color: #475569;
    font-size: 14px;
    line-height: 1.9;
}

/* --- دکمه‌ها --- */
.syf-invoice-actions {
    margin-top: 30px;
    display: flex;
    gap: 15px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.syf-invoice-btn {
    padding: 12px 25px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 700;
    cursor: pointer;
    border: none;
    transition: 0.3s;
    font-family: inherit;
    font-size: 14px;
}

.syf-invoice-btn-print {
    background: #e2e8f0;
    color: #475569;
}

.syf-invoice-btn-home {
    background: #0f172a;
    color: white;
}

.syf-invoice-btn:hover {
    opacity: 0.92;
    transform: translateY(-1px);
}

/* --- انیمیشن‌ها --- */
@keyframes syfScaleUp {
    from {
        transform: scale(0.3);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes syfCheckIn {
    from {
        transform: rotate(-45deg) scale(0.4);
        opacity: 0;
    }
    to {
        transform: rotate(-45deg) scale(1);
        opacity: 1;
    }
}

/* --- موبایل --- */
@media (max-width: 768px) {
    .syf-invoice-page {
        padding: 20px 10px;
    }

    .syf-invoice-shell {
        padding: 18px;
        border-radius: 18px;
    }

    .syf-invoice-title {
        font-size: 23px;
    }

    .syf-invoice-top-grid {
        grid-template-columns: 1fr;
    }

    .syf-invoice-products-header {
        display: none;
    }

    .syf-invoice-product-row {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 14px;
        text-align: right;
    }

    .syf-col-product,
    .syf-col-price,
    .syf-col-qty,
    .syf-col-total {
        padding: 0;
    }

    .syf-col-price,
    .syf-col-qty,
    .syf-col-total {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding-top: 10px;
        border-top: 1px dashed #e2e8f0;
    }

    .syf-mobile-label {
        display: inline-block;
        font-size: 12px;
        color: #94a3b8;
        font-weight: 700;
    }

    .syf-invoice-summary-section {
        justify-content: stretch;
    }

    .syf-invoice-summary-card {
        width: 100%;
    }

    .syf-invoice-actions {
        flex-direction: column;
    }

    .syf-invoice-btn {
        width: 100%;
        text-align: center;
    }
}
/* بخش پرینت */
@media print {
    @page {
        size: A4;
        margin: 12mm;
    }

    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    body {
        margin: 0 !important;
        padding: 0 !important;
        background: #fff !important;
    }

    header,
    footer,
    nav,
    aside,
    .syf-invoice-actions {
        display: none !important;
    }

    .syf-invoice-page {
        padding: 0 !important;
        margin: 0 !important;
        background: #fff !important;
    }

    .syf-invoice-shell {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        background: #fff !important;
    }
}


/* ======استایل های بخش داشبورد ادمین ======*/


.syfadm-page {
    direction: rtl;
    min-height: 100vh;
    padding: 40px 16px;
    background: linear-gradient(135deg, #f4f7fb 0%, #eef3f9 100%);
    box-sizing: border-box;
}

.syfadm-shell {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
}

.syfadm-hero {
    text-align: center;
    margin-bottom: 36px;
}

.syfadm-hero-tag {
    display: inline-block;
    background: #e8eefc;
    color: #2949b6;
    border: 1px solid #d7e2fb;
    border-radius: 999px;
    padding: 10px 18px;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 18px;
}

.syfadm-hero-title {
    margin: 0 0 14px;
    font-size: 34px;
    line-height: 1.5;
    color: #172033;
    font-weight: 800;
}

.syfadm-hero-text {
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
    color: #5f6b7a;
    font-size: 16px;
    line-height: 2;
}

.syfadm-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 22px;
}

.syfadm-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 260px;
    background: #ffffff;
    border: 1px solid #e6ebf2;
    border-radius: 22px;
    padding: 22px;
    text-decoration: none;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.syfadm-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 40px rgba(31, 45, 61, 0.10);
    border-color: #cfd9e8;
}

.syfadm-card::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 5px;
    background: #3563e9;
}

.syfadm-card-mark {
    margin-bottom: 20px;
}

.syfadm-card-mark-inner {
    display: inline-block;
    min-width: 66px;
    text-align: center;
    background: #eef4ff;
    color: #2e57d1;
    border-radius: 12px;
    padding: 10px 14px;
    font-size: 14px;
    font-weight: 700;
}

.syfadm-card-body {
    flex-grow: 1;
}

.syfadm-card-title {
    margin: 0 0 12px;
    color: #162032;
    font-size: 22px;
    line-height: 1.6;
    font-weight: 800;
}

.syfadm-card-text {
    margin: 0;
    color: #637083;
    font-size: 15px;
    line-height: 2;
}

.syfadm-card-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #edf1f6;
}

.syfadm-card-linktext {
    color: #2d56cf;
    font-size: 14px;
    font-weight: 700;
}

.syfadm-card-arrow {
    color: #2d56cf;
    font-size: 18px;
    font-weight: 700;
    transition: transform 0.25s ease;
}

.syfadm-card:hover .syfadm-card-arrow {
    transform: translateX(-4px);
}

/* رنگ اختصاصی کارت‌ها */
.syfadm-card-orders::before {
    background: #2563eb;
}

.syfadm-card-orders .syfadm-card-mark-inner {
    background: #eaf1ff;
    color: #2563eb;
}

.syfadm-card-products::before {
    background: #7c3aed;
}

.syfadm-card-products .syfadm-card-mark-inner {
    background: #f2ebff;
    color: #7c3aed;
}

.syfadm-card-comments::before {
    background: #d97706;
}

.syfadm-card-comments .syfadm-card-mark-inner {
    background: #fff3e4;
    color: #d97706;
}

.syfadm-card-reports::before {
    background: #059669;
}

.syfadm-card-reports .syfadm-card-mark-inner {
    background: #fff3e4;
    color: #059669;
}




.syfadm-bottom {
    text-align: center;
    margin-top: 34px;
}

.syfadm-back-home {
    display: inline-block;
    text-decoration: none;
    background: #ffffff;
    color: #24324a;
    border: 1px solid #dce4ef;
    border-radius: 999px;
    padding: 12px 24px;
    font-size: 15px;
    font-weight: 700;
    transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.syfadm-back-home:hover {
    background: #f8fbff;
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(31, 45, 61, 0.08);
}

/* واکنش‌گرا */
@media (max-width: 1100px) {
    .syfadm-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 700px) {
    .syfadm-page {
        padding: 28px 12px;
    }

    .syfadm-hero {
        margin-bottom: 26px;
    }

    .syfadm-hero-title {
        font-size: 28px;
    }

    .syfadm-hero-text {
        font-size: 15px;
        line-height: 1.9;
    }

    .syfadm-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .syfadm-card {
        min-height: auto;
        padding: 20px;
        border-radius: 18px;
    }

    .syfadm-card-title {
        font-size: 20px;
    }

    .syfadm-card-text {
        font-size: 14px;
    }
}

/* استایل های بخش ادمین مدیریت سفارشات Admin Orders Page*/



.stuord-page{
background:#f4f6fb;
padding:40px;
}

.stuord-container{
max-width:1100px;
margin:auto;
}

.stuord-list{
display:flex;
flex-direction:column;
gap:20px;
}

.stuord-card{
background:#fff;
border-radius:15px;
box-shadow:0 10px 30px rgba(0,0,0,.05);
overflow:hidden;
}

.stuord-summary{
display:flex;
justify-content:space-between;
align-items:center;
padding:20px;
cursor:pointer;
background:#fafbff;
}

.stuord-summary-left{
display:flex;
gap:10px;
align-items:center;
}

.stuord-status{
background:#eef2ff;
color:#4338ca;
padding:6px 12px;
border-radius:20px;
font-size:12px;
font-weight:700;
}

.stuord-arrow{
transition:.3s;
}

.stuord-card.open .stuord-arrow{
transform:rotate(180deg);
}

.stuord-details{
max-height:0;
overflow:hidden;
transition:max-height .4s ease;
}

.stuord-inner{
padding:20px;
}

.stuord-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
gap:15px;
margin-bottom:20px;
}

.stuord-box{
background:#ceffc8;
padding:15px;
border-radius:12px;
}
.stuord-box-total-price{
    color: orangered;
    font-size: large;
    font-weight: bolder;
}
.stuord-products{
border:1px solid #eee;
border-radius:10px;
overflow:hidden;
margin-bottom:20px;
}

.stuord-products-row{
display:grid;
grid-template-columns:2fr 1fr 1fr 1fr;
padding:10px;
border-bottom:1px solid #eee;
font-size:13px;
}

.stuord-products-row.head{
background:#dae4ff;
font-weight:800;
}

.price{
color:#16a34a;
font-weight:800;
}

.stuord-actions select{
padding:8px;
border-radius:8px;
}

.stuord-actions button{
padding:8px 15px;
background:#4f46e5;
color:#fff;
border:none;
border-radius:8px;
cursor:pointer;
}

.stuord-alert{
background:#dcfce7;
color:#166534;
padding:10px;
border-radius:8px;
margin-bottom:15px;
}

/* بخش اضافه شده برای ریز اطلاعات مشتری و سفارش */
/* ============================= */
/* بخش اطلاعات مشتری - نسخه فوق هوشمند و ضد تخریب */
/* ============================= */

.stuord-customer-box {
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px dashed #d1d5db;
}

.stuord-customer-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

/*  (نام، تلفن، استان، شهر) */
.stuord-customer-item {
    background: #ffe60056;
    border: 1px solid rgb(255, 239, 91);
    border-radius: 10px;
    padding: 10px 15px;
    flex: 1 1 calc(25% - 12px); /* چهار تا در یک ردیف */
    min-width: 140px; 
    box-sizing: border-box;
    word-wrap: break-word; /* ضد بیرون زدگی متن */
    overflow-wrap: break-word;
}

/*  (آدرس و یادداشت) */
.stuord-customer-item.full-width {
    flex: 1 1 100%; /* تمام عرض را می‌گیرد */
    min-height: 60px;
    line-height: 1.6;
}

.stuord-customer-item b {
    display: block;
    font-size: 13px;
    color: #6b7280;
    margin-bottom: 4px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.stuord-customer-item span {
    font-size: 15px;
    color: #1f2937;
    font-weight: 500;
    display: block;
    white-space: normal; /* اجازه می‌ده متن بره خط بعد */
}


.stuord-customer-note {
    background: #fff7d9 !important;
    border-color: #fde170 !important;
}


@media (max-width: 768px) {
    .stuord-customer-item {
        flex: 1 1 calc(50% - 12px); /* در تبلت دوتا دوتا */
    }
}

@media (max-width: 480px) {
    .stuord-customer-item {
        flex: 1 1 100%; /* در موبایل یکی یکی */
    }
}


/* استایل بخش نظرکاربران در دیتیل محصول */
/* چیدمان اصلی */
.product-main-layout{
display:flex;
gap:25px;
margin-top:40px;
align-items:flex-start;
}

.product-description-side{
flex:3;
background:#fff;
padding:25px;
border-radius:15px;
box-shadow:0 5px 15px rgba(0,0,0,0.03);
}

.product-sidebar-review{
flex:1.3;
position:sticky;
top:20px;
}

.mini-review-card{
background:#f9fbfd;
padding:20px;
border-radius:14px;
border:1px solid #e1e8ed;
}

.mini-review-card h4{
font-size:1rem;
margin-bottom:12px;
}

.mini-input{
width:100%;
padding:10px;
border-radius:8px;
border:1px solid #ddd;
margin-bottom:10px;
font-size:0.9rem;
}

.mini-textarea{
width:100%;
height:110px;
padding:10px;
border-radius:8px;
border:1px solid #ddd;
resize:none;
font-size:0.9rem;
margin-bottom:10px;
}

.submit-btn-cyan{
width:100%;
background:#00bcd4;
color:white;
border:none;
padding:11px;
border-radius:8px;
cursor:pointer;
font-weight:bold;
}

.submit-btn-cyan:hover{
background:#00acc1;
}
/* رسپانسیو برای این قسمت */
@media (max-width: 1024px){

.product-main-layout{
flex-direction: column;
gap:20px;
}

.product-description-side{
flex:unset;
width:100%;
}

.product-sidebar-review{
flex:unset;
width:100%;
position:relative; /* sticky خاموش */
top:0;
}

}

/* تبلت */

@media (max-width: 768px){

.product-description-side{
padding:20px;
}

.mini-review-card{
padding:18px;
}

.mini-textarea{
height:100px;
}

}

/* موبایل */

@media (max-width: 480px){

.product-main-layout{
margin-top:25px;
gap:15px;
}

.product-description-side{
padding:16px;
border-radius:12px;
}

.mini-review-card{
padding:15px;
border-radius:12px;
}

.mini-input{
font-size:0.85rem;
padding:9px;
}

.mini-textarea{
font-size:0.85rem;
height:90px;
}

.submit-btn-cyan{
padding:10px;
font-size:0.9rem;
}

}

/* comments section */

.users-comments-list{
margin-top:40px;
border-top:2px solid #eee;
padding-top:25px;
}

.comments-wrapper{
position:relative;
display:flex;
align-items:center;
}

.comments-grid{
display:flex;
gap:18px;
overflow-x:auto;
scroll-behavior:smooth;
padding:10px;
}

.comments-grid::-webkit-scrollbar{
height:8px;
}

.comment-bubble{
min-width:300px;
max-width:300px;
flex-shrink:0;
background:white;
padding:15px;
border-radius:14px;
box-shadow:0 3px 10px rgba(0,0,0,0.05);
border:1px solid #eee;
}

.bubble-header{
display:flex;
align-items:center;
gap:8px;
margin-bottom:8px;
}

.user-name-tag{
font-weight:bold;
font-size:0.9rem;
}

.mini-buyer-badge{
font-size:0.7rem;
background:#e8f5e9;
color:#2e7d32;
padding:2px 6px;
border-radius:4px;
}

.user-given-stars{
margin-right:auto;
display:flex;
gap:2px;
direction:ltr;
}

.star-rating-display{
width:16px;
height:16px;
}

.user-text{
font-size:0.88rem;
color:#555;
line-height:1.6;
}

.admin-reply-box{
background:#f1f3f5;
margin-top:10px;
padding:10px;
border-radius:8px;
border-right:3px solid #00bcd4;
}

.admin-reply-box small{
font-weight:bold;
color:#00bcd4;
}

.no-comments-box{
width:100%;
padding:60px;
text-align:center;
border:2px dashed #e5e5e5;
border-radius:16px;
color:#777;
font-size:1rem;
background:#fafafa;
}
.buyer-badge{
background:#e6f7ec;
color:#1b8f4a;
font-size:12px;
padding:3px 8px;
border-radius:20px;
font-weight:600;
display:inline-block;
}

/* scroll buttons */

.scroll-btn{
position:absolute;
top:50%;
transform:translateY(-50%);
border:none;
background:#00bcd4;
color:white;
width:36px;
height:36px;
border-radius:50%;
cursor:pointer;
font-size:18px;
z-index:5;
}
.scroll-btn:hover{
    background:#00535e;
}

.scroll-btn.right{
right:-18px;
}

.scroll-btn.left{
left:-18px;
}

.star-img { width: 22px; cursor: pointer; transition: 0.2s; }
.star-rating-display { width: 16px; height: 16px; }






/* کدهای بخش محصولات مشابه در پروداکت دیتیل */

.similar-products-section {
    margin-top: 40px;
    padding: 20px;
    background: #e9f3ff;
    border-radius: 15px;
    border: 1px solid #eee;
}

.similar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.similar-products-wrapper {
    position: relative;
    overflow: hidden;
}

.similar-products-container {
    display: flex;
    gap: 20px;
    overflow-x: auto;
    scroll-behavior: smooth;
    padding: 10px 5px;
    scrollbar-width: none; /* Firefox */
}

.similar-products-container::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

.slider-controls {
    display: flex;
    gap: 10px;
}

.slider-btn {
    background: #00bcd4;
    color: white;
    border: none;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    transition: 0.3s;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.slider-btn:hover {
    background: #008c9e;
    transform: scale(1.1);
}







/* کدهای بخش ادمین مدیریت کامنت ها */

.adm-comments-wrapper{
    padding: 30px;
    background: #f4f6f9;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    align-items: stretch; /* همه کارت‌ها هم‌قد */
}

/* عنوان تمام عرض را بگیرد */
.adm-comments-title{
    grid-column: 1 / -1;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 5px;
}

/* کارت‌ها */
.adm-comments-card{
    background: #fff;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.06);

    display: flex;
    flex-direction: column;
    gap: 10px;

    min-width: 0;

    height: 420px;           /* ارتفاع ثابت */
    overflow: hidden;        /* چیزی بیرون نزند */
}

/* هدر کارت */
.adm-comments-header{
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 0;
    flex-shrink: 0;
}

.adm-comments-product{
    font-weight: 600;
    font-size: 14px;
    line-height: 1.6;
    word-break: break-word;
}

.adm-comments-status{
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.adm-comments-status-pending{
    background: #fff3cd;
    color: #856404;
}

.adm-comments-status-approved{
    background: #d4edda;
    color: #155724;
}

.adm-comments-status-rejected{
    background: #f8d7da;
    color: #721c24;
}

.adm-comments-meta{
    font-size: 12px;
    color: #777;
    display: flex;
    flex-wrap: wrap;
    gap: 10px 14px;
    line-height: 1.6;
    flex-shrink: 0;
}

/* متن کامنت */
.adm-comments-text{
    background: #eef6ff;
    padding: 12px;
    border-radius: 8px;
    border-right: 4px solid #5bca00;
    font-size: 13px;
    line-height: 1.9;
    word-break: break-word;

    max-height: 120px;
    overflow-y: auto;
}

/* پاسخ ادمین */
.adm-comments-admin-reply{
    background: #eef6ff;
    padding: 12px;
    border-radius: 8px;
    border-right: 4px solid #007bff;
    font-size: 13px;
    line-height: 1.9;
    word-break: break-word;

    max-height: 120px;
    overflow-y: auto;
}

.adm-comments-user-title{
    font-weight: 600;
    margin-bottom: 5px;
}

.adm-comments-admin-title{
    font-weight: 600;
    margin-bottom: 5px;
}

.adm-comments-status-form{
    margin-top: auto; /* فرم همیشه پایین کارت */
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
    flex-shrink: 0;
}

.adm-comments-status-select{
    padding: 7px 10px;
    border-radius: 6px;
    border: 1px solid #ddd;
    background: #fff;
    font-size: 13px;
    min-width: 140px;
}

.adm-comments-status-btn{
    background: #007bff;
    color: #fff;
    border: none;
    padding: 7px 12px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    transition: 0.25s ease;
}

.adm-comments-status-btn:hover{
    background: #0069d9;
}

.adm-comments-reply-form{
    margin-top: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.adm-comments-reply-textarea{
    width: 100%;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #ddd;
    resize: vertical;
    font-size: 13px;
    min-height: 90px;
    box-sizing: border-box;
}

.adm-comments-reply-btn{
    background: #28a745;
    color: #fff;
    border: none;
    padding: 8px 14px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    transition: 0.25s ease;
    align-self: flex-start;
}

.adm-comments-reply-btn:hover{
    background: #218838;
}

/* رسپانسیو */
@media (max-width: 992px){
    .adm-comments-wrapper{
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        padding: 20px;
    }
}

@media (max-width: 768px){
    .adm-comments-wrapper{
        grid-template-columns: 1fr;
        padding: 15px;
    }

    .adm-comments-title{
        font-size: 20px;
    }

    .adm-comments-card{
        padding: 14px;
        height: 420px;
    }

    .adm-comments-status-form{
        flex-direction: column;
        align-items: stretch;
    }

    .adm-comments-status-select,
    .adm-comments-status-btn,
    .adm-comments-reply-btn{
        width: 100%;
    }

    .adm-comments-status-btn,
    .adm-comments-reply-btn{
        text-align: center;
    }
}



/* استایل های مربوط به داشبورد ادمین قسمت امار فروش */
.adstat-page,
.adstat-page * {
    box-sizing: border-box;
}

.adstat-page {
    direction: rtl;
    max-width: 1450px;
    margin: 0 auto;
    padding: 32px 24px 40px;
    font-family: inherit;
    background:
        radial-gradient(circle at top right, rgba(0, 65, 95, 0.12), transparent 30%),
        linear-gradient(135deg, #f3f8fb 0%, #eef5f9 100%);
    min-height: 100vh;
}

.adstat-header {
    background: linear-gradient(135deg, #00415f, #006b8f);
    color: #fff;
    border-radius: 26px;
    padding: 28px 32px;
    margin-bottom: 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    box-shadow: 0 18px 40px rgba(0, 65, 95, 0.22);
    position: relative;
    overflow: hidden;
}

.adstat-header::before,
.adstat-header::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
}

.adstat-header::before {
    width: 220px;
    height: 220px;
    left: -70px;
    top: -90px;
}

.adstat-header::after {
    width: 160px;
    height: 160px;
    right: 18%;
    bottom: -90px;
}

.adstat-title,
.adstat-subtitle,
.adstat-datebox {
    position: relative;
    z-index: 1;
}

.adstat-title {
    font-size: 30px;
    font-weight: 900;
    margin: 0 0 8px;
}

.adstat-subtitle {
    font-size: 15px;
    margin: 0;
    opacity: 0.9;
}

.adstat-datebox {
    min-width: 140px;
    padding: 14px 18px;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(10px);
    text-align: center;
}

.adstat-date-label {
    display: block;
    font-size: 13px;
    opacity: 0.85;
    margin-bottom: 4px;
}

.adstat-date-value {
    font-size: 17px;
    font-weight: 800;
}

.adstat-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(190px, 1fr));
    gap: 20px;
}

.adstat-card {
    background: rgba(255, 255, 255, 0.94);
    border-radius: 24px;
    padding: 22px;
    min-height: 145px;
    display: flex;
    align-items: center;
    gap: 16px;
    box-shadow: 0 14px 35px rgba(31, 58, 78, 0.09);
    border: 1px solid rgba(255, 255, 255, 0.72);
    transition: 0.28s ease;
    position: relative;
    overflow: hidden;
}

.adstat-card::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.08;
    background: linear-gradient(135deg, currentColor, transparent 65%);
}

.adstat-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 45px rgba(31, 58, 78, 0.14);
}

.adstat-icon {
    width: 58px;
    height: 58px;
    min-width: 58px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.03);
    line-height: 1;
}

.adstat-content {
    min-width: 0;
    position: relative;
    z-index: 1;
}

.adstat-label {
    display: block;
    font-size: 14px;
    color: #6c7a86;
    font-weight: 700;
    margin-bottom: 8px;
}

.adstat-value {
    display: block;
    font-size: 27px;
    font-weight: 900;
    color: #162b3a;
    line-height: 1.15;
}

.adstat-unit {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: #7b8994;
}

.adstat-card-blue {
    color: #2563eb;
}

.adstat-card-cyan {
    color: #0891b2;
}

.adstat-card-orange {
    color: #f97316;
}

.adstat-card-green {
    color: #16a34a;
}

.adstat-card-purple {
    color: #7c3aed;
}

.adstat-card-pink {
    color: #db2777;
}

.adstat-card-teal {
    color: #0d9488;
}

.adstat-card-navy {
    color: #00415f;
}

.adstat-card-red {
    color: #dc2626;
}

@media (max-width: 1250px) {
    .adstat-grid {
        grid-template-columns: repeat(3, minmax(190px, 1fr));
    }
}

@media (max-width: 850px) {
    .adstat-page {
        padding: 20px 16px 30px;
    }

    .adstat-header {
        flex-direction: column;
        align-items: flex-start;
        padding: 24px;
        border-radius: 22px;
    }

    .adstat-title {
        font-size: 24px;
    }

    .adstat-grid {
        grid-template-columns: repeat(2, minmax(150px, 1fr));
        gap: 16px;
    }

    .adstat-card {
        min-height: 130px;
        padding: 18px;
        border-radius: 20px;
    }

    .adstat-icon {
        width: 50px;
        height: 50px;
        min-width: 50px;
        font-size: 24px;
        border-radius: 17px;
    }

    .adstat-value {
        font-size: 22px;
    }
}

@media (max-width: 520px) {
    .adstat-page {
        padding: 14px 12px 24px;
    }

    .adstat-header {
        padding: 20px;
    }

    .adstat-title {
        font-size: 21px;
    }

    .adstat-subtitle {
        font-size: 13px;
    }

    .adstat-grid {
        grid-template-columns: 1fr;
    }

    .adstat-card {
        min-height: 115px;
    }
}


/* استایل های برای هدر بخش پنل کاربری */
/* ===============================
   User Panel Header Dropdown
================================ */

.user-panel-menu {
    position: relative;
    display: flex;
    align-items: center;
    z-index: 1000;
    border-radius: 20px;
}

.user-panel-btn {
    border: 1px solid rgba(255, 255, 255, 0.28);
    outline: none;
    background: linear-gradient(135deg, #2b8eb4, #001a63);
    color: #fff;
    padding: 10px 16px;
    border-radius: 18px;
    cursor: pointer;
    font-family: inherit;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 800;
    white-space: normal;
    line-height: 1.35;
    text-align: right;
    min-width: 220px;
    max-width: 300px;
    box-shadow: 0 10px 24px rgba(0, 65, 95, 0.22);
    transition: 0.25s ease;
}

.user-panel-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(0, 99, 145, 0.28);
}

.user-panel-greeting {
    flex: 0 0 auto;
    opacity: 0.95;
}

.user-panel-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: visible;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    font-size: 13px;
    font-weight: 900;
}

.user-panel-arrow {
    flex: 0 0 auto;
    font-size: 18px;
    line-height: 1;
    transition: 0.25s ease;
    margin-right: auto;
}

.user-panel-menu:hover .user-panel-arrow {
    transform: rotate(180deg);
}

.user-panel-dropdown {
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    width: 255px;
    background: #ffffff;
    border-radius: 20px;
    padding: 12px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.16);

    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: 0.25s ease;
    z-index: 9999;
}

.user-panel-menu:hover .user-panel-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.user-panel-dropdown::before {
    content: "";
    position: absolute;
    top: -7px;
    left: 28px;
    width: 14px;
    height: 14px;
    background: #ffffff;
    transform: rotate(45deg);

}

.user-panel-dropdown a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    color: #23313d;
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    border-radius: 13px;
    transition: 0.22s ease;
}

.user-panel-dropdown a:hover {
    background: rgba(26, 160, 199, 0.12);
    color: #0b5f7f;
    transform: translateX(-3px);
}

.user-panel-dropdown a span {
    font-size: 15px;
    width: 20px;
    text-align: center;
}

.user-panel-logout {
    color: #dc2626 !important;
    margin-top: 8px;
    border-top: 1px solid #edf1f4;
    padding-top: 13px !important;
}

.user-panel-logout:hover {
    background: rgba(220, 38, 38, 0.08) !important;
    color: #b91c1c !important;
}


/* استایل مربوط به قسمت علاقه مندی ها */

/* ردیف عنوان محصول */
.product-title-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
}

/* باکس قلب */
.wishlist-box{
    position:relative;
    display:flex;
    align-items:center;
}

/* آیکون قلب */
.wishlist-icon{
    width:22px;
    height:22px;
    cursor:pointer;
    transition:0.25s;
}

.wishlist-icon:hover{
    transform:scale(1.15);
}

/* تولتیپ */
.wishlist-tooltip{
    position:absolute;
    bottom:130%;
    left:250%;
    transform:translateX(-50%);
    background:#222;
    color:#fff;
    font-size:12px;
    padding:4px 8px;
    border-radius:6px;
    white-space:nowrap;
    opacity:0;
    pointer-events:none;
    transition:0.25s;
}

/* نمایش تولتیپ */
.wishlist-box:hover .wishlist-tooltip{
    opacity:1;
}



/* کدهای بخش علاقه مندی ها */
/* =========================
DY WISHLIST PAGE
========================= */

.dywish-page{
padding:40px 20px;
background:#f6f8fb;
min-height:70vh;
}

.dywish-title{
text-align:center;
font-size:28px;
margin-bottom:35px;
color:#1f3a5f;
font-weight:bold;
}


/* grid */

.dywish-grid{

gap:25px;
margin:auto;
display:grid;
grid-template-columns:repeat(auto-fill,minmax(240px,280px));
max-width:1200px;
justify-content:center;
}


/* card */

.dywish-card{
background:#fff;
border-radius:14px;
box-shadow:0 8px 20px rgba(0,0,0,0.07);
overflow:hidden;
transition:0.35s;
display:flex;
flex-direction:column;
}

.dywish-card:hover{
transform:translateY(-6px);
box-shadow:0 14px 35px rgba(0,0,0,0.12);
}


/* image */

.dywish-image{
background:#f3f5f8;
text-align:center;
padding:18px;
position:relative;
}

.dywish-image img{
max-width:100%;
height:170px;
object-fit:contain;
}


/* discount */

.dywish-discount{
position:absolute;
top:10px;
left:10px;
background:#e63946;
color:#fff;
padding:4px 8px;
font-size:13px;
border-radius:6px;
}


/* info */

.dywish-info{
padding:16px;
flex:1;
display:flex;
flex-direction:column;
}


/* title row */

.dywish-title-row{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:6px;
}

.dywish-product-title{
font-size:16px;
margin:0;
color:#222;
}


/* heart */

.dywish-heart-box{
position:relative;
}

.dywish-heart{
width:22px;
cursor:pointer;
transition:0.2s;
}

.dywish-heart:hover{
transform:scale(1.2);
}


/* tooltip */

.dywish-tooltip{
position:absolute;
bottom:130%;
left:210%;
transform:translateX(-50%);
background:#222;
color:#fff;
font-size:12px;
padding:4px 8px;
border-radius:6px;
white-space:nowrap;
opacity:0;
transition:0.2s;
pointer-events:none;
z-index:5;
}

.dywish-heart-box:hover .dywish-tooltip{
opacity:1;
}


/* stock */

.dywish-stock{
font-size:13px;
margin-top:4px;
}

.dywish-available{
color:green;
}

.dywish-unavailable{
color:red;
}


/* price */

.dywish-price-box{
margin-top:10px;
}

.dywish-old-price{
text-decoration:line-through;
color:#999;
font-size:13px;
margin-left:6px;
}

.dywish-new-price{
font-weight:bold;
color:#e63946;
font-size:16px;
}


/* buttons */

.dywish-buttons{
margin-top:auto;
display:flex;
gap:8px;
margin-top:14px;
}

.dywish-addcart{
flex:1;
background:#1f3a5f;
color:#fff;
border:none;
padding:8px;
border-radius:6px;
cursor:pointer;
transition:0.25s;
}

.dywish-addcart:hover{
background:#294d7a;
}

.dywish-disabled{
background:#ccc;
cursor:not-allowed;
}

.dywish-view{
flex:1;
text-align:center;
background:#eee;
padding:8px;
border-radius:6px;
text-decoration:none;
color:#333;
transition:0.25s;
}

.dywish-view:hover{
background:#ddd;
}


/* empty */

.dywish-empty{
text-align:center;
padding:70px 20px;
grid-column:1/-1;
}

.dywish-empty h3{
font-size:22px;
margin-bottom:15px;
color:#555;
}

.dywish-empty a{
display:inline-block;
padding:10px 20px;
background:#1f3a5f;
color:#fff;
border-radius:8px;
text-decoration:none;
}


/* =========================
Responsive
========================= */

@media (max-width:900px){

.dywish-grid{
grid-template-columns:repeat(2,1fr);
}

}

@media (max-width:600px){

.dywish-grid{
grid-template-columns:1fr;
}

.dywish-title{
font-size:22px;
}

.dywish-image img{
height:150px;
}

}



/* علاقه مندی ها در ایندکس */
.dyfav-title-row{
display:flex;
align-items:center;
justify-content:space-between;
gap:8px;
}

.dyfav-box{
position:relative;
cursor:pointer;
}

.dyfav-heart{
width:22px;
height:22px;
transition:0.2s;
}

.dyfav-heart:hover{
transform:scale(1.15);
}

/* tooltip */

.dyfav-tooltip{
position:absolute;
bottom:130%;
left:210%;
transform:translateX(-50%);
background:#222;
color:#fff;
font-size:12px;
padding:4px 8px;
border-radius:6px;
white-space:nowrap;
opacity:0;
transition:0.2s;
pointer-events:none;
z-index:5;
}

.dyfav-box:hover .dyfav-tooltip{
opacity:1;
}
/* قلب علاقه‌مندی کنار عنوان محصول */

.dyfav-title-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    width:100%;
    direction:rtl;
}

.dyfav-product-title{
    margin:0;
    flex:1;
    text-align:right;
    line-height:1.7;
}

.dyfav-box{
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    z-index:10;
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.dyfav-heart{
    width:23px;
    height:23px;
    object-fit:contain;
    cursor:pointer;
    transition:0.2s ease;
    display:block;
}

.dyfav-heart:hover{
    transform:scale(1.15);
}

.dyfav-tooltip{
    position:absolute;
    bottom:-32px;
    left:50%;
    transform:translateX(-50%);
    background:#222;
    color:#fff;
    font-size:12px;
    padding:5px 9px;
    border-radius:7px;
    white-space:nowrap;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:0.2s ease;
    z-index:999;
}

.dyfav-tooltip::after{
    content:"";
    position:absolute;
    top:-5px;
    left:50%;
    transform:translateX(-50%);
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-bottom:5px solid #222;
}

.dyfav-box:hover .dyfav-tooltip{
    opacity:1;
    visibility:visible;
}
.detail-cart-row{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
}

.detail-wishlist-box{
    position:relative;
    width:46px;
    height:46px;
    min-width:46px;
    border-radius:14px;
    background:#fff;
    border:1px solid #e5e5e5;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    box-shadow:0 4px 12px rgba(0,0,0,0.08);
    transition:0.2s ease;
}

.detail-wishlist-box:hover{
    transform:translateY(-2px);
    box-shadow:0 6px 18px rgba(0,0,0,0.12);
}

.detail-wishlist-icon{
    width:25px;
    height:25px;
    object-fit:contain;
    cursor:pointer;
    transition:0.2s ease;
}

.detail-wishlist-icon:hover{
    transform:scale(1.15);
}

.detail-wishlist-tooltip{
    position:absolute;
    bottom:-38px;
    left:50%;
    transform:translateX(-50%);
    background:#222;
    color:#fff;
    font-size:12px;
    padding:6px 10px;
    border-radius:8px;
    white-space:nowrap;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:0.2s ease;
    z-index:9999;
}

.detail-wishlist-tooltip::after{
    content:"";
    position:absolute;
    top:-5px;
    left:50%;
    transform:translateX(-50%);
    border-left:5px solid transparent;
    border-right:5px solid transparent;
    border-bottom:5px solid #222;
}

.detail-wishlist-box:hover .detail-wishlist-tooltip{
    opacity:1;
    visibility:visible;
}
@media(max-width:600px){

.detail-cart-row{
flex-wrap:wrap;
}

.detail-add-cart-btn{
width:100%;
}

.detail-wishlist-box{
width:46px;
height:46px;
}

}

/* 
استایل های مربوط به سفارشات من در پنل کاربری */
.dyorders-page{
    width:100%;
    max-width:1180px;
    margin:0 auto;
    padding:35px 18px 60px;
    direction:rtl;
    font-family:inherit;
}

.dyorders-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-bottom:28px;
}

.dyorders-title{
    font-size:28px;
    font-weight:800;
    color:#202020;
    margin:0 0 8px;
}

.dyorders-subtitle{
    font-size:14px;
    color:#777;
    margin:0;
    line-height:1.9;
}

.dyorders-list{
    display:flex;
    flex-direction:column;
    gap:22px;
}

.dyorders-card{
    background:#fff;
    border:1px solid #eeeeee;
    border-radius:22px;
    padding:22px;
    box-shadow:0 8px 28px rgba(0,0,0,0.06);
    transition:0.25s ease;
}

.dyorders-card:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 34px rgba(0,0,0,0.09);
}

.dyorders-card-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
    padding-bottom:18px;
    border-bottom:1px solid #f0f0f0;
}

.dyorders-code-box{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.dyorders-code-label{
    font-size:12px;
    color:#888;
}

.dyorders-code-value{
    font-size:20px;
    font-weight:800;
    color:#222;
}

.dyorders-statuses{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}

.dyorders-status,
.dyorders-pay-status{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:7px 12px;
    border-radius:999px;
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
}

/* وضعیت سفارش */
.dyorders-status-pending{
    background:#fff7df;
    color:#a86f00;
}

.dyorders-status-processing{
    background:#e8f1ff;
    color:#2268c9;
}

.dyorders-status-shipped{
    background:#eee9ff;
    color:#6545c5;
}

.dyorders-status-delivered{
    background:#e7f8ef;
    color:#16834c;
}

.dyorders-status-cancelled{
    background:#ffeaea;
    color:#c33131;
}

.dyorders-status-unknown{
    background:#f1f1f1;
    color:#666;
}

/* وضعیت پرداخت */
.dyorders-pay-paid{
    background:#e8fff3;
    color:#119454;
}

.dyorders-pay-unpaid{
    background:#fff3e4;
    color:#b86600;
}

.dyorders-pay-failed{
    background:#ffe9e9;
    color:#c62828;
}

.dyorders-pay-refunded{
    background:#eef2ff;
    color:#4655c7;
}

.dyorders-pay-unknown{
    background:#f3f3f3;
    color:#777;
}

.dyorders-info-grid{
    display:grid;
    grid-template-columns:repeat(5, 1fr);
    gap:12px;
    margin-top:18px;
}

.dyorders-info-item{
    background:#fafafa;
    border:1px solid #f0f0f0;
    border-radius:16px;
    padding:13px;
    min-height:72px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:6px;
}

.dyorders-info-label{
    font-size:12px;
    color:#8a8a8a;
}

.dyorders-info-value{
    font-size:14px;
    font-weight:700;
    color:#2b2b2b;
    line-height:1.8;
}

.dyorders-price-value{
    color:#1f8d55;
}

.dyorders-address-box{
    margin-top:14px;
    background:#fcfcfc;
    border:1px solid #f0f0f0;
    border-radius:16px;
    padding:14px 16px;
}

.dyorders-address-label{
    display:block;
    font-size:12px;
    color:#888;
    margin-bottom:7px;
}

.dyorders-address-text{
    margin:0;
    font-size:14px;
    color:#333;
    line-height:2;
}

.dyorders-products-box{
    margin-top:20px;
}

.dyorders-products-title-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:12px;
}

.dyorders-products-title{
    margin:0;
    font-size:17px;
    font-weight:800;
    color:#222;
}

.dyorders-products-list{
    display:flex;
    flex-direction:column;
    gap:12px;
}

.dyorders-product-item{
    display:flex;
    align-items:center;
    gap:14px;
    background:#fff;
    border:1px solid #f0f0f0;
    border-radius:18px;
    padding:12px;
}

.dyorders-product-image-wrap{
    width:82px;
    height:82px;
    min-width:82px;
    border-radius:16px;
    overflow:hidden;
    background:#f8f8f8;
    display:flex;
    align-items:center;
    justify-content:center;
}

.dyorders-product-image{
    width:100%;
    height:100%;
    object-fit:cover;
}

.dyorders-product-content{
    flex:1;
    min-width:0;
}

.dyorders-product-title{
    margin:0 0 10px;
    font-size:15px;
    font-weight:800;
    color:#262626;
    line-height:1.8;
}

.dyorders-product-meta{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
}

.dyorders-product-meta-item{
    background:#f8f8f8;
    color:#666;
    border-radius:999px;
    padding:6px 10px;
    font-size:12px;
}

.dyorders-product-meta-item strong{
    color:#222;
}

.dyorders-no-items{
    background:#fff8e7;
    border:1px solid #ffe0a5;
    color:#9b6900;
    border-radius:14px;
    padding:14px;
    font-size:14px;
}

.dyorders-empty{
    max-width:520px;
    margin:60px auto;
    text-align:center;
    background:#fff;
    border:1px solid #eee;
    border-radius:24px;
    padding:42px 24px;
    box-shadow:0 8px 30px rgba(0,0,0,0.06);
}

.dyorders-empty-icon{
    width:78px;
    height:78px;
    border-radius:24px;
    background:#f7f7f7;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:36px;
    margin:0 auto 18px;
}

.dyorders-empty-title{
    margin:0 0 10px;
    font-size:22px;
    color:#222;
    font-weight:800;
}

.dyorders-empty-text{
    margin:0 auto 22px;
    font-size:14px;
    color:#777;
    line-height:2;
}

.dyorders-empty-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:150px;
    height:44px;
    background:#222;
    color:#fff;
    border-radius:14px;
    text-decoration:none;
    font-size:14px;
    font-weight:700;
    transition:0.25s ease;
}

.dyorders-empty-btn:hover{
    background:#000;
    transform:translateY(-2px);
}
@media(max-width:992px){
    .dyorders-info-grid{
        grid-template-columns:repeat(3, 1fr);
    }
}

@media(max-width:768px){
    .dyorders-page{
        padding:25px 14px 50px;
    }

    .dyorders-title{
        font-size:24px;
    }

    .dyorders-card{
        padding:18px;
        border-radius:20px;
    }

    .dyorders-card-top{
        align-items:flex-start;
        flex-direction:column;
    }

    .dyorders-info-grid{
        grid-template-columns:repeat(2, 1fr);
    }

    .dyorders-product-item{
        align-items:flex-start;
    }

    .dyorders-product-meta{
        gap:6px;
    }
}

@media(max-width:520px){
    .dyorders-info-grid{
        grid-template-columns:1fr;
    }

    .dyorders-product-item{
        flex-direction:column;
    }

    .dyorders-product-image-wrap{
        width:100%;
        height:190px;
        min-width:100%;
    }

    .dyorders-product-title{
        font-size:14px;
    }

    .dyorders-product-meta{
        flex-direction:column;
        align-items:flex-start;
    }

    .dyorders-product-meta-item{
        width:100%;
        border-radius:12px;
    }

    .dyorders-statuses{
        width:100%;
    }

    .dyorders-status,
    .dyorders-pay-status{
        flex:1;
    }
}
/* ===============================
   DyOrders Responsive Improvements
   فقط انتهای فایل CSS اضافه شود
================================ */


/* لپ‌تاپ‌های کوچک */
@media(max-width:1200px){
    .dyorders-page{
        max-width:1000px;
        padding-left:16px;
        padding-right:16px;
    }

    .dyorders-info-grid{
        grid-template-columns:repeat(4, 1fr);
    }
}


/* تبلت افقی و نمایشگرهای متوسط */
@media(max-width:992px){
    .dyorders-page{
        max-width:860px;
        padding-top:30px;
    }

    .dyorders-header{
        align-items:flex-start;
        flex-direction:column;
        gap:10px;
    }

    .dyorders-title{
        font-size:26px;
    }

    .dyorders-subtitle{
        font-size:13px;
    }

    .dyorders-card{
        padding:20px;
    }

    .dyorders-card-top{
        gap:12px;
    }

    .dyorders-info-grid{
        grid-template-columns:repeat(3, 1fr);
    }

    .dyorders-product-image-wrap{
        width:76px;
        height:76px;
        min-width:76px;
    }
}


/* تبلت عمودی و موبایل‌های بزرگ */
@media(max-width:768px){
    .dyorders-page{
        padding:24px 14px 50px;
    }

    .dyorders-header{
        margin-bottom:22px;
    }

    .dyorders-title{
        font-size:24px;
        line-height:1.6;
    }

    .dyorders-subtitle{
        line-height:1.9;
    }

    .dyorders-list{
        gap:18px;
    }

    .dyorders-card{
        padding:18px;
        border-radius:20px;
    }

    .dyorders-card:hover{
        transform:none;
    }

    .dyorders-card-top{
        flex-direction:column;
        align-items:flex-start;
        padding-bottom:15px;
    }

    .dyorders-code-value{
        font-size:18px;
        word-break:break-word;
    }

    .dyorders-statuses{
        width:100%;
        justify-content:flex-start;
    }

    .dyorders-status,
    .dyorders-pay-status{
        font-size:11px;
        padding:7px 10px;
    }

    .dyorders-info-grid{
        grid-template-columns:repeat(2, 1fr);
        gap:10px;
    }

    .dyorders-info-item{
        padding:12px;
        min-height:68px;
    }

    .dyorders-info-value{
        font-size:13px;
    }

    .dyorders-address-box{
        padding:13px 14px;
    }

    .dyorders-address-text{
        font-size:13px;
        line-height:2;
    }

    .dyorders-products-title{
        font-size:16px;
    }

    .dyorders-product-item{
        align-items:flex-start;
        gap:12px;
        padding:11px;
        border-radius:16px;
    }

    .dyorders-product-title{
        font-size:14px;
        margin-bottom:8px;
    }

    .dyorders-product-meta{
        gap:6px;
    }

    .dyorders-product-meta-item{
        font-size:11px;
        padding:6px 9px;
    }
}


/* موبایل معمولی */
@media(max-width:576px){
    .dyorders-page{
        padding:20px 12px 44px;
    }

    .dyorders-title{
        font-size:22px;
        margin-bottom:6px;
    }

    .dyorders-subtitle{
        font-size:12px;
    }

    .dyorders-card{
        padding:15px;
        border-radius:18px;
        box-shadow:0 6px 20px rgba(0,0,0,0.055);
    }

    .dyorders-card-top{
        gap:14px;
    }

    .dyorders-code-label{
        font-size:11px;
    }

    .dyorders-code-value{
        font-size:16px;
        line-height:1.8;
    }

    .dyorders-statuses{
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:8px;
    }

    .dyorders-status,
    .dyorders-pay-status{
        width:100%;
        min-height:34px;
        padding:7px 8px;
        font-size:11px;
        text-align:center;
    }

    .dyorders-info-grid{
        grid-template-columns:1fr;
        margin-top:15px;
    }

    .dyorders-info-item{
        min-height:auto;
        padding:12px 13px;
        border-radius:14px;
    }

    .dyorders-info-label{
        font-size:11px;
    }

    .dyorders-info-value{
        font-size:13px;
        line-height:1.9;
        word-break:break-word;
    }

    .dyorders-address-box{
        margin-top:12px;
        border-radius:14px;
    }

    .dyorders-products-box{
        margin-top:17px;
    }

    .dyorders-products-title-row{
        align-items:flex-start;
        flex-direction:column;
        gap:8px;
    }

    .dyorders-product-item{
        flex-direction:column;
        align-items:stretch;
    }

.dyorders-product-image-wrap{
    width:70px;
    height:70px;
    min-width:70px;
    aspect-ratio:1/1;
    border-radius:14px;
    overflow:hidden;
    background:#f8f8f8;
    display:flex;
    align-items:center;
    justify-content:center;
}


.dyorders-product-image{
    width:100%;
    height:100%;
    object-fit:cover;
}


    .dyorders-product-content{
        width:100%;
    }

    .dyorders-product-title{
        font-size:14px;
        line-height:1.9;
    }

    .dyorders-product-meta{
        display:grid;
        grid-template-columns:1fr;
        width:100%;
    }

    .dyorders-product-meta-item{
        width:100%;
        border-radius:12px;
        font-size:12px;
        box-sizing:border-box;
    }

    .dyorders-empty{
        margin:40px auto;
        padding:34px 18px;
        border-radius:20px;
    }

    .dyorders-empty-icon{
        width:68px;
        height:68px;
        font-size:31px;
        border-radius:20px;
    }

    .dyorders-empty-title{
        font-size:20px;
    }

    .dyorders-empty-text{
        font-size:13px;
    }

    .dyorders-product-item{
        flex-direction:row;
        align-items:center;
        gap:10px;
        padding:10px;
    }

    .dyorders-product-image-wrap{
        width:60px;
        height:60px;
        min-width:60px;
        border-radius:12px;
    }

    .dyorders-product-title{
        font-size:13px;
        margin-bottom:6px;
    }

    .dyorders-product-meta{
        gap:5px;
        flex-wrap:wrap;
    }

    .dyorders-product-meta-item{
        font-size:11px;
        padding:5px 8px;
    }



}


/* موبایل‌های خیلی کوچک */
@media(max-width:400px){
    .dyorders-page{
        padding-left:10px;
        padding-right:10px;
    }

    .dyorders-title{
        font-size:20px;
    }

    .dyorders-card{
        padding:13px;
        border-radius:16px;
    }

    .dyorders-statuses{
        grid-template-columns:1fr;
    }

    .dyorders-status,
    .dyorders-pay-status{
        justify-content:center;
        flex:none;
    }

    .dyorders-product-image-wrap{
        height:155px;
    }
.dyorders-product-image-wrap{
    width:70px;
    height:70px;
    min-width:70px;
    aspect-ratio:1/1;
    border-radius:14px;
    overflow:hidden;
    background:#f8f8f8;
    display:flex;
    align-items:center;
    justify-content:center;
}


.dyorders-product-image{
    width:100%;
    height:100%;
    object-fit:cover;
}
    .dyorders-product-title{
        font-size:13px;
    }

    .dyorders-product-meta-item{
        font-size:11px;
        padding:7px 9px;
    }

    .dyorders-empty{
        padding:30px 15px;
    }

    .dyorders-empty-btn{
        width:100%;
    }
}



/* استایل بخش ترک اوردر پنل کاربری */
.dytrack-page{
max-width:700px;
margin:60px auto;
padding:20px;
}

.dytrack-title{
text-align:center;
font-size:26px;
margin-bottom:25px;
}

.dytrack-form{
display:flex;
gap:10px;
margin-bottom:30px;
}

.dytrack-input{
flex:1;
height:45px;
border:1px solid #ddd;
border-radius:10px;
padding:0 15px;
font-size:14px;
}

.dytrack-btn{
height:45px;
padding:0 20px;
border:none;
background:#222;
color:white;
border-radius:10px;
cursor:pointer;
}

.dytrack-error{
background:#ffe5e5;
color:#b40000;
padding:15px;
border-radius:10px;
margin-top:20px;
text-align:center;
}

.dytrack-result{
background:white;
border-radius:15px;
padding:20px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.dytrack-status-box{
font-size:18px;
margin-bottom:20px;
}

.dytrack-status-value{
color:#1a8f3a;
font-weight:bold;
}

.dytrack-info{
display:grid;
grid-template-columns:1fr 1fr;
gap:10px;
margin-bottom:20px;
}

.dytrack-address{
margin-bottom:20px;
}

.dytrack-products{
border-top:1px solid #eee;
padding-top:15px;
}

.dytrack-product{
display:flex;
gap:10px;
margin-bottom:15px;
}

.dytrack-product-img{
width:70px;
height:70px;
object-fit:cover;
border-radius:8px;
}

.dytrack-product-meta{
display:flex;
gap:10px;
font-size:13px;
color:#666;
}



/* استایلهای بخش کامنت های کاربر در پنل کاربری */
/* container */

.dycomments-container{
max-width:900px;
margin:40px auto;
padding:20px;
}

/* title */

.dycomments-title{
font-size:24px;
font-weight:700;
margin-bottom:25px;
color:#222;
position:relative;
}

.dycomments-title:after{
content:"";
width:60px;
height:3px;
background:#ff6a00;
position:absolute;
bottom:-8px;
right:0;
border-radius:3px;
}

/* card */

.dycomments-card{
background:#fff;
border-radius:18px;
padding:18px;
margin-bottom:20px;
border:1px solid #f0f0f0;
transition:all .25s ease;
position:relative;
overflow:hidden;
}

.dycomments-card:hover{
transform:translateY(-3px);
box-shadow:0 10px 25px rgba(0,0,0,0.06);
}

/* product section */

.dycomments-product{
display:flex;
align-items:center;
gap:12px;
margin-bottom:10px;
}

.dycomments-product-img{
width:70px;
height:70px;
min-width:70px;
object-fit:cover;
border-radius:14px;
background:#f5f5f5;
}

/* product info */

.dycomments-product-info{
display:flex;
flex-direction:column;
gap:3px;
}

.dycomments-product-title{
font-size:14px;
font-weight:600;
color:#222;
text-decoration:none;
transition:.2s;
}

.dycomments-product-title:hover{
color:#ff6a00;
}

.dycomments-date{
font-size:12px;
color:#888;
}

/* comment text */

.dycomments-text{
font-size:14px;
line-height:1.9;
color:#444;
margin-top:10px;
padding:12px;
background:#fafafa;
border-radius:12px;
}

/* status */

.dycomments-status{
margin-top:10px;
}

.dycomments-approved{
background:#e8f7ee;
color:#1e8e3e;
font-size:12px;
padding:5px 12px;
border-radius:30px;
}

.dycomments-pending{
background:#fff4d6;
color:#b78103;
font-size:12px;
padding:5px 12px;
border-radius:30px;
}

/* admin reply */

.dycomments-reply{
margin-top:14px;
padding:14px;
background:#f8fbff;
border-radius:14px;
border-right:4px solid #4CAF50;
}

.dycomments-reply-label{
font-size:12px;
font-weight:700;
margin-bottom:6px;
color:#333;
}

.dycomments-reply-text{
font-size:13px;
line-height:1.8;
color:#555;
}

/* empty */

.dycomments-empty{
text-align:center;
padding:50px;
background:#fafafa;
border-radius:16px;
color:#777;
font-size:14px;
}

/* tablet */

@media(max-width:768px){

.dycomments-container{
padding:15px;
}

.dycomments-product-img{
width:60px;
height:60px;
min-width:60px;
}

}

/* mobile */

@media(max-width:520px){

.dycomments-card{
padding:14px;
}

.dycomments-product{
gap:10px;
}

.dycomments-product-img{
width:55px;
height:55px;
min-width:55px;
}

.dycomments-product-title{
font-size:13px;
}

.dycomments-text{
font-size:13px;
padding:10px;
}

.dycomments-reply{
padding:10px;
}

}


/* استایل های بخش پنل کاربری قسمت یوزر */
.dyuserdash-container{
max-width:1100px;
margin:40px auto;
padding:20px;
}

.dyuserdash-title{
font-size:24px;
font-weight:700;
margin-bottom:25px;
}

/* grid */

.dyuserdash-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:18px;
margin-bottom:30px;
}

/* card */

.dyuserdash-card{
background:#fff;
border-radius:16px;
padding:25px;
text-align:center;
text-decoration:none;
color:#333;
border:1px solid #eee;
transition:.25s;
}

.dyuserdash-card:hover{
transform:translateY(-4px);
box-shadow:0 10px 25px rgba(0,0,0,0.06);
}

.dyuserdash-icon{
font-size:30px;
margin-bottom:10px;
}

.dyuserdash-number{
font-size:22px;
font-weight:700;
margin-bottom:5px;
}

.dyuserdash-label{
font-size:14px;
color:#666;
}

/* last order */

.dyuserdash-lastorder{
background:#fff;
border-radius:16px;
padding:20px;
border:1px solid #eee;
}

.dyuserdash-lastorder-title{
font-weight:700;
margin-bottom:15px;
}

.dyuserdash-lastorder-box{
display:flex;
gap:30px;
flex-wrap:wrap;
font-size:14px;
}

.dyuserdash-meta{
color:#777;
margin-left:5px;
}

/* tablet */

@media(max-width:900px){

.dyuserdash-grid{
grid-template-columns:repeat(2,1fr);
}

}

/* mobile */

@media(max-width:520px){

.dyuserdash-grid{
grid-template-columns:1fr;
}

.dyuserdash-card{
padding:18px;
}

}



/* استایل های بخش اطلاعات حساب یوزر */
.dyaccount-container{
max-width:650px;
margin:40px auto;
padding:25px;
background:#fff;
border-radius:18px;
border:1px solid #eee;
}

.dyaccount-title{
font-size:22px;
font-weight:700;
margin-bottom:25px;
}

.dyaccount-form{
display:flex;
flex-direction:column;
gap:18px;
}

.dyaccount-field{
display:flex;
flex-direction:column;
gap:6px;
}

.dyaccount-field label{
font-size:13px;
color:#555;
}

.dyaccount-field input{
height:42px;
border-radius:10px;
border:1px solid #ddd;
padding:0 12px;
font-size:14px;
transition:.2s;
}

.dyaccount-field input:focus{
border-color:#ff6a00;
outline:none;
}

.dyaccount-note{
font-size:12px;
color:#888;
}

.dyaccount-btn{
height:45px;
background:#ff6a00;
border:none;
border-radius:12px;
color:#fff;
font-size:14px;
cursor:pointer;
transition:.2s;
}

.dyaccount-btn:hover{
background:#e85f00;
}

.dyaccount-success{
background:#e8f7ee;
color:#1e8e3e;
padding:12px;
border-radius:10px;
margin-bottom:15px;
font-size:13px;
}

@media(max-width:520px){

.dyaccount-container{
margin:20px;
padding:18px;
}

.dyaccount-title{
font-size:20px;
}

}





/* استایل های هدر */
/* =====================================================
   DANESHYAR HEADER - BLUE GLASS PROFESSIONAL
   بدون root - مستقیم و تمیز
===================================================== */

/* -------------------- HEADER -------------------- */

.main-header{
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 9999;
    background: rgba(13, 60, 115, 0.82);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border-bottom: 1px solid rgba(140, 190, 255, 0.22);
    box-shadow: 0 12px 35px rgba(0, 28, 70, 0.32);
}

.header-container{
    max-width: 1340px;
    margin: 0 auto;
    padding: 10px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    position: relative;
}

/* -------------------- LOGO -------------------- */

.logo{
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.logo a{
    display: flex;
    align-items: center;
    text-decoration: none;
}

.logo img{
    height: 52px;
    width: auto;
    display: block;
}

/* -------------------- NAV MENU -------------------- */

.nav-menu{
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.nav-menu ul{
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-menu > ul{
    display: flex;
    align-items: center;
    gap: 5px;
}

.nav-menu li{
    position: relative;
}

.nav-menu a{
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 40px;
    padding: 9px 13px;
    border-radius: 13px;
    color: #eef7ff;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
    background: transparent;
    transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
}

.nav-menu a:hover{
    background: rgba(120, 185, 255, 0.28);
    color: #ffffff;
}

/* -------------------- ADMIN LINK -------------------- */

.admin-link a{
    color: #fff1ba;
    background: #000286;
}

.admin-link a:hover{
    background:#0069d9;
    color: #ffffff;
}

/* =====================================================
   DESKTOP DROPDOWN
   مهم: بدون فاصله‌ای که هاور بپره
===================================================== */

.dropdown{
    position: relative;
}

/* خود دراپ‌داون دقیقاً از زیر آیتم شروع می‌شود */
.dropdown-menu{
    position: absolute;
    top: 100%;
    right: 0;
    min-width: 230px;
    padding: 10px;
    margin: 0;
    display: none;
    flex-direction: column;
    gap: 6px;
    background: rgba(16, 72, 135, 0.96);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(160, 205, 255, 0.24);
    border-radius: 0 0 20px 20px;
    box-shadow: 0 20px 45px rgba(0, 35, 85, 0.34);
    z-index: 10000;
}

/* این باعث میشه وقتی از آیتم به منو میری هاور نپره */
.dropdown::after{
    content: "";
    position: absolute;
    right: 0;
    top: 100%;
    width: 100%;
    height: 12px;
    background: transparent;
}

/* نمایش در دسکتاپ */
.dropdown:hover > .dropdown-menu,
.dropdown:focus-within > .dropdown-menu{
    display: flex;
}

.dropdown-menu li{
    width: 100%;
}

.dropdown-menu a{
    width: 100%;
    min-height: 40px;
    justify-content: flex-start;
    padding: 10px 12px;
    border-radius: 13px;
    color: #eef7ff;
    background: rgba(255, 255, 255, 0.055);
    font-size: 13.5px;
    font-weight: 600;
}

.dropdown-menu a:hover{
    background: rgba(135, 195, 255, 0.30);
    color: #ffffff;
    transform: translateX(-2px);
}

/* =====================================================
   DESKTOP SUB MENU
   بدون فاصله بین منو و زیرمنو
===================================================== */

.stuord-nav-item{
    position: relative;
}

.submenu-sign{
    margin-right: auto;
    margin-left: 0;
    font-size: 18px;
    opacity: 0.8;
    transform: rotate(180deg);
}

/* زیرمنو چسبیده به منوی مادر، نه با فاصله */
.stuord-sub-menu{
    position: absolute;
    top: 0;
    right: 100%;
    min-width: 205px;
    padding: 10px;
    margin: 0;
    display: none;
    flex-direction: column;
    gap: 6px;
    background: rgba(18, 82, 150, 0.97);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(160, 205, 255, 0.24);
    border-radius: 18px;
    box-shadow: 0 20px 45px rgba(0, 35, 85, 0.34);
    z-index: 10001;
}

/* پل نامرئی بین آیتم و زیرمنو، برای اینکه هاور نپره */
.stuord-nav-item.has-submenu::after{
    content: "";
    position: absolute;
    top: 0;
    right: 100%;
    width: 12px;
    height: 100%;
    background: transparent;
}

.has-submenu:hover > .stuord-sub-menu,
.has-submenu:focus-within > .stuord-sub-menu{
    display: flex;
}

.stuord-sub-menu li{
    width: 100%;
}

.stuord-sub-menu a{
    width: 100%;
    min-height: 38px;
    padding: 9px 12px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.06);
    color: #eef7ff;
    font-size: 13px;
}

.stuord-sub-menu a:hover{
    background: rgba(145, 205, 255, 0.30);
    color: #ffffff;
    transform: translateX(-2px);
}

/* -------------------- SEARCH -------------------- */

.search-box{
    height: 42px;
    min-width: 240px;
    max-width: 340px;
    flex: 1;
    display: flex;
    align-items: center;
    overflow: hidden;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(180, 220, 255, 0.22);
    transition: all 0.2s ease;
}

.search-box:focus-within{
    background: rgba(255, 255, 255, 0.20);
    border-color: rgba(205, 232, 255, 0.42);
    box-shadow: 0 0 0 4px rgba(130, 190, 255, 0.15);
}

.search-box input{
    width: 100%;
    height: 100%;
    padding: 0 14px;
    border: none;
    outline: none;
    background: transparent;
    color: #ffffff;
    font-size: 13.5px;
    font-family: inherit;
}

.search-box input::placeholder{
    color: rgba(235, 247, 255, 0.76);
}

.search-box button{
    height: 100%;
    padding: 0 16px;
    border: none;
    outline: none;
    cursor: pointer;
    background: rgba(75, 155, 245, 0.95);
    color: #ffffff;
    font-size: 13px;
    font-weight: 700;
    font-family: inherit;
    transition: all 0.2s ease;
}

.search-box button:hover{
    background: rgba(105, 180, 255, 1);
}

/* -------------------- HEADER ICONS -------------------- */

.header-icons{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* -------------------- THEME BUTTON -------------------- */

.theme-toggle-btn{
    width: 42px;
    height: 42px;
    border-radius: 15px;
    border: 1px solid rgba(180, 220, 255, 0.22);
    background: rgba(255, 255, 255, 0.13);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.theme-toggle-btn:hover{
    background: rgba(135, 195, 255, 0.28);
    transform: translateY(-1px);
}

#themeToggleIcon{
    font-size: 18px;
    line-height: 1;
}

/* اگر نمی‌خوای تم دیده بشه، این خط رو فعال کن */
/*
.theme-toggle-btn{
    display: none;
}
*/

/* -------------------- ACTION ICONS -------------------- */

.header-action-icon{
    width: 42px;
    height: 42px;
    position: relative;
    border-radius: 15px;
    border: 1px solid rgba(180, 220, 255, 0.22);
    background: rgba(255, 255, 255, 0.13);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.2s ease;
}

.header-action-icon:hover{
    background: rgba(135, 195, 255, 0.28);
    transform: translateY(-1px);
}

.header-emoji-icon{
    font-size: 19px;
    line-height: 1;
}

.wishlist-action:hover{
    background: rgba(255, 115, 150, 0.30);
}

.cart-action:hover{
    background: rgba(110, 190, 255, 0.30);
}

.login-action:hover{
    background: rgba(120, 220, 185, 0.30);
}

/* -------------------- BADGES -------------------- */

.header-count-badge{
    position: absolute;
    top: -6px;
    left: -6px;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    border-radius: 999px;
    background: #ff3f68;
    color: #ffffff;
    font-size: 11px;
    font-weight: 900;
    line-height: 19px;
    text-align: center;
    border: 2px solid rgba(13, 60, 115, 0.95);
    box-shadow: 0 6px 14px rgba(255, 63, 104, 0.35);
}

.header-count-badge.is-empty{
    display: none;
}

/* =====================================================
   USER PANEL
===================================================== */

.user-panel-menu{
    position: relative;
}

.user-panel-btn{
    height: 42px;
    padding: 0 11px;
    border-radius: 16px;
    border: 1px solid rgba(180, 220, 255, 0.22);
    background: rgba(255, 255, 255, 0.13);
    color: #ffffff;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
}

.user-panel-btn:hover{
    background: rgba(135, 195, 255, 0.28);
    transform: translateY(-1px);
}

.user-panel-avatar{
    width: 27px;
    height: 27px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.user-panel-text{
    display: flex;
    align-items: center;
    gap: 4px;
}

.user-panel-greeting{
    font-size: 12.5px;
    color: rgba(235, 247, 255, 0.78);
}

.user-panel-name{
    max-width: 105px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13.5px;
    font-weight: 800;
    color: #ffffff;
}

.user-panel-arrow{
    font-size: 15px;
    color: rgba(235, 247, 255, 0.75);
    transition: transform 0.2s ease;
}

.user-panel-menu:hover .user-panel-arrow,
.user-panel-menu:focus-within .user-panel-arrow{
    transform: rotate(180deg);
}

/* -------------------- USER DROPDOWN -------------------- */

.user-panel-dropdown{
    position: absolute;
    top: 100%;
    left: 0;
    width: 245px;
    padding: 10px;
    margin: 0;
    display: none;
    flex-direction: column;
    gap: 6px;
    background: rgba(16, 72, 135, 0.97);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(160, 205, 255, 0.24);
    border-radius: 0 0 20px 20px;
    box-shadow: 0 20px 45px rgba(0, 35, 85, 0.34);
    z-index: 10000;
}

/* پل نامرئی برای نپریدن هاور */
.user-panel-menu::after{
    content: "";
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    height: 12px;
    background: transparent;
}

.user-panel-menu:hover .user-panel-dropdown,
.user-panel-menu:focus-within .user-panel-dropdown{
    display: flex;
}

.user-panel-dropdown a{
    width: 100%;
    min-height: 42px;
    padding: 9px 11px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.06);
    color: #eef7ff;
    display: flex;
    align-items: center;
    gap: 9px;
    text-decoration: none;
    font-size: 13.5px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.user-panel-dropdown a span{
    width: 25px;
    height: 25px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.user-panel-dropdown a strong{
    font-weight: 700;
}

.user-panel-dropdown a:hover{
    background: rgba(135, 195, 255, 0.28);
    color: #ffffff;
    transform: translateX(-2px);
}

.user-panel-logout{
    margin-top: 3px;
    background: rgba(255, 70, 105, 0.14) !important;
    color: #ffe4ea !important;
}

.user-panel-logout:hover{
    background: rgba(255, 70, 105, 0.28) !important;
    color: #ffffff !important;
}

/* =====================================================
   HAMBURGER
===================================================== */

.hamburger{
    width: 42px;
    height: 42px;
    border-radius: 15px;
    border: 1px solid rgba(180, 220, 255, 0.22);
    background: rgba(255, 255, 255, 0.13);
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 0;
    transition: all 0.2s ease;
}

.hamburger:hover{
    background: rgba(135, 195, 255, 0.28);
}

.hamburger span{
    width: 21px;
    height: 2px;
    border-radius: 99px;
    background: #ffffff;
    display: block;
    transition: all 0.22s ease;
}

.hamburger.active span:nth-child(1){
    transform: translateY(7px) rotate(45deg);
}

.hamburger.active span:nth-child(2){
    opacity: 0;
}

.hamburger.active span:nth-child(3){
    transform: translateY(-7px) rotate(-45deg);
}

/* =====================================================
   LAPTOP FIX
===================================================== */

@media(max-width: 1180px){

    .header-container{
        padding: 10px 16px;
        gap: 11px;
    }

    .nav-menu a{
        font-size: 13px;
        padding: 8px 10px;
    }

    .search-box{
        min-width: 200px;
        max-width: 270px;
    }

    .user-panel-name{
        max-width: 75px;
    }
}

/* =====================================================
   MOBILE / TABLET
===================================================== */

@media(max-width: 900px){

    .main-header{
        background: rgba(13, 60, 115, 0.90);
    }

    .header-container{
        display: grid;
        grid-template-columns: auto 1fr auto;
        align-items: center;
        gap: 9px;
        padding: 9px 13px;
    }

.logo{
    grid-column: 1;
    grid-row: 1;
    position: relative;
    z-index: 5;
}

.logo img{
    height: 46px;
    max-width: 140px;
    object-fit: contain;
}

    .hamburger{
        display: flex;
        grid-column: 3;
        grid-row: 1;
        justify-self: end;
    }

    .header-icons{
        grid-column: 2;
        grid-row: 1;
        justify-content: end;
        gap: 6px;
        min-width: 0;
    }

    .theme-toggle-btn,
    .header-action-icon,
    .user-panel-btn{
        width: 39px;
        height: 39px;
        border-radius: 14px;
        flex-shrink: 0;
    }

    .theme-toggle-btn{
        display: none;
    }

    .header-emoji-icon{
        font-size: 17px;
    }

    .header-count-badge{
        top: -5px;
        left: -5px;
        min-width: 18px;
        height: 18px;
        line-height: 18px;
        font-size: 10px;
    }

    .user-panel-btn{
        padding: 0;
        justify-content: center;
    }

    .user-panel-avatar{
        width: auto;
        height: auto;
        background: transparent;
        font-size: 18px;
    }

    .user-panel-text,
    .user-panel-arrow{
        display: none;
    }

    /* سرچ موبایل */
    .search-box{
        grid-column: 1 / 4;
        grid-row: 2;
        width: 100%;
        max-width: none;
        min-width: 0;
        height: 41px;
        border-radius: 15px;
    }

    .search-box input{
        font-size: 13px;
    }

    .search-box button{
        padding: 0 13px;
        font-size: 12.5px;
    }

    /* منوی موبایل */
    .nav-menu{
        position: absolute;
        top: calc(100% + 8px);
        right: 13px;
        left: 13px;
        width: auto;
        display: none;
        padding: 10px;
        background: rgba(14, 66, 125, 0.98);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        border: 1px solid rgba(165, 210, 255, 0.25);
        border-radius: 22px;
        box-shadow: 0 20px 48px rgba(0, 35, 85, 0.36);
        max-height: calc(100vh - 145px);
        overflow-y: auto;
        z-index: 99999;
    }

    .nav-menu.active{
        display: block;
    }

    .nav-menu > ul{
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 7px;
        width: 100%;
    }

    .nav-menu li{
        width: 100%;
    }

    .nav-menu a{
        width: 100%;
        min-height: 44px;
        justify-content: flex-start;
        padding: 11px 13px;
        border-radius: 15px;
        background: rgba(255, 255, 255, 0.09);
        color: #f2f9ff;
        font-size: 14px;
        font-weight: 700;
    }

    .nav-menu a:hover,
    .nav-menu a:active{
        background: rgba(145, 205, 255, 0.26);
        color: #ffffff;
        transform: none;
    }

    /* در موبایل hover خاموش؛ open با JS */
    .dropdown:hover > .dropdown-menu,
    .has-submenu:hover > .stuord-sub-menu{
        display: none;
    }

    .dropdown::after,
    .stuord-nav-item.has-submenu::after{
        display: none;
    }

    .dropdown > a,
    .has-submenu > a{
        position: relative;
        padding-left: 42px;
    }

    .dropdown > a::after,
    .has-submenu > a::after{
        content: "⌄";
        position: absolute;
        left: 14px;
        top: 50%;
        transform: translateY(-50%);
        color: rgba(240, 248, 255, 0.8);
        font-size: 16px;
        transition: transform 0.2s ease;
    }

    .dropdown.open > a,
    .has-submenu.open > a{
        background: rgba(145, 205, 255, 0.27);
    }

    .dropdown.open > a::after,
    .has-submenu.open > a::after{
        transform: translateY(-50%) rotate(180deg);
    }

    .submenu-sign{
        display: none;
    }

    .dropdown-menu{
        position: static;
        display: none;
        width: 100%;
        min-width: 0;
        margin-top: 7px;
        padding: 8px;
        border-radius: 17px;
        background: rgba(255, 255, 255, 0.075);
        border: 1px solid rgba(255, 255, 255, 0.10);
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        gap: 6px;
    }

    .dropdown.open > .dropdown-menu{
        display: flex;
    }

    .dropdown-menu a{
        min-height: 40px;
        padding: 10px 12px;
        border-radius: 13px;
        background: rgba(255, 255, 255, 0.075);
        font-size: 13.5px;
    }

    .dropdown-menu a:hover,
    .dropdown-menu a:active{
        background: rgba(145, 205, 255, 0.24);
        transform: none;
    }

    .stuord-sub-menu{
        position: static;
        display: none;
        width: 100%;
        min-width: 0;
        margin-top: 6px;
        padding: 7px;
        border-radius: 15px;
        background: rgba(0, 35, 90, 0.18);
        border: 1px solid rgba(255, 255, 255, 0.09);
        box-shadow: none;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        gap: 5px;
    }

    .has-submenu.open > .stuord-sub-menu{
        display: flex;
    }

    .stuord-sub-menu a{
        min-height: 38px;
        padding: 9px 12px;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.07);
        font-size: 13px;
    }

    .stuord-sub-menu a:hover,
    .stuord-sub-menu a:active{
        background: rgba(145, 205, 255, 0.22);
        transform: none;
    }

    /* پنل کاربر در موبایل */
    .user-panel-dropdown{
        top: calc(100% + 8px);
        left: 0;
        width: 225px;
        border-radius: 18px;
        background: rgba(16, 72, 135, 0.98);
    }

    .user-panel-menu::after{
        display: none;
    }

.header-container{
    display: grid;
    grid-template-columns: 44px 1fr auto;
    align-items: center;
}

/* ستون‌های ثابت هدر موبایل */
.header-container{
    display: grid;
    grid-template-columns: 44px 1fr auto;
    align-items: center;
    gap: 8px;
}

/* همبرگر همیشه ستون اول */
.hamburger{
    grid-column: 1;
    justify-self: start;
}

/* لوگو همیشه وسط */
.logo{
    grid-column: 2;
    display: flex;
    justify-content: center;
    align-items: center;
}

.logo img{
    height: 44px;
    max-width: 130px;
    object-fit: contain;
}

/* آیکون‌ها همیشه سمت راست */
.header-icons{
    grid-column: 3;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    flex-wrap: nowrap; /* جلوگیری از افتادن زیر هم */
}
.header-container{
    display: grid;
    grid-template-columns: auto auto 1fr auto auto;
    grid-template-rows: auto auto auto;
    gap: 8px;
    align-items: center;
}

/* ردیف اول */
.logo{
    grid-column: 1;
    grid-row: 1;
}

.hamburger{
    grid-column: 2;
    grid-row: 1;
}

.header-icons{
    grid-column: 4 / 6;
    grid-row: 1;
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}

/* ردیف دوم */
.user-panel-menu{
    grid-column: 1 / 6;
    grid-row: 2;
    display: flex;
    width: 70px;
    justify-content: flex-start;
}

/* ردیف سوم */
.search-box{
    grid-column: 1 / 6;
    grid-row: 3;
    width: 100%;
}
.logo{
    display:flex;
    align-items:center;
}

.logo img{
    height:44px;
    max-width:130px;
    object-fit:contain;
}
.wishlist-action{order:1;}
.cart-action{order:2;}
/* والد پنل کاربر */
.user-panel-menu{
    position: relative;
}

/* دراپ‌داون پنل کاربر در موبایل */
.user-panel-dropdown{
    position: static;
    width: 100%;
    margin-top: 8px;
}

}
@media (max-width:900px){

    .user-panel-menu{
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        width: 100%;
        justify-self: start;
    }

    .search-box{
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
        width: 100%;
    }


    .header-container{
        padding: 8px 10px;
        gap: 7px;
    }

    .logo img{
        height: 41px;
    }

    .hamburger,
    .header-action-icon,
    .user-panel-btn{
        width: 36px;
        height: 36px;
        border-radius: 13px;
    }

    .header-icons{
        gap: 5px;
    }

    .header-emoji-icon{
        font-size: 20px;
    }

    .search-box{
        height: 39px;
        border-radius: 14px;
    }

    .search-box button{
        padding: 0 11px;
    }

    .nav-menu{
        right: 10px;
        left: 10px;
        border-radius: 20px;
        max-height: calc(100vh - 135px);
    }

    .nav-menu a{
        font-size: 13.5px;
        padding: 10px 12px;
    }

    .user-panel-dropdown{
        position: fixed;
        top: 74px;
        right: 10px;
        left: 10px;
        width: auto;
        border-radius: 20px;
    }
    .user-panel-btn{
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        width: 100%;
        justify-self: start;
    }

    .search-box{
        grid-column: 1 / -1 !important;
        grid-row: 3 !important;
        width: 100%;
    }
}

/* =====================================================
   VERY SMALL
===================================================== */

@media(max-width: 380px){

    .login-action{
        display: flex;
    }

    .search-box input{
        font-size: 12.5px;
        padding: 0 10px;
    }

    .search-box button{
        font-size: 12px;
        padding: 0 9px;
    }
}


/* استایل های بخش ریویو برای رضایت مشتریان در اوردر یوزر */
.dyorders-review-box{
margin-top:20px;
padding:18px;
border:1px solid #eee;
border-radius:10px;
background:#fafafa;
}

.dyorders-review-title{
font-size:16px;
margin-bottom:10px;
}

.dyorders-rating{
display:flex;
gap:10px;
margin-bottom:10px;
flex-wrap:wrap;
}

.dyorders-rating label{
cursor:pointer;
font-size:14px;
}

.dyorders-review-text{
width:100%;
min-height:80px;
border:1px solid #ddd;
border-radius:8px;
padding:10px;
font-family:inherit;
resize:vertical;
margin-bottom:10px;
}

.dyorders-review-btn{
background:#1f3a5f;
color:white;
border:none;
padding:10px 18px;
border-radius:8px;
cursor:pointer;
font-size:14px;
transition:0.2s;
}

.dyorders-review-btn:hover{
background:#162a44;
}

.dyorders-review-done{
background:#e8f8ef;
color:#1c7c45;
padding:10px;
border-radius:8px;
font-size:14px;
}







/* کدهای بخش رضایت مشتریان در ایندکس */
/* ================================
   Daneshyar Testimonials Section
================================ */

.dytestimonials-section{
    width: min(1180px, 92%);
    margin: 70px auto 60px;
    padding: 45px 28px;
    border-radius: 32px;
    background:
        radial-gradient(circle at top right, rgba(31, 58, 95, 0.16), transparent 35%),
        linear-gradient(135deg, #f8fbff 0%, #ffffff 45%, #f4f7fb 100%);
    position: relative;
    overflow: hidden;
    box-shadow: 0 22px 55px rgba(31, 58, 95, 0.10);
}

.dytestimonials-section::before{
    content: "";
    position: absolute;
    width: 230px;
    height: 230px;
    background: rgba(31, 58, 95, 0.08);
    border-radius: 50%;
    left: -90px;
    top: -90px;
}

.dytestimonials-section::after{
    content: "";
    position: absolute;
    width: 170px;
    height: 170px;
    background: rgba(255, 190, 70, 0.16);
    border-radius: 50%;
    right: -60px;
    bottom: -70px;
}

.dytestimonials-header{
    text-align: center;
    position: relative;
    z-index: 2;
    margin-bottom: 34px;
}

.dytestimonials-mini-title{
    display: inline-block;
    background: rgba(31, 58, 95, 0.08);
    color: #1f3a5f;
    padding: 7px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 12px;
}

.dytestimonials-title{
    font-size: 30px;
    font-weight: 900;
    color: #1f3a5f;
    margin: 0 0 10px;
}

.dytestimonials-desc{
    max-width: 620px;
    margin: 0 auto;
    color: #65758b;
    font-size: 15px;
    line-height: 2;
}

.dytestimonials-grid{
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.dytestimonial-card{
    background: rgba(255, 255, 255, 0.84);
    backdrop-filter: blur(14px);
    border: 1px solid rgba(31, 58, 95, 0.09);
    border-radius: 24px;
    padding: 24px 22px 20px;
    min-height: 245px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 16px 35px rgba(31, 58, 95, 0.08);
    transition: 0.3s ease;
}

.dytestimonial-card:hover{
    transform: translateY(-7px);
    box-shadow: 0 24px 48px rgba(31, 58, 95, 0.15);
    border-color: rgba(31, 58, 95, 0.20);
}

.dytestimonial-quote-icon{
    position: absolute;
    top: 8px;
    left: 20px;
    font-size: 80px;
    line-height: 1;
    color: rgba(31, 58, 95, 0.08);
    font-family: Georgia, serif;
    pointer-events: none;
}

.dytestimonial-top{
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 18px;
    position: relative;
    z-index: 2;
}

.dytestimonial-avatar{
    width: 52px;
    height: 52px;
    border-radius: 18px;
    background: linear-gradient(135deg, #1f3a5f, #3e6a9f);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 23px;
    font-weight: 900;
    box-shadow: 0 10px 22px rgba(31, 58, 95, 0.26);
    flex-shrink: 0;
}

.dytestimonial-user-info{
    min-width: 0;
}

.dytestimonial-name{
    margin: 0 0 5px;
    font-size: 16px;
    font-weight: 900;
    color: #1f2937;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dytestimonial-rating{
    display: flex;
    gap: 2px;
    direction: ltr;
    justify-content: flex-end;
}

.dy-star{
    font-size: 17px;
    line-height: 1;
}

.dy-star-filled{
    color: #ffc107;
    text-shadow: 0 2px 7px rgba(255, 193, 7, 0.35);
}

.dy-star-empty{
    color: #d8dee8;
}

.dytestimonial-text{
    color: #4b5563;
    font-size: 14.5px;
    line-height: 2.05;
    margin: 0;
    position: relative;
    z-index: 2;
    min-height: 88px;
}

.dytestimonial-bottom{
    margin-top: 18px;
    display: flex;
    justify-content: flex-start;
}

.dytestimonial-badge{
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(34, 197, 94, 0.10);
    color: #15803d;
    border: 1px solid rgba(34, 197, 94, 0.18);
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
}

.dytestimonial-badge::before{
    content: "✓";
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background: #22c55e;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
}

/* Tablet */
@media (max-width: 992px){
    .dytestimonials-grid{
        grid-template-columns: repeat(2, 1fr);
    }

    .dytestimonials-title{
        font-size: 26px;
    }
}

/* Mobile */
@media (max-width: 600px){
    .dytestimonials-section{
        width: 92%;
        margin: 50px auto 45px;
        padding: 34px 16px;
        border-radius: 24px;
    }

    .dytestimonials-grid{
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .dytestimonials-title{
        font-size: 23px;
    }

    .dytestimonials-desc{
        font-size: 14px;
    }

    .dytestimonial-card{
        padding: 21px 18px 18px;
        min-height: auto;
        border-radius: 20px;
    }

    .dytestimonial-avatar{
        width: 48px;
        height: 48px;
        border-radius: 16px;
        font-size: 21px;
    }

    .dytestimonial-text{
        font-size: 14px;
        min-height: auto;
    }
}
.dytestimonials-slider{
position:relative;
display:flex;
align-items:center;
gap:15px;
overflow:hidden;
}

.dytest-track{
display:flex;
gap:20px;
transition:transform .4s ease;
}

.dytestimonial-card{
min-width:320px;
background:#fff;
border-radius:16px;
padding:20px;
box-shadow:0 10px 25px rgba(0,0,0,.08);
}

.dytest-btn{
width:40px;
height:40px;
border:none;
border-radius:50%;
background:#1f3a5f;
color:white;
font-size:22px;
cursor:pointer;
flex-shrink:0;
}

.dytest-btn:hover{
background:#14273f;
}

.dytestimonial-top{
display:flex;
align-items:center;
gap:12px;
margin-bottom:10px;
}

.dytestimonial-avatar{
width:45px;
height:45px;
border-radius:50%;
background:#1f3a5f;
color:white;
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
}

.dytestimonial-rating{
color:#ffc107;
font-size:16px;
}

.dystar-empty{
color:#ddd;
}

/* موبایل */

@media(max-width:768px){

.dytestimonial-card{
min-width:260px;
}

.dytest-btn{
width:34px;
height:34px;
font-size:18px;
}

}
.dytestimonials-grid{
display:flex;
gap:20px;
overflow-x:auto;
overflow-y:hidden;
padding-bottom:10px;

scroll-behavior:smooth;
-webkit-overflow-scrolling:touch;
}

.dytestimonial-card{
min-width:300px;
max-width:300px;
flex-shrink:0;
}
.dytestimonials-grid{
touch-action:pan-x;
}
.newest-section{
    touch-action:pan-x;
}
.discount-section{
    touch-action: pan-x;
}











/* ========================================================
----------------------------------------------------
======================================================== */
/* استایل برای دارک مود */
/* ========================================================
----------------------------------------------------
======================================================== */






/* ===============================
   DARK MODE - BODY
================================ */

body.dark-mode{
background:#121212;
color:#e4e4e4;
}


/* ===============================
   DARK MODE - HEADER
================================ */

body.dark-mode .main-header{
background:#0a1f2e;
}

body.dark-mode .nav-menu ul li a{
color:#e4e4e4;
}

body.dark-mode .nav-menu ul li a:hover{
background:#16364f;
}


/* ===============================
   DARK MODE - HAMBURGER MENU
================================ */

body.dark-mode .hamburger span{
background:#e4e4e4;
}

body.dark-mode .nav-menu{
background:#1b1b1b;
}

body.dark-mode .nav-menu ul li{
border-bottom:1px solid #2a2a2a;
}

body.dark-mode .nav-menu ul li a{
color:#e4e4e4;
}


/* ===============================
   DARK MODE - DROPDOWN
================================ */

body.dark-mode .dropdown-menu{
background:#162c3d;
}

body.dark-mode .dropdown:hover > .dropdown-menu{
background:#1b3c55;
}

body.dark-mode .stuord-nav-item:hover > a{
background:#0f2535;
}

body.dark-mode .stuord-sub-menu{
background:#0f2535;
}

body.dark-mode .stuord-sub-menu li a{
border-bottom:1px solid rgba(255,255,255,0.08);
}


/* ===============================
   DARK MODE - SEARCH BOX
================================ */

body.dark-mode .search-box input{
background:#1e1e1e;
color:#eee;
border:1px solid #333;
}

body.dark-mode .search-box button{
background:#1b6fb8;
}


/* ===============================
   DARK MODE - HEADER ICONS
================================ */

body.dark-mode .header-icons img{
filter:brightness(0.9);
}

/* ===============================
   DARK MODE - FOOTER
================================ */

body.dark-mode .main-footer{
background:#0f0f0f;
color:#e4e4e4;
}

body.dark-mode .footer-links a{
color:#dcdcdc;
}

body.dark-mode .footer-bottom{
background:#080808;
color:#bfbfbf;
}


/* ===============================
   DARK MODE - LOGIN PAGE
================================ */

body.dark-mode .login-page{
background:#0a1a2a;
}

body.dark-mode .login-box{
background:#1b1b1b;
color:#e4e4e4;
box-shadow:0 10px 25px rgba(0,0,0,0.6);
}

body.dark-mode .login-box h2{
color:#e4e4e4;
border-bottom:2px solid #1b6fb8;
}

body.dark-mode .input-group label{
color:#cfcfcf;
}

body.dark-mode .input-group input{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .input-group input:focus{
border-color:#1b6fb8;
}

body.dark-mode .login-btn{
background:#1b6fb8;
}

body.dark-mode .login-btn:hover{
background:#1f8f4e;
}

body.dark-mode .register-link a{
color:#4cd27a;
}

body.dark-mode #error-msg{
background:#3a1f1f;
color:#ffb3b3;
}


/* ===============================
   DARK MODE - ADMIN PANEL
================================ */

body.dark-mode .admin-container{
background:#1b1b1b;
color:#e4e4e4;
box-shadow:0 5px 20px rgba(0,0,0,0.6);
}

body.dark-mode .admin-container h2{
color:#e4e4e4;
}

body.dark-mode .variant-item{
border:2px dashed #444;
}


/* ===============================
   DARK MODE - EDIT PRODUCT FORM
================================ */

body.dark-mode .edit-form label{
color:#d0d0d0;
}

body.dark-mode .edit-form input,
body.dark-mode .edit-form textarea,
body.dark-mode .edit-form select{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .edit-form textarea{
background:#2a2a2a;
}

body.dark-mode .main-product-img{
border:1px solid #444;
}


/* ===============================
   DARK MODE - PRODUCT VARIANTS
================================ */

body.dark-mode .variant-row{
background:#222;
border:1px solid #444;
}

body.dark-mode .variant-field label{
color:#ccc;
}

body.dark-mode .variant-delete-box label{
color:#ccc;
}

/* ===============================
   DARK MODE - DELETE / ACTION BUTTONS
================================ */

body.dark-mode .delete-btn{
background:#b33939;
}

body.dark-mode .delete-btn:hover{
background:#8e2b2b;
}

body.dark-mode .gallery-delete{
background:#b33939;
}

body.dark-mode .gallery-delete:hover{
background:#8e2b2b;
}


/* ===============================
   DARK MODE - VARIANT BUTTON
================================ */

body.dark-mode .add-variant-btn{
background:#2c6fb2;
}

body.dark-mode .add-variant-btn:hover{
background:#215a91;
}


/* ===============================
   DARK MODE - GALLERY
================================ */

body.dark-mode .gallery-item{
background:#1e1e1e;
border:1px solid #444;
}

body.dark-mode .gallery-item img{
filter:brightness(0.9);
}


/* ===============================
   DARK MODE - SAVE BUTTON
================================ */

body.dark-mode .save-edit-btn{
background:#239b56;
}

body.dark-mode .save-edit-btn:hover{
background:#1e8449;
}


/* ===============================
   DARK MODE - ADMIN FORM
================================ */

body.dark-mode .admin-form input,
body.dark-mode .admin-form select,
body.dark-mode .admin-form textarea{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .admin-form input:focus,
body.dark-mode .admin-form select:focus,
body.dark-mode .admin-form textarea:focus{
border-color:#3cff00;
}


/* ===============================
   DARK MODE - ADMIN BUTTON
================================ */

body.dark-mode .admin-btn{
background:#162a3d;
}

body.dark-mode .admin-btn:hover{
background:#1b6f54;
}


/* ===============================
   DARK MODE - ADMIN TABLE
================================ */

body.dark-mode .admin-table{
background:#1b1b1b;
color:#e4e4e4;
box-shadow:0 5px 20px rgba(0,0,0,0.6);
}

body.dark-mode .admin-table th{
background:#162a3d;
}

body.dark-mode .admin-table td{
border-bottom:1px solid #333;
}

body.dark-mode .admin-table tr:hover{
background:#242424;
}


/* ===============================
   DARK MODE - ACTION LINKS
================================ */

body.dark-mode .btn-edit{
background:#1f7a5a;
}

body.dark-mode .btn-edit:hover{
background:#176347;
}

body.dark-mode .btn-delete{
background:#a93226;
}

body.dark-mode .btn-delete:hover{
background:#7b241c;
}


/* ===============================
   DARK MODE - ADMIN LINKS
================================ */

body.dark-mode .admin-link a{
background:#0a4fd6 !important;
}

body.dark-mode .admin-link a:hover{
background:#5a95e0;
}

body.dark-mode .admin-btn-header{
background:#3a7bd5;
}

body.dark-mode .admin-btn-header:hover{
background:#1b2d45;
}

body.dark-mode .logout-btn{
background:#a93226;
}

body.dark-mode .logout-btn:hover{
background:#7b241c;
}


/* ===============================
   DARK MODE - SHOP PAGE
================================ */

body.dark-mode .shop{
color:#e4e4e4;
}

body.dark-mode .shop-title{
color:#e4e4e4;
}


/* ===============================
   DARK MODE - FILTER PANEL
================================ */

body.dark-mode .dyshop-filter-panel{
background:#1b1b1b;
border:1px solid rgba(255,255,255,0.08);
box-shadow:0 6px 18px rgba(0,0,0,0.5);
}

body.dark-mode .dyshop-filter-label{
color:#d0d0d0;
}

body.dark-mode .dyshop-filter-select{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .dyshop-filter-select:hover{
border-color:#4a8bd6;
}

body.dark-mode .dyshop-filter-select:focus{
border-color:#4a8bd6;
box-shadow:0 0 0 3px rgba(74,139,214,0.2);
}

body.dark-mode .dyshop-reset-btn{
background:#3a7bd5;
color:#fff;
}

body.dark-mode .dyshop-reset-btn:hover{
background:#1b1b1b;
color:#3a7bd5;
box-shadow:0 0 0 1px #3a7bd5 inset;
}

/* ===============================
   DARK MODE - PRODUCT GRID
================================ */

body.dark-mode .product-card{
background:#262626;
color:#e4e4e4;
box-shadow:0 4px 15px rgba(0,0,0,0.6);
}

body.dark-mode .product-card:hover{
box-shadow:0 10px 25px rgba(0,0,0,0.8);
}

body.dark-mode .product-desc{
color:#bdbdbd;
}

body.dark-mode .old-price{
color:#777;
}

body.dark-mode .new-price{
color:#7aa6ff;
}


/* ===============================
   DARK MODE - PRODUCT BUTTONS
================================ */

body.dark-mode .add-cart{
background:#2f6fe0;
}

body.dark-mode .add-cart:hover{
background:#255ac0;
}

body.dark-mode .view-btn{
background:#1f8f6a;
}

body.dark-mode .view-btn:hover{
background:#166f54;
}


/* ===============================
   DARK MODE - SHOP FILTER
================================ */

body.dark-mode .shop-filter select{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .shop-filter select:hover{
border-color:#5b8cff;
}

body.dark-mode .shop-filter select:focus{
border-color:#5b8cff;
box-shadow:0 0 5px rgba(91,140,255,0.4);
}

body.dark-mode .shop-main-title{
color:#dcdcdc;
border-bottom:2px solid #333;
}


/* ===============================
   DARK MODE - MAIN SHOP WRAPPER
================================ */

body.dark-mode .main-shop-wrapper{
background:#0f1b28;
border:2px solid #2a2a2a;
box-shadow:0 10px 30px rgba(0,0,0,0.7);
}


/* ===============================
   DARK MODE - DISCOUNT SECTION
================================ */

body.dark-mode .discount-header{
border-bottom:2px dashed #3f6f5d;
}

body.dark-mode .discount-header h2{
color:#e8f1ff;
}

body.dark-mode .discount-scroll::-webkit-scrollbar-thumb{
background:#3a6edc;
}


/* ===============================
   DARK MODE - DISCOUNT CARD
================================ */

body.dark-mode .discount-card{
background:#1e1e1e;
box-shadow:0 4px 10px rgba(0,0,0,0.7);
}

body.dark-mode .card-body h3{
color:#9bbcff;
}

body.dark-mode .desc{
color:#bdbdbd;
}

body.dark-mode .old-price-index{
color:#777;
}

body.dark-mode .new-price-index{
color:#7aa6ff;
}


/* ===============================
   DARK MODE - CARD BUTTONS
================================ */

body.dark-mode .btn-view{
background:#2a2a2a;
color:#dcdcdc;
}

body.dark-mode .btn-view:hover{
background:#3a3a3a;
}

body.dark-mode .btn-add{
background:#1f7a5a;
}

body.dark-mode .btn-add:hover{
background:#176347;
}


/* ===============================
   DARK MODE - VIEW ALL BUTTON
================================ */

body.dark-mode .view-all-btn{
background:#1b2f45;
color:#cfe4ff;
}

body.dark-mode .view-all-btn:hover{
background:transparent;
color:#8fbaff;
}


/* ===============================
   DARK MODE - HERO SECTION
================================ */

body.dark-mode .hero-section{
background:#121212;
}

body.dark-mode .hero-content h2{
color:#dce6ff;
}

body.dark-mode .hero-subtitle{
color:#b8b8b8;
}

body.dark-mode .hero-desc{
color:#bdbdbd;
}

/* ===============================
   DARK MODE - HERO BUTTONS
================================ */

body.dark-mode .btn-about{
background:#2a2a2a;
color:#e4e4e4;
}

body.dark-mode .btn-about:hover{
background:#3a3a3a;
}

body.dark-mode .btn-shop{
background:#1f7a5a;
color:#ffffff;
}

body.dark-mode .btn-shop:hover{
background:#176347;
}


/* ===============================
   DARK MODE - CATEGORY SECTION
================================ */

body.dark-mode .category-section{
background:#121212;
}

body.dark-mode .section-title{
color:#e4e4e4;
}

body.dark-mode .category-card{
background:#1e1e1e;
color:#e4e4e4;
box-shadow:0 5px 15px rgba(0,0,0,0.55);
}

body.dark-mode .category-card:hover{
box-shadow:0 10px 25px rgba(0,0,0,0.75);
}

body.dark-mode .category-parent{
background:#1b2d45;
color:#9bbcff;
}

body.dark-mode .category-card h3{
color:#f1f1f1;
}


/* ===============================
   DARK MODE - CATEGORY SLIDER BUTTONS
================================ */

body.dark-mode .cat-btn{
background:#1e1e1e;
color:#e4e4e4;
box-shadow:0 5px 15px rgba(0,0,0,0.7);
}

body.dark-mode .cat-btn:hover{
background:#2a2a2a;
}

body.dark-mode .cat-btn.is-disabled,
body.dark-mode .cat-btn:disabled{
opacity:0.3;
}


/* ===============================
   DARK MODE - BRANDS SECTION
================================ */

body.dark-mode .brands-section{
background:#121212;
}

body.dark-mode .brand-item{
background:#1e1e1e;
border:1px solid #333;
box-shadow:0 4px 10px rgba(0,0,0,0.55);
}

body.dark-mode .brand-item:hover{
box-shadow:0 8px 15px rgba(0,0,0,0.75);
}

body.dark-mode .brand-item img{
filter:grayscale(100%) brightness(0.85);
}

body.dark-mode .brand-item:hover img{
filter:grayscale(0%) brightness(1);
}


/* ===============================
   DARK MODE - WHY US SECTION
================================ */

body.dark-mode .why-us-section{
background:#121212;
}

body.dark-mode .why-us-container{
background:#1e1e1e;
color:#e4e4e4;
box-shadow:0 10px 30px rgba(0,0,0,0.75);
}

body.dark-mode .feature-item h3{
color:#e4e4e4;
}

body.dark-mode .feature-item img{
filter:brightness(0.9);
}


/* ===============================
   DARK MODE - ABOUT PAGE
================================ */

body.dark-mode .about-page{
background-color:#121a22;
color:#dcdcdc;
}

body.dark-mode .about-hero{
background:#050914;
}

body.dark-mode .about-hero h1{
color:#ffffff;
}

body.dark-mode .about-hero p{
color:#bdbdbd;
}

body.dark-mode .about-text{
color:#dcdcdc;
}

body.dark-mode .value-card{
background:#1e1e1e;
color:#e4e4e4;
box-shadow:0 5px 15px rgba(0,0,0,0.65);
border-top:5px solid #1f8f6a;
}

body.dark-mode .value-card h3{
color:#f1f1f1;
}

body.dark-mode .value-card p{
color:#bdbdbd;
}

/* ===============================
   DARK MODE - CONTACT PAGE
================================ */

body.dark-mode .contact-page{
color:#e4e4e4;
}

body.dark-mode .contact-form{
background:#1e1e1e;
box-shadow:0 10px 30px rgba(0,0,0,0.7);
}

body.dark-mode .contact-form input,
body.dark-mode .contact-form textarea{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .submit-btn{
background:#1f7a5a;
}

body.dark-mode .submit-btn:hover{
background:#176347;
}


/* ===============================
   DARK MODE - MODAL
================================ */

body.dark-mode .modal-content{
background:#1e1e1e;
color:#e4e4e4;
}

body.dark-mode .close-btn{
background:#1f7a5a;
}


/* ===============================
   DARK MODE - PRODUCT DETAIL
================================ */

body.dark-mode .product-page1{
background:#121212;
color:#e4e4e4;
}

body.dark-mode .product-info11-h1{
color:#f1f1f1;
}

body.dark-mode .old-price-detail{
color:#888;
}

body.dark-mode .new-price-detail{
color:#7aa6ff;
}

body.dark-mode .detail-qty-box{
background:#1e1e1e;
border:1px solid #444;
}

body.dark-mode .detail-qty-btn{
background:#2a2a2a;
color:#e4e4e4;
}

body.dark-mode .detail-qty-btn:hover{
background:#333;
}

body.dark-mode .detail-qty-input{
background:#1e1e1e;
color:#fff;
}

body.dark-mode .detail-add-cart-btn{
background:#1f7a5a;
}

body.dark-mode .detail-add-cart-btn:hover{
background:#176347;
}


/* ===============================
   DARK MODE - VARIANT BOX
================================ */

body.dark-mode .variant-box{
background:#1e1e1e;
border:1px solid #444;
color:#e4e4e4;
}

body.dark-mode .variant-box:hover{
border-color:#28a745;
}

body.dark-mode .variant-box.active{
background:#28a745;
color:#fff;
}


/* ===============================
   DARK MODE - GALLERY
================================ */

body.dark-mode .gallery-btn{
background:#1e1e1e;
color:#fff;
}

body.dark-mode .thumb{
border:2px solid transparent;
}

body.dark-mode .thumb.active-thumb{
border-color:#28a745;
}


/* ===============================
   DARK MODE - CART PAGE
================================ */

body.dark-mode .ds-cart-wrapper{
background:#1b1b1b;
box-shadow:0 15px 35px rgba(0,0,0,0.7);
}

body.dark-mode .ds-cart-title{
color:#1f8f6a;
}

body.dark-mode .ds-cart-table th{
background:#121c3f;
}

body.dark-mode .ds-cart-table td{
background:#1e1e1e;
border-top:1px solid #333;
border-bottom:1px solid #333;
color:#e4e4e4;
}

body.dark-mode .ds-remove-btn{
background:#3a1f1f;
color:#ff7b7b;
}

body.dark-mode .ds-remove-btn:hover{
background:#ff4d4d;
color:#fff;
}

body.dark-mode .ds-cart-footer h3{
color:#9bbcff;
}

body.dark-mode .ds-checkout-btn{
background:#1f7a5a;
}

body.dark-mode .ds-checkout-btn:hover{
background:#176347;
}

body.dark-mode .ds-empty-msg{
color:#888;
}


/* ===============================
   DARK MODE - CHECKOUT
================================ */

body.dark-mode .checkout-page{
background:#121212;
color:#e4e4e4;
}

body.dark-mode .card{
background:#1e1e1e;
box-shadow:0 10px 25px rgba(0,0,0,0.7);
}

body.dark-mode .checkout-h4,
body.dark-mode .checkout-h3{
color:#e4e4e4;
border-bottom:2px solid #333;
}

body.dark-mode .input-group label{
color:#cfcfcf;
}

body.dark-mode .input-group input,
body.dark-mode .input-group textarea{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .shipping-card{
border:2px solid #333;
background:#1e1e1e;
}

body.dark-mode .shipping-card:has(input:checked){
background:#1c2d45;
border-color:#4a8bd6;
}

body.dark-mode .method-name{
color:#e4e4e4;
}

body.dark-mode .method-price{
color:#aaa;
}

body.dark-mode .preview-item{
border-bottom:1px dashed #333;
}

body.dark-mode .p-name{
color:#e4e4e4;
}

body.dark-mode .p-qty{
color:#999;
}

body.dark-mode .p-price{
color:#7aa6ff;
}

body.dark-mode .summary-details{
background:#1b1b1b;
}

body.dark-mode .summary-line{
color:#ccc;
}

body.dark-mode .total{
color:#ffb347;
}

body.dark-mode .btn-submit-order{
background:#1f7a5a;
}

body.dark-mode .btn-submit-order:hover{
background:#176347;
}

body.dark-mode .terms{
color:#999;
}


/* ===============================
   DARK MODE - INVOICE PAGE
================================ */

body.dark-mode .syf-invoice-page{
background:linear-gradient(135deg,#0f172a,#1e293b);
}

body.dark-mode .syf-invoice-shell{
background:#1e1e1e;
color:#e4e4e4;
box-shadow:0 20px 50px rgba(0,0,0,0.7);
}


/* ===============================
   DARK MODE - TOAST MESSAGE
================================ */

body.dark-mode .toast-msg.success{
background:linear-gradient(135deg,#1e7a45,#27ae60);
}

body.dark-mode .toast-msg.error{
background:linear-gradient(135deg,#7a1e1e,#c0392b);
}

body.dark-mode .toast-msg.info{
background:linear-gradient(135deg,#1f4e79,#2980b9);
}

/* ===============================
   DARK MODE - INVOICE SUCCESS
================================ */

body.dark-mode .syf-invoice-success-box{
background:linear-gradient(135deg,#0f5132,#198754);
}

body.dark-mode .syf-invoice-track-row{
background:rgba(0,80,40,0.6);
}


/* ===============================
   DARK MODE - INFO CARDS
================================ */

body.dark-mode .syf-invoice-info-card,
body.dark-mode .syf-invoice-address-card,
body.dark-mode .syf-invoice-note-card{
background:#1e1e1e;
border:1px solid #333;
}

body.dark-mode .syf-invoice-info-head{
color:#e4e4e4;
border-bottom:2px solid #333;
}

body.dark-mode .syf-invoice-info-item span{
color:#9ca3af;
}

body.dark-mode .syf-invoice-info-item strong{
color:#f1f1f1;
}

body.dark-mode .syf-invoice-address-text{
color:#cfcfcf;
}


/* ===============================
   DARK MODE - PRODUCTS TABLE
================================ */

body.dark-mode .syf-invoice-section-head h2{
color:#e4e4e4;
}

body.dark-mode .syf-invoice-section-head span{
color:#9ca3af;
}

body.dark-mode .syf-invoice-products-table{
background:#1e1e1e;
border:1px solid #333;
}

body.dark-mode .syf-invoice-products-header{
background:#151515;
color:#cbd5e1;
border-bottom:1px solid #333;
}

body.dark-mode .syf-invoice-product-row{
border-bottom:1px solid #333;
}

body.dark-mode .syf-col-price,
body.dark-mode .syf-col-qty,
body.dark-mode .syf-col-total{
color:#cfcfcf;
}

body.dark-mode .syf-col-price strong,
body.dark-mode .syf-col-total strong{
color:#f1f1f1;
}

body.dark-mode .syf-col-price small,
body.dark-mode .syf-col-total small{
color:#9ca3af;
}

body.dark-mode .syf-invoice-product-name{
color:#e4e4e4;
}

body.dark-mode .syf-invoice-product-sub{
color:#9ca3af;
}

body.dark-mode .syf-invoice-product-image-wrap{
background:#1e1e1e;
border:1px solid #333;
}

body.dark-mode .syf-qty-pill{
background:#333;
color:#e4e4e4;
}


/* ===============================
   DARK MODE - SUMMARY
================================ */

body.dark-mode .syf-invoice-summary-card{
background:#1e1e1e;
border:1px solid #333;
}

body.dark-mode .syf-invoice-summary-row{
color:#cfcfcf;
}

body.dark-mode .syf-invoice-summary-row strong{
color:#f1f1f1;
}

body.dark-mode .syf-invoice-summary-final{
color:#22c55e;
border-top:2px solid #333;
}

body.dark-mode .syf-invoice-summary-final strong{
color:#22c55e;
}


/* ===============================
   DARK MODE - NOTE
================================ */

body.dark-mode .syf-invoice-note-card p{
color:#cfcfcf;
}


/* ===============================
   DARK MODE - BUTTONS
================================ */

body.dark-mode .syf-invoice-btn-print{
background:#2a2a2a;
color:#e4e4e4;
}

body.dark-mode .syf-invoice-btn-home{
background:#1f7a5a;
}

body.dark-mode .syf-invoice-btn-home:hover{
background:#176347;
}


/* ===============================
   DARK MODE - MOBILE LABEL
================================ */

body.dark-mode .syf-mobile-label{
color:#94a3b8;
}
/* ===============================
   DARK MODE - ADMIN DASHBOARD
================================ */

body.dark-mode .syfadm-page{
background:linear-gradient(135deg,#0f172a,#1e293b);
}

body.dark-mode .syfadm-hero-title{
color:#f1f1f1;
}

body.dark-mode .syfadm-hero-text{
color:#9ca3af;
}

body.dark-mode .syfadm-hero-tag{
background:#1e293b;
border:1px solid #334155;
color:#7aa2ff;
}

body.dark-mode .syfadm-card{
background:#1e1e1e;
border:1px solid #333;
}

body.dark-mode .syfadm-card-title{
color:#f1f1f1;
}

body.dark-mode .syfadm-card-text{
color:#9ca3af;
}

body.dark-mode .syfadm-card-foot{
border-top:1px solid #333;
}

body.dark-mode .syfadm-back-home{
background:#1e1e1e;
border:1px solid #333;
color:#e4e4e4;
}

body.dark-mode .syfadm-back-home:hover{
background:#2a2a2a;
}


/* ===============================
   DARK MODE - ADMIN ORDERS
================================ */

body.dark-mode .stuord-page{
background:#0f172a;
}

body.dark-mode .stuord-card{
background:#1e1e1e;
}

body.dark-mode .stuord-summary{
background:#151515;
}

body.dark-mode .stuord-status{
background:#1e293b;
color:#8ea6ff;
}

body.dark-mode .stuord-box{
background:#1f2937;
color:#e4e4e4;
}

body.dark-mode .stuord-products{
border:1px solid #333;
}

body.dark-mode .stuord-products-row{
border-bottom:1px solid #333;
color:#ddd;
}

body.dark-mode .stuord-products-row.head{
background:#1e293b;
color:#cbd5e1;
}

body.dark-mode .price{
color:#22c55e;
}

body.dark-mode .stuord-actions select{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .stuord-actions button{
background:#4338ca;
}

body.dark-mode .stuord-alert{
background:#14532d;
color:#bbf7d0;
}


/* ===============================
   DARK MODE - CUSTOMER INFO
================================ */

body.dark-mode .stuord-customer-box{
border-top:1px dashed #444;
}

body.dark-mode .stuord-customer-item{
background:#2a2a2a;
border:1px solid #444;
}

body.dark-mode .stuord-customer-item b{
color:#9ca3af;
}

body.dark-mode .stuord-customer-item span{
color:#e4e4e4;
}

body.dark-mode .stuord-customer-note{
background:#3b3200 !important;
border-color:#6b5c00 !important;
}


/* ===============================
   DARK MODE - PRODUCT REVIEW
================================ */

body.dark-mode .product-description-side{
background:#1e1e1e;
box-shadow:none;
}

body.dark-mode .mini-review-card{
background:#151515;
border:1px solid #333;
}

body.dark-mode .mini-input,
body.dark-mode .mini-textarea{
background:#2a2a2a;
border:1px solid #444;
color:#eee;
}

body.dark-mode .submit-btn-cyan{
background:#0891b2;
}

body.dark-mode .submit-btn-cyan:hover{
background:#0e7490;
}


/* ===============================
   DARK MODE - COMMENTS
================================ */

body.dark-mode .users-comments-list{
border-top:2px solid #333;
}

body.dark-mode .comment-bubble{
background:#1e1e1e;
border:1px solid #333;
}

body.dark-mode .user-name-tag{
color:#e4e4e4;
}

body.dark-mode .user-text{
color:#cfcfcf;
}

body.dark-mode .admin-reply-box{
background:#2a2a2a;
border-right:3px solid #00bcd4;
}

body.dark-mode .no-comments-box{
background:#151515;
border:2px dashed #444;
color:#888;
}

body.dark-mode .buyer-badge{
background:#1b3a2a;
color:#6ee7b7;
}


/* ===============================
   DARK MODE - SCROLL BUTTON
================================ */

body.dark-mode .scroll-btn{
background:#0891b2;
}

body.dark-mode .scroll-btn:hover{
background:#0e7490;
}


/* ===============================
   DARK MODE - SIMILAR PRODUCTS
================================ */

body.dark-mode .similar-products-section{
background:#1e293b;
border:1px solid #334155;
}

body.dark-mode .slider-btn{
background:#0891b2;
}

body.dark-mode .slider-btn:hover{
background:#0e7490;
}

/* ===============================
   DARK MODE - ADMIN COMMENTS
================================ */

body.dark-mode .adm-comments-wrapper{
    background: #0f172a;
}

body.dark-mode .adm-comments-card{
    background: #1e1e1e;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

body.dark-mode .adm-comments-product{
    color: #e4e4e4;
}

body.dark-mode .adm-comments-meta{
    color: #aaa;
}

body.dark-mode .adm-comments-text,
body.dark-mode .adm-comments-admin-reply{
    background: #2a2a2a;
    color: #eee;
}

body.dark-mode .adm-comments-status-select{
    background: #2a2a2a;
    border-color: #444;
    color: #eee;
}

body.dark-mode .adm-comments-reply-textarea{
    background: #2a2a2a;
    border-color: #444;
    color: #eee;
}


/* ===============================
   DARK MODE - ADMIN STATISTICS
================================ */

body.dark-mode .adstat-page{
    background: radial-gradient(circle at top right, rgba(0, 30, 45, 0.5), transparent 30%),
                linear-gradient(135deg, #0f172a 0%, #1a1e26 100%);
}

body.dark-mode .adstat-header{
    background: linear-gradient(135deg, #002538, #00455a);
}

body.dark-mode .adstat-datebox{
    background: rgba(255, 255, 255, 0.05);
}

body.dark-mode .adstat-card{
    background: #1e1e1e;
    border: 1px solid #333;
}

body.dark-mode .adstat-label{
    color: #9ca3af;
}

body.dark-mode .adstat-value{
    color: #f1f1f1;
}

body.dark-mode .adstat-unit{
    color: #6b7280;
}


/* ===============================
   DARK MODE - USER PANEL DROPDOWN
================================ */

body.dark-mode .user-panel-btn{
    background: linear-gradient(135deg, #1a5c75, #000e33);
}

body.dark-mode .user-panel-dropdown{
    background: #1e1e1e;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.4);
}

body.dark-mode .user-panel-dropdown::before{
    background: #1e1e1e;
}

body.dark-mode .user-panel-dropdown a{
    color: #e4e4e4;
}

body.dark-mode .user-panel-dropdown a:hover{
    background: rgba(26, 160, 199, 0.2);
    color: #4ac5eb;
}

body.dark-mode .user-panel-logout{
    border-top: 1px solid #333;
}
/* ===================================
DARK MODE - WISHLIST + FAVORITES
=================================== */

body.dark-mode .wishlist-tooltip,
body.dark-mode .dywish-tooltip,
body.dark-mode .dyfav-tooltip,
body.dark-mode .detail-wishlist-tooltip{
    background:#111;
    color:#eee;
}

body.dark-mode .dyfav-tooltip::after,
body.dark-mode .detail-wishlist-tooltip::after{
    border-bottom-color:#111;
}


/* ===================================
DARK MODE - WISHLIST PAGE
=================================== */

body.dark-mode .dywish-page{
    background:#0f172a;
}

body.dark-mode .dywish-title{
    color:#e5e7eb;
}

body.dark-mode .dywish-card{
    background:#1e1e1e;
    box-shadow:0 10px 28px rgba(0,0,0,0.4);
}

body.dark-mode .dywish-image{
    background:#111827;
}

body.dark-mode .dywish-product-title{
    color:#f3f4f6;
}

body.dark-mode .dywish-old-price{
    color:#9ca3af;
}

body.dark-mode .dywish-new-price{
    color:#ef4444;
}

body.dark-mode .dywish-view{
    background:#2a2a2a;
    color:#e5e7eb;
}

body.dark-mode .dywish-view:hover{
    background:#333;
}

body.dark-mode .dywish-disabled{
    background:#444;
}

body.dark-mode .dywish-empty h3{
    color:#d1d5db;
}

body.dark-mode .dywish-empty a{
    background:#1e40af;
}


/* ===================================
DARK MODE - FAVORITE HEART INDEX
=================================== */

body.dark-mode .dyfav-product-title{
    color:#e5e7eb;
}


/* ===================================
DARK MODE - PRODUCT PAGE WISHLIST
=================================== */

body.dark-mode .detail-wishlist-box{
    background:#1e1e1e;
    border-color:#333;
    box-shadow:0 6px 18px rgba(0,0,0,0.35);
}


/* ===================================
DARK MODE - USER ORDERS PAGE
=================================== */

body.dark-mode .dyorders-page{
    background:#0f172a;
}

body.dark-mode .dyorders-title{
    color:#f1f5f9;
}

body.dark-mode .dyorders-subtitle{
    color:#9ca3af;
}

body.dark-mode .dyorders-card{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .dyorders-card-top{
    border-bottom:1px solid #333;
}

body.dark-mode .dyorders-code-value{
    color:#f3f4f6;
}

body.dark-mode .dyorders-info-item{
    background:#111827;
    border-color:#333;
}

body.dark-mode .dyorders-info-label{
    color:#9ca3af;
}

body.dark-mode .dyorders-info-value{
    color:#e5e7eb;
}

body.dark-mode .dyorders-address-box{
    background:#111827;
    border-color:#333;
}

body.dark-mode .dyorders-address-text{
    color:#e5e7eb;
}

body.dark-mode .dyorders-products-title{
    color:#f3f4f6;
}

body.dark-mode .dyorders-product-item{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .dyorders-product-image-wrap{
    background:#111827;
}

body.dark-mode .dyorders-product-title{
    color:#f1f5f9;
}

body.dark-mode .dyorders-product-meta-item{
    background:#2a2a2a;
    color:#d1d5db;
}

body.dark-mode .dyorders-product-meta-item strong{
    color:#f3f4f6;
}

body.dark-mode .dyorders-no-items{
    background:#2a1f00;
    border-color:#5c4500;
    color:#facc15;
}

body.dark-mode .dyorders-empty{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .dyorders-empty-icon{
    background:#2a2a2a;
}

body.dark-mode .dyorders-empty-title{
    color:#f3f4f6;
}

body.dark-mode .dyorders-empty-text{
    color:#9ca3af;
}

body.dark-mode .dyorders-empty-btn{
    background:#2563eb;
}

body.dark-mode .dyorders-empty-btn:hover{
    background:#1d4ed8;
}
/* ===================================
DARK MODE - TRACK ORDER
=================================== */

body.dark-mode .dytrack-page{
    background:#0f172a;
}

body.dark-mode .dytrack-title{
    color:#f3f4f6;
}

body.dark-mode .dytrack-input{
    background:#1e1e1e;
    border-color:#333;
    color:#eee;
}

body.dark-mode .dytrack-btn{
    background:#2563eb;
}

body.dark-mode .dytrack-result{
    background:#1e1e1e;
}

body.dark-mode .dytrack-products{
    border-top:1px solid #333;
}

body.dark-mode .dytrack-product-meta{
    color:#9ca3af;
}

body.dark-mode .dytrack-error{
    background:#3b0d0d;
    color:#ff8a8a;
}


/* ===================================
DARK MODE - USER COMMENTS
=================================== */

body.dark-mode .dycomments-container{
    background:#0f172a;
}

body.dark-mode .dycomments-title{
    color:#f3f4f6;
}

body.dark-mode .dycomments-card{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .dycomments-product-title{
    color:#f3f4f6;
}

body.dark-mode .dycomments-date{
    color:#9ca3af;
}

body.dark-mode .dycomments-text{
    background:#111827;
    color:#e5e7eb;
}

body.dark-mode .dycomments-reply{
    background:#111827;
    border-right-color:#22c55e;
}

body.dark-mode .dycomments-reply-label{
    color:#e5e7eb;
}

body.dark-mode .dycomments-reply-text{
    color:#d1d5db;
}

body.dark-mode .dycomments-empty{
    background:#1e1e1e;
    color:#9ca3af;
}


/* ===================================
DARK MODE - USER DASHBOARD
=================================== */

body.dark-mode .dyuserdash-container{
    background:#0f172a;
}

body.dark-mode .dyuserdash-title{
    color:#f3f4f6;
}

body.dark-mode .dyuserdash-card{
    background:#1e1e1e;
    border-color:#333;
    color:#e5e7eb;
}

body.dark-mode .dyuserdash-card:hover{
    box-shadow:0 10px 30px rgba(0,0,0,0.35);
}

body.dark-mode .dyuserdash-label{
    color:#9ca3af;
}

body.dark-mode .dyuserdash-lastorder{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .dyuserdash-meta{
    color:#9ca3af;
}


/* ===================================
DARK MODE - ACCOUNT PAGE
=================================== */

body.dark-mode .dyaccount-container{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .dyaccount-title{
    color:#f3f4f6;
}

body.dark-mode .dyaccount-field label{
    color:#9ca3af;
}

body.dark-mode .dyaccount-field input{
    background:#111827;
    border-color:#333;
    color:#e5e7eb;
}

body.dark-mode .dyaccount-note{
    color:#9ca3af;
}

body.dark-mode .dyaccount-success{
    background:#063b21;
    color:#4ade80;
}


/* ===================================
DARK MODE - HEADER
=================================== */

body.dark-mode .main-header{
    background:rgba(10,18,32,0.9);
    border-bottom:1px solid rgba(255,255,255,0.08);
    box-shadow:0 12px 35px rgba(0,0,0,0.5);
}

body.dark-mode .nav-menu a{
    color:#e5e7eb;
}

body.dark-mode .nav-menu a:hover{
    background:rgba(255,255,255,0.08);
}

body.dark-mode .dropdown-menu{
    background:#111827;
    border-color:#333;
}

body.dark-mode .dropdown-menu a{
    background:#1e1e1e;
}

body.dark-mode .dropdown-menu a:hover{
    background:#2a2a2a;
}

body.dark-mode .stuord-sub-menu{
    background:#111827;
    border-color:#333;
}

body.dark-mode .stuord-sub-menu a{
    background:#1e1e1e;
}

body.dark-mode .stuord-sub-menu a:hover{
    background:#2a2a2a;
}

body.dark-mode .search-box{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .search-box input{
    color:#eee;
}

body.dark-mode .search-box input::placeholder{
    color:#9ca3af;
}

body.dark-mode .theme-toggle-btn{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .header-action-icon{
    background:#1e1e1e;
    border-color:#333;
}
/* ===================================
DARK MODE - HEADER ACTION ICONS
=================================== */

body.dark-mode .header-action-icon{
    background:#1e1e1e;
    border-color:#333;
    color:#e5e7eb;
}

body.dark-mode .header-action-icon:hover{
    background:#2a2a2a;
}

body.dark-mode .wishlist-action:hover{
    background:rgba(255,120,150,0.25);
}

body.dark-mode .cart-action:hover{
    background:rgba(120,190,255,0.25);
}

body.dark-mode .login-action:hover{
    background:rgba(120,220,185,0.25);
}


/* ===================================
DARK MODE - HEADER BADGES
=================================== */

body.dark-mode .header-count-badge{
    background:#ef4444;
    border-color:#0f172a;
    box-shadow:0 6px 14px rgba(239,68,68,0.35);
}


/* ===================================
DARK MODE - USER PANEL BUTTON
=================================== */

body.dark-mode .user-panel-btn{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .user-panel-btn:hover{
    background:#2a2a2a;
}

body.dark-mode .user-panel-avatar{
    background:#2a2a2a;
}

body.dark-mode .user-panel-greeting{
    color:#9ca3af;
}

body.dark-mode .user-panel-name{
    color:#f3f4f6;
}

body.dark-mode .user-panel-arrow{
    color:#9ca3af;
}


/* ===================================
DARK MODE - USER DROPDOWN
=================================== */

body.dark-mode .user-panel-dropdown{
    background:#111827;
    border-color:#333;
    box-shadow:0 20px 45px rgba(0,0,0,0.6);
}

body.dark-mode .user-panel-dropdown a{
    background:#1e1e1e;
    color:#e5e7eb;
}

body.dark-mode .user-panel-dropdown a span{
    background:#2a2a2a;
}

body.dark-mode .user-panel-dropdown a:hover{
    background:#2f2f2f;
}

body.dark-mode .user-panel-logout{
    background:#3a0f14 !important;
    color:#ffb4c0 !important;
}

body.dark-mode .user-panel-logout:hover{
    background:#5a1a22 !important;
}


/* ===================================
DARK MODE - HAMBURGER
=================================== */

body.dark-mode .hamburger{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .hamburger:hover{
    background:#2a2a2a;
}

body.dark-mode .hamburger span{
    background:#e5e7eb;
}


/* ===================================
DARK MODE - MOBILE MENU
=================================== */

body.dark-mode .nav-menu{
    background:#0f172a;
    border-color:#333;
    box-shadow:0 20px 48px rgba(0,0,0,0.6);
}

body.dark-mode .nav-menu a{
    background:#1e1e1e;
    color:#e5e7eb;
}

body.dark-mode .nav-menu a:hover{
    background:#2a2a2a;
}

body.dark-mode .dropdown-menu{
    background:#111827;
    border-color:#333;
}

body.dark-mode .dropdown-menu a{
    background:#1e1e1e;
}

body.dark-mode .dropdown-menu a:hover{
    background:#2a2a2a;
}

body.dark-mode .stuord-sub-menu{
    background:#111827;
    border-color:#333;
}

body.dark-mode .stuord-sub-menu a{
    background:#1e1e1e;
}

body.dark-mode .stuord-sub-menu a:hover{
    background:#2a2a2a;
}


/* ===================================
DARK MODE - MOBILE SEARCH
=================================== */

body.dark-mode .search-box{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .search-box input{
    color:#f3f4f6;
}

body.dark-mode .search-box input::placeholder{
    color:#9ca3af;
}

body.dark-mode .search-box button{
    background:#2563eb;
}

body.dark-mode .search-box button:hover{
    background:#1d4ed8;
}
/* ===================================
DARK MODE - ORDER REVIEW
=================================== */

body.dark-mode .dyorders-review-box{
    background:#1e1e1e;
    border-color:#333;
}

body.dark-mode .dyorders-review-title{
    color:#f3f4f6;
}

body.dark-mode .dyorders-rating label{
    color:#e5e7eb;
}

body.dark-mode .dyorders-review-text{
    background:#111827;
    border-color:#333;
    color:#e5e7eb;
}

body.dark-mode .dyorders-review-text::placeholder{
    color:#9ca3af;
}

body.dark-mode .dyorders-review-btn{
    background:#2563eb;
}

body.dark-mode .dyorders-review-btn:hover{
    background:#1d4ed8;
}

body.dark-mode .dyorders-review-done{
    background:#063b21;
    color:#4ade80;
}


/* ===================================
DARK MODE - TESTIMONIALS SECTION
=================================== */

body.dark-mode .dytestimonials-section{
    background:
        radial-gradient(circle at top right, rgba(31,58,95,0.25), transparent 35%),
        linear-gradient(135deg,#0f172a 0%,#111827 45%,#0b1220 100%);
    box-shadow:0 22px 55px rgba(0,0,0,0.55);
}

body.dark-mode .dytestimonials-mini-title{
    background:rgba(255,255,255,0.06);
    color:#93c5fd;
}

body.dark-mode .dytestimonials-title{
    color:#f3f4f6;
}

body.dark-mode .dytestimonials-desc{
    color:#9ca3af;
}

body.dark-mode .dytestimonial-card{
    background:#1e1e1e;
    border-color:#333;
    box-shadow:0 16px 35px rgba(0,0,0,0.45);
}

body.dark-mode .dytestimonial-card:hover{
    border-color:#444;
    box-shadow:0 24px 48px rgba(0,0,0,0.65);
}

body.dark-mode .dytestimonial-quote-icon{
    color:rgba(255,255,255,0.05);
}

body.dark-mode .dytestimonial-avatar{
    background:linear-gradient(135deg,#2563eb,#1e40af);
}

body.dark-mode .dytestimonial-name{
    color:#f3f4f6;
}

body.dark-mode .dytestimonial-text{
    color:#d1d5db;
}

body.dark-mode .dy-star-empty{
    color:#4b5563;
}

body.dark-mode .dytestimonial-badge{
    background:rgba(34,197,94,0.12);
    border-color:rgba(34,197,94,0.25);
    color:#4ade80;
}

body.dark-mode .dytest-btn{
    background:#2563eb;
}

body.dark-mode .dytest-btn:hover{
    background:#1d4ed8;
}
body.dark-mode .nav-menu ul{
    background-color: transparent !important;
}