/* Non-Home Page Search Bar V2 - Location + Filter Icon + Search Button Always Visible */

/* Search Form Wrapper */
.search-form-wrapper {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
}

/* Always Visible Fields (Location, Filter Icon, Search Button) */
.always-visible-fields {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
}

.always-visible-fields input[name="location"] {
    flex: 1 !important;
    min-width: 0 !important;
    height: 42px !important;
    font-size: 14px !important;
    border-radius: 6px !important;
    border: 1px solid #cccccc !important;
}

.always-visible-fields input[name="location"]:focus {
    border-color: #33cc33 !important;
    box-shadow: 0 0 0 2px rgba(51, 204, 51, 0.25) !important;
}

/* Filter Icon Button (hidden on desktop, visible on mobile) */
.filter-icon-btn {
    display: none !important;
    flex-shrink: 0 !important;
    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    border-radius: 6px !important;
    border: 1px solid #dee2e6 !important;
    background-color: white !important;
    color: #6c757d !important;
    transition: all 0.2s !important;
}

.filter-icon-btn:hover {
    background-color: #f8f9fa !important;
    border-color: #33cc33 !important;
    color: #33cc33 !important;
}

.filter-icon-btn i {
    font-size: 16px !important;
}

/* Search Button */
.search-btn {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    padding: 0 20px !important;
    height: 42px !important;
    font-weight: 500 !important;
    border-radius: 6px !important;
}

/* Collapsible Fields (Transaction Type, Property Type, Budgets, Dynamic) */
.collapsible-fields {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    flex-wrap: nowrap !important;
}

.search-field {
    min-width: 0 !important;
    flex: 1 1 auto !important;
    height: 42px !important;
    font-size: 14px !important;
    border-radius: 6px !important;
    border: 1px solid #dee2e6 !important;
}

.search-field:focus {
    border-color: #33cc33 !important;
    box-shadow: 0 0 0 2px rgba(51, 204, 51, 0.25) !important;
}

/* ================================================ */
/* DESKTOP VIEW (1200px and above)                */
/* ================================================ */
@media (min-width: 1200px) {
    .search-form-wrapper {
        flex-direction: row !important;
        gap: 10px !important;
    }
    
    .always-visible-fields {
        flex: 0 0 auto !important;
    }
    
    .always-visible-fields input[name="location"] {
        width: 300px !important;
    }
    
    .filter-icon-btn {
        display: none !important;
    }
    
    .collapsible-fields {
        display: flex !important;
        flex: 1 !important;
    }
}

/* ================================================ */
/* MOBILE VIEW (Below 1200px)                     */
/* ================================================ */
@media (max-width: 1199px) {
    .search-form-wrapper {
        flex-direction: column !important;
    }
    
    .always-visible-fields {
        width: 100% !important;
    }
    
    .always-visible-fields input[name="location"] {
        flex: 1 !important;
    }
    
    .filter-icon-btn {
        display: block !important;
    }
    
    .collapsible-fields {
        display: none !important;
    }
}

/* ================================================ */
/* MODAL STYLES                                    */
/* ================================================ */

.modal-body .form-label {
    font-weight: 600 !important;
    font-size: 14px !important;
    color: #495057 !important;
    margin-bottom: 8px !important;
}

.modal-body .form-control,
.modal-body .form-select {
    border-radius: 6px !important;
    border: 1px solid #dee2e6 !important;
}

.modal-body .form-control:focus,
.modal-body .form-select:focus {
    border-color: #33cc33 !important;
    box-shadow: 0 0 0 2px rgba(51, 204, 51, 0.25) !important;
}

/*.dynamic-modal-field {
    display: none !important;
}*/

/* ================================================ */
/* TRANSITIONS & EFFECTS                          */
/* ================================================ */

.search-field,
.search-btn,
.filter-icon-btn {
    transition: all 0.2s ease-in-out !important;
}

/* Loading state for search button */
.search-btn:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

/* Enhanced select dropdowns */
.search-field option,
.form-select option {
    padding: 8px !important;
}

/* ================================================ */
/* ACCESSIBILITY                                   */
/* ================================================ */

.search-field:focus-visible,
.search-btn:focus-visible,
.filter-icon-btn:focus-visible {
    outline: 1px solid #33cc33 !important;
    outline-offset: 1px !important;
}

/* ================================================ */
/* PRINT STYLES                                    */
/* ================================================ */

@media print {
    .non-home-page-search {
        display: none !important;
    }
}

/* ================================================ */
/* FIELD SIZES ON LARGER SCREENS                  */
/* ================================================ */

@media (min-width: 1400px) {
    .search-field {
        font-size: 15px !important;
    }
    
    .always-visible-fields input[name="location"] {
        width: 350px !important;
    }
}



.location-autocomplete-wrapper,
.collapsible-fields{
    flex: 1 1 0 !important;  /* equal share of available space */
    min-width: 0 !important; /* prevent overflow */
    width: auto !important;
}