.elementor-22 .elementor-element.elementor-element-d687f90{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-22 .elementor-element.elementor-element-f168a79{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--border-radius:10px 10px 10px 10px;}.elementor-22 .elementor-element.elementor-element-55903bd{--display:flex;--border-radius:10px 10px 10px 10px;}.elementor-22 .elementor-element.elementor-element-0d270fd{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-22 .elementor-element.elementor-element-f701fcb{--spacer-size:50px;}.elementor-22 .elementor-element.elementor-element-5918919{--wd-brd-radius:12px;}.elementor-22 .elementor-element.elementor-element-5918919 .wd-el-title{font-size:2rem;}.elementor-22 .elementor-element.elementor-element-eb113b4{--spacer-size:50px;}.elementor-22 .elementor-element.elementor-element-f6670aa{--spacer-size:50px;}.elementor-22 .elementor-element.elementor-element-a8df554{--wd-brd-radius:12px;}.elementor-22 .elementor-element.elementor-element-2759c3f{--spacer-size:50px;}@media(min-width:768px){.elementor-22 .elementor-element.elementor-element-f168a79{--width:69.3%;}.elementor-22 .elementor-element.elementor-element-55903bd{--width:30%;}.elementor-22 .elementor-element.elementor-element-0d270fd{--content-width:95%;}}/* Start custom CSS for wd_products, class: .elementor-element-5918919 */.side--bar{
    direction: rtl;
    text-align: right;
}
.elementor-22 .elementor-element.elementor-element-5918919 {
    float: right;
}
/* 1. استایل‌دهی به کانتینر اصلی هر ویجت */
/* هدف قرار دادن wd-widget که والد هر دو ویجت شماست */
.wd-widget.filter-widget  .products-bordered-grid.elements-grid>.wd-col {
    background-color: #ffffff; /* رنگ پس‌زمینه سفید برای باکس */
    border-radius: 12px; /* لبه‌های گرد */
    padding: 30px !important; /* فضای داخلی برای جدا شدن محتوا از لبه‌ها */
    margin-bottom: 30px; /* فاصله بین ویجت‌ها */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08); /* سایه نرم و جذاب */
    border: 1px solid #f0f0f0; /* یک حاشیه بسیار روشن و ظریف */
}

/* 2. تنظیمات عنوان ویجت */
.wd-widget.filter-widget .widget-title {
    padding-bottom: 10px; /* فاصله زیر عنوان */
    margin-bottom: 15px;
    border-bottom: 1px solid #eee; /* خط جداکننده زیر عنوان */
    text-align: right; /* راست‌چین کردن عنوان */
}

/* 3. تنظیمات لیست دسته‌بندی و موجودی */
.wd-widget.filter-widget .product-categories,
.wd-widget.filter-widget .wd-checkboxes-on {
    text-align: right; /* راست‌چین کردن لیست‌ها */
}



/* هدف قرار دادن کل کادر محصول */
.wd-product.product-grid-item {
    /* تنظیمات ظاهری کلی */
    background-color: #ffffff; /* رنگ پس‌زمینه سفید */
    border-radius: 12px !important; /* لبه‌های گرد */
    
    /* 1. ایجاد فاصله افقی و عمودی بین کارت‌ها */
    /* فاصله بین ردیف‌های محصولات */
    margin-bottom: 20px !important; 
    /* مارجین چپ و راست برای ایجاد فاصله 
       این مقدار را می‌توانید بین 10px تا 20px تنظیم کنید. 
    */
    margin-left: 10px !important; 
    margin-right: 10px !important;
    
    /* تنظیمات سایه و حاشیه */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08); /* سایه نرم و جذاب */
    border: 1px solid #f0f0f0; /* حاشیه روشن و ظریف */
    
    /* حذف پدینگ داخلی برای حفظ اندازه درست باکس */
    padding: 0 !important; 
    overflow: hidden; 
}

/* 2. جبران مارجین‌های ستون‌های گرید (اختیاری اما توصیه می‌شود) */
/* این کد به کانتینر والد محصولات نیاز دارد تا طرح گرید به هم نریزد */
.products-grid { 
    margin-left: -10px !important;
    margin-right: -10px !important;
}

/* 3. افزودن پدینگ به محتوای داخلی (wrapper) برای جدا شدن محتوا از لبه‌های باکس */
.wd-product.product-grid-item .product-wrapper {
    padding: 10px !important; /* فضای داخلی مناسب برای محتوا */
    /* تنظیمات Flexbox برای همترازی دکمه خرید */
    display: flex;
    flex-direction: column;
    height: 100%;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-0d270fd *//* 4. چسباندن قیمت به پایین کارت (در انتهای کانتینر .product-information) */
.wd-product .product-rating-price {
    margin-top: auto; /* **حیاتی:** قیمت را به پایین ترین نقطه هل می دهد */
    padding-top: 10px;
}

/* 5. اطمینان از اینکه کل کارت ارتفاع یکسان دارد (اصلاح تراز بندی والد) */
.wd-carousel-inner,
.wd-carousel,
.wd-carousel-wrap {
    align-items: stretch !important; /* کشیدن آیتم ها برای ارتفاع یکسان */
}
.wd-product {
    display: flex;
    flex-direction: column;
    height: 100%; 
}
/* 2. تعیین حداقل ارتفاع برای عنوان برای پشتیبانی از عناوین بلند (2 یا 3 خطی) */
.wd-product .wd-entities-title {
    min-height: 40px; /* **ارتفاع ثابت/حداقلی:** اگر عناوین شما تا دو خط می روند، 40px یا 50px مناسب است */
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

/* 3. بخش اطلاعات متنی: پر کردن فضای خالی باقیمانده و شروع از بالا */
.wd-product .product-information {
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* حیاتی: این بخش تمام فضای عمودی باقی مانده را می بلعد */
    justify-content: flex-start; /* محتوای متنی از بالا شروع شود */
    text-align: center;
    padding: 10px;
}
/* 1. کانتینر تصویر: تعیین ارتفاع ثابت و چسباندن تصویر به بالا */
.wd-product .product-element-top {
    height: 140px; /* **ارتفاع ثابت:** این مقدار را بر اساس بزرگترین تصویر خود تنظیم کنید */
    display: flex; 
    justify-content: center; /* مرکز قرار دادن افقی */
    align-items: flex-start; /* چسباندن تصویر به بالای کانتینر */
    padding: 10px 0; /* فاصله کم از بالا و پایین */
}
.wd-product .product-element-top img {
    height: 10%; /* اشغال ارتفاع کامل کانتینر ثابت */
    width: auto;
    object-fit: contain; /* حفظ نسبت تصویر */
}/* End custom CSS */