/* ============================================================
   SYSTEM.CSS - Estilos complementarios del sistema
   Tema: Futuro Venezuela (colores del logo)
   ============================================================ */

/* Colores corporativos */
:root {
    --fv-primary: #d0595b;
    --fv-primary-dark: #b84547;
    --fv-secondary: #274793;
    --fv-secondary-dark: #1a3266;
    --fv-accent: #274793;
    --fv-bg-gradient: linear-gradient(135deg, #d0595b, #b84547);
}

/* TABLAS personalizadas */
.table-system { width: 100% !important; border-collapse: collapse; font-size: 12px; }
.table-system thead th { background: var(--fv-secondary); color: white; padding: 8px 6px; font-size: 11px; text-align: center; font-weight: 600; white-space: nowrap; }
.table-system tbody td { padding: 5px 6px; vertical-align: middle; border-bottom: 1px solid #e9ecef; }
.table-system tbody tr:hover { background: #fef0f0; }
.table-system tfoot th { background: #f8f9fa; font-weight: bold; padding: 6px; }
.table-system .text-right { text-align: right !important; }
.table-system .text-center { text-align: center !important; }

/* SMALL BOX - Cards resumen */
.small-box { border-radius: 8px; color: #fff; margin-bottom: 20px; position: relative; overflow: hidden; }
.small-box .inner { padding: 15px; }
.small-box .inner h3 { font-size: 28px; font-weight: bold; margin: 0; }
.small-box .inner p { font-size: 14px; margin: 5px 0 0 0; opacity: 0.85; }
.small-box .icon { position: absolute; top: 10px; right: 15px; font-size: 50px; opacity: 0.15; }
.small-box.bg-info { background: linear-gradient(135deg, #d0595b, #e87373); }
.small-box.bg-success { background: linear-gradient(135deg, #11998e, #38ef7d); }
.small-box.bg-warning { background: linear-gradient(135deg, #f093fb, #f5576c); }
.small-box.bg-danger { background: linear-gradient(135deg, #b84547, #d0595b); }
.small-box.bg-primary { background: linear-gradient(135deg, #274793, #3a5cb8); }
.small-box.bg-secondary { background: linear-gradient(135deg, #6c757d, #495057); }

/* BOTONES */
.btn-xs { padding: 2px 6px; font-size: 11px; }
.btn-primary { background-color: var(--fv-secondary); border-color: var(--fv-secondary); }
.btn-primary:hover { background-color: var(--fv-secondary-dark); border-color: var(--fv-secondary-dark); }

/* SELECT2 sobre AdminLTE */
.select2-container--bootstrap4 .select2-selection--single { height: calc(1.5em + .75rem + 2px); }

/* DataTables ajustes */
.dt-buttons .btn { padding: 3px 8px; font-size: 11px; }
.dataTables_filter input { height: 28px; font-size: 12px; }
.dataTables_length select { height: 28px; font-size: 12px; padding: 2px; }

/* Utilidades */
.oculto { display: none !important; }

/* SIDEBAR - fondo coral del logo */
.main-sidebar { background: var(--fv-bg-gradient) !important; }
.brand-link { border-bottom: 1px solid rgba(255,255,255,0.15) !important; }
.nav-sidebar .nav-link.active { background: rgba(39,71,147,0.5) !important; }
.nav-sidebar .nav-link:hover { background: rgba(255,255,255,0.15) !important; }
.nav-sidebar .nav-treeview > .nav-item > .nav-link.active { background: rgba(39,71,147,0.4) !important; }

/* NAVBAR */
.main-header.navbar { border-bottom: 3px solid var(--fv-secondary) !important; }

/* CONTENT HEADER */
.content-header h1 { color: var(--fv-secondary); font-weight: 600; }

/* CARD header */
.card.card-primary.card-outline { border-top: 3px solid var(--fv-secondary); }
.modal-header.bg-primary { background: var(--fv-secondary) !important; }

/* BADGES */
.badge-info { background-color: var(--fv-primary); }

/* RESPONSIVE */
@media (max-width: 768px) {
    .table-system { font-size: 10px; }
    .small-box .inner h3 { font-size: 20px; }
}