@charset "UTF-8";
/* ==========================================================================
   SZBMRTT — /rendezvenyek aloldal stíluslapja
   Csak a jegyzék oldalára új osztályokat definiál; a .event-list,
   .event__date, .event__title, .event__place alapstílusait a style.css
   adja, így az arculat egy helyen marad.
   ========================================================================== */

/* --- A sticky évtized-sáv magassága (S5) ----------------------------------
   Mért érték (a .quicknav a: 6px padding + 1px border + 12px betű 1.6-os
   line-heightja = 33.2px, a sáv 10px paddingja + 1px alsó vonal): 54.2px.
   Az .ev horgonyok scroll-margin-top-ját vezérli, hogy a horgonyok a sáv
   ALATT landoljanak. A <=639px blokk (kisebb link-padding) felülírja. */
:root {
  --decade-h: 54px;
}

/* --- Átvett horgonyok: a rögzített fejléc ne takarja ki a célt -------------
   A globális `html { scroll-padding-top: calc(var(--header-h) + 16px) }`
   (style.css) + az .ev scroll-margin-top (--decade-h, S5) együtt: a cél a
   fejléc alatt, a sticky évtized-sáv ALATT, 16px réssel landol. A szekciók
   (#konferenciak, #szimpozionok) a jegyzék elején vannak, a sáv ott még a
   természetes helyén áll, ezért náluk 0 marad. */
#konferenciak,
#szimpozionok {
  scroll-margin-top: 0;
}

.ev {
  scroll-margin-top: var(--decade-h);
}

/* --------------------------------------------------------------------------
   Évtized szeratti ugrás-sáv (tisztán HTML/CSS, nem kell hozzá JS)
   -------------------------------------------------------------------------- */
.quicknav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s-1);
  align-items: center;
}

.quicknav a {
  display: inline-block;
  padding: 6px 14px;
  border: 1px solid var(--c-line-strong);
  background: var(--c-bg);
  color: var(--c-primary);
  font-family: var(--f-mono);
  font-size: var(--t-xxs);
  letter-spacing: .04em;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .18s var(--ease), border-color .18s var(--ease),
              color .18s var(--ease);
}

.quicknav a:hover,
.quicknav a:focus-visible {
  background: var(--c-primary);
  border-color: var(--c-primary-dark);
  color: #fff;
  text-decoration: none;
}

/* A sticky évtized-sáv (S5): közvetlenül a .wrap gyermeke (nem a
   .section__head-ben), így a sticky a teljes jegyzéken végigfut. Egy sorban
   tartja a linkeket (keskeny kijelzőn vízszintesen görgethető), ezért a
   magassága állandó — erre épül a --decade-h. A teljes szélességű,
   átlátszatlan háttér + alsó vonal takarja a rácsúszó tartalmat. */
.quicknav--decade {
  position: sticky;
  top: var(--header-h);
  z-index: 10;                      /* a fejléc (100) és a .to-top (50) alatt */
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-inline: -20px;             /* .wrap padding-inline: 20px */
  padding-inline: 20px;
  padding-block: 10px;
  background: var(--c-bg);
  border-bottom: 1px solid var(--c-line);
}

.section--alt .quicknav--decade { background: var(--c-bg-alt); }

/* A linkek nem zsugorodnak (különben 2 sorba törnének és nőne a sáv) */
.quicknav--decade > a { flex-shrink: 0; }

/* Vissza a tetejére — a lap alján, elválasztva a tartalomtól */
.quicknav--end {
  padding-block: var(--s-3) var(--s-4);
  border-top: 1px solid var(--c-line);
  margin-top: var(--s-4);
}

/* --------------------------------------------------------------------------
   Sorozat-jegyzék: a római sorszám és a dokumentum-sor kap helyet
   -------------------------------------------------------------------------- */
.event-list--series {
  margin-top: var(--s-3);
}

.event-list--series li {
  grid-template-columns: 132px minmax(0, 1fr);
}

.ev__num {
  font-family: var(--f-mono);
  font-weight: 700;
  color: var(--c-secondary);
  margin-right: .35em;
}

/* A dokumentummal rendelkező tételt halvány sáv emeli ki */
.ev--doc {
  background: var(--c-bg-alt-2);
  box-shadow: inset 3px 0 0 var(--c-accent);
  padding-right: 12px;
}

/* --------------------------------------------------------------------------
   PDF-dokumentumok sor
   -------------------------------------------------------------------------- */
.ev__docs {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px;
  margin: 8px 0 0;
}

.ev__docs-label {
  font-family: var(--f-mono);
  font-size: var(--t-xxs);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-ink-faint);
  margin-right: 2px;
}

.doc {
  display: inline-block;
  padding: 4px 10px;
  border: 1px solid var(--c-line-strong);
  background: var(--c-bg);
  color: var(--c-primary);
  font-size: var(--t-xxs);
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: background-color .18s var(--ease), border-color .18s var(--ease),
              color .18s var(--ease);
}

.doc:hover,
.doc:focus-visible {
  background: var(--c-primary);
  border-color: var(--c-primary-dark);
  color: #fff;
  text-decoration: none;
}

.doc__fmt {
  font-family: var(--f-mono);
  font-size: .72em;
  letter-spacing: .06em;
  opacity: .7;
}

/* A kiemelt "legutóbbi rendezvény" blokkban a chipek sötét alapon */
.event-next .doc {
  border-color: rgba(255, 255, 255, .28);
  background: transparent;
  color: #fff;
}

.event-next .doc:hover,
.event-next .doc:focus-visible {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: var(--c-ink-strong);
}

.event-next .ev__docs-label { color: rgba(255, 255, 255, .55); }

/* --------------------------------------------------------------------------
   "Hogyan olvasd" nota
   -------------------------------------------------------------------------- */
.note-list {
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 72ch;
}

.note-list li {
  position: relative;
  padding: 0 0 0 22px;
  margin-bottom: var(--s-1);
  font-size: var(--t-body-xs);
  color: var(--c-ink);
  line-height: 1.55;
}

.note-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .58em;
  width: 8px;
  height: 8px;
  background: var(--c-accent);
}

/* --------------------------------------------------------------------------
   Reszponzív
   -------------------------------------------------------------------------- */
@media (max-width: 1023px) {
  .event-list--series li { grid-template-columns: 116px minmax(0, 1fr); }
}

@media (max-width: 639px) {
  .event-list--series li { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .ev--doc { padding-inline: 12px; box-shadow: inset 3px 0 0 var(--c-accent); }
  .quicknav a { font-size: var(--t-xxs); padding: 5px 11px; }
  /* S5: a kisebb link-padding miatt a sticky évtized-sáv 2px-rel alacsonyabb */
  :root { --decade-h: 52px; }
  /* S5: ebben a blokkban a .wrap paddingja 16px (style.css) */
  .quicknav--decade { margin-inline: -16px; padding-inline: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  .quicknav a,
  .doc { transition: none; }
}
