/* ==========================================================================
   WORKBOOK 2.5.46 — FASE 1: Fundación visual, design system y app shell
   --------------------------------------------------------------------------
   Archivo nuevo, cargado DESPUÉS de public.css y workbook-premium.css.
   No modifica ni elimina esas hojas: las coexiste y, donde corresponde,
   las sobre-escribe deliberadamente para el nuevo shell del Portal.

   Por qué un archivo nuevo en vez de editar los existentes: public.css ya
   tiene 3 generaciones de tokens (--anik-*, --wb46-*) en conflicto entre sí
   y ~3.300 usos de !important; workbook-premium.css tiene ~930 más. Escribir
   sobre esa cascada in-place es alto riesgo de regresión. Aislar el nuevo
   sistema visual en un archivo propio, con su propio prefijo de tokens
   (--wbs-*, "workbook shell", sin colisión con --anik-*, --wb-* ni --wb46-*),
   cargado al final, es la vía de menor riesgo (sección 28 del mandato).

   Alcance: SOLO el shell (sidebar, topbar, navegación, layout) y un set de
   componentes base reutilizables. Las pantallas específicas de cada módulo
   (Dashboard, Agenda, Caja, etc.) NO se rediseñan a fondo en esta fase.

   Todos los tokens y reglas de shell están explícitamente scopeados bajo
   .anik-portal (nunca en :root global) para no filtrar al agendador público
   (.anik-booking), que mantiene su propio lenguaje visual sin cambios.
   ========================================================================== */

/* Ajuste mínimo estrictamente necesario (sección 2 del mandato): el
   wrapper #agenda-niksa-portal-app (definido en public.css, ajeno a esta
   fase) usa box-sizing:content-box con "width:100%" + "padding:14px"
   cuando el body lleva la clase .anik-workbook-standalone, lo que agrega
   28px por fuera del ancho disponible y produce scroll horizontal
   permanente en TODOS los anchos, incluso desktop. No es un bug de esta
   fase, pero el mandato exige "responsive real, sin scroll horizontal
   permanente" para el nuevo shell, así que se neutraliza aquí con una
   sola propiedad, sin tocar public.css ni su padding/fondo existentes. */
body.anik-workbook-standalone #agenda-niksa-portal-app{ box-sizing:border-box !important; }

/* --------------------------------------------------------------------------
   1. DESIGN TOKENS
   -------------------------------------------------------------------------- */
.anik-portal{
  /* Color — superficies y texto */
  --wbs-bg:#F6F7FA;
  --wbs-surface:#FFFFFF;
  --wbs-surface-subtle:#F1F3F7;
  --wbs-border:#E4E8EF;
  --wbs-border-strong:#D3D9E3;
  --wbs-text:#101828;
  --wbs-text-secondary:#475467;
  --wbs-text-muted:#8A94A6;

  /* Color — marca (hereda el color por-negocio ya emitido por PHP en
     --anik-primary/--anik-accent; con fallback si el negocio no definió) */
  --wbs-brand:var(--anik-primary, #0B3A82);
  --wbs-brand-ink:#FFFFFF;
  --wbs-brand-wash:color-mix(in srgb, var(--wbs-brand) 8%, white);
  --wbs-brand-wash-strong:color-mix(in srgb, var(--wbs-brand) 16%, white);
  --wbs-accent:var(--anik-accent, #CDDE00);

  /* Color — estados semánticos (alineados a las convenciones .ok/.warn/.bad
     y .anik-status-chip ya existentes en public.css, para no crear un
     segundo lenguaje de color de estado) */
  --wbs-success:#067647;      --wbs-success-bg:#ECFDF3;  --wbs-success-border:#ABEFC6;
  --wbs-warning:#B54708;      --wbs-warning-bg:#FFFAEB;  --wbs-warning-border:#FEDF89;
  --wbs-danger:#B42318;       --wbs-danger-bg:#FEF3F2;   --wbs-danger-border:#FECDCA;
  --wbs-info:#175CD3;         --wbs-info-bg:#EFF8FF;     --wbs-info-border:#B2DDFF;

  /* Espaciado */
  --wbs-space-1:4px; --wbs-space-2:8px; --wbs-space-3:12px; --wbs-space-4:16px;
  --wbs-space-5:20px; --wbs-space-6:24px; --wbs-space-7:32px; --wbs-space-8:40px;

  /* Radios */
  --wbs-radius-sm:8px; --wbs-radius-md:12px; --wbs-radius-lg:16px;
  --wbs-radius-xl:20px; --wbs-radius-pill:999px;

  /* Sombras */
  --wbs-shadow-xs:0 1px 2px rgba(16,24,40,.05);
  --wbs-shadow-sm:0 1px 3px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.04);
  --wbs-shadow-md:0 8px 20px rgba(16,24,40,.08);
  --wbs-shadow-lg:0 16px 40px rgba(16,24,40,.12);

  /* Tipografía (mismo stack ya usado en el resto del plugin) */
  --wbs-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --wbs-text-xs:12px; --wbs-text-sm:13px; --wbs-text-base:14px; --wbs-text-md:15px;
  --wbs-text-lg:17px; --wbs-text-xl:20px; --wbs-text-2xl:24px; --wbs-text-3xl:28px;
  --wbs-weight-regular:450; --wbs-weight-medium:560; --wbs-weight-semibold:650; --wbs-weight-bold:750;
  /* Corrección peso tipográfico sidebar: --wbs-weight-medium/-semibold son
     tokens COMPARTIDOS por decenas de componentes fuera del menú (KPIs,
     headers de card, badges...) -- no se pueden bajar sin afectar todo lo
     demás, fuera del alcance de esta ronda. El sidebar necesita su propio
     valor, medido contra el render real, no contra la etiqueta del token.
     CAUSA RAÍZ real (medida con un test de densidad de píxeles sobre un
     <canvas>, no solo leyendo el CSS): no hay ningún @font-face para
     "Inter" en todo el plugin, así que el navegador renderiza con la
     fuente de reemplazo real del sistema, que solo distingue un puñado de
     "escalones" de grosor -- 500/560/600 cayeron en el MISMO escalón
     visual (idéntica cantidad de píxeles de tinta), por eso bajar de 560 a
     500 no cambió nada perceptible. 400-450 es el escalón real
     inmediatamente más liviano (escalón distinto y confirmado más claro),
     por eso el valor final NO es 500 sino este. */
  --wbs-nav-weight:450;

  /* Transiciones */
  --wbs-ease:cubic-bezier(.2,.8,.2,1);
  --wbs-duration-fast:120ms; --wbs-duration-base:180ms;

  /* Z-index (capas del propio shell) */
  --wbs-z-sidebar:100; --wbs-z-overlay:400; --wbs-z-drawer:410;
  --wbs-z-dropdown:500; --wbs-z-modal:600; --wbs-z-toast:700;
}

/* Breakpoints de referencia para QA (documentado, no una custom property:
   los valores de @media deben ser literales por soporte de navegador):
   390px móvil · 768px tablet · 1024px laptop/tablet landscape · 1440px desktop */

@media (prefers-reduced-motion: reduce){
  .anik-portal, .anik-portal *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* --------------------------------------------------------------------------
   2. BASE
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type].anik-app-shell{
  font-family:var(--wbs-font) !important;
  color:var(--wbs-text) !important;
  background:var(--wbs-bg) !important;
  -webkit-font-smoothing:antialiased;
}
.anik-portal[data-account-type].anik-app-shell,
.anik-portal[data-account-type].anik-app-shell *{ box-sizing:border-box; }
.anik-portal[data-account-type].anik-app-shell :focus-visible{
  outline:2px solid var(--wbs-brand) !important;
  outline-offset:2px !important;
  border-radius:var(--wbs-radius-sm);
}

/* --------------------------------------------------------------------------
   3. APP SHELL — GRID PRINCIPAL
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type].anik-app-shell{
  display:grid !important;
  grid-template-columns:272px minmax(0,1fr) !important;
  gap:var(--wbs-space-6) !important;
  max-width:1520px !important;
  margin:0 auto !important;
  padding:var(--wbs-space-5) !important;
  min-height:100vh !important;
  align-items:start !important;
}

/* --------------------------------------------------------------------------
   4. SIDEBAR
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-sidebar{
  position:sticky !important; top:var(--wbs-space-5) !important;
  max-height:calc(100vh - var(--wbs-space-5) * 2) !important;
  display:flex !important; flex-direction:column !important; gap:6px !important;
  background:var(--wbs-surface) !important;
  border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-xl) !important;
  padding:10px !important;
  box-shadow:var(--wbs-shadow-sm) !important;
  /* Corrección premium 2.5.46 -- causa raíz REAL confirmada del problema de
     contraste de iconos: una regla legacy de public.css aplicaba
     backdrop-filter:blur(18px) al sidebar. Aunque el fondo es 100% opaco
     (sin beneficio visual esperado), este blur SÍ afecta visualmente el
     resultado compuesto de sus hijos en este motor de renderizado --
     confirmado con muestreo de píxeles real: los strokes de los íconos
     medían rgb(16,24,40) en color computado pero pintaban casi blancos.
     Se neutraliza aquí explícitamente (antes solo se neutralizaba en
     .anik-card-soft/.anik-row-card/.anik-step, nunca en el propio sidebar). */
  backdrop-filter:none !important; -webkit-backdrop-filter:none !important;
  overflow-y:auto !important; overflow-x:hidden !important;
  z-index:var(--wbs-z-sidebar);
}
/* Corrección premium 2.5.46 -- causa raíz real de "el sidebar sigue muy
   alto": varias reglas legacy de public.css (líneas ~177/948-951/1210/3994)
   ponen margin-bottom (10-14px) en .anik-business-mini/.anik-account-card,
   y el margin de un elemento NO es neutralizado por el gap del flex
   contenedor -- ambos se SUMAN. Medido con getBoundingClientRect(): el
   espacio real entre secciones era de hasta 48px donde solo se esperaban
   12px de gap, ~106px desperdiciados en total en la altura del sidebar.
   Se neutraliza el margin explícitamente en cada hijo directo para que
   SOLO el gap del flex controle el espaciado. */
.anik-portal[data-account-type] .anik-sidebar > *{ margin:0 !important; }
.anik-portal[data-account-type] .anik-sidebar-brand{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important;
  padding:0 var(--wbs-space-2) 8px !important;
  border-bottom:1px solid var(--wbs-border) !important;
  flex-shrink:0 !important;
}
.anik-portal[data-account-type] .anik-brand-mark-logo{ display:flex !important; width:28px; height:28px; flex:0 0 auto; }
.anik-portal[data-account-type] .anik-brand-mark-logo img{ width:100% !important; height:100% !important; object-fit:contain !important; }
.anik-portal[data-account-type] .anik-sidebar-brand strong{ display:block; font-size:var(--wbs-text-base); font-weight:var(--wbs-weight-semibold); color:var(--wbs-text); line-height:1.2; }
.anik-portal[data-account-type] .anik-sidebar-brand small{ display:block; font-size:11px; color:var(--wbs-text-muted); font-weight:var(--wbs-weight-regular); line-height:1.2; }

.anik-portal[data-account-type] .anik-business-mini{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important;
  padding:8px 10px !important;
  background:var(--wbs-surface-subtle) !important;
  border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important;
  flex-shrink:0 !important; min-width:0 !important;
}
.anik-portal[data-account-type] .anik-business-mini img,
.anik-portal[data-account-type] .anik-business-mini span{
  width:32px !important; height:32px !important; border-radius:var(--wbs-radius-md) !important;
  object-fit:cover !important; flex:0 0 auto;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:var(--wbs-brand) !important; color:var(--wbs-brand-ink) !important;
  font-weight:var(--wbs-weight-semibold); font-size:var(--wbs-text-sm);
}
.anik-portal[data-account-type] .anik-business-mini div{ min-width:0 !important; flex:1 1 auto !important; }
.anik-portal[data-account-type] .anik-business-mini strong{
  display:block !important; font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; line-height:1.2 !important;
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; max-width:100% !important;
}
.anik-portal[data-account-type] .anik-business-mini small{
  display:block !important; font-size:11px !important; color:var(--wbs-text-muted) !important; line-height:1.2 !important;
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; max-width:100% !important;
}

/* Corrección premium 2.5.46: card de cuenta compactada a una sola fila
   (nombre + pill de rol) -- el label largo y la descripción de párrafo
   completo eran redundantes con el kicker "CUENTA ADMINISTRADOR"/H1 que
   ya se muestra en el topbar en cada página (sección 12/13 del mandato).
   Sigue siendo el mismo componente reutilizado por business_admin/staff/
   niksa_admin, solo con markup más liviano. */
.anik-portal[data-account-type] .anik-account-card{
  display:flex !important; flex-direction:row !important; align-items:center !important; justify-content:space-between !important; gap:var(--wbs-space-2) !important;
  padding:9px 10px !important;
  border-radius:var(--wbs-radius-lg) !important;
  background:var(--wbs-brand-wash) !important;
  border:1px solid var(--wbs-brand-wash-strong) !important;
  min-width:0 !important; width:100% !important; overflow:hidden !important;
  flex-shrink:0 !important;
}
.anik-portal[data-account-type] .anik-account-card strong{
  font-size:var(--wbs-text-sm) !important; color:var(--wbs-text) !important; font-weight:var(--wbs-weight-semibold) !important;
  display:block !important; min-width:0 !important; flex:1 1 auto !important;
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
}
.anik-portal[data-account-type] .anik-account-card span{
  font-size:10.5px !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-brand) !important; text-transform:uppercase !important; letter-spacing:.03em !important;
  flex:0 0 auto !important; white-space:nowrap !important;
  padding:3px 8px !important; border-radius:999px !important; background:var(--wbs-surface) !important;
}

/* Rediseño "Centro Operativo" (Portal Negocio/Colaborador): negocio +
   usuario fusionados en UNA sola superficie de identidad, sustituyendo a
   .anik-business-mini + .anik-account-card SOLO en este shell (esas 2
   clases se dejan intactas arriba porque el Panel Maestro -- shell
   completamente independiente -- las sigue usando con su propio markup;
   sección "no tocar la base técnica aprobada" del mandato). El negocio es
   la identidad primaria (fila superior, con logo/inicial); usuario+rol
   quedan como segunda línea, separados por un divisor sutil -- una sola
   fuente visual de "quién soy", sin repetir en kicker/role-banner (ambos
   retirados). */
.anik-portal[data-account-type] .wbs-identity-card{
  display:flex !important; flex-direction:column !important; gap:5px !important;
  padding:8px 10px !important;
  background:var(--wbs-surface-subtle) !important;
  border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important;
  flex-shrink:0 !important; min-width:0 !important;
}
.anik-portal[data-account-type] .wbs-identity-business{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important; min-width:0 !important;
}
.anik-portal[data-account-type] .wbs-identity-business img,
.anik-portal[data-account-type] .wbs-identity-business > span{
  width:32px !important; height:32px !important; border-radius:var(--wbs-radius-md) !important;
  object-fit:cover !important; flex:0 0 auto;
  display:flex !important; align-items:center !important; justify-content:center !important;
  background:var(--wbs-brand) !important; color:var(--wbs-brand-ink) !important;
  font-weight:var(--wbs-weight-semibold) !important; font-size:var(--wbs-text-sm) !important;
}
.anik-portal[data-account-type] .wbs-identity-business div{ min-width:0 !important; flex:1 1 auto !important; }
.anik-portal[data-account-type] .wbs-identity-business strong{
  display:block !important; font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; line-height:1.2 !important;
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; max-width:100% !important;
}
.anik-portal[data-account-type] .wbs-identity-business small{
  display:block !important; font-size:11px !important; color:var(--wbs-text-muted) !important; line-height:1.2 !important;
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; max-width:100% !important;
}
.anik-portal[data-account-type] .wbs-identity-account{
  display:flex !important; align-items:center !important; justify-content:space-between !important; gap:var(--wbs-space-2) !important;
  padding-top:5px !important; border-top:1px solid var(--wbs-border) !important;
  min-width:0 !important;
}
.anik-portal[data-account-type] .wbs-identity-account-name{
  font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-medium) !important; color:var(--wbs-text-secondary) !important;
  min-width:0 !important; flex:1 1 auto !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
}
.anik-portal[data-account-type] .wbs-identity-account-role{
  font-size:10.5px !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-brand) !important; text-transform:uppercase !important; letter-spacing:.03em !important;
  flex:0 0 auto !important; white-space:nowrap !important;
  padding:3px 8px !important; border-radius:999px !important; background:var(--wbs-brand-wash) !important;
}

/* Rediseño "Centro Operativo" -- corrección real de altura del sidebar
   (sección 7/55 del mandato, requisito de aprobación): se confirmó con
   medición real (getBoundingClientRect(), incluso forzando height/
   max-height inline con !important vía JS) que .anik-sidebar -- position:
   sticky, grid item de .anik-app-shell -- NO respeta su propio max-height
   en este motor de renderizado bajo ninguna combinación de align-self/
   position probada; su altura queda determinada por el contenido real,
   nunca clampeada, por lo que el flex-shrink+min-height:0 de .anik-side-nav
   nunca llega a activarse (el padre nunca se reduce, así que el hijo
   tampoco). En vez de seguir dependiendo de esa cascada (rota en este
   entorno), .anik-side-nav recibe su propio max-height explícito, calculado
   independientemente del alto real del padre -- mismo resultado funcional
   (brand+identidad+footer siempre visibles, solo el nav hace scroll interno
   si el contenido no entra), sin depender de un mecanismo que no se puede
   confirmar que funcione de forma fiable en todos los navegadores. El
   descuento se recalculó en la corrección quirúrgica sidebar-scroll: tras
   compactar marca/identidad/footer/paddings/gaps y corregir la colisión
   legacy que forzaba mayúsculas+letter-spacing en las categorías (causa
   real de que "Ventas y operación"/"Reportes y finanzas" partieran en 2
   líneas), se midió con nav.style.maxHeight='none' + sidebar.scrollHeight
   - nav.getBoundingClientRect().height (independiente del alto de
   viewport, ya que marca/identidad/footer no varían con la altura de
   pantalla) que la suma real de esas secciones fijas es ~236px -- el
   descuento pasa de 310px a 245px (236 + ~9px de margen de seguridad para
   subpíxeles/bordes), liberando ~65px reales de altura útil al nav en
   cualquier viewport. */
.anik-portal[data-account-type] .anik-side-nav{
  display:flex !important; flex-direction:column !important; gap:1px !important;
  overflow-y:auto !important; overflow-x:hidden !important; flex:0 1 auto !important; min-height:0 !important;
  max-height:calc(100vh - 291px) !important;
}
.anik-portal[data-account-type] .anik-side-nav a{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-3) !important;
  padding:6px var(--wbs-space-3) !important; margin:0 !important; min-height:0 !important; line-height:1.2 !important;
  border-radius:var(--wbs-radius-md) !important;
  color:var(--wbs-text-secondary) !important;
  font-size:var(--wbs-text-base) !important; font-weight:var(--wbs-nav-weight) !important;
  text-decoration:none !important;
  transition:background var(--wbs-duration-fast) var(--wbs-ease),color var(--wbs-duration-fast) var(--wbs-ease) !important;
}
.anik-portal[data-account-type] .anik-side-nav a:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text) !important; }
/* Pulido navegación: el relleno sólido --wbs-brand + texto blanco (versión
   anterior) se sentía como un "botón oscuro" dentro del sidebar --
   inconsistente con el resto del sistema, que ya usa washes suaves para
   estado (--wbs-brand-wash, reutilizado aquí tal cual, sección 9 del
   mandato: "reutilizar tokens antes de inventar"). El indicador lateral
   (inset box-shadow, no border-left, para no pelear con el border-radius
   ni desplazar el layout) marca el activo con claridad -- la jerarquía NO
   depende del peso de fuente, que ahora es el mismo valor liviano que el
   resto del menú (corrección de ronda posterior: el peso ya no diferencia
   el estado activo, ver --wbs-nav-weight arriba). */
.anik-portal[data-account-type] .anik-side-nav a.active{
  background:var(--wbs-brand-wash) !important; color:var(--wbs-brand) !important;
  font-weight:var(--wbs-nav-weight) !important;
  box-shadow:inset 3px 0 0 0 var(--wbs-brand) !important;
}
.anik-portal[data-account-type] .anik-side-nav a.active:hover{ background:var(--wbs-brand-wash-strong) !important; color:var(--wbs-brand) !important; }
/* Corrección premium 2.5.46: los iconos outline (stroke-width 1.5 sobre un
   viewBox de 20, ~1.35px de trazo real renderizado) se veían casi
   invisibles contra el fondo blanco en monitores reales no-ultrawide
   (reportado por Belén) -- el contraste de color medido era correcto
   (7.7:1), el problema real era el grosor de trazo insuficiente para su
   tamaño, no el color. Se sube stroke-width vía CSS (los SVG usan
   stroke="currentColor" con stroke-width="1.5" como base, sobrescribible)
   y se fuerza un color más sólido (--wbs-text, casi negro) en vez de
   --wbs-text-secondary para que el ícono tenga el mismo peso visual que
   el texto en negrita de las categorías.
   Corrección FASE GLOBAL 2.5.46 -- el valor 2.8 sobrecorrigió: con el
   color ya forzado a --wbs-text (casi negro) el contraste ya no dependía
   del grosor, y 2.8 hacía que los iconos se vieran como glifos sólidos en
   vez de outline (queja real de Belén, confirmada visualmente en captura
   real antes de tocar el valor). Se baja a 1.6 -- dentro del rango
   1.5-1.75 sugerido por el mandato -- conservando el color ya corregido,
   que es quien realmente sostiene la legibilidad. */
.anik-portal[data-account-type] .anik-nav-icon{ width:22px !important; height:22px !important; flex:0 0 auto; stroke-width:1.6 !important; color:var(--wbs-text) !important; }
/* Corrección premium 2.5.46 -- causa raíz REAL y definitiva del ícono
   pálido: getComputedStyle() reveló que el propio <rect>/<path> hijo del
   ícono tenía su propiedad "color" (no solo "stroke") calculada como
   rgb(239,245,255) -- casi blanco -- pese a que el <svg> padre calculaba
   color:rgb(16,24,40) correctamente. Una regla legacy le pone "color" a
   los hijos SVG directamente, y como "stroke:currentColor" del propio
   ícono resuelve contra el color DE CADA ELEMENTO (no el del padre), el
   intento anterior de fijar solo "stroke" seguía resolviendo mal. Se
   fuerza "color" explícitamente además de "stroke" para romper esa
   cadena rota de una vez. */
.anik-portal[data-account-type] .anik-nav-icon *{ color:var(--wbs-text) !important; stroke:var(--wbs-text) !important; fill:inherit !important; }
.anik-portal[data-account-type] .anik-nav-top-link .anik-nav-icon,
.anik-portal[data-account-type] .anik-nav-group-summary .anik-nav-icon:first-child{ color:var(--wbs-text) !important; opacity:1 !important; }
.anik-portal[data-account-type] .anik-nav-top-link:hover .anik-nav-icon,
.anik-portal[data-account-type] .anik-nav-group-summary:hover .anik-nav-icon:first-child{ color:var(--wbs-brand) !important; }
.anik-portal[data-account-type] .anik-nav-top-link.active .anik-nav-icon{ color:var(--wbs-brand) !important; }
.anik-portal[data-account-type] .anik-nav-group[open] > .anik-nav-group-summary .anik-nav-icon:first-child{ color:var(--wbs-brand) !important; }

/* Acceso directo "Inicio", fuera de las categorías (sección 3 del mandato) */
.anik-portal[data-account-type] .anik-nav-top-link{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important;
  padding:6px var(--wbs-space-3) !important; margin:0 0 var(--wbs-space-1) !important;
  min-height:0 !important; line-height:1.2 !important;
  border-radius:var(--wbs-radius-md) !important;
  color:var(--wbs-text-secondary) !important;
  font-size:13px !important; font-weight:var(--wbs-nav-weight) !important;
  text-decoration:none !important;
  transition:background var(--wbs-duration-fast) var(--wbs-ease),color var(--wbs-duration-fast) var(--wbs-ease) !important;
}
.anik-portal[data-account-type] .anik-nav-top-link:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-nav-top-link.active{
  background:var(--wbs-brand-wash) !important; color:var(--wbs-brand) !important;
  font-weight:var(--wbs-nav-weight) !important;
  box-shadow:inset 3px 0 0 0 var(--wbs-brand) !important;
}
.anik-portal[data-account-type] .anik-nav-top-link.active:hover{ background:var(--wbs-brand-wash-strong) !important; color:var(--wbs-brand) !important; }
/* Refuerzo: reglas heredadas genéricas (span{display:none}, svg{color:...}
   de otros componentes) colisionaban con estos elementos nuevos, dejando
   el texto/ícono de "Inicio" y de las categorías invisibles pese a estar
   presentes en el DOM. Se fuerza explícitamente aquí. CAUSA RAÍZ REAL del
   peso tipográfico (encontrada con getComputedStyle() real sobre el span,
   no sobre su contenedor): el peso definido en .anik-nav-top-link /
   .anik-nav-group-summary NUNCA llegaba al texto visible -- una regla
   legacy heredada (no de este archivo) le pone su propio peso directo a
   estos spans, ganando por especificidad porque nunca se había forzado
   font-weight aquí como sí se fuerza color/font-size. Por eso bajar el
   peso del contenedor en rondas anteriores no cambiaba nada visible. */
.anik-portal[data-account-type] .anik-nav-top-link span,
.anik-portal[data-account-type] .anik-nav-group-summary span{
  display:inline !important; width:auto !important; height:auto !important;
  font-size:inherit !important; color:inherit !important; opacity:1 !important;
  font-weight:inherit !important;
}
.anik-portal[data-account-type] .anik-nav-top-link svg,
.anik-portal[data-account-type] .anik-nav-group-summary svg{
  color:inherit !important; opacity:1 !important; display:block !important;
}

/* Categorías desplegables -- <details>/<summary> nativos: accesibilidad de
   teclado y estado open/closed sin JS adicional (sección 4 del mandato). */
.anik-portal[data-account-type] .anik-nav-group{ margin:0 !important; }
.anik-portal[data-account-type] .anik-nav-group-summary{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important;
  padding:5px var(--wbs-space-3) !important; margin:0 !important;
  min-height:0 !important; line-height:1.2 !important;
  border-radius:var(--wbs-radius-md) !important;
  color:var(--wbs-text-secondary) !important;
  font-size:13px !important; font-weight:var(--wbs-nav-weight) !important;
  cursor:pointer; list-style:none;
  transition:background var(--wbs-duration-fast) var(--wbs-ease),color var(--wbs-duration-fast) var(--wbs-ease) !important;
}
.anik-portal[data-account-type] .anik-nav-group-summary::-webkit-details-marker{ display:none; }
.anik-portal[data-account-type] .anik-nav-group-summary:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-nav-group[open] > .anik-nav-group-summary{ color:var(--wbs-text) !important; }
/* Esta regla es MÁS específica que ".anik-nav-group-summary span" de
   arriba (una clase extra), así que sin este font-weight explícito la
   etiqueta real de cada categoría (Agenda/Gestión/Equipo/...) seguía
   ganándole a "inherit" y renderizando con el peso legacy directo -- este
   fue el bug real detrás de "sigue viéndose en negrita" pese a bajar el
   peso del <summary> contenedor. */
.anik-portal[data-account-type] .anik-nav-group-summary .anik-nav-group-label{
  flex:1 1 auto; text-align:left;
  font-weight:inherit !important;
}
/* Corrección quirúrgica sidebar-scroll: una regla legacy genérica (no de
   este archivo) aplicaba text-transform:uppercase + letter-spacing:1.4px +
   font-weight:650 a estas etiquetas -- medido con getComputedStyle() real
   -- forzando "Ventas y operación"/"Reportes y finanzas" a partirse en 2
   líneas dentro del ancho real disponible (~140px), cada línea extra
   costando ~17px de alto real. Se neutraliza aquí explícitamente (mismo
   patrón de refuerzo ya usado para display/color de estos mismos
   elementos, sección "colisión con cascada legacy" del proyecto) -- texto
   en minúsculas normales, sin tracking, cabe en una sola línea y sigue
   siendo igual de legible/profesional. */
.anik-portal[data-account-type] .anik-nav-top-link,
.anik-portal[data-account-type] .anik-nav-group-summary,
.anik-portal[data-account-type] .anik-nav-top-link span,
.anik-portal[data-account-type] .anik-nav-group-summary span,
.anik-portal[data-account-type] .anik-nav-group-label{
  text-transform:none !important; letter-spacing:normal !important;
}
.anik-portal[data-account-type] .anik-nav-group-summary .anik-nav-icon:last-child{
  width:16px !important; height:16px !important; color:var(--wbs-text-muted) !important;
  transition:transform var(--wbs-duration-base) var(--wbs-ease) !important;
}
.anik-portal[data-account-type] .anik-nav-group[open] > .anik-nav-group-summary .anik-nav-icon:last-child{ transform:rotate(180deg); }
/* Corrección premium 2.5.46 -- BUG REAL encontrado durante el audit de
   altura: display:flex!important aquí SIN condicionar a [open] anulaba el
   ocultamiento nativo de <details> -- medido con getComputedStyle() real:
   el ocultamiento nativo del navegador NO estaba aplicando de forma
   fiable (el div de items seguía computando display:block/altura real
   incluso con el <details> cerrado), así que los items de las 7
   categorías estaban SIEMPRE ocupando espacio real en el layout,
   estuvieran abiertas o cerradas -- la causa dominante real de que el
   sidebar "sigue muy alto" pese al acordeón exclusivo ya implementado.
   Se fuerza display:none explícitamente en el estado cerrado en vez de
   depender del comportamiento nativo del navegador. */
.anik-portal[data-account-type] .anik-nav-group-items{
  flex-direction:column !important; gap:1px !important;
  padding:1px var(--wbs-space-2) 2px calc(var(--wbs-space-3) + 18px + var(--wbs-space-3)) !important;
}
.anik-portal[data-account-type] .anik-nav-group:not([open]) > .anik-nav-group-items{ display:none !important; }
.anik-portal[data-account-type] .anik-nav-group[open] > .anik-nav-group-items{ display:flex !important; animation:wbsNavGroupOpen .16s var(--wbs-ease); }
@keyframes wbsNavGroupOpen{ from{ opacity:0; transform:translateY(-3px); } to{ opacity:1; transform:translateY(0); } }
/* Subitems un poco más livianos que el nivel superior (sección 4 del
   mandato de peso tipográfico) -- se reutiliza --wbs-weight-regular ya
   existente (mismo valor que usa el texto secundario del shell) en vez de
   inventar un token nuevo solo para esto. */
.anik-portal[data-account-type] .anik-nav-group-items a{
  padding:4px var(--wbs-space-3) !important; font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-regular) !important;
  margin:0 !important; min-height:0 !important; line-height:1.2 !important; display:block !important;
}

.anik-portal[data-account-type] .anik-sidebar-foot{
  display:flex !important; flex-direction:column !important; gap:var(--wbs-space-1) !important;
  padding-top:6px !important; border-top:1px solid var(--wbs-border) !important;
  flex-shrink:0 !important;
}
.anik-portal[data-account-type] .anik-sidebar-foot a{
  font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-muted) !important;
  padding:5px var(--wbs-space-3) !important; border-radius:var(--wbs-radius-sm) !important;
  text-decoration:none !important; margin:0 !important; line-height:1.2 !important; display:block !important;
  min-height:0 !important;
}
.anik-portal[data-account-type] .anik-sidebar-foot a:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-secondary) !important; }

/* Botón hamburguesa (solo visible en móvil/tablet, ver sección 8) */
/* Selector reforzado (button + [data-anik-menu-toggle]): public.css tiene
   un catch-all ".anik-portal button:not(.components-button):not(...)"
   cuya especificidad (clase+elemento+2 :not) supera a un simple
   ".anik-portal .anik-menu-toggle"; se iguala agregando el tipo de
   elemento y el atributo propio del botón para ganar con margen. */
.anik-portal[data-account-type] button.anik-menu-toggle[data-anik-menu-toggle]{
  display:none;
  align-items:center; justify-content:center;
  width:40px !important; height:40px !important; min-height:40px !important; flex:0 0 auto;
  padding:0 !important;
  border-radius:var(--wbs-radius-md) !important;
  border:1px solid var(--wbs-border) !important;
  background:var(--wbs-surface) !important;
  color:var(--wbs-text) !important;
  box-shadow:none !important;
  font-weight:normal !important;
  cursor:pointer;
}
.anik-portal[data-account-type] button.anik-menu-toggle[data-anik-menu-toggle]:hover{ background:var(--wbs-surface-subtle) !important; }
.anik-portal[data-account-type] button.anik-menu-toggle[data-anik-menu-toggle] svg{ width:20px; height:20px; stroke:var(--wbs-text) !important; }

.anik-portal[data-account-type] .anik-sidebar-overlay{
  display:none;
  position:fixed; inset:0;
  background:rgba(16,24,40,.45);
  z-index:var(--wbs-z-overlay);
}

/* --------------------------------------------------------------------------
   5. TOPBAR / PAGE HEADER
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-main-panel{ min-width:0 !important; display:flex !important; flex-direction:column !important; gap:var(--wbs-space-5) !important; }
.anik-portal[data-account-type] .anik-topbar{
  display:flex !important; align-items:flex-start !important; justify-content:space-between !important;
  gap:var(--wbs-space-4) !important; flex-wrap:wrap !important;
  background:transparent !important; border:0 !important;
  padding:var(--wbs-space-6) !important; border-radius:var(--wbs-radius-xl) !important;
}
.anik-portal[data-account-type] .anik-topbar-head{ display:flex; align-items:center; gap:var(--wbs-space-3); min-width:0; }
.anik-portal[data-account-type] .anik-kicker{
  margin:0 0 2px !important; font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important;
  color:var(--wbs-text-muted) !important; text-transform:uppercase !important; letter-spacing:.05em !important;
}
.anik-portal[data-account-type] .anik-topbar h1{
  margin:0 !important; font-size:var(--wbs-text-2xl) !important; font-weight:var(--wbs-weight-bold) !important;
  color:var(--wbs-text) !important; line-height:1.2 !important;
}
.anik-portal[data-account-type] .anik-topbar-subtitle{
  margin:6px 0 0 !important; font-size:var(--wbs-text-base) !important;
  color:var(--wbs-text-secondary) !important; max-width:56ch; font-weight:var(--wbs-weight-regular) !important;
}
.anik-portal[data-account-type] .anik-top-actions{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-3) !important; flex-wrap:wrap !important;
}

.anik-portal[data-account-type] .anik-plan-pill{
  display:inline-flex !important; align-items:center !important; gap:6px !important;
  padding:6px 12px !important; border-radius:var(--wbs-radius-pill) !important;
  font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important;
  border:1px solid var(--wbs-border) !important; background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-secondary) !important;
}
.anik-portal[data-account-type] .anik-plan-pill.active{ background:var(--wbs-success-bg) !important; border-color:var(--wbs-success-border) !important; color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-plan-pill.staff{ background:var(--wbs-info-bg) !important; border-color:var(--wbs-info-border) !important; color:var(--wbs-info) !important; }
.anik-portal[data-account-type] .anik-plan-pill.niksa{ background:var(--wbs-warning-bg) !important; border-color:var(--wbs-warning-border) !important; color:var(--wbs-warning) !important; }

/* Toggle claro/oscuro retirado en 2.5.46 Fase 1 (mandato: light mode fijo,
   sin toggle). Se oculta por si el markup persistiera en alguna vista aún
   no migrada, en vez de depender de que cada vista lo elimine. */
.anik-portal[data-account-type] .anik-theme-toggle{ display:none !important; }

.anik-portal[data-account-type] .anik-mobile-nav{ display:none !important; }

/* --------------------------------------------------------------------------
   6. BOTONES — refinamiento de .anik-btn ya existente (misma clase, mismo
   markup en todo el plugin; no se crea un sistema de botones paralelo)
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-btn{
  display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important;
  border-radius:var(--wbs-radius-md) !important;
  padding:10px 16px !important;
  font-size:var(--wbs-text-base) !important; font-weight:var(--wbs-weight-semibold) !important;
  border:1px solid transparent !important;
  background:var(--wbs-brand) !important; color:var(--wbs-brand-ink) !important;
  box-shadow:none !important;
  transition:filter var(--wbs-duration-fast) var(--wbs-ease),transform var(--wbs-duration-fast) var(--wbs-ease) !important;
  cursor:pointer;
}
/* FASE GLOBAL 2.5.46 -- hallazgo real (getComputedStyle en vivo): el botón
   primario NO renderizaba background:var(--wbs-brand) sólido como el
   código de arriba pretende -- el catch-all legacy
   ".anik-portal button:not(.components-button):not(.ql-picker-label)"
   (public.css) le ganaba la especificidad y aplicaba un
   linear-gradient(135deg,...) a TODOS los botones primarios del plugin de
   forma accidental, no intencional (nunca fue una decisión de diseño).
   El mandato pide "solid brand sofisticado" como base y reservar el
   degradado para un CTA excepcional, nunca como patrón universal por
   accidente. Se reafirma el sólido agregando el tipo "button" al
   selector (mismo patrón ya usado para ganar esta pelea de especificidad
   en Inventario/Caja este mismo ciclo). */
.anik-portal[data-account-type] button.anik-btn{ background:var(--wbs-brand) !important; background-image:none !important; }
.anik-portal[data-account-type] .anik-btn:hover{ filter:brightness(1.08) !important; }
/* Estado focus-visible propio para botones -- el genérico de app-shell ya
   cubre :focus-visible en todo el portal, pero .anik-btn no tenía ninguna
   verificación directa; se confirma vía getComputedStyle real que faltaba
   (outlineStyle:"none" antes de esta línea) y se refuerza aquí con el
   mismo token de foco del resto del producto, sin duplicar el color. */
.anik-portal[data-account-type] button.anik-btn:focus-visible{
  outline:2px solid var(--wbs-brand) !important; outline-offset:2px !important;
}
/* Corrección premium 2.5.46 (sección 26-28 del mandato, "Mi jornada"): la
   utilidad genérica .anik-is-hidden (public.css, display:none!important)
   quedaba derrotada por esta misma regla .anik-btn de mayor especificidad
   ([data-account-type] + 2 clases vs. 1 clase) -- los 5 botones de
   iniciar/verificar/salir/retomar/finalizar quedaban SIEMPRE visibles
   (fuera de opacity por disabled), sin importar el estado real de la
   jornada ni los toggles reales de public.js (líneas 659-663). Bug
   preexistente desde que este archivo se cargó por primera vez en Fase 1,
   no introducido por este round -- pero corresponde corregirlo aquí porque
   el mandato exige auditar exactamente este componente. No se toca ningún
   contrato JS/AJAX/nonce/data-attr, solo se restaura el display:none real. */
.anik-portal[data-account-type] .anik-btn.anik-is-hidden{ display:none !important; }
.anik-portal[data-account-type] .anik-btn:active{ transform:translateY(1px); }
.anik-portal[data-account-type] .anik-btn:disabled,
.anik-portal[data-account-type] .anik-btn[aria-disabled="true"]{ opacity:.5 !important; cursor:not-allowed !important; filter:none !important; }
.anik-portal[data-account-type] .anik-btn.ghost{
  background:var(--wbs-surface) !important; color:var(--wbs-text) !important;
  border-color:var(--wbs-border-strong) !important;
}
.anik-portal[data-account-type] .anik-btn.ghost:hover{ background:var(--wbs-surface-subtle) !important; filter:none !important; }
.anik-portal[data-account-type] .anik-btn.danger-soft{
  background:var(--wbs-danger-bg) !important; color:var(--wbs-danger) !important; border-color:var(--wbs-danger-border) !important;
}
.anik-portal[data-account-type] .anik-btn-icon{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:38px !important; height:38px !important; padding:0 !important; flex:0 0 auto;
}

/* WORKBOOK PREMIUM SYSTEM -- rediseño completo del toggle Activo/Oculto
   (Servicios y cualquier otra pantalla que reutilice .anik-status-switch).
   Auditoría real vía getComputedStyle encontró DOS bugs simultáneos, no
   solo el ya documentado fondo navy del estado "off":
   1) el propio catch-all legacy de gradiente (".anik-portal button:not(...)"
      en public.css) también le gana a ".anik-status-switch.on" porque el
      toggle real es un <button type="submit">, no un <span> -- el estado
      "Activo" se veía con el mismo gradiente azul-violeta accidental de los
      botones primarios, JAMÁS el verde tonal que un round anterior asumió
      (por lectura de código, no por render real) que ya tenía.
   2) la corrección anterior del fondo navy fijó `color:var(--wbs-text-muted)`
      en el selector BASE (sin distinguir .on de "sin .on"), así que también
      apagaba a gris el texto "Activo" sobre un fondo ya de por sí con poco
      contraste -- la ilegibilidad real reportada es la suma de ambos bugs,
      no uno solo. Se resuelve consolidando toda la autoridad visual del
      componente aquí (selector tipo+clase para vencer el catch-all), con
      un lenguaje tonal explícito por estado y sin tocar el markup, el
      nombre de clase ni el handler `toggle_service`/`anik_portal_action`. */
.anik-portal[data-account-type] button.anik-status-switch{
  background-image:none !important;
  background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-muted) !important;
  border:1px solid var(--wbs-border) !important;
  width:auto !important; min-width:104px !important; gap:8px !important;
  padding:0 12px 0 4px !important;
}
.anik-portal[data-account-type] .anik-status-switch i{
  flex:0 0 26px !important; width:26px !important; height:16px !important;
  background:var(--wbs-border-strong) !important; box-shadow:none !important;
}
.anik-portal[data-account-type] .anik-status-switch i:after{
  width:12px !important; height:12px !important; top:2px !important; left:2px !important;
}
.anik-portal[data-account-type] .anik-status-switch span{
  font-size:12px !important; font-weight:700 !important; letter-spacing:.01em !important;
}
.anik-portal[data-account-type] .anik-status-switch:not(.on) span{ color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-status-switch.on{
  background:var(--wbs-success-bg) !important; color:var(--wbs-success) !important;
  border-color:var(--wbs-success-border) !important;
}
.anik-portal[data-account-type] .anik-status-switch.on span{ color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-status-switch.on i{ background:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-status-switch.on i:after{ transform:translateX(10px) !important; }
.anik-portal[data-account-type] .anik-status-switch:hover{ filter:brightness(0.97) !important; }
.anik-portal[data-account-type] .anik-status-switch:focus-visible{
  outline:2px solid var(--wbs-brand) !important; outline-offset:2px !important;
}

/* FASE GLOBAL 2.5.46 -- hallazgo real (getComputedStyle en Servicios y
   Categorías): el mismo catch-all legacy que forzaba gradiente en los
   botones primarios (".anik-portal button:not(.components-button):not(
   .ql-picker-label)") también le gana la especificidad a ".anik-mini-danger"
   en public.css (selector sin tipo "button"/"a"), aplicando el MISMO
   gradiente azul-violeta a botones de "Eliminar"/"Papelera" en Servicios,
   Categorías y cualquier otra pantalla que use esta clase -- una acción
   destructiva no puede parecer visualmente el CTA principal, es un riesgo
   real de que alguien la presione pensando que es la acción primaria. Se
   reafirma el rojo suave agregando los tipos "button"/"a" al selector,
   mismo patrón ya usado para .anik-btn en este mismo ciclo. */
.anik-portal[data-account-type].anik-app-shell button.anik-mini-danger.anik-mini-danger,
.anik-portal[data-account-type].anik-app-shell a.anik-mini-danger.anik-mini-danger{
  background:var(--wbs-danger-bg) !important; background-image:none !important;
  color:var(--wbs-danger) !important; border:1px solid var(--wbs-danger-border) !important;
}

/* --------------------------------------------------------------------------
   7. INPUTS
   -------------------------------------------------------------------------- */
.anik-portal input[type="text"],
.anik-portal input[type="email"],
.anik-portal input[type="number"],
.anik-portal input[type="password"],
.anik-portal input[type="search"],
.anik-portal input[type="date"],
.anik-portal input[type="time"],
.anik-portal input[type="tel"],
.anik-portal select,
.anik-portal textarea{
  font-family:var(--wbs-font) !important;
  border:1px solid var(--wbs-border-strong) !important;
  border-radius:var(--wbs-radius-md) !important;
  background:var(--wbs-surface) !important;
  color:var(--wbs-text) !important;
  padding:9px 12px !important;
  font-size:var(--wbs-text-base) !important;
  transition:border-color var(--wbs-duration-fast) var(--wbs-ease),box-shadow var(--wbs-duration-fast) var(--wbs-ease) !important;
}
.anik-portal input:focus,
.anik-portal select:focus,
.anik-portal textarea:focus{
  border-color:var(--wbs-brand) !important;
  box-shadow:0 0 0 3px var(--wbs-brand-wash-strong) !important;
  outline:none !important;
}
.anik-portal input:disabled,
.anik-portal select:disabled,
.anik-portal textarea:disabled{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-muted) !important; }
.anik-portal label{ color:var(--wbs-text-secondary) !important; font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-medium) !important; }

/* --------------------------------------------------------------------------
   8. ALERTAS / NOTICE — refinamiento de .anik-notice/.anik-alert existentes
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-notice,
.anik-portal[data-account-type] .anik-alert{
  border-radius:var(--wbs-radius-lg) !important;
  padding:var(--wbs-space-3) var(--wbs-space-4) !important;
  border-width:1px !important; border-style:solid !important;
  font-weight:var(--wbs-weight-medium) !important;
}
.anik-portal[data-account-type] .anik-notice.ok{ background:var(--wbs-success-bg) !important; border-color:var(--wbs-success-border) !important; color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-notice.warn,
.anik-portal[data-account-type] .anik-alert.warn{ background:var(--wbs-warning-bg) !important; border-color:var(--wbs-warning-border) !important; color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .anik-notice.bad,
.anik-portal[data-account-type] .anik-alert.bad{ background:var(--wbs-danger-bg) !important; border-color:var(--wbs-danger-border) !important; color:var(--wbs-danger) !important; }
.anik-portal[data-account-type] .anik-role-banner{
  display:flex !important; flex-direction:column !important; gap:2px !important;
  padding:var(--wbs-space-3) var(--wbs-space-4) !important;
  border-radius:var(--wbs-radius-lg) !important;
  background:var(--wbs-surface-subtle) !important; border:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .anik-role-banner strong{ color:var(--wbs-text) !important; font-size:var(--wbs-text-base); }
.anik-portal[data-account-type] .anik-role-banner span{ color:var(--wbs-text-secondary) !important; font-size:var(--wbs-text-sm); }

/* --------------------------------------------------------------------------
   9. STATUS CHIP / BADGES
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-status-chip{
  display:inline-flex !important; align-items:center !important;
  border-radius:var(--wbs-radius-pill) !important; padding:5px 10px !important;
  font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important;
  background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-secondary) !important;
}
.anik-portal[data-account-type] .anik-status-chip.confirmed,
.anik-portal[data-account-type] .anik-status-chip.completed,
.anik-portal[data-account-type] .anik-status-chip.active{ background:var(--wbs-success-bg) !important; color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-status-chip.pending{ background:var(--wbs-warning-bg) !important; color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .anik-status-chip.cancelled,
.anik-portal[data-account-type] .anik-status-chip.no_show{ background:var(--wbs-danger-bg) !important; color:var(--wbs-danger) !important; }

/* --------------------------------------------------------------------------
   10. CARDS
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-card-soft,
.anik-portal[data-account-type] .anik-row-card,
.anik-portal[data-account-type] .anik-step{
  background:var(--wbs-surface) !important;
  border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important;
  box-shadow:var(--wbs-shadow-xs) !important;
  backdrop-filter:none !important;
}

/* --------------------------------------------------------------------------
   11. TABLAS — estilo base nuevo (sin rehacer estructura funcional)
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-table-wrap{
  border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important;
  background:var(--wbs-surface) !important;
  overflow:auto !important;
}
.anik-portal table.anik-table{ width:100% !important; border-collapse:separate !important; border-spacing:0 !important; font-size:var(--wbs-text-sm) !important; }
.anik-portal[data-account-type] .anik-table th{
  background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-muted) !important;
  font-size:11px !important; font-weight:var(--wbs-weight-semibold) !important; text-transform:uppercase !important; letter-spacing:.04em !important;
  text-align:left !important; padding:var(--wbs-space-3) var(--wbs-space-3) !important;
  border-bottom:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .anik-table td{ padding:var(--wbs-space-3) !important; border-bottom:1px solid var(--wbs-border) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-table tr:last-child td{ border-bottom:0 !important; }
.anik-portal[data-account-type] .anik-table tbody tr:hover td{ background:var(--wbs-surface-subtle) !important; }

/* Pulido navegación y acciones de Clientes (sección 4 del mandato): la
   celda de acciones de la tabla de Clientes (.anik-table-actions,
   markup real en render_customers()) nunca tuvo CSS propio -- ni
   .anik-action-link ni .anik-table-actions existían en ningún archivo del
   proyecto -- así que "Ver ficha" + WA + Tel + Mail se renderizaban sin
   ningún espacio entre sí, ilegibles como un solo string ("WATelMail",
   causa raíz confirmada). .anik-table-open (el botón "Ver ficha") sigue
   viviendo en workbook-premium.css sin tocarse; estas reglas nuevas solo
   dan espacio real (gap) al contenedor y convierten los 3 links de
   contacto en icon-buttons cuadrados del mismo alto/radio que "Ver
   ficha" para que el grupo se lea como una sola familia de botones. */
.anik-portal[data-account-type] .anik-table-actions{
  display:flex !important; align-items:center !important; gap:6px !important; flex-wrap:nowrap !important;
}
.anik-portal[data-account-type] .anik-action-link{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:30px !important; height:30px !important; flex:0 0 auto !important;
  border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-sm) !important;
  background:var(--wbs-surface) !important; color:var(--wbs-text-secondary) !important;
  text-decoration:none !important;
  transition:background var(--wbs-duration-fast) var(--wbs-ease),color var(--wbs-duration-fast) var(--wbs-ease),border-color var(--wbs-duration-fast) var(--wbs-ease) !important;
}
.anik-portal[data-account-type] .anik-action-link:hover{
  background:var(--wbs-brand-wash) !important; color:var(--wbs-brand) !important; border-color:var(--wbs-brand-wash-strong) !important;
}
.anik-portal[data-account-type] .anik-contact-icon{ width:15px !important; height:15px !important; flex:0 0 auto; }

/* --------------------------------------------------------------------------
   12. COMPONENTES NUEVOS (no existían antes de esta fase)
   -------------------------------------------------------------------------- */

/* Empty state */
.anik-portal[data-account-type] .anik-empty-state{
  display:flex !important; flex-direction:column !important; align-items:center !important; text-align:center !important;
  gap:var(--wbs-space-2) !important; padding:var(--wbs-space-8) var(--wbs-space-5) !important;
  color:var(--wbs-text-secondary) !important;
}
.anik-portal[data-account-type] .anik-empty-state-icon{
  width:48px; height:48px; border-radius:var(--wbs-radius-lg);
  display:flex; align-items:center; justify-content:center;
  background:var(--wbs-surface-subtle); color:var(--wbs-text-muted); font-size:22px;
}
.anik-portal[data-account-type] .anik-empty-state h3{ margin:0; font-size:var(--wbs-text-lg); color:var(--wbs-text); font-weight:var(--wbs-weight-semibold); }
.anik-portal[data-account-type] .anik-empty-state p{ margin:0; max-width:42ch; font-size:var(--wbs-text-sm); }

/* Skeleton */
.anik-portal[data-account-type] .anik-skeleton{
  border-radius:var(--wbs-radius-sm); background:linear-gradient(90deg,var(--wbs-surface-subtle) 25%,var(--wbs-border) 37%,var(--wbs-surface-subtle) 63%);
  background-size:400% 100%; animation:wbsSkeleton 1.4s ease infinite;
}
@keyframes wbsSkeleton{ 0%{background-position:100% 50%;} 100%{background-position:0 50%;} }

/* Avatar */
.anik-portal[data-account-type] .anik-avatar{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:32px !important; height:32px !important; border-radius:var(--wbs-radius-pill) !important;
  background:var(--wbs-brand) !important; color:var(--wbs-brand-ink) !important;
  font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important;
  overflow:hidden !important; flex:0 0 auto;
}
.anik-portal[data-account-type] .anik-avatar img{ width:100%; height:100%; object-fit:cover; }
.anik-portal[data-account-type] .anik-avatar.lg{ width:44px !important; height:44px !important; font-size:var(--wbs-text-base) !important; }

/* Tabs */
.anik-portal[data-account-type] .anik-tabs{ display:flex !important; gap:4px !important; border-bottom:1px solid var(--wbs-border) !important; flex-wrap:wrap; }
.anik-portal[data-account-type] .anik-tabs button,
.anik-portal[data-account-type] .anik-tabs a{
  border:0 !important; background:transparent !important; cursor:pointer;
  min-height:0 !important; box-shadow:none !important;
  padding:var(--wbs-space-3) var(--wbs-space-3) !important; margin-bottom:-1px !important;
  font-size:var(--wbs-text-base) !important; font-weight:var(--wbs-weight-medium) !important; color:var(--wbs-text-secondary) !important;
  border-bottom:2px solid transparent !important; text-decoration:none !important;
}
.anik-portal[data-account-type] .anik-tabs button:hover,
.anik-portal[data-account-type] .anik-tabs a:hover{ color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-tabs button[aria-selected="true"],
.anik-portal[data-account-type] .anik-tabs a.active{ color:var(--wbs-brand) !important; border-bottom-color:var(--wbs-brand) !important; font-weight:var(--wbs-weight-semibold) !important; }

/* Dropdown menu (popover simple) */
.anik-portal[data-account-type] .anik-dropdown{ position:relative; display:inline-block; }
.anik-portal[data-account-type] .anik-dropdown-menu{
  position:absolute !important; right:0 !important; top:calc(100% + 6px) !important;
  min-width:200px; background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-md) !important; box-shadow:var(--wbs-shadow-md) !important;
  padding:6px !important; z-index:var(--wbs-z-dropdown);
  display:none;
}
.anik-portal[data-account-type] .anik-dropdown.is-open .anik-dropdown-menu{ display:block; }
.anik-portal[data-account-type] .anik-dropdown-menu a,
.anik-portal[data-account-type] .anik-dropdown-menu button{
  display:flex !important; width:100% !important; text-align:left !important;
  border:0 !important; background:transparent !important; cursor:pointer;
  min-height:0 !important; box-shadow:none !important;
  padding:8px 10px !important; border-radius:var(--wbs-radius-sm) !important;
  font-size:var(--wbs-text-sm) !important; color:var(--wbs-text) !important; text-decoration:none !important;
}
.anik-portal[data-account-type] .anik-dropdown-menu a:hover,
.anik-portal[data-account-type] .anik-dropdown-menu button:hover{ background:var(--wbs-surface-subtle) !important; }

/* Modal / Drawer */
.anik-portal[data-account-type] .anik-modal-overlay,
.anik-portal[data-account-type] .anik-drawer-overlay{
  position:fixed !important; inset:0 !important; background:rgba(16,24,40,.5) !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  z-index:var(--wbs-z-modal) !important; padding:var(--wbs-space-4);
}
.anik-portal[data-account-type] .anik-modal{
  background:var(--wbs-surface) !important; border-radius:var(--wbs-radius-xl) !important;
  box-shadow:var(--wbs-shadow-lg) !important; width:100%; max-width:560px; max-height:min(88vh,760px);
  display:flex !important; flex-direction:column !important; overflow:hidden !important;
}
.anik-portal[data-account-type] .anik-modal-header{ display:flex !important; align-items:center !important; justify-content:space-between !important; padding:var(--wbs-space-4) var(--wbs-space-5) !important; border-bottom:1px solid var(--wbs-border) !important; }
.anik-portal[data-account-type] .anik-modal-header h2{ margin:0 !important; font-size:var(--wbs-text-lg) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] button.anik-modal-close{ border:0 !important; background:transparent !important; cursor:pointer; color:var(--wbs-text-muted) !important; width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important; border-radius:var(--wbs-radius-sm); box-shadow:none !important; }
.anik-portal[data-account-type] button.anik-modal-close:hover{ background:var(--wbs-surface-subtle) !important; }
.anik-portal[data-account-type] .anik-modal-body{ padding:var(--wbs-space-5) !important; overflow-y:auto !important; }
.anik-portal[data-account-type] .anik-modal-footer{ display:flex !important; justify-content:flex-end !important; gap:var(--wbs-space-3) !important; padding:var(--wbs-space-4) var(--wbs-space-5) !important; border-top:1px solid var(--wbs-border) !important; }

.anik-portal[data-account-type] .anik-drawer-overlay{ justify-content:flex-end !important; align-items:stretch !important; padding:0 !important; }
.anik-portal[data-account-type] .anik-drawer{
  background:var(--wbs-surface) !important; width:100%; max-width:420px; height:100%;
  box-shadow:var(--wbs-shadow-lg) !important; display:flex !important; flex-direction:column !important; overflow:hidden !important;
}

/* --------------------------------------------------------------------------
   14. DASHBOARD NEGOCIO (Workbook 2.5.46 Fase 2)
   -------------------------------------------------------------------------- */
/* FINAL -- corrección de composición real (no cosmética): el Dashboard usaba
   el MISMO gap uniforme (24px) entre cada sección sin importar su nivel de
   jerarquía -- KPI, Agenda/Atención, Equipo e Inventario/Cupones/Herramientas
   se sentían "bloques puestos" con el mismo peso, sin ritmo visual que
   comunicara qué es principal y qué es secundario (auditoría real de esta
   ronda). Se reduce el gap base (más compacto, ayuda directamente a
   aprovechar mejor 1366x768) y se reintroduce un gap mayor SOLO en los
   límites entre niveles de jerarquía (Nivel1->2, Nivel2->3, Nivel3->4) via
   margin-top puntual -- Inventario/Cupones y Herramientas (ambos Nivel 4)
   quedan visualmente agrupados por el gap base más chico entre ellos. */
.anik-portal[data-account-type] .wbs-dash{ display:flex !important; flex-direction:column !important; gap:var(--wbs-space-4) !important; }
.anik-portal[data-account-type] .wbs-dash-primary-row{ margin-top:var(--wbs-space-2) !important; }
.anik-portal[data-account-type] .wbs-team-row{ margin-top:var(--wbs-space-2) !important; }
.anik-portal[data-account-type] .wbs-indicator-row{ margin-top:var(--wbs-space-2) !important; }
.anik-portal[data-account-type] .wbs-dash-head{ display:flex !important; align-items:center !important; justify-content:space-between !important; }
.anik-portal[data-account-type] .wbs-dash-today{
  margin:0 !important; font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-medium) !important;
  color:var(--wbs-text-muted) !important;
}

/* KPIs */
/* Rediseño "Centro Operativo" (sección 15/16 del mandato): las 4 KPI-cards
   idénticas del Dashboard Negocio se convierten en UNA tira compacta de
   indicadores -- una sola superficie compartida, divisores sutiles en vez
   de 4 rectángulos independientes. NO reemplaza a .wbs-kpi (sigue siendo el
   componente real del Dashboard Colaborador, sin tocar) -- son 2 tratamientos
   distintos para 2 contextos distintos, conviviendo en el mismo archivo. */
.anik-portal[data-account-type] .wbs-kpi-strip{
  display:flex !important; align-items:stretch !important; flex-wrap:wrap !important;
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; box-shadow:var(--wbs-shadow-xs) !important;
}
.anik-portal[data-account-type] .wbs-kpi-item{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-3) !important;
  padding:var(--wbs-space-4) var(--wbs-space-5) !important;
  flex:1 1 0 !important; min-width:150px !important;
  border-right:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .wbs-kpi-item:last-child{ border-right:0 !important; }
.anik-portal[data-account-type] .wbs-kpi-item > svg{
  width:18px !important; height:18px !important; flex:0 0 auto; color:var(--wbs-brand) !important;
  background:var(--wbs-brand-wash) !important; border-radius:var(--wbs-radius-md) !important;
  padding:7px !important; box-sizing:content-box !important;
}
.anik-portal[data-account-type] .wbs-kpi-item > div{ min-width:0 !important; flex:1 1 auto !important; }
.anik-portal[data-account-type] .wbs-kpi-item small{ color:var(--wbs-text-muted) !important; font-size:var(--wbs-text-xs) !important; }
/* Acento discreto de "pendientes" (sección 18 del mandato): un punto de
   color sobre el ícono, NUNCA una card completa roja/amarilla como antes
   (.wbs-kpi-attn, que sigue existiendo abajo solo para el Dashboard
   Colaborador). */
.anik-portal[data-account-type] .wbs-kpi-item-attn > svg{ background:var(--wbs-warning-bg) !important; color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .wbs-kpi-item-attn .wbs-kpi-label,
.anik-portal[data-account-type] .wbs-kpi-item-attn small{ color:var(--wbs-warning) !important; }

.anik-portal[data-account-type] .wbs-kpi{
  display:flex !important; align-items:flex-start !important; gap:var(--wbs-space-3) !important;
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; padding:var(--wbs-space-5) var(--wbs-space-4) !important;
  box-shadow:var(--wbs-shadow-sm) !important; position:relative;
}
.anik-portal[data-account-type] .wbs-kpi > svg{
  width:20px !important; height:20px !important; flex:0 0 auto; color:var(--wbs-brand) !important;
  background:var(--wbs-brand-wash) !important; border-radius:var(--wbs-radius-md) !important;
  padding:8px !important; box-sizing:content-box !important;
}
.anik-portal[data-account-type] .wbs-kpi-attn > svg{ background:var(--wbs-warning-bg) !important; }
.anik-portal[data-account-type] .wbs-kpi > div{ min-width:0 !important; flex:1 1 auto !important; }
.anik-portal[data-account-type] .wbs-kpi-label{
  display:block !important; font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important;
  color:var(--wbs-text-muted) !important; text-transform:uppercase !important; letter-spacing:.04em !important;
  overflow-wrap:break-word !important; word-break:break-word !important;
}
.anik-portal[data-account-type] .wbs-kpi-value{
  display:block !important; font-size:var(--wbs-text-2xl) !important; font-weight:var(--wbs-weight-bold) !important;
  color:var(--wbs-text) !important; line-height:1.2 !important; margin:2px 0 !important;
}
.anik-portal[data-account-type] .wbs-kpi small{ color:var(--wbs-text-muted) !important; font-size:var(--wbs-text-xs) !important; }
.anik-portal[data-account-type] .wbs-kpi-attn{ border-color:var(--wbs-warning-border) !important; background:var(--wbs-warning-bg) !important; }
.anik-portal[data-account-type] .wbs-kpi-attn .wbs-kpi-label,
.anik-portal[data-account-type] .wbs-kpi-attn small{ color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .wbs-kpi-attn > svg{ color:var(--wbs-warning) !important; }

/* Ojo de ingresos: oculto por defecto (mandato sección 9) */
.anik-portal[data-account-type] .wbs-kpi-value[data-wbs-amount]{ letter-spacing:.14em !important; }
.anik-portal[data-account-type] .wbs-kpi-money[data-wbs-revealed="true"] .wbs-kpi-value[data-wbs-amount]::before{ content:attr(data-wbs-amount); letter-spacing:normal !important; font-size:var(--wbs-text-2xl) !important; }
.anik-portal[data-account-type] .wbs-kpi-money[data-wbs-revealed="true"] .wbs-kpi-value[data-wbs-amount]{ font-size:0 !important; }
.anik-portal[data-account-type] button.wbs-eye-toggle{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:32px !important; height:32px !important; min-height:32px !important; padding:0 !important;
  border:1px solid var(--wbs-border-strong) !important; background:var(--wbs-surface) !important;
  border-radius:var(--wbs-radius-pill) !important; color:var(--wbs-text-muted) !important; box-shadow:none !important;
  font-weight:normal !important; cursor:pointer; flex:0 0 auto !important; margin-left:auto !important;
}
.anik-portal[data-account-type] button.wbs-eye-toggle:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] button.wbs-eye-toggle svg{ width:16px !important; height:16px !important; }
.anik-portal[data-account-type] .wbs-eye-icon-hide{ display:none; }
.anik-portal[data-account-type] .wbs-eye-toggle[aria-pressed="true"] .wbs-eye-icon-show{ display:none; }
.anik-portal[data-account-type] .wbs-eye-toggle[aria-pressed="true"] .wbs-eye-icon-hide{ display:inline-flex; }

/* Ingresos del colaborador (Dashboard Staff, sección 16-24 del mandato
   premium): reutiliza el mismo componente .wbs-kpi.wbs-kpi-money del
   Dashboard Negocio (icono, valor, ojo) pero sin su caja propia -- ya vive
   dentro de un .wbs-card con su propio borde/fondo, así que anidar la caja
   completa de .wbs-kpi se vería como "tarjeta dentro de tarjeta". */
.anik-portal[data-account-type] .wbs-staff-income .wbs-kpi{
  border:0 !important; background:transparent !important; padding:0 !important; box-shadow:none !important;
}

/* Rediseño "Centro Operativo" (sección 19/22/24 del mandato): fila operativa
   dominante Agenda+Atención. En el MARKUP, Atención va primero (así en
   mobile/tablet -- sin este grid, en columna simple -- la prioridad real
   queda arriba sin depender de CSS adicional, sección 24: "Necesita atención
   va antes de Agenda" en mobile). En desktop este grid se activa (ver rules
   sin media query: es mobile-first, el grid ya es el comportamiento base
   porque .anik-app-shell en sí solo colapsa a 1 columna real por debajo de
   768px vía su propio grid-template-columns) y usa `order` para mostrar
   Agenda primero (izquierda, ~62%) y Atención segunda (derecha, ~38%) sin
   duplicar markup. A 768px e inferior (sección 25/42), la regla de abajo la
   desactiva explícitamente para que vuelva a mandar el orden natural del
   DOM (Atención, luego Agenda). */
.anik-portal[data-account-type] .wbs-dash-primary-row{
  display:grid !important; grid-template-columns:1.7fr 1fr !important; gap:var(--wbs-space-5) !important; align-items:start !important;
}
.anik-portal[data-account-type] .wbs-dash-primary-row > .wbs-card-agenda{ order:1 !important; }
.anik-portal[data-account-type] .wbs-dash-primary-row > .wbs-card-attention{ order:2 !important; }
/* FINAL -- corrección de jerarquía real: "Necesita atención" es Nivel 1
   (sección 18 del mandato: "lo que necesita atención ahora") pero vivía
   siempre en la columna angosta (38%), incluso cuando Agenda no tenía nada
   que mostrar (estado vacío) -- lo urgente quedaba visualmente más chico
   que un hueco vacío. Sin tocar PHP: se detecta el estado vacío real de
   Agenda vía :has() (mismo patrón ya usado en este archivo para el blob de
   .anik-command-center) y, SOLO cuando Agenda está vacía Y Atención tiene
   ítems reales, se invierten las proporciones -- Atención pasa a ser la
   columna dominante (mantiene su posición a la derecha via `order`, solo
   cambia su ancho). Con Agenda llena, las proporciones originales (Agenda
   dominante) se mantienen sin cambio. */
@media (min-width:769px){
  .anik-portal[data-account-type] .wbs-dash-primary-row:has(.wbs-card-agenda .anik-empty-state):has(.wbs-card-attention.has-items){
    grid-template-columns:1fr 1.7fr !important;
  }
}
/* Acento de prioridad: un borde izquierdo semántico en el color de
   advertencia hace que "Necesita atención" se lea como Nivel 1 por peso
   visual (no solo por ancho de columna) cuando tiene ítems reales -- mismo
   principio que .wbs-kpi-item-attn, aplicado aquí a la card completa. */
.anik-portal[data-account-type] .wbs-card-attention.has-items{
  border-left:3px solid var(--wbs-warning) !important; padding-left:calc(var(--wbs-space-5) - 3px) !important;
}
.anik-portal[data-account-type] .wbs-quick-strip{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-4) !important; flex-wrap:wrap !important;
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; padding:var(--wbs-space-3) var(--wbs-space-5) !important;
  box-shadow:var(--wbs-shadow-xs) !important; margin-top:var(--wbs-space-1) !important;
}
.anik-portal[data-account-type] .wbs-quick-strip .anik-kicker{ flex:0 0 auto !important; }
.anik-portal[data-account-type] .wbs-quick-strip .wbs-quick-actions{ flex:1 1 auto !important; justify-content:flex-end !important; }

.anik-portal[data-account-type] .wbs-card{
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; padding:var(--wbs-space-4) var(--wbs-space-5) !important;
  box-shadow:var(--wbs-shadow-xs) !important; display:flex !important; flex-direction:column !important; gap:var(--wbs-space-3) !important;
}
.anik-portal[data-account-type] .wbs-card-head{ display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:var(--wbs-space-3) !important; }
.anik-portal[data-account-type] .wbs-card-head h2{ margin:2px 0 0 !important; font-size:var(--wbs-text-lg) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; }

/* Agenda de hoy: lista operativa, no cards anidadas */
.anik-portal[data-account-type] .wbs-agenda-list{ list-style:none !important; margin:0 !important; padding:0 !important; display:flex !important; flex-direction:column !important; }
.anik-portal[data-account-type] .wbs-agenda-list li{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-3) !important;
  padding:var(--wbs-space-3) 0 !important; border-bottom:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .wbs-agenda-list li:last-child{ border-bottom:0 !important; padding-bottom:0 !important; }
.anik-portal[data-account-type] .wbs-agenda-time{
  font-variant-numeric:tabular-nums; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important;
  font-size:var(--wbs-text-base) !important; flex:0 0 auto; min-width:44px;
}
.anik-portal[data-account-type] .wbs-agenda-main{ flex:1 1 auto; min-width:0; display:flex !important; flex-direction:column !important; }
.anik-portal[data-account-type] .wbs-agenda-main strong{ color:var(--wbs-text) !important; font-size:var(--wbs-text-base) !important; font-weight:var(--wbs-weight-medium) !important; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.anik-portal[data-account-type] .wbs-agenda-main small{ color:var(--wbs-text-muted) !important; font-size:var(--wbs-text-xs) !important; }

/* Necesita atención */
.anik-portal[data-account-type] .wbs-attention-list{ list-style:none !important; margin:0 !important; padding:0 !important; display:flex !important; flex-direction:column !important; gap:2px !important; }
.anik-portal[data-account-type] .wbs-attention-list li{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-3) !important; padding:var(--wbs-space-2) 0 !important;
}
.anik-portal[data-account-type] .wbs-attention-icon{ display:flex !important; flex:0 0 auto; color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .wbs-attention-icon svg{ width:18px !important; height:18px !important; }
.anik-portal[data-account-type] .wbs-attention-main{ flex:1 1 auto; min-width:0; display:flex !important; flex-direction:column !important; }
.anik-portal[data-account-type] .wbs-attention-main strong{ color:var(--wbs-text) !important; font-size:var(--wbs-text-base) !important; font-weight:var(--wbs-weight-medium) !important; }
.anik-portal[data-account-type] .wbs-attention-main small{ color:var(--wbs-text-muted) !important; font-size:var(--wbs-text-xs) !important; }
.anik-portal[data-account-type] .wbs-attention-link{ flex:0 0 auto; font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-brand) !important; text-decoration:none !important; }
.anik-portal[data-account-type] .wbs-attention-link:hover{ text-decoration:underline !important; }
.anik-portal[data-account-type] .wbs-empty-ok{ color:var(--wbs-success) !important; font-size:var(--wbs-text-sm) !important; margin:0 !important; }
.anik-portal[data-account-type] .anik-empty-state.wbs-empty-ok h3{ color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-empty-state.wbs-empty-inline{ padding:var(--wbs-space-3) 0 !important; }
.anik-portal[data-account-type] .wbs-empty{ color:var(--wbs-text-muted) !important; font-size:var(--wbs-text-sm) !important; margin:0 !important; }
/* Empty state compacto para las cards del Dashboard (agenda/atención) --
   sección 6/12 del mandato de corrección visual: el vacío no debe ocupar
   tanto espacio como una lista real. */
.anik-portal[data-account-type] .wbs-card .anik-empty-state.wbs-empty-compact{ padding:var(--wbs-space-6) var(--wbs-space-4) !important; }
.anik-portal[data-account-type] .wbs-empty-icon-ok{ background:var(--wbs-success-bg) !important; color:var(--wbs-success) !important; }

/* Equipo / asistencia -- rediseño "Centro Operativo" (sección 12/26/27/29):
   roster horizontal de personas (chips con avatar+anillo de estado), ancho
   completo, en vez de una lista vertical dentro de una columna lateral
   angosta -- esa columna angosta era la causa real del truncamiento de
   nombres detectado en la auditoría. .wbs-team-summary/.wbs-team-avatar se
   mantienen (base reutilizada). */
.anik-portal[data-account-type] .wbs-team-summary{ display:flex !important; gap:var(--wbs-space-4) !important; font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-secondary) !important; flex-wrap:wrap; }
.anik-portal[data-account-type] .wbs-team-summary b{ color:var(--wbs-text) !important; font-weight:var(--wbs-weight-bold) !important; }
.anik-portal[data-account-type] .wbs-team-roster{ display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-3) !important; }
.anik-portal[data-account-type] .wbs-team-chip{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important;
  padding:var(--wbs-space-2) var(--wbs-space-3) var(--wbs-space-2) var(--wbs-space-2) !important;
  border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-pill) !important;
  background:var(--wbs-surface-subtle) !important; flex:0 1 auto !important; min-width:0 !important;
}
.anik-portal[data-account-type] .wbs-team-avatar{
  width:28px !important; height:28px !important; border-radius:999px !important; flex:0 0 auto !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-bold) !important; text-transform:uppercase !important;
  background:var(--wbs-surface) !important; color:var(--wbs-text-secondary) !important;
  box-shadow:0 0 0 2px var(--wbs-border) !important;
}
.anik-portal[data-account-type] .wbs-team-chip.state-present .wbs-team-avatar{ color:var(--wbs-success) !important; box-shadow:0 0 0 2px var(--wbs-success) !important; }
.anik-portal[data-account-type] .wbs-team-chip.state-break .wbs-team-avatar,
.anik-portal[data-account-type] .wbs-team-chip.state-outside .wbs-team-avatar{ color:var(--wbs-warning) !important; box-shadow:0 0 0 2px var(--wbs-warning) !important; }
.anik-portal[data-account-type] .wbs-team-info{ display:flex !important; flex-direction:column !important; min-width:0 !important; }
.anik-portal[data-account-type] .wbs-team-info strong{
  font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-medium) !important; color:var(--wbs-text) !important; line-height:1.25 !important;
  white-space:nowrap !important;
}
.anik-portal[data-account-type] .wbs-team-info small{ font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; line-height:1.25 !important; }
.anik-portal[data-account-type] .wbs-team-chip.state-present .wbs-team-info small{ color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .wbs-team-chip.state-break .wbs-team-info small,
.anik-portal[data-account-type] .wbs-team-chip.state-outside .wbs-team-info small{ color:var(--wbs-warning) !important; }

/* Inventario / cupones -- rediseño "Centro Operativo" (sección 13/30/34): ya
   no son 2 cards completas, son filas de indicador dentro de un único
   contenedor liviano (sin card-dentro-de-card). .wbs-mini-metrics se
   mantiene (el Dashboard Colaborador lo sigue usando vía
   .wbs-mini-metrics-3). */
.anik-portal[data-account-type] .wbs-mini-metrics{ display:flex !important; gap:var(--wbs-space-4) !important; font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-secondary) !important; }
.anik-portal[data-account-type] .wbs-mini-metrics b{ color:var(--wbs-text) !important; font-weight:var(--wbs-weight-bold) !important; font-size:var(--wbs-text-lg) !important; display:block; }
.anik-portal[data-account-type] .wbs-secondary-note{ font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-secondary) !important; margin:0 !important; }
.anik-portal[data-account-type] .wbs-indicator-row{
  display:flex !important; flex-wrap:wrap !important;
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; box-shadow:var(--wbs-shadow-xs) !important;
}
.anik-portal[data-account-type] .wbs-indicator{
  display:flex !important; align-items:center !important; gap:var(--wbs-space-3) !important; flex-wrap:wrap !important;
  flex:1 1 0 !important; min-width:240px !important;
  padding:var(--wbs-space-3) var(--wbs-space-5) !important;
  border-right:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .wbs-indicator:last-child{ border-right:0 !important; }
.anik-portal[data-account-type] .wbs-indicator-label{
  font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text-muted) !important;
  text-transform:uppercase !important; letter-spacing:.04em !important; flex:0 0 auto !important;
}
.anik-portal[data-account-type] .wbs-indicator-value{ font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-secondary) !important; flex:1 1 auto !important; min-width:0 !important; }
.anik-portal[data-account-type] .wbs-indicator .anik-btn{ flex:0 0 auto !important; margin-left:auto !important; }

/* Herramientas (Reserva pública + Accesos rápidos) -- rediseño "Centro
   Operativo" (sección 14/32/33): franja de utilidades al pie, visualmente
   más callada que la operación diaria de arriba (nivel 4 de jerarquía).
   Corrección REDESIGN2 (auditoría Dashboard): esta franja quedaba flotando
   directamente sobre el fondo gris de la página -- único bloque del
   Dashboard sin superficie de card propia, rompiendo la consistencia con
   .wbs-card/.wbs-kpi-strip/.wbs-indicator-row de arriba (sensación de
   "bloques sueltos" señalada en el mandato). Se le da la misma superficie
   (fondo/borde/radio/sombra) que el resto, sin tocar mercado ni JS. */
.anik-portal[data-account-type] .wbs-dash-tools{
  display:grid !important; grid-template-columns:1fr 1fr !important; gap:var(--wbs-space-5) !important; align-items:start !important;
}
.anik-portal[data-account-type] .wbs-tools-public,
.anik-portal[data-account-type] .wbs-tools-quick{
  display:flex !important; flex-direction:column !important; gap:var(--wbs-space-2) !important;
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; padding:var(--wbs-space-3) var(--wbs-space-5) !important;
  box-shadow:var(--wbs-shadow-xs) !important;
}
.anik-portal[data-account-type] .wbs-tools-quick{ justify-content:center !important; }
.anik-portal[data-account-type] .wbs-public-actions{ display:flex !important; gap:var(--wbs-space-2) !important; flex-wrap:wrap; }

/* Acciones rápidas (reutilizado por Dashboard Negocio -- franja de
   herramientas -- y Dashboard Colaborador -- .wbs-quick-strip, sin tocar) */
.anik-portal[data-account-type] .wbs-quick-actions{ display:flex !important; gap:var(--wbs-space-2) !important; flex-wrap:wrap; }
.anik-portal[data-account-type] .wbs-quick-actions .anik-btn{ flex:1 1 auto; }

/* --------------------------------------------------------------------------
   14b. DASHBOARD COLABORADOR (Workbook 2.5.46 Fase 3)
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .wbs-staff-dash{ display:flex !important; flex-direction:column !important; gap:var(--wbs-space-6) !important; }

/* Mi jornada -- protagonismo mayor que cualquier card del Dashboard Negocio
   (sección 7/36 del mandato Fase 3): borde de marca sutil, no un color de
   alarma genérico. */
.anik-portal[data-account-type] .wbs-jornada-card{ border-color:var(--wbs-brand-wash-strong) !important; }
.anik-portal[data-account-type] .wbs-jornada-body{ display:flex !important; flex-direction:column !important; gap:var(--wbs-space-3) !important; }
.anik-portal[data-account-type] .wbs-jornada-status-row{ display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important; }
.anik-portal[data-account-type] .wbs-jornada-badge{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:32px !important; height:32px !important; border-radius:999px !important; flex:0 0 auto !important;
  background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-muted) !important;
}
.anik-portal[data-account-type] .wbs-jornada-badge svg{ width:16px !important; height:16px !important; }
.anik-portal[data-account-type] .wbs-jornada-badge.state-present{ background:var(--wbs-success-bg) !important; color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .wbs-jornada-badge.state-away{ background:var(--wbs-warning-bg) !important; color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .wbs-jornada-badge.state-ended{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-secondary) !important; }
.anik-portal[data-account-type] .wbs-jornada-label-text{ font-size:var(--wbs-text-base) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .wbs-jornada-context{ margin:0 !important; font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-secondary) !important; }
.anik-portal[data-account-type] .wbs-jornada-meta{ margin:0 !important; font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .wbs-jornada-pause-flag{ color:var(--wbs-warning) !important; font-weight:var(--wbs-weight-semibold) !important; }
.anik-portal[data-account-type] .wbs-jornada-status{ font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .wbs-jornada-actions{ display:flex !important; gap:var(--wbs-space-2) !important; flex-wrap:wrap !important; }
.anik-portal[data-account-type] .wbs-jornada-btn-primary{ padding:11px 20px !important; font-weight:var(--wbs-weight-bold) !important; }
.anik-portal[data-account-type] .wbs-jornada-note{ margin:0 !important; font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }

/* Resumen + próxima atención: fila 2 columnas, igual patrón que el subrow
   del Dashboard Negocio (evita el mismo problema de espacio muerto). */
.anik-portal[data-account-type] .wbs-staff-row{ display:grid !important; grid-template-columns:1fr 1fr !important; gap:var(--wbs-space-5) !important; align-items:start !important; }
.anik-portal[data-account-type] .wbs-mini-metrics-3 > span{ flex:1 1 0 !important; }
.anik-portal[data-account-type] .wbs-staff-next-cta{ align-self:flex-start !important; }

/* --------------------------------------------------------------------------
   15. AGENDA DÍA / SEMANA / MES (Workbook 2.5.46 premium, secciones 32-65)
   Motor de calendario compartido Portal Negocio / Portal Colaborador. Barra
   de vista + navegación reutiliza el mismo lenguaje visual que el resto del
   shell (segmented control, botones ghost, kicker/h2) -- sección 62: sin
   segundo sistema visual solo para el calendario.
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .wbs-agenda-shell{ display:flex !important; flex-direction:column !important; gap:var(--wbs-space-4) !important; }
.anik-portal[data-account-type] .wbs-agenda-head{ display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:var(--wbs-space-3) !important; flex-wrap:wrap !important; }

.anik-portal[data-account-type] .wbs-agenda-toolbar{
  display:flex !important; align-items:center !important; justify-content:space-between !important;
  flex-wrap:wrap !important; gap:var(--wbs-space-3) !important;
  padding-bottom:var(--wbs-space-3) !important; border-bottom:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .wbs-agenda-views{
  display:inline-flex !important; background:var(--wbs-surface-subtle) !important;
  border-radius:var(--wbs-radius-pill) !important; padding:3px !important; gap:2px !important; flex:0 0 auto !important;
}
.anik-portal[data-account-type] .wbs-agenda-view-btn{
  padding:7px 16px !important; border-radius:var(--wbs-radius-pill) !important;
  font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-semibold) !important;
  color:var(--wbs-text-secondary) !important; text-decoration:none !important; line-height:1.3 !important;
}
.anik-portal[data-account-type] .wbs-agenda-view-btn.active{ background:var(--wbs-surface) !important; color:var(--wbs-text) !important; box-shadow:var(--wbs-shadow-xs) !important; }
.anik-portal[data-account-type] .wbs-agenda-view-btn:hover:not(.active){ color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .wbs-agenda-view-btn:focus-visible{ outline:2px solid var(--wbs-brand) !important; outline-offset:2px !important; }

.anik-portal[data-account-type] .wbs-agenda-nav{ display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important; flex-wrap:wrap !important; }
.anik-portal[data-account-type] .wbs-agenda-nav-btn{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:30px !important; height:30px !important; border-radius:var(--wbs-radius-md) !important;
  border:1px solid var(--wbs-border) !important; color:var(--wbs-text-secondary) !important; background:var(--wbs-surface) !important;
}
.anik-portal[data-account-type] .wbs-agenda-nav-btn:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .wbs-agenda-nav-btn svg{ width:16px !important; height:16px !important; }
.anik-portal[data-account-type] .wbs-agenda-nav-today{
  padding:6px 12px !important; border-radius:var(--wbs-radius-md) !important; border:1px solid var(--wbs-border) !important;
  font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-semibold) !important;
  color:var(--wbs-text-secondary) !important; background:var(--wbs-surface) !important; text-decoration:none !important;
}
.anik-portal[data-account-type] .wbs-agenda-nav-today:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .wbs-agenda-title{
  margin:0 0 0 var(--wbs-space-2) !important; font-size:var(--wbs-text-lg) !important;
  font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; text-transform:capitalize !important;
}

/* Grid Día: columna de horas + una columna de contenido con overlay
   absoluto de entradas (reservas/bloqueos) posicionadas por top/height en
   % relativos a la ventana horaria real del negocio. */
.anik-portal[data-account-type] .wbs-agenda-day-grid{
  display:grid !important; grid-template-columns:56px 1fr !important; gap:0 !important;
  border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-lg) !important; overflow:hidden !important;
}
.anik-portal[data-account-type] .wbs-agenda-hour-col{ position:relative !important; height:calc(var(--wbs-agenda-hours,12) * 64px) !important; border-right:1px solid var(--wbs-border) !important; background:var(--wbs-surface) !important; }
.anik-portal[data-account-type] .wbs-agenda-hour-label{
  position:absolute !important; left:0 !important; right:6px !important; transform:translateY(-50%) !important;
  text-align:right !important; font-size:11px !important; color:var(--wbs-text-muted) !important; font-variant-numeric:tabular-nums !important;
}
.anik-portal[data-account-type] .wbs-agenda-day-col{
  position:relative !important; height:calc(var(--wbs-agenda-hours,12) * 64px) !important; background:var(--wbs-surface) !important;
  background-image:repeating-linear-gradient(to bottom, var(--wbs-border) 0, var(--wbs-border) 1px, transparent 1px, transparent 64px) !important;
}
.anik-portal[data-account-type] .wbs-agenda-empty-note{
  position:absolute !important; top:var(--wbs-space-4) !important; left:var(--wbs-space-4) !important; right:var(--wbs-space-4) !important;
  font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-muted) !important;
}
.anik-portal[data-account-type] .wbs-agenda-entry{
  position:absolute !important; display:flex !important; flex-direction:column !important; gap:1px !important;
  padding:3px 7px !important; border-radius:var(--wbs-radius-sm) !important; overflow:hidden !important;
  font-size:11px !important; line-height:1.3 !important; text-decoration:none !important; box-sizing:border-box !important;
  border-left:3px solid var(--wbs-success) !important; background:var(--wbs-success-bg) !important; color:var(--wbs-text) !important;
  min-height:30px !important;
}
.anik-portal[data-account-type] a.wbs-agenda-entry:hover{ filter:brightness(0.97) !important; z-index:5 !important; box-shadow:var(--wbs-shadow-sm) !important; }
.anik-portal[data-account-type] a.wbs-agenda-entry:focus-visible{ outline:2px solid var(--wbs-brand) !important; outline-offset:1px !important; z-index:6 !important; }
.anik-portal[data-account-type] .wbs-agenda-entry-row{ display:flex !important; align-items:baseline !important; gap:5px !important; min-width:0 !important; }
.anik-portal[data-account-type] .wbs-agenda-entry-time{ font-weight:var(--wbs-weight-bold) !important; font-variant-numeric:tabular-nums !important; flex:0 0 auto !important; }
.anik-portal[data-account-type] .wbs-agenda-entry-title{ font-weight:var(--wbs-weight-semibold) !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; min-width:0 !important; flex:1 1 auto !important; }
.anik-portal[data-account-type] .wbs-agenda-entry-sub{ color:var(--wbs-text-secondary) !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
.anik-portal[data-account-type] .wbs-agenda-entry-status{ font-size:10px !important; font-weight:var(--wbs-weight-semibold) !important; text-transform:uppercase !important; letter-spacing:.02em !important; opacity:.85 !important; }

.anik-portal[data-account-type] .wbs-agenda-entry.status-pending,
.anik-portal[data-account-type] .wbs-agenda-entry.status-pending_payment{ border-left-color:var(--wbs-warning) !important; background:var(--wbs-warning-bg) !important; }
.anik-portal[data-account-type] .wbs-agenda-entry.status-cancelled,
.anik-portal[data-account-type] .wbs-agenda-entry.status-no_show{ border-left-color:var(--wbs-danger) !important; background:var(--wbs-danger-bg) !important; opacity:.75 !important; }
.anik-portal[data-account-type] .wbs-agenda-entry.status-rescheduled{ border-left-color:var(--wbs-text-muted) !important; background:var(--wbs-surface-subtle) !important; opacity:.75 !important; }
.anik-portal[data-account-type] .wbs-agenda-block{
  border-left:3px solid var(--wbs-text-muted) !important; background:repeating-linear-gradient(45deg, var(--wbs-surface-subtle), var(--wbs-surface-subtle) 6px, var(--wbs-border) 6px, var(--wbs-border) 7px) !important;
  color:var(--wbs-text-secondary) !important; cursor:default !important;
}

/* Highlight de la reserva al llegar desde la Agenda (click -> #anik-booking-N
   en el listado real de Reservas, sección 50: reutiliza el flujo existente,
   no crea una segunda edición dentro del calendario). */
.anik-portal[data-account-type] .anik-row-card:target{ outline:2px solid var(--wbs-brand) !important; outline-offset:2px !important; }

/* Grid Semana: misma columna de horas + 7 columnas día, cada una con su
   propio overlay independiente (mismo componente .wbs-agenda-day-col). */
.anik-portal[data-account-type] .wbs-agenda-week-grid{
  display:grid !important; grid-template-columns:44px repeat(7, minmax(120px, 1fr)) !important; gap:0 !important;
  border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-lg) !important; overflow:hidden !important;
  overflow-x:auto !important;
}
.anik-portal[data-account-type] .wbs-agenda-week-hour-col{ width:44px !important; }
.anik-portal[data-account-type] .wbs-agenda-week-day{ border-left:1px solid var(--wbs-border) !important; display:flex !important; flex-direction:column !important; min-width:0 !important; }
.anik-portal[data-account-type] .wbs-agenda-week-day-head{
  display:flex !important; flex-direction:column !important; align-items:center !important; gap:1px !important;
  padding:var(--wbs-space-2) 0 !important; border-bottom:1px solid var(--wbs-border) !important; background:var(--wbs-surface-subtle) !important;
}
.anik-portal[data-account-type] .wbs-agenda-week-day.is-today .wbs-agenda-week-day-head{ background:var(--wbs-brand-wash) !important; }
.anik-portal[data-account-type] .wbs-agenda-week-day-name{ font-size:10px !important; text-transform:uppercase !important; letter-spacing:.04em !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .wbs-agenda-week-day-num{ font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-bold) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .wbs-agenda-week-day.is-today .wbs-agenda-week-day-num{ color:var(--wbs-brand-ink) !important; }
.anik-portal[data-account-type] .wbs-agenda-week-day .wbs-agenda-day-col{ border-right:none !important; }

/* Grid Mes: cuadrícula 7 columnas, cada celda navega a la vista Día de esa
   fecha (sección 46). Máximo 3 chips + "+N más" -- nunca info completa por
   celda. */
.anik-portal[data-account-type] .wbs-agenda-month-head-row{
  display:grid !important; grid-template-columns:repeat(7, 1fr) !important;
  text-align:center !important; font-size:11px !important; font-weight:var(--wbs-weight-semibold) !important;
  color:var(--wbs-text-muted) !important; text-transform:uppercase !important; letter-spacing:.03em !important;
  padding-bottom:var(--wbs-space-2) !important;
}
.anik-portal[data-account-type] .wbs-agenda-month-grid{
  display:grid !important; grid-template-columns:repeat(7, 1fr) !important; grid-auto-rows:minmax(84px, auto) !important;
  gap:1px !important; background:var(--wbs-border) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; overflow:hidden !important;
}
.anik-portal[data-account-type] .wbs-agenda-month-cell{
  background:var(--wbs-surface) !important; padding:6px !important; display:flex !important; flex-direction:column !important; gap:3px !important;
  text-decoration:none !important; color:var(--wbs-text) !important; min-width:0 !important;
}
.anik-portal[data-account-type] .wbs-agenda-month-cell:hover{ background:var(--wbs-surface-subtle) !important; }
.anik-portal[data-account-type] .wbs-agenda-month-cell:focus-visible{ outline:2px solid var(--wbs-brand) !important; outline-offset:-2px !important; }
.anik-portal[data-account-type] .wbs-agenda-month-cell.is-outside{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .wbs-agenda-month-cell-num{ font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-semibold) !important; }
.anik-portal[data-account-type] .wbs-agenda-month-cell.is-today .wbs-agenda-month-cell-num{
  display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:20px !important; height:20px !important; border-radius:50% !important; background:var(--wbs-brand) !important; color:var(--wbs-brand-ink) !important;
}
.anik-portal[data-account-type] .wbs-agenda-month-block-dot{ width:5px !important; height:5px !important; border-radius:50% !important; background:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .wbs-agenda-month-preview{ display:flex !important; flex-direction:column !important; gap:2px !important; }
.anik-portal[data-account-type] .wbs-agenda-month-chip{
  font-size:10px !important; line-height:1.3 !important; padding:1px 5px !important; border-radius:4px !important;
  white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;
  background:var(--wbs-success-bg) !important; color:var(--wbs-success) !important;
}
.anik-portal[data-account-type] .wbs-agenda-month-chip.status-pending,
.anik-portal[data-account-type] .wbs-agenda-month-chip.status-pending_payment{ background:var(--wbs-warning-bg) !important; color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .wbs-agenda-month-chip.status-cancelled,
.anik-portal[data-account-type] .wbs-agenda-month-chip.status-no_show{ background:var(--wbs-danger-bg) !important; color:var(--wbs-danger) !important; }
.anik-portal[data-account-type] .wbs-agenda-month-more{ font-size:10px !important; color:var(--wbs-text-muted) !important; font-weight:var(--wbs-weight-semibold) !important; }

/* --------------------------------------------------------------------------
   12B. INVENTARIO — "PANEL DE INVENTARIO OPERACIONAL" (2.5.46)
   Alcance de esta ronda: SOLO Inventario. No se reutiliza aún en Clientes/
   Caja/Agenda (sección 44 del mandato) -- nombres de clase deliberadamente
   prefijados .anik-inv-* para dejar claro que es un patrón nuevo probado
   acá, candidato a generalizarse en una fase posterior, no todavía.
   -------------------------------------------------------------------------- */

/* Summary strip: reemplaza las 4 KPI-cards sueltas por una única
   superficie con divisores -- mismo dato, mismo color semántico (sección
   10/11 del mandato: SOLO se colorea cuando el valor es >0). */
.anik-portal[data-account-type] .anik-inv-summary{
  display:flex !important; flex-wrap:wrap !important;
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; box-shadow:var(--wbs-shadow-xs) !important;
  margin:0 0 var(--wbs-space-4) !important;
}
.anik-portal[data-account-type] .anik-inv-summary-item{
  flex:1 1 180px !important; display:flex !important; flex-direction:column !important; gap:2px !important;
  padding:var(--wbs-space-4) !important; border-right:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .anik-inv-summary-item:last-child{ border-right:0 !important; }
.anik-portal[data-account-type] .anik-inv-summary-label{
  font-size:11px !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text-muted) !important;
  text-transform:uppercase !important; letter-spacing:.04em !important;
}
.anik-portal[data-account-type] .anik-inv-summary-value{ font-size:var(--wbs-text-2xl) !important; font-weight:var(--wbs-weight-bold) !important; color:var(--wbs-text) !important; line-height:1.15 !important; }
.anik-portal[data-account-type] .anik-inv-summary-value.is-warning{ color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .anik-inv-summary-value.is-danger{ color:var(--wbs-danger) !important; }

/* Toolbar: fila de filtros existente + disparador "+ Nuevo producto"
   (sección 12/13 del mandato). El <details> del alta vive fuera del
   <form> de filtros para que abrirlo no reordene/estire esa fila. */
.anik-portal[data-account-type] .anik-inv-toolbar-row{
  display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-3) !important;
  align-items:flex-start !important; margin:0 0 var(--wbs-space-4) !important;
}
.anik-portal[data-account-type] .anik-inv-toolbar{
  flex:1 1 320px !important; display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-3) !important;
  align-items:center !important; justify-content:space-between !important;
  padding:var(--wbs-space-3) var(--wbs-space-4) !important;
}
.anik-portal[data-account-type] .anik-inv-filters{ display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-2) !important; align-items:center !important; }
.anik-portal[data-account-type] .anik-inv-filters select{
  font-size:var(--wbs-text-sm) !important; padding:6px var(--wbs-space-2) !important;
  border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-sm) !important; background:var(--wbs-surface) !important; color:var(--wbs-text) !important;
}
.anik-portal[data-account-type] .anik-inv-filter-link{ font-size:var(--wbs-text-sm) !important; color:var(--wbs-warning) !important; text-decoration:none !important; white-space:nowrap !important; }
.anik-portal[data-account-type] .anik-inv-filter-link.is-active{ font-weight:var(--wbs-weight-semibold) !important; }
.anik-portal[data-account-type] .anik-inv-filter-link:not(.is-active):not(:first-child){ color:var(--wbs-brand) !important; }
.anik-portal[data-account-type] .anik-inv-help{ font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; white-space:nowrap !important; cursor:help !important; }

/* Corrección quirúrgica (blocker 1): Descargar PDF / Exportar CSV ya no
   tienen una card/header propia -- se integran aquí como acciones
   secundarias (ghost) junto al disparador primario "+ Nuevo producto",
   dentro de la misma fila que la toolbar de filtros. */
.anik-portal[data-account-type] .anik-inv-toolbar-actions{
  flex:0 0 auto !important; display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-2) !important;
  align-items:flex-start !important; justify-content:flex-end !important;
}
.anik-portal[data-account-type] details.anik-inv-new-product{ flex:0 0 auto !important; }
.anik-portal[data-account-type] details.anik-inv-new-product > summary{ list-style:none !important; cursor:pointer !important; }
.anik-portal[data-account-type] details.anik-inv-new-product > summary::-webkit-details-marker{ display:none !important; }
.anik-portal[data-account-type] .anik-inv-new-product-panel{
  margin-top:var(--wbs-space-3) !important; background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-lg) !important; box-shadow:var(--wbs-shadow-xs) !important; padding:var(--wbs-space-4) !important;
}
.anik-portal[data-account-type] .anik-inv-toolbar-row:has(details.anik-inv-new-product[open]) .anik-inv-toolbar-actions{ flex-basis:100% !important; }

/* Historial global: colapsado por defecto (sección 33 del mandato). */
.anik-portal[data-account-type] details.anik-inv-global-history{ margin-top:var(--wbs-space-4) !important; }
.anik-portal[data-account-type] details.anik-inv-global-history > summary{
  cursor:pointer !important; list-style:none !important; display:flex !important; align-items:center !important;
}
.anik-portal[data-account-type] details.anik-inv-global-history > summary::-webkit-details-marker{ display:none !important; }
.anik-portal[data-account-type] details.anik-inv-global-history > summary h2::before{ content:'▸ ' !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] details.anik-inv-global-history[open] > summary h2::before{ content:'▾ ' !important; }
.anik-portal[data-account-type] details.anik-inv-global-history > section{ margin-top:var(--wbs-space-3) !important; }

/* Data table: nuevo patrón .anik-inv-table (sección 18-24 del mandato) --
   fila cerrada compacta (objetivo 52-60px), sin zebra, hover sutil,
   números tabulares, sin recrear/tocar .anik-table ni .anik-modern-table
   (permanecen sin cambios para el resto del portal). */
.anik-portal[data-account-type] table.anik-inv-table{ width:100% !important; border-collapse:separate !important; border-spacing:0 !important; font-size:var(--wbs-text-sm) !important; }
.anik-portal[data-account-type] .anik-inv-table th{
  background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-muted) !important;
  font-size:11px !important; font-weight:var(--wbs-weight-semibold) !important; text-transform:uppercase !important; letter-spacing:.04em !important;
  text-align:left !important; padding:var(--wbs-space-3) !important; border-bottom:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .anik-inv-table th:nth-child(2),
.anik-portal[data-account-type] .anik-inv-table th:nth-child(3){ text-align:right !important; }
.anik-portal[data-account-type] .anik-inv-row td{
  padding:10px var(--wbs-space-3) !important; border-bottom:1px solid var(--wbs-border) !important; color:var(--wbs-text) !important; vertical-align:middle !important;
}
.anik-portal[data-account-type] .anik-inv-row:hover td{ background:var(--wbs-surface-subtle) !important; }
.anik-portal[data-account-type] .anik-inv-row.is-inactive{ opacity:.6 !important; }
.anik-portal[data-account-type] .anik-inv-name{ display:block !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-inv-meta{ display:block !important; font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-inv-cell-stock,
.anik-portal[data-account-type] .anik-inv-cell-price{ text-align:right !important; font-variant-numeric:tabular-nums !important; }
.anik-portal[data-account-type] .anik-inv-stock-val,
.anik-portal[data-account-type] .anik-inv-price-val{ display:block !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-inv-stock-val.is-warning{ color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .anik-inv-stock-val.is-danger{ color:var(--wbs-danger) !important; }

/* Status badge único (sección 23 del mandato) -- mismo patrón semántico ya
   usado por .anik-status-chip (sección 9), variantes coherentes. */
.anik-portal[data-account-type] .anik-inv-badge{
  display:inline-flex !important; align-items:center !important; font-size:11px !important; font-weight:var(--wbs-weight-semibold) !important;
  padding:3px var(--wbs-space-2) !important; border-radius:var(--wbs-radius-pill) !important; white-space:nowrap !important;
}
.anik-portal[data-account-type] .anik-inv-badge.is-success{ background:var(--wbs-success-bg) !important; color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-inv-badge.is-warning{ background:var(--wbs-warning-bg) !important; color:var(--wbs-warning) !important; }
.anik-portal[data-account-type] .anik-inv-badge.is-danger{ background:var(--wbs-danger-bg) !important; color:var(--wbs-danger) !important; }
.anik-portal[data-account-type] .anik-inv-badge.is-neutral{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text-muted) !important; }

/* Row actions (sección 25-26 del mandato): Movimiento (primaria/tonal),
   Editar (secundaria/ghost), Historial (terciaria, mismo tratamiento
   visual que Editar pero <details> propio -- independiente, sin requerir
   permiso de edición, sección 25/32). */
.anik-portal[data-account-type] .anik-inv-cell-actions{ display:flex !important; flex-wrap:wrap !important; gap:6px !important; align-items:center !important; }
/* button.anik-inv-action-btn (con el tipo "button" explícito, no solo la
   clase): una regla legacy genérica
   ".anik-portal button:not(.components-button):not(.ql-picker-label)"
   suma un punto de especificidad extra por incluir el propio elemento
   "button" -- sin repetir aquí ese mismo tipo, esta regla pierde pese a
   tener más clases (mismo patrón "attribute-selector-boost" ya documentado
   en el proyecto: hay que igualar el tipo de elemento, no solo agregar
   clases). Confirmado con CSS.getMatchedStylesForNode() real: "Editar"
   renderizaba con el degradé azul→violeta de esa regla legacy en vez de
   quedar ghost/transparente. */
.anik-portal[data-account-type] button.anik-inv-action-btn{
  font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important; line-height:1.2 !important;
  padding:6px 10px !important; border-radius:var(--wbs-radius-sm) !important; cursor:pointer !important; white-space:nowrap !important;
  border:1px solid transparent !important; background:transparent !important;
}
.anik-portal[data-account-type] button.anik-inv-action-btn.is-primary{ background:var(--wbs-brand-wash) !important; color:var(--wbs-brand) !important; border-color:var(--wbs-brand-wash-strong) !important; }
.anik-portal[data-account-type] button.anik-inv-action-btn.is-primary:hover{ background:var(--wbs-brand-wash-strong) !important; }
.anik-portal[data-account-type] button.anik-inv-action-btn.is-ghost{ color:var(--wbs-text-secondary) !important; border-color:var(--wbs-border) !important; }
.anik-portal[data-account-type] button.anik-inv-action-btn.is-ghost:hover{ background:var(--wbs-surface-subtle) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-inv-action-btn.is-ghost{ color:var(--wbs-text-secondary) !important; border-color:var(--wbs-border) !important; }
.anik-portal[data-account-type] .anik-inv-action-disabled{ font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] details.anik-inv-history{ display:inline-block !important; }
.anik-portal[data-account-type] details.anik-inv-history > summary{ list-style:none !important; }
.anik-portal[data-account-type] details.anik-inv-history > summary::-webkit-details-marker{ display:none !important; }
.anik-portal[data-account-type] .anik-inv-history-panel{
  width:100% !important; max-width:320px !important; margin-top:6px !important; font-size:var(--wbs-text-xs) !important;
  background:var(--wbs-surface-subtle) !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-sm) !important; padding:var(--wbs-space-2) var(--wbs-space-3) !important;
}
.anik-portal[data-account-type] .anik-inv-history-entry{ padding:4px 0 !important; border-bottom:1px solid var(--wbs-border) !important; }
.anik-portal[data-account-type] .anik-inv-history-entry:last-child{ border-bottom:0 !important; }
.anik-portal[data-account-type] .anik-inv-history-type{ font-weight:var(--wbs-weight-semibold) !important; }
.anik-portal[data-account-type] .anik-inv-history-type.is-success{ color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-inv-history-type.is-danger{ color:var(--wbs-danger) !important; }
.anik-portal[data-account-type] .anik-inv-history-type.is-neutral{ color:var(--wbs-brand) !important; }

/* Panel de Movimiento/Editar (sección 27-30 del mandato): fila hermana a
   ancho completo, oculta por defecto (atributo "hidden"), revelada por el
   controlador mínimo en workbook-shell.js -- nunca renderizada abierta,
   nunca 100 formularios expandidos a la vez con muchos productos. */
.anik-portal[data-account-type] tr.anik-inv-panel-row > td{ background:var(--wbs-surface-subtle) !important; padding:var(--wbs-space-4) !important; border-bottom:1px solid var(--wbs-border) !important; }
.anik-portal[data-account-type] .anik-inv-panel-form{
  display:grid !important; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)) !important; gap:var(--wbs-space-3) !important; align-items:end !important;
}
.anik-portal[data-account-type] .anik-inv-panel-form label{ display:flex !important; flex-direction:column !important; gap:4px !important; font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-secondary) !important; font-weight:var(--wbs-weight-medium) !important; }
.anik-portal[data-account-type] .anik-inv-panel-form label.full{ grid-column:1/-1 !important; }
.anik-portal[data-account-type] .anik-inv-panel-form input,
.anik-portal[data-account-type] .anik-inv-panel-form select,
.anik-portal[data-account-type] .anik-inv-panel-form textarea{
  font-size:var(--wbs-text-sm) !important; padding:8px 10px !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-sm) !important; background:var(--wbs-surface) !important; color:var(--wbs-text) !important; box-sizing:border-box !important; width:100% !important;
}
.anik-portal[data-account-type] .anik-inv-panel-form .anik-check-grid{ grid-column:1/-1 !important; display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-2) var(--wbs-space-4) !important; align-items:center !important; font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-secondary) !important; }
.anik-portal[data-account-type] .anik-inv-panel-form .anik-check-grid label{ flex-direction:row !important; align-items:center !important; gap:6px !important; font-weight:var(--wbs-weight-regular) !important; }
.anik-portal[data-account-type] .anik-inv-panel-form .anik-check-grid small{ flex-basis:100% !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-inv-panel-form button.anik-btn{ grid-column:auto !important; justify-self:start !important; }
.anik-portal[data-account-type] .anik-inv-panel-form button.anik-btn.full{ grid-column:1/-1 !important; justify-self:stretch !important; }

/* data-label, usado solo en el reflow mobile de la sección @media 768px
   de más abajo -- en desktop no tiene efecto. */
.anik-portal[data-account-type] .anik-inv-table td[data-label]::before{ content:none !important; }

/* --------------------------------------------------------------------------
   13B. CAJA — "VENTA ACTIVA / CAJA OPERACIONAL" (2.5.46)
   Sin header/command-center local (mismo criterio ya aprobado en
   Inventario) -- solo el header global del shell. La summary strip vive
   DESPUÉS de Venta Activa, nunca antes (sección 10/36 del mandato).
   -------------------------------------------------------------------------- */
.anik-portal[data-account-type] .anik-sale-active{ margin-bottom:var(--wbs-space-4) !important; }
.anik-portal[data-account-type] .anik-sale-grid{
  display:grid !important; grid-template-columns:minmax(0,1fr) minmax(280px,340px) !important;
  gap:var(--wbs-space-5) var(--wbs-space-5) !important; align-items:start !important;
}
.anik-portal[data-account-type] .anik-sale-main{ min-width:0 !important; }

/* Selector de cliente: Sin cliente / Buscar cliente como decisión visible
   (sección 9/19 del mandato), no un estado silencioso. */
.anik-portal[data-account-type] .anik-sale-customer-choice{ display:flex !important; align-items:center !important; gap:var(--wbs-space-2) !important; margin-bottom:var(--wbs-space-2) !important; flex-wrap:wrap !important; }
.anik-portal[data-account-type] .anik-sale-customer-label{ font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text-muted) !important; text-transform:uppercase !important; letter-spacing:.04em !important; margin-right:var(--wbs-space-1) !important; }
/* button.* -- necesario para ganarle a la regla legacy
   .anik-portal button:not(.components-button):not(.ql-picker-label){background:
   linear-gradient(...)!important} por especificidad de tipo (mismo bug ya
   encontrado y corregido en el botón "Editar" de Inventario esta ronda). */
.anik-portal[data-account-type] button.anik-sale-customer-chip{
  border:1px solid var(--wbs-border) !important; background:var(--wbs-surface) !important; color:var(--wbs-text) !important;
  border-radius:999px !important; padding:6px 14px !important; font-size:var(--wbs-text-sm) !important; font-weight:var(--wbs-weight-medium) !important;
  cursor:pointer !important;
}
.anik-portal[data-account-type] button.anik-sale-customer-chip.is-active{ background:var(--wbs-brand-wash) !important; border-color:var(--wbs-brand) !important; color:var(--wbs-brand) !important; font-weight:var(--wbs-weight-semibold) !important; }
.anik-portal[data-account-type] .anik-sale-customer-panel{
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-lg) !important;
  padding:var(--wbs-space-4) !important; margin-bottom:var(--wbs-space-3) !important;
}
.anik-portal[data-account-type] .anik-sale-customer-field{ position:relative !important; }
.anik-portal[data-account-type] .anik-sale-customer-search{
  width:100% !important; padding:10px 12px !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-md) !important;
  font-size:var(--wbs-text-sm) !important; background:var(--wbs-bg) !important; color:var(--wbs-text) !important;
}
.anik-portal[data-account-type] .anik-sale-customer-results{
  list-style:none !important; margin:4px 0 0 !important; padding:4px !important; position:absolute !important; z-index:5 !important;
  left:0 !important; right:0 !important; background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important;
  border-radius:var(--wbs-radius-md) !important; box-shadow:var(--wbs-shadow-md) !important; max-height:280px !important; overflow-y:auto !important;
}
.anik-portal[data-account-type] .anik-sale-customer-option{ padding:8px 10px !important; border-radius:var(--wbs-radius-sm) !important; cursor:pointer !important; display:flex !important; flex-direction:column !important; gap:2px !important; }
.anik-portal[data-account-type] .anik-sale-customer-option strong{ font-size:var(--wbs-text-sm) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-sale-customer-option span{ font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-sale-customer-option.is-active,
.anik-portal[data-account-type] .anik-sale-customer-option:hover{ background:var(--wbs-brand-wash) !important; }
.anik-portal[data-account-type] .anik-sale-customer-empty{ padding:8px 10px !important; font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-sale-customer-status{ display:block !important; font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; margin:4px 0 var(--wbs-space-3) !important; }
.anik-portal[data-account-type] .anik-sale-customer-new{ font-size:var(--wbs-text-xs) !important; margin:0 !important; }
.anik-portal[data-account-type] .anik-sale-customer-card{
  display:flex !important; align-items:center !important; justify-content:space-between !important; gap:var(--wbs-space-3) !important;
  background:var(--wbs-brand-wash) !important; border:1px solid var(--wbs-brand) !important; border-radius:var(--wbs-radius-lg) !important;
  padding:var(--wbs-space-3) var(--wbs-space-4) !important; margin-bottom:var(--wbs-space-3) !important; flex-wrap:wrap !important;
}
/* Refuerzo explícito para [hidden] -- el display:flex!important de arriba
   pisaría la regla nativa de baja prioridad del navegador para [hidden]
   (mismo bug ya encontrado y corregido en los paneles mobile de
   Movimiento/Editar de Inventario esta ronda). */
.anik-portal[data-account-type] .anik-sale-customer-card[hidden]{ display:none !important; }
.anik-portal[data-account-type] .anik-sale-customer-card-main{ display:flex !important; flex-direction:column !important; gap:2px !important; min-width:0 !important; }
.anik-portal[data-account-type] .anik-sale-customer-card-main strong{ font-size:var(--wbs-text-md) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-sale-customer-card-main span{ font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-sale-customer-card-actions{ display:flex !important; gap:var(--wbs-space-2) !important; flex-wrap:wrap !important; }

.anik-portal[data-account-type] .anik-sale-stock-note{ font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; margin:0 0 var(--wbs-space-2) !important; }

/* Carrito: fila de venta, no tabla administrativa. */
.anik-portal[data-account-type] .anik-sale-items-head{
  display:grid !important; grid-template-columns:88px minmax(0,1fr) 70px 92px 84px 40px !important; gap:var(--wbs-space-2) !important;
  align-items:center !important; font-size:10px !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text-muted) !important;
  text-transform:uppercase !important; letter-spacing:.05em !important; padding:0 2px 6px !important;
}
.anik-portal[data-account-type] .anik-sale-row{
  display:grid !important; grid-template-columns:88px minmax(0,1fr) 70px 92px 84px 40px !important; gap:var(--wbs-space-2) !important;
  align-items:start !important; padding:8px 2px !important; border-bottom:1px solid var(--wbs-border) !important;
}
.anik-portal[data-account-type] .anik-sale-row .anik-si-sub{ font-variant-numeric:tabular-nums !important; }
.anik-portal[data-account-type] .anik-sale-row .anik-si-qty,
.anik-portal[data-account-type] .anik-sale-row .anik-si-price{
  font-variant-numeric:tabular-nums !important; width:100% !important; box-sizing:border-box !important;
}
/* Microcorrección quirúrgica: nombre accesible de Cantidad/Precio (sección
   1-11 del mandato) -- <label> envolvente, sin for/id (seguro ante
   cloneNode(true), nunca genera IDs duplicados entre filas). El texto vive
   siempre en el árbol de accesibilidad; en desktop queda visualmente oculto
   (técnica clip estándar, no display:none) porque el header de columnas de
   .anik-sale-items-head ya cumple ese rol para usuarios videntes; en mobile
   se revuelve visible dentro del breakpoint correspondiente. */
.anik-portal[data-account-type] .anik-sale-field{ display:block !important; min-width:0 !important; }
.anik-portal[data-account-type] .anik-sale-field-label{ display:block !important; }
.anik-portal[data-account-type] .anik-sale-field-label-text{
  position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important;
  overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important;
}
.anik-portal[data-account-type] .anik-sale-add-item{ margin:var(--wbs-space-2) 0 var(--wbs-space-4) !important; }
.anik-portal[data-account-type] .anik-sale-secondary-grid{
  display:grid !important; grid-template-columns:1fr 1fr !important; gap:var(--wbs-space-3) !important; margin-bottom:var(--wbs-space-2) !important;
}
.anik-portal[data-account-type] .anik-sale-secondary-grid label.full{ grid-column:1/-1 !important; }
.anik-portal[data-account-type] .anik-sale-secondary-grid label{ display:flex !important; flex-direction:column !important; gap:4px !important; font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-sale-secondary-grid input{ padding:8px 10px !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-md) !important; font-size:var(--wbs-text-sm) !important; }

/* Resumen de venta: total como elemento visual dominante (sección 14 del
   mandato), método de pago y CTA justo debajo, siempre visibles. */
.anik-portal[data-account-type] .anik-sale-summary-panel{
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-lg) !important;
  padding:var(--wbs-space-4) !important; display:flex !important; flex-direction:column !important; gap:var(--wbs-space-3) !important;
  align-self:start !important;
}
.anik-portal[data-account-type] .anik-sale-total-block{ display:flex !important; flex-direction:column !important; gap:2px !important; }
.anik-portal[data-account-type] .anik-sale-total-label{ font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text-muted) !important; text-transform:uppercase !important; letter-spacing:.05em !important; }
.anik-portal[data-account-type] .anik-sale-total-value{ font-size:30px !important; font-weight:var(--wbs-weight-bold) !important; color:var(--wbs-text) !important; font-variant-numeric:tabular-nums !important; line-height:1.1 !important; }
.anik-portal[data-account-type] .anik-sale-payment-field{ display:flex !important; flex-direction:column !important; gap:4px !important; font-size:var(--wbs-text-sm) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-sale-payment-field select{ padding:9px 10px !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-md) !important; font-size:var(--wbs-text-sm) !important; background:var(--wbs-bg) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-sale-submit{ width:100% !important; }
.anik-portal[data-account-type] .anik-sale-submit:disabled{ opacity:.5 !important; cursor:not-allowed !important; }

/* Franja de resumen liviana -- DESPUÉS de Venta Activa (mismo patrón ya
   aprobado en Inventario, .anik-inv-summary). */
.anik-portal[data-account-type] .anik-sale-summary{
  display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-4) !important;
  background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-lg) !important;
  padding:var(--wbs-space-3) var(--wbs-space-4) !important; margin-bottom:var(--wbs-space-4) !important;
}
.anik-portal[data-account-type] .anik-sale-summary-item{ display:flex !important; flex-direction:column !important; gap:2px !important; min-width:110px !important; }
.anik-portal[data-account-type] .anik-sale-summary-label{ font-size:10px !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text-muted) !important; text-transform:uppercase !important; letter-spacing:.04em !important; }
.anik-portal[data-account-type] .anik-sale-summary-value{ font-size:var(--wbs-text-lg) !important; font-weight:var(--wbs-weight-bold) !important; color:var(--wbs-text) !important; font-variant-numeric:tabular-nums !important; }

/* Toolbar de Ventas registradas (mismo patrón ya aprobado en Inventario). */
.anik-portal[data-account-type] .anik-sale-toolbar-row{ display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-3) !important; align-items:flex-start !important; margin:0 0 var(--wbs-space-4) !important; }
.anik-portal[data-account-type] .anik-sale-toolbar{ flex:1 1 320px !important; display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-3) !important; align-items:center !important; padding:var(--wbs-space-3) var(--wbs-space-4) !important; }
.anik-portal[data-account-type] .anik-sale-filters{ display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-2) !important; align-items:center !important; }
.anik-portal[data-account-type] .anik-sale-filters label{ display:flex !important; flex-direction:column !important; gap:2px !important; font-size:var(--wbs-text-xs) !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] .anik-sale-filters input,
.anik-portal[data-account-type] .anik-sale-filters select{ font-size:var(--wbs-text-sm) !important; padding:6px var(--wbs-space-2) !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-sm) !important; background:var(--wbs-surface) !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-sale-toolbar-actions{ flex:0 0 auto !important; display:flex !important; flex-wrap:wrap !important; gap:var(--wbs-space-2) !important; align-items:flex-start !important; }

/* Badge único de estado (Pagada/Anulada/Activo/Anulado) -- mismos tokens
   semánticos que .anik-inv-badge. */
.anik-portal[data-account-type] .anik-sale-badge{ display:inline-flex !important; align-items:center !important; padding:2px 9px !important; border-radius:999px !important; font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important; }
.anik-portal[data-account-type] .anik-sale-badge.is-success{ background:var(--wbs-success-bg) !important; color:var(--wbs-success) !important; }
.anik-portal[data-account-type] .anik-sale-badge.is-danger{ background:var(--wbs-danger-bg) !important; color:var(--wbs-danger) !important; }
.anik-portal[data-account-type] .anik-sale-badge.is-warning{ background:var(--wbs-warning-bg) !important; color:var(--wbs-warning) !important; }

/* Acción destructiva unificada (sección 28/47/51 del mandato): ghost +
   color semántico de peligro, nunca sólido/gigante. */
.anik-portal[data-account-type] button.anik-sale-danger-btn{ color:var(--wbs-danger) !important; border-color:var(--wbs-danger) !important; background:var(--wbs-surface) !important; }
.anik-portal[data-account-type] button.anik-sale-danger-btn.mini{ font-size:var(--wbs-text-xs) !important; padding:4px 10px !important; }

/* Administración de caja: 3 disclosures independientes (sección 42 del
   mandato -- NO un solo <details> compartido). Mismo patrón cero-JS que
   .anik-inv-history/.anik-inv-global-history. */
.anik-portal[data-account-type] .anik-sale-admin-label{ font-size:var(--wbs-text-xs) !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text-muted) !important; text-transform:uppercase !important; letter-spacing:.05em !important; margin:var(--wbs-space-5) 0 var(--wbs-space-2) !important; }
.anik-portal[data-account-type] details.anik-sale-admin-section{ margin-bottom:var(--wbs-space-3) !important; background:var(--wbs-surface) !important; border:1px solid var(--wbs-border) !important; border-radius:var(--wbs-radius-lg) !important; padding:var(--wbs-space-3) var(--wbs-space-4) !important; }
.anik-portal[data-account-type] details.anik-sale-admin-section > summary{ cursor:pointer !important; list-style:none !important; font-weight:var(--wbs-weight-semibold) !important; color:var(--wbs-text) !important; padding:4px 0 !important; }
.anik-portal[data-account-type] details.anik-sale-admin-section > summary::-webkit-details-marker{ display:none !important; }
.anik-portal[data-account-type] details.anik-sale-admin-section > summary::before{ content:'▸ ' !important; color:var(--wbs-text-muted) !important; }
.anik-portal[data-account-type] details.anik-sale-admin-section[open] > summary::before{ content:'▾ ' !important; }

/* --------------------------------------------------------------------------
   13. RESPONSIVE ESTRUCTURAL — 1024 / 768 / 390
   -------------------------------------------------------------------------- */
@media (max-width:1024px){
  .anik-portal[data-account-type].anik-app-shell{ grid-template-columns:268px minmax(0,1fr) !important; gap:var(--wbs-space-4) !important; padding:var(--wbs-space-4) !important; width:auto !important; max-width:100% !important; margin:0 !important; }
  /* Rediseño "Centro Operativo" (sección 41 del mandato: "la renderización
     real manda, no el breakpoint por sí solo") -- a 1024px la tira de KPIs
     pasa a 2 por fila (cada item ocupa 50% menos el gap) y la fila
     Agenda+Atención ajusta su proporción (sigue siendo 2 columnas, ambas
     legibles) en vez de colapsar antes de tiempo. */
  .anik-portal[data-account-type] .wbs-kpi-item{ flex:1 1 calc(50% - var(--wbs-space-3)) !important; border-right:0 !important; border-bottom:1px solid var(--wbs-border) !important; }
  .anik-portal[data-account-type] .wbs-kpi-item:nth-child(2n){ border-right:0 !important; }
  .anik-portal[data-account-type] .wbs-dash-primary-row{ grid-template-columns:1.35fr 1fr !important; gap:var(--wbs-space-4) !important; }
  .anik-portal[data-account-type] .wbs-indicator{ min-width:200px !important; }
  .anik-portal[data-account-type] .wbs-kpi-money > svg{ display:none !important; }
  .anik-portal[data-account-type] .wbs-mini-metrics-3{ flex-wrap:wrap !important; gap:var(--wbs-space-3) !important; }

  /* Agenda a 1024px (sección 61 del mandato: cuidado especial, Semana debe
     seguir siendo legible, sin cortar horas/nombres/servicios/controles).
     Se reduce el alto por hora y el ancho mínimo de columna día; si aun así
     no entran las 7 columnas, el propio .wbs-agenda-week-grid ya tiene
     overflow-x:auto (scroll interno controlado, no scroll de página). */
  .anik-portal[data-account-type] .wbs-agenda-hour-col,
  .anik-portal[data-account-type] .wbs-agenda-day-col{ height:calc(var(--wbs-agenda-hours,12) * 52px) !important; }
  .anik-portal[data-account-type] .wbs-agenda-day-col{ background-image:repeating-linear-gradient(to bottom, var(--wbs-border) 0, var(--wbs-border) 1px, transparent 1px, transparent 52px) !important; }
  .anik-portal[data-account-type] .wbs-agenda-week-grid{ grid-template-columns:40px repeat(7, minmax(104px,1fr)) !important; }

  /* Caja a 1024px: la columna derecha del resumen se angosta un poco más
     (sección 34 del mandato -- probar en render real, no asumir). */
  .anik-portal[data-account-type] .anik-sale-grid{ grid-template-columns:minmax(0,1fr) minmax(240px,280px) !important; }
}

@media (max-width:768px){
  .anik-portal[data-account-type].anik-app-shell{ grid-template-columns:1fr !important; padding:var(--wbs-space-3) !important; display:grid !important; width:auto !important; max-width:100% !important; margin:0 !important; }
  .anik-portal[data-account-type] button.anik-menu-toggle[data-anik-menu-toggle]{ display:inline-flex !important; }

  .anik-portal[data-account-type] .anik-sidebar{
    position:fixed !important; top:0 !important; left:0 !important; height:100vh !important; max-height:100vh !important;
    width:min(300px,86vw) !important; z-index:var(--wbs-z-drawer) !important;
    border-radius:0 !important; border-right:1px solid var(--wbs-border) !important; border-top:0 !important; border-bottom:0 !important; border-left:0 !important;
    transform:translateX(calc(-100% - 24px)) !important;
    transition:transform var(--wbs-duration-base) var(--wbs-ease) !important;
  }
  .anik-portal[data-account-type][data-menu-open="true"] .anik-sidebar{ transform:translateX(0) !important; }
  .anik-portal[data-account-type][data-menu-open="true"] .anik-sidebar-overlay{ display:block !important; }
  .anik-portal[data-account-type][data-menu-open="true"]{ overflow:hidden; }

  /* Pulido visual 2.5.46: la densidad reducida del sidebar de escritorio
     (sección 4/9 del mandato: "no aplicar compactación desktop agresiva
     al móvil") NO debe achicar los touch targets del drawer -- se
     restauran los paddings verticales cómodos aquí, específicamente para
     el drawer móvil/tablet. */
  .anik-portal[data-account-type] .anik-side-nav a,
  .anik-portal[data-account-type] .anik-nav-top-link,
  .anik-portal[data-account-type] .anik-nav-group-summary{ padding-top:11px !important; padding-bottom:11px !important; }
  .anik-portal[data-account-type] .anik-nav-group-items a{ padding-top:10px !important; padding-bottom:10px !important; }
  .anik-portal[data-account-type] .anik-sidebar-foot a{ padding-top:10px !important; padding-bottom:10px !important; }

  /* Corrección touch targets Clientes (bloqueo final de auditoría): mismo
     principio que el drawer arriba -- la compactación de escritorio
     (30x30, pensada para mouse) es incómoda como target táctil real en
     mobile/tablet. Se agranda el ÁREA REAL del botón (no un transform:
     scale ni un padding visual engañoso) a 44x44 -- el tamaño real del
     elemento interactivo crece, así el hit-area medido con
     getBoundingClientRect() es genuinamente mayor, no solo la apariencia.
     El SVG se mantiene en su tamaño visual actual (15px) para no volver
     los iconos desproporcionadamente grandes -- se desacopla a propósito
     tamaño-de-ícono de tamaño-de-botón. El gap entre acciones se
     incrementa levemente para evitar toques accidentales entre botones
     ahora más grandes. "Ver ficha" comparte el mismo grupo táctil, así
     que su min-height sube en la misma medida por coherencia. */
  .anik-portal[data-account-type] .anik-action-link{
    width:44px !important; height:44px !important;
  }
  .anik-portal[data-account-type] .anik-table-actions{ gap:8px !important; }
  .anik-portal[data-account-type] .anik-table-open{ min-height:44px !important; }

  .anik-portal[data-account-type] .anik-topbar h1{ font-size:var(--wbs-text-xl) !important; }
  .anik-portal[data-account-type] .anik-top-actions{ width:100%; }

  /* Rediseño "Centro Operativo" (sección 25/42 del mandato: "en tablet/1
     columna, mantener la misma prioridad operacional -- Necesita atención
     nunca después de Inventario/Cupones/Reserva pública"). La tira de KPIs
     pasa a 2 por fila; la fila primaria Agenda+Atención colapsa a 1 columna
     y, CRÍTICO, se desactiva el `order` que en desktop mostraba Agenda
     primero -- vuelve a mandar el orden natural del DOM, que es Atención
     PRIMERO (así quedó escrito en el markup, sección 24), luego Agenda. */
  .anik-portal[data-account-type] .wbs-kpi-item{ flex:1 1 calc(50% - var(--wbs-space-3)) !important; border-right:0 !important; border-bottom:1px solid var(--wbs-border) !important; }
  .anik-portal[data-account-type] .wbs-dash-primary-row{ grid-template-columns:1fr !important; gap:var(--wbs-space-4) !important; }
  .anik-portal[data-account-type] .wbs-dash-primary-row > .wbs-card-agenda,
  .anik-portal[data-account-type] .wbs-dash-primary-row > .wbs-card-attention{ order:0 !important; }
  .anik-portal[data-account-type] .wbs-indicator-row{ flex-direction:column !important; }
  .anik-portal[data-account-type] .wbs-indicator{ border-right:0 !important; border-bottom:1px solid var(--wbs-border) !important; }
  .anik-portal[data-account-type] .wbs-indicator:last-child{ border-bottom:0 !important; }
  .anik-portal[data-account-type] .wbs-dash-tools{ grid-template-columns:1fr !important; gap:var(--wbs-space-4) !important; }
  .anik-portal[data-account-type] .wbs-staff-row{ grid-template-columns:1fr !important; gap:var(--wbs-space-4) !important; }
  .anik-portal[data-account-type] .wbs-quick-strip{ flex-direction:column !important; align-items:stretch !important; gap:var(--wbs-space-2) !important; }
  .anik-portal[data-account-type] .wbs-quick-strip .wbs-quick-actions{ justify-content:flex-start !important; }

  /* Agenda a 768px/tablet (secciones 58-61): título de rango en fila propia
     para no comprimir el selector Día/Semana/Mes; Semana usa franja
     horizontal de días (scroll-snap) en vez de un grid de 7 columnas
     achicado; Mes reduce el alto mínimo de celda y oculta el detalle de
     hora/cliente para dejar solo conteo -- "número + puntos/contador"
     (sección 60), evitando saturar celdas angostas. */
  .anik-portal[data-account-type] .wbs-agenda-toolbar{ align-items:flex-start !important; }
  .anik-portal[data-account-type] .wbs-agenda-nav{ width:100% !important; }
  .anik-portal[data-account-type] .wbs-agenda-title{ width:100% !important; margin:var(--wbs-space-1) 0 0 !important; order:1 !important; }

  .anik-portal[data-account-type] .wbs-agenda-week-grid{
    grid-template-columns:36px repeat(7, minmax(78vw, 1fr)) !important;
    overflow-x:auto !important; scroll-snap-type:x mandatory !important;
  }
  .anik-portal[data-account-type] .wbs-agenda-week-hour-col{ position:sticky !important; left:0 !important; z-index:2 !important; }
  .anik-portal[data-account-type] .wbs-agenda-week-day{ scroll-snap-align:start !important; }

  .anik-portal[data-account-type] .wbs-agenda-month-grid{ grid-auto-rows:minmax(72px, auto) !important; }
  .anik-portal[data-account-type] .wbs-agenda-month-chip{ font-size:9px !important; }

  /* Inventario a mobile/tablet (secciones 20/30/34-37 del mandato): NO
     tabla desktop con scroll horizontal, NO cards gigantes por producto --
     cada <tr> se convierte en una fila-lista densa de 2 líneas + acciones,
     reusando exactamente el mismo <td> ya renderizado (mismos datos, sin
     duplicar markup) mediante grid-template-areas. El <thead> se oculta
     porque el propio contenido de cada celda ya se autoexplica (nombre,
     "$12.990", "12 unidad", badge de color) sin necesitar repetir la
     etiqueta de columna. */
  .anik-portal[data-account-type] .anik-inv-table,
  .anik-portal[data-account-type] .anik-inv-table tbody{ display:block !important; width:100% !important; }
  .anik-portal[data-account-type] .anik-inv-table thead{ display:none !important; }
  .anik-portal[data-account-type] .anik-inv-row{
    display:grid !important; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) !important;
    grid-template-areas:"product price" "stock status" "actions actions" !important;
    gap:3px var(--wbs-space-3) !important; padding:var(--wbs-space-3) !important;
  }
  /* min-width:0 explícito en cada celda: el valor por defecto de un ítem de
     grid es min-width:auto (se resiste a achicarse por debajo del ancho de
     su contenido sin wrap) -- causa raíz real de un overflow interno de
     ~130px medido con scrollWidth/clientWidth (la línea "costo $X ·
     margen Y%" empujaba la columna entera a su ancho sin wrap en vez de
     respetar el espacio disponible). Mismo patrón "trampa de min-width/
     min-height por defecto" ya documentado en el proyecto para flex. La
     columna "price" pasa de minmax(0,auto) (sizing por max-content,
     terminaba comiéndose casi todo el ancho de la fila) a minmax(0,1fr)
     -- reparto proporcional real y predecible entre ambas columnas -- y el
     nombre del producto suma overflow-wrap para nunca depender de que una
     palabra suelta quepa exacto en su columna. */
  /* white-space:normal explícito: una regla legacy genérica
     ".anik-portal table :is(th,td){white-space:nowrap!important}" (no de
     este archivo) fuerza nowrap en CUALQUIER celda de CUALQUIER tabla del
     portal -- nunca se había necesitado contrarrestarla porque ninguna
     tabla previa necesitaba envolver texto dentro de una celda en mobile.
     Causa raíz real medida con getComputedStyle(): "costo $X · margen Y%"
     no envolvía pese a min-width:0 porque el texto ni siquiera intentaba
     hacer wrap. */
  .anik-portal[data-account-type] .anik-inv-row td{ display:block !important; padding:0 !important; border-bottom:0 !important; min-width:0 !important; white-space:normal !important; }
  .anik-portal[data-account-type] .anik-inv-cell-product{ grid-area:product !important; overflow-wrap:break-word !important; }
  .anik-portal[data-account-type] .anik-inv-cell-price{ grid-area:price !important; text-align:right !important; overflow-wrap:break-word !important; }
  .anik-portal[data-account-type] .anik-inv-cell-stock{ grid-area:stock !important; text-align:left !important; }
  .anik-portal[data-account-type] .anik-inv-cell-status{ grid-area:status !important; text-align:right !important; }
  .anik-portal[data-account-type] .anik-inv-cell-actions{ grid-area:actions !important; margin-top:4px !important; }
  .anik-portal[data-account-type] tr.anik-inv-panel-row{ display:block !important; }
  .anik-portal[data-account-type] tr.anik-inv-panel-row td{ display:block !important; }
  .anik-portal[data-account-type] .anik-inv-panel-form{ grid-template-columns:1fr !important; }
  /* BUG real encontrado en QA mobile: "display:block !important" de arriba
     le ganaba a la regla nativa del navegador para [hidden] (que tiene
     prioridad baja, no !important), dejando TODOS los paneles de
     Movimiento/Editar abiertos por defecto en mobile pese a que el
     atributo "hidden" seguía presente en el HTML. Se fuerza explícitamente
     display:none en las filas con [hidden], con la misma especificidad
     !important para que sí gane. */
  .anik-portal[data-account-type] tr.anik-inv-panel-row[hidden]{ display:none !important; }

  /* Touch targets reales (mismo breakpoint/patrón ya validado en la ronda
     de Clientes -- crecimiento real de width/height, nunca transform:
     scale(), sección 22/37 del mandato). */
  .anik-portal[data-account-type] .anik-inv-action-btn{ min-height:44px !important; padding:10px 12px !important; }
  .anik-portal[data-account-type] .anik-inv-toolbar-row details.anik-inv-new-product > summary.anik-btn{ min-height:44px !important; }

  .anik-portal[data-account-type] .anik-inv-summary-item{ flex:1 1 45% !important; }
  .anik-portal[data-account-type] .anik-inv-toolbar{ justify-content:flex-start !important; }

  /* Corrección quirúrgica (blocker 1, sección 6 del mandato): PDF/CSV/Nuevo
     producto no deben forzar una sola línea imposible en mobile -- el wrap
     ya existe en .anik-inv-toolbar-actions, aquí solo se asegura ancho
     completo y touch targets reales. */
  .anik-portal[data-account-type] .anik-inv-toolbar-actions{ width:100% !important; justify-content:flex-start !important; }
  .anik-portal[data-account-type] .anik-inv-toolbar-actions .anik-btn{ min-height:44px !important; }

  /* Caja -- 1 columna estricta (sección 20/30/32 del mandato). El resumen
     de venta (Total/Pago/Registrar) pasa a ser el bloque final de Venta
     Activa, no una columna flotante. */
  .anik-portal[data-account-type] .anik-sale-grid{ grid-template-columns:1fr !important; }
  .anik-portal[data-account-type] .anik-sale-summary-panel{ margin-top:var(--wbs-space-3) !important; }
  .anik-portal[data-account-type] .anik-sale-summary-item{ flex:1 1 45% !important; }

  /* Fila de ítem mobile -- BLOQUEANTE (sección 30/31/72 del mandato):
     Cantidad/Precio/Subtotal/Eliminar NUNCA pueden quedar fuera del
     viewport ni requerir scroll horizontal. Se abandona el grid de 6
     columnas fijas y se reorganiza como tarjeta compacta de una columna,
     mismos campos/nombres/selectors -- solo cambia el layout visual. */
  .anik-portal[data-account-type] .anik-sale-items-head{ display:none !important; }
  .anik-portal[data-account-type] .anik-sale-row{
    display:grid !important; grid-template-columns:1fr 1fr !important;
    grid-template-areas:"type type" "desc desc" "qty price" "sub sub" "remove remove" !important;
    gap:6px var(--wbs-space-2) !important; padding:var(--wbs-space-3) !important; border:1px solid var(--wbs-border) !important;
    border-radius:var(--wbs-radius-md) !important; margin-bottom:var(--wbs-space-2) !important;
  }
  .anik-portal[data-account-type] .anik-sale-row .anik-si-type{ grid-area:type !important; width:100% !important; }
  .anik-portal[data-account-type] .anik-sale-row .anik-si-desc-wrap{ grid-area:desc !important; width:100% !important; }
  .anik-portal[data-account-type] .anik-sale-row .anik-si-desc-wrap .anik-si-desc,
  .anik-portal[data-account-type] .anik-sale-row .anik-si-desc-wrap .anik-si-prod-sel,
  .anik-portal[data-account-type] .anik-sale-row .anik-si-desc-wrap .anik-si-svc-sel{ width:100% !important; }
  .anik-portal[data-account-type] .anik-sale-row .anik-sale-field-qty{ grid-area:qty !important; width:100% !important; }
  .anik-portal[data-account-type] .anik-sale-row .anik-sale-field-price{ grid-area:price !important; width:100% !important; }
  .anik-portal[data-account-type] .anik-sale-row .anik-si-qty{ text-align:left !important; }
  .anik-portal[data-account-type] .anik-sale-row .anik-si-sub{ grid-area:sub !important; text-align:right !important; font-size:var(--wbs-text-md) !important; padding-top:4px !important; border-top:1px solid var(--wbs-border) !important; }
  /* Microcorrección: Cantidad/Precio pasan de nombre-solo-accesible a
     también visibles en mobile (sección 6/9/20 del mandato) -- el mismo
     <label> envolvente de desktop, solo se revierte el clip visual. */
  .anik-portal[data-account-type] .anik-sale-field-label-text{
    position:static !important; width:auto !important; height:auto !important; margin:0 0 2px !important; padding:0 !important;
    overflow:visible !important; clip:auto !important; white-space:normal !important; display:block !important;
    font-size:10px !important; font-weight:var(--wbs-weight-medium) !important; color:var(--wbs-text-muted) !important;
    text-transform:uppercase !important; letter-spacing:.03em !important;
  }
  /* Sin display:block!important a propósito -- el botón tiene su propio
     inline style="display:none" que el JS alterna a '' cuando hay más de
     1 fila (mismo bug de layout que ya se encontró y corrigió en la ronda
     de Inventario: una regla !important de display puede pisar el estado
     real que controla el JS). El item de grid no necesita display:block
     explícito -- el algoritmo de grid ya lo trata como caja de nivel de
     grid mientras no sea "none". */
  .anik-portal[data-account-type] .anik-sale-row .anik-remove-row{ grid-area:remove !important; width:100% !important; min-height:40px !important; }
  .anik-portal[data-account-type] .anik-sale-secondary-grid{ grid-template-columns:1fr !important; }

  /* Selector de cliente + touch targets reales en Caja (sección 73 del
     mandato, mismo patrón width/height ya validado en Inventario). */
  .anik-portal[data-account-type] .anik-sale-customer-chip{ min-height:40px !important; }
  .anik-portal[data-account-type] .anik-sale-submit{ min-height:44px !important; }
  .anik-portal[data-account-type] .anik-sale-add-item{ min-height:44px !important; width:100% !important; }
  .anik-portal[data-account-type] button.anik-sale-danger-btn{ min-height:36px !important; }
}

@media (max-width:400px){
  .anik-portal[data-account-type].anik-app-shell{ padding:var(--wbs-space-2) !important; width:auto !important; max-width:100% !important; margin:0 !important; }
  .anik-portal[data-account-type] .anik-topbar{ flex-direction:column !important; align-items:stretch !important; }
  .anik-portal[data-account-type] .anik-top-actions{ justify-content:flex-start !important; }
  .anik-portal[data-account-type] .anik-btn{ flex:1 1 auto; }
  .anik-portal[data-account-type] .anik-modal{ max-width:100%; }

  .anik-portal[data-account-type] .wbs-kpi{ padding:var(--wbs-space-3) !important; gap:var(--wbs-space-2) !important; }
  .anik-portal[data-account-type] .wbs-kpi > svg{ width:16px !important; height:16px !important; padding:6px !important; }
  .anik-portal[data-account-type] .wbs-kpi-label{ letter-spacing:0 !important; font-size:11px !important; }
  .anik-portal[data-account-type] .wbs-kpi-value{ font-size:var(--wbs-text-xl) !important; }
  .anik-portal[data-account-type] .wbs-kpi-money > svg{ display:none !important; }
  /* Rediseño "Centro Operativo": mismo ajuste de densidad que .wbs-kpi
     (Dashboard Colaborador) aplicado a .wbs-kpi-item (tira del Dashboard
     Negocio). */
  .anik-portal[data-account-type] .wbs-kpi-item{ padding:var(--wbs-space-3) !important; gap:var(--wbs-space-2) !important; }
  .anik-portal[data-account-type] .wbs-kpi-item > svg{ width:16px !important; height:16px !important; padding:6px !important; }
  .anik-portal[data-account-type] .wbs-card{ padding:var(--wbs-space-3) var(--wbs-space-4) !important; }
  .anik-portal[data-account-type] .wbs-card-head{ flex-direction:column !important; align-items:stretch !important; }
  .anik-portal[data-account-type] .wbs-card-head .anik-btn{ align-self:flex-start; }
  .anik-portal[data-account-type] .wbs-quick-actions .anik-btn{ flex:1 1 45%; }
  .anik-portal[data-account-type] .wbs-jornada-actions .anik-btn{ flex:1 1 100%; }
  .anik-portal[data-account-type] .wbs-staff-row{ grid-template-columns:1fr !important; }

  /* Agenda a 390px (secciones 58-61, prioridad del mandato): Día debe ser
     excelente (columna única, ya lo es de por sí). Semana se convierte en
     franja horizontal de un día a la vez (scroll-snap, cada columna ~86vw)
     -- nunca un grid de 7 columnas diminutas. Mes reduce a "número +
     puntos", sin texto de hora/cliente (ilegible en ~50px de celda). */
  .anik-portal[data-account-type] .wbs-agenda-view-btn{ padding:6px 10px !important; font-size:13px !important; }
  .anik-portal[data-account-type] .wbs-agenda-title{ font-size:var(--wbs-text-base) !important; }
  .anik-portal[data-account-type] .wbs-agenda-hour-col,
  .anik-portal[data-account-type] .wbs-agenda-day-col{ height:calc(var(--wbs-agenda-hours,12) * 46px) !important; }
  .anik-portal[data-account-type] .wbs-agenda-day-col{ background-image:repeating-linear-gradient(to bottom, var(--wbs-border) 0, var(--wbs-border) 1px, transparent 1px, transparent 46px) !important; }
  .anik-portal[data-account-type] .wbs-agenda-entry{ font-size:10px !important; padding:2px 6px !important; min-height:26px !important; }

  .anik-portal[data-account-type] .wbs-agenda-week-grid{ grid-template-columns:34px repeat(7, minmax(86vw, 1fr)) !important; }

  .anik-portal[data-account-type] .wbs-agenda-month-grid{ grid-auto-rows:minmax(38px, auto) !important; }
  .anik-portal[data-account-type] .wbs-agenda-month-cell{ align-items:center !important; justify-content:flex-start !important; padding:4px 2px !important; }
  .anik-portal[data-account-type] .wbs-agenda-month-preview{ display:none !important; }
  .anik-portal[data-account-type] .wbs-agenda-month-cell.has-items::after{
    content:'' !important; display:block !important; width:5px !important; height:5px !important; border-radius:50% !important; background:var(--wbs-brand) !important;
  }
}

/* --------------------------------------------------------------------------
   9. COMMAND-CENTER SIN TÍTULO -- sin el blob decorativo heredado
   -------------------------------------------------------------------------- */
/* public.css define .anik-command-center:before como un blob de gradiente
   flotante, pensado para un header grande con h2/p. Varios command-centers
   de este ciclo ya no llevan h2 (quedaron como toolbars de filtros/acciones
   tras quitarles el título duplicado: Comisiones, Estadísticas, Marketing,
   Asistencia) y ese blob queda huérfano, sin nada que lo justifique -- se ve
   como un parche vacío en una esquina. :has() (ya usado en este mismo
   proyecto, ver body:has(.anik-app-shell) en public.css) permite apagarlo
   solo cuando el command-center NO tiene h2, sin depender de qué combinación
   de clases (.compact, .anik-print-hide, etc.) traiga cada pantalla -- el
   command-center "hero" grande (con h2) conserva el blob sin cambios. */
.anik-portal[data-account-type] .anik-command-center:not(:has(h2)):before{ display:none !important; }

/* --------------------------------------------------------------------------
   10. EQUIPO / COLABORADORES -- panel "Crear nuevo" compacto + listado
       realmente escaneable (WORKBOOK PREMIUM SYSTEM, ronda de composición)
   -------------------------------------------------------------------------- */
/* El panel "Crear nuevo colaborador" ya era un <details> colapsado por
   defecto (el disclosure funcionaba bien) -- el problema real, confirmado
   por render, era puramente visual: un título a tamaño clamp(20-28px) que
   partía en 2 líneas, padding generoso y un badge "+ Nuevo" con un
   gradiente azul-violeta HARDCODEADO en public.css (mismo antipatrón ya
   corregido varias veces este ciclo en otros botones, aquí nunca detectado
   porque el badge es un <b>, no un <button>/.anik-btn). Se compacta el
   resumen colapsado y se resuelve el badge al sistema de botones real. */
/* FINAL -- corrección estructural real (no cosmética): .anik-staff-layout
   seguía siendo un grid PERMANENTE de 2 columnas (minmax(0,.82fr)
   minmax(420px,1.18fr), heredado de public.css línea 2519) que reservaba
   ~40% del ancho desktop para "Crear nuevo colaborador" SIEMPRE, sin
   importar que el panel estuviera colapsado -- el hallazgo real de la
   auditoría de esta ronda (screenshot real 1366px: columna izquierda con
   solo un summary colapsado y el resto del espacio vacío). Se elimina el
   split lateral por completo: el layout pasa a una sola columna -- el
   summary colapsado actúa como una barra de ancho completo (CTA a la
   derecha vía el grid interno de .anik-create-summary, que no cambia), y
   el listado de colaboradores queda protagonista a ancho completo debajo,
   sin depender de ningún split. align-items:stretch neutraliza el
   align-items:start!important heredado de la regla legacy (que dejaría los
   hijos angostos por contenido en vez de a ancho completo). */
.anik-portal[data-account-type] .anik-staff-layout{
  display:flex !important; flex-direction:column !important; align-items:stretch !important;
  gap:var(--wbs-space-4) !important;
}
.anik-portal[data-account-type] .anik-staff-create-panel,
.anik-portal[data-account-type] .anik-staff-list-panel{
  width:100% !important;
}
/* Al abrirse (crear/editar), el formulario se despliega a ancho completo
   pero con un máximo cómodo de lectura -- no queda pegado a los bordes en
   pantallas anchas, sin volver a ser una columna angosta fija (sección 8
   del mandato: "full width o suficientemente ancho"). */
.anik-portal[data-account-type] .anik-staff-create-panel[open] form{
  max-width:900px !important;
}
.anik-portal[data-account-type] .anik-staff-create-panel > .anik-create-summary{
  padding:14px 18px !important; gap:2px 12px !important;
}
.anik-portal[data-account-type] .anik-create-summary strong{
  font-size:17px !important; line-height:1.2 !important;
}
.anik-portal[data-account-type] .anik-create-summary em{ font-size:12px !important; }
.anik-portal[data-account-type] .anik-create-summary b{
  background:var(--wbs-brand) !important;
  min-height:34px !important; padding:0 14px !important; font-size:12.5px !important;
}
/* El texto del badge seguía invisible tras el fix de fondo: workbook-premium.css
   trae ".anik-portal.anik-app-shell.anik-mode-light :is(h1,h2,h3,h4,strong,b,
   label,th,.anik-step-title){color:#0d1b2b!important}" -- specificity (0,4,0)
   vía el argumento de clase dentro de :is(), que le gana a un simple ".anik-
   portal[data-account-type] .anik-create-summary b" (0,2,1). Se iguala
   agregando .anik-app-shell al selector (mismo patrón ya usado para el botón
   danger este ciclo): con las clases empatadas en 4, el tipo "b" explícito
   decide el empate a favor de esta regla. */
.anik-portal[data-account-type].anik-app-shell .anik-create-summary b{
  color:var(--wbs-brand-ink) !important;
}
.anik-portal[data-account-type] .anik-staff-create-panel .anik-create-intro{ margin:10px 18px 0 !important; }
.anik-portal[data-account-type] .anik-staff-create-panel form{ padding:12px 18px 18px !important; }

/* Listado: la ficha de cada colaborador mostraba 4-5 líneas de meta-datos
   apiladas antes de llegar a las acciones -- difícil de escanear varias
   personas seguidas. Se agrupa la meta-información en una sola fila
   compacta con separadores, se reduce el bloque "Inicio en el equipo" a
   una línea liviana, y se ordena la fila de acciones como una toolbar
   consistente -- sin tocar ningún handler/nonce/form, solo agrupación
   visual de los mismos elementos ya renderizados por PHP. */
.anik-portal[data-account-type] .anik-staff-profile-card{ padding:16px 18px !important; gap:14px !important; }
.anik-portal[data-account-type] .anik-staff-profile-main > strong{
  font-size:15px !important; margin-bottom:2px !important; display:block !important;
}
.anik-portal[data-account-type] .anik-staff-profile-main > p{
  margin:0 !important; font-size:12.5px !important; line-height:1.5 !important;
  color:var(--wbs-text-muted) !important;
}
.anik-portal[data-account-type] .anik-staff-profile-facts{
  margin-top:4px !important; display:inline-flex !important; gap:6px !important;
  font-size:11.5px !important; color:var(--wbs-text-muted) !important;
}
.anik-portal[data-account-type] .anik-staff-profile-facts span{
  display:inline-flex !important; gap:4px !important; padding:0 !important;
  background:transparent !important; border:0 !important;
}
.anik-portal[data-account-type] .anik-staff-profile-facts b{ font-weight:600 !important; color:var(--wbs-text) !important; }
.anik-portal[data-account-type] .anik-staff-profile-details{ margin-top:6px !important; }
.anik-portal[data-account-type] .anik-staff-profile-details summary{
  font-size:12px !important; font-weight:600 !important; color:var(--wbs-brand) !important;
  cursor:pointer !important;
}
.anik-portal[data-account-type] .anik-staff-profile-card .anik-row-actions{
  display:flex !important; flex-wrap:wrap !important; gap:8px !important; align-items:center !important;
}
.anik-portal[data-account-type] .anik-staff-profile-card .anik-row-actions a,
.anik-portal[data-account-type] .anik-staff-profile-card .anik-row-actions button{
  font-size:12.5px !important; font-weight:600 !important; padding:7px 12px !important;
  border-radius:10px !important; border:1px solid var(--wbs-border) !important;
  background:var(--wbs-surface) !important; color:var(--wbs-text) !important;
  text-decoration:none !important; cursor:pointer !important;
}
.anik-portal[data-account-type] .anik-staff-profile-card .anik-row-actions a:hover,
.anik-portal[data-account-type] .anik-staff-profile-card .anik-row-actions button:hover{
  background:var(--wbs-surface-subtle) !important;
}
.anik-portal[data-account-type] .anik-staff-profile-card .anik-row-actions button.anik-mini-danger{
  border-color:var(--wbs-danger-border) !important;
}