/* Landing Page Filters Styles */

.landing-page-filters {
    margin-bottom: 20px;
    /* Ensure filters don't interfere with other dropdowns */
    position: relative;
    z-index: auto;
}

/* Ensure region select dropdown is always visible above filter dropdowns */
.event-search .select-dropdown-menu .dropdown-menu {
    z-index: 1001 !important;
}

/* Tabs */
.lp-filters-tabs {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0;
    border-bottom: 2px solid #e4e4e4;
    margin-bottom: 20px;
}

.lp-tabs-left {
    display: flex;
    gap: 0;
}

.lp-tab-btn {
    padding: 12px 24px;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    font-size: 16px;
    font-weight: 600;
    color: #4f4f4f;
    cursor: pointer;
    transition: all 0.2s;
    margin-bottom: -2px;
}

.lp-tab-btn:hover {
    color: #2f2f2f;
}

.lp-tab-btn.active {
    color: #2f2f2f;
    border-bottom-color: #2f2f2f;
}

/* Filter Bar */
.lp-filters-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
    align-items: center;
}

.lp-filters-container {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.lp-filter-group {
    position: relative;
    /* Ensure dropdown positioning context doesn't interfere with other dropdowns */
    z-index: auto;
}

.lp-filter-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px 8px 16px;
    padding-right: 12px;
    background: #FAFAFA;
    border: 1px solid #EEEEEE;
    border-radius: 100px;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 14px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    color: #121212;
    white-space: nowrap;
    line-height: 14px;
}

.lp-filter-btn:hover {
    border-color: #4D4D4D;
    background: #FAFAFA;
}

/* Active state when filter has a selected value */
.lp-filter-btn.active {
    background: #262626;
    border-color: #4D4D4D;
    color: white;
}

.lp-filter-btn.active .lp-filter-value {
    color: white;
}

.lp-filter-btn.active svg {
    color: white;
}

/* Open state when dropdown is visible */
.lp-filter-btn.open {
    background: #262626;
    border-color: #4D4D4D;
    color: white;
}

.lp-filter-btn.open .lp-filter-value {
    color: white;
}

.lp-filter-btn.open svg {
    color: white;
    transform: rotate(180deg);
}

.lp-filter-label {
    /* Hide label in button-style layout */
    display: none;
}

.lp-filter-value {
    font-size: 14px;
    color: #121212;
    font-weight: 500;
}

/* Dropdown arrow will be added via SVG icon in HTML, not CSS */

.lp-filter-clear {
    padding: 8px 16px;
    background: none;
    border: none;
    color: #121212;
    font-size: 14px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    cursor: pointer;
    text-decoration: underline;
    white-space: nowrap;
    line-height: 14px;
    margin-left: 8px;
}

.lp-filter-clear:hover {
    color: #262626;
    text-decoration: underline;
}

/* Clear All on tabs row (mobile only) - 100% match Figma */
.lp-filter-clear-tabs {
    display: none; /* Hidden on desktop by default */
    position: relative;
    margin: 0;
    border-radius: 100px;
    background-color: #fafafa;
    padding: 4px 4px 4px 8px;
    box-sizing: border-box;
    gap: 4px;
    border: none;
    text-align: left;
    font-size: 12px;
    color: #121212;
    font-family: montserratregular, sans-serif;
    font-weight: 500;
    line-height: 100%;
    cursor: pointer;
    white-space: nowrap;
    align-items: center;
}

.lp-filter-clear-tabs:hover {
    background-color: #f0f0f0;
}

.lp-filter-clear-tabs .clear-filters {
    position: relative;
    line-height: 100%;
    font-weight: 500;
}

.lp-filter-clear-tabs .close-small-icon {
    width: 16px;
    height: 16px;
    position: relative;
    max-height: 100%;
}

/* Desktop: Hide Clear All on tabs row, show in filters container */
@media (min-width: 769px) {
    .lp-filter-clear-tabs {
        display: none !important;
    }
    
    .lp-filter-clear-desktop {
        display: inline-flex !important;
    }
}

/* Filter Dropdowns */
/* Note: position and z-index removed to avoid creating new stacking context */

.lp-filter-group {
    position: relative;
    /* Ensure dropdown positioning context doesn't interfere with other dropdowns */
    z-index: auto;
}

.lp-filter-dropdown {
    /* Position will be set dynamically via JavaScript relative to button */
    position: absolute;
    z-index: 999;
    width: 306px;
    max-height: 400px;
    padding: 16px 16px 24px 16px;
    background: white;
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

/* Dropdown title */
.lp-filter-dropdown-title {
    color: #121212;
    font-size: 14px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    margin-bottom: 12px;
}

.lp-filter-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    overflow-x: hidden;
    max-height: calc(400px - 60px); /* Subtract padding and title height */
    padding-right: 4px; /* Space for scrollbar */
    /* Custom scrollbar styling */
    scrollbar-width: thin;
    scrollbar-color: #E0E0E0 transparent;
}

.lp-filter-options::-webkit-scrollbar {
    width: 8px;
}

.lp-filter-options::-webkit-scrollbar-track {
    background: transparent;
}

.lp-filter-options::-webkit-scrollbar-thumb {
    background-color: #E0E0E0;
    border-radius: 4px;
}

.lp-filter-options::-webkit-scrollbar-thumb:hover {
    background-color: #C0C0C0;
}

.lp-filter-option {
    padding: 12px 16px;
    background: #FAFAFA;
    border: 1px solid #E0E0E0;
    border-radius: 100px;
    text-align: left;
    cursor: pointer;
    font-size: 14px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    color: #121212;
    line-height: 16px;
    transition: all 0.2s;
}

.lp-filter-option:hover {
    border-color: #1F1F1F;
}

.lp-filter-option.active {
    background: #2E2E2E;
    border-color: #1F1F1F;
    color: white;
}

/* Date Picker Container */
.lp-date-picker-container {
    padding: 16px;
}

.lp-date-picker-placeholder {
    padding: 12px 16px;
    border: 1px solid #e4e4e4;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    color: #2f2f2f;
}

/* Parking Content */
.lp-parking-content {
    padding: 20px 0;
}

.lp-parking-placeholder {
    text-align: center;
    color: #4f4f4f;
    font-size: 14px;
}

/* Responsive */
@media (max-width: 768px) {
    /* Lock parent container widths to prevent horizontal expansion */
    /* Scope Bootstrap selectors to only affect containers within landing-page-filters */
    .landing-page-filters .container,
    .landing-page-filters .row,
    .landing-page-filters .col-md-8 {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }
    
    /* CRITICAL FIX: Force landing-page-filters to use viewport width */
    /* This prevents the container from being stretched by child content */
    .landing-page-filters {
        width: 100vw !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
        /* Negative margins to break out of parent container if needed */
        margin-left: calc(-50vw + 50%) !important;
        margin-right: calc(-50vw + 50%) !important;
        /* Add padding to maintain content spacing */
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .lp-filters-bar {
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible !important; /* Allow child to scroll */
        box-sizing: border-box !important;
    }

    /* Only the filters container should scroll horizontally */
    .lp-filters-container {
        flex: 1 1 0 !important; /* Prevent expanding beyond parent */
        min-width: 0 !important; /* Allow shrinking below content size */
        max-width: 100% !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: none !important; /* Firefox */
        -ms-overflow-style: none !important; /* IE/Edge */
        padding-bottom: 4px !important;
        box-sizing: border-box !important;
    }
    
    .lp-filters-container::-webkit-scrollbar {
        display: none !important; /* Chrome/Safari */
    }
    
    /* Prevent filter buttons from shrinking */
    .lp-filter-btn {
        flex-shrink: 0 !important;
        width: auto !important;
    }

    /* TIK-1529: Clear All on tabs row (mobile) */
    .lp-filter-clear-tabs {
        display: inline-flex !important; /* Show on mobile */
        margin-bottom: -2px; /* Align with tab buttons */
    }
    
    /* Hide Clear All in filters container on mobile (should be on tabs row) */
    .lp-filter-clear-desktop {
        display: none !important;
    }
    
    .lp-filter-dropdown {
        position: fixed;
        bottom: 0; /* Add vertical anchor to match drawer pattern */
        left: 0;
        right: 0;
        max-width: 100%;
    }
}

/* Mobile Date Picker Drawer */
.lp-date-drawer-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 9999;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.lp-date-drawer-backdrop.active {
    display: block;
    opacity: 1;
}

.lp-date-drawer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: white;
    border-radius: 12px 12px 0 0;
    max-height: 90vh;
    overflow-y: auto;
    z-index: 10000;
    transform: translateY(100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
}

.lp-date-drawer.active {
    transform: translateY(0);
}

.lp-date-drawer-handle {
    width: 52px;
    height: 3px;
    background: #D9D9D9;
    border-radius: 3px;
    margin: 8px auto 0;
    flex-shrink: 0;
}

.lp-date-drawer-header {
    padding: 20px 16px;
    border-bottom: 1px solid #E0E0E0;
    flex-shrink: 0;
}

.lp-date-drawer-title {
    font-size: 16px;
    font-weight: normal;
    font-family: montserratsemibold, sans-serif;
    color: #000000;
    line-height: 1.219;
}

.lp-date-quick-select {
    display: flex;
    gap: 8px;
    padding: 16px;
    flex-shrink: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.lp-quick-select-btn {
    padding: 8px 12px 8px 16px;
    background: #FAFAFA;
    border: 1px solid #EEEEEE;
    border-radius: 100px;
    font-size: 14px;
    font-weight: normal;
    font-family: montserratregular, sans-serif;
    color: #121212;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
}

.lp-quick-select-btn:active {
    background: #E0E0E0;
    transform: scale(0.98);
}

.lp-date-drawer-content {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
    min-height: 0;
}

.lp-date-drawer-content .daterangepicker {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: none !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
}

/* Force calendars to stack vertically on mobile */
.lp-date-drawer-content .daterangepicker .drp-calendar {
    display: block !important;
    visibility: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 8px 0 !important;
    float: none !important;
    clear: both !important;
}

/* Left calendar - add bottom border */
.lp-date-drawer-content .daterangepicker .drp-calendar.left {
    border-bottom: 1px solid #E0E0E0 !important;
    padding-bottom: 12px !important;
    margin-bottom: 8px !important;
}

/* Ensure calendar tables are visible and full width */
.lp-date-drawer-content .daterangepicker .calendar-table {
    display: block !important;
    width: 100% !important;
}

.lp-date-drawer-content .daterangepicker .calendar-table {
    padding: 0 8px !important;
}

.lp-date-drawer-content .daterangepicker .calendar-table table {
    width: 100% !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
}

/* Mobile drawer: Fixed height cells */
.lp-date-drawer-content .daterangepicker td {
    height: 48px !important;
    padding: 0 !important;
    text-align: center !important;
    font-size: 15px !important;
    vertical-align: middle !important;
    background: transparent !important;
    position: relative !important;
}

/* Mobile: Override all circle styles to use fixed-size circles */
.lp-date-drawer-content .daterangepicker td.active,
.lp-date-drawer-content .daterangepicker td.start-date,
.lp-date-drawer-content .daterangepicker td.end-date,
.lp-date-drawer-content .daterangepicker td.today {
    background: transparent !important;
}

/* Mobile: Create fixed-size circle using ::before pseudo-element */
.lp-date-drawer-content .daterangepicker td.active::before,
.lp-date-drawer-content .daterangepicker td.start-date::before,
.lp-date-drawer-content .daterangepicker td.end-date::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 40px !important;
    height: 40px !important;
    background: #CF1C35 !important;
    border-radius: 50% !important;
    z-index: 0 !important;
}

/* Mobile: Today - just show normal text, no circle unless selected */
.lp-date-drawer-content .daterangepicker td.today:not(.active):not(.start-date):not(.end-date):not(.in-range) {
    color: #0F172A !important;
    font-weight: 600 !important;
}

/* Mobile: Ensure text is above the circle */
.lp-date-drawer-content .daterangepicker td.active,
.lp-date-drawer-content .daterangepicker td.start-date,
.lp-date-drawer-content .daterangepicker td.end-date {
    color: white !important;
    isolation: isolate !important;
}

/* The ::before has z-index: -1 so text shows above */
.lp-date-drawer-content .daterangepicker td.active::before,
.lp-date-drawer-content .daterangepicker td.start-date::before,
.lp-date-drawer-content .daterangepicker td.end-date::before {
    z-index: -1 !important;
}

/* Mobile: In-range background */
.lp-date-drawer-content .daterangepicker td.in-range {
    background: transparent !important;
    position: relative !important;
    isolation: isolate !important;
}

.lp-date-drawer-content .daterangepicker td.in-range.start-date,
.lp-date-drawer-content .daterangepicker td.in-range.end-date {
    background: transparent !important;
}

/* Mobile: In-range dates should be circular (light red) */
.lp-date-drawer-content .daterangepicker td.in-range:not(.active):not(.start-date):not(.end-date)::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: #FEE2E2 !important;
    z-index: -1 !important;
}

.lp-date-drawer-content .daterangepicker td.in-range:not(.active):not(.start-date):not(.end-date) {
    color: #334155 !important;
}

/* Weekday header row */
.lp-date-drawer-content .daterangepicker th {
    height: 36px !important;
    padding: 4px !important;
    text-align: center !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: #334155 !important;
}

/* Month header */
.lp-date-drawer-content .daterangepicker th.month {
    font-size: 16px !important;
    font-weight: 600 !important;
    padding: 12px 0 !important;
}

/* Hide the drp-buttons inside mobile drawer since we have our own */
.lp-date-drawer-content .daterangepicker .drp-buttons {
    display: none !important;
}

.lp-date-drawer-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 4px 12px 16px;
    flex-shrink: 0;
    border-top: 1px solid #E0E0E0;
}

.lp-date-drawer-clear,
.lp-date-drawer-apply {
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: normal;
    font-family: montserratsemibold, sans-serif;
    line-height: 1.143;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
}

.lp-date-drawer-clear {
    background: #ECECEC;
    color: #202020;
}

.lp-date-drawer-clear:active {
    background: #D0D0D0;
}

.lp-date-drawer-apply {
    background: #CF1C35;
    color: #FFFFFF;
}

.lp-date-drawer-apply:active {
    background: #991B1B;
}

/* Frozen scroll for mobile */
html.frozen,
body.frozen {
    position: fixed;
    width: 100%;
    overflow: hidden;
}

/* Desktop Quick Select Buttons - compact inline design */
.lp-desktop-quick-select {
    display: none !important; /* Hide the separate quick-select container, buttons will be in drp-buttons */
}

@media (min-width: 769px) {
    .lp-date-drawer-backdrop,
    .lp-date-drawer {
        display: none !important;
    }
}

/* Hide daterangepicker arrow/triangle pointer */
.daterangepicker:before,
.daterangepicker:after {
    display: none !important;
    content: none !important;
}

/* Daterangepicker custom styling to 100% match Figma */
.daterangepicker {
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    z-index: 1000 !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.12) !important;
    padding: 0 !important;
    background: white !important;
    width: auto !important;
}

/* Force left alignment - adjust position to align with Date button */
.daterangepicker.opensleft,
.daterangepicker.opensLeft {
    /* The daterangepicker calculates position based on button
       We need to ensure it aligns with the left edge of the Date button */
    margin-left: 0 !important;
}

/* Ensure proper positioning */
.daterangepicker {
    margin-top: 8px !important;
}

/* Calendar container - more compact */
.daterangepicker .drp-calendar {
    padding: 10px !important;
    width: 280px !important;
    max-width: 280px !important;
}

/* Calendar table */
.daterangepicker .calendar-table {
    width: 100% !important;
    table-layout: fixed !important;
    border-spacing: 0 !important;
    border-collapse: collapse !important;
}

/* Month/Year header - with bottom border */
.daterangepicker .calendar-table thead tr:first-child {
    border-bottom: 1px solid #E2E8F0 !important;
}

.daterangepicker .calendar-table thead tr:first-child th {
    padding: 0 0 7px 0 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #334155 !important;
    border: none !important;
}

.daterangepicker .calendar-table thead tr:first-child th.month {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #334155 !important;
}

/* Week day headers - compact */
.daterangepicker .calendar-table thead tr:last-child th {
    padding: 6px 0 3px 0 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    color: #334155 !important;
    text-align: center !important;
    border: none !important;
    width: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
}

/* Date cells - compact circles */
.daterangepicker td {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
    padding: 0 !important;
    text-align: center !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    color: #334155 !important;
    vertical-align: middle !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
}

/* Create inner circle container */
.daterangepicker td.available,
.daterangepicker td.today,
.daterangepicker td.active,
.daterangepicker td.start-date,
.daterangepicker td.end-date {
    position: relative !important;
}

/* Default state - transparent */
.daterangepicker td.available {
    background: transparent !important;
}

/* Hover state - light gray perfect circle */
.daterangepicker td.available:hover {
    background: radial-gradient(circle, #F1F5F9 0%, #F1F5F9 77.78%, transparent 77.78%) !important;
    border-radius: 50% !important;
}

/* Today - gray perfect circle */
.daterangepicker td.today {
    background: radial-gradient(circle, #E2E8F0 0%, #E2E8F0 77.78%, transparent 77.78%) !important;
    color: #0F172A !important;
    border-radius: 50% !important;
}

/* Selected dates - red perfect circle */
.daterangepicker td.active,
.daterangepicker td.active:hover,
.daterangepicker td.start-date,
.daterangepicker td.start-date:hover,
.daterangepicker td.end-date,
.daterangepicker td.end-date:hover,
.daterangepicker td.start-date.end-date,
.daterangepicker td.start-date.end-date:hover {
    background: radial-gradient(circle, #CF1C35 0%, #CF1C35 77.78%, transparent 77.78%) !important;
    background-image: radial-gradient(circle, #CF1C35 0%, #CF1C35 77.78%, transparent 77.78%) !important;
    border: none !important;
    border-radius: 50% !important;
    color: white !important;
}

/* In-range dates - light red background, no border radius, no gap */
.daterangepicker td.in-range {
    background: radial-gradient(circle, #FEE2E2 0%, #FEE2E2 77.78%, transparent 77.78%) !important;
    background-image: radial-gradient(circle, #FEE2E2 0%, #FEE2E2 77.78%, transparent 77.78%) !important;
    color: #334155 !important;
    border-radius: 50% !important;
    margin: 0 !important;
    border: none !important;
}

.daterangepicker td.in-range:hover {
    background: radial-gradient(circle, #FEE2E2 0%, #FEE2E2 77.78%, transparent 77.78%) !important;
    background-image: radial-gradient(circle, #FEE2E2 0%, #FEE2E2 77.78%, transparent 77.78%) !important;
}

/* Start and end dates should still be circles even when in range - higher specificity */
.daterangepicker td.in-range.start-date,
.daterangepicker td.in-range.start-date:hover,
.daterangepicker td.in-range.end-date,
.daterangepicker td.in-range.end-date:hover,
.daterangepicker td.start-date.in-range,
.daterangepicker td.start-date.in-range:hover,
.daterangepicker td.end-date.in-range,
.daterangepicker td.end-date.in-range:hover {
    background: radial-gradient(circle, #CF1C35 0%, #CF1C35 77.78%, transparent 77.78%) !important;
    background-image: radial-gradient(circle, #CF1C35 0%, #CF1C35 77.78%, transparent 77.78%) !important;
    color: white !important;
    border-radius: 50% !important;
}

/* Disabled dates */
.daterangepicker td.disabled,
.daterangepicker td.off.disabled {
    opacity: 0.6 !important;
    color: #334155 !important;
    background: transparent !important;
}

/* Off dates (other months) */
.daterangepicker td.off {
    color: #94A3B8 !important;
    opacity: 0.6 !important;
}

/* Navigation arrows - perfect circles */
.daterangepicker th.prev,
.daterangepicker th.next {
    width: 35px !important;
    height: 35px !important;
    border-radius: 50% !important;
    color: #64748B !important;
    padding: 7px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.daterangepicker th.prev:hover,
.daterangepicker th.next:hover {
    background: #F1F5F9 !important;
}

/* Left arrow on the left side */
.daterangepicker .calendar-table thead tr:first-child th.prev {
    text-align: left !important;
}

/* Right arrow on the right side */
.daterangepicker .calendar-table thead tr:first-child th.next {
    text-align: right !important;
}

/* Buttons container - compact design with quick select on left, buttons on right */
.daterangepicker .drp-buttons {
    border-top: 1px solid #E0E0E0 !important;
    padding: 12px !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 12px !important;
    background: white !important;
    flex-wrap: wrap !important;
}

/* Hide selected date range text */
.daterangepicker .drp-buttons .drp-selected {
    display: none !important;
}

/* Quick select buttons in the buttons row */
.daterangepicker .drp-buttons .lp-quick-select-inline {
    display: flex !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
    margin-right: auto !important;
}

.daterangepicker .drp-buttons .lp-quick-btn {
    padding: 6px 12px !important;
    background: #F5F5F5 !important;
    border: 1px solid #E0E0E0 !important;
    border-radius: 100px !important;
    font-size: 13px !important;
    font-weight: normal !important;
    font-family: montserratregular, sans-serif !important;
    color: #333 !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    transition: all 0.15s !important;
}

.daterangepicker .drp-buttons .lp-quick-btn:hover {
    background: #E8E8E8 !important;
    border-color: #999 !important;
}

/* Clear and Apply buttons wrapper */
.daterangepicker .drp-buttons .lp-action-btns {
    display: flex !important;
    gap: 16px !important;
    margin-left: auto !important;
}

/* Button styling - match mobile (mobile is correct) */
.daterangepicker .drp-buttons .btn {
    padding: 8px 12px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    font-weight: normal !important;
    font-family: montserratsemibold, sans-serif !important;
    line-height: 1.143 !important;
    min-width: 0 !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
    box-shadow: none !important;
}

/* Clear button - match mobile */
.daterangepicker .drp-buttons .cancelBtn,
.daterangepicker .drp-buttons .btn-default {
    background: #ECECEC !important;
    background-image: none !important;
    border: none !important;
    color: #202020 !important;
}

.daterangepicker .drp-buttons .cancelBtn:hover,
.daterangepicker .drp-buttons .btn-default:hover {
    background: #D0D0D0 !important;
}

/* Apply button - match mobile */
.daterangepicker .drp-buttons .applyBtn,
.daterangepicker .drp-buttons .btn-primary {
    background: #CF1C35 !important;
    background-image: none !important;
    border: none !important;
    color: white !important;
}

.daterangepicker .drp-buttons .applyBtn:hover,
.daterangepicker .drp-buttons .btn-primary:hover {
    background: #991B1B !important;
}

/* ============================================
   Mobile Filter Drawer (for non-date filters)
   ============================================ */
.lp-filter-drawer-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.6);
    z-index: 9999;
    display: none;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.lp-filter-drawer-backdrop.active {
    display: block;
    opacity: 1;
}

.lp-filter-drawer {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: white;
    border-radius: 12px 12px 0 0;
    max-height: 70vh;
    overflow-y: auto;
    z-index: 10000;
    transform: translateY(100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
}

.lp-filter-drawer.active {
    transform: translateY(0);
}

.lp-filter-drawer-handle {
    width: 52px;
    height: 3px;
    background: #D9D9D9;
    border-radius: 3px;
    margin: 8px auto 0;
    flex-shrink: 0;
}

.lp-filter-drawer-header {
    padding: 20px 16px;
    border-bottom: 1px solid #E0E0E0;
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.lp-filter-drawer-title {
    font-size: 14px;
    font-weight: normal;
    font-family: montserratsemibold, sans-serif;
    color: #000000;
    line-height: 1.2;
}

.lp-filter-drawer-close {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    color: #666;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lp-filter-drawer-close:hover {
    color: #000;
}

.lp-filter-drawer-content {
    padding: 16px 16px 32px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    flex: 1;
    overflow-y: auto;
}

.lp-filter-drawer-subtitle {
    color: #121212;
    font-size: 14px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    line-height: 1.2;
}

.lp-filter-drawer-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.lp-filter-drawer-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #FAFAFA;
    border: 1px solid #E0E0E0;
    border-radius: 100px;
    width: 100%;
    text-align: left;
    font-size: 14px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    color: #2E2E2E;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
}

.lp-filter-drawer-option:hover {
    background: #F5F5F5;
}

.lp-filter-drawer-option:active {
    background: #EEEEEE;
}

.lp-filter-drawer-option.selected {
    background: #2E2E2E;
    border: 1px solid #1F1F1F;
    color: #FFFFFF;
}

.lp-filter-drawer-option-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
}

.lp-filter-drawer-option-text {
    font-size: 14px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    line-height: 16px;
    color: inherit;
}

.lp-filter-drawer-option-check {
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    opacity: 0;
    flex: 0 0 auto;
}

.lp-filter-drawer-option.selected .lp-filter-drawer-option-check {
    opacity: 1;
}

/* ============================================
   LP: Filtered no-results empty state (Venue + Performer)
   ============================================ */
.lp-filters-no-results {
    width: 100%;
    height: 100%;
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 24px;
    padding-bottom: 24px;
    overflow: hidden;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 16px;
    background: transparent;
}

.lp-filters-no-results-text {
    align-self: stretch;
    text-align: center;
    color: var(--font-color-primary-900, #121212);
    font-size: 16px;
    font-family: montserratregular, sans-serif;
    font-weight: normal;
    line-height: 24px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.lp-filters-no-results-btn {
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
    background: var(--surface-primary, #C00728);
    border-radius: 4px;
    border: none;
    font-family: montserratregular, sans-serif;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.lp-filters-no-results-btn-text {
    color: var(--font-color-inverse-0, white);
    font-size: 14px;
    font-family: montserratsemibold, sans-serif;
    font-weight: normal;
    line-height: 16px;
    word-wrap: break-word;
    overflow-wrap: break-word;
}