/* ==============================================
   تنظیمات لیست اصلی وبلاگ - طرح مشابه Jahesh
   ============================================== */

/* 1. حذف کامل فاصله‌های پیش‌فرض قالب */
.wd-posts:not([style*="wd-gap"]) {
    --wd-gap-lg: 0 !important;
    --wd-gap-md: 0 !important;
}

/* 2. استایل باکس اصلی (کانتینر) */
.wd-post.blog-design-list .wd-post-inner {
    display: flex;
    flex-direction: row; /* چیدمان افقی */
    align-items: stretch; /* کشیدن ارتفاع تصویر تا آخر */
    background: #ffffff;
    border-radius: 16px; /* گوشه‌های گرد باکس */
    padding: 0 !important; /* حذف پدینگ داخلی باکس برای چسبیدن عکس */
    margin: 8px 0 !important; /* فاصله کم بین آیتم‌ها */
    position: relative;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 4px 20px rgba(0,0,0,0.04);
    overflow: hidden; /* جلوگیری از بیرون زدگی عکس */
    transition: all .3s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 1;
    min-height: 140px; /* حداقل ارتفاع برای زیبایی */
}

/* افکت هاور: بالا آمدن */
.wd-post.blog-design-list .wd-post-inner:hover {
    transform: translateY(-4px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    border-color: transparent; /* بوردر محو می‌شود تا بوردر گرادیانت دیده شود */
}

/* 3. بوردر گرادیانت در زمان هاور (تکنیک پیشرفته Mask) */
.wd-post.blog-design-list .wd-post-inner::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 16px; 
    padding: 2px; /* ضخامت بوردر رنگی */
    background: linear-gradient(135deg, #00c6ff 0%, #0072ff 100%); 
    -webkit-mask: 
       linear-gradient(#fff 0 0) content-box, 
       linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: 10;
}

.wd-post.blog-design-list .wd-post-inner:hover::after {
    opacity: 1;
}

/* 4. تنظیمات عکس - چسبیدن کامل به بدنه */
.wd-post.blog-design-list .wd-post-thumb {
    margin: 0 !important;       /* حذف مارجین */
    padding: 0 !important;      /* حذف پدینگ */
    width: 190px !important;    /* عرض ثابت عکس */
    flex: 0 0 190px !important; /* جلوگیری از تغییر سایز */
    height: auto !important;    /* اجازه دادن به کشیده شدن ارتفاع */
    display: flex;
    flex-direction: column;
}

/* کلاس کمکی برای نگهدارنده عکس */
.wd-post.blog-design-list .wd-post-img {
    height: 100%;
    width: 100%;
    margin: 0 !important;
}

/* خود تگ عکس */
.wd-post.blog-design-list .wd-post-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; /* پر کردن کامل قاب بدون دفرمه شدن */
    display: block !important;    /* حذف فاصله مخفی پایین عکس */
    border-radius: 0 !important;  /* گوشه‌های تیز برای چسبیدن به دیوار باکس */
    margin: 0 !important;
}

/* 5. تنظیمات تاریخ روی عکس */
.wd-post.blog-design-list .wd-post-date {
    left: 10px !important;
    right: auto !important;
    bottom: 10px !important;
    top: auto !important;
    background: rgba(255, 255, 255, 0.95);
    color: #0072ff;
    border-radius: 8px;
    padding: 4px 10px;
    font-weight: bold;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* 6. تنظیمات متن و محتوا */
.wd-post.blog-design-list .wd-post-content {
    flex: 1; /* پر کردن فضای باقی‌مانده */
    padding: 20px 25px !important; /* فاصله متن از لبه‌ها */
    display: flex;
    flex-direction: column;
    justify-content: center; /* وسط‌چین عمودی محتوا */
    align-items: flex-start;
}

/* حذف اسکرول مزاحم وودمارت */
.wd-post.blog-design-list .wd-post-content-inner {
    overflow: visible !important;
    max-height: none !important;
}

/* استایل عنوان */
.wd-post.blog-design-list .wd-post-title a {
    color: #111 !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.6;
    margin-bottom: 10px;
    display: block;
    transition: color 0.2s;
}

.wd-post.blog-design-list .wd-post-inner:hover .wd-post-title a {
    color: #0072ff !important;
}

/* خط جداکننده زیر عنوان (اختیاری برای زیبایی بیشتر مثل Jahesh) */
.wd-post.blog-design-list .wd-post-content::after {
    display: none; /* اگر خواستید فعال کنید */
}

/*======================= side bar ----- javad*/
/* =======================================================
   استایل نهایی لیست سایدبار (المنتور) - فشرده و مدرن
   ======================================================= */

/* 1. حذف فاصله‌های پیش‌فرض گرید المنتور */
.elementor-widget-posts .elementor-grid {
    grid-row-gap: 0 !important;
    row-gap: 0 !important;
}

/* 2. باکس اصلی هر خبر (کانتینر) */
.elementor-posts-container .elementor-post {
    display: flex;
    flex-direction: row;        /* چیدمان افقی */
    align-items: stretch;       /* هم‌قد کردن عکس و متن */
    background: #ffffff;
    border-radius: 14px;        /* گوشه‌های گرد */
    padding: 0 !important;      /* حذف کامل پدینگ */
    margin-bottom: 8px !important; /* فاصله کم و فشرده بین آیتم‌ها */
    position: relative;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 4px 15px rgba(0,0,0,0.04);
    overflow: hidden;           /* برش عکس */
    transition: all .3s cubic-bezier(0.25, 0.8, 0.25, 1);
    z-index: 1;
    min-height: 85px;           /* ارتفاع مناسب سایدبار */
}

/* افکت هاور: بالا آمدن */
.elementor-posts-container .elementor-post:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 25px rgba(0,0,0,0.1);
    border-color: transparent;
}

/* 3. بوردر گرادیانت در زمان هاور (تکنیک پیشرفته) */
.elementor-posts-container .elementor-post::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 14px;
    padding: 2px;
    background: linear-gradient(135deg, #00c6ff 0%, #0072ff 100%);
    -webkit-mask: 
       linear-gradient(#fff 0 0) content-box, 
       linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
    z-index: 10;
}

.elementor-posts-container .elementor-post:hover::after {
    opacity: 1;
}

/* 4. لینک دور عکس (Wrapper) */
.elementor-post__thumbnail__link {
    display: flex;
    flex: 0 0 95px !important; /* عرض ثابت عکس (متناسب با سایدبار) */
    width: 95px !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
}

/* 5. تنظیمات عکس - چسبیده کامل به بدنه */
.elementor-post__thumbnail {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block;
}

.elementor-post__thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; /* پر کردن قاب */
    display: block !important;
    border-radius: 0 !important;  /* گوشه‌های تیز */
    margin: 0 !important;
}

/* 6. تنظیمات متن (سمت راست) */
.elementor-post__text {
    flex: 1; /* پر کردن فضای باقی‌مانده */
    padding: 10px 14px !important; /* پدینگ داخلی متن */
    display: flex;
    flex-direction: column;
    justify-content: center; /* وسط‌چین عمودی */
}

/* 7. استایل عنوان */
.elementor-post__title {
    margin: 0 !important;
    padding: 0 !important;
}

.elementor-post__title a {
    color: #000000 !important;     /* مشکی کاملا پررنگ */
    font-size: 13px !important;    /* سایز فونت */
    font-weight: 700 !important;
    line-height: 1.6;
    display: block;
    transition: color 0.2s;
    
    /* محدود کردن عنوان به 3 خط */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* رنگ عنوان در هاور */
.elementor-posts-container .elementor-post:hover .elementor-post__title a {
    color: #0072ff !important;
}

/* حذف کدهای اضافه المنتور */
.elementor-posts--skin-classic .elementor-post__thumbnail {
    padding-bottom: 0 !important;
}

/*footer space */
.wd-prefooter {
    padding-bottom: 0 !important; 
    background-color: var(--wd-main-bgcolor);
}

.wd-prefooter .elementor-widget-wrap.elementor-element-populated {
    /* استایل‌های شما اینجا قرار می‌گیرند */
     padding: 100px 0 100px 0px;
}