@import url("variables.css");

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{

    font-family:Vazirmatn,sans-serif;

    direction:rtl;

    background:var(--background);

    color:#222;

    overflow-x:hidden;

    line-height:1.8;

}

.container{

    width:100%;

    max-width:1400px;

    margin:auto;

    padding:0 20px;

}

img{

    display:block;

    max-width:100%;

}

a{

    text-decoration:none;

    color:inherit;

    transition:.3s;

}

button{

    border:none;

    cursor:pointer;

    transition:.3s;

}

input{

    outline:none;

}

.site-content{

    min-height:700px;

    padding-top:30px;

    padding-bottom:60px;

}

.section-title{

    font-size:34px;

    margin-bottom:25px;

    font-weight:800;

    color:#222;

}

.btn-main{

    display:inline-block;

    background:var(--primary);

    color:#fff;

    padding:14px 30px;

    border-radius:50px;

    font-weight:bold;

    transition:.3s;

}

.btn-main:hover{

    background:var(--primary-dark);

    transform:translateY(-3px);

}

.product-grid{

    display:grid;

    grid-template-columns:repeat(auto-fill,minmax(270px,1fr));

    gap:25px;

}

.product-card{

    background:#fff;

    border-radius:20px;

    box-shadow:var(--shadow);

    overflow:hidden;

    transition:.35s;

}

.product-card:hover{

    transform:translateY(-8px);

}

.product-image{

    height:250px;

    background:#fafafa;

    display:flex;

    justify-content:center;

    align-items:center;

}

.product-body{

    padding:18px;

}

.product-title{

    font-size:18px;

    font-weight:700;

    margin-bottom:12px;

}

.product-price{

    color:var(--primary);

    font-size:20px;

    font-weight:bold;

    margin-bottom:15px;

}

.product-btn{

    width:100%;

    padding:12px;

    border-radius:12px;

    background:var(--primary);

    color:#fff;

}

.product-btn:hover{

    background:var(--primary-dark);

}

@media(max-width:992px){

    .section-title{

        font-size:28px;

    }

}

@media(max-width:768px){

    .container{

        padding:0 12px;

    }

    .product-grid{

        grid-template-columns:1fr 1fr;

    }

}

@media(max-width:576px){

    .product-grid{

        grid-template-columns:1fr;

    }

}
/* هشدار قیمت قدیمی — متن قرمز و برجسته */
.price-outdated,
.product-price-outdated,
.product-badge.outdated,
.mini-cart-warning {
    color: #c00 !important;
    font-weight: 700;
    background: rgba(204,0,0,0.03);
    border-left: 3px solid #c00;
    padding: 6px 10px;
    margin-top: 6px;
    font-size: 0.92rem;
    border-radius: 4px;
}

/* =========================================
   CHECKOUT CONFIRMATION
========================================= */

.checkout-confirmation{

    max-width:900px;

    margin:40px auto;

    background:#fff;

    border-radius:var(--radius);

    box-shadow:var(--shadow);

    padding:40px;

}

.checkout-confirmation-header{

    text-align:center;

    margin-bottom:30px;

}

.checkout-confirmation-header h1{

    font-size:30px;

    font-weight:800;

    color:#222;

}

.confirmation-icon{

    width:70px;

    height:70px;

    margin:0 auto 15px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#e8f5e9;

    color:#2e7d32;

    font-size:38px;

    font-weight:900;

}

.confirmation-message{

    background:#fff8e1;

    border:1px solid #ffe082;

    border-radius:var(--radius-small);

    padding:25px;

    line-height:2;

}

.confirmation-message h2{

    margin-bottom:15px;

    font-size:22px;

}

.confirmation-message p{

    margin-bottom:15px;

}

.confirmation-message p:last-child{

    margin-bottom:0;

}

.confirmation-summary,
.confirmation-address{

    margin-top:25px;

    padding:25px;

    background:#fafafa;

    border-radius:var(--radius-small);

    border:1px solid var(--gray-light);

}

.confirmation-summary h2,
.confirmation-address h2{

    margin-bottom:18px;

    font-size:20px;

}

.summary-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    padding:12px 0;

    border-bottom:1px solid #eee;

}

.summary-row:last-child{

    border-bottom:none;

}

.summary-row.discount{

    color:var(--success);

}

.summary-row.total{

    margin-top:8px;

    padding-top:18px;

    font-size:20px;

    color:var(--primary);

    border-top:2px solid var(--gray-light);

}

.confirmation-address p{

    line-height:2.2;

}

.confirmation-actions{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:15px;

    margin-top:30px;

}

.confirmation-finalize-form{

    margin:0;

}

.confirmation-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-height:52px;

    padding:12px 28px;

    border-radius:12px;

    font-size:16px;

    font-weight:700;

    transition:var(--transition);

}

.confirmation-btn-success{

    background:#2e7d32;

    color:#fff;

}

.confirmation-btn-success:hover{

    background:#1b5e20;

    transform:translateY(-2px);

}

.confirmation-btn-danger{

    background:#c62828;

    color:#fff;

}

.confirmation-btn-danger:hover{

    background:#8e0000;

    transform:translateY(-2px);

}

@media(max-width:600px){

    .checkout-confirmation{

        padding:20px;

        margin:20px auto;

    }

    .confirmation-actions{

        flex-direction:column;

    }

    .confirmation-finalize-form,
    .confirmation-btn{

        width:100%;

    }

    .summary-row{

        align-items:flex-start;

        flex-direction:column;

        gap:5px;

    }

}
/* =========================================
   CHECKOUT SUCCESS
========================================= */

.checkout-success{

    max-width:900px;

    margin:40px auto;

    background:#fff;

    border-radius:var(--radius);

    box-shadow:var(--shadow);

    padding:40px;

}

.success-header{

    text-align:center;

    margin-bottom:30px;

}

.success-icon{

    width:76px;

    height:76px;

    margin:0 auto 18px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#e8f5e9;

    color:#2e7d32;

    font-size:42px;

    font-weight:900;

}

.success-header h1{

    font-size:30px;

    font-weight:800;

    margin-bottom:10px;

    color:#222;

}

.success-header p{

    color:var(--gray);

}


/* Tracking */

.tracking-box{

    text-align:center;

    background:#f1f8e9;

    border:2px solid #81c784;

    border-radius:var(--radius);

    padding:25px;

    margin-bottom:25px;

}

.tracking-label{

    display:block;

    font-size:16px;

    color:#555;

    margin-bottom:10px;

}

.tracking-code{

    display:block;

    direction:ltr;

    letter-spacing:5px;

    font-size:32px;

    color:#2e7d32;

    margin-bottom:8px;

}

.tracking-box p{

    margin:0;

    color:#666;

    font-size:14px;

}


/* Sections */

.success-section{

    background:#fafafa;

    border:1px solid var(--gray-light);

    border-radius:var(--radius-small);

    padding:25px;

    margin-bottom:25px;

}

.success-section h2,
.manual-payment-box h2{

    font-size:21px;

    margin-bottom:18px;

    font-weight:800;

}

.success-info-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    padding:13px 0;

    border-bottom:1px solid #eee;

}

.success-info-row:last-child{

    border-bottom:none;

}

.status-pending{

    color:#f57c00;

}


/* Manual payment */

.manual-payment-box{

    background:#fff8e1;

    border:1px solid #ffe082;

    border-radius:var(--radius);

    padding:25px;

    margin-bottom:25px;

}

.payment-description{

    line-height:2;

    margin-bottom:20px;

}

.card-number-box{

    background:#fff;

    border:1px solid #ddd;

    border-radius:12px;

    padding:18px;

    text-align:center;

    margin-bottom:12px;

}

.card-number-box span,
.card-owner-box span{

    display:block;

    color:#777;

    font-size:14px;

    margin-bottom:6px;

}

.card-number-box strong{

    display:block;

    font-size:26px;

    letter-spacing:2px;

}

.card-owner-box{

    background:#fff;

    border:1px solid #ddd;

    border-radius:12px;

    padding:15px;

    text-align:center;

}


/* Notice */

.success-notice{

    background:#f5f5f5;

    border-right:4px solid #f57c00;

    border-radius:8px;

    padding:20px;

    margin-bottom:30px;

    line-height:2;

}

.success-notice strong{

    color:#e65100;

}

.success-notice p{

    margin-top:8px;

}


/* Actions */

.success-actions{

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:12px;

}

.success-secondary-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    min-height:50px;

    padding:12px 24px;

    border-radius:12px;

    background:#eee;

    color:#333;

    font-weight:700;

    transition:var(--transition);

}

.success-secondary-btn:hover{

    background:#ddd;

    transform:translateY(-2px);

}


/* Mobile */

@media(max-width:600px){

    .checkout-success{

        padding:20px;

        margin:20px auto;

    }

    .success-header h1{

        font-size:24px;

    }

    .tracking-code{

        font-size:23px;

        letter-spacing:3px;

    }

    .success-info-row{

        flex-direction:column;

        align-items:flex-start;

        gap:4px;

    }

    .success-actions{

        flex-direction:column;

    }

    .success-actions a{

        width:100%;

    }

}
/* =========================================
   CHECKOUT PAGE
========================================= */


.checkout-page{

    max-width:1100px;

    margin:40px auto;

}



.checkout-header{

    background:#fff;

    border-radius:20px;

    padding:30px;

    margin-bottom:25px;

    box-shadow:var(--shadow);

    text-align:right;

}


.checkout-header h1{

    font-size:32px;

    font-weight:800;

    margin-bottom:10px;

}


.checkout-header p{

    color:#777;

}



/* =========================
   Sections
========================= */


.checkout-section{

    background:#fff;

    border-radius:20px;

    padding:30px;

    margin-bottom:25px;

    box-shadow:var(--shadow);

}



.checkout-section-title{

    display:flex;

    align-items:center;

    gap:15px;

    margin-bottom:25px;

}


.checkout-step{

    width:45px;

    height:45px;

    background:var(--primary);

    color:#fff;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-weight:800;

    font-size:20px;

}


.checkout-section-title h2{

    font-size:23px;

    font-weight:800;

}


.checkout-section-title p{

    color:#777;

    font-size:14px;

}





/* =========================
   Address Cards
========================= */


.address-list{

    display:flex;

    flex-direction:column;

    gap:15px;

}



.address-card{

    display:block;

    cursor:pointer;

    border:2px solid #eee;

    border-radius:16px;

    padding:20px;

    transition:.3s;

    background:#fff;

}



.address-card:hover{

    border-color:var(--primary);

}



.address-card.selected{

    border-color:var(--primary);

    background:#f5f9ff;

}



.address-card input{

    display:none;

}


.address-card-content{

    display:block;

}


.address-card-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:12px;

}



.address-card-header strong{

    font-size:18px;

}



.address-default{

    background:var(--primary);

    color:#fff;

    padding:5px 12px;

    border-radius:20px;

    font-size:12px;

}



.address-card-location{

    display:block;

    color:#555;

    margin-bottom:8px;

}



.address-card-text{

    display:block;

    line-height:2;

    margin-bottom:10px;

}



.address-card-meta{

    display:flex;

    gap:20px;

    color:#777;

    font-size:14px;

}



.checkout-add-address{

    display:inline-block;

    margin-top:20px;

    color:var(--primary);

    font-weight:bold;

}





/* =========================
 Shipping
========================= */


.shipping-options{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:20px;

}



.shipping-option{

    border:2px solid #eee;

    border-radius:16px;

    padding:20px;

    cursor:pointer;

    transition:.3s;

}



.shipping-option:hover{

    border-color:var(--primary);

}



.shipping-option input{

    display:none;

}



.shipping-option-content strong{

    display:block;

    font-size:18px;

    margin-bottom:8px;

}



.shipping-option-content small{

    color:#777;

}




/* =========================
 Payment
========================= */


.payment-method-card{

    display:flex;

    align-items:center;

    gap:20px;

    background:#f8f8f8;

    border-radius:16px;

    padding:25px;

}



.payment-method-icon{

    font-size:40px;

}



.payment-method-card strong{

    font-size:20px;

}



.payment-method-card p{

    margin-top:10px;

    color:#666;

    line-height:2;

}





/* =========================
 Summary
========================= */


.checkout-summary{

    background:#fff;

    border-radius:20px;

    padding:30px;

    margin-bottom:25px;

    box-shadow:var(--shadow);

}



.checkout-summary h2{

    font-size:24px;

    margin-bottom:20px;

}



.summary-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:15px 0;

    border-bottom:1px solid #eee;

}



.summary-row strong{

    color:#333;

}



.summary-divider{

    height:1px;

    background:#ddd;

    margin:15px 0;

}



.summary-total{

    font-size:22px;

}



.summary-total strong{

    color:var(--primary);

}




/* =========================
 Submit
========================= */


.checkout-submit{

    background:#fff;

    border-radius:20px;

    padding:30px;

    box-shadow:var(--shadow);

    text-align:center;

}



.checkout-submit-note{

    color:#777;

    margin-bottom:25px;

}



.checkout-submit-button{

    min-width:250px;

    font-size:18px;

}





/* =========================
 Mobile
========================= */


@media(max-width:768px){


.checkout-section,
.checkout-header,
.checkout-summary,
.checkout-submit{

    padding:20px;

}



.shipping-options{

    grid-template-columns:1fr;

}



.address-card-meta{

    flex-direction:column;

    gap:5px;

}



.checkout-section-title h2{

    font-size:20px;

}

/* =========================================================
   OVERRIDE FOR DASHBOARD PANEL
========================================================= */

/* خنثی‌سازی محدودیت عرض برای پنل کاربری */
body:has(.dashboard-app) .container,
body:has(.dashboard-app) .site-content {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* تنظیم دقیق محتوای اصلی چسبیده به سایدبار */
.dashboard-app .main-content {
    width: calc(100% - 270px) !important;
    margin-right: 270px !important;
    box-sizing: border-box !important;
}

/* در صورتی که منوی کشویی باز شود */
.dashboard-app .main-content.expanded {
    width: 100% !important;
    margin-right: 0 !important;
}

/* پر کردن کامل فضای صفحه */
.dashboard-app .page {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* تنظیم در حالت موبایل */
@media (max-width: 900px) {
    .dashboard-app .main-content,
    .dashboard-app .main-content.expanded {
        width: 100% !important;
        margin-right: 0 !important;
    }
/* =========================================================
   FIX DASHBOARD INSIDE MAIN LAYOUT
========================================================= */

/* ۱. حذف محدودیت عرض و فاصله‌های کانتینر اصلی قالب در صفحه داشبورد */
.site-content:has(.dashboard-app),
.container:has(.dashboard-app) {
    width: 100% !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ۲. تنظیم سایدبار بین هدر و فوتر (جلوگیری از رفتن روی هدر و فوتر) */
.sidebar,
.main-sidebar,
body:has(.dashboard-app) .main-sidebar {
    position: sticky !important;
    top: 90px !important;
    height: fit-content !important;
    max-height: calc(100vh - 120px) !important;
    overflow-y: auto !important;
    z-index: 99 !important;
}

/* ۳. چسباندن محتوا به سایدبار و حذف فاصله‌های اضافی */
.dashboard-app .main-content {
    width: calc(100% - 270px) !important;
    margin-right: 270px !important;
    padding: 0 !important;
}

.dashboard-app .page {
    width: 100% !important;
    padding: 25px 30px !important;
}