/* ===================================================================
   True Legends — Vorlagen
   ===================================================================
   Eine Datei fuer alle Beitragsvorlagen. Liegt auf dem Server und
   wird von den Beitraegen per <link> geholt:

     <link rel="stylesheet" href="https://true-legends.net/cache/themes/theme16/tl-vorlagen.css">

   Weil die Adresse vollstaendig ausgeschrieben ist, funktioniert das
   auch in fremden Foren — Storming Gates, Epic und so weiter holen
   die Datei dann ebenfalls von hier.

   Aendert sich hier eine Farbe, aendern sich ALLE Beitraege, die
   diese Datei einbinden — in jedem Forum, ohne einen davon zu
   oeffnen.

   FARBEN: Alles zieht aus --v-Variablen mit eingebautem Rueckfall auf
   die Golden-Hour-Toene. Wo diese Variablen nicht gesetzt sind (im
   Storming Gates zum Beispiel), sind die Vorlagen also golden. Setzt
   ein Theme sie, folgen die Vorlagen dem Theme. Beides ohne Aenderung
   an dieser Datei.
   =================================================================== */

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


/* ===================================================================
   1. Grundkasten — gemeinsam fuer Regeln, Text und News
   =================================================================== */
.tlv-box.tlv-box.tlv-box{
  max-width:720px;
  margin:24px auto;
  background:var(--v-flaeche,#161b29);
  border:1px solid var(--v-linie,#2a3149);
  border-radius:10px;
  overflow:hidden;
  color:var(--v-text,#e8e4d8);
  font-family:var(--v-schrift-lauf,'EB Garamond',Georgia,serif);
  font-size:15px;
  line-height:1.75;
  box-shadow:0 10px 30px rgba(8,10,16,.45);
}
.tlv-box.tlv-box.tlv-box.schmal{ max-width:560px; }

/* Goldener Kopfbalken */
.tlv-kopf.tlv-kopf.tlv-kopf{
  background:linear-gradient(180deg,
    var(--v-akzent-hell,#d1a758) 0%,
    var(--v-akzent,#ad7e35) 48%,
    var(--v-akzent-tief,#6b4f1f) 100%);
  padding:20px 24px 16px;
  text-align:center;
}
.tlv-kopf.tlv-kopf.tlv-kopf .tlv-titel.tlv-titel.tlv-titel{
  font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif);
  font-size:30px; line-height:1.1; letter-spacing:3px;
  text-transform:lowercase;
  color:var(--v-grund,#10141f);
}
.tlv-kopf.tlv-kopf.tlv-kopf .tlv-unterzeile.tlv-unterzeile.tlv-unterzeile{
  font-family:var(--v-schrift-versal,'Alegreya SC',Georgia,serif);
  font-size:11px; letter-spacing:4px; text-transform:uppercase;
  color:var(--v-grund,#10141f); opacity:.75; margin-top:5px;
}

/* Fliesstext */
.tlv-text.tlv-text.tlv-text{ padding:22px 28px 26px; }
.tlv-text.tlv-text.tlv-text p{ margin:0 0 16px; text-align:justify; }
.tlv-text.tlv-text.tlv-text p:last-child{ margin-bottom:0; }
.tlv-vorwort.tlv-vorwort.tlv-vorwort{ color:var(--v-text-leise,#a9a6b8); }

/* Hervorgehobener Hinweis */
.tlv-wichtig.tlv-wichtig.tlv-wichtig{
  margin:6px 26px 22px;
  padding:14px 18px;
  background:var(--v-grund,#10141f);
  border-left:3px solid var(--v-akzent,#ad7e35);
  border-radius:0 6px 6px 0;
}
.tlv-wichtig.tlv-wichtig.tlv-wichtig .tlv-marke.tlv-marke.tlv-marke{
  font-family:var(--v-schrift-versal,'Alegreya SC',Georgia,serif);
  font-size:11px; letter-spacing:3px; text-transform:uppercase;
  color:var(--v-akzent,#ad7e35); margin-bottom:6px;
}
.tlv-wichtig.tlv-wichtig.tlv-wichtig p{ margin:0; font-size:14px; line-height:1.7; text-align:justify; }

/* Fusszeile */
.tlv-fuss.tlv-fuss.tlv-fuss{
  background:var(--v-grund,#10141f);
  border-top:1px solid var(--v-linie,#2a3149);
  padding:12px 26px; text-align:center;
  font-family:var(--v-schrift-versal,'Alegreya SC',Georgia,serif);
  font-size:11px; letter-spacing:3px; text-transform:uppercase;
  color:var(--v-text-still,#6f7086);
}


/* ===================================================================
   2. Regeln — nummerierte Abschnitte
   =================================================================== */
.tlv-regel.tlv-regel.tlv-regel{ padding:0 26px 18px; }
.tlv-regel.tlv-regel.tlv-regel:first-of-type{ padding-top:4px; }
.tlv-regel-kopf.tlv-regel-kopf.tlv-regel-kopf{
  display:flex; align-items:baseline; gap:12px;
  border-bottom:1px solid var(--v-linie,#2a3149);
  padding-bottom:8px; margin-bottom:12px;
}
.tlv-nr.tlv-nr.tlv-nr{
  font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif);
  font-size:26px; line-height:1; color:var(--v-akzent,#ad7e35); flex-shrink:0;
}
.tlv-regel-titel.tlv-regel-titel.tlv-regel-titel{
  font-family:var(--v-schrift-versal,'Alegreya SC',Georgia,serif);
  font-size:15px; letter-spacing:2px; text-transform:uppercase;
  color:var(--v-akzent-hell,#d1a758);
}
.tlv-regel.tlv-regel.tlv-regel p{ margin:0 0 12px; text-align:justify; }
.tlv-regel.tlv-regel.tlv-regel p:last-child{ margin-bottom:0; }


/* ===================================================================
   3. News
   =================================================================== */
.tlv-news-meta.tlv-news-meta.tlv-news-meta{
  display:flex; align-items:center; justify-content:center; gap:14px;
  padding:14px 22px 12px;
  border-bottom:1px solid var(--v-linie,#2a3149);
}
.tlv-datum.tlv-datum.tlv-datum{
  font-family:var(--v-schrift-versal,'Alegreya SC',Georgia,serif);
  font-size:11px; letter-spacing:3px; text-transform:uppercase;
  color:var(--v-text-still,#6f7086);
}
.tlv-news-meta.tlv-news-meta.tlv-news-meta .tlv-strich.tlv-strich.tlv-strich{ width:1px; height:22px; background:var(--v-linie,#2a3149); }
.tlv-nummer.tlv-nummer.tlv-nummer{
  font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif);
  font-size:26px; line-height:1; color:var(--v-akzent,#ad7e35);
}
/* Rollt, sobald der Text laenger wird — der Beitrag bleibt gleich hoch */
.tlv-rolltext.tlv-rolltext.tlv-rolltext{
  max-height:260px; overflow-y:auto;
  padding:0 6px 0 0; text-align:justify;
}


/* ===================================================================
   4. Bestehende Klassen aus vorlagen.css, neu eingefaerbt
   -------------------------------------------------------------------
   Diese Beitraege gibt es laengst — sie werden NICHT bearbeitet,
   sondern hier ueberschrieben.
   =================================================================== */

/* ---- Allgemeiner Text (.info_box), z. B. tid 217 ---- */
.info_box.info_box.info_box{
  width:auto; max-width:720px; margin:24px auto; padding:22px 26px 24px;
  color:var(--v-text,#e8e4d8);
  font-family:var(--v-schrift-lauf,'EB Garamond',Georgia,serif);
  font-size:15px; line-height:1.7; text-align:justify;
  font-weight:normal; opacity:1; position:relative; overflow:hidden;
  border:1px solid var(--v-linie,#2a3149);
  border-image:none; border-radius:8px;
  box-shadow:0 4px 8px rgba(8,10,16,.5);
  background:
    linear-gradient(135deg, var(--v-akzent,#ad7e35) 0 30px, transparent 30px)
      top left / 60px 60px no-repeat,
    linear-gradient(315deg, var(--v-akzent,#ad7e35) 0 30px, transparent 30px)
      bottom right / 60px 60px no-repeat,
    var(--v-flaeche,#161b29);
}
/* Rundes Bild aus dem Kopfmotiv. Kommt aus dem CSS, damit auch
   bestehende Beitraege es bekommen. Float, weil der Inhalt einer
   info_box unvorhersehbar aufgebaut ist — so fliesst alles sauber
   drumherum, egal wie viele Absaetze darin stehen. */
.info_box.info_box.info_box:before{
  content:""; display:block; float:left;
  width:120px; height:120px; margin:0 20px 10px 0;
  border-radius:50%;
  border:3px solid var(--v-akzent,#ad7e35);
  box-shadow:0 0 15px rgba(173,126,53,.3);
  background:url(https://true-legends.net/images/goldenhour/header-mini.jpg) center/cover no-repeat;
  position:static; top:auto; left:auto; right:auto; bottom:auto;
}
.info_box.info_box.info_box:after{ content:""; display:block; clear:both; }
.info_box_title.info_box_title.info_box_title{
  font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif);
  font-size:26px; line-height:1.15; letter-spacing:2px;
  text-transform:lowercase; text-align:left;
  color:var(--v-akzent-hell,#d1a758);
  margin:0 0 8px; padding-bottom:8px;
  border-bottom:1px solid var(--v-linie,#2a3149);
}

/* ---- Gesuchsvorlage 2 "rainfalls" ----
   Faerbt sich komplett ueber vier Variablen. Die Beitraege bringen
   ihr eigenes <style> mit, das spaeter kommt — deshalb !important. */
/* Die vier Variablen an die Box selbst haengen, nicht an :root.
   Wichtig fuer fremde Foren: auf :root wuerden sie JEDES rainfalls-
   Gesuch der Seite umfaerben, auch fremde. So gilt es nur fuer unsere
   Boxen, und die Werte vererben sich an alles darin. */
.rainfalls.rainfalls.rainfalls,
.rainfalls_credit.rainfalls_credit.rainfalls_credit{
  --rainfallshell:     #1f2639 !important;
  --rainfallsmittel:   #161b29 !important;
  --rainfallsdunkel:   #10141f !important;
  --rainfallsfontfarbe:#e8e4d8 !important;
}
body .rainfalls_wanted_head.rainfalls_wanted_head.rainfalls_wanted_head{ color:var(--v-akzent-hell,#d1a758); }
body .rainfalls_credit.rainfalls_credit.rainfalls_credit{ color:var(--v-akzent,#ad7e35); }
body .rainfalls_credit.rainfalls_credit.rainfalls_credit a{ color:var(--v-text-leise,#a9a6b8) !important; }
body .rainfalls_wanted_facts.rainfalls_wanted_facts.rainfalls_wanted_facts fact{
  border:1px solid var(--v-linie,#2a3149);
  color:var(--v-text,#e8e4d8);
}
body .rainfalls_wanted_facts.rainfalls_wanted_facts.rainfalls_wanted_facts fact span{ color:var(--v-akzent-hell,#d1a758); }
body .rainfalls_wanted_inhalt_bild,
body .rainfalls_wanted_inhalt_text,
body .rainfalls_summary_text.rainfalls_summary_text.rainfalls_summary_text{ border:1px solid var(--v-linie,#2a3149); }

/* ---- Gesuchsvorlage 1 "Orden" ----
   Farben stehen dort fest im Regelwerk; hier gewinnt vorangestelltes
   "body" ueber hoehere Spezifitaet, ganz ohne !important. */
body #Orden{
  background-image:linear-gradient(rgba(16,20,31,.82),rgba(16,20,31,.88)),url(https://true-legends.net/images/goldenhour/bg-pattern.jpg);
  background-color:var(--v-flaeche,#161b29);
  color:var(--v-text,#e8e4d8);
}
body #Orden1{ border:1px solid var(--v-linie,#2a3149); }
body .Orden-title.Orden-title.Orden-title{
  color:var(--v-akzent-hell,#d1a758);
  text-shadow:-2px -1px 2px var(--v-grund,#10141f);
}
body .Orden-Name.Orden-Name.Orden-Name{ color:var(--v-text,#e8e4d8); }
body .Orden-Name.Orden-Name.Orden-Name span{ color:var(--v-akzent,#ad7e35); }
body .Orden-Sub-Name.Orden-Sub-Name.Orden-Sub-Name{ color:var(--v-text-leise,#a9a6b8); }
body .Orden-Text.Orden-Text.Orden-Text{
  background-color:rgba(16,20,31,.55);
  border-top:1px solid var(--v-linie,#2a3149);
  border-bottom:1px solid var(--v-linie,#2a3149);
}
body .Orden-textbox.Orden-textbox.Orden-textbox{ background-color:rgba(16,20,31,.7); }
body .Orden-Unten.Orden-Unten.Orden-Unten{ background-color:rgba(16,20,31,.5); }
body .Orden-Leute.Orden-Leute.Orden-Leute{ border-bottom:1px solid var(--v-linie,#2a3149); }
body #orden-scrollinfo{ color:var(--v-text,#e8e4d8); }
body .Orden-InUnten.Orden-InUnten.Orden-InUnten{ color:var(--v-text-leise,#a9a6b8); }
body .Orden-InUnten .Frei,
body font.Frei.Frei.Frei{ color:var(--v-akzent,#ad7e35); }
body font.Vergeben.Vergeben.Vergeben{ color:var(--v-text-still,#6f7086); }
body font.Reserviert.Reserviert.Reserviert{ color:#7a9e5e; }


/* ===================================================================
   5. Doppelte Admin-Krone
   -------------------------------------------------------------------
   Im formatierten Namen stehen zwei Kronen nebeneinander:
     <gNN><i class="fa-solid fa-crown tl-krone" title="Administration"></i></gNN>
     <gNN><i class="fa-solid fa-crown"></i></gNN>
   Die zweite (gross, laeuft im Gruppenverlauf mit) kommt aus
   inc/functions.php Zeile 3553 und bleibt. Die erste (klein, gold)
   stammt aus einer neueren Quelle auf dem Server und wird hier
   ausgeblendet — das wirkt nur dort, wo diese Datei geladen ist.
   Dauerhaft waere die erzeugende Stelle serverseitig zu entfernen.
   =================================================================== */
/* :has darf nicht in :has verschachtelt werden - der Browser verwirft
   die ganze Regel. Diese Fassung prueft stattdessen den umgebenden
   Link: enthaelt er ausser der kleinen auch die grosse Krone, faellt
   die kleine weg. Steht sie allein, bleibt sie. */
a:has(.fa-crown:not(.tl-krone)) .tl-krone{
  display:none;
}


/* Forumshintergrund hinter der rainfalls-Vorlage. Der Beitrag setzt
   dort die Kurzform "background: var(--rainfallsdunkel)", die ein Bild
   loeschen wuerde - deshalb nur background-image, mit hoeherer
   Spezifitaet. */
.rainfalls.rainfalls.rainfalls{
  background-image:linear-gradient(rgba(16,20,31,.82),rgba(16,20,31,.88)),url(https://true-legends.net/images/goldenhour/bg-pattern.jpg);
}


/* ===================================================================
   6. News-Vorlage (speech-bubble_l / newsbox_l)
   -------------------------------------------------------------------
   Bestehende Beitraege, Struktur unangetastet - nur Farben. Die
   Vorlage bringt ihr eigenes <style> mit, deshalb wieder verdreifachte
   Selektoren statt !important.
   Im Original: aeusserer Rahmen gruener Verlauf (#42575e -> #435750),
   innen #1e262b, Datumsband #0d1012, Textkasten #2d3940.
   =================================================================== */
.speech-bubble_l.speech-bubble_l.speech-bubble_l{
  background:linear-gradient(0deg, var(--v-akzent-tief,#6b4f1f), var(--v-akzent,#ad7e35));
}
.speech-bubble_l.speech-bubble_l.speech-bubble_l:before{
  border-right-color:var(--v-akzent-tief,#6b4f1f);
}
.newsbox_l.newsbox_l.newsbox_l{ background:var(--v-grund,#10141f); }
/* Die Vorlage laedt die Zierschrift "Beyond" ueber ein
   <link rel=stylesheet href="....ttf"> - das kann nicht funktionieren,
   eine .ttf ist kein Stylesheet. Das Datumsband nimmt deshalb die
   Titelschrift des neuen Designs. */
.newsdatum_l.newsdatum_l.newsdatum_l{
  background:var(--v-grund,#10141f);
  color:var(--v-akzent-hell,#d1a758);
  font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif);
}
.newsinhalt_l.newsinhalt_l.newsinhalt_l{
  background:var(--v-flaeche,#161b29);
  color:var(--v-text,#e8e4d8);
}
.newsinhalt_l.newsinhalt_l.newsinhalt_l::-webkit-scrollbar{ background:var(--v-linie,#2a3149); }
.newsinhalt_l.newsinhalt_l.newsinhalt_l::-webkit-scrollbar-thumb{ background:var(--v-akzent,#ad7e35); }
.newsinhalt_l.newsinhalt_l.newsinhalt_l::-webkit-scrollbar-corner{ background:var(--v-linie,#2a3149); }



/* ===================================================================
   7. Regelwerk (#rules), z. B. tid 23 — NUR umgefaerbt
   -------------------------------------------------------------------
   Layout, Groessen und Abstaende bleiben wie im alten Design. Geaendert
   wird nur, was in Golden Hour nicht mehr funktioniert:

   1) border-image:var(--bgimg) und background:var(--bgc1) — beide
      Variablen gibt es hier nicht, Rahmen und Grund fielen komplett
      aus. Der 25px-Rahmen bleibt in seiner Staerke erhalten, damit die
      Masse stimmen, und bekommt eine Farbe.
   2) margin-left:-35px zog den Kasten aus dem Beitrag heraus (im alten
      Design glich das dessen Innenabstaende aus). Daher klebte er am
      linken Rand — jetzt mittig.
   3) var(--font2) und var(--font1) sind Schriften des alten Designs
      und hier nicht vorhanden; ersetzt durch die Schriften des neuen.
   4) Der gruene Verlauf der Titel wird zum Goldverlauf. Die Technik
      dahinter (background-clip:text) bleibt — sie ist das Stilmittel.

   vorlagen.css laedt nach dieser Datei, deshalb ueberall "body"
   davor: gewinnt ueber Spezifitaet statt ueber Reihenfolge.
   =================================================================== */

body #rules{
  border:25px solid var(--v-flaeche,#161b29);
  border-image:none;
  background:var(--v-grund,#10141f);
  margin:24px auto;
  max-width:100%;
  box-sizing:border-box;
  color:var(--v-text,#e8e4d8);
}

/* Titel: gruener Verlauf -> Goldverlauf, Rest unveraendert */
body #rules .tit,
body #rules .tit1{
  background:linear-gradient(to bottom,
    var(--v-akzent-hell,#d1a758) 0%,
    var(--v-akzent,#ad7e35) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
body #rules .tit{ font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif); }
body #rules .tit1{
  font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif);
  border-bottom-color:var(--v-linie,#2a3149);
}

/* Trennlinie ueber dem Zwischenkopf hatte keine Farbe angegeben und
   lief in der Textfarbe mit */
body #rules .sub1{
  border-top-color:var(--v-linie,#2a3149);
  color:var(--v-text-leise,#a9a6b8);
}
body #rules .sub{ color:var(--v-text-leise,#a9a6b8); }

/* Abschnittsueberschriften: Zierschrift ersetzt, Ausrichtung bleibt */
body #rules .uberschrift,
body #rules .uberschrift1{
  font-family:var(--v-schrift-titel,'Cormorant Unicase',Georgia,serif);
  color:var(--v-akzent-hell,#d1a758);
}

body #rules b,
body #rules strong{ color:var(--v-akzent-hell,#d1a758); }


/* ===================================================================
   8. Zwei Folgen des neuen Grundgeruests
   ===================================================================

   a) Golden Hour setzt box-sizing:border-box global, das alte Design
      nicht. Bei den Orden-Kaesten zaehlt der Innenabstand seitdem zur
      Breite: .Orden-textbox hat width:199px und padding:23px 33px -
      innen bleiben dadurch nur 133px statt 199px, die Namensspalte
      wird also schmaler als im Original. Fuer die Kaesten mit fester
      Breite wird das alte Verhalten wiederhergestellt.

   b) Ein aufgeklappter [code]-Block waechst unbegrenzt und laeuft
      dabei in die Signatur. Der eingeklappte Zustand (.collapsed,
      75px) bleibt unangetastet - begrenzt wird nur der aufgeklappte,
      und er bekommt einen eigenen Rollbalken statt abgeschnitten zu
      werden.
   =================================================================== */

body #Orden1,
body #Orden,
body .Orden-textbox,
body .Orden-bildbox{
  box-sizing:content-box;
}

body .codeblock:not(.collapsed){
  max-height:320px;
  overflow-y:auto;
}


/* ===================================================================
   9. Lange Beitraege liefen unten aus dem Beitrag heraus
   ===================================================================
   Symptom: Bei langen Gesuchen standen die Links "Zum Forum" und
   "Zum Gesuch" ueber der Signatur statt im Beitrag.

   Ursache: .mitte ist ein Grid (Textspalte | Avatarspalte). Die
   Grid-Zeile bekommt ihre Hoehe, und beide Spalten werden darauf
   gestreckt. Die Textspalte .body ist innen ein Flex-Container in
   SPALTEN-Richtung, in dem .content auf "flex: 1 1 0%" steht - bei
   Spaltenrichtung ist die Hauptachse die Hoehe, die Grundhoehe also
   null. Ist der Text laenger als die Zeilenhoehe, waechst .content
   nicht mit, und der Ueberhang laeuft unten heraus.

   Behebung: Nur die Textspalte wird nicht mehr auf die Zeilenhoehe
   gestreckt, sondern darf ihre eigene Hoehe behalten - dann waechst
   die Grid-Zeile mit. Die Avatarspalte bleibt unangetastet und
   weiterhin auf voller Hoehe, das Aussehen aller anderen Beitraege
   aendert sich dadurch nicht.
   =================================================================== */
.post .mitte > .body{
  align-self:start;
}