/* Avisos do sistema (static/js/toast.js): faixa discreta na base da tela,
   nas cores da marca. O status é indicado só pelo traço de cor à esquerda;
   some sozinho após o tempo de leitura (sem botão de fechar). */

.toast-container {
    position: fixed;
    left: 50%;
    bottom: 24px;
    transform: translateX(-50%);
    z-index: 1090;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: max-content;
    max-width: calc(100vw - 32px);
    pointer-events: none;
}

/* ".toast" também é um componente do Bootstrap, que o esconde sem ".show" */
.toast-container .toast {
    display: flex !important;
    margin: 0 !important;
}

.toast {
    pointer-events: auto;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 240px;
    max-width: 560px;
    padding: 12px 20px;
    border-radius: 10px;
    border-left: 4px solid var(--azul-claro, #2466b5);
    background: var(--azul-escuro, #0c1826);
    color: #fff;
    font-family: var(--fonte-texto, system-ui, sans-serif);
    font-size: .95rem;
    line-height: 1.35;
    box-shadow: 0 8px 24px rgba(12, 24, 38, .25);
    animation: aviso-entra .2s ease-out;
}

.toast.success { border-left-color: #10b981; }
.toast.error   { border-left-color: #ef4444; }
.toast.warning { border-left-color: #f59e0b; }
.toast.info    { border-left-color: var(--azul-claro, #2466b5); }

.toast.hiding { animation: aviso-sai .2s ease-in forwards; }

@keyframes aviso-entra {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
@keyframes aviso-sai {
    to { opacity: 0; transform: translateY(8px); }
}

@media (max-width: 576px) {
    .toast-container { bottom: 12px; width: calc(100vw - 24px); }
    .toast { min-width: 0; width: 100%; }
}