/* =========================================================
   INDEXSOLAR - BOTÓN FLOTANTE VOLVER ARRIBA
   Colores basados en el botón móvil: fondo claro + azul IndexSolar
   ========================================================= */

:root {
  --ixs-scroll-bg: #eef9e8;
  --ixs-scroll-bg-hover: #f7fff2;
  --ixs-scroll-icon: #1d2b53;
  --ixs-scroll-accent: #5ea33b;
  --ixs-scroll-size: 42px;
  --ixs-scroll-radius: 14px;
}

.ixs-scroll-top {
  position: fixed !important;
  right: 22px !important;
  bottom: 24px !important;
  z-index: 999990 !important;

  width: var(--ixs-scroll-size) !important;
  height: var(--ixs-scroll-size) !important;
  padding: 0 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  background: var(--ixs-scroll-bg) !important;
  color: var(--ixs-scroll-icon) !important;

  border: 1px solid rgba(29, 43, 83, 0.06) !important;
  border-radius: var(--ixs-scroll-radius) !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.14) !important;

  cursor: pointer !important;
  outline: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(12px) scale(0.96) !important;

  transition:
    opacity 0.18s ease-out,
    transform 0.18s ease-out,
    background-color 0.18s ease-out,
    box-shadow 0.18s ease-out !important;

  -webkit-tap-highlight-color: transparent !important;
}

.ixs-scroll-top.is-visible {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}

.ixs-scroll-top:hover {
  background: var(--ixs-scroll-bg-hover) !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.18) !important;
  transform: translateY(-2px) scale(1.02) !important;
}

.ixs-scroll-top:active {
  transform: translateY(0) scale(0.98) !important;
}

.ixs-scroll-top:focus-visible {
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.14),
    0 0 0 3px rgba(94, 163, 59, 0.28) !important;
}

.ixs-scroll-top__icon {
  width: 22px !important;
  height: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ixs-scroll-top__icon svg {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  overflow: visible !important;
}

/* V invertida / flecha hacia arriba */
.ixs-scroll-top__icon path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 4.6 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

@media (max-width: 768px) {
  :root {
    /* Igual al botón móvil de 3 líneas: icono 22px + padding visual de 10px */
    --ixs-scroll-size: 42px;
    --ixs-scroll-radius: 14px;
  }

  .ixs-scroll-top {
    right: 22px !important;
    bottom: 22px !important;
  }

  .ixs-scroll-top__icon,
  .ixs-scroll-top__icon svg {
    width: 22px !important;
    height: 22px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ixs-scroll-top {
    transition: none !important;
  }
}