/* ==========================================================================
   MELHORIAS CSS COMPLEMENTARES
   Apenas adições/melhorias - sem sobrescrever estilos originais
   ========================================================================== */

/* Melhorias de acessibilidade - foco visível */
.cep-field input:focus,
.cep-field textarea:focus,
.cep-field select:focus {
    outline: 2px solid var(--cep-icon-color, #FFCC03);
    outline-offset: 2px;
}

/* Loading spinner */
@keyframes cepSpin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.cep-btn-loader {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: cepSpin 0.6s linear infinite;
    margin-right: 8px;
    vertical-align: middle;
}

/* ==========================================================================
   PREVIEW DE ENDEREÇO - APENAS TEXTO, SEM FUNDO
   ========================================================================== */

.cep-endereco-preview {
    margin-top: 8px;
    padding: 8px 0;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.cep-endereco-preview.success,
.cep-endereco-preview.loading,
.cep-endereco-preview.error {
    background: transparent !important;
    border: none !important;
}

.cep-preview-success {
    color: #2ecc71 !important;
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 6px;
    background: transparent !important;
    padding: 0 !important;
}

.cep-preview-success span {
    color: #2ecc71;
}

.cep-preview-error {
    color: #e74c3c !important;
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 6px;
    background: transparent !important;
    padding: 0 !important;
}

.cep-preview-loading {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 6px;
    background: transparent !important;
    padding: 0 !important;
}

.cep-loading-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.2);
    border-top-color: var(--cep-icon-color, #FFCC03);
    border-radius: 50%;
    animation: cepSpin 0.6s linear infinite;
}

/* ==========================================================================
   LINK "NÃO SABE O CEP?"
   ========================================================================== */

.cep-help-link-wrapper {
    margin-top: 8px;
    text-align: left;
}

.cep-help-link {
    color: #FFE680;
    font-size: 13px;
    text-decoration: none;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 0.2s ease;
    border-bottom: 1px dashed rgba(255, 230, 128, 0.4);
    padding-bottom: 2px;
}

.cep-help-link:hover {
    color: var(--cep-icon-color, #FFCC03);
    border-bottom-color: var(--cep-icon-color, #FFCC03);
}

.cep-help-link::before {
    content: "?";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    background: rgba(255, 230, 128, 0.15);
    border-radius: 50%;
    font-size: 11px;
    font-weight: 700;
}

/* ==========================================================================
   NAVEGAÇÃO ENTRE STEPS
   ========================================================================== */

/* Esconde botão continuar no último step */
.cep-step-navigation.last-step .cep-next-step {
    display: none !important;
}

/* Ajuste do botão voltar quando sozinho */
.cep-step-navigation.last-step {
    justify-content: flex-start;
}

/* Esconde botão voltar no primeiro step */
.cep-step-navigation.first-step .cep-prev-step {
    visibility: hidden;
}

/* ==========================================================================
   RESPONSIVIDADE
   ========================================================================== */

@media (max-width: 768px) {
    .cep-popup {
        padding: 30px 20px;
    }

    .titulo-form {
        font-size: 1.8rem !important;
    }

    .cep-grid {
        grid-template-columns: 1fr !important;
    }

    .cep-grid-combo {
        grid-template-columns: 1fr !important;
    }

    .cep-steps {
        gap: 8px;
    }

    .cep-step span {
        font-size: 11px;
    }

    .cep-step-line {
        width: 40px;
    }
}

/* Print styles */
@media print {
    .cep-open-popup,
    .cep-popup-overlay {
        display: none !important;
    }
}

/* Animação shake para erros */
@keyframes cepShake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

.cep-field.invalid input,
.cep-field.invalid textarea {
    animation: cepShake 0.3s ease-in-out;
}

/* Acessibilidade - reduced motion */
@media (prefers-reduced-motion: reduce) {
    .cep-popup,
    .cep-step-number,
    .cep-progress-bar,
    .cep-btn-loader,
    .cep-loading-spinner {
        animation: none !important;
        transition: none !important;
    }
}

/* ============================================================================
   SVG customizável + submit bloqueado até formulário completo
   ============================================================================ */
.cep-svg-icon {
    display: inline-block;
    width: 28px;
    height: 28px;
    margin-right: 12px;
    flex: 0 0 28px;
    background-color: var(--cep-icon-color, #FFCC03);
    -webkit-mask-image: var(--cep-icon-url);
    mask-image: var(--cep-icon-url);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.icone-form.cep-svg-icon {
    filter: none !important;
}

.cep-submit:disabled,
.cep-submit.disabled {
    opacity: .48 !important;
    cursor: not-allowed !important;
    transform: none !important;
    box-shadow: none !important;
    filter: grayscale(.25);
}

.cep-submit:disabled:hover,
.cep-submit.disabled:hover {
    transform: none !important;
    box-shadow: none !important;
}


/* v4.3.5 - Ícones SVG de serviços e ajuste visual */
.cep-service-grid{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important;align-items:stretch!important}.cep-service-card{min-height:72px!important;padding:9px 6px!important;gap:5px!important;border-radius:14px!important}.cep-service-icon{width:28px!important;height:28px!important;margin:0 auto 4px!important;color:var(--cep-service-icon-color,#fff)!important;display:flex!important;align-items:center!important;justify-content:center!important}.cep-service-icon svg{width:24px!important;height:24px!important;display:block!important;fill:currentColor!important;color:currentColor!important}.cep-service-icon img{width:24px!important;height:24px!important;object-fit:contain!important;filter:brightness(0) invert(1)!important}.cep-service-name{font-size:11px!important;line-height:1.12!important;font-weight:700!important}.icone-form{filter:brightness(0) invert(1)!important}.cep-popup{max-height:calc(100dvh - 24px)!important;overflow-y:auto!important}.cep-form-step[data-step="3"] .cep-box{padding-bottom:10px!important}.cep-form-step[data-step="3"] textarea{min-height:68px!important;max-height:92px!important}.cep-form-step[data-step="3"] .cep-grid{gap:10px!important}
@media(max-width:760px){.cep-service-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.cep-service-card{min-height:70px!important}.cep-popup{max-height:calc(100dvh - 16px)!important}}
@media(max-width:420px){.cep-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* CEP 4.3.12 - ícones de serviço com cor por serviço */
.cep-service-icon{
    color:var(--cep-service-card-icon-color,var(--cep-service-icon-color,#fff))!important;
}
.cep-service-icon svg,
.cep-service-icon svg *:not([fill="none"]){
    fill:currentColor!important;
    color:currentColor!important;
}
.cep-service-icon svg *:not([stroke="none"]){
    stroke:currentColor!important;
}
.cep-service-icon-mask{
    width:24px!important;
    height:24px!important;
    display:block!important;
    background-color:currentColor!important;
    -webkit-mask:var(--cep-service-mask-url) center/contain no-repeat!important;
    mask:var(--cep-service-mask-url) center/contain no-repeat!important;
}
.cep-service-icon img.cep-service-svg-img{
    display:none!important;
}


/* CEP v4.3.16 - Correção do Step 3 e fluxo manual */
.cep-step-navigation:not(.last-step) .cep-next-step,
#cep-form-cotacao-pro:not(.is-last-step) .cep-step-navigation .cep-next-step{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
}

.cep-step-navigation.last-step .cep-next-step,
#cep-form-cotacao-pro.is-last-step .cep-step-navigation .cep-next-step{
    display:none!important;
}

.cep-field-lgpd,
.cep-submit,
.cep-trust{
    display:none!important;
}

.cep-popup.is-last-step .cep-field-lgpd,
#cep-form-cotacao-pro.is-last-step .cep-field-lgpd,
.cep-form-step[data-step="3"].active ~ .cep-step-navigation ~ .cep-field-lgpd{
    display:flex!important;
}

.cep-popup.is-last-step .cep-submit,
#cep-form-cotacao-pro.is-last-step .cep-submit,
.cep-form-step[data-step="3"].active ~ .cep-step-navigation ~ .cep-field-lgPD + .cep-submit,
.cep-form-step[data-step="3"].active ~ .cep-step-navigation ~ .cep-submit{
    display:flex!important;
    width:100%!important;
    align-items:center!important;
    justify-content:center!important;
}

.cep-popup.is-last-step .cep-trust,
#cep-form-cotacao-pro.is-last-step .cep-trust,
.cep-form-step[data-step="3"].active ~ .cep-step-navigation ~ .cep-trust{
    display:flex!important;
}

.cep-popup.is-last-step .cep-step-navigation,
#cep-form-cotacao-pro.is-last-step .cep-step-navigation{
    margin-bottom:12px!important;
}

@media (max-width: 640px){
    .cep-popup.is-last-step .cep-field-lgpd,
    #cep-form-cotacao-pro.is-last-step .cep-field-lgpd{
        align-items:flex-start!important;
        gap:10px!important;
        margin:12px 0!important;
        padding:10px 12px!important;
        border-radius:14px!important;
    }

    .cep-popup.is-last-step .cep-submit,
    #cep-form-cotacao-pro.is-last-step .cep-submit{
        min-height:50px!important;
        padding:12px 16px!important;
        font-size:14px!important;
    }
}


/* CEP v4.3.18 - otimização dos steps, navegação manual e mobile */
.cep-popup.is-step-2 .logo-form,
.cep-popup.is-step-2 .titulo-form,
.cep-popup.is-step-2 .cep-subtitulo,
.cep-popup.is-step-2 .cep-hero-info,
.cep-popup.is-step-3 .logo-form,
.cep-popup.is-step-3 .titulo-form,
.cep-popup.is-step-3 .cep-subtitulo,
.cep-popup.is-step-3 .cep-hero-info{
    display:none!important;
}

.cep-nav-icon{
    width:18px!important;
    height:18px!important;
    flex:0 0 auto!important;
}

.cep-prev-step,
.cep-next-step{
    gap:8px!important;
}

.cep-step-navigation.step-incomplete .cep-next-step,
.cep-next-step[hidden],
.cep-next-step:disabled{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
}

.cep-step-navigation.step-complete:not(.last-step) .cep-next-step{
    display:inline-flex!important;
    visibility:visible!important;
    pointer-events:auto!important;
}

.cep-step-navigation.last-step{
    margin-bottom:8px!important;
}

.cep-popup.is-step-3 .cep-step-navigation{
    justify-content:flex-start!important;
}

.cep-popup.is-step-3 .cep-step-navigation .cep-prev-step{
    width:auto!important;
}

.cep-popup.is-step-3 .cep-field-lgpd{
    margin-top:8px!important;
}

.cep-popup.is-step-3 .cep-submit{
    margin-top:10px!important;
}

@media(max-width:640px){
    .cep-popup.is-step-2,
    .cep-popup.is-step-3{
        padding-top:54px!important;
    }

    .cep-popup.is-step-2 .cep-steps,
    .cep-popup.is-step-3 .cep-steps{
        margin-bottom:10px!important;
    }

    .cep-step-navigation{
        gap:10px!important;
    }

    .cep-prev-step,
    .cep-next-step{
        min-height:48px!important;
        padding:0 14px!important;
    }

    .cep-step-navigation:not(.first-step):not(.last-step){
        grid-template-columns:auto 1fr!important;
    }

    .cep-step-navigation:not(.first-step):not(.last-step) .cep-prev-step{
        width:52px!important;
        min-width:52px!important;
        padding:0!important;
    }

    .cep-step-navigation:not(.first-step):not(.last-step) .cep-prev-step .cep-nav-label{
        display:none!important;
    }

    .cep-step-navigation.first-step .cep-next-step{
        width:100%!important;
    }

    .cep-step-navigation.last-step{
        display:flex!important;
        justify-content:flex-start!important;
        padding-bottom:8px!important;
    }

    .cep-step-navigation.last-step .cep-prev-step{
        width:52px!important;
        min-width:52px!important;
        padding:0!important;
    }

    .cep-step-navigation.last-step .cep-prev-step .cep-nav-label{
        display:none!important;
    }

    .cep-popup.is-step-3 .cep-field-lgpd{
        margin:8px 0!important;
        padding:10px 12px!important;
    }

    .cep-popup.is-step-3 .cep-submit{
        min-height:50px!important;
        padding:12px 14px!important;
    }
}
