/* Styles for templates/point/public.html, a ZienzPoint cafe's public page.

   The page is built from the city page's hv- pieces (home_v2.css, loaded
   alongside): the gold stage, the brown cafe card, the cream tickets. Only
   what the city page has no equivalent for lives here, under a pp- prefix.
   Plain CSS rather than Tailwind utilities, so no rebuild is needed. Solid
   colours only, like home_v2.css. */

/* Shown to our side and the cafe's staff while the page is not public. */
.pp-notice { background: #fee2e2; color: #991b1b; font-size: .9rem; font-weight: 600; padding: 12px 0; }
.pp-notice i { margin-right: 6px; }

.pp-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 22px; }
.pp-top .hv-points__eyebrow { margin-bottom: 0; }
.pp-top__link {
    display: inline-flex; align-items: center; gap: 8px; color: var(--hv-ink); font-weight: 700; font-size: .85rem;
    text-decoration: underline; text-underline-offset: 4px;
}
.pp-top__link:hover { color: #6b462a; }

/* The card is the page's headline here, not one of a row. */
.pp-hero .hv-point__name { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.pp-desc { color: var(--hv-text-soft); line-height: 1.65; white-space: pre-line; }
.pp-address { font-size: .82rem; color: var(--hv-text-dim); line-height: 1.5; }

.pp-block + .pp-block { margin-top: 56px; }

/* Past events: plain rows, quieter than the tickets above them. */
.pp-past { display: grid; gap: 10px; }
.pp-past__row {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px;
    padding: 14px 18px; border-radius: 14px; background: #fff; border: 1px solid var(--hv-ticket-line);
    color: var(--hv-ink); transition: border-color .2s;
}
.pp-past__row:hover { border-color: var(--hv-gold-dark); }
.pp-past__date { flex-basis: 100%; font-size: .72rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--hv-muted); }
.pp-past__name { font-family: 'Playfair Display', serif; font-weight: 700; font-size: 1.15rem; line-height: 1.25; }
.pp-past__meta { display: inline-flex; flex-wrap: wrap; gap: 4px 14px; margin-left: auto; font-size: .85rem; color: #6b462a; }
.pp-past__meta i { color: var(--hv-gold-dark); margin-right: 4px; }

/* What a ZienzPoint is, for someone who scanned the QR on the window and
   has never heard of us. */
.pp-about {
    display: flex; align-items: flex-start; gap: 22px;
    padding: 28px 24px; border-radius: 22px; background: var(--hv-brown); color: #fff;
}
@media (min-width: 900px) { .pp-about { padding: 34px 40px; } }
.pp-about__pin { height: 72px; width: auto; flex: none; }
.pp-about__pin .hv-zpin__pin { fill: var(--hv-gold); }
.pp-about__pin .hv-zpin__z { fill: var(--hv-brown); stroke: var(--hv-brown); }
.pp-about__title { font-family: 'Playfair Display', serif; font-weight: 700; font-size: clamp(1.4rem, 3vw, 1.8rem); line-height: 1.15; }
.pp-about__text { margin: 10px 0 16px; color: var(--hv-text-soft); line-height: 1.65; max-width: 40rem; }
@media (max-width: 599px) {
    .pp-about { flex-direction: column; gap: 14px; }
    .pp-about__pin { height: 56px; }
}
