/*
 * Tema Inovo (René, 05-11-2026: "Paleta de colores" y mockups "SGI Inicio Comunidad Inovo" y "SGI Reservas — Prototipo").
 * Se carga después de app.min.css y custom.css, solo en modo claro. Tipografía Poppins; fondo #F3F4F6; menú #263445;
 * acento naranjo Inovo (#E8702A con texto oscuro; #B4531A con texto blanco); estados en fondos suaves con texto oscuro.
 * Contraste mínimo 4,5:1; zonas táctiles de 44 px en pantallas chicas.
 */
:root {
    --in-menu: #263445; --in-azul-oscuro: #1F2A38; --in-fondo: #F3F4F6; --in-blanco: #FFFFFF;
    --in-borde: #E3E7EB; --in-borde-suave: #EEF0F3; --in-texto: #1F2933; --in-texto-2: #3E4A57; --in-texto-3: #5B6775;
    --in-sobre-azul: #D7DEE7; --in-sobre-azul-2: #AEB9C6; --in-sobre-azul-3: #C3CDD8;
    --in-naranjo: #E8702A; --in-naranjo-oscuro: #B4531A; --in-naranjo-texto: #8A3E12; --in-naranjo-texto-2: #6B2F0C;
    --in-barra-1: #F08A4B; --in-barra-2: #F5A26B; --in-barra-3: #F8C29C; --in-naranjo-claro: #FDE7D6;
    --in-rojo-bg: #FDE2E1; --in-rojo: #9B1C1C; --in-rojo-cifra: #C92A2A;
    --in-verde-bg: #E6F4EA; --in-verde: #1E6B34; --in-azul-bg: #E8EEF7; --in-azul: #24467A;
    --in-morado-bg: #F3EAFB; --in-morado: #5B2A86; --in-gris-bg: #F1F3F5; --in-en-vivo: #D9480F;
    --in-radio-lg: 14px; --in-radio: 10px; --in-radio-chip: 6px;
}

/* ---- Base ---- */
body, .tooltip, .popover, .swal2-popup { font-family: 'Poppins', system-ui, sans-serif; }
body { background: var(--in-fondo); color: var(--in-texto); font-size: 14px; }
.page-content { background: var(--in-fondo); }
h1, h2, h3, h4, h5, h6, .h4, .h5 { color: var(--in-texto); font-weight: 600; }
h4, .h4 { font-size: 22px; } h5, .h5 { font-size: 18px; } h6, .h6 { font-size: 14px; }
.text-muted { color: var(--in-texto-3) !important; }
small, .small { font-size: 12.5px; }
a { color: var(--in-naranjo-oscuro); }
a:hover { color: var(--in-naranjo-texto); }
.text-primary { color: var(--in-naranjo-oscuro) !important; }
.text-success { color: var(--in-verde) !important; }
.text-danger { color: var(--in-rojo-cifra) !important; }
.text-warning { color: var(--in-naranjo-texto) !important; }
.text-info { color: var(--in-azul) !important; }
.bg-light { background-color: var(--in-gris-bg) !important; }
hr { border-top-color: var(--in-borde-suave); }

/* ---- Menú lateral ---- */
.vertical-menu, body[data-sidebar=dark] .vertical-menu { background: var(--in-menu); }
.navbar-brand-box, body[data-sidebar=dark] .navbar-brand-box { background: var(--in-menu); }
#sidebar-menu ul li a, body[data-sidebar=dark] #sidebar-menu ul li a { color: var(--in-sobre-azul); font-size: 14px; border-radius: var(--in-radio); margin: 1px 10px; padding: .55rem 1rem; }
#sidebar-menu ul li a i, body[data-sidebar=dark] #sidebar-menu ul li a i { color: var(--in-sobre-azul-2); }
#sidebar-menu ul li ul.sub-menu li a, body[data-sidebar=dark] #sidebar-menu ul li ul.sub-menu li a { color: var(--in-sobre-azul-3); padding: .4rem 1rem .4rem 3rem; font-size: 13px; }
#sidebar-menu ul li a:hover, #sidebar-menu ul li a:hover i, body[data-sidebar=dark] #sidebar-menu ul li a:hover, body[data-sidebar=dark] #sidebar-menu ul li a:hover i { color: #FFFFFF; }
#sidebar-menu .mm-active > a, #sidebar-menu .mm-active > a i, #sidebar-menu ul li a.active, #sidebar-menu ul li a.active i,
body[data-sidebar=dark] #sidebar-menu .mm-active > a, body[data-sidebar=dark] #sidebar-menu .mm-active > a i, body[data-sidebar=dark] #sidebar-menu ul li a.active { color: #FFFFFF !important; }
/* Ítem activo (sin hijos): naranjo principal con texto oscuro (René: no blanco). */
#sidebar-menu ul li a.sgi-activo, body[data-sidebar=dark] #sidebar-menu ul li a.sgi-activo, #sidebar-menu .mm-active > a.sgi-activo { background: var(--in-naranjo); color: var(--in-texto) !important; font-weight: 600; }
#sidebar-menu ul li a.sgi-activo i, #sidebar-menu .mm-active > a.sgi-activo i { color: var(--in-texto) !important; background: transparent; }
#sidebar-menu ul li ul.sub-menu li a.sgi-activo { margin: 1px 10px 1px 22px; padding-left: 1.6rem; }
.menu-title, body[data-sidebar=dark] .menu-title { color: var(--in-sobre-azul-2) !important; font-size: 11px; letter-spacing: .06em; }
#sidebar-menu .sgi-menu-separador { border-top: 1px solid rgba(215, 222, 231, .15); margin: .6rem 1.2rem; }
#sidebar-menu .badge { background: var(--in-naranjo); color: var(--in-texto); }

/* ---- Barra superior ---- */
#page-topbar { background: var(--in-blanco); box-shadow: 0 1px 0 var(--in-borde); }

/* ---- Tarjetas ---- */
.card { border: 1px solid var(--in-borde); border-radius: var(--in-radio-lg); box-shadow: none; }
.card-header { background: var(--in-blanco); border-bottom: 1px solid var(--in-borde-suave); border-radius: var(--in-radio-lg) var(--in-radio-lg) 0 0 !important; }
.card .card { border-radius: var(--in-radio); }
.border, .border-top, .border-bottom, .border-left, .border-right { border-color: var(--in-borde) !important; }
.rounded { border-radius: var(--in-radio) !important; }
.modal-content { border-radius: var(--in-radio-lg); border: none; }

/* ---- Botones ---- */
.btn { border-radius: 8px; font-weight: 500; }
.btn-primary, .btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active { background: var(--in-naranjo-oscuro); border-color: var(--in-naranjo-oscuro); color: #FFFFFF; }
.btn-primary:hover, .btn-primary:focus { background: var(--in-naranjo-texto); border-color: var(--in-naranjo-texto); color: #FFFFFF; }
.btn-outline-primary { color: var(--in-naranjo-oscuro); border-color: var(--in-naranjo-oscuro); background: var(--in-blanco); }
.btn-outline-primary:hover, .btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active { background: var(--in-naranjo-oscuro); border-color: var(--in-naranjo-oscuro); color: #FFFFFF; }
.btn-secondary { background: var(--in-texto-2); border-color: var(--in-texto-2); }
.btn-outline-secondary { color: var(--in-texto-2); border-color: #C9D0D8; background: var(--in-blanco); }
.btn-outline-secondary:hover { background: var(--in-gris-bg); color: var(--in-texto); border-color: #C9D0D8; }
.btn-success { background: var(--in-verde); border-color: var(--in-verde); }
.btn-outline-success { color: var(--in-verde); border-color: var(--in-verde); }
.btn-outline-success:hover { background: var(--in-verde); color: #FFFFFF; }
.btn-danger { background: var(--in-rojo); border-color: var(--in-rojo); }
.btn-outline-danger { color: var(--in-rojo); border-color: #E7A3A3; background: var(--in-blanco); }
.btn-outline-danger:hover { background: var(--in-rojo-bg); color: var(--in-rojo); border-color: #E7A3A3; }
.btn-link { color: var(--in-naranjo-oscuro); }
.btn-link:hover { color: var(--in-naranjo-texto); }
.btn:focus, .form-control:focus, .custom-select:focus { box-shadow: 0 0 0 .2rem rgba(232, 112, 42, .25); }
@media (max-width: 991.98px) {
    .btn, .form-control, .custom-select, .nav-tabs .nav-link { min-height: 44px; }
    .btn-sm { min-height: 36px; }
}

/* ---- Formularios ---- */
.form-control, .custom-select, .select2-container--default .select2-selection--single { border-color: var(--in-borde); border-radius: 8px; color: var(--in-texto); }
.form-control:focus { border-color: var(--in-naranjo); }
label { color: var(--in-texto-2); font-weight: 500; }

/* ---- Chips (badges) y avisos ---- */
.badge { border-radius: var(--in-radio-chip); font-size: 11px; font-weight: 600; padding: .32em .6em; }
.badge-success { background: var(--in-verde-bg); color: var(--in-verde); }
.badge-danger { background: var(--in-rojo-bg); color: var(--in-rojo); }
.badge-warning { background: var(--in-naranjo-claro); color: var(--in-naranjo-texto); }
.badge-info, .badge-primary { background: var(--in-azul-bg); color: var(--in-azul); }
.badge-secondary, .badge-light, .badge-dark { background: var(--in-gris-bg); color: var(--in-texto-2); }
.alert { border-radius: var(--in-radio); border: none; }
.alert-info, .alert-light { background: var(--in-azul-bg); color: var(--in-azul); }
.alert-success { background: var(--in-verde-bg); color: var(--in-verde); }
.alert-warning { background: var(--in-naranjo-claro); color: var(--in-naranjo-texto); }
.alert-danger { background: var(--in-rojo-bg); color: var(--in-rojo); }
.alert-secondary { background: var(--in-gris-bg); color: var(--in-texto-2); }

/* ---- Tablas ---- */
.table { color: var(--in-texto); }
.table thead th, .table th { color: var(--in-texto-3); font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; border-bottom: 1px solid var(--in-borde); border-top: none; }
.table td { border-top: 1px solid var(--in-borde-suave); vertical-align: middle; }
.table-primary, .table-primary > td { background: var(--in-naranjo-claro); }
.table-striped tbody tr:nth-of-type(odd) { background: #FAFBFC; }

/* ---- Pestañas ---- */
.nav-tabs { border-bottom: 1px solid var(--in-borde); }
.nav-tabs .nav-link { color: var(--in-texto-3); border: none; border-bottom: 2px solid transparent; font-weight: 500; }
.nav-tabs .nav-link:hover { color: var(--in-texto); border-color: transparent; }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: var(--in-texto); background: transparent; border: none; border-bottom: 2px solid var(--in-naranjo); font-weight: 600; }

/* ---- Tableros (Pipeline, Operaciones, Banco) ---- */
#crm-board > section, #pv-board > section { background: var(--in-borde-suave) !important; border: none !important; border-radius: 12px !important; }
#crm-board > section > h6, #pv-board > section > .card-header { background: transparent; border: none; font-size: 13px; font-weight: 600; color: var(--in-texto); }
#crm-board > section .border.rounded.bg-white, #pv-board > section .card-body > .border.rounded { border: 1px solid var(--in-borde) !important; border-radius: var(--in-radio) !important; box-shadow: 0 1px 2px rgba(31, 41, 51, .04); }
#crm-board > section .btn-link, #pv-board strong.d-block { color: var(--in-naranjo-oscuro); font-weight: 600; }
#pv-board .border-danger { border-color: #E7A3A3 !important; }
.crm-owner-badge { font-family: 'Poppins', system-ui, sans-serif; }

/* ---- Componentes del tema (ficha, inicio) ---- */
.in-chip { display: inline-block; border-radius: var(--in-radio-chip); font-size: 11px; font-weight: 600; padding: .25em .6em; background: var(--in-naranjo-claro); color: var(--in-naranjo-texto); }
.in-caja { background: var(--in-blanco); border: 1px solid var(--in-borde); border-radius: var(--in-radio-lg); padding: 16px 18px; margin-bottom: 14px; }
.in-caja-titulo { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--in-texto-3); margin-bottom: 6px; }
.in-dato-label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--in-texto-3); }
.in-progreso { display: flex; gap: 4px; margin: 10px 0 6px; }
.in-progreso > div { flex: 1; font-size: 12px; color: var(--in-texto-3); }
.in-progreso > div::before { content: ''; display: block; height: 5px; border-radius: 3px; background: var(--in-borde); margin-bottom: 6px; }
.in-progreso > div.hecho::before { background: var(--in-naranjo); }
.in-progreso > div.actual { color: var(--in-texto); font-weight: 600; }
.in-progreso > div.actual::before { background: var(--in-naranjo); }
.in-siguiente { background: #FFF6EF; border: 1px solid #F6D3BC; border-radius: 8px; padding: 8px 12px; font-size: 13px; }
details.in-plegable > summary { cursor: pointer; font-weight: 600; list-style: none; }
details.in-plegable > summary::-webkit-details-marker { display: none; }
details.in-plegable > summary::after { content: '▾'; float: right; color: var(--in-texto-3); }
details.in-plegable:not([open]) > summary::after { content: '▸'; }
.in-linea-tiempo > div { border-left: 2px solid var(--in-borde); padding: 0 0 10px 12px; margin-left: 4px; }
/* Ítem activo dentro de un grupo: le gana a la regla del tema (ul.sub-menu li a { background: none }). */
#sidebar-menu ul li ul.sub-menu li a.sgi-activo, #sidebar-menu ul li.mm-active ul.sub-menu li a.sgi-activo { background: var(--in-naranjo) !important; color: var(--in-texto) !important; font-weight: 600; border-radius: var(--in-radio); }
#sidebar-menu ul li ul.sub-menu li a.sgi-activo i, #sidebar-menu ul li.mm-active ul.sub-menu li a.sgi-activo i { color: var(--in-texto) !important; background: transparent !important; }