/* Базовые стили из оригинального файла (необходимы для других блоков) */
.autoservForm .inpField { margin-bottom: 25px; }
.rightText { margin: 0 15px; }
.container.cont2 { margin-top: 60px; }
.formDesc_bl { display: none; }
.formDesc_bl b { display: block; }
.serv_form_options .appointment__form-field .type-checkbox__content p { white-space: normal; }
.serv_form_options .form-checkmark { width: 25px; height: 25px; }
.type-checkbox__content { margin-bottom: 17px; }
.autoservSendWr { width: 200px; margin-top: 45px; }
.el2 { margin-top: 50px; }
.map__wrap.map_autoserv { margin-top: 50px; }
.postOrderWr { margin-top: 45px; }
.postOrderWr p { font-weight: bold; }
#autoservBack { background-color: #fff1e0; color: rgb(255, 103, 0); }
.err_auto { font-size: 12px; color: red; }
.welcome__slider-wrap.welcome__slider-wrap2 { width: 100%; float: none; }
.autoserv_phone_text { font-weight: 900; text-transform: uppercase; }
.container.autoserv_phoneWR { font-size: 25px; font-weight: 900; }
.serv_attention { margin: 10px 0; color: #ff6700; font-weight: normal; text-align: center; }
.serv_attention a { color: #ff6700; font-weight: bold; text-decoration: underline; }

/* ========================================================== */
/* ПРЕМИУМ-ИСПРАВЛЕНИЯ ТОЛЬКО ДЛЯ ФОРМЫ АВТОСЕРВИСА */
/* (Шиномонтаж не затронет, так как привязано к id и классам) */
/* ========================================================== */

/* 1. ИСПРАВЛЯЕМ СЖАТЫЙ КАЛЕНДАРЬ */
/* Перебиваем width: 115px из custom.style.css */
#autoservice_form .dated {
    width: 100% !important;
    max-width: 400px !important;
    margin: 0 !important;
    display: block !important;
}
#autoservice_form .ui-datepicker {
    width: 100% !important;
    padding: 0 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05) !important;
}

/* 2. УБИРАЕМ ОГРОМНУЮ ДЫРУ МЕЖДУ КАЛЕНДАРЕМ И ВРЕМЕНЕМ */
/* Перебиваем width: 315px и min-height: 490px */
.sheduleDest.autoservDest {
    width: 100% !important;
    min-height: auto !important;
    display: block !important;
    margin-top: 15px !important;
}

/* 3. ИСПРАВЛЯЕМ КРИВЫЕ КНОПКИ (УБИРАЕМ КРУГЛЯШКИ И ОТСТУПЫ) */
.autoservDest .schedule_item {
    margin: 0 !important;
    width: 100% !important;
}
.autoservDest .shedule_item_title {
    display: none !important; /* Прячем слова "Пост 1" */
}
.autoservDest .schedule_item:nth-of-type(n+2) {
    display: none !important; /* Прячем "Пост 2" */
}

/* Строим красивую сетку кнопок 4 в ряд */
.autoservDest .schedule_item > div {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
}
.autoservDest .schedule_item > div > div {
    width: 100% !important;
    margin: 0 !important;
}

/* ПОЛНОСТЬЮ удаляем старые псевдоэлементы кругляшков из custom.style.css */
.autoservDest .schedule_item input[type="radio"] + label::before,
.autoservDest .schedule_item input[type="radio"] + label::after {
    display: none !important;
    content: none !important;
}

/* Скрываем сам кружок input */
.autoservDest .schedule_item input[type="radio"] {
    display: none !important;
}

/* Стилизуем текст времени под идеальную кнопку */
.autoservDest .schedule_item input[type="radio"] + label {
    display: block !important;
    padding: 12px 5px !important;
    margin: 0 !important;
    background: #ffffff !important;
    border: 1px solid #dcdcdc !important;
    border-radius: 8px !important;
    text-align: center !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    color: #333 !important;
    box-sizing: border-box !important;
    transition: all 0.2s !important;
}
.autoservDest .schedule_item input[type="radio"] + label:hover {
    border-color: #ff6700 !important;
    color: #ff6700 !important;
}
.autoservDest .schedule_item input[type="radio"]:checked + label {
    background: #ff6700 !important;
    color: #fff !important;
    border-color: #ff6700 !important;
    box-shadow: 0 4px 10px rgba(255, 103, 0, 0.3) !important;
}
.autoservDest .schedule_item input[type="radio"]:disabled + label,
.autoservDest .schedule_item label.redlabel {
    background: #fde8e8 !important;
    border: 1px solid #e74c3c !important;
    color: #c0392b !important;
    text-decoration: line-through !important;
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

/* Адаптивность для ПК */
@media screen and (min-width: 939px) {
    .rightText { margin: 0 15px 0 calc(50% + 30px); }
    .welcome__slider-wrap.welcome__slider-wrap2 { width: 50%; float: left; }
    .form_cont { display: flex; }
    .el1 { width: 40%; }
    .el2 { width: 60%; margin-top: 0px; }
    .form_cont .type-button.type-button_type_icon { justify-content: center; display: flex; }
    .form_cont .type-button.type-button_type_icon button#autoservSend { width: 200px; }
    .sliderWr { margin-bottom: 20px; }
    .map .contFl { display: flex; }
    .map__wrap.map_autoserv { margin-top: 0px; width: 60%; height: 300px; min-height: 300px; }
    .autoFormEnd .page-title { margin: 100px 0; }
    .autoservFormWr2 { display: flex; }	
    .autoservFormWr2 .autoservForm { width: 40%; }
    .postOrderWr { margin-top: 0px; width: 60%; }	
}

/* Адаптивность для кнопок времени на мобильных (3 в ряд) */
@media screen and (max-width: 768px) {
    .autoservDest .schedule_item > div {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}