/* ===== Tema claro Zeplay Store - paginas do Atendente IA (onboarding) ===== */
:root {
    --bg: #fffaf6;
    --surface: #ffffff;
    --surface-card: #ffffff;
    --surface-input: #fff7f1;
    --surface-hover: #ffede0;
    --border: #eddccf;
    --primary: #ff6a00;
    --primary-dark: #e55a00;
    --primary-glow: rgba(255, 106, 0, 0.25);
    --brand-orange: #ff6a00;
    --text: #2a2d34;
    --text-muted: #5d636d;
    --text-subtle: #6b7280;
    --danger: #dc2626;
}

body { background: var(--bg); color: var(--text); }

/* Cabecalho e logomarca */
.header-brand { background: #ffffff; border-bottom: 1px solid var(--border); }
.logo-img { display: block; height: 42px; width: auto; }
.brand-title { color: var(--text); }
.brand-sub { color: var(--text-muted); }
.secure-badge { background: rgba(22, 163, 74, 0.1); border-color: rgba(22, 163, 74, 0.35); color: #15803d; }
.secure-badge span { color: #15803d; }

/* Titulos e textos que eram brancos */
.intro-banner h1, .section-title, .modal-header h3 { color: var(--text); }
.intro-banner { background: linear-gradient(180deg, rgba(255, 106, 0, 0.1) 0%, rgba(255, 255, 255, 0) 100%); }
.form-group label { color: #3f434b; }
.form-control { color: var(--text); background: var(--surface-input); border-color: var(--border); }
.form-control::placeholder { color: #9a9fa8; }
.form-control:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.15); }

/* Botoes */
.btn-primary { background: linear-gradient(135deg, #ff6a00 0%, #ff8a1f 100%); color: #ffffff; }
.btn-primary:hover { background: #e55a00; color: #ffffff; }
.btn-secondary { background: #ffffff; color: var(--text); border-color: var(--border); }
.btn-secondary:hover { background: var(--surface-hover); color: var(--text); }
.btn-switch-trial { color: var(--text-muted); }
.btn-switch-trial:hover { color: var(--text); }
.btn-recover-trial { background: linear-gradient(135deg, #ff6a00, #f0107a); color: #ffffff; }
.btn-recover-trial:hover { background: #e55a00; }

/* Alertas e selos (cores escuras equivalentes para fundo claro) */
.alert-error { color: #b91c1c; background: rgba(220, 38, 38, 0.08); }
.alert-success { color: #15803d; background: rgba(22, 163, 74, 0.1); }
.status-badge.connected { color: #15803d; background: rgba(22, 163, 74, 0.12); }
.status-badge.waiting { color: #a16207; background: rgba(234, 179, 8, 0.18); }
.connected-box h2 { color: #15803d; }
.badge-success { color: #047857; }
.badge-danger { color: #b91c1c; }
.step-item.done { color: #047857; }

/* Barra de recuperacao do teste */
.trial-recovery-bar { background: linear-gradient(135deg, #fff1e6, #ffe3d1); border-color: rgba(255, 106, 0, 0.3); }
.trial-recovery-bar .info-text { color: #7c3a0b; }
.trial-recovery-bar .info-text strong { color: var(--text); }

/* Janela modal */
.modal-card { background: #ffffff; }
.modal-header { background: #fff4ec; border-bottom-color: var(--border); }
.modal-body p { color: var(--text-muted); }
.modal-close { color: var(--text-subtle); }
.modal-close:hover { color: var(--text); }
.modal-footer { background: #fff7f1; border-top-color: var(--border); }

/* Blocos com cor escrita direto no HTML */
[style*="color: #fff;"], [style*="color: #fff "] { color: var(--text) !important; }
[style*="color: #d1d5db"] { color: var(--text-muted) !important; }
[style*="color: #9ca3af"] { color: var(--text-muted) !important; }
[style*="color: #fca5a5"], [style*="color: #f87171"] { color: #b91c1c !important; }
[style*="color: #4ade80"] { color: #15803d !important; }

@media (max-width: 640px) {
    .logo-img { height: 36px; }
}

/* contraste: etapa ativa */
.step-item.active { color: #c2500a; }

@media (max-width: 480px) {
    .brand-sub { display: none; }
    .secure-badge { font-size: 0.72rem; padding: 5px 10px; }
}
