/**
 * discover-critical.css
 * Critical FOUC-prevention only.
 * Full sheet/listing/card geometry lives in bottomsheet.css, listings.css, and spot-card.css.
 */
.desktop-address-ellipsis {
  max-width: 260px !important;
  overflow: hidden !important;
  flex-wrap: nowrap !important;
}

.desktop-address-text {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
  max-width: 240px !important;
  min-width: 0 !important;
}

@media (max-width: 1100px) {
  .clickable-address,
  .desktop-address-ellipsis,
  [data-address] {
    max-width: none !important;
    overflow: visible !important;
    flex-wrap: wrap !important;
  }

  .clickable-address > span,
  .desktop-address-text,
  [data-address] > span {
    flex: none !important;
    min-width: auto !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .gravel-surface-container,
  .backyard-access-container {
    transform: none !important;
  }
}
/*
 * FOUC: minimal .spot-card shell before/around spot-card.css (discover only).
 * Scoped to body.discover-page; full styling lives in components/spot-card.css.
 */
body.discover-page .spot-card {
  margin: 0 !important;
  box-sizing: border-box !important;
  border-radius: var(--radius-lg, 0.75rem) !important;
  border: 1px solid var(--border-subtle, #ebebeb) !important;
  background: var(--bg-primary, #ffffff) !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Pass 3: first-paint feed title + thumb shell (full rules in spot-card.css) */
body.discover-page .spot-card.discover-listing-card .discover-listing-title-static {
  display: block !important;
  max-width: 100% !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

body.discover-page .spot-card.discover-listing-card .discover-listing-thumb {
  aspect-ratio: 5 / 4;
  border-radius: 0.75rem !important;
  overflow: hidden !important;
  background: var(--discover-premium-wash, #f5f3ef) !important;
}

body.discover-page .spot-card[class*="bg-gradient"],
body.discover-page .spot-card.bg-gradient-to-br,
body.discover-page .spot-card.bg-gradient-to-r,
body.discover-page .spot-card.bg-gradient-to-l,
body.discover-page .spot-card.bg-gradient-to-t {
  background: unset !important;
}

html.dark body.discover-page .spot-card:not([class*="bg-gradient"]):not(.bg-gradient-to-br):not(.bg-gradient-to-r):not(.bg-gradient-to-l):not(.bg-gradient-to-t),
.dark body.discover-page .spot-card:not([class*="bg-gradient"]):not(.bg-gradient-to-br):not(.bg-gradient-to-r):not(.bg-gradient-to-l):not(.bg-gradient-to-t) {
  background: var(--bg-card-dark, rgba(31, 41, 55, 0.95)) !important;
  border: 1px solid var(--border-dark, rgba(255, 255, 255, 0.12)) !important;
}

html.dark body.discover-page .spot-card[class*="bg-gradient"],
html.dark body.discover-page .spot-card.bg-gradient-to-br,
html.dark body.discover-page .spot-card.bg-gradient-to-r,
html.dark body.discover-page .spot-card.bg-gradient-to-l,
html.dark body.discover-page .spot-card.bg-gradient-to-t,
.dark body.discover-page .spot-card[class*="bg-gradient"],
.dark body.discover-page .spot-card.bg-gradient-to-br,
.dark body.discover-page .spot-card.bg-gradient-to-r,
.dark body.discover-page .spot-card.bg-gradient-to-l,
.dark body.discover-page .spot-card.bg-gradient-to-t {
  background: unset !important;
}

body.discover-page .spot-card .flex-1 {
  padding-top: 0rem !important;
  padding-bottom: 0rem !important;
}

body.discover-page .spot-card .mb-1 {
  margin-bottom: 0.125rem !important;
  margin-top: 1px !important;
}