/* ═══════════════════════════════════════════════════════════════
   css/analista-productos.css — "Analista de Productos"
   Design language propio (tema claro, premium) — no hereda el
   glassmorphism oscuro del resto de la plataforma. Todo escala bajo
   #page-analista_productos para no filtrarse al resto de la app.
   ═══════════════════════════════════════════════════════════════ */

#page-analista_productos {
  --ap-bg:        #F6F8FB;
  --ap-card:      #FFFFFF;
  --ap-text:      #101828;
  --ap-text2:     #667085;
  --ap-border:    rgba(15, 23, 42, .08);
  --ap-blue:      #3B82F6;
  --ap-green:     #10B981;
  --ap-red:       #EF4444;
  --ap-orange:    #F59E0B;

  --ap-r-sm:      16px;
  --ap-r-lg:      20px;

  --ap-shadow:     0 10px 30px rgba(15, 23, 42, .05);
  --ap-shadow-hov: 0 20px 45px rgba(15, 23, 42, .09);

  --ap-ease: cubic-bezier(.25,.8,.25,1);

  /* Menú lateral — variables propias (independientes de --ap-card) para que
     el selector de temas pueda pintarlo distinto al resto del contenido,
     igual que hace Scraper Pro con su sidebar. */
  --ap-sidebar-bg:    #FFFFFF;
  --ap-sidebar-text:  #101828;
  --ap-sidebar-text2: #667085;

  background: var(--ap-bg);
  color: var(--ap-text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  -webkit-font-smoothing: antialiased;
  transition: background 180ms ease, color 180ms ease;
}

/* ── Tema oscuro — selector propio del módulo (no depende del theme
   global de NeumaticOS), toggle en el topbar, ver apToggleTheme() ── */
#page-analista_productos[data-ap-theme="dark"] {
  --ap-bg:        #0B0D14;
  --ap-card:      #12141C;
  --ap-text:      #E8EAF0;
  --ap-text2:     #8B92A5;
  --ap-border:    rgba(255, 255, 255, .08);
  --ap-blue:      #818CF8;
  --ap-green:     #34D399;
  --ap-red:       #F87171;
  --ap-orange:    #FBBF24;
  --ap-shadow:     0 10px 30px rgba(0, 0, 0, .45);
  --ap-shadow-hov: 0 20px 50px rgba(0, 0, 0, .6);
  --ap-sidebar-bg:    #12141C;
  --ap-sidebar-text:  #E8EAF0;
  --ap-sidebar-text2: #8B92A5;
}
#page-analista_productos[data-ap-theme="dark"] .ap-search,
#page-analista_productos[data-ap-theme="dark"] .ap-provider-form input { color-scheme: dark; }

/* El resto de la plataforma fuerza `color: var(--text1) !important` en TODO
   input (index.html ~L1534), pensado para sus temas oscuros — acá se pisa
   con la variable propia del módulo (--ap-text), porque el tema por defecto
   de Analista de Productos es claro y ese texto quedaba blanco sobre blanco. */
#page-analista_productos input:not([type="checkbox"]):not([type="radio"]),
#page-analista_productos textarea {
  color: var(--ap-text) !important;
  caret-color: var(--ap-text) !important;
}
#page-analista_productos input::placeholder,
#page-analista_productos textarea::placeholder {
  color: var(--ap-text2) !important;
}
#page-analista_productos[data-ap-theme="dark"] .ap-hero-img-wrap { background: linear-gradient(160deg, #1A1D2A, #12141C); }
#page-analista_productos[data-ap-theme="dark"] .ap-profit-panel { background: linear-gradient(155deg, rgba(52,211,153,.10) 0%, var(--ap-card) 55%); border-color: rgba(52,211,153,.18); }
#page-analista_productos[data-ap-theme="dark"] .ap-profit-label { color: #6EE7B7; }
#page-analista_productos[data-ap-theme="dark"] .ap-profit-value { color: #A7F3D0; }
#page-analista_productos[data-ap-theme="dark"] .ap-btn-primary { color: #0B0D14; }

#page-analista_productos * { box-sizing: border-box; }

/* ══════════════════════════════════════════════════════════════
   SHELL PROPIO — sidebar de 14 secciones + router interno.
   Mismo patrón que Nexo App (frontend/css/nexo-app.css): un grid
   armado DENTRO de #page-analista_productos, sin tocar el sidebar
   global de NeumaticOS (que sigue visible al costado, colapsable
   a mano como en cualquier otro módulo).
   ══════════════════════════════════════════════════════════════ */
#page-analista_productos .ap-app {
  display: flex;
  height: 100%;
  overflow: hidden;
  /* El panel de filtros se ancla ACÁ (position:absolute) en vez de a la
     ventana entera — bug real confirmado en vivo 2026-08-18: con
     position:fixed se posicionaba contra el viewport completo, así que
     se superponía con el riel de íconos y la barra superior del resto
     de la plataforma, que viven AFUERA de #page-analista_productos. */
  position: relative;
}

/* Corrección 2026-08-18: el menú de navegación (Research/Operación/
   Negocio) SIEMPRE visible, docked — lo que había que hacer flotante era
   el panel de FILTROS de Catálogo de Productos (ver .ap-pf-sidebar más
   abajo), no este. */
#page-analista_productos .ap-sidebar {
  width: 240px;
  flex-shrink: 0;
  background: var(--ap-sidebar-bg);
  border-right: 1px solid var(--ap-border);
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow-y: auto;
  scrollbar-width: none;
}
#page-analista_productos .ap-sidebar::-webkit-scrollbar { display: none; }

#page-analista_productos .ap-sidebar-logo {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 20px 16px 16px;
  border-bottom: 1px solid var(--ap-border);
  flex-shrink: 0;
}
#page-analista_productos .ap-sidebar-logo-icon {
  width: 32px; height: 32px; border-radius: 9px; flex-shrink: 0;
  background: linear-gradient(135deg, var(--ap-blue), #1d4ed8);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(59,130,246,.35);
  color: #fff;
}
#page-analista_productos .ap-sidebar-logo-icon svg { width: 17px; height: 17px; }
#page-analista_productos .ap-sidebar-logo-text { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
#page-analista_productos .ap-sidebar-logo-name { font-size: 14px; font-weight: 800; letter-spacing: -.01em; color: var(--ap-sidebar-text); }
#page-analista_productos .ap-sidebar-logo-tag { font-size: 9px; font-weight: 700; color: var(--ap-sidebar-text2); letter-spacing: .12em; text-transform: uppercase; }

#page-analista_productos .ap-nav { padding: 10px; flex: 1; overflow-y: auto; }
#page-analista_productos .ap-nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: 10px; cursor: pointer;
  font-size: 13px; font-weight: 500; color: var(--ap-sidebar-text2);
  margin-bottom: 2px; border: 1px solid transparent;
  transition: background 150ms var(--ap-ease), color 150ms var(--ap-ease);
}
#page-analista_productos .ap-nav-item svg { width: 16px; height: 16px; flex-shrink: 0; }
#page-analista_productos .ap-nav-item:hover { background: rgba(59,130,246,.08); color: var(--ap-sidebar-text); }
#page-analista_productos .ap-nav-item.active {
  background: rgba(59,130,246,.12); color: var(--ap-blue);
  border-color: rgba(59,130,246,.18); font-weight: 700;
}
#page-analista_productos .ap-nav-item .ap-nav-badge {
  margin-left: auto; font-size: 9px; font-weight: 700; padding: 2px 7px; border-radius: 999px;
  background: rgba(102,112,133,.12); color: var(--ap-sidebar-text2); text-transform: uppercase; letter-spacing: .04em;
}
#page-analista_productos .ap-nav-item .ap-nav-badge-critical { background: rgba(239,68,68,.15); color: #ef4444; }
#page-analista_productos .ap-nav-group-label {
  font-size: 10.5px; font-weight: 700; color: var(--ap-sidebar-text2); text-transform: uppercase; letter-spacing: .08em;
  padding: 14px 10px 6px; opacity: .65;
}
#page-analista_productos .ap-nav-group-label:first-child { padding-top: 6px; }

/* Reordenar módulos arrastrando (pedido explícito 2026-08-18) — el ítem
   arrastrado se atenúa, y el que está debajo del mouse muestra una línea
   arriba o abajo según a qué mitad apunta. */
#page-analista_productos .ap-nav-item[draggable="true"] { cursor: grab; }
#page-analista_productos .ap-nav-item.ap-nav-dragging { opacity: .4; cursor: grabbing; }
#page-analista_productos .ap-nav-item.ap-nav-drop-before { box-shadow: inset 0 2px 0 0 var(--ap-blue); }
#page-analista_productos .ap-nav-item.ap-nav-drop-after { box-shadow: inset 0 -2px 0 0 var(--ap-blue); }

/* Acordeón "Canales de Venta" */
#page-analista_productos .ap-nav-chevron { margin-left: auto; display: flex; transition: transform 150ms var(--ap-ease); }
#page-analista_productos .ap-nav-chevron svg { width: 13px; height: 13px; }
#page-analista_productos .ap-nav-item.expanded .ap-nav-chevron { transform: rotate(180deg); }
/* Historial de "Analista de Comercios" — acá el toggle vive en el chevron
   mismo (no en todo el ap-nav-item, que sigue navegando normal al click). */
#page-analista_productos .ap-nav-chevron.expanded { transform: rotate(180deg); }
#page-analista_productos .ap-nav-subgroup { padding-left: 14px; margin-bottom: 4px; }
#page-analista_productos .ap-nav-subitem {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 10px; border-radius: 8px; cursor: pointer;
  font-size: 12.5px; font-weight: 500; color: var(--ap-sidebar-text2);
  margin-bottom: 1px; border-left: 2px solid var(--ap-border);
  transition: background 150ms var(--ap-ease), color 150ms var(--ap-ease);
}
#page-analista_productos .ap-nav-subitem:hover { background: rgba(59,130,246,.06); color: var(--ap-sidebar-text); }
#page-analista_productos .ap-nav-subitem-dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; }
#page-analista_productos .ap-nav-subitem-dot.on  { background: var(--ap-green); }
#page-analista_productos .ap-nav-subitem-dot.off { background: var(--ap-sidebar-text2); opacity: .4; }
#page-analista_productos .ap-nav-subitem-more { color: var(--ap-blue); font-weight: 600; }
#page-analista_productos .ap-nav-subitem-loading { cursor: default; opacity: .6; }

#page-analista_productos .ap-main {
  flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden;
}
#page-analista_productos .ap-topbar {
  flex-shrink: 0; padding: 20px 32px; border-bottom: 1px solid var(--ap-border);
  display: flex; align-items: baseline; justify-content: space-between; gap: 16px; flex-wrap: wrap;
}
#page-analista_productos .ap-topbar-title { font-size: 20px; font-weight: 800; letter-spacing: -.015em; }
#page-analista_productos .ap-topbar-sub { font-size: 13px; color: var(--ap-text2); margin-top: 2px; }
#page-analista_productos .ap-theme-toggle {
  width: 38px; height: 38px; border-radius: 11px; flex-shrink: 0;
  border: 1px solid var(--ap-border); background: var(--ap-card); color: var(--ap-text2);
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  transition: color 150ms var(--ap-ease), border-color 150ms var(--ap-ease), transform 150ms var(--ap-ease);
}
#page-analista_productos .ap-theme-toggle svg { width: 18px; height: 18px; }
#page-analista_productos .ap-theme-toggle:hover { color: var(--ap-blue); border-color: var(--ap-blue); transform: rotate(-12deg); }

/* Selector de temas — panel propio de este módulo, mismo lenguaje visual
   que el de Scraper Pro (grid de paletas + colores personalizados), pero
   100% independiente: propias clases (ap-theme-*), propias variables
   (--ap-*), propio localStorage (ap_theme_v1) — nada compartido con
   NeumaticOS ni con Scraper Pro. Ver AP_PRO_PALETTES en analistaProductos.js. */
#page-analista_productos .ap-theme-panel {
  /* position:fixed (no absolute) a propósito: .ap-main tiene overflow:hidden
     (para no generar scroll de página) y un panel tan alto como este grid de
     paletas quedaba recortado ahí — mismo problema (y misma solución) que ya
     tiene el selector de Scraper Pro. Se ancla a mano contra el botón real
     al abrirse (ver apThemeToggleMenu en analistaProductos.js). */
  display: none; position: fixed; width: 380px;
  max-height: calc(100vh - 140px); overflow-y: auto;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: 16px;
  box-shadow: var(--ap-shadow-hov); z-index: 2000; padding: 16px;
}
#page-analista_productos .ap-theme-panel.open { display: block; animation: apFadeIn .15s ease; }
@keyframes apFadeIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
#page-analista_productos .ap-theme-panel-hdr { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
#page-analista_productos .ap-theme-panel-title { font-size: 13px; font-weight: 800; color: var(--ap-text); }
#page-analista_productos .ap-theme-panel-sub { font-family: monospace; font-size: 9px; color: var(--ap-text2); margin-top: 2px; }
#page-analista_productos .ap-theme-panel-close {
  background: rgba(102,112,133,.1); border: 1px solid var(--ap-border); border-radius: 8px; cursor: pointer;
  font-size: 14px; color: var(--ap-text2); width: 26px; height: 26px; display: flex; align-items: center; justify-content: center;
}
#page-analista_productos .ap-theme-cat-label {
  grid-column: 1/-1; font-family: monospace; font-size: 8px; color: var(--ap-text2);
  letter-spacing: .08em; margin: 6px 0 2px;
}
#page-analista_productos .ap-theme-slider { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; padding: 2px 0 8px; }
#page-analista_productos .ap-theme-card { cursor: pointer; border-radius: 10px; overflow: hidden; border: 2px solid transparent; transition: all .15s; background: rgba(102,112,133,.08); }
#page-analista_productos .ap-theme-card:hover { transform: translateY(-2px); box-shadow: var(--ap-shadow); }
#page-analista_productos .ap-theme-card.active { border-color: var(--ap-blue); box-shadow: 0 0 0 1px var(--ap-blue); }
#page-analista_productos .ap-theme-card-swatch { height: 38px; position: relative; display: flex; align-items: flex-end; padding: 5px; }
#page-analista_productos .ap-theme-card-tagchip { position: absolute; top: 4px; right: 4px; font-family: monospace; font-size: 6px; background: rgba(0,0,0,.45); color: #fff; border-radius: 3px; padding: 1px 4px; letter-spacing: .05em; }
#page-analista_productos .ap-theme-card-icon { font-size: 13px; margin: auto; }
#page-analista_productos .ap-theme-card-check { width: 15px; height: 15px; border-radius: 50%; background: rgba(255,255,255,.95); display: flex; align-items: center; justify-content: center; font-size: 8px; font-weight: 900; opacity: 0; transition: .15s; color: #1e293b; }
#page-analista_productos .ap-theme-card.active .ap-theme-card-check { opacity: 1; }
#page-analista_productos .ap-theme-card-name { font-size: 9.5px; font-weight: 700; color: var(--ap-text2); padding: 4px 3px 5px; text-align: center; line-height: 1.25; }
#page-analista_productos .ap-theme-card-desc { display: block; font-size: 8px; color: var(--ap-text2); opacity: .7; font-family: monospace; margin-top: 1px; }
#page-analista_productos .ap-theme-custom { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ap-border); }
#page-analista_productos .ap-theme-custom-label { font-family: monospace; font-size: 8px; color: var(--ap-text2); letter-spacing: .08em; margin-bottom: 10px; }
#page-analista_productos .ap-theme-custom-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#page-analista_productos .ap-theme-custom-field-label { font-size: 9px; color: var(--ap-text2); margin-bottom: 4px; }
#page-analista_productos .ap-theme-custom-row { display: flex; gap: 6px; align-items: center; }
#page-analista_productos .ap-theme-custom-row input[type="color"] {
  width: 34px; height: 30px; border: 1px solid var(--ap-border); border-radius: 6px; background: var(--ap-bg); cursor: pointer; padding: 2px;
}
#page-analista_productos .ap-theme-custom-row input[type="text"] {
  flex: 1; min-width: 0; height: 30px; padding: 4px 8px; border: 1px solid var(--ap-border); border-radius: 6px;
  background: var(--ap-bg); color: var(--ap-text2); font-family: monospace; font-size: 11px;
}
#page-analista_productos .ap-theme-custom-actions { display: flex; gap: 8px; margin-top: 12px; }
#page-analista_productos .ap-theme-btn-apply {
  flex: 1; height: 34px; border-radius: 9px; border: none; cursor: pointer; font-size: 11.5px; font-weight: 700;
  background: var(--ap-blue); color: #fff; display: flex; align-items: center; justify-content: center; gap: 6px;
}
#page-analista_productos .ap-theme-btn-reset {
  height: 34px; padding: 0 12px; border-radius: 9px; border: 1px solid var(--ap-border); cursor: pointer; font-size: 11.5px; font-weight: 600;
  background: transparent; color: var(--ap-text2);
}
#page-analista_productos .ap-theme-panel-footnote { text-align: center; font-size: 9.5px; color: var(--ap-text2); opacity: .7; margin-top: 10px; }

#page-analista_productos #apViewContent { flex: 1; overflow-y: auto; }

/* Estado honesto para funciones que dependen de una fuente de datos que
   todavía no existe — nunca datos falsos, pero tampoco pantalla en blanco. */
#page-analista_productos .ap-pending-sync {
  display: flex; align-items: flex-start; gap: 14px;
  background: rgba(245,158,11,.06); border: 1px solid rgba(245,158,11,.25);
  border-radius: var(--ap-r-sm); padding: 18px 20px; margin-bottom: 24px;
}
#page-analista_productos .ap-pending-sync svg { width: 20px; height: 20px; color: var(--ap-orange); flex-shrink: 0; margin-top: 1px; }
#page-analista_productos .ap-pending-sync-title { font-size: 13.5px; font-weight: 700; margin-bottom: 3px; }
#page-analista_productos .ap-pending-sync-sub { font-size: 12.5px; color: var(--ap-text2); line-height: 1.5; }

@media (max-width: 900px) {
  #page-analista_productos .ap-topbar { padding: 16px 18px; } }

#page-analista_productos .ap-shell {
  width: 96%;
  max-width: 2200px;
  margin: 0 auto;
  padding: 32px 0 80px;
  display: flex;
  flex-direction: column;
  gap: 48px;
  overflow-x: hidden;
}

/* ── Header / buscador ─────────────────────────────────────────── */
#page-analista_productos .ap-header {
  display: flex;
  align-items: center;
  gap: 14px;
}
#page-analista_productos .ap-search-wrap {
  flex: 1;
  position: relative;
  display: flex;
  align-items: center;
}
/* Selector directo (>) a propósito: cualquier otro ícono/botón que se
   agregue dentro de .ap-search-wrap no debe heredar este posicionado
   absoluto, pensado solo para la lupa izquierda. */
#page-analista_productos .ap-search-wrap > svg {
  position: absolute;
  left: 20px;
  width: 18px;
  height: 18px;
  color: var(--ap-text2);
  pointer-events: none;
}
#page-analista_productos .ap-search {
  width: 100%;
  padding: 16px 20px 16px 52px;
  border-radius: 999px;
  border: 1px solid var(--ap-border);
  background: var(--ap-card);
  box-shadow: var(--ap-shadow);
  font-family: inherit;
  font-size: 15px;
  /* !important: este módulo tiene paleta propia (fija, siempre clara) que no
     sigue el tema global de la plataforma — sin esto, la regla global de
     inputs en index.html (que sí depende del tema) pisa el color y el texto
     tipeado queda invisible sobre este fondo claro en los temas oscuros. */
  color: var(--ap-text) !important;
  caret-color: var(--ap-text) !important;
  color-scheme: light;
  transition: box-shadow 180ms var(--ap-ease), border-color 180ms var(--ap-ease);
}
#page-analista_productos .ap-search::placeholder { color: var(--ap-text2) !important; }
#page-analista_productos .ap-search:focus {
  outline: none;
  border-color: rgba(59,130,246,.35);
  box-shadow: 0 0 0 4px rgba(59,130,246,.10), var(--ap-shadow);
}

/* ── Botones ────────────────────────────────────────────────────── */
#page-analista_productos .ap-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 15px 26px;
  border-radius: var(--ap-r-lg);
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform 180ms var(--ap-ease), box-shadow 180ms var(--ap-ease), background 180ms var(--ap-ease);
  white-space: nowrap;
}
#page-analista_productos .ap-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
#page-analista_productos .ap-btn:active { transform: scale(.97); }

#page-analista_productos .ap-btn-primary {
  background: var(--ap-text);
  color: #fff;
  box-shadow: 0 8px 20px rgba(16,24,40,.18);
}
#page-analista_productos .ap-btn-primary:hover {
  box-shadow: 0 14px 32px rgba(16,24,40,.26);
  transform: translateY(-1px);
}

#page-analista_productos .ap-btn-ghost {
  background: var(--ap-card);
  color: var(--ap-text);
  border-color: var(--ap-border);
  box-shadow: var(--ap-shadow);
}
#page-analista_productos .ap-btn-ghost:hover {
  box-shadow: var(--ap-shadow-hov);
  transform: translateY(-1px);
}

/* ── Hero ───────────────────────────────────────────────────────── */
#page-analista_productos .ap-hero {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: 36px;
  align-items: center;
  background: var(--ap-card);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-lg);
  box-shadow: var(--ap-shadow);
  padding: 32px;
}
#page-analista_productos .ap-hero-img-wrap {
  width: 220px;
  height: 220px;
  border-radius: var(--ap-r-lg);
  background: linear-gradient(160deg, #F6F8FB, #ECEFF4);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex-shrink: 0;
}
#page-analista_productos .ap-hero-img-wrap img {
  width: 82%;
  height: 82%;
  object-fit: contain;
  filter: drop-shadow(0 18px 28px rgba(16,24,40,.16));
}
/* Galería: miniaturas debajo de la foto principal — solo aparecen cuando
   el producto tiene más de una foto real persistida (hoy: VTEX). */
#page-analista_productos .ap-hero-media { display: flex; flex-direction: column; gap: 8px; flex-shrink: 0; }
#page-analista_productos .ap-hero-thumbs { display: flex; gap: 6px; width: 180px; flex-wrap: wrap; }
#page-analista_productos .ap-hero-thumb {
  width: 32px; height: 32px; padding: 0; border-radius: 8px; cursor: pointer;
  border: 2px solid var(--ap-border); background: var(--ap-card);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  transition: border-color 150ms var(--ap-ease);
}
#page-analista_productos .ap-hero-thumb img { width: 100%; height: 100%; object-fit: contain; }
#page-analista_productos .ap-hero-thumb:hover { border-color: var(--ap-blue); }
#page-analista_productos .ap-hero-thumb.active { border-color: var(--ap-blue); box-shadow: 0 0 0 2px rgba(59,130,246,.15); }
#page-analista_productos .ap-hero-badges {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 14px;
}
#page-analista_productos .ap-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 13px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .01em;
}
#page-analista_productos .ap-badge-blue   { background: rgba(59,130,246,.10); color: #1d4ed8; }
#page-analista_productos .ap-badge-sku    { background: rgba(102,112,133,.12); color: var(--ap-text2); font-family: ui-monospace, monospace; }

#page-analista_productos .ap-hero-title {
  font-size: 34px;
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -.02em;
  margin-bottom: 12px;
  max-width: 640px;
}
#page-analista_productos .ap-hero-rating {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--ap-text2);
  font-size: 14px;
  font-weight: 500;
  margin-bottom: 22px;
}
#page-analista_productos .ap-hero-rating .ap-stars { color: #F59E0B; letter-spacing: 1px; }

/* ── Secciones ──────────────────────────────────────────────────── */
#page-analista_productos .ap-section { display: flex; flex-direction: column; gap: 20px; }
#page-analista_productos .ap-section-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
#page-analista_productos .ap-section-title {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.015em;
}
#page-analista_productos .ap-section-sub {
  font-size: 13px;
  color: var(--ap-text2);
  font-weight: 500;
}
#page-analista_productos .ap-link-btn {
  background: none;
  border: none;
  color: var(--ap-blue);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
}

/* ── Cards KPI ──────────────────────────────────────────────────── */
#page-analista_productos .ap-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
#page-analista_productos .ap-kpi-card {
  background: var(--ap-card);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-sm);
  box-shadow: var(--ap-shadow);
  padding: 24px;
  height: 128px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: transform 180ms var(--ap-ease), box-shadow 180ms var(--ap-ease);
}
#page-analista_productos .ap-kpi-card:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: var(--ap-shadow-hov);
}

#page-analista_productos .ap-note {
  font-size: 13px; color: var(--ap-text2); line-height: 1.6;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-sm);
  padding: 16px 18px; white-space: pre-line;
}
#page-analista_productos .ap-kpi-icon {
  width: 36px; height: 36px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  color: var(--ap-blue);
  background: rgba(59,130,246,.08);
}
#page-analista_productos .ap-kpi-icon svg { width: 18px; height: 18px; }
#page-analista_productos .ap-kpi-label { font-size: 13px; color: var(--ap-text2); font-weight: 500; }
#page-analista_productos .ap-kpi-value { font-size: 24px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }

/* ── "Productos" — banner tipo Escritorio (saludo/hora/estado), color
   editable por el usuario vía --ap-pf-banner-bg (persistido). ── */
/* Banner más grande — pedido explícito 2026-08-18. */
#page-analista_productos .ap-pf-banner {
  background: var(--ap-pf-banner-bg, #12141c); color: var(--ap-pf-banner-text, #f5f5f5);
  border-radius: var(--ap-r-lg); padding: 36px 40px; margin-bottom: 26px; position: relative;
  overflow: hidden; box-shadow: var(--ap-shadow); min-height: 150px; display: flex; flex-direction: column; justify-content: center;
  transition: min-height .2s var(--ap-ease, ease), padding .2s var(--ap-ease, ease);
}
/* Minimizado — pedido para previsualizar cómo queda, todavía sin decidir
   si se deja así (2026-08-21). Colapsa a una barra angosta con solo el
   badge + botón de expandir; el resto (saludo/subtítulo/reloj) se oculta
   sin desmontarlo, así el toggle es instantáneo y no reinicia el reloj. */
#page-analista_productos .ap-pf-banner-collapsed {
  min-height: 0; padding: 14px 40px;
}
#page-analista_productos .ap-pf-banner-collapsed .ap-pf-banner-top { margin-bottom: 0; }
#page-analista_productos .ap-pf-banner-collapsed .ap-pf-banner-greet,
#page-analista_productos .ap-pf-banner-collapsed .ap-pf-banner-sub,
#page-analista_productos .ap-pf-banner-collapsed .ap-pf-banner-clock {
  display: none;
}
#page-analista_productos .ap-pf-banner-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
#page-analista_productos .ap-pf-banner-actions { display: flex; align-items: center; gap: 10px; }
#page-analista_productos .ap-pf-banner-toggle-btn {
  display: flex; align-items: center; justify-content: center; width: 26px; height: 26px;
  border-radius: 50%; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.06);
  color: inherit; font-size: 13px; line-height: 1; cursor: pointer; opacity: .75; transition: opacity .15s;
}
#page-analista_productos .ap-pf-banner-toggle-btn:hover { opacity: 1; }
#page-analista_productos .ap-pf-banner-badge {
  display: inline-flex; align-items: center; gap: 7px; background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12); border-radius: 20px; padding: 6px 15px;
  font-size: 10.5px; font-weight: 800; letter-spacing: .1em; color: inherit; opacity: .8; width: fit-content;
}
#page-analista_productos .ap-pf-banner-dot {
  width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 8px #22c55e;
  display: inline-block; animation: ap-pf-pulse 2s infinite;
}
@keyframes ap-pf-pulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }
#page-analista_productos .ap-pf-banner-color-lbl {
  display: flex; align-items: center; gap: 4px; font-size: 16px; cursor: pointer; opacity: .7;
  transition: opacity .15s;
}
#page-analista_productos .ap-pf-banner-color-lbl:hover { opacity: 1; }
#page-analista_productos .ap-pf-banner-color-lbl input[type="color"] {
  width: 24px; height: 24px; padding: 0; border: none; border-radius: 6px; cursor: pointer; background: none;
}
#page-analista_productos .ap-pf-banner-greet { font-size: 36px; font-weight: 800; letter-spacing: -.015em; line-height: 1.15; margin-bottom: 8px; }
#page-analista_productos .ap-pf-banner-sub { font-size: 14.5px; opacity: .62; max-width: 560px; margin-bottom: 16px; }
#page-analista_productos .ap-pf-banner-clock { font-family: var(--mono, monospace); font-size: 12.5px; opacity: .5; letter-spacing: .02em; text-transform: capitalize; }

/* ── "Productos" — barra de búsqueda con sugerencias en vivo ──
   Título grande y centrado (pedido explícito 2026-08-22) — solo animación
   de entrada de una sola vez (transform/opacity, GPU) + un float chico y
   liviano en el ícono; nada continuo/pesado que pueda notarse como lag. */
#page-analista_productos .ap-pf-searchbar-intro {
  text-align: center; margin: 4px 0 26px;
  animation: ap-fade-in-up .5s var(--ap-ease) both;
}
#page-analista_productos .ap-pf-searchbar-title {
  display: inline-flex; align-items: center; gap: 12px;
  font-size: 34px; font-weight: 800; letter-spacing: -.02em; line-height: 1.15;
  margin-bottom: 8px;
}
#page-analista_productos .ap-pf-searchbar-title-icon {
  font-size: 30px; display: inline-block;
  animation: ap-pf-title-icon-float 3.2s ease-in-out infinite;
}
#page-analista_productos .ap-pf-searchbar-title-text {
  background: linear-gradient(135deg, var(--ap-blue), var(--ap-green));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
@keyframes ap-pf-title-icon-float { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-5px) rotate(-6deg); } }
@media (prefers-reduced-motion: reduce) {
  #page-analista_productos .ap-pf-searchbar-intro { animation: none; }
  #page-analista_productos .ap-pf-searchbar-title-icon { animation: none; } }
#page-analista_productos .ap-pf-searchbar-sub { font-size: 14px; color: var(--ap-text2); max-width: 520px; margin: 0 auto; }
#page-analista_productos .ap-pf-searchbar { display: flex; gap: 10px; margin-bottom: 22px; align-items: stretch; }
#page-analista_productos .ap-pf-searchbar-input-wrap { position: relative; flex: 1; min-width: 0; }
#page-analista_productos .ap-pf-searchbar-input {
  width: 100%; box-sizing: border-box; padding: 13px 18px; border-radius: 14px;
  border: 1px solid color-mix(in srgb, var(--ap-border) 70%, transparent);
  background: color-mix(in srgb, var(--ap-card) 85%, transparent);
  backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%);
  color: var(--ap-text); font-size: 13.5px; outline: none; transition: border-color .15s, box-shadow .15s, background .15s;
}
#page-analista_productos .ap-pf-searchbar-input:focus {
  border-color: var(--ap-blue); background: var(--ap-card);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--ap-blue) 16%, transparent);
}
#page-analista_productos .ap-pf-searchbar-btn { padding: 0 24px; border-radius: 14px; font-size: 13px; font-weight: 600; display: flex; align-items: center; gap: 7px; }
#page-analista_productos .ap-pf-searchbar-btn svg { width: 15px; height: 15px; }
#page-analista_productos .ap-pf-searchbar-provsel {
  padding: 0 16px; border-radius: 14px; border: 1px solid color-mix(in srgb, var(--ap-border) 70%, transparent);
  background: color-mix(in srgb, var(--ap-card) 85%, transparent);
  backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%);
  color: var(--ap-text); font-size: 12.5px; font-weight: 600; cursor: pointer; max-width: 220px;
  transition: border-color .15s, background .15s;
}
#page-analista_productos .ap-pf-searchbar-provsel:hover { background: var(--ap-card); }
#page-analista_productos .ap-pf-suggest {
  display: none; position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 20;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: 12px;
  box-shadow: var(--ap-shadow-hov); max-height: 320px; overflow-y: auto; padding: 6px;
}
#page-analista_productos .ap-pf-suggest-item {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 9px 10px; border-radius: 8px; cursor: pointer; transition: background .12s;
}
#page-analista_productos .ap-pf-suggest-item:hover { background: rgba(99,102,241,.1); }
#page-analista_productos .ap-pf-suggest-title { font-size: 12.5px; font-weight: 600; color: var(--ap-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#page-analista_productos .ap-pf-suggest-prov { font-size: 10.5px; color: var(--ap-text2); flex-shrink: 0; }

/* ── "Productos" — mega-nav estilo Apple (pill flotante con glass +
   blur, flyout que se abre al pasar el mouse, opciones como links
   subrayados — sin checkboxes) + panel de filtros lateral + grilla ── */
/* Contenedor dentro de otro: la barra (Categorías/Marcas/Proveedores)
   vive dentro de una franja propia, centrada respecto al ancho de los
   resultados de abajo — no un pill flotando suelto a la izquierda. */
#page-analista_productos .ap-pf-meganav-wrap {
  /* Grid de 3 columnas simétricas (spacer vacío / menú / acciones) — el
     mismo truco que ya se usa en el Cotizador para centrar de verdad: con
     flex+space-between el menú queda pegado a la izquierda de lo que le
     sobra a "Filtros avanzados", nunca centrado respecto del ancho total.
     Pedido explícito 2026-08-20: "menú centrado estético". Pedido
     explícito 2026-08-21: subirlo arriba de todo (antes del buscador) y
     darle más jerarquía visual — más padding + sombra propia para que
     se lea como la barra principal de navegación de la pantalla, no
     como un detalle secundario debajo del buscador. */
  position: relative; margin-bottom: 22px;
  display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px;
  padding: 26px 20px; background: var(--ap-card); border: 1px solid var(--ap-border);
  box-shadow: var(--ap-shadow);
}
#page-analista_productos .ap-pf-meganav-spacer { min-width: 0; }
#page-analista_productos .ap-pf-meganav-actions { display: flex; align-items: center; justify-content: flex-end; gap: 16px; }
#page-analista_productos .ap-pf-meganav {
  /* Pedido explícito 2026-08-20: sacarle la apariencia de botones/pill
     (antes glass con blur/borde/sombra) — ahora es "solo menú de letras",
     sin fondo ni contorno, apoyado en tipografía + subrayado. Pedido
     explícito 2026-08-21: más jerarquía — letra más grande y más peso. */
  display: inline-flex; align-items: center; gap: 40px;
}
#page-analista_productos .ap-pf-meganav-btn {
  display: inline-flex; align-items: center; padding: 4px 1px; border-radius: 0;
  background: none; border: none; position: relative;
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  color: var(--ap-text2); font-size: 16.5px; font-weight: 800; letter-spacing: .01em;
  cursor: pointer; transition: color 160ms var(--ap-ease);
}
#page-analista_productos .ap-pf-meganav-btn::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -8px; height: 2px;
  background: currentColor; transform: scaleX(0); transform-origin: center;
  transition: transform 200ms var(--ap-ease);
}
#page-analista_productos .ap-pf-meganav-btn:hover { color: var(--ap-text); }
#page-analista_productos .ap-pf-meganav-btn:hover::after,
#page-analista_productos .ap-pf-meganav-btn.active::after { transform: scaleX(1); }
#page-analista_productos .ap-pf-meganav-btn.active { color: var(--ap-text); }
/* Filtro con algo seleccionado — a diferencia de .active (solo mientras el
   panel está abierto/con el mouse encima), esto queda fijo pase lo que
   pase, para que de un vistazo se sepa qué filtros están aplicados. Antes
   solo existía para Precio (rellenaba con fondo ámbar); ahora es el mismo
   tratamiento — color + subrayado — para las 5 opciones. */
#page-analista_productos .ap-pf-meganav-btn-filled { color: var(--ap-blue); }
#page-analista_productos .ap-pf-meganav-btn-filled::after { background: var(--ap-blue); transform: scaleX(1); }

#page-analista_productos .ap-pf-meganav-panel {
  /* Cuadrado — pedido explícito 2026-08-18 (antes 20px de radio), aplica
     a todos los desplegables (Categorías/Marcas/Proveedores/Países/Precio,
     misma clase compartida). */
  position: absolute; top: calc(100% + 10px); left: 0; right: 0; z-index: 60;
  padding: 24px 32px;
  /* Fondo con degradé sutil + filo superior — pedido explícito 2026-08-20
     ("una tipografía que le dé sofisticación a la pantalla, lo mismo con
     el fondo") en vez del glass plano de un solo tono que tenía antes. */
  background: linear-gradient(165deg, color-mix(in srgb, var(--ap-card) 97%, transparent) 0%, color-mix(in srgb, var(--ap-card) 84%, transparent) 100%);
  backdrop-filter: blur(28px) saturate(180%); -webkit-backdrop-filter: blur(28px) saturate(180%);
  border: 1px solid color-mix(in srgb, var(--ap-border) 65%, transparent);
  border-radius: 0;
  box-shadow: 0 24px 60px -16px rgba(0,0,0,.4), 0 2px 10px rgba(0,0,0,.1), inset 0 1px 0 color-mix(in srgb, #fff 10%, transparent);
  max-height: 60vh; overflow-y: auto;
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-8px) scale(.98);
  transition: opacity 180ms var(--ap-ease), transform 180ms var(--ap-ease), visibility 180ms;
}
#page-analista_productos .ap-pf-meganav-panel.open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0) scale(1); }
/* Proveedores: pocas opciones reales (identidades de negocio, no un
   vocabulario grande como categorías/marcas) — abre angosto, anclado
   bajo su propio botón, en una sola columna hacia abajo, en vez de la
   franja de ancho completo que usan Categorías/Marcas. */
#page-analista_productos .ap-pf-meganav-panel-compact { min-width: 260px; max-width: 340px; }

/* Países — preview informativo de dónde opera Mercado Libre, no un
   filtro real todavía (los productos del catálogo no tienen país de
   destino, eso es propiedad de la publicación). Solo Argentina está
   activa; el resto queda deshabilitado y marcado "Próximamente". */
#page-analista_productos .ap-pf-meganav-panel-countries { min-width: 420px; max-width: 480px; }
#page-analista_productos .ap-pf-meganav-countries { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
#page-analista_productos .ap-pf-meganav-countries .ap-pf-meganav-provbtn { justify-content: space-between; }
#page-analista_productos .ap-pf-meganav-country-live { border-color: color-mix(in srgb, #16a34a 50%, var(--ap-border)); }
#page-analista_productos .ap-pf-meganav-country-soon { opacity: .5; pointer-events: none; }
#page-analista_productos .ap-pf-meganav-country-tag {
  font-style: normal; font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .03em;
  padding: 2px 7px; border-radius: 20px; color: #16a34a; background: rgba(22,163,74,.14);
}
#page-analista_productos .ap-pf-meganav-country-tag-soon { color: var(--ap-text2); background: color-mix(in srgb, var(--ap-text2) 14%, transparent); }
#page-analista_productos .ap-pf-meganav-hdr {
  display: flex; align-items: center; justify-content: space-between;
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-size: 11.5px; font-weight: 800; color: var(--ap-text2); text-transform: uppercase; letter-spacing: .06em;
  padding-bottom: 10px; margin-bottom: 12px; border-bottom: 1px solid color-mix(in srgb, var(--ap-border) 70%, transparent);
}
/* Buscador de Marcas/Categorías — filtra la grilla de abajo en el lugar
   (sin overlay flotante aparte: pedido explícito 2026-08-20, el overlay
   quedaba tapando la grilla ya filtrada y pedía scrollear de más en vez
   de menos). */
#page-analista_productos .ap-pf-meganav-search-wrap { position: relative; margin-bottom: 16px; }
#page-analista_productos .ap-pf-meganav-search {
  width: 100%; box-sizing: border-box; padding: 10px 14px; border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--ap-border) 70%, transparent);
  background: color-mix(in srgb, var(--ap-bg) 65%, transparent);
  color: var(--ap-text); font-family: 'Plus Jakarta Sans', 'Inter', sans-serif; font-size: 13px;
  outline: none; transition: border-color .15s, box-shadow .15s, background .15s;
}
#page-analista_productos .ap-pf-meganav-search::placeholder { color: var(--ap-text2); }
#page-analista_productos .ap-pf-meganav-search:focus {
  border-color: var(--ap-blue); background: var(--ap-bg);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ap-blue) 14%, transparent);
}
#page-analista_productos .ap-pf-meganav-x {
  background: none; border: none; color: var(--ap-text2); font-size: 13px; cursor: pointer;
  width: 22px; height: 22px; border-radius: 999px; display: flex; align-items: center; justify-content: center;
  transition: background 120ms var(--ap-ease), color 120ms var(--ap-ease);
}
#page-analista_productos .ap-pf-meganav-x:hover { background: color-mix(in srgb, var(--ap-text) 10%, transparent); color: var(--ap-text); }
#page-analista_productos .ap-pf-meganav-grid { columns: 190px; column-gap: 22px; }
/* Proveedores (panel angosto, pocas opciones reales) — misma estructura
   de etiqueta subrayada que Categorías, en una sola columna. */
#page-analista_productos .ap-pf-meganav-grid-compact { columns: 1; }
#page-analista_productos .ap-pf-meganav-link {
  display: block; width: 100%; break-inside: avoid; text-align: left;
  background: none; border: none; padding: 6px 4px; margin: 0;
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-size: 13px; font-weight: 500; letter-spacing: .01em; color: var(--ap-text2); cursor: pointer;
  transition: color 120ms var(--ap-ease);
}
#page-analista_productos .ap-pf-meganav-link:hover { color: var(--ap-text); text-decoration: underline; text-underline-offset: 3px; }
#page-analista_productos .ap-pf-meganav-link.active { color: var(--ap-blue); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
/* Marcas viene con el dato real en MAYÚSCULA (así lo carga cada
   proveedor) — pedido explícito 2026-08-20: se ve "agresivo", mostrar en
   minúscula acá (solo visual, el dato real no se toca en ningún otro
   lado). */
#page-analista_productos .ap-pf-meganav-grid-lowercase .ap-pf-meganav-link { text-transform: lowercase; }
#page-analista_productos .ap-pf-meganav-empty { font-size: 12.5px; color: var(--ap-text2); padding: 10px 0; }
#page-analista_productos .ap-pf-meganav-provbtn {
  display: flex; align-items: center; gap: 8px; padding: 12px 16px; width: 100%;
  background: var(--ap-bg); border: 1.5px solid var(--ap-border); border-radius: 0;
  color: var(--ap-text); font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap;
  transition: border-color 150ms var(--ap-ease), background 150ms var(--ap-ease), color 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-meganav-provbtn:hover { border-color: var(--ap-blue); background: color-mix(in srgb, var(--ap-blue) 8%, var(--ap-bg)); }
#page-analista_productos .ap-pf-meganav-provbtn.active { border-color: var(--ap-blue); background: var(--ap-blue); color: #fff; }

/* Filtro de precio — histograma real (cuenta productos por franja de
   precio de venta sugerido) + rango editable + orden por ticket alto/
   bajo. Pedido explícito para priorizar publicar lo de mayor precio. */
#page-analista_productos .ap-pf-meganav-panel-price { min-width: 340px; max-width: 380px; }
#page-analista_productos .ap-pf-price-sort { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
#page-analista_productos .ap-pf-price-histogram {
  display: flex; align-items: flex-end; gap: 3px; height: 72px; margin-bottom: 10px;
  padding: 0 2px; border-bottom: 1.5px solid var(--ap-border);
}
#page-analista_productos .ap-pf-price-bar {
  flex: 1; min-width: 4px; border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, #FFE600, #f5c400);
  transition: opacity 120ms var(--ap-ease);
}
#page-analista_productos .ap-pf-price-bar:hover { opacity: .7; }
#page-analista_productos .ap-pf-price-range { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px; margin-top: 12px; }
#page-analista_productos .ap-pf-price-range label { display: flex; flex-direction: column; gap: 4px; font-size: 10.5px; font-weight: 700; color: var(--ap-text2); text-transform: uppercase; letter-spacing: .03em; }
#page-analista_productos .ap-pf-price-range input {
  width: 110px; background: var(--ap-bg); border: 1.5px solid var(--ap-border); border-radius: 0;
  color: var(--ap-text); font-size: 13px; font-weight: 700; padding: 8px 10px;
}
/* Panel de filtros — flotante, estética tipo catálogo Apple (pedido
   explícito 2026-08-18): oculto por defecto, se abre con el botón
   "Filtros" pegado al buscador, desliza desde la izquierda con fondo
   difuminado detrás, esquinas redondeadas y sombra suave. Los resultados
   ya no le reservan una columna fija — usan todo el ancho. */
#page-analista_productos .ap-pf-layout { display: block; }
#page-analista_productos .ap-pf-filters-toggle {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 0;
  padding: 10px 18px; font-size: 13px; font-weight: 700; color: var(--ap-text); cursor: pointer;
  transition: border-color 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-filters-toggle:hover { border-color: var(--ap-blue); }
/* "Limpiar filtros" — label subrayado en rojo, pedido explícito 2026-08-18. */
#page-analista_productos .ap-pf-meganav-clear {
  background: none; border: none; padding: 0; cursor: pointer;
  font-size: 12.5px; font-weight: 700; color: #ef4444; text-decoration: underline; text-underline-offset: 3px;
}
#page-analista_productos .ap-pf-meganav-clear:hover { color: #dc2626; }
#page-analista_productos .ap-pf-filters-toggle svg { width: 15px; height: 15px; }
#page-analista_productos .ap-pf-filters-toggle-count {
  background: var(--ap-blue); color: #fff; font-size: 10.5px; font-weight: 800;
  min-width: 18px; height: 18px; border-radius: 999px; display: flex; align-items: center; justify-content: center; padding: 0 5px;
}
#page-analista_productos .ap-pf-sidebar-backdrop {
  /* absolute (no fixed) — ver comentario en .ap-app: así queda contenido
     adentro del módulo, sin taparse con el riel/topbar de afuera. */
  position: absolute; inset: 0; z-index: 70; background: rgba(0,0,0,.4);
  backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px);
  opacity: 0; pointer-events: none; transition: opacity 220ms var(--ap-ease);
}
#page-analista_productos .ap-pf-sidebar-backdrop.ap-pf-sidebar-open { opacity: 1; pointer-events: auto; }
#page-analista_productos .ap-pf-sidebar {
  /* ~7cm de ancho, pedido explícito 2026-08-18 (antes 380px, muy ancho). */
  position: absolute; z-index: 75; top: 16px; bottom: 16px; left: 16px; width: 265px; max-width: calc(100% - 32px);
  background: color-mix(in srgb, var(--ap-card) 92%, transparent);
  backdrop-filter: blur(24px) saturate(180%); -webkit-backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid var(--ap-border); border-radius: 22px;
  padding: 20px; overflow-y: auto;
  box-shadow: 0 30px 80px -20px rgba(0,0,0,.5);
  transform: translateX(-120%); opacity: 0;
  transition: transform 260ms var(--ap-ease), opacity 220ms var(--ap-ease);
}
#page-analista_productos .ap-pf-sidebar.ap-pf-sidebar-open { transform: translateX(0); opacity: 1; }

/* Flecha "manija" al centro de alto del panel — pedido explícito
   2026-08-18: cerrar el panel (y su difuminado) sin tener que buscar la
   X arriba. Pegada al borde derecho del panel, sobresale un poco. */
#page-analista_productos .ap-pf-sidebar-handle {
  position: absolute; top: 50%; right: -14px; transform: translateY(-50%);
  width: 28px; height: 56px; border-radius: 0 14px 14px 0; z-index: 76;
  background: color-mix(in srgb, var(--ap-card) 92%, transparent);
  backdrop-filter: blur(24px) saturate(180%); -webkit-backdrop-filter: blur(24px) saturate(180%);
  border: 1px solid var(--ap-border); border-left: none;
  color: var(--ap-text2); cursor: pointer; display: flex; align-items: center; justify-content: center;
  box-shadow: 4px 0 14px -4px rgba(0,0,0,.3);
  transition: color 150ms var(--ap-ease), width 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-sidebar-handle:hover { color: var(--ap-blue); width: 32px; }
#page-analista_productos .ap-pf-sidebar-handle svg { width: 14px; height: 14px; transform: rotate(90deg); }
#page-analista_productos .ap-pf-sidebar-hdr {
  display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 16px;
  font-size: 13px; font-weight: 800; color: var(--ap-text);
}
#page-analista_productos .ap-pf-sidebar-close {
  width: 30px; height: 30px; border-radius: 50%; border: none; background: var(--ap-bg); color: var(--ap-text2);
  font-size: 15px; cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background 120ms var(--ap-ease), color 120ms var(--ap-ease);
}
#page-analista_productos .ap-pf-sidebar-close:hover { background: rgba(239,68,68,.12); color: #ef4444; }
#page-analista_productos .ap-pf-clear {
  background: rgba(239,68,68,.1); border: 1px solid rgba(239,68,68,.25); color: #ef4444;
  font-size: 10.5px; font-weight: 700; cursor: pointer; padding: 4px 8px; border-radius: 20px; text-align: left;
}
#page-analista_productos .ap-pf-clear:hover { background: rgba(239,68,68,.18); }

/* Cada grupo de filtro tiene su propio color de acento — hace que la
   cascada Proveedor -> Rubro/Marca/Variante sea visualmente intuitiva
   en vez de un bloque monocromo de checkboxes indistinguibles. */
#page-analista_productos .ap-pf-group-proveedor { --ap-pf-accent: #8b5cf6; }
#page-analista_productos .ap-pf-group-categoria { --ap-pf-accent: #2563eb; }
#page-analista_productos .ap-pf-group-marca     { --ap-pf-accent: #f59e0b; }
#page-analista_productos .ap-pf-group-variante  { --ap-pf-accent: #0d9488; }

#page-analista_productos .ap-pf-group { border-top: 1px solid var(--ap-border); padding: 10px 0; }
#page-analista_productos .ap-pf-group:first-of-type { border-top: none; }
#page-analista_productos .ap-pf-group-hdr {
  width: 100%; display: flex; align-items: center; justify-content: space-between; background: none;
  border: none; border-left: 3px solid var(--ap-pf-accent, var(--ap-border)); border-radius: 4px;
  cursor: pointer; font-size: 12px; font-weight: 800; color: var(--ap-text); padding: 4px 0 4px 8px;
  transition: background 120ms var(--ap-ease);
}
#page-analista_productos .ap-pf-group-hdr:hover { background: color-mix(in srgb, var(--ap-pf-accent, #888) 8%, transparent); }
#page-analista_productos .ap-pf-group-hdr em {
  font-style: normal; margin-left: 6px; padding: 1px 7px; border-radius: 20px; font-size: 10.5px; font-weight: 800;
  color: var(--ap-pf-accent); background: color-mix(in srgb, var(--ap-pf-accent) 16%, transparent);
}
#page-analista_productos .ap-pf-chevron { width: 16px; height: 16px; color: var(--ap-pf-accent, var(--ap-text2)); transition: transform 150ms var(--ap-ease); }
#page-analista_productos .ap-pf-chevron.open { transform: rotate(180deg); }
/* Una sola columna — pedido explícito 2026-08-18 (antes 2 columnas, con
   el panel angosto de ~7cm quedaba apretado). */
#page-analista_productos .ap-pf-group-body { column-count: 1; margin-top: 8px; max-height: 340px; overflow-y: auto; padding-right: 4px; }
#page-analista_productos .ap-pf-group-body > * { margin-bottom: 6px; }
/* Rubro viene agrupado por proveedor (ver comentario en apPfFilterGroupHtml). */
#page-analista_productos .ap-pf-subgroup { margin-bottom: 4px; }
#page-analista_productos .ap-pf-search {
  padding: 6px 10px; font-size: 11px; border-radius: 8px; border: 1px solid var(--ap-border);
  background: var(--ap-bg); color: var(--ap-text); margin-bottom: 2px; outline: none; transition: border-color .15s;
}
#page-analista_productos .ap-pf-search:focus { border-color: var(--ap-pf-accent, var(--ap-blue)); }
#page-analista_productos .ap-pf-search::placeholder { color: var(--ap-text2); }
#page-analista_productos .ap-pf-subgroup { display: flex; flex-direction: column; gap: 4px; }
#page-analista_productos .ap-pf-subgroup + .ap-pf-subgroup { margin-top: 6px; padding-top: 8px; border-top: 1px dashed var(--ap-border); }
#page-analista_productos .ap-pf-subgroup-hdr {
  font-size: 9.5px; font-weight: 800; letter-spacing: .03em; text-transform: uppercase;
  color: var(--ap-pf-accent, var(--ap-text2)); opacity: .85; padding: 0 2px 2px;
}
#page-analista_productos .ap-pf-opt { display: flex; align-items: center; gap: 7px; font-size: 11.5px; color: var(--ap-text2); cursor: pointer; padding: 3px 6px; border-radius: 6px; transition: background 120ms var(--ap-ease), color 120ms var(--ap-ease); }
#page-analista_productos .ap-pf-opt:hover { background: color-mix(in srgb, var(--ap-pf-accent, #888) 8%, transparent); }
#page-analista_productos .ap-pf-opt:has(input:checked) { color: var(--ap-pf-accent); font-weight: 700; background: color-mix(in srgb, var(--ap-pf-accent) 10%, transparent); }
#page-analista_productos .ap-pf-opt input { width: 13px; height: 13px; flex-shrink: 0; cursor: pointer; accent-color: var(--ap-pf-accent, var(--ap-blue)); }
#page-analista_productos .ap-pf-opt-all { font-weight: 700; color: var(--ap-text); border-bottom: 1px solid var(--ap-border); padding-bottom: 6px; margin-bottom: 2px; }

/* Tarjetas ~8cm de ancho fijo (no estirado — auto-fill con track fijo,
   no minmax(...,1fr), para que no se agranden solas al haber lugar de
   sobra en la fila) × 18cm de alto: la imagen (10cm) + sus márgenes ya
   ocupan ~10.6cm, y el pie ahora muestra bastante más (sku/proveedor,
   título, categoría, badge de stock, desglose de costo completo) — se
   agrandó el alto para que TODO entre sin scroll y el botón de publicar
   quede al ras del pie de página (ver .ap-pf-publish-flush, ahora
   afuera de .ap-pf-foot para no competir por su padding). Reusada TANTO
   por "Productos" (data-pf-card) como por "Publicaciones" (data-
   listing-card), mismo tamaño en los dos módulos. */
#page-analista_productos .ap-pf-grid { display: grid; grid-template-columns: repeat(auto-fill, 8.5cm); justify-content: start; gap: 18px; }
#page-analista_productos .ap-pf-card {
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: 0;
  height: 18cm; display: flex; flex-direction: column; overflow: hidden; box-shadow: var(--ap-shadow); cursor: pointer;
  transition: transform 150ms var(--ap-ease), box-shadow 150ms var(--ap-ease); position: relative;
}
#page-analista_productos .ap-pf-card:hover { transform: translateY(-3px); box-shadow: var(--ap-shadow-hov); }
#page-analista_productos .ap-pf-card[data-listing-card] { cursor: default; }
#page-analista_productos .ap-pf-card[data-listing-card]:hover { transform: none; box-shadow: var(--ap-shadow); }
#page-analista_productos .ap-pf-img {
  height: 10cm; flex-shrink: 0; position: relative; display: flex; align-items: center; justify-content: center;
  background: var(--ap-bg); margin: 3mm; border-radius: 0; overflow: hidden;
}
/* object-fit: cover recorta manteniendo proporción real (nunca "fill",
   que estiraría/distorsionaría la imagen) — centrada por object-position. */
#page-analista_productos .ap-pf-img img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
#page-analista_productos .ap-pf-noimg { font-size: 28px; opacity: .4; }

/* Subir/cambiar/eliminar foto — overlay que aparece al pasar el mouse
   sobre la imagen, no ocupa espacio fijo en la tarjeta. */
#page-analista_productos .ap-pf-img-actions {
  position: absolute; top: 6px; right: 6px; display: flex; gap: 5px;
  opacity: 0; transition: opacity 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-img:hover .ap-pf-img-actions { opacity: 1; }
#page-analista_productos .ap-pf-img-btn {
  width: 28px; height: 28px; border-radius: 50%; border: none; background: rgba(15,23,42,.6);
  color: #fff; font-size: 13px; cursor: pointer; display: flex; align-items: center; justify-content: center;
  transition: background 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-img-btn:hover { background: rgba(15,23,42,.85); }
#page-analista_productos .ap-pf-img-btn-del:hover { background: var(--ap-red); }

#page-analista_productos .ap-pf-foot {
  /* gap subido de 6px a 10px — pedido explícito 2026-08-19: el título
     quedaba visualmente pegado a la categoría de abajo ("se acopla"),
     sin aire entre renglones. */
  flex: 1; min-height: 0; display: flex; flex-direction: column; align-items: center; gap: 10px;
  padding: 8px 14px 10px; overflow: hidden auto; text-align: center;
}
#page-analista_productos .ap-pf-sku-row { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; width: 100%; text-align: left; }
/* SKU: pedido explícito "color más visible y tamaño un poco más
   grande" — antes gris apagado 10px, ahora acento propio 13px. */
#page-analista_productos .ap-pf-sku { font-size: 13px; color: #4f46e5; font-weight: 800; }
#page-analista_productos .ap-pf-prov { font-size: 9px; color: var(--ap-text2); opacity: .8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 90px; }
/* line-height explícito (antes heredaba el normal del navegador, muy
   ajustado para descendentes como "p"/"g") + padding-bottom propio para
   separarlo de la categoría de abajo sin depender solo del gap del
   contenedor padre. */
#page-analista_productos .ap-pf-title { font-size: 12px; font-weight: 700; line-height: 1.5; color: var(--ap-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; padding-bottom: 1px; }
#page-analista_productos .ap-pf-cat { font-size: 10px; color: var(--ap-blue); }

/* Badge de stock real del proveedor — "en un sector" visible propio,
   no mezclado con el resto del texto. Pedido explícito 2026-08-19:
   relleno sólido y fuerte (no un tinte suave) — sin stock/stock bajo
   (≤2, mismo umbral LOW_STOCK_THRESHOLD que el backend) en rojo sólido,
   más de 2 en verde sólido bien marcado. */
#page-analista_productos .ap-pf-badge-row { display: flex; gap: 6px; flex-wrap: wrap; justify-content: center; width: 100%; }
#page-analista_productos .ap-pf-stock-badge {
  display: inline-flex; align-items: center; font-size: 9.5px; font-weight: 800; border-radius: 20px; padding: 3px 9px;
}
#page-analista_productos .ap-pf-stock-ok      { background: #16a34a; color: #fff; }
#page-analista_productos .ap-pf-stock-low     { background: rgba(245,158,11,.16); color: #b45309; }
#page-analista_productos .ap-pf-stock-out     { background: #dc2626; color: #fff; }
#page-analista_productos .ap-pf-stock-unknown { background: rgba(148,163,184,.16); color: var(--ap-text2); }

/* Badge de "Ganancia neta" al pie de la card — pedido explícito
   31/08/2026: resumen a simple vista, sin tener que abrir/leer el bloque
   de costo detallado. Mismo lenguaje visual que el badge de stock
   (pastilla sólida) — verde con ganancia real, rojo si da negativo. */
#page-analista_productos .ap-pf-ganancia-badge {
  display: flex; align-items: center; justify-content: center; gap: 5px;
  font-size: 11px; font-weight: 800; border-radius: 20px; padding: 5px 10px; margin: 4px 0 2px; width: 100%; box-sizing: border-box;
}
#page-analista_productos .ap-pf-ganancia-badge.positive { background: #16a34a; color: #fff; }
#page-analista_productos .ap-pf-ganancia-badge.negative { background: #dc2626; color: #fff; }

/* Badge "No publicado" — pedido explícito 31/08/2026: antes la fila de
   arriba quedaba vacía cuando el producto nunca se intentó publicar, así
   que no había forma de distinguir a simple vista "todavía no publiqué
   esto" de "esto no tiene datos" — ahora siempre hay un badge arriba.
   Mismo lenguaje visual rectangular que "Discontinuado para ML" (gris
   neutro, sin urgencia — a diferencia de "Revisar para ML"/"Infringe
   políticas", acá no hay nada que arreglar, solo informa el estado). */
#page-analista_productos .ap-pf-ml-badge-unpublished {
  height: 26px; padding: 0 10px; border-radius: 4px; background: #475569; color: #e2e8f0;
  display: flex; align-items: center; gap: 6px;
}
#page-analista_productos .ap-pf-ml-badge-unpublished .ap-pf-ml-badge-label { font-size: 10px; opacity: 1; text-transform: none; letter-spacing: 0; }

/* Badge de estado real en Mercado Libre — pedido explícito 2026-08-18:
   amarillo de marca ML cuando está publicado de verdad, rojo bien
   notorio cuando necesita revisión (falló al publicar o ML lo dejó en
   revisión por título/talle/categoría/etc — el motivo real se consulta
   al clickear, ver apPfOpenMlStatusPopover). Centrado horizontalmente y
   apoyado sobre el borde superior de la imagen, DENTRO de los límites
   de la card — antes sobresalía -12px por arriba del borde de la card
   (que tiene overflow:hidden), así que la mitad de la insignia quedaba
   recortada y a la vez pisaba la fila de arriba en la grilla (pedido
   explícito 2026-08-19: centrado, entero, sin superponerse con las
   cards vecinas). */
/* Fila que agrupa el badge "Publicado en ML" original + los badges de
   variantes duplicadas (cuotas sin interés / envío sin interés) —
   pedido explícito 2026-08-21: la publicación original nunca se
   reemplaza, los badges de variantes se muestran AL LADO, nunca en su
   lugar, así que ya no puede haber un solo badge centrado — ahora es
   una fila de hasta 3 que se centra como grupo. */
#page-analista_productos .ap-pf-ml-badges-row {
  position: absolute; top: 10px; left: 50%; right: auto; z-index: 3;
  transform: translateX(-50%);
  display: flex; align-items: flex-start; gap: 8px;
}
#page-analista_productos .ap-pf-ml-badge {
  border: none; cursor: pointer; text-decoration: none;
  box-shadow: 0 3px 10px rgba(0,0,0,.28), 0 0 0 3px var(--ap-card);
  transition: transform 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-ml-badge:hover { transform: scale(1.06) translateY(-1px); }

#page-analista_productos .ap-pf-ml-badge-live {
  width: 66px; height: 66px; border-radius: 50%; background: #FFE600; color: #1a1a1a;
  display: flex; align-items: center; justify-content: center; gap: 4px; flex-direction: column;
}
/* Variantes (cuotas sin interés / envío sin interés) — mismo lenguaje
   de marca (amarillo ML) que el badge original, un poco más chico para
   que se note que son publicaciones secundarias/derivadas de la
   original, nunca la publicación principal. */
#page-analista_productos .ap-pf-ml-badge-variant.ap-pf-ml-badge-live {
  width: 58px; height: 58px;
}
#page-analista_productos .ap-pf-ml-badge-variant .ap-pf-ml-badge-label { font-size: 7.5px; line-height: 1.2; }
#page-analista_productos .ap-pf-ml-badge-logo {
  font-size: 10px; font-weight: 900; letter-spacing: -.02em; background: #2D3277; color: #FFE600;
  padding: 1px 5px; border-radius: 4px; line-height: 1.3;
}
#page-analista_productos .ap-pf-ml-badge-text { display: flex; flex-direction: column; align-items: center; gap: 0; }
#page-analista_productos .ap-pf-ml-badge-label { font-size: 8px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; opacity: .8; line-height: 1.3; }
#page-analista_productos .ap-pf-ml-badge-price { font-size: 10px; font-weight: 900; line-height: 1.15; text-align: center; }

#page-analista_productos .ap-pf-ml-badge-alert {
  height: 30px; padding: 0 12px; border-radius: 20px; background: #dc2626; color: #fff;
  display: flex; align-items: center; gap: 6px;
  animation: ap-pf-alert-pulse 1.8s infinite;
}
#page-analista_productos .ap-pf-ml-badge-alert .ap-pf-ml-badge-alert-icon { font-size: 13px; }
#page-analista_productos .ap-pf-ml-badge-alert .ap-pf-ml-badge-label { font-size: 10px; opacity: 1; text-transform: none; letter-spacing: 0; }
@keyframes ap-pf-alert-pulse {
  0%, 100% { box-shadow: 0 3px 10px rgba(220,38,38,.4), 0 0 0 3px var(--ap-card); }
  50%      { box-shadow: 0 3px 14px rgba(220,38,38,.7), 0 0 0 3px var(--ap-card); }
}

/* "Revisar para ML" — pedido explícito 2026-08-19: distinto de
   ap-pf-ml-badge-alert a propósito. Ese es redondo/pill y quiere decir
   "ML lo está procesando, el pipeline automático lo sigue"; este es
   RECTANGULAR (sin pulso, sin animación) y quiere decir "nuestro
   intento de publicar falló solo, hace falta que una persona lo mire" —
   forma distinta para que la diferencia se note de un vistazo en la
   grilla sin tener que leer el texto. */
#page-analista_productos .ap-pf-ml-badge-needs-review {
  height: 26px; padding: 0 10px; border-radius: 4px; background: #b45309; color: #fff;
  display: flex; align-items: center; gap: 6px;
}
#page-analista_productos .ap-pf-ml-badge-needs-review .ap-pf-ml-badge-label { font-size: 10px; opacity: 1; text-transform: none; letter-spacing: 0; }

/* "Discontinuado para ML" — pedido explícito 2026-08-19: gris neutro a
   propósito, NO rojo/ámbar como los de arriba — esos dos dicen "hay que
   hacer algo", este dice "decisión ya tomada, no hay nada para
   arreglar" (marca/categoría restringida — vapers, Adidas, squishy,
   etc.). También rectangular, mismo lenguaje visual que "Revisar para
   ML" pero sin el color de alerta. */
#page-analista_productos .ap-pf-ml-badge-discontinued {
  height: 26px; padding: 0 10px; border-radius: 4px; background: #475569; color: #e2e8f0;
  display: flex; align-items: center; gap: 6px;
}
#page-analista_productos .ap-pf-ml-badge-discontinued .ap-pf-ml-badge-label { font-size: 10px; opacity: 1; text-transform: none; letter-spacing: 0; }

/* "Infringe políticas ML" — pedido explícito 29/08/2026: detección
   PROACTIVA por título (personaje con licencia/marca real conocida,
   ver brandRiskDetector.js) — no espera a que ML rechace un intento de
   publicar, avisa antes. Rojo oscuro/serio (mismo tono que un rechazo
   real confirmado) pero SIN el pulso de ap-pf-ml-badge-alert (esa
   animación ya significa otra cosa: "ML procesando"). */
#page-analista_productos .ap-pf-ml-badge-risk {
  height: 26px; padding: 0 10px; border-radius: 4px; background: #991b1b; color: #fff;
  display: flex; align-items: center; gap: 6px;
}
#page-analista_productos .ap-pf-ml-badge-risk .ap-pf-ml-badge-alert-icon { font-size: 12px; }
#page-analista_productos .ap-pf-ml-badge-risk .ap-pf-ml-badge-label { font-size: 10px; opacity: 1; text-transform: none; letter-spacing: 0; }

/* ── Selección múltiple (checkbox por card) + barra de publicación en
   lote — pedido explícito 2026-08-20, reemplaza la fila de chips de
   filtro por estado ML de arriba (no quedaba bien visualmente, se sacó). ── */
#page-analista_productos .ap-pf-select-chk {
  position: absolute; top: 10px; left: 10px; z-index: 3; width: 22px; height: 22px;
  background: rgba(0,0,0,.55); border-radius: 6px; display: flex; align-items: center; justify-content: center; cursor: pointer;
}
#page-analista_productos .ap-pf-select-chk input { width: 15px; height: 15px; cursor: pointer; accent-color: var(--ap-blue); }

/* ── Estrella de favorito de la card — pedido explícito 28/08/2026: lo
   que se marca acá cuenta como "Novedades" (junto con lo real que
   detectan los sitios de los proveedores, ver es_novedad). ── */
#page-analista_productos .ap-pf-fav-star {
  position: absolute; top: 10px; right: 10px; z-index: 3; width: 26px; height: 26px;
  background: rgba(0,0,0,.55); border: none; border-radius: 6px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: #fff; transition: color 150ms var(--ap-ease), background 150ms var(--ap-ease), transform 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-fav-star svg { width: 16px; height: 16px; }
#page-analista_productos .ap-pf-fav-star:hover { color: #fbbf24; transform: scale(1.1); }
#page-analista_productos .ap-pf-fav-star.active { color: #fbbf24; }
#page-analista_productos .ap-pf-fav-star.active svg { fill: currentColor; }

/* ── Vista "Filas" de Catálogo de Productos — pedido explícito
   22/08/2026, misma info completa que la card (reusa apPfCostBlockHtml/
   apPfEnvioGratisBtnHtml tal cual), layout horizontal. Toolbar del
   selector Filas/Cards reusa .cp-view-toggle (ver catalogo-
   proveedores.css) para no duplicar CSS entre módulos. ── */
#page-analista_productos .ap-pf-results-toolbar { margin: -6px 0 14px; }
#page-analista_productos .ap-pf-row {
  display: flex; align-items: stretch; gap: 14px; padding: 12px 14px;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg);
  box-shadow: var(--ap-shadow); cursor: pointer; transition: box-shadow 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-row:hover { box-shadow: var(--ap-shadow-hov); }
@media (max-width: 1100px) {
  #page-analista_productos .ap-pf-row { flex-wrap: wrap; } }

#page-analista_productos .ap-pf-cat-section { margin-bottom: 30px; }
#page-analista_productos .ap-pf-cat-section-hdr {
  display: flex; align-items: baseline; gap: 10px; margin: 0 0 14px; padding-bottom: 10px;
  border-bottom: 1px solid var(--ap-border); font-size: 16px; font-weight: 800; color: var(--ap-text);
}
#page-analista_productos .ap-pf-cat-section-count { font-size: 12px; font-weight: 700; color: var(--ap-text2); }

/* Grid de 3 columnas (contador | grupo de acciones | limpiar filtros) para
   que el grupo central quede centrado respecto de los resultados sin
   importar el ancho del contador o del link de la derecha (pedido
   explícito 21/08/2026). */
#page-analista_productos .ap-pf-bulkbar {
  position: sticky; top: 0; z-index: 20; display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center; gap: 16px;
  margin: -6px 0 18px; padding: 10px 16px; border-radius: var(--ap-r-lg);
  background: var(--ap-card); border: 1px solid var(--ap-border); box-shadow: var(--ap-shadow);
  transition: border-color 150ms var(--ap-ease);
}

/* Barra de acciones en lote v2 — pedido explícito 22/08/2026 (mockup
   provisto): botones rectangulares chicos en vez de círculos de 3cm,
   reemplaza la barra anterior. */
#page-analista_productos .ap-pf-bulkbar2 {
  position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  margin: -6px 0 18px; padding: 10px 16px; border-radius: var(--ap-r-lg);
  background: var(--ap-card); border: 1px solid var(--ap-border); box-shadow: var(--ap-shadow);
  transition: border-color 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-bulkbar2-count { font-size: 12.5px; font-weight: 700; color: var(--ap-text2); flex-shrink: 0; }
#page-analista_productos .ap-pf-bulk-field { display: flex; align-items: center; gap: 6px; }
#page-analista_productos .ap-pf-bulk-field-btn {
  background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 8px; padding: 7px 12px;
  font-size: 11.5px; font-weight: 700; color: var(--ap-text); cursor: pointer; white-space: nowrap;
}
#page-analista_productos .ap-pf-bulk-field-btn:hover { border-color: var(--ap-blue); color: var(--ap-blue); }
#page-analista_productos .ap-pf-bulk-field-btn.ap-pf-action-badge-active { border-color: var(--ap-blue); color: var(--ap-blue); background: color-mix(in srgb, var(--ap-blue) 12%, transparent); }
#page-analista_productos .ap-pf-bulk-field-input {
  width: 70px; padding: 6px 8px; border-radius: 8px; border: 1px solid var(--ap-border);
  background: var(--ap-bg); color: var(--ap-text); font-size: 12px; font-weight: 700;
}
#page-analista_productos .ap-pf-bulk-publish-btn {
  flex-shrink: 0; background: #FFE600; color: #1a1a1a; border: none; border-radius: 8px;
  padding: 9px 16px; font-size: 12.5px; font-weight: 800; cursor: pointer; display: flex; align-items: center; gap: 7px;
  transition: opacity 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-bulk-publish-btn svg { width: 16px; height: 16px; }
#page-analista_productos .ap-pf-bulk-publish-btn:hover:not(:disabled) { opacity: .88; }
#page-analista_productos .ap-pf-bulk-publish-btn:disabled { opacity: .35; cursor: not-allowed; }
#page-analista_productos .ap-pf-bulkbar-center {
  grid-column: 2; justify-self: center; display: flex; align-items: center; gap: 16px;
}

/* "Publicar con envío sin interés" / "Publicar sin interés" — pedido
   explícito 21/08/2026, al lado del botón circular "Publicar en ML" de
   la barra de selección. Circulares de 3cm x 3cm, mismo tamaño que
   .ap-pf-bulkbar-publish (pedido explícito 21/08/2026) — mismo lenguaje
   de badge que .ap-pf-ml-badge-live (sombra, forma) pero en gris tenue
   en vez de amarillo: el amarillo de ML significa "ya publicado", y
   esto todavía es una ACCIÓN sin aplicar, no una publicación real. Al
   activarse (envío: apenas se ejecuta; cuotas: mientras el selector de
   cantidad está abierto) pasa a .ap-pf-action-badge-active. */
#page-analista_productos .ap-pf-action-badge {
  width: 3cm; height: 3cm; border-radius: 50%; flex-shrink: 0; padding: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  border: 1px solid var(--ap-border);
  background: color-mix(in srgb, var(--ap-text2) 10%, var(--ap-card));
  color: var(--ap-text); cursor: pointer;
  font-size: 11px; font-weight: 800; line-height: 1.2; text-align: center; box-shadow: var(--ap-shadow-hov);
  transition: transform 150ms var(--ap-ease), background 150ms var(--ap-ease), border-color 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-action-badge:hover:not(:disabled) { transform: scale(1.05); border-color: var(--ap-text2); }
#page-analista_productos .ap-pf-action-badge:disabled { opacity: .5; cursor: not-allowed; }
#page-analista_productos .ap-pf-action-badge-active {
  background: color-mix(in srgb, var(--ap-text2) 22%, var(--ap-card)); border-color: var(--ap-text2);
}
#page-analista_productos .ap-pf-bulkbar-gear {
  background: none; border: 1px solid var(--ap-border); border-radius: 8px; width: 30px; height: 30px;
  cursor: pointer; font-size: 13px; color: var(--ap-text2); flex-shrink: 0;
}
#page-analista_productos .ap-pf-bulkbar-gear:hover { color: var(--ap-blue); border-color: var(--ap-blue); }

/* ── Toolbar de resultados rediseñada — pedido explícito 28/08/2026: la
   barra circular de abajo se oculta; IVA%/Markup%/Selector cuotas pasan
   a vivir DENTRO de la ruedita (dropdown), y se agrega "Seleccionar
   todas" + "Publicar en Mercado Libre" acá arriba, al costado. ── */
#page-analista_productos .ap-pf-toolbar-left { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
#page-analista_productos .ap-pf-toolbar-right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
#page-analista_productos .ap-pf-gear-wrap { position: relative; }
#page-analista_productos .ap-pf-gear-dropdown {
  position: absolute; top: calc(100% + 8px); left: 0; z-index: 30; min-width: 220px;
  display: flex; flex-direction: column; gap: 10px; padding: 12px;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg); box-shadow: var(--ap-shadow-hov);
}
#page-analista_productos .ap-pf-gear-dropdown .ap-pf-bulk-field { width: 100%; }
#page-analista_productos .ap-pf-gear-dropdown .ap-pf-bulk-field-btn { flex: 1; }
#page-analista_productos .ap-pf-gear-dropdown .ap-pf-bulk-field-input { flex: 1; width: auto; }
#page-analista_productos .ap-pf-gear-dropdown-sep { height: 1px; background: var(--ap-border); margin: 2px 0; }
#page-analista_productos .ap-pf-gear-dropdown-link {
  background: none; border: none; padding: 2px 0; font-size: 11.5px; font-weight: 700;
  color: var(--ap-text2); text-align: left; cursor: pointer;
}
#page-analista_productos .ap-pf-gear-dropdown-link:hover { color: var(--ap-blue); }

/* Sección "Publicar hermanas en lote" dentro de la ruedita — pedido
   explícito 04/09/2026 (auditoría: la función ya existía en el backend
   probada con el piloto real, pero no había forma de usarla en lote
   desde la UI). Mismo lenguaje visual que el resto del dropdown. */
#page-analista_productos .ap-pf-bulk-field-label {
  font-size: 10.5px; font-weight: 800; color: var(--ap-text2); text-transform: uppercase;
  letter-spacing: .02em; margin-top: 2px;
}
#page-analista_productos .ap-pf-bulk-dup-row { display: flex; align-items: center; gap: 8px; }
#page-analista_productos .ap-pf-bulk-dup-envio {
  display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700;
  color: var(--ap-text); cursor: pointer; user-select: none; white-space: nowrap;
}
#page-analista_productos .ap-pf-bulk-dup-envio input { width: 14px; height: 14px; cursor: pointer; accent-color: var(--ap-blue); }
#page-analista_productos .ap-pf-bulk-dup-publish-btn {
  background: #FFE600; color: #1a1a1a; border: none; font-weight: 800;
}
#page-analista_productos .ap-pf-bulk-dup-publish-btn:hover { border-color: transparent; opacity: .88; color: #1a1a1a; }
#page-analista_productos .ap-pf-bulk-dup-publish-btn:disabled { opacity: .35; cursor: not-allowed; }
#page-analista_productos .ap-pf-selectall {
  display: flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 700;
  color: var(--ap-text); cursor: pointer; user-select: none;
}
#page-analista_productos .ap-pf-selectall input { width: 16px; height: 16px; cursor: pointer; accent-color: var(--ap-blue); }

/* Filtro por estado de publicación en ML — checks circulares al lado de
   "Seleccionar todas", pedido explícito 02/09/2026. Un solo filtro activo
   a la vez (mismo valor que ya soporta el backend, ml_status). */
#page-analista_productos .ap-pf-status-filters { display: flex; align-items: center; gap: 14px; }
#page-analista_productos .ap-pf-status-chk {
  display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600;
  color: var(--ap-text2); cursor: pointer; user-select: none;
}
#page-analista_productos .ap-pf-status-chk input {
  width: 15px; height: 15px; border-radius: 50%; cursor: pointer;
}
#page-analista_productos .ap-pf-status-chk.ap-pf-status-published input { accent-color: #16a34a; }
#page-analista_productos .ap-pf-status-chk.ap-pf-status-unpublished input { accent-color: #94a3b8; }
#page-analista_productos .ap-pf-status-chk.ap-pf-status-review input { accent-color: #f59e0b; }
#page-analista_productos .ap-pf-status-chk.ap-pf-status-sinstock input { accent-color: #dc2626; }

/* Badge de card — mismo lenguaje visual que los otros badges de
   .ap-pf-badge-row (stock/clasificación). */
#page-analista_productos .ap-pf-cuotas-badge {
  display: inline-flex; align-items: center; gap: 3px; font-size: 10px; font-weight: 700;
  padding: 3px 8px; border-radius: 999px;
  background: color-mix(in srgb, var(--ap-blue) 15%, transparent); color: var(--ap-blue);
}

/* Popover con el motivo real del estado (consultado en vivo contra ML). */
#page-analista_productos .ap-pf-ml-status-popover {
  position: absolute; z-index: 600; width: 280px; padding: 14px 16px;
  background: var(--ap-card, #12141C); border: 1px solid var(--ap-border, rgba(255,255,255,.08));
  border-radius: var(--ap-r-lg, 14px); box-shadow: var(--ap-shadow-hov, 0 20px 50px rgba(0,0,0,.6));
}
#page-analista_productos .ap-pf-ml-status-hdr { font-size: 12.5px; font-weight: 800; color: #dc2626; margin-bottom: 6px; }
#page-analista_productos .ap-pf-ml-status-loading,
#page-analista_productos .ap-pf-ml-status-reason { font-size: 12.5px; color: var(--ap-text, #E8EAF0); line-height: 1.5; }
#page-analista_productos .ap-pf-ml-status-link { display: inline-block; margin-top: 10px; font-size: 12px; font-weight: 700; color: var(--ap-blue, #818CF8); text-decoration: none; }
#page-analista_productos .ap-pf-ml-status-link:hover { text-decoration: underline; }

/* Desglose de costo — costo real + IVA%/Envío$/Markup% editables +
   venta sugerida y ganancia neta, todo legible (pedido explícito). */
#page-analista_productos .ap-pf-cost-block { width: 100%; display: flex; flex-direction: column; gap: 5px; margin-top: 2px; }
#page-analista_productos .ap-pf-cost-row { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; }
#page-analista_productos .ap-pf-cost-label { font-size: 10px; color: var(--ap-text2); font-weight: 600; }
#page-analista_productos .ap-pf-cost-value { font-size: 11.5px; font-weight: 700; color: var(--ap-text); }
#page-analista_productos .ap-pf-cost-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; }
#page-analista_productos .ap-pf-cost-input-col { display: flex; flex-direction: column; gap: 2px; }
#page-analista_productos .ap-pf-cost-input-col span { font-size: 8.5px; color: var(--ap-text2); font-weight: 700; text-transform: uppercase; letter-spacing: .02em; }
#page-analista_productos .ap-pf-mini-input { width: 100%; box-sizing: border-box; padding: 4px 2px; font-size: 10.5px; text-align: center; border-radius: 5px; border: 1px solid var(--ap-border); background: var(--ap-bg); color: var(--ap-text); }

/* Checkboxes de IVA/Cargos de ML — rediseño pedido explícito
   22/08/2026 ("tiene muchos números y se pierde la información"):
   reemplazan textboxes por chips compactos. "Cargos de ML" siempre
   tildado y bloqueado (ML SIEMPRE cobra su comisión al publicar). */
#page-analista_productos .ap-pf-cost-checks { display: flex; flex-wrap: wrap; gap: 6px; margin: 2px 0; }
#page-analista_productos .ap-pf-cost-check {
  display: inline-flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700;
  padding: 4px 8px; border-radius: 999px; border: 1px solid var(--ap-border); background: var(--ap-bg);
  color: var(--ap-text); cursor: pointer;
}
#page-analista_productos .ap-pf-cost-check input { width: 12px; height: 12px; accent-color: var(--ap-blue); cursor: pointer; margin: 0; }
#page-analista_productos .ap-pf-cost-check-locked {
  background: var(--ap-bg2, #2a2f3d); opacity: .85; cursor: default;
}
#page-analista_productos .ap-pf-cost-check-locked input { cursor: default; accent-color: var(--ap-text2); }
#page-analista_productos .ap-pf-cost-check .cp-fee-loading, #page-analista_productos .ap-pf-cost-check .cp-fee-error { font-size: 9.5px; }

/* Ganancia neta editable — pedido explícito 22/08/2026: escribir el
   número resuelve el markup% necesario para llegar ahí. */
#page-analista_productos .ap-pf-ganancia-input {
  width: 100px; text-align: right; font-size: 13px; font-weight: 700; color: var(--ap-green);
  border: 1px solid transparent; border-radius: 6px; background: none; padding: 2px 6px;
  transition: border-color 150ms var(--ap-ease), background 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-ganancia-input:hover, #page-analista_productos .ap-pf-ganancia-input:focus {
  border-color: var(--ap-border); background: var(--ap-bg);
}

/* Botón "Modificar publicación" — mismo lugar/tamaño que "Publicar",
   celeste en vez de amarillo (no es una publicación nueva). */
#page-analista_productos .ap-pf-modificar-btn { background: var(--ap-blue); color: #fff; }

/* Stepper +/- de números — pedido explícito 22/08/2026 ("selector de
   números visualmente agradable"), usado en Configuración de precios. */
#page-analista_productos .ap-pf-stepper { display: flex; align-items: center; gap: 0; border: 1px solid var(--ap-border); border-radius: 8px; overflow: hidden; }
#page-analista_productos .ap-pf-stepper-btn {
  width: 26px; height: 26px; border: none; background: var(--ap-bg); color: var(--ap-text);
  font-size: 14px; font-weight: 800; cursor: pointer; flex-shrink: 0;
}
#page-analista_productos .ap-pf-stepper-btn:hover { background: var(--ap-blue); color: #fff; }
#page-analista_productos .ap-pf-stepper-input {
  width: 46px; border: none; border-left: 1px solid var(--ap-border); border-right: 1px solid var(--ap-border);
  text-align: center; font-size: 12.5px; font-weight: 700; background: var(--ap-card); color: var(--ap-text); padding: 4px 0;
}
#page-analista_productos .ap-pf-settings-section { padding-bottom: 10px; }

/* ── "Publicadas recién / En revisión" — franja en vivo, pedido
   explícito 23/08/2026. ── */
#page-analista_productos .ap-pf-recent-block { margin: 0 0 18px; padding: 14px 16px; background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg); }
#page-analista_productos .ap-pf-recent-hdr { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 12.5px; font-weight: 800; color: var(--ap-text); margin-bottom: 10px; flex-wrap: wrap; }
#page-analista_productos .ap-pf-recent-counts { display: flex; gap: 12px; font-size: 11.5px; font-weight: 700; color: var(--ap-text2); }
/* ── Carrusel "cover flow" 3D — pedido explícito 28/08/2026: la tarjeta
   con el mouse encima (o la última clickeada) se agranda y pasa al
   frente, las demás se achican y giran en profundidad según la
   distancia. Los transforms por tarjeta los calcula/aplica JS
   (apPfWireRecentCarousel3D) — acá solo la base + la transición suave. ── */
#page-analista_productos .ap-pf-recent-carousel { display: flex; align-items: center; gap: 6px; }
#page-analista_productos .ap-pf-recent-viewport { flex: 1; min-width: 0; overflow: hidden; perspective: 1100px; padding: 160px 4px 24px; }
#page-analista_productos .ap-pf-recent-strip {
  display: flex; gap: 16px; transform-style: preserve-3d;
  transition: transform 420ms cubic-bezier(.22,1,.36,1);
}
#page-analista_productos .ap-pf-recent-card {
  /* Pedido explícito 28/08/2026: la tarjeta activa (scale 1.76, ver JS)
     tiene que quedar en ~7cm de ancho -> 150px base * 1.76 ≈ 264px ≈ 7cm. */
  flex-shrink: 0; width: 150px; background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 10px;
  padding: 10px; cursor: pointer; transform-style: preserve-3d; transform-origin: center bottom; position: relative;
  transition: transform 380ms cubic-bezier(.22,1,.36,1), box-shadow 380ms var(--ap-ease), opacity 380ms var(--ap-ease), border-color 380ms var(--ap-ease);
}
/* Badge circular "Publicado en ML" (mismo apPfMarketBadgeHtml que la
   grilla principal) escalado para esta tarjeta chica — pedido explícito
   02/09/2026. */
#page-analista_productos .ap-pf-recent-ml-badges-row { top: -6px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-live { width: 46px; height: 46px; gap: 1px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-logo { font-size: 7px; padding: 1px 4px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-label { font-size: 5.5px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-price { font-size: 7px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-alert,
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-needs-review,
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-discontinued { height: 22px; padding: 0 8px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-alert .ap-pf-ml-badge-label,
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-needs-review .ap-pf-ml-badge-label,
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-discontinued .ap-pf-ml-badge-label { font-size: 8px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-unpublished { height: 20px; padding: 0 7px; }
#page-analista_productos .ap-pf-recent-ml-badges-row .ap-pf-ml-badge-unpublished .ap-pf-ml-badge-label { font-size: 7.5px; }

/* Barra "Ganancia neta" al pie — negra, a todo el ancho de la card
   (bleed via márgenes negativos = padding de la card), acento dorado ML
   sobre negro. Pedido explícito 02/09/2026: "todo bien sofisticado". */
#page-analista_productos .ap-pf-recent-ganancia-bar {
  margin: 8px -10px -10px; padding: 6px 10px; border-radius: 0 0 9px 9px;
  background: linear-gradient(160deg, #1c1c1e, #0a0a0b);
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
#page-analista_productos .ap-pf-recent-ganancia-label {
  font-size: 7.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #9ca3af;
}
#page-analista_productos .ap-pf-recent-ganancia-value { font-size: 12px; font-weight: 900; color: #FFE600; }
#page-analista_productos .ap-pf-recent-ganancia-bar.negative .ap-pf-recent-ganancia-value { color: #f87171; }
#page-analista_productos .ap-pf-recent-card-active {
  border-color: var(--ap-accent, #6366f1);
  box-shadow: 0 18px 34px -12px color-mix(in srgb, var(--ap-accent, #6366f1) 55%, transparent), 0 0 0 1px color-mix(in srgb, var(--ap-accent, #6366f1) 40%, transparent);
}
#page-analista_productos .ap-pf-recent-nav {
  flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--ap-border);
  background: var(--ap-card); color: var(--ap-text); font-size: 17px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center; transition: background 150ms var(--ap-ease), transform 150ms var(--ap-ease), opacity 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-recent-nav:hover:not(:disabled) { background: var(--ap-border); transform: scale(1.1); }
#page-analista_productos .ap-pf-recent-nav:disabled { opacity: .3; cursor: default; }
#page-analista_productos .ap-pf-recent-img { width: 100%; height: 88px; border-radius: 7px; overflow: hidden; background: var(--ap-card); display: flex; align-items: center; justify-content: center; margin-bottom: 6px; }
#page-analista_productos .ap-pf-recent-img img { width: 100%; height: 100%; object-fit: cover; }
#page-analista_productos .ap-pf-recent-badge { display: inline-block; font-size: 9.5px; font-weight: 800; padding: 2px 6px; border-radius: 999px; margin-bottom: 4px; }
#page-analista_productos .ap-pf-recent-badge-ok { background: color-mix(in srgb, var(--ap-green) 20%, transparent); color: var(--ap-green); }
#page-analista_productos .ap-pf-recent-title { font-size: 11.5px; font-weight: 700; color: var(--ap-text); line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#page-analista_productos .ap-pf-recent-price { font-size: 11.5px; font-weight: 800; color: #f59e0b; margin-top: 3px; }

/* ── Vista "Filas" — tabla de datos real (pedido explícito 22/08/2026,
   mockup provisto: "con la misma identidad") — reemplaza el intento
   anterior de fila-horizontal por una tabla de columnas de verdad. ── */
#page-analista_productos .ap-pf-table-wrap { overflow-x: auto; border-radius: var(--ap-r-lg); border: 1px solid var(--ap-border); }
#page-analista_productos .ap-pf-rows-table { width: 100%; border-collapse: collapse; font-size: 12.5px; min-width: 1400px; background: var(--ap-card); }
#page-analista_productos .ap-pf-rows-table thead tr:first-child th {
  background: var(--ap-bg); color: var(--ap-text2); font-size: 10.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .02em; text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--ap-border); white-space: nowrap;
}
#page-analista_productos .ap-pf-col-cuotas-hdr { text-align: center !important; border-left: 1px solid var(--ap-border); border-right: 1px solid var(--ap-border); }
#page-analista_productos .ap-pf-cuotas-subhdr th { background: var(--ap-bg); font-size: 9.5px; color: var(--ap-text2); font-weight: 700; text-align: center; padding: 4px 10px 8px; border-bottom: 1px solid var(--ap-border); }
#page-analista_productos .ap-pf-rows-table tbody td { padding: 10px 12px; border-bottom: 1px solid var(--ap-border); color: var(--ap-text); white-space: nowrap; vertical-align: middle; }
#page-analista_productos .ap-pf-rows-table tbody tr:last-child td { border-bottom: none; }
#page-analista_productos .ap-pf-rows-table tbody tr:hover { background: var(--ap-bg); }
#page-analista_productos .ap-pf-col-check, #page-analista_productos .ap-pf-col-img { width: 1%; }
#page-analista_productos .ap-pf-rows-table .ap-pf-col-img img, #page-analista_productos .ap-pf-noimg-sm {
  width: 40px; height: 40px; border-radius: 8px; object-fit: cover; background: var(--ap-bg); display: flex; align-items: center; justify-content: center; font-size: 16px;
}
#page-analista_productos .ap-pf-table-title { font-weight: 700; color: var(--ap-text); cursor: pointer; max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#page-analista_productos .ap-pf-table-title:hover { color: var(--ap-blue); }
#page-analista_productos .ap-pf-table-sku { color: var(--ap-blue); font-weight: 700; }
#page-analista_productos .ap-pf-table-cat-pill {
  display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 10.5px; font-weight: 700;
  background: color-mix(in srgb, #7c3aed 22%, transparent); color: #a78bfa;
}
#page-analista_productos .ap-pf-stock-text { font-weight: 700; }
#page-analista_productos .ap-pf-stock-text-ok { color: var(--ap-green); }
#page-analista_productos .ap-pf-stock-text-low { color: #f59e0b; }
#page-analista_productos .ap-pf-table-cuota-cell { text-align: center; color: var(--ap-text2); }
/* Cuota recomendada por ML (misma que "CUOTA RECOMENDADA" en su propio
   panel — pedido explícito 22/08/2026) — resaltada de forma fija, no es
   una selección por producto. */
#page-analista_productos .ap-pf-cuota-reco { background: color-mix(in srgb, var(--ap-blue) 20%, transparent); color: var(--ap-text); font-weight: 700; border-radius: 6px; }
#page-analista_productos .ap-pf-table-plain-input {
  width: 60px; border: 1px solid transparent; border-radius: 6px; background: none; color: var(--ap-text);
  font-size: 12.5px; font-weight: 700; padding: 3px 5px; text-align: right;
}
#page-analista_productos .ap-pf-table-plain-input:hover, #page-analista_productos .ap-pf-table-plain-input:focus { border-color: var(--ap-border); background: var(--ap-bg); }
#page-analista_productos .ap-pf-table-ganancia { color: var(--ap-green); width: 90px; }
#page-analista_productos .ap-pf-table-venta { color: #f59e0b; font-weight: 800; }
#page-analista_productos .ap-pf-col-action { text-align: right; }
#page-analista_productos .ap-pf-table-icon-btn {
  width: 26px; height: 26px; border-radius: 7px; border: 1px solid var(--ap-border); background: var(--ap-bg);
  color: var(--ap-text2); cursor: pointer; font-size: 12px;
}
#page-analista_productos .ap-pf-table-icon-btn:hover { color: var(--ap-blue); border-color: var(--ap-blue); }
#page-analista_productos .ap-pf-table-menu-wrap { position: relative; display: inline-block; }
#page-analista_productos .ap-pf-table-menu {
  position: absolute; top: 100%; right: 0; margin-top: 4px; z-index: 30; min-width: 220px;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: 10px; box-shadow: var(--ap-shadow-hov);
  display: flex; flex-direction: column; padding: 5px; white-space: nowrap;
}
/* Bug real: [hidden] del navegador tiene menos especificidad que la
   regla de arriba (ID + clase) — sin esto, "display:flex" le ganaba
   siempre al atributo hidden y el menú quedaba visible permanentemente
   en TODAS las filas, tildado o no. */
#page-analista_productos .ap-pf-table-menu[hidden] { display: none; }
#page-analista_productos .ap-pf-table-menu-item {
  background: none; border: none; text-align: left; padding: 8px 10px; border-radius: 7px; font-size: 12px;
  font-weight: 700; color: var(--ap-text); cursor: pointer;
}
#page-analista_productos .ap-pf-table-menu-item:hover { background: var(--ap-bg); color: var(--ap-blue); }

/* Bug real confirmado 22/08/2026: .ap-pf-ml-badges-row es position:
   absolute pensado para flotar centrado sobre la imagen de la CARD (su
   ancestro .ap-pf-card es position:relative) — dentro de una celda de
   tabla no hay ningún ancestro posicionado cerca, así que el badge se
   escapaba a flotar sobre la página entera (visto en vivo: "Necesita
   revisión" apareciendo arriba del buscador). Acá se vuelve estático e
   inline, chico, debajo del título — nunca se sale de su celda. */
#page-analista_productos .ap-pf-rows-table .ap-pf-ml-badges-row {
  position: static; transform: none; left: auto; top: auto;
  display: inline-flex; margin-top: 4px;
}
#page-analista_productos .ap-pf-rows-table .ap-pf-ml-badge-live { width: auto; height: auto; flex-direction: row; padding: 3px 8px; border-radius: 6px; gap: 4px; }
#page-analista_productos .ap-pf-rows-table .ap-pf-ml-badge-live .ap-pf-ml-badge-text { flex-direction: row; gap: 4px; }
#page-analista_productos .ap-pf-rows-table .ap-pf-ml-badge-alert,
#page-analista_productos .ap-pf-rows-table .ap-pf-ml-badge-needs-review,
#page-analista_productos .ap-pf-rows-table .ap-pf-ml-badge-discontinued,
#page-analista_productos .ap-pf-rows-table .ap-pf-ml-badge-risk { height: 22px; font-size: 10px; }

/* Vender por cantidad — publicaciones separadas reales por cada
   cantidad (x1/x3/x6), nunca un selector dentro de una misma
   publicación (ML no lo permite para mercadería general). */
#page-analista_productos .ap-pf-pack-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; margin-top: 4px; padding-top: 8px; border-top: 1px dashed var(--ap-border); }
#page-analista_productos .ap-pf-pack-row span { font-size: 9px; color: var(--ap-text2); font-weight: 700; text-transform: uppercase; letter-spacing: .02em; }
#page-analista_productos .ap-pf-pack-input { width: 80px; flex-shrink: 0; }
#page-analista_productos .ap-pf-cost-row-total { padding-top: 4px; border-top: 1px dashed var(--ap-border); }
#page-analista_productos .ap-pf-cost-row-total .ap-pf-cost-label { color: var(--ap-text); font-weight: 700; }
#page-analista_productos .ap-pf-cost-row-total .ap-pf-cost-value { font-size: 13px; color: #4f46e5; }
#page-analista_productos .ap-pf-cost-row-profit .ap-pf-cost-label { font-weight: 700; }
#page-analista_productos .ap-pf-cost-row-profit .ap-pf-cost-value { font-size: 13px; color: var(--ap-green); }

/* Botón de publicar/guardar — al ras del pie de página, AFUERA del
   padding de .ap-pf-foot, ancho completo, esquinas inferiores igual
   que la card. Pedido explícito: "debe estar bien al ras del pie de
   página" — antes competía por espacio con el resto del contenido y
   había que scrollear la tarjeta para llegar a él. */
#page-analista_productos .ap-pf-publish-flush {
  /* Amarillo de marca ML (mismo #FFE600 que .ap-pf-ml-badge-live) —
     pedido explícito 2026-08-19: el botón de publicar tiene que
     identificarse visualmente con Mercado Libre, no con el tema propio
     de la app. Texto oscuro fijo (no --ap-bg) porque el amarillo de
     marca es el mismo en los dos temas y necesita el mismo contraste. */
  flex-shrink: 0; width: 100%; border: none; border-top: 1px solid var(--ap-border);
  border-radius: 0; background: #FFE600; color: #1a1a1a;
  padding: 15px; font-size: 13.5px; font-weight: 800; cursor: pointer; display: flex; align-items: center;
  justify-content: center; gap: 9px; transition: opacity 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-publish-flush:hover { opacity: .88; }
#page-analista_productos .ap-pf-publish-flush svg { width: 18px; height: 18px; flex-shrink: 0; }

/* "Publicar con envío gratis" — pedido explícito 22/08/2026. Va arriba
   del botón amarillo de ML (que sigue siendo el único con el lenguaje
   de marca), en gris neutro para no competir visualmente. */
#page-analista_productos .ap-pf-envio-gratis-btn {
  flex-shrink: 0; width: 100%; border: none; border-top: 1px solid var(--ap-border);
  border-radius: 0; background: var(--ap-bg2, var(--ap-card)); color: var(--ap-text2);
  padding: 11px; font-size: 12px; font-weight: 700; cursor: pointer;
  transition: color 150ms var(--ap-ease), background 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-envio-gratis-btn:hover { color: var(--ap-blue); }
#page-analista_productos .ap-pf-envio-gratis-btn:disabled { opacity: .6; cursor: not-allowed; }

/* "Publicar con cuotas sin interés" — pedido explícito 04/09/2026, mismo
   lenguaje visual que el botón de envío gratis (gris neutro, ancho
   completo, separador arriba) para que se lea como la misma familia de
   acciones — la diferencia es un <select> porque hay 5 combinaciones
   reales posibles, no una sola acción de un tiro. */
#page-analista_productos .ap-pf-cuotas-gratis-sel {
  flex-shrink: 0; width: 100%; border: none; border-top: 1px solid var(--ap-border);
  border-radius: 0; background: var(--ap-bg2, var(--ap-card)); color: var(--ap-text2);
  padding: 11px; font-size: 12px; font-weight: 700; cursor: pointer; text-align: center;
  transition: color 150ms var(--ap-ease), background 150ms var(--ap-ease);
}
#page-analista_productos .ap-pf-cuotas-gratis-sel:hover { color: var(--ap-blue); }
#page-analista_productos .ap-pf-cuotas-gratis-sel:disabled { opacity: .6; cursor: not-allowed; }

/* ── "Publicaciones" — agrupado por categoría + selector de proveedor.
   Reusa .ap-pf-grid/.ap-pf-card (mismo tamaño que "Productos"). ── */
#page-analista_productos .ap-pub-toolbar { display: flex; justify-content: flex-end; margin-bottom: 18px; }
#page-analista_productos .ap-pub-group { margin-bottom: 30px; }
#page-analista_productos .ap-pub-group-hdr {
  display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 800; color: var(--ap-text);
  margin-bottom: 14px; padding-bottom: 8px; border-bottom: 2px solid var(--ap-border);
}
#page-analista_productos .ap-pub-group-count {
  font-size: 10.5px; font-weight: 800; color: #6366f1; background: rgba(99,102,241,.12);
  border-radius: 20px; padding: 2px 9px;
}
/* Sección por estado (Activas/Inactivas) — un nivel arriba de los grupos
   por categoría, para no mezclar publicaciones vivas con las que no lo
   están bajo un mismo título de rubro. Pedido explícito 02/09/2026. */
#page-analista_productos .ap-pub-status-section { margin-bottom: 38px; }
#page-analista_productos .ap-pub-status-hdr {
  display: flex; align-items: center; gap: 10px; font-size: 17px; font-weight: 900; color: var(--ap-text);
  margin-bottom: 18px; padding-bottom: 10px; border-bottom: 2px solid var(--ap-green);
}
#page-analista_productos .ap-pub-status-section-inactivas .ap-pub-status-hdr { border-bottom-color: var(--ap-text3, #94a3b8); opacity: .85; }
#page-analista_productos .ap-pub-status-count {
  font-size: 11px; font-weight: 800; color: var(--ap-green); background: rgba(34,197,94,.12);
  border-radius: 20px; padding: 3px 11px;
}
#page-analista_productos .ap-pub-status-section-inactivas .ap-pub-status-count { color: #94a3b8; background: rgba(148,163,184,.14); }
#page-analista_productos .ap-pub-error {
  font-size: 9.5px; color: var(--ap-red); background: rgba(239,68,68,.08); border-radius: 6px;
  padding: 4px 8px; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

@media (max-width: 900px) {
  #page-analista_productos .ap-pf-sidebar { left: 8px; right: 8px; top: 8px; bottom: 8px; width: auto; max-width: none; } }
#page-analista_productos .ap-market-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 20px;
}
#page-analista_productos .ap-market-card {
  background: var(--ap-card);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-sm);
  box-shadow: var(--ap-shadow);
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform 180ms var(--ap-ease), box-shadow 180ms var(--ap-ease), border-color 180ms var(--ap-ease);
  position: relative;
  animation: ap-fade-in-up .35s var(--ap-ease) both;
  animation-delay: var(--ap-stagger, 0ms);
}
#page-analista_productos .ap-market-card:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: var(--ap-shadow-hov);
  border-color: rgba(59,130,246,.25);
}
#page-analista_productos .ap-market-card.ap-market-best::before {
  content: 'Mejor precio';
  position: absolute;
  top: -11px; left: 20px;
  background: var(--ap-green);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  box-shadow: 0 6px 14px rgba(16,185,129,.35);
}
#page-analista_productos .ap-listing-delete-x {
  position: absolute;
  top: 8px; right: 8px;
  width: 26px; height: 26px;
  border-radius: 0;
  border: 1px solid var(--ap-border);
  background: var(--ap-card);
  color: var(--ap-red);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: background 150ms var(--ap-ease), color 150ms var(--ap-ease);
}
#page-analista_productos .ap-listing-delete-x:hover {
  background: var(--ap-red);
  color: #fff;
}
#page-analista_productos .ap-market-badge {
  font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 999px;
}
#page-analista_productos .ap-market-badge-installments { background: rgba(59,130,246,.10); color: #1d4ed8; }
#page-analista_productos .ap-market-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
#page-analista_productos .ap-market-logo { display: flex; align-items: center; min-width: 0; flex: 1; }
#page-analista_productos .ap-market-logo img { height: 22px; width: auto; }
/* Banner de marca real — reemplaza el chip de iniciales de antes en las
   cards de comparación. El chip chico sigue en pie para la lista de
   afiliados (apRenderDetailAfiliados), que es un uso distinto. */
#page-analista_productos .ap-market-logo-banner {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  width: 100%; padding: 7px 10px; border-radius: 10px;
  font-size: 12.5px; font-weight: 800; letter-spacing: -.01em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#page-analista_productos .ap-market-logo-chip {
  width: 26px; height: 26px; border-radius: 8px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 800; color: #fff;
}
#page-analista_productos .ap-market-stock {
  font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
}
#page-analista_productos .ap-stock-in    { background: rgba(16,185,129,.10); color: #047857; }
#page-analista_productos .ap-stock-low   { background: rgba(245,158,11,.12); color: #b45309; }
#page-analista_productos .ap-stock-out   { background: rgba(239,68,68,.10);  color: #b91c1c; }
#page-analista_productos .ap-market-price {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: -.02em;
  font-variant-numeric: tabular-nums;
}
#page-analista_productos .ap-market-card .ap-btn { width: 100%; justify-content: center; padding: 12px 20px; font-size: 13px; }

/* ── Badge de ganancia neta estimada (Oportunidades) ─────────────── */
#page-analista_productos .ap-ganancia-badge {
  display: inline-block; font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
}
#page-analista_productos .ap-ganancia-ok   { background: rgba(16,185,129,.10); color: #047857; }
#page-analista_productos .ap-ganancia-bajo { background: rgba(239,68,68,.10);  color: #b91c1c; }

#page-analista_productos .ap-ganancia-toolbar {
  display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg);
  padding: 14px 18px; margin-bottom: 14px;
}
#page-analista_productos .ap-ganancia-field { display: flex; flex-direction: column; gap: 4px; font-size: 11.5px; color: var(--ap-text2); }
#page-analista_productos .ap-ganancia-field input {
  background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 8px;
  padding: 7px 10px; font-size: 13px; color: var(--ap-text); width: 130px; font-variant-numeric: tabular-nums;
}
#page-analista_productos .ap-ganancia-toggle { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ap-text2); margin-left: auto; }
#page-analista_productos .ap-ganancia-hidden-note { font-size: 11.5px; color: var(--ap-text2); margin: -6px 0 12px; }

/* ── Panel de Ganancia ──────────────────────────────────────────── */
#page-analista_productos .ap-profit-panel {
  background: linear-gradient(155deg, #ECFDF5 0%, #FFFFFF 55%);
  border: 1px solid rgba(16,185,129,.18);
  border-radius: var(--ap-r-lg);
  box-shadow: var(--ap-shadow);
  padding: 32px;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 32px;
}
#page-analista_productos .ap-profit-stat { display: flex; flex-direction: column; gap: 6px; }
#page-analista_productos .ap-profit-label {
  font-size: 13px; font-weight: 600; color: #047857;
  text-transform: uppercase; letter-spacing: .06em;
}
#page-analista_productos .ap-profit-value {
  font-size: 34px; font-weight: 700; color: #065F46;
  letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}
#page-analista_productos .ap-profit-value small { font-size: 16px; font-weight: 600; margin-left: 2px; }
#page-analista_productos .ap-mini-sparkline { width: 72px; height: 24px; }
#page-analista_productos .ap-chart-card {
  background: var(--ap-card);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-lg);
  box-shadow: var(--ap-shadow);
  padding: 28px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Ranking real de tendencias de Mercado Libre — pedido explícito
   04/09/2026 ("proveedor de datos de tendencias deberá ser free").
   Fila clickeable (dispara la búsqueda de ese término abajo). */
#page-analista_productos .ap-trend-rank-list {
  display: flex; flex-direction: column; gap: 2px;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg);
  padding: 6px 4px; box-shadow: var(--ap-shadow);
}
#page-analista_productos .ap-trend-rank-row {
  display: grid; grid-template-columns: 34px 1.4fr 1fr; align-items: center; gap: 12px;
  padding: 9px 12px; border-radius: 8px; cursor: pointer;
  transition: background 120ms var(--ap-ease);
}
#page-analista_productos .ap-trend-rank-row:hover { background: var(--ap-bg); }
#page-analista_productos .ap-trend-rank-num { font-size: 12px; font-weight: 800; color: var(--ap-text2); }
#page-analista_productos .ap-trend-rank-name { font-size: 13px; font-weight: 700; color: var(--ap-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#page-analista_productos .ap-trend-rank-bar-track { height: 6px; border-radius: 999px; background: rgba(249,115,22,.12); overflow: hidden; }
#page-analista_productos .ap-trend-rank-bar-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #f97316, #fb923c); }
#page-analista_productos .ap-chart-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 8px; }
#page-analista_productos .ap-chart-range {
  font-size: 12px; font-weight: 600; color: var(--ap-text2);
  background: var(--ap-bg); border: 1px solid var(--ap-border);
  padding: 6px 12px; border-radius: 999px;
}
#page-analista_productos .ap-chart-wrap { position: relative; width: 100%; height: 180px; }
#page-analista_productos .ap-chart-wrap svg { width: 100%; height: 100%; overflow: visible; }
#page-analista_productos .ap-chart-tooltip {
  position: absolute;
  pointer-events: none;
  background: var(--ap-text);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 8px 12px;
  border-radius: 10px;
  box-shadow: 0 12px 28px rgba(16,24,40,.28);
  transform: translate(-50%, calc(-100% - 12px));
  opacity: 0;
  transition: opacity 120ms ease;
  white-space: nowrap;
  z-index: 5;
}

/* ── Afiliados ──────────────────────────────────────────────────── */
#page-analista_productos .ap-affiliate-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}
#page-analista_productos .ap-affiliate-card {
  background: var(--ap-card);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-sm);
  box-shadow: var(--ap-shadow);
  padding: 22px;
  display: flex;
  align-items: center;
  gap: 16px;
  transition: transform 180ms var(--ap-ease), box-shadow 180ms var(--ap-ease);
}
#page-analista_productos .ap-affiliate-card:hover { transform: translateY(-4px) scale(1.02); box-shadow: var(--ap-shadow-hov); }
#page-analista_productos .ap-affiliate-info { flex: 1; min-width: 0; }
#page-analista_productos .ap-affiliate-name { font-size: 14px; font-weight: 700; margin-bottom: 2px; }
#page-analista_productos .ap-affiliate-comm { font-size: 13px; color: var(--ap-text2); font-weight: 500; }
#page-analista_productos .ap-affiliate-comm b { color: #047857; font-weight: 700; }

/* ── Score cards ────────────────────────────────────────────────── */
#page-analista_productos .ap-score-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}
#page-analista_productos .ap-score-card {
  background: var(--ap-card);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-sm);
  box-shadow: var(--ap-shadow);
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: transform 180ms var(--ap-ease), box-shadow 180ms var(--ap-ease);
}
#page-analista_productos .ap-score-card:hover { transform: translateY(-4px) scale(1.02); box-shadow: var(--ap-shadow-hov); }
#page-analista_productos .ap-score-label { font-size: 13px; font-weight: 600; color: var(--ap-text2); }
#page-analista_productos .ap-score-level { font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
#page-analista_productos .ap-gauge-wrap { position: relative; width: 84px; height: 84px; }
#page-analista_productos .ap-gauge-wrap svg { transform: rotate(-90deg); }
#page-analista_productos .ap-gauge-value {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 700;
}

/* ── Estado vacío / búsqueda en curso (datos reales, no simulados) ─ */
#page-analista_productos .ap-empty-state {
  background: var(--ap-card);
  border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-lg);
  box-shadow: var(--ap-shadow);
  padding: 64px 32px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
#page-analista_productos .ap-empty-icon { width: 40px; height: 40px; color: var(--ap-text2); opacity: .5; }
#page-analista_productos .ap-empty-title { font-size: 20px; font-weight: 700; }
#page-analista_productos .ap-empty-sub { font-size: 14px; color: var(--ap-text2); max-width: 420px; }

@keyframes ap-spin { to { transform: rotate(360deg); } }
@keyframes ap-shimmer { 0% { background-position: -200px 0; } 100% { background-position: 200px 0; } }
@keyframes ap-fade-in-up { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

#page-analista_productos .ap-market-title {
  font-size: 12px; color: var(--ap-text2); line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

/* ══════════════════════════════════════════════════════════════
   PÁGINA DE DETALLE DE PRODUCTO — barra de acciones, hero + card de
   IA, tabs propios (Resumen/Proveedores/Competencia/Tendencias/
   Historial/Afiliados/Calculadora/Análisis IA).
   ══════════════════════════════════════════════════════════════ */
#page-analista_productos .ap-detail { display: flex; flex-direction: column; gap: 24px; position: relative; }

#page-analista_productos .ap-detail-breadcrumb { font-size: 12.5px; color: var(--ap-text2); }
#page-analista_productos .ap-detail-breadcrumb span { margin: 0 6px; opacity: .5; }

#page-analista_productos .ap-detail-actionbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
#page-analista_productos .ap-detail-actions { display: flex; gap: 10px; flex-wrap: wrap; }
#page-analista_productos .ap-btn-publish {
  width: 100%; justify-content: center; margin-top: 18px;
  background: linear-gradient(135deg, var(--ap-green), #059669); color: #fff;
  box-shadow: 0 8px 20px rgba(16,185,129,.30); padding: 15px 20px;
}
#page-analista_productos .ap-btn-publish:hover { box-shadow: 0 14px 30px rgba(16,185,129,.4); transform: translateY(-1px); }

#page-analista_productos .ap-detail-hero-row { display: grid; grid-template-columns: 1fr 400px; gap: 20px; align-items: stretch; }
#page-analista_productos .ap-detail-hero-card {
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg);
  box-shadow: var(--ap-shadow); padding: 28px; display: flex; flex-direction: column; gap: 22px;
}
#page-analista_productos .ap-detail-hero-top { display: flex; gap: 24px; }
#page-analista_productos .ap-detail-info { flex: 1; min-width: 0; }
#page-analista_productos .ap-detail-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
#page-analista_productos .ap-icon-fav {
  flex-shrink: 0; width: 34px; height: 34px; border-radius: 10px; border: 1px solid var(--ap-border);
  background: var(--ap-card); color: var(--ap-text2); display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: color 150ms var(--ap-ease), border-color 150ms var(--ap-ease);
}
#page-analista_productos .ap-icon-fav svg { width: 16px; height: 16px; }
#page-analista_productos .ap-icon-fav:hover,
#page-analista_productos .ap-icon-fav.active { color: var(--ap-orange); border-color: var(--ap-orange); }
#page-analista_productos .ap-icon-fav.active svg { fill: var(--ap-orange); }

#page-analista_productos .ap-mini-kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding-top: 18px; border-top: 1px solid var(--ap-border); }
#page-analista_productos .ap-mini-kpi { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
#page-analista_productos .ap-mini-kpi-label { display: flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 600; color: var(--ap-text2); text-transform: uppercase; letter-spacing: .04em; }
#page-analista_productos .ap-mini-kpi-label svg { width: 13px; height: 13px; flex-shrink: 0; opacity: .7; }
#page-analista_productos .ap-mini-kpi-bar-track { height: 4px; border-radius: 999px; background: var(--ap-border); overflow: hidden; margin: 6px 0 2px; }
#page-analista_productos .ap-mini-kpi-bar-fill { height: 100%; border-radius: 999px; transition: width .6s cubic-bezier(.22,1,.36,1); }
#page-analista_productos .ap-mini-kpi-value { font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
#page-analista_productos .ap-mini-kpi-sub { font-size: 11.5px; color: var(--ap-text2); }
#page-analista_productos .ap-mini-kpi-gauge-row { display: flex; align-items: center; gap: 8px; }

#page-analista_productos .ap-ai-card {
  position: relative; overflow: hidden;
  background: linear-gradient(155deg, rgba(16,185,129,.07) 0%, var(--ap-card) 60%);
  border: 1px solid rgba(16,185,129,.22); border-radius: var(--ap-r-lg); box-shadow: var(--ap-shadow);
  padding: 26px; display: flex; flex-direction: column;
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  animation: ap-fade-in-up .4s var(--ap-ease);
}
#page-analista_productos .ap-ai-card::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 100% 0%, rgba(16,185,129,.12) 0%, transparent 60%);
}
#page-analista_productos .ap-ai-head { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: var(--ap-green); margin-bottom: 10px; }
#page-analista_productos .ap-ai-head svg { width: 18px; height: 18px; }
#page-analista_productos .ap-ai-spinner {
  width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--ap-border); border-top-color: var(--ap-green);
  animation: ap-spin .7s linear infinite; display: inline-block;
}
#page-analista_productos .ap-ai-title { font-size: 20px; font-weight: 800; margin-bottom: 6px; letter-spacing: -.01em; }
#page-analista_productos .ap-ai-sub { font-size: 13.5px; color: var(--ap-text2); line-height: 1.5; }
#page-analista_productos .ap-ai-why {
  font-size: 12.5px; line-height: 1.6; color: var(--ap-text); margin-top: 12px;
  padding: 10px 12px; border-radius: 10px; background: rgba(16,185,129,.08); border: 1px solid rgba(16,185,129,.16);
}
#page-analista_productos .ap-ai-why span { font-weight: 700; color: var(--ap-green); margin-right: 4px; }
#page-analista_productos .ap-ai-insight {
  display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; line-height: 1.6; color: var(--ap-text);
  margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: rgba(59,130,246,.08); border: 1px solid rgba(59,130,246,.16);
}
#page-analista_productos .ap-ai-insight svg { width: 15px; height: 15px; flex-shrink: 0; color: var(--ap-blue); margin-top: 1px; }
#page-analista_productos .ap-ai-insight b { color: var(--ap-blue); }
#page-analista_productos .ap-ai-table { margin-top: 16px; display: flex; flex-direction: column; gap: 9px; }
#page-analista_productos .ap-ai-row { display: flex; justify-content: space-between; font-size: 13px; padding-bottom: 9px; border-bottom: 1px solid var(--ap-border); }
#page-analista_productos .ap-ai-row span { color: var(--ap-text2); }

#page-analista_productos .ap-ai-ask-row { display: flex; gap: 8px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--ap-border); }
#page-analista_productos .ap-ai-ask-row .ap-search { flex: 1; padding: 9px 14px; font-size: 13px; }
#page-analista_productos .ap-ai-ask-answer { font-size: 13.5px; line-height: 1.6; margin-top: 12px; padding: 12px 14px; border-radius: 10px; background: var(--ap-bg); white-space: pre-wrap; }
#page-analista_productos .ap-ai-ask-loading { display: flex; align-items: center; gap: 8px; color: var(--ap-text2); }

#page-analista_productos .ap-tabs {
  display: flex; gap: 4px; border-bottom: 1px solid var(--ap-border); overflow-x: auto; scrollbar-width: none;
}
#page-analista_productos .ap-tabs::-webkit-scrollbar { display: none; }
#page-analista_productos .ap-tab-item {
  background: none; border: none; padding: 12px 16px; font-size: 13.5px; font-weight: 600; color: var(--ap-text2);
  cursor: pointer; white-space: nowrap; border-bottom: 2px solid transparent; margin-bottom: -1px;
  transition: color 150ms var(--ap-ease), border-color 150ms var(--ap-ease); font-family: inherit;
}
#page-analista_productos .ap-tab-item:hover { color: var(--ap-text); }
#page-analista_productos .ap-tab-item.active { color: var(--ap-blue); border-bottom-color: var(--ap-blue); }

#page-analista_productos .ap-detail-grid { display: grid; grid-template-columns: 1fr 340px; gap: 20px; align-items: start; }
#page-analista_productos .ap-detail-col-main { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
#page-analista_productos .ap-detail-col-side { display: flex; flex-direction: column; gap: 20px; }
#page-analista_productos .ap-charts-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

#page-analista_productos .ap-panel {
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg);
  box-shadow: var(--ap-shadow); padding: 24px;
}
#page-analista_productos .ap-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
#page-analista_productos .ap-panel-title { font-size: 16px; font-weight: 700; letter-spacing: -.01em; }

#page-analista_productos .ap-range-btns { display: flex; gap: 4px; background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 999px; padding: 3px; }
#page-analista_productos .ap-range-btn {
  background: none; border: none; padding: 5px 11px; font-size: 11.5px; font-weight: 600; color: var(--ap-text2);
  border-radius: 999px; cursor: pointer; font-family: inherit; transition: background 150ms var(--ap-ease), color 150ms var(--ap-ease);
}
#page-analista_productos .ap-range-btn.active { background: var(--ap-card); color: var(--ap-blue); box-shadow: var(--ap-shadow); }

#page-analista_productos .ap-best-tag {
  display: inline-flex; align-items: center; gap: 5px; align-self: flex-start;
  background: rgba(16,185,129,.12); color: var(--ap-green); font-size: 11px; font-weight: 700;
  padding: 4px 10px; border-radius: 999px; margin-top: 4px;
}
#page-analista_productos .ap-best-tag svg { width: 12px; height: 12px; }

#page-analista_productos .ap-renta-hero { text-align: center; padding: 18px 0 20px; margin-bottom: 4px; border-bottom: 1px solid var(--ap-border); }
#page-analista_productos .ap-renta-hero-label { font-size: 11.5px; font-weight: 600; color: var(--ap-text2); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 6px; }
#page-analista_productos .ap-renta-hero-value { font-size: 34px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
#page-analista_productos .ap-renta-rows { display: flex; flex-direction: column; gap: 8px; }
#page-analista_productos .ap-renta-row { display: flex; justify-content: space-between; font-size: 13px; color: var(--ap-text2); }
#page-analista_productos .ap-renta-row b { color: var(--ap-text); }

@media (max-width: 1200px) {
  #page-analista_productos .ap-detail-hero-row { grid-template-columns: 1fr; }
  #page-analista_productos .ap-detail-grid { grid-template-columns: 1fr; }
  #page-analista_productos .ap-charts-row { grid-template-columns: 1fr; }
  #page-analista_productos .ap-mini-kpi-row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 760px) {
  #page-analista_productos .ap-detail-hero-top { flex-direction: column; } }

/* ── FAB de acciones rápidas (Exportar/Seguir/Publicar, ya reales) ── */
#page-analista_productos .ap-fab-wrap { position: fixed; right: 32px; bottom: 32px; z-index: 40; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
#page-analista_productos .ap-fab-toggle {
  width: 52px; height: 52px; border-radius: 50%; border: none; cursor: pointer;
  background: linear-gradient(135deg, var(--ap-blue), #1d4ed8); color: #fff;
  box-shadow: 0 10px 26px rgba(59,130,246,.4); display: flex; align-items: center; justify-content: center;
  transition: transform 200ms var(--ap-ease), box-shadow 200ms var(--ap-ease);
}
#page-analista_productos .ap-fab-toggle svg { width: 22px; height: 22px; transition: transform 200ms var(--ap-ease); }
#page-analista_productos .ap-fab-toggle:hover { box-shadow: 0 14px 34px rgba(59,130,246,.5); transform: translateY(-2px); }
#page-analista_productos .ap-fab-wrap.open .ap-fab-toggle svg { transform: rotate(45deg); }
#page-analista_productos .ap-fab-menu {
  display: flex; flex-direction: column; gap: 8px; opacity: 0; pointer-events: none;
  transform: translateY(8px); transition: opacity 180ms var(--ap-ease), transform 180ms var(--ap-ease);
}
#page-analista_productos .ap-fab-wrap.open .ap-fab-menu { opacity: 1; pointer-events: auto; transform: translateY(0); }
#page-analista_productos .ap-fab-menu button {
  display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 999px; border: 1px solid var(--ap-border);
  background: var(--ap-card); color: var(--ap-text); font-size: 13px; font-weight: 600; cursor: pointer;
  box-shadow: var(--ap-shadow); white-space: nowrap;
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
}
#page-analista_productos .ap-fab-menu button svg { width: 15px; height: 15px; }
#page-analista_productos .ap-fab-menu button:hover { border-color: var(--ap-blue); color: var(--ap-blue); }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 1200px) {
  #page-analista_productos .ap-kpi-grid   { grid-template-columns: repeat(2, 1fr); }
  #page-analista_productos .ap-score-grid { grid-template-columns: repeat(3, 1fr); }
  #page-analista_productos .ap-profit-panel { grid-template-columns: repeat(2, 1fr); }
}
/* Ítems de grid/flex con texto largo no deben forzar overflow —
   por defecto un grid/flex item no se achica por debajo de su
   contenido (min-width:auto); hay que pedirlo explícitamente en
   cada nivel de contenedor flex/grid de todo el módulo. */
#page-analista_productos .ap-shell > *, #page-analista_productos .ap-hero > div, #page-analista_productos .ap-kpi-card > div, #page-analista_productos .ap-kpi-grid > *, #page-analista_productos .ap-market-grid > *, #page-analista_productos .ap-affiliate-grid > *, #page-analista_productos .ap-score-grid > *, #page-analista_productos .ap-market-top > *, #page-analista_productos .ap-affiliate-card > *, #page-analista_productos .ap-affiliate-info {
  min-width: 0;
}
#page-analista_productos .ap-hero-title { overflow-wrap: break-word; }

@media (max-width: 760px) {
  #page-analista_productos .ap-shell { width: 100%; padding: 20px 16px 60px; gap: 36px; max-width: 100%; }
  #page-analista_productos .ap-hero  { grid-template-columns: 1fr; padding: 24px; }
  #page-analista_productos .ap-hero-img-wrap { width: 140px; height: 140px; }
  #page-analista_productos .ap-hero-title { font-size: 26px; }
  #page-analista_productos .ap-kpi-grid     { grid-template-columns: repeat(2, 1fr); }
  #page-analista_productos .ap-market-grid,
  #page-analista_productos .ap-affiliate-grid { grid-template-columns: 1fr; }
  #page-analista_productos .ap-score-grid   { grid-template-columns: repeat(2, 1fr); }
  #page-analista_productos .ap-profit-panel { grid-template-columns: 1fr 1fr; gap: 20px; padding: 24px; }
  #page-analista_productos .ap-affiliate-card { flex-wrap: wrap; }
  #page-analista_productos .ap-affiliate-card .ap-btn { white-space: normal; } }
@media (max-width: 420px) {
  #page-analista_productos .ap-kpi-grid  { grid-template-columns: 1fr 1fr; }
  #page-analista_productos .ap-profit-panel { grid-template-columns: 1fr 1fr; } }

/* ── Modal ap-scoped (settings de proveedores) ───────────────────── */
#page-analista_productos .ap-modal-overlay {
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(15, 23, 42, .45);
  display: none; align-items: center; justify-content: center;
  padding: 20px;
}
#page-analista_productos .ap-modal-overlay.show { display: flex; }
#page-analista_productos .ap-modal-box {
  background: var(--ap-card); color: var(--ap-text);
  border-radius: var(--ap-r-lg); box-shadow: var(--ap-shadow-hov);
  width: 100%; max-width: 520px; max-height: 85vh;
  display: flex; flex-direction: column; overflow: hidden;
}
#page-analista_productos .ap-modal-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 24px; border-bottom: 1px solid var(--ap-border);
  font-size: 16px; font-weight: 700;
}
#page-analista_productos .ap-modal-close {
  border: none; background: none; cursor: pointer; color: var(--ap-text2);
  font-size: 20px; line-height: 1; padding: 4px;
}
#page-analista_productos .ap-modal-body { padding: 24px; overflow-y: auto; display: flex; flex-direction: column; gap: 18px; }
#page-analista_productos .ap-modal-footer { padding: 16px 24px; border-top: 1px solid var(--ap-border); display: flex; justify-content: flex-end; gap: 10px; }
#page-analista_productos .ap-modal-box.ap-modal-wide { max-width: 920px; }
#page-analista_productos .ap-btn-sm { padding: 6px 12px; font-size: 11.5px; }

/* ── Publicaciones de MercadoLibre (listado + edición real) ── */
#page-analista_productos .ap-listings-body { padding: 20px 24px; overflow-y: auto; max-height: 70vh; }
#page-analista_productos .ap-listings-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
#page-analista_productos .ap-listings-table th {
  text-align: left; padding: 8px 10px; color: var(--ap-text2); font-weight: 600;
  font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; border-bottom: 1px solid var(--ap-border);
}
#page-analista_productos .ap-listings-table td { padding: 8px 10px; border-bottom: 1px solid var(--ap-border); vertical-align: middle; }
#page-analista_productos .ap-listings-table a { color: var(--ap-blue); text-decoration: none; }
#page-analista_productos .ap-listing-avatars { display: flex; gap: 4px; }
#page-analista_productos .ap-listing-avatars img { width: 44px; height: 44px; object-fit: contain; border-radius: 8px; background: var(--ap-bg); }
#page-analista_productos .ap-listing-avatar-empty {
  width: 44px; height: 44px; border-radius: 8px; background: var(--ap-bg); color: var(--ap-border);
  display: flex; align-items: center; justify-content: center; font-size: 18px;
}

#page-analista_productos .ap-edit-layout { display: grid; grid-template-columns: 260px 1fr; gap: 22px; padding: 22px 24px; }
#page-analista_productos .ap-edit-gallery { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; }
#page-analista_productos .ap-edit-gallery img { width: 100%; border-radius: 10px; background: var(--ap-bg); object-fit: contain; }
#page-analista_productos .ap-edit-fields { display: flex; flex-direction: column; gap: 12px; }
#page-analista_productos .ap-edit-permalink { font-size: 12px; color: var(--ap-blue); text-decoration: none; margin-top: -8px; }
#page-analista_productos .ap-edit-field { display: flex; flex-direction: column; gap: 5px; font-size: 11.5px; color: var(--ap-text2); font-weight: 600; }
#page-analista_productos .ap-edit-field input, #page-analista_productos .ap-edit-field textarea {
  background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 8px; padding: 9px 10px;
  color: var(--ap-text); font-size: 13px; font-family: inherit; outline: none;
}
#page-analista_productos .ap-edit-field input:focus, #page-analista_productos .ap-edit-field textarea:focus { border-color: var(--ap-blue); }
#page-analista_productos .ap-edit-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 6px; }

/* ── Editor de publicación ML — pedido explícito 2026-08-20: ampliado a
   título/SKU/cantidad/atributos/categoría/fotos (antes solo precio/peso/
   descripción), estética con los colores de marca de ML ya usados en el
   resto de la app (apPfMarketBadgeHtml: #FFE600/#2D3277). ── */
#page-analista_productos .ap-edit-ml-hdr { background: linear-gradient(90deg, #2D3277, #3A3F94); border-radius: 12px 12px 0 0; }
#page-analista_productos .ap-edit-ml-hdr .ap-modal-title { color: #FFE600; font-weight: 800; }
#page-analista_productos .ap-edit-ml-hdr .ap-modal-close { color: #fff; }
#page-analista_productos .ap-edit-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
#page-analista_productos .ap-edit-gallery-item { position: relative; width: 76px; height: 76px; flex-shrink: 0; }
#page-analista_productos .ap-edit-gallery-item img { width: 100%; height: 100%; border-radius: 10px; background: var(--ap-bg); object-fit: cover; }
#page-analista_productos .ap-edit-gallery-remove {
  position: absolute; top: -6px; right: -6px; width: 20px; height: 20px; border-radius: 999px;
  background: #dc2626; color: #fff; border: 2px solid var(--ap-card); font-size: 11px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
}
#page-analista_productos .ap-edit-gallery-add {
  width: 76px; height: 76px; flex-shrink: 0; border-radius: 10px; border: 1.5px dashed var(--ap-border);
  display: flex; align-items: center; justify-content: center; font-size: 26px; color: var(--ap-text2);
  cursor: pointer; transition: border-color 150ms var(--ap-ease), color 150ms var(--ap-ease);
}
#page-analista_productos .ap-edit-gallery-add:hover { border-color: #FFE600; color: var(--ap-text); }
#page-analista_productos .ap-edit-category-row { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 8px; position: relative; }
#page-analista_productos .ap-edit-category-label { font-size: 11.5px; color: var(--ap-text2); }
#page-analista_productos .ap-edit-category-current { font-size: 13px; color: var(--ap-text); font-weight: 700; }
#page-analista_productos #apEditCategorySearch {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 8;
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: 10px;
  box-shadow: var(--ap-shadow-hov); padding: 10px; display: flex; flex-direction: column; gap: 8px;
}
#page-analista_productos .ap-edit-cat-search-row { display: flex; gap: 8px; }
#page-analista_productos .ap-edit-cat-search-row input {
  flex: 1; background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 8px;
  padding: 8px 10px; color: var(--ap-text); font-size: 12.5px; font-family: inherit; outline: none;
}
#page-analista_productos .ap-edit-attr-row { display: grid; grid-template-columns: 140px 1fr; gap: 8px; align-items: center; margin-bottom: 6px; }
#page-analista_productos .ap-edit-attr-name { font-size: 12px; color: var(--ap-text2); font-weight: 600; }
#page-analista_productos .ap-edit-attr-row input {
  background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 8px; padding: 7px 9px;
  color: var(--ap-text); font-size: 12.5px; font-family: inherit; outline: none;
}
#page-analista_productos #apEditSave { background: #FFE600; color: #2D3277; border: none; font-weight: 800; }
#page-analista_productos #apEditSave:hover { background: #f7dc00; }
#page-analista_productos .ap-btn-ai {
  background: linear-gradient(135deg,#8248ff,#22d3ee); color: #fff; border: none; border-radius: 9px;
  padding: 9px 14px; font-size: 12.5px; font-weight: 700; cursor: pointer; white-space: nowrap;
}
#page-analista_productos .ap-btn-ai:disabled { opacity: .6; cursor: not-allowed; }
#page-analista_productos .ap-btn-manual-cat {
  background: none; border: none; color: var(--ap-blue); opacity: .9; text-decoration: underline;
  font-size: 11px; font-weight: 600; cursor: pointer; padding: 0 0 4px; text-align: left; width: fit-content;
}

#page-analista_productos .ap-provider-card {
  border: 1px solid var(--ap-border); border-radius: var(--ap-r-sm); padding: 16px;
}
#page-analista_productos .ap-provider-hdr { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
#page-analista_productos .ap-provider-name { font-weight: 700; font-size: 14px; }
#page-analista_productos .ap-provider-badge { font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
#page-analista_productos .ap-provider-badge.on  { background: rgba(16,185,129,.12); color: var(--ap-green); }
#page-analista_productos .ap-provider-badge.off { background: rgba(102,112,133,.12); color: var(--ap-text2); }
#page-analista_productos .ap-provider-note { font-size: 12px; color: var(--ap-text2); margin-bottom: 10px; }
#page-analista_productos .ap-provider-form { display: flex; flex-direction: column; gap: 8px; }
#page-analista_productos .ap-provider-form input {
  border: 1px solid var(--ap-border); border-radius: 10px; padding: 9px 12px;
  font-size: 13px; font-family: inherit; background: var(--ap-bg); color: var(--ap-text);
}

/* ── Canales de Venta — cards de conexión + stats (apRenderCanalesVentaView) ── */
#page-analista_productos .ap-channels-grid { display: flex; flex-direction: column; gap: 16px; max-width: 640px; }
#page-analista_productos .ap-channel-kpis { grid-template-columns: repeat(auto-fit, minmax(160px, 220px)); margin: 14px 0; }
#page-analista_productos .ap-channel-connect-form { display: flex; gap: 8px; margin-top: 10px; }
#page-analista_productos .ap-channel-connect-form input { flex: 1; }

/* ══════════════════════════════════════════════════════════════
   GRILLA DE RESULTADOS — topbar + filtros + cards enriquecidas
   Vista que se muestra apenas termina una búsqueda. Extiende los
   mismos tokens --ap-* y reusa .ap-market-grid/.ap-market-card/
   .ap-market-title/.ap-market-stock/.ap-kpi-value/.ap-kpi-label
   ya existentes — nunca un sistema de color paralelo.
   ══════════════════════════════════════════════════════════════ */
#page-analista_productos .ap-results-page { display: flex; flex-direction: column; gap: 20px; }

/* ── Categoría + señales de oportunidad/ganancia en la card (pedido
   explícito 2026-08-21 — reemplaza el aparato de comparación de precios:
   topbar de tiendas, fila de KPIs, sidebar de filtros y vista tabla,
   todos eliminados junto con este bloque) ── */
#page-analista_productos .ap-card-meta-row {
  display: flex; gap: 8px; flex-wrap: wrap; font-size: 11px; color: var(--ap-text2);
}
#page-analista_productos .ap-card-signals-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#page-analista_productos .ap-oport-badge {
  font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
  background: rgba(59,130,246,.10); color: var(--ap-blue);
}

/* ── Card enriquecida (9 puntos): favorito, comparar, stock, ROI ──
   Favorito/comparar/badge de estado viven DENTRO de la foto (esquinas),
   no flotando arriba de toda la card. */
#page-analista_productos .ap-result-card { position: relative; }
#page-analista_productos .ap-card-image-wrap {
  position: relative; width: 100%; aspect-ratio: 1 / 1; border-radius: 12px; overflow: hidden;
  background: var(--ap-bg); display: flex; align-items: center; justify-content: center;
}
#page-analista_productos .ap-card-image-wrap img { width: 100%; height: 100%; object-fit: contain; }
#page-analista_productos .ap-icon-compare,
#page-analista_productos .ap-icon-fav-card {
  position: absolute; top: 10px; z-index: 2;
  width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--ap-border);
  background: var(--ap-card); color: var(--ap-text2); opacity: .92;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  transition: color 150ms var(--ap-ease), border-color 150ms var(--ap-ease), transform 150ms var(--ap-ease), background 150ms var(--ap-ease);
}
#page-analista_productos .ap-icon-compare { left: 10px; }
#page-analista_productos .ap-icon-fav-card { right: 10px; }
#page-analista_productos .ap-icon-compare svg, #page-analista_productos .ap-icon-fav-card svg { width: 14px; height: 14px; }
#page-analista_productos .ap-icon-compare:hover, #page-analista_productos .ap-icon-fav-card:hover { transform: scale(1.1); opacity: 1; }
#page-analista_productos .ap-icon-compare.active { color: #fff; background: var(--ap-blue); border-color: var(--ap-blue); opacity: 1; }
#page-analista_productos .ap-icon-fav-card.active { color: #fff; background: #EF4444; border-color: #EF4444; opacity: 1; }
#page-analista_productos .ap-photo-badge {
  position: absolute; left: 10px; bottom: 10px; z-index: 2;
  font-size: 10.5px; font-weight: 800; padding: 5px 11px; border-radius: 999px;
  color: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.18);
}
#page-analista_productos .ap-photo-badge-best { background: var(--ap-green); }
#page-analista_productos .ap-photo-badge-offer { background: #EC4899; }
#page-analista_productos .ap-market-title {
  color: var(--ap-text); text-decoration: none; display: -webkit-box;
  transition: color 150ms var(--ap-ease);
}
#page-analista_productos .ap-market-title:hover { color: var(--ap-blue); text-decoration: underline; }
#page-analista_productos .ap-card-seller-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
#page-analista_productos .ap-card-rating { font-size: 12px; font-weight: 700; color: var(--ap-orange); white-space: nowrap; }
#page-analista_productos .ap-card-roi {
  font-size: 12.5px; font-weight: 700; background: rgba(16,185,129,.08);
  padding: 8px 10px; border-radius: 10px;
}

/* ── Cards de producto (imagen + datos) — más chicas y con bordes
   cuadrados. Escopeado a .ap-result-card para no afectar las demás cards
   genéricas que reusan .ap-market-card (proveedores, monitores, inventario,
   pedidos, etc.), que no tienen imagen y necesitan su padding actual. ──── */
#page-analista_productos .ap-market-card.ap-result-card {
  padding: 16px;
  gap: 10px;
  border-radius: 0;
}
#page-analista_productos .ap-market-card.ap-result-card .ap-card-image-wrap {
  border-radius: 0;
}
#page-analista_productos .ap-market-card.ap-result-card .ap-market-price {
  font-size: 22px;
}

/* ── Barra flotante de comparación (selección múltiple) ──────────── */
#page-analista_productos .ap-compare-bar {
  position: fixed; left: 50%; bottom: -100px; transform: translateX(-50%);
  z-index: 500; transition: bottom 220ms var(--ap-ease);
}
#page-analista_productos .ap-compare-bar.show { bottom: 24px; }
#page-analista_productos .ap-compare-bar-inner {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap; max-width: 92vw;
  background: var(--ap-card); color: var(--ap-text);
  border: 1px solid var(--ap-border); box-shadow: var(--ap-shadow-hov);
  padding: 12px 16px; border-radius: var(--ap-r-lg); font-size: 13px; font-weight: 600;
}
#page-analista_productos .ap-compare-bar-inner .ap-btn { padding: 8px 12px; font-size: 12px; gap: 6px; }
#page-analista_productos .ap-compare-bar-inner .ap-btn svg { width: 13px; height: 13px; }
#page-analista_productos .ap-bulk-publish-form {
  display: flex; gap: 8px; margin-top: 8px; padding: 10px 12px;
  background: var(--ap-card); border: 1px solid var(--ap-border);
  border-radius: var(--ap-r-sm); box-shadow: var(--ap-shadow-hov);
}
#page-analista_productos .ap-bulk-publish-form .ap-search { padding: 8px 12px; font-size: 12.5px; width: 220px; }
#page-analista_productos .ap-bulk-publish-form .ap-btn { padding: 8px 14px; font-size: 12px; white-space: nowrap; }
#page-analista_productos .ap-model-chips {
  display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 18px;
  scrollbar-width: none;
}
#page-analista_productos .ap-model-chips::-webkit-scrollbar { display: none; }
#page-analista_productos .ap-chip {
  flex-shrink: 0; white-space: nowrap; padding: 9px 16px; border-radius: 999px;
  border: 1px solid var(--ap-border); background: var(--ap-card); color: var(--ap-text2);
  font-size: 12.5px; font-weight: 700; font-family: inherit; cursor: pointer;
  transition: border-color 150ms var(--ap-ease), color 150ms var(--ap-ease), background 150ms var(--ap-ease);
}
#page-analista_productos .ap-chip:hover { border-color: rgba(59,130,246,.35); color: var(--ap-text); }
#page-analista_productos .ap-chip.active { background: rgba(59,130,246,.12); border-color: var(--ap-blue); color: var(--ap-blue); }

/* ── Filas de producto (mismo producto, distintas tiendas) ───────── */
#page-analista_productos .ap-product-rows { display: flex; flex-direction: column; gap: 32px; }
#page-analista_productos .ap-product-row-kicker {
  font-size: 11px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase;
  color: var(--ap-blue); margin-bottom: 4px;
}
#page-analista_productos .ap-product-row-head {
  display: flex; align-items: baseline; gap: 10px; margin-bottom: 14px;
  font-size: 15px; font-weight: 800; letter-spacing: -.01em;
}
#page-analista_productos .ap-product-row-count { font-size: 12px; font-weight: 600; color: var(--ap-text2); }
#page-analista_productos .ap-product-row-cards {
  display: flex; gap: 20px; overflow-x: auto; padding-bottom: 6px;
}
#page-analista_productos .ap-product-row-cards::-webkit-scrollbar { height: 6px; }
#page-analista_productos .ap-product-row-cards::-webkit-scrollbar-thumb { background: var(--ap-border); border-radius: 999px; }

@media (max-width: 640px) {
  #page-analista_productos .ap-product-row-cards .ap-market-card { flex-basis: 7cm; width: 7cm; } }

/* ── Logo circular en el pie de la card (apMarketLogoCircleHtml) — pedido
   explícito: centrado, ~1.5cm de diámetro, imagen real vía logo.clearbit.com
   con fallback a inicial+color de marca si no carga. ── */
#page-analista_productos .ap-market-footer-logo {
  display: flex; justify-content: center; align-items: center; width: 100%; padding-top: 4px;
}
#page-analista_productos .ap-market-logo-circle {
  position: relative; width: 1.5cm; height: 1.5cm; min-width: 1.5cm; min-height: 1.5cm;
  border-radius: 50%; margin: 0 auto; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 800; flex-shrink: 0; line-height: 1;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
}
#page-analista_productos .ap-market-logo-circle span {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;
}
#page-analista_productos .ap-market-logo-circle img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
  background: #fff; padding: 5px; box-sizing: border-box; margin: 0;
}

/* ── Ancho fijo (7cm) para toda card que muestra un producto — pedido
   explícito, para que las cards de imagen+precio+logo sean consistentes
   en cualquier vista (grilla de Productos/Oportunidades, fila de la
   búsqueda). Escopeado a .ap-result-card (marca las cards CON imagen de
   producto, ver comentario más arriba) — no toca las cards genéricas sin
   imagen (proveedores, inventario, etc) que reusan .ap-market-card. ── */
#page-analista_productos .ap-market-card.ap-result-card { width: 7cm; }
#page-analista_productos .ap-market-grid:has(.ap-result-card) { grid-template-columns: repeat(auto-fill, 7cm); }
#page-analista_productos .ap-product-row-cards .ap-market-card { flex: 0 0 7cm; width: 7cm; }

/* ── Skeletons de carga (reemplaza spinners genéricos) ───────────── */
#page-analista_productos .ap-skeleton-card { cursor: default; }
#page-analista_productos .ap-skeleton-card:hover { transform: none; box-shadow: var(--ap-shadow); }
#page-analista_productos .ap-skeleton-block {
  background: linear-gradient(90deg, var(--ap-border) 25%, rgba(120,120,120,.15) 37%, var(--ap-border) 63%);
  background-size: 400% 100%;
  animation: ap-skeleton-shimmer 1.4s ease infinite;
  border-radius: 8px;
}
#page-analista_productos .ap-skeleton-image { width: 100%; aspect-ratio: 1 / 1; border-radius: 12px; }
#page-analista_productos .ap-skeleton-line { height: 14px; }
@keyframes ap-skeleton-shimmer {
  0%   { background-position: 100% 50%; }
  100% { background-position: 0 50%; }
}
@media (prefers-reduced-motion: reduce) {
  #page-analista_productos .ap-skeleton-block { animation: none; } }

/* ═══════════════════════════════════════════════════════════════
   Modal de scrapeo en vivo (Analista de Comercios) — SIN el prefijo
   #page-analista_productos a propósito: el nodo se cuelga directo de
   document.body (ver apEnsureLiveScanModalEl en analistaProductos.js)
   para que "Minimizar" sobreviva navegar a CUALQUIER otra sección de
   la app mientras el scan sigue corriendo — un descendiente de
   #page-analista_productos no vería nada de eso si esa página queda
   oculta. Paleta propia y autocontenida (no depende de --ap-* ni de
   ningún tema heredado) para que se vea igual sin importar qué página
   esté activa detrás.
   ═══════════════════════════════════════════════════════════════ */
.ap-livescan-overlay {
  position: fixed; inset: 0; z-index: 5000;
  background: rgba(8, 11, 20, .55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
}
.ap-livescan-box {
  width: 100%; max-width: 720px; max-height: 82vh;
  background: #12141C; color: #E8EAF0;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px; box-shadow: 0 24px 60px rgba(0,0,0,.5);
  display: flex; flex-direction: column; overflow: hidden;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.ap-livescan-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid rgba(255,255,255,.08);
  font-size: 14.5px; font-weight: 700;
}
.ap-livescan-icon-btn {
  width: 28px; height: 28px; border-radius: 8px; border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04); color: #E8EAF0; cursor: pointer;
  display: flex; align-items: center; justify-content: center; font-size: 13px;
  transition: background 150ms ease;
}
.ap-livescan-icon-btn:hover { background: rgba(255,255,255,.1); }
.ap-livescan-body { padding: 16px 20px; overflow-y: auto; display: flex; flex-direction: column; gap: 20px; }
.ap-livescan-job { display: flex; flex-direction: column; gap: 8px; }
.ap-livescan-job-hdr { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ap-livescan-job-url {
  font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; color: #93C5FD;
}
.ap-livescan-bar-track { height: 6px; border-radius: 999px; background: rgba(255,255,255,.08); overflow: hidden; }
.ap-livescan-bar-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #3B82F6, #34D399); transition: width 400ms ease; }
.ap-livescan-status { font-size: 12px; color: #8B92A5; }
.ap-livescan-error { font-size: 12.5px; color: #F87171; }
.ap-livescan-items {
  display: flex; flex-direction: column; gap: 6px; max-height: 220px; overflow-y: auto;
  border: 1px solid rgba(255,255,255,.06); border-radius: 10px; padding: 8px;
}
.ap-livescan-empty { font-size: 12px; color: #8B92A5; text-align: center; padding: 12px; }
.ap-livescan-item {
  display: flex; align-items: center; gap: 10px; padding: 4px;
  animation: ap-livescan-fade-in 250ms ease both;
}
@keyframes ap-livescan-fade-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.ap-livescan-item-thumb {
  width: 32px; height: 32px; border-radius: 6px; flex-shrink: 0;
  background: rgba(255,255,255,.06) center/cover no-repeat;
}
.ap-livescan-item-info { min-width: 0; flex: 1; display: flex; flex-direction: column; }
.ap-livescan-item-title { font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-livescan-item-price { font-size: 11px; color: #34D399; font-weight: 700; line-height: 1.6; }
.ap-livescan-iva-tag { font-size: 9.5px; color: #A0A0B8; font-weight: 600; }

/* ── Estado minimizado — pill fijo abajo a la derecha ────────────── */
.ap-livescan-pill {
  position: fixed; right: 24px; bottom: 24px; z-index: 5000;
  display: flex; align-items: center; gap: 6px;
  background: #12141C; color: #E8EAF0;
  border: 1px solid rgba(255,255,255,.1); border-radius: 999px;
  box-shadow: 0 12px 30px rgba(0,0,0,.4);
  padding: 4px 6px 4px 16px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}
.ap-livescan-pill-btn {
  display: flex; align-items: center; gap: 8px; background: none; border: none;
  color: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; padding: 8px 4px;
}
.ap-livescan-pill-spin {
  width: 12px; height: 12px; border-radius: 50%;
  border: 2px solid rgba(255,255,255,.15); border-top-color: #3B82F6;
  animation: ap-livescan-spin 900ms linear infinite;
}
@keyframes ap-livescan-spin { to { transform: rotate(360deg); } }
.ap-livescan-pill-close {
  width: 24px; height: 24px; border-radius: 50%; border: none;
  background: rgba(255,255,255,.06); color: #8B92A5; cursor: pointer; font-size: 12px;
}
.ap-livescan-pill-close:hover { background: rgba(255,255,255,.12); color: #E8EAF0; }

/* ══════════════════════════════════════════════════════════════
   Dashboard real (pedido explícito 22/08/2026) — reemplaza el banner
   de saludo + 3 KPIs + gráfico 3D por un centro de decisiones real,
   cada sección conectada a datos reales (GET /catalog/dashboard-v2 +
   /api/intelligence/dashboard). Mismos tokens --ap-* que el resto del
   módulo — nada de paleta nueva.
   ══════════════════════════════════════════════════════════════ */
#page-analista_productos .ap-dash-topbar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 22px;
}
#page-analista_productos .ap-dash-period-group {
  display: flex; background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: 999px; padding: 3px;
}
#page-analista_productos .ap-dash-period-pill {
  padding: 7px 14px; border-radius: 999px; font-size: 12.5px; font-weight: 600; color: var(--ap-text2); cursor: pointer; border: none; background: none; font-family: inherit;
}
#page-analista_productos .ap-dash-period-pill.active { background: rgba(59,130,246,.12); color: var(--ap-blue); }

#page-analista_productos .ap-dash-kpi-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-bottom: 22px; }
@media (max-width: 1400px) { #page-analista_productos .ap-dash-kpi-grid { grid-template-columns: repeat(3, 1fr); } }
#page-analista_productos .ap-dash-kpi-card {
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-sm); box-shadow: var(--ap-shadow);
  padding: 18px; display: flex; flex-direction: column; gap: 12px; min-height: 130px;
}
#page-analista_productos .ap-dash-kpi-value { font-size: 20px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; margin-top: 2px; }
#page-analista_productos .ap-dash-kpi-delta { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 700; }
#page-analista_productos .ap-dash-kpi-delta svg { width: 11px; height: 11px; }
#page-analista_productos .ap-dash-delta-up { color: var(--ap-green); }
#page-analista_productos .ap-dash-delta-down { color: var(--ap-red); }
#page-analista_productos .ap-dash-delta-neutral { color: var(--ap-text2); }

#page-analista_productos .ap-dash-row2 { display: grid; grid-template-columns: 2fr 1fr; gap: 20px; margin-bottom: 22px; align-items: stretch; }
#page-analista_productos .ap-dash-row2-even { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 22px; align-items: stretch; }
@media (max-width: 1100px) { #page-analista_productos .ap-dash-row2, #page-analista_productos .ap-dash-row2-even { grid-template-columns: 1fr; } }
#page-analista_productos .ap-dash-card {
  background: var(--ap-card); border: 1px solid var(--ap-border); border-radius: var(--ap-r-lg); box-shadow: var(--ap-shadow); padding: 22px; margin-bottom: 22px;
}
#page-analista_productos .ap-dash-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }

#page-analista_productos .ap-dash-status-row { display: flex; align-items: center; gap: 12px; padding: 11px 2px; border-bottom: 1px solid var(--ap-border); }
#page-analista_productos .ap-dash-status-row:last-child { border-bottom: none; }
#page-analista_productos .ap-dash-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
#page-analista_productos .ap-dash-dot-green { background: var(--ap-green); box-shadow: 0 0 0 3px rgba(16,185,129,.15); }
#page-analista_productos .ap-dash-dot-orange { background: var(--ap-orange); box-shadow: 0 0 0 3px rgba(245,158,11,.15); }
#page-analista_productos .ap-dash-dot-red { background: var(--ap-red); box-shadow: 0 0 0 3px rgba(239,68,68,.15); }
#page-analista_productos .ap-dash-status-name { font-size: 13px; font-weight: 700; flex: 1; }
#page-analista_productos .ap-dash-status-val { font-size: 12px; color: var(--ap-text2); font-weight: 600; }

#page-analista_productos .ap-dash-visitas-scroll { max-height: 420px; overflow-y: auto; }
#page-analista_productos .ap-dash-listing-row {
  display: flex; align-items: center; gap: 12px; padding: 11px 2px; border-bottom: 1px solid var(--ap-border);
  text-decoration: none; color: inherit; transition: background 120ms var(--ap-ease);
}
#page-analista_productos .ap-dash-listing-row:hover { background: rgba(255,255,255,.03); }
#page-analista_productos .ap-dash-listing-row:last-child { border-bottom: none; }
#page-analista_productos .ap-dash-listing-thumb { width: 36px; height: 36px; border-radius: 9px; background: var(--ap-bg); border: 1px solid var(--ap-border); flex-shrink: 0; }
#page-analista_productos .ap-dash-listing-info { flex: 1; min-width: 0; }
#page-analista_productos .ap-dash-listing-title { font-size: 12.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-analista_productos .ap-dash-listing-meta { font-size: 11px; color: var(--ap-text2); font-weight: 600; margin-top: 1px; }
#page-analista_productos .ap-dash-visits-block { text-align: center; min-width: 48px; flex-shrink: 0; }
#page-analista_productos .ap-dash-visits-num { font-size: 16px; font-weight: 800; font-variant-numeric: tabular-nums; }
#page-analista_productos .ap-dash-visits-sub { font-size: 9px; color: var(--ap-text2); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }

#page-analista_productos .ap-dash-prov-row { display: flex; align-items: center; gap: 10px; padding: 8px 2px; border-bottom: 1px solid var(--ap-border); font-size: 12.5px; }
#page-analista_productos .ap-dash-prov-row:last-child { border-bottom: none; }
#page-analista_productos .ap-dash-prov-name { font-weight: 700; flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-analista_productos .ap-dash-prov-count { color: var(--ap-text2); font-weight: 600; font-size: 11.5px; }
#page-analista_productos .ap-dash-alert-line {
  display: flex; align-items: center; gap: 10px; background: rgba(245,158,11,.08); border: 1px solid rgba(245,158,11,.25);
  border-radius: 11px; padding: 11px 14px; margin-top: 14px; font-size: 12px; font-weight: 600;
}
#page-analista_productos .ap-dash-alert-line svg { width: 15px; height: 15px; color: var(--ap-orange); flex-shrink: 0; }

#page-analista_productos .ap-dash-funnel { display: flex; align-items: flex-end; gap: 10px; height: 100px; margin-bottom: 6px; }
#page-analista_productos .ap-dash-funnel-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 8px; height: 100%; justify-content: flex-end; }
#page-analista_productos .ap-dash-funnel-bar { width: 100%; border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, #93a5f9, var(--ap-blue)); min-height: 3px; }
#page-analista_productos .ap-dash-funnel-val { font-size: 13px; font-weight: 800; }
#page-analista_productos .ap-dash-funnel-label { font-size: 9px; color: var(--ap-text2); font-weight: 700; text-align: center; text-transform: uppercase; letter-spacing: .02em; }

#page-analista_productos .ap-dash-fin-row { display: flex; align-items: center; justify-content: space-between; padding: 7px 2px; font-size: 12.5px; color: var(--ap-text2); font-weight: 600; }
#page-analista_productos .ap-dash-fin-row.ap-dash-fin-total { border-top: 1px solid var(--ap-border); margin-top: 6px; padding-top: 13px; color: var(--ap-text); }
#page-analista_productos .ap-dash-fin-row.ap-dash-fin-total .ap-dash-fin-val { font-size: 18px; font-weight: 800; color: var(--ap-green); }
#page-analista_productos .ap-dash-fin-val { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--ap-text); }

#page-analista_productos .ap-dash-track-row { display: flex; align-items: center; gap: 18px; padding: 15px 2px; border-bottom: 1px solid var(--ap-border); flex-wrap: wrap; }
#page-analista_productos .ap-dash-track-row:last-child { border-bottom: none; }
#page-analista_productos .ap-dash-track-product { display: flex; align-items: center; gap: 10px; width: 220px; flex-shrink: 0; }
#page-analista_productos .ap-dash-track-thumb { width: 36px; height: 36px; border-radius: 9px; background: var(--ap-bg); border: 1px solid var(--ap-border); flex-shrink: 0; }
#page-analista_productos .ap-dash-track-title { font-size: 12.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-analista_productos .ap-dash-track-id { font-size: 10.5px; color: var(--ap-text2); font-weight: 600; }
#page-analista_productos .ap-dash-stepper { display: flex; align-items: center; flex: 1; min-width: 260px; }
#page-analista_productos .ap-dash-step { display: flex; flex-direction: column; align-items: center; gap: 6px; position: relative; flex: 1; }
#page-analista_productos .ap-dash-step-line { position: absolute; top: 12px; left: -50%; width: 100%; height: 2px; background: var(--ap-border); z-index: 0; }
#page-analista_productos .ap-dash-step:first-child .ap-dash-step-line { display: none; }
#page-analista_productos .ap-dash-step-line.done { background: var(--ap-green); }
#page-analista_productos .ap-dash-step-dot {
  width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--ap-bg); border: 2px solid var(--ap-border); z-index: 1; flex-shrink: 0; font-size: 10px; font-weight: 800; color: var(--ap-text2);
}
#page-analista_productos .ap-dash-step-dot svg { width: 11px; height: 11px; }
#page-analista_productos .ap-dash-step-dot.done { background: var(--ap-green); border-color: var(--ap-green); color: #fff; }
#page-analista_productos .ap-dash-step-dot.current { background: rgba(249,115,22,.14); border-color: #f97316; color: #f97316; }
#page-analista_productos .ap-dash-step-label { font-size: 9.5px; font-weight: 700; color: var(--ap-text2); text-align: center; max-width: 74px; }
#page-analista_productos .ap-dash-step-label.done { color: var(--ap-text); }
#page-analista_productos .ap-dash-step-label.current { color: #f97316; }
#page-analista_productos .ap-dash-track-eta { width: 110px; text-align: right; flex-shrink: 0; font-size: 11.5px; color: var(--ap-text2); font-weight: 600; }

#page-analista_productos .ap-dash-auto-row { display: flex; align-items: center; gap: 10px; padding: 8px 2px; border-bottom: 1px solid var(--ap-border); font-size: 12.5px; font-weight: 600; }
#page-analista_productos .ap-dash-auto-row:last-child { border-bottom: none; }
#page-analista_productos .ap-dash-auto-name { flex: 1; }
#page-analista_productos .ap-dash-auto-meta { font-size: 11px; color: var(--ap-text2); }

#page-analista_productos .ap-dash-alert-tray { display: flex; flex-direction: column; gap: 1px; }
#page-analista_productos .ap-dash-alert-row { display: flex; align-items: center; gap: 14px; padding: 13px 4px; border-bottom: 1px solid var(--ap-border); }
#page-analista_productos .ap-dash-alert-row:last-child { border-bottom: none; }
#page-analista_productos .ap-dash-alert-sev { width: 32px; height: 32px; border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
#page-analista_productos .ap-dash-alert-sev svg { width: 15px; height: 15px; }
#page-analista_productos .ap-dash-alert-text { flex: 1; font-size: 13px; font-weight: 600; }

#page-analista_productos .ap-dash-empty { font-size: 12.5px; color: var(--ap-text2); text-align: center; padding: 28px 12px; line-height: 1.6; }

/* Modal de detalle de alertas — pedido explícito 22/08/2026 */
#page-analista_productos .ap-dash-alert-table { display: flex; flex-direction: column; max-height: 60vh; overflow-y: auto; }
#page-analista_productos .ap-dash-alert-thead {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1.2fr; gap: 10px; padding: 10px 8px;
  font-size: 10.5px; font-weight: 700; color: var(--ap-text2); text-transform: uppercase; letter-spacing: .05em;
  border-bottom: 1px solid var(--ap-border); position: sticky; top: 0; background: var(--ap-card);
}
#page-analista_productos .ap-dash-alert-trow {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1.2fr; gap: 10px; padding: 12px 8px; align-items: center;
  border-bottom: 1px solid var(--ap-border); font-size: 12.5px;
}
#page-analista_productos .ap-dash-alert-trow:last-child { border-bottom: none; }
/* Bug real reportado 11/09/2026 (fila de Pedidos): un título largo con
   white-space:nowrap hace que la celda de grid crezca a su ancho de
   contenido completo (min-width:auto por defecto en CSS Grid) e
   invade visualmente las columnas de al lado (SKU, Compra) — el
   overflow:hidden del título de arriba no alcanza si el CONTENEDOR de
   la celda nunca se achica. min-width:0 fuerza a la celda a respetar
   el ancho real de la columna (fr) en vez de la del contenido. */
#page-analista_productos .ap-dash-alert-trow > div,
#page-analista_productos .ap-dash-alert-thead > div { min-width: 0; overflow: hidden; }
#page-analista_productos .ap-dash-alert-prod-title { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-analista_productos .ap-dash-alert-motivo { font-size: 11px; color: var(--ap-red); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-analista_productos .ap-dash-alert-actions { display: flex; gap: 6px; }
#page-analista_productos .ap-dash-alert-actions .ap-btn-sm { padding: 6px 10px; font-size: 11.5px; }

/* Card "Cambios de precio de proveedores" — pedido explícito 22/08/2026 */
#page-analista_productos .ap-dash-precios-summary { display: flex; gap: 16px; margin-bottom: 14px; }
#page-analista_productos .ap-dash-precios-sum-up,
#page-analista_productos .ap-dash-precios-sum-down {
  display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; padding: 5px 12px; border-radius: 999px;
}
#page-analista_productos .ap-dash-precios-sum-up svg,
#page-analista_productos .ap-dash-precios-sum-down svg { width: 11px; height: 11px; }
#page-analista_productos .ap-dash-precios-sum-up { color: var(--ap-red); background: rgba(239,68,68,.10); }
#page-analista_productos .ap-dash-precios-sum-down { color: var(--ap-green); background: rgba(16,185,129,.10); }
#page-analista_productos .ap-dash-precios-list { display: flex; flex-direction: column; }
#page-analista_productos .ap-dash-precio-row {
  display: grid; grid-template-columns: 2fr 1.3fr 1.6fr; gap: 16px; align-items: center;
  padding: 11px 2px; border-bottom: 1px solid var(--ap-border);
}
#page-analista_productos .ap-dash-precio-row:last-child { border-bottom: none; }
/* min-width:0 — pedido explícito 04/09/2026 (auditoría real, hallazgo
   #5): sin esto, un ítem de grid no se achica por debajo del ancho
   intrínseco de su contenido (default min-width:auto), así que un
   título largo en .ap-dash-precio-title empujaba esta columna y rompía
   la proporción 2fr/1.3fr/1.6fr de .ap-dash-precio-row — el ellipsis de
   .ap-dash-precio-title nunca llegaba a activarse. Mismo criterio ya
   documentado para el resto del módulo, ver comentario de
   "Ítems de grid/flex con texto largo..." más abajo. */
#page-analista_productos .ap-dash-precio-info { min-width: 0; }
#page-analista_productos .ap-dash-precio-title { font-size: 12.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-analista_productos .ap-dash-precio-prov { font-size: 11px; color: var(--ap-text2); font-weight: 600; margin-top: 1px; }
#page-analista_productos .ap-dash-precio-vals { display: flex; align-items: baseline; gap: 6px; font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
#page-analista_productos .ap-dash-precio-old { color: var(--ap-text2); text-decoration: line-through; }
#page-analista_productos .ap-dash-precio-arrow { color: var(--ap-text2); font-size: 11px; }
#page-analista_productos .ap-dash-precio-new { font-weight: 800; }
#page-analista_productos .ap-dash-precio-bar-wrap { display: flex; align-items: center; gap: 8px; }
#page-analista_productos .ap-dash-precio-bar-wrap { position: relative; height: 8px; background: rgba(139,146,165,.12); border-radius: 999px; overflow: visible; }
#page-analista_productos .ap-dash-precio-bar {
  height: 100%; width: 0; border-radius: 999px;
  animation: ap-dash-precio-grow 600ms cubic-bezier(.25,.8,.25,1) both;
  animation-delay: var(--ap-bar-delay, 0ms);
}
#page-analista_productos .ap-dash-precio-bar.up { background: linear-gradient(90deg, #f87171, #ef4444); }
#page-analista_productos .ap-dash-precio-bar.down { background: linear-gradient(90deg, #34d399, #10b981); }
#page-analista_productos .ap-dash-precio-pct {
  position: absolute; right: 0; top: -18px; font-size: 10.5px; font-weight: 800; font-variant-numeric: tabular-nums;
}
@keyframes ap-dash-precio-grow { from { width: 0; } to { width: var(--ap-bar-w); } }
@media (prefers-reduced-motion: reduce) { #page-analista_productos .ap-dash-precio-bar { animation: none; width: var(--ap-bar-w); } }

/* Card "Productos sin categoría" — pedido explícito 22/08/2026 */
#page-analista_productos .ap-dash-cat-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px;
  max-height: 460px; overflow-y: auto; padding-right: 2px;
}
#page-analista_productos .ap-dash-cat-tile {
  background: var(--ap-bg); border: 1px solid var(--ap-border); border-radius: 12px; padding: 10px; text-align: center;
}
#page-analista_productos .ap-dash-cat-avatar {
  width: 100%; aspect-ratio: 1; border-radius: 9px; background: var(--ap-card2, rgba(255,255,255,.04));
  display: flex; align-items: center; justify-content: center; font-size: 22px; margin-bottom: 8px;
}
#page-analista_productos .ap-dash-cat-title {
  font-size: 11px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
#page-analista_productos .ap-dash-cat-prov { font-size: 10px; color: var(--ap-text2); font-weight: 600; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#page-analista_productos .ap-dash-cat-price { font-size: 11.5px; font-weight: 800; margin-top: 4px; font-variant-numeric: tabular-nums; }