/* Final visual QA fixes from browser review. Keep this file limited to cross-page visual regressions. */

/* Finder results: keep the featured match and alternatives balanced instead of leaving a large empty field. */
.finder-result.finder-result-ranked {
  grid-template-columns: minmax(420px, .9fr) minmax(0, 1.25fr);
  align-items: stretch;
  gap: 24px;
}
.finder-result-ranked .finder-winner {
  grid-template-columns: minmax(180px, 42%) minmax(0, 1fr);
  min-width: 0;
  min-height: 360px;
  height: 100%;
  gap: 22px;
  padding: 20px;
}
.finder-result-ranked .finder-match-visual {
  min-width: 0;
  min-height: 320px;
}
.finder-result-ranked .finder-winner-copy {
  min-width: 0;
}
.finder-result-ranked .finder-winner-copy h3 {
  font-size: clamp(34px, 4vw, 64px);
  overflow-wrap: anywhere;
}
.finder-result-ranked .finder-alternative-section {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
}
.finder-result-ranked .finder-alternative-heading {
  display: flex;
  margin-bottom: 12px;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.finder-result-ranked .finder-alternative-heading .kicker {
  margin: 0;
}
.finder-result-ranked .finder-alternative-heading strong {
  color: var(--muted);
  font-size: 13px;
}
.finder-result-ranked .finder-alternatives {
  grid-template-columns: 1fr;
  gap: 14px;
}
.finder-result-ranked .finder-alt-card {
  min-height: 132px;
}

/* Never allow discovery cards to collapse into unreadable vertical slivers. */
@media (max-width: 1050px) {
  .finder-result.finder-result-ranked {
    grid-template-columns: 1fr;
  }
  .finder-result-ranked .finder-winner {
    grid-template-columns: minmax(220px, 34%) minmax(0, 1fr);
    min-height: 330px;
  }
  .finder-result-ranked .finder-alternatives {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 759px) {
  .fresh-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 16px !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }
  .fresh-grid > .fresh-card,
  .fresh-grid > .group-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    writing-mode: horizontal-tb !important;
  }
  .fresh-grid .card-visual,
  .fresh-grid .card-body,
  .fresh-grid .card-wordmark,
  .fresh-grid h3,
  .fresh-grid p {
    width: 100%;
    min-width: 0;
    writing-mode: horizontal-tb !important;
    overflow-wrap: break-word;
  }
  .fresh-grid .card-wordmark {
    white-space: normal !important;
  }
  .finder-result-ranked .finder-winner {
    grid-template-columns: 1fr;
    min-height: 0;
    padding: 14px;
  }
  .finder-result-ranked .finder-match-visual {
    min-height: 230px;
  }
  .finder-result-ranked .finder-alternatives {
    grid-template-columns: 1fr;
  }
}

/* Native Shop selects need explicit option contrast in dark mode. */
html[data-theme="dark"] .shop-page select {
  color-scheme: dark;
  background-color: #241d31 !important;
  color: #f8f4ff !important;
}
html[data-theme="dark"] .shop-page select option,
html[data-theme="dark"] .shop-page select optgroup {
  background: #241d31 !important;
  color: #f8f4ff !important;
}
html[data-theme="dark"] .shop-page select option:checked {
  background: #7657ff !important;
  color: #fff !important;
}
html:not([data-theme="dark"]) .shop-page select {
  color-scheme: light;
}
html:not([data-theme="dark"]) .shop-page select option,
html:not([data-theme="dark"]) .shop-page select optgroup {
  background: #fff !important;
  color: #21192f !important;
}

/* Shop controls and group headers must remain usable at phone widths. */
.shop-page input[type="search"],
.shop-page select {
  min-width: 0;
  max-width: 100%;
}
@media (max-width: 759px) {
  .shop-page .shop-directory-tools,
  .shop-page .shop-browser {
    min-width: 0;
    max-width: 100%;
  }
  .shop-page .shop-directory-tools input[type="search"],
  .shop-page .shop-directory-tools select,
  .shop-page .shop-browser input[type="search"],
  .shop-page .shop-browser select {
    width: 100%;
    min-height: 48px;
    font-size: 16px;
  }
  .shop-group-panel-text-only .shop-group-header {
    min-width: 0;
  }
  .shop-group-panel-text-only .shop-group-name {
    min-width: 0;
  }
}
@media (max-width: 520px) {
  .shop-group-panel-text-only .shop-group-header {
    display: flex !important;
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 10px !important;
  }
  .shop-group-panel-text-only .shop-profile-shortcut {
    width: 100%;
    min-height: 44px;
    justify-content: center;
  }
  .shop-page .shop-categories {
    grid-template-columns: 1fr !important;
  }
}

/* Schedule: group name is the identity label; keep text and metadata resilient without a separate icon. */
.schedule-event-copy,
.schedule-event-top {
  min-width: 0;
}
.schedule-event h2,
.schedule-group,
.schedule-event-copy > p {
  overflow-wrap: anywhere;
}
.schedule-event-actions {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 14px 24px;
}
.schedule-event-actions small {
  min-width: 0;
  justify-self: end;
  padding-right: 2px;
  text-align: right;
  white-space: normal;
}
@media (max-width: 900px) {
  .schedule-event-actions {
    grid-template-columns: 1fr;
  }
  .schedule-event-actions small {
    justify-self: start;
    text-align: left;
  }
}
@media (max-width: 720px) {
  .schedule-event,
  .schedule-event-copy,
  .schedule-date {
    min-width: 0;
  }
}
@media (max-width: 380px) {
  .schedule-filter-row {
    grid-template-columns: 1fr !important;
  }
}

/* Trust and policy pages: stack action rows before they become cramped. */
.partner-card,
.revenue-card,
.partner-contact,
.partner-principles,
.disclosure-policy {
  min-width: 0;
}
.partner-card h3,
.revenue-card h3,
.partner-contact h2,
.partner-principles h2,
.disclosure-policy h2 {
  overflow-wrap: anywhere;
}
@media (max-width: 560px) {
  .partner-actions {
    align-items: stretch;
    flex-direction: column;
  }
  .partner-actions .button,
  .partner-contact > .button,
  .partner-contact > [aria-disabled="true"] {
    width: 100%;
    min-height: 48px;
    justify-content: center;
    text-align: center;
  }
}