/*
Theme Name: rtl-online-shop-child
Theme URI: https://aladev.ir
Author: AlaDev
Author URI: https://www.rtl-theme.com/author/mhosein/products/
Description: آنلاین شاپ یک قالب فروشگاهی حرفه‌ای و کاملاً ایرانی برای کسب‌ و کارهای آنلاین طراحی شده است. این قالب از جدیدترین تکنولوژی‌های طراحی وب بهره می‌برد تا تجربه‌ای سریع، روان و جذاب را برای کاربران و مدیران فروشگاه فراهم کند.
Template: rtl-online-shop
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rtl-online-shop-child
*/

.sidebar-round-img img {
  border-radius: inherit !important;
}

/* پیام‌های ووکامرس – موبایل */
@media (max-width:768px){

  /* خود باکس پیام */
  .woocommerce-notices-wrapper .woocommerce-message{
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;

    /* پدینگ دو طرف برابر شود */
    padding-right:15px !important;
    padding-left:15px !important;
  }

  /* همه‌ی فرزندان را وسط کن (اینجا متن‌ها span,strong و ...) */
  .woocommerce-notices-wrapper .woocommerce-message > *{
    margin-right:auto !important;
    margin-left:auto !important;
  }

  /* دکمه */
  .woocommerce-notices-wrapper .woocommerce-message a.button.wc-forward{
    order:2;
    display:inline-flex !important;
    align-items:center;
    justify-content:center;
    margin:10px auto 0 !important;
    float:none !important;
    width:auto;                 /* اگر تمام عرض می‌خواهی: 100% */
    background:var(--color-secondary100,#ea2340) !important;
    color:#fff !important;
    border-radius:8px;
    font-family:var(--primary-font,IRANSansX),sans-serif;
    font-weight:600;
    padding:10px 20px;
  }

  /* متن پیام بالای دکمه */
  .woocommerce-notices-wrapper .woocommerce-message :not(a.button.wc-forward){
    order:1;
  }
}



/* موبایل: ردیف‌های جدول سبد خرید را ستونی و وسط کن */
@media (max-width:768px){

  /* هر ردیف محصول */
  .woocommerce-cart-form__cart-item.cart_item{
    position: relative;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 12px;
    padding: 20px 16px !important;
    background: #fff;
    border-radius: 20px;
    margin-bottom: 16px;
  }

  /* هر سلول داخل ردیف */
  .woocommerce-cart-form__cart-item.cart_item > td{
    display: block;
    width: 100%;
    padding: 0 !important;
    margin: 0;
    text-align: inherit; /* یعنی center */
    border: none !important;
  }

  /* عنوان "محصولات" ، "قیمت" ، ... اگر label هست */
  .woocommerce-cart-form__cart-item.cart_item label{
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
    color: var(--color-primary, #2C3F5D);
  }

  /* تصویر محصول کوچیک و وسط */
  .woocommerce-cart-form__cart-item .product-thumbnail img{
    max-width: 120px;
    height: auto;
    margin: 0 auto;
    display: block;
  }

  /* مقداردهی تعداد */
  .woocommerce-cart-form__cart-item .quantity{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 0 auto;
  }

  /* دکمه های + و - */
  .woocommerce-cart-form__cart-item .qty_button{
    width: 32px;
    height: 32px;
    border-radius: 50%;
    line-height: 32px;
    text-align: center;
    padding: 0;
    background: var(--color-secondary100, #ea2340);
    color: #fff;
    border: none;
    cursor: pointer;
  }
  .woocommerce-cart-form__cart-item .qty{
    width: 52px;
    text-align: center;
  }

  /* دکمه حذف (ضربدر) */
  .woocommerce-cart-form__cart-item .product-remove{
    position: absolute;
    top: 12px;
    inset-inline-end: 12px;     /* راست در RTL، چپ در LTR */
    width: auto;
    height: auto;
    padding: 0;
  }
  .woocommerce-cart-form__cart-item .product-remove a.remove{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: transparent;
  }

  /* جمع جزء و قیمت واحد هم وسط */
  .woocommerce-cart-form__cart-item .product-price .amount,
  .woocommerce-cart-form__cart-item .product-subtotal .amount{
    font-weight: 600;
    color: var(--color-primary, #2C3F5D);
  }
}


/* فقط span کشور (ایران) */
p#billing_country_field span.woocommerce-input-wrapper{
    padding-right:15px !important;
}


/*استایل مشحصات فنی */
/* پدینگ مساوی اطراف کل تب */
#tab-additional_information{
    padding-inline:12px;            /* هر دو سمت برابر */
    box-sizing:border-box;
}

/* اگر روی جدول margin یا border-spacing داری، صفر کن */
.woocommerce-product-attributes.shop_attributes{
    margin:0;
    border-spacing:0;
    width:100%;
}

/* فاصله‌ی کارت‌ها با گرید */
.woocommerce-product-attributes.shop_attributes tbody{
    display:grid;
    grid-template-columns:1fr;      /* چون الان تک‌ستونه‌ای */
    gap:12px;                       /* فاصله یکنواخت بین کارت‌ها */
}

/* خود آیتم */
.woocommerce-product-attributes.shop_attributes td{
    padding:.8em 1em;
    background:#f5f5f5;
    border-radius:10px;
    box-sizing:border-box;
}
/* --- کدهای CSS سفارشی یکپارچه و نهایی برای قالب و ابزارک فیلترها --- */

/* ============================================= */
/* تنظیمات ابزارک فیلترها (wcapf) برای موبایل */
/* ============================================= */

@media (max-width: 992px) { /* این قوانین برای دستگاه‌های با عرض حداکثر 992px اعمال می‌شوند */

    /* ** مهمترین بخش برای اطمینان از بسته بودن پیش‌فرض و رفع مشکل ارتفاع در حالت بسته ** */
    /* مطمئن می‌شویم که فرم فیلتر در حالت بسته کاملاً مخفی باشد و هیچ فضایی اشغال نکند */
    .widget_block.wcapf-collapsed .wcapf-form {
        display: none !important;      /* حیاتی: اطمینان از پنهان بودن کامل */
        visibility: hidden !important; /* حیاتی: اطمینان از پنهان بودن کامل */
        opacity: 0 !important;         /* برای انیمیشن های احتمالی */
        height: 0 !important;          /* اطمینان از صفر بودن ارتفاع */
        max-height: 0 !important;      /* مهم برای لغو محدودیت های احتمالی حداکثر ارتفاع */
        overflow: hidden !important;   /* جلوگیری از نمایش محتوای سرریز */
        padding: 0 !important;         /* حذف کامل پدینگ داخلی در حالت بسته */
        margin: 0 !important;          /* حذف کامل مارجین داخلی در حالت بسته */
    }

    /* تنظیمات برای حالت باز ابزارک فیلترها در موبایل */
    /* مطمئن می‌شویم که فرم فیلتر در حالت باز به درستی نمایش داده شده و ارتفاع مناسبی داشته باشد */
    .widget_block:not(.wcapf-collapsed) .wcapf-form {
        display: block !important;     /* فرم به صورت بلاک نمایش داده شود (یا flex اگر نیاز است) */
        visibility: visible !important;/* اطمینان از قابل مشاهده بودن */
        opacity: 1 !important;         /* اطمینان از عدم شفافیت */
        height: auto !important;       /* ارتفاع به صورت خودکار بر اساس محتوا تنظیم شود */
        max-height: none !important;   /* بسیار مهم: لغو هرگونه محدودیت حداکثر ارتفاع */
        overflow: visible !important;  /* اجازه نمایش محتوای کامل */
        
        /* پدینگ و مارجین تنظیم شده برای رفع مشکل ارتفاع و ظاهر مناسب در حالت باز */
        padding-top: 15px !important;    /* تنظیم پدینگ بالا به 15px */
        padding-bottom: 15px !important; /* تنظیم پدینگ پایین به 15px */
    }

    /* ** مهم: اضافه شده برای مقابله با تداخل استایل elementor-tab-content (در صورت وجود) ** */
    /* مطمئن می شویم که هر elementor-tab-content داخل wcapf-form در حالت باز نمایش داده شود */
    .widget_block:not(.wcapf-collapsed) .wcapf-form .elementor-tab-content {
        display: block !important; /* لغو display: none از کد تداخل‌کننده */
    }

    /* ** اضافه شده برای رفع مشکل "چسبیدن به بالایی" ویجت فیلترها در موبایل ** */
    /* به ویجت بلاک فیلترها در موبایل یک مارجین بالا و پایین کافی می‌دهیم */
    .widget_block:has(.wcapf-form) { 
        margin-top: 20px !important;    /* مثال: 20px فاصله از بالا */
        margin-bottom: 20px !important; /* مثال: 20px فاصله از پایین */
        float: none !important;         /* اطمینان از عدم فلوتینگ که باعث بهم ریختگی جریان صفحه می شود */
        clear: both !important;         /* اطمینان از پاک شدن فلوتینگ های قبلی */
    }

    /* تنظیمات برای عنوان ابزارک فیلترها در موبایل */
    .widget_block .widget-title {
        cursor: pointer; /* نمایش نشانگر اشاره‌گر برای قابلیت کلیک */
    }

    /* ** اضافه شده: مدیریت استایل های wcapf-filter در موبایل ** */
    /* این بخش برای کنترل فاصله بین هر بخش فیلتر (مثلا قیمت، کالاها و ...) است */
    .wcapf-filter:not(:last-child) {
        border-bottom: 1px solid #CBD5E6 !important; /* نگه داشتن border-bottom */
        padding-bottom: 15px !important;             /* نگه داشتن پدینگ پایین */
        margin-bottom: 15px !important;              /* نگه داشتن مارجین پایین */
        /* اگر خواستید این فواصل را در موبایل کمتر یا بیشتر کنید، مقادیر را اینجا تغییر دهید */
    }
}

/* ============================================= */
/* تبدیل ویجت تب به آکاردئون برای موبایل (کد اصلی از قالب شما) */
/* ============================================= */

@media (max-width: 767px) { /* توجه: این Media Query تا 767px است، نه 992px */

    /* کل ویجت تب با کلاس سفارشی ما را هدف قرار بده */
    .custom-hover-tabs .elementor-tabs-wrapper {
        display: flex;
        flex-direction: column;
    }

    .custom-hover-tabs .elementor-tab-title {
        border: 1px solid #eee;
        margin-bottom: 5px;
        border-radius: 5px;
        font-weight: bold;
    }

    /* مخفی کردن تمام محتواها در حالت پیش‌فرض */
    .custom-hover-tabs .elementor-tab-content {
        display: none !important; /* اضافه کردن !important برای اطمینان بیشتر */
        border-bottom: 1px solid #eee;
        padding-bottom: 15px;
    }

    /* نمایش محتوای تبی که فعال (کلیک شده) است */
    .custom-hover-tabs .elementor-tab-title.elementor-active + .elementor-tab-content {
        display: block !important; /* اضافه کردن !important برای اطمینان بیشتر */
    }
    
    /* افزودن آیکون + و - برای راهنمایی بهتر کاربر */
    .custom-hover-tabs .elementor-tab-title::after {
        content: '+'; /* آیکون حالت بسته */
        float: left; /* انتقال به سمت چپ (در سایت فارسی) */
        font-size: 20px;
        font-weight: normal;
        margin-left: 10px;
    }

    .custom-hover-tabs .elementor-tab-title.elementor-active::after {
        content: '−'; /* آیکون حالت باز */
    }
}

/* --- پایان کدهای CSS سفارشی یکپارچه و نهایی --- */





/* مخصوص حالت موبایل و off-canvas */
@media (max-width: 768px) {
  .e-off-canvas .header-search-box {
    min-width: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
}