/* HEADER */

.usuario-header {

    height: 80px;
    padding: 20px 24px;
    border-bottom: 1px solid #e5e7eb;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f1f5f9;
    flex-shrink: 0;

}

.modal-content.modal-usuario {

    width: 700px !important;
    max-width: 700px !important;
    margin: 0 18px;
    height: 95vh;

    display: flex;
    flex-direction: column;

    overflow: hidden;

}

.toggle-entrada {
  
    margin-top: 5px !important;
}

.usuario-header h2 {

    margin: 0;
    font-size: 22px;
    font-weight: 700;

}

.usuario-header p {

    margin: 4px 0 0;
    color: #6b7280;
    font-size: 13px;

}

#btnFecharModalUsuario {

    width: 40px;
    height: 40px;
    border: none;
    border-radius: 10px;
    background: #f3f4f6;
    cursor: pointer;
    font-size: 18px;

}

/* BODY */

.usuario-body {

    flex: 1;
    overflow-y: auto;
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 5px;

}

/* GRID */

.usuario-grid {

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    width: 100%;

}

/* CAMPOS */

.usuario-form-group {

    width: 100%;
    min-width: 0;

}
.usuario-form-group label {

    font-size: 14px;
    font-weight: 600;
    color: #374151;

}

.usuario-form-group input,
.usuario-form-group select {

    width: 100%;
    min-width: 0;
    height: 45px;
    background: rgb(232, 240, 254) !important;
    border: 1px solid #d1d5db !important;
    color: #7f8da2 !important;
    border-radius: 12px;
    margin-top: 10px;
    padding: 0 14px;
    font-size: 14px;
    transition: .2s;

}

.usuario-form-group input:focus,
.usuario-form-group select:focus {

    outline: none !important;
    border-color: #2563eb !important;
    box-shadow:
        0 0 0 3px rgba(37,99,235,.10) !important;

}


/* DOCUMENTO */

.documento-topo {

    display: flex;
    align-items: center;
    gap: 14px;

}

.tipo-documento-texto {

    display: flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;

}

.tipo-documento-texto span {

    color: #6b7280;

}

.tipo-documento-texto .ativo {

    color: #2563eb;

}

/* INFO */

.usuario-info {

    padding: 16px;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #ecdedb;

}

.usuario-info strong {

    display: block;
    margin-bottom: 6px;

}

.usuario-info p {

    margin: 0;
    color: #6b7280;
    font-size: 13px;

}

/* FOOTER */

.usuario-footer {

    padding: 20px 24px;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: flex-end;
    background: #f1f5f9;
    flex-shrink: 0;

}

#btnSalvarUsuario {

    height: 46px;
    padding: 0 24px;
    border: none;
    border-radius: 12px;
    background: #2563eb;
    color: #ffffff;
    font-weight: 600;
    cursor: pointer;

}

.usuario-form-group input.usuario-campo-invalido,
.usuario-form-group select.usuario-campo-invalido {

    border-color: #ef4444 !important;
    background-color: #faf4f47a !important;

}

.documento-linha {

    display: flex;
    gap: 12px;
    align-items: center;

}

.btn-verificar-documento {

    height: 45px;
    min-width: 140px;
    border: none;
    border-radius: 12px;
    background: #2563eb;
    color: white;
    font-weight: 600;
    cursor: pointer;

}

.btn-verificar-documento.documento-verificado {

    background: #16a34a;

}

/* MOBILE */

@media (max-width: 589px) {

    #modalUsuario {

        width: calc(100% - 20px);
        height: 90vh;

    }

    .usuario-grid {

        grid-template-columns: 1fr;

    }

}