/*
  با افزودن [dir="rtl"]، اولویت این قانون را با قانون قالب برابر می‌کنیم.
  چون فایل ما بعد از core.css بارگذاری می‌شود، قانون ما برنده خواهد شد.
*/
[dir="rtl"] .form-select,
[dir="rtl"] .form-select:focus {
    background-position: left 0.75rem center;
}
.form-switch{
    padding-left: 0
}
/*
  این کد فاصله اضافی سمت چپ دکمه بستن در هدر مودال را
  در حالت راست‌چین حذف می‌کند.
*/
[dir="rtl"] .modal-header .btn-close {
    margin-left: 0;
}


.responsive-form-text {
    overflow-wrap: break-word;
    word-wrap: break-word;
}


/*
  این قانون فاصله بین عنوان و دکمه بستن را در هدر تمام مودال‌ها
  در حالت راست‌چین (RTL) به درستی تنظیم می‌کند.
  از !important برای غلبه بر استایل‌های خود قالب استفاده شده است.
*/
[dir="rtl"] .modal-header {
    justify-content: space-between !important;
}

/* حالت پیشفرض برای دسکتاپ */
.sidebar {
    transition: transform 0.3s ease-in-out;
}

.menu .app-brand.demo {
    height: 80px;
}


/* Style for modern tag filters */
#tag-filter-container .btn-tag-filter.active {
    background-color: var(--bs-primary) !important;
    color: var(--bs-white) !important;
    border-color: var(--bs-primary) !important;
}

#tag-filter-container .btn-tag-filter:not(.active) {
    background-color: var(--bs-secondary-bg);
    color: var(--bs-body-color);
    border-color: var(--bs-border-color);
}

/* بخش ۱: بهبود ظاهری دکمه‌های تگ */
.btn-tag-filter {
    border-radius: 2rem; /* گرد کردن گوشه‌ها برای ظاهر کپسولی */
    font-size: 0.8rem;   /* کوچک کردن فونت */
    padding: 0.3rem 0.85rem; /* تنظیم فاصله داخلی برای زیبایی بیشتر */
    transition: all 0.2s ease-in-out; /* انیمیشن نرم برای حالت شناور */
    font-weight: 500;
    border-width: 1px;
}

/* افکت شناور برای دکمه‌های غیرفعال */
.btn-tag-filter:not(.active):hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}

/* Responsive off-canvas sidebar */
@media (max-width: 1199.98px) {
  .layout-wrapper .layout-menu {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: auto;
    height: 100vh;
    transform: translateX(100%);
    transition: transform .25s ease;
    z-index: 1055;
    box-shadow: 0 0 16px rgba(0,0,0,.08);
  }

  .layout-menu-expanded .layout-menu {
    transform: translateX(0);
  }

  .layout-wrapper .layout-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(0,0,0,.4);
  }
  
  .layout-menu-expanded .layout-overlay {
    display: block;
  }

  .layout-menu-expanded {
    overflow: hidden;
  }

  .layout-wrapper .layout-page {
    width: 100%;
  }
}

/* استایل‌های واکنش‌گرا برای موبایل */
@media (max-width: 767.98px) {

    /* استایل‌های هدر صفحه کاربران */
    #users-header-actions .button-text {
        display: none !important;
    }

    #users-header-actions .btn,
    #users-header-actions .btn-group .btn {
        width: 2.375rem;
        height: 2.375rem;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 0;
    }

    #users-header-actions .dropdown-toggle::after {
        display: none;
    }
    
/* وقتی چک‌باکس انتخاب بشه، لیبل مخفی میشه */
#selectAllActive:checked + .form-check-label {
  display: none;
}

    .menu-toggle {
        right: 15px;
    }

    /* استایل‌های هدر فرم‌ها */
    .form-section-header {
        align-items: flex-start;
    }

    .form-section-header h5 {
        margin-bottom: 0.75rem !important;
    }
    
    /* استایل دکمه عملیات دسته‌جمعی که قبلا اضافه شده بود */
    #bulk-actions-wrapper .btn-icon-mobile {
        width: 2.375rem;
        height: 2.375rem;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    #bulk-actions-wrapper .btn-icon-mobile::after {
        display: none;
    }
    #tag-filter-container {
        flex-wrap: nowrap;     /* جلوگیری از شکستن و رفتن به خط بعد */
        overflow-x: auto;      /* فعال کردن اسکرول افقی */
        padding-bottom: 0.5rem; /* ایجاد کمی فاصله پایین برای زیبایی */
        -ms-overflow-style: none;  /* مخفی کردن اسکرول‌بار در IE و Edge */
        scrollbar-width: none;     /* مخفی کردن اسکرول‌بار در Firefox */
    }

    /* مخفی کردن اسکرول‌بار در مرورگرهای Chrome, Safari, Opera */
    #tag-filter-container::-webkit-scrollbar {
        display: none;
    }
}