@import url("/assets/fonts/jura/stylesheet.css");
@import url("/assets/fonts/playfair/stylesheet.css");

/* Tokens */
:root{
  --font-ui: "Jura", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --font-text: "Playfair Display", Georgia, "Times New Roman", Times, serif;
}

/* Standard: alles (inkl. Überschriften) in Playfair */
html, body { font-family: var(--font-text); }
h1, h2, h3, h4, h5, h6, .article-text { font-family: var(--font-text); }

/* UI-Elemente in Jura */
button,
.btn,
.carousel-caption, .carousel-caption h1, .carousel-caption h2, .carousel-caption h3, .carousel-caption h4, .carousel-caption h5, .carousel-caption h6,
.hero-title-2,
.navbar, .nav, .nav *:not(svg):not(path),
.dropdown-menu, .dropdown-item,
.breadcrumb,
.pagination,
.badge,
.sgs-footer, .sgs-footer h1, .sgs-footer h2, .sgs-footer h3, .sgs-footer h4, .sgs-footer h5, .sgs-footer h6,
#sqlpage_footer,
.form-control, .form-select, label, input, select, textarea {
  font-family: var(--font-ui) !important;
}

/* (falls genutzt) FullCalendar */
.fc, .fc * , .fc .fc-toolbar, .fc .fc-button { font-family: var(--font-ui) !important; }

.btn { font-weight: 600; } /* etwas kräftiger */

.article-text {
  text-align: justify;         /* Blocksatz */
  text-justify: inter-word;    /* Zwischenräume gleichmäßig verteilen (wo unterstützt) */
  overflow-wrap: break-word;   /* lange Wörter umbrechen */
  word-wrap: break-word;       /* Fallback für ältere Browser */
  hyphens: auto;               /* automatische Silbentrennung (sofern Sprache gesetzt ist) */
  width: 80ch;
  padding: 0 1em 0 1em;
  font-size: 1.1em;
  font-weight: var(--tblr-font-weight-normal, 400);
}

/* Basis (hast du schon) */
.article-text p::first-letter {
  font-size: inherit;
  font-weight: inherit;
}

/* --- Content-Kasten für Hauptinhalt --- */

#sqlpage_main_wrapper.page-body {
  background: #ffffff;        /* Weißer Hintergrund */
  box-shadow: 0 4px 12px rgba(0,0,0,0.1); /* dezenter Schatten */
  max-width: 1200px;          /* Begrenzte Breite für bessere Lesbarkeit */
}

/* Navbar-Platzhalter zum Content  */
:root { --nav-h: 64px; }

/* Inhalt beginnt unter der Navbar */
body { padding-top: var(--nav-h); }

/* Anker-/Sprungziele korrekt unter Navbar einrasten (auch für smooth scroll) */
html {
  scroll-padding-top: var(--nav-h);
  /* Smooth scroll für Anker */
  scroll-behavior: smooth;
}

/* ===== Großes Footer-Panel (full-bleed) ===== */
.sgs-footer{
  width:100vw;
  margin-left:50%;
  transform:translateX(-50%);
  background:#0f172a;          /* dunkel */
  color:#e5e7eb;               /* hell */
}
.sgs-footer .inner{
  max-width:1140px;            /* ca. container-xl */
  margin:0 auto;
  padding:2rem 1rem;
}
.sgs-footer h3{ color:#e5e7eb; margin:0 0 .75rem 0; }
.sgs-footer a{ color:#93c5fd; text-decoration:none; }
.sgs-footer a:hover{ color:#bfdbfe; text-decoration:underline; }
.sgs-footer ul{ list-style:none; padding-left:0; margin:0; }
.sgs-footer .logo{ max-width:220px; height:auto; display:block; }

/* Abstand nach oben zum Seiteninhalt (feinjustieren bei Bedarf) */
.sgs-footer.mt-5{ margin-top:3rem; }

/* ===== Unterer Shell-Footer (SQLPage): rechtsbündig + schwarz ===== */
#sqlpage_footer {
  background: #000 !important;
  color: #cbd5e1 !important;
  text-align: right !important;
  margin: 0 !important;              /* überschreibt .my-2 von SQLPage */
  padding: .75rem 1rem;              /* eigener Innenabstand */
  border-top: 1px solid rgba(255,255,255,.08);
}

#sqlpage_footer p { margin: 0; }      /* kompakter */
#sqlpage_footer a {
  color: #93c5fd !important;
  text-decoration: none;
}
#sqlpage_footer a:hover {
  color: #bfdbfe !important;
  text-decoration: underline;
}
/* Weißlücke unter dem Main-Content schließen */
#sqlpage_main_wrapper.page-body {
  margin-bottom: 0 !important;  /* Tabler überschreiben */
}


/* ===== Back-to-top-Lasche im Footer ===== */
.sgs-footer { 
  position: relative;
  z-index: 2;
}

/* Lasche steht ganz oben im Footer und ist zentriert */
.sgs-footer .backtop-holder{
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 0;
}

/* Die Lasche selbst: rechteckig, unten abgerundet, etwas heller */
.sgs-footer .backtop{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .5rem .9rem;
  background: #162238;                   /* etwas heller als Footer #0f172a */
  color: #e5e7eb;
  border-radius: 0 0 12px 12px;          /* nur unten abgerundet */
  border: 1px solid rgba(255,255,255,.08);
  border-top: none;                      /* bündig zum Footer-Top */
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(0,0,0,.25);
}
.sgs-footer .backtop:hover { background:#1b2a41; color:#fff; }
.sgs-footer .backtop svg { display:block; }

/* Abstand von der Lasche zum restlichen Footer-Inhalt */
.sgs-footer .backtop-holder + .inner { padding-top: 0; }