/* =====================================================================
   Identidad Infogob (blanco · rojo · negro). Capa única de marca:
   1) tokens de identidad, 2) menú lateral y barra superior, 3) acentos
   del kit. Los colores de acción por significado (ver, editar, eliminar,
   aprobar, PDF, Excel) NO se tocan aquí: siguen en kit.css.
   Para volver a la identidad anterior basta quitar este archivo.
   ===================================================================== */
:root {
  --ink: #1D1A1B;          /* negro Infogob (tomado del logo) */
  --ink-2: #2A2627;        /* negro elevado: hover, tarjetas sobre negro */
  --ink-3: #353031;
  --brand: #D8231A;        /* rojo Infogob: solo acentos finos, nunca relleno de botón */
  --brand-tint: rgba(216, 35, 26, .18);
  --paper: #F4F4F5;
  --on-dark: #B9B3B5;
  --on-dark-2: #8d8689;
  --kit-blue: var(--brand); /* acento/foco del kit; «ver» conserva su azul más abajo */
  --sh-blue: var(--brand);
  --sh-blue-soft: #F1F1F2;
  --sh-soft: #F4F4F5;
  --sh-tile: #F1F1F2;
  /* Menú lateral (opción elegida: blanco) */
  --menu-bg: #fff; --menu-border: 1px solid #E4E4E7; --menu-line: #ECECEE;
  --menu-text: #4a4446; --menu-icon: #9a9396; --menu-hover: #F4F4F5;
  --menu-act-bg: #FDECEA; --menu-act-text: var(--ink); --menu-act-icon: var(--brand); --menu-bar: var(--brand);
  --menu-user: #F4F4F5; --menu-user-text: var(--ink); --menu-user-line: #E4E4E7;
  --menu-word-a: var(--ink); --menu-word-b: var(--brand);
  --menu-brand-bg: #fff; /* bloque del logo (blanco) */
  --menu-mark-color: block; --menu-mark-light: none; /* qué versión del logo se muestra según el fondo del bloque */
  /* Encabezado (opción elegida: rojo) */
  --top-bg: #C81E16; --top-line: #C81E16; --top-text: rgba(255, 255, 255, .86); --top-cur: #fff; --top-icon: #fff;
  --top-hover: rgba(255, 255, 255, .15); --top-underline: #fff; --strip: var(--ink);
}
body, .wrapper .main-panel, .main-panel { background: var(--paper); }

/* ------------------------- Menú lateral (por variables) ------------------------- */
.eice-sidebar .eice-brand { height: 64px; display: flex; align-items: center; padding: 0 22px; border-bottom: 1px solid var(--menu-line); margin-bottom: 4px; background: var(--menu-brand-bg); }
.eice-sidebar .eice-brand a { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.eice-sidebar .eice-brand img { height: 34px; width: auto; }
.eice-sidebar .eice-mark--color { display: var(--menu-mark-color); }
.eice-sidebar .eice-mark--light { display: var(--menu-mark-light); }
.eice-brand-word { font-family: 'Archivo', 'Titillium Web', 'Segoe UI', sans-serif; font-weight: 800; font-size: 21px; letter-spacing: .01em; line-height: 1; color: var(--menu-word-a); }
.eice-brand-word b { color: var(--menu-word-b); font-weight: 800; }

.eice-sidebar[data-color="white"], .eice-sidebar[data-color="white"]::after { background: var(--menu-bg) !important; border-right: var(--menu-border); }
.eice-sidebar .logo::after { display: none !important; }
.eice-sidebar .user { margin: 14px 14px 6px !important; background: var(--menu-user) !important; border: 1px solid var(--menu-user-line); }
.eice-sidebar .user .photo { background: #fff; border-color: var(--menu-user-line); }
.eice-sidebar[data-color] .user .info > a > span { color: var(--menu-user-text) !important; }
.eice-sidebar .user .info .caret { color: var(--menu-icon); }
.eice-sidebar .user .info > a:focus-visible { outline-color: var(--brand); }
.eice-sidebar .eice-user-menu { background: var(--menu-user) !important; border-top: 1px solid var(--menu-user-line); }
.eice-sidebar[data-color] .user .eice-user-menu li > a,
.eice-sidebar[data-color] .user .eice-user-menu li > a .sidebar-normal,
.eice-sidebar[data-color] .user .eice-user-menu li > a span { color: var(--menu-text) !important; }
.eice-sidebar[data-color] .user .eice-user-menu li > a i { color: var(--menu-icon) !important; }
.eice-sidebar .eice-user-menu li > a:hover { background: rgba(0, 0, 0, .05); }
.eice-sidebar[data-color] .user .eice-user-menu li > a:hover,
.eice-sidebar[data-color] .user .eice-user-menu li > a:hover .sidebar-normal,
.eice-sidebar[data-color] .user .eice-user-menu li > a:hover span { color: var(--ink) !important; }
.eice-sidebar[data-color] .user .eice-user-menu li > a:hover i { color: var(--brand) !important; }

.eice-sidebar .sidebar-wrapper > .nav { margin-top: 10px; padding: 0 14px; }
.eice-sidebar .sidebar-wrapper > .nav > li > a { height: 42px; margin: 1px 0 0 !important; padding: 0 12px !important; border-radius: 10px; gap: 14px; color: var(--menu-text) !important; }
.eice-sidebar .sidebar-wrapper > .nav > li > a i { width: 22px; height: 22px; background: transparent; border-radius: 0; font-size: 16px; color: var(--menu-icon) !important; }
.eice-sidebar .sidebar-wrapper > .nav > li > a p { font-size: 14px; font-weight: 600; }
.eice-sidebar .sidebar-wrapper > .nav > li > a:hover { background: var(--menu-hover); color: var(--ink) !important; }
.eice-sidebar .sidebar-wrapper > .nav > li > a:hover i { background: transparent; color: var(--ink) !important; }
.eice-sidebar .sidebar-wrapper > .nav > li > a:focus-visible { outline-color: var(--brand); }
.eice-sidebar[data-color][data-active-color] .sidebar-wrapper > .nav > li.active > a { background: var(--menu-act-bg); color: var(--menu-act-text) !important; box-shadow: none; position: relative; }
.eice-sidebar[data-color][data-active-color] .sidebar-wrapper > .nav > li.active > a i { background: transparent; color: var(--menu-act-icon) !important; }
.eice-sidebar[data-color][data-active-color] .sidebar-wrapper > .nav > li.active > a p { font-weight: 700; }
/* Barra del módulo activo (el tema traía una flecha: se sustituye) */
.eice-sidebar.sidebar[data-color][data-active-color] .sidebar-wrapper > .nav > li.active > a::before { display: block !important; content: '' !important; position: absolute; left: -14px !important; right: auto !important; top: 9px !important; bottom: 9px !important; width: 4px !important; min-width: 0 !important; padding: 0 !important; box-sizing: border-box !important; height: auto !important; max-height: none !important; transform: none !important; margin: 0 !important; border: 0; border-radius: 0 4px 4px 0; background: var(--menu-bar); }
.eice-sidebar .sidebar-wrapper::-webkit-scrollbar { width: 6px; }
.eice-sidebar .sidebar-wrapper::-webkit-scrollbar-thumb { background: #D4D4D8; border-radius: 6px; }

/* ----------------------- Encabezado (migas + submódulos + iconos) ----------------------- */
.eice-topbar { background-color: var(--ink) !important; }
.eice-topbar .dropdown-menu .dropdown-item:hover i, .eice-topbar .dropdown-menu .dropdown-item:focus i { color: var(--brand); }
@media (min-width: 992px) {
  .eice-topbar { background: transparent !important; box-shadow: none !important; pointer-events: none; }
  .eice-topbar .navbar-nav, .eice-topbar .dropdown-menu { pointer-events: auto; }
  .eice-topbar .navbar-nav .nav-link, .eice-topbar .navbar-nav .nav-link i, .eice-topbar .navbar-nav .nav-link p { color: var(--top-icon) !important; }
  .eice-topbar .navbar-nav .nav-link:hover { background: var(--top-hover); border-radius: 8px; }
  .eice-topbar .navbar-nav .nav-link .caret, .eice-topbar .navbar-nav .nav-link b.caret { border-top-color: var(--top-icon); }
  /* Dos niveles: franja de color (migas + iconos) y, debajo, la barra blanca de submódulos */
  .main-panel > .eice-subnav { margin-top: 0 !important; height: auto !important; display: block; padding: 0; background: #fff !important; border-bottom: 1px solid var(--line, #E4E4E7) !important; }
  .main-panel > .eice-subnav > .container-fluid { display: block; position: relative; min-height: 64px; padding: 64px 36px 0; }
  .main-panel > .eice-subnav:not(:has(#navigation .nav-item)) > .container-fluid { padding-top: 0; }
  .main-panel > .eice-subnav .navbar-wrapper { position: absolute; top: 0; left: 0; right: 0; height: 64px; display: flex; align-items: center; padding: 0 36px; background: var(--top-bg); border-bottom: 1px solid var(--top-line); z-index: 1; margin: 0; }
  .main-panel > .eice-subnav #navigation { display: flex !important; margin-top: 0; min-height: 52px; align-items: center; }
  .main-panel > .eice-subnav:not(:has(#navigation .nav-item)) #navigation { display: none !important; min-height: 0; }
  .main-panel > .eice-subnav #navigation .navbar-nav { flex-wrap: nowrap; }
  /* migas (sobre la franja de color) */
  .main-panel > .eice-subnav .eice-crumbs .breadcrumb-item > a { color: var(--top-text) !important; }
  .main-panel > .eice-subnav .eice-crumbs .breadcrumb-item > a:hover { color: var(--top-cur) !important; }
  .eice-crumbs .breadcrumb-item + .breadcrumb-item::before { color: var(--top-text); opacity: .7; }
  .eice-crumbs .breadcrumb-item.active span { color: var(--top-cur); }
  /* submódulos (barra blanca): texto oscuro, activo con subrayado rojo */
  .eice-subnav #navigation .navbar-nav .nav-link p, .eice-subnav #navigation .navbar-nav .nav-link p.text-dark { color: #4a4446 !important; }
  .eice-subnav #navigation .navbar-nav .nav-link:hover { background: var(--paper); }
  .eice-subnav #navigation .navbar-nav .nav-link:hover p { color: var(--ink) !important; }
  .eice-subnav #navigation .navbar-nav .nav-link.is-current { background: transparent; }
  .eice-subnav #navigation .navbar-nav .nav-link.is-current p { color: var(--ink) !important; font-weight: 700; }
  .eice-subnav #navigation .navbar-nav .nav-link.is-current::after { background: var(--brand); bottom: -7px; }
  .eice-subnav .navbar-nav .nav-link .caret, .eice-subnav .navbar-nav .nav-link b.caret { border-top-color: #4a4446; }
}
.kit-tab-more .dropdown-item.is-current, .eice-subnav .dropdown-menu .dropdown-item.is-current { background: var(--paper); color: var(--ink) !important; }
@media (max-width: 991px) { .eice-subnav #navigation .navbar-nav .nav-link.is-current { background: var(--paper); } .eice-subnav #navigation .navbar-nav .nav-link.is-current::after { background: var(--brand); } }

/* ------------------------------ Acentos del kit ------------------------------ */
/* Botón de formulario principal: negro (el rojo de marca nunca rellena un botón) */
.kit-btn-solid { background: var(--ink); }
.kit-btn-solid:hover { background: var(--ink-2); }
/* «Ver» conserva su azul (color de acción por significado) */
.kit-act--view { background: #2563eb; }
/* Etiquetas e iconos de sección en neutro (antes azul claro) */
.kit-tag { background: #F1F1F2; color: var(--ink); }
.kit-pop-icon, .kit-section-icon { background: #F1F1F2; color: var(--ink); }
.kit-switch input:checked + .kit-switch-track { background: var(--ink); }
/* Foco de campos: borde negro con halo rojo suave */
.kit-control:focus, .kit-form .form-control:focus, .kit-form .custom-file-input:focus ~ .custom-file-label,
.select2-dropdown.kit-s2-drop .select2-search--dropdown .select2-search__field:focus { border-color: var(--ink); box-shadow: 0 0 0 3px var(--brand-tint); }
.kit-form .select2-container--default.select2-container--focus .select2-selection { border-color: var(--ink); }
.kit-back:hover, .kit-back:focus { color: var(--brand); }

/* Formulario de contrato (ct-): acentos de marca */
.ct-form .ct-subtitle { border-left-color: var(--brand); }
.ct-form .ct-tabs .nav-link.active .ct-step-ico { background: var(--ink); color: #fff; }
.ct-form .ct-contract-ref { background: #F1F1F2; color: var(--ink); }
.ct-form .ct-pane-title { color: var(--ink); }
/* «Ver» = azul también dentro de las pestañas del contrato */
.ct-form .tab-pane .btn:has(> i.fa-eye) { background: #2563eb; border-color: #2563eb; color: #fff; }
.ct-form .tab-pane .btn:has(> i.fa-eye):hover { background: #1d4ed8; border-color: #1d4ed8; }

/* =====================================================================
   Refinamiento estético del panel (v2)
   ===================================================================== */

/* --- Tarjetas de listado: filtro en la misma fila que los botones --- */
.kit-card > .card-header { padding: 24px 28px 20px; }
.kit-card > .card-header:has(.kit-search-row) { position: relative; }
.kit-card > .card-header:has(.kit-search-row) > .kit-header-row { padding-right: 54px; }
.kit-card > .card-header > .kit-search-row, .kit-card > .card-header > form > .kit-search-row { position: absolute; top: 24px; right: 28px; margin: 0; }
.kit-card > .card-header > form { position: static; }

/* --- Títulos con la tipografía de marca --- */
.kit-title, .kit-page-head .kit-title { font-family: 'Archivo', 'Titillium Web', 'Segoe UI', sans-serif; font-weight: 800; letter-spacing: -.01em; color: var(--ink); }
.kit-subtitle { color: #6B6468; }

/* --- Tabla: cabecera tenue, filas aireadas, avatares neutros --- */
.kit-table thead th { background: #FAFAFB; color: #5b5558; font-weight: 700; border-top: 1px solid var(--kit-line); border-bottom: 1px solid var(--kit-line); }
.kit-table thead th:first-child { border-top-left-radius: 8px; } .kit-table thead th:last-child { border-top-right-radius: 8px; }
.kit-table tbody tr:hover td { background: #FAFAFB; }
.kit-table tbody td { padding-top: 14px; padding-bottom: 14px; }
.kit-avatar { background: #F1F1F2; color: var(--ink); }
.kit-avatar--company { background: #F1F1F2; color: var(--ink); }
.kit-person-name { font-weight: 700; color: var(--ink); }

/* Pagos: pestañas con acento de marca (antes turquesa) */
.pagos-tab.active { color: var(--ink); border-bottom-color: var(--brand); }
.pagos-tab.active .pagos-tab-count { background: #F1F1F2; color: var(--ink); }
.pagos-title { font-family: 'Archivo', 'Titillium Web', sans-serif; font-weight: 800; letter-spacing: -.01em; color: var(--ink); }

/* =====================================================================
   v3 — «Libro mayor»: la línea roja del contador como firma de marca.
   Una cinta roja superior, una marca corta bajo cada título, filetes
   negros en las tablas y el rojo respondiendo a la interacción.
   El rojo sigue sin rellenar superficies grandes ni botones en reposo.
   ===================================================================== */

/* Cinta de marca en todo el ancho */
body::before { content: ''; position: fixed; top: 0; left: 0; right: 0; height: 3px; background: var(--strip); z-index: 2000; pointer-events: none; }

/* Título de pantalla con su marca roja */
.kit-card > .card-header .kit-header-row .kit-title,
.kit-page-head .kit-title { font-size: 26px; line-height: 1.1; }
.kit-card > .card-header .kit-header-row .kit-title::after,
.kit-page-head .kit-title::after { content: ''; display: block; width: 30px; height: 3px; margin-top: 9px; border-radius: 2px; background: var(--brand); }
.kit-card > .card-header .kit-header-row .kit-subtitle, .kit-page-head .kit-subtitle { margin-top: 8px; }

/* Botones principales: negros en reposo, rojos al interactuar */
.kit-btn--create, .kit-btn-solid, .kit-filter-btn, .btn-doc-primary { transition: background-color .15s ease, transform .15s ease; }
.kit-btn--create:hover, .kit-btn-solid:hover, .kit-filter-btn:hover, .btn-doc-primary:hover { background: var(--brand) !important; color: #fff; }
.kit-btn--create:active, .kit-btn-solid:active, .kit-filter-btn:active { transform: translateY(1px); }

/* Pestañas de sección y de formulario: subrayado rojo en la activa */
.kit-tab.is-active, .kit-tab-more > .kit-tab.is-active { box-shadow: 0 1px 3px rgba(29,26,27,.12), inset 0 -3px 0 var(--brand); }
.ct-form .ct-tabs .nav-link.active { box-shadow: 0 2px 8px rgba(29,26,27,.10), inset 0 -3px 0 var(--brand); }
.pagos-tab.active { border-bottom-width: 3px; }

/* Tablas de libro mayor: filete negro bajo la cabecera */
.kit-table thead th { border-bottom: 1px solid #D4D4D8; }
.kit-table thead th:first-child, .kit-table thead th:last-child { border-top-left-radius: 0; border-top-right-radius: 0; }
.kit-table tbody td { border-top: 1px solid #ECECEE; }
.kit-table tbody tr:hover td { background: #FBFAFA; }
.kit-table tbody tr:hover td:first-child { box-shadow: inset 3px 0 0 var(--brand); }

/* Tarjetas: sin sombra pesada, borde fino; el contenedor principal más redondeado */
.kit-card { border-color: #E4E4E7; box-shadow: none; border-radius: 14px; }
.kit-card > .card-header { border-bottom-color: #ECECEE; border-radius: 14px 14px 0 0; }

/* Estados e indicadores */
.kit-filter-badge { background: var(--brand); }
.pagos-tab-count--danger { background: #FDECEA; color: var(--brand); }
a:hover, .kit-back:hover { color: var(--brand); }
.kit-pg li.is-current > span { background: var(--ink); box-shadow: inset 0 -3px 0 var(--brand); }

/* Etiquetas heredadas (jl-): el azul decorativo pasa a neutro; el ámbar de «sin vigencia» se conserva */
.jl-year-badge:not(.jl-year-badge--missing), .jl-type-badge { background: #F1F1F2 !important; color: var(--ink) !important; }

/* Títulos de modales y tarjetas: sentence case (el tema pone h5/h6 en mayúsculas) */
.modal-content h5, .modal-content h6, .kit-card h5, .kit-card h6, .kit-modal h5, .kit-modal h6 { text-transform: none; letter-spacing: 0; }

/* Cifras de dashboards (regla): nunca se desbordan; el tamaño se ajusta al ancho y los dígitos alinean */
.bl-stat-value, .pd-stat-value, .dse-stat-value, .pp-kpi-value, .cta-kpi-value, .cta-stat-value, .kit-stat-value { white-space: nowrap; font-variant-numeric: tabular-nums; font-size: clamp(14px, 1.12vw, 19px); }
.cta-total-value { white-space: nowrap; font-variant-numeric: tabular-nums; font-size: clamp(20px, 1.9vw, 28px); }
.bl-stat > div, .dse-stat > div, .pp-kpi-body, .kit-stat > div { min-width: 0; }
.kit-table td.is-right, .kit-table td.is-num, .kit-table th.is-right, .kit-table th.is-num { font-variant-numeric: tabular-nums; text-align: right; }

/* Botones adosados a un campo (buscar, agregar): neutros, sin el azul heredado del tema */
.kit-form .input-group-append .btn-primary, .kit-form .input-group-prepend .btn-primary { background: var(--ink); border-color: var(--ink); color: #fff; }
.kit-form .input-group-append .btn-primary:hover, .kit-form .input-group-prepend .btn-primary:hover { background: var(--brand); border-color: var(--brand); }

/* Cabecera de listado: título a la izquierda y botones a la derecha, en una o dos filas alineadas; nunca debajo del título */
@media (min-width: 768px) {
  .kit-card > .card-header .kit-header-row { flex-wrap: nowrap; align-items: flex-start; }
  .kit-card > .card-header .kit-header-row > div:first-child { flex: 0 0 auto; max-width: 38%; }
  .kit-card > .card-header .kit-header-row .kit-toolbar { flex: 1 1 0; min-width: 0; justify-content: flex-end; }
}

/* Cabeceras con botones agrupados por función: cada grupo es una fila de botones pegados, alineada a la derecha */
.kit-toolbar--groups { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.kit-btn-group { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; }
.kit-btn-group > .kit-btn { height: 36px; padding: 0 14px; font-size: 12.5px; border-radius: 0; box-shadow: inset 1px 0 0 rgba(255,255,255,.55); }
.kit-btn-group > .kit-btn:first-child { border-radius: 8px 0 0 8px; box-shadow: none; }
.kit-btn-group > .kit-btn:last-child { border-radius: 0 8px 8px 0; }
.kit-btn-group > .kit-btn:only-child { border-radius: 8px; }
.kit-btn-group > .kit-btn.cb-btn-light { box-shadow: none; margin-left: -1px; }

/* Foto de usuario del menú: llena todo el círculo; sin foto se muestra el avatar genérico */
.eice-sidebar .user .photo { overflow: hidden; border: 0 !important; background: var(--sh-line, #E4E4E7); }
.eice-sidebar .user .photo img, .eice-sidebar .user .photo img.eice-user-photo { width: 100%; height: 100%; padding: 0 !important; object-fit: cover; border-radius: 50%; display: block; }

/* Modales con cabecera blanca (cb-modal): disponibles en todo el sistema */
.cb-modal .modal-content { border: 1px solid #e2e8f0; border-radius: 14px; overflow: hidden; box-shadow: 0 16px 40px rgba(15,37,71,.2); font-family: 'Titillium Web', 'Segoe UI', Roboto, sans-serif; }
.modal.cb-modal .modal-header { background: #fff !important; border-radius: 14px 14px 0 0; border-bottom: 1px solid #e2e8f0; padding: 16px 22px; display: flex !important; align-items: center; justify-content: space-between; }
.cb-modal .modal-title { font-size: 18px; font-weight: 800; font-family: 'Archivo', 'Titillium Web', sans-serif; color: var(--ink, #1D1A1B) !important; text-align: left; text-transform: none; margin: 0; flex: 1 1 auto; }
.cb-modal .modal-body { padding: 20px 22px; }
.cb-modal .modal-footer { border-top: 1px solid #e2e8f0; padding: 14px 22px; gap: 8px; justify-content: flex-end; }
.modal.cb-modal .modal-header .close { float: none; position: static; margin: 0; padding: 0 4px; font-size: 26px; line-height: 1; color: #64748b; text-shadow: none; opacity: .8; }


/* Aro rojo de marca alrededor de la foto de usuario del menú (igual que en el perfil) */
.eice-sidebar .user .photo { overflow: visible; box-shadow: 0 0 0 2px var(--menu-user, #fff), 0 0 0 4px var(--brand); background: transparent; }
.eice-sidebar .user .photo img, .eice-sidebar .user .photo img.eice-user-photo { border-radius: 50%; background: #E4E4E7; }

/* Menú desplegable del usuario: entrada animada, ítems escalonados y acento rojo al pasar */
.eice-sidebar .user .info > a .caret { transition: transform .25s ease; }
.eice-sidebar .user .info > a[aria-expanded="true"] .caret { transform: rotate(180deg); }
.eice-sidebar .eice-user-menu { padding: 6px 8px 8px !important; margin: 0; }
.eice-sidebar .eice-user-menu li { list-style: none; }
.eice-sidebar .eice-user-meta { display: flex; flex-direction: column; gap: 2px; padding: 8px 10px 10px; margin: 0 0 6px; border-bottom: 1px solid var(--menu-user-line); }
.eice-sidebar .eice-user-role { align-self: flex-start; padding: 2px 9px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 11.5px; font-weight: 700; }
.eice-sidebar .eice-user-mail { margin-top: 4px; font-size: 12px; color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.eice-sidebar .eice-user-menu li > a { position: relative; border-radius: 8px; transition: background-color .15s ease, padding-left .18s ease; }
.eice-sidebar .eice-user-menu li > a::before { content: ''; position: absolute; left: 0; top: 50%; width: 3px; height: 0; border-radius: 0 3px 3px 0; background: var(--brand); transform: translateY(-50%); transition: height .18s ease; }
.eice-sidebar .eice-user-menu li > a:hover::before, .eice-sidebar .eice-user-menu li > a:focus-visible::before { height: 18px; }
.eice-sidebar .eice-user-menu li > a:hover { background: rgba(200, 30, 22, .07) !important; padding-left: 18px !important; }
.eice-sidebar .eice-user-menu li > a i { transition: transform .18s ease, color .15s ease; }
.eice-sidebar .eice-user-menu li > a:hover i { transform: scale(1.12); }
.eice-sidebar .eice-user-logout { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--menu-user-line); }
.eice-sidebar .eice-user-logout > a i { color: var(--brand) !important; }
@keyframes eice-menu-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.eice-sidebar .collapse.show .eice-user-menu > li { animation: eice-menu-in .26s cubic-bezier(.2, .7, .3, 1) both; }
.eice-sidebar .collapse.show .eice-user-menu > li:nth-child(2) { animation-delay: .04s; }
.eice-sidebar .collapse.show .eice-user-menu > li:nth-child(3) { animation-delay: .08s; }
.eice-sidebar .collapse.show .eice-user-menu > li:nth-child(4) { animation-delay: .12s; }
.eice-sidebar .collapse.show .eice-user-menu > li:nth-child(5) { animation-delay: .16s; }
@media (prefers-reduced-motion: reduce) { .eice-sidebar .collapse.show .eice-user-menu > li, .eice-sidebar .user .info > a .caret { animation: none; transition: none; } }

/* Rol bajo el nombre, pegado */
.eice-sidebar .user .info > a { line-height: 1.15 !important; height: auto !important; min-height: 54px; display: flex !important; align-items: center; padding: 8px 34px 8px 8px !important; }
.eice-sidebar .user .info > a > span { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; min-width: 0; }
.eice-sidebar .user .info .eice-user-role { padding: 1px 8px; border-radius: 999px; background: var(--ink); color: #fff; font-size: 10.5px; font-weight: 700; line-height: 1.5; }
.eice-sidebar .user .info > a .caret { position: absolute; right: 14px; top: 50%; margin-top: -2px; }
.eice-sidebar .user .info > a > span { display: flex !important; flex-direction: column !important; align-items: flex-start !important; width: 100%; }
.eice-sidebar .user .info .eice-user-role { display: inline-block !important; width: auto !important; max-width: 100%; overflow: visible; text-overflow: clip; }

/* Aro rojo animado: un destello de marca recorre el contorno de la foto */
.eice-sidebar .user .photo { position: relative; box-shadow: 0 0 0 2px var(--menu-user, #fff) !important; }
.eice-sidebar .user .photo::before {
  content: ''; position: absolute; inset: -5px; border-radius: 50%; pointer-events: none;
  background: conic-gradient(from 0deg, var(--brand) 0deg, #FF8A7F 70deg, rgba(200, 30, 22, .18) 150deg, rgba(200, 30, 22, .18) 250deg, var(--brand) 360deg);
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
          mask: radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 2.5px));
  animation: eice-ring 2.8s linear infinite;
}
@keyframes eice-ring { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .eice-sidebar .user .photo::before { animation: none; } }

/* Más vida en la tarjeta de usuario */
.eice-sidebar .user { transition: box-shadow .2s ease, transform .2s ease; }
.eice-sidebar .user:hover { box-shadow: 0 6px 18px rgba(29, 26, 27, .10); transform: translateY(-1px); }
.eice-sidebar .user .photo { transition: transform .25s cubic-bezier(.2, .8, .3, 1.4); }
.eice-sidebar .user:hover .photo { transform: scale(1.07); }
.eice-sidebar .user:hover .photo::before { animation-duration: 1.1s; }
@keyframes eice-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(200, 30, 22, .0); } 50% { box-shadow: 0 0 14px 2px rgba(200, 30, 22, .28); } }
.eice-sidebar .user .photo::after { content: ''; position: absolute; inset: -5px; border-radius: 50%; pointer-events: none; animation: eice-glow 2.8s ease-in-out infinite; }
@keyframes eice-ring-pulse { 0%, 100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes eice-pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.eice-sidebar .user .photo { animation: eice-pop .5s cubic-bezier(.2, .8, .3, 1.3) both; }
.eice-sidebar .user .info .eice-user-role { transition: background-color .2s ease, transform .2s ease; }
.eice-sidebar .user:hover .info .eice-user-role { background: var(--brand); transform: translateX(2px); }
.eice-sidebar .eice-user-menu li > a:hover i.fa-cog { transform: rotate(90deg) scale(1.12); }
.eice-sidebar .eice-user-menu li > a:hover i.fa-sign-out { transform: translateX(3px); }
/* Con «reducir animaciones» del sistema el aro no gira: solo late suavemente */
@media (prefers-reduced-motion: reduce) {
  .eice-sidebar .user .photo::before { animation: eice-ring-pulse 2.4s ease-in-out infinite; }
  .eice-sidebar .user .photo, .eice-sidebar .user .photo::after, .eice-sidebar .user:hover .photo { animation: none; transform: none; }
}

/* Listado de módulos: mismo efecto que la tarjeta de usuario (se eleva con sombra suave) */
.eice-sidebar .sidebar-wrapper > .nav > li > a { transition: background-color .18s ease, box-shadow .2s ease, transform .2s ease; }
.eice-sidebar .sidebar-wrapper > .nav > li > a:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(29, 26, 27, .10); }
.eice-sidebar .sidebar-wrapper > .nav > li > a:active { transform: translateY(0); box-shadow: 0 2px 6px rgba(29, 26, 27, .10); }
.eice-sidebar .sidebar-wrapper > .nav > li > a i, .eice-sidebar .sidebar-wrapper > .nav > li > a svg, .eice-sidebar .sidebar-wrapper > .nav > li > a img { transition: transform .22s cubic-bezier(.2, .8, .3, 1.4); }
.eice-sidebar .sidebar-wrapper > .nav > li > a:hover i, .eice-sidebar .sidebar-wrapper > .nav > li > a:hover svg { transform: scale(1.12); }
.eice-sidebar .sidebar-wrapper > .nav > li.active > a { box-shadow: 0 4px 14px rgba(200, 30, 22, .12); }
@media (prefers-reduced-motion: reduce) { .eice-sidebar .sidebar-wrapper > .nav > li > a, .eice-sidebar .sidebar-wrapper > .nav > li > a i { transition: none; } .eice-sidebar .sidebar-wrapper > .nav > li > a:hover { transform: none; } }

/* Diálogo de confirmación del kit (kitConfirm / myAlert.Confirmation) */
.kit-dlg-back { position: fixed; inset: 0; z-index: 20000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(29, 26, 27, 0); backdrop-filter: blur(0); transition: background-color .18s ease, backdrop-filter .18s ease; }
.kit-dlg-back.is-in { background: rgba(29, 26, 27, .55); backdrop-filter: blur(2px); }
.kit-dlg { width: 100%; max-width: 400px; padding: 30px 28px 24px; text-align: center; background: #fff; border-radius: 18px; border-top: 4px solid var(--ink); box-shadow: 0 24px 60px rgba(0, 0, 0, .28); opacity: 0; transform: translateY(10px) scale(.96); transition: opacity .2s ease, transform .22s cubic-bezier(.2, .8, .3, 1.2); }
.kit-dlg-back.is-in .kit-dlg { opacity: 1; transform: none; }
.kit-dlg--danger { border-top-color: var(--brand); }
.kit-dlg-ico { width: 60px; height: 60px; margin: 0 auto 16px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: #F1F1F2; color: var(--ink); font-size: 26px; }
.kit-dlg--danger .kit-dlg-ico { background: #FDECEA; color: var(--brand); }
.kit-dlg-title { margin: 0 0 8px; font-family: 'Archivo', 'Titillium Web', sans-serif; font-weight: 800; font-size: 22px; line-height: 1.2; color: var(--ink); text-transform: none; }
.kit-dlg-text { margin: 0 0 22px; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }
.kit-dlg-actions { display: flex; gap: 10px; justify-content: center; }
.kit-dlg-actions .kit-btn-outline, .kit-dlg-actions .kit-btn-solid { height: 42px; padding: 0 20px; flex: 1 1 0; justify-content: center; }
.kit-dlg--danger .kit-dlg-ok { background: var(--brand); }
.kit-dlg--danger .kit-dlg-ok:hover { background: #A5180F !important; }
@media (prefers-reduced-motion: reduce) { .kit-dlg, .kit-dlg-back { transition: none; } }

/* Menú del engranaje: icono y texto siempre centrados en la misma línea (caja fija de 18x20 para el icono) */
.eice-topbar .dropdown-menu .dropdown-item { line-height: 20px; }
.eice-topbar .dropdown-menu .dropdown-item i { display: inline-flex !important; align-items: center; justify-content: center; flex: 0 0 18px; width: 18px; height: 20px; line-height: 1 !important; margin: 0 !important; position: static !important; top: auto !important; vertical-align: middle; transform: none; }
