/* ============================================================
   PADRÃO GLOBAL DE MODAIS - TPE
   ============================================================ */

:root {
   /* Cores do header*/
   
    --modal-titulo-backgroud: #ffffff;
    --modal-titulo-backgroud-2: #dedcdc;
    --modal-titulo-color: #2c2f33;

    /* Cores do Label dos campos*/
    --label-campos-fundo: #4a6da7;
    --label-campos-color: #ffffff;

    --detalhe-lateral-caixa: #5b7eb2; 
}

.modal-content {
    border: none;
    border-radius: 15px;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2);
    overflow: hidden; /* Garante que o gradiente não vaze as bordas */
}

.modal-header {
    background: linear-gradient(45deg, var(--modal-titulo-backgroud), var(--modal-titulo-backgroud-2));
    color: var(--modal-titulo-color);
    border: none;
    border-bottom: 1px solid #eee;
    padding: 1.2rem 1.5rem;
}

.modal-title {
    font-size: 1.1rem;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.modal-footer {
    background-color: #f8f9fa;
    border-top: 1px solid #eee;
    padding: 1rem 1.5rem;
    display: flex;
    justify-content: space-between; /* Espaça os elementos */
    gap: 10px;
    text-align: right;
}

/* --- PADRONIZAÇÃO DE BOTÕES --- */

.modal-footer .btn, 
.modal-footer div {
    flex: 1; /* Faz todos terem a mesma largura proporcional */
}

.modal-footer .btn {
    width: 25%;
    justify-content: center;
    align-items: center;
    white-space: nowrap; /* Impede que o texto quebre em duas linhas */
    padding: 10px 5px;
    font-size: 0.75rem; /* Ajuste para caber em telas menores */
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 8px;
    border: none;
    transition: all 0.2s;
}

/* --- ELEMENTOS DE APOIO --- */
.avatar-circle {
    width: 35px; 
    height: 35px; 
    background: #eee; 
    border-radius: 50%;
    display: flex; 
    align-items: center; 
    justify-content: center;
    font-size: 12px; 
    font-weight: bold; 
    color: #777;
}

.divider-modal {
    height: 1px;
    background-color: #eee;
    margin: 15px 0;
    width: 100%;
}