/* ═══ REDESIGN-MOBILE — Task 95, pase responsive móvil + accesibilidad del
   rediseño (nav persistente, dashboards glass, tabs de dos niveles,
   DataTable CBI, command palette). Capa aditiva ÚNICA compartida por las 4
   superficies (terminal, ops/desk, hub, landing) — @media(max-width:768px)
   exclusivamente, cero efecto en desktop (>=769px).

   No sustituye css/mobile-responsive.css, css/hub-mobile.css,
   css/landing-mobile.css ni css/desk-mobile.css (rangos 768-899px ya
   cubiertos por esos ficheros, ver sus propias cabeceras) — este fichero se
   enfoca específicamente en los componentes del rediseño (Task 86/90/93) que
   son posteriores a esos ficheros y en refuerzos de accesibilidad.

   ORDEN DE CARGA: <link> a este fichero debe ser el ÚLTIMO <link
   rel="stylesheet"> de cada <head> (después de glass-system.css y del
   *-mobile.css propio de la superficie) para ganar los empates de
   especificidad por orden de cascada sin depender de !important. Excepción
   documentada inline: los selectores `.stock-entity-*` se definen en <style>
   inline DENTRO de <body> en apps/terminal/index.html — más abajo que cualquier
   <link> de <head>, así que el orden de carga no basta para ganar esa pelea. Ver
   el bloque correspondiente para el detalle de por qué usa !important en vez de
   solo especificidad. (Prompt 21: `.module-tabs-l1/l2` y `.stock-shortcuts-bar`
   se retiraron de este fichero — ningún marcado ni JS los genera ya.) */

@media (max-width: 768px) {

  /* ─────────────────────────────────────────────────────────────────
     TERMINAL · Pills de entidad (.stock-entity-tabs de las fichas de Crypto,
     Fixed Income y Private Banking; ticker-entity-page Task 90) → scroll
     horizontal con snap en vez de wrap.
     Nunca corta el último botón: scroll-snap-align:start en cada botón +
     un spacer ::after (no un padding, que algunos motores no respetan al
     final de un contenedor con overflow-x:auto).
     !important en flex-wrap/overflow-x/scroll-snap-type: `.stock-entity-tabs`
     se define en un <style> inline de <body> (apps/terminal/index.html), más
     abajo que este <link> de <head> — así una futura cualificación con ID no
     rompe este bloque en silencio. */
  .stock-entity-tabs {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity !important;
    scrollbar-width: thin;
  }
  .stock-entity-tab {
    flex: 0 0 auto;
    scroll-snap-align: start;
    min-height: 40px;
  }
  .stock-entity-tabs::after {
    content: "";
    flex: 0 0 1px;
    margin-right: 10px;
  }

  /* ─────────────────────────────────────────────────────────────────
     TERMINAL · Command palette — inalcanzable hoy en móvil: css/mobile-
     responsive.css (bloque M) oculta el wrapper Search/Help del toolbar
     asumiendo acceso por teclado (⌘K), que no existe en touch. Botón
     flotante dedicado (creado por buildCmdkButton() en js/mobile-nav.js),
     espejo del hamburger (.cbm-mnav-toggle) en la esquina opuesta. ───── */
  .cbm-cmdk-toggle {
    position: fixed;
    top: 8px; right: 8px;
    z-index: 650;
    width: 40px; height: 40px;
    display: flex; align-items: center; justify-content: center;
    background: var(--bg1, #0d1117);
    border: 1px solid var(--border2, #273547);
    border-radius: 6px;
    color: var(--text0, #e8eef5);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
  }
  /* Reserva de espacio simétrica a la del hamburger (mobile-responsive.css,
     bloques L/mobile-header-unstick con padding-left:52px) para que el
     nuevo botón no tape el último símbolo del ticker ni el texto del
     header/live-bar. Añade solo la propiedad derecha — no reescribe el
     shorthand `padding` ya fijado por esos bloques. */
  .ticker-tape { padding-right: 52px; }
  .live-bar { padding-right: 52px; }
  .header { padding-right: 52px; }

  /* Ancho completo real del modal (antes min(580px,92vw) — casi completo
     pero no del todo) y menos padding-top para que quepa con el teclado
     on-screen abierto. !important obligatorio: ambos valores están fijados
     en un style="" inline sobre el propio nodo en apps/terminal/index.html
     — un inline style="" gana siempre a cualquier regla externa salvo
     !important (mismo patrón ya documentado en css/mobile-responsive.css
     para #ai-platform-notice/.header-stats). */
  #cmd-k-modal > div.glass-elev-3 { width: calc(100vw - 16px) !important; }
  #cmd-k-modal { padding-top: 8vh !important; }

  /* ─────────────────────────────────────────────────────────────────
     GLASS · Reducir blur en móvil por rendimiento — backdrop-filter con
     blur pesado (18-28px) recalculado en cada scroll/paint es el coste más
     alto de toda la superficie glass en gama media/baja. La reducción no
     es perceptible (superficies más pequeñas, se ve menos de golpe).
     Convive con los fallbacks de css/glass-system.css: @supports not
     backdrop-filter y prefers-reduced-transparency ya caen a fondo sólido
     y estas variables no aplican en ese caso. ─────────────────────────── */
  :root {
    --glass-blur: 8px;
    --glass-blur-sm: 5px;
    --glass-blur-lg: 12px;
  }
  /* El sheen especular (.glass-liquid, animación infinita de 9s) es puro
     coste de repintado sin valor funcional en pantallas pequeñas — se
     desactiva en móvil igual que ya hace css/glass-system.css al pedir
     reducir movimiento. */
  .glass-liquid::after { display: none; }

  /* ─────────────────────────────────────────────────────────────────
     DataTable CBI (.glass-datatable) — mismo tratamiento de scroll
     horizontal táctil + sombra-cue que .cbm-table-scroll (css/mobile-
     responsive.css) para las tablas que usan el componente nuevo en vez de
     un <table> suelto. .glass-datatable__scroll ya es overflow-x:auto por
     defecto (css/glass-system.css) — aquí solo se añade la inercia táctil y
     la sombra-cue. ─────────────────────────────────────────────────────── */
  .glass-datatable__scroll {
    -webkit-overflow-scrolling: touch;
    box-shadow: inset -14px 0 10px -12px rgba(0, 0, 0, .55);
  }

  /* ─────────────────────────────────────────────────────────────────
     HUB — css/hub-mobile.css ya cubre topbar/cards/KPI-strip (768/900/480).
     Aquí solo el refuerzo de accesibilidad del rediseño (foco visible) que
     ese fichero no trataba. ────────────────────────────────────────────── */
  .mc-toggle:focus-visible,
  .mc-open-btn:focus-visible {
    outline: 2px solid var(--purple, #6366f1);
    outline-offset: 2px;
  }

  /* ─────────────────────────────────────────────────────────────────
     DESK (ops) — hardening de la vista reducida #dmob-root SIN cambiar su
     arquitectura (decisión explícita del ticket 95: se mantiene solo-
     lectura, no se migra al reflow completo de escritorio). Solo touch
     targets >=40px y foco visible que css/desk-mobile.css no cubría — los
     botones de nav/subnav no fijaban min-height, solo padding. ─────────── */
  .dmob-nav-btn,
  .dmob-subnav-btn {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
  }
  .dmob-nav-btn:focus-visible,
  .dmob-subnav-btn:focus-visible {
    outline: 2px solid var(--purple, #b88aff);
    outline-offset: 2px;
  }
}

/* Reducir movimiento: ya no se repite aquí. La regla única vive en css/motion.css (Prompt 24) y
   css/glass-system.css conserva su `.glass-liquid::after { display: none }`, que sí hace algo que aquella no cubre. */
/* ═══ /REDESIGN-MOBILE ═══ */