/* Home redesign (Felix, 15 Oct 2026). Design lane only: restyles the existing markup with the tokens. */

/* ---- Phone search bar: one row instead of two (sticky area 191px -> ~143px) ---- */
@media (max-width:759px){
  .page-home .mobile-discovery{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:stretch}
  .page-home .mobile-discovery>.mobile-search-summary{min-height:48px;padding-block:6px;min-width:0}
  .page-home .mobile-discovery>.mobile-search-summary [data-mobile-summary]{min-width:0}
  .page-home .mobile-discovery>.mobile-search-summary small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .page-home .mobile-discovery>.mobile-search-summary .mobile-edit-label{display:none}
  .page-home .mobile-discovery>.mobile-discovery-controls{display:flex;gap:8px;margin:0;grid-template-columns:none}
  .page-home .mobile-discovery>.mobile-discovery-controls>button{flex:none;width:auto;min-width:48px;min-height:48px;height:auto;padding:0 12px;font-size:13.5px;gap:6px}
  .page-home .mobile-discovery>.mobile-only-summary{grid-column:1/-1}
}

/* ---- Weekend and festival cards: swipe rows on phones ------------------- */
@media (max-width:759px){
  .page-home #main .weekend-cards,.page-home #main .festival-cards{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;gap:12px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(-1 * var(--gg-gutter));padding-inline:var(--gg-gutter);scroll-padding-inline:var(--gg-gutter);padding-bottom:4px}
  .page-home #main .weekend-cards::-webkit-scrollbar,.page-home #main .festival-cards::-webkit-scrollbar{display:none}
  .page-home #main .weekend-cards>*,.page-home #main .festival-cards>*{scroll-snap-align:start;margin:0;min-width:0}
}

/* ---- Weekend cards: poster band in the category colour (no photo lookup) -- */
.page-home #main .weekend-card{overflow:hidden}
.page-home #main .weekend-card>a::before{content:"";display:block;height:72px;margin:-16px -16px 14px;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--category-color,var(--gg-text-3)) 16%,transparent) 0 14px,color-mix(in srgb,var(--category-color,var(--gg-text-3)) 6%,transparent) 14px 28px),var(--gg-bg-hero);border-bottom:1px solid var(--gg-border)}
.page-home #main .weekend-card:has(.type-live-music){--category-color:var(--gg-cat-live-bands)}
.page-home #main .weekend-card:has(.type-dj){--category-color:var(--gg-cat-djs)}
.page-home #main .weekend-card:has(.type-festival){--category-color:var(--gg-cat-festivals)}
.page-home #main .weekend-card:has(.type-concert){--category-color:var(--gg-cat-concerts)}
.page-home #main .weekend-card:has(.type-theatre){--category-color:var(--gg-cat-theatre)}
.page-home #main .weekend-card:has(.type-comedy){--category-color:var(--gg-cat-comedy)}
.page-home #main .weekend-card:has(.type-cabaret){--category-color:var(--gg-cat-cabaret)}
.page-home #main .weekend-card:has(.type-dance){--category-color:var(--gg-cat-dance)}
.page-home #main .weekend-card:has(.type-cultural){--category-color:var(--gg-cat-cultural)}
.page-home #main .weekend-card:has(.type-family){--category-color:var(--gg-cat-family)}
.page-home #main .weekend-card:has(.type-tribute){--category-color:var(--gg-cat-tribute)}
.page-home #main .weekend-card:has(.type-other-entertainment){--category-color:var(--gg-cat-other)}
.page-home #main .weekend-card time{color:var(--gg-success);font-family:var(--gg-font-display);font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:12px}

/* ---- Category tiles: shorter on small phones ----------------------------- */
@media (max-width:559px){
  .page-home #main .category-tiles{gap:8px}
  .page-home #main .category-tiles button{min-height:0;height:96px}
}

/* ---- Date shortcuts: Tonight, Tomorrow, This weekend, Next 7 days -------- */
.page-home .date-shortcuts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.page-home .date-shortcuts form{margin:0}
.page-home .date-shortcuts button{min-height:44px;padding:0 18px;border-radius:var(--gg-radius);border:1px solid var(--gg-border-strong);background:color-mix(in srgb,var(--gg-surface) 85%,transparent);color:var(--gg-text-1);font:600 14px/1 var(--gg-font-display);cursor:pointer;transition:background-color var(--gg-dur) var(--gg-ease),border-color var(--gg-dur) var(--gg-ease)}
.page-home .date-shortcuts button:hover{background:var(--gg-surface-3);border-color:var(--gg-text-4)}
.page-home .date-shortcuts button:focus-visible{outline:2px solid var(--gg-link);outline-offset:2px}
.page-home .date-shortcuts.in-hero{margin:18px auto 0}
.page-home .date-shortcuts.on-phone{display:none}
.page-home .discovery-hero .quick-links{margin-top:12px}
.page-home .discovery-hero .quick-links button{opacity:.85}
@media (max-width:759px){
  .page-home .date-shortcuts.in-hero{display:none}
  .page-home .date-shortcuts.on-phone{display:flex;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;margin:12px calc(-1 * var(--gg-gutter)) 0;padding:0 var(--gg-gutter)}
  .page-home .date-shortcuts.on-phone::-webkit-scrollbar{display:none}
  .page-home .date-shortcuts.on-phone button{white-space:nowrap;padding:0 16px}
}

/* ---- Browse Australia: 4 across (2 on phones), with a chevron ------------ */
.page-home #main .browse-region-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.page-home #main .browse-region-grid button{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:64px;padding:0 18px;text-align:left}
.page-home #main .browse-region-grid button::after{content:"";flex:none;width:8px;height:8px;border-top:2px solid var(--gg-text-3);border-right:2px solid var(--gg-text-3);transform:rotate(45deg);margin-right:4px}
.page-home #main .browse-region-grid button:hover::after{border-color:var(--gg-text)}
@media (max-width:759px){
  .page-home #main .browse-region-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .page-home #main .browse-region-grid button{min-height:56px;padding:0 14px}
}

/* ---- Phone search bar: fit long dates and filter counts ------------------ */
@media (max-width:759px){
  .page-home .mobile-discovery{grid-template-columns:minmax(132px,1fr) auto}
  .page-home .mobile-discovery>.mobile-discovery-controls>button{max-width:118px;min-width:0;overflow:hidden}
  .page-home .mobile-discovery>.mobile-discovery-controls>button>span[data-mobile-date-label]{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .page-home .mobile-discovery>.mobile-search-summary strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  /* The chosen-area chips repeat the summary line; hide them on the home page */
  .page-home .mobile-discovery>.mobile-only-summary{display:none}
}
/* Very small phones (under 360px): search summary on its own row */
@media (max-width:359px){
  .page-home .mobile-discovery{grid-template-columns:minmax(0,1fr)}
  .page-home .mobile-discovery>.mobile-discovery-controls>button{flex:1 1 0;max-width:none}
}
.page-home .view-all-gigs a{display:inline-flex;align-items:center;min-height:44px}

/* ---- Less empty space between the hero shortcuts and Featured (60px -> 32px) */
@media (min-width:760px){
  .page-home #main>.discovery-hero{padding-bottom:12px;margin-bottom:0}
  .page-home #main>.featured-strip{margin-top:20px}
}