/* ==========================================================================
   RESETARE PAROLĂ — /AlegeModResetareParola, /SMSResetareTrimis, /ResetareParola
   --------------------------------------------------------------------------
   Se încarcă DUPĂ pages/auth.css, din secțiunea „Styles" a view-urilor: aici
   sunt doar diferențele față de cardul de autentificare, nu o temă nouă.

   Reguli respectate:
     - exclusiv tokeni var(--ps-*) din design-tokens.css, zero valori brute;
     - convenția .ps-bloc__element--modificator, cu modificatori în română;
     - nimic care să depindă de JavaScript pentru a fi utilizabil.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Alegerea canalului
   --------------------------------------------------------------------------
   Două butoane radio native, într-un fieldset cu legendă vizibilă: alegerea
   este anunțată corect de cititoarele de ecran și funcționează la tastatură
   cu săgețile, fără nicio linie de JavaScript.
   -------------------------------------------------------------------------- */

.ps-reset__canale {
    display: flex;
    flex-wrap: wrap;
    gap: var(--ps-space-20);
}

.ps-reset__nota {
    font: var(--ps-type-caption);
    color: var(--ps-text-faint-aa);
}

/* --------------------------------------------------------------------------
   Câmpul dependent de canal
   --------------------------------------------------------------------------
   IMPLICIT AMBELE SUNT VIZIBILE. Ascunderea celui nefolosit este o îmbunătățire
   opțională, făcută doar de `:has()`; pe un motor care nu îl suportă, formularul
   rămâne complet funcțional, iar serverul validează oricum doar câmpul care
   corespunde canalului bifat.

   Câmpurile ascunse NU au atributul `required`: un control obligatoriu invizibil
   ar bloca trimiterea formularului fără să spună de ce.
   -------------------------------------------------------------------------- */

@supports selector(:has(*)) {
    .ps-reset__form:has(.ps-reset__canal--email:checked) .ps-reset__camp--sms,
    .ps-reset__form:has(.ps-reset__canal--sms:checked) .ps-reset__camp--email {
        display: none;
    }
}

/* --------------------------------------------------------------------------
   Câmpul de cod primit prin SMS
   --------------------------------------------------------------------------
   Aceeași tratare ca la validarea PIN-ului: cifre mari, monospațiate și
   distanțate, pentru că se citesc de pe telefon și se tastează cu privirea
   mutându-se între ecrane.
   -------------------------------------------------------------------------- */

.ps-reset__cod {
    font-family: var(--ps-font-mono);
    font-size: var(--ps-fs-28);
    font-weight: var(--ps-fw-semibold);
    line-height: var(--ps-lh-flat);
    letter-spacing: 0.35em;
    text-align: center;

    /* Compensează letter-spacing-ul, care adaugă spațiu și DUPĂ ultima cifră. */
    text-indent: 0.35em;
}

.ps-reset__cod::placeholder {
    color: var(--ps-text-disabled-aa);
    letter-spacing: 0.35em;
}

/* --------------------------------------------------------------------------
   Ecranele de rezultat (trimis / finalizat / link invalid)
   -------------------------------------------------------------------------- */

.ps-reset__rezultat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--ps-space-15);
    text-align: center;
}

.ps-reset__mesaj {
    font: var(--ps-type-body);
    color: var(--ps-text-secondary);
}

.ps-reset__actiuni {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--ps-space-15);
    width: 100%;
}

/* Regulile de parolă respinse: o listă, nu un paragraf lipit, ca utilizatorul
   să vadă dintr-o privire câte lucruri are de schimbat. */
.ps-reset__reguli {
    margin: 0;
    padding-inline-start: var(--ps-space-20);
    font: var(--ps-type-small);
    color: var(--ps-text-secondary);
}

@media (max-width: 575px) {
    .ps-reset__actiuni .ps-btn {
        width: 100%;
    }
}
