/* Carstop hinnapäringu vorm ja registreerimisnumbri otsing. */

:root {
    --cs-pf-navy: var(--cs-navy);
    --cs-pf-yellow: var(--cs-yellow);
    --cs-pf-border: var(--cs-border);
    --cs-pf-muted: var(--cs-muted-ink);
    --cs-pf-error: var(--cs-error);
    --cs-pf-success: var(--cs-success);
}

/* --- Registreerimisnumbri otsing ------------------------------------- */

.cs-plate-lookup {
    width: 100%;
}

.cs-plate-lookup__label {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 1rem;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--cs-ink);
}

.cs-plate-lookup__row {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

/* EST-märk ja sisend on üks tervik, nagu Eesti numbrimärgil. */
.cs-plate-lookup__group {
    display: flex;
    flex: 1 1 14rem;
    min-width: 0;
    align-items: stretch;
    background: #fff;
    border: 1px solid var(--cs-pf-border);
    border-radius: 0.25rem;
    overflow: hidden;
    transition: border-color 0.2s ease;
}

.cs-plate-lookup__group:focus-within {
    border-color: var(--cs-pf-navy);
}

.cs-plate-lookup__badge {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    padding: 0.3rem 0.55rem;
    background: var(--cs-pf-navy);
    color: var(--cs-surface);
}

.cs-plate-lookup__badge-icon {
    width: 12px;
    height: 12px;
    fill: currentColor;
}

.cs-plate-lookup__badge-text {
    font-size: 0.625rem;
    line-height: 1;
    letter-spacing: 0.02em;
}

.cs-plate-lookup__input {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0.875rem 1.25rem;
    font-size: 1rem;
    font-family: inherit;
    color: var(--cs-ink);
    background: transparent;
    border: none;
    text-transform: uppercase;
}

.cs-plate-lookup__input:focus {
    outline: none;
}

.cs-plate-lookup__btn {
    flex: 0 0 auto;
    padding: 0.875rem 1.75rem;
    font-size: 0.95rem;
    font-weight: 600;
    font-family: inherit;
    color: var(--cs-ink);
    background: var(--cs-pf-yellow);
    border: none;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: filter 0.2s ease;
}

.cs-plate-lookup__btn:hover:not(:disabled) {
    filter: brightness(0.94);
}

.cs-plate-lookup__btn:disabled {
    opacity: 0.6;
    cursor: default;
}

.cs-plate-lookup__status {
    margin: 0.625rem 0 0;
    font-size: 0.875rem;
    min-height: 1.25rem;
    color: var(--cs-pf-muted);
}

.cs-plate-lookup__status--error {
    color: var(--cs-pf-error);
}

.cs-plate-lookup__status--success {
    color: var(--cs-pf-success);
}

/* --- Vorm ------------------------------------------------------------ */

.cs-price-form {
    width: 100%;
}

.cs-price-form__hp {
    position: absolute !important;
    left: -9999px !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Otsingukast + töökoja valik vormi alguses. */
.cs-price-form__lead {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin-bottom: 2rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid var(--cs-pf-border);
}

.cs-price-form__lead .cs-price-form__row {
    flex: 1 1 20rem;
}

/* Pealmise ploki read jagavad rea omavahel ära (flex-basis 20rem), mistõttu
   laial ekraanil mahuks kolmas väli kahe kõrvale. --break sunnib välja alati
   omaette täisreale - päringu sisu vajab kirjutamiseks kogu laiust. */
.cs-price-form__lead .cs-price-form__row--break {
    flex: 1 1 100%;
}

.cs-price-form__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
}

.cs-price-form__row {
    display: flex;
    flex-direction: column;
}

.cs-price-form__row--full {
    flex: 1 1 100%;
}

.cs-price-form__row--half {
    flex: 1 1 calc(50% - 0.625rem);
    min-width: 12rem;
}

.cs-price-form__label {
    margin-bottom: 0.5rem;
    font-size: 0.95rem;
    font-weight: 500;
    color: var(--cs-ink);
}

.cs-price-form__label--required::after {
    content: " *";
    color: var(--cs-pf-error);
}

.cs-price-form__label--upper {
    font-size: 1rem;
    text-transform: uppercase;
}

.cs-price-form__input {
    width: 100%;
    padding: 0.875rem 1.25rem;
    font-size: 1rem;
    font-family: inherit;
    color: var(--cs-ink);
    background: #fff;
    border: 1px solid var(--cs-pf-border);
    border-radius: 0.25rem;
    transition: border-color 0.2s ease;
}

.cs-price-form__input:focus {
    outline: none;
    border-color: var(--cs-pf-navy);
}

.cs-price-form__input--error {
    border-color: var(--cs-pf-error);
}

.cs-price-form__input--filled {
    background: #fffdf5;
}

select.cs-price-form__input {
    cursor: pointer;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1.25rem;
    padding-right: 3rem;
}

textarea.cs-price-form__input {
    resize: vertical;
    min-height: 7rem;
}

.cs-price-form__error {
    margin: 0.375rem 0 0;
    font-size: 0.8125rem;
    color: var(--cs-pf-error);
    min-height: 1rem;
}

.cs-price-form__heading {
    margin: 2.5rem 0 1.25rem;
    font-size: 1.25rem;
    color: var(--cs-ink);
}

.cs-price-form__footer {
    margin-top: 2rem;
}

.cs-price-form__submit {
    padding: 1rem 2.5rem;
    font-size: 1rem;
    font-weight: 600;
    font-family: inherit;
    color: var(--cs-ink);
    background: var(--cs-pf-yellow);
    border: none;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: filter 0.2s ease;
}

.cs-price-form__submit:hover:not(:disabled) {
    filter: brightness(0.94);
}

.cs-price-form__submit:disabled {
    opacity: 0.6;
    cursor: default;
}

.cs-price-form__message {
    margin: 1rem 0 0;
    font-size: 0.95rem;
    min-height: 1.25rem;
}

.cs-price-form__message--error {
    color: var(--cs-pf-error);
}

.cs-price-form__message--success {
    color: var(--cs-pf-success);
    font-weight: 600;
}

/* Töökoja rippmenüü veaseis - menüü võib olla vormist väljas. */
.cs-select-wrapper--error .cs-select-trigger {
    border-color: var(--cs-pf-error);
}

/* Vormisisene rippmenüü peab täislaiust täitma. */
.cs-price-form .cs-select-wrapper {
    width: 100%;
}

@media (max-width: 600px) {
    .cs-price-form__row--half {
        flex: 1 1 100%;
    }

    .cs-plate-lookup__btn {
        flex: 1 1 100%;
    }
}

/* --- Sõiduki otsingu tulemus (kokkuvõte + ülevaatus + värskendus) ----- */

.cs-plate-lookup__result {
    margin-top: 0.875rem;
}

.cs-plate-lookup__result[hidden] {
    display: none;
}

.cs-plate-lookup__summary {
    margin: 0 0 0.5rem;
    font-size: 0.95rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--cs-ink);
}

.cs-plate-lookup__inspection {
    display: none;
}

.cs-plate-lookup__inspection.is-visible {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin: 0 0 0.75rem;
    padding: 0.625rem 0.875rem;
    background: #fff;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    line-height: 1.35;
    color: var(--cs-ink);
}

.cs-plate-lookup__inspection.is-visible::before {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75rem;
    height: 1.75rem;
    margin: -0.625rem 0 -0.625rem -0.875rem;
    align-self: stretch;
    height: auto;
    color: #fff;
    font-weight: 700;
    border-radius: 0.25rem 0 0 0.25rem;
}

.cs-plate-lookup__inspection--ok.is-visible::before {
    content: "✓";
    background: var(--cs-pf-success);
}

.cs-plate-lookup__inspection--expired.is-visible::before {
    content: "✕";
    background: var(--cs-pf-error);
}

.cs-plate-lookup__refresh {
    padding: 0.5rem 1.125rem;
    font-size: 0.8125rem;
    font-weight: 700;
    font-family: inherit;
    text-transform: uppercase;
    color: #fff;
    background: var(--cs-pf-navy);
    border: none;
    border-radius: 0.25rem;
    cursor: pointer;
    transition: filter 0.2s ease;
}

.cs-plate-lookup__refresh:hover:not(:disabled) {
    filter: brightness(1.25);
}

.cs-plate-lookup__refresh:disabled {
    opacity: 0.6;
    cursor: default;
}

.cs-plate-lookup__refresh[hidden] {
    display: none;
}

/* --- "Sisesta andmed käsitsi" lahtikäiv plokk ------------------------- */

.cs-price-form__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    margin: 0 0 1.25rem;
    padding: 1.125rem 0;
    background: none;
    border: none;
    border-bottom: 1px solid var(--cs-pf-border);
    font-family: inherit;
    text-align: left;
    cursor: pointer;
}

.cs-price-form__toggle-text {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.cs-price-form__toggle-title {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--cs-ink);
}

.cs-price-form__toggle-hint {
    font-size: 0.875rem;
    color: var(--cs-pf-muted);
}

.cs-price-form__toggle-chevron {
    flex: 0 0 auto;
    width: 1.75rem;
    height: 1.75rem;
    color: var(--cs-ink);
    transition: transform 0.25s ease;
}

.cs-price-form__toggle[aria-expanded="true"] .cs-price-form__toggle-chevron {
    transform: rotate(180deg);
}

.cs-price-form__vehicle[hidden] {
    display: none;
}

.cs-price-form__vehicle {
    margin-bottom: 0.5rem;
}

@media (max-width: 600px) {
    .cs-price-form__toggle-title {
        font-size: 1.25rem;
    }
}

/* Uudiskirja nõusolek: Jah/Ei raadionupud + viide andmekaitsetingimustele. */
.cs-price-form__radios {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.cs-price-form__radio {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    font-size: 1rem;
    color: var(--cs-ink);
    background: #fff;
    border: 1px solid var(--cs-pf-border);
    border-radius: 0.25rem;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease;
}

.cs-price-form__radio:hover {
    border-color: var(--cs-pf-navy);
}

.cs-price-form__radio input[type="radio"] {
    width: 1.125rem;
    height: 1.125rem;
    margin: 0;
    accent-color: var(--cs-pf-navy);
    cursor: pointer;
}

/* Valitud vastus on selgelt näha, mitte ainult täpi järgi. */
.cs-price-form__radio:has(input[type="radio"]:checked) {
    border-color: var(--cs-pf-navy);
    background: #fffdf5;
    font-weight: 600;
}

.cs-price-form__radio:focus-within {
    outline: 2px solid var(--cs-pf-yellow);
    outline-offset: 2px;
}

.cs-price-form__note {
    margin: 0.625rem 0 0;
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--cs-pf-muted);
}

.cs-price-form__note-link {
    color: var(--cs-ink);
    text-decoration: underline;
}

.cs-price-form__note-link:hover {
    color: var(--cs-ink);
    text-decoration: none;
}

/* --- Kokkupandav vorm teenuse lehel ([carstop_price_form toggle="1"]) ---
   Lüliti on Breakdance'i nupp klassiga .cs-pf-trigger (vt price-form.js). */

.cs-price-form-collapse {
    width: 100%;
    scroll-margin-top: 6rem; /* kleepuva päise alt välja */
}

/* Pealkiri on ise lüliti: h3 > button, et klaviatuur ja ekraanilugeja saaksid
   sellest aru. Rida: navy ring kollase asukohanõelaga · pealkiri + vihje ·
   ümar noolenupp (hover = kollane). Avatuna eraldab rea vormist joon. */
.cs-price-form__title {
    margin: 0;
}

.cs-price-form__title-btn {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    width: 100%;
    margin: 0;
    padding: 0.25rem 0;
    background: none;
    border: none;
    font: inherit;
    text-align: left;
    color: var(--cs-ink);
    cursor: pointer;
}

.cs-price-form__title.is-open .cs-price-form__title-btn {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--cs-border);
}

.cs-price-form__title-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 50%;
    background: var(--cs-navy);
    box-shadow: 0 0 0 4px var(--cs-navy-tint, #ECEDF4);
}

.cs-price-form__title-pin {
    width: 1.625rem;
    height: 1.625rem;
}

.cs-price-form__title-body {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    flex: 1 1 auto;
    min-width: 0;
}

.cs-price-form__title-text {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.2;
    text-transform: uppercase;
    transition: color 0.2s ease;
}

.cs-price-form__title-hint {
    font-size: 0.9375rem;
    font-weight: 400;
    line-height: 1.45;
    color: var(--cs-muted-ink);
}

.cs-price-form__title-chevron-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 50%;
    border: 1px solid var(--cs-border);
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.cs-price-form__title-chevron {
    width: 1.25rem;
    height: 1.25rem;
    color: var(--cs-ink);
    transition: transform 0.25s ease;
}

.cs-price-form__title-btn:hover .cs-price-form__title-text {
    color: var(--cs-navy);
}

.cs-price-form__title-btn:hover .cs-price-form__title-chevron-wrap,
.cs-price-form__title-btn:focus-visible .cs-price-form__title-chevron-wrap {
    background: var(--cs-yellow);
    border-color: var(--cs-yellow);
}

.cs-price-form__title-btn:focus-visible {
    outline: 2px solid var(--cs-navy);
    outline-offset: 6px;
    border-radius: 0.25rem;
}

.cs-price-form__title-btn[aria-expanded="true"] .cs-price-form__title-chevron {
    transform: rotate(180deg);
}

.cs-price-form-collapse__panel {
    margin-top: 1.5rem;
}

@media (max-width: 600px) {
    .cs-price-form__title-btn {
        gap: 0.875rem;
    }
    .cs-price-form__title-icon {
        width: 2.75rem;
        height: 2.75rem;
    }
    .cs-price-form__title-pin {
        width: 1.375rem;
        height: 1.375rem;
    }
    .cs-price-form__title-text {
        font-size: 1.0625rem;
    }
    .cs-price-form__title-hint {
        font-size: 0.875rem;
    }
    .cs-price-form__title-chevron-wrap {
        width: 2.25rem;
        height: 2.25rem;
    }
}