.elementor-kit-7{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ============================================
   PRE-CHECKOUT UROTESTOM ESTILO PERFECTPAY
   Escopo: #checkout33
============================================ */

/* Reset leve só dentro do bloco */
#checkout33, 
#checkout33 * {
    box-sizing: border-box;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Fundo geral cinza claro tipo PerfectPay */
#checkout33 {
    background: #f5f5f5;
    padding: 16px 0 32px;
}

/* Limita tudo ao centro, tipo coluna do PerfectPay */
#checkout33 .header,
#checkout33 .top-image-container,
#checkout33 .container,
#checkout33 .security-footer {
    max-width: 480px;
    margin: 0 auto;
}

/* HEADER – deixa clean, branco, com borda embaixo */
#checkout33 .header {
    background: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    padding: 12px 16px;
    box-shadow: none;
}

#checkout33 .header-content {
    display: flex;
    align-items: center;
    gap: 10px;
}

#checkout33 .header-logo {
    width: 40px;
    height: 40px;
    border-radius: 4px;
    object-fit: contain;
}

#checkout33 .header-icon {
    width: 20px;
    height: 20px;
    color: #9ca3af;
}

#checkout33 .header-title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #111827;
    margin: 0;
}

#checkout33 .header-subtitle {
    font-size: 0.8rem;
    color: #6b7280;
    margin: 0;
}

/* IMAGEM DO PRODUTO – card único com sombra leve */
#checkout33 .top-image-container {
    background: transparent;
    padding: 12px 0 0;
    margin-bottom: 12px;
}

#checkout33 .top-image {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 6px 15px rgba(15, 23, 42, 0.12);
    display: block;
}

/* CONTAINER PRINCIPAL – só uma coluna (form + resumo) */
#checkout33 .container {
    padding: 0 16px;
}

#checkout33 .grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* Cards padrão PerfectPay */
#checkout33 .address-form,
#checkout33 .product-summary {
    background: #ffffff;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.06);
    padding: 16px 16px 18px;
}

/* Ordem: primeiro form, depois resumo, igual senso lógico */
#checkout33 .address-form {
    order: 1;
}
#checkout33 .product-summary {
    order: 2;
}

/* Títulos dos cards */
#checkout33 .summary-title,
#checkout33 .form-header h2 {
    font-size: 0.9rem;
    font-weight: 600;
    color: #545454;
    margin: 0 0 12px;
}

/* Cabeçalho do formulário */
#checkout33 .form-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
}

#checkout33 .form-header .icon {
    width: 20px;
    height: 20px;
    color: #10b981;
}

/* Resumo do produto */
#checkout33 .product-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    background: #f3f4f6;
    border-radius: 8px;
    margin-bottom: 10px;
}

#checkout33 .product-icon {
    width: 40px;
    height: 40px;
    border-radius: 6px;
    background: #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
}

#checkout33 .product-info h3 {
    font-size: 0.9rem;
    font-weight: 600;
    color: #111827;
    margin: 0 0 2px;
}

#checkout33 .product-info p {
    font-size: 0.75rem;
    color: #6b7280;
    margin: 0;
}

/* Total */
#checkout33 .total-section {
    border-top: 1px solid #e5e7eb;
    margin-top: 10px;
    padding-top: 10px;
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
    font-weight: 600;
    color: #111827;
}

#checkout33 .total-price {
    color: #16a34a;
}

/* Badge de frete */
#checkout33 .free-shipping {
    margin-top: 10px;
    padding: 8px 10px;
    background: #ecfdf3;
    border-radius: 6px;
    border: 1px solid #bbf7d0;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
    color: #15803d;
}

#checkout33 .check-icon {
    width: 14px;
    height: 14px;
}

/* Labels e inputs estilo PerfectPay */
#checkout33 .form-group {
    margin-bottom: 10px;
}

#checkout33 .form-label {
    display: block;
    font-size: 12.8px;
    font-weight: 500;
    color: #545454;
    margin-bottom: 4px;
}

#checkout33 .form-input {
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 15px;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#checkout33 .form-input:focus {
    border-color: #22c55e;
    box-shadow: 0 0 0 13px rgba(34, 197, 94, 0.25);
}

#checkout33 .form-input.error {
    border-color: #ef4444;
}

/* Grid dos campos */
#checkout33 .form-row {
    display: grid;
    gap: 8px;
}

@media (min-width: 480px) {
    #checkout33 .form-row-2 {
        grid-template-columns: 2fr 1fr;
    }
    #checkout33 .form-row-equal {
        grid-template-columns: 1fr 1fr;
    }
}

/* Mensagem de erro */
#checkout33 .error-message {
    margin-top: 2px;
    font-size: 0.7rem;
}

/* Spinner CEP */
#checkout33 .input-container {
    position: relative;
}

#checkout33 .loading-spinner {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    border-width: 2px;
}

/* Botão estilo PerfectPay */
#checkout33 .checkout-button {
    width: 100%;
    margin-top: 12px;
    border-radius: 4px;
    padding: 10px 12px;
    border: none;
    font-size: 0.95rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease;
}

#checkout33 .checkout-button .icon {
    width: 18px;
    height: 18px;
}

/* Estado ativo (enabled) = botão verde PerfectPay */
#checkout33 .checkout-button.enabled {
    background: #34c759;
    color: #ffffff;
    box-shadow: 0 6px 12px rgba(34, 197, 94, 0.35);
}

#checkout33 .checkout-button.enabled:hover {
    background: #2fa44c;
    transform: translateY(-1px);
}

/* Estado desabilitado */
#checkout33 .checkout-button.disabled {
    background: #e5e7eb;
    color: #9ca3af;
    box-shadow: none;
    cursor: not-allowed;
}

/* Ajuda abaixo do botão */
#checkout33 .form-help {
    font-size: 0.75rem;
    color: #6b7280;
    margin-top: 6px;
    text-align: center;
}

/* Rodapé de segurança */
#checkout33 .security-footer {
    background: transparent;
    border-top: none;
    padding: 16px 16px 0;
    margin-top: 8px;
}

#checkout33 .security-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
    font-size: 0.7rem;
    color: #6b7280;
}

#checkout33 .security-item {
    display: flex;
    align-items: center;
    gap: 4px;
}
/* ===== ABA PERFECTPAY – AJUSTE FINO ===== */

#checkout33 .pp-section-title {
    position: absolute;
    top: -25px;           /* meio pra dentro do card */
    left: 18px;
    display: flex;
    align-items: center;
    z-index: 30;
    font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* bolinha na frente, maior */
#checkout33 .pp-step-circle {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #b8b8b8;      /* cinza bem próximo do PP */
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.18);

    position: relative;
    z-index: 3;
}

/* faixa logo encostada na bolinha, mesma altura */
#checkout33 .pp-step-label {
    background: #d5d5d5;
    color: #ffff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.03em;

    height: 30px;              /* mesma altura da bolinha */
    padding: 0 18px 0 46px;    /* mais compacta */
    border-radius: 17px;

    display: flex;
    align-items: center;

    position: relative;
    z-index: 2;

    margin-left: -28px;         /* encosta na bolinha sem passar por cima */
    box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

/* card ajustado pra encaixar a aba certinho */
#checkout33 .address-form {
    position: relative;
    margin-top: 28px;
    padding-top: 35px;         /* espaço pra aba não “bater” no conteúdo */
    border-radius: 10px;
}/* End custom CSS */