/* ===========================================================================
   08 — POZOSTAŁA POWIERZCHNIA RDZENIA

   Klasy emitowane przez szablony OJS/PKP, których nie nadpisujemy i którym
   rdzeń nie nadaje żadnych stylów. Bez tej warstwy strony poza makietą
   (wyniki wyszukiwania, powiadomienia, stronicowanie, „O czasopiśmie")
   wyglądają jak surowy HTML.
   =========================================================================== */

/* --- tytuły stron --------------------------------------------------------- */

/* Wspólny wygląd nagłówka na każdej stronie, której makieta nie opisuje.

   ⚠ SELEKTOR CELOWO NIE JEST DZIECKIEM BEZPOŚREDNIM. Treść stron redakcyjnych
     (wtyczka Static Pages, „O czasopiśmie") to HTML pisany przez redakcję —
     nagłówki siedzą w niej dowolnie głęboko i BEZ KLAS. Ograniczenie do
     `.page > h2` zostawiało je w domyślnym Times/bold przeglądarki.
     `:not([class])` pilnuje, żeby nie ruszyć nagłówków, którym nasze
     szablony nadały już własną klasę. */
.page > h1,
.page_title:not(.eos_artykul_tytul) {
  font-family: var(--eos-szeryf);
  font-style: italic;
  font-weight: var(--eos-waga-srednia);
  font-size: var(--eos-pismo-44);
  line-height: var(--eos-interlinia-tytul);
  letter-spacing: var(--eos-swiatlo-ciasne);
  margin: 0 0 var(--eos-odstep-24);
}
.page h2:not([class]) {
  font-family: var(--eos-szeryf);
  font-style: italic;
  font-weight: var(--eos-waga-srednia);
  font-size: 30px;
  margin: var(--eos-odstep-40) 0 var(--eos-odstep-16);
}
.page h3:not([class]),
.page h4:not([class]) {
  font-family: var(--eos-szeryf);
  font-style: italic;
  font-weight: var(--eos-waga-srednia);
  /* ⚠ 21 px, NIE 24. Projekt ma zamkniętą skalę stopni pisma (…18 · 19 · 20 ·
     21 · 25 · 26 · 30…) i 24 px do niej nie należy — wprowadzenie stopnia spoza
     skali widać dopiero wtedy, gdy dwa nagłówki stoją obok siebie. */
  font-size: var(--eos-pismo-21);
  margin: var(--eos-odstep-32) 0 var(--eos-odstep-12);
}

/* Odstęp od nagłówka strony i przed stopką — wspólny dla wszystkich stron. */
.page { padding-bottom: var(--eos-odstep-88); }
.page p { margin: 0 0 var(--eos-odstep-18); max-width: var(--eos-miara-akapit); }
.page ul, .page ol { margin: 0 0 var(--eos-odstep-18) var(--eos-odstep-20); }
.page li { margin-bottom: var(--eos-odstep-8); }

/* --- okruszki ------------------------------------------------------------- */

.cmp_breadcrumbs {
  padding: var(--eos-odstep-28) 0 0;
  margin-bottom: var(--eos-odstep-32);
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-16);
  text-transform: uppercase;
  color: var(--eos-atrament-60);
}
.cmp_breadcrumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: var(--eos-odstep-12); margin: 0; padding: 0; }
.cmp_breadcrumbs li { display: flex; align-items: center; gap: var(--eos-odstep-12); margin: 0; }
.cmp_breadcrumbs a { color: var(--eos-atrament-60); }
.cmp_breadcrumbs a:hover { color: var(--eos-atrament); text-decoration: none; }
.cmp_breadcrumbs .separator { color: var(--eos-atrament-60); }
/* Bieżąca strona w okruszkach jest w makiecie pełnym atramentem — to jedyne
   odróżnienie „gdzie jestem" od „dokąd mogę wrócić". Rdzeń emituje
   `<li class="current" aria-current="page">`. */
.cmp_breadcrumbs .current { color: var(--eos-atrament); }
/* R30: sekcja tytułowa strony ma własny odstęp górny; margines okruszków
   dokładał się do niego i dawał 64 px zamiast 32 px z makiety. */
.pkp_page_article .cmp_breadcrumbs { margin-bottom: 0; }

/* --- powiadomienia -------------------------------------------------------- */

/* Odróżnialne bez samego koloru: akcent na lewej krawędzi plus tło. */
.cmp_notification,
.pkp_notification {
  border-left: var(--eos-linia-akcent) solid var(--eos-blekit);
  background: var(--eos-wyroznienie);
  padding: var(--eos-odstep-16) var(--eos-odstep-20);
  margin-bottom: var(--eos-odstep-24);
  font-size: var(--eos-pismo-15);
  line-height: 1.55;
}
.cmp_notification.warning { border-left-color: #b26a00; background: rgba(178, 106, 0, .08); }
.cmp_notification.error { border-left-color: #a3121a; background: rgba(163, 18, 26, .06); }
.cmp_notification.success { border-left-color: #1c6b3c; background: rgba(28, 107, 60, .08); }

/* --- stronicowanie -------------------------------------------------------- */

.cmp_pagination {
  display: flex;
  align-items: center;
  gap: var(--eos-odstep-16);
  flex-wrap: wrap;
  margin-top: var(--eos-odstep-44);
  padding-top: var(--eos-odstep-24);
  border-top: var(--eos-linia) solid var(--eos-atrament-12);
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-16);
  text-transform: uppercase;
}
.cmp_pagination .prev,
.cmp_pagination .next {
  border: var(--eos-linia) solid var(--eos-atrament-50);
  padding: var(--eos-odstep-10) var(--eos-odstep-18);
  color: var(--eos-atrament);
}
.cmp_pagination .prev:hover,
.cmp_pagination .next:hover { background: var(--eos-atrament); color: var(--eos-tlo); text-decoration: none; }
.cmp_pagination .current { color: var(--eos-atrament-60); }

/* --- listy artykułów poza spisem treści (wyszukiwarka, „w tym numerze") --- */

.cmp_article_list { list-style: none; margin: 0; padding: 0; }
.cmp_article_list > li { margin: 0; }

/* --- wyniki wyszukiwania -------------------------------------------------- */

.pkp_page_search .search_results { margin-top: var(--eos-odstep-32); }
.pkp_page_search .search_results_count {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-16);
  text-transform: uppercase;
  color: var(--eos-atrament-55);
  margin-bottom: var(--eos-odstep-24);
}

/* --- „O czasopiśmie" i strony redakcyjne ---------------------------------- */

.pkp_page_about .page,
.pkp_page_pages .page { max-width: var(--eos-miara-akapit); }
.pkp_page_about .page table,
.pkp_page_pages .page table { max-width: 100%; }

/* --- ogłoszenia (lista i pojedyncze) -------------------------------------- */

.obj_announcement_summary {
  padding: var(--eos-odstep-28) 0;
  border-bottom: var(--eos-linia) solid var(--eos-atrament-14);
}
.obj_announcement_summary h2,
.obj_announcement_summary h3 {
  font-family: var(--eos-szeryf);
  font-style: italic;
  font-weight: var(--eos-waga-polgruba);
  font-size: var(--eos-pismo-25);
  line-height: 1.3;
  margin: 0 0 var(--eos-odstep-10);
}
.obj_announcement_summary .date {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-16);
  text-transform: uppercase;
  color: var(--eos-atrament-55);
  margin-bottom: var(--eos-odstep-8);
}

/* --- listy zeszytów w archiwum (gdy nie użyto kafli) ---------------------- */

.issues_archive { list-style: none; margin: 0; padding: 0; }
.obj_issue_summary { padding: var(--eos-odstep-20) 0; border-bottom: var(--eos-linia) solid var(--eos-atrament-12); }
.obj_issue_summary .title {
  font-family: var(--eos-szeryf);
  font-style: italic;
  font-weight: var(--eos-waga-polgruba);
  font-size: var(--eos-pismo-21);
}

/* --- bloki wtyczek w pasku bocznym ---------------------------------------- */

/* Projekt paska nie przewiduje, ale gdy redakcja go włączy, bloki mają
   wyglądać jak nasze karty, a nie jak surowe listy. */
.pkp_block {
  background: var(--eos-biel);
  border: var(--eos-linia) solid var(--eos-atrament-12);
  padding: var(--eos-odstep-24);
  margin-bottom: var(--eos-odstep-2);
}
.pkp_block .title {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-18);
  text-transform: uppercase;
  margin: 0 0 var(--eos-odstep-14);
}
.pkp_block ul { list-style: none; display: flex; flex-direction: column; gap: var(--eos-odstep-8); }

/* --- podgląd pliku (pdfJsViewer, htmlArticleGalley) ----------------------- */

/* ⚠ TO OSOBNY, PEŁNY DOKUMENT HTML. Szablon `pdfJsViewer/templates/display.tpl`
   nie przechodzi przez nasz `header.tpl`/`footer.tpl` — buduje własną stronę.
   Na szczęście woła `{load_stylesheet context="frontend"}`, więc NASZE arkusze
   są tam wczytane i wystarczy ostylować jego klasy. Bez tego pasek nad
   podglądem wygląda jak surowy HTML w środku spójnego serwisu.

   ⚠ I RZECZ WAŻNIEJSZA OD WYGLĄDU: ten szablon ustawia `src` ramki z plikiem
     inline'owym `$(document).ready(...)`. Wymaga jQuery, którą na froncie
     dostarcza WYŁĄCZNIE motyw. Dlatego jej nie odcięliśmy — patrz komentarz
     w EosnovaPlugin::init(). */

.header_view {
  display: flex;
  align-items: center;
  gap: var(--eos-odstep-20);
  padding: var(--eos-odstep-14) var(--eos-margines);
  background: var(--eos-atrament);
  color: var(--eos-tlo);
}
.header_view .title {
  font-family: var(--eos-szeryf);
  font-style: italic;
  font-size: var(--eos-pismo-18);
  line-height: 1.3;
  flex: 1 1 auto;
  min-width: 0;
}
.header_view a { color: var(--eos-tlo); }
.header_view .return {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-16);
  text-transform: uppercase;
  flex: 0 0 auto;
}
.header_view .return::before { content: "\2190\00a0"; }
.header_view .download {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-16);
  text-transform: uppercase;
  border: var(--eos-linia) solid var(--eos-tlo-45);
  padding: var(--eos-odstep-10) var(--eos-odstep-18);
  flex: 0 0 auto;
  white-space: nowrap;
}
.header_view .download:hover { background: var(--eos-tlo); color: var(--eos-atrament); text-decoration: none; }

/* Ramka z plikiem wypełnia resztę okna. */
.galley_view { width: 100%; height: calc(100vh - 62px); border: 0; display: block; }
.galley_view_with_notice { height: calc(100vh - 120px); }

.galley_view_notice {
  background: var(--eos-wyroznienie);
  border-left: var(--eos-linia-akcent) solid var(--eos-blekit);
  padding: var(--eos-odstep-12) var(--eos-margines);
  font-size: var(--eos-pismo-14);
}

/* --- wyróżnienia w treści pisanej przez redakcję -------------------------- */

/* Redakcja wstawia `<strong>`/`<b>` w treści stron. Domyślne 700 wypada poza
   system (400/500/600) i w kroju zmiennym Karla wygląda na cięższe niż cokolwiek
   innego na stronie. Sprowadzamy do najwyższej wagi, jakiej projekt używa. */
strong, b { font-weight: var(--eos-waga-polgruba); }

/* --- blok „How to Cite" (wtyczka Citation Style Language) ----------------- */

/* ⚠ TEN BLOK NALEŻY DO WTYCZKI, NIE DO NAS. Wstrzykuje go hak
   `Templates::Article::Details` (patrz CitationStyleLanguagePlugin.php:101).
   Wcześniej rysowaliśmy własny, identyczny w treści — na stronie artykułu
   „How to Cite" pojawiało się DWA RAZY. Zostawiamy wersję wtyczki, bo to ona
   ma podpiętą obsługę przełączania stylu cytowania i obszar `aria-live`;
   my dajemy jej tylko wygląd z makiety. */
.item.citation { margin-top: var(--eos-odstep-40); }
.citation_display {
  background: var(--eos-biel);
  border: var(--eos-linia) solid var(--eos-atrament-12);
  padding: var(--eos-odstep-26);
}
.citation_display > .label {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-12);
  font-weight: var(--eos-waga-zwykla);
  letter-spacing: var(--eos-swiatlo-24);
  text-transform: uppercase;
  color: var(--eos-atrament);
  padding-bottom: var(--eos-odstep-12);
  border-bottom: var(--eos-linia) solid var(--eos-atrament);
  margin: 0 0 var(--eos-odstep-18);
}
#citationOutput {
  font-size: var(--eos-pismo-16);
  line-height: var(--eos-interlinia-tekst);
  /* ⚠ TO NIE JEST KOSMETYKA. Wpis bibliograficzny kończy się pełnym adresem
     artykułu — jednym ciągiem bez spacji. Bez łamania w dowolnym miejscu ten
     adres rozpycha stronę: zmierzone 125 px przewijania w poziomie przy
     szerokości 360 px i 107 px przy 1280 px. */
  overflow-wrap: anywhere;
}
.csl-entry { overflow-wrap: anywhere; }
.citation_formats {
  margin-top: var(--eos-odstep-18);
  padding-top: var(--eos-odstep-18);
  border-top: var(--eos-linia) solid rgba(0, 0, 28, .1);
}
.citation_formats_button {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-14);
  text-transform: uppercase;
  background: transparent;
  border: var(--eos-linia) solid var(--eos-atrament-50);
  color: var(--eos-atrament);
  padding: var(--eos-odstep-10) var(--eos-odstep-18);
  cursor: pointer;
}
.citation_formats_button:hover { background: var(--eos-atrament); color: var(--eos-tlo); }
.citation_formats_button::after { content: "\00a0\25be"; }
.citation_formats_button[aria-expanded="true"]::after { content: "\00a0\25b4"; }

/* Lista rozwija się dopiero po kliknięciu — steruje nią skrypt wtyczki
   przez `aria-hidden`. Wiążemy widoczność z tym samym atrybutem, żeby stan
   wizualny i stan dla czytnika ekranu nie mogły się rozjechać. */
.citation_formats_list[aria-hidden="true"] { display: none; }
.citation_formats_list { margin-top: var(--eos-odstep-16); }
.citation_formats_list .label {
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-18);
  text-transform: uppercase;
  color: var(--eos-atrament-55);
  margin: var(--eos-odstep-16) 0 var(--eos-odstep-8);
}
.citation_formats_styles { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--eos-odstep-8); }
.citation_formats_styles li { margin: 0; }
.citation_formats_styles a {
  display: inline-block;
  font-family: var(--eos-etykieta);
  font-size: var(--eos-pismo-11);
  letter-spacing: var(--eos-swiatlo-14);
  text-transform: uppercase;
  border: var(--eos-linia) solid var(--eos-atrament-50);
  color: var(--eos-atrament);
  padding: var(--eos-odstep-8) 15px;
}
.citation_formats_styles a:hover { background: var(--eos-atrament); color: var(--eos-tlo); text-decoration: none; }

/* Ikona FontAwesome — motyw jej nie ładuje, więc pusty span tylko robiłby
   dziurę w odstępie. */
.citation_formats_styles .fa { display: none; }
