/*
  BolsaHoy — cross-browser polish
  Capa conservadora cargada al final: no cambia layout ni rediseña componentes.
  Objetivo: que Safari/Firefox/Edge rendericen el look glass/gradient lo más
  parecido posible a Chrome, manteniendo fluidez.
*/

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  color-scheme: light dark;
  scroll-behavior: smooth;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: geometricPrecision;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
svg,
video,
canvas {
  height: auto;
}

button,
input,
textarea,
select {
  font: inherit;
  color: inherit;
}

button,
[type="button"],
[type="submit"],
[type="reset"],
input,
textarea,
select {
  -webkit-appearance: none;
  appearance: none;
}

textarea {
  resize: vertical;
}

.btn svg,
.bh-btn svg {
  flex: 0 0 auto;
}

.btn.btn-icon,
a.btn.btn-icon,
button.btn.btn-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  justify-self: start;
  width: 42px !important;
  min-width: 42px !important;
  height: 42px !important;
  min-height: 42px !important;
  padding: 0 !important;
  line-height: 1 !important;
  text-align: center !important;
  border-radius: 14px;
  vertical-align: middle;
}

.btn.btn-icon .bh-icon,
a.btn.btn-icon .bh-icon,
button.btn.btn-icon .bh-icon {
  display: block;
  width: 17px;
  height: 17px;
  margin: 0;
}

::placeholder {
  opacity: 1;
}

/* Misma intención visual para scrollbars en Firefox y navegadores WebKit. */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(31, 128, 255, .72) rgba(31, 128, 255, .08);
}

/* Safari/iOS: prefijos para el blur glass donde algunas versiones aún los
   necesitan. Valores cercanos a los usados por el diseño actual. */
.app-header.bh-float-nav,
.bb-topbar-card,
.bb-input-shell,
.bb-bubble,
.market-widget-card,
.analysis-tabs,
.analysis-hero-copy,
.admin-panel,
.admin-card,
.profile-card,
.plan-card,
.pricing-card {
  -webkit-backdrop-filter: blur(18px) saturate(145%);
}

.comm-assistant-card,
.comm-hero-card,
.room-dropdown,
.bb-chat-item,
.bb-sidebar,
.bb-login-card,
.bb-welcome-card,
.market-card,
.bh-card,
.bh-modal,
.bh-modal-overlay {
  -webkit-backdrop-filter: blur(14px) saturate(135%);
}

/* Si el navegador no soporta glass real, usamos una base translúcida estable.
   Así no queda "nativo feo" ni plano, pero no se mueven medidas. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .app-header.bh-float-nav,
  .bh-card,
  .comm-assistant-card,
  .comm-hero-card,
  .room-dropdown,
  .bb-topbar-card,
  .bb-input-shell,
  .bb-bubble,
  .bb-chat-item,
  .bb-sidebar,
  .bb-login-card,
  .bb-welcome-card,
  .market-card,
  .market-widget-card,
  .analysis-tabs,
  .analysis-hero-copy,
  .admin-panel,
  .admin-card,
  .profile-card,
  .plan-card,
  .pricing-card {
    background-color: rgba(9, 18, 36, .82);
    border-color: rgba(87, 166, 255, .28);
  }

  [data-theme="light"] .app-header.bh-float-nav,
  [data-theme="light"] .bh-card,
  [data-theme="light"] .comm-assistant-card,
  [data-theme="light"] .comm-hero-card,
  [data-theme="light"] .room-dropdown,
  [data-theme="light"] .bb-topbar-card,
  [data-theme="light"] .bb-input-shell,
  [data-theme="light"] .bb-bubble,
  [data-theme="light"] .bb-chat-item,
  [data-theme="light"] .bb-sidebar,
  [data-theme="light"] .bb-login-card,
  [data-theme="light"] .bb-welcome-card,
  [data-theme="light"] .market-card,
  [data-theme="light"] .market-widget-card,
  [data-theme="light"] .analysis-tabs,
  [data-theme="light"] .analysis-hero-copy,
  [data-theme="light"] .admin-panel,
  [data-theme="light"] .admin-card,
  [data-theme="light"] .profile-card,
  [data-theme="light"] .plan-card,
  [data-theme="light"] .pricing-card {
    background-color: rgba(247, 251, 255, .88);
    border-color: rgba(31, 128, 255, .18);
  }
}

/* Firefox suaviza peor algunos fondos translúcidos: reforzamos contraste sin
   cambiar geometría. */
@supports (-moz-appearance: none) {
  .app-header.bh-float-nav {
    background-color: rgba(var(--bh-header-rgb, 9, 13, 20), .82);
  }

  [data-theme="light"] .app-header.bh-float-nav {
    background-color: rgba(var(--bh-header-rgb, 255, 255, 255), .86);
  }

  .bb-bubble,
  .bb-input-shell,
  .bb-topbar-card,
  .analysis-hero-copy,
  .market-widget-card {
    background-blend-mode: screen;
  }
}

/* Safari móvil suele pelearse con fondos fixed + blur. Solo en pantallas táctiles
   lo degradamos a scroll para mantener fluidez y evitar saltos visuales. */
@supports (-webkit-touch-callout: none) {
  @media (hover: none) and (pointer: coarse) {
    body,
    .comm-page,
    .bb-page,
    .market-page,
    .analysis-page {
      background-attachment: scroll !important;
    }
  }
}

/* Preferencias del usuario: menos animación sin romper el diseño. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}
