/* Ionic theme alignment with Figma tokens */
:root {
  --ion-font-family: var(--font-family);
  --ion-background-color: var(--color-surface);
  --ion-text-color: var(--color-black);
}

/*
 * Ionic structure.css locks body scroll for ion-app; we use document scroll (Go SSR).
 */
html {
  height: auto;
  min-height: 100%;
}

body {
  position: static;
  width: auto;
  max-width: none;
  height: auto;
  min-height: 100%;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  touch-action: auto;
  overscroll-behavior-y: auto;
  transform: none;
}

/* Hide until custom element is defined (avoids SSR flash in page flow) */
ion-popover.lang-popover:not(:defined) {
  display: none;
}

ion-popover.lang-popover::part(content) {
  position: fixed !important;
  inset: auto !important;
  left: var(--lang-left, -9999px) !important;
  top: var(--lang-top, -9999px) !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
  border-radius: var(--radius-popup);
  box-shadow: var(--shadow-popup);
}

ion-popover.lang-popover.lang-popover--pending::part(content) {
  visibility: hidden !important;
  pointer-events: none;
}

ion-popover.lang-popover::part(backdrop) {
  background: transparent;
}

ion-alert.pwa-ios-guide .alert-wrapper {
  border-radius: var(--radius-popup);
}

ion-select.ui-select {
  --placeholder-color: var(--color-black);
  --highlight-color-focused: var(--color-primary);
}

/* ion-select 弹出 popover 限高，避免长列表（如轮次）铺满页面 */
ion-popover.select-popover::part(content) {
  max-height: min(360px, 60vh);
  overflow-y: auto;
  overscroll-behavior: contain;
}

ion-popover.select-popover ion-list,
ion-popover.select-popover .ion-page,
ion-popover.select-popover .popover-content {
  max-height: min(360px, 60vh);
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* 文字左、箭头右（绝对定位到 inner 右侧）；边框由 .ui-select-wrap 绘制 */
.ui-select-wrap ion-select.ui-select::part(wrapper) {
  width: 100%;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.ui-select-wrap ion-select.ui-select::part(inner) {
  position: relative;
  display: block;
  width: 100%;
  box-sizing: border-box;
}

.ui-select-wrap ion-select.ui-select::part(container) {
  display: block;
  width: 100%;
  min-width: 0;
}

.ui-select-wrap ion-select.ui-select::part(text),
.ui-select-wrap ion-select.ui-select::part(placeholder) {
  display: block;
  width: 100%;
  text-align: start;
}

.ui-select-wrap ion-select.ui-select::part(icon) {
  position: absolute;
  top: 50%;
  inset-inline-end: 10px;
  margin: 0;
  transform: translateY(-50%);
  color: var(--color-text-secondary);
  opacity: 1;
  pointer-events: none;
}

ion-modal.search-modal {
  --width: 100vw;
  --height: 100vh;
  --height: 100dvh;
}

ion-modal.search-modal::part(backdrop) {
  background: rgba(0, 0, 0, 0.35);
}

ion-modal.search-modal:not(:defined) {
  display: none;
}

/* Cover layout is centered in Ionic; search must span the full viewport */
ion-modal.search-modal .modal-wrapper {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  align-items: stretch;
}

ion-toggle.tournament-knockout-bar__toggle {
  --track-background: var(--color-tab-border);
  --track-background-checked: var(--color-primary);
  --handle-background: var(--color-white);
  --handle-background-checked: var(--color-white);
}