/*
* @todo: Split this file in sections and make it scss.
*/
/* -------------------------------- 

Title: Dealer List
Description: A searchable custom dropdown

-------------------------------- */
body.modal-open {
    overflow: hidden;
}

#dealers-list .dealers-dropdown__select-btn {
    font-family: "benton", sans-serif;
    display: block;
    width: 100%;
    height: 3rem;
    text-align: left;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    color: rgb(95, 95, 109);
    border: 1px solid rgb(224, 224, 232);
    border-radius: 0.375rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    background-size: 1.5em 1.5em;
    background-color: white;
    cursor: pointer;
}

.reset.modal__close-btn {
    top: 10px;
    position: relative;
    right: 10px;
}

#dealers-list input {
    position: relative;
    width: 100%;
    padding: 0.5rem 1.5rem 0.5rem 1.5rem;
    height: 3rem;
    margin-top: 10px;
    color: rgb(95, 95, 109);
    border: 1px solid rgb(224, 224, 232);
    border-radius: 0.375rem;
    z-index: 11;
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'><style>svg{fill: rgb(95,95,109)}</style><path stroke='%236b7280' d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z'/></svg>");
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    background-size: 1em 1em;
    background-color: white;
}

#dealer-list .dealers-dropdown__content {
    padding: 1rem;
}

.dealers-dropdown__content {
    display: flex;
    flex-direction: column;
    position: relative;
}

.dealers-drodown__list-container {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    position: absolute;
    max-height: 40vh;
    overflow: auto;
    background-color: #f2f2f2;
    z-index: 10;
    width: 94%;
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}

.dealers-drodown__list-container a {
    text-decoration: none;
    color: gray;
    width: 100%;
    min-height: 50px;
    padding: 1rem;
}

.dealers-drodown__list-container::-webkit-scrollbar {
    width: 0.5em;
    border-radius: 50%;
}

.dealers-drodown__list-container::-webkit-scrollbar-track {
    -webkit-box-shadow: transparent;
}

.dealers-drodown__list-container::-webkit-scrollbar-thumb {
    background-color: slategrey;
}

.search-select-container {
    position: relative;
    padding: 0 1rem;
    background-color: white;
}

.show {
    display: initial;
}

.hidden {
    display: none;
}

.dealer-item:hover {
    background-color: white;
}