/* =========================================================
   ТЕКСТОВАЯ ЧАСТЬ МЕНЮ ВТОРОГО УРОВНЯ
   ========================================================= */

.second-level-lots-text {

    margin: 0 0 6px 12px;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 600;

    line-height: 1.4;

    color: #4B5563;

    letter-spacing: .05px;

    text-align: justify;

}


/* =========================================================
   КОЛИЧЕСТВО ЛОТОВ В ЗАГОЛОВКЕ
   ========================================================= */

.second-lots-menu-section-title {

    margin: 0 0 6px 3px;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 18px;

    font-weight: 600;

    line-height: 1.4;

    color: #1D4ED8;

    letter-spacing: .05px;

    text-align: center;

}





/* =========================================================
   ОДНОСТРОЧНЫЕ ПОЛЯ В МЕНЮ
   ========================================================= */

.change-lots-menu-field {

    width: 235px;

    padding: 9px 15px;

    box-sizing: border-box;

    border: 1px solid #D1D5DB;

    border-radius: 8px;

    background: #FFFFFF;

    color: #374151;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 1.3;

    outline: none;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;

}

/* =========================================================
   ОДНОСТРОЧНЫЕ ПОЛЯ SHOT
   ========================================================= */

.change-lots-menu-shot-field {

    width: 108px;

    padding: 9px 15px;

    box-sizing: border-box;

    border: 1px solid #D1D5DB;

    border-radius: 8px;

    background: #FFFFFF;

    color: #374151;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 1.3;

    outline: none;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;

}

.change-lots-menu-shot-field + .change-lots-menu-shot-field {

    margin-left: 11px;

}

/* =========================================================
   МНОГОСТРОЧНОЕ ПОЛЕ
   ========================================================= */

.change-lots-menu-textarea {

    width: 235px;

     padding: 9px 15px;

    box-sizing: border-box;

    border: 1px solid #D1D5DB;

    border-radius: 8px;

    background: #FFFFFF;

    color: #374151;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 1.5;

    outline: none;

    resize: vertical;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;

}


/* =========================================================
   PLACEHOLDER
   ========================================================= */

.change-lots-menu-shot-field:placeholder,
.change-lots-menu-field::placeholder,
.change-lots-menu-textarea::placeholder {

    color: #6B7280;

}


/* =========================================================
   FOCUS
   ========================================================= */

.change-lots-menu-shot-field:focus,
.change-lots-menu-field:focus,
.change-lots-menu-textarea:focus {

    border-color: var(--blue);

    box-shadow:
        0 0 0 2px rgba(59, 130, 246, .12);

}


/* =========================================================
   HOVER
   ========================================================= */

.change-lots-menu-shot-field:hover,
.change-lots-menu-field:hover,
.change-lots-menu-textarea:hover {

    border-color: #9CA3AF;

}


/* =========================================================
   ВЫБОР МАРКИ МАШИНЫ
   ========================================================= */

.lots-menu-category-select {

    width: 235px;

    padding: 9px 15px;

    box-sizing: border-box;

    border: 1px solid #D1D5DB;

    border-radius: 8px;

    background: #FFFFFF;

    color: #374151;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 1.3;

    cursor: pointer;

    outline: none;

    transition:
        border-color .2s ease,
        box-shadow .2s ease,
        background .2s ease;

}


/* =========================================================
   НЕДОСТУПНОЕ ЗНАЧЕНИЕ
   ========================================================= */

.lots-menu-category-select:invalid {

    color: #6B7280;

}


/* =========================================================
   FOCUS
   ========================================================= */

.lots-menu-category-select:focus {

    border-color: var(--blue);

    box-shadow:
        0 0 0 2px rgba(59, 130, 246, .12);

}


/* =========================================================
   НАВЕДЕНИЕ
   ========================================================= */

.lots-menu-category-select:hover {

    border-color: #9CA3AF;

}

/* =========================================================
   ФИЛЬТР «ТОЛЬКО ИЗБРАННОЕ»
   ========================================================= */

.lots-menu-favorites {

    display: flex;

    align-items: center;

    gap: 8px;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 1.3;

    color: #4B5563;

    cursor: pointer;

}


/* =========================================================
   ЧЕКБОКС
   ========================================================= */

.lots-menu-favorites input[type="checkbox"] {

    width: 17px;

    height: 17px;

    margin: 0;

    cursor: pointer;

    accent-color: var(--blue);

}


/* =========================================================
   КНОПКИ ФИЛЬТРА
   ========================================================= */

.lots-menu-filter-button {

    width: 111px;

    padding: 9px 15px;

    box-sizing: border-box;

    border: 1px solid var(--blue);

    border-radius: 8px;

    background: var(--blue);

    color: #FFFFFF;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 500;

    line-height: 1.3;

    cursor: pointer;

    outline: none;

    transition:
        background .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;

}


/* =========================================================
   ВТОРАЯ КНОПКА
   ========================================================= */

.lots-menu-filter-button {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 108px;

    padding: 9px 15px;

    box-sizing: border-box;

    border: 1px solid var(--blue);

    border-radius: 8px;

    background: var(--blue);

    color: #FFFFFF;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 500;

    line-height: 1.3;

    text-decoration: none;

    white-space: nowrap;

    cursor: pointer;

    outline: none;

    transition:
        background .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;

}


.lots-menu-filter-button + .lots-menu-filter-button {

    margin-left: 11px;

}

/* =========================================================
   НАВЕДЕНИЕ
   ========================================================= */

.lots-menu-filter-button:hover {

    background: var(--blue-dark);

    border-color: var(--blue-dark);

    box-shadow:
        0 4px 10px rgba(30, 64, 175, .18);

    transform: translateY(-1px);

}


/* =========================================================
   НАЖАТИЕ
   ========================================================= */

.lots-menu-filter-button:active {

    transform: translateY(0);

}


/* =========================================================
   ФОКУС
   ========================================================= */

.lots-menu-filter-button:focus-visible {

    outline: 2px solid var(--blue);

    outline-offset: 2px;

}

/* =========================================================
   ЗАПРЕТ ПЕРЕНОСА
   ========================================================= */
   
.lots-menu-filter-button {

    width: 108px;

    padding: 9px 15px;

    box-sizing: border-box;

    border: 1px solid var(--blue);

    border-radius: 8px;

    background: var(--blue);

    color: #FFFFFF;

    font-family:
        Inter,
        system-ui,
        sans-serif;

    font-size: 17px;

    font-weight: 500;

    line-height: 1.3;

    white-space: nowrap;

    cursor: pointer;

    outline: none;

    transition:
        background .2s ease,
        border-color .2s ease,
        box-shadow .2s ease,
        transform .2s ease;

}

  
/* =========================================================
   КНОПКА ПОИСКА НАЙДЕННЫХ ЛОТОВ
   ========================================================= */

.lots-search-control {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    width: 30px;

    height: 30px;

    margin: 0 0 0 6px;

    padding: 0;

    box-sizing: border-box;

    border: none;

    background: transparent;

    color: var(--blue);

    cursor: pointer;

    outline: none;

    transform: translateY(8px);

    transition:
        color .2s ease;

}


.lots-search-control:hover {

    color: var(--blue-dark);

}


.lots-search-control:active {

    color: var(--blue);

}


.lots-search-icon {

    display: block;

    width: 30px;

    height: 30px;

    transition:
        transform .2s ease;

}


.lots-search-control:hover .lots-search-icon {

    transform: scale(1.1);

}


/* =========================================================
   CSS первой колонки
   ========================================================= */

.lots-auction-date {
    display: block;
}

.lots-auction-date-label {
    display: block;
}

.lots-auction-date-value {
    display: block;
    margin-top: 1em;
    color: #1D4ED8;
}

/* =========================================================
   CSS флаги стран
   ========================================================= */

.customs-country-flag svg {
    width: 42px;
    height: auto;
    display: inline-block;
    vertical-align: middle;
}