@charset "UTF-8";
/* =====================================================================
   iPN2.css ? Design System de la modernizaci?n de UI de iPN
   ---------------------------------------------------------------------
   ERP Cloud SaaS ? Classic ASP (VBScript) ? server-rendered, sin bundler.
   Recrea el prototipo "iPN Redise?o" (handoff hifi) dentro del entorno real.

   REGLAS DE USO
   - Todo vive bajo el contenedor `.ipn2-app` (shell) o `.ipn2` (scope).
     As? el CSS legacy (newStyle, style_bootstrap, etc.) no se filtra y este
     tampoco pisa las pantallas todav?a no migradas.
   - Clases prefijadas `ipn-` para no colisionar con el CSS existente.
   - No hay estilos inline dispersos: los componentes viven ac?.
   - Tokens en `:root` (globales, inofensivos: s?lo definen variables).

   ?conos: Material Symbols Rounded (se cargan en el shell / la p?gina).
   Fuentes: IBM Plex Sans + IBM Plex Mono.
   ===================================================================== */

/* Fuentes (seg?n handoff). Se pueden mover a <link> en el shell si se prefiere.
   Material Symbols se carga aparte en el include del shell.
   Inter es la tipograf?a oficial de iPN2 (token --ipn-font); IBM Plex Mono se mantiene
   para valores num?ricos/monoespaciados (--ipn-font-mono). */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Inter:wght@400;500;600;700&display=swap');

/* =====================================================================
   1. TOKENS
   ===================================================================== */
:root{
  /* Marca / primario (fondos claros) */
  --ipn-primary:#3f6091;
  --ipn-primary-hover:#33507b;
  --ipn-primary-soft:#e9eff9;
  --ipn-accent:#2f62c4;            /* azul vivo ? activo sidebar / charts */

  /* Sidebar ? Command Center (7a) */
  --ipn-sidebar-bg:#16294d;
  --ipn-sidebar-item-active:#2f62c4;
  --ipn-sidebar-active-border:#2f62c4;
  --ipn-sidebar-text:#aebbd4;
  --ipn-sidebar-text-strong:#ffffff;
  --ipn-sidebar-heading:#7f92b4;
  --ipn-sidebar-hover:rgba(255,255,255,.06);
  --ipn-sidebar-active-shadow:0 2px 8px rgba(47,98,196,.35);

  /* Superficies */
  --ipn-page-bg:#f4f6f9;
  --ipn-surface:#ffffff;
  --ipn-surface-soft:#f7f9fc;
  --ipn-surface-soft-2:#fbfcfe;
  --ipn-zebra:#f2f6fc;

  /* Bordes */
  --ipn-hairline:#e6e9ef;
  --ipn-border-input:#d7dce4;

  /* Texto */
  --ipn-text:#16294d;
  --ipn-text-ink:#1e2733;
  --ipn-text-2:#55606f;
  --ipn-text-3:#6b7685;
  --ipn-text-muted:#8a94a2;
  --ipn-text-faint:#9aa4b1;

  /* Sem?nticos */
  --ipn-success:#1a9b57;
  --ipn-success-chip-bg:#e4f2ec;
  --ipn-success-chip-fg:#1a7a4f;
  --ipn-danger:#cf3b3b;
  --ipn-danger-chip-bg:#fbe8e8;
  --ipn-danger-chip-fg:#b83232;
  --ipn-warning:#d98324;
  --ipn-warning-ink:#946318;
  --ipn-warning-chip-bg:#f7efdf;
  --ipn-info-bg:#f2f6fc;
  --ipn-info-border:#dbe6f5;

  /* Charts */
  --ipn-chart:#2f62c4;
  --ipn-chart-soft:#c3d2e8;
  --ipn-chart-goal:#9aa4b1;

  /* Tipograf?a ? Inter es la fuente oficial de iPN2 (se hereda en todas las UIs modernizadas) */
  --ipn-font:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  --ipn-font-mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Consolas,monospace;

  /* Forma / espacio */
  --ipn-radius-input:8px;
  --ipn-radius-card:12px;
  --ipn-radius-pill:999px;
  --ipn-sidebar-w:236px;
  --ipn-topbar-h:56px;
  --ipn-control-h:40px;

  /* Sombras */
  --ipn-shadow-card:0 1px 3px rgba(63,96,145,.08);
  --ipn-shadow-elev:0 6px 24px rgba(30,45,70,.12);

  /* AV: 2026-07-19: Panel secure ? tokens + breakpoints documentados (media queries usan los px literales).
     Breakpoints: desktop ?1000 ? tablet 700?999 ? mobile <700 ? angosto <380 ? detail stack <900 */
  --ipn-bp-desktop:1000px;
  --ipn-bp-tablet:700px;
  --ipn-bp-narrow:380px;
  --ipn-bp-detail:900px;
  --ipn-secure-primary:#1d4e86;
  --ipn-secure-primary-hover:#173f6d;
  --ipn-secure-page-bg:#eef1f6;
  --ipn-secure-card-border:#e2e7ef;
  --ipn-secure-radius:14px;
  --ipn-touch-min:44px;
  --ipn-fab-size:56px;
  --ipn-fab-offset:16px;
  /* AV: 2026-07-20: tope compartido topbar__inner + body + footer secure */
  --ipn-secure-content-max:1440px;
}

/* =====================================================================
   2. RESET / BASE (acotado al scope)
   ===================================================================== */
.ipn2-app,
.ipn2{
  font-family:var(--ipn-font);
  font-size:13px;
  line-height:1.45;
  color:var(--ipn-text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.ipn2-app *,
.ipn2 *{ box-sizing:border-box; }

.ipn2-app a,
.ipn2 a{ color:var(--ipn-primary); text-decoration:none; }
.ipn2-app a:hover,
.ipn2 a:hover{ color:var(--ipn-primary-hover); text-decoration:underline; }

.ipn-mono{ font-family:var(--ipn-font-mono); font-variant-numeric:tabular-nums; }
.ipn-muted{ color:var(--ipn-text-muted); }
.ipn-pos{ color:var(--ipn-success); }
.ipn-neg{ color:var(--ipn-danger); }

/* ?conos Material Symbols Rounded */
.material-symbols-rounded{
  font-family:'Material Symbols Rounded' !important;
  font-weight:normal;
  font-style:normal;
  font-size:20px;
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  word-wrap:normal;
  direction:ltr;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  font-feature-settings:'liga';
  font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
  vertical-align:middle;
  user-select:none;
}

/* =====================================================================
   3. SHELL ? sidebar + topbar + ?rea de contenido
   ===================================================================== */
.ipn2-app{
  display:flex;
  min-height:100vh;
  background:var(--ipn-page-bg);
}

/* ---- Sidebar ---- */
.ipn-sidebar{
  width:var(--ipn-sidebar-w);
  flex:0 0 var(--ipn-sidebar-w);
  background:var(--ipn-sidebar-bg);
  color:var(--ipn-sidebar-text);
  display:flex;
  flex-direction:column;
  position:fixed;
  inset:0 auto 0 0;
  z-index:60;
}
.ipn-sidebar__header{
  height:var(--ipn-topbar-h);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
  flex:0 0 var(--ipn-topbar-h);
}
.ipn-sidebar__logo{ height:22px; width:auto; display:block; }
.ipn-sidebar__collapse{
  background:none; border:0; color:var(--ipn-sidebar-text);
  cursor:pointer; padding:4px; border-radius:6px; line-height:0;
}
.ipn-sidebar__collapse:hover{ background:var(--ipn-sidebar-hover); }

/* Desktop collapse */
.ipn2-app.is-sidebar-collapsed .ipn-sidebar{
  width:72px;
  flex-basis:72px;
}
.ipn2-app.is-sidebar-collapsed .ipn-main{ margin-left:72px; }
.ipn2-app.is-sidebar-collapsed .ipn-nav-item > span:not(.material-symbols-rounded),
.ipn2-app.is-sidebar-collapsed .ipn-nav-group__title,
.ipn2-app.is-sidebar-collapsed .ipn-sidebar__user,
.ipn2-app.is-sidebar-collapsed .ipn-nav-item__chev,
.ipn2-app.is-sidebar-collapsed .ipn-sidebar__logo{ display:none !important; }
.ipn2-app.is-sidebar-collapsed .ipn-sidebar__header{ justify-content:center; padding:0; }
.ipn2-app.is-sidebar-collapsed .ipn-sidebar__footer{ justify-content:center; flex-wrap:wrap; }
.ipn2-app.is-sidebar-collapsed .ipn-nav-item{ justify-content:center; padding:10px; }
.ipn2-app.is-sidebar-collapsed .ipn-sidebar__logout{ margin:0; }

/* avoidMenu / panel sin m?dulos: ocultar sidebar vac?o */
.ipn2-app.ipn2-app--no-nav .ipn-sidebar{ display:none; }
.ipn2-app.ipn2-app--no-nav .ipn-main{ margin-left:0; }
.ipn2-app.ipn2-app--no-nav .ipn-bottom-nav{ display:none !important; }

.ipn-sidebar__nav{
  flex:1 1 auto;
  overflow-y:auto;
  padding:6px 10px 12px;
}
.ipn-nav-group{ margin-top:14px; }
.ipn-nav-group:first-child{ margin-top:2px; }
.ipn-nav-group__title{
  font-size:11px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ipn-sidebar-heading);
  padding:6px 12px 4px;
}
.ipn-nav-item{
  display:flex;
  align-items:center;
  gap:12px;
  padding:9px 12px;
  margin:2px 0;
  border-radius:10px;
  color:var(--ipn-sidebar-text);
  font-size:13px;
  font-weight:500;
  border-left:0;
  transition:background .12s ease,color .12s ease,box-shadow .12s ease;
}
.ipn-nav-item:hover{ background:var(--ipn-sidebar-hover); color:#fff; text-decoration:none; }
.ipn-nav-item .material-symbols-rounded{ font-size:20px; }
.ipn-nav-item .ipn-nav-item__chev{ margin-left:auto; font-size:18px; opacity:.7; }
.ipn-nav-item.is-active{
  background:var(--ipn-sidebar-item-active);
  color:#fff;
  box-shadow:var(--ipn-sidebar-active-shadow);
}

.ipn-sidebar__footer{
  flex:0 0 auto;
  border-top:1px solid rgba(255,255,255,.08);
  padding:12px;
  display:flex;
  align-items:center;
  gap:10px;
}
.ipn-sidebar__footer .ipn-avatar{ flex:0 0 auto; }
.ipn-sidebar__user{ min-width:0; flex:1 1 auto; }
.ipn-sidebar__user b{ display:block; font-size:12.5px; color:#fff; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ipn-sidebar__user span{ display:block; font-size:11.5px; color:var(--ipn-sidebar-heading); }
.ipn-sidebar__logout{ color:var(--ipn-sidebar-text); line-height:0; padding:4px; border-radius:6px; }
.ipn-sidebar__logout:hover{ background:var(--ipn-sidebar-hover); color:#fff; }

/* ---- ?rea principal (empuja por el sidebar fijo) ---- */
.ipn-main{
  flex:1 1 auto;
  min-width:0;
  margin-left:var(--ipn-sidebar-w);
  display:flex;
  flex-direction:column;
}

/* ---- Topbar ---- */
.ipn-topbar{
  height:var(--ipn-topbar-h);
  flex:0 0 var(--ipn-topbar-h);
  background:var(--ipn-surface);
  border-bottom:1px solid var(--ipn-hairline);
  display:flex;
  align-items:center;
  gap:16px;
  padding:0 20px;
  position:sticky;
  top:0;
  z-index:40;
}
.ipn-breadcrumb{ display:flex; align-items:center; gap:6px; font-size:13px; color:var(--ipn-text-3); }
.ipn-breadcrumb .material-symbols-rounded{ font-size:16px; color:var(--ipn-text-faint); }
.ipn-breadcrumb b{ color:var(--ipn-text); font-weight:600; }
.ipn-topbar__spacer{ flex:1 1 auto; }
.ipn-topbar__search{
  position:relative; flex:1 1 420px; max-width:520px; margin:0 auto;
}
.ipn-topbar__search input{
  width:100%; height:38px; padding:0 64px 0 38px;
  border:1px solid var(--ipn-border-input); border-radius:10px;
  background:var(--ipn-surface-soft); font:inherit; font-size:13px; color:var(--ipn-text);
}
.ipn-topbar__search .material-symbols-rounded{
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  font-size:18px; color:var(--ipn-text-muted); pointer-events:none;
}
.ipn-topbar__kbd{
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  font-size:11px; font-weight:600; color:var(--ipn-text-muted);
  background:var(--ipn-surface); border:1px solid var(--ipn-hairline);
  border-radius:6px; padding:2px 6px; pointer-events:none;
}
.ipn-topbar__home{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:8px; color:var(--ipn-text-2);
}
.ipn-topbar__home:hover{ background:var(--ipn-surface-soft); color:var(--ipn-text); text-decoration:none; }
.ipn-topbar__user{
  display:inline-flex; align-items:center; gap:8px; color:var(--ipn-text);
  font-size:13px; font-weight:500;
}
.ipn-topbar__user:hover{ text-decoration:none; }
.ipn-topbar__icon{
  position:relative; color:var(--ipn-text-2); line-height:0;
  padding:8px; border-radius:8px; cursor:pointer;
}
.ipn-topbar__icon:hover{ background:var(--ipn-surface-soft); color:var(--ipn-text); }
.ipn-topbar__dot{
  position:absolute; top:6px; right:6px; width:7px; height:7px;
  background:var(--ipn-danger); border-radius:50%; border:1.5px solid var(--ipn-surface);
}
.ipn-company-pill{
  display:flex; align-items:center; gap:6px; height:34px; padding:0 10px;
  border:1px solid var(--ipn-border-input); border-radius:8px;
  font-size:12.5px; color:var(--ipn-text-2); background:var(--ipn-surface); cursor:pointer;
}
.ipn-company-pill:hover{ background:var(--ipn-surface-soft); }

/* Hamburguesa (s?lo m?vil) */
.ipn-topbar__burger{ display:none; background:none; border:0; color:var(--ipn-text-2); line-height:0; padding:8px; cursor:pointer; }

/* ---- Contenido ---- */
.ipn-content{ flex:1 1 auto; padding:22px 24px 40px; }

/* Backdrop del off-canvas (m?vil) */
.ipn-scrim{ display:none; position:fixed; inset:0; background:rgba(20,30,50,.45); z-index:55; }

/* =====================================================================
   4. PAGE HEADER
   ===================================================================== */
/* AV: 2026-07-19: ?cono+t?tulo SIEMPRE en fila; texto wrappea a la derecha del ?cono. */
.ipn-page-head{
  display:flex; flex-direction:row; align-items:center;
  gap:12px 14px; margin-bottom:18px;
  flex-wrap:nowrap;
}
.ipn-page-head__icon{
  width:46px; height:46px; border-radius:11px;
  background:var(--ipn-primary-soft); color:var(--ipn-primary);
  display:flex; align-items:center; justify-content:center;
  flex:0 0 46px; flex-shrink:0;
}
.ipn-page-head__icon .material-symbols-rounded{ font-size:22px; }
.ipn-page-head__text,
.ipn-page-head > div:not(.ipn-page-head__icon):not(.ipn-page-head__actions):not(.ipn-page-head__meta){
  min-width:0;
  flex:1 1 auto;
}
.ipn-page-title{
  font-size:21px; font-weight:700; color:var(--ipn-text); margin:0; line-height:1.25;
  overflow-wrap:anywhere;
}
.ipn-page-subtitle{ font-size:12.5px; color:var(--ipn-text-3); margin-top:2px; }
.ipn-page-head__actions{
  margin-left:auto; display:flex; align-items:center; gap:10px; flex-wrap:nowrap;
  flex:0 0 auto;
}

/* Dropdown "Acciones disponibles" (m?x. 2 botones visibles en page-head) */
.ipn-actions-dd{ position:relative; }
.ipn-actions-dd__menu{
  display:none; position:absolute; right:0; top:calc(100% + 6px);
  min-width:260px; margin:0; padding:6px 0; list-style:none;
  background:var(--ipn-surface); border:1px solid var(--ipn-hairline);
  border-radius:10px; box-shadow:var(--ipn-shadow-elev); z-index:90;
}
.ipn-actions-dd.is-open .ipn-actions-dd__menu{ display:block; }
.ipn-actions-dd__item{
  display:flex; align-items:center; gap:10px;
  padding:10px 14px; color:var(--ipn-text) !important;
  font-size:13px; font-weight:500; text-decoration:none !important;
  white-space:nowrap;
}
.ipn-actions-dd__item:hover{
  background:var(--ipn-zebra); color:var(--ipn-text) !important; text-decoration:none !important;
}
.ipn-actions-dd__item .material-symbols-rounded{
  font-size:20px; color:var(--ipn-text-muted); flex:0 0 auto;
}

/* =====================================================================
   5. BOTONES
   ===================================================================== */
.ipn-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  height:var(--ipn-control-h); padding:0 16px;
  border-radius:var(--ipn-radius-input);
  border:1px solid transparent;
  font:inherit; font-size:13px; font-weight:600; line-height:1;
  cursor:pointer; white-space:nowrap;
  transition:background .12s ease,border-color .12s ease,color .12s ease;
  text-decoration:none !important;
  box-sizing:border-box;
  appearance:none; -webkit-appearance:none;
}
a.ipn-btn,
a.ipn-btn:link,
a.ipn-btn:visited,
a.ipn-btn:hover,
a.ipn-btn:active,
a.ipn-btn:focus{
  text-decoration:none !important;
  color:inherit;
}
.ipn-btn .material-symbols-rounded{
  font-size:18px;
  text-decoration:none !important;
  line-height:1;
}
.ipn-btn--primary{ background:var(--ipn-primary); color:#fff; }
.ipn-btn--primary:hover{ background:var(--ipn-primary-hover); color:#fff; text-decoration:none; }
a.ipn-btn--primary,
a.ipn-btn--primary:link,
a.ipn-btn--primary:visited,
a.ipn-btn--primary:hover,
a.ipn-btn--primary:active,
a.ipn-btn--primary:focus{
  color:#fff !important;
  background:var(--ipn-primary);
}
a.ipn-btn--primary:hover{ background:var(--ipn-primary-hover) !important; }
.ipn-btn--secondary{ background:var(--ipn-surface); color:var(--ipn-text-2); border-color:var(--ipn-border-input); }
a.ipn-btn--secondary,
a.ipn-btn--secondary:link,
a.ipn-btn--secondary:visited{ color:var(--ipn-text-2) !important; }
.ipn-btn--secondary:hover{ background:var(--ipn-surface-soft); color:var(--ipn-text); text-decoration:none; }
a.ipn-btn--secondary:hover{ color:var(--ipn-text) !important; }
.ipn-btn--ghost{ background:transparent; color:var(--ipn-text-2); }
.ipn-btn--ghost:hover{ background:var(--ipn-surface-soft); color:var(--ipn-text); text-decoration:none; }
.ipn-btn--danger{ background:var(--ipn-danger); color:#fff; }
.ipn-btn--danger:hover{ background:var(--ipn-danger-chip-fg); color:#fff; text-decoration:none; }
a.ipn-btn--danger,
a.ipn-btn--danger:link,
a.ipn-btn--danger:visited,
a.ipn-btn--danger:hover,
a.ipn-btn--danger:active,
a.ipn-btn--danger:focus{
  color:#fff !important;
  background:var(--ipn-danger);
}
a.ipn-btn--danger:hover{ background:var(--ipn-danger-chip-fg) !important; }
.ipn-btn--sm{ height:32px; padding:0 12px; font-size:12.5px; }
.ipn-btn--icon{ width:var(--ipn-control-h); padding:0; }
.ipn-btn:disabled{ opacity:.55; cursor:not-allowed; }

/* Estado de carga iPN2 (submit/Buscar): conserva el estilo del bot?n, sin caer al gris legacy `btnDisabled`.
   Lo aplica loadAfterClick()/loadAfterClickBind() cuando el bot?n tiene la clase .ipn-btn. */
.ipn-btn.is-loading{ pointer-events:none; opacity:.85; cursor:default; }
.ipn-btn.is-loading > .material-symbols-rounded{ display:none; }
.ipn-btn.is-loading::before{
  content:""; display:inline-block; width:1em; height:1em; margin-right:.15em;
  border:2px solid currentColor; border-top-color:transparent; border-radius:50%;
  vertical-align:-2px; animation:ipnBtnSpin .6s linear infinite;
}
@keyframes ipnBtnSpin{ to{ transform:rotate(360deg); } }

/* Bot?n de acci?n por fila (more_horiz) */
.ipn-row-action{
  border:0; background:none; color:var(--ipn-text-muted);
  border-radius:6px; padding:5px; cursor:pointer; line-height:0;
  opacity:0; transition:opacity .12s ease,background .12s ease;
  text-decoration:none !important;
}
tr:hover .ipn-row-action{ opacity:1; }
.ipn-row-action:hover{ background:var(--ipn-surface-soft); color:var(--ipn-text); text-decoration:none !important; }
.ipn-row-action:visited,
.ipn-row-action:focus{ text-decoration:none !important; }
.ipn-row-action--danger:hover{ color:var(--ipn-danger); background:var(--ipn-danger-chip-bg); }
.ipn-table-actions{
  display:inline-flex; align-items:center; gap:2px;
}

/* =====================================================================
   6. CARD
   ===================================================================== */
.ipn-card{
  background:var(--ipn-surface);
  border:1px solid var(--ipn-hairline);
  border-radius:var(--ipn-radius-card);
  box-shadow:var(--ipn-shadow-card);
}
.ipn-card + .ipn-card{ margin-top:16px; }
.ipn-card__body{ padding:18px 20px; }
.ipn-card__head{
  display:flex; align-items:center; gap:10px;
  padding:14px 20px; border-bottom:1px solid var(--ipn-hairline);
}
.ipn-card__title{ font-size:14px; font-weight:600; color:var(--ipn-text); margin:0; }
.ipn-card__head .ipn-link-more{ margin-left:auto; font-size:12.5px; }

/* =====================================================================
   7. FILTROS
   ===================================================================== */
.ipn-filterbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:14px 16px; }
.ipn-search{ position:relative; flex:1 1 320px; min-width:220px; }
.ipn-search input{ width:100%; padding-left:38px; }
.ipn-search .material-symbols-rounded{
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  font-size:18px; color:var(--ipn-text-muted); pointer-events:none;
}
.ipn-active-filters{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:10px 16px; border-top:1px solid var(--ipn-hairline);
}
.ipn-active-filters__label{ font-size:12px; color:var(--ipn-text-3); font-weight:500; }
.ipn-active-filters__spacer{ margin-left:auto; }

/* Chips de filtro activo */
.ipn-chip{
  display:inline-flex; align-items:center; gap:6px;
  height:26px; padding:0 6px 0 11px; border-radius:var(--ipn-radius-pill);
  background:var(--ipn-primary-soft); color:var(--ipn-primary-hover);
  font-size:12px; font-weight:500;
}
.ipn-chip__close{
  border:0; background:none; color:inherit; cursor:pointer; line-height:0;
  padding:2px; border-radius:50%; opacity:.7;
}
.ipn-chip__close:hover{ opacity:1; background:rgba(51,80,123,.12); }
.ipn-chip__close .material-symbols-rounded{ font-size:15px; }

/* =====================================================================
   8. FORM CONTROLS
   ===================================================================== */
.ipn-field{ display:flex; flex-direction:column; gap:6px; }
.ipn-label{ font-size:12px; font-weight:500; color:var(--ipn-text-2); }
.ipn-input,
.ipn-select,
.ipn-textarea{
  height:var(--ipn-control-h);
  padding:0 12px;
  border:1px solid var(--ipn-border-input);
  border-radius:var(--ipn-radius-input);
  background:var(--ipn-surface);
  font:inherit; font-size:13px; color:var(--ipn-text);
  width:100%;
  transition:border-color .12s ease,box-shadow .12s ease;
}
.ipn-textarea{ height:auto; padding:10px 12px; resize:vertical; min-height:80px; }
.ipn-input:focus,
.ipn-select:focus,
.ipn-textarea:focus{
  outline:none; border-color:var(--ipn-primary);
  box-shadow:0 0 0 3px rgba(63,96,145,.14);
}
.ipn-input::placeholder,
.ipn-textarea::placeholder{ color:var(--ipn-text-faint); }
.ipn-select{
  appearance:none;
  padding-right:34px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%238a94a2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center;
}
.ipn-form-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px 20px; }
/* Grillas de columnas fijas (orden visual predecible en formularios de alta/edici?n).
   Prefer? --2 / --3 sobre el auto-fit cuando quer?s controlar cu?ntos campos por fila. */
.ipn-form-grid--2{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.ipn-form-grid--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
/* Breakpoints: ver secci?n 21 (?1000 ? 2col en --3; ?700 ? 1col). */
/* Campo que ocupa toda la fila de la grilla (textareas, campos largos). */
.ipn-field--full{ grid-column:1 / -1; }
/* Campos con control de ancho fijo (fechas, horas, importes, c?digos cortos):
   evita que un input chico se estire a todo el ancho de la celda. */
.ipn-field--sm .ipn-input,
.ipn-field--sm .ipn-select{ width:auto; min-width:0; max-width:200px; }

/* jQuery UI Autocomplete ? look iPN2 (reemplaza el theme base "crudo").
   El widget es el est?ndar iPN2 para b?squedas remotas; ac? solo se restila el
   men? de sugerencias para que combine con el resto de la UI. */
.ui-autocomplete.ui-menu{
  border:1px solid var(--ipn-border);
  border-radius:10px;
  background:var(--ipn-surface);
  box-shadow:0 8px 24px rgba(16,24,40,.12);
  padding:6px;
  max-height:280px; overflow-y:auto; overflow-x:hidden;
  font:inherit; font-size:13px; color:var(--ipn-text);
  z-index:4100;
}
.ui-autocomplete .ui-menu-item{ list-style:none; margin:0; }
.ui-autocomplete .ui-menu-item-wrapper{
  display:block; padding:8px 10px; border:0; margin:0; border-radius:8px;
  color:var(--ipn-text); line-height:1.35; cursor:pointer;
}
.ui-autocomplete .ui-menu-item-wrapper b{ font-weight:600; color:var(--ipn-text); }
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active,
.ui-autocomplete .ui-menu-item-wrapper:hover{
  background:var(--ipn-primary-soft); color:var(--ipn-primary);
  border:0; margin:0;
}
.ui-autocomplete .ui-menu-item-wrapper.ui-state-active b{ color:var(--ipn-primary); }
.ipn-form-section{ margin-bottom:22px; }
.ipn-form-section__title{
  font-size:14px; font-weight:600; color:var(--ipn-text);
  margin:0 0 14px; padding-bottom:8px; border-bottom:1px solid var(--ipn-hairline);
}

/* Toggle s?/no */
.ipn-toggle{ position:relative; display:inline-block; width:40px; height:22px; }
.ipn-toggle input{ opacity:0; width:0; height:0; }
.ipn-toggle__track{
  position:absolute; inset:0; cursor:pointer; border-radius:999px;
  background:var(--ipn-border-input); transition:background .15s ease;
}
.ipn-toggle__track::before{
  content:""; position:absolute; height:16px; width:16px; left:3px; top:3px;
  background:#fff; border-radius:50%; transition:transform .15s ease;
  box-shadow:0 1px 2px rgba(0,0,0,.25);
}
.ipn-toggle input:checked + .ipn-toggle__track{ background:var(--ipn-primary); }
.ipn-toggle input:checked + .ipn-toggle__track::before{ transform:translateX(18px); }

/* Mostrar/ocultar password */
.ipn-input-wrap{ position:relative; }
.ipn-input-wrap .ipn-input{ padding-left:38px; }
.ipn-input-wrap__icon{
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  font-size:18px; color:var(--ipn-text-muted); pointer-events:none;
}
.ipn-input-wrap__toggle{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  border:0; background:none; color:var(--ipn-text-muted); cursor:pointer;
  line-height:0; padding:4px; border-radius:6px;
}
.ipn-input-wrap__toggle:hover{ color:var(--ipn-text); }

/* =====================================================================
   9. TABLA / GRILLA
   ===================================================================== */
.ipn-table-wrap{
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  max-width:100%;
}
.ipn-table{ width:100%; border-collapse:collapse; font-size:13px; }
.ipn-table thead th,
.ipn-table > tr > th,
.ipn-table > tbody > tr > th{
  text-align:left; font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:.05em; color:var(--ipn-text-3);
  background:var(--ipn-surface-soft); padding:10px 14px;
  border-bottom:1px solid var(--ipn-hairline); white-space:nowrap;
}
.ipn-table tbody td,
.ipn-table > tr > td,
.ipn-table > tbody > tr > td{
  padding:9px 14px; border-bottom:1px solid var(--ipn-hairline);
  color:var(--ipn-text); vertical-align:middle;
}
.ipn-table tbody tr:nth-child(even){ background:var(--ipn-surface-soft-2); }
.ipn-table tbody tr:hover{ background:var(--ipn-zebra); }
.ipn-table tbody tr:last-child td{ border-bottom:0; }
.ipn-table--fit{
  width:auto; max-width:100%;
  table-layout:auto;
}
.ipn-table--fit th,
.ipn-table--fit td{
  padding-right:24px;
  white-space:nowrap;
}
/* Tablas cortas (p.ej. Estado del servicio): card y wrap se adaptan al contenido */
.ipn-secure-wrap .ipn-card--hug,
.ipn-secure .ipn-card--hug{
  width:max-content;
  max-width:100%;
}
.ipn-secure-wrap .ipn-card--hug .ipn-table-wrap,
.ipn-secure .ipn-card--hug .ipn-table-wrap{
  width:max-content;
  max-width:100%;
}
.ipn-secure-wrap .ipn-table.ipn-table--fit,
.ipn-secure .ipn-table.ipn-table--fit{
  width:auto !important;
}
.ipn-table .ipn-num{ text-align:right; font-family:var(--ipn-font-mono); font-variant-numeric:tabular-nums; white-space:nowrap; }
.ipn-secure-wrap .ipn-table a:not(.ipn-row-action):not(.ipn-btn),
.ipn-secure .ipn-table a:not(.ipn-row-action):not(.ipn-btn){
  font-weight:400;
}
.ipn-cell-strong{ font-weight:600; color:var(--ipn-text); }
.ipn-cell-sub{ font-size:11.5px; color:var(--ipn-text-3); margin-top:2px; }
.ipn-check{ width:15px; height:15px; accent-color:var(--ipn-primary); cursor:pointer; }
.ipn-check-row{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13px; color:var(--ipn-text-2); cursor:pointer;
  user-select:none; white-space:nowrap;
}
.ipn-check-row .ipn-check{ flex:0 0 auto; }

/* =====================================================================
   10. BADGES / ESTADOS
   ===================================================================== */
.ipn-badge{
  display:inline-flex; align-items:center;
  height:20px; padding:0 9px; border-radius:var(--ipn-radius-pill);
  font-size:11px; font-weight:600; line-height:1; white-space:nowrap;
}
/* Tipo de cliente */
.ipn-badge--mayorista{ background:#e9eff9; color:#33507b; }
.ipn-badge--minorista{ background:#eef0f3; color:#55606f; }
.ipn-badge--ecommerce{ background:#e4f2ec; color:#1a7a4f; }
.ipn-badge--sucursal{ background:#efe9f7; color:#6a4a9c; }
.ipn-badge--franquicia{ background:#f7efdf; color:#946318; }
/* Estado */
.ipn-badge--success{ background:var(--ipn-success-chip-bg); color:var(--ipn-success-chip-fg); }
.ipn-badge--danger{ background:var(--ipn-danger-chip-bg); color:var(--ipn-danger-chip-fg); }
.ipn-badge--warning{ background:var(--ipn-warning-chip-bg); color:var(--ipn-warning-ink); }
.ipn-badge--neutral{ background:#eef0f3; color:var(--ipn-text-2); }

/* Avatar cuadrado con iniciales */
.ipn-avatar{
  width:34px; height:34px; border-radius:10px;
  background:var(--ipn-primary); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:600; letter-spacing:.02em;
}
.ipn-avatar--sm{ width:28px; height:28px; border-radius:8px; font-size:11px; }

/* =====================================================================
   11. PAGINADO
   ===================================================================== */
.ipn-pager{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:12px 16px; border-top:1px solid var(--ipn-hairline);
  font-size:12.5px; color:var(--ipn-text-3);
}
.ipn-pager__spacer{ margin-left:auto; }
.ipn-pager__controls{ display:flex; align-items:center; gap:4px; }
.ipn-pager__btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:32px; height:32px; padding:0 8px;
  border:1px solid var(--ipn-border-input); border-radius:8px;
  background:var(--ipn-surface); color:var(--ipn-text-2); cursor:pointer; line-height:0;
}
.ipn-pager__btn:hover:not(:disabled){ background:var(--ipn-surface-soft); color:var(--ipn-text); text-decoration:none; }
.ipn-pager__btn:disabled{ opacity:.45; cursor:not-allowed; }

/* =====================================================================
   12. INFO / TIPS
   ===================================================================== */
.ipn-info-box{
  background:var(--ipn-info-bg); border:1px solid var(--ipn-info-border);
  border-radius:10px; padding:14px 16px; display:flex; gap:10px;
  font-size:12.5px; color:var(--ipn-text-2);
}
.ipn-info-box .material-symbols-rounded{ color:var(--ipn-primary); font-size:20px; flex:0 0 auto; }

/* =====================================================================
   13. KPI / DASHBOARD (Command Center 7a)
   ===================================================================== */
/* AV: 2026-07-19: Stat-cards al contenido (sin min-height); grid no estira filas. */
.ipn-kpi-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:14px;
  align-items:start;
  grid-auto-rows:min-content;
}
.ipn-kpi{
  padding:16px 18px;
  background:var(--ipn-surface);
  border:1px solid var(--ipn-hairline);
  border-radius:var(--ipn-radius-card);
  box-shadow:var(--ipn-shadow-card);
  display:flex; flex-direction:column;
  height:auto; min-height:0;
  box-sizing:border-box;
}
.ipn-kpi__label{ display:flex; align-items:center; gap:6px; font-size:12px; font-weight:500; color:var(--ipn-text-3); }
.ipn-kpi__label .material-symbols-rounded{ font-size:16px; color:var(--ipn-text-muted); }
.ipn-kpi__value{
  font-size:28px; font-weight:700; font-family:var(--ipn-font-mono); color:var(--ipn-text);
  margin:8px 0 4px; letter-spacing:-.01em; line-height:1;
  overflow-wrap:anywhere;
}
.ipn-kpi__sub{ font-size:12px; color:var(--ipn-text-3); margin-bottom:0; }
.ipn-kpi__delta{ font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:3px; }
.ipn-kpi__delta.is-up{ color:var(--ipn-success); }
.ipn-kpi__delta.is-down{ color:var(--ipn-danger); }
.ipn-kpi__status{
  display:inline-flex; align-items:center; gap:5px;
  margin-top:12px; font-size:12px; font-weight:600;
}
.ipn-kpi__status .material-symbols-rounded{ font-size:16px; }
.ipn-kpi__status.is-ok{ color:var(--ipn-success-chip-fg); }
.ipn-kpi__status.is-warn{ color:var(--ipn-warning); }
.ipn-kpi__status.is-none{ color:var(--ipn-text-muted); font-weight:500; }
.ipn-kpi__goal{ font-size:11.5px; color:var(--ipn-text-muted); margin-top:4px; }

/* KPI destacado ? Objetivo del mes */
.ipn-kpi--featured{
  background:linear-gradient(145deg,#16294d 0%,#1e3a66 55%,#2f62c4 140%);
  border-color:transparent; color:#fff;
}
.ipn-kpi--featured .ipn-kpi__label,
.ipn-kpi--featured .ipn-kpi__sub,
.ipn-kpi--featured .ipn-kpi__goal{ color:rgba(255,255,255,.72); }
.ipn-kpi--featured .ipn-kpi__value{ color:#fff; font-size:32px; }
.ipn-kpi__progress{
  margin-top:14px; height:8px; border-radius:999px;
  background:rgba(255,255,255,.18); overflow:hidden;
}
.ipn-kpi__progress > span{
  display:block; height:100%; border-radius:999px;
  background:#fff; box-shadow:0 0 0 1px rgba(255,255,255,.2);
}

/* Chart card */
.ipn-chart-card{ padding:0; overflow:hidden; }
.ipn-chart-card__head{
  display:flex; align-items:center; gap:10px;
  padding:14px 18px; border-bottom:1px solid var(--ipn-hairline);
}
.ipn-chart-card__title{ font-size:14px; font-weight:600; color:var(--ipn-text); margin:0; }
.ipn-chart-card__meta{ margin-left:auto; font-size:12px; color:var(--ipn-text-3); }
.ipn-chart-card__body{ padding:16px 18px 18px; position:relative; min-height:220px; }
.ipn-chart-toggle{ display:inline-flex; gap:4px; background:var(--ipn-surface-soft); border-radius:8px; padding:3px; }
.ipn-chart-toggle button{
  border:0; background:transparent; height:28px; padding:0 12px; border-radius:6px;
  font:inherit; font-size:12px; font-weight:600; color:var(--ipn-text-3); cursor:pointer;
}
.ipn-chart-toggle button.is-active{ background:var(--ipn-sidebar-bg); color:#fff; }

.ipn-quick-tile{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  padding:16px 10px; text-align:center; color:var(--ipn-text-2);
  background:var(--ipn-surface); border:1px solid var(--ipn-hairline); border-radius:10px;
  font-size:12.5px; font-weight:500; cursor:pointer; transition:border-color .12s,box-shadow .12s;
}
.ipn-quick-tile:hover{ border-color:var(--ipn-primary); box-shadow:var(--ipn-shadow-card); color:var(--ipn-text); text-decoration:none; }
.ipn-quick-tile .material-symbols-rounded{ font-size:22px; color:var(--ipn-primary); }

/* Tabs ? AV: 2026-07-17: subrayado flush con box-shadow inset (sin border-bottom + ::after / margin negativo) */
.ipn-tabs{
  display:flex; align-items:flex-end; gap:2px; padding:0 14px;
  background:var(--ipn-surface);
  border-bottom:0;
  box-shadow:inset 0 -1px 0 #eef1f6;
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin;
}
.ipn-tabs__item{
  position:relative; display:inline-flex; align-items:center; gap:7px;
  padding:14px 16px; border:0; background:none; cursor:pointer;
  font:inherit; font-size:14px; font-weight:600; color:#8493a6;
  text-decoration:none !important; white-space:nowrap; box-shadow:none;
}
.ipn-tabs a.ipn-tabs__item:link,
.ipn-tabs a.ipn-tabs__item:visited{ color:#8493a6 !important; text-decoration:none !important; }
.ipn-tabs a.ipn-tabs__item:hover{ color:var(--ipn-text) !important; }
.ipn-tabs a.ipn-tabs__item.is-active,
.ipn-tabs a.ipn-tabs__item.active{ color:#1d4e86 !important; }
.ipn-tabs__item:hover{ color:var(--ipn-text); }
.ipn-tabs__item.is-active,
.ipn-tabs__item.active{
  color:#1d4e86; font-weight:600;
  box-shadow:inset 0 -2px 0 #1d4e86;
}
.ipn-tabs__item.is-active::after,
.ipn-tabs__item.active::after{ content:none; display:none; }

/* Auditor?a / meta de alta-modificaci?n ? AV: 2026-07-17: franja plana (patr?n customerDetails) */
.ipn-audit{
  display:flex; flex-wrap:wrap; gap:8px 28px;
  margin-top:18px; padding:14px 2px 0;
  border-top:1px solid #e2e7ef;
}
.ipn-audit__item{
  display:flex; gap:8px; align-items:flex-start;
  flex:1 1 260px; min-width:0;
  font-size:12.5px; color:#8493a6; line-height:1.45;
  padding:0; border:0; background:none; border-radius:0;
}
.ipn-audit__item .material-symbols-rounded{
  color:#8493a6; font-size:18px; flex:0 0 auto; margin-top:1px;
}
.ipn-audit__item b,
.ipn-audit__item strong,
.ipn-audit__body strong{ color:#5b6b80; font-weight:600; }
.ipn-audit__body{ font-size:inherit; color:inherit; line-height:inherit; }

/* Legacy cnt_auditoria dentro del shell secure ? mismo look plano */
.ipn-secure-wrap .cnt_auditoria,
.ipn-secure-wrap .cnt_auditoria.cnt_auditoria-custom{
  display:flex !important; flex-wrap:wrap; align-items:flex-start; gap:8px 28px;
  margin:18px 0 0 !important; padding:14px 2px 0 !important; width:auto !important; height:auto !important;
  background:transparent !important; border:0 !important; border-top:1px solid #e2e7ef !important;
  border-radius:0 !important; position:static !important;
}
.ipn-secure-wrap .cnt_auditoria_izq,
.ipn-secure-wrap .cnt_auditoria_izq.cnt_auditoria_izq-custom{
  display:flex; align-items:flex-start; gap:8px;
  flex:1 1 260px; min-width:0; width:auto !important;
  font-size:12.5px; color:#8493a6; line-height:1.45;
}
.ipn-secure-wrap .cnt_auditoria_izq span{ line-height:1.45; }
.ipn-secure-wrap .cnt_auditoria_izq font{ font-weight:600; color:#5b6b80; }
.ipn-secure-wrap .cnt_auditoria img{ width:18px; height:18px; margin-top:1px; opacity:.75; }
.ipn-secure-wrap .cnt_auditoria .img_separador{ display:none !important; }

/* Save bar (alta/edici?n) */
.ipn-save-bar{
  position:sticky; bottom:0; z-index:30;
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 20px; background:var(--ipn-surface);
  border-top:1px solid var(--ipn-hairline); box-shadow:0 -4px 18px rgba(30,45,70,.06);
}
.ipn-save-bar__hint{ font-size:12px; color:var(--ipn-text-muted); margin-right:auto; }
.ipn-save-bar__actions{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }

/* Panel cuenta corriente (detalle) */
.ipn-acct-panel{ overflow:hidden; }
.ipn-acct-panel__hero{
  background:linear-gradient(145deg,#16294d 0%,#2f62c4 120%);
  color:#fff; padding:18px 18px 16px;
}
.ipn-acct-panel__hero .ipn-muted{ color:rgba(255,255,255,.7); }
.ipn-acct-panel__hero .ipn-kpi__value{ color:#fff; margin:4px 0 0; }
.ipn-acct-panel__body{ padding:14px 16px; }
.ipn-acct-row{
  display:flex; justify-content:space-between; gap:10px;
  padding:10px 0; border-bottom:1px solid var(--ipn-hairline); font-size:13px;
}
.ipn-acct-row:last-child{ border-bottom:0; }
.ipn-acct-row span{ color:var(--ipn-text-3); }
.ipn-acct-row b{ font-family:var(--ipn-font-mono); font-weight:600; }

/* AV: 2026-07-19: KPI breakpoints ? 5 ? 3 (?1000) ? 2 (?700) ? 1 (?380).
   Incluye --panel: si el modificador va DESPU?S sin media, pisa el responsive. */

/* =====================================================================
   14. GRILLA ? TARJETAS (fallback m?vil de tablas)
   ===================================================================== */
.ipn-card-list{ display:none; flex-direction:column; gap:12px; }
.ipn-data-card{
  background:var(--ipn-surface); border:1px solid var(--ipn-hairline);
  border-radius:var(--ipn-radius-card); box-shadow:var(--ipn-shadow-card);
  padding:14px 16px;
}
.ipn-data-card__top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.ipn-data-card__code{ font-family:var(--ipn-font-mono); font-size:12px; color:var(--ipn-text-3); }
.ipn-data-card__title{ font-size:14px; font-weight:600; color:var(--ipn-text); margin:8px 0 2px; }
.ipn-data-card__meta{ font-size:11.5px; color:var(--ipn-text-3); }
.ipn-data-card__foot{
  display:flex; align-items:flex-end; justify-content:space-between;
  margin-top:12px; padding-top:10px; border-top:1px solid var(--ipn-hairline);
}
.ipn-data-card__stat span{ display:block; font-size:10.5px; color:var(--ipn-text-muted); text-transform:uppercase; letter-spacing:.04em; }
.ipn-data-card__stat b{ font-family:var(--ipn-font-mono); font-size:14px; }

/* FAB */
.ipn-fab{
  display:none; position:fixed; right:18px; bottom:78px; z-index:45;
  width:52px; height:52px; border-radius:50%;
  background:var(--ipn-primary); color:#fff; border:0; cursor:pointer;
  box-shadow:var(--ipn-shadow-elev); align-items:center; justify-content:center;
}
.ipn-fab .material-symbols-rounded{ font-size:26px; }

/* Bottom nav (m?vil) */
.ipn-bottom-nav{
  display:none; position:fixed; inset:auto 0 0 0; z-index:50;
  height:58px; background:var(--ipn-surface); border-top:1px solid var(--ipn-hairline);
  align-items:stretch;
}
.ipn-bottom-nav__item{
  flex:1 1 0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px;
  color:var(--ipn-text-muted); font-size:10.5px; font-weight:500;
}
.ipn-bottom-nav__item .material-symbols-rounded{ font-size:22px; }
.ipn-bottom-nav__item.is-active{ color:var(--ipn-primary); }

/* =====================================================================
   15. LOGIN (pantalla sin shell)
   ===================================================================== */
.ipn-login{
  min-height:100vh; min-height:100dvh;
  display:flex; align-items:center; justify-content:center;
  background:#eef1f6; padding:24px;
  font-family:var(--ipn-font);
  font-size:13px;
  color:var(--ipn-text);
  -webkit-font-smoothing:antialiased;
  box-sizing:border-box;
}
.ipn-login *,
.ipn-login *::before,
.ipn-login *::after{ box-sizing:border-box; }
.ipn-login,
.ipn-login input,
.ipn-login button,
.ipn-login a,
.ipn-login label,
.ipn-login p,
.ipn-login h1,
.ipn-login h2,
.ipn-login span:not(.material-symbols-rounded){
  font-family:var(--ipn-font) !important;
}
.ipn-login__card{
  display:grid; grid-template-columns:1fr 1fr; width:100%; max-width:820px;
  background:var(--ipn-surface); border-radius:16px; overflow:hidden;
  box-shadow:var(--ipn-shadow-elev);
}
/* AV: 2026-07-18: panel izquierdo del login = slider de banners + link iPN.com.ar */
.ipn-login__brand{
  position:relative;
  padding:0;
  min-height:100%;
  background:#45709b;
  color:#fff;
  overflow:hidden;
}
.ipn-login__slider,
.ipn-login__slides{
  position:relative;
  width:100%;
  height:100%;
  min-height:420px;
}
.ipn-login__slide{
  position:absolute;
  inset:0;
  opacity:0;
  transition:opacity .55s ease;
  pointer-events:none;
}
.ipn-login__slide.is-active{
  opacity:1;
  pointer-events:auto;
  z-index:1;
}
.ipn-login__slide img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  opacity:.85;
}
.ipn-login__slider-caption{
  position:absolute;
  left:0; right:0; bottom:48px;
  z-index:2;
  display:flex;
  justify-content:center;
  pointer-events:none;
}
.ipn-login__domain{
  pointer-events:auto;
  color:#fff !important;
  font-weight:600;
  font-size:20px;
  text-decoration:none;
  text-shadow:0 1px 3px rgba(0,0,0,.35);
  letter-spacing:.01em;
}
.ipn-login__domain:hover{ text-decoration:underline; }
.ipn-login__slider-dots{
  position:absolute;
  left:0; right:0; bottom:18px;
  z-index:2;
  display:flex;
  justify-content:center;
  gap:7px;
}
.ipn-login__slider-dot{
  width:6px; height:6px; padding:0; border:0;
  border-radius:50%;
  background:rgba(255,255,255,.45);
  cursor:pointer;
}
.ipn-login__slider-dot.is-active{
  width:18px;
  border-radius:6px;
  background:#fff;
}
.ipn-login__form{
  padding:38px 34px; display:flex; flex-direction:column; min-width:0; overflow:hidden;
}
.ipn-login__form form{
  min-width:0; width:100%; max-width:100%;
  display:flex; flex-direction:column; flex:1 1 auto;
}
.ipn-login__form h1{ font-size:20px; font-weight:700; margin:0 0 4px; color:var(--ipn-text); }
.ipn-login__form .ipn-page-subtitle{ margin-bottom:22px; color:var(--ipn-text-3); font-size:12.5px; }
.ipn-login__form .ipn-field{ width:100%; max-width:100%; min-width:0; }
.ipn-login__form .ipn-input-wrap{ width:100%; max-width:100%; min-width:0; }
.ipn-login__form .ipn-input{
  display:block;
  width:100%; max-width:100%; min-width:0;
  height:var(--ipn-control-h);
  padding:0 12px 0 38px;
  box-sizing:border-box;
}
.ipn-login__form .ipn-input-wrap .ipn-input{ padding-right:42px; }
.ipn-login__form .ipn-btn,
.ipn-login__form .googleButton{ width:100%; max-width:100%; box-sizing:border-box; }
.ipn-login__row{ display:flex; align-items:center; justify-content:space-between; margin:14px 0 18px; font-size:12.5px; width:100%; }
.ipn-divider{ display:flex; align-items:center; gap:12px; color:var(--ipn-text-muted); font-size:11.5px; margin:18px 0; width:100%; }
.ipn-divider::before,.ipn-divider::after{ content:""; flex:1; height:1px; background:var(--ipn-hairline); }
.ipn-login__foot{ margin-top:auto; padding-top:20px; display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:11px; color:var(--ipn-text-muted); width:100%; }
/* AV: 2026-07-19: Loader post-login ? viewport completo + card centrado (100dvh). */
.ipn-login__loading{
  display:none;
  position:fixed; inset:0; z-index:50;
  min-height:100vh; min-height:100dvh;
  align-items:center; justify-content:center;
  padding:24px;
  background:#eef1f6;
  box-sizing:border-box;
}
.ipn-login__loading.d-flex{ display:flex !important; }
.ipn-login__loading-card{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:16px;
  width:100%; max-width:420px; margin:0 auto;
  padding:40px 28px;
  background:#fff;
  border-radius:16px;
  box-shadow:0 8px 30px rgba(16,32,55,.10);
  text-align:center;
  box-sizing:border-box;
}
.ipn-login__loading-logo{
  display:block; height:36px; width:auto; max-width:160px;
  object-fit:contain; margin:0 auto;
}
.ipn-login__spinner{
  width:36px; height:36px; border-radius:50%;
  border:3px solid #e2e7ef; border-top-color:#1d4e86;
  animation:ipnLoginSpin .7s linear infinite;
}
@keyframes ipnLoginSpin{ to{ transform:rotate(360deg); } }
.ipn-login__loading-title{
  margin:0;
  font-size:16px; font-weight:700;
  color:#1d4e86; line-height:1.25;
}
.ipn-login__loading-status{
  margin:0;
  min-height:1.4em;
  max-width:100%;
  font-size:13.5px; font-weight:400; line-height:1.4;
  color:#8493a6;
  opacity:1;
  transition:opacity .16s ease;
}
.ipn-login__loading-status.is-fading{ opacity:0; }
.ipn-login__loading-dots{
  display:inline;
  margin-left:.15em;
}
.ipn-login__loading-dots span{
  opacity:.15;
  animation:ipnLoginDot 1s infinite;
}
.ipn-login__loading-dots span:nth-child(2){ animation-delay:.18s; }
.ipn-login__loading-dots span:nth-child(3){ animation-delay:.36s; }
@keyframes ipnLoginDot{
  0%, 20%{ opacity:.15; }
  35%, 55%{ opacity:1; }
  70%, 100%{ opacity:.15; }
}

/* =====================================================================
   16. RESPONSIVE
   ===================================================================== */
@media (max-width:1024px){
  .ipn-topbar__search{ flex-basis:200px; }

  /* Sidebar off-canvas */
  .ipn-sidebar{
    transform:translateX(-100%);
    transition:transform .22s ease;
    box-shadow:var(--ipn-shadow-elev);
  }
  .ipn2-app.is-nav-open .ipn-sidebar{ transform:translateX(0); }
  .ipn2-app.is-nav-open .ipn-scrim{ display:block; }
  .ipn-main{ margin-left:0; }
  .ipn-topbar__burger{ display:inline-flex; }
  .ipn2-app .ipn-topbar .ipn-breadcrumb{ display:none; }
  .ipn-topbar__search{ display:none; }
  .ipn-company-pill{ display:none; }
  .ipn-content{ padding:16px 14px 84px; }

  /* Grilla ? tarjetas (s?lo shell app; secure mantiene tabla) */
  .ipn2-app .ipn-table-wrap{ display:none; }
  .ipn2-app .ipn-card-list{ display:flex; }
  .ipn-fab{ display:inline-flex; min-width:52px; min-height:52px; }
  .ipn-bottom-nav{ display:flex; }
  .ipn-bottom-nav__item{ min-height:44px; }
  .ipn2-app .ipn-page-head__actions .ipn-btn--secondary{ display:none; }
  /* AV: 2026-07-19: KPIs ya colapsan en @media 1000/640; no forzar 1 col ac?. */
  .ipn-save-bar{ bottom:58px; padding:12px 14px; }
  .ipn-btn, .ipn-topbar__burger, .ipn-topbar__icon{ min-height:44px; min-width:44px; }

  /* Legacy grilla en m?vil: scroll horizontal + filas m?s tocables */
  .ipn2-app table.grilla{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
  .ipn2-app table.grilla th,
  .ipn2-app table.grilla td{ padding:12px 14px; min-height:44px; }

  /* Login apilado */
  .ipn-login__card{ grid-template-columns:1fr; max-width:420px; }
  .ipn-login__brand{ display:none; }
}

/* AV: 2026-07-19: responsive secure unificado ? secci?n 21 (fin de archivo). */

/* =====================================================================
   17. PUENTE LEGACY (transici?n) ? S?LO dentro del shell nuevo
   ---------------------------------------------------------------------
   Mientras una pantalla migrada todav?a conserva markup legacy (grilla,
   b?squeda, paginado), estos overrides acotados a .ipn2-app le dan un look
   coherente sin tocar la l?gica VBScript. Se ir?n retirando a medida que
   cada bloque se reescriba a componentes ipn-*.
   ===================================================================== */
.ipn2-app .colorRojo{ color:var(--ipn-danger) !important; }
.ipn2-app .colorVerde{ color:var(--ipn-success) !important; }

/* Grilla legacy dentro del shell */
.ipn2-app table.grilla{
  width:100%; border-collapse:collapse; background:var(--ipn-surface);
  border:1px solid var(--ipn-hairline); border-radius:var(--ipn-radius-card);
  box-shadow:var(--ipn-shadow-card); overflow:hidden; font-size:13px; margin-top:4px;
}
.ipn2-app table.grilla th{
  text-align:left; font-size:11px; font-weight:600; text-transform:uppercase;
  letter-spacing:.05em; color:var(--ipn-text-3); background:var(--ipn-surface-soft);
  padding:10px 14px; border-bottom:1px solid var(--ipn-hairline);
}
.ipn2-app table.grilla td{ padding:9px 14px; border-bottom:1px solid var(--ipn-hairline); color:var(--ipn-text); vertical-align:top; }
.ipn2-app table.grilla tr:hover td{ background:var(--ipn-zebra); }

/* B?squeda legacy dentro del shell */
.ipn2-app fieldset.busqueda{
  background:var(--ipn-surface); border:1px solid var(--ipn-hairline);
  border-radius:var(--ipn-radius-card); box-shadow:var(--ipn-shadow-card);
  padding:14px 18px; margin:0 0 14px;
}
.ipn2-app fieldset.busqueda legend{ font-size:14px; font-weight:600; color:var(--ipn-text); padding:0 6px; }
.ipn2-app fieldset.busqueda input[type=text], .ipn2-app fieldset.busqueda select{
  height:36px; padding:0 10px; border:1px solid var(--ipn-border-input);
  border-radius:var(--ipn-radius-input); background:var(--ipn-surface); font:inherit; font-size:13px; color:var(--ipn-text);
}

/* Encabezado legacy ? alinear como page-head */
.ipn2-app .encabezado.ipn-page-head img{ display:none; }
.ipn2-app .encabezado.ipn-page-head h2{ display:none; }

/* Acciones disponibles dentro del page-head (anular style.css legacy) */
.ipn2-app .ipn-page-head__actions .accDisp,
.ipn2-app .ipn-page-head__actions .accDisp_sin_navegacion{
  position:relative !important; left:auto !important; top:auto !important;
  margin:0 !important; width:auto !important; background:transparent !important;
  border-radius:0 !important; z-index:5;
}
.ipn2-app .ipn-page-head__actions .accDisp ul#menuAD,
.ipn2-app .ipn-page-head__actions .accDisp_sin_navegacion ul#menuAD{
  position:absolute; right:0; top:calc(100% + 6px); min-width:240px;
  background:var(--ipn-surface) !important; border:1px solid var(--ipn-hairline) !important;
  border-radius:10px; box-shadow:var(--ipn-shadow-elev); padding:6px 0; z-index:80;
  list-style:none; margin:0;
}
.ipn2-app .ipn-page-head__actions .accDisp ul#menuAD li,
.ipn2-app .ipn-page-head__actions .accDisp_sin_navegacion ul#menuAD li{
  background:transparent !important; padding:0; margin:0;
}
.ipn2-app .ipn-page-head__actions .accDisp ul#menuAD li a,
.ipn2-app .ipn-page-head__actions .accDisp_sin_navegacion ul#menuAD li a{
  display:block; padding:9px 14px; color:var(--ipn-text) !important;
  font-size:13px; text-decoration:none !important;
}
.ipn2-app .ipn-page-head__actions .accDisp ul#menuAD li a:hover,
.ipn2-app .ipn-page-head__actions .accDisp_sin_navegacion ul#menuAD li a:hover{
  background:var(--ipn-zebra) !important;
}
.ipn2-app .ipn-page-head__actions .btnAD{
  color:inherit !important; background:transparent !important; border:0 !important;
}

/* Popup de b?squeda/export por encima del shell */
.ipn2-app ~ #popUpDivBorder,
body .blackBackground{ z-index:1200 !important; }
/* Base del popup (antes lo daba style.css legacy, que las pantallas iPN2 ya no cargan):
   oculto por defecto y fijo/centrado. iPNpopup() lo muestra con .show() y lo reposiciona. */
div#iPNpopUpDiv,
div.iPNpopUpDiv{ display:none; position:fixed; top:50%; left:50%; padding:10px; background-color:#fff; }
body div#iPNpopUpDiv,
body div.iPNpopUpDiv{ z-index:1201 !important; }
/* AV: 2026-07-21: QA 3.1 ? no tapar di?logos iPN2 que reutilizan el id legacy */
div#iPNpopUpDiv.ipn-dialog-root,
div.iPNpopUpDiv.ipn-dialog-root{
  display:flex; inset:0; top:auto; left:auto; padding:20px;
  background:transparent; opacity:0; pointer-events:none;
}
div#iPNpopUpDiv.ipn-dialog-root.is-open,
div.iPNpopUpDiv.ipn-dialog-root.is-open{
  opacity:1; pointer-events:auto;
}

/* Bot?n Buscar legacy dentro del shell */
.ipn2-app #SearchBtn.btnAzul,
.ipn2-app input.btnAzul#SearchBtn{
  height:var(--ipn-control-h); padding:0 16px; border-radius:var(--ipn-radius-input);
  background:var(--ipn-primary) !important; border:1px solid var(--ipn-primary) !important;
  color:#fff !important; font:inherit; font-size:13px; font-weight:600; cursor:pointer;
  text-shadow:none !important;
}
.ipn2-app .encabezado.ipn-page-head{
  float:none; width:auto; height:auto; margin:0 0 18px; padding:0;
  background:none; border:0;
}
.ipn2-app .ipn-page-subtitle a{ color:var(--ipn-primary); text-decoration:none; }
.ipn2-app .ipn-page-subtitle a:hover{ text-decoration:underline; }

/* Tabs legacy (.tab_cnt_principal / .tab_cnt_principal_chico) + iPN2 (.ipn-tabs)
   AV: 2026-07-17: misma t?cnica flush (inset shadow); overflow-x ya no clipa el subrayado */
.ipn2-app .tab_cnt_principal.ipn-tabs,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs{
  float:none; width:100% !important; height:auto; margin:0 0 14px; padding:0 14px;
  display:flex; align-items:flex-end; gap:2px;
  background:var(--ipn-surface); border:1px solid var(--ipn-hairline); border-bottom:0;
  border-radius:var(--ipn-radius-card);
  box-shadow:var(--ipn-shadow-card), inset 0 -1px 0 #eef1f6;
  position:relative; overflow-x:auto; white-space:nowrap; box-sizing:border-box;
}
.ipn2-app .tab_cnt_principal.ipn-tabs a,
.ipn2-app .tab_cnt_principal.ipn-tabs a:link,
.ipn2-app .tab_cnt_principal.ipn-tabs a:visited,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a:link,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a:visited{
  float:none; margin:0; padding:14px 16px; height:auto; line-height:normal;
  border:0 !important; background:none !important; color:#8493a6 !important;
  font-size:14px; font-weight:600; text-decoration:none !important;
  position:relative; display:inline-flex; align-items:center; gap:7px; cursor:pointer;
  white-space:nowrap; box-shadow:none;
}
.ipn2-app .tab_cnt_principal.ipn-tabs a:hover,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a:hover{ color:var(--ipn-text) !important; }
.ipn2-app .tab_cnt_principal.ipn-tabs a.active,
.ipn2-app .tab_cnt_principal.ipn-tabs a.is-active,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a.active,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a.is-active{
  color:#1d4e86 !important; font-weight:600; background:none; border:0;
  box-shadow:inset 0 -2px 0 #1d4e86;
}
.ipn2-app .tab_cnt_principal.ipn-tabs a.active::after,
.ipn2-app .tab_cnt_principal.ipn-tabs a.is-active::after,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a.active::after,
.ipn2-app .tab_cnt_principal_chico.ipn-tabs a.is-active::after{
  content:none; display:none;
}

/* Detalle cliente: header card, columnas, panel cta cte / acciones */
.ipn2-app .encabezado.ipn-page-head.ipn-card{
  padding:16px 20px; margin-bottom:16px; align-items:center;
}
.ipn2-app .navegacion{ display:none; }

/* Dashboard / salesPanel polish */
.ipn2-app .shadowBox,
.ipn2-app .ipn-card.shadowBox{
  background:var(--ipn-surface) !important;
  border:1px solid var(--ipn-hairline) !important;
  border-radius:var(--ipn-radius-card) !important;
  box-shadow:var(--ipn-shadow-card) !important;
  padding:16px 18px !important;
  margin-bottom:14px;
}
.ipn2-app .table_indicadores,
.ipn2-app table.grilla_financiera{
  width:100%; border-collapse:collapse; font-size:13px;
}
.ipn2-app .table_indicadores td,
.ipn2-app table.grilla_financiera td{
  padding:8px 10px; border-bottom:1px solid var(--ipn-hairline); vertical-align:middle;
}
.ipn2-app .table_indicadores .importe,
.ipn2-app table.grilla_financiera td[align=right],
.ipn2-app table.grilla_financiera .ipn-num{
  font-family:var(--ipn-font-mono); text-align:right !important;
  font-variant-numeric:tabular-nums; white-space:nowrap;
}
.ipn2-app h2, .ipn2-app .tituloNegro, .ipn2-app .ipn-page-title{
  color:var(--ipn-text);
}
.ipn2-app .msjInfo{
  background:var(--ipn-info-bg); border:1px solid var(--ipn-info-border);
  border-radius:10px; padding:12px 14px; color:var(--ipn-text-2); font-size:12.5px;
}
.ipn2-app .cnt_principal_chico{
  background:var(--ipn-surface); border:1px solid var(--ipn-hairline);
  border-radius:var(--ipn-radius-card); box-shadow:var(--ipn-shadow-card);
  padding:14px 18px 18px; box-sizing:border-box;
}
.ipn2-app .cnt_derecha{ width:300px; margin-left:16px; }
.ipn2-app .cnt_derecha .ipn-acct-panel{ width:100%; }
.ipn2-app .AccionesDisponibles.ipn-card{
  float:none !important; width:100% !important; margin:0 !important; box-sizing:border-box;
}
.ipn2-app .AccionesDisponibles.ipn-card > div{
  width:auto !important; border:0; border-bottom:1px solid var(--ipn-hairline);
  border-radius:0; margin:0; padding:12px 4px; background:transparent;
}
.ipn2-app .AccionesDisponibles.ipn-card > div:last-child{ border-bottom:0; }
.ipn2-app .AccionesDisponibles.ipn-card > div:hover{
  background:var(--ipn-zebra); border-color:transparent;
}
.ipn2-app .AccionesDisponibles.ipn-card img{ width:22px; height:22px; object-fit:contain; }
.ipn2-app .AccionesDisponibles.ipn-card p{ font-size:11.5px; color:var(--ipn-text-3); }
.ipn2-app .AccionesDisponibles.ipn-card span,
.ipn2-app .AccionesDisponibles.ipn-card a{
  color:var(--ipn-primary) !important; font-size:13px; font-weight:600;
}

/* Save bar: cntBotones ? sticky ipn-save-bar */
.ipn2-app .cntBotones.ipn-save-bar{
  float:none; width:auto; height:auto; margin:16px 0 0; clear:both;
  position:sticky; bottom:0; z-index:30;
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 20px; background:var(--ipn-surface);
  border:0; border-top:1px solid var(--ipn-hairline);
  box-shadow:0 -4px 18px rgba(30,45,70,.06);
}
.ipn2-app .cntBotones.ipn-save-bar .cntBotones_l,
.ipn2-app .cntBotones.ipn-save-bar .cntBotones_r{ float:none; width:auto; margin:0; padding:0; }
.ipn2-app .ipn-btn.btnAzul,
.ipn2-app .ipn-btn.btnVerde{
  background-image:none !important; border-image:none;
  width:auto; min-width:0; text-indent:0; overflow:visible;
  box-shadow:none;
}
.ipn2-app .ipn-btn.btnAzul.ipn-btn--secondary{
  background:var(--ipn-surface) !important; color:var(--ipn-text-2) !important;
  border:1px solid var(--ipn-border-input) !important;
}
.ipn2-app .ipn-btn.btnVerde.ipn-btn--primary{
  background:var(--ipn-primary) !important; color:#fff !important;
  border:1px solid transparent !important;
}

/* Paginado legacy dentro del shell */
.ipn2-app table.paginadoGrilla{ width:100%; margin-top:12px; font-size:12.5px; color:var(--ipn-text-3); }
.ipn2-app table.paginadoGrilla b{ color:var(--ipn-text); }

/* =====================================================================
   18. BLINDAJE DEL SHELL vs CSS legacy
   ---------------------------------------------------------------------
   El CSS viejo (style.css) define reglas de link con pseudo-clase
   (a:link/a:visited => especificidad 0,1,1) que le ganan a .ipn-nav-item
   (0,1,0) y dejan el texto del sidebar ilegible. Forzamos los colores del
   chrome del shell con !important, acotado a los contenedores del shell.
   ===================================================================== */
.ipn-sidebar a.ipn-nav-item,
.ipn-sidebar a.ipn-nav-item:link,
.ipn-sidebar a.ipn-nav-item:visited{
  color:var(--ipn-sidebar-text) !important;
  text-decoration:none !important;
}
.ipn-sidebar a.ipn-nav-item:hover,
.ipn-sidebar a.ipn-nav-item.is-active{ color:#fff !important; }
.ipn-sidebar .ipn-nav-group__title{ color:var(--ipn-sidebar-heading) !important; }
.ipn-sidebar__user b{ color:#fff !important; }
.ipn-sidebar__logout,
.ipn-sidebar__logout:link,
.ipn-sidebar__logout:visited,
.ipn-sidebar__collapse{ color:var(--ipn-sidebar-text) !important; text-decoration:none !important; }

.ipn-topbar a,
.ipn-topbar a:link,
.ipn-topbar a:visited{ text-decoration:none !important; }
.ipn-topbar__icon,
.ipn-topbar__icon:link,
.ipn-topbar__icon:visited{ color:var(--ipn-text-2) !important; }
.ipn-breadcrumb b{ color:var(--ipn-text) !important; }

/* Density: el sidebar puede ser largo (muchos ?tems por permisos) ? scroll propio */
.ipn-sidebar__nav{ scrollbar-width:thin; }

/* =====================================================================
   18. PANEL SECURE (implementaci?n / accessType 1?13?14)
   ===================================================================== */
/* Full-bleed: anula el ?caj?n? legacy (.wraper / .main_content ~85%) */
body:has(.ipn-secure),
html:has(.ipn-secure-wrap),
body:has(.ipn-secure-wrap){
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  max-width:none !important;
  background:var(--ipn-page-bg) !important;
  font-family:var(--ipn-font);
}
.ipn-secure-wrap.wraper,
.wraper.ipn-secure-wrap,
.wraper:has(> .ipn-secure),
.wraper:has(.ipn-secure-topbar){
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  border:0 !important;
  background:var(--ipn-page-bg) !important;
  min-height:100vh;
  padding:0 !important;
  box-shadow:none !important;
  display:flex;
  flex-direction:column;
  box-sizing:border-box;
}
/* AV: 2026-07-20: anula caj?n legacy (.main_content width:85% + border #bce1f4)
   que reaparece >1100px y deja ?borde azul? alrededor del header. */
.main_content.ipn-secure,
.ipn-secure-wrap > .main_content{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  border:0 !important;
  border-color:transparent !important;
  background:var(--ipn-page-bg) !important;
  padding-bottom:0 !important;
  box-shadow:none !important;
  flex:1 1 auto;
  min-height:0;
}

.ipn-secure{
  background:var(--ipn-page-bg);
  font-family:var(--ipn-font);
  color:var(--ipn-text);
  -webkit-font-smoothing:antialiased;
}
.ipn-secure *,
.ipn-secure *::before,
.ipn-secure *::after{ box-sizing:border-box; }

.ipn-secure-topbar{
  /* AV: 2026-07-20: barra full-bleed siempre (mismo ancho que el body/page-bg). */
  background:#16294d;
  height:56px;
  min-height:56px;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  border:none !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
  box-sizing:border-box;
  flex:0 0 auto;
  /* AV: 2026-07-20: visible para el dropdown de usuario (antes overflow:hidden lo clipaba) */
  overflow:visible;
  position:relative;
  z-index:40;
}
.ipn-secure-topbar--ipn,
.ipn-secure-topbar--cetro,
.ipn-secure-topbar--mx{ background:#16294d; }
.ipn-secure-topbar__inner{
  /* AV: 2026-07-20: mismo tope que .ipn-secure__body (alineaci?n logo/usuario ? contenido). */
  width:100%;
  max-width:var(--ipn-secure-content-max, 1440px);
  margin:0 auto; padding:0 24px;
  height:100%; display:flex; align-items:center; justify-content:space-between;
  gap:16px;
  box-sizing:border-box;
}
.ipn-secure-topbar__brand{
  display:inline-flex; align-items:center; text-decoration:none;
  flex:0 0 auto;
  max-height:100%;
  overflow:visible;
}
/* AV: 2026-07-20: !important ? .ipn-secure img{height:auto} del QA pisaba el tama?o y el logo
   se renderizaba a 405?103 recortado por el topbar de 56px. */
.ipn-secure-topbar__logo,
.ipn-secure .ipn-secure-topbar__logo,
img.ipn-secure-topbar__logo{
  height:22px !important;
  width:auto !important;
  max-width:140px !important;
  max-height:28px !important;
  object-fit:contain !important;
  display:block !important;
  overflow:visible;
}
.ipn-secure-topbar__account{
  display:inline-flex; align-items:center; gap:12px;
  margin-left:auto; min-width:0;
  padding-left:14px;
  border-left:1px solid rgba(174,187,212,.28);
  position:relative;
}
.ipn-secure-topbar__identity{
  display:flex; flex-direction:column; align-items:flex-end;
  gap:1px; min-width:0; max-width:220px;
}
.ipn-secure-topbar__name{
  font-family:var(--ipn-font);
  font-size:12.5px; font-weight:700; line-height:1.2;
  color:#fff; text-transform:uppercase; letter-spacing:.02em;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:100%;
  display:block;
}
.ipn-secure-topbar__role{
  font-family:var(--ipn-font);
  font-size:11.5px; font-weight:400; line-height:1.2;
  color:#aebbd4;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:100%;
  display:block;
}
.ipn-secure-topbar__avatar{
  flex:0 0 auto;
  width:34px; height:34px; border-radius:50%;
  background:var(--ipn-header-avatar, #2f6bb5); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  font-family:var(--ipn-font);
  font-size:12px; font-weight:700; letter-spacing:.02em;
  line-height:1;
  transition:box-shadow .15s ease;
}
/* AV: 2026-07-20: logout shared secure+adminPanel.
   !important / a:link: .ipn2 a (0,1,1) pisa .ipn-secure-topbar__logout (0,1,0)
   y deja el icono en --ipn-primary (#3f6091) en adminPanel (body.ipn2). */
a.ipn-secure-topbar__logout,
a.ipn-secure-topbar__logout:link,
a.ipn-secure-topbar__logout:visited{
  flex:0 0 auto;
  width:34px; height:34px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--ipn-header-border, rgba(255,255,255,.55));
  border-radius:8px;
  color:var(--ipn-header-fg, #fff) !important;
  text-decoration:none !important;
  transition:background .12s ease, border-color .12s ease, color .12s ease;
}
a.ipn-secure-topbar__logout:hover,
a.ipn-secure-topbar__logout:focus{
  background:color-mix(in srgb, var(--ipn-header-fg, #fff) 10%, transparent);
  border-color:var(--ipn-header-fg, #fff);
  color:var(--ipn-header-fg, #fff) !important;
  text-decoration:none !important;
}
a.ipn-secure-topbar__logout .material-symbols-rounded{ font-size:18px; }
@media (max-width:640px){
  .ipn-secure-topbar__identity{ display:none; }
  .ipn-secure-topbar__account{
    gap:8px; padding-left:10px;
  }
}

.ipn-secure__body{
  /* AV: 2026-07-20: mismo max que topbar__inner; NO pisar con max-width:100% global. */
  width:100%;
  max-width:var(--ipn-secure-content-max, 1440px);
  margin:0 auto;
  padding:16px 24px 40px;
  box-sizing:border-box;
}
.ipn-secure .ipn-page-head{ margin-bottom:20px; }

/* AV: 2026-07-21: QM (filtros cortos) ? sin forzar 100vh; evita hueco enorme hasta el footer */
.ipn-secure-wrap.ipn-qm-wrap{
  min-height:0;
}
.ipn-secure-wrap.ipn-qm-wrap > .main_content.ipn-secure{
  flex:0 1 auto;
}
.ipn-secure-wrap.ipn-qm-wrap .cnt_footer{
  margin-top:24px !important;
}

/* Footer full-bleed ? pie_secure.asp */
.cnt_footer{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  margin-top:auto !important;
  padding:0 !important;
  height:auto !important;
  min-height:0 !important;
  position:static !important;
  float:none !important;
  clear:both !important;
  border:none !important;
  border-top:1px solid var(--ipn-hairline) !important;
  background:var(--ipn-page-bg) !important;
  color:var(--ipn-text-muted) !important;
  font-family:var(--ipn-font) !important;
  font-size:12px !important;
  box-sizing:border-box;
  z-index:auto !important;
  flex:0 0 auto;
}
.cnt_footer__inner{
  /* AV: 2026-07-20: alineado a --ipn-secure-content-max. */
  width:100%;
  max-width:var(--ipn-secure-content-max, 1440px);
  margin:0 auto;
  padding:16px 24px 28px;
  display:flex;
  flex-direction:column;
  gap:4px;
  box-sizing:border-box;
  float:none !important;
  width:auto !important;
  text-align:left !important;
}
.cnt_footer__line,
.cnt_footer__meta{
  margin:0;
  line-height:1.45;
  color:var(--ipn-text-muted);
  font-family:var(--ipn-font);
  font-size:12px;
}
.cnt_footer__line b,
.cnt_footer__meta b{
  color:var(--ipn-text-3);
  font-weight:600;
}
.cnt_footer__sep{
  margin:0 6px;
  opacity:.55;
}
.cnt_footer a{ color:var(--ipn-primary); text-decoration:none; }
.cnt_footer a:hover{ text-decoration:underline; }
/* Legacy .der / .izq por si alguna p?gina a?n los emite */
.cnt_footer .der,
.cnt_footer .izq{
  float:none !important;
  width:auto !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  text-align:left !important;
}

/* Breadcrumb / filtros / tabla del panel secure */
.ipn-secure__body > .ipn-breadcrumb{
  display:flex; margin:0 0 12px; flex-wrap:wrap;
}
.ipn-secure__body > .ipn-breadcrumb a{
  color:var(--ipn-primary); text-decoration:none; font-weight:500;
}
.ipn-secure__body > .ipn-breadcrumb a:hover{ text-decoration:underline; }

/* Links de contenido en panel secure (scope .ipn2 no aplica ac?) */
/* AV: 2026-07-20: excluir .wc-ticket__id (t?tulo Work Center en negro) */
.ipn-secure-wrap a:not(.ipn-btn):not(.ipn-access-tile):not(.ipn-row-action):not(.ipn-secure-topbar__logout):not(.ipn-secure-topbar__brand):not(.wc-ticket__id),
.ipn-secure a:not(.ipn-btn):not(.ipn-access-tile):not(.ipn-row-action):not(.ipn-secure-topbar__logout):not(.ipn-secure-topbar__brand):not(.wc-ticket__id){
  color:var(--ipn-primary);
  text-decoration:none;
  font-weight:600;
}
.ipn-secure-wrap a:not(.ipn-btn):not(.ipn-access-tile):not(.ipn-row-action):not(.ipn-secure-topbar__logout):not(.ipn-secure-topbar__brand):not(.wc-ticket__id):hover,
.ipn-secure a:not(.ipn-btn):not(.ipn-access-tile):not(.ipn-row-action):not(.ipn-secure-topbar__logout):not(.ipn-secure-topbar__brand):not(.wc-ticket__id):hover{
  color:var(--ipn-primary-hover);
  text-decoration:underline;
}

/* Lista de enlaces (dashboards / monitoreo) */
.ipn-link-list{ display:flex; flex-direction:column; }
.ipn-link-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px;
  border-bottom:1px solid var(--ipn-hairline);
  color:var(--ipn-primary) !important;
  font-weight:600; font-size:13.5px;
  text-decoration:none !important;
  transition:background .15s ease, color .15s ease;
}
.ipn-link-row:last-child{ border-bottom:0; }
.ipn-link-row:hover{
  background:var(--ipn-primary-soft);
  color:var(--ipn-primary-hover) !important;
  text-decoration:none !important;
}
.ipn-link-row .material-symbols-rounded{
  font-size:18px; color:var(--ipn-text-3); flex:0 0 auto;
}
.ipn-link-row:hover .material-symbols-rounded{ color:var(--ipn-primary); }
.ipn-secure-filters{
  display:flex; align-items:flex-end; gap:14px; flex-wrap:wrap;
}
.ipn-secure-filters__actions{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  margin-left:auto;
}
.ipn-secure-actions{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:18px; flex-wrap:wrap;
}
.ipn-secure-actions .ipn-btn--primary,
.ipn-secure-actions .ipn-btn--danger{
  margin-left:auto;
}
.ipn-form-stack{
  display:flex; flex-direction:column; gap:16px;
  max-width:420px;
}
.ipn-row-action.is-visible{ opacity:1; }
.ipn-row-action .material-symbols-rounded{ font-size:20px; }
.ipn-copy-row label{
  display:inline-flex; align-items:center; gap:6px;
  margin:0; max-width:100%;
}
.ipn-copy-row .ipn-code{
  display:inline-block; max-width:280px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  vertical-align:middle;
}
.ipn-code{
  font-family:var(--ipn-font-mono); font-size:12px;
  color:var(--ipn-text); background:var(--ipn-surface-soft);
  padding:2px 6px; border-radius:4px; word-break:break-all;
}
.ipn-text-muted{ color:var(--ipn-text-muted); font-size:12px; }
.ipn-sql-msg{
  max-width:420px; font-size:12.5px; line-height:1.4;
  color:var(--ipn-text-2); word-break:break-word;
}
.ipn-pager__info{ font-size:12.5px; color:var(--ipn-text-3); }
.ipn-pager__page{ font-size:12.5px; color:var(--ipn-text-3); padding:0 6px; }
.ipn-table--sql-log td, .ipn-table--sql-log th{ vertical-align:top; }
.ipn-secure-wrap .ipn-table-wrap,
.ipn-secure .ipn-table-wrap{
  display:block !important; overflow-x:auto; -webkit-overflow-scrolling:touch;
}
@media (max-width:700px){
  .ipn-secure-filters__actions{ margin-left:0; width:100%; }
  .ipn-secure-filters__actions .ipn-btn{ flex:1 1 auto; }
  .ipn-sql-msg{ max-width:280px; }
}

/* Notices / alertas dismissibles */
.ipn-notice-stack{ display:flex; flex-direction:column; gap:10px; margin:0 0 22px; }
.ipn-notice{
  position:relative;
  display:flex; gap:12px; align-items:flex-start;
  padding:14px 44px 14px 14px;
  border-radius:10px;
  border:1px solid var(--ipn-info-border);
  background:var(--ipn-info-bg);
  color:var(--ipn-text-2);
  font-size:13px; line-height:1.45;
  transition:opacity .25s ease, transform .25s ease, max-height .25s ease, margin .25s ease, padding .25s ease;
  overflow:hidden;
}
.ipn-notice.is-dismissing{
  opacity:0; transform:translateY(-6px); max-height:0 !important;
  margin:0 !important; padding-top:0 !important; padding-bottom:0 !important; border-width:0;
}
.ipn-notice__icon{
  flex:0 0 auto; font-size:22px !important; line-height:1;
  color:var(--ipn-primary); margin-top:1px;
}
.ipn-notice__body{ flex:1 1 auto; min-width:0; }
.ipn-notice__body ul{ margin:8px 0 0; padding-left:18px; }
.ipn-notice__body li{ margin:2px 0; }
.ipn-notice__body a{ color:var(--ipn-primary); font-weight:600; text-decoration:none; }
.ipn-notice__body a:hover{ text-decoration:underline; }
.ipn-notice__close{
  position:absolute; top:8px; right:8px;
  width:32px; height:32px; border:0; border-radius:8px;
  background:transparent; color:var(--ipn-text-muted); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
}
.ipn-notice__close:hover{ background:rgba(22,41,77,.06); color:var(--ipn-text); }
.ipn-notice__close .material-symbols-rounded{ font-size:18px; }
.ipn-notice--info{ background:#f2f6fc; border-color:#dbe6f5; }
.ipn-notice--info .ipn-notice__icon{ color:#2f62c4; }
.ipn-notice--warning{ background:#f7efdf; border-color:#ecd9b0; }
.ipn-notice--warning .ipn-notice__icon{ color:var(--ipn-warning); }
.ipn-notice--danger{ background:#fbe8e8; border-color:#f0c8c8; }
.ipn-notice--danger .ipn-notice__icon{ color:var(--ipn-danger); }
.ipn-notice--success{ background:#e4f2ec; border-color:#c5e2d3; }
.ipn-notice--success .ipn-notice__icon{ color:var(--ipn-success); }
/* AV: 2026-07-21: notices sueltos en body secure ? espacio respecto al card/tabla siguiente */
.ipn-secure__body > .ipn-notice{
  margin:0 0 18px;
}

/* Secciones + tiles de acceso */
.ipn-secure__section{ margin:0 0 28px; }
.ipn-secure__section-title{
  font-size:15px; font-weight:700; color:var(--ipn-text);
  margin:0 0 12px; padding-bottom:8px;
  border-bottom:1px solid var(--ipn-hairline);
  letter-spacing:-.01em;
}
.ipn-access-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.ipn-access-tile{
  display:flex; align-items:center; gap:12px;
  padding:14px 14px;
  background:var(--ipn-surface);
  border:1px solid var(--ipn-hairline);
  border-radius:var(--ipn-radius-card);
  box-shadow:var(--ipn-shadow-card);
  color:inherit; text-decoration:none;
  transition:border-color .12s ease, box-shadow .12s ease, transform .12s ease;
  min-height:76px;
}
.ipn-access-tile:hover{
  border-color:#c5d3ea;
  box-shadow:var(--ipn-shadow-elev);
  text-decoration:none; color:inherit;
  transform:translateY(-1px);
}
.ipn-access-tile__icon{
  width:36px; height:36px; object-fit:contain; flex:0 0 auto;
  display:block;
}
.ipn-access-tile__icon--wide{ width:40px; height:24px; }
.ipn-access-tile__glyph{
  width:40px; height:40px; border-radius:11px;
  background:var(--ipn-primary-soft); color:var(--ipn-primary);
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;
}
.ipn-access-tile__glyph .material-symbols-rounded{ font-size:22px; }
.ipn-access-tile__text{ flex:1 1 auto; min-width:0; }
.ipn-access-tile__title{
  font-size:13.5px; font-weight:600; color:var(--ipn-primary);
  margin:0 0 3px; line-height:1.25;
}
.ipn-access-tile__desc{
  font-size:12px; color:var(--ipn-text-3); margin:0; line-height:1.35;
}
.ipn-access-tile__chevron{
  flex:0 0 auto; color:var(--ipn-text-faint); font-size:20px !important;
  opacity:0; transition:opacity .12s ease;
}
.ipn-access-tile:hover .ipn-access-tile__chevron{ opacity:1; color:var(--ipn-primary); }

@media (max-width:900px){
  .ipn-access-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:600px){
  .ipn-secure__body{ padding:14px 14px 32px; }
  .ipn-access-grid{ grid-template-columns:1fr; }
  .ipn-access-tile__chevron{ opacity:1; }
}

/* =====================================================================
   19. DIALOG (confirm / alert modernos)
   ===================================================================== */
/* AV: 2026-07-18: Por encima de wc-modal (4000) y flatpickr de modales (~5000). */
.ipn-dialog-root{
  position:fixed; inset:0; z-index:6000;
  display:flex; align-items:center; justify-content:center;
  padding:20px;
  opacity:0; pointer-events:none;
  transition:opacity .18s ease;
}
.ipn-dialog-root.is-open{ opacity:1; pointer-events:auto; }
.ipn-dialog-scrim{
  position:absolute; inset:0;
  background:rgba(22,41,77,.45);
  backdrop-filter:blur(2px);
}
.ipn-dialog{
  position:relative; z-index:1;
  width:100%; max-width:420px;
  background:var(--ipn-surface);
  border:1px solid var(--ipn-hairline);
  border-radius:14px;
  box-shadow:var(--ipn-shadow-elev);
  padding:22px 22px 18px;
  font-family:var(--ipn-font);
  transform:translateY(8px) scale(.98);
  transition:transform .18s ease;
}
.ipn-dialog-root.is-open .ipn-dialog{ transform:none; }
.ipn-dialog__close{
  position:absolute; top:10px; right:10px;
  width:32px; height:32px; border:0; border-radius:8px;
  background:transparent; color:var(--ipn-text-muted); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  padding:0; line-height:0;
}
.ipn-dialog__close:hover{ background:var(--ipn-surface-soft); color:var(--ipn-text); }
.ipn-dialog__close .material-symbols-rounded{ font-size:18px; }
.ipn-dialog__icon{
  width:40px; height:40px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  margin:0 0 14px;
}
.ipn-dialog__icon .material-symbols-rounded{ font-size:22px; }
.ipn-dialog__icon--info{ background:var(--ipn-primary-soft); color:var(--ipn-primary); }
.ipn-dialog__icon--danger{ background:var(--ipn-danger-chip-bg); color:var(--ipn-danger); }
.ipn-dialog__icon--warning{ background:var(--ipn-warning-chip-bg); color:var(--ipn-warning); }
.ipn-dialog__title{
  margin:0 0 6px; font-size:17px; font-weight:700;
  color:var(--ipn-text); letter-spacing:-.01em; line-height:1.25;
  padding-right:28px;
}
.ipn-dialog__message{
  margin:0; font-size:13.5px; line-height:1.45;
  color:var(--ipn-text-2);
}
.ipn-dialog__actions{
  display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap;
  margin-top:20px;
}
.ipn-dialog__actions .ipn-dialog__btn-cancel{ margin-right:auto; }
.ipn-dialog__actions .ipn-dialog__btn-confirm{ margin-left:auto; }

/* =====================================================================
   20. SECURE SHARED ? novedades, KPIs panel/MDA, MeLi, quotas
   AV: 2026-07-19: CSS centralizado (no <style> en ASP). Scopes por pantalla.
   ===================================================================== */

/* --- Novedades del equipo (.mda-news) --- */
.mda-news{
  --tf-primary:#1d4e86;
  --tf-card-border:#e2e7ef;
  --tf-text:#1e293b;
  --tf-text-2:#5b6b80;
  --tf-text-3:#8493a6;
  margin-top:8px; overflow:hidden;
}
.ipn-secure__body > .mda-news,
.ipn-secure__body > .ipn-card.mda-news{
  margin-top:16px; margin-bottom:28px;
}
.mda-news__head{
  display:flex; align-items:center; gap:12px; width:100%;
  padding:14px 20px; background:none; border:0; cursor:pointer; font:inherit; text-align:left;
}
.mda-news__head .mda-news__icon{
  flex:0 0 auto; font-size:22px; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
}
.mda-news__titles{ display:flex; flex-direction:column; line-height:1.25; }
.mda-news__title{ font-size:14px; font-weight:700; color:var(--tf-text); }
.mda-news__hint{ font-size:12.5px; color:var(--tf-text-3); }
.mda-news__caret{ margin-left:auto; color:var(--tf-text-3); transition:transform .18s ease; }
.mda-news.is-open .mda-news__caret{ transform:rotate(180deg); }
.mda-news__body{ display:none; border-top:1px solid var(--tf-card-border); padding:16px 20px 20px; }
.mda-news.is-open .mda-news__body{ display:block; }
.mda-news__grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.mda-news__col h4{
  display:flex; align-items:center; gap:7px; margin:0 0 10px;
  /* AV: 2026-07-19: ?12px (QA responsive tipograf?a mobile) */
  font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--tf-primary);
}
.mda-news__col h4 .mda-news__emoji{ font-size:15px; line-height:1; }
.mda-news__col ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.mda-news__col li,
.mda-news__note,
.mda-news__sub,
.mda-news__empty{ font-size:12.5px; color:var(--tf-text-2); line-height:1.45; }
.mda-news__col li a{ color:var(--tf-primary); }
.mda-news__note{ margin:0 0 10px; }
.mda-news__sub{ margin:0 0 8px; font-weight:600; color:var(--tf-text); }
.mda-news__empty{ color:var(--tf-text-3); }
.mda-news__col b,
.mda-news__col .font-weight-bold{ font-weight:700; color:var(--tf-text); }
/* Breakpoints de .mda-news__grid: secci?n 21. */

/* --- KPIs panel: NO redefinir columns ac? (rompe @media). Solo refuerzo de shrink. --- */
.ipn-kpi-grid--panel{
  align-items:start;
  grid-auto-rows:min-content;
}
.ipn-kpi-grid .ipn-kpi,
.ipn-kpi-grid--panel .ipn-kpi{
  height:auto;
  min-height:0;
  max-height:none;
  align-self:start;
  aspect-ratio:auto;
}
/* AV: 2026-07-19: breakpoints al final del cascade (ganan sobre desktop). */
@media (max-width:1000px){
  .ipn-kpi-grid,
  .ipn-kpi-grid--panel{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (max-width:700px){
  .ipn-kpi-grid,
  .ipn-kpi-grid--panel{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    align-items:start;
    grid-auto-rows:min-content;
  }
  .ipn-kpi-grid .ipn-kpi,
  .ipn-kpi-grid--panel .ipn-kpi{
    padding:14px 15px;
    height:auto;
    min-height:0;
    align-self:start;
  }
  .ipn-kpi__value{
    font-size:28px;
    line-height:1;
    margin:6px 0 4px;
  }
  .ipn-kpi__sub{ margin-bottom:0; padding-bottom:1px; }
}
@media (max-width:380px){
  .ipn-kpi-grid,
  .ipn-kpi-grid--panel{
    grid-template-columns:minmax(0,1fr);
  }
}

/* --- KPIs Mesa de ayuda (tema tipogr?fico sobre .ipn-kpi) --- */
.ipn-mda .ipn-kpi{
  background:#fff; border-color:#e2e7ef;
  border-radius:14px; box-shadow:0 1px 2px rgba(16,32,55,.04);
}
.ipn-mda .ipn-kpi__label{ font-size:13px; font-weight:600; color:#5b6b80; }
.ipn-mda .ipn-kpi__label .material-symbols-rounded{ font-size:18px; color:#8493a6; }
.ipn-mda .ipn-kpi__value{
  font-family:var(--ipn-font); font-size:29px; font-weight:800; color:#1e293b;
  margin:10px 0 4px; letter-spacing:-.01em; line-height:1; font-variant-numeric:tabular-nums;
}
.ipn-mda .ipn-kpi__value a{ color:inherit; text-decoration:none; }
.ipn-mda .ipn-kpi__sub{ font-size:12px; color:#8493a6; }
.ipn-mda .ipn-table-wrap{
  display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%;
}
.ipn-mda .mda-table{ min-width:720px; }
@media (max-width:640px){
  .ipn-mda .mda-filters{
    flex-direction:column; align-items:stretch; gap:12px;
  }
  .ipn-mda .mda-filters .ipn-field,
  .ipn-mda .mda-filters .ipn-field--num{
    flex:1 1 auto; width:100%; min-width:0; max-width:none;
  }
  .ipn-mda .mda-results-head{ flex-direction:column; align-items:stretch; gap:10px; }
  .ipn-mda .mda-results-head__order{ margin-left:0; width:100%; }
  .ipn-mda .mda-order-select{ max-width:none; width:100%; }
  .ipn-mda .mda-results-foot{ flex-direction:column; align-items:stretch; }
  .ipn-mda .mda-results-foot .ipn-pager__controls{ margin-left:0; width:100%; justify-content:center; }
}

/* --- Procesos MeLi ? stat-cards --- */
.jobs-mla-kpis{
  display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px; margin-bottom:16px;
  align-items:start; grid-auto-rows:min-content;
}
.jobs-mla-kpi{
  background:#fff; border:1px solid #e2e7ef; border-radius:14px;
  box-shadow:0 1px 2px rgba(16,32,55,.04);
  padding:16px 18px; display:flex; gap:12px; align-items:flex-start;
  height:auto; min-height:0; box-sizing:border-box;
}
.jobs-mla-kpi__icon{
  width:36px; height:36px; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  background:#f8fafc; color:#5b6b80; flex:0 0 auto;
}
.jobs-mla-kpi__icon .material-symbols-rounded{ font-size:20px; }
.jobs-mla-kpi__icon--warn{ background:#fdf3e3; color:#a9691a; }
.jobs-mla-kpi__icon--danger{ background:#fdeaea; color:#b0525a; }
.jobs-mla-kpi__icon--info{ background:#e9eff9; color:#1d4e86; }
.jobs-mla-kpi__label{ font-size:12px; font-weight:500; color:#8493a6; margin:0 0 4px; }
.jobs-mla-kpi__value{
  font-size:28px; font-weight:700; color:#1e293b; line-height:1;
  font-variant-numeric:tabular-nums; letter-spacing:-.02em;
  overflow-wrap:anywhere;
}
.jobs-mla-kpi__value.is-danger{ color:#b0525a; }
.jobs-mla-kpi__sub{ font-size:12px; color:#8493a6; margin-top:4px; padding-bottom:1px; }
@media (max-width:1000px){
  .jobs-mla-kpis{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width:700px){
  .jobs-mla-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .jobs-mla-kpi{ padding:14px 15px; }
  .jobs-mla-kpi__value{ font-size:28px; line-height:1; }
}
@media (max-width:380px){
  .jobs-mla-kpis{ grid-template-columns:minmax(0,1fr); }
}

/* --- Detalle de cliente ? quotas (stat-cards) --- */
.ipn-quota-row{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:18px;
  align-items:start; grid-auto-rows:min-content;
}
.ipn-quota{
  position:relative; background:#fff; border:1px solid #e2e7ef; border-radius:14px;
  box-shadow:0 1px 2px rgba(16,32,55,.04); padding:14px 16px 16px;
  height:auto; min-height:0; box-sizing:border-box;
}
.ipn-quota__top{ display:flex; align-items:center; gap:10px; margin-bottom:8px; padding-right:52px; }
.ipn-quota__icon{
  flex:0 0 34px; width:34px; height:34px; border-radius:9px;
  display:inline-flex; align-items:center; justify-content:center;
  background:#eef4fb; color:var(--ipn-primary,#1d4e86);
}
.ipn-quota__icon .material-symbols-rounded{ font-size:20px; }
.ipn-quota__label{ font-size:13px; font-weight:500; color:#5b6b80; }
.ipn-quota__value{
  font-size:22px; font-weight:700; color:#1e293b; letter-spacing:-.02em;
  line-height:1; margin-bottom:10px; overflow-wrap:anywhere;
}
.ipn-quota__value span{ font-weight:500; color:#8493a6; font-size:16px; }
.ipn-quota__badge{
  position:absolute; top:12px; right:12px;
  padding:2px 8px; border-radius:999px; font-size:11px; font-weight:700;
}
.ipn-quota__bar{ height:7px; border-radius:999px; background:#eef1f6; overflow:hidden; }
.ipn-quota__fill{ height:100%; border-radius:999px; width:0; transition:width .25s ease; }
.ipn-quota--ok .ipn-quota__badge{ background:#e6f4ee; color:#1f7a52; }
.ipn-quota--ok .ipn-quota__fill{ background:#1f7a52; }
.ipn-quota--warn .ipn-quota__badge{ background:#fff4e5; color:#a9691a; }
.ipn-quota--warn .ipn-quota__fill{ background:#a9691a; }
.ipn-quota--crit .ipn-quota__badge{ background:#fdecee; color:#b0525a; }
.ipn-quota--crit .ipn-quota__fill{ background:#b0525a; }
@media (max-width:700px){
  .ipn-quota-row{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .ipn-quota{ padding:14px 15px; }
}
@media (max-width:380px){
  .ipn-quota-row{ grid-template-columns:minmax(0,1fr); }
}

/* =====================================================================
   21. SECURE RESPONSIVE SYSTEM (compartido ? Panel de implementaci?n)
   AV: 2026-07-19: Un solo set de media queries para ~40 m?dulos.
   Breakpoints: ?1000 desktop ? 700?999 tablet ? <700 mobile ? <380 angosto ? <900 detail.
   NO tocar topbar/footer globales.
   ===================================================================== */

/* --- Detail layout (contenido + sidebar) --- */
.ipn-detail-layout{
  display:flex; gap:20px; align-items:flex-start;
}
.ipn-detail-main{ flex:1 1 auto; min-width:0; }
.ipn-detail-side{
  flex:0 0 340px; width:340px; position:sticky; top:12px;
}

/* --- Contenedor fluid (shell). Body/topbar inner usan --ipn-secure-content-max. --- */
.ipn-secure-wrap,
.ipn-secure{
  max-width:none;
  box-sizing:border-box;
}
.ipn-secure__body{
  box-sizing:border-box;
}

/* ========== ?1000px (tablet ancha) ========== */
@media (max-width:1000px){
  .ipn-form-grid--3{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ipn-kpi-grid,
  .ipn-kpi-grid--panel{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .mda-news__grid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
  .jobs-mla-kpis{ grid-template-columns:repeat(3,minmax(0,1fr)); }
}

/* ========== ?900px (detalle: sidebar debajo) ========== */
@media (max-width:900px){
  .ipn-detail-layout{ flex-direction:column; }
  .ipn-detail-side{
    flex:1 1 auto; width:100%; max-width:100%;
    position:static;
  }
}

/* ========== ?700px (mobile) ========== */
@media (max-width:700px){
  /* Header: fila ?cono|texto|kebab ? NUNCA column */
  .ipn-page-head,
  .ipn-secure .ipn-page-head,
  .ipn-secure-wrap .ipn-page-head{
    flex-direction:row; flex-wrap:nowrap; align-items:center; gap:12px;
  }
  .ipn-page-head__icon{
    width:40px; height:40px; flex:0 0 40px; flex-shrink:0;
  }
  .ipn-page-head__icon .material-symbols-rounded{ font-size:20px; }
  .ipn-page-title{ font-size:20px; line-height:1.25; overflow-wrap:anywhere; }
  .ipn-page-head__text,
  .ipn-page-head > div:not(.ipn-page-head__icon):not(.ipn-page-head__actions):not(.ipn-page-head__meta){
    min-width:0; flex:1 1 auto;
  }
  .ipn-secure .ipn-page-head__actions,
  .ipn-secure-wrap .ipn-page-head__actions{
    margin-left:auto; width:auto; flex:0 0 auto;
    flex-direction:row; align-items:center; gap:4px;
  }

  /* FAB: acci?n primaria del page-head (listados) */
  .ipn-secure-wrap .ipn-page-head__actions > .ipn-btn--primary,
  .ipn-secure .ipn-page-head__actions > .ipn-btn--primary{
    position:fixed;
    right:max(var(--ipn-fab-offset), env(safe-area-inset-right, 0px));
    bottom:calc(var(--ipn-fab-offset) + env(safe-area-inset-bottom, 0px));
    z-index:45;
    width:var(--ipn-fab-size); height:var(--ipn-fab-size);
    min-width:var(--ipn-fab-size); min-height:var(--ipn-fab-size);
    padding:0; margin:0; gap:0;
    border-radius:50%;
    background:var(--ipn-secure-primary); border-color:var(--ipn-secure-primary);
    color:#fff !important;
    box-shadow:0 6px 20px rgba(16,32,55,.30);
    font-size:0; line-height:0;
    justify-content:center;
  }
  .ipn-secure-wrap .ipn-page-head__actions > .ipn-btn--primary:hover,
  .ipn-secure .ipn-page-head__actions > .ipn-btn--primary:hover{
    background:var(--ipn-secure-primary-hover); border-color:var(--ipn-secure-primary-hover);
    color:#fff !important;
  }
  .ipn-secure-wrap .ipn-page-head__actions > .ipn-btn--primary .material-symbols-rounded,
  .ipn-secure .ipn-page-head__actions > .ipn-btn--primary .material-symbols-rounded{
    font-size:26px; color:#fff; margin:0;
  }
  /* Espacio para que el FAB no tape lista/paginaci?n */
  .ipn-secure-wrap:has(.ipn-page-head__actions > .ipn-btn--primary) .ipn-secure__body,
  .ipn-secure:has(.ipn-page-head__actions > .ipn-btn--primary){
    padding-bottom:calc(88px + env(safe-area-inset-bottom, 0px));
  }

  /* Acciones disponibles ? kebab (?) */
  .ipn-secure-wrap .ipn-actions-dd__toggle,
  .ipn-secure .ipn-actions-dd__toggle{
    width:var(--ipn-touch-min); height:var(--ipn-touch-min);
    min-width:var(--ipn-touch-min); min-height:var(--ipn-touch-min);
    padding:0; gap:0; font-size:0; line-height:0;
    border-radius:10px;
    justify-content:center;
  }
  .ipn-secure-wrap .ipn-actions-dd__toggle .material-symbols-rounded,
  .ipn-secure .ipn-actions-dd__toggle .material-symbols-rounded{
    display:none;
  }
  .ipn-secure-wrap .ipn-actions-dd__toggle::before,
  .ipn-secure .ipn-actions-dd__toggle::before{
    content:"more_horiz";
    font-family:"Material Symbols Rounded", sans-serif;
    font-size:24px; font-weight:400; line-height:1;
    color:var(--ipn-text-2);
    font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;
  }
  .ipn-secure-wrap .ipn-actions-dd__menu,
  .ipn-secure .ipn-actions-dd__menu{
    right:0; left:auto; min-width:240px; max-width:min(320px, calc(100vw - 24px));
  }

  /* Formularios: barra sticky inferior (Guardar/Cancelar) */
  .ipn-secure-wrap .ipn-secure-actions,
  .ipn-secure .ipn-secure-actions{
    position:sticky;
    bottom:0; z-index:30;
    display:flex; flex-direction:row; align-items:center; justify-content:space-between;
    gap:10px; flex-wrap:wrap;
    margin:18px 0 0;
    padding:12px 16px;
    padding-bottom:calc(12px + env(safe-area-inset-bottom, 0px));
    background:#fff;
    border-top:1px solid var(--ipn-secure-card-border);
    box-shadow:0 -4px 16px rgba(16,32,55,.06);
  }
  .ipn-secure-wrap .ipn-secure-actions .ipn-btn--primary,
  .ipn-secure .ipn-secure-actions .ipn-btn--primary{
    margin-left:auto;
    background:var(--ipn-secure-primary); border-color:var(--ipn-secure-primary);
  }
  .ipn-secure-wrap .ipn-secure-actions .ipn-btn--danger,
  .ipn-secure .ipn-secure-actions .ipn-btn--danger{
    margin-left:auto;
  }
  .ipn-secure-wrap .ipn-secure-actions .ipn-btn,
  .ipn-secure .ipn-secure-actions .ipn-btn{
    min-height:var(--ipn-touch-min);
  }

  /* Grillas ? 1 columna */
  .ipn-form-grid--2,
  .ipn-form-grid--3{ grid-template-columns:minmax(0,1fr); }
  .ipn-secure-filters{
    flex-direction:column; align-items:stretch; gap:12px;
  }
  .ipn-secure-filters > .ipn-field{
    width:100%; min-width:0; flex:1 1 auto;
  }
  .ipn-secure-filters .ipn-input,
  .ipn-secure-filters .ipn-select,
  .ipn-secure-filters .ipn-textarea{
    width:100%; min-height:var(--ipn-touch-min);
  }
  .ipn-secure-filters__actions{
    margin-left:0; width:100%;
    flex-direction:column; align-items:stretch; gap:8px;
  }
  .ipn-secure-filters__actions .ipn-btn{
    width:100%; min-height:var(--ipn-touch-min); justify-content:center;
  }
  .mda-news__grid{ grid-template-columns:minmax(0,1fr); gap:16px; }
  .ipn-kv-grid{ grid-template-columns:minmax(0,1fr); }

  /* Separadores verticales ? horizontales en 1 col */
  .ipn-col-divider,
  .ipn-grid-col + .ipn-grid-col{
    border-right:0;
    border-top:1px solid var(--ipn-secure-card-border);
    padding-top:14px; margin-top:4px;
  }

  /* KPIs: 2 col compactas */
  .ipn-kpi-grid,
  .ipn-kpi-grid--panel,
  .jobs-mla-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px; align-items:start; grid-auto-rows:min-content;
  }
  .ipn-kpi-grid .ipn-kpi,
  .ipn-kpi-grid--panel .ipn-kpi,
  .jobs-mla-kpi{
    padding:14px 15px; height:auto; min-height:0; align-self:start;
  }
  .ipn-kpi__value,
  .jobs-mla-kpi__value{ line-height:1; font-size:28px; margin:6px 0 4px; }

  /* Tablas: scroll en card; paginaci?n compacta */
  .ipn-secure-wrap .ipn-table-wrap,
  .ipn-secure .ipn-table-wrap{
    display:block !important;
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    max-width:100%;
  }
  .ipn-pager{
    flex-direction:column; align-items:center; gap:10px; text-align:center;
  }
  .ipn-pager__spacer{ display:none; }
  .ipn-pager__controls{ margin:0 auto; }
  .ipn-pager__btn{ min-width:var(--ipn-touch-min); min-height:var(--ipn-touch-min); }

  /* Tabla ? cards de fila (opt-in: .ipn-table--stack + data-label en td) */
  .ipn-table--stack thead{ display:none; }
  .ipn-table--stack,
  .ipn-table--stack tbody{ display:block; width:100%; }
  .ipn-table--stack tbody tr{
    display:block;
    margin:0 0 12px;
    padding:14px 16px;
    background:#fff;
    border:1px solid var(--ipn-secure-card-border);
    border-radius:var(--ipn-secure-radius);
    box-shadow:0 1px 2px rgba(16,32,55,.04);
  }
  .ipn-table--stack tbody tr:last-child{ margin-bottom:0; }
  .ipn-table--stack tbody td{
    display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
    border:0; padding:6px 0;
    white-space:normal;
  }
  .ipn-table--stack tbody td::before{
    content:attr(data-label);
    flex:0 0 auto;
    max-width:42%;
    font-size:12px; font-weight:500; color:#8493a6;
  }
  .ipn-table--stack tbody td:first-child{
    font-weight:700; color:#1e293b; font-size:14px;
  }
  .ipn-table--stack tbody td:first-child::before{ display:none; }

  /* Tipograf?a m?nima mobile */
  .ipn-secure-wrap,
  .ipn-secure{ font-size:13px; }
  .ipn-secure-wrap .ipn-label,
  .ipn-secure .ipn-label{ font-size:12px; }
}

/* ========== ?380px (mobile angosto) ========== */
@media (max-width:380px){
  .ipn-kpi-grid,
  .ipn-kpi-grid--panel,
  .jobs-mla-kpis,
  .ipn-quota-row{
    grid-template-columns:minmax(0,1fr);
  }
  .ipn-page-title{ font-size:18px; }
}

/* AV: 2026-07-19: QA reinforcements ? NO tocar max-width de .ipn-secure__body (rompe alineaci?n con topbar). */
.ipn-secure-wrap,
.ipn-secure{ max-width:none; }
.ipn-table-wrap,
.sp-table-wrap{ display:block; width:100%; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
.ipn-table{ width:100%; max-width:none; }
.sp-table thead th{ font-size:12px; }
@media (max-width:768px){
  /* Anula overrides locales que apilan el page-head */
  .ipn-page-head,
  .ipn-secure .ipn-page-head,
  .encabezado.ipn-page-head{
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
  }
  .ipn-page-head__actions{ width:auto !important; flex:0 0 auto !important; }
}
@media (max-width:700px){
  .ipn-secure, .ipn-secure-wrap{ font-size:13px; }
  .ipn-secure .ipn-muted, .ipn-secure small, .ipn-kpi__label,
  .ipn-cell-sub, .sp-ticket__date{ font-size:12px; }
  .ipn-table th, .ipn-table td, table.ipn-table th, table.ipn-table td,
  .sp-table th, .sp-table td, .pm-col-id{ font-size:12px; }
  /* Filtros / form-grids: forzar 1 col aunque el ASP traiga grid inline */
  .ipn-form-grid,
  .ipn-form-grid--2,
  .ipn-form-grid--3,
  .ipn-secure-filters,
  .ipn-secure-filters__grid,
  [class*="filters-grid"],
  [class*="FiltersGrid"]{
    grid-template-columns:minmax(0,1fr) !important;
    flex-direction:column !important;
  }
  .ipn-page-head__actions .ipn-btn:not(.ipn-btn--primary),
  .ipn-secure-actions .ipn-btn,
  .ipn-actions-dd__toggle,
  .ipn-pager a, .ipn-pager button{ min-height:44px; }
  .ipn-secure-wrap:has(.ipn-page-head__actions > .ipn-btn--primary) .ipn-secure__body,
  .ipn-secure:has(.ipn-page-head__actions > .ipn-btn--primary),
  .ipn-secure-wrap:has(.ipn-page-head__actions > a.ipn-btn--primary) .ipn-secure__body{
    padding-bottom:calc(110px + env(safe-area-inset-bottom, 0px));
  }
  .ipn-pager, .pagination{ margin-bottom:8px; padding-bottom:4px; }
}

/* AV: 2026-07-19: autofix QA font-12 */
@media (max-width:700px){
  .ipn-secure, .ipn-secure-wrap{ font-size:13px; }
  .ipn-secure .ipn-muted, .ipn-secure small, .ipn-kpi__label{ font-size:12px !important; }
}

/* AV: 2026-07-19: autofix QA no-hscroll (sin pisar max-width del body secure) */
.ipn-secure-wrap, .ipn-secure { max-width:none; }
.ipn-table-wrap { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
/* AV: 2026-07-20: height:auto en SVG rompe toolbar Trumbowyg (iconos como puntos). */
.ipn-secure img:not(.ipn-secure-topbar__logo),
.ipn-secure canvas,
.ipn-secure video{ max-width:100%; height:auto; }
.ipn-secure svg{ max-width:100%; height:auto; }
.ipn-secure .trumbowyg-box svg{
  max-width:none;
  height:100%;
  width:17px;
}

/* AV: 2026-07-19: autofix QA fab-exists */
@media (max-width:700px){
  .ipn-secure-wrap .ipn-page-head__actions > .ipn-btn--primary,
  .ipn-secure .ipn-page-head__actions > .ipn-btn--primary,
  .ipn-secure-wrap .ipn-page-head__actions > a.ipn-btn--primary{
    position:fixed !important;
    right:max(16px, env(safe-area-inset-right, 0px)) !important;
    bottom:calc(16px + env(safe-area-inset-bottom, 0px)) !important;
    z-index:45 !important;
    width:56px !important; height:56px !important;
    min-width:56px !important; min-height:56px !important;
    padding:0 !important; border-radius:50% !important;
    font-size:0 !important; line-height:0 !important;
  }
}

/* AV: 2026-07-19: autofix QA fab-no-overlap */
@media (max-width:700px){
  .ipn-secure-wrap:has(.ipn-page-head__actions > .ipn-btn--primary) .ipn-secure__body,
  .ipn-secure:has(.ipn-page-head__actions > .ipn-btn--primary){
    padding-bottom:calc(96px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .ipn-pager, .pagination { margin-bottom:12px; padding-bottom:8px; }
}

/* AV: 2026-07-19: autofix QA filters-1col */
@media (max-width:700px){
  .ipn-form-grid--2, .ipn-form-grid--3, .ipn-secure-filters{
    grid-template-columns:minmax(0,1fr) !important;
    flex-direction:column !important;
  }
  .ipn-secure-filters .ipn-input, .ipn-secure-filters .ipn-select{
    width:100% !important; max-width:100% !important;
  }
}

/* AV: 2026-07-19: autofix QA header-row */
@media (max-width:700px){
  .ipn-page-head, .ipn-secure .ipn-page-head, .encabezado.ipn-page-head{
    flex-direction:row !important; flex-wrap:nowrap !important; align-items:center !important;
  }
}


/* =====================================================================
   22. ADMIN PANEL (frontend) ? adminPanel.asp
   AV: 2026-07-20: panel post-login / selecci?n de cuenta. Header con
   personalizaci?n por cliente v?a --ipn-header-* (inyectadas en el wrap).
   ===================================================================== */
:root{
  --ipn-header-bg:#122740;
  --ipn-header-fg:#ffffff;
  --ipn-header-muted:#aebbd4;
  /* AV: 2026-07-20: mismo borde logout que secure */
  --ipn-header-border:rgba(255,255,255,.55);
  --ipn-header-avatar:#2f6bb5;
}

/* AV: 2026-07-20: full-bleed como secure ? sin margin 8px del body UA */
body:has(.ipn-ap),
html:has(.ipn-ap-wrap),
body:has(.ipn-ap-wrap){
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  max-width:none !important;
  background:var(--ipn-page-bg) !important;
  font-family:var(--ipn-font);
}
.ipn-ap-wrap{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  border:0 !important;
  background:var(--ipn-page-bg) !important;
  /* AV: 2026-07-22: sticky footer como secure ? UI ocupa el alto del viewport */
  min-height:100vh;
  min-height:100dvh;
  padding:0 !important;
  box-shadow:none !important;
  display:flex;
  flex-direction:column;
  box-sizing:border-box;
  font-family:var(--ipn-font);
  color:var(--ipn-text);
}
/* AV: 2026-07-22: primary brandado solo si el shell setea --ipn-brand*; si no, azul iPN2 */
.ipn-ap-wrap .ipn-btn--primary{
  background:var(--ipn-brand, var(--ipn-primary));
  color:var(--ipn-brand-fg, #fff);
  border-color:transparent;
}
.ipn-ap-wrap .ipn-btn--primary:hover{
  background:var(--ipn-brand-hover, var(--ipn-primary-hover));
  color:var(--ipn-brand-fg, #fff);
  text-decoration:none;
}
.ipn-ap-wrap a.ipn-btn--primary,
.ipn-ap-wrap a.ipn-btn--primary:link,
.ipn-ap-wrap a.ipn-btn--primary:visited,
.ipn-ap-wrap a.ipn-btn--primary:hover,
.ipn-ap-wrap a.ipn-btn--primary:active,
.ipn-ap-wrap a.ipn-btn--primary:focus{
  color:var(--ipn-brand-fg, #fff) !important;
  background:var(--ipn-brand, var(--ipn-primary));
}
.ipn-ap-wrap a.ipn-btn--primary:hover{
  background:var(--ipn-brand-hover, var(--ipn-primary-hover)) !important;
}
.ipn-ap-wrap > .main_content.ipn-ap{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  border:0 !important;
  background:var(--ipn-page-bg) !important;
  flex:1 1 auto;
  min-height:0;
  padding:0 !important;
  box-shadow:none !important;
  display:flex;
  flex-direction:column;
}
.ipn-ap *,
.ipn-ap *::before,
.ipn-ap *::after{ box-sizing:border-box; }

/* --- Topbar (personalizable) --- */
.ipn-ap-topbar{
  background:var(--ipn-header-bg);
  color:var(--ipn-header-fg);
  height:var(--ipn-topbar-h);
  min-height:var(--ipn-topbar-h);
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  flex:0 0 auto;
  border:none !important;
  border-bottom:1px solid color-mix(in srgb, var(--ipn-header-fg) 12%, transparent) !important;
  box-sizing:border-box;
  position:relative;
  z-index:40;
  overflow:visible;
}
.ipn-ap-topbar__inner{
  width:100%;
  max-width:var(--ipn-secure-content-max, 1440px);
  margin:0 auto;
  padding:0 24px;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}
.ipn-ap-topbar__brand{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  flex:0 0 auto;
  max-height:100%;
}
.ipn-ap-topbar__logo,
img.ipn-ap-topbar__logo{
  height:22px !important;
  width:auto !important;
  max-width:160px !important;
  max-height:28px !important;
  object-fit:contain !important;
  display:block !important;
}
/* AV: 2026-07-20: account full-bleed a la derecha (sin campanita); igual que secure */
.ipn-ap-topbar__account{
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-left:auto;
  min-width:0;
  padding-left:14px;
  border-left:1px solid color-mix(in srgb, var(--ipn-header-fg) 22%, transparent);
  position:relative;
}
.ipn-ap-topbar__identity{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:1px;
  min-width:0;
  max-width:220px;
}
.ipn-ap-topbar__name{
  font-size:12.5px;
  font-weight:700;
  line-height:1.2;
  color:var(--ipn-header-fg);
  text-transform:uppercase;
  letter-spacing:.02em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
  display:block;
}
.ipn-ap-topbar__role{
  font-size:11.5px;
  font-weight:400;
  line-height:1.2;
  color:var(--ipn-header-muted);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:100%;
  display:block;
}
.ipn-ap-topbar__avatar{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:50%;
  background:var(--ipn-header-avatar);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
  line-height:1;
  transition:box-shadow .15s ease;
}
/* --- Body --- */
.ipn-ap__body{
  width:100%;
  max-width:var(--ipn-secure-content-max, 1440px);
  margin:0 auto;
  padding:28px 24px 8px;
  box-sizing:border-box;
  /* AV: 2026-07-22: crece para empujar el footer al fondo del viewport */
  flex:1 1 auto;
}
.ipn-ap-hero{ margin:0 0 28px; }
.ipn-ap-hero__eyebrow{
  margin:0 0 8px;
  font-size:12px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--ipn-text-muted);
}
.ipn-ap-hero__title{
  margin:0;
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  gap:12px;
  min-width:0;
}
.ipn-ap-hero__icon{
  flex:0 0 auto;
  width:40px;
  height:40px;
  border-radius:10px;
  background:var(--ipn-primary-soft);
  color:var(--ipn-secure-primary);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ipn-ap-hero__icon .material-symbols-rounded{ font-size:22px; }
.ipn-ap-hero__name{
  font-size:28px;
  font-weight:700;
  line-height:1.2;
  /* AV: 2026-07-22: siempre tinta oscura ? custom del header puede ser blanco/claro */
  color:var(--ipn-text, #122740);
  min-width:0;
  word-break:break-word;
}
.ipn-ap-section{ margin:0 0 32px; }
.ipn-ap-section__title{
  margin:0 0 14px;
  font-size:15px;
  font-weight:700;
  color:var(--ipn-text);
}

/* --- Stat cards --- */
.ipn-ap-stats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
}
.ipn-ap-stat{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:6px;
  background:var(--ipn-surface);
  border:1px solid var(--ipn-secure-card-border, var(--ipn-hairline));
  border-radius:var(--ipn-secure-radius, 14px);
  box-shadow:var(--ipn-shadow-card);
  padding:16px 16px 14px;
  text-decoration:none !important;
  color:inherit;
  min-width:0;
  min-height:0;
  transition:box-shadow .15s ease, transform .15s ease;
}
a.ipn-ap-stat:hover{
  box-shadow:var(--ipn-shadow-elev);
  transform:translateY(-1px);
  text-decoration:none !important;
  color:inherit;
}
.ipn-ap-stat__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:8px;
  margin-bottom:4px;
}
.ipn-ap-stat__icon{
  width:36px;
  height:36px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#eef3f9;
  color:var(--ipn-secure-primary);
}
.ipn-ap-stat__icon .material-symbols-rounded{ font-size:20px; }
.ipn-ap-stat__badge{
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
  padding:3px 8px;
  border-radius:999px;
  line-height:1.2;
}
.ipn-ap-stat__label{
  font-size:12.5px;
  font-weight:500;
  color:var(--ipn-text-3);
}
.ipn-ap-stat__value{
  font-size:26px;
  font-weight:700;
  line-height:1.15;
  color:var(--ipn-text);
  font-variant-numeric:tabular-nums;
  text-decoration:none !important;
}
.ipn-ap-stat__bar{
  margin-top:8px;
  height:6px;
  border-radius:999px;
  background:#eef1f6;
  overflow:hidden;
}
.ipn-ap-stat__bar-fill{
  display:block;
  height:100%;
  border-radius:inherit;
  transition:width .25s ease;
}
.ipn-ap-stat--ok .ipn-ap-stat__badge{ background:var(--ipn-success-chip-bg); color:var(--ipn-success-chip-fg); }
.ipn-ap-stat--ok .ipn-ap-stat__bar-fill{ background:var(--ipn-success); }
.ipn-ap-stat--ok .ipn-ap-stat__icon{ background:#e4f2ec; color:var(--ipn-success); }
.ipn-ap-stat--warn .ipn-ap-stat__badge{ background:var(--ipn-warning-chip-bg); color:var(--ipn-warning-ink); }
.ipn-ap-stat--warn .ipn-ap-stat__bar-fill{ background:var(--ipn-warning); }
.ipn-ap-stat--warn .ipn-ap-stat__icon{ background:#f7efdf; color:var(--ipn-warning); }
.ipn-ap-stat--crit .ipn-ap-stat__badge{ background:var(--ipn-danger-chip-bg); color:var(--ipn-danger-chip-fg); }
.ipn-ap-stat--crit .ipn-ap-stat__bar-fill{ background:var(--ipn-danger); }
.ipn-ap-stat--crit .ipn-ap-stat__icon{ background:#fbe8e8; color:var(--ipn-danger); }

/* --- Shortcut tiles --- */
.ipn-ap-tiles{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}
.ipn-ap-tile{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:flex-start;
  gap:8px;
  background:var(--ipn-surface);
  border:1px solid var(--ipn-secure-card-border, var(--ipn-hairline));
  border-radius:var(--ipn-secure-radius, 14px);
  box-shadow:var(--ipn-shadow-card);
  padding:18px 18px 16px;
  text-decoration:none !important;
  color:inherit;
  min-height:0;
  transition:box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
.ipn-ap-tile:hover{
  box-shadow:var(--ipn-shadow-elev);
  transform:translateY(-2px);
  border-color:#cfd8e6;
  text-decoration:none !important;
  color:inherit;
}
.ipn-ap-tile__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  margin-bottom:4px;
}
.ipn-ap-tile__icon{
  width:40px;
  height:40px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ipn-ap-tile__icon .material-symbols-rounded{ font-size:22px; }
.ipn-ap-tile__icon--blue{ background:#e8f0fa; color:#1d4e86; }
.ipn-ap-tile__icon--indigo{ background:#ece8f8; color:#4b3f9a; }
.ipn-ap-tile__icon--teal{ background:#e5f5f2; color:#1a7a6a; }
.ipn-ap-tile__icon--amber{ background:#f7efdf; color:#946318; }
.ipn-ap-tile__icon--violet{ background:#f0e8f7; color:#6b3f8a; }
.ipn-ap-tile__arrow{
  font-size:18px !important;
  color:var(--ipn-text-faint);
}
.ipn-ap-tile__title{
  margin:0;
  font-size:15px;
  font-weight:700;
  color:#1d4e86;
  line-height:1.3;
}
.ipn-ap-tile__desc{
  margin:0;
  font-size:12.5px;
  line-height:1.45;
  color:var(--ipn-text-3);
}

/* --- Footer --- */
.ipn-ap-footer{
  width:100%;
  margin-top:auto;
  flex-shrink:0;
  border-top:1px solid var(--ipn-hairline);
  background:var(--ipn-page-bg);
  font-family:var(--ipn-font);
}
.ipn-ap-footer__inner{
  width:100%;
  max-width:var(--ipn-secure-content-max, 1440px);
  margin:0 auto;
  padding:14px 24px 18px;
  display:flex;
  flex-direction:column;
  gap:4px;
  box-sizing:border-box;
}
.ipn-ap-footer__row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.ipn-ap-footer__brand,
.ipn-ap-footer__meta{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  font-size:12px;
  color:#8493a6;
  line-height:1.4;
}
.ipn-ap-footer__product{
  font-size:13px;
  font-weight:700;
  color:#1d4e86;
}
.ipn-ap-footer__copy,
.ipn-ap-footer__build,
.ipn-ap-footer__sep{
  font-size:12px;
  color:#8493a6;
}
.ipn-ap-footer__build{ font-variant-numeric:tabular-nums; }
.ipn-ap-footer__meta{
  justify-content:flex-end;
  text-align:right;
}
/* AV: 2026-07-20: links legales/actividad ? !important vs .ipn2 a (--ipn-primary) */
a.ipn-ap-footer__link,
a.ipn-ap-footer__link:link,
a.ipn-ap-footer__link:visited{
  font-size:12px;
  font-weight:500;
  color:#2563a8 !important;
  text-decoration:none !important;
}
a.ipn-ap-footer__link:hover,
a.ipn-ap-footer__link:focus{
  color:#1c4a80 !important;
  text-decoration:underline !important;
}
/* AV: 2026-07-20: debug pegado a la fila de marca (mismo contenedor, gap 4px) */
.ipn-ap-footer__debug{
  width:100%;
  margin:0;
  padding:0;
  font-size:11px;
  color:var(--ipn-text-faint);
  font-family:var(--ipn-font-mono);
  line-height:1.35;
  box-sizing:border-box;
}

/* Notices dentro del panel */
.ipn-ap__body > .ipn-notice{ margin-bottom:18px; }
.ipn-ap .ipn-notice__close{
  min-width:var(--ipn-touch-min, 44px);
  min-height:var(--ipn-touch-min, 44px);
}

/* AV: 2026-07-20: KPIs ? align-items start (regla UI-IPN2-CSS ?21) */
.ipn-ap-stats{ align-items:start; }

/* --- Responsive (breakpoints iPN2) --- */
@media (max-width:1000px){
  .ipn-ap-stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .ipn-ap-tiles{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:700px){
  .ipn-ap-topbar__identity{ display:none; }
  .ipn-ap-topbar__account{ gap:8px; padding-left:10px; }
  .ipn-ap__body{ padding:20px 14px 40px; }
  .ipn-ap-hero__title{
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
  }
  .ipn-ap-hero__name{ font-size:22px; }
  .ipn-ap-stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); gap:10px; align-items:start; }
  .ipn-ap-tiles{ grid-template-columns:1fr; }
  .ipn-ap-stat__value{ font-size:22px; }
  .ipn-ap-footer__row{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
  .ipn-ap-footer__meta{
    justify-content:flex-start;
    text-align:left;
  }
  .ipn-ap-footer__brand,
  .ipn-ap-footer__meta{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
  }
  .ipn-ap-footer__sep{ display:none; }
  .ipn-ap, .ipn-ap-wrap{ font-size:13px; }
}
@media (max-width:380px){
  .ipn-ap-stats{ grid-template-columns:1fr; }
}

/* =====================================================================
   23. USER MENU ? dropdown del header (secure + adminPanel)
   AV: 2026-07-20: anclado al avatar/nombre; tokens --ipn-header-*.
   ===================================================================== */
.ipn-user-menu-trigger{
  display:inline-flex;
  align-items:center;
  gap:12px;
  min-width:0;
  margin:0;
  padding:4px 2px 4px 6px;
  border:0;
  background:transparent;
  cursor:pointer;
  font:inherit;
  color:inherit;
  border-radius:10px;
  min-height:var(--ipn-touch-min, 44px);
}
.ipn-user-menu-trigger:hover{
  background:color-mix(in srgb, var(--ipn-header-fg, #fff) 8%, transparent);
}
.ipn-user-menu-trigger:focus-visible{
  outline:2px solid color-mix(in srgb, var(--ipn-header-fg, #fff) 55%, transparent);
  outline-offset:2px;
}
.ipn-user-menu-trigger.is-open .ipn-secure-topbar__avatar,
.ipn-user-menu-trigger.is-open .ipn-ap-topbar__avatar{
  box-shadow:0 0 0 3px rgba(255,255,255,.35);
}

.ipn-user-menu{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  width:320px;
  max-width:calc(100vw - 32px);
  background:#fff;
  border:1px solid #e2e7ef;
  border-radius:14px;
  box-shadow:0 16px 44px rgba(16,32,55,.22);
  /* AV: 2026-07-20: overflow:hidden + padding-bottom para no recortar botones del pie */
  overflow:hidden;
  padding-bottom:14px;
  z-index:80;
  display:none;
  text-align:left;
  font-family:var(--ipn-font);
  color:var(--ipn-text);
}
.ipn-user-menu.is-open{
  display:block;
}
/* AV: 2026-07-20: identity como <span> dentro del trigger button */
.ipn-user-menu-trigger .ipn-secure-topbar__identity,
.ipn-user-menu-trigger .ipn-ap-topbar__identity{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

.ipn-user-menu__identity{
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 16px 14px;
  border-bottom:1px solid #eef1f6;
}
.ipn-user-menu__avatar{
  flex:0 0 auto;
  width:46px;
  height:46px;
  border-radius:50%;
  background:var(--ipn-header-avatar, #2f6bb5);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
}
.ipn-user-menu__who{ min-width:0; flex:1 1 auto; }
.ipn-user-menu__who-name{
  font-size:14px;
  font-weight:700;
  color:#1e293b;
  line-height:1.25;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ipn-user-menu__who-role{
  margin-top:2px;
  font-size:12.5px;
  color:#8493a6;
  line-height:1.3;
}
.ipn-user-menu__who-code{
  margin-top:4px;
  font-size:12px;
  color:#5b6b80;
  line-height:1.3;
}
.ipn-user-menu__who-code .ipn-mono{
  font-family:var(--ipn-font-mono);
  font-variant-numeric:tabular-nums;
  color:#5b6b80;
}

.ipn-user-menu__primary{ padding:12px 16px 4px; }
.ipn-user-menu__btn-account{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  min-height:40px;
  padding:0 14px;
  border-radius:9px;
  /* AV: 2026-07-22: mismo color de personalizaci?n que el header (+ contraste fg) */
  background:var(--ipn-header-bg, #1d4e86);
  color:var(--ipn-header-fg, #fff) !important;
  font-size:13.5px;
  font-weight:600;
  text-decoration:none !important;
  border:0;
  transition:filter .12s ease, background .12s ease;
}
.ipn-user-menu__btn-account:hover{
  filter:brightness(0.92);
  color:var(--ipn-header-fg, #fff) !important;
  text-decoration:none !important;
}
.ipn-user-menu__btn-account .material-symbols-rounded{ font-size:18px; }

.ipn-user-menu__nav{
  display:flex;
  flex-direction:column;
  padding:8px 8px 10px;
  gap:2px;
}
.ipn-user-menu__item{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:48px;
  padding:8px 10px;
  border-radius:10px;
  text-decoration:none !important;
  color:inherit;
  transition:background .12s ease;
}
.ipn-user-menu__item:hover{
  background:#f4f7fb;
  text-decoration:none !important;
  color:inherit;
}
.ipn-user-menu__item-icon{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ipn-user-menu__item-icon .material-symbols-rounded{ font-size:20px; }
.ipn-user-menu__item-icon--blue{ background:#e8f0fa; color:#1d4e86; }
.ipn-user-menu__item-icon--teal{ background:#e5f5f2; color:#1a7a6a; }
.ipn-user-menu__item-icon--indigo{ background:#ece8f8; color:#4b3f9a; }
.ipn-user-menu__item-icon--violet{ background:#f0e8f7; color:#6b3f8a; }
.ipn-user-menu__item-icon--amber{ background:#f7efdf; color:#946318; }
.ipn-user-menu__item-label{
  flex:1 1 auto;
  min-width:0;
  font-size:13.5px;
  font-weight:700;
  color:#1e293b;
  line-height:1.3;
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.ipn-user-menu__item-arrow{
  flex:0 0 auto;
  font-size:18px !important;
  color:#9aa4b1;
}
.ipn-user-menu__badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  background:#e5484d;
  color:#fff;
  font-size:11px;
  font-weight:700;
  line-height:1;
}

/* AV: 2026-07-20: bloque secure al pie del nav (separado del resto) */
.ipn-user-menu__secure{
  display:flex;
  flex-direction:column;
  gap:2px;
  margin-top:6px;
  padding-top:8px;
  border-top:1px solid #eef1f6;
}
.ipn-user-menu__secure-sep{
  display:flex;
  align-items:center;
  padding:2px 10px 4px;
}
.ipn-user-menu__secure-cap{
  font-size:10.5px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#9aa4b1;
  line-height:1.2;
}

/* AV: 2026-07-20: aire alrededor de Cambiar RS / Cerrar sesi?n */
.ipn-user-menu__actions{
  display:flex;
  gap:10px;
  padding:12px 14px;
  border-top:1px solid #eef1f6;
}
.ipn-user-menu__btn-action{
  flex:1 1 0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:40px;
  margin:0;
  padding:0 10px;
  border-radius:9px;
  border:1px solid #d4dbe6;
  background:#fff;
  color:#4a5a6e !important;
  font-size:12.5px;
  font-weight:600;
  text-decoration:none !important;
  transition:background .12s ease, border-color .12s ease;
}
.ipn-user-menu__btn-action:hover{
  background:#f4f6f9;
  border-color:#c5cedb;
  color:#4a5a6e !important;
  text-decoration:none !important;
}
.ipn-user-menu__btn-action .material-symbols-rounded{ font-size:18px; }

@media (max-width:700px){
  .ipn-user-menu{
    width:calc(100vw - 32px);
    right:-8px;
  }
}

/* =====================================================================
   24. SELECCI?N DE RAZ?N SOCIAL ? defaultSelectedCompany.asp
   AV: 2026-07-20: scope .ipn-rsc; shell adminPanel (header/footer).
   ===================================================================== */
.ipn-rsc{
  font-family:var(--ipn-font);
  color:#1e293b;
}
.ipn-rsc-hero{ margin:0 0 22px; }
.ipn-rsc-hero__eyebrow{
  margin:0 0 8px;
  font-size:11.5px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#8493a6;
}
.ipn-rsc-hero__title{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0 0 8px;
  flex-wrap:wrap;
}
.ipn-rsc-hero__icon{
  flex:0 0 auto;
  width:40px;
  height:40px;
  border-radius:10px;
  background:var(--ipn-primary-soft, #e8f0fa);
  color:var(--ipn-secure-primary, #1d4e86);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ipn-rsc-hero__icon .material-symbols-rounded{ font-size:22px; }
.ipn-rsc-hero__name{
  font-size:26px;
  font-weight:700;
  line-height:1.2;
  color:var(--ipn-secure-primary, #1d4e86);
}
.ipn-rsc-hero__sub{
  margin:0;
  font-size:14px;
  color:#5b6b80;
  line-height:1.45;
  max-width:42em;
}

.ipn-rsc-toolbar{
  margin:0 0 14px;
}
.ipn-rsc-search{
  position:relative;
  display:block;
  width:100%;
  max-width:380px;
}
.ipn-rsc-search__icon{
  position:absolute;
  left:12px;
  top:50%;
  transform:translateY(-50%);
  font-size:20px !important;
  color:#8493a6;
  pointer-events:none;
}
.ipn-rsc-search__input{
  width:100%;
  height:var(--ipn-touch-min, 44px);
  min-height:var(--ipn-touch-min, 44px);
  padding:0 14px 0 42px;
  border:1px solid #d4dbe6;
  border-radius:10px;
  background:#fff;
  font:inherit;
  font-size:14px;
  color:#1e293b;
  box-sizing:border-box;
}
.ipn-rsc-search__input:focus{
  outline:none;
  border-color:#1d4e86;
  box-shadow:0 0 0 3px rgba(29,78,134,.14);
}
.ipn-rsc-search__input::placeholder{ color:#9aa4b1; }

.ipn-rsc-card{
  overflow:hidden;
  border:1px solid #e2e7ef;
  border-radius:14px;
  box-shadow:0 1px 2px rgba(16,32,55,.04);
  background:#fff;
}
.ipn-rsc-card .ipn-table-wrap{
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
}

.ipn-rsc-table{
  width:100%;
  border-collapse:collapse;
  font-size:13.5px;
}
.ipn-rsc-table thead th{
  padding:12px 16px;
  text-align:left;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#8493a6;
  background:#f8fafc;
  border-bottom:1px solid #eef1f6;
  white-space:nowrap;
}
.ipn-rsc-table .ipn-rsc-th-num{ text-align:right; }
.ipn-rsc-table .ipn-rsc-th-action{ width:1%; }
.ipn-rsc-table tbody td{
  padding:14px 16px;
  border-bottom:1px solid #eef1f6;
  vertical-align:middle;
  color:#1e293b;
}
.ipn-rsc-table tbody tr.ipn-rsc-row{
  cursor:pointer;
  transition:background .12s ease;
}
.ipn-rsc-table tbody tr.ipn-rsc-row:hover,
.ipn-rsc-table tbody tr.ipn-rsc-row:focus{
  background:#f6f9fd;
  outline:none;
}
.ipn-rsc-table tbody tr.ipn-rsc-row:focus-visible{
  outline:2px solid #1d4e86;
  outline-offset:-2px;
}

.ipn-rsc-company{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.ipn-rsc-avatar{
  flex:0 0 auto;
  width:40px;
  height:40px;
  border-radius:10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
  color:#fff;
}
.ipn-rsc-avatar--0{ background:#2f6bb5; }
.ipn-rsc-avatar--1{ background:#1a7a6a; }
.ipn-rsc-avatar--2{ background:#6b3f8a; }
.ipn-rsc-avatar--3{ background:#946318; }
.ipn-rsc-avatar--4{ background:#b0525a; }
.ipn-rsc-avatar--5{ background:#3f6091; }
.ipn-rsc-company__text{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.ipn-rsc-company__name{
  font-weight:700;
  font-size:14px;
  color:#1e293b;
  line-height:1.3;
}
.ipn-rsc-company__meta{
  font-size:12.5px;
  color:#8493a6;
  line-height:1.3;
}

.ipn-rsc-cuit{
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  color:#5b6b80;
}
.ipn-rsc-num{
  text-align:right;
  font-variant-numeric:tabular-nums;
  font-weight:600;
  color:#5b6b80;
}

.ipn-rsc-badge{
  display:inline-flex;
  align-items:center;
  max-width:100%;
  padding:4px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
  line-height:1.3;
  white-space:normal;
}
.ipn-rsc-badge--blue{ background:#e8effa; color:#1d4e86; }
.ipn-rsc-badge--teal{ background:#e9f3f5; color:#1a7085; }
.ipn-rsc-badge--gray{ background:#eef1f6; color:#5b6b80; }

.ipn-rsc-action{ text-align:right; white-space:nowrap; }
.ipn-rsc-operate{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:var(--ipn-touch-min, 44px);
  font-size:13.5px;
  font-weight:600;
  color:#2563a8;
}
.ipn-rsc-row:hover .ipn-rsc-operate{ color:#1c4a80; }
.ipn-rsc-operate__arrow{ font-weight:700; }

.ipn-rsc-empty{
  padding:28px 20px;
  text-align:center;
  font-size:14px;
  color:#8493a6;
  border-top:1px solid #eef1f6;
}
.ipn-visually-hidden{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0);
  white-space:nowrap; border:0;
}

@media (max-width:700px){
  .ipn-rsc-hero__name{ font-size:22px; }
  .ipn-rsc-search{ max-width:none; }
  .ipn-rsc-table thead th,
  .ipn-rsc-table tbody td{ padding:12px 12px; }
  .ipn-rsc-company__name{ font-size:13.5px; }
}

/* =====================================================================
   22. SALES DASHBOARD ENTERPRISE (.ipn-sales-dash)
   AV: 2026-07-21: Design language enterprise (SAP/Odoo) ? tokens + componentes
   del Dashboard de ventas. Reutilizar .ipn-sd-* / .ipn-ent-* en otros dashboards.
   ===================================================================== */
:root{
  --ipn-ent-navy:#0f2544;
  --ipn-ent-accent:#1d4e86;
  --ipn-ent-teal:#0f766e;
  --ipn-ent-violet:#5b3fb0;
  --ipn-ent-positive:#1f7a52;
  --ipn-ent-negative:#b0525a;
  --ipn-ent-app-bg:#f4f6fa;
  --ipn-ent-border:#e4e9f0;
  --ipn-ent-grid:#eef1f6;
  --ipn-ent-shadow:0 1px 2px rgba(15,37,68,.04);
  --ipn-ent-radius:12px;
  --ipn-ent-gold:#c9a227;
}

.ipn-sales-dash{
  font-family:var(--ipn-font);
  color:var(--ipn-ent-navy);
  background:var(--ipn-ent-app-bg);
  padding:8px 4px 32px;
  box-sizing:border-box;
}
.ipn-sales-dash *,
.ipn-sales-dash *::before,
.ipn-sales-dash *::after{ box-sizing:border-box; }
.ipn-sales-dash .ipn-num,
.ipn-sales-dash .ipn-sd-kpi__value,
.ipn-sales-dash .ipn-sd-rank__amt,
.ipn-sales-dash .ipn-sd-prod__amt{
  font-variant-numeric:tabular-nums;
  letter-spacing:-.2px;
}

/* --- Cards planas --- */
.ipn-ent-card{
  background:#fff;
  border:1px solid var(--ipn-ent-border);
  border-radius:var(--ipn-ent-radius);
  box-shadow:var(--ipn-ent-shadow);
}
.ipn-ent-card__head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  padding:16px 18px 0;
}
.ipn-ent-card__title{
  margin:0; font-size:15px; font-weight:700; color:var(--ipn-ent-navy); letter-spacing:-.01em;
}
.ipn-ent-card__sub{
  margin:4px 0 0; font-size:12.5px; font-weight:500; color:#8493a6;
}
.ipn-ent-card__body{ padding:14px 18px 18px; }
.ipn-ent-card__link{
  font-size:13px; font-weight:600; color:var(--ipn-ent-accent); text-decoration:none;
  white-space:nowrap; display:inline-flex; align-items:center; gap:4px;
}
.ipn-ent-card__link:hover{ text-decoration:underline; }

/* --- SVG icons --- */
.ipn-ent-ico{
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 auto; line-height:0;
}
.ipn-ent-ico svg{
  width:18px; height:18px;
  stroke:currentColor; fill:none;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}
.ipn-ent-ico--sm svg{ width:14px; height:14px; }
.ipn-ent-ico--lg svg{ width:20px; height:20px; }
.ipn-ent-tile{
  width:32px; height:32px; border-radius:8px;
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 auto;
}
.ipn-ent-tile--navy{ background:#e8eef6; color:var(--ipn-ent-accent); }
.ipn-ent-tile--teal{ background:#e6f3f1; color:var(--ipn-ent-teal); }
.ipn-ent-tile--violet{ background:#efeaf8; color:var(--ipn-ent-violet); }
.ipn-ent-tile--gray{ background:#eef1f6; color:#5b6b80; }

/* --- Page head --- */
.ipn-sd-head{
  display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between;
  gap:16px 24px; margin:4px 0 20px;
}
.ipn-sd-head__text{ min-width:0; flex:1 1 280px; }
.ipn-sd-eyebrow{
  margin:0 0 6px; font-size:11px; font-weight:700; letter-spacing:.08em;
  text-transform:uppercase; color:#8493a6;
}
.ipn-sd-title{
  margin:0; font-size:28px; font-weight:700; line-height:1.15;
  color:var(--ipn-ent-navy); letter-spacing:-.02em;
}
.ipn-sd-status{
  display:inline-flex; align-items:center; gap:8px;
  margin-top:8px; font-size:12.5px; color:#8493a6; font-weight:500;
}
.ipn-sd-status__dot{
  width:8px; height:8px; border-radius:50%;
  background:var(--ipn-ent-positive);
  box-shadow:0 0 0 3px rgba(31,122,82,.18);
  flex:0 0 auto;
}
.ipn-sd-controls{
  display:flex; flex-wrap:nowrap; align-items:center; gap:10px;
  flex:0 1 auto; max-width:100%;
}
.ipn-sd-seg{
  display:inline-flex; align-items:center; padding:3px;
  background:#eef1f6; border-radius:10px; border:1px solid var(--ipn-ent-border);
  flex:0 0 auto;
}
.ipn-sd-seg__btn{
  appearance:none; border:0; background:transparent; cursor:pointer;
  height:34px; padding:0 14px; border-radius:8px;
  font:inherit; font-size:13px; font-weight:600; color:#5b6b80;
  white-space:nowrap;
}
.ipn-sd-seg__btn.is-active{
  background:var(--ipn-ent-navy); color:#fff;
  box-shadow:0 1px 2px rgba(15,37,68,.12);
}
.ipn-sd-seg__btn:focus-visible{ outline:2px solid var(--ipn-ent-accent); outline-offset:2px; }
.ipn-sd-export{
  display:inline-flex; align-items:center; gap:8px;
  height:40px; padding:0 14px; border-radius:10px;
  border:1px solid var(--ipn-ent-border); background:#fff;
  color:var(--ipn-ent-navy); font:inherit; font-size:13px; font-weight:600;
  cursor:pointer; white-space:nowrap; box-shadow:var(--ipn-ent-shadow);
}
.ipn-sd-export:hover{ background:#f7f9fc; }
.ipn-sd-export .ipn-ent-ico{ color:#5b6b80; }

/* --- Hero KPIs --- */
.ipn-sd-hero{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px; margin-bottom:14px;
}
.ipn-sd-kpi{
  position:relative; overflow:hidden;
  padding:16px 18px 14px 20px;
  background:#fff; border:1px solid var(--ipn-ent-border);
  border-radius:var(--ipn-ent-radius); box-shadow:var(--ipn-ent-shadow);
  display:flex; flex-direction:column; gap:10px; min-width:0;
}
.ipn-sd-kpi::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--ipn-ent-navy);
}
.ipn-sd-kpi--navy::before{ background:var(--ipn-ent-navy); }
.ipn-sd-kpi--teal::before{ background:var(--ipn-ent-teal); }
.ipn-sd-kpi--violet::before{ background:var(--ipn-ent-violet); }
.ipn-sd-kpi__top{
  display:flex; align-items:flex-start; justify-content:space-between; gap:10px;
}
.ipn-sd-kpi__label{
  margin:0; font-size:12.5px; font-weight:600; color:#5b6b80; line-height:1.35;
}
.ipn-sd-kpi__value{
  margin:0; font-size:28px; font-weight:700; color:var(--ipn-ent-navy);
  line-height:1.05; letter-spacing:-.2px; font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
}
.ipn-sd-kpi__foot{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px;
  font-size:12px; color:#8493a6;
}
.ipn-sd-trend{
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 8px; border-radius:999px;
  font-size:12px; font-weight:700; line-height:1.2;
}
.ipn-sd-trend.is-up{ background:#e8f5ee; color:var(--ipn-ent-positive); }
.ipn-sd-trend.is-down{ background:#f8eaea; color:var(--ipn-ent-negative); }
.ipn-sd-trend.is-flat{ background:#eef1f6; color:#8493a6; }
.ipn-sd-trend .ipn-ent-ico svg{ width:12px; height:12px; }

/* --- Secondary KPIs --- */
.ipn-sd-sec{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px; margin-bottom:14px;
}
.ipn-sd-sec-kpi{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px;
  background:#fff; border:1px solid var(--ipn-ent-border);
  border-radius:var(--ipn-ent-radius); box-shadow:var(--ipn-ent-shadow);
  min-width:0;
}
.ipn-sd-sec-kpi__meta{ min-width:0; }
.ipn-sd-sec-kpi__label{
  margin:0 0 4px; font-size:12.5px; font-weight:600; color:#5b6b80;
}
.ipn-sd-sec-kpi__value{
  margin:0; font-size:22px; font-weight:700; color:var(--ipn-ent-navy);
  letter-spacing:-.2px; font-variant-numeric:tabular-nums;
}

/* --- Chart card --- */
.ipn-sd-chart{ margin-bottom:14px; }
.ipn-sd-chart .ipn-ent-card__head{ align-items:center; padding-bottom:8px; }
.ipn-sd-chart__legend{
  display:inline-flex; align-items:center; gap:14px;
  font-size:12px; font-weight:600; color:#5b6b80;
}
.ipn-sd-chart__swatch{
  display:inline-flex; align-items:center; gap:6px;
}
.ipn-sd-chart__swatch i{
  display:inline-block; width:10px; height:10px; border-radius:2px;
  background:var(--ipn-ent-navy);
}
.ipn-sd-chart__swatch--line i{
  width:8px; height:8px; border-radius:50%; background:var(--ipn-ent-teal);
}
.ipn-sd-chart__canvas-wrap{
  position:relative; height:280px; width:100%;
  padding:0 8px 8px;
}

/* --- Split: donut + ranking --- */
.ipn-sd-split{
  display:grid; grid-template-columns:minmax(260px,.9fr) minmax(0,1.4fr);
  gap:14px; margin-bottom:14px; align-items:stretch;
}
.ipn-sd-donut__wrap{
  position:relative; height:220px; max-width:260px; margin:0 auto;
}
.ipn-sd-donut__center{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; pointer-events:none;
  text-align:center;
}
.ipn-sd-donut__center span{
  font-size:11px; font-weight:600; color:#8493a6; text-transform:uppercase; letter-spacing:.04em;
}
.ipn-sd-donut__center strong{
  font-size:20px; font-weight:700; color:var(--ipn-ent-navy);
  letter-spacing:-.2px; font-variant-numeric:tabular-nums;
}
.ipn-sd-donut__legend{
  list-style:none; margin:12px 0 0; padding:0;
  display:flex; flex-direction:column; gap:8px;
}
.ipn-sd-donut__legend li{
  display:flex; align-items:center; gap:8px;
  font-size:12.5px; color:#5b6b80; font-weight:500;
}
.ipn-sd-donut__legend i{
  width:8px; height:8px; border-radius:50%; flex:0 0 auto;
}
.ipn-sd-donut__legend b{
  margin-left:auto; font-variant-numeric:tabular-nums; color:var(--ipn-ent-navy);
}

.ipn-sd-rank{ width:100%; border-collapse:collapse; font-size:13px; }
.ipn-sd-rank th{
  text-align:left; font-size:11px; font-weight:700; color:#8493a6;
  text-transform:uppercase; letter-spacing:.04em;
  padding:0 8px 10px; border-bottom:1px solid var(--ipn-ent-grid);
}
.ipn-sd-rank td{
  padding:10px 8px; border-bottom:1px solid var(--ipn-ent-grid);
  vertical-align:middle; color:var(--ipn-ent-navy);
}
.ipn-sd-rank tr:last-child td{ border-bottom:0; }
.ipn-sd-rank__n{
  width:28px; font-weight:700; color:#8493a6; font-variant-numeric:tabular-nums;
}
.ipn-sd-rank__n.is-gold{ color:var(--ipn-ent-gold); }
.ipn-sd-rank__name{ font-weight:600; min-width:0; }
.ipn-sd-rank__bar{
  width:100%; max-width:120px; height:6px; border-radius:999px;
  background:#eef1f6; overflow:hidden;
}
.ipn-sd-rank__bar > span{
  display:block; height:100%; border-radius:999px; background:#c5d0de;
}
.ipn-sd-rank__bar.is-lead > span{ background:var(--ipn-ent-navy); }
.ipn-sd-rank__amt{
  text-align:right; font-weight:700; white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.ipn-sd-rank__meta{
  text-align:right; color:#8493a6; font-size:12px; white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.ipn-sd-rank__pct{
  text-align:right; font-weight:600; color:#5b6b80; white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
.ipn-sd-rank__total td{
  border-top:1px solid var(--ipn-ent-border); border-bottom:0;
  padding-top:12px; font-weight:700;
}

/* --- Top productos --- */
.ipn-sd-prods{ margin-bottom:14px; }
.ipn-sd-prods__grid{
  display:grid; grid-template-columns:1fr 1fr; gap:4px 28px;
}
.ipn-sd-prod{
  display:grid;
  grid-template-columns:28px minmax(0,1fr) auto auto;
  gap:10px; align-items:center;
  padding:10px 4px; border-bottom:1px solid var(--ipn-ent-grid);
}
.ipn-sd-prod:last-child{ border-bottom:0; }
.ipn-sd-prod__rank{
  font-size:13px; font-weight:700; color:#8493a6;
  font-variant-numeric:tabular-nums;
}
.ipn-sd-prod__name{
  margin:0; font-size:13.5px; font-weight:700; color:var(--ipn-ent-navy);
  line-height:1.25; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.ipn-sd-prod__name a{ color:inherit; text-decoration:none; }
.ipn-sd-prod__name a:hover{ text-decoration:underline; }
.ipn-sd-prod__sub{
  margin:2px 0 0; font-size:12px; color:#8493a6; font-weight:500;
}
.ipn-sd-prod__amt{
  font-size:13.5px; font-weight:700; color:var(--ipn-ent-navy);
  white-space:nowrap; font-variant-numeric:tabular-nums;
}
.ipn-sd-prod__trend{ white-space:nowrap; justify-self:end; }

/* --- Filters (rango) --- */
.ipn-sd-filters{
  margin-bottom:14px; padding:0;
}
.ipn-sd-filters.is-collapsed .ipn-sd-filters__body{ display:none; }
.ipn-sd-filters__toggle{
  width:100%; display:flex; align-items:center; justify-content:space-between;
  gap:12px; padding:14px 18px; border:0; background:transparent;
  cursor:pointer; font:inherit; font-size:14px; font-weight:700; color:var(--ipn-ent-navy);
  text-align:left;
}
.ipn-sd-filters__body{ padding:0 18px 18px; }
.ipn-sd-filters__grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 24px;
}
.ipn-sd-filters label{ font-size:12.5px; font-weight:600; color:#5b6b80; }
.ipn-sd-filters .ipn-input,
.ipn-sd-filters select{
  height:38px; border:1px solid #d5dbe6; border-radius:8px;
  padding:0 10px; font:inherit; font-size:13px; color:var(--ipn-ent-navy);
  background:#fff; max-width:100%;
}
.ipn-sd-filters__stores{ grid-column:1 / -1; }
.ipn-sd-filters__actions{ margin-top:14px; display:flex; gap:10px; flex-wrap:wrap; }

/* --- Legacy sections below --- */
.ipn-sd-section{ margin-bottom:14px; }
.ipn-sd-section .grilla_financiera{
  width:100%; border-collapse:collapse; font-size:13px;
}
.ipn-sd-section .grilla_financiera th{
  text-align:left; font-size:11px; font-weight:700; color:#8493a6;
  text-transform:uppercase; letter-spacing:.04em;
  padding:8px 10px; border-bottom:1px solid var(--ipn-ent-grid);
}
.ipn-sd-section .grilla_financiera td{
  padding:8px 10px; border-bottom:1px solid var(--ipn-ent-grid);
  vertical-align:middle;
}
.ipn-sd-section .grilla_financiera .tr_totales td{
  font-weight:700; border-top:1px solid var(--ipn-ent-border); border-bottom:0;
}
.ipn-sd-section__head{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  flex-wrap:wrap; margin-bottom:10px;
}
.ipn-sd-section__head h2{
  margin:0; font-size:15px; font-weight:700; color:var(--ipn-ent-navy);
}

/* --- Responsive --- */
@media (max-width:1280px){
  .ipn-sd-title{ font-size:24px; }
}
@media (max-width:1024px){
  .ipn-sd-split{ grid-template-columns:1fr; }
  .ipn-sd-prods__grid{ grid-template-columns:1fr; }
}
@media (max-width:900px){
  .ipn-sd-head{ flex-direction:column; align-items:stretch; }
  .ipn-sd-controls{ width:100%; justify-content:flex-start; overflow-x:auto; }
  .ipn-sd-hero{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ipn-sd-sec{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .ipn-sd-filters__grid{ grid-template-columns:1fr; }
}
@media (max-width:700px){
  .ipn-sd-hero,
  .ipn-sd-sec{ grid-template-columns:1fr; }
  .ipn-sd-title{ font-size:22px; }
  .ipn-sd-kpi__value{ font-size:24px; }
  .ipn-sd-chart__canvas-wrap{ height:240px; }
  .ipn-sd-prod{
    grid-template-columns:24px minmax(0,1fr) auto;
    grid-template-rows:auto auto;
  }
  .ipn-sd-prod__trend{ grid-column:3; grid-row:1; }
  .ipn-sd-prod__amt{ grid-column:2 / 4; grid-row:2; justify-self:start; }
}

/* =====================================================================
   23. Ticket detail ? stacking Choices vs Tagify
   AV: 2026-07-21: QA 2.2 ? tags/placeholder de Tagify quedaban encima del
   dropdown ?Asignado a? (Choices) porque Tags va despu?s en el DOM.
   ===================================================================== */
.ipn-ticketdetail .choices{
  position:relative;
  z-index:2;
}
.ipn-ticketdetail .choices.is-open{
  z-index:50;
}
.ipn-ticketdetail .ipn-td-field:has(.choices.is-open){
  position:relative;
  z-index:50;
}
.ipn-ticketdetail .choices__list--dropdown,
.ipn-ticketdetail .choices__list[aria-expanded="true"]{
  z-index:51;
}
.ipn-ticketdetail .tagify{
  position:relative;
  z-index:1;
}
.ipn-ticketdetail .tagify.tagify--focus,
.ipn-ticketdetail .tagify:focus-within{
  z-index:50;
}
.ipn-ticketdetail .tagify__dropdown{
  z-index:60;
}

/* =====================================================================
   24. Upload popup (.ipn-upload-popup) + chrome #iPNpopUpDiv
   AV: 2026-07-21: QA 2.5.1 ? UI iPN2 del popup gen?rico de archivos
   ===================================================================== */
body:has(.ipn-secure-wrap) #iPNpopUpDiv.iPNpopUpDiv,
body:has(.ipn-ticketdetail) #iPNpopUpDiv.iPNpopUpDiv,
.ipn-secure #iPNpopUpDiv.iPNpopUpDiv{
  padding:0;
  border-radius:14px;
  border:1px solid var(--ipn-hairline);
  box-shadow:0 16px 48px rgba(22,41,77,.22);
  overflow:hidden;
  background:#fff;
}
body:has(.ipn-secure-wrap) #iPNpopUpDiv.iPNpopUpDiv iframe,
body:has(.ipn-ticketdetail) #iPNpopUpDiv.iPNpopUpDiv iframe,
.ipn-secure #iPNpopUpDiv.iPNpopUpDiv iframe{
  display:block;
  border:0;
  background:#fff;
  vertical-align:top;
}

html:has(.ipn-upload-popup),
.ipn-upload-popup{
  height:100%;
  margin:0;
}
.ipn-upload-popup{
  font-family:var(--ipn-font, Inter, "IBM Plex Sans", system-ui, sans-serif);
  color:var(--ipn-text, #16294d);
  background:#fff;
  overflow:hidden;
}
.ipn-upload-popup *{ box-sizing:border-box; }
.ipn-upload-popup__shell{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:100%;
}
.ipn-upload-popup__head{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid var(--ipn-hairline, #e6e9ef);
  background:var(--ipn-surface-soft, #f7f9fc);
}
.ipn-upload-popup__title{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0;
  font-size:15px;
  font-weight:700;
  color:var(--ipn-text, #16294d);
  line-height:1.25;
}
.ipn-upload-popup__title .material-symbols-rounded{
  font-size:22px;
  color:var(--ipn-primary, #3f6091);
}
.ipn-upload-popup__close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--ipn-text-3, #6b7685);
  cursor:pointer;
  padding:0;
}
.ipn-upload-popup__close:hover{
  background:rgba(22,41,77,.06);
  color:var(--ipn-text, #16294d);
}
.ipn-upload-popup__close .material-symbols-rounded{ font-size:20px; }
.ipn-upload-popup__body{
  flex:1 1 auto;
  overflow:auto;
  padding:22px 20px 16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:14px;
}
.ipn-upload-popup__lead{
  margin:0;
  font-size:13.5px;
  font-weight:600;
  color:var(--ipn-text-2, #55606f);
}
.ipn-upload-popup__drop{
  width:100%;
  max-width:340px;
  border:1.5px dashed var(--ipn-border-input, #d7dce4);
  border-radius:12px;
  background:var(--ipn-surface-soft-2, #fbfcfe);
  padding:22px 18px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
.ipn-upload-popup__drop-icon{
  width:48px;
  height:48px;
  border-radius:12px;
  background:var(--ipn-primary-soft, #e9eff9);
  color:var(--ipn-primary, #3f6091);
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.ipn-upload-popup__drop-icon .material-symbols-rounded{ font-size:26px; }
.ipn-upload-popup__filebtn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:40px;
  padding:0 18px;
  border-radius:9px;
  background:var(--ipn-primary, #3f6091);
  color:#fff;
  font-size:13.5px;
  font-weight:600;
  cursor:pointer;
  border:0;
  user-select:none;
}
.ipn-upload-popup__filebtn:hover{ background:var(--ipn-primary-hover, #33507b); }
.ipn-upload-popup__filebtn.is-disabled,
.ipn-upload-popup__filebtn.btnDisabled{
  opacity:.55;
  pointer-events:none;
  cursor:default;
}
.ipn-upload-popup__filebtn input[type=file]{
  /* AV: 2026-07-21: input transparente encima del CTA (clicks nativos) */
  position:absolute;
  inset:0;
  opacity:0;
  width:100%;
  height:100%;
  cursor:pointer;
  font-size:0;
  overflow:hidden;
}
.ipn-upload-popup__hint{
  margin:0;
  max-width:340px;
  font-size:12.5px;
  line-height:1.45;
  color:var(--ipn-text-3, #6b7685);
  text-align:center;
}
.ipn-upload-popup__hint strong{
  color:var(--ipn-text-2, #55606f);
  font-weight:600;
}
.ipn-upload-popup__progress{
  width:100%;
  max-width:340px;
  max-height:140px;
  overflow:auto;
  text-align:left;
  font-size:12.5px;
  line-height:1.45;
  color:var(--ipn-text-2, #55606f);
}
.ipn-upload-popup__progress p{
  margin:0 0 6px;
  padding:8px 10px;
  border-radius:8px;
  background:var(--ipn-surface-soft, #f7f9fc);
  border:1px solid var(--ipn-hairline, #e6e9ef);
}
.ipn-upload-popup__progress p[style*="green"],
.ipn-upload-popup__progress .is-ok{ color:var(--ipn-success, #1a9b57) !important; }
.ipn-upload-popup__foot{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
  gap:10px;
  padding:12px 16px;
  border-top:1px solid var(--ipn-hairline, #e6e9ef);
  background:#fff;
}
.ipn-upload-popup__error{
  margin:24px 20px;
  padding:14px 16px;
  border-radius:10px;
  background:var(--ipn-danger-chip-bg, #fbe8e8);
  color:var(--ipn-danger-chip-fg, #b83232);
  font-size:13.5px;
  line-height:1.45;
}

/* =====================================================================
   25. CUSTOMER STORES ADD (.ipn-csa)
   AV: 2026-07-21: Form alta/edicion sucursal ? tabs/card/grid iPN2
   ===================================================================== */
.ipn-csa{ margin-top:4px; }
.ipn-csa .ipn-tabs{ margin-bottom:14px; }
.ipn-csa__hint{
  margin:0 0 14px;
  font-size:13px;
  color:var(--ipn-text-2,#5b6b80);
  line-height:1.45;
}
.ipn-csa__readonly{
  display:inline-block;
  font-size:13px;
  color:var(--ipn-text-2,#5b6b80);
  padding-top:4px;
}
.ipn-csa .ipn-input--sm,
.ipn-csa .ipn-field--sm .ipn-input{
  max-width:160px;
}
.ipn-csa #judisdictionDiv select,
.ipn-csa #storeTypeID{
  width:100%;
}
.ipn-csa-billing-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) 160px;
  gap:12px;
  margin:0 0 10px;
  padding:0 0 8px;
  border-bottom:1px solid var(--ipn-hairline,#e6e9ef);
  font-size:12px;
  font-weight:600;
  color:var(--ipn-text-2,#5b6b80);
}
.ipn-csa-billing-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 48px;
  gap:12px;
  align-items:center;
  padding:10px 0;
  border-bottom:1px solid var(--ipn-hairline,#eef1f6);
}
.ipn-csa-billing-row:last-child{ border-bottom:0; }
.ipn-csa-help{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  margin-left:6px;
  padding:0;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#8493a6;
  cursor:pointer;
  vertical-align:middle;
}
.ipn-csa-help:hover{ color:var(--ipn-primary,#1d4e86); background:#f0f4f9; }
.ipn-csa-help .material-symbols-rounded{ font-size:20px; }
.ipn-csa-restock-group{
  display:flex;
  align-items:center;
  gap:8px;
  margin:14px 0 6px;
  font-size:13px;
}
.ipn-csa-restock-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px 0 4px 22px;
  font-size:13px;
}
.ipn-csa-restock-item label{ cursor:pointer; }
@media (max-width:700px){
  .ipn-csa-billing-head,
  .ipn-csa-billing-row{ grid-template-columns:minmax(0,1fr); }
  .ipn-csa .ipn-input--sm{ max-width:none; }
}

/* =====================================================================
   26. TICKET DETAIL ? identidad de usuario (QA 2.3)
   AV: 2026-07-21: [id] Nombre [username] / cargo / [Cuenta N]
   ===================================================================== */
.ipn-ticketdetail .ipn-user-idblock,
.ipn-td-side .ipn-user-idblock{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
}
.ipn-ticketdetail .ipn-user-idblock__line1,
.ipn-td-side .ipn-user-idblock__line1{
  font-size:13px;
  font-weight:700;
  color:var(--ipn-text,#0f2544);
  line-height:1.35;
  word-break:break-word;
}
.ipn-ticketdetail .ipn-user-idblock__line2,
.ipn-td-side .ipn-user-idblock__line2{
  font-size:12.5px;
  font-weight:500;
  color:var(--ipn-text-2,#5b6b80);
  line-height:1.35;
}
.ipn-ticketdetail .ipn-user-idblock__line3,
.ipn-td-side .ipn-user-idblock__line3{
  font-size:12px;
  font-weight:600;
  color:var(--ipn-text-3,#8493a6);
  line-height:1.35;
}
.ipn-td-side .ipn-td-dl__row--stack{
  align-items:flex-start;
}
.ipn-td-side .ipn-td-dl__row--stack .ipn-td-dl__k{
  padding-top:2px;
}
.ipn-ticketdetail .ipn-comment__who .ipn-user-idblock__line1{
  font-size:13.5px;
}

/* =====================================================================
   23. USERS LOG ? actividad de cuenta (usersLog.asp, full-viewport)
   AV: 2026-07-21
   ===================================================================== */
/* AV: 2026-07-21: meta de version en auditoria de cambios (secure/audit) */
.ipn-audit-block__meta{
  padding:12px 16px;
  font-size:13px;
  color:var(--ipn-text-2,#5b6b80);
  border-bottom:1px solid var(--ipn-hairline,#e2e7ef);
  background:#f8fafc;
}
.ipn-audit-block__user{
  font-weight:600;
  color:var(--ipn-primary,#3f6091);
}
html:has(.ipn-ulog),
body:has(.ipn-ulog){
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  max-width:none !important;
  min-height:100vh;
  background:var(--ipn-page-bg,#eef1f6) !important;
  font-family:var(--ipn-font);
}
.ipn-ulog{
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  background:var(--ipn-page-bg,#eef1f6);
  color:var(--ipn-text,#0f2544);
  font-family:var(--ipn-font);
  box-sizing:border-box;
}
.ipn-ulog *,
.ipn-ulog *::before,
.ipn-ulog *::after{ box-sizing:border-box; }
.ipn-ulog > .ipn-secure-topbar{
  flex:0 0 auto;
  width:100%;
}
.ipn-ulog__main{
  flex:1 1 auto;
  width:100%;
  max-width:var(--ipn-secure-content-max,1440px);
  margin:0 auto;
  padding:20px 24px 40px;
}
.ipn-ulog .ipn-page-head{ margin-bottom:18px; }
.ipn-ulog .ipn-card__head{
  padding:14px 20px;
  border-bottom:1px solid var(--ipn-hairline,#e2e7ef);
}
/* AV: 2026-07-21: columna Detalles (UA) en grilla iPN2 */
.ipn-ulog__ua-cell{
  max-width:420px;
  white-space:normal;
  word-break:break-word;
  font-size:12.5px;
  color:var(--ipn-text-2,#5b6b80);
}
.ipn-ulog .ipn-card__body{ padding:16px 20px; }
@media (max-width:700px){
  .ipn-ulog__main{ padding-left:14px; padding-right:14px; }
}

/* ==========================================================================
   AV: 2026-07-22: Personalizaciones (admin panel) - .ipn-ap-custom / .ipn-cust-*
   ========================================================================== */
.ipn-ap-custom .ipn-req{
  color:var(--ipn-danger,#c0392b);
  font-weight:600;
  margin-left:4px;
}
/* AV: 2026-07-22: aire entre breadcrumb y page-head (antes quedaba pegado) */
.ipn-ap-custom > .ipn-breadcrumb{
  margin:0 0 20px;
}
.ipn-ap-custom .ipn-page-head{ margin-bottom:18px; }
.ipn-ap-custom .ipn-card{ margin-bottom:16px; }
.ipn-cust-swatch{
  display:inline-block;
  width:28px;
  height:28px;
  border-radius:6px;
  border:1px solid var(--ipn-border,#d5dbe6);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.35);
  vertical-align:middle;
}
.ipn-cust-logo{
  display:inline-block;
  max-height:36px;
  max-width:140px;
  width:auto;
  height:auto;
  object-fit:contain;
  vertical-align:middle;
  border-radius:4px;
  background:var(--ipn-surface-soft,#f5f7fb);
  padding:4px 6px;
}
.ipn-cust-logo--preview{ max-height:46px; }
.ipn-cust-actions{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
}
.ipn-cust-actions .ipn-row-action{ opacity:1; }
.ipn-ap-custom .ipn-table th,
.ipn-ap-custom .ipn-table td{ vertical-align:middle; }
.ipn-ap-custom .color-box,
.ipn-ap-custom .ipn-cust-color{
  width:56px;
  min-width:56px;
  max-width:120px;
  height:36px;
  padding:4px 8px;
  border:1px solid var(--ipn-border-input,#c9d2e0);
  border-radius:8px;
  cursor:pointer;
  font-family:var(--ipn-font-mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  font-size:12px;
  color:transparent;
  text-shadow:none;
  caret-color:var(--ipn-text);
}
.ipn-ap-custom .color-box:focus,
.ipn-ap-custom .ipn-cust-color:focus{
  color:var(--ipn-text);
  outline:2px solid var(--ipn-primary-soft,#cfe4ff);
  outline-offset:1px;
}
.ipn-cust-logo-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}
.ipn-cust-help{
  font-size:20px !important;
  color:var(--ipn-text-muted,#7a8aa0);
  cursor:help;
  user-select:none;
}
.ipn-cust-help:hover{ color:var(--ipn-primary,#1a6dff); }
.ipn-cust-actions-bar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
  margin-top:16px;
  margin-bottom:8px;
}
.ipn-cust-assign{
  display:flex;
  flex-direction:column;
  gap:14px;
}
.ipn-cust-assign__all{
  padding-bottom:10px;
  border-bottom:1px solid var(--ipn-hairline,#e2e7ef);
}
.ipn-cust-assign__company{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px 12px;
  border:1px solid var(--ipn-hairline,#e2e7ef);
  border-radius:10px;
  background:var(--ipn-surface,#fff);
}
.ipn-cust-assign__stores{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-left:28px;
}
body.ipn2:has(.ipn-ap-custom) #iPNpopUpDiv.iPNpopUpDiv{
  z-index:1300 !important;
}
@media (max-width:700px){
  .ipn-cust-assign__stores{ margin-left:12px; }
  .ipn-cust-actions-bar{ justify-content:stretch; }
  .ipn-cust-actions-bar .ipn-btn{ flex:1 1 auto; justify-content:center; }
}