/* ================= BASE ================= */
.form-label { font-size:0.85rem; margin-bottom:4px }
.form-control { padding:8px 10px; border-radius:8px }
.card { border-radius:16px }

/* ================= LOGO ================= */
.logo-wrapper {
    background: #F5F1E8;
    padding: 16px;
    text-align: center;
}

.logo-evento {
    display: block;
    margin: 0 auto;
    max-width: 260px;
    width: 100%;
    height: auto;
}

.logo-evento {
    max-width:260px;
    width:100%;
}

/* ================= PROGRESS ================= */
.progress-wrap {
    height:8px;
    background:#eee;
    border-radius:6px;
    overflow:hidden;
    margin-bottom:12px;
}
.progress-bar {
    height:100%;
    width:0%;
    background:linear-gradient(90deg,#2E7D32,#66BB6A);
    transition:width .4s ease;
}

/* ================= STEPS ================= */
.steps {
    display:flex;
    justify-content:space-between;
    margin-bottom:14px;
}
.step-ind {
    flex:1;
    text-align:center;
    font-size:.8rem;
    color:#999;
}
.step-ind span {
    width:26px;height:26px;line-height:26px;
    border-radius:50%;
    background:#ccc;color:#fff;
    display:inline-block;
}
.step-ind.active { color:#2E7D32;font-weight:600 }
.step-ind.active span { background:#2E7D32 }

/* ================= STEPS CONTENT ================= */
.step { display:none }
.step.active { display:block; animation:fade .25s ease }
@keyframes fade {
    from{opacity:0;transform:translateY(10px)}
    to{opacity:1;transform:translateY(0)}
}

#boxNaoAssociado {
    border-left: 4px solid #2E7D32;
    background: #f7fbf8;
}

/* ================= RESUMO ================= */
.resumo {
    border:1px solid #ddd;
    border-radius:10px;
    padding:10px 12px;
    margin-bottom:12px;
}
.resumo small { font-size:.75rem;color:#777 }

/* ================= LOADING ================= */
.loading {
    display:none;
    align-items:center;
    gap:8px;
    font-size:.85rem;
}
.spinner {
    width:18px;height:18px;
    border:3px solid #ddd;
    border-top-color:#2E7D32;
    border-radius:50%;
    animation:spin .8s linear infinite;
}
@keyframes spin { to{transform:rotate(360deg)} }

/* ================= MOBILE BAR ================= */
.mobile-bar { display:none }
@media(max-width:768px){
    .mobile-bar{
        display:flex;
        position:fixed;
        bottom:0;left:0;right:0;
        background:#fff;
        border-top:1px solid #ddd;
        padding:10px 12px;
        justify-content:space-between;
        align-items:center;
        z-index:9999;
    }
}
#resumoGlobal {
    background: #f9fbfa;
    border-left: 4px solid #2E7D32;
}
.mobile-sticky {
    display:none;
}
@media(max-width:768px){
    .mobile-sticky{
        display:flex;
        position:fixed;
        bottom:0;left:0;right:0;
        background:#fff;
        border-top:1px solid #ddd;
        padding:10px 12px;
        justify-content:space-between;
        align-items:center;
        z-index:9999;
    }
    body { padding-bottom:70px }
}
/* ===== OVERLAY PREMIUM ===== */
.overlay-message {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 30000;
    animation: overlayFade .25s ease;
}

@keyframes overlayFade {
    from { opacity: 0 }
    to   { opacity: 1 }
}

.overlay-card {
    background: linear-gradient(135deg, #ffffff, #f6faf7);
    border-radius: 22px;
    padding: 34px 32px;
    width: 100%;
    max-width: 420px;
    text-align: center;
    box-shadow: 0 30px 80px rgba(0,0,0,.25);
    animation: cardEnter .35s cubic-bezier(.2,.8,.2,1);
}

@keyframes cardEnter {
    from {
        opacity: 0;
        transform: scale(.92) translateY(10px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.overlay-icon {
    font-size: 3.2rem;
    margin-bottom: 12px;
    animation: pop .4s ease;
}

@keyframes pop {
    from { transform: scale(.6); opacity: 0 }
    to   { transform: scale(1); opacity: 1 }
}

.overlay-card h5 {
    font-weight: 800;
    color: #14532d;
    margin-bottom: 8px;
}

.overlay-card p {
    font-size: .95rem;
    color: #374151;
    margin: 0;
}

/* VARIAÇÕES */
.overlay-success .overlay-card {
    border-top: 6px solid #22c55e;
}

.overlay-danger .overlay-card {
    border-top: 6px solid #ef4444;
}

.overlay-warning .overlay-card {
    border-top: 6px solid #f59e0b;
}
/* BOTÃO FECHAR OVERLAY */
.overlay-close {
    position: absolute;
    top: 14px;
    right: 14px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, 0.05);
    color: #374151;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: all .2s ease;
}

.overlay-close:hover {
    background: rgba(0, 0, 0, 0.12);
    transform: scale(1.05);
}

/* ===== CARDS DE MODALIDADE (SUSTENTÁVEL / PREMIUM) ===== */
.mod-card-inner {
    border-radius: 20px;
    border: 1px solid rgba(79, 119, 45, 0.18);
    background: linear-gradient(
        135deg,
        #f6f8f4 0%,
        #eef4ec 45%,
        #e4efe6 100%
    );
    box-shadow:
        0 10px 28px rgba(90, 62, 27, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.6);
    transition: all .3s ease;
    position: relative;
    overflow: hidden;
}

/* brilho orgânico no fundo */
.mod-card-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
        circle at top right,
        rgba(167, 201, 87, 0.28),
        transparent 60%
    );
    opacity: .9;
    pointer-events: none;
}

/* detalhe decorativo inferior (terra) */
.mod-card-inner::after {
    content: "";
    position: absolute;
    bottom: -40%;
    right: -20%;
    width: 80%;
    height: 80%;
    background: radial-gradient(
        circle,
        rgba(140, 109, 63, 0.18),
        transparent 70%
    );
    pointer-events: none;
}

/* ===== HOVER PREMIUM ===== */
.mod-card-inner:hover {
    transform: translateY(-6px);
    box-shadow:
        0 18px 42px rgba(90, 62, 27, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.7);
    border-color: rgba(79, 119, 45, 0.35);
}

/* hover elegante */
.mod-card:hover .mod-card-inner {
    transform: translateY(-4px);
    box-shadow:
        0 18px 35px rgba(0, 0, 0, 0.08),
        inset 0 0 0 1px rgba(34, 197, 94, 0.15);
}

/* ===== TEXTOS ===== */
.mod-title {
    font-weight: 800;
    font-size: 1.05rem;
    color: #14532d;
}

.mod-sub {
    font-size: .9rem;
    color: #6b7280;
}

.mod-price {
    font-weight: 800;
    font-size: 1.1rem;
    color: #166534;
}

/* ===== CTA ===== */
.mod-cta {
    font-weight: 700;
    color: #166534;
    transition: .2s ease;
}

.mod-card:hover .mod-cta {
    transform: translateX(3px);
}

/* ===== BADGE ===== */
.mod-badge {
    background: linear-gradient(135deg, #dcfce7, #bbf7d0);
    color: #14532d;
    border-radius: 999px;
    font-weight: 700;
    padding: 6px 14px;
    font-size: .75rem;
}
/* ===== MOBILE STICKY PREMIUM ===== */
.mobile-sticky {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;

    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;

    padding: 12px 16px;
    background: linear-gradient(
        135deg,
        rgba(255,255,255,.92),
        rgba(245,250,247,.92)
    );
    backdrop-filter: blur(6px);

    border-top: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 -10px 30px rgba(0,0,0,.08);

    z-index: 9999;
}

/* blocos */
.sticky-info,
.sticky-total {
    display: flex;
    flex-direction: column;
    line-height: 1.15;
}

.sticky-label {
    font-size: .7rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #6b7280;
}

.sticky-category {
    font-weight: 700;
    font-size: .85rem;
    color: #14532d;
    max-width: 48vw;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sticky-price {
    font-size: 1.1rem;
    font-weight: 800;
    color: #166534;
}

/* divisor sutil */
.sticky-divider {
    width: 1px;
    height: 34px;
    background: linear-gradient(
        to bottom,
        transparent,
        rgba(0,0,0,.15),
        transparent
    );
}
/* ===== CUPOM APLICADO (PREMIUM) ===== */
.cupom-success {
    display: flex;
    gap: 12px;
    align-items: flex-start;

    padding: 14px 16px;
    border-radius: 14px;

    background: linear-gradient(135deg, #f0fdf4, #ecfdf5);
    border: 1px solid rgba(22, 163, 74, 0.25);
}

.cupom-icon {
    font-size: 1.6rem;
    line-height: 1;
}

.cupom-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cupom-title {
    font-weight: 800;
    color: #14532d;
    font-size: .95rem;
}

.cupom-text {
    font-size: .85rem;
    color: #374151;
}

.cupom-highlight {
    font-weight: 800;
    color: #166534;
}

/* Botão validar - destaque quando há cupom digitado */
.btn-validar-destaque {
    background-color: #16a34a !important;
    color: #fff !important;
    border-color: #16a34a !important;

    box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.6);
    animation: pulseValidar 1.4s infinite;
}

@keyframes pulseValidar {
    0% {
        box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.5);
    }
    70% {
        box-shadow: 0 0 0 8px rgba(22, 163, 74, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(22, 163, 74, 0);
    }
}

/* ===== LOADING CPF OVERLAY ===== */
.loading-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 20000;
}

/* card central */
.loading-card {
    background: linear-gradient(135deg, #ffffff, #f6faf7);
    border-radius: 20px;
    padding: 28px 32px;
    text-align: center;
    box-shadow: 0 30px 80px rgba(0,0,0,.25);
    animation: loadingPop .25s ease;
}

@keyframes loadingPop {
    from { opacity: 0; transform: scale(.95); }
    to   { opacity: 1; transform: scale(1); }
}

/* spinner */
.loading-spinner {
    width: 42px;
    height: 42px;
    margin: 0 auto 12px;
    border: 4px solid #e5e7eb;
    border-top-color: #16a34a;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}

.loading-text {
    font-weight: 700;
    color: #14532d;
    margin-bottom: 4px;
}

.loading-subtext {
    font-size: .85rem;
    color: #6b7280;
}

.btn-inscricoes {
    background: #7b5a2b;          /* marrom do layout */
    color: #a8cf45 !important;    /* verde do layout */
    padding: 10px 28px;
    border-radius: 4px;           /* menos arredondado */
    margin-left: 32px;
    font-weight: 700;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    transition: background 0.2s ease;
}
