/*
 Theme Name:     Wise Apply
 Theme URI:      https://wiseapply.com/
 Description:    Custom Theme for WiseApply
 Author:         Sadegh Gohari
 Author URI:     https://gohari.pro/
 Template:       hello-elementor
 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:    wise-apply
*/

/* —— CSS from Shortcodes and Custom Files —— */
.search-box-form {
    position: relative;
    margin-bottom: 15px;
}
.search-box-form label {
    display: block;
    text-align: right;
    font-family: Vazir, sans-serif;
    font-size: 14px;
    margin-bottom: 10px;
    color: #ffffff;
}
.search-box-form .search-icon {
    position: absolute;
    top: 50%;
    margin-top: 13px;
    left: 15px;
    transform: translateY(-50%);
    color: #aaa;
    cursor: pointer;
}
.search-box-form #search_input {
    width: 100%;
    padding: 10px;
    padding-left: 40px;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-family: Vazir, sans-serif;
    box-sizing: border-box;
}

.filters-main-bar { 
    display: flex; 
    flex-wrap: wrap; 
    gap: 15px; 
    align-items: flex-start; 
    margin-bottom: 20px; 
}
.filter-item-wrapper { 
    position: relative; 
    flex: 1 1 150px;
}
.filter-item-wrapper label { 
    display: block; 
    font-family: 'Vazir', sans-serif; 
    font-size: 14px; 
    margin-bottom: 10px; 
    color: #ffffff; 
    text-align: right; 
}
.filter-item-wrapper select {
    width: 100%; 
    padding: 10px; 
    border-radius: 5px; 
    border: 1px solid #ccc; 
    font-family: Vazir, sans-serif;
    box-sizing: border-box; 
    background-color: #fff; 
    -webkit-appearance: none; 
    -moz-appearance: none; 
    appearance: none; 
    padding-right: 40px; 
    height: 44px;
}
.filter-item-wrapper select::-ms-expand { 
    display: none; 
}
.filter-item-wrapper::after {
    content: '▼'; 
    font-size: 12px; 
    color: #555; 
    position: absolute; 
    top: 50%; 
    margin-top: 13px;
    transform: translateY(-50%); 
    pointer-events: none; 
    right: 15px;
}
.filter-item-wrapper .clear-filter {
    position: absolute; 
    top: 50%; 
    margin-top: 13px; 
    right: 45px; 
    transform: translateY(-50%); 
    cursor: pointer;
    font-size: 20px; 
    font-weight: bold; 
    color: #888; 
    display: none; 
    line-height: 1;
}
.filter-item-wrapper .clear-filter:hover { 
    color: #333; 
}
.filter-item-wrapper.active .clear-filter { 
    display: block; 
}
.filter-item-wrapper.active select { 
    padding-right: 70px !important; 
}
.filter-button-wrapper { 
    flex-shrink: 0; 
    margin-top: 24px;
}
#apply_filters_btn {
    padding: 10px 20px; 
    background: #F3531D; 
    color: #fff; 
    border: none; 
    border-radius: 5px; 
    cursor: pointer;
    font-family: 'Vazir', sans-serif; 
    white-space: nowrap; 
    height: 44px; 
}
/* ============================================================ */
/* Styles for Custom Multi-Select Dropdown                      */
/* ============================================================ */
.custom-multiselect { 
    position: relative; 
}
.custom-multiselect .select-box {
    width: 100%;
    height: 44px;
    padding: 10px;
    padding-right: 40px;
    padding-left: 40px; /* این خط اضافه شده تا برای فلش فضا ایجاد شود */
    border-radius: 5px;
    border: 1px solid #ccc;
    background-color: #fff;
    font-family: Vazir, sans-serif;
    box-sizing: border-box;
    cursor: pointer;
    line-height: 22px;
    text-align: right;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    position: relative;
}
.custom-multiselect .select-box::after {
    content: '▼';
    font-size: 12px;
    color: #555;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
}
.custom-multiselect .checkbox-options {
    display: none !important; /* Added !important to force hide */
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border-top: none;
    border-radius: 0 0 5px 5px;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
    text-align: right;
}
.custom-multiselect .checkbox-options.visible {
    display: block !important; /* Added !important to force show */
}
.custom-multiselect .checkbox-options label {
    display: block;
    padding: 8px 12px;
    color: #333;
    margin: 0;
    font-size: 13px;
    cursor: pointer;
    transition: background-color 0.2s;
}
.custom-multiselect .checkbox-options label:hover {
    background-color: #f5f5f5;
}
.custom-multiselect .checkbox-options label input {
    margin-left: 8px;
}
/**
 * Custom Language Switcher Button Style
 * Normal State: Black outline (Ghost)
 * Hover State: Solid Purple
 */

.custom-lang-button {
    /* === Layout & Sizing === */
    display: inline-block;
    padding: 10px 22px; /* می‌توانید این مقادیر را برای تغییر اندازه دکمه کم و زیاد کنید */
    
    /* === Normal State Appearance (حالت عادی) === */
    background-color: transparent; /* پس‌زمینه شفاف */
    border: 2px solid #1a1a1a; /* حاشیه مشکی با ضخامت ۲ پیکسل */
    color: #1a1a1a; /* رنگ متن مشکی */
    
    /* === General Styling === */
    border-radius: 8px; /* میزان گردی گوشه‌ها */
    font-size: 16px; /* اندازه فونت */
    font-weight: 600; /* ضخامت فونت (نیمه‌پررنگ) */
    text-decoration: none; /* حذف خط زیر لینک */
    text-align: center;
    cursor: pointer;
    
    /* === Smooth Animation (انیمیشن نرم) === */
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* === Hover State Appearance (حالت هاور) === */
.custom-lang-button:hover {
    background-color: #7F56D9; /* رنگ پس‌زمینه بنفش در حالت هاور */
    border-color: #7F56D9; /* هم‌رنگ کردن حاشیه با پس‌زمینه برای یکپارچگی */
    color: #ffffff; /* رنگ متن سفید در حالت هاور */
}
/* ======================================= */
/* استایل ریسپانسیو برای موبایل      */
/* ======================================= */

@media (max-width: 768px) {
  .custom-lang-button {
    padding: 8px 16px; /* پدینگ کمتر برای اندازه کوچک‌تر */
    font-size: 14px;   /* فونت کمی کوچک‌تر */
  }
}