/* Passo 2: escolha "Com placa" / "Sem placa" */

#modoPlaca {
    display: flex;
    gap: 6px;
    margin-top: 6px;
    padding: 5px;
    background: #eef3ea;
    border-radius: 16px;
}

#modoPlaca button {
    appearance: none;
    flex: 1;
    font-family: inherit;
    padding: 12px 10px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    font-size: 14px;
    font-weight: 800;
    color: #4b5563;
    cursor: pointer;
    transition: background .15s, color .15s, box-shadow .15s;
}

#modoPlaca button.on {
    background: #fff;
    color: #007A2F;
    box-shadow: 0 2px 8px rgba(6, 64, 43, .12);
}

/* sem placa: o campo da placa, o tipo do veículo e o atalho "informar manualmente" não aparecem */
#screen2.sem-placa .mini-card:has(#placa),
#screen2.sem-placa #tipoVeiculoRuaGroup,
#screen2.sem-placa #veiculoCard,
#screen2 .link-manual { display: none !important; }

@media (min-width: 768px) {
    #screen2 #modoPlaca { order: 0; grid-column: 1 / -1; }
    #screen2.sem-placa .content-wrapper > .mini-card:has(#cep) { grid-column: 1 / -1; }
}

/* confirmação da versão (consulta pela placa) */
.versoes-provaveis {
    margin-top: 12px;
    padding: 14px 16px;
    border: 1.5px solid #f1d58a;
    background: #fff9e8;
    border-radius: 16px;
}

.versoes-provaveis strong { display: block; font-size: 14px; color: #6b4a00; }
.versoes-provaveis small { display: block; margin-top: 3px; font-size: 12px; color: #7a6a3a; line-height: 1.4; }
.versoes-provaveis .vp-lista { display: grid; gap: 8px; margin-top: 10px; }

.versoes-provaveis .vp-opcao {
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    text-align: left;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    color: #374151;
    background: #fff;
    border: 1.5px solid #e5dcc0;
    border-radius: 12px;
    padding: 11px 13px;
    cursor: pointer;
}

.versoes-provaveis .vp-opcao em {
    flex: none;
    font-style: normal;
    font-size: 10px;
    font-weight: 800;
    color: #06402B;
    background: #AAF45A;
    border-radius: 999px;
    padding: 3px 8px;
}

.versoes-provaveis .vp-opcao.on { background: #007A2F; border-color: #007A2F; color: #fff; }
.versoes-provaveis .vp-opcao.on em { background: #fff; }

@media (min-width: 768px) {
    #screen2 .content-wrapper > .versoes-provaveis { order: 5; }
}