.td-popup {
    position: fixed;
    inset: 0;
    z-index: 99993;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    padding: 24px;
    background: rgba(0,0,0,.62);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity .2s ease,visibility .2s ease
}

    .td-popup.is-open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto
    }

.td-popup__dialog {
    position: relative;
    width: 302px;
    height: 494px;
    max-width: 100%;
    max-height: calc(100vh - 24px);
    overflow: auto;
    background: #fff;
    display: flex
}

.td-popup__image {
    display: none
}

.td-popup__form {
    width: 100%;
    padding: 15px 22px;
    display: flex;
    flex-direction: column;
    gap: 6px
}

    .td-popup__form h2 {
        text-align: center;
        font-size: 19px;
        margin: 0 0 2px
    }

.td-popup__vehicle {
    display: none
}

.td-popup__form label {
    display: block;
    position: relative
}

.td-popup__form select, .td-popup__form input:not([type=checkbox]) {
    width: 100%;
    height: 40px;
    border: 1px solid #d6d6d6;
    border-radius: 8px;
    padding: 0 11px;
    background: #fff;
    font-family: 'Toyota Type',Arial,sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #333
}

.td-popup__form select {
    padding-right: 32px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none
}

.td-popup__form select.td-popup__select--placeholder,
.td-popup__form select.td-popup__select--placeholder:focus,
.td-popup__form select.td-popup__select--placeholder:focus-visible {
    color: #b8b8b8;
    -webkit-text-fill-color: #b8b8b8;
}

    .td-popup__form select option {
        font-family: 'Toyota Type',Arial,sans-serif;
        font-size: 13px;
        font-weight: 400;
        color: #333
    }

    .td-popup__form select option:disabled {
        color: #b8b8b8
    }

.td-popup__select::after {
    content: "";
    position: absolute;
    right: 14px;
    top: 50%;
    width: 7px;
    height: 7px;
    border-right: 1.5px solid #555;
    border-bottom: 1.5px solid #555;
    transform: translateY(-65%) rotate(45deg);
    pointer-events: none
}

.td-popup__form input::placeholder {
    font-family: 'Toyota Type',Arial,sans-serif;
    color: #b8b8b8;
    opacity: 1
}

.td-popup__form select:focus,
.td-popup__form select:focus-visible {
    color: #333;
    -webkit-text-fill-color: #333;
    border-color: #d6d6d6;
    outline: none;
    box-shadow: none;
}

.td-popup__check {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.45
}

    .td-popup__check input {
        margin-top: 3px;
        flex: 0 0 auto
    }

    .td-popup__check a {
        color: #23658b
    }

.td-popup__submit {
    height: 42px;
    border: 0;
    background: #eb0a1e;
    color: #fff;
    font-weight: 700;
    font-size: 13px
}

.td-popup__submit-loading { display:none; align-items:center; justify-content:center; gap:8px; }
.td-popup__submit.is-loading .td-popup__submit-loading { display:flex; }
.td-popup__submit.is-loading [data-td-submit-label] { display:none; }
.td-popup__spinner { width:16px; height:16px; border:2px solid rgba(255,255,255,.45); border-top-color:#fff; border-radius:50%; animation:td-popup-spin .7s linear infinite; }
@keyframes td-popup-spin { to { transform:rotate(360deg); } }

    .td-popup__submit:disabled {
        opacity: .6
    }

.td-popup__close {
    position: absolute;
    right: 10px;
    top: 10px;
    border: 1px solid #eb0a1e;
    background: transparent;
    border-radius: 50%;
    color: #000;
    font-size: 20px;
    line-height: 1;
    width: 28px;
    height: 28px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: Arial, sans-serif;
    box-sizing: border-box;
    z-index: 1
}

.td-popup__error {
    color: #c00;
    font-size: 13px;
    margin: 0
}
.td-popup__form { position:relative; }
.td-popup__success { display:none; position:absolute; top:50%; left:28px; right:28px; transform:translateY(-50%); align-items:center; justify-content:center; gap:12px; color:#16803c; font-size:16px; font-weight:600; margin:0; text-align:center; }
.td-popup__success-icon { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex:0 0 44px; border:2px solid #16803c; border-radius:50%; color:#16803c; font-size:28px; line-height:1; }
.td-popup.is-success .td-popup__step, .td-popup.is-success .td-popup__dots { visibility:hidden; }
.td-popup.is-success .td-popup__success { display:flex; }

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0
}

body.td-popup-open {
    overflow: hidden
}

.td-popup__step {
    display: flex;
    flex-direction: column;
    gap: 6px
}

.td-popup__dots {
    display: none
}

@media(min-width:768px) {
    .td-popup {
        padding: 24px 100px 24px 24px;
    }

    .td-popup__step {
        display: contents
    }

    .td-popup__field--province {
        order: 1
    }

    .td-popup__field--dealer {
        order: 2
    }

    .td-popup__field--name {
        order: 3
    }

    .td-popup__field--phone {
        order: 4
    }

    .td-popup__field--planning {
        order: 5
    }

    .td-popup__field--consent {
        order: 6
    }

    .td-popup__field--policy {
        order: 7
    }

    .td-popup__submit {
        order: 8
    }

    .td-popup__error {
        order: 9
    }
}

@media(max-width:767px) {
    .td-popup {
        padding: 12px;
        align-items: center;
        justify-content: center
    }

    .td-popup__dialog {
        width: 290px;
        height: auto;
        max-width: calc(100vw - 24px);
        max-height: calc(100vh - 24px)
    }

    .td-popup__form {
        padding: 30px 22px 19px;
        gap: 6px
    }

        .td-popup__form h2 {
            font-size: 18px
        }

        .td-popup__form select, .td-popup__form input:not([type=checkbox]) {
            height: 40px;
            font-size: 13px;
            padding-left: 11px;
            padding-right: 30px
        }

    .td-popup__step {
        display: none
    }

        .td-popup__step.td-popup__step--active {
            display: flex
        }

        .td-popup__dots {
        display: flex;
        justify-content: center;
        align-items: center;
            gap: 6px;
            margin-top: 3px
    }

        .td-popup__dots button {
            width: 6px;
            height: 6px;
            padding: 0;
            border: 0;
            border-radius: 50%;
            background: #d7d7d7
        }

            .td-popup__dots button.is-active {
                background: #df1f2d
            }

    .td-popup__submit {
        height: 35px;
        font-size: 13px
    }

    .td-popup__check {
        font-size: 10px;
        line-height: 1.4
    }

        .td-popup__check input {
            width: 20px;
            height: 20px;
            margin: 0
        }

    .td-popup__error {
        margin: 0
    }
}

.td-popup__check {
    gap: 6px
}

    .td-popup__check input[type=checkbox] {
        position: static !important;
        left: auto !important;
        opacity: 1 !important;
        width: 13px !important;
        height: 13px !important;
        margin: 0 8px 0 0 !important;
        flex: 0 0 13px
    }

.td-popup__field--policy {
    margin-top: -4px
}