/*
Theme Name: Woodmart Child
Theme URI: https://xtemos.com/themes/woodmart/
Description: Child theme for Woodmart
Author: Sadegh Saadati
Author URI: https://example.com
Template: woodmart
Version: 1.0.0
Text Domain: woodmart-child
*/

/* =======================================================
   GLOBAL – Custom Styles
======================================================= */

/* =======================================================
   1. CHECKOUT – Distraction Free Mode
   حذف هدر، فوتر و المان‌های اضافی در صفحه تسویه‌حساب
======================================================= */
.woocommerce-checkout .whb-header,
.woocommerce-checkout .footer-container,
.woocommerce-checkout .website-wrapper > header,
.woocommerce-checkout .website-wrapper > footer,
.woocommerce-checkout .woodmart-toolbar {
    display: none !important;
}

/* =======================================================
   2. CHECKOUT – Custom Header
======================================================= */
.checkout-custom-header { margin-bottom: 20px; padding-top: 20px; }
.checkout-top-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 30px; padding: 0 10px; }
.simple-site-title { font-size: 24px; font-weight: 800; color: #333; margin: 0; flex-grow: 1; text-align: center; }
.header-spacer { flex: 1; }
.back-to-shop-btn { flex: 1; text-align: right; display: inline-flex; align-items: center; color: #777; text-decoration: none; font-size: 14px; font-weight: bold; transition: 0.3s; }
.back-to-shop-btn:hover { color: #333; }
.back-to-shop-btn .dashicons { font-size: 18px; margin-left: 5px; line-height: 1; }

/* =======================================================
   3. CHECKOUT – Progress Bar
======================================================= */
.checkout-progress-bar { display: flex; justify-content: center; gap: 30px; background: #fff; padding: 15px; border-radius: 50px; box-shadow: 0 5px 15px rgba(0,0,0,0.03); max-width: 600px; margin: 0 auto 30px auto; }
.checkout-progress-bar .step { text-align: center; opacity: 0.5; position: relative; }
.checkout-progress-bar .step.active,
.checkout-progress-bar .step.completed { opacity: 1; color: #27ae60; font-weight: bold; }
.checkout-progress-bar .step-icon { display: block; font-size: 22px; }
.checkout-progress-bar .step-label { font-size: 12px; }

/* =======================================================
   4. CHECKOUT – Mobile Sticky Place Order Button
======================================================= */
@media (max-width: 768px) {
    body.woocommerce-checkout { padding-bottom: 90px !important; }
    #place_order { position: fixed !important; bottom: 0; left: 0; right: 0; width: 100% !important; margin: 0 !important; border-radius: 0 !important; z-index: 99999 !important; padding: 20px !important; box-shadow: 0 -5px 20px rgba(0,0,0,0.15) !important; font-size: 16px !important; }
    .ir-trust-badges { margin-bottom: 70px; }
    .checkout-top-row { flex-direction: column-reverse; gap: 15px; }
    .back-to-shop-btn { width: 100%; justify-content: center; background: #f9f9f9; padding: 10px; border-radius: 8px; }
}

/* =======================================================
   5. QUANTITY – Custom Quantity Selector
======================================================= */
.ir-qty-container {
    display: inline-flex;
    align-items: center;
    border: 1px solid #ddd;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
    height: 40px;
}

.ir-btn-minus, .ir-btn-plus {
    width: 35px;
    height: 100%;
    background: #f7f7f7;
    border: none;
    cursor: pointer;
    font-size: 18px;
    font-weight: bold;
    color: #555;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.2s;
    padding: 0;
    margin: 0;
}
.ir-btn-minus:hover, .ir-btn-plus:hover { background: #eee; color: #000; }

.ir-qty-input {
    width: 45px !important;
    height: 100% !important;
    border: none !important;
    text-align: center;
    padding: 0 !important;
    background: #fff !important;
    font-size: 16px !important;
    font-weight: bold;
    color: #333;
    -moz-appearance: textfield;
}
.ir-qty-input::-webkit-outer-spin-button,
.ir-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ir-qty-input:focus { box-shadow: none !important; }

/* =======================================================
   6. CHECKOUT – Validation Styles
======================================================= */
#billing_phone { direction: ltr; text-align: left; padding-left: 40px !important; }
.form-row.ir-valid-field input { border-color: #27ae60 !important; background-color: #f0fdf4 !important; }
.form-row.ir-valid-field::after { content: '\2714'; position: absolute; left: 15px; top: 45px; color: #27ae60; font-size: 18px; font-weight: bold; pointer-events: none; z-index: 10; }

/* =======================================================
   7. CHECKOUT – General UI Styles
======================================================= */
.woocommerce-billing-fields__field-wrapper { background: #fff; padding: 25px; border-radius: 15px; border: 1px solid #eee; margin-bottom: 25px; }
.woocommerce-checkout input.input-text { background: #fcfcfc !important; border: 1px solid #e1e1e1 !important; border-radius: 8px !important; padding: 12px !important; min-height: 48px; }
.woocommerce-checkout input.input-text:focus { background: #fff !important; border-color: #27ae60 !important; }

/* =======================================================
   8. COUPON – Discount & Coupon Section
======================================================= */
#ir-discount-notification { background: #e8f8f5; color: #27ae60; border: 1px dashed #27ae60; padding: 15px; border-radius: 10px; text-align: center; margin-bottom: 15px; }
#ir-coupon-section { background: #fff; border: 2px dashed #bdc3c7; border-radius: 12px; padding: 15px; margin-bottom: 25px; }
.ir-coupon-title { font-weight: bold; color: #7f8c8d; margin-bottom: 10px; }
.ir-coupon-inputs { display: flex; gap: 10px; }
#ir_coupon_code { flex: 1; text-align: center; border: 1px solid #bdc3c7 !important; }
#ir_apply_coupon_btn { background: #34495e !important; color: #fff !important; border-radius: 8px !important; padding: 0 25px !important; cursor: pointer; }
#ir-coupon-message .woocommerce-message { background: #e8f8f5; color: #27ae60; border: none; padding: 10px; border-radius: 5px; margin-bottom:10px; }
#ir-coupon-message .woocommerce-error { background: #fdedec; color: #e74c3c; border: none; padding: 10px; border-radius: 5px; margin-bottom:10px; }

/* =======================================================
   9. ORDER REVIEW – Accordion & Place Order
======================================================= */
#order_review_heading { cursor: pointer; background: #fff; border: 1px solid #eee; border-radius: 10px; margin-bottom: 15px; transition: 0.3s; }
#order_review_heading:hover { border-color: #27ae60; }
.ir-accordion-header-content { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; }
.ir-acc-left { display: flex; flex-direction: column; }
.ir-acc-title { font-size: 16px; font-weight: bold; color: #2c3e50; }
.ir-acc-title i { font-size: 18px; color: #27ae60; margin-left: 5px; }
.ir-acc-hint { font-size: 11px; color: #95a5a6; margin-top: 2px; }
.ir-acc-total-wrapper { font-size: 14px; color: #7f8c8d; background: #f8f9fa; padding: 5px 10px; border-radius: 5px; }
#ir-header-total { color: #2c3e50; font-weight: bold; margin-right: 5px; }
.woocommerce-checkout-review-order-table { display: none; margin-bottom: 20px; border:1px solid #eee; border-top:none; border-radius:0 0 10px 10px; padding:10px; background:#fff; }

#place_order { background: #27ae60 !important; color: #fff !important; font-size: 18px !important; font-weight: bold !important; border-radius: 12px !important; padding: 18px !important; width: 100%; margin-top: 10px; border: none !important; box-shadow: 0 4px 0 #219150; transition: 0.2s; text-transform: uppercase; }
#place_order:hover { background: #2ecc71 !important; transform: translateY(-2px); box-shadow: 0 6px 0 #219150; }
#place_order:active { transform: translateY(2px); box-shadow: 0 0 0 #219150; }











/* =======================================================
   1. FREE SHIPPING BAR
   ======================================================= */
.ir-fs-wrapper {
    background: #fff;
    margin-bottom: 30px;
    padding: 15px 20px;
    border-radius: 12px;
    border: 1px solid #e1e1e1;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}
.ir-fs-content {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ir-fs-text {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-weight: bold;
    color: #2c3e50;
}
.ir-fs-track {
    width: 100%;
    height: 10px;
    background: #eee;
    border-radius: 10px;
    overflow: hidden;
}
.ir-fs-fill {
    height: 100%;
    background: #bdc3c7;
    border-radius: 10px;
    transition: width 0.5s ease, background 0.3s ease;
}
.ir-fs-fill.ir-completed {
    background: #27ae60;
}
.ir-fs-fill.ir-pending {
    background: #f39c12;
}

/* =======================================================
   2. SMART CROSS-SELL (3 Columns Fix)
   ======================================================= */
.ir-cross-sell-section {
    margin-top: 40px;
    padding-top: 20px;
    border-top: 2px dashed #eee;
}
.ir-cross-sell-section h3 {
    text-align: center;
    margin-bottom: 25px;
    font-size: 18px;
    color: #333;
}

/* حل مشکل بزرگ بودن محصولات: اجبار به نمایش 3 ستونه با CSS Grid */
.ir-grid-force {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; /* دقیقا 3 ستون */
    gap: 20px !important;
    width: 100% !important;
}

/* اطمینان از اینکه آیتم‌های داخلی عرض اضافه نمی‌گیرند */
.ir-grid-force .product {
    width: 100% !important;
    margin: 0 !important;
    max-width: 100% !important;
}

/* تنظیم برای تبلت و موبایل */
@media (max-width: 992px) {
    .ir-grid-force {
        grid-template-columns: repeat(2, 1fr) !important; /* در تبلت 2 تایی */
    }
}

@media (max-width: 576px) {
    .ir-grid-force {
        grid-template-columns: repeat(1, 1fr) !important; /* در موبایل کوچک 1 تایی */
        gap: 15px !important;
    }
}

/* =======================================================
   3. MOBILE STICKY BAR
   ======================================================= */
.ir-mobile-sticky-bar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.1);
    z-index: 9999;
    padding: 10px 15px;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #eee;
}
.ir-ms-total {
    display: flex;
    flex-direction: column;
}
.ir-ms-total span:first-child {
    font-size: 11px;
    color: #777;
}
.ir-ms-price {
    font-size: 16px;
    font-weight: 800;
    color: #333;
}
.ir-ms-checkout-btn {
    background: #27ae60;
    color: #fff;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: bold;
    font-size: 14px;
    min-width: 120px;
    text-align: center;
    box-shadow: 0 4px 0 #219150;
}
.ir-ms-checkout-btn:active {
    transform: translateY(2px);
    box-shadow: 0 0 0 #219150;
}

@media (max-width: 768px) {
    .ir-mobile-sticky-bar {
        display: flex;
    }
    body.woocommerce-cart {
        padding-bottom: 80px; 
    }
}