/*
 * Debajo de .configurator-nav (z-index 1050 > 1040 del slot): sin top explicito el bloque
 * quedaba en y=0 y los chips de producto/estilo quedaban ocultos tras la barra blanca.
 */
#configurator-viz-mode-toggle-slot-outer {
  top: max(4.2rem, calc(env(safe-area-inset-top, 0px) + 3rem));
  padding-left: max(10px, env(safe-area-inset-left, 0px)) !important;
  padding-right: max(10px, env(safe-area-inset-right, 0px)) !important;
}

.vh-selection-overlay {
  position: relative;
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  pointer-events: auto;
}

.vh-selection-overlay__chip {
  background: rgba(255, 255, 255, 1);
  color: #0f172a;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 13px;
  line-height: 1;
  font-weight: 600;
  transition: all 0.2s ease;
  white-space: nowrap;
  min-height: 32px;
}

.vh-selection-overlay__chip:hover:not(:disabled) {
  background: #ffffff;
  border-color: rgba(51, 65, 85, 0.35);
}

.vh-selection-overlay__chip:disabled,
.vh-selection-overlay__chip.is-disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

@media (max-width: 767.98px) {
  .vh-selection-overlay {
    flex: 0 1 auto;
    max-width: calc(100vw - 120px);
    justify-content: flex-start;
    margin-left: 0;
  }

  .vh-selection-overlay__chip {
    flex: 0 1 auto;
    max-width: min(38vw, 170px);
    overflow: hidden;
    text-overflow: ellipsis;
  }
}