/* =============================================================
   Pozostałe podstrony — nowy wygląd (październik 2026), styl live trackera:
   polityka, regulamin, nota prawna, wynajem, reklama, wydarzenia,
   płatność (checkout), podziękowanie (thank-you).
   Nakładka na stare style: prefiks `html body` wygrywa ze style.css,
   checkout.css, buy-tickets.css i <style> w plikach stron.
   Tokeny --ui-*: style/navbar.css.
   ============================================================= */

html body { background: var(--ui-ground); color: var(--ui-ink); }

/* ── nagłówek podstrony ── */
html body .page-hero {
    background: var(--ui-ground);
    color: var(--ui-ink);
    padding: 40px 24px 16px;
    min-height: 0;
    text-align: left;
    overflow: visible;
}
html body .page-hero::before, html body .page-hero::after { content: none; display: none; }
html body .page-hero .page-hero-content {
    max-width: 1200px; margin: 0 auto; padding: 0;
    text-align: left;
    display: flex; flex-direction: column; align-items: flex-start; gap: 14px;
}
html body .page-hero h1 { margin: 0; font-size: 48px; line-height: 1.06; font-weight: 800; letter-spacing: -0.02em; color: var(--ui-ink); text-shadow: none; }
html body .page-hero .hero-subtitle { margin: 0; font-size: 18px; line-height: 1.5; color: var(--ui-muted); max-width: 40em; opacity: 1; }

/* etykieta nad tytułem */
html body .tag-red-pill {
    display: inline-flex; align-items: center;
    background: none; color: var(--ui-muted);
    padding: 0; border: none; border-radius: 0;
    font-size: 12px; font-weight: 700;
    text-transform: uppercase; letter-spacing: .06em;
    box-shadow: none;
}

/* przyciski */
html body .btn-gradient {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    min-height: 48px; padding: 0 22px;
    border: none; border-radius: 14px;
    background: var(--ui-red);
    color: #FFFFFF;
    font-weight: 800; font-size: 15px;
    text-decoration: none;
    box-shadow: none;
    transform: none;
}
html body .btn-gradient:hover { background: var(--ui-red-dark); color: #FFFFFF; transform: none; box-shadow: none; }
html body .btn-gradient:focus-visible { outline: 3px solid var(--ui-ink); outline-offset: 2px; }

/* ── sekcje treści ── */
html body .rental-section, html body .events-section, html body .advert-section,
html body .groups-detail-section, html body .subpage-teaser-section, html body .advert-stats-section,
html body .legal-section { background: transparent; padding: 32px 24px; }
html body .section-title { font-size: 36px; line-height: 1.1; font-weight: 800; color: var(--ui-ink); }
html body .section-subtitle { color: var(--ui-muted); font-size: 16px; line-height: 1.55; }
html body .rental-section .container, html body .events-section .container, html body .advert-section .container,
html body .groups-detail-section .container, html body .subpage-teaser-section .container, html body .advert-stats-section .container { max-width: 1200px; padding: 0; }
html body .events-header, html body .advert-header { text-align: left; }

/* karty */
html body .event-card, html body .subpage-teaser-card, html body .advert-stat-card, html body .groups-stat,
html body .rental-bus-card, html body .groups-visual-card, html body .advert-format-block {
    background: var(--ui-card);
    border: none;
    border-radius: 22px;
    box-shadow: none;
    color: var(--ui-ink);
}
html body .event-card:hover, html body .subpage-teaser-card:hover, html body .advert-stat-card:hover { transform: none; box-shadow: 0 6px 24px rgba(23, 24, 28, .08); }
html body .event-card h3, html body .subpage-teaser-card h3, html body .advert-format-title { color: var(--ui-ink); font-weight: 800; }
html body .event-card p, html body .subpage-teaser-card p, html body .advert-format-desc, html body .advert-format-subtitle { color: var(--ui-muted); }

/* ikony (zamiast emoji) */
html body .event-icon, html body .teaser-icon, html body .advert-format-emoji {
    width: 48px; height: 48px;
    border-radius: 14px;
    background: #FBE6E7; color: var(--ui-red);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 0;
    margin-bottom: 8px;
}
html body .rental-bus-icon, html body .groups-visual-icon {
    width: 72px; height: 72px;
    border-radius: 20px;
    background: var(--ui-red); color: #FFFFFF;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 0;
    margin: 0 auto 12px;
}
html body .teaser-arrow { color: var(--ui-ink); }

/* liczby */
html body .advert-stat-num, html body .groups-stat-num { color: var(--ui-ink); font-weight: 800; background: none; -webkit-text-fill-color: currentColor; }
html body .advert-stat-label, html body .groups-stat-label { color: var(--ui-muted); }

/* wynajem */
html body .rental-features li { color: var(--ui-ink); }
html body .rental-check {
    width: 22px; height: 22px;
    border-radius: 50%;
    background: #E4ECFB; color: var(--ui-blue);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 800;
}
html body .rental-note { color: var(--ui-muted); }
html body .rental-bus-label { color: var(--ui-ink); font-weight: 800; }
html body .rental-bus-sub { color: var(--ui-muted); }
html body .rental-bus-tags span, html body .groups-visual-badges span, html body .events-badge {
    display: inline-flex; align-items: center; gap: 6px;
    background: var(--ui-ground); color: var(--ui-ink);
    border: none; border-radius: 999px;
    padding: 6px 12px;
    font-size: 13px; font-weight: 700;
}
html body .events-badge { background: var(--ui-card); }

/* reklama: grafiki formatów zostają, tylko tło i teksty */
html body .advert-format-number { color: var(--ui-red); }
html body .advert-format-feats li { color: var(--ui-ink); }
html body .advert-reach { color: var(--ui-muted); }
html body .advert-reach-num { color: var(--ui-ink); }

/* ── dokumenty prawne ── */
html body .legal-content {
    max-width: 880px; margin: 0 auto;
    background: var(--ui-card);
    border-radius: 24px;
    padding: 36px;
    box-shadow: none;
}
html body .legal-updated {
    display: inline-flex;
    background: var(--ui-ground); color: var(--ui-muted);
    border-radius: 999px; padding: 6px 12px;
    font-size: 13px; font-weight: 700;
    margin-bottom: 20px;
}
html body .legal-block { margin-bottom: 26px; border: none; padding: 0; }
html body .legal-block h2 { font-size: 22px; font-weight: 800; color: var(--ui-ink); margin: 0 0 10px; }
html body .legal-block h3 { font-size: 17px; font-weight: 800; color: var(--ui-ink); margin: 16px 0 6px; }
html body .legal-block p, html body .legal-block li { font-size: 16px; line-height: 1.65; color: #3E4148; }
html body .legal-block ul { padding-left: 20px; }
html body .legal-block a { color: var(--ui-red); }

/* ── płatność (checkout) ── */
/* body.bg-gyg (buy-tickets.css) zeruje odstęp pod przypiętym paskiem na każdej szerokości — dodajemy go tu */
html body .checkout-container { max-width: 1200px; margin: 0 auto; padding: calc(var(--navbar-height, 68px) + 32px) 24px 64px; }
html body .checkout-title { font-size: 36px; font-weight: 800; color: var(--ui-ink); margin-bottom: 20px; }
html body .checkout-layout { gap: 28px; }
html body #checkout-form { background: var(--ui-card); border-radius: 24px; padding: 24px; }
html body .co-field label { font-size: 12px; font-weight: 700; color: var(--ui-muted); text-transform: uppercase; letter-spacing: .06em; }
html body .co-field input[type=text], html body .co-field input[type=email], html body .co-field input[type=tel],
html body .co-field input[type=date], html body .co-field select {
    min-height: 48px; padding: 0 14px;
    border: 1px solid var(--ui-line); border-radius: 12px;
    font-size: 15px; color: var(--ui-ink);
}
html body .co-field input:focus, html body .co-field select:focus { border-color: var(--ui-ink); box-shadow: 0 0 0 3px rgba(23, 24, 28, .12); }
html body .co-checkbox-label { color: var(--ui-ink); font-weight: 600; }
html body .co-checkbox-label input[type=checkbox] { accent-color: var(--ui-ink); }
html body .co-invoice-fields { background: var(--ui-ground); border: none; border-radius: 16px; }
html body .co-coupon-apply-btn { height: 48px; border-radius: 12px; background: var(--ui-ink); font-weight: 800; }
html body .co-coupon-apply-btn:hover:not(:disabled) { background: #000000; }
html body .co-error { border: none; border-radius: 12px; background: #FBE6E7; color: var(--ui-red-dark); }
html body .co-submit-btn { min-height: 56px; border-radius: 14px; font-size: 16px; width: 100%; }
html body .co-secure-note { color: var(--ui-muted); font-size: 13px; }
html body .co-secure-note i, html body .co-summary-meta i { color: var(--ui-live); }
html body .co-summary { background: var(--ui-card); border: none; border-radius: 24px; padding: 22px; box-shadow: 0 12px 40px rgba(23, 24, 28, .10); }
html body .co-summary h2 { font-size: 20px; font-weight: 800; color: var(--ui-ink); }
html body .co-summary-row { color: var(--ui-ink); font-size: 15px; }
html body .co-summary-divider, html body .co-summary-meta { border-color: var(--ui-line); }
html body .co-summary-total { font-size: 20px; font-weight: 800; }
html body .co-summary-meta p { color: var(--ui-muted); font-size: 13px; }
html body .checkout-summary-col { top: calc(var(--navbar-height, 68px) + 20px); }

/* ── podziękowanie (thank-you) ── */
html body .ty-wrap { max-width: 640px; margin: 0 auto; padding: 48px 20px 72px; }
html body .ty-icon { background: var(--ui-live); box-shadow: none; }
html body .ty-title { font-size: 36px; font-weight: 800; color: var(--ui-ink); }
html body .ty-subtitle { color: var(--ui-muted); }
html body .ty-card { background: var(--ui-card); border: none; border-radius: 22px; box-shadow: none; text-align: left; }
html body .ty-row { border-bottom-color: var(--ui-line); color: var(--ui-ink); }
html body .ty-btn { min-height: 48px; border-radius: 14px; font-weight: 800; box-shadow: none; display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
html body .ty-btn-primary { background: var(--ui-red); color: #FFFFFF; border: none; }
html body .ty-btn-primary:hover { background: var(--ui-red-dark); color: #FFFFFF; }
html body .ty-btn-secondary { background: var(--ui-card); color: var(--ui-ink); border: 1px solid var(--ui-line); }

/* ── telefon ── */
@media (max-width: 768px) {
    html body .page-hero { padding: 24px 16px 8px; }
    html body .page-hero h1 { font-size: 32px; }
    html body .page-hero .hero-subtitle { font-size: 16px; }
    html body .section-title { font-size: 28px; }
    html body .rental-section, html body .events-section, html body .advert-section,
    html body .groups-detail-section, html body .subpage-teaser-section, html body .advert-stats-section,
    html body .legal-section { padding: 24px 16px; }
    html body .legal-content { padding: 22px; border-radius: 20px; }
    html body .checkout-container { padding: calc(var(--navbar-height, 68px) + 20px) 16px 48px; }
    html body .checkout-title { font-size: 28px; }
    html body #checkout-form { padding: 18px; border-radius: 20px; }
    html body .ty-title { font-size: 28px; }
}
/* style.css zeruje padding body do 480 px — wtedy odstęp pod paskiem daje treść */
@media (max-width: 480px) {
    html body .page-hero { padding-top: calc(var(--navbar-height, 68px) + 20px); }
    html body .ty-wrap { padding-top: calc(var(--navbar-height, 68px) + 24px); }
}

/* stare dekoracje nagłówków dokumentów (czerwone podkreślenie) */
html body .legal-block h2 { border: none; padding: 0; }
html body .legal-block h2::after, html body .legal-block h2::before { content: none; display: none; }

/* Wynajem, reklama, wydarzenia: sekcja pod nagłówkiem powtarzała ten sam tytuł
   i opis co nagłówek strony (te sekcje są używane tylko na tych stronach). */
html body .page-hero ~ .events-section .events-header,
html body .page-hero ~ .advert-section .advert-header,
html body .page-hero ~ .rental-section .rental-text > .tag-red-pill,
html body .page-hero ~ .rental-section .rental-text > .section-title,
html body .page-hero ~ .rental-section .rental-text > .section-subtitle { display: none; }