/*
  BolsaHoy · capa visual común (octubre 2026).
  Se carga la última en todas las páginas. En tema oscuro la web usa el mismo
  lenguaje que la app Android: fondo azul animado, botón principal blanco en
  píldora, secundarios de cristal con filo fino y pestañas activas en blanco.
  El tema claro conserva sus botones de siempre. No cambia estructura ni
  funciones: solo presentación.
*/

:root {
  --bh-app-ink: #eef3fb;
  --bh-app-on-ink: #05070d;
  --bh-app-line: rgba(255, 255, 255, .2);
  --bh-app-glass: linear-gradient(180deg, rgba(15, 42, 85, .16), rgba(8, 18, 38, .08));
}

/* ── Fondo de la app: degradado azul de 118° que se desplaza despacio ──
   Es el mismo de las fichas de empresa (y de la app). Va en una capa fija por
   detrás del contenido; solo se anima con transform, que no repinta. */
html:not([data-theme="light"]) body {
  isolation: isolate;
  background-color: #040914 !important;
}
html:not([data-theme="light"]) body::before {
  content: "" !important;
  position: fixed !important;
  inset: -34% !important;
  z-index: -1 !important;
  pointer-events: none !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  background: linear-gradient(118deg, #02050d 0%, #06162e 23%, #0a2e5e 45%, #0f5aa8 61%, #071f43 79%, #02050d 100%) !important;
  background-size: 100% 100% !important;
  transform: translate3d(-6%, -4%, 0);
  animation: bhAppBackground 28s ease-in-out infinite alternate !important;
  will-change: transform;
}
@keyframes bhAppBackground {
  0% { transform: translate3d(-6%, -4%, 0) scale(1); }
  50% { transform: translate3d(4%, 2%, 0) scale(1.04); }
  100% { transform: translate3d(-2%, 6%, 0) scale(1.08); }
}
@media (prefers-reduced-motion: reduce) {
  html:not([data-theme="light"]) body::before { animation: none !important; }
}
html.bh-mobile-lite:not([data-theme="light"]) body::before { animation: none !important; }

/* ── Botón principal (tema oscuro): píldora blanca con texto oscuro, como la app ── */
html:not([data-theme="light"]) :is(
  .btn.primary,
  .btn-primary,
  .parte-action--primary,
  .an-index-report-action,
  .bh-cookie-accept,
  .bh-cookie-save
):not(:disabled):not([aria-disabled="true"]) {
  background-color: var(--bh-app-ink) !important;
  background-image: none !important;
  border-color: var(--bh-app-ink) !important;
  color: var(--bh-app-on-ink) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 28px -14px rgba(0, 0, 0, .7) !important;
  transition: transform 160ms ease, background-color 160ms ease, box-shadow 160ms ease !important;
}
html:not([data-theme="light"]) :is(
  .btn.primary,
  .btn-primary,
  .parte-action--primary,
  .an-index-report-action,
  .bh-cookie-accept,
  .bh-cookie-save
) :is(svg, .bh-icon) {
  color: var(--bh-app-on-ink) !important;
  stroke: currentColor;
}
html:not([data-theme="light"]) :is(
  .btn.primary,
  .btn-primary,
  .parte-action--primary,
  .an-index-report-action,
  .bh-cookie-accept,
  .bh-cookie-save
):not(:disabled):not([aria-disabled="true"]):hover {
  background-color: #ffffff !important;
  box-shadow: 0 14px 30px -14px rgba(120, 180, 255, .55) !important;
  transform: translateY(-1px);
}
html:not([data-theme="light"]) :is(.btn.primary, .btn-primary, .parte-action--primary, .an-index-report-action):active {
  transform: scale(.98);
}

/* ── Botón secundario (tema oscuro): transparente con filo fino blanco ── */
html:not([data-theme="light"]) :is(
  .btn.ghost,
  .btn.dark,
  .btn.home-section-action,
  .btn.mkt-hero-calendar-btn,
  .an-load-more,
  .mkt-chip,
  .comm-market-link,
  .asset-analysis-all,
  .bh-cookie-actions button:not(.bh-cookie-accept)
) {
  background-color: rgba(255, 255, 255, .03) !important;
  background-image: none !important;
  border: 1px solid var(--bh-app-line) !important;
  color: var(--bh-app-ink) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease !important;
}
html:not([data-theme="light"]) :is(
  .btn.ghost,
  .btn.dark,
  .btn.home-section-action,
  .btn.mkt-hero-calendar-btn,
  .an-load-more,
  .mkt-chip,
  .comm-market-link,
  .asset-analysis-all,
  .bh-cookie-actions button:not(.bh-cookie-accept)
):hover {
  border-color: rgba(255, 255, 255, .45) !important;
  background-color: rgba(255, 255, 255, .08) !important;
}

/* ── Chips y pestañas activas (tema oscuro): píldora blanca, como el selector de la app ── */
html:not([data-theme="light"]) :is(
  .chip.active,
  .an-library-filter.is-active,
  .bh-tv-tab.is-active,
  .trend-tab.active,
  .tab.active
) {
  background-color: var(--bh-app-ink) !important;
  background-image: none !important;
  border-color: var(--bh-app-ink) !important;
  color: var(--bh-app-on-ink) !important;
  box-shadow: none !important;
}
html:not([data-theme="light"]) :is(.chip, .an-library-filter, .bh-tv-tab, .trend-tab):not(.active):not(.is-active) {
  border-color: var(--bh-app-line) !important;
}
html:not([data-theme="light"]) :is(.chip, .an-library-filter, .bh-tv-tab, .trend-tab):not(.active):not(.is-active):hover {
  border-color: rgba(255, 255, 255, .45) !important;
  color: #fff;
}

/* ── Foco de teclado visible y coherente ── */
:is(a, button, [role="button"], [role="tab"], input, select, textarea, summary):focus-visible {
  outline: 2px solid #4fa3ff !important;
  outline-offset: 2px !important;
}

/* ── Selección de texto y barra de desplazamiento ── */
::selection { background: rgba(31, 128, 255, .38); color: #fff; }
html:not([data-theme="light"]) { scrollbar-color: rgba(120, 160, 220, .28) transparent; }
html:not([data-theme="light"]) ::-webkit-scrollbar { width: 10px; height: 10px; }
html:not([data-theme="light"]) ::-webkit-scrollbar-track { background: transparent; }
html:not([data-theme="light"]) ::-webkit-scrollbar-thumb { background: rgba(120, 160, 220, .24); border: 3px solid transparent; border-radius: 999px; background-clip: padding-box; }
html:not([data-theme="light"]) ::-webkit-scrollbar-thumb:hover { background-color: rgba(120, 170, 240, .42); }

/* ── Campos de texto: el foco se ve con un halo azul suave ── */
html:not([data-theme="light"]) :is(input[type="text"], input[type="email"], input[type="search"], input[type="password"], input[type="number"], input:not([type]), textarea, select):focus {
  border-color: rgba(79, 163, 255, .7) !important;
  box-shadow: 0 0 0 4px rgba(31, 128, 255, .16) !important;
}

/* ── Pie de página ── */
.bh-site-footer {
  position: relative;
  background:
    radial-gradient(900px 260px at 12% 0%, rgba(31, 128, 255, .10), transparent 70%),
    var(--bh-bg-elevated) !important;
}
.bh-site-footer::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(79, 163, 255, .55), transparent);
  pointer-events: none;
}
/* En móvil ocupaba dos pantallas en una sola columna: ahora marca y redes en
   una fila, las tres columnas de enlaces juntas y los avisos más compactos. */
@media (max-width: 780px) {
  .bh-site-footer .bh-foot-shell { padding: 30px 0 22px; }
  .bh-site-footer .bh-foot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 22px 14px !important; }
  .bh-site-footer .bh-foot-brand {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px 14px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--bh-line-soft, rgba(255, 255, 255, .07));
  }
  .bh-site-footer .bh-foot-tagline { grid-column: 1 / -1; grid-row: 2; margin: 2px 0 0 !important; max-width: none !important; font-size: 13px !important; }
  .bh-site-footer .bh-foot-social { grid-column: 2; grid-row: 1; }
  .bh-site-footer .bh-foot-social a { width: 34px !important; height: 34px !important; }
  .bh-site-footer h3 { margin-bottom: 10px !important; font-size: 10.5px !important; }
  .bh-site-footer .bh-foot-col a { margin-bottom: 9px !important; font-size: 12.5px !important; line-height: 1.3; overflow-wrap: anywhere; }
  .bh-site-footer .bh-foot-col:last-child a { font-size: 11.5px !important; }
  .bh-site-footer .bh-foot-bottom { margin-top: 20px !important; padding-top: 16px !important; gap: 6px !important; }
  .bh-site-footer .bh-foot-bottom p { font-size: 11.5px !important; line-height: 1.5; }
  .bh-site-footer .bh-foot-legalnote { font-size: 10.5px !important; }
}
@media (max-width: 360px) {
  .bh-site-footer .bh-foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (prefers-reduced-motion: reduce) {
  :is(.btn, .chip) { transition: none !important; transform: none !important; }
}