/* Marco claro (encabezado y menú lateral). Sin !important: los colores de Componentes de cada despacho siguen ganando. */
.app-theme-white .app-header,
.app-theme-white .app-footer .app-footer__inner {
    background: var(--sgx-sf, #fff);
}
.app-theme-white .app-header {
    border-bottom: 1px solid var(--sgx-ln3, #e6e8eb);
}
.app-header.header-shadow {
    box-shadow: none;
}
.app-theme-white.fixed-header .app-header__logo {
    background: var(--sgx-sf, #fff);
}
.app-theme-white .app-sidebar {
    background: var(--sgx-sf2, #f4f5f7);
    border-right: 1px solid var(--sgx-ln3, #e6e8eb);
}
.app-sidebar.sidebar-shadow {
    box-shadow: none;
}
/* PerfectScrollbar sólo arranca el del menú si la página tiene un .scrollbar-container; sin él, el final del menú quedaba fuera de vista. */
.app-sidebar .scrollbar-sidebar:not(.ps),
.closed-sidebar:not(.sidebar-mobile-open) .app-sidebar .scrollbar-sidebar:not(.ps) {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--sgx-ln3, #d6d9de) transparent;
}
/* Contraído: sin barra visible (se desplaza con la rueda) y cada icono centrado en un botón de 40px. */
.closed-sidebar:not(.sidebar-mobile-open) .app-sidebar .scrollbar-sidebar:not(.ps) {
    scrollbar-width: none;
}
.closed-sidebar .app-sidebar .app-sidebar__inner {
    padding-left: 20px;
    padding-right: 20px;
}
.closed-sidebar .app-sidebar .app-sidebar__inner .vertical-nav-menu .metismenu-icon {
    left: 50%;
    margin-left: -10px;
}

.app-header .header-user-info > .widget-heading {
    color: var(--sgx-k, #0b0d12);
}
.app-header .header-user-info > .widget-subheading {
    color: var(--sgx-k3, #6b7280);
    opacity: 1;
}
.app-header #btn_embudos_agente,
.app-header #search-input {
    color: var(--sgx-k2, #3f4652);
}
.app-header .search-wrapper .input-holder .search-icon span::after { border-color: #3f4652; }
.app-header .search-wrapper .input-holder .search-icon span::before { background: #3f4652; }
.app-header .hamburger-inner,
.app-header .hamburger-inner::before,
.app-header .hamburger-inner::after {
    background-color: #3f4652;
}
.app-header .hamburger.is-active .hamburger-inner,
.app-header .hamburger.is-active .hamburger-inner::before,
.app-header .hamburger.is-active .hamburger-inner::after {
    background-color: #3f4652;
}

.app-sidebar__heading {
    color: #9aa1ab;
}
.app-sidebar .vertical-nav-menu li a {
    color: var(--sgx-k2, #3f4652);
}
.app-sidebar .vertical-nav-menu li a:hover {
    background: var(--sgx-sf3, #e9ebef);
    color: var(--sgx-k, #0b0d12);
}
.app-sidebar .vertical-nav-menu li a.mm-active,
.app-sidebar .vertical-nav-menu li.mm-active > a {
    background: var(--sgx-tnb, #14243a);
    color: #fff;
}
.app-sidebar .vertical-nav-menu svg.metismenu-icon,
.app-sidebar .vertical-nav-menu svg.metismenu-state-icon {
    fill: var(--sgx-k2, #3f4652);
}
.app-sidebar .vertical-nav-menu li a:hover svg.metismenu-icon {
    fill: var(--sgx-k, #0b0d12);
}
.app-sidebar .vertical-nav-menu li a.mm-active svg.metismenu-icon,
.app-sidebar .vertical-nav-menu li.mm-active > a svg.metismenu-icon {
    fill: var(--sgx-sf, #fff);
}
.app-header #btn_embudos_agente svg {
    fill: var(--sgx-k2, #3f4652);
}

/* Iconos de línea del menú (familia de las tablas) */
.app-sidebar .vertical-nav-menu svg.metismenu-icon.sgx-ic {
    fill: none;
    stroke: currentColor;
    color: var(--sgx-k2, #3f4652);
    width: 20px;
    height: 20px;
    margin-top: -10px;
    stroke-width: 1.7;
}
.app-sidebar .vertical-nav-menu li a:hover svg.metismenu-icon.sgx-ic {
    fill: none;
    color: var(--sgx-k, #0b0d12);
}
.app-sidebar .vertical-nav-menu li a.mm-active svg.metismenu-icon.sgx-ic,
.app-sidebar .vertical-nav-menu li.mm-active > a svg.metismenu-icon.sgx-ic {
    fill: none;
    color: #fff;
}

/* El globo del asistente (#botcito-widget) es fijo abajo a la derecha: deja espacio para que el último botón de la página no quede debajo. */
body:has(#botcito-widget) .app-main__inner { padding-bottom: 96px; }

/* Azules por defecto de Bootstrap (#007bff, #17a2b8, #1db0ff del skin) → color de marca. */
.btn-primary, .btn-info { background-color: var(--sgx-tnb, #3d5266) !important; border-color: var(--sgx-tnb, #3d5266) !important; color: #fff !important; }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active,
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active { background-color: #2f4152 !important; border-color: #2f4152 !important; color: #fff !important; box-shadow: none !important; }
.btn-outline-primary, .btn-outline-info { color: var(--sgx-tnb, #3d5266) !important; border-color: var(--sgx-tnb, #3d5266) !important; background-color: transparent !important; }
.btn-outline-primary:hover, .btn-outline-info:hover { color: #fff !important; background-color: var(--sgx-tnb, #3d5266) !important; }
.badge-primary, .badge-info, .bg-primary, .bg-info { background-color: var(--sgx-tnb, #3d5266) !important; color: #fff !important; }

/* alert-info de Bootstrap (celeste #d1ecf1) → aviso neutro de marca. */
.alert-info { background-color: #eef1f5 !important; border-color: #dfe3e8 !important; color: #3f4652 !important; }
.alert-info .alert-link, .alert-info a:not(.btn) { color: var(--sgx-tnb, #3d5266) !important; }

/* Títulos legacy (h3.tbox-heading.secciones-dashboard): sin ícono inicial y con la tipografía de título de página. */
h3.tbox-heading.secciones-dashboard { font: 600 28px/1.2 "Inter", sans-serif !important; letter-spacing: -.02em; color: var(--sgx-k, #0b0d12) !important; text-transform: none !important; }
h3.tbox-heading.secciones-dashboard > i:first-child, h3.tbox-heading.secciones-dashboard > svg:first-child { display: none !important; }

/* El tema pone en MAYÚSCULAS los encabezados y títulos de tarjeta; la regla de SIGA es mayúscula sólo al inicio. */
.card-header, .card-title { text-transform: none; }

/* Generador de agentes IA: acciones de tarjeta neutras; sólo Eliminar conserva el rojo (en contorno). */
.sgx-acc-agente .btn { background: #fff !important; border-color: #dfe3e8 !important; color: #3f4652 !important; }
.sgx-acc-agente .btn:hover { background: #f3f4f6 !important; color: #0b0d12 !important; }
.sgx-acc-agente .btn-danger { color: #dc2626 !important; }
.sgx-acc-agente .btn-danger:hover { background: #fee2e2 !important; }

/* Cancelar/cerrar de modal: muchos venían como btn-danger. El rojo queda para eliminar; cerrar es secundario. */
.modal .btn-danger[data-dismiss="modal"], .modal .btn.bg-danger[data-dismiss="modal"] { background-color: #fff !important; border-color: #dfe3e8 !important; color: #3f4652 !important; }
.modal .btn-danger[data-dismiss="modal"]:hover, .modal .btn.bg-danger[data-dismiss="modal"]:hover { background-color: #f3f4f6 !important; color: #0b0d12 !important; }

/* Modales largos: el cuerpo hace scroll y el pie (Guardar/Cancelar) siempre queda a la vista. */
.modal .modal-content > .modal-body, .modal .modal-content > form > .modal-body { max-height: calc(100vh - 200px); overflow-y: auto; }

/* Menú «Notificar por correo / WhatsApp» (helper menu_seleccion_plantillas): lista vertical de ancho fijo */
.dropdown-menu.cont_menu_plantilla_general,
.cont_menu_plantilla_general_sistema_wh_api_cloud > .dropdown-menu {
    width: 340px; min-width: 0 !important; max-width: calc(100vw - 24px); max-height: none !important; overflow: hidden !important;
    padding: 0; border: 1px solid var(--sgx-ln, #e3e7ee); border-radius: 12px; box-shadow: 0 12px 32px rgba(15, 23, 42, .16);
}
.dropdown-menu.cont_menu_plantilla_general .dropdown-menu-header { margin: 0; }
.dropdown-menu.cont_menu_plantilla_general .dropdown-menu-header-inner { background: var(--sgx-sf, #fff) !important; padding: 12px 14px 10px !important; border-bottom: 1px solid var(--sgx-ln, #e3e7ee); border-radius: 0; }
.dropdown-menu.cont_menu_plantilla_general .menu-header-title { display: flex; align-items: center; margin: 0 !important; font: 600 14px "Inter", sans-serif; color: var(--sgx-k, #111827) !important; }
.dropdown-menu.cont_menu_plantilla_general .menu-header-title > i { color: var(--sgx-k3, #6b7280) !important; }
.dropdown-menu.cont_menu_plantilla_general .menu-header-title .btn { margin-left: auto; padding: 0 !important; line-height: 1; }
.dropdown-menu.cont_menu_plantilla_general .menu-header-title .btn i { color: var(--sgx-k3, #6b7280) !important; font-size: 14px; }
.dropdown-menu.cont_menu_plantilla_general > .nav { padding: 10px 0 4px; }
.dropdown-menu.cont_menu_plantilla_general .cont_input_search_plantillas_global .input-group { padding: 0 12px !important; }
.dropdown-menu.cont_menu_plantilla_general > div[class^="cont_catalogo_plantillas"] { max-height: 300px; overflow-y: auto; overflow-x: hidden; }
.dropdown-menu.cont_menu_plantilla_general ul.list-unstyled { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; margin: 0; padding: 4px 0 8px; }
.dropdown-menu.cont_menu_plantilla_general ul.list-unstyled > li { width: 100% !important; max-width: 100% !important; flex: 0 0 auto !important; }
.dropdown-menu.cont_menu_plantilla_general ul.list-unstyled > li > a.nav-link { display: flex; align-items: center; gap: 10px; padding: 8px 16px; font: 500 14px/1.35 "Inter", sans-serif; color: var(--sgx-k, #111827) !important; white-space: normal; text-align: left; }
.dropdown-menu.cont_menu_plantilla_general ul.list-unstyled > li > a.nav-link:hover { background: var(--sgx-ln2, #f1f4f8); }
.dropdown-menu.cont_menu_plantilla_general ul.list-unstyled > li > a.nav-link i { margin: 0 !important; width: 16px; text-align: center; color: var(--sgx-k3, #6b7280) !important; flex: none; }
.dropdown-menu.cont_menu_plantilla_general ul.list-unstyled > li > a.nav-link .color-icon-whatsapp { color: #16a34a !important; }
.dropdown-menu.cont_menu_plantilla_general .dropdown-header { padding: 8px 16px 4px; font: 600 11px "Inter", sans-serif; letter-spacing: .05em; text-transform: uppercase; color: var(--sgx-k3, #6b7280); }
.dropdown-menu.cont_menu_plantilla_general .dropdown-header span { text-align: left !important; }
.dropdown-menu.cont_menu_plantilla_general > div[class^="cont_catalogo_plantillas"]::-webkit-scrollbar-thumb { background: #cbd2dc; }