/* notificaciones */

.notif {
    position:fixed;
    top:15px;
    right:15px;
    background-color:#1e1e1ebb;
    border-left:5px solid var(--error);
    padding:16px 24px;
    border-radius:8px;
    box-shadow:0 4px 12px rgba(0, 0, 0, 0.5);
    display:flex;
    align-items:center;
    gap:12px;
    min-width:300px;
    opacity:0;
    transform:translateX(100%);
    transition:all 0.4s ease;
    z-index:1000;
    color:#fff;

    &.show { opacity:1; transform:translateX(0); }
    &.good { border-left-color:var(--correct); }
    .icon { font-size:1.8rem; }
    .message { font-size:1.1rem; }

    .close {
        margin-left:auto;
        cursor:pointer;
        font-size:1.5rem;
        opacity:0.7;
        &:hover { opacity:1; }
    }
}