/* ==================================================================
   TYPORAMA — Corporate Identity
   Angehängt am 06.08.2026. Eigenes Theme (Klon von «lightweight»),
   damit ein SLiMS-Update diese Anpassungen nicht überschreibt.

   Grundlage: Skill typorama-ci
     Gelb #ffcc00 · Schwarz #000 · EB Garamond (Text) · Nunito Sans (Labels)
     ⚑ «Logo nicht auf unruhigem Hintergrund» → der Kopf ist eine ruhige
       weisse Fläche, die Papierstruktur beginnt darunter.
     ⚑ «Weiss auf Gelb ist nicht barrierefrei» → auf Gelb nur Schwarz.
   ================================================================== */

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,600;1,400&family=Nunito+Sans:wght@400;700&display=swap');

:root {
  --tp-gelb:    #ffcc00;
  --tp-schwarz: #000000;
  --tp-weiss:   #ffffff;
  --tp-text:    #2a2a2a;
  --tp-linie:   #d8d6ce;
  --tp-papier:  #f2f2ef;
  --tp-grau-hell: #f4f4f2;   /* CI, Abschnitt 03 */
}

/* ---------- Typorama-Grund ----------
   Die Papiertextur liegt als Datei im Theme: img/papier.jpg
   600×600, nahtlos kachelbar. Zum Austauschen genügt es, die Datei
   unter gleichem Namen zu ersetzen — am CSS ändert sich nichts. */
body {
  /* Percy, 06.08.: einfarbig statt Papier — die Struktur war zu unruhig.
     Ton: --tp-grau-hell aus dem CI (#f4f4f2), ruhig und warm genug,
     dass die weissen Flächen sich noch abheben. */
  background-color: var(--tp-grau-hell) !important;
  background-image: none !important;
}

/* Der Farbverlauf des Ursprungsthemes ist in partials/bg.php entfernt.
   Diese Regel fängt Reste ab, falls ein Update das Markup zurückbringt. */
.s-background .gradients, .s-background .gradients div, .bg-image {
  display: none !important;
}
.s-background { background: none !important; animation: none !important; }

/* ---------- Schrift ---------- */
body, .s-main, .s-feature-content, .s-footer {
  font-family: 'EB Garamond', Georgia, serif !important;
  color: var(--tp-text) !important;
}
h1, h2, h3, .s-feature-title, .s-main-title {
  font-family: 'EB Garamond', Georgia, serif !important;
  font-weight: 600 !important;
}
.s-menu-content a, .s-footer-menu a, .s-btn, button, input[type=submit],
.s-search-advances, .s-brand-tagline, .s-footer-tagline {
  font-family: 'Nunito Sans', Arial, sans-serif !important;
}

/* ---------- Kopf und Logo ---------- */
.s-header {
  background: var(--tp-weiss) !important;
  border-top: 5px solid var(--tp-gelb) !important;
  box-shadow: 0 1px 0 var(--tp-linie) !important;
  padding-top: 1.6rem !important;
  padding-bottom: 1.2rem !important;
}
.s-brand .s-logo {
  content: url("../img/typorama-logo.svg") !important;
  width: 227px !important; max-width: 62vw !important; height: auto !important;
}
.s-brand h1 {
  font-size: 1.05rem !important; font-weight: 400 !important;
  letter-spacing: .02em !important; color: var(--tp-text) !important; margin-top: .35rem !important;
}
.s-brand h1::after {
  content: ' · Museum für Satz und Druck' !important;
  font-family: 'Nunito Sans', Arial, sans-serif !important;
  font-size: .62rem !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: .15em !important;
  color: #6b6a63 !important; white-space: nowrap !important;
}

/* ---------- Suche ---------- */
.s-main-search input:not([type=submit]) {
  border: 1px solid var(--tp-linie) !important; border-radius: 0 !important;
  background: var(--tp-weiss) !important;
  font-family: 'EB Garamond', Georgia, serif !important; font-size: 1.05rem !important;
}
.s-main-search input[type=submit], .s-btn, button[type=submit] {
  background: var(--tp-gelb) !important; color: var(--tp-schwarz) !important;
  border: none !important; border-radius: 0 !important;
  font-family: 'Nunito Sans', Arial, sans-serif !important;
  font-weight: 700 !important; text-transform: uppercase !important;
  letter-spacing: .12em !important; font-size: .75rem !important;
}

/* ---------- Lesbarkeit ----------
   ⚑ Das Ursprungstheme setzt viele Texte auf WEISS, weil sie auf dem
     Farbverlauf standen. Ohne diesen Block wären auf hellem Grund unter
     anderem die Buchtitel unsichtbar. Das war beim Umbau der grössere
     Teil der Arbeit — nicht der Hintergrund. */
.s-main, .s-main h1, .s-main h2, .s-main p,
.s-main-title, .s-feature, .s-feature-title, .s-feature-content {
  color: var(--tp-text) !important;
}
.s-main-title { color: var(--tp-schwarz) !important; }
.s-main a, .s-feature, .s-feature-title, .s-feature-title a {
  color: var(--tp-schwarz) !important;
  text-decoration: none !important;
}
.s-feature-title a, .s-main a:not(.s-btn):not(.s-search-advances) {
  box-shadow: inset 0 -2px 0 var(--tp-gelb) !important;
}
.s-feature-title a:hover, .s-main a:not(.s-btn):hover {
  box-shadow: inset 0 -.8em 0 var(--tp-gelb) !important;
}
.s-search-advances {
  color: var(--tp-text) !important; font-size: .72rem !important; font-weight: 700 !important;
  text-transform: uppercase !important; letter-spacing: .12em !important;
}
.s-search-advances:hover { box-shadow: inset 0 -2px 0 var(--tp-gelb) !important; }

/* ---------- Trefferliste und Fuss ---------- */
.s-feature-list, .s-main { background: transparent !important; }
.s-feature-content { border-bottom: 1px solid var(--tp-linie) !important; padding-bottom: 1rem !important; }
.s-footer { border-top: 3px solid var(--tp-gelb) !important; }

/* ---------- Trefferliste (Detailansicht) ----------
   ⚑ Die Trefferliste benutzt andere Klassen als die Startseite:
     .biblioResult › .item › .detail-list › h4 › a.titleField
     Das ist im Browser abgelesen, nicht geraten — die Titel standen
     sonst im Bootstrap-Blau (#337ab7). */
.biblioResult .titleField, a.titleField {
  color: var(--tp-schwarz) !important;
  text-decoration: none !important;
  box-shadow: inset 0 -2px 0 var(--tp-gelb);
}
.biblioResult .titleField:hover, a.titleField:hover {
  box-shadow: inset 0 -.8em 0 var(--tp-gelb);
}
.biblioResult .authorField, .biblioResult .isbnField, .biblioResult .publishField {
  color: var(--tp-text) !important;
}

/* Papiergrund durchscheinen lassen. ⚑ Bewusst NICHT .container —
   den benutzt auch der Kopfbereich, der weiss bleiben soll. */
#content, .s-main-page {
  background-color: transparent !important;
}
/* Die einzelnen Treffer bekommen eine ruhige Fläche zum Lesen */
.biblioResult .item {
  background: rgba(255,255,255,.75);
  padding: 1rem !important;
}

/* ==================================================================
   Nachtrag 06.08.2026 — nach dem ersten Livegang (Percy)
   ================================================================== */

/* ---------- Kopfzeile bis an den Rand ----------
   Das Theme setzt .s-header als Bootstrap-.container mit fester Breite. */
.s-header.container, .s-header {
  width: 100% !important;
  max-width: none !important;
  padding-left: 2.5vw !important;
  padding-right: 2.5vw !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* ---------- Fusszeile ganz ausblenden ----------
   Das Markup ist in partials/footer.php bereits entfernt; diese Regel
   fängt Reste ab, falls ein Update es zurückbringt. */
.s-footer, #topbook, .jcarousel-skin-tango,
.jcarousel-container, .jcarousel-clip { display: none !important; }

/* ---------- Feine weisse Linien in Schwarz (Percy) ----------
   Das Ursprungstheme zeichnet Rahmen in Weiss, weil sie auf dem
   Farbverlauf sassen. Auf Papier waren sie unsichtbar. */
.s-detail .cover, .biblioRecord .cover-list, .customField,
.s-feature-list img, .s-detail table, .s-detail td, .s-detail th {
  border-color: var(--tp-schwarz) !important;
}
.s-detail hr, .s-main hr, .detail-list hr {
  border: 0 !important;
  border-top: 1px solid var(--tp-schwarz) !important;
}
/* Trennlinien unter den Abschnittstiteln der Detailansicht */
.s-detail h2, .s-detail h3, .s-main-title,
.s-detail .detail-title, .biblioRecord h2 {
  border-bottom-color: var(--tp-schwarz) !important;
}

/* ---------- Kopfzeile bündig nach oben (Percy, 06.08.) ----------
   ⚑ Das Theme setzt `.s-header { position: absolute; top: 25px }` — daher
     stand über dem weissen Balken ein Streifen Papier. */
.s-header { top: 0 !important; }

/* ---------- Beschriftung neben dem Logo: nur «Bibliothek» ----------
   Der h1 trägt den Bibliotheksnamen aus der SLiMS-Konfiguration
   («Typorama Bibliothek»). Er wird hier nur in der Anzeige ersetzt —
   in Seitentiteln, OAI und Backend bleibt der volle Name stehen. */
.s-brand h1 { font-size: 0 !important; letter-spacing: 0 !important; }
.s-brand h1::before {
  content: 'Bibliothek';
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 1.05rem; font-weight: 400; letter-spacing: .02em;
  color: var(--tp-text);
}
.s-brand h1::after { content: none !important; }