* {
	box-sizing: border-box;
}

html {
	font-size: 14px;
}

.is-admin-page div.main-container,
.is-admin-page div.navbar-container {
	max-width: none !important;
}

div.navbar-container {
	padding: 0 3rem;
}

input.form-control {
	margin-bottom: 0.5rem;
}

.navbar .logo-container {
	align-items: center;
}

.navbar .logo-container .navbar-appname {
	margin-left: 15px;
}

.navbar .logo-text {
	font-size: 2.2em;
	font-weight: bold;
	margin-left: 0.5em;
}

.navbar .navbar-item img {
	max-height: 3em;
}

.main {
	padding: 2rem 3rem;
}

table.table .nowrap {
	white-space: nowrap;
}

table.table .stretch {
	width: 100%;
}

table.table th .sort-button i {
	margin-left: 0.5rem;
}

table.table tr.is-disabled {
	opacity: 0.5;
}

.footer {
	background-color: transparent;
}

.footer .content {
	opacity: 0.5;
}

ul li {
	list-style-type: disc;
}

ul.pagination-list li,
ul.menu-list li {
	list-style-type: none;
}

.readable-block {
	max-width: 740px;
}

a.heading-anchor {
	display: inline-block;
	opacity: 0;
	width: 1.3em;
	font-size: 0.7em;
	margin-left: 0.4em;
	line-height: 1em;
	text-decoration: none;
	transition: opacity 0.3s;
}
a.heading-anchor:hover,
h1:hover a.heading-anchor,
h2:hover a.heading-anchor,
h3:hover a.heading-anchor,
h4:hover a.heading-anchor,
h5:hover a.heading-anchor,
h6:hover a.heading-anchor {
	opacity: 1;
}

abbr[title] {
	text-underline-offset: 2px;
	text-decoration: underline dotted;
}

/* ==========================================================================
   JOPLIN SERVER FINAL (Perfect White Title + Minimal Gap)
   ========================================================================== */

/* 1. HEADER WEG */
.navbar, div.navbar-container { display: none !important; }
.main { padding-top: 0 !important; }

/* 2. BASIS-DESIGN (Dark Mode) */
html, body, .main, .readable-block {
    background-color: #191919 !important; 
    color: #dddddd !important;
    text-align: justify !important; 
}

/* 3. FETT & LINKS */
strong, b { color: #ffffff !important; font-weight: bold !important; }
a { color: #68b5f9 !important; text-decoration: none; }
a:hover { text-decoration: underline; }

/* 4. CODE & TABELLEN */
pre, code, blockquote {
    background-color: #2b2b2b !important;
    color: #ffffff !important;
    border-color: #444444 !important;
}
table th, table td { border-color: #555555 !important; color: #dddddd !important; }


/* ==========================================================================
   ÜBERSCHRIFTEN (Die Logik, die funktioniert!)
   ========================================================================== */

/* REGEL 1: GLOBALE H1 (Das trifft den NOTIZ-TITEL ganz oben) */
h1 {
    color: #ffffff !important;      /* Weiß */
    font-size: 2.1em !important;    /* Riesig */
    font-weight: 800 !important;
    border: none !important;        /* Kein Strich */
    border-bottom: none !important; 
    
    /* ABSTÄNDE TITEL */
    margin-top: 0.5em !important;
    margin-bottom: 0.5em !important; /* Fast kein Abstand nach unten! */
    padding-bottom: 0 !important;
    line-height: 1.1 !important;
}

/* REGEL 2: ÜBERSCHRIFTEN IM TEXT (Das schützt den Inhalt) */
#rendered-md h1 {
    font-size: 1.6em !important;    /* Kleiner */
    border-bottom: 1px solid #444444 !important; /* Mit Strich */
    padding-bottom: 0.3em !important;
    
    /* Standard-Abstand im Text */
    margin-top: 1.3em !important;   
    margin-bottom: 0.3em !important;
    line-height: 1.3 !important;
    font-weight: bold !important;
}

/* REGEL 3: Der Rest der Überschriften (H2-H6) */
h2, h3, h4, h5, h6 {
    color: #ffffff !important;
    font-weight: bold !important;
}

#rendered-md h2 {
    font-size: 1.4em !important;
    border: none !important;
    margin-top: 1.0em !important;
    margin-bottom: 0.3em !important;
}
#rendered-md h3 {
    font-size: 1.25em !important;
    border: none !important;
    margin-top: 1.0em !important;
    margin-bottom: 0.5em !important;
}
#rendered-md h4 {
    font-size: 1.1em !important;
    margin-top: 1.0em !important;
    margin-bottom: 0.3em !important;
}
#rendered-md h5, #rendered-md h6 {
    font-size: 1em !important;
    text-transform: uppercase;
}


/* ==========================================================================
   GAP FIX: ABSTAND ZWISCHEN TITEL UND ERSTEM INHALT
   ========================================================================== */

/* Wir greifen das allererste Element im Text (egal ob h1, h2, p oder bild) */
#rendered-md > *:first-child {
    margin-top: 0.2em !important; /* Nur winziger Abstand zum Titel darüber */
    padding-top: 0 !important;
}


/* ==========================================================================
   TEXTFLUSS
   ========================================================================== */
p, ul, ol, dl, blockquote, pre {
    margin-bottom: 0.3em !important;
}
li {
    margin-bottom: 0.1em !important;
}

/* Container Reset */
#rendered-md {
    margin-top: 0 !important;
    padding-top: 0 !important;
}


/* ==========================================================================
   FOOTER
   ========================================================================== */
.footer .content {
    font-size: 0 !important;
    color: transparent !important;
}
.footer .content::after {
    content: "Joplin Server • Powered by Zeitfresser";
    font-size: 14px !important;
    color: #888888 !important; 
    display: block !important;
    visibility: visible !important;
    margin-top: 20px !important;
}

/* ==========================================================================
   FLOATING TOC - FINAL ROBUST VERSION (V3.1)
   1 Sprung | Dynamische Zentrierung | Keine Punkte
   ========================================================================== */

:root {
    --text-width: 740px;
    --toc-width: 330px; /* 280 Default */
    --toc-gap: 100px; /* Start-Abstand */
}

/* Haupttext */
.readable-block {
    max-width: var(--text-width) !important; 
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

/* TOC Container */
#floating-toc {
    position: fixed;
    top: 100px;
    /* Berechnung für die dynamische Positionierung links vom Text */
    left: calc(50vw - (var(--text-width) / 2) - var(--toc-width) - var(--toc-gap));
    width: var(--toc-width);
    max-height: 80vh;
    overflow-y: auto;
    background: transparent;
    z-index: 1000;
}

/* --- LISTEN-STYLING (DOT-KILLER & ABSTÄNDE) --- */
#floating-toc ul, 
#floating-toc li {
    list-style: none !important;
    list-style-type: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Vertikaler Abstand zwischen den einzelnen Links */
#floating-toc li {
    margin-bottom: 12px !important; 
}

#floating-toc li::before {
    content: none !important;
    display: none !important;
}

/* --- DYNAMIK (DIE SPRÜNGE) --- */

/* Der eine Sprung Richtung Body bei kleineren Monitoren */
@media (max-width: 1850px) {
    :root { --toc-gap: 60px; }
}

/* Konsequentes Ausblenden bei Platzmangel (Sicherheitszone) */
@media (max-width: 1650px) {
    #floating-toc {
        display: none !important;
    }
}

/* --- OPTIK & INTERAKTION (Finales Feintuning) --- */

#floating-toc .toc-title {
    font-weight: 800;
    color: #555;
    font-size: 1.1rem;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 25px;
}

#floating-toc a {
    color: #999 !important; /* Dunkles Weiß */
    font-size: 1.05rem !important; /* EINHEITLICHE GRÖSSE FÜR ALLE */
    text-decoration: none !important;
    display: block;
    line-height: 1.3;
    border-left: 3px solid transparent; 
    padding-left: 15px !important;
    transition: all 0.2s ease-in-out;
    font-weight: normal; /* Standard ist nicht fett */
}

#floating-toc a.active,
#floating-toc a:hover {
    color: #ffffff !important;
    border-left: 3px solid #68b5f9;
}

/* H1 IM TOC: Wieder fett markiert */
#floating-toc .toc-level-h1 a {
    font-weight: bold !important;
    color: #bbb !important; /* Ein Hauch heller für die Hauptkapitel */
}

/* EINRÜCKUNGEN (Trotz gleicher Größe für die Struktur wichtig) */
#floating-toc .toc-level-h2 a {
    padding-left: 20px !important; 
}

#floating-toc .toc-level-h3 a {
    padding-left: 35px !important;
}
