/**
* Copyright © 2026 SIGESAD
* Todos los derechos reservados.
*
* Software protegido por derechos de autor.
* Uso sujeto a licencia.
*
* Prohibida la copia, distribución,
* modificación o reutilización del código
* sin autorización expresa de SIGESAD.
* 
* Estilo css para el backend
* Creado: 16-08-2018
* Ultima Modificación: 28-09-2026
* Usuario: Frank Blanco
* Email: soporte@sigesad.com
* Ver: 2.0
*
* c10ed63f6104c472c4c3fb492f291c4abcd08625b507ed87cfa57bb1d2e4689d071d5727523f74c953008ad32fdf5a4c1e4cd7346278d36515b2596a648d82a2
* ce39b979c089c8dd22b28502bbf5c230e8c6a0f0f6b6b672280a0962c84ac4122a5c3a2c9d79e2a8715e1becbade2d4f42777f936df4d2d34ffb1975d4acc4f7
*/

:root {
    --bg-dark: #0A0E17;
    --bg-sidebar: #111827;
    --bg-card: #1A2235;
    --accent-blue: #00D2FF;
    --accent-glow: rgba(0, 210, 255, 0.2);
    --text-primary: #FFFFFF;
    --text-secondary: #A0AEC0;
    --border-color: rgba(255, 255, 255, 0.05);
}

body.body-html {
    background-color: var(--bg-dark) !important;
    color: var(--text-primary) !important;
    font-family: 'Inter', sans-serif;
}

/* Anulaciones de Bootstrap 4 */
.bg-white { background-color: var(--bg-card) !important; }
.text-dark { color: var(--text-primary) !important; }
.text-muted { color: var(--text-secondary) !important; }

.bg-dark { background: var(--bg-dark) !important; }
.bg-sidebar { background: var(--bg-sidebar) !important; border-bottom: 1px solid rgba(0, 210, 255, 0.2); color: #A0AEC0; }

/* Estilos de las tarjetas de acceso rápido (Modo Oscuro) */
.btn-panel-inicio{
    background-color: #1A2235;
    padding: 2rem;
    padding-top: 2rem;
    padding-bottom: 2.5rem;
    border: 1px solid rgba(0, 210, 255, 0.3);
    margin: 0.3rem;
    text-decoration: none;
    text-align: center;
    color: #FFFFFF;
    border-radius: 12px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    display: block;
    flex: 1;
}
.btn-panel-inicio::before {
    content: '';
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: linear-gradient(135deg, rgba(0, 210, 255, 0.1), transparent);
    opacity: 0;
    transition: all 0.3s ease;
}
.btn-panel-inicio:hover{
    color: #00D2FF;
    border-color: #00D2FF;
    box-shadow: 0 0 20px rgba(0, 210, 255, 0.4);
    text-decoration: none;
    transform: translateY(-2px);
}
.btn-panel-inicio:hover::before {
    opacity: 1;
}
.btn-panel-inicio i {
    color: #00D2FF;
    text-shadow: 0 0 10px rgba(0, 210, 255, 0.5);
    font-size: 2.5rem;
    display: block;
    margin-bottom: 10px;
}
.fs-1{ font-size: 2.5rem; }
.chart-container { position: relative; height: 350px; width: 100%; }

/* Ajustes para el contenedor de gráficos en modo oscuro */
.card-body .text-muted { color: #A0AEC0 !important; }

.card {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    border-radius: 3px;
    box-shadow: none !important;
}
.card-header {
    background-color: transparent !important;
    border-bottom: 1px solid var(--border-color);
}

/* Formularios y Botones */
.form-control {
    background-color: var(--bg-dark);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}
.form-control:focus {
    background-color: var(--bg-dark);
    color: var(--text-primary);
    border-color: var(--accent-blue);
    box-shadow: 0 0 0 0.2rem var(--accent-glow);
}
.btn-primary {
    background-color: var(--accent-blue);
    border-color: var(--accent-blue);
    color: #000;
    font-weight: 600;
}
.btn-primary:hover {
    background-color: #00b8e6;
    border-color: #00b8e6;
    box-shadow: 0 0 15px var(--accent-glow);
}

/* Modales */
.modal-content {
    background-color: var(--bg-card);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}
.modal-header, .modal-footer {
    border-color: var(--border-color);
}
.close { color: var(--text-primary); text-shadow: none; }
.close:hover { color: var(--accent-blue); }

.icon-box{
    padding:0.75rem;
    padding-left:1rem;
    padding-right:1rem;
    border-radius:80px;
    color:white;
    font-size:1.5rem;
}


/* ========================================== */
/* NUEVO ESTILO MODO OSCURO PARA EL MENÚ      */
/* ========================================== */

.list-group {
    background-color: #111827; /* Fondo del menú ligeramente más claro que el body */
    border: none !important;
    box-shadow: none;
}

.list-group-item {
    background-color: transparent;
    border: none;
    color: #A0AEC0; /* Texto gris claro para inactivos */
    transition: all 0.3s ease;
    border-left: 3px solid transparent; /* Indicador de activo */
    padding: 12px 20px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Hover: fondo sutil azul y texto blanco */
.list-group-item:hover {
    background-color: rgba(0, 210, 255, 0.05); 
    color: #FFFFFF;
    text-decoration: none;
}

/* Iconos en azul cian */
.list-group-item i.mdi, 
.list-group-item .icon-menu i {
    color: #00D2FF;
    font-weight: 900;
    font-size: 1.1rem;
    text-shadow: 0 0 8px rgba(0, 210, 255, 0.3);
}

/* Elemento Activo: Borde izquierdo cian, texto cian y fondo sutil */
.list-group-item.active {
    background-color: rgba(0, 210, 255, 0.1) !important;
    color: #00D2FF !important;
    border-left: 3px solid #00D2FF !important;
    text-shadow: 0 0 8px rgba(0, 210, 255, 0.4);
}

/* Botón de menú para móviles */
.btn-primary.d-md-none {
    background-color: #1A2235;
    border: 1px solid #00D2FF;
    color: #00D2FF;
    border-radius: 0;
    font-weight: 600;
}
.btn-primary.d-md-none:hover {
    background-color: #00D2FF;
    color: #000;
}

.fs-3 {
    font-size: 1.3rem;
}


/* ========================================== */
/* ESTILOS DE TABLA EN MODO OSCURO            */
/* ========================================== */
.table-dark-custom {
    color: var(--text-primary);
    background-color: transparent;
}
.table-dark-custom thead th {
    border-bottom: 2px solid var(--accent-blue);
    color: var(--accent-blue);
    background-color: transparent;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}
.table-dark-custom tbody tr {
    border-bottom: 1px solid var(--border-color);
    transition: background-color 0.2s ease;
}
.table-dark-custom tbody tr:hover {
    background-color: rgba(0, 210, 255, 0.05);
}
.table-dark-custom td {
    border-top: none;
    border-bottom: 1px solid var(--border-color);
    vertical-align: middle;
    color: var(--text-primary);
}
.table-dark-custom td small {
    color: var(--text-secondary);
}


/* ========================================== */
/* ESTILOS LOCALES PARA CONTENIDO (MODO OSCURO) */
/* ========================================== */
.text-label {
    font-weight: 600;
    color: var(--accent-blue) !important;
}

.bg-papel {
    background: var(--bg-card) !important;
    color: var(--text-primary);
}
.bg-papel-hf {
    background: var(--bg-sidebar) !important;
    color: var(--text-primary);
}
.post-container {
    max-width: 600px;
    margin: 20px auto;
    background-color: var(--bg-card);
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    border: 1px solid var(--border-color);
}

.post-header {
    padding: 16px;
    border-bottom: 1px solid var(--border-color);
}

.user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-right: 12px;
}

.user-info {
    display: flex;
    align-items: center;
}

.user-name {
    font-weight: bold;
    color: var(--text-primary);
}

.post-content {
    padding: 16px;
    white-space: pre-line;
    color: var(--text-primary);
}

.post-image {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

.post-actions {
    padding: 12px;
    border-top: 1px solid var(--border-color);
}

.action-btn {
    margin-right: 12px;
    color: var(--accent-blue);
    cursor: pointer;
}
.post-title {
    font-weight: 600;
    font-size: 1.2rem;
    color: var(--accent-blue) !important;
}

/* Estilos para las filas de estado de la tabla */
.table-status-danger { background-color: rgba(220, 53, 69, 0.1) !important; color: #ff6b6b !important; border-left: 3px solid #dc3545; }
.table-status-warning { background-color: rgba(255, 193, 7, 0.1) !important; color: #ffc107 !important; border-left: 3px solid #ffc107; }
.table-status-success { background-color: rgba(40, 167, 69, 0.1) !important; color: #28a745 !important; border-left: 3px solid #28a745; }

/* Ajuste para que el editor CKEditor se adapte al fondo oscuro */
.ck-editor__editable_inline {
    background-color: var(--bg-dark) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}
.ck-toolbar {
    background-color: var(--bg-sidebar) !important;
    border-color: var(--border-color) !important;
}
.ck-toolbar__items .ck-button {
    color: var(--text-secondary) !important;
}
.ck-toolbar__items .ck-button:hover {
    background-color: rgba(0, 210, 255, 0.1) !important;
    color: var(--accent-blue) !important;
}

.column {
    height: 100vh;
    overflow-y: scroll;
}
.iframe-drive{
    width: 100%;
    height: 100%;
    border: none;
}