.selected-option {
            background-color: #e3f2fd !important;
            font-weight: bold;
        }

        .dropdown-menu {

            width: 100%;
            /* Set the width to 100% */
            max-height: 400px;
            overflow-y: auto;
            overflow-x: hidden;
            box-sizing: border-box;
            /* Include padding in the width calculation */
            text-align: left;
            /* Align text to the left */
            white-space: nowrap;
            /* Prevent text wrapping */


        }

        .scrollable-dropdown {
            max-height: 400px;
            overflow-y: auto;
            overflow-x: hidden;
        }

        #modelList {
            max-height: 400px !important;
            overflow-y: auto !important;
            overflow-x: hidden !important;
        }

        button[disabled] {
            border: none;
            /* Remove the border */
            background-color: transparent;
            /* Optional: Make the background transparent */
            pointer-events: none;
            /* Ensure it can't be interacted with */
            box-shadow: none;
            /* Remove any box shadow, if present */

        }

        .dropdown-toggle[disabled]::after {
            content: none;
            /* Remove the arrow */
        }

        .third_container {
            transform: scale(0.9, 1);
            transform-origin: center;

        }

        .fourth_container {
            transform: scale(0.9, 1);
            transform-origin: center;
        }

        .fourth_containercard {
            transform: scale(0.9, 1);
            transform-origin: center;
        }

        .blog_container {
            transform: scale(0.9, 1);
            transform-origin: center;
        }

        .seventh_container {
            transform: scale(0.9, 1);
            transform-origin: center;
        }

        .car_varient {
            margin-bottom: 10px !important;
        }

        .car_detail {
            padding-top: 1px !important;
            justify-content: flex-start !important;
            gap: 6px !important;
        }

        .car_detail-item {
            padding: 5px 12px 5px;
            border-radius: 5px;
            background-color: #f1f1f1;
            font-size: 14px;
            font-weight: 500;
            color: #000;
        }

        @media (max-width: 768px) {

            #mobileSearchClose {
                display: none !important;
            }

            .hero-section-desktop {
                display: none !important;
            }

            /* Keep previous intent, but DON'T hide the mobile full-screen select modals. */
            .display-desktop-none:not(.custom-select-modal) {
                display: none !important;
            }

            .custom-select-header {
                display: none !important;
            }

            /* If you meant the "X" close icon inside the full-screen select modal */
            .custom-select-close {
                display: none !important;
            }

            /* Mobile only: hide the small "selected circles" indicators */
            /*.custom-select-list .dropdown-item::before,
            .custom-select-list .dropdown-item::after,
            .dropdown-menu.mobile-menu .dropdown-item::before,
            .dropdown-menu.mobile-menu .dropdown-item::after {
                display: none !important;
                content: none !important;
                }*/

            /* Landing page: mobile-only option design (for the full-screen selector lists) */
            .dropdown-menu.mobile-menu .dropdown-item,
            .custom-select-list .dropdown-item {
                padding: 18px 16px;
                color: #0E121B !important;
                white-space: normal !important;
                position: relative !important;
                padding-left: 16px !important;
                /* since circles are hidden */
                border-bottom: 1px solid #dddddd !important;
                font-size: 16px !important;
                font-weight: 500 !important;
                background: #fff !important;
            }

            .custom-select-list .dropdown-item.selected-option::before {
                outline: 1px solid #388BF7;
                background-color: #388BF7 !important;
            }

            /* Landing page: make "Clear all" full-width on mobile */
            #mobileHeroSearchForm .mobile-buttons-container {
                width: 100% !important;
            }

            #mobileHeroSearchForm .mobile-buttons-container .clear-all-link {
                width: 100% !important;
                flex: 1 1 100% !important;
                display: flex !important;
                justify-content: center !important;
                text-align: center !important;
            }

            .pc-mobile-search-close {
                display: none !important;
            }

            /* Landing page: ensure the Close button stays hidden (mobile only) */
            #mobileHeroSearchForm .pc-mobile-search-close {
                display: none !important;
            }

            .custom-select-list .dropdown-item.selected-option::before {
                outline: 1px solid #388BF7;
                background-color: #388BF7 !important;
            }

        }

        .search-btn {
            background-color: #000;
            color: #fff;
            border: none;
            font-size: 16px;
            height: 44px;
            border-radius: 12px;
            font-weight: 500;
            cursor: pointer;
            transition: background-color 0.2s ease;
            white-space: nowrap;
            flex: 0 0 auto;
        }

        .clear-all-link {
            border: 1px solid rgba(82, 88, 102, 0.22);
            color: #FB3748;
            font-size: 16px;
            height: 44px;
            border-radius: 12px;
            font-weight: 500;
            cursor: pointer;
            transition: all 0.2s ease;
            text-decoration: none;
            text-align: center;
            display: flex;
            width: 100%;
            justify-content: center;
            align-items: center;
        }
        @media (max-width: 767px) {
            .buyingessentials .row {
                display: flex;
                flex-wrap: nowrap;
                overflow-x: hidden;
                scroll-snap-type: x mandatory;
                scroll-behavior: smooth;
                -webkit-overflow-scrolling: touch;
                position: relative;
            }

            .buyingessentials .col-sm-12 {
                flex: 0 0 100%;
                max-width: 100%;
                scroll-snap-align: center;
                padding: 0 15px;
            }

            .essential-card {
                margin: 0 auto;
                max-width: 300px;
            }

            .pagination-dots {
                display: flex;
                justify-content: center;
                margin-top: 20px;
                gap: 8px;
            }

            .dot {
                width: 8px;
                height: 8px;
                border-radius: 50%;
                background-color: #ccc;
                cursor: pointer;
                transition: background-color 0.3s ease;
            }

            .dot.active {
                background-color: #333;
            }
        }

        /* Preserve desktop styles */
        @media (min-width: 768px) {
            .pagination-dots {
                display: none;
            }
        }