/*
Theme Name: آی‌زنگ (iZang)
Theme URI: https://izang.ir
Author: آی‌زنگ
Description: قالب سایت معرفی و فروش آی‌زنگ، سامانه حضورغیاب، نمره و اطلاع‌رسانی مدرسه. راست‌به‌چپ، فونت وزیرمتن، صفحه اصلی معرفی، فروش پلن‌ها به مدارس با ووکامرس. ساخته‌شده بر پایه ساختار فنی قالب خانی‌نژاد.
Version: 1.2.0
Requires at least: 6.4
Requires PHP: 8.1
Text Domain: izang
License: Proprietary (Vazirmatn font: SIL OFL 1.1, fonts/Vazirmatn-OFL.txt)
*/

/* =========================================
   معرفی فونت‌های اختصاصی
========================================= */
@font-face {
    font-family: 'Vazirmatn';
    src: url('fonts/Vazirmatn-FD-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('fonts/Vazirmatn-FD-Medium.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('fonts/Vazirmatn-FD-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Vazirmatn';
    src: url('fonts/Vazirmatn-FD-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* =========================================
   متغیرها و تنظیمات پایه بر اساس پالت آی‌زنگ
========================================= */
:root { 
    /* -----------------------------------------------------------------
       پالت رنگ برگرفته از لوگوی آی‌زنگ
       سرمه‌ای لوگو  #0E5A6B → رنگ اصلی: دکمه‌ها، لینک‌ها، عناوین، هدر
       فیروزه‌ای لوگو #F2B636 → رنگ تأکید: خط‌ها، نقطه‌ها، حالت انتخاب، شمارنده سبد
         (فیروزه‌ای روی سفید کنتراست کافی برای متن ندارد؛ برای متن فیروزه‌ای از
          --brand-cyan-text استفاده شود)
       قرمز فقط برای بج تخفیف، پیام خطا و شمارنده سبد خرید (جلب توجه) استفاده می‌شود.
       ----------------------------------------------------------------- */
    --brand-navy: #0E5A6B;
    --brand-navy-dark: #0A4654;
    --brand-navy-soft: #E3EFF1;
    --brand-cyan: #F2B636;
    --brand-cyan-soft: #FDF3DC;
    --brand-cyan-text: #0E5A6B;     /* فیروزه‌ای تیره‌شده با کنتراست ۴.۸ روی سفید */

    --primary-color: var(--brand-navy);
    --primary-gradient: var(--brand-navy-dark);
    --accent-color: var(--brand-navy);          /* دکمه‌های نهایی خرید/پرداخت */
    --accent-color-hover: var(--brand-navy-dark);
    --accent-shadow: rgba(14, 90, 107, 0.25);
    --attention-color: #c9a15a;     /* طلایی کم‌رنگ، فقط برای ستاره امتیاز */
    --brand-red: #b3261e;           /* یکسان‌سازی قرمز */
    --bg-color: #F4F6F7;            /* پس‌زمینه روشن و تمیز */
    --card-bg: #ffffff;             /* سفید آی‌زنگ */
    --text-main: #16202A;           /* متن اصلی با کنتراست تیره WCAG AA */
    --text-muted: #4E5A66;          /* متن فرعی خوانا روی سفید */
    --text-light: #a8a9ac;          /* متن کم‌رنگ فقط روی پس‌زمینه‌های تیره */

    /* نام‌های مستعار برند آی‌زنگ (استفاده‌شده در هدر/فوتر/تب‌ها) */
    --izang-primary: var(--brand-navy);
    --izang-primary-gradient: var(--brand-navy-dark);
    --izang-action: var(--brand-cyan);
    --izang-warning: #c9a15a;
    --izang-text-muted: #a8a9ac; /* فقط روی پس‌زمینه‌های تیره استفاده شود (طبق WCAG AA) */
    --izang-text-secondary: #55575c; /* برای متن فرعی روی پس‌زمینه سفید، کنتراست کافی دارد */
    --izang-white: #ffffff;
    --izang-text-dark: #16202A;
    --izang-bg-light: #f7f7f8;

    /* متغیرهای «حالت مطالعه» (Reading Mode) — قبلاً به‌اشتباه بیرون از هر
       بلوک انتخاب‌گری (حتی :root) نوشته شده بودند و چون CSS نامعتبر محسوب
       می‌شدند، مرورگر آن‌ها را کاملاً نادیده می‌گرفت و کل تایپوگرافی
       .post-body-content / .post-toc بدون مقدار واقعی رندر می‌شد. اکنون
       داخل :root تعریف شده‌اند تا هر تمپلیتی (نه فقط تک‌نوشته) بتواند از
       این تایپوگرافی آماده استفاده کند (اصل DRY). */
    --read-bg: var(--izang-bg-light);
    --read-surface: #ffffff;
    --read-text: #262a33;
    --read-text-secondary: #6b7280;
    --read-border: #e6e9ee;
    --read-accent: var(--izang-primary);
    --read-accent-soft: rgba(14, 90, 107, 0.07);
    --read-red-soft-bg: #E3EFF1;
    --read-red-soft-text: #0A4654;
}

* { 
    box-sizing: border-box; 
    margin: 0; 
    padding: 0; 
    -webkit-tap-highlight-color: transparent; 
}

body { 
    font-family: 'Vazirmatn', Tahoma, sans-serif; 
    background-color: #f4f6f9; /* خاکستری استاندارد و ملایم، هماهنگ با var(--bg-color) */
    color: var(--text-main); 
    display: flex; 
    justify-content: center; 
    direction: rtl; 
}

/* =========================================
   قانون کلی: اجبار فونت فارسی روی تمام عناصر عددی/متنی سایت
   -----------------------------------------
   مرورگرها به‌صورت پیش‌فرض فونت خانواده body را روی ورودی‌ها (input)،
   select، textarea، دکمه‌ها و تگ <bdi> (که ووکامرس همیشه دور اعداد
   قیمت می‌پیچد) اعمال نمی‌کنند و از فونت رابط کاربری سیستم‌عامل استفاده
   می‌کنند. همین یک قانون، مشکل نمایش اعداد با فونت اشتباه را برای همیشه
   و در سراسر سایت (فرم‌ها، فیلدهای عددی، قیمت‌ها، شماره تماس و ...)
   حل می‌کند؛ بدون نیاز به تعریف قانون جداگانه برای هر کلاس.
========================================= */
html,
body,
input,
select,
textarea,
button,
bdi {
    font-family: 'Vazirmatn', Tahoma, sans-serif;
}

/* رفع قطعی باگ اج‌تو‌اج نبودن هدر/فوتر: چون body به‌صورت flex + justify-content:center
   است، بدون این قانون، کانتینر اصلی صفحه (#page) ممکن است به‌جای گرفتن کل عرض ویوپورت،
   بر اساس محتوای داخلی خود جمع (shrink) و در وسط صفحه قرار بگیرد؛ با width:100% این
   ریسک برای همیشه از بین می‌رود و #page همیشه دقیقاً به اندازه صفحه پهن می‌ماند. */
#page.site {
    width: 100%;
}

a { 
    text-decoration: none; 
}

/* جلوگیری قطعی از اسکرول افقی ناخواسته (که باعث می‌شود هدر/فوتر اج‌تو‌اج به نظر نرسند)
   نکته مهم: overflow-x:hidden فقط روی <html> گذاشته می‌شود، نه <body>.
   قرار دادن overflow-x:hidden روی خود <body> یک باگ شناخته‌شده در کروم/مرورگرهای
   مبتنی بر Chromium دارد که باعث می‌شود position:sticky برای تمام فرزندان داخل
   body (از جمله هدر چسبان سایت) کاملاً از کار بیفتد. با نگه‌داشتن این قانون
   فقط روی <html>، همان جلوگیری از اسکرول افقی حفظ می‌شود بدون این‌که رفتار
   sticky بودن هدر خراب شود. */
html {
    max-width: 100%;
    overflow-x: hidden;
}
body {
    max-width: 100%;
}
img, iframe, video, table {
    max-width: 100%;
}

/* =========================================
   دسترسی‌پذیری (Accessibility)
========================================= */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.skip-link.screen-reader-text:focus {
    background: #fff;
    color: var(--primary-color);
    clip: auto !important;
    clip-path: none;
    display: block;
    height: auto;
    width: auto;
    left: 10px;
    top: 10px;
    font-size: 13px;
    font-weight: 800;
    padding: 12px 18px;
    border-radius: 10px;
    z-index: 999999;
    box-shadow: 0 4px 15px rgba(0,0,0,0.15);
    text-decoration: none;
}

/* حالت فوکوس قابل مشاهده برای ناوبری با کیبورد (WCAG) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* =========================================
   انیمیشن‌ها
========================================= */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}
.animate-fade-up { animation: fadeInUp 0.7s cubic-bezier(0.25, 0.8, 0.25, 1) forwards; opacity: 0; }

/* =========================================
   ویترین محصولات
========================================= */
.products-container { padding: 10px 20px 20px; flex: 1;}
.products-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; }

.product-card { background-color: var(--card-bg); border-radius: 16px; padding: 12px; display: flex; flex-direction: column; box-shadow: 0 4px 15px rgba(0,0,0,0.03); border: 1px solid #f1f5f9; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); position: relative; overflow: hidden; }
.product-card:hover { transform: translateY(-8px); box-shadow: 0 15px 35px rgba(14, 90, 107,0.08); border-color: var(--primary-color); z-index: 10; }
.product-image { width: 100%; height: 200px; border-radius: 12px; margin-bottom: 12px; background-color: #fff; overflow: hidden; display: flex; align-items: center; justify-content: center; padding: 5px;}
.product-image img { max-width: 100%; max-height: 100%; object-fit: contain; transition: transform 0.5s ease; }
.product-card:hover .product-image img { transform: scale(1.05); }
.product-title { font-size: 12px; font-weight: 700; color: var(--text-main); margin-bottom: 8px; line-height: 1.6; height: 38px; overflow: hidden; }
.product-title a { color: inherit; }
.product-price-box { margin-top: auto; margin-bottom: 12px; min-height: 40px; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 2px; }
.product-price { font-size: 14px; font-weight: 800; color: var(--primary-color); }
.add-to-cart-btn { background-color: var(--primary-color) !important; color: #fff !important; border: none; padding: 10px 15px; border-radius: 8px; font-size: 13px; font-weight: 800; cursor: pointer; width: 100%; font-family: inherit; text-align: center; display: block; transition: all 0.3s; margin-top: 12px; }
.product-card:hover .add-to-cart-btn { background-color: var(--primary-gradient) !important; transform: translateY(-2px); box-shadow: 0 4px 10px rgba(14, 90, 107, 0.2); }

/* =========================================
   پاورقی (Footer) — تایپوگرافی ریز و ساده،
   هماهنگ با بخش‌های izang-guarantee-strip و
   site-trust-band (بدون تیتر درشت/خط زیر ضخیم)
========================================= */
.site-footer { background-color: #ffffff; padding: 30px 0 20px;}
.footer-widgets { display: grid; grid-template-columns: 1fr; gap: 25px; margin-bottom: 20px; }
.footer-widget h4 {
    color: var(--text-main);
    font-size: 12.5px;
    font-weight: 700;
    margin-bottom: 12px;
    border-bottom: none;
    display: block;
    padding-bottom: 0;
    letter-spacing: 0.2px;
}
.footer-widget p { font-size: 11.5px; color: var(--text-muted); line-height: 1.9; margin-bottom: 5px;}
.links-widget ul { list-style: none; }
.links-widget ul li { margin-bottom: 8px; }
.links-widget ul li a { color: var(--text-muted); font-size: 11.5px; font-weight: 400; transition: color 0.2s; }
.links-widget ul li a:hover { color: var(--primary-color); }
.footer-bottom { text-align: center; border-top: 1px solid #e2e8f0; padding-top: 15px; font-size: 11.5px; color: #94a3b8; font-weight: 400; }

.breadcrumb-container { padding: 15px 20px 10px; font-size: 12px; color: var(--text-muted); }
.breadcrumb-container a { color: var(--primary-color); text-decoration: none; transition: color 0.3s; }
.breadcrumb-container a:hover { color: var(--primary-color); }
.breadcrumb-container nav { display: flex; flex-wrap: wrap; gap: 5px; align-items: center;}

.single-product-wrapper { display: block; width: 100%; }
.product-top-container { display: block; }

/* گالری استاندارد ووکامرس */
.product-gallery-section { width: 100%; background: #ffffff; padding: 0 !important; margin: 0; text-align: center; border-bottom: 1px solid #f1f5f9; position: relative; }
.woocommerce-product-gallery { width: 100%; position: relative; opacity: 1 !important;}
.woocommerce-product-gallery figure { margin: 0; padding: 0; }
.woocommerce-product-gallery__image img { width: 100%; height: auto; display: block; border-radius: 0; margin: 0 auto; object-fit: contain; }

.woocommerce-product-gallery .flex-control-thumbs { display: flex; gap: 10px; padding: 15px; margin: 0; list-style: none; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;}
.woocommerce-product-gallery .flex-control-thumbs::-webkit-scrollbar { display: none; }
.woocommerce-product-gallery .flex-control-thumbs li { width: 65px; flex-shrink: 0; cursor: pointer; }
.woocommerce-product-gallery .flex-control-thumbs li img { width: 100%; height: auto; border-radius: 8px; border: 2px solid transparent; opacity: 0.6; transition: all 0.3s ease;}
.woocommerce-product-gallery .flex-control-thumbs li img:hover,
.woocommerce-product-gallery .flex-control-thumbs li img.flex-active { border-color: var(--primary-color); opacity: 1; transform: translateY(-2px); }

.woocommerce-product-gallery__trigger { position: absolute; top: 15px; right: 15px; z-index: 10; background: #fff; border-radius: 50%; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 10px rgba(0,0,0,0.1); text-indent: -9999px; text-decoration: none;}
.woocommerce-product-gallery__trigger::before { content: '🔍'; display: block; text-indent: 0; font-size: 16px; }

.product-details-section { padding: 25px 20px 10px 20px; }
.single-product-title { font-size: 18px; font-weight: 800; color: var(--primary-color); margin-bottom: 12px; line-height: 1.6; }
.single-product-price { font-size: 22px; font-weight: 800; color: var(--primary-color); margin-bottom: 15px; }
.product-short-description { font-size: 13px; color: var(--text-muted); line-height: 2; margin-bottom: 20px; padding: 15px; background: #f8fafc; border-radius: 12px; text-align: justify; }

.product-key-features { margin: 20px 0; padding: 15px; background: #f8fafc; border-radius: 12px; border: 1px solid #f1f5f9; }
.clean-features-list { list-style: none; padding: 0; margin: 0; }
.clean-features-list li { font-size: 13px; color: var(--text-main); margin-bottom: 8px; display: flex; align-items: center; }
.clean-features-list li:last-child { margin-bottom: 0; }
.feat-icon { font-size: 12px; margin-left: 8px; color: var(--primary-color); font-weight: 800; }

.product-meta-minimal { margin-top: 20px; padding-top: 20px; border-top: 1px dashed #e2e8f0; font-size: 12px; color: var(--text-muted); line-height: 2;}
.product-meta-minimal a { color: var(--primary-color); font-weight: 700; transition: 0.3s;}
.product-meta-minimal a:hover { color: var(--primary-gradient); }
.product-meta-minimal span { display: block; margin-bottom: 5px; }
.desc-content p, .desc-content { font-size: 14px; line-height: 2; color: var(--text-main); text-align: justify; }

/* =========================================
   صفحه فروشگاه (Shop Archive)
========================================= */
.shop-page-header { background: #fff; padding-bottom: 15px; margin-bottom: 15px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); }
.shop-title-row { display: flex; align-items: baseline; justify-content: space-between; padding: 5px 20px 0; gap: 10px; }
.shop-title { font-size: 19px; font-weight: 800; color: var(--primary-color); }
.shop-result-count { font-size: 12px; color: var(--text-muted); font-weight: 700; white-space: nowrap; }
.shop-archive-description { padding: 10px 20px 0; font-size: 13px; color: var(--text-muted); line-height: 1.9; }

.shop-subcats-scroll { display: flex; gap: 8px; overflow-x: auto; padding: 15px 20px 0; scrollbar-width: none; }
.shop-subcats-scroll::-webkit-scrollbar { display: none; }
.shop-subcat-chip { flex-shrink: 0; background: #f1f5f9; color: var(--text-main); font-size: 12px; font-weight: 700; padding: 8px 16px; border-radius: 20px; white-space: nowrap; transition: all 0.25s; }
.shop-subcat-chip:hover { background: var(--primary-color); color: #fff; }

.shop-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px 20px 0; }
.shop-ordering select { appearance: none; -webkit-appearance: none; background: #f1f5f9 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%2364748b" stroke-width="2"><path d="M6 9l6 6 6-6"/></svg>') no-repeat left 12px center; border: none; border-radius: 10px; padding: 10px 35px 10px 15px; font-size: 12px; font-weight: 700; color: var(--text-main); font-family: inherit; cursor: pointer; }
.shop-clear-filters { font-size: 12px; color: var(--brand-red); font-weight: 700; white-space: nowrap; }
.stock-badge { position: absolute; top: 10px; left: 10px; z-index: 5; background: #64748b; color: #fff; font-size: 11px; font-weight: 800; padding: 4px 10px; border-radius: 8px; }
.disabled-btn { background-color: #e2e8f0 !important; color: var(--text-muted) !important; }

.shop-pagination { display: flex; justify-content: center; padding: 10px 20px 30px; }
.shop-pagination .page-numbers { display: flex; list-style: none; gap: 8px; flex-wrap: wrap; justify-content: center; }
.shop-pagination .page-numbers li { display: flex; }
.shop-pagination .page-numbers a, .shop-pagination .page-numbers span { display: flex; align-items: center; justify-content: center; min-width: 36px; height: 36px; border-radius: 10px; background: #fff; color: var(--text-main); font-size: 13px; font-weight: 700; border: 1px solid #f1f5f9; transition: all 0.25s; }
.shop-pagination .page-numbers a:hover { background: var(--primary-color); color: #fff; border-color: var(--primary-color); }
.shop-pagination .page-numbers .current { background: var(--primary-color); color: #fff; border-color: var(--primary-color); }

.shop-empty-state { grid-column: 1 / -1; text-align: center; padding: 60px 20px; background: #fff; border-radius: 16px; margin: 0 20px; }
.shop-empty-state .empty-icon { font-size: 42px; margin-bottom: 15px; }
.shop-empty-state p { font-size: 14px; color: var(--text-muted); margin-bottom: 20px; }
.shop-empty-state .empty-cta { display: inline-block; background: var(--primary-color); color: #fff; font-size: 13px; font-weight: 700; padding: 12px 25px; border-radius: 12px; }

/* =========================================
   محصولات مرتبط
========================================= */
.related-products-section { padding: 20px; background: #fff; border-top: 1px solid #f1f5f9; margin-bottom: 30px;}
.related-products-section h2 { font-size: 16px; color: var(--primary-color); margin-bottom: 15px; font-weight: 800; }
.related-products-section ul.products { list-style: none !important; display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 15px !important; padding: 0 !important; margin: 0 !important; }
.related-products-section ul.products li.product { width: 100% !important; max-width: 100% !important; float: none !important; margin: 0 !important; clear: none !important; background-color: var(--card-bg); border-radius: 16px; padding: 12px; display: flex; flex-direction: column; box-shadow: 0 4px 15px rgba(0,0,0,0.03); border: 1px solid #f1f5f9; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1); position: relative; overflow: hidden; }
.related-products-section ul.products li.product:hover { transform: translateY(-8px); box-shadow: 0 15px 35px rgba(14, 90, 107,0.08); border-color: var(--primary-color); z-index: 10; }
.related-products-section ul.products li.product img { width: 100%; height: 200px; border-radius: 12px; margin-bottom: 12px; background-color: #fff; object-fit: contain; padding: 5px; transition: transform 0.5s ease; }
.related-products-section ul.products li.product:hover img { transform: scale(1.05); }
.related-products-section ul.products li.product .woocommerce-loop-product__title { font-size: 12px; font-weight: 700; color: var(--text-main); margin-bottom: 8px; line-height: 1.6; height: 38px; overflow: hidden; text-align: right;}
.related-products-section ul.products li.product .price { font-size: 13px; font-weight: 800; color: var(--primary-color); margin-top: auto; margin-bottom: 12px; display: block; text-align: right; white-space: nowrap;}
.related-products-section ul.products li.product .button { background-color: #f1f5f9; color: var(--primary-color); border: none; padding: 8px 5px; border-radius: 10px; font-size: 12px; font-weight: 700; width: 100%; display: block; text-align: center; transition: all 0.3s; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.related-products-section ul.products li.product:hover .button { background: var(--primary-color); color: #fff; }

/* =========================================
   سبد خرید دسکتاپ و چسبان موبایل
========================================= */
/* فرم افزودن به سبد خرید: در موبایل و دسکتاپ همیشه قابل مشاهده و کنار قیمت است (نوار چسبان حذف شد) */
.product-cart-form { display: block; width: 100%; }

.product-cart-form form.cart {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin: 0;
}

/* حذف بصری انتخاب تعداد: فعلاً همه محصولات به‌صورت تک‌عددی (دانه‌ای)
   فروخته می‌شوند و نیازی به این فیلد نیست. اینپوت همچنان در DOM باقی
   می‌ماند و با مقدار پیش‌فرض ۱ در فرم ارسال می‌شود، پس منطق افزودن به
   سبد خرید و سازگاری با ووکامرس دست‌نخورده باقی می‌ماند؛ فقط دیگر به
   کاربر نمایش داده نمی‌شود. */
.product-cart-form .quantity {
    display: none !important; /* !important: اسکریپت ووکامرس در محصول متغیر با ‎.show()‎ آن را دوباره نمایش می‌داد */
}

.product-cart-form .quantity input.qty {
    width: 56px;
    height: 46px;
    border: 2px solid #e2e8f0;
    border-radius: 12px;
    text-align: center;
    font-family: 'Vazirmatn', Tahoma, sans-serif !important;
    font-size: 15px;
    font-weight: 800;
    color: var(--primary-color);
    background: #ffffff;
    padding: 0;
    transition: border-color 0.3s;
}
.product-cart-form .quantity input.qty:focus {
    border-color: var(--primary-color);
    outline: none;
}
.product-cart-form .quantity input[type="number"]::-webkit-inner-spin-button,
.product-cart-form .quantity input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.product-cart-form .quantity input[type="number"] {
    -moz-appearance: textfield;
}

.product-cart-form button.single_add_to_cart_button {
    flex: 1;
    width: 100%;
    min-width: 140px;
    height: 48px;
    padding: 0 32px;
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
    border: none;
    border-radius: 12px;
    font-family: inherit;
    font-weight: 800;
    font-size: 15px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(14, 90, 107, 0.25);
    /* هدف لمسی حداقل ۴۴ پیکسل مطابق استاندارد دسترسی‌پذیری (WCAG) */
}
.product-cart-form button.single_add_to_cart_button:hover {
    background-color: var(--primary-gradient) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(14, 90, 107, 0.3);
}
.product-cart-form button.single_add_to_cart_button:disabled {
    background-color: #cbd5e1 !important;
    box-shadow: none;
    cursor: not-allowed;
    transform: none;
}

/* =========================================
   ووکامرس و پرداخت
========================================= */
.woocommerce { padding: 20px 15px; background: transparent; }
.woocommerce form .form-row { width: 100%; margin-bottom: 15px; }
.woocommerce form .form-row label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 8px; color: var(--text-main); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea { width: 100%; padding: 14px; border: 2px solid #f1f5f9; border-radius: 12px; font-family: inherit; font-size: 14px; background: #f8fafc; transition: border-color 0.3s; }
.woocommerce form .form-row input.input-text:focus { border-color: var(--primary-color); outline: none; }

/* =========================================
   تنظیمات دسکتاپ (Responsive)
========================================= */
@media (min-width: 768px) {

    .products-container { max-width: 1400px; margin: 0 auto; padding: 10px 5% 60px 5%; width: 100%;}
    .products-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important; gap: 30px; }
    .product-image { height: 320px; padding: 15px;}

    .site-footer { padding: 50px 0 20px; border-radius: 0; }
    .footer-widgets { grid-template-columns: repeat(4, 1fr); gap: 40px; }
    .footer-widget h4 { font-size: 13px; }
    .footer-widget p,
    .links-widget ul li a { font-size: 12px; }
    .breadcrumb-container { max-width: 1400px; margin: 20px auto 0 auto; padding: 0 5%; }
    
    .product-top-container { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; max-width: 1400px; margin: 30px auto; padding: 0 5%; background: transparent; box-shadow: none; border-radius: 0; }
    
    .product-gallery-section { background: #fff; border-radius: 16px; padding: 25px !important; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.03); border: 1px solid #f1f5f9; display: block;}
    .woocommerce-product-gallery__image { text-align: center; }
    .woocommerce-product-gallery__image img { border-radius: 12px; border: 1px solid #f1f5f9;}
    .woocommerce-product-gallery .flex-control-thumbs { justify-content: center; flex-wrap: wrap; padding-top: 20px; }
    .woocommerce-product-gallery .flex-control-thumbs li { width: 80px; }
    .woocommerce-product-gallery .flex-control-thumbs li img { border: 1px solid #e2e8f0; border-radius: 10px;}
    
    .product-details-section { background: transparent; padding: 0; }
    
    .related-products-section { max-width: 1400px; margin: 0 auto 50px auto; padding: 0 5%; background: transparent; border-top: none; }
    .related-products-section h2 { font-size: 20px; margin-bottom: 25px; }
    
    .related-products-section ul.products li.product img { height: 320px; padding: 15px; }
    .related-products-section ul.products li.product .woocommerce-loop-product__title { font-size: 12px; font-weight: 700; color: var(--text-main); margin-bottom: 8px; line-height: 1.6; height: 38px; overflow: hidden; text-align: right;}
    .related-products-section ul.products li.product .price { font-size: 13px; font-weight: 800; color: var(--primary-color); margin-top: auto; margin-bottom: 12px; display: block; text-align: right; white-space: nowrap;}
    .related-products-section ul.products li.product .button { padding: 14px 10px; font-size: 13px; white-space: nowrap; }

    
    .woocommerce { max-width: 1400px; margin: 40px auto; padding: 40px; }

    .shop-page-header { background: transparent; box-shadow: none; padding-bottom: 0; margin-bottom: 0; max-width: 1400px; margin-left: auto; margin-right: auto; }
    .breadcrumb-container { padding-left: 5%; padding-right: 5%; }
    .shop-title-row { padding: 5px 5% 0; align-items: center; }
    .shop-title { font-size: 26px; }
    .shop-archive-description { padding: 10px 5% 0; max-width: 900px; }
    .shop-subcats-scroll { padding: 20px 5% 0; flex-wrap: wrap; overflow: visible; }
    .shop-toolbar { padding: 20px 5% 0; }
    .shop-empty-state { margin: 0; }
}

/* =========================================
   استایل قیمت‌ها مشابه دیجی‌کالا
========================================= */
.product-price-box .product-price,
.single-product-price,
.related-products-section ul.products li.product .price {
    display: flex !important;
    flex-direction: column;
    align-items: flex-end; 
    justify-content: center;
    width: 100%;
    line-height: 1.4;
}

.product-price-box del,
.single-product-price del,
.related-products-section ul.products li.product .price del {
    color: #a1a3a8 !important;
    font-size: 13px !important;
    text-decoration: line-through;
    font-weight: normal;
    margin-bottom: 2px;
    display: block;
    opacity: 0.8;
}

.product-price-box ins,
.product-price-box .product-price > .woocommerce-Price-amount,
.single-product-price ins,
.single-product-price > .woocommerce-Price-amount,
.related-products-section ul.products li.product .price ins,
.related-products-section ul.products li.product .price > .woocommerce-Price-amount {
    color: var(--primary-color) !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    text-decoration: none;
    display: flex;
    align-items: baseline;
    gap: 4px;
    background: transparent !important;
}

.woocommerce-Price-currencySymbol {
    font-size: 12px !important;
    color: var(--text-muted) !important;
    font-weight: 400;
}

/* =========================================
   بازطراحی دکمه افزودن به سبد خرید
========================================= */
.product-card .add-to-cart-btn {
    background-color: var(--primary-color) !important; 
    color: #ffffff !important;
    border-radius: 8px; 
    font-size: 13px;
    font-weight: 800;
    padding: 10px 15px;
    margin-top: 12px;
    transition: all 0.3s ease;
    border: none;
    text-align: center;
    display: block;
}

.product-card .add-to-cart-btn:hover {
    background-color: var(--primary-gradient) !important; 
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(14, 90, 107, 0.2);
}

/* =========================================
   استایل بج درصد تخفیف مشابه دیجی‌کالا
========================================= */
.old-price-row {
    display: flex;
    align-items: center;
    justify-content: flex-end; 
    gap: 8px; 
    margin-bottom: 2px;
    width: 100%;
}

/* حالت اختصاصی: وقتی این ردیف داخل فرم خرید صفحه تکی محصول، درست بالای
   دکمه «افزودن به سبد خرید» قرار می‌گیرد، به فاصله بیشتری نسبت به حالت
   کارت محصول نیاز دارد تا از دکمه فاصله بگیرد و شلوغ به نظر نرسد */
.product-cart-form .old-price-row {
    margin-bottom: 6px;
}

/* بلوک کامل تخفیف (قیمت اصلی خط‌خورده + بج درصد + قیمت نهایی) که در صفحه
   تکی محصول، بالا و سمت چپ دکمه افزودن به سبد خرید نمایش داده می‌شود */
.single-product-discount-block {
    margin-bottom: 12px;
}
.single-product-discount-block .single-product-price {
    margin-bottom: 0 !important;
}

/* رفع تداخل با قانون کلی دسکتاپ (.product-action-box .single-product-price)
   که align-items:flex-start (یعنی راست، در RTL) روی همین المان هم اعمال
   می‌شد؛ این سلکتور اختصاصی‌تر (۳ کلاس در برابر ۲ کلاس) آن را override
   می‌کند تا قیمت نهایی هم مثل ردیف قیمت اصلی/بج، کاملاً چپ‌چین بماند */
.product-cart-form .single-product-discount-block .single-product-price {
    width: 100% !important;
    align-items: flex-end !important;
}

.dk-discount-badge {
    background-color: var(--brand-red) !important; 
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    padding: 0 7px;
    border-radius: 12px; 
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 20px;
    line-height: 1;
}

/* قیمت قبل از تخفیف داخل ردیف بج: مستقل از کلاس والد (هم در آرشیو فروشگاه
   با .product-price-box و هم در لیست کتاب‌های صفحه اصلی با .izang-book-price-wrap کار می‌کند) */
.old-price-row del {
    color: #a1a3a8;
    font-size: 12px;
    font-weight: 400;
    text-decoration: line-through;
    opacity: 0.85;
    white-space: nowrap;
}

.product-price-box del,
.single-product-price del,
.related-products-section ul.products li.product .price del {
    margin-bottom: 0 !important; 
}

.related-products-section span.onsale {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    margin: 0 !important;
    background: var(--accent-color) !important;
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    padding: 4px 10px !important;
    border-radius: 8px !important;
    min-height: 0 !important;
    min-width: 0 !important;
    line-height: 1.4 !important;
    text-align: center;
    z-index: 5;
}

@media (min-width: 768px) {
    /* ... سایر کدهای دسکتاپ ... */
    
    /* تثبیت دقیق ۴ محصول در یک ردیف برای جلوگیری از نامنظم شدن */
    .related-products-section ul.products { 
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important; 
        gap: 20px !important; 
        width: 100% !important;
    }
    
    }

/* =========================================
   باکس خرید (Action Box) صفحه محصول
========================================= */
.product-action-box {
    background: #f8fafc;
    border: 2px solid #f1f5f9;
    border-radius: 16px;
    padding: 20px;
    margin: 25px 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.product-action-box .single-product-price {
    margin-bottom: 0 !important;
}

@media (min-width: 768px) {
    .product-action-box {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: 25px;
        background: #ffffff;
        box-shadow: 0 5px 25px rgba(0,0,0,0.04);
        border-color: #e2e8f0;
    }

    .product-action-box .single-product-price {
        width: auto !important;
        align-items: flex-start !important;
    }

    .product-action-box .product-cart-form {
        width: auto;
        max-width: 340px;
    }

    /* حالت تخفیف‌دار: چون در این حالت div سمت راست (single-product-price)
       اصلاً چاپ نمی‌شود و فقط product-cart-form باقی می‌ماند، justify-content:
       space-between تنها فرزند باقی‌مانده را در ابتدای محور (که در RTL یعنی
       سمت راست) می‌نشاند و سمت چپ باکس خالی می‌ماند. با تغییر آن به flex-end
       (که در RTL معادل انتهای محور یعنی چپ است)، کل بلوک قیمت+دکمه به سمت
       چپ باکس منتقل می‌شود، دقیقاً هماهنگ با محل قرارگیری خودِ بلوک تخفیف. */
    .product-action-box.has-discount-only {
        justify-content: flex-end;
    }
}

#reviews, .reviews-container-inner {
    text-align: right;
    direction: rtl;
}
/* همه قوانین زیر فقط به نظرات محصول (#reviews ووکامرس) محدود شدند. قبلاً سراسری
   بودند و به دیدگاه‌های وبلاگ نشت می‌کردند: عنوان دیدگاه‌ها و «دیدگاهتان را
   بنویسید» مخفی می‌شد، تاریخ دیدگاه عمودی می‌شکست و ستاره‌های فرم همه پررنگ بودند. */

/* با seo-tab-heading جایگزین شده */
#reviews #comments-title, #reviews .comment-reply-title, #reviews h2.woocommerce-Reviews-title {
    display: none;
}

#reviews .commentlist {
    padding: 0 !important;
    margin: 0 0 40px 0 !important;
    list-style: none !important;
}

#reviews .commentlist li.comment, #reviews .commentlist li.review {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 20px !important;
    margin-bottom: 15px !important;
}

#reviews .commentlist li.comment .comment-body, #reviews .commentlist li.review .comment_container {
    display: flex !important;
    align-items: flex-start !important;
    gap: 15px !important;
}

#reviews .commentlist img.avatar {
    width: 50px !important;
    height: 50px !important;
    border-radius: 50% !important;
    border: 2px solid #f1f5f9 !important;
}

#reviews .commentlist .comment-text, #reviews .commentlist .comment-content {
    flex: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

#reviews .commentlist .meta, #reviews .commentlist .comment-meta {
    font-size: 12px !important;
    color: #94a3b8 !important;
    margin-bottom: 10px !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    border-bottom: 1px dashed #e2e8f0;
    padding-bottom: 8px;
}

#reviews .commentlist .meta strong, #reviews .comment-author cite {
    font-size: 14px !important;
    color: var(--primary-color) !important;
    font-weight: 800 !important;
    font-style: normal !important;
}

#reviews .commentlist li.review .star-rating {
    float: left !important;
    font-size: 13px !important;
    color: var(--attention-color) !important;
}
#reviews .commentlist li.review .star-rating span::before {
    color: var(--attention-color) !important;
}

#reviews .commentlist .description, #reviews .commentlist .comment-text p, #reviews .commentlist .comment-content p {
    font-size: 14px !important;
    line-height: 2 !important;
    color: #475569 !important;
    text-align: justify !important;
    margin-top: 5px !important;
}

#reviews #review_form_wrapper, #reviews #respond {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 16px !important;
    padding: 25px !important;
    margin-top: 20px;
}

#reviews .comment-form-rating {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    margin-bottom: 20px !important;
}
#reviews .comment-form-rating label {
    font-size: 13px !important;
    font-weight: 800 !important;
    color: var(--primary-color) !important;
    margin: 0 !important;
}
#reviews p.stars a {
    color: var(--attention-color) !important;
    font-size: 16px !important;
}

#reviews .comment-form-comment label, #reviews #commentform label {
    display: block !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    color: var(--primary-color) !important;
    margin-bottom: 8px !important;
}

#reviews .comment-form-comment textarea, #reviews #commentform input[type="text"], #reviews #commentform input[type="email"], #reviews #commentform textarea {
    width: 100% !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 12px !important;
    padding: 15px !important;
    font-family: inherit !important;
    font-size: 14px !important;
    background: #f8fafc !important;
    outline: none !important;
    transition: border-color 0.3s !important;
}

#reviews .comment-form-comment textarea {
    min-height: 120px !important;
    resize: vertical !important;
}

#reviews .comment-form-comment textarea:focus, #reviews #commentform input[type="text"]:focus, #reviews #commentform input[type="email"]:focus, #reviews #commentform textarea:focus {
    border-color: var(--primary-color) !important;
    background: #ffffff !important;
}

#reviews .form-submit {
    margin-bottom: 0 !important;
}

#reviews .form-submit input[type="submit"], #reviews #commentform #submit {
    background: var(--primary-color) !important;
    color: #ffffff !important;
    border: none !important;
    padding: 14px 40px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    margin-top: 10px !important;
}

#reviews .form-submit input[type="submit"]:hover, #reviews #commentform #submit:hover {
    background: var(--primary-gradient) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(14, 90, 107, 0.3) !important;
}

#reviews .comment-form-cookies-consent {
    display: none !important;
}

/* 
 * File: style.css (بخش Header) 
 * Description: استایل‌های بومی، Mobile-First و بدون فریم‌ورک
 */

/* متغیرهای رنگی اختصاصی برند آی‌زنگ اکنون در بلاک اصلی :root (ابتدای فایل) تعریف شده‌اند */

/* کلاس کمکی برای آینه کردن آیکون‌ها در حالت راست‌چین */
html[dir="rtl"] .rtl-mirror {
    transform: scaleX(-1);
}

/* دسترسی‌پذیری: پرش به محتوا */
.screen-reader-text {
    border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
    height: 1px; margin: -1px; overflow: hidden; padding: 0;
    position: absolute !important; width: 1px; word-wrap: normal !important;
}
.skip-link:focus {
    background-color: var(--izang-primary); color: var(--izang-white);
    clip: auto !important; clip-path: none; display: block;
    height: auto; left: 1rem; top: 1rem; padding: 1rem; width: auto; z-index: 100000;
}

/* کانتینر داخلی هدر و فوتر: بدون سقف عرض ثابت، کاملاً اج‌تواج (Edge-to-Edge)
   با پدینگ سیال (Fluid) تا در هر سایز صفحه، فاصله از لبه‌ها متناسب و یکسان بماند.
   نکته مهم (رفع باگ اج‌تواج نبودن هدر در single/single-product):
   قبلاً از یک کلاس عمومی و پرتکرار به نام «.container» استفاده می‌شد که
   نامش دقیقاً با کلاس‌های عمومی افزونه‌ها/کتابخانه‌های دیگر (Bootstrap،
   ووکامرس، Elementor و ...) یکی بود. هر افزونه‌ای که یک قانون
   «.container { max-width: ...; }» تعریف می‌کرد (مثلاً فقط در صفحات
   ووکامرس لود می‌شد)، بسته به ترتیب بارگذاری فایل‌های CSS می‌توانست این
   استایل را override کند و باعث می‌شد هدر/فوتر در بعضی صفحات (خصوصاً
   single-product.php) دیگر اج‌تواج نباشد. برای رفع قطعی این تداخل:
   ۱) کلاس در header.php/footer.php به «.header-inner» و «.footer-inner»
      تغییر کرد (کلاسی اختصاصی و بدون هم‌نامی با افزونه‌های دیگر).
   ۲) عرض با !important قفل شد تا حتی اگر افزونه‌ای در آینده دوباره یک
      کلاس هم‌نام تعریف کند، دیگر امکان بازنویسی این مقدار را نداشته باشد. */
.footer-inner {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    margin: 0 auto !important;
    padding: 0 4% !important;
}

.site-footer {
    width: 100% !important;
    max-width: none !important;
}
/* =========================================================
   بازطراحی کامل صفحه تک‌نوشته وبلاگ (single.php)
   هماهنگ با پالت رنگی برند، Mobile-First و WCAG AA
========================================================= */

/* نوار پیشرفت مطالعه */
.reading-progress-track {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    background: transparent;
    z-index: 1100;
}
.reading-progress-bar {
    height: 100%;
    width: 0%;
    background: var(--izang-primary);
    transition: width 0.1s linear;
}

/* -----------------------------------------------------------
   متغیرهای اختصاصی «حالت مطالعه» (Reading Mode)
   پالت ملایم و کم‌خستگی، مستقل از رنگ‌های تبلیغاتی/CTA برند
----------------------------------------------------------- */
.single-post-wrapper {
    background: transparent;
    padding: 16px 12px 50px;
    max-width: 980px;
    margin: 0 auto;
    width: 100%;
}

/* مسیر راهنما */
.post-breadcrumb {
    font-size: 12px;
    color: var(--read-text-secondary);
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 4px;
}
.post-breadcrumb a { color: var(--read-text-secondary); }
.post-breadcrumb a:hover { color: var(--read-accent); }
.post-breadcrumb .crumb-sep { color: #cbd5e1; }
.post-breadcrumb .crumb-current { color: var(--read-text); font-weight: 700; }

/* بعد: هدر جمع‌وجور، بدون کارت مجزا و بدون فاصله اضافه تا تصویر */
.post-header {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 4px 4px 16px;
    margin-bottom: 0;
}

.post-category {
    margin-bottom: 10px; /* قبلاً 15px */
}

.post-meta-data {
    border-top: none; /* حذف خط بی‌دلیل بالای متا وقتی دیگر داخل کارت نیست */
    padding-top: 0;
}

.post-category {
    display: inline-block;
    background: var(--read-red-soft-bg);
    color: var(--read-red-soft-text);
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 11.5px;
    font-weight: 800;
    margin-bottom: 15px;
    text-decoration: none;
    box-shadow: none;
    transition: background 0.25s, color 0.25s;
}
.post-category:hover { background: var(--izang-action); color: var(--text-main); }

.post-main-title {
    font-size: 22px;
    font-weight: 900;
    color: var(--read-text);
    line-height: 1.65;
    margin-bottom: 16px;
}

.post-meta-data {
    font-size: 12.5px;
    color: var(--read-text-secondary);
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    border-top: 1px dashed var(--read-border);
    padding-top: 15px;
}
.post-meta-data span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--read-bg);
    padding: 6px 12px;
    border-radius: 20px;
}
.post-author-avatar {
    border-radius: 50%;
    width: 22px;
    height: 22px;
}

/* بعد */
.post-thumbnail {
    width: 100%;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 18px; /* قبلاً 24px */
    box-shadow: 0 8px 20px rgba(38, 42, 51, 0.07);
    background: var(--izang-bg-light);
}
.post-thumbnail img { width: 100%; height: auto; display: block; }

/* چیدمان اصلی: تک‌ستونه و تمام‌عرض برای تجربه مطالعه حرفه‌ای‌تر (بدون سایدبار) */
.post-layout {
    display: block;
}

/* کارت محتوای مقاله (تایپوگرافیِ بهینه برای مطالعه طولانی) */
.post-body-content {
    background: var(--read-surface);
    border: 1px solid var(--read-border);
    border-radius: 20px;
    padding: 22px 18px;
    font-size: 16px;
    line-height: 2;
    color: var(--read-text);
    text-align: justify;
}
.post-body-content > *:first-child { margin-top: 0; }

.post-body-content h2, .post-body-content h3, .post-body-content h4 {
    color: var(--read-text);
    margin: 34px 0 16px;
    font-weight: 800;
    line-height: 1.7;
}
.post-body-content h2 { font-size: 19px; border-right: 4px solid var(--read-accent); padding-right: 12px; }
.post-body-content h3 { font-size: 17px; color: var(--read-accent); }
.post-body-content h4 { font-size: 15.5px; }
.post-body-content p { margin-bottom: 20px; }

/* محدود کردن عرض متن پاراگراف‌ها برای خوانایی حرفه‌ای، حتی وقتی کارت محتوا عریض‌تر است.
   عنوان و تصویر شاخص همچنان تمام‌عرض باقی می‌مانند (طبق استاندارد مجلات آنلاین) */
@media (min-width: 992px) {
    .post-body-content > p,
    .post-body-content > ul,
    .post-body-content > ol,
    .post-body-content > h2,
    .post-body-content > h3,
    .post-body-content > h4,
    .post-body-content > blockquote,
    .post-body-content > table {
        max-width: 760px;
        margin-left: auto;
        margin-right: auto;
    }
}

.post-body-content a {
    color: var(--read-accent);
    text-decoration: none;
    font-weight: 700;
    border-bottom: 1px dashed var(--read-accent);
    transition: border-color 0.2s;
}
.post-body-content a:hover { border-bottom-style: solid; }

.post-body-content img {
    max-width: 100%;
    height: auto;
    border-radius: 14px;
    margin: 22px auto;
    display: block;
    box-shadow: 0 6px 18px rgba(38, 42, 51, 0.06);
}
.post-body-content figcaption {
    text-align: center;
    font-size: 12px;
    color: var(--read-text-secondary);
    margin-top: -12px;
    margin-bottom: 20px;
}

.post-body-content ul { list-style: none; margin: 0 0 20px; padding-right: 4px; }
.post-body-content ul > li {
    position: relative;
    padding-right: 22px;
    margin-bottom: 10px;
}
.post-body-content ul > li::before {
    content: '';
    position: absolute;
    right: 0;
    top: 10px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--read-accent);
}
.post-body-content ol { margin: 0 0 20px; padding-right: 20px; color: var(--read-text); }
.post-body-content ol > li { margin-bottom: 10px; }

.post-body-content blockquote {
    background: var(--read-accent-soft);
    border-right: 4px solid var(--izang-action);
    padding: 16px 20px;
    margin: 24px 0;
    border-radius: 4px 16px 16px 4px;
    color: var(--read-text-secondary);
    font-style: normal;
    font-size: 15px;
}
.post-body-content blockquote p:last-child { margin-bottom: 0; }

/* بلوک‌های کد (برای محتوای آموزشی HTML/برنامه‌نویسی) */
.post-body-content code {
    background: #eef0f6;
    color: #4338ca;
    padding: 2px 7px;
    border-radius: 6px;
    font-size: 13px;
    direction: ltr;
    display: inline-block;
    font-family: 'Courier New', monospace;
}
.post-body-content pre {
    background: #1e2130;
    color: #e5e7eb;
    padding: 18px;
    border-radius: 14px;
    overflow-x: auto;
    margin: 22px 0;
    direction: ltr;
    text-align: left;
    font-size: 13px;
    line-height: 1.8;
    -webkit-overflow-scrolling: touch;
}
.post-body-content pre code { background: transparent; color: inherit; padding: 0; }

/* جدول‌ها */
.post-body-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 22px 0;
    font-size: 14px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--read-border);
}
.post-body-content th, .post-body-content td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--read-border);
    text-align: right;
}
.post-body-content th { background: var(--read-bg); font-weight: 800; color: var(--read-text); }
.post-body-content tr:last-child td { border-bottom: none; }

.post-body-content hr { border: none; border-top: 1px dashed var(--read-border); margin: 30px 0; }

/* برچسب‌های موضوعی */
.post-tags-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 24px 0 0;
    padding-top: 20px;
    border-top: 1px dashed var(--read-border);
}
.post-tag-chip {
    background: var(--read-bg);
    color: var(--read-text-secondary);
    font-size: 12px;
    font-weight: 700;
    padding: 7px 15px;
    border-radius: 20px;
    text-decoration: none;
    transition: 0.25s;
    border: 1px solid var(--read-border);
}
.post-tag-chip:hover { background: var(--read-accent); color: #ffffff; border-color: var(--read-accent); }

/* جعبه اشتراک‌گذاری */
.post-share-box {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin: 24px 0 0;
    padding: 16px 18px;
    background: var(--read-bg);
    border-radius: 16px;
}
.share-label { font-size: 13px; font-weight: 800; color: var(--read-text); margin-left: 4px; }
.share-btn {
    width: 38px; height: 38px;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--read-surface);
    color: var(--read-text-secondary);
    border: 1px solid var(--read-border);
    cursor: pointer;
    transition: all 0.25s;
    font-family: inherit;
    flex-shrink: 0;
}
.share-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0,0,0,0.08); }
.share-telegram:hover { background: #24A1DE; color: #fff; border-color: #24A1DE; }
.share-whatsapp:hover { background: #25D366; color: #fff; border-color: #25D366; }
.share-x:hover { background: #000000; color: #fff; border-color: #000000; }
.share-copy { width: auto; padding: 0 16px; border-radius: 20px; gap: 6px; font-size: 12px; font-weight: 700; }
.share-copy.copied { background: var(--read-accent); color: #fff; border-color: var(--read-accent); }

/* باکس نویسنده */
.post-author-box {
    display: flex;
    gap: 16px;
    align-items: center;
    background: var(--read-surface);
    border: 1px solid var(--read-border);
    border-radius: 18px;
    padding: 20px;
    margin: 24px 0 0;
}
.author-box-avatar { border-radius: 50%; flex-shrink: 0; width: 56px !important; height: 56px !important; }
.author-box-content { min-width: 0; }
.author-box-label { font-size: 12px; color: var(--read-text-secondary); font-weight: 700; letter-spacing: 0.3px; }
.author-box-name { font-size: 16px; font-weight: 800; color: var(--read-text); margin: 4px 0 8px; }
.author-box-bio { font-size: 13px; color: var(--read-text-secondary); line-height: 1.9; }

/* ناوبری مطلب قبلی/بعدی */
.post-nav-links {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin: 24px 0 0;
}
.post-nav-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    background: var(--read-surface);
    border: 1px solid var(--read-border);
    border-radius: 16px;
    text-decoration: none;
    transition: all 0.25s;
}
.post-nav-item:hover { border-color: var(--read-accent); box-shadow: 0 8px 20px rgba(38,42,51,0.06); }
.post-nav-item small { display: block; font-size: 12px; color: var(--read-text-secondary); margin-bottom: 4px; font-weight: 700; }
.post-nav-item strong { display: block; font-size: 13.5px; color: var(--read-text); line-height: 1.6; }
.post-nav-next { text-align: left; }
.post-nav-arrow {
    font-size: 18px;
    color: var(--read-accent);
    flex-shrink: 0;
    width: 34px; height: 34px;
    background: var(--read-accent-soft);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}

/* فهرست مطالب خودکار (Table of Contents) — فقط برای مقالات با ۳+ زیرعنوان نمایش داده می‌شود */
.post-toc {
    background: var(--read-bg);
    border: 1px solid var(--read-border);
    border-radius: 16px;
    padding: 16px 18px;
    margin: 0 0 28px;
}
.post-toc-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
    font-family: inherit;
}
.post-toc-toggle-text {
    font-size: 14px;
    font-weight: 800;
    color: var(--read-text);
}
.post-toc-toggle-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    position: relative;
}
.post-toc-toggle-icon::before,
.post-toc-toggle-icon::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    background: var(--read-accent);
    transition: transform 0.25s ease;
}
.post-toc-toggle-icon::before { width: 12px; height: 2px; transform: translate(-50%, -50%); }
.post-toc-toggle-icon::after { width: 2px; height: 12px; transform: translate(-50%, -50%); }
.post-toc-toggle[aria-expanded="true"] .post-toc-toggle-icon::after { transform: translate(-50%, -50%) scaleY(0); }

.post-toc-list {
    list-style: none;
    margin: 14px 0 0;
    padding: 14px 0 0;
    border-top: 1px dashed var(--read-border);
    display: flex;
    flex-direction: column;
    gap: 9px;
}
.post-toc-toggle[aria-expanded="false"] + .post-toc-list { display: none; }
.post-toc-item a {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--read-text-secondary);
    text-decoration: none;
    transition: color 0.2s;
    display: inline-block;
}
.post-toc-item a:hover { color: var(--read-accent); }
.post-toc-item.post-toc-h3 { padding-right: 18px; }
.post-toc-item.post-toc-h3 a { font-size: 13px; }

/* مطالب مرتبط */
.related-posts-section { margin-top: 36px; padding-top: 28px; border-top: 1px dashed var(--read-border); }
.related-posts-title { font-size: 17px; font-weight: 800; color: var(--read-text); margin-bottom: 18px; }
.related-posts-grid { display: grid; grid-template-columns: 1fr; gap: 18px; }
.related-post-card { background: var(--read-surface); border: 1px solid var(--read-border); border-radius: 16px; overflow: hidden; transition: all 0.3s; }
.related-post-card:hover { transform: translateY(-4px); box-shadow: 0 15px 30px rgba(38,42,51,0.08); border-color: var(--read-accent); }
.related-post-image { display: block; height: 150px; background: var(--read-bg); }
.related-post-image img { width: 100%; height: 100%; object-fit: cover; }
.related-post-placeholder { display: flex; align-items: center; justify-content: center; height: 100%; font-size: 32px; }
.related-post-title { font-size: 14px; font-weight: 800; padding: 14px 14px 6px; line-height: 1.6; }
.related-post-title a { color: var(--read-text); text-decoration: none; }
.related-post-title a:hover { color: var(--read-accent); }
.related-post-date { display: block; font-size: 12px; color: var(--read-text-secondary); padding: 0 14px 14px; }

/* بخش دیدگاه‌ها (comments.php) — ادغام‌شده داخل کارت محتوای اصلی، بدون جعبه مجزا */
.post-comments-inline { margin-top: 36px; padding-top: 28px; border-top: 1px dashed var(--read-border); }
.comment-navigation {
    margin: 20px 0 0;
    display: flex;
    justify-content: center;
    gap: 10px;
}
.comment-navigation a {
    background: var(--read-surface);
    border: 1px solid var(--read-border);
    padding: 8px 16px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: 700;
    color: var(--read-text);
    text-decoration: none;
    transition: 0.25s;
}
.comment-navigation a:hover { background: var(--read-accent); color: #fff; border-color: var(--read-accent); }
.no-comments {
    background: var(--read-bg);
    border-radius: 12px;
    padding: 16px;
    font-size: 13px;
    color: var(--read-text-secondary);
    text-align: center;
}

/* رسپانسیو دسکتاپ */
@media (min-width: 768px) {
    .single-post-wrapper { padding: 30px 24px 60px; }
    .post-header { padding: 4px 4px 20px; }
    .post-main-title { font-size: 28px; }
    .post-body-content { padding: 40px; font-size: 17px; }
    .post-body-content h2 { font-size: 23px; }
    .related-posts-grid { grid-template-columns: repeat(3, 1fr); }
    .post-nav-links { grid-template-columns: 1fr 1fr; }
}
/* =========================================
   محل قرارگیری: انتهای فایل style.css
   هدف: رفع باگ حاشیه‌های خالی هدر در صفحات محصول (ووکامرس)
========================================= */

/* ۱. بازنشانی استایل‌های تگ body که توسط کلاس عمومی ووکامرس جمع شده بود */
body.woocommerce,
body.woocommerce-page {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    /* حفظ رنگ پس‌زمینه پایه آی‌زنگ */
    background-color: #f4f6f9 !important; 
}

/* ۲. تضمین تمام‌عرض بودن هدر و جلوگیری از تأثیر پدینگ‌های ووکامرس */
body.woocommerce #colophon.site-footer {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    left: 0;
    right: 0;
}

/* ۳. حفظ ساختار واکنش‌گرای محتوای اصلی محصول (بدون تأثیر روی هدر) */
body.woocommerce .single-product-wrapper {
    max-width: 1400px;
    margin: 0 auto;
}
/* =========================================
   تب‌بندی محصول (Product Tabs - Digikala Style)
   محل قرارگیری: style.css
========================================= */
.product-tabs-wrapper {
    background: var(--izang-white);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    margin: 25px 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    overflow: hidden;
    direction: rtl;
}

@media (min-width: 768px) {
    .product-tabs-wrapper {
        max-width: 1400px;
        margin: 0 auto 40px auto;
        width: 90%;
    }
}

/* نوار دکمه‌های تب */
.product-tabs-nav {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    overflow-x: auto;
    scrollbar-width: none;
}
.product-tabs-nav::-webkit-scrollbar { display: none; }

.tab-item { flex: 0 0 auto; }

.tab-btn {
    padding: 18px 25px;
    background: transparent;
    border: none;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    color: var(--izang-text-secondary);
    cursor: pointer;
    position: relative;
    transition: all 0.3s;
}

.tab-item.active .tab-btn {
    color: var(--izang-primary);
}

/* خط زیر تب فعال */
.tab-item.active .tab-btn::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--izang-primary);
    border-radius: 3px 3px 0 0;
}

.tab-count {
    background: #e2e8f0;
    color: var(--text-main);
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 10px;
    margin-right: 6px;
}

.tab-item.active .tab-count {
    background: var(--izang-primary);
    color: #fff;
}

/* پانل محتوای تب */
.tab-panel {
    display: none; /* مخفی بودن در حالت عادی */
    padding: 25px;
    animation: fadeInTab 0.4s ease;
}

.tab-panel.active {
    display: block; /* نمایش تب فعال */
}

/* عنوان سئو-فرندلی داخل هر تب، جایگزین عناوین پیش‌فرض ووکامرس */
.seo-tab-heading {
    font-size: 16px;
    font-weight: 800;
    color: var(--primary-color);
    margin-bottom: 20px;
    border-bottom: 2px dashed #e2e8f0;
    padding-bottom: 10px;
}

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

.no-content-msg { text-align: center; color: var(--text-muted); font-size: 13px; padding: 40px 0; }

/* =========================================
   رفع قطعی مشکل چیدمان ۴ ستونه محصولات مرتبط
========================================= */
/* ۱. حذف شبه‌عناصر مزاحم ووکامرس که گرید را می‌شکنند */
.related-products-section ul.products::before,
.related-products-section ul.products::after {
    display: none !important;
    content: none !important;
}

/* ۲. قفل کردن روی ۴ ستون دقیق در دسکتاپ */
@media (min-width: 992px) {
    .related-products-section ul.products {
        display: grid !important;
        grid-template-columns: repeat(4, 1fr) !important; /* اجبار به ۴ ستون مساوی */
        gap: 20px !important;
        width: 100% !important;
    }
    
    /* ۳. حذف مارجین‌ها و clear های پیش‌فرض ووکامرس از روی تک‌تک محصولات */
    .related-products-section ul.products li.product {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        clear: none !important;
        float: none !important; /* خنثی کردن float های قدیمی ووکامرس */
    }
}

/* برای تبلت (۲ ستون) */
@media (max-width: 991px) and (min-width: 768px) {
    .related-products-section ul.products {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }
}


/* =========================================
   رفع تداخل کشوی فیلتر با نوار مدیریت وردپرس (Admin Bar)
   دقیقاً هم‌راستا با منطق موجود برای .site-header در style.css
========================================= */
body.admin-bar .shop-filter-drawer {
    top: 32px;
}
@media screen and (max-width: 782px) {
    body.admin-bar .shop-filter-drawer {
        top: 46px;
    }
}
@media screen and (max-width: 600px) {
    body.admin-bar .shop-filter-drawer {
        top: 0;
    }
}

/* اطمینان از اینکه کشو همیشه بالاتر از هر عنصر دیگری (به‌جز خود ادمین‌بار) باشد */
.shop-filter-drawer {
    z-index: 99998; /* یک واحد پایین‌تر از ادمین‌بار (99999) تا زیرش قرار بگیرد نه پشتش */
}

/* =========================================
   بازطراحی صفحه سبد خرید (WooCommerce Cart)
   محل قرارگیری: انتهای style.css
========================================= */

.izang-cart-page {
    max-width: 1400px;
    margin: 0 auto;
    padding: 15px 15px 60px;
    direction: rtl;
}

.cart-page-header { margin: 15px 4px 20px; }
.cart-page-title {
    font-size: 20px;
    font-weight: 900;
    color: var(--text-main);
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.cart-page-count {
    font-size: 12px;
    font-weight: 800;
    background: var(--bg-color);
    color: var(--text-muted);
    padding: 4px 12px;
    border-radius: 20px;
    border: 1px solid #e2e8f0;
}

.cart-page-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    align-items: start;
}

.cart-items-list { display: flex; flex-direction: column; gap: 14px; }

/* --- کارت هر آیتم سبد خرید --- */
.cart-item-card {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 14px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    transition: box-shadow .3s ease, border-color .3s ease;
}
.cart-item-card:hover { border-color: #e2e8f0; box-shadow: 0 8px 20px rgba(0,0,0,0.05); }

.cart-item-top-row { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 12px; }

.cart-item-thumb {
    width: 64px; height: 64px; flex-shrink: 0;
    border-radius: 10px; overflow: hidden;
    background: #f8fafc;
    display: flex; align-items: center; justify-content: center;
}
.cart-item-thumb img { width: 100%; height: 100%; object-fit: contain; }

.cart-item-info { flex: 1; min-width: 0; }
.cart-item-title { font-size: 13.5px; font-weight: 800; line-height: 1.6; margin-bottom: 4px; }
.cart-item-title a { color: var(--text-main); }
.cart-item-title a:hover { color: var(--primary-color); }
.cart-item-meta { font-size: 11.5px; color: var(--text-muted); line-height: 1.8; }
.cart-item-meta p { margin: 0; }
.backorder_notification { font-size: 12px; color: var(--brand-red); margin-top: 4px; font-weight: 700; }

.cart-item-remove { flex-shrink: 0; }
.cart-item-remove .remove {
    width: 30px; height: 30px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: #f8fafc;
    color: #94a3b8;
    font-size: 18px;
    line-height: 1;
    text-decoration: none;
    transition: all .25s ease;
}
.cart-item-remove .remove:hover { background: var(--brand-red); color: #fff; }
.cart-item-remove .remove:focus-visible { outline: 2px solid var(--brand-red); outline-offset: 2px; }

.cart-item-bottom-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 12px;
    border-top: 1px dashed #eef0f5;
}
.cart-item-price-block,
.cart-item-qty-block,
.cart-item-subtotal-block { display: flex; flex-direction: column; gap: 4px; }
.cart-item-subtotal-block { align-items: flex-end; margin-inline-start: auto; }
.cart-item-block-label { font-size: 11.5px; color: #94a3b8; font-weight: 700; }
.cart-item-price .amount { color: var(--text-muted); font-weight: 700; font-size: 12.5px; }
.cart-item-subtotal .amount { color: var(--primary-color); font-weight: 800; font-size: 14px; }

/* اینپوت تعداد + دکمه‌های استپر جاوااسکریپتی */
.cart-item-qty-block input.qty {
    width: 56px; height: 38px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    text-align: center;
    font-weight: 800;
    font-size: 13px;
    color: var(--primary-color);
    background: #fff;
    font-family: inherit;
}
.cart-item-qty-block input.qty:focus { border-color: var(--primary-color); outline: none; }
.cart-item-qty-block input[type=number]::-webkit-inner-spin-button,
.cart-item-qty-block input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.cart-item-qty-block input[type=number] { -moz-appearance: textfield; }

.izang-qty-stepper { display: flex; align-items: center; gap: 6px; }
.izang-qty-btn {
    width: 30px; height: 30px;
    border-radius: 8px;
    border: 2px solid #e2e8f0;
    background: #f8fafc;
    color: var(--primary-color);
    font-size: 16px; font-weight: 800;
    cursor: pointer;
    font-family: inherit;
    transition: all .2s ease;
    flex-shrink: 0;
}
.izang-qty-btn:hover { background: var(--primary-color); color: #fff; border-color: var(--primary-color); }
.izang-qty-btn:focus-visible { outline: 2px solid var(--primary-color); outline-offset: 2px; }

/* --- اکشن‌های پایین فرم (کوپن + بروزرسانی) --- */
.cart-page-actions {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px dashed #e2e8f0;
}
.cart-coupon-box { display: flex; flex-direction: column; gap: 8px; }
.cart-coupon-label { font-size: 12.5px; font-weight: 800; color: var(--text-main); }
.cart-coupon-inputs { display: flex; gap: 8px; flex-wrap: wrap; }
.cart-coupon-inputs input#coupon_code {
    flex: 1; min-width: 160px;
    padding: 12px 14px;
    border: 2px solid #f1f5f9;
    border-radius: 10px;
    font-family: inherit;
    font-size: 13px;
    background: #f8fafc;
}
.cart-coupon-inputs input#coupon_code:focus { border-color: var(--primary-color); background: #fff; outline: none; }

.cart-btn-outline, .cart-btn-secondary {
    display: inline-flex; align-items: center; justify-content: center;
    padding: 12px 22px;
    border-radius: 10px;
    font-weight: 800;
    font-size: 13px;
    border: none;
    cursor: pointer;
    font-family: inherit;
    text-decoration: none;
    transition: all .25s ease;
    white-space: nowrap;
}
.cart-btn-outline { background: #f8fafc; color: var(--primary-color); border: 2px solid #e2e8f0; }
.cart-btn-outline:hover { background: var(--primary-color); color: #fff; border-color: var(--primary-color); }
.cart-btn-secondary { background: #f1f5f9; color: var(--text-main); align-self: flex-start; }
.cart-btn-secondary:hover { background: var(--primary-color); color: #fff; }
.cart-btn-outline:focus-visible,
.cart-btn-secondary:focus-visible { outline: 2px solid var(--primary-color); outline-offset: 2px; }

.cart-continue-shopping {
    display: inline-flex; align-items: center; gap: 8px;
    font-size: 13px; font-weight: 800; color: var(--primary-color);
    margin-top: 15px; padding: 4px;
}
.cart-continue-shopping:hover { text-decoration: underline; }

/* --- ستون خلاصه سفارش (خروجی هسته ووکامرس: cart-totals.php) --- */
.cart-summary-column .cart_totals,
.cart-summary-column table.shop_table {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    width: 100%;
    border-collapse: collapse;
}
.cart-summary-column .cart_totals h2 {
    font-size: 16px; font-weight: 800; color: var(--primary-color);
    margin-bottom: 15px; padding-bottom: 12px; border-bottom: 1px dashed #e2e8f0;
}
.cart-summary-column table.shop_table th,
.cart-summary-column table.shop_table td {
    padding: 12px 0; font-size: 13px; color: var(--text-main);
    border-bottom: 1px dashed #f1f5f9; text-align: right;
}
.cart-summary-column table.shop_table tr:last-child th,
.cart-summary-column table.shop_table tr:last-child td { border-bottom: none; }
.cart-summary-column .order-total .amount { color: var(--primary-color); font-size: 17px; font-weight: 800; }

.cart-summary-column .wc-proceed-to-checkout { margin-top: 15px; }
.cart-summary-column .checkout-button {
    display: block; width: 100%; text-align: center;
    padding: 16px; border-radius: 12px;
    font-weight: 800; font-size: 15px;
    transition: transform .25s ease;
}
.cart-summary-column .checkout-button:hover { transform: translateY(-2px); }

.cart-summary-column .shipping-calculator-form { margin-top: 10px; font-size: 13px; }
.cart-summary-column .shipping-calculator-button { color: var(--primary-color); font-weight: 700; font-size: 12px; }

/* --- حالت سبد خرید خالی (در صورت استفاده از cart-empty.php پیشنهادی) --- */
.cart-empty-state {
    text-align: center;
    padding: 60px 20px;
    background: var(--card-bg);
    border-radius: 20px;
    max-width: 600px;
    margin: 40px auto;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
}
.cart-empty-icon { font-size: 50px; margin-bottom: 15px; }
.cart-empty-state p { font-size: 14px; color: var(--text-muted); margin-bottom: 25px; }

/* --- دسکتاپ: چیدمان دو ستونه با سایدبار چسبان (Sticky Sidebar) --- */
@media (min-width: 992px) {
    .izang-cart-page { padding: 30px 5% 80px; }
    .cart-page-layout { grid-template-columns: 2fr 1fr; gap: 30px; }
    .cart-summary-sticky { position: sticky; top: 100px; } /* هم‌راستا با ارتفاع هدر چسبان (80px) */
    .cart-item-card { padding: 18px; }
}

/* هماهنگی سایدبار چسبان با نوار مدیریت وردپرس (Admin Bar)، مطابق منطق موجود در فایل */
body.admin-bar .cart-summary-sticky { top: 132px; }


/* =========================================================================
   File: style.css  (این بلوک را به انتهای style.css قالب آی‌زنگ اضافه کنید)
   Description: استایل‌های اختصاصی مسیر پرداخت (Checkout) آی‌زنگ
   هماهنگ با متغیرهای رنگی برند و کلاس‌های موجود سبد خرید (cart-item-card,
   cart-btn-outline, izang-btn-primary و ...)
   ========================================================================= */

/* -----------------------------------------------------------------------
   ساختار کلی صفحه چک‌اوت
----------------------------------------------------------------------- */
.izang-checkout-page {
    max-width: 1400px;
    margin: 0 auto;
    padding: 15px 15px 100px;
    direction: rtl;
}

.izang-checkout-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    margin: 10px 4px 20px;
}
.izang-checkout-title {
    font-size: 19px;
    font-weight: 900;
    color: var(--text-main);
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.izang-checkout-title svg { color: var(--primary-color); flex-shrink: 0; }
.izang-checkout-back-cart {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text-muted);
    background: var(--card-bg);
    border: 1px solid #e2e8f0;
    padding: 8px 14px;
    border-radius: 10px;
    transition: all .25s;
}
.izang-checkout-back-cart:hover { color: var(--primary-color); border-color: var(--primary-color); }
.izang-checkout-notice {
    background: var(--card-bg);
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 20px;
    font-size: 13px;
    color: var(--text-muted);
    text-align: center;
}

/* چیدمان دو ستونه: در موبایل تک‌ستونه با خلاصه سفارش اول، بعد فرم، بعد پرداخت */
.izang-checkout-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
}
.checkout-col-summary { order: 1; }
.checkout-col-main { order: 2; }

.izang-section-card {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 18px;
    padding: 18px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    margin-bottom: 16px;
}
.izang-section-card:last-child { margin-bottom: 0; }

.izang-section-title {
    font-size: 15px;
    font-weight: 800;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #e2e8f0;
}
.izang-section-title svg { flex-shrink: 0; }

.izang-form-block { margin-bottom: 20px; }
.izang-form-block:last-child { margin-bottom: 0; }

/* گرید دو ستونه فیلدهای فرم (نام/نام‌خانوادگی، ایمیل/تلفن و ...) */
.izang-fields-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0 15px;
}
.izang-fields-grid .form-row-wide,
.izang-fields-grid .form-row:not(.form-row-first):not(.form-row-last) {
    grid-column: 1 / -1;
}

.izang-create-account-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    font-weight: 700;
    color: var(--text-main);
    cursor: pointer;
    margin-bottom: 16px;
}
.izang-create-account-toggle input[type="checkbox"] {
    width: 20px; height: 20px;
    accent-color: var(--primary-color);
    cursor: pointer;
    flex-shrink: 0;
}

/* -----------------------------------------------------------------------
   کارت کد تخفیف
----------------------------------------------------------------------- */
.izang-coupon-wrapper { margin-top: 4px; }
.izang-coupon-toggle-row .woocommerce-info,
.izang-coupon-toggle-row p { background: transparent; padding: 0; border: none; margin: 0; }
.izang-coupon-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--primary-color);
}
.izang-coupon-inputs { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.izang-coupon-inputs input#coupon_code {
    flex: 1;
    min-width: 140px;
    padding: 11px 14px;
    border: 2px solid #f1f5f9;
    border-radius: 10px;
    font-family: inherit;
    font-size: 13px;
    background: var(--bg-color);
}
.izang-coupon-inputs input#coupon_code:focus { border-color: var(--primary-color); outline: none; background: #fff; }

/* -----------------------------------------------------------------------
   کارت ورود مشتری قبلی
----------------------------------------------------------------------- */
.izang-login-notice-row .woocommerce-info { background: transparent; padding: 0; border: none; margin: 0 0 16px; font-size: 12.5px; color: var(--text-muted); }
.izang-login-toggle { color: var(--primary-color); font-weight: 800; }
.woocommerce-form-login {
    background: var(--bg-color);
    border: 1px dashed #e2e8f0;
    border-radius: 14px;
    padding: 18px;
    margin-bottom: 20px;
}

/* -----------------------------------------------------------------------
   خلاصه سفارش (ستون کناری/چسبان)
----------------------------------------------------------------------- */
.izang-order-review-card { padding: 0; overflow: hidden; }
.izang-review-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--bg-color);
    border: none;
    padding: 18px;
    cursor: pointer;
    font-family: inherit;
}
.izang-review-toggle-text {
    font-size: 14.5px;
    font-weight: 800;
    color: var(--text-main);
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.izang-review-count {
    background: var(--primary-color);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    padding: 2px 9px;
    border-radius: 20px;
}
.izang-review-toggle-icon {
    width: 20px; height: 20px; position: relative; flex-shrink: 0;
    transition: transform .3s;
}
.izang-review-toggle-icon::before,
.izang-review-toggle-icon::after {
    content: ''; position: absolute; top: 50%; left: 50%;
    background: var(--text-main);
    transition: transform .25s ease;
}
.izang-review-toggle-icon::before { width: 12px; height: 2px; transform: translate(-50%,-50%); }
.izang-review-toggle-icon::after { width: 2px; height: 12px; transform: translate(-50%,-50%); }
.izang-review-toggle[aria-expanded="true"] .izang-review-toggle-icon::after { transform: translate(-50%,-50%) scaleY(0); }

.izang-review-body { padding: 18px; }

.izang-review-items { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.izang-review-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #f1f5f9;
}
.izang-review-item:last-child { border-bottom: none; padding-bottom: 0; }
.izang-review-item-thumb {
    width: 50px; height: 50px; flex-shrink: 0;
    border-radius: 10px; overflow: hidden;
    background: var(--bg-color);
    display: flex; align-items: center; justify-content: center;
}
.izang-review-item-thumb img { width: 100%; height: 100%; object-fit: contain; }
.izang-review-item-info { flex: 1; min-width: 0; }
.izang-review-item-title { display: block; font-size: 13px; font-weight: 700; color: var(--text-main); line-height: 1.6; }
.izang-review-item-title a { color: inherit; }
.izang-review-item-qty { display: block; font-size: 11.5px; color: var(--text-muted); margin-top: 4px; }
.izang-review-item-subtotal { font-size: 13px; font-weight: 800; color: var(--primary-color); white-space: nowrap; flex-shrink: 0; }

.izang-review-totals-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.izang-review-totals-table th,
.izang-review-totals-table td { padding: 10px 0; text-align: right; border-bottom: 1px dashed #f1f5f9; color: var(--text-main); font-weight: 700; }
.izang-review-totals-table td { text-align: left; font-weight: 800; }
.izang-review-totals-table tr:last-child th,
.izang-review-totals-table tr:last-child td { border-bottom: none; }
.izang-review-totals-table .order-total th,
.izang-review-totals-table .order-total td { font-size: 15px; color: var(--primary-color); padding-top: 14px; }
.izang-review-totals-table .order-total td .woocommerce-Price-amount { color: var(--primary-color); }

/* -----------------------------------------------------------------------
   بخش پذیرش قوانین
----------------------------------------------------------------------- */
.izang-terms-wrapper { margin: 18px 0; }
.izang-terms-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.9;
    cursor: pointer;
}
.izang-terms-row input[type="checkbox"] {
    width: 20px; height: 20px; flex-shrink: 0; margin-top: 2px;
    accent-color: var(--primary-color);
    cursor: pointer;
}
.izang-terms-row a { color: var(--primary-color); font-weight: 700; }

/* -----------------------------------------------------------------------
   روش‌های پرداخت (Radio Cards)
----------------------------------------------------------------------- */
.izang-payment-methods { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.izang-payment-method {
    border: 2px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px 16px;
    position: relative;
    transition: all .25s;
    background: var(--bg-color);
}
.izang-payment-method:has(input:checked) {
    border-color: var(--primary-color);
    background: rgba(14, 90, 107, 0.03);
    box-shadow: 0 4px 15px rgba(14, 90, 107,0.08);
}
.izang-payment-method input.input-radio {
    appearance: none; -webkit-appearance: none;
    width: 20px; height: 20px;
    border: 2px solid #cbd5e1;
    border-radius: 50%;
    position: absolute;
    top: 16px;
    right: 16px;
    margin: 0;
    cursor: pointer;
    background: #fff;
    transition: border-color .2s;
}
.izang-payment-method input.input-radio:checked { border-color: var(--primary-color); }
.izang-payment-method input.input-radio:checked::after {
    content: '';
    position: absolute;
    inset: 3px;
    border-radius: 50%;
    background: var(--primary-color);
}
.izang-payment-method-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 32px;
    cursor: pointer;
    font-size: 13.5px;
    font-weight: 800;
    color: var(--text-main);
}
.izang-payment-method-label img { max-height: 24px; width: auto; }
.izang-payment-box {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px dashed #e2e8f0;
    font-size: 12.5px;
    color: var(--text-muted);
    line-height: 1.9;
}
.izang-no-payment-needed,
.izang-no-gateway {
    display: flex; align-items: center; gap: 8px;
    background: var(--bg-color);
    border-radius: 12px;
    padding: 14px 16px;
    font-size: 13px;
    color: var(--text-muted);
}

/* -----------------------------------------------------------------------
   دکمه نهایی پرداخت (چسبان در موبایل)
----------------------------------------------------------------------- */
.izang-noscript-warning { font-size: 12px; color: var(--brand-red); background: #fdecec; padding: 12px; border-radius: 10px; margin-bottom: 14px; }

.izang-place-order-sticky {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    position: fixed;
    bottom: 0; right: 0; left: 0;
    background: #fff;
    padding: 12px 15px;
    box-shadow: 0 -8px 25px rgba(0,0,0,0.08);
    z-index: 900;
}
.izang-place-order-total { display: flex; flex-direction: column; gap: 2px; }
.izang-place-order-label { font-size: 11.5px; color: var(--text-muted); font-weight: 700; }
.izang-place-order-total strong { font-size: 16px; font-weight: 900; color: var(--primary-color); }
.izang-place-order-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: var(--brand-red) !important;
    color: #fff !important;
    border: none;
    padding: 14px 24px !important;
    border-radius: 12px !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    cursor: pointer;
    box-shadow: 0 4px 15px var(--accent-shadow);
    transition: all .25s;
    white-space: nowrap;
    font-family: inherit;
}
.izang-place-order-btn:hover { background: var(--accent-color-hover) !important; transform: translateY(-2px); }
.izang-place-order-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }

.izang-secure-payment-note {
    display: flex; align-items: center; gap: 6px;
    font-size: 11.5px; color: var(--text-muted);
    margin: 12px 0 90px;
    justify-content: center;
}

/* -----------------------------------------------------------------------
   صفحه تشکر از خرید (Thank You)
----------------------------------------------------------------------- */
.izang-thankyou-page { max-width: 640px; margin: 0 auto; padding: 30px 15px 60px; text-align: center; direction: rtl; }
.izang-thankyou-icon {
    width: 84px; height: 84px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: linear-gradient(135deg, #10b981, #059669);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 10px 25px rgba(16,185,129,0.3);
    animation: izangPopIn .5s cubic-bezier(.25,.8,.25,1);
}
.izang-thankyou-icon-error { background: linear-gradient(135deg, var(--brand-red), #8f1e18); box-shadow: 0 10px 25px var(--accent-shadow); }
@keyframes izangPopIn { from { transform: scale(0.4); opacity: 0; } to { transform: scale(1); opacity: 1; } }

.izang-thankyou-title { font-size: 20px; font-weight: 900; color: var(--text-main); margin-bottom: 10px; }
.izang-thankyou-title-error { color: var(--brand-red); }
.izang-thankyou-desc { font-size: 13.5px; color: var(--text-muted); line-height: 1.9; margin-bottom: 24px; }

.izang-order-summary-card {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 6px 18px;
    text-align: right;
    margin-bottom: 26px;
}
.izang-order-overview { list-style: none; margin: 0; padding: 0; }
.izang-order-overview li {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 0;
    border-bottom: 1px dashed #f1f5f9;
    font-size: 13px;
}
.izang-order-overview li:last-child { border-bottom: none; }
.izang-overview-label { color: var(--text-muted); font-weight: 700; }
.izang-order-overview strong { color: var(--text-main); font-weight: 800; }
.izang-order-overview li.total strong { color: var(--primary-color); font-size: 15px; }

.izang-thankyou-actions { display: flex; flex-direction: column; gap: 10px; }
.izang-support-link { color: #25D366 !important; border-color: #25D366 !important; }
.izang-support-link:hover { background: #25D366 !important; color: #fff !important; }

.izang-receipt-card { max-width: 640px; margin: 30px auto; }

/* -----------------------------------------------------------------------
   خطاهای سبد خرید در مسیر چک‌اوت
----------------------------------------------------------------------- */
.izang-cart-errors-box { margin: 30px auto; }

/* -----------------------------------------------------------------------
   صفحه تأیید ایمیل
----------------------------------------------------------------------- */
.izang-verify-email-page { max-width: 560px; margin: 0 auto; }
.izang-verify-email-desc { font-size: 13px; color: var(--text-muted); line-height: 1.9; margin-bottom: 20px; }

/* -----------------------------------------------------------------------
   رسپانسیو دسکتاپ: چیدمان دو ستونه واقعی + سایدبار چسبان
----------------------------------------------------------------------- */
@media (min-width: 992px) {
    .izang-checkout-page { padding: 30px 5% 60px; }
    .izang-checkout-layout {
        grid-template-columns: 1.7fr 1fr;
        align-items: start;
        gap: 30px;
    }
    .checkout-col-summary { order: 2; }
    .checkout-col-main { order: 1; }
    .izang-summary-sticky { position: sticky; top: 100px; }
    body.admin-bar .izang-summary-sticky { top: 132px; }

    .izang-fields-grid { grid-template-columns: 1fr 1fr; }

    /* در دسکتاپ فضای کافی هست، دکمه پرداخت دیگر نیازی به حالت چسبان کف صفحه ندارد */
    .izang-place-order-sticky {
        position: static;
        box-shadow: none;
        padding: 0;
        background: transparent;
        justify-content: flex-start;
        gap: 20px;
    }
    .izang-secure-payment-note { margin-bottom: 0; }

    /* در دسکتاپ خلاصه سفارش همیشه باز است؛ دکمه توگل غیرفعال بصری می‌شود */
    .izang-review-toggle { cursor: default; }
    .izang-review-toggle-icon { display: none; }
}

@media (max-width: 991px) {
    /* در موبایل، فضای خالی پایین صفحه برای دکمه چسبان رزرو می‌شود */
    .izang-checkout-page { padding-bottom: 110px; }
}

body.admin-bar .izang-place-order-sticky {
    bottom: 0;
}


/* =========================================
   بازطراحی یکپارچه دکمه‌های تسویه حساب و پرداخت
   استفاده از رنگ قرمز اکشن آی‌زنگ برای جلب توجه کاربر
========================================= */
.woocommerce-cart .wc-proceed-to-checkout {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 25px;
}

.woocommerce-checkout #place_order, 
.woocommerce-cart .checkout-button,
.cart-checkout-btn {
    background-color: var(--accent-color) !important; /* سرمه‌ای برند */
    color: #ffffff !important;
    padding: 16px 20px;
    font-size: 15px;
    font-weight: 800;
    border-radius: 12px;
    width: 100%;
    border: none;
    cursor: pointer;
    font-family: inherit;
    box-shadow: 0 4px 15px var(--accent-shadow);
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
}

.woocommerce-checkout #place_order:hover, 
.woocommerce-cart .checkout-button:hover,
.cart-checkout-btn:hover {
    background-color: var(--accent-color-hover) !important; /* تیره‌تر شدن اصولی در حالت Hover */
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(14, 90, 107, 0.35);
}

.woocommerce-checkout #place_order:focus-visible, 
.woocommerce-cart .checkout-button:focus-visible {
    outline: 2px dashed var(--attention-color); /* دسترسی‌پذیری WCAG برای کیبورد */
    outline-offset: 4px;
}


/* =========================================================================
   File: style.css  (این بلوک را به انتهای style.css قالب آی‌زنگ اضافه کنید)
   Description: بازطراحی کامل پنل کاربری (WooCommerce My Account) آی‌زنگ
   هماهنگ با متغیرهای رنگی برند و کلاس‌های موجود سبد خرید/چک‌اوت
   (izang-section-card, izang-btn-primary, izang-fields-grid, cart-btn-outline و ...)
   ========================================================================= */

/* -----------------------------------------------------------------------
   پیام‌های سیستمی ووکامرس (خطا/موفقیت/اطلاع‌رسانی) — استایل عمومی
   برای فرم‌های ورود/ثبت‌نام/ویرایش حساب که در سراسر پنل کاربری استفاده می‌شود
----------------------------------------------------------------------- */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.woocommerce-NoticeGroup ul.woocommerce-error {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    list-style: none;
    background: var(--card-bg);
    border: 1px solid #e2e8f0;
    border-right: 4px solid var(--primary-color);
    border-radius: 12px;
    padding: 14px 16px;
    margin: 0 0 18px;
    font-size: 13px;
    line-height: 1.9;
    color: var(--text-main);
}
.woocommerce-error { border-right-color: var(--brand-red); }
.woocommerce-message { border-right-color: #10b981; }
.woocommerce-message a.button,
.woocommerce-error a.button,
.woocommerce-info a.button {
    display: inline-block;
    margin-top: 8px;
    background: var(--primary-color);
    color: #fff !important;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}
.woocommerce-error li { list-style: none; }

/* =========================================================================
   ۱. چیدمان کلی پنل کاربری (my-account.php)
========================================================================= */
.izang-account-page {
    max-width: 1400px;
    margin: 0 auto;
    padding: 15px 15px 60px;
    direction: rtl;
}

.izang-account-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    align-items: start;
}

/* --- سایدبار کاربر --- */
.izang-account-user-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 16px;
    margin-bottom: 14px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}
.izang-account-avatar {
    border-radius: 50%;
    flex-shrink: 0;
    width: 52px !important;
    height: 52px !important;
    border: 2px solid #f1f5f9;
}
.izang-account-user-info { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.izang-account-user-label { font-size: 12px; color: var(--text-muted); font-weight: 700; }
.izang-account-user-name { font-size: 14.5px; font-weight: 800; color: var(--text-main); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* --- ناوبری: در موبایل نوار چیپ افقی، در دسکتاپ سایدبار عمودی چسبان --- */
.izang-account-nav-list {
    list-style: none;
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding: 4px 2px 8px;
    margin: 0;
    scrollbar-width: none;
}
.izang-account-nav-list::-webkit-scrollbar { display: none; }

.izang-account-nav-item { flex-shrink: 0; }
.izang-account-nav-item a {
    display: flex;
    align-items: center;
    gap: 7px;
    background: var(--card-bg);
    border: 1px solid #e2e8f0;
    color: var(--text-muted);
    font-size: 12.5px;
    font-weight: 700;
    padding: 10px 16px;
    border-radius: 12px;
    white-space: nowrap;
    transition: all 0.25s ease;
}
.izang-account-nav-item a:hover,
.izang-account-nav-item.is-active a,
.izang-account-nav-item a[aria-current="page"] {
    background: var(--primary-color);
    color: #fff;
    border-color: var(--primary-color);
}
.izang-account-nav-item.is-logout a {
    color: var(--brand-red);
    border-color: #fdecec;
    background: #fdecec;
}
.izang-account-nav-item.is-logout a:hover {
    background: var(--brand-red);
    color: #fff;
    border-color: var(--brand-red);
}
.izang-account-nav-icon { display: inline-flex; flex-shrink: 0; }

/* --- محتوای اصلی --- */
.izang-account-content { min-width: 0; }
.izang-account-heading {
    font-size: 19px;
    font-weight: 900;
    color: var(--text-main);
    margin-bottom: 8px;
    line-height: 1.7;
}
.izang-account-heading span { color: var(--primary-color); }
.izang-account-desc {
    font-size: 13px;
    color: var(--text-muted);
    line-height: 1.9;
    margin-bottom: 20px;
}
.izang-dashboard-notyou {
    color: var(--brand-red);
    font-weight: 700;
    margin-inline-start: 4px;
}

/* =========================================================================
   ۲. داشبورد — کارت‌های دسترسی سریع
========================================================================= */
.izang-dashboard-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 10px;
}
.izang-dashboard-card {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 18px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    transition: all 0.3s ease;
}
.izang-dashboard-card:hover {
    transform: translateY(-4px);
    border-color: var(--primary-color);
    box-shadow: 0 12px 25px rgba(14, 90, 107,0.08);
}
.izang-dashboard-card-icon { font-size: 26px; }
.izang-dashboard-card strong { font-size: 13.5px; font-weight: 800; color: var(--text-main); }
.izang-dashboard-card span:last-child { font-size: 11.5px; color: var(--text-muted); line-height: 1.7; }

/* =========================================================================
   ۳. سفارش‌ها — کارت به‌جای جدول (الگوی دیجی‌کالا)
========================================================================= */
.izang-orders-list { display: flex; flex-direction: column; gap: 14px; }

.izang-order-card {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 16px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    transition: box-shadow .3s ease, border-color .3s ease;
}
.izang-order-card:hover { border-color: #e2e8f0; box-shadow: 0 8px 20px rgba(0,0,0,0.05); }

.izang-order-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #eef0f5;
}
.izang-order-card-id { display: flex; flex-direction: column; gap: 3px; }
.izang-order-card-label { font-size: 11.5px; color: #94a3b8; font-weight: 700; }
.izang-order-card-number { font-size: 15px; font-weight: 800; color: var(--primary-color); direction: ltr; display: inline-block; }

.izang-order-status-badge {
    font-size: 12px;
    font-weight: 800;
    padding: 5px 13px;
    border-radius: 20px;
    white-space: nowrap;
    flex-shrink: 0;
}
.izang-order-status-badge.is-success { background: #e7f9f1; color: #0f9d63; }
.izang-order-status-badge.is-info    { background: #e8f0fe; color: #1a56db; }
.izang-order-status-badge.is-warning { background: #fff6e0; color: #a15c00; }
.izang-order-status-badge.is-danger  { background: #fdecec; color: var(--brand-red); }
.izang-order-status-badge.is-muted   { background: #f1f5f9; color: var(--text-muted); }

.izang-order-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 12px;
}
.izang-order-card-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--text-muted);
    background: var(--bg-color);
    padding: 6px 12px;
    border-radius: 20px;
}

.izang-order-card-extra {
    font-size: 12px;
    color: var(--text-muted);
    padding: 8px 0;
    border-top: 1px dashed #eef0f5;
}

.izang-order-card-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    padding-top: 12px;
    border-top: 1px dashed #eef0f5;
}
.izang-order-card-total { display: flex; flex-direction: column; gap: 4px; }
.izang-order-card-total strong { font-size: 14.5px; font-weight: 800; color: var(--text-main); }

.izang-order-card-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.izang-order-action-btn,
.izang-order-action-btn:visited {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    color: var(--text-main);
    font-size: 12px;
    font-weight: 800;
    padding: 9px 16px;
    border-radius: 10px;
    text-decoration: none;
    transition: all 0.25s ease;
    white-space: nowrap;
}
.izang-order-action-btn:hover { background: var(--primary-color); color: #fff; }
.izang-order-action-btn.is-primary { background: var(--accent-color); color: #fff; }
.izang-order-action-btn.is-primary:hover { background: var(--accent-color-hover); }
.izang-order-action-btn.cancel { color: var(--brand-red); background: #fdecec; }
.izang-order-action-btn.cancel:hover { background: var(--brand-red); color: #fff; }

.izang-orders-pagination {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 22px;
}

/* =========================================================================
   ۴. جزئیات سفارش (view-order.php)
========================================================================= */
.izang-order-view-header {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 18px;
    margin-bottom: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}
.izang-order-view-summary {
    font-size: 13.5px;
    color: var(--text-muted);
    line-height: 1.9;
    margin-top: 12px;
}
.izang-order-view-summary mark {
    background: transparent;
    color: var(--text-main);
    font-weight: 800;
}

.izang-order-updates-section { margin-bottom: 24px; }
.izang-order-updates-title { font-size: 15px; font-weight: 800; color: var(--primary-color); margin-bottom: 14px; }
.izang-order-updates-list { list-style: none; margin: 0; padding: 0 0 0 6px; border-right: 2px dashed #e2e8f0; }
.izang-order-update-item { display: flex; gap: 12px; padding-bottom: 18px; position: relative; margin-right: -7px; }
.izang-order-update-dot {
    width: 12px; height: 12px; border-radius: 50%;
    background: var(--primary-color);
    border: 2px solid #fff;
    box-shadow: 0 0 0 2px var(--primary-color);
    flex-shrink: 0;
    margin-top: 4px;
}
.izang-order-update-content { flex: 1; background: var(--bg-color); border-radius: 12px; padding: 12px 14px; }
.izang-order-update-date { display: block; font-size: 12px; color: var(--text-muted); font-weight: 700; margin-bottom: 6px; }
.izang-order-update-text p { font-size: 13px; color: var(--text-main); line-height: 1.8; margin: 0; }

/* --- استایل جدول جزئیات سفارش هسته ووکامرس (order/order-details.php) --- */
.izang-order-details-wrap table.woocommerce-table--order-details,
.izang-order-details-wrap table.shop_table {
    width: 100%;
    border-collapse: collapse;
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    overflow: hidden;
    margin-bottom: 18px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}
.izang-order-details-wrap table th,
.izang-order-details-wrap table td {
    padding: 12px 14px;
    font-size: 13px;
    color: var(--text-main);
    border-bottom: 1px dashed #f1f5f9;
    text-align: right;
}
.izang-order-details-wrap table thead th {
    background: var(--bg-color);
    font-weight: 800;
    color: var(--primary-color);
}
.izang-order-details-wrap table tfoot th,
.izang-order-details-wrap table tfoot td { font-weight: 800; }
.izang-order-details-wrap table tr:last-child td { border-bottom: none; }
.izang-order-details-wrap address {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 16px;
    font-size: 13px;
    line-height: 1.9;
    color: var(--text-main);
    margin-bottom: 14px;
}
.izang-order-details-wrap .woocommerce-column__title { font-size: 14px; font-weight: 800; color: var(--primary-color); margin: 20px 0 10px; }
.izang-order-details-wrap .woocommerce-columns { display: grid; grid-template-columns: 1fr; gap: 14px; }

/* =========================================================================
   ۵. دانلودها
========================================================================= */
.izang-downloads-wrap table.woocommerce-table--order-downloads,
.izang-downloads-wrap table.shop_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
}
.izang-downloads-wrap table.woocommerce-table--order-downloads thead { display: none; }
.izang-downloads-wrap table.woocommerce-table--order-downloads tbody tr,
.izang-downloads-wrap table.shop_table tbody tr {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}
.izang-downloads-wrap table td {
    padding: 14px 16px;
    font-size: 13px;
    color: var(--text-main);
    border: none;
}
.izang-downloads-wrap table td:first-child { border-radius: 14px 0 0 14px; }
.izang-downloads-wrap table td:last-child { border-radius: 0 14px 14px 0; }
.izang-downloads-wrap table a.woocommerce-MyAccount-downloads-file,
.izang-downloads-wrap table a {
    color: var(--primary-color);
    font-weight: 800;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.izang-downloads-wrap table a::before { content: '⬇️'; }

.izang-downloads-list-simple { display: flex; flex-direction: column; gap: 10px; }
.izang-download-item-simple {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 14px;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
}
.izang-download-link { color: var(--primary-color); font-weight: 800; font-size: 13.5px; text-decoration: none; }
.izang-download-count { font-size: 12px; color: var(--text-muted); background: var(--bg-color); padding: 4px 10px; border-radius: 20px; }

/* =========================================================================
   ۶. روش‌های پرداخت ذخیره‌شده
========================================================================= */
.izang-payment-methods-list { display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px; }
.izang-payment-method-card {
    display: flex;
    align-items: center;
    gap: 14px;
    background: var(--card-bg);
    border: 2px solid #e2e8f0;
    border-radius: 16px;
    padding: 16px;
}
.izang-payment-method-card.is-default { border-color: var(--primary-color); background: rgba(14, 90, 107,0.03); }
.izang-payment-method-icon {
    width: 44px; height: 44px; flex-shrink: 0;
    border-radius: 12px;
    background: var(--bg-color);
    color: var(--primary-color);
    display: flex; align-items: center; justify-content: center;
}
.izang-payment-method-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.izang-payment-method-info strong { font-size: 13.5px; font-weight: 800; color: var(--text-main); }
.izang-payment-method-expiry { font-size: 11.5px; color: var(--text-muted); }
.izang-payment-method-default-badge {
    display: inline-block;
    width: fit-content;
    background: var(--primary-color);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    padding: 2px 10px;
    border-radius: 20px;
}
.izang-payment-method-actions { display: flex; gap: 8px; flex-shrink: 0; }
.izang-payment-add-btn { display: inline-block; }

/* =========================================================================
   ۷. آدرس‌ها
========================================================================= */
.izang-address-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.izang-address-card {
    background: var(--card-bg);
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 18px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
}
.izang-address-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #eef0f5;
}
.izang-address-card-header h2 { font-size: 14.5px; font-weight: 800; color: var(--primary-color); }
.izang-address-edit-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 700;
    color: var(--primary-color);
    background: var(--bg-color);
    padding: 6px 12px;
    border-radius: 10px;
    text-decoration: none;
    transition: all 0.25s;
}
.izang-address-edit-link:hover { background: var(--primary-color); color: #fff; }
.izang-address-card-body { font-size: 13px; line-height: 1.9; color: var(--text-main); font-style: normal; }

/* =========================================================================
   ۸. صفحات ورود / ثبت‌نام / بازیابی رمز عبور
========================================================================= */
.izang-auth-page { max-width: 1400px; margin: 20px auto; padding: 0 15px 60px; direction: rtl; }
.izang-auth-single { max-width: 480px; }

.izang-auth-columns { display: grid; grid-template-columns: 1fr; gap: 0; align-items: stretch; }
.izang-auth-card { height: 100%; }
.izang-auth-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 6px 0;
    position: relative;
    color: var(--text-muted);
    font-size: 12px;
    font-weight: 800;
}
.izang-auth-divider::before,
.izang-auth-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e2e8f0;
}
.izang-auth-divider span { padding: 0 12px; }

.izang-auth-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin: 4px 0 18px;
}
.izang-remember-me {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text-main);
    cursor: pointer;
}
.izang-remember-me input { width: 18px; height: 18px; accent-color: var(--primary-color); cursor: pointer; }
.izang-lost-password-link { font-size: 12.5px; font-weight: 700; color: var(--primary-color); }

.izang-auth-submit {
    width: 100%;
    padding: 14px;
    font-size: 14px;
}
.izang-auth-confirmation { max-width: 480px; margin: 0 auto; }
.izang-auth-confirmation h2 { font-size: 17px; font-weight: 800; color: var(--text-main); margin: 6px 0 10px; }

/* =========================================================================
   ۹. حالت خالی مشترک (سفارش/دانلود/پرداخت)
========================================================================= */
.izang-account-empty-state {
    text-align: center;
    padding: 50px 20px;
    background: var(--card-bg);
    border-radius: 20px;
    max-width: 560px;
    margin: 10px auto;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
}
.izang-account-empty-icon { font-size: 46px; margin-bottom: 14px; }
.izang-account-empty-state p { font-size: 13.5px; color: var(--text-muted); margin-bottom: 20px; line-height: 1.9; }

/* =========================================================================
   ۱۰. رسپانسیو دسکتاپ
========================================================================= */
@media (min-width: 992px) {
    .izang-account-page { padding: 30px 5% 80px; }

    .izang-account-layout { grid-template-columns: 260px 1fr; gap: 30px; }
    .izang-account-sidebar-sticky { position: sticky; top: 100px; }
    body.admin-bar .izang-account-sidebar-sticky { top: 132px; }

    .izang-account-nav-list { flex-direction: column; overflow: visible; padding: 0; }
    .izang-account-nav-item { width: 100%; }
    .izang-account-nav-item a { width: 100%; justify-content: flex-start; }

    .izang-dashboard-grid { grid-template-columns: repeat(4, 1fr); gap: 18px; }

    .izang-order-card { padding: 20px; }

    .izang-address-grid { grid-template-columns: 1fr 1fr; gap: 20px; }

    .izang-auth-columns { grid-template-columns: 1fr auto 1fr; gap: 20px; }
    .izang-auth-divider { flex-direction: column; margin: 0; }
    .izang-auth-divider::before,
    .izang-auth-divider::after { width: 1px; height: auto; flex: 1; }
    .izang-auth-divider span { padding: 12px 0; }

    .izang-order-details-wrap .woocommerce-columns { grid-template-columns: 1fr 1fr; }
}

/* هماهنگی حالت چسبان سایدبار پنل کاربری با نوار مدیریت وردپرس در تبلت */
@media screen and (max-width: 782px) and (min-width: 992px) {
    body.admin-bar .izang-account-sidebar-sticky { top: 146px; }
}

/* =========================================================================
   File: style.css  (این بلوک را به انتهای style.css قالب آی‌زنگ اضافه کنید)
   Description: استایل تکمیلی زیرقالب‌های سبد خرید آی‌زنگ
   (mini-cart, shipping-calculator, cart-shipping, cross-sells)
   هماهنگ با متغیرهای رنگی برند و کلاس‌های موجود cart-item-card / cart-btn-*
   ========================================================================= */

/* =========================================================================
   ۱. مینی‌کارت (سبد خرید کوچک هدر / Ajax Fragments)
========================================================================= */
.izang-mini-cart {
    width: 100%;
    max-width: 340px;
    direction: rtl;
    padding: 6px;
}

.izang-mini-cart-list {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 320px;
    overflow-y: auto;
}

.izang-mini-cart-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    position: relative;
    padding: 8px;
    padding-left: 26px; /* فضای دکمه حذف */
    background: var(--bg-color);
    border-radius: 12px;
}

.izang-mini-cart-thumb {
    width: 46px; height: 46px; flex-shrink: 0;
    border-radius: 8px;
    overflow: hidden;
    background: #fff;
    display: flex; align-items: center; justify-content: center;
}
.izang-mini-cart-thumb img { width: 100%; height: 100%; object-fit: contain; }

.izang-mini-cart-info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.izang-mini-cart-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text-main);
    text-decoration: none;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.izang-mini-cart-meta { font-size: 11.5px; color: var(--text-muted); }
.izang-mini-cart-qty { font-size: 11.5px; font-weight: 800; color: var(--primary-color); direction: ltr; display: inline-block; }

.izang-mini-cart-remove {
    position: absolute;
    top: 8px; left: 8px;
    width: 20px; height: 20px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%;
    background: #fff;
    color: #94a3b8;
    font-size: 13px;
    line-height: 1;
    text-decoration: none;
    transition: all 0.2s ease;
}
.izang-mini-cart-remove:hover { background: var(--brand-red); color: #fff; }

.izang-mini-cart-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
    font-weight: 800;
    color: var(--text-main);
    padding: 12px 0;
    border-top: 1px dashed #e2e8f0;
    margin: 0 0 12px;
}
.izang-mini-cart-total-label { color: var(--text-muted); font-weight: 700; }
.izang-mini-cart-total .woocommerce-Price-amount { color: var(--primary-color); font-size: 15px; }

.izang-mini-cart-buttons {
    display: flex;
    gap: 8px;
    margin: 0;
}
.izang-mini-cart-buttons .button {
    flex: 1;
    text-align: center;
    padding: 10px 8px;
    border-radius: 10px;
    font-size: 12.5px;
    font-weight: 800;
    text-decoration: none;
    transition: all 0.25s ease;
}
.izang-mini-cart-buttons .button:not(.checkout-button) {
    background: #f1f5f9;
    color: var(--text-main);
}
.izang-mini-cart-buttons .button:not(.checkout-button):hover { background: var(--primary-color); color: #fff; }
.izang-mini-cart-buttons .checkout-button { padding: 10px 8px; }

.izang-mini-cart-empty {
    text-align: center;
    padding: 30px 15px;
}
.izang-mini-cart-empty-icon { font-size: 34px; display: block; margin-bottom: 10px; }
.izang-mini-cart-empty p { font-size: 12.5px; color: var(--text-muted); margin-bottom: 14px; }

/* =========================================================================
   ۲. محاسبه‌گر هزینه ارسال (سبد خرید)
========================================================================= */
.izang-shipping-calculator { margin-top: 14px; }
.izang-shipping-calc-toggle {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    font-weight: 800;
    color: var(--primary-color);
    text-decoration: none;
}
.izang-shipping-calc-toggle:hover { text-decoration: underline; }

.izang-shipping-calc-form {
    margin-top: 12px;
    padding: 14px;
    background: var(--bg-color);
    border-radius: 12px;
    border: 1px dashed #e2e8f0;
}
.izang-shipping-calc-form .form-row { margin-bottom: 10px; }
.izang-shipping-calc-form label { display: block; font-size: 12px; font-weight: 700; color: var(--text-main); margin-bottom: 6px; }
.izang-shipping-calc-form select,
.izang-shipping-calc-form input.input-text {
    width: 100%;
    padding: 10px 12px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    font-family: inherit;
    font-size: 12.5px;
    background: #fff;
}
.izang-shipping-calc-form select:focus,
.izang-shipping-calc-form input.input-text:focus { border-color: var(--primary-color); outline: none; }
.izang-shipping-calc-submit { margin: 4px 0 0; }

/* =========================================================================
   ۳. روش‌های ارسال (cart-shipping.php)
========================================================================= */
.izang-shipping-methods {
    list-style: none;
    margin: 0 0 10px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.izang-shipping-method-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--bg-color);
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    padding: 10px 12px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text-main);
    transition: all 0.2s ease;
}
.izang-shipping-method-item:has(input:checked) {
    border-color: var(--primary-color);
    background: rgba(14, 90, 107,0.03);
}
.izang-shipping-method-item input.shipping_method { accent-color: var(--primary-color); width: 17px; height: 17px; flex-shrink: 0; cursor: pointer; }
.izang-shipping-method-item label { cursor: pointer; flex: 1; }
.izang-shipping-destination { font-size: 11.5px; color: var(--text-muted); margin: 0; }
.izang-shipping-destination strong { color: var(--text-main); }

/* =========================================================================
   ۴. محصولات مکمل (Cross-sells) در سبد خرید
========================================================================= */
.izang-cross-sells {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px dashed #e2e8f0;
}
.izang-cross-sells-title { font-size: 15px; font-weight: 800; color: var(--primary-color); margin-bottom: 14px; }

.izang-cross-sells-grid ul.products,
.izang-cross-sells-grid { list-style: none; padding: 0; margin: 0; }
.izang-cross-sells-grid ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
}
.izang-cross-sells-grid ul.products::before,
.izang-cross-sells-grid ul.products::after { display: none !important; content: none !important; }
.izang-cross-sells-grid ul.products li.product {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    float: none !important;
    clear: none !important;
    background-color: var(--card-bg);
    border-radius: 14px;
    padding: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.03);
    border: 1px solid #f1f5f9;
    transition: all 0.3s ease;
}
.izang-cross-sells-grid ul.products li.product:hover { transform: translateY(-4px); border-color: var(--primary-color); }
.izang-cross-sells-grid ul.products li.product img { width: 100%; height: 110px; object-fit: contain; border-radius: 10px; background: #fff; margin-bottom: 8px; }
.izang-cross-sells-grid ul.products li.product .woocommerce-loop-product__title { font-size: 11.5px; font-weight: 700; color: var(--text-main); line-height: 1.6; }
.izang-cross-sells-grid ul.products li.product .price { font-size: 12px; font-weight: 800; color: var(--primary-color); display: block; margin-top: 4px; }
.izang-cross-sells-grid ul.products li.product .button {
    display: block;
    margin-top: 8px;
    background: #f1f5f9;
    color: var(--primary-color);
    text-align: center;
    padding: 7px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 800;
}
.izang-cross-sells-grid ul.products li.product:hover .button { background: var(--primary-color); color: #fff; }

/* =========================================================================
   ۵. رسپانسیو دسکتاپ
========================================================================= */
@media (min-width: 768px) {
    .izang-mini-cart { max-width: 380px; padding: 10px; }

    .izang-cross-sells-grid ul.products { grid-template-columns: repeat(4, 1fr) !important; gap: 18px !important; }
    .izang-cross-sells-grid ul.products li.product img { height: 150px; }
}

/* =========================================
   محل قرارگیری: انتهای فایل style.css
   توجه: قانون کلی اجبار فونت فارسی روی تمام نمایش‌های عددی (از جمله قیمت‌ها
   و تگ <bdi> که ووکامرس دور اعداد می‌پیچد) اکنون یک‌بار و برای همیشه در
   ابتدای همین فایل (کنار تعریف body) اعمال می‌شود؛ نیازی به تکرار فهرست
   طولانی کلاس‌های قیمت در این‌جا نیست.
========================================= */

/* =========================================================================
   File: style.css  (این بلوک را به انتهای style.css قالب آی‌زنگ اضافه کنید)
   Description: استایل بخش مستقل نمادهای اعتماد و درگاه‌های پرداخت
   محل درج در HTML: footer.php — به‌عنوان <section class="site-trust-band">
   بین بدنه اصلی سایت و تگ <footer> (نه داخل فوتر)
   ========================================================================= */

.site-trust-band {
    width: 100%;
    background-color: #ffffff;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    padding: 26px 0;
}

/* هم‌راستا با الگوی .header-inner/.footer-inner: عرض سیال با پدینگ درصدی،
   بدون سقف عرض ثابت با نام تکراری (رفع همان باگ احتمالی کلاس .container) */
.site-trust-band-inner {
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 0 4%;
}

.footer-trust-logos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 18px;
}

.footer-trust-logo-box {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
    padding: 8px 12px;
    width: 90px;
    height: 56px;
    transition: all 0.25s ease;
}
.footer-trust-logo-box:hover {
    border-color: var(--primary-color);
    box-shadow: 0 4px 12px rgba(14, 90, 107, 0.08);
    transform: translateY(-2px);
}
.footer-trust-logo-box img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

.footer-trust-text {
    font-size: 11.5px;
    color: var(--text-muted);
    line-height: 2;
    text-align: center;
    max-width: 780px;
    margin: 0 auto;
    padding: 0 10px;
}

@media (min-width: 768px) {
    .site-trust-band { padding: 34px 0; }
    .footer-trust-logos { gap: 20px; }
    .footer-trust-logo-box { width: 100px; height: 64px; }
    .footer-trust-text { font-size: 12.5px; }
}

/* =========================================================================
   نوار ضمانت‌های خرید (Guarantee Strip) در فوتر — footer.php
   همه آیکون‌ها تک‌رنگ (مشکی برند) هستند تا با هویت مینیمال سیاه/سفید
   هماهنگ باشند؛ نسخه قبلی برای هر آیتم یک رنگ جدا (سبز/نارنجی/آبی/بنفش)
   داشت که از قالب کپی‌فای مانده بود.
   ========================================================================= */

.izang-guarantee-strip {
    width: 100%;
    background-color: var(--izang-bg-light, #f8fafc);
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    padding: 18px 0;
}

.izang-guarantee-strip-inner {
    width: 100%;
    max-width: 1400px;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 0 4%;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.izang-guarantee-item {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
    padding: 12px 14px;
    transition: all 0.25s ease;
}
.izang-guarantee-item:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
}

.izang-guarantee-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: rgba(14, 90, 107, 0.06);
    color: var(--izang-primary, #0E5A6B);
}
.izang-guarantee-icon svg {
    display: block;
}

.izang-guarantee-text {
    font-size: 11.5px;
    font-weight: 800;
    color: var(--izang-text-dark, #2d3748);
    line-height: 1.6;
}

.izang-guarantee-item:hover {
    border-color: var(--izang-primary, #0E5A6B);
}

/* تبلت: ۳ ستون */
@media (min-width: 576px) and (max-width: 991px) {
    .izang-guarantee-strip-inner {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* دسکتاپ: یک ردیف کامل، بدون کارت مجزا، فقط جداکننده عمودی بین آیتم‌ها */
@media (min-width: 992px) {
    .izang-guarantee-strip {
        padding: 22px 0;
    }
    .izang-guarantee-strip-inner {
        grid-template-columns: repeat(5, 1fr);
        gap: 0;
        padding: 0 5%;
    }
    .izang-guarantee-item {
        background: transparent;
        border: none;
        border-radius: 0;
        justify-content: center;
        padding: 6px 18px;
    }
    .izang-guarantee-item:hover {
        transform: none;
        box-shadow: none;
        border-color: transparent !important;
    }
    .izang-guarantee-item:not(:first-child) {
        border-inline-start: 1px solid #e2e8f0;
    }
    .izang-guarantee-icon {
        width: 34px;
        height: 34px;
    }
    .izang-guarantee-text {
        font-size: 12px;
    }
}


/* =========================================
   کلاس اختصاصی برای صفحات تمام‌عرض (Edge-to-Edge)
   محل قرارگیری: انتهای فایل style.css
========================================= */
.izang-edge-to-edge {
    width: 100%;
    max-width: 100% !important;
    margin: 0;
    padding: 0;
    display: block;
    /* جلوگیری قطعی از باگ اسکرول افقی در مواردی که المان‌های داخل لندینگ margin منفی دارند */
    overflow-x: hidden; 
}

/* حذف فاصله‌ها و محدودیت‌های احتمالی پیش‌فرض وردپرس برای محتوای داخل این قالب */
.izang-edge-to-edge > article {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
}

/* =========================================
   محل قرارگیری: انتهای فایل style.css
   هدف: رفع باگ نمایش نامنظم نقشه گوگل در فوتر (بخش «ارتباط با ما»)
   قبلاً کلاس .footer-map در footer.php استفاده می‌شد اما هیچ‌جا در
   style.css تعریف نشده بود؛ چون خود iframe با height:100% نوشته شده
   بود، بدون یک ارتفاع مشخص روی والد (.footer-map)، مرورگر یا نقشه را
   با ارتفاع پیش‌فرض کوچک iframe (~150px) نشان می‌داد یا در سایزهای
   بزرگ‌تر صفحه (دسکتاپ) رفتار نامنظم/غیرقابل پیش‌بینی داشت.
========================================= */
.footer-map {
    width: 100%;
    height: 220px;
    border-radius: 12px;
    overflow: hidden;
    margin-top: 10px;
}
.footer-map iframe {
    width: 100%;
    height: 100%;
    display: block;
}

@media (min-width: 768px) {
    .footer-map {
        height: 260px;
    }
}
/* =========================================================================
   File: style.css  (اضافه‌شده به انتهای فایل)
   نوار اعلان بالای صفحه (Announcement Bar) — الگوی ۲۰۲۶
   -----------------------------------------------------------------------
   یک نوار باریک، مینیمال و قابل بستن بالای هدر برای پیام‌های کوتاه مثل
   ارسال رایگان یا کد تخفیف؛ از پالت اصلی برند (--izang-primary) و
   نقطه‌ی قرمز تأکید برند بهره می‌برد تا با بقیه‌ی سایت هماهنگ بماند. غیر-چسبان (non-sticky) است
   تا با هدر چسبان تداخل نکند و فقط در بالای صفحه دیده شود.
========================================================================= */
.izang-announcement-bar {
    background-color: var(--izang-primary);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 9px 40px 9px 40px; /* دکمه بستن سمت چپ است؛ فاصله دو طرف برابر تا متن وسط بماند و زیر دکمه نرود */
    position: relative;
    text-align: center;
}
.izang-announcement-text {
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.6;
    margin: 0;
}
.izang-announcement-text::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: var(--accent-color);
    margin-inline-end: 8px;
    vertical-align: middle;
}
.izang-announcement-close {
    position: absolute;
    top: 50%;
    left: 14px;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: rgba(255, 255, 255, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}
.izang-announcement-close:hover {
    background-color: rgba(255, 255, 255, 0.12);
    color: #ffffff;
}
@media (min-width: 768px) {
    .izang-announcement-bar { padding: 10px 52px; }
    .izang-announcement-text { font-size: 13px; }
}

/* =========================================================================
   دکمه‌های عمومی قالب (.izang-btn / .izang-btn-primary)
   در ۱۲ قالب ووکامرس (ورود، ثبت‌نام، حساب کاربری، آدرس، صفحه تشکر و ...)
   استفاده می‌شدند ولی هیچ استایلی نداشتند و به شکل دکمه خام مرورگر دیده می‌شدند.
========================================================================= */
.izang-btn,
.izang-btn-primary,
.woocommerce .izang-btn-primary,
button.izang-btn-primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 12px 26px;
    border: 2px solid transparent;
    border-radius: 12px;
    font-family: inherit;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}
.izang-btn-primary,
.woocommerce .izang-btn-primary,
button.izang-btn-primary {
    background-color: var(--izang-primary);
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(14, 90, 107, 0.18);
}
.izang-btn-primary:hover,
.izang-btn-primary:focus-visible {
    background-color: var(--izang-primary-gradient);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(14, 90, 107, 0.25);
}
.izang-btn-primary:focus-visible {
    outline: 2px solid var(--izang-primary);
    outline-offset: 3px;
}
.izang-btn-primary:disabled,
.izang-btn-primary[aria-disabled="true"] {
    background-color: #cbd5e1;
    box-shadow: none;
    cursor: not-allowed;
    transform: none;
}
.izang-auth-submit { width: 100%; }
@keyframes izangFadeIn { from { opacity: 0; } to { opacity: 1; } }

/* =========================================================================
   پیام‌های ووکامرس در صفحه محصول و فروشگاه (قبلاً اصلاً چاپ نمی‌شدند)
========================================================================= */
.single-product .woocommerce-notices-wrapper,
.products-container > .woocommerce-notices-wrapper {
    max-width: 1400px;
    margin: 15px auto 0;
    padding: 0 20px;
}
.woocommerce-notices-wrapper:empty { display: none; }
.woocommerce-message a.button.wc-forward { margin-top: 0; margin-inline-start: auto; }
@media (min-width: 768px) {
    .single-product .woocommerce-notices-wrapper,
    .products-container > .woocommerce-notices-wrapper { padding: 0 5%; }
}

/* دکمه «مشاهده سبد خرید» که ووکامرس بعد از افزودن AJAX کنار دکمه اضافه می‌کند */
.product-card a.added_to_cart {
    display: block;
    margin-top: 8px;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--primary-color);
}
.product-card .add-to-cart-btn.loading { opacity: 0.6; pointer-events: none; }

/* =========================================================================
   ستاره‌های امتیاز ووکامرس بدون فونت آیکون ووکامرس
   (استایل‌های پیش‌فرض ووکامرس در functions.php غیرفعال شده‌اند؛ بدون این
   بخش، به‌جای ستاره متن «Rated 4 out of 5» / «1 of 5 stars» نمایش داده می‌شد)
========================================================================= */
.star-rating {
    position: relative;
    display: inline-block;
    width: 5.6em;
    height: 1.15em;
    line-height: 1.15;
    font-size: 14px;
    overflow: hidden;
    vertical-align: middle;
    letter-spacing: 0.12em;
}
.star-rating::before {
    content: '★★★★★';
    position: absolute;
    top: 0;
    right: 0;
    color: #d6d8dc;
}
.star-rating span {
    position: absolute;
    top: 0;
    right: 0; /* در RTL پر شدن ستاره‌ها از راست شروع می‌شود */
    height: 100%;
    overflow: hidden;
    padding-top: 1.5em; /* متن «امتیاز ۴ از ۵» برای صفحه‌خوان باقی می‌ماند ولی دیده نمی‌شود */
}
.star-rating span::before {
    content: '★★★★★';
    position: absolute;
    top: 0;
    right: 0;
    color: var(--attention-color);
}

/* انتخاب امتیاز در فرم نظر محصول */
#reviews p.stars { margin: 0; line-height: 1; }
#reviews p.stars span { display: inline-flex; gap: 2px; }
#reviews p.stars a {
    position: relative;
    display: inline-block;
    width: 1.1em;
    height: 1.1em;
    font-size: 26px !important;
    text-indent: -9999px;
    overflow: hidden;
    text-decoration: none;
}
#reviews p.stars a::before {
    content: '★';
    position: absolute;
    inset: 0;
    text-indent: 0;
    line-height: 1.1;
    text-align: center;
    color: #d6d8dc;
    transition: color 0.15s ease;
}
#reviews p.stars:hover a::before,
#reviews p.stars.selected a::before { color: var(--attention-color); }
#reviews p.stars:hover a:hover ~ a::before,
#reviews p.stars.selected a.active ~ a::before { color: #d6d8dc; }
#reviews p.stars.selected:hover a::before { color: var(--attention-color); }
#reviews p.stars.selected:hover a:hover ~ a::before { color: #d6d8dc; }
#reviews p.stars a:focus-visible { outline: 2px solid var(--primary-color); outline-offset: 2px; border-radius: 4px; }

/* قاب تکراری: #respond داخل #review_form_wrapper دوباره کادر نگیرد */
#reviews #review_form_wrapper #respond {
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

/* =========================================================================
   انتخابگر رنگ و سایز صفحه محصول (سبک دیجی‌کالا)
   PHP: functions.php بخش ۲۴ | JS: assets/js/product-variations.js
========================================================================= */

/* باکس خرید محصول متغیر: تمام‌عرض و عمودی (انتخابگرها بالا، قیمت و دکمه پایین) */
.product-action-box.is-variable {
    display: block;
}
.product-action-box.is-variable .product-cart-form {
    width: 100%;
    max-width: none;
}
.product-cart-form form.variations_form {
    display: block;
}

/* جدول پیش‌فرض ووکامرس به بلوک‌های ساده تبدیل می‌شود */
.variations_form table.variations,
.variations_form table.variations tbody,
.variations_form table.variations tr,
.variations_form table.variations th,
.variations_form table.variations td {
    display: block;
    width: 100%;
    border: 0;
    padding: 0;
    text-align: right;
}
.variations_form table.variations { margin: 0 0 6px; border-collapse: collapse; }
.variations_form table.variations tr { margin-bottom: 18px; }
.variations_form table.variations tr:last-child { margin-bottom: 0; }
.variations_form table.variations th.label {
    margin-bottom: 10px;
    font-weight: 400;
}
.variations_form table.variations th.label label {
    font-size: 14px;
    font-weight: 800;
    color: var(--text-main);
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
}
.variations_form table.variations th.label label::after { content: ':'; order: 1; margin-inline-start: -4px; }
.kn-selected-name {
    order: 2;
    font-weight: 700;
    color: var(--text-muted);
    font-size: 13.5px;
}

/* منوی کشویی اصلی ووکامرس فقط وقتی دکمه‌ها آماده شدند پنهان می‌شود (بدون JS همان منو کار می‌کند) */
.kn-has-swatches .kn-swatch-select-wrap {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}
.kn-swatch-select-wrap select {
    min-width: 200px;
    padding: 10px 12px;
    border: 2px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
    font-family: inherit;
}

.kn-swatches {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.kn-swatches[hidden] { display: none; }

.kn-swatch {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #ffffff;
    border: 1.5px solid #e2e8f0;
    color: var(--text-main);
    font-family: inherit;
    font-weight: 700;
    cursor: pointer;
    transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}
.kn-swatch:hover { border-color: #94a3b8; }
.kn-swatch:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* --- سایز: مربع کوچک --- */
.kn-swatches--size .kn-swatch {
    min-width: 48px;
    height: 44px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 800;
}
.kn-swatches--size .kn-swatch.is-selected {
    background: var(--primary-color);
    border-color: var(--primary-color);
    color: #ffffff;
}

/* --- رنگ: دایره رنگی + نام --- */
.kn-swatches--color .kn-swatch {
    height: 44px;
    padding: 0 8px 0 14px; /* RTL: دایره سمت راست */
    border-radius: 999px;
    font-size: 13px;
}
.kn-swatch__dot {
    position: relative;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12); /* حاشیه ظریف تا رنگ سفید هم دیده شود */
}
.kn-swatch__dot.is-unknown {
    background: repeating-linear-gradient(45deg, #f1f5f9 0 4px, #e2e8f0 4px 8px);
}
.kn-swatches--color .kn-swatch.is-selected {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 1px var(--primary-color);
}
/* تیک داخل دایره رنگ انتخاب‌شده؛ با سایه دوگانه روی رنگ روشن و تیره خوانا است */
.kn-swatches--color .kn-swatch.is-selected .kn-swatch__dot::after {
    content: '✓';
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 800;
    color: #ffffff;
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.9), 0 0 1px rgba(0, 0, 0, 0.9);
}

/* --- با انتخاب فعلی ترکیب ندارد (قابل کلیک؛ بقیه انتخاب‌ها پاک می‌شوند) --- */
.kn-swatch.is-conflict {
    border-style: dashed;
    color: #94a3b8;
}
.kn-swatch.is-conflict .kn-swatch__dot { opacity: 0.5; }

/* --- ناموجود: خاکستری کم‌رنگ + خط مورب، غیرقابل انتخاب --- */
.kn-swatch.is-soldout {
    background: #f6f7f9;
    border-color: #eceef1;
    color: #c0c4cc;
    cursor: not-allowed;
    overflow: hidden;
}
.kn-swatch.is-soldout:hover { border-color: #eceef1; }
.kn-swatch.is-soldout .kn-swatch__dot { opacity: 0.35; }
.kn-swatch.is-soldout::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top left, transparent calc(50% - 0.75px), #d5d9e0 calc(50% - 0.75px), #d5d9e0 calc(50% + 0.75px), transparent calc(50% + 0.75px));
    pointer-events: none;
}
.kn-swatches--color .kn-swatch.is-soldout::before { border-radius: 999px; }

/* لینک پاک کردن انتخاب‌ها */
.variations_form .reset_variations {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 12px;
    font-size: 12.5px;
    font-weight: 700;
    color: var(--text-muted);
    text-decoration: none;
}
.variations_form .reset_variations::before { content: '✕'; font-size: 11px; }
.variations_form .reset_variations:hover { color: var(--brand-red); }

/* ردیف پایین: وضعیت موجودی، سپس قیمت + دکمه خرید */
.variations_form .single_variation_wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 14px;
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px dashed #e2e8f0;
}
.variations_form .single_variation_wrap .single_variation { flex: 1 1 100%; }
.variations_form .single_variation_wrap .single_variation:empty,
.variations_form .single_variation_wrap .single_variation[style*="display: none"] { display: none !important; }
.variations_form .woocommerce-variation-price { display: none; } /* قیمت در بلوک قیمت بالای دکمه نمایش داده می‌شود */
.variations_form .woocommerce-variation-description { font-size: 13px; color: var(--text-muted); line-height: 1.9; }
.variations_form .woocommerce-variation-availability .stock {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
}
.variations_form .woocommerce-variation-availability .stock.in-stock { color: #0f9d63; }
.variations_form .woocommerce-variation-availability .stock.out-of-stock { color: var(--brand-red); }
.variations_form .single_variation_wrap .single-product-discount-block { margin: 0; flex: 0 1 auto; }
.variations_form .single_variation_wrap .woocommerce-variation-add-to-cart {
    flex: 1 1 220px;
    max-width: 320px;
    display: flex;
}
.variations_form .single_variation_wrap .woocommerce-variation-add-to-cart .single_add_to_cart_button { width: 100%; }
.product-cart-form button.single_add_to_cart_button.disabled {
    background-color: #cbd5e1 !important;
    box-shadow: none;
    cursor: not-allowed;
    transform: none;
}

/* «شروع قیمت از» برای محصول متغیر قبل از انتخاب */
.kn-price-from {
    flex-direction: row !important;
    align-items: baseline !important;
    gap: 6px;
    flex-wrap: wrap;
}
.kn-price-from-label {
    font-size: 12px;
    font-weight: 700;
    color: var(--text-muted);
}

@media (max-width: 767px) {
    .variations_form .single_variation_wrap { flex-direction: column; align-items: stretch; }
    .variations_form .single_variation_wrap .single-product-discount-block .single-product-price,
    .variations_form .single_variation_wrap .old-price-row { justify-content: flex-start; align-items: flex-start !important; }
    .variations_form .single_variation_wrap .woocommerce-variation-add-to-cart { max-width: none; flex-basis: auto; }
}

/* =========================================================================
   هدر حرفه‌ای آی‌زنگ (header.php + main.js بخش ۱ و ۲)
   -------------------------------------------------------------------------
   دسکتاپ:  [لوگو + نام]  [ــــ جست‌وجو ــــ]  [حساب | سبد خرید]
            [منوی دسته‌ها با زیرمنو/مگامنو ............ متن کوتاه ارسال]
   موبایل:  [☰]  [لوگو]  [حساب][سبد]   +   ردیف جست‌وجوی تمام‌عرض
            منو به‌صورت کشوی کناری از سمت راست باز می‌شود.
   هدر هنگام اسکرول ثابت و کامل می‌ماند (فقط یک سایه ملایم اضافه می‌شود).
========================================================================= */
:root {
    --kh-line: #eceef1;
    --kh-soft: #f4f5f7;
    --kh-ink: #0e2340;      /* متن و آیکون‌های هدر: سرمه‌ای بسیار تیره */
    --kh-ink-2: #2b3a52;
    --kh-muted: #6b6e75;
    --kh-header-h: 112px; /* با JS به‌روز می‌شود؛ برای ستون‌های چسبان سبد خرید/پرداخت/حساب */
}

.kh-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: #ffffff;
    border-bottom: 1px solid var(--kh-line);
    transition: box-shadow 0.25s ease;
}
.kh-header.is-scrolled { box-shadow: 0 6px 24px rgba(14, 90, 107, 0.07); }
body.admin-bar .kh-header { top: 32px; }
@media screen and (max-width: 782px) { body.admin-bar .kh-header { top: 46px; } }
@media screen and (max-width: 600px) { body.admin-bar .kh-header { top: 0; } }

.kh-header__inner {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 16px;
    box-sizing: border-box;
}

/* ---------- ردیف اصلی ---------- */
.kh-header__main .kh-header__inner {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-areas:
        "toggle brand actions"
        "search search search";
    align-items: center;
    column-gap: 8px;
    row-gap: 10px;
    padding-top: 10px;
    padding-bottom: 12px;
}
.kh-menu-toggle { grid-area: toggle; }
.kh-brand { grid-area: brand; min-width: 0; }
.kh-search { grid-area: search; }
.kh-actions { grid-area: actions; }

.kh-icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--kh-ink);
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.kh-icon-btn:hover { background: var(--kh-soft); }

/* لوگو و نام برند */
.kh-brand__link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    max-width: 100%;
    color: var(--kh-ink);
    text-decoration: none;
}
.kh-brand__logo {
    display: block;
    width: auto;
    height: 40px;
    max-width: 120px;
    object-fit: contain;
    flex-shrink: 0;
}
.site-logo-fallback.kh-brand__logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    border-radius: 12px;
    background: var(--kh-ink);
    color: #ffffff;
    font-size: 20px;
    font-weight: 800;
}
.kh-brand__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
.kh-brand__name {
    margin: 0;
    font-size: 14px;
    font-weight: 800;
    color: var(--kh-ink);
    letter-spacing: -0.2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.kh-brand__tagline {
    font-size: 11.5px;
    font-weight: 500;
    color: var(--kh-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* جست‌وجو */
.kh-search {
    position: relative;
    display: flex;
    align-items: center;
    height: 46px;
    background: var(--kh-soft);
    border: 1.5px solid transparent;
    border-radius: 12px;
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}
.kh-search:focus-within {
    background: #ffffff;
    border-color: var(--kh-ink);
    box-shadow: 0 0 0 4px rgba(14, 90, 107, 0.06);
}
.kh-search__icon { position: absolute; right: 14px; color: var(--kh-muted); pointer-events: none; }
.kh-search__input {
    flex: 1;
    min-width: 0;
    height: 100%;
    padding: 0 44px 0 12px;
    border: 0;
    background: transparent;
    font-family: inherit;
    font-size: 14px;
    color: var(--kh-ink);
    outline: none;
    -webkit-appearance: none;
    appearance: none;
}
.kh-search__input::placeholder { color: #9a9da4; }
.kh-search__input::-webkit-search-cancel-button { -webkit-appearance: none; }
.kh-search__input:focus-visible { outline: none; } /* حالت فوکوس روی خود کادر (focus-within) نمایش داده می‌شود */
.kh-search__submit {
    display: none; /* در موبایل Enter صفحه‌کلید کافی است */
    height: 36px;
    margin-left: 5px;
    padding: 0 18px;
    border: 0;
    border-radius: 9px;
    background: var(--kh-ink);
    color: #ffffff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
    transition: background-color 0.2s ease;
}
.kh-search__submit:hover { background: var(--izang-primary-gradient); }

/* حساب کاربری و سبد خرید */
.kh-actions { display: flex; align-items: center; gap: 2px; }
.kh-actions__sep { display: none; width: 1px; height: 24px; background: var(--kh-line); margin: 0 6px; }
.kh-action {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    min-width: 42px;
    padding: 0 9px;
    border-radius: 12px;
    color: var(--kh-ink);
    text-decoration: none;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    transition: background-color 0.2s ease;
}
.kh-action:hover { background: var(--kh-soft); color: var(--kh-ink); }
.kh-action__label { display: none; }
.kh-action__icon { position: relative; display: inline-flex; }
.kh-action .cart-count {
    position: absolute;
    top: -7px;
    right: -9px;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    background: var(--izang-action);
    color: #ffffff;
    font-size: 11px;
    font-weight: 800;
    line-height: 15px;
    text-align: center;
    box-sizing: border-box;
}
.kh-action--cart.is-bumped .kh-action__icon { animation: khCartBump 0.45s ease; }
@keyframes khCartBump { 0%,100% { transform: scale(1); } 40% { transform: scale(1.18); } }

/* ---------- ردیف منو / کشوی موبایل ---------- */
.kh-header__note { display: none; }

.kh-nav {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 20;
    width: min(86vw, 360px);
    display: flex;
    flex-direction: column;
    background: #ffffff;
    box-shadow: -12px 0 40px rgba(14, 90, 107, 0.18);
    transform: translateX(105%);
    visibility: hidden;
    transition: transform 0.32s cubic-bezier(0.22, 0.8, 0.3, 1), visibility 0s linear 0.32s;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.kh-nav.is-open {
    transform: translateX(0);
    visibility: visible;
    transition: transform 0.32s cubic-bezier(0.22, 0.8, 0.3, 1), visibility 0s;
}
body.admin-bar .kh-nav { top: 46px; }
@media screen and (max-width: 600px) { body.admin-bar .kh-nav { top: 0; } }

.kh-nav__head {
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px 12px 10px;
    background: #ffffff;
    border-bottom: 1px solid var(--kh-line);
}
.kh-nav__title { font-size: 14px; font-weight: 800; color: var(--kh-ink); }

.kh-nav .nav-menu,
.kh-nav .sub-menu { list-style: none; margin: 0; padding: 0; }
.kh-nav .nav-menu { padding: 8px 0; }
.kh-nav .menu-item { position: relative; }
.kh-nav .nav-menu > .menu-item { border-bottom: 1px solid var(--kh-soft); }
.kh-nav .menu-item > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 18px;
    color: var(--kh-ink);
    font-size: 14.5px;
    font-weight: 700;
    text-decoration: none;
}
.kh-nav .menu-item > a:hover { color: var(--kh-ink); background: var(--kh-soft); }
.kh-nav .current-menu-item > a,
.kh-nav .current-menu-ancestor > a { color: var(--kh-ink); }
.kh-nav .current-menu-item > a .menu-item-text { box-shadow: inset 0 -2px 0 var(--izang-action); }

/* فلش زیرمنو (رسم با حاشیه؛ بدون فونت آیکون) */
.kh-nav .dropdown-caret {
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    transition: transform 0.25s ease;
    flex-shrink: 0;
    opacity: 0.7;
}
.kh-nav .menu-open > a .dropdown-caret { transform: rotate(-135deg) translateY(-2px); }

/* زیرمنوها در کشوی موبایل: آکاردئونی */
.kh-nav .sub-menu { display: none; background: #fafafb; padding: 4px 0 8px; }
.kh-nav .menu-open > .sub-menu { display: block; }
.kh-nav .sub-menu .menu-item > a { padding: 11px 32px 11px 18px; font-size: 13.5px; font-weight: 600; color: var(--kh-ink-2); }
.kh-nav .sub-menu .sub-menu .menu-item > a { padding-right: 46px; }
.kh-nav .kh-view-all > a { font-weight: 800 !important; color: var(--kh-ink) !important; }

.kh-nav__extra {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    padding: 12px 18px 22px;
    gap: 4px;
    border-top: 1px solid var(--kh-line);
    background: #fafafb;
}
.kh-nav__extra a { padding: 9px 0; color: var(--kh-ink-2); font-size: 13.5px; font-weight: 700; text-decoration: none; }
.kh-nav__extra a:hover { color: var(--kh-ink); }

.kh-backdrop {
    position: fixed;
    inset: 0;
    z-index: 15;
    background: rgba(17, 18, 21, 0.45);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.kh-backdrop.is-visible { opacity: 1; }
.kh-backdrop[hidden] { display: none; }
body.kh-nav-open { overflow: hidden; }

/* ---------- تبلت به بالا: نام برند و برچسب‌ها ---------- */
/* موبایل: نام بلند فروشگاه در دو خط و بدون تگ‌لاین، تا بریده نشود */
@media (max-width: 599px) {
    .kh-brand__tagline { display: none; }
    .kh-brand__name {
        white-space: normal;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        font-size: 13px;
        line-height: 1.55;
    }
    .kh-brand__logo { height: 36px; }
    .site-logo-fallback.kh-brand__logo { width: 36px; font-size: 18px; border-radius: 10px; }
    .kh-action { padding: 0 8px; }
}
@media (min-width: 600px) {
    .kh-brand__name { font-size: 15.5px; }
    .kh-action--account .kh-action__label { display: none; }
}

/* ---------- دسکتاپ ---------- */
@media (min-width: 992px) {
    .kh-menu-toggle,
    .kh-nav__head,
    .kh-nav__extra,
    .kh-backdrop { display: none !important; }

    .kh-header__inner { padding: 0 32px; }
    .kh-header__main .kh-header__inner {
        grid-template-columns: minmax(220px, auto) minmax(320px, 620px) auto;
        grid-template-areas: "brand search actions";
        justify-content: space-between;
        column-gap: 32px;
        height: 80px;
        padding-top: 0;
        padding-bottom: 0;
    }
    .kh-brand__logo { height: 48px; }
    .site-logo-fallback.kh-brand__logo { width: 48px; font-size: 24px; }
    .kh-brand__name { font-size: 17px; }
    .kh-brand__tagline { font-size: 12px; }

    .kh-search { height: 48px; }
    .kh-search__submit { display: inline-block; }

    .kh-actions { gap: 4px; }
    .kh-actions__sep { display: block; }
    .kh-action { padding: 0 12px; height: 46px; }
    .kh-action .kh-action__label,
    .kh-action--account .kh-action__label { display: inline; }
    .kh-action--account {
        border: 1.5px solid var(--kh-line);
    }
    .kh-action--account:hover { border-color: #d6d8dc; }

    /* ردیف منو */
    .kh-header__nav { border-top: 1px solid var(--kh-soft); }
    .kh-header__nav .kh-header__inner {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
        height: 52px;
    }
    .kh-nav {
        position: static;
        width: auto;
        transform: none;
        visibility: visible;
        box-shadow: none;
        background: transparent;
        overflow: visible;
        display: block;
        transition: none;
    }
    .kh-nav .nav-menu {
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 0;
    }
    .kh-nav .nav-menu > .menu-item { border: 0; }
    .kh-nav .nav-menu > .menu-item > a {
        position: relative;
        height: 52px;
        padding: 0 12px;
        font-size: 14px;
        font-weight: 700;
        color: var(--kh-ink-2);
        gap: 6px;
        background: transparent;
    }
    .kh-nav .nav-menu > .menu-item > a::after {
        content: '';
        position: absolute;
        right: 12px;
        left: 12px;
        bottom: 0;
        height: 2px;
        border-radius: 2px 2px 0 0;
        background: var(--kh-ink);
        transform: scaleX(0);
        transition: transform 0.25s ease;
    }
    .kh-nav .nav-menu > .menu-item > a:hover,
    .kh-nav .nav-menu > .menu-item:focus-within > a,
    .kh-nav .nav-menu > .current-menu-item > a,
    .kh-nav .nav-menu > .current-menu-ancestor > a { color: var(--kh-ink); background: transparent; }
    .kh-nav .nav-menu > .menu-item > a:hover::after,
    .kh-nav .nav-menu > .menu-item:hover > a::after,
    .kh-nav .nav-menu > .current-menu-item > a::after,
    .kh-nav .nav-menu > .current-menu-ancestor > a::after { transform: scaleX(1); }
    .kh-nav .current-menu-item > a .menu-item-text { box-shadow: none; }
    .kh-nav .dropdown-caret { width: 6px; height: 6px; }
    .kh-nav .menu-item:hover > a .dropdown-caret,
    .kh-nav .menu-open > a .dropdown-caret { transform: rotate(-135deg) translateY(-2px); }

    /* زیرمنوی ساده */
    .kh-nav .dropdown-menu {
        position: absolute;
        top: 100%;
        right: 0;
        z-index: 30;
        display: block;
        min-width: 230px;
        padding: 8px;
        background: #ffffff;
        border: 1px solid var(--kh-line);
        border-radius: 14px;
        box-shadow: 0 18px 40px rgba(14, 90, 107, 0.12);
        opacity: 0;
        visibility: hidden;
        transform: translateY(6px);
        transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    }
    .kh-nav .dropdown-menu .dropdown-menu { top: -9px; right: calc(100% + 8px); }
    .kh-nav .menu-item:hover > .dropdown-menu,
    .kh-nav .menu-item:focus-within > .dropdown-menu,
    .kh-nav .menu-open > .dropdown-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
    .kh-nav .dropdown-menu .menu-item > a {
        padding: 10px 12px;
        border-radius: 9px;
        font-size: 13.5px;
        font-weight: 600;
        color: var(--kh-ink-2);
        white-space: nowrap;
    }
    .kh-nav .dropdown-menu .menu-item > a:hover { background: var(--kh-soft); color: var(--kh-ink); }
    .kh-nav .dropdown-menu .dropdown-caret { transform: rotate(135deg); }

    /* مگامنوی چندستونه (کلاس CSS «mega-menu» روی آیتم منو در پیشخوان) */
    .kh-nav .nav-menu > .has-mega { position: static; }
    .kh-header__nav .kh-header__inner { position: relative; }
    .kh-nav .mega-menu-panel {
        position: absolute;
        top: 100%;
        right: 32px;
        left: 32px;
        z-index: 30;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
        gap: 8px 28px;
        padding: 24px 28px;
        background: #ffffff;
        border: 1px solid var(--kh-line);
        border-radius: 0 0 18px 18px;
        box-shadow: 0 24px 50px rgba(14, 90, 107, 0.12);
        opacity: 0;
        visibility: hidden;
        transform: translateY(6px);
        transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
    }
    .kh-nav .has-mega:hover > .mega-menu-panel,
    .kh-nav .has-mega:focus-within > .mega-menu-panel,
    .kh-nav .has-mega.menu-open > .mega-menu-panel { opacity: 1; visibility: visible; transform: translateY(0); }
    .kh-nav .mega-menu-panel > .menu-item > a {
        padding: 0 0 10px;
        margin-bottom: 6px;
        border-bottom: 1px solid var(--kh-line);
        font-size: 14px;
        font-weight: 800;
        color: var(--kh-ink);
        background: transparent;
    }
    .kh-nav .mega-menu-panel > .menu-item > a .dropdown-caret { display: none; }
    .kh-nav .mega-menu-panel .dropdown-menu {
        position: static;
        min-width: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
        opacity: 1;
        /* inherit (نه visible): وگرنه لینک‌های مگامنوی بسته، نامرئی ولی قابل‌کلیک روی
           صفحه می‌ماندند و هاور روی گالری محصول را قطع می‌کردند (پرش تصویر زوم) */
        visibility: inherit;
        pointer-events: inherit;
        transform: none;
        background: transparent;
    }
    .kh-nav .mega-menu-panel .dropdown-menu .menu-item > a { padding: 7px 0; font-weight: 500; color: var(--kh-muted); }
    .kh-nav .mega-menu-panel .dropdown-menu .menu-item > a:hover { background: transparent; color: var(--kh-ink); }

    .kh-header__note {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        margin: 0;
        font-size: 12.5px;
        font-weight: 700;
        color: var(--kh-muted);
        white-space: nowrap;
    }
}

@media (min-width: 1200px) {
    .kh-nav .nav-menu > .menu-item > a { padding: 0 14px; }
}

/* ستون‌های چسبان صفحات سبد خرید، پرداخت و حساب کاربری زیر هدر جدید */
@media (min-width: 992px) {
    .cart-summary-sticky,
    .izang-summary-sticky,
    .izang-account-sidebar-sticky { top: calc(var(--kh-header-h, 80px) + 20px) !important; }
    body.admin-bar .cart-summary-sticky,
    body.admin-bar .izang-summary-sticky,
    body.admin-bar .izang-account-sidebar-sticky { top: calc(var(--kh-header-h, 80px) + 52px) !important; }
}

/* احترام به کاربرانی که انیمیشن را در سیستم‌عامل خاموش کرده‌اند */
@media (prefers-reduced-motion: reduce) {
    .kh-nav, .kh-backdrop, .kh-nav .dropdown-menu, .kh-nav .mega-menu-panel { transition: none !important; }
    .kh-action--cart.is-bumped .kh-action__icon { animation: none; }
}
@media (min-width: 992px) {
    .kh-nav .menu-item.is-dismissed > .dropdown-menu,
    .kh-nav .menu-item.is-dismissed > .mega-menu-panel { opacity: 0 !important; visibility: hidden !important; }
}

/* =========================================================================
   رنگ‌های لوگو در هدر (سرمه‌ای + فیروزه‌ای)
========================================================================= */
/* نوار باریک دو رنگ بالای هدر، الهام‌گرفته از کمان‌های سرمه‌ای و فیروزه‌ای لوگو */
.kh-header::before {
    content: '';
    display: block;
    height: 3px;
    background: linear-gradient(90deg, var(--brand-cyan) 0 30%, var(--brand-navy) 30% 100%);
}
.izang-announcement-bar {
    background: var(--brand-navy-dark);
    background-image: linear-gradient(90deg, var(--brand-navy-dark), var(--brand-navy));
}
.izang-announcement-text::before { background-color: var(--brand-cyan); }

.kh-brand__name { color: var(--brand-navy); }
.site-logo-fallback.kh-brand__logo { background: var(--brand-navy); }

.kh-search { background: #f2f5f9; }
.kh-search:focus-within {
    border-color: var(--brand-navy);
    box-shadow: 0 0 0 4px rgba(2, 177, 221, 0.15);
}
.kh-search__submit { background: var(--brand-navy); }
.kh-search__submit:hover { background: var(--brand-navy-dark); }

.kh-action:hover { background: var(--brand-navy-soft); color: var(--brand-navy); }
.kh-action--account { border-color: #dfe7f0; }
.kh-action--account:hover { border-color: var(--brand-navy); }
.kh-action .cart-count {
    background: var(--brand-cyan);
    color: var(--brand-navy-dark);
}

.kh-icon-btn:hover { background: var(--brand-navy-soft); color: var(--brand-navy); }

@media (min-width: 992px) {
    .kh-nav .nav-menu > .menu-item > a::after {
        height: 3px;
        background: var(--brand-cyan);
    }
    .kh-nav .nav-menu > .menu-item > a:hover,
    .kh-nav .nav-menu > .menu-item:focus-within > a,
    .kh-nav .nav-menu > .current-menu-item > a,
    .kh-nav .nav-menu > .current-menu-ancestor > a { color: var(--brand-navy); }
    .kh-nav .dropdown-menu .menu-item > a:hover { background: var(--brand-navy-soft); color: var(--brand-navy); }
    .kh-nav .mega-menu-panel > .menu-item > a { color: var(--brand-navy); border-bottom-color: var(--brand-cyan-soft); }
    .kh-nav .mega-menu-panel .dropdown-menu .menu-item > a:hover { color: var(--brand-navy); }
    .kh-nav .dropdown-menu,
    .kh-nav .mega-menu-panel { border-top: 3px solid var(--brand-cyan); }
    .kh-header__note svg { color: var(--brand-cyan-text); }
}
.kh-nav .current-menu-item > a .menu-item-text { box-shadow: inset 0 -2px 0 var(--brand-cyan); }
.kh-nav .menu-item > a:hover { background: var(--brand-navy-soft); color: var(--brand-navy); }
.kh-nav__head { border-bottom: 3px solid var(--brand-cyan); }
.kh-nav__title { color: var(--brand-navy); }

/* انتخابگر رنگ/سایز و سایر حالت‌های انتخاب با حلقه فیروزه‌ای */
.kn-swatch:hover { border-color: var(--brand-cyan); }
.kn-swatches--color .kn-swatch.is-selected { border-color: var(--brand-navy); box-shadow: 0 0 0 1px var(--brand-navy), 0 0 0 4px var(--brand-cyan-soft); }

/* فوکوس کیبورد در کل سایت: فیروزه‌ای لوگو */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline-color: var(--brand-cyan-text); }

/* زیرمنوها و مگامنوی بسته هیچ رویداد ماوسی نمی‌گیرند (لایه نامرئی روی محتوای صفحه نمی‌ماند) */
@media (min-width: 992px) {
    .kh-nav .dropdown-menu,
    .kh-nav .mega-menu-panel { pointer-events: none; }
    .kh-nav .menu-item:hover > .dropdown-menu,
    .kh-nav .menu-item:focus-within > .dropdown-menu,
    .kh-nav .menu-open > .dropdown-menu,
    .kh-nav .has-mega:hover > .mega-menu-panel,
    .kh-nav .has-mega:focus-within > .mega-menu-panel,
    .kh-nav .has-mega.menu-open > .mega-menu-panel { pointer-events: auto; }
    .kh-nav .menu-item.is-dismissed > .dropdown-menu,
    .kh-nav .menu-item.is-dismissed > .mega-menu-panel { pointer-events: none !important; }
}

/* گالری محصول: کلیک = نمایش تمام‌صفحه */
.woocommerce-product-gallery__image a { cursor: zoom-in; display: block; }
.woocommerce-product-gallery__trigger { transition: transform 0.2s ease, box-shadow 0.2s ease; }
.woocommerce-product-gallery__trigger:hover { transform: scale(1.06); box-shadow: 0 6px 16px rgba(14, 90, 107, 0.18); }
/* شمارنده نمایش تمام‌صفحه در RTL برعکس دیده می‌شد («۴ / ۳» به‌جای «۳ از ۴») */
.pswp__counter { direction: ltr; unicode-bidi: isolate; }

/* «از …» در کارت محصول متغیر بدون تخفیف: در یک خط */
.product-price-box .kn-price-from {
    flex-direction: row !important;
    align-items: baseline !important;
    justify-content: flex-end;
    gap: 5px;
}
.fp-product-price.product-price-box { display: flex; margin: 0; min-height: 0; }
.fp-product-price .old-price-row { justify-content: flex-end; }


/* =========================================================================
   شمارنده سبد خرید هدر: قرمز، درشت‌تر و با موج توجه
   - هر چند ثانیه یک موج قرمز از دور عدد پخش می‌شود (فقط وقتی سبد خالی نیست؛
     چون وقتی سبد خالی است اصلاً عددی چاپ نمی‌شود)
   - بعد از افزودن محصول، عدد با یک «پرش» کوتاه ظاهر می‌شود (main.js → is-bumped)
   - کاربرانی که انیمیشن را در سیستم‌عامل خاموش کرده‌اند، فقط عدد ثابت می‌بینند
========================================================================= */
.kh-action .cart-count {
    top: -9px;
    right: -11px;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border: 2px solid #ffffff;
    border-radius: 999px;
    background: #e3262f;
    color: #ffffff;
    font-size: 12px;
    font-weight: 900;
    line-height: 18px;
    box-shadow: 0 3px 8px rgba(227, 38, 47, 0.45);
    z-index: 1;
}
.kh-action .cart-count::after {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    border: 2px solid #e3262f;
    opacity: 0;
    z-index: -1;
    animation: khCartWave 2.8s ease-out 1s infinite;
    pointer-events: none;
}
@keyframes khCartWave {
    0%   { transform: scale(1);   opacity: 0.75; }
    45%  { transform: scale(2.1); opacity: 0; }
    100% { transform: scale(2.1); opacity: 0; }
}
/* سبد دارای کالا: آیکون هم کمی پررنگ‌تر */
.kh-action--cart:has(.cart-count) { color: var(--brand-navy); }
.kh-action--cart:has(.cart-count) .kh-action__label { color: var(--brand-navy); }

/* لحظه افزودن به سبد: پرش عدد و آیکون */
.kh-action--cart.is-bumped .cart-count { animation: khCountPop 0.6s cubic-bezier(0.3, 1.6, 0.5, 1); }
@keyframes khCountPop {
    0%   { transform: scale(0.3); }
    60%  { transform: scale(1.35); }
    100% { transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
    .kh-action .cart-count::after { animation: none; }
    .kh-action--cart.is-bumped .cart-count { animation: none; }
}

/* =========================================
   صفحه درباره ما (kn-about)
   محل قرارگیری: انتهای فایل style.css
========================================= */
.kn-about{direction:rtl;max-width:1100px;margin:0 auto;padding:10px 0 50px;color:var(--text-main,#16202A);font-size:14px;line-height:2;text-align:right}
.kn-about *{box-sizing:border-box}
.kn-about p{margin:0 0 12px}
.kn-about a{text-decoration:none}
.kn-about-hero{background:var(--primary-color,#16202A);color:#fff;border-radius:20px;padding:34px 22px;margin-bottom:22px;position:relative;overflow:hidden}
.kn-about-hero::after{content:'';position:absolute;left:-60px;bottom:-60px;width:200px;height:200px;border-radius:50%;border:34px solid rgba(201,161,90,.16)}
.kn-about-kicker{display:table;font-size:11.5px;font-weight:800;color:var(--attention-color,#c9a15a);border:1px solid rgba(201,161,90,.5);padding:3px 14px;border-radius:20px;margin-bottom:14px}
.kn-about-hero h2{font-size:22px;font-weight:800;line-height:1.7;margin:0 0 10px;color:#fff;position:relative;z-index:1}
.kn-about-hero p{font-size:13.5px;color:var(--text-light,#a8a9ac);max-width:620px;margin:0;position:relative;z-index:1}
.kn-about-card{background:var(--card-bg,#fff);border:1px solid #f1f5f9;border-radius:18px;padding:22px 18px;margin-bottom:22px;box-shadow:0 4px 15px rgba(0,0,0,.03)}
.kn-about-title{font-size:16px;font-weight:800;color:var(--primary-color,#16202A);margin:0 0 14px;padding-bottom:12px;border-bottom:1px dashed #e2e8f0}
.kn-about-card p{color:var(--text-muted,#55575c);text-align:justify}
.kn-about-card p:last-child{margin-bottom:0}
.kn-about-values{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:22px}
.kn-about-value{background:var(--card-bg,#fff);border:1px solid #f1f5f9;border-radius:16px;padding:18px 14px;box-shadow:0 4px 15px rgba(0,0,0,.03);transition:all .3s ease}
.kn-about-value:hover{transform:translateY(-4px);border-color:var(--primary-color,#16202A)}
.kn-about-value-icon{width:42px;height:42px;border-radius:12px;background:rgba(23,24,28,.06);color:var(--primary-color,#16202A);display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.kn-about-value strong{display:block;font-size:13.5px;font-weight:800;margin-bottom:4px}
.kn-about-value span{display:block;font-size:12px;color:var(--text-muted,#55575c);line-height:1.8}
.kn-about-contact{display:grid;grid-template-columns:1fr;gap:10px}
.kn-about-contact-item{display:flex;align-items:center;gap:12px;background:var(--bg-color,#f7f7f8);border:1px solid #f1f5f9;border-radius:14px;padding:13px 14px;color:var(--text-main,#16202A);transition:all .25s ease}
a.kn-about-contact-item:hover{border-color:var(--primary-color,#16202A);background:#fff;transform:translateY(-2px)}
.kn-about-contact-icon{width:40px;height:40px;flex-shrink:0;border-radius:50%;background:var(--primary-color,#16202A);color:#fff;display:flex;align-items:center;justify-content:center}
.kn-about-contact-item small{display:block;font-size:11px;font-weight:700;color:var(--text-muted,#55575c);line-height:1.6}
.kn-about-contact-item b{display:block;font-size:14.5px;font-weight:800;line-height:1.7}
.kn-about-ltr{direction:ltr;unicode-bidi:embed;display:inline-block}
.kn-about-map{border-radius:16px;overflow:hidden;border:1px solid #e2e8f0;margin-top:16px;line-height:0}
.kn-about-map iframe{width:100%;height:300px;border:0;display:block}
.kn-about-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.kn-about-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:12px;font-size:13px;font-weight:800;background:var(--primary-color,#16202A);color:#fff!important;transition:all .25s ease}
.kn-about-btn:hover{background:var(--primary-gradient,#2c2e34);transform:translateY(-2px)}
.kn-about-btn.is-outline{background:#fff;color:var(--primary-color,#16202A)!important;border:2px solid #e2e8f0}
.kn-about-btn.is-outline:hover{border-color:var(--primary-color,#16202A)}
@media (min-width:768px){
.kn-about{font-size:15px}
.kn-about-hero{padding:54px 46px}
.kn-about-hero h2{font-size:30px}
.kn-about-hero p{font-size:15px}
.kn-about-card{padding:32px 34px}
.kn-about-title{font-size:19px}
.kn-about-values{grid-template-columns:repeat(4,1fr);gap:18px}
.kn-about-contact{grid-template-columns:repeat(2,1fr);gap:14px}
.kn-about-contact-item.is-wide{grid-column:1 / -1}
.kn-about-map iframe{height:400px}
}

/* وردپرس به‌صورت خودکار <p> و <br> اضافه به محتوای برگه تزریق می‌کند (wpautop)
   که در گریدها یک خانه خالی می‌سازد و چیدمان دوستونه را به‌هم می‌زند */
.kn-about-contact > p,
.kn-about-contact > br,
.kn-about-values > p,
.kn-about-values > br,
.kn-about-cta > p,
.kn-about-cta > br,
.kn-about-value br,
.kn-about-contact-item br,
.kn-about p:empty {
    display: none;
}

/* =========================================
   برگه‌های تماس با ما / قوانین / شکایات / پیگیری سفارش
   (مکمل استایل‌های kn-about) — محل قرارگیری: انتهای style.css
========================================= */
.kn-about-list{list-style:none;margin:0;padding:0}
.kn-about-list li{position:relative;padding-right:20px;margin-bottom:10px;color:var(--text-muted,#55575c);text-align:justify}
.kn-about-list li:last-child{margin-bottom:0}
.kn-about-list li::before{content:'';position:absolute;right:0;top:12px;width:7px;height:7px;border-radius:50%;background:var(--primary-color,#16202A)}
.kn-about-list b{color:var(--text-main,#16202A);font-weight:800}
.kn-about-steps{list-style:none;margin:0;padding:0;counter-reset:kn-step}
.kn-about-steps li{counter-increment:kn-step;position:relative;padding:0 52px 18px 0}
.kn-about-steps li:last-child{padding-bottom:0}
.kn-about-steps li::before{content:counter(kn-step);position:absolute;right:0;top:0;width:38px;height:38px;border-radius:50%;background:var(--primary-color,#16202A);color:#fff;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center}
.kn-about-steps strong{display:block;font-size:14px;font-weight:800;color:var(--text-main,#16202A)}
.kn-about-steps span{display:block;font-size:13px;color:var(--text-muted,#55575c)}
.kn-about-steps br,.kn-about-list br{display:none}
.kn-about-note{margin:16px 0 0!important;padding:12px 16px;background:var(--bg-color,#f7f7f8);border-right:4px solid var(--attention-color,#c9a15a);border-radius:10px;font-size:13px;color:var(--text-main,#16202A)!important;text-align:right!important}
.kn-about-card>.kn-about-list+.kn-about-contact,.kn-about-card>p+.kn-about-contact{margin-top:16px}
/* فرم پیگیری سفارش ووکامرس داخل کارت */
.kn-about .woocommerce{padding:0;margin:0;max-width:none}
.kn-about .track_order p{color:var(--text-muted,#55575c)}
.kn-about .track_order .form-row{float:none;width:100%;margin:0 0 14px}
.kn-about .track_order .clear{display:none}
.kn-about .track_order button.button{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;font-family:inherit;padding:13px 30px;border-radius:12px;font-size:14px;font-weight:800;background:var(--primary-color,#16202A);color:#fff;transition:all .25s ease}
.kn-about .track_order button.button:hover{background:var(--primary-gradient,#2c2e34);transform:translateY(-2px)}
@media (min-width:768px){
.kn-about .track_order{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.kn-about .track_order>p:first-of-type,.kn-about .track_order>p:last-of-type{grid-column:1 / -1}
.kn-about-steps strong{font-size:15px}
}


/* =========================================================================
   آی‌زنگ — هدر، فوتر و اجزای مشترک (روی همه صفحه‌ها)
   رنگ‌ها: سبزآبی تیره #0E5A6B، کهربایی #F2B636 (فقط نقطه اعلان و تأکید)، مرکب #16202A
========================================================================= */
:root {
    --iz-teal: #0E5A6B;
    --iz-teal-dark: #0A4654;
    --iz-teal-soft: #E3EFF1;
    --iz-amber: #F2B636;
    --iz-ink: #16202A;
    --iz-muted: #4E5A66;
    --iz-line: #D9E0E5;
    --iz-paper: #F4F6F7;
    --iz-white: #ffffff;
    --iz-radius: 14px;
    --iz-wrap: 1160px;
}
body { font-family: 'Vazirmatn', Tahoma, sans-serif; color: var(--iz-ink); background: var(--iz-paper); }
:focus-visible { outline: 3px solid var(--iz-amber); outline-offset: 2px; }

.iz-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 44px; padding: 0 20px; border-radius: 12px;
    font: inherit; font-weight: 700; font-size: 15px; line-height: 1; text-decoration: none;
    border: 2px solid var(--iz-teal); cursor: pointer; transition: background-color .15s, color .15s;
}
.iz-btn--solid { background: var(--iz-teal); color: var(--iz-white); }
.iz-btn--solid:hover { background: var(--iz-teal-dark); border-color: var(--iz-teal-dark); color: var(--iz-white); }
.iz-btn--line { background: transparent; color: var(--iz-teal); }
.iz-btn--line:hover { background: var(--iz-teal-soft); color: var(--iz-teal-dark); }
.iz-btn--lg { min-height: 52px; padding: 0 26px; font-size: 16px; }

.iz-icon-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; border: 0; border-radius: 10px; background: transparent; color: var(--iz-ink); cursor: pointer;
}
.iz-icon-btn:hover { background: var(--iz-teal-soft); color: var(--iz-teal); }

/* --- برند --- */
.iz-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--iz-teal); text-decoration: none; flex: none; }
.iz-brand__name { font-size: 24px; font-weight: 800; color: var(--iz-ink); letter-spacing: -.01em; }
.iz-brand__logo { max-height: 44px; width: auto; }
.izang-mark { display: block; color: var(--iz-teal); }

/* --- هدر --- */
.iz-header { position: sticky; top: 0; z-index: 100; background: #fff; border-bottom: 1px solid var(--iz-line); }
.iz-header.is-scrolled { box-shadow: 0 6px 20px rgba(22,32,42,.06); }
.iz-header__inner { max-width: var(--iz-wrap); margin: 0 auto; padding: 0 16px; height: 70px; display: flex; align-items: center; gap: 24px; }
.iz-header__actions { display: flex; align-items: center; gap: 10px; margin-inline-start: auto; }
.iz-header__parent { color: var(--iz-ink); font-weight: 700; font-size: 15px; text-decoration: none; padding: 10px 8px; }
.iz-header__parent:hover { color: var(--iz-teal); }
.iz-header__school { min-height: 42px; }
.iz-menu-toggle { display: none; }

.iz-nav .nav-menu { display: flex; gap: 2px; list-style: none; margin: 0; padding: 0; }
.iz-nav .nav-menu > .menu-item > a { display: block; padding: 10px 12px; border-radius: 10px; color: var(--iz-ink); font-weight: 500; font-size: 15px; text-decoration: none; }
.iz-nav .nav-menu > .menu-item > a:hover { color: var(--iz-teal); background: var(--iz-teal-soft); }
.iz-nav .nav-menu > .current-menu-item > a { color: var(--iz-teal); font-weight: 800; background: var(--iz-teal-soft); }
.iz-nav .sub-menu { display: none; }
.iz-nav__head, .iz-nav__logins { display: none; }

@media (max-width: 991px) {
    .iz-menu-toggle { display: inline-flex; }
    .iz-header__parent { display: none; }
    .iz-nav {
        position: fixed; inset: 0 0 0 auto; width: min(86vw, 340px); background: var(--iz-white);
        transform: translateX(100%); transition: transform .25s ease; z-index: 120;
        display: flex; flex-direction: column; padding: 12px 16px 24px; overflow-y: auto;
        box-shadow: -12px 0 30px rgba(22,32,42,.15);
    }
    .iz-nav.is-open { transform: translateX(0); }
    .iz-nav__head { display: flex; align-items: center; justify-content: space-between; padding-bottom: 10px; margin-bottom: 8px; border-bottom: 1px solid var(--iz-line); }
    .iz-nav__title { font-weight: 800; }
    .iz-nav .nav-menu { flex-direction: column; }
    .iz-nav .nav-menu > .menu-item > a { padding: 14px 8px; font-size: 16px; border-bottom: 1px solid #eef2f4; border-radius: 0; }
    .iz-nav .sub-menu { display: block; list-style: none; padding: 0 16px 0 0; }
    .iz-nav__logins { display: grid; gap: 10px; margin-top: 20px; }
    .iz-backdrop { position: fixed; inset: 0; background: rgba(22,32,42,.45); opacity: 0; transition: opacity .25s; z-index: 110; }
    .iz-backdrop.is-visible { opacity: 1; }
}
@media (max-width: 420px) {
    .iz-header__inner { gap: 10px; }
    .iz-brand__name { font-size: 21px; }
    .iz-header__school { padding: 0 12px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) { .iz-nav, .iz-backdrop { transition: none; } }

/* --- فوتر --- */
.iz-footer { background: var(--iz-ink); color: #C9D2DA; margin-top: 0; }
.iz-footer a { color: #fff; text-decoration: none; }
.iz-footer a:hover { color: var(--iz-amber); }
.iz-footer__inner { max-width: var(--iz-wrap); margin: 0 auto; padding: 56px 16px 36px; display: grid; grid-template-columns: 1.4fr 1fr 1.3fr 1fr; gap: 40px; }
.iz-footer h2 { color: #fff; font-size: 16px; font-weight: 800; margin: 0 0 14px; }
.iz-footer p { line-height: 1.95; font-size: 14px; margin: 14px 0 0; }
.iz-brand--footer .iz-brand__name { color: #fff; }
.iz-brand--footer .izang-mark { color: #fff; }
.iz-footer__logins { display: flex; gap: 16px; margin-top: 18px; font-weight: 700; font-size: 14px; }
.iz-footer__links ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: 14px; }
.iz-footer__links ul.iz-footer__links-grid { grid-template-columns: 1fr 1fr; column-gap: 18px; }
.iz-footer__contact dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 14px; margin: 0; font-size: 14px; }
.iz-footer__contact dt { color: #9AA8B4; }
.iz-footer__contact dd { margin: 0; }
.iz-footer__map { margin-top: 14px; aspect-ratio: 16 / 10; border-radius: 10px; overflow: hidden; }
.iz-footer__map iframe { width: 100%; height: 100%; border: 0; }
.iz-footer__badges { display: flex; gap: 10px; flex-wrap: wrap; }
.iz-footer__badges img { background: #fff; border-radius: 10px; padding: 6px; width: 90px; height: auto; }
.iz-footer__bottom { border-top: 1px solid rgba(255,255,255,.1); max-width: var(--iz-wrap); margin: 0 auto; padding: 18px 16px 26px; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 13px; color: #9AA8B4; }
.iz-footer__bottom p { margin: 0; }
@media (max-width: 900px) { .iz-footer__inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .iz-footer__inner { grid-template-columns: 1fr; gap: 30px; } }

/* --- بعد از خرید پلن --- */
.izang-next-steps { background: var(--iz-teal-soft); border: 1px solid #bcd7dc; border-radius: var(--iz-radius); padding: 22px 24px; margin: 0 0 24px; }
.izang-next-steps h2 { font-size: 18px; margin: 0 0 10px; color: var(--iz-teal-dark); }
.izang-next-steps ol { margin: 0 0 10px; padding-inline-start: 22px; line-height: 2; }
.izang-next-steps p { margin: 0; }

/* بلاگ آی‌زنگ: جای خالی تصویر شاخص و برچسب دسته */
.iz-thumb-fallback { display: flex; align-items: center; justify-content: center; height: 100%; min-height: 180px; background: var(--iz-teal-soft); color: var(--iz-teal); }
.blog-category-badge { background: var(--iz-teal) !important; color: #fff !important; }
.iz-empty-mark { color: var(--iz-teal); margin-bottom: 14px; display: flex; justify-content: center; }
.related-post-placeholder.iz-thumb-fallback { min-height: 140px; width: 100%; }
.izang-next-steps a { color: var(--iz-teal); font-weight: 700; }
.iz-thumb-fallback { width: 100%; }

/* --- پیوند «بیشتر» زیر بخش‌های صفحه اصلی به برگه‌های جداگانه (۱.۲.۰) --- */
.iz-more { margin: 22px 0 0; font-weight: 800; font-size: 15px; }
.iz-more a { color: var(--brand-navy, #0E5A6B); text-decoration: none; border-bottom: 2px solid var(--brand-cyan, #F2B636); padding-bottom: 2px; }
.iz-more a:hover { color: var(--brand-navy-dark, #0A4654); }
.iz-more a:focus-visible { outline: 3px solid var(--brand-cyan, #F2B636); outline-offset: 3px; border-radius: 4px; }