/* Variables para los degradados */
:root {
    --gradient-start: #30c1c6;
    --gradient-middle: #67e3e7;
    --gradient-end: #16a7ac;
}

/* Clase específica para el navbar con degradado */
.navbar-gradient {
    background: linear-gradient(
        135deg,
        var(--gradient-start) 25%,
        var(--gradient-middle) 60%,
        var(--gradient-end) 90%
    ) !important;
}

/* Clase específica para la sidebar con degradado */
.sidebar-gradient {
    background: linear-gradient(
        135deg,
        var(--gradient-start) 25%,
        var(--gradient-middle) 60%,
        var(--gradient-end) 90%
    ) !important;
}

/* Fondo blanco para el logo del sidebar */
.sidebar-brand .brand-link .brand-image {
    background-color: white;
    padding: 5px;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Alineación vertical del icono de flecha en el menú del sidebar */
.app-sidebar .sidebar-menu .nav-link p {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 0 !important;
}

.app-sidebar .sidebar-menu .nav-link p .nav-arrow {
    margin-left: auto !important;
    vertical-align: middle !important;
    line-height: 1 !important;
}

/* bg-info sin degradado (para otros elementos) */
.bg-info {
    background-color: #30c1c6 !important;
}

.text-info {
    color: #30c1c6 !important;
}

.table-info th {
    background-color: #6cf1f6; /* Azul claro */
    color: #004085; /* Azul oscuro */
}

.btn-info {
    background-color: #30c1c6; /* Cambia este valor al color que desees */
    border-color: #30c1c6; /* Cambia este valor al color que desees */
}

/* Cambia el color al hacer hover */
.btn-info:hover {
    background-color: #138496; /* Cambia este valor al color que desees */
    border-color: #117a8b; /* Cambia este valor al color que desees */
    color: #ffffff; /* Cambia este valor al color que desees */
}

.btn-outline-info {
    border-color: #30c1c6;
    color: #30c1c6;
}

/* Cambia el color al hacer hover */
.btn-outline-info:hover {
    background-color: #17a2b8;
    border-color: #17a2b8;
    color: #ffffff;
}

.row-success {
    background-color: #198754 !important;
    color: white;
    font-weight: bold;
}

.row-warning {
    background-color: #ffc107 !important;
    color: black;
    font-weight: bold;
}

.row-danger {
    background-color: #dc3545 !important;
    color: white;
    font-weight: bold;
}