/* Default state - No border, white background */
.coveo-magicbox-suggestions .coveo-omnibox-selectable {
    border: none !important;
    background: #ffffff !important; /* White background */
    color: #212121 !important; /* Dark text for readability */
}

    /* Keyboard / Mouse focus (Arrow keys / Tab key) */
    .coveo-magicbox-suggestions .coveo-omnibox-selectable.coveo-omnibox-selected {
        background-color: #d1d1d1 !important; /* Light gray focus background */
        border: 1px solid #000 !important; /* Strong black border for visibility */
        outline: 1px solid #000 !important; /* Extra focus indicator */
        color: #000 !important;
    }

/* Default Styles (Mobile first) */

.container {
    width: 100%;
    padding: 20px;
}
/* ----------- iPhone 6, 6S, 7 and 8 ----------- */

/* Portrait and Landscape */

@media only screen and (min-device-width: 375px) and (max-device-width: 768px) and (-webkit-min-device-pixel-ratio: 2) {

    .search-header {
        flex-direction: column;
        width: 100% !important;
        justify-content: normal !important;
        align-items: normal !important;
    }
    .search-results-container {
        padding : 0px 0px 0px 0px;
    }
    .search-info {
        /*border: 1px solid red;*/
        display: flex !important;
    }
    .filter-options {
        margin-top: 16px;
        display: flex !important;
        /*border: 1px solid red;*/
        justify-content: end;
    }
    .pagination-wrapper {
        flex-direction: column;
        width: 100% !important;
        justify-content: normal !important;
        align-items: normal !important;
    }
    .results-per-page {
        margin-top: 16px;
        display: flex !important;
        /*border: 1px solid red;*/
        justify-content: end;
    }

}


/* Styles for devices wider than 600px (tablets and above) */
@media (min-width: 600px) {
    .container {
        padding: 30px;
    }
}

/* Styles for devices wider than 768px (small laptops and up) */
@media (min-width: 768px) {
    .container {
        max-width: 750px;
        margin: 0 auto;
    }
}

/* Styles for devices wider than 1024px (larger tablets and up) */
@media (min-width: 1024px) {
    .container {
        max-width: 960px;
    }
}

/* Styles for devices wider than 1200px (desktops and large laptops) */
@media (min-width: 1200px) {
    .container {
        max-width: 100%;
    }
}

/* Styles for devices wider than 1400px (large desktops) */
@media (min-width: 1400px) {
    .container {
        max-width: 100%;
        padding: 0px;
    }
    .search-container {
        width:50%;
    }
    .search-results-container {
        max-width: 1200px;
        margin-left: auto;
        margin-right: auto;
        position: relative;
    }
    .search-header
    {
        width:77%
    }
}