/*
    Posicion del contenedor de toasts (pareja de toast-helper.js).

    El <div id="toast-container"> vive al FINAL del <form> en LayoutLoguedABM.Master, asi que
    sin esto los toasts se renderizan en el flujo del documento, al pie de la pagina: aparecen
    muy por debajo del viewport y el usuario no los ve.

    Con position:fixed quedan contra el top, por encima del contenido y visibles aunque la
    pagina este scrolleada — que es lo habitual en los ABM, donde el toast llega despues de
    guardar y el foco esta en la botonera del final del formulario.

    Diferencia con ParkQR: alli el contenedor esta al principio de .app-container y va en el
    flujo normal. En CLG quedo al final y los formularios son largos, asi que fijarlo es mas
    confiable que mover el div de lugar.
*/
#toast-container {
    position: fixed;
    top: 1rem;                                      /* el margen contra el borde superior */
    left: 50%;
    transform: translateX(-50%);
    z-index: 1090;                                  /* sobre el modal de Bootstrap (1055) y su backdrop (1050) */
    width: calc(100% - 2rem);
    max-width: 32rem;

    /* Varios toasts encimados se apilan con aire entre ellos. */
    display: flex;
    flex-direction: column;
    gap: .5rem;

    /* El contenedor ocupa ancho completo: sin esto tapa los clicks del contenido de abajo. */
    pointer-events: none;
}

#toast-container .alert {
    margin-bottom: 0;                               /* el gap del contenedor maneja la separacion */
    pointer-events: auto;                           /* el toast si recibe clicks (boton de cerrar) */
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);    /* despega el toast del contenido que queda debajo */
}