/* app/css/52-auth-extra.css — estratto da app.css (2026-07, split senza build). */
/* ============================================================
   W2 Auth additions (gap segnalati Agent G, fix 2026-05-17)
   ============================================================ */

/* Radio toggle email/whatsapp dentro .login-wrap.
   position:relative: ancora i radio nascosti (position:absolute) al toggle —
   senza ancestor posizionato in WebKit si stirano dal containing block pagina
   (stesso pattern del bug zoom iOS dashboard, 2026-07-05). */
.channel-toggle { display: flex; gap: 8px; margin-top: 8px; position: relative; }
.channel-toggle input[type="radio"] { position: absolute; opacity: 0; pointer-events: none; }
.channel-option { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 14px; border: 2px solid var(--line); border-radius: 12px; background: var(--bg); color: var(--ink-2); font-size: 15px; font-weight: 700; cursor: pointer; transition: border-color 120ms, background 120ms; }
.channel-option .i { width: 16px; height: 16px; }
.channel-toggle input[type="radio"]:checked + .channel-option { border-color: var(--brand); background: var(--brand-soft); color: var(--brand); }
.channel-toggle .channel-option.wa-option { /* riserva accent verde quando attivo */ }
.channel-toggle input[type="radio"]:checked + .channel-option.wa-option { border-color: var(--whatsapp); background: #DCFCE7; color: #0F5132; }

/* Bottoni: anchor styled as button + secondary ghost + sub-label */
a.btn-link, .btn-link { display: block; text-align: center; text-decoration: none; }
.btn-ghost { display: block; width: 100%; padding: 14px 16px; background: transparent; color: var(--ink-2); border: 2px solid var(--line); border-radius: 12px; font-size: 15px; font-weight: 700; text-align: center; text-decoration: none; margin-top: 12px; }
.btn-ghost:active { background: var(--bg); }
.btn-ghost[disabled], .btn-ghost.is-disabled { opacity: 0.5; pointer-events: none; }
.btn-sub { display: block; font-size: 11px; font-weight: 600; opacity: 0.75; margin-top: 4px; letter-spacing: 0.02em; }

/* Auth feedback icon box (email_sent, whatsapp_sent, invalid_link, welcome) */
.auth-feedback { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 28px 22px; text-align: center; }
.auth-feedback .af-icon { width: 64px; height: 64px; border-radius: 50%; background: var(--brand-soft); color: var(--brand); display: flex; align-items: center; justify-content: center; }
.auth-feedback .af-icon .i { width: 32px; height: 32px; }
.auth-feedback .af-title { font-size: 20px; font-weight: 800; color: var(--ink); margin-top: 4px; }
.auth-feedback .af-body { font-size: 15px; line-height: 1.5; color: var(--ink-2); }
.auth-feedback .af-body strong { color: var(--ink); font-weight: 700; }
.auth-feedback.wa .af-icon { background: #DCFCE7; color: #0F5132; }
.auth-feedback.warn .af-icon { background: #FEF3C7; color: var(--gold); }
.auth-feedback.note .af-icon { background: var(--bg); color: var(--ink-2); }

/* Welcome bonus box (welcome.html) */
.welcome-bonus { margin: 20px 18px 0; padding: 22px 18px; background: linear-gradient(135deg, var(--brand-soft) 0%, #FFFFFF 100%); border: 1px solid var(--brand-soft); border-radius: 16px; display: flex; align-items: center; gap: 16px; box-shadow: var(--shadow-card); }
.welcome-bonus .wb-icon { width: 56px; height: 56px; border-radius: 14px; background: var(--brand); color: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.welcome-bonus .wb-icon .i { width: 28px; height: 28px; }
.welcome-bonus .wb-info { flex: 1; min-width: 0; }
.welcome-bonus .wb-amount { font-size: 28px; font-weight: 800; color: var(--brand); letter-spacing: -0.02em; line-height: 1.1; }
.welcome-bonus .wb-label { font-size: 13px; font-weight: 600; color: var(--ink-2); margin-top: 2px; }

/* ============================================================
   W3 Schermate core (gap segnalati Agent I, fix 2026-05-17)
   ============================================================ */

/* Movimento amount color-coded (positivo / negativo) */
.mov-pos { color: var(--ok); }
.mov-neg { color: var(--danger); }

/* Empty state lista movimenti */
.empty-movimenti { padding: 32px 22px; text-align: center; color: var(--ink-3); font-size: 14px; }

/* Bottone "Carica altri" sotto lista paginata */
.load-more-btn { display: block; width: calc(100% - 36px); margin: 16px 18px 0; padding: 14px; background: var(--bg); border: 1px solid var(--line); border-radius: 12px; color: var(--ink-2); font-size: 14px; font-weight: 700; text-align: center; cursor: pointer; }
.load-more-btn:active { background: var(--surface); }

/* Anchor wrapper su menu-row e card-detail (sostituiscono onclick mockup) */
a.menu-row-link, a.card-detail-link { display: block; text-decoration: none; color: inherit; }

/* Empty state Card (tessera.html quando cards e' vuota) */
.empty-card-block { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 40px 22px; text-align: center; }
.empty-card-icon { width: 64px; height: 64px; border-radius: 50%; background: var(--brand-soft); color: var(--brand); display: flex; align-items: center; justify-content: center; }
.empty-card-icon .i { width: 32px; height: 32px; }
.empty-card-title { font-size: 18px; font-weight: 800; color: var(--ink); margin-top: 4px; }
.empty-card-text { font-size: 14px; line-height: 1.5; color: var(--ink-2); }

/* Spacer di fondo pagina sopra bottom-nav */
.page-bottom-spacer { height: 24px; }