/* Mobile Sort Action Sheet UI Fix - Match Design Spec */

/* =================================================================
   FILTER BUTTON STYLING - FROM FIGMA DESIGN (210:2611)
   Both Mobile and Desktop
   ================================================================= */

/* Filter Main Button - Pill-shaped green button with icon */
.filter-toolbar__main-btn {
    background: #C8D200 !important; /* Brand green/yellow */
    border: 1px solid #C8D200 !important;
    border-radius: 100px !important; /* Pill shape */
    color: #1A1A1A !important; /* Dark text */
    padding: 12px !important;
    gap: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    transition: background-color 0.2s ease, transform 0.1s ease !important;
}

/* Button text styling */
.filter-toolbar__main-btn span:not(.filter-toolbar__main-btn__badge) {
    font-family: 'Neue Plak', 'Neue', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-weight: 600 !important; /* SemiBold */
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: -0.15px !important;
    color: #1A1A1A !important;
    text-align: center !important;
}

/* Button icon styling */
.filter-toolbar__main-btn svg {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
}

/* Button icon paths - ensure they use the dark color (stroke-based icon) */
.filter-toolbar__main-btn svg path {
    stroke: #1A1A1A !important;
    fill: none !important;
}

/* Hover state */
.filter-toolbar__main-btn:hover {
    background: #B5BD00 !important; /* Slightly darker on hover */
    border-color: #B5BD00 !important;
    transform: scale(1.02) !important;
}

/* Active/pressed state */
.filter-toolbar__main-btn:active {
    transform: scale(0.98) !important;
}

/* Badge styling - keep existing badge design */
.filter-toolbar__main-btn__badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #1A1A1A !important;
    color: #fff !important;
    border-radius: 100px !important;
    min-width: 20px !important;
    height: 20px !important;
    padding: 0 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    margin-left: 0 !important;
}

/* When filters are active, maintain the green background */
.filter-toolbar__main-btn.filters-active,
.filter-toolbar__main-btn--active,
.filter-toolbar__main-btn[data-has-filters="true"] {
    background: #C8D200 !important;
    border-color: #C8D200 !important;
}

/* =================================================================
   CHIP BUTTON STYLING - FROM FIGMA DESIGN (210:2623)
   Where and Attendees buttons
   Both Mobile and Desktop
   ================================================================= */

/* Chip Button - White pill-shaped button with icon */
.filter-toolbar__chip {
    background: white !important;
    border: 1px solid #E8E8E8 !important;
    border-radius: 100px !important; /* Pill shape */
    color: #383838 !important;
    padding: 1px 13px !important;
    gap: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 40px !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.1s ease !important;
}

/* Chip button text styling */
.filter-toolbar__chip span {
    font-family: 'Neue Plak', 'Neue', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-weight: 400 !important; /* Regular */
    font-size: 14px !important;
    line-height: 20px !important;
    letter-spacing: -0.15px !important;
    color: #383838 !important;
    text-align: center !important;
}

/* Chip button icon styling */
.filter-toolbar__chip-icon,
.filter-toolbar__chip svg {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
}

/* Chip button icon paths - use gray stroke */
.filter-toolbar__chip-icon path,
.filter-toolbar__chip svg path {
    stroke: #383838 !important;
    fill: none !important;
}

/* Hover state for chip buttons */
.filter-toolbar__chip:hover {
    background: #F5F5F5 !important; /* Light gray on hover */
    border-color: #D4D4D4 !important;
    transform: scale(1.02) !important;
}

/* Active/pressed state for chip buttons */
.filter-toolbar__chip:active {
    transform: scale(0.98) !important;
}

/* When chip dropdown is open */
.filter-toolbar__chip[aria-expanded="true"] {
    background: #F5F5F5 !important;
    border-color: #C8D200 !important; /* Green border when active */
}

/* =================================================================
   ACTIVE FILTER CHIPS/TAGS STYLING - FROM FIGMA DESIGN (213:2952)
   Applied to filter chips in the chips wrapper
   Both Mobile and Desktop
   ================================================================= */

/* Active Filter Chip/Tag - White pill-shaped chip with close button */
.filter-toolbar__tags-container .listing__content--tag,
.listing__content--tags .listing__content--tag {
    background: white !important;
    border: 1px solid #E8E8E8 !important;
    border-radius: 100px !important; /* Pill shape - extremely high radius */
    color: #383838 !important;
    padding: 1px 13px !important;
    gap: 4px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: auto !important;
    min-height: 24px !important;
    font-family: 'Neue Plak', 'Neue', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-weight: 400 !important; /* Regular weight, not semibold */
    font-size: 12px !important;
    line-height: 20px !important;
    letter-spacing: -0.15px !important;
    white-space: nowrap !important;
    transition: background-color 0.2s ease, border-color 0.2s ease !important;
}

/* Hover state for active filter chips */
.filter-toolbar__tags-container .listing__content--tag:hover,
.listing__content--tags .listing__content--tag:hover {
    background: #F5F5F5 !important;
    border-color: #D4D4D4 !important;
}

/* Close button (X icon) styling - using ::after pseudo-element */
.filter-toolbar__tags-container .listing__content--tag:after,
.listing__content--tags .listing__content--tag:after {
    content: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' viewBox='0 0 12 12'%3E%3Cpath stroke='%23383838' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M9 3L3 9M3 3l6 6'/%3E%3C/svg%3E") !important;
    width: 12px !important;
    height: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    cursor: pointer !important;
    padding: 2px !important;
    border-radius: 3px !important;
    transition: background-color 0.2s ease !important;
}

/* Close button hover effect */
.filter-toolbar__tags-container .listing__content--tag:hover:after,
.listing__content--tags .listing__content--tag:hover:after {
    background-color: rgba(0, 0, 0, 0.05) !important;
}

/* Ensure chips that can't be removed don't show close button */
.listing__content--tag--prevent__remove:after {
    display: none !important;
}

/* Adjust padding for chips without close button */
.listing__content--tag--prevent__remove {
    padding: 1px 13px !important;
}

/* Hide the "Clear filter" chip (keep only the button) */
.filter-toolbar__tags-container .listing__content--tag-clear,
.listing__content--tags .listing__content--tag-clear {
    display: none !important;
}


@media (max-width: 1027px) {
    /* =================================================================
       MOBILE SEARCH MODAL FIX - Prevent white bar showing at top
       ================================================================= */

    /* Hide the global search trigger in navigation on mobile */
    /* We use the dedicated search input in the filter toolbar instead */
    /* EXCEPTION: Show on /venues page (page-venues class) */
    .global-search-trigger {
        display: none !important;
    }

    /* Show global search trigger on venues page only in mobile view */
    body.page-venues .global-search-trigger {
        display: flex !important;
    }

    /* CRITICAL FIX: Ensure search modal has the highest z-index */
    /* This prevents ALL sticky/fixed elements from showing through the modal */
    #search-modal.dialog[aria-hidden="false"] {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        inset: 0 !important;
        z-index: 99999 !important; /* Extremely high to be above everything */
        background: rgba(0, 0, 0, 0.9) !important;
        padding: 0 !important;
        margin: 0 !important;
        min-height: 100vh !important;
        min-height: 100dvh !important; /* Dynamic viewport height for mobile */
        overflow-y: auto !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-end !important; /* Modal slides up from bottom */
    }

    /* Also apply to dialog when visible (fallback for different states) */
    #search-modal.dialog {
        z-index: 99999 !important;
    }

    /* Ensure modal container is properly positioned */
    #search-modal .dialog__container {
        position: relative !important;
        z-index: 100000 !important;
        margin-top: auto !important; /* Push to bottom */
        width: 100% !important;
    }

    /* Adjust modal title spacing */
    #search-modal .global-search-modal__title {
        margin-top: 1rem !important;
        margin-bottom: 1.5rem !important;
    }

    /* ALTERNATIVE APPROACH: Lower z-index of sticky elements when modal class is present */
    /* This prevents the navigation and filter toolbar from showing through */
    body.modal-open .app-navigation,
    body.modal-open .listing__top-bar,
    body.modal-open .filter-toolbar,
    body.modal-open .filter-toolbar__filter-bar,
    body.quick-inquiry-modal-open .app-navigation,
    body.quick-inquiry-modal-open .listing__top-bar,
    body.quick-inquiry-modal-open .filter-toolbar,
    body.quick-inquiry-modal-open .filter-toolbar__filter-bar,
    body.ppm-modal-open .app-navigation,
    body.ppm-modal-open .listing__top-bar,
    body.ppm-modal-open .filter-toolbar,
    body.ppm-modal-open .filter-toolbar__filter-bar {
        z-index: 1 !important;
    }

    /* Prevent body scroll when modal is open */
    body.modal-open {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
        height: 100% !important;
    }

    /* Modern browser support with :has() selector */
    @supports selector(:has(*)) {
        body:has(.dialog-active) .app-navigation,
        body:has(.dialog-active) .listing__top-bar,
        body:has(.dialog-active) .filter-toolbar,
        body:has(.dialog-active) .filter-toolbar__filter-bar {
            z-index: 1 !important;
        }

        body:has(.dialog-active) {
            overflow: hidden !important;
            position: fixed !important;
            width: 100% !important;
            height: 100% !important;
        }
    }

    /* =================================================================
       MOBILE SEARCH INPUT STYLING - FROM FIGMA DESIGN (214:3241)
       Search by property name input field
       ================================================================= */

    /* Force filter toolbar to stack vertically on mobile */
    .filter-toolbar {
        display: flex !important;
        flex-direction: column !important;
        gap: 0 !important;
    }

    /* Search Wrapper - Container for search input, shown only on mobile */
    .filter-toolbar__search-wrapper {
        display: block !important;
        width: 100% !important;
        padding: 12px 16px 12px 16px !important; /* 12px top/bottom, 16px sides */
        margin: 0 !important; /* Override margins to avoid overflow */
        order: 1 !important; /* Ensure search appears first */
    }

    /* Filter bar below search */
    .filter-toolbar__filter-bar {
        display: flex !important;
        align-items: center !important;
        order: 2 !important; /* Ensure filter bar appears second */
        padding: 12px 16px 12px 16px !important; /* 12px top/bottom, 16px sides */
        margin: 0 !important; /* Override margins to prevent cutoff and fix scrolling */
    }

    /* Search Input Container */
    .filter-toolbar__search-input-container {
        background: white !important;
        border: 1px solid #E8E8E8 !important;
        border-radius: 100px !important; /* Pill shape */
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        padding: 0 13px !important;
        height: 40px !important;
        width: 100% !important;
        transition: border-color 0.2s ease, background-color 0.2s ease !important;
        cursor: pointer !important; /* Clickable cursor */
    }

    /* Search Input Container - Hover State */
    .filter-toolbar__search-input-container:hover {
        background: #FAFAFA !important; /* Subtle hover effect */
    }

    /* Search Input Container - Active/Pressed State */
    .filter-toolbar__search-input-container:active {
        background: #F5F5F5 !important;
    }

    /* Search Input Container - Focused State */
    .filter-toolbar__search-input-container:focus {
        outline: 2px solid #C8D200 !important;
        outline-offset: 2px !important;
        border-color: #C8D200 !important;
    }

    /* Search Icon */
    .filter-toolbar__search-icon {
        width: 16px !important;
        height: 16px !important;
        flex-shrink: 0 !important;
    }

    .filter-toolbar__search-icon svg {
        width: 16px !important;
        height: 16px !important;
    }

    .filter-toolbar__search-icon path {
        stroke: #383838 !important;
        fill: none !important;
    }

    /* Search Input Field */
    .filter-toolbar__search-input {
        border: none !important;
        outline: none !important;
        background: transparent !important;
        flex: 1 !important;
        font-family: 'Neue Plak', 'Neue', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
        font-weight: 400 !important; /* Regular */
        font-size: 12px !important;
        line-height: 20px !important;
        letter-spacing: -0.15px !important;
        color: #383838 !important;
        text-align: left !important;
        padding: 0 !important;
        height: 100% !important;
        cursor: pointer !important; /* Clickable cursor */
        pointer-events: none !important; /* Prevent direct interaction */
    }

    /* Search Input Placeholder */
    .filter-toolbar__search-input::placeholder {
        color: #383838 !important;
        opacity: 1 !important;
        font-family: 'Neue Plak', 'Neue', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
        font-weight: 400 !important;
        font-size: 12px !important;
        line-height: 20px !important;
        letter-spacing: -0.15px !important;
        text-align: left !important;
    }

    /* Clear button removed - search is now a trigger button */

    /* =================================================================
       MOBILE FILTER TOOLBAR HORIZONTAL SCROLLING FIX
       Enable full horizontal scrolling for the entire filter bar
       ================================================================= */

    /* Enable horizontal scrolling for the entire filter toolbar */
    .filter-toolbar__filter-bar {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important; /* Smooth scrolling on iOS */
        scrollbar-width: none !important; /* Hide scrollbar on Firefox */
        -ms-overflow-style: none !important; /* Hide scrollbar on IE/Edge */
    }

    /* Hide scrollbar on Chrome/Safari */
    .filter-toolbar__filter-bar::-webkit-scrollbar {
        display: none !important;
    }

    /* Ensure the filter bar container allows scrolling */
    .filter-toolbar {
        overflow: visible !important;
    }

    /* Hide the scroll button on mobile since we have native scrolling */
    .filter-toolbar__scroll-btn {
        display: none !important;
    }

    /* Remove the horizontal line (handle bar) below Filter header in mobile view */
    .listing-sidebar--modal .listing-sidebar--wrapper::before {
        display: none !important;
    }

    /* Set overall filter modal padding: 24px top, 16px left/right */
    .listing-sidebar--modal .listing-sidebar--wrapper {
        padding: 24px 24px 0.5rem 24px !important;
        border: none !important;
    }

    /* CRITICAL: Header styling - Override border-bottom from main.css line 61792 */
    .listing-sidebar--modal .listing-sidebar--header {
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 1rem !important;
        border-bottom: none !important;
        border-top: none !important;
        border-left: none !important;
        border-right: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Remove any pseudo-element borders on header */
    .listing-sidebar--modal .listing-sidebar--header::before,
    .listing-sidebar--modal .listing-sidebar--header::after {
        content: none !important;
        display: none !important;
        border: none !important;
    }

    /* Remove padding from close button (X icon) and move to edge */
    .listing-sidebar--modal .listing-sidebar--header__close-btn {
        padding: 0 !important;
        margin-right: -8px !important; /* Move close button to the right edge */
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
    }

    /* Ensure the img inside button stays centered and is 16x16 */
    .listing-sidebar--modal .listing-sidebar--header__close-btn img {
        margin: auto !important;
        width: 16px !important;
        height: 16px !important;
    }

    /* Ensure filter toolbar close buttons are also 16x16 */
    .filter-toolbar__chip-dropdown__close img {
        width: 16px !important;
        height: 16px !important;
    }

    /* Adjust content padding to work with wrapper padding */
    .listing-sidebar--modal .listing-sidebar__content {
        padding-left: 0 !important;
        padding-right: 0 !important;
        border-top: none !important;
    }

    /* CRITICAL: Remove border ONLY from first filter section after map toggle */
    .listing-sidebar--modal .listing-sidebar__map + .listing-sidebar__filter .listing-sidebar__filter-accordion__header,
    .listing-sidebar--modal .listing-sidebar__map--ghost + .listing-sidebar__filter .listing-sidebar__filter-accordion__header {
        border-top: none !important;
        padding-top: 0 !important;
    }

    /* Remove border from map toggle */
    .listing-sidebar--modal .listing-sidebar__map,
    .listing-sidebar--modal .listing-sidebar__map--ghost {
        border-top: none !important;
        border-bottom: none !important;
    }

    /* Ensure no spacing/borders between header and content */
    .listing-sidebar--modal .listing-sidebar--header + .listing-sidebar__content,
    .listing-sidebar--modal .listing-sidebar--header + * {
        border-top: none !important;
        margin-top: 0 !important;
    }

    /* Remove header bottom padding to control spacing precisely */
    .mobile-sort-action-sheet__header {
        padding-bottom: 0 !important;
    }

    /* Add spacing between header and first item (8px) */
    .mobile-sort-action-sheet__content {
        margin-top: 8px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important; /* 12px spacing between items */
    }

    /* Center align items and add grey background for selected state */
    .mobile-sort-action-sheet__item {
        display: flex;
        align-items: center;
        justify-content: center; /* Center the content */
        padding: 0 !important; /* Remove default padding, use label padding instead */
        cursor: pointer;
        transition: background-color 0.2s;
        border: none;
        background: none;
        width: 100%;
        text-align: center; /* Center text */
    }

    /* Remove hover background */
    .mobile-sort-action-sheet__item:hover {
        background-color: transparent;
    }

    /* Hide the radio button but keep it functional */
    .mobile-sort-action-sheet__item input[type="radio"] {
        position: absolute;
        opacity: 0;
        width: 0;
        height: 0;
        margin: 0;
        pointer-events: none;
    }

    /* Label styling - same color for both selected and non-selected */
    .mobile-sort-action-sheet__item label {
        font-size: 1rem;
        color: #262626 !important; /* Text color for both states */
        cursor: pointer;
        font-family: 'Neue', sans-serif;
        font-weight: 400;
        flex: 1;
        user-select: none;
        padding: 0.75rem 1rem;
        margin: 0 12px !important; /* 12px left and right margin for grey background */
        border-radius: 8px;
        transition: background-color 0.2s;
        text-align: center;
    }

    /* Selected state - grey background, same text color */
    .mobile-sort-action-sheet__item input[type="radio"]:checked + label {
        font-weight: 400 !important; /* Keep regular weight */
        color: #262626 !important; /* Same text color, no green */
        background-color: #F5F5F5 !important; /* Grey background for selected */
    }

    /* Remove green accent color from radio buttons */
    .mobile-sort-action-sheet__item input[type="radio"] {
        accent-color: transparent;
    }

    /* ALIGNMENT FIX: Align accordion dropdown arrows with X icon in filter chips */

    /* Adjust the accordion header layout */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__header {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Remove default right padding from trigger button */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__trigger {
        padding-right: 0 !important;
        justify-content: flex-start !important;
        flex: 1 !important; /* Allow trigger to take remaining space */
    }

    /* Position the chevron arrow to align with the X icon */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__trigger:after {
        position: absolute !important;
        right: -2px !important; /* Align with the right edge */
        margin-left: 0 !important;
        flex-shrink: 0 !important;
    }

    /* Ensure the trigger text has proper spacing, but exclude count span */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__trigger span:not(.listing-sidebar__filter--count) {
        margin-right: 24px !important; /* Space for the arrow icon */
    }

    /* Position the count badge with proper spacing from arrow */
    .listing-sidebar--modal .listing-sidebar__filter--count {
        margin-left: auto !important;
        margin-right: 12px !important; /* Comfortable spacing between count and arrow */
        flex-shrink: 0 !important;
    }

    /* SINGLE COLUMN LAYOUT FOR SPECIFIC FILTER TYPES IN MOBILE */
    /* Convert Event Type, Venue Type, Production Details, Style Type, and View Type to single column */

    /* Event Type - Single Column */
    .listing-sidebar__filter[data-filter-key="event_type"] .listing-sidebar__filter__checkbox--content {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    /* Venue Type - Single Column */
    .listing-sidebar__filter[data-filter-key="venue_type"] .listing-sidebar__filter__checkbox--content {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    /* Production Details - Single Column (nested within sub-items) */
    .listing-sidebar__filter .listing-sidebar__filter__checkbox--sub__item .listing-sidebar__filter__checkbox--content {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    /* Style Type - Single Column */
    .listing-sidebar__filter[data-filter-key="style_type"] .listing-sidebar__filter__checkbox--content {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    /* View Type - Single Column */
    .listing-sidebar__filter[data-filter-key="view_type"] .listing-sidebar__filter__checkbox--content {
        grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    }

    /* SHOW MORE/LESS FUNCTIONALITY - Initial State (Mobile) */
    /* Hide extra items by default */
    .collapsable-extra-item[data-collapsed="true"] {
        display: none !important;
    }

    /* Show extra items when expanded - don't override display, let original CSS apply */
    /* .collapsable-extra-item[data-collapsed="false"] {
        No display override needed - original .listing-sidebar__filter__checkbox { display: flex } will apply 
    } */

    /* Show More/Less button text visibility */
    .collapsable-btn-show {
        display: inline;
    }

    .collapsable-btn-hide {
        display: none;
    }

    /* When container is expanded, swap button text visibility */
    .c-expanded .collapsable-btn .collapsable-btn-show {
        display: none;
    }

    .c-expanded .collapsable-btn .collapsable-btn-hide {
        display: inline;
    }
}

/* DESKTOP ALIGNMENT FIX: Align accordion dropdown arrows with X icon in desktop view */
@media (min-width: 1028px) {
    /* Hide search input on desktop */
    .filter-toolbar__search-wrapper {
        display: none !important;
    }

    /* Remove border from filter header on desktop */
    .listing-sidebar--modal .listing-sidebar--header {
        border-bottom: none !important;
        border-top: none !important;
        border-left: none !important;
        border-right: none !important;
        border: none !important;
        box-shadow: none !important;
    }

    /* Remove any pseudo-element borders on header */
    .listing-sidebar--modal .listing-sidebar--header::before,
    .listing-sidebar--modal .listing-sidebar--header::after {
        content: none !important;
        display: none !important;
        border: none !important;
    }

    /* CRITICAL: Remove border ONLY from first filter section after map toggle */
    .listing-sidebar--modal .listing-sidebar__map + .listing-sidebar__filter .listing-sidebar__filter-accordion__header,
    .listing-sidebar--modal .listing-sidebar__map--ghost + .listing-sidebar__filter .listing-sidebar__filter-accordion__header {
        border-top: none !important;
        padding-top: 0 !important;
    }

    /* Remove border from map toggle */
    .listing-sidebar--modal .listing-sidebar__map,
    .listing-sidebar--modal .listing-sidebar__map--ghost {
        border-top: none !important;
        border-bottom: none !important;
    }

    /* Adjust the accordion header layout for desktop */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__header {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Remove default right padding from trigger button */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__trigger {
        padding-right: 0 !important;
        justify-content: flex-start !important;
        flex: 1 !important; /* Allow trigger to take remaining space */
    }

    /* Position the chevron arrow to align with the X icon */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__trigger:after {
        position: absolute !important;
        right: -2px !important; /* Align with the right edge */
        margin-left: 0 !important;
        flex-shrink: 0 !important;
    }

    /* Ensure the trigger text has proper spacing, but exclude count span */
    .listing-sidebar--modal .listing-sidebar__filter-accordion__trigger span:not(.listing-sidebar__filter--count) {
        margin-right: 24px !important; /* Space for the arrow icon */
    }

    /* Position the count badge with proper spacing from arrow */
    .listing-sidebar--modal .listing-sidebar__filter--count {
        margin-left: auto !important;
        margin-right: 12px !important; /* Comfortable spacing between count and arrow */
        flex-shrink: 0 !important;
    }

    /* SHOW MORE/LESS FUNCTIONALITY - Desktop */
    /* Hide extra items by default */
    .collapsable-extra-item[data-collapsed="true"] {
        display: none !important;
    }

    /* Show extra items when expanded - don't override display, let original CSS apply */
    /* .collapsable-extra-item[data-collapsed="false"] {
        No display override needed - original .listing-sidebar__filter__checkbox { display: flex } will apply 
    } */

    /* Show More/Less button text visibility */
    .collapsable-btn-show {
        display: inline;
    }

    .collapsable-btn-hide {
        display: none;
    }

    /* When container is expanded, swap button text visibility */
    .c-expanded .collapsable-btn .collapsable-btn-show {
        display: none;
    }

    .c-expanded .collapsable-btn .collapsable-btn-hide {
        display: inline;
    }
}


/* =================================================================
   VENUE CARD FIXES
   ================================================================= */

/* Hide the venue labels (Ballroom/Indoor) on map cards */
/* .listing-map-card__image-wrapper-footer {
    display: none !important;
} */

/* Badge left offset: 16px on mobile for both top and bottom left badge groups */
.listing-card__badges--top-left,
.listing-card__badges--bottom-left {
    left: 14px !important;
}

/* =================================================================
   PREMIUM BADGE CARD - MOBILE PADDING FIX
   Ensure correct padding inside filter sidebar on mobile (max-width: 1027px)
   ================================================================= */

@media (max-width: 1027px) {
    /* Removed overriding padding for .premium-badge-card */
}
