/* Poster-led event discovery, with FikaTicket's own artwork and identity. */
.discover-page { width: min(1320px, calc(100% - 4rem)); padding: 2.5rem 0 4rem; }
.discover-page .section-head { margin-bottom: 2rem; align-items: center; }
.discover-page h1 { margin-bottom: .65rem; font-size: clamp(2rem, 4vw, 3rem); letter-spacing: -.045em; }
.discover-page .eyebrow { font-size: .7rem; color: #a13a17; }
.discover-intro { margin: 0; color: #62666a; font-size: .95rem; }
.discover-page .discovery-layout { grid-template-columns: 270px minmax(0, 1fr); gap: 2rem; }
.discover-page .filter-disclosure { position: static; }
.discover-page .filter-disclosure > summary { border: 1px solid #e4e6e7; border-radius: 8px; }
.discover-page .filters { margin: 0; padding: 1.25rem; border: 1px solid #eceeef; border-radius: 8px; box-shadow: 0 2px 7px #18212b06; }
.discover-page .filter-clear { display: flex; align-items: center; justify-content: space-between; text-align: left; gap: .75rem; }
.discover-page .filter-clear strong { font-size: .95rem; }
.discover-page .filter-clear a { color: #a13a17; font-size: .8rem; text-underline-offset: 3px; }
.discover-page .field > span, .filter-facet legend { font-size: .85rem; color: #46505a; font-weight: 700; }
.discover-page input:not([type=radio]), .discover-page select { min-height: 44px; padding: .65rem .7rem; font-size: .85rem; border: 1px solid #dfe2e5; border-radius: 6px; }
.discover-page .filter-facet { padding-top: 1rem; margin-top: 1.2rem; border-top: 1px solid #eceeef; }
.filter-facet legend { float: left; width: 100%; margin-bottom: .65rem; }
.filter-facet legend + .facet-option { clear: both; }
.facet-option { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 38px; font-size: .83rem; color: #42484f; cursor: pointer; }
.facet-option span { min-width: 0; overflow-wrap: anywhere; }
.facet-option input { width: 17px; height: 17px; min-height: 0; flex: 0 0 17px; padding: 0; margin: 0; accent-color: #bf431a; }
.facet-option:has(input:checked) { color: #a13a17; font-weight: 700; }
.discover-page .filters details { margin-top: .55rem; }
.discover-page .filters summary { font-size: .8rem; color: #a13a17; }
.discover-page .filters > .button { border: 0; border-radius: 6px; background: #be421b; color: #fff; font-size: .875rem; }
.discover-page .filters > .button:hover { background: #a43716; }
.discover-page .results-toolbar { min-height: 44px; margin-bottom: 1.2rem; align-items: center; }
.discover-page .results-toolbar h2 { margin: 0; font: 700 .95rem/1.4 var(--font-body); letter-spacing: 0; }
.discover-page .results-toolbar .field { min-width: 0; grid-template-columns: auto 145px; align-items: center; gap: .65rem; }
.discover-page .results-toolbar .field > span { font-weight: 400; }
.discover-page .active-filters:empty { display: none; }
.event-grid, .discovery-grid { grid-auto-rows: 1fr; align-items: stretch; gap: 1.5rem; }
.event-card, .discovery-grid .event-card, .results-list .event-card { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; align-self: stretch; height: 100%; min-width: 0; border: 0; border-radius: 12px; background: #fff; color: #4b5b6b; box-shadow: 0 5px 16px #14202a0d; container-type: inline-size; transition: box-shadow .18s ease, transform .18s ease; }
.event-card:hover { transform: translateY(-3px); box-shadow: 0 9px 24px #14202a18; }
.event-card:focus-within { outline: 2px solid #a63b17; outline-offset: 3px; }
.event-art-link { display: block; grid-column: 1; grid-row: 1; min-width: 0; aspect-ratio: 1; overflow: hidden; text-decoration: none; }
.event-card .event-card-art, .discovery-grid .event-card .event-card-art { height: auto; min-height: 0; aspect-ratio: 1; border: 0; container-type: inline-size; }
.event-card-art::before { inset: 18%; border: 1px solid; transform: rotate(-22deg); border-radius: 0 50% 50% 50%; opacity: .15; }
.poster-fallback { position: absolute; inset: 0; width: 100%; height: 100%; padding: clamp(.7rem, 4cqw, 1.3rem); display: flex; flex-direction: column; justify-content: center; gap: clamp(.35rem, 2.2cqw, .8rem); overflow: hidden; }
.poster-kicker { font-size: clamp(.4rem, 2cqw, .6rem); line-height: 1.4; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.event-card .event-card-art .art-word { margin-top: auto; font-size: clamp(1.4rem, 14cqw, 4.6rem); overflow-wrap: anywhere; }
.poster-title { max-width: 24ch; font: 700 clamp(.72rem, 4cqw, 1.15rem)/1.15 var(--font-display); letter-spacing: -.03em; }
.poster-caption { display: flex; align-items: center; justify-content: space-between; margin-top: auto; padding-top: clamp(.35rem, 2cqw, .7rem); border-top: 1px solid #11110f55; font-size: clamp(.45rem, 2.5cqw, .7rem); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.poster-caption > span { font-size: 1.15rem; }
.event-card-art[data-category=music] { background-image: repeating-radial-gradient(ellipse at 100% 100%, transparent 0 22px, #11110f12 23px 24px, transparent 25px 40px); }
.event-card-art[data-category=culture] { background-image: linear-gradient(135deg, transparent 42%, #ffffff33 42% 60%, transparent 60%); }
.event-card-art[data-category=food] { background-image: radial-gradient(circle at 100% 5%, #ffffff66 0 26%, transparent 26%); }
.event-card-art:has(.event-artwork) .poster-fallback, .event-card-art:has(.event-artwork)::before { display: none; }
.event-card .event-card-art:has(.event-artwork), .discovery-grid .event-card .event-card-art:has(.event-artwork) { display: block; background: #eef0f2; }
/* Consistent square thumbnails; the event detail page still shows the full poster. */
.event-card-art .event-artwork { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.event-card .save-btn { position: absolute; top: .75rem; right: .75rem; margin: 0; width: 44px; height: 44px; border: 1px solid #ffffff99; background: #ffffffef; color: #4b5b6b; box-shadow: 0 2px 8px #00000014; }
.event-card .save-btn[aria-pressed=true] { background: #ffe0d5; color: #9f3411; }
.event-card .event-card-body, .discovery-grid .event-card .event-card-body { --card-title-size: clamp(1rem, 5.6cqw, 1.5rem); --card-venue-size: clamp(.95rem, 4.8cqw, 1.25rem); --card-meta-size: clamp(.75rem, 3.7cqw, 1rem); grid-column: 1; grid-row: 2; min-width: 0; display: block; padding: clamp(1.25rem, 6.4cqw, 2rem) clamp(1.25rem, 6.4cqw, 2rem) clamp(1rem, 4.8cqw, 1.5rem); }
/* Reserve identical title, venue and two-line date slots, including empty fields. */
.event-card .event-info { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: calc(var(--card-title-size) * 1.35) calc(var(--card-venue-size) * 1.4) calc(var(--card-meta-size) * 3); row-gap: clamp(1.25rem, 6.4cqw, 2rem); min-width: 0; }
.event-card .event-info h3, .discovery-grid .event-card h3 { min-height: 0; padding: 0; margin: 0; font: 700 var(--card-title-size)/1.35 var(--font-body); letter-spacing: -.025em; }
.event-card .event-info h3 a { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.event-card .event-info h3 a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.event-card .event-info .event-venue { margin: 0; min-height: 0; color: inherit; font-size: var(--card-venue-size); font-weight: 500; line-height: 1.4; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.event-when { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: .6rem; min-height: 0; margin: 0; color: inherit; font-size: var(--card-meta-size); line-height: 1.5; }
.event-when > time { min-width: 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; }
.event-when > span { white-space: nowrap; }
.event-card .status-pill { position: absolute; top: .75rem; left: .75rem; z-index: 2; max-width: calc(100% - 5rem); margin: 0; padding: .3rem .6rem; background: #fffffff2; font-size: .7rem; line-height: 1.4; border-width: 1px; pointer-events: none; }
.event-grid .home-event-card:first-child { grid-column: auto; }
.discover-page .page-number { border-color: #e4e6e7; border-radius: 5px; font-size: .85rem; }
.discover-page .page-number.selected { background: #be421b; border-color: #be421b; }

/* Make the complete poster the focus of the event header. */
.page > .event-hero, .artwork-event-preview { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: center; gap: clamp(1.5rem, 3vw, 2.5rem); padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid #eceeef; border-radius: 14px; overflow: hidden; background: #fff; box-shadow: 0 2px 8px #14202a08; }
.page > .event-hero > .event-poster, .artwork-event-preview > .event-poster { width: 100%; min-width: 0; min-height: 0; aspect-ratio: 4 / 5; border: 0; border-radius: 8px; align-items: center; justify-content: center; padding: 1.5rem; background-image: repeating-radial-gradient(ellipse at 75% 50%, transparent 0 36px, #11110f0d 37px 39px, transparent 40px 65px); }
.page > .event-hero > .event-poster > span { max-width: 100%; font-size: clamp(2.5rem, 5vw, 5rem); overflow-wrap: anywhere; }
.page > .event-hero > .event-poster:has(.event-artwork), .artwork-event-preview > .event-poster:has(.event-artwork) { aspect-ratio: auto; padding: 0; background: none; }
.page > .event-hero > .event-poster .event-artwork, .artwork-event-preview > .event-poster .event-artwork { position: static; display: block; width: 100%; height: auto; max-width: 100%; max-height: none; border-radius: 8px; object-fit: contain; }
.page > .event-hero .event-intro, .artwork-event-preview .event-intro { min-width: 0; padding: 0; overflow-wrap: anywhere; }
.page > .event-hero h1, .artwork-event-preview .event-intro h3 { margin: .75rem 0 1.5rem; max-width: 24ch; font-size: clamp(1.8rem, 3vw, 2.5rem); line-height: 1.12; letter-spacing: -.035em; }
.page > .event-hero .fact-list, .artwork-event-preview .fact-list { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.25rem 1.5rem; margin: 0; font-size: .9rem; }
.page > .event-hero .fact-list > div:first-child, .artwork-event-preview .fact-list > div:first-child { grid-column: 1 / -1; }
.page > .event-hero .fact-list div, .artwork-event-preview .fact-list div { min-width: 0; border: 0; padding: 0; }
.page > .event-hero .fact-list span, .artwork-event-preview .fact-list span { display: block; margin-bottom: .3rem; color: #62666a; font-size: .8rem; }
.page > .event-hero .button-row { margin-top: 1.5rem; gap: .5rem; }
.page > .event-hero .button-row .button { font-size: .8rem; min-height: 40px; border-color: #dfe2e5; border-radius: 6px; }
.page:has(> .event-hero) > .detail-grid { margin-top: 1.5rem; }
.page:has(> .event-hero) .prose-card, .page:has(> .event-hero) .booking-card { border: 1px solid #eceeef; border-radius: 8px; box-shadow: 0 2px 8px #14202a08; }
.page:has(> .event-hero) .booking-card { top: 1rem; }
.page:has(> .event-hero) .prose-card h2, .page:has(> .event-hero) .booking-card > h2 { font: 700 1.4rem/1.25 var(--font-body); letter-spacing: -.02em; }

@media (min-width: 901px) {
  .discover-page .filter-disclosure > summary { display: none; }
  .discover-page .filter-disclosure:not([open]) > .filters { display: block; }
}
@media (max-width: 1100px) and (min-width: 901px) {
  .discover-page .discovery-layout { grid-template-columns: 235px minmax(0, 1fr); gap: 1.25rem; }
  .discovery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .discover-page { width: min(760px, calc(100% - 2rem)); padding-top: 1.5rem; }
  .discover-page .discovery-layout { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .discover-page .filter-disclosure .filters { margin-top: .5rem; }
  .discovery-grid, .event-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .page > .event-hero, .artwork-event-preview { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding: 1rem; }
  .page > .event-hero .fact-list, .artwork-event-preview .fact-list { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
}
@media (max-width: 600px) {
  .discover-page .section-head { gap: .75rem; align-items: start; }
  .discover-page .section-head > .button { min-height: 40px; padding: .45rem .65rem; font-size: .75rem; white-space: nowrap; }
  .discover-page h1 { font-size: 1.8rem; }
  .discover-intro { font-size: .85rem; }
  .discover-page .results-toolbar .field { grid-template-columns: 120px; }
  .discover-page .results-toolbar .field > span { position: absolute; width: 1px; height: 1px; clip-path: inset(50%); overflow: hidden; }
  .discovery-grid, .event-grid { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .page > .event-hero .button-row { gap: .5rem; }
}
@media (hover: hover) and (pointer: fine) {
  .event-card .save-btn { opacity: 0; }
  .event-card:hover .save-btn, .event-card:focus-within .save-btn, .event-card .save-btn[aria-pressed=true] { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .event-card { transition: none; }
  .event-card:hover { transform: none; }
}

/* Full artwork in the upload preview and organiser thumbnails as well. */
.artwork-preview img, .artwork-preview canvas, .mini-poster img, .org-event-name img { object-fit: contain; object-position: center; }
.artwork-preview.has-image { aspect-ratio: auto; border: 1px solid var(--line); background: none; }
.artwork-preview img, .artwork-preview canvas { position: static; width: 100%; height: auto; }
.artwork-preview canvas { cursor: default; touch-action: auto; }
