/* استایل عمومی برای دکمه کشویی */
.custom-dropdown {
    width: 150px; /* عرض دکمه */
    padding: 5px 15px; /* فاصله داخلی */
    font-size: 14px; /* اندازه فونت */
    border: 1px solid #ced4da; /* رنگ مرز */
    border-radius: 25px; /* گوشه‌های گرد */
    background-color: #ffffff; /* پس‌زمینه سفید */
    color: #333333; /* رنگ متن */
    transition: all 0.3s ease-in-out; /* انیمیشن انتقال */
}

    /* زمانی که در حالت hover است */
    .custom-dropdown:hover {
        background-color: #f8f9fa; /* تغییر پس‌زمینه */
        border-color: #d95700; /* تغییر رنگ مرز به رنگ سایت */
        color: #d95700; /* تغییر رنگ متن به رنگ سایت */
    }

    /* زمانی که گزینه‌ای انتخاب می‌شود */
    .custom-dropdown:focus {
        outline: none;
        box-shadow: 0 0 0 0.25rem rgba(217, 87, 0, 0.25); /* ایجاد سایه هنگام انتخاب */
        border-color: #d95700; /* تغییر رنگ مرز به رنگ سایت */
    }

    /* استایل برای لیست آیتم‌ها */
    .custom-dropdown .dropdown-item {
        padding: 10px 15px;
        font-size: 14px;
    }

        /* تغییر رنگ آیتم‌ها زمانی که بر روی آنها hover می‌شود */
        .custom-dropdown .dropdown-item:hover {
            background-color: #d95700; /* تغییر پس‌زمینه به رنگ سایت */
            color: white; /* تغییر رنگ متن به سفید */
        }