/* splitt.party-only components on rijeka.party's layout (loaded after the ported stylesheets).
   Colours come from the ported tokens: --rp-* on inner pages, the homepage's own on / and /hr/. */
:root {
  --sp-ink: var(--rp-ink, var(--ink, #0b0d13));
  --sp-panel: var(--rp-panel, var(--ink-soft, #131622));
  --sp-paper: var(--rp-paper, var(--paper, #f4f6fb));
  --sp-muted: var(--rp-muted, var(--muted, #969db0));
  --sp-line: var(--rp-line, var(--line, rgba(244, 246, 251, .14)));
  --sp-red: var(--rp-acid, var(--acid, #ff3b55));
  --sp-blue: var(--rp-coral, var(--coral, #5b8bff));
  --sp-light: var(--rp-cyan, var(--cyan, #a9c4ff));
}

/* Homepage FAQ (visible text behind the FAQPage structured data) */
.faq-section .faq-grid { max-width: 920px; margin-top: 28px; display: grid; gap: 12px; }
.faq-section .faq-item { border: 1px solid var(--sp-line); border-radius: 18px; background: rgba(255, 255, 255, .025); }
.faq-section .faq-item[open] { border-color: rgba(255, 59, 85, .45); }
.faq-section .faq-item summary { padding: 20px 22px; display: flex; justify-content: space-between; gap: 16px; cursor: pointer; list-style: none; font-weight: 800; }
.faq-section .faq-item summary::-webkit-details-marker { display: none; }
.faq-section .faq-item summary::after { content: "+"; color: var(--sp-red); font-size: 1.3rem; line-height: 1; transition: transform .2s; }
.faq-section .faq-item[open] summary::after { transform: rotate(45deg); }
.faq-section .faq-answer { margin: 0; padding: 0 22px 20px; color: var(--sp-muted); line-height: 1.65; }
.faq-section .faq-answer a { color: var(--sp-light); font-weight: 700; }

/* Club pages: headings, notes and the venue's event list in rijeka's row style */
.venue-h2 { margin: 0 0 1rem; color: var(--sp-paper); font-family: "RP Syne", "Syne", sans-serif; font-size: clamp(1.35rem, 3vw, 1.85rem); letter-spacing: -.03em; line-height: 1.1; }
.venue-h3 { margin: 1.5rem 0 .6rem; color: var(--sp-muted); font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.venue-note { margin: .5rem 0; color: var(--sp-muted); line-height: 1.65; }
.venue-note a, .venue-related a { color: var(--sp-light); font-weight: 700; }
.venue-events { margin: 0; padding: 0; list-style: none; display: grid; border-top: 1px solid var(--sp-line); }
.venue-events li { border-bottom: 1px solid var(--sp-line); }
.venue-events a { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1.4rem; padding: 1rem .25rem; color: var(--sp-paper); font-weight: 700; transition: background .2s, padding .2s; }
.venue-events a:hover { padding-left: .75rem; background: rgba(255, 255, 255, .035); }
.venue-events time { min-width: 7.5rem; color: var(--sp-red); font-family: "RP Syne", "Syne", sans-serif; font-weight: 800; font-variant-numeric: tabular-nums; }
.venue-events.is-past a { color: var(--sp-muted); }
.venue-events.is-past time { color: var(--sp-muted); }
.hub-ev-meta { color: var(--sp-muted); font-size: .85rem; font-weight: 500; }
.venue-related a { display: block; padding: .9rem 1.1rem; border: 1px solid var(--sp-line); border-radius: 14px; background: var(--sp-panel); }
.venue-related a:hover { border-color: var(--sp-blue); }
.venue-sources { max-width: 880px; margin-top: 2.5rem; color: var(--sp-muted); font-size: .8rem; line-height: 1.6; }

/* Ended event notice */
.event-passed { margin: 0 0 1.5rem; padding: 1rem 1.2rem; color: var(--sp-paper); border: 1px solid var(--sp-red); border-radius: 14px; background: rgba(255, 59, 85, .06); line-height: 1.6; }
.event-passed a { color: var(--sp-light); font-weight: 800; }


/* Homepage FAQ heading: rijeka's section titles never wrap; this one is a sentence */
.faq-section .section-title { white-space: normal; font-size: clamp(2.2rem, 5vw, 4.6rem); }

/* rijeka's skip link (the homepage stylesheet has it; inner pages need it too) */
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 100; padding: 12px 16px; color: var(--sp-ink); background: var(--sp-red); border-radius: 999px; transform: translateY(-150%); }
.skip-link:focus { transform: none; }

/* Hub and club pages: event lists use rijeka's discovery rows */
.venue-block { margin-top: clamp(2.5rem, 6vw, 4.5rem); }
.venue-block .discovery-event-list { margin-top: 1rem; }
.discovery-event-list.is-past { opacity: .62; }
.club-page-actions + .venue-block, .club-page-actions + section { margin-top: clamp(2.5rem, 6vw, 4.5rem); }