@charset "UTF-8";

/* ==========================================================================
   COMPONENTĂ — ALERTĂ ÎN PAGINĂ  (.ps-alerta)
   --------------------------------------------------------------------------
   Sursă:  docs/design/DESIGN-SYSTEM.md §10.21  [PROPUS — construit din tokeni]
   Randat de: Views/Shared/_Alert.cshtml (model piatastoma.Models.Components.AlertViewModel)

   Înlocuiește alert() pentru mesajele persistente din pagină.
   Pentru mesaje efemere: .ps-toast (dialog.css) prin psToast.show(...).
   ========================================================================== */

.ps-alerta {
    display: flex;
    align-items: flex-start;
    gap: var(--ps-space-15);
    padding: var(--ps-space-15) var(--ps-space-20);
    border: var(--ps-border-width) solid transparent;
    border-left-color: var(--ps-info);
    border-radius: var(--ps-radius-control);
    background: var(--ps-info-bg);
    box-shadow: var(--ps-shadow-xs);
    font: var(--ps-type-body);
    color: var(--ps-text);
    transition: opacity var(--ps-duration-slow) var(--ps-ease),
                transform var(--ps-duration-slow) var(--ps-ease);
}

.ps-alerta + .ps-alerta { margin-top: var(--ps-space-10); }

.ps-alerta__icon {
    flex: 0 0 var(--ps-icon-24);
    color: var(--ps-info);
    line-height: var(--ps-lh-normal);
}

.ps-alerta__continut {
    flex: 1 1 auto;
    min-width: 0;
}

.ps-alerta__titlu {
    margin: 0 0 var(--ps-space-3);
    font: var(--ps-type-label);
    color: var(--ps-text);
}

.ps-alerta__mesaj {
    margin: 0;
    line-height: var(--ps-lh-body);
    overflow-wrap: anywhere;
}

.ps-alerta__inchide {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--ps-icon-30);
    height: var(--ps-icon-30);
    margin: calc(var(--ps-space-3) * -1) calc(var(--ps-space-5) * -1) 0 0;
    border-radius: var(--ps-radius-control);
    color: var(--ps-text-faint-aa);
    background: transparent;
    cursor: pointer;
    transition: var(--ps-transition-color);
}

.ps-alerta__inchide:hover {
    background: var(--ps-c-red-600);
    color: var(--ps-text-inverse);
}

.ps-alerta__inchide:active { background: var(--ps-c-red-400); }

/* --- variante ------------------------------------------------------------ */

.ps-alerta--succes {
    border-left-color: var(--ps-success);
    background: var(--ps-success-bg);
}
.ps-alerta--succes .ps-alerta__icon { color: var(--ps-success); }

.ps-alerta--info {
    border-left-color: var(--ps-info);
    background: var(--ps-info-bg);
}
.ps-alerta--info .ps-alerta__icon { color: var(--ps-info); }

.ps-alerta--atentie {
    border-left-color: var(--ps-warning);
    background: var(--ps-warning-bg);
}
.ps-alerta--atentie .ps-alerta__icon { color: var(--ps-warning); }

.ps-alerta--eroare {
    border-left-color: var(--ps-danger);
    background: var(--ps-danger-bg);
}
.ps-alerta--eroare .ps-alerta__icon { color: var(--ps-danger); }

/* --- stare de închidere (adăugată de dialog.js) -------------------------- */

.ps-alerta.is-ascunsa {
    opacity: 0;
    transform: translateY(calc(var(--ps-space-5) * -1));
    pointer-events: none;
}

/* --- sumarul de validare al formularelor -------------------------------- */

/* sumarul fără erori rămâne ascuns chiar dacă poartă și `.ps-alerta` (display: flex) */
.ps-alerta.validation-summary-valid,
.ps-validation-summary.validation-summary-valid { display: none; }

.ps-alerta .validation-summary-errors ul {
    margin: var(--ps-space-5) 0 0;
    padding-left: var(--ps-space-20);
    list-style: disc;
}

@media (max-width: 575.98px) {
    .ps-alerta { padding: var(--ps-space-13) var(--ps-space-15); gap: var(--ps-space-10); }
}