html {
    height: 100%;
    margin: 0;
}

h1{
    font-family: 'poppinsmedium';
}


form input,
form textarea, form select {
    color: #223548 !important;
    border-radius: 10px !important;
    border: 1px solid #a7a7a8 !important;
    font-family: 'poppinslight';
}


.modal form input,
.modal form textarea, .modal form select, .modal form label {
    font-size: 0.9rem !important;
}

.modal form label {
    font-size: 0.9rem !important;
    color: black !important;
}


.dashboard-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    font-family: 'poppinsmedium';

}

.container {
    margin: 20px auto;
    padding: 40px 80px;
    background-color: #EFF3F4;
    border-radius: 15px;
}

.shadow-sm {
    border-radius: 15px;
    border: 1px solid #a7a7a8;
}

#header {
    flex-wrap: wrap !important;
}

.user-info {
    display: flex;
    align-items: center;
    background-color: #fff;
    padding: 10px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.imgPerfil{
    cursor: pointer;
    max-height:50px;
    border-radius: 5px !important;
}

.user-details {
    margin-left: 10px;
}

.class-cells {
    vertical-align: middle !important;
}

.nombre{
    font-family: 'poppinsmedium';
}

.apellidos{
    font-family: 'poppinslight';
}

@media (max-width: 576px) {
    .user-info {
        flex-direction: row;
    }

    .user-info img {
        margin-bottom: 10px;
    }

    .user-details {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
}


label,
.card-title {
    font-family: 'poppinsmedium';
}

.card {
    border-radius: 10px;
    border : 1px solid #3e3e3f;
}

#modalIcon {
    color: #28a745;
    /* Verde para éxito */
}

#errorIcon {
    color: #dc3545;
    /* Rojo para error */
}

.button, .button2{
    padding: 10px 20px;
    color: white;
    border: none;
    border-radius: 5px;
    transition: transform 0.3s, box-shadow 0.3s;
    cursor: pointer;
    margin: 5px;
}

.button2 {
    border-radius: 10px;
}


.delete {
    background-color: #FEF5F3;
    color: #B21917;
}

.delete:hover {
    background-color: #B21917;
    color: #FEF5F3;
    box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.3);
}

.cancel {
    background-color: #ffffff;
    color: #223548;
    border: 1px solid #c4c5c4;
}

.cancel:hover {
    background-color: #f2f2f2;
    box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.3);
}


[role="button"] .dx-icon.dx-icon-add{
    color: #ffffff !important;
}

[role="button"]:has(.dx-icon.dx-icon-add) .dx-button-text {
    font-family: 'poppinslight';
}
.save, [role="button"]:has(.dx-icon.dx-icon-add) {
    background-color: #336CB3;
    color: #ffffff;
}

.save:hover, [role="button"]:has(.dx-icon.dx-icon-add):hover {
    background-color: #2C5A8C;
    box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.3);
}

.save2 {
    background-color: #faaa2e;
    color: #ffffff;
}

.save2:hover {
    background-color: #be8022;
    box-shadow: 1px 1px 7px rgba(0, 0, 0, 0.3);
}


.dx-datagrid-headers {
    color: #223548;
    font-family: 'poppinsmedium';
}

.dx-datagrid-headers {
    border: none !important;
}

.dx-datagrid-headers .dx-datagrid-table .dx-row>td {
    border: none !important;
}

.dx-datagrid .dx-column-lines>td {
    border: none !important;
}

.dx-datagrid-rowsview{
    border: none !important;
}

#gridContainer {
    font-family: 'poppinsregular' !important;
}


@media (max-width: 575px) {
    .container {
        margin: 20px !important;
        max-width: 95% !important;
        padding: 20px !important;

    }
}

@media (max-width: 767px) {
    .container {
        padding: 30px !important;
    }
}

@media (max-width: 600px) {
    [role="button"]:has(.dx-icon.dx-icon-add) .dx-button-text {
        display: none;
    }
    [role="button"] .dx-icon.dx-icon-add{
        margin: auto;
    }
}

/* Estilos personalizados para SweetAlert2 */

.custom-swal-popup {
    border-radius: 15px !important;
}

.custom-swal-title {
    font-size: 1.5rem;
    color: #000;
    font-family: 'poppinsmedium';
}

.swal2-actions button {
    margin: 10px !important;
}

/* Add/update in general.css */
.footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    padding: 5px 0;
    text-align: center;
    font-family: 'poppinslight';
    font-size: 0.75rem;
    color: #666;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    z-index: 1000;
    backdrop-filter: blur(5px);
    margin: 0;
}

.footer p {
    margin: 0;
    line-height: 1;
}

/* Add margin to main container to prevent footer overlap */
.container {
    margin-bottom: 40px;
}