/**
 * Form Submit Loading - overlay de carregamento ao enviar formulário.
 * Reutilizável em qualquer página. Use a classe .form-submit-loading-overlay no elemento do overlay.
 *
 * HTML (em cada página que usar):
 *   <div id="seuIdOverlay" class="form-submit-loading-overlay" aria-hidden="true">
 *     <div class="spinner-border" role="status"><span class="visually-hidden">Carregando...</span></div>
 *     <p class="form-submit-loading-message mb-0">Salvando...</p>
 *   </div>
 *
 * O JS form-submit-loading.js adiciona a classe .ativo para exibir o overlay.
 */

.form-submit-loading-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.85);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.form-submit-loading-overlay.ativo {
    display: flex;
}

.form-submit-loading-overlay .spinner-border {
    width: 3rem;
    height: 3rem;
    border-width: 0.25em;
    color: #108dff;
}

.form-submit-loading-overlay .form-submit-loading-message,
.form-submit-loading-overlay .texto-salvando {
    margin-top: 1rem;
    font-size: 1.1rem;
    font-weight: 500;
    color: #495057;
}
