/* ── Super Ads — Quiz Prestito — Front-end styles ── */

/* ── Wrapper ── */
.sa-pquiz {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
    background:    #ffffff;
    border-radius: 16px;
    overflow:      hidden;
    box-shadow:    0 4px 28px rgba(0,0,0,0.10), 0 1px 6px rgba(0,0,0,0.06);
    max-width:     760px;
    margin:        0 auto;
    position:      relative;
}

/* ── Steps ── */
.sa-pquiz__step {
    display: none;
}
.sa-pquiz__step--active {
    display: block;
}

/* ── Banner image ── */
.sa-pquiz__banner {
    width:      100%;
    display:    block;
    object-fit: cover;
    max-height: 300px;
}

.sa-pquiz__banner-ph {
    background:      linear-gradient(135deg, #1a3a6b, #2d5494);
    padding:         36px 24px;
    text-align:      center;
    color:           rgba(255,255,255,0.65);
    font-size:       13px;
}
.sa-pquiz__banner-ph strong {
    color: #fff;
}

/* ── Trust bar (Trustpilot) ── */
.sa-pquiz__trust {
    display:        flex;
    align-items:    center;
    justify-content: center;
    gap:            8px;
    padding:        10px 16px 4px;
    font-size:      13px;
    color:          #374151;
    flex-wrap:      wrap;
}
.sa-pquiz__trust-stars {
    color:     #00b67a;
    font-size: 18px;
    line-height: 1;
}
.sa-pquiz__trust-label {
    color: #374151;
}

/* ── Content area ── */
.sa-pquiz__content {
    padding: 22px 36px 36px;
}
.sa-pquiz__content--centered {
    text-align: center;
    padding:    40px 36px 44px;
}
.sa-pquiz__content--success {
    padding: 52px 36px 56px;
}

/* ── Subtitle / label ── */
.sa-pquiz__subtitle {
    text-align:    center;
    font-size:     13px;
    color:         #374151;
    margin:        0 0 6px;
    font-weight:   500;
    letter-spacing: 0.1px;
}

/* ── Question heading ── */
.sa-pquiz__question {
    font-size:      30px;
    font-weight:    900;
    color:          #1a3a6b;
    text-align:     center;
    margin:         0 0 28px;
    line-height:    1.18;
    padding:        0;
    letter-spacing: -0.3px;
}
.sa-pquiz__accent {
    color: #f5a500;
}

/* ── Button grid ── */
.sa-pquiz__grid {
    display:         flex;
    flex-wrap:       wrap;
    gap:             12px;
    justify-content: center;
}

/* 5-button category grid: 3 + 2 layout */
.sa-pquiz__grid--cats .sa-pquiz__btn {
    flex: 0 0 calc(33.333% - 8px);
}

/* 2-button layout (SI / NO) */
.sa-pquiz__grid--2 {
    gap: 16px;
}
.sa-pquiz__grid--2 .sa-pquiz__btn {
    flex:      1;
    min-width: 110px;
}

/* ── Buttons ── */
/* Regra única para button E a — cobre todos os pseudo-estados de link */
.sa-pquiz__btn,
.sa-pquiz a.sa-pquiz__btn,
.sa-pquiz a.sa-pquiz__btn:link,
.sa-pquiz a.sa-pquiz__btn:visited,
.sa-pquiz a.sa-pquiz__btn:active {
    background:      var(--pq-primary, #f5a500) !important;
    color:           #1a3a6b !important;
    border:          none;
    border-radius:   12px;
    padding:         16px 18px;
    font-size:       14px;
    font-weight:     800;
    letter-spacing:  0.5px;
    cursor:          pointer;
    text-align:      center;
    line-height:     1.25;
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    text-decoration: none !important;
    transition:      filter 0.2s, transform 0.15s, box-shadow 0.2s;
    user-select:     none;
    -webkit-user-select: none;
    opacity:         1 !important;
    box-shadow:      none;
}
.sa-pquiz__btn:hover,
.sa-pquiz__btn:focus,
.sa-pquiz a.sa-pquiz__btn:hover,
.sa-pquiz a.sa-pquiz__btn:focus {
    filter:     brightness(0.88);
    box-shadow: 0 4px 14px rgba(0,0,0,0.2) !important;
    transform:  translateY(-1px);
    outline:    none;
    color:      #1a3a6b !important;
    text-decoration: none !important;
}
.sa-pquiz__btn:active,
.sa-pquiz a.sa-pquiz__btn:active {
    transform: scale(0.97);
    filter:    brightness(0.82);
}

/* Submit button */
.sa-pquiz__btn--submit {
    width:         100%;
    padding:       17px 20px;
    font-size:     16px;
    border-radius: 12px;
    margin-top:    4px;
}

/* ── Form ── */
.sa-pquiz__form {
    display:        flex;
    flex-direction: column;
    gap:            12px;
    margin-top:     14px;
}

.sa-pquiz__input {
    width:       100%;
    padding:     14px 16px;
    border:      1.5px solid #d1d5db;
    border-radius: 8px;
    font-size:   15px;
    color:       #1f2937;
    background:  #ffffff;
    outline:     none;
    transition:  border-color 0.2s;
    box-sizing:  border-box;
    font-family: inherit;
    -webkit-appearance: none;
    appearance: none;
}
.sa-pquiz__input:focus {
    border-color: #1a3a6b;
    box-shadow:   0 0 0 3px rgba(26,58,107,0.08);
}
.sa-pquiz__input--error {
    border-color: #ef4444;
    background:   #fff8f8;
}

/* Select chevron */
.sa-pquiz__select-wrap {
    position: relative;
}
.sa-pquiz__select-wrap::after {
    content:        '▾';
    position:       absolute;
    right:          16px;
    top:            50%;
    transform:      translateY(-50%);
    color:          #6b7280;
    pointer-events: none;
    font-size:      16px;
}

/* 2-column form row */
.sa-pquiz__form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap:    12px;
}

/* ── Privacy section ── */
.sa-pquiz__privacy {
    margin-top: 4px;
}
.sa-pquiz__checkbox-label {
    display:     flex;
    align-items: flex-start;
    gap:         10px;
    font-size:   13px;
    color:       #374151;
    cursor:      pointer;
    line-height: 1.5;
}
.sa-pquiz__checkbox {
    width:      18px;
    height:     18px;
    flex-shrink: 0;
    margin-top:  2px;
    cursor:      pointer;
    accent-color: #1a3a6b;
}
.sa-pquiz__privacy-text {
    font-size:   12px;
    color:       #6b7280;
    margin:      6px 0 0 28px;
    line-height: 1.55;
}
.sa-pquiz__privacy--error .sa-pquiz__checkbox-label {
    color: #ef4444;
}

/* ── Consent radio ── */
.sa-pquiz__consent {
    display:  flex;
    gap:      28px;
    margin-top: 4px;
}
.sa-pquiz__radio-label {
    display:     flex;
    align-items: center;
    gap:         8px;
    font-size:   14px;
    color:       #374151;
    cursor:      pointer;
}
.sa-pquiz__radio {
    width:        20px;
    height:       20px;
    accent-color: #1a3a6b;
    cursor:       pointer;
}
.sa-pquiz__consent--error .sa-pquiz__radio-label {
    color: #ef4444;
}

/* ── Form error message ── */
.sa-pquiz__form-error {
    font-size:    13px;
    color:        #ef4444;
    background:   #fff1f1;
    border:       1px solid #fecaca;
    border-radius: 8px;
    padding:      10px 14px;
    margin:       0;
}

/* ── Link style inside privacy ── */
.sa-pquiz__link {
    color: #1a3a6b;
    text-decoration: underline;
}

/* ── Success ── */
.sa-pquiz__success-icon {
    font-size:     56px;
    line-height:   1;
    margin-bottom: 20px;
}
.sa-pquiz__success-title {
    font-size:   26px;
    font-weight: 900;
    color:       #1a3a6b;
    margin:      0 0 14px;
    padding:     0;
    line-height: 1.2;
}
.sa-pquiz__success-text {
    font-size:   16px;
    color:       #374151;
    line-height: 1.65;
    max-width:   460px;
    margin:      0 auto;
}

/* ── Responsive: Mobile ── */
@media (max-width: 600px) {
    .sa-pquiz__content {
        padding: 18px 20px 28px;
    }
    .sa-pquiz__content--centered {
        padding: 32px 20px 36px;
    }
    .sa-pquiz__content--success {
        padding: 40px 20px 44px;
    }
    .sa-pquiz__question {
        font-size:    24px;
        margin-bottom: 22px;
    }
    /* Category buttons: full width on mobile */
    .sa-pquiz__grid--cats .sa-pquiz__btn {
        flex: 0 0 100%;
    }
    /* 2-button grid: stacked on very small screens */
    .sa-pquiz__grid--2 .sa-pquiz__btn {
        flex: 0 0 calc(50% - 8px);
    }
    .sa-pquiz__form-row {
        grid-template-columns: 1fr;
    }
    .sa-pquiz__btn--submit {
        font-size: 15px;
        padding:   16px;
    }
}