/* ============================================================
   BADEN LIONS TEMPLATE - STYLE.CSS (FINAL)
   ============================================================ */
   
   /* =========================================
   GLOBALER FIX: Breite & Padding reparieren
   ========================================= */

/* 1. Alles inklusive Rahmen & Padding berechnen */
*, *::before, *::after {
  box-sizing: border-box !important;
}

/* 2. Verhindern, dass irgendetwas breiter als der Bildschirm wird */
html, body {
  max-width: 100vw;       /* Nicht breiter als das Sichtfenster */
  overflow-x: hidden;     /* Seitliches Scrollen verhindern */
  width: 100%;
  margin: 0;
  padding: 0;
}

/* 3. Sicherheitsnetz für Bilder */
img {
  max-width: 100%;
  height: auto;
}

/* ==== 1. VARIABLEN & GRUNDEINSTELLUNGEN ==== */
:root {
  --color-primary: #C8102E; /* Rot */
  --color-accent: #FFD100;  /* Gelb */
  --color-dark: #002855;    /* Dunkelblau */
  --color-bg: #f4f6f8;      /* Hellgrau (Hintergrund) */
  --color-white: #ffffff;   /* Weiß (Karten) */
}

body {
  margin: 0;
  padding: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background-color: var(--color-bg) !important; /* Hellgrauer Hintergrund */
  color: #333;
  line-height: 1.6;
  overflow-x: hidden; /* Verhindert seitliches Scrollen */
}

/* Links allgemein */
a {
  color: var(--color-primary);
  text-decoration: none;
  transition: color 0.3s ease;
}
a:hover {
  color: var(--color-dark);
}

/* ==== 2. LAYOUT & GRID ==== */
.layout-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1rem;
  box-sizing: border-box;
}

.section {
  margin-bottom: 2rem;
}

/* Haupt-Layout (Inhalt + Sidebar) */
.main-layout {
  display: flex;
  flex-wrap: nowrap; /* Desktop: Nebeneinander */
  gap: 2rem;
  align-items: flex-start;
}

/* Linker Bereich (Artikel) */
.content-area {
  flex: 2 1 60%;
  background-color: var(--color-white); /* Weiße Karte */
  padding: 2rem;
  border-radius: 4px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
  min-width: 0; /* Wichtig für Flexbox */
}

/* Rechter Bereich (Sidebar) */
.sidebar-area {
  flex: 1 1 30%;
  min-width: 250px;
}

/* Modul-Boxen in der Sidebar */
.moduletable {
  background: var(--color-white); /* Weiße Karte */
  padding: 1.5rem;
  border-radius: 4px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
  margin-bottom: 2rem;
}

/* ==== 3. HEADER & LOGO ==== */
/* Der Header wird größtenteils inline in der index.php gesteuert (Hintergrundbild),
   aber hier sind Hilfsklassen */
.header-wrapper {
  position: relative;
  z-index: 2;
  text-align: center;
}

/* ==== 4. NAVIGATION (DESKTOP & MOBIL) ==== */

/* Menü-Toggle Button (Hamburger) - Desktop ausblenden */
#menu-toggle {
  display: none;
}

/* Basis-Container (Gelber Balken) */
#mobile-menu, 
nav.main-nav {
  background-color: var(--color-accent) !important; /* Gelb */
  border-radius: 4px;
  box-shadow: 0 2px 5px rgba(0,0,0,0.1);
  padding: 0;
  margin-bottom: 2rem;
  position: relative;
  z-index: 100;
}

/* Die Liste */
nav.main-nav ul {
  display: flex;
  justify-content: center;
  margin: 0;
  padding: 0;
  list-style: none;
  gap: 0;
}

/* Die Links (Schrift Blau) */
nav.main-nav li a {
  color: var(--color-dark) !important; /* Dunkelblau */
  background: transparent !important;
  
  font-size: 1rem;
  font-weight: 700;
  text-transform: none; /* Normale Schreibweise */
  text-decoration: none;
  
  display: block;
  padding: 0.8rem 1.2rem;
  border: none !important;
  border-radius: 0;
  border-right: 1px solid rgba(0, 40, 85, 0.1) !important; /* Feine Trennlinie */
  transition: all 0.2s ease;
}

/* Letzter Menüpunkt braucht rechts keine Linie */
nav.main-nav li:last-child a {
  border-right: none !important;
}

/* Hover & Active Zustand (Hintergrund Blau, Schrift Gelb) */
nav.main-nav li a:hover,
nav.main-nav li.active > a,
nav.main-nav li.current > a {
  background-color: var(--color-dark) !important;
  color: var(--color-accent) !important;
}

/* FIX für Startseite: Bleibt gelb, wenn nicht aktiv */
nav.main-nav li.default:not(.current) > a {
  background-color: transparent !important;
  color: var(--color-dark) !important;
}

/* Pfeil für Untermenüs */
nav.main-nav li a.has-submenu::after {
  content: "\25BC";
  float: right;
  margin-left: 0.5rem;
  font-size: 0.8em;
}

/* --- UNTERMENÜS (Dropdowns) --- */
nav.main-nav li ul {
  display: none; /* Standardmäßig versteckt */
  position: absolute;
  top: 100%;
  left: auto;
  background-color: var(--color-accent) !important; /* Gelb */
  box-shadow: 0 5px 10px rgba(0,0,0,0.2);
  min-width: 220px;
  z-index: 999;
  border-top: 2px solid var(--color-dark);
  flex-direction: column; /* Untereinander */
}

/* Dropdown anzeigen bei Hover */
nav.main-nav li:hover > ul {
  display: flex;
}

/* Links im Dropdown */
nav.main-nav li ul li a {
  text-align: left;
  border-right: none !important;
  border-bottom: 1px solid rgba(0, 40, 85, 0.1) !important;
}
nav.main-nav li ul li:last-child a {
  border-bottom: none !important;
}

/* ==== 5. ÜBERSCHRIFTEN (ARTIKEL & SIDEBAR) ==== */
/* Einheitlicher Look: Rot mit gelbem Strich */
h1, h2, .item-title, .page-header h2,
.moduletable h3 {
  color: var(--color-primary) !important; /* Rot */
  font-size: 1.5rem !important;           /* Sidebar-Größe */
  font-weight: 700;
  text-transform: none;
  text-shadow: none !important;
  line-height: 1.3;
  margin-top: 0;
  margin-bottom: 1rem !important;
  padding-bottom: 0.3rem !important;
  border-bottom: 2px solid var(--color-accent) !important; /* Gelber Strich */
  text-decoration: none !important;
  display: block;
}

/* Links in Überschriften */
h1 a, h2 a, .moduletable h3 a {
  color: var(--color-primary) !important;
  text-decoration: none !important;
}
h1 a:hover, h2 a:hover, .moduletable h3 a:hover {
  color: var(--color-dark) !important; /* Hover: Dunkelblau */
  border-bottom-color: var(--color-dark) !important;
}

/* ==== 6. BILDER & INHALTE ==== */
/* Editor-Größe respektieren, aber responsive bleiben */
.content-area img {
  /* width: auto !important; */
  max-width: 100% !important;
  height: auto !important;
  display: inline-block !important;
  margin: 5px !important;
  float: none;
}

/* Float-Unterstützung (Bild links/rechts ausrichten) */
.content-area img[style*="float: left"], .pull-left {
  float: left !important;
  margin-right: 1.5rem !important;
  margin-bottom: 1rem !important;
}
.content-area img[style*="float: right"], .pull-right {
  float: right !important;
  margin-left: 1.5rem !important;
  margin-bottom: 1rem !important;
}

/* ==== 7. FOOTER ==== */
footer {
  background-color: var(--color-dark);
  color: var(--color-white);
  padding: 2rem 1rem;
  text-align: center;
  font-size: 0.9rem;
  margin-top: 2rem;
}
footer a { color: var(--color-accent); }

/* ==== 8. RESPONSIVE DESIGN (HANDY & TABLET) ==== */

@media (max-width: 900px) {
  /* Layout umbrechen (Sidebar unter Inhalt) */
  .main-layout {
    flex-wrap: wrap !important;
    flex-direction: column;
  }
  .content-area, .sidebar-area {
    flex: 1 1 100% !important;
    width: 100%;
  }
  .sidebar-area { margin-top: 2rem; }
}

@media (max-width: 768px) {
  /* Menü-Button (Hamburger) anzeigen */
  #menu-toggle {
    display: inline-block !important;
    background: var(--color-dark);
    color: var(--color-accent);
    border: none;
    padding: 10px 20px;
    font-weight: bold;
    margin-bottom: 10px;
    width: 100%;
    cursor: pointer;
  }

  /* Menü standardmäßig verstecken */
  #mobile-menu, nav.main-nav {
    display: none;
    background-color: var(--color-accent) !important; /* Gelb erzwingen! */
  }

  /* Menü anzeigen wenn "open" Klasse gesetzt ist (via JS) */
  #mobile-menu.open, nav.main-nav.open {
    display: block !important;
  }

  /* Liste untereinander */
  nav.main-nav ul {
    display: block;
  }

  /* Links auf volle Breite */
  nav.main-nav li a {
    text-align: left;
    border-right: none !important;
    border-bottom: 1px solid rgba(0, 40, 85, 0.1) !important;
    padding: 1rem;
  }

  /* Untermenüs: Mobil als Akkordeon */
  nav.main-nav li ul {
    position: static;
    display: block !important; /* Wichtig für JS-Animation */
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    box-shadow: none;
    background-color: rgba(255, 255, 255, 0.2) !important; /* Leicht abgesetzt */
    padding-left: 1rem;
    border-top: none;
  }

  /* Wenn Untermenü offen ist (durch JS "open" Klasse am li) */
  nav.main-nav li.open > ul {
    max-height: 500px; /* Genug Platz zum Ausklappen */
  }
  
  .mobile-only { display: block !important; }

}

/* =========================================
   WEITERLESEN-BUTTON (Design Baden Lions)
   ========================================= */

/* Der Button im Normalzustand */
p.readmore a, 
.readmore a, 
.btn-primary {
  background-color: #002855 !important; /* Vereins-Blau */
  color: #FFD100 !important;            /* Vereins-Gelb */
  border: 2px solid #002855 !important; /* Blauer Rand */
  
  display: inline-block;
  padding: 0.6rem 1.5rem;   /* Schöne Größe zum Klicken */
  border-radius: 4px;       /* Leicht abgerundete Ecken */
  
  font-weight: 700;         /* Fett */
  text-transform: uppercase; /* GROSSBUCHSTABEN (wirkt wie ein Button) */
  font-size: 0.9rem;
  letter-spacing: 0.5px;
  text-decoration: none !important;
  
  transition: all 0.3s ease; /* Weicher Farbwechsel */
  margin-top: 1rem;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1); /* Leichter Schatten */
}

/* Hover-Effekt (Maus drüber) */
p.readmore a:hover, 
.readmore a:hover, 
.btn-primary:hover {
  background-color: #FFD100 !important; /* Hintergrund wird Gelb */
  color: #002855 !important;            /* Schrift wird Blau */
  border-color: #002855 !important;     /* Rand bleibt Blau als Kontur */
  
  cursor: pointer;
  transform: translateY(-2px); /* Button kommt leicht entgegen */
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}

/* Optional: Kleiner Pfeil im Button (Joomla Icons nutzen) */
p.readmore a::after, 
.readmore a::after {
  content: " \276F"; /* Ein kleiner Winkel-Pfeil (›) */
  font-size: 1.1em;
  margin-left: 5px;
  vertical-align: middle;
}

/* =========================================
   FORMULARE & EINGABEFELDER
   ========================================= */

/* 1. Die Schreibfelder (Inputs & Textarea) */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="url"],
textarea, 
select,
.form-control {
  
  /* Das Wichtigste: Volle Breite */
  width: 100% !important; 
  max-width: 100%;
  box-sizing: border-box; /* Polster zählt nicht zur Breite dazu */
  
  /* Optik (Passend zum Design) */
  padding: 10px 15px;      /* Angenehmer Innenabstand */
  margin-bottom: 1.5rem;   /* Abstand zum nächsten Feld */
  
  border: 1px solid #ccc;  /* Dezenter grauer Rahmen */
  border-radius: 4px;      /* Leicht abgerundet */
  background-color: #ffffff;
  
  font-size: 1rem;
  font-family: inherit;
  color: #333;
}

/* 2. Wenn man ins Feld klickt (Fokus) */
input:focus, 
textarea:focus, 
select:focus,
.form-control:focus {
  border-color: #002855 !important; /* Rahmen wird Vereins-Blau */
  outline: none; /* Standard-Browser-Rahmen weg */
  box-shadow: 0 0 0 3px rgba(0, 40, 85, 0.1); /* Zarter blauer Schein außenrum */
  background-color: #fff;
}

/* 3. Die Beschriftung über den Feldern (Labels) */
label, .control-label, .form-label {
  font-weight: 700;        /* Fett */
  color: #002855;          /* Dunkelblau */
  margin-bottom: 0.5rem;   /* Etwas Platz zum Feld */
  display: block;          /* Steht in eigener Zeile */
}

/* 4. Der "Senden"-Button (Falls er nicht automatisch das Button-Design erbt) */
/* Wir machen ihn auch volle Breite, das drückt man auf dem Handy leichter */
.form-actions button,
button[type="submit"] {
  width: 100%;
  margin-top: 10px;
}
/* =========================================
   FOOTER (Fußzeile) - Modern & Vereinsfarben
   ========================================= */

footer {
  /* Hintergrund & Text */
  background-color: #002855 !important; /* Vereins-Blau */
  color: #ffffff !important;            /* Weiße Schrift */
  
  /* Layout & Abstände */
  padding: 3rem 1rem;       /* Großzügiger Innenabstand wirkt professioneller */
  margin-top: 4rem;         /* Genug Luft zum Inhalt darüber */
  text-align: center;       /* Alles schön mittig */
  
  /* Der gelbe Zierstreifen oben (Passend zum Menü) */
  border-top: 5px solid #FFD100 !important; 
  
  /* Typografie */
  font-size: 0.95rem;       /* Leicht lesbare Größe */
  position: relative;
  z-index: 10;
}

/* Links im Footer (z.B. Impressum, Datenschutz) */
footer a {
  color: #FFD100 !important;      /* Links leuchten in Gelb */
  font-weight: 700;               /* Fett */
  text-decoration: none;
  border-bottom: 1px dotted #FFD100; /* Feine gepunktete Linie */
  transition: all 0.3s ease;
  margin: 0 10px;                 /* Abstand zwischen Links */
}

/* Hover-Effekt für Footer-Links */
footer a:hover {
  color: #ffffff !important;      /* Werden Weiß beim Drüberfahren */
  border-bottom: 1px solid #fff;  /* Linie wird durchgezogen */
}

/* Text-Absätze im Footer */
footer p {
  margin: 0.5rem 0;
  opacity: 0.9; /* Minimal transparent, wirkt weniger "hart" */
}

/* =========================================
   FOOTER SPONSOR (bottom-b)
   ========================================= */

.footer-sponsor {
  margin-bottom: 2rem;       /* Abstand zum Text darunter */
  padding-bottom: 1.5rem;    /* Etwas Luft im Container */
  border-bottom: 1px solid rgba(255, 255, 255, 0.1); /* Hauchdünne Trennlinie zum Footer-Text */
}

/* Das Bild im Modul ansprechen */
.footer-sponsor img {
  max-height: 100px;         /* Maximale Höhe (damit es nicht den Footer sprengt) */
  width: auto;               /* Breite passt sich an */
  display: inline-block;
  vertical-align: middle;
  transition: transform 0.3s ease;
}

/* Kleiner Hover-Effekt für das Logo */
.footer-sponsor img:hover {
  transform: scale(1.05);    /* Wird beim Drüberfahren minimal größer */
}

/* =========================================
   TABELLEN-FIX: Nur für Inhalte (Sponsoren), NICHT Kalender
   ========================================= */

/* Wir zielen NUR auf Tabellen im Artikel-Bereich (.content-area) 
   UND schließen Kalender-Klassen explizit aus (:not(...)) */
.content-area table:not(.calendar):not(.mod_events_latest_table):not(.jcalendar) {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}

/* Bilder in diesen Tabellen flexibel machen */
.content-area table:not(.calendar) img {
  max-width: 100% !important;
  height: auto !important;
  width: auto !important;
}

/* Der "Stapel-Trick" für Handys - NUR für Inhalts-Tabellen */
@media (max-width: 768px) {
  
  /* Selector wird spezifischer: Nur im Content, keine Kalender */
  .content-area table:not(.calendar):not(.mod_events_latest_table) {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
    border: none !important;
  }
  
  /* Auch die inneren Elemente (tbody, tr, td) müssen wir spezifisch ansprechen */
  .content-area table:not(.calendar):not(.mod_events_latest_table) tbody,
  .content-area table:not(.calendar):not(.mod_events_latest_table) tr,
  .content-area table:not(.calendar):not(.mod_events_latest_table) td {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box;
  }

  /* Kopfzeile verstecken */
  .content-area table:not(.calendar) thead {
    display: none;
  }

  /* Zeilenabstand für Sponsoren */
  .content-area table:not(.calendar) tr {
    margin-bottom: 2rem;
    border-bottom: 2px solid #eee;
    padding-bottom: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* Zellen-Style */
  .content-area table:not(.calendar) td {
    border: none !important;
    padding: 0.5rem 0 !important;
    text-align: center !important;
  }
  
  /* Leere Zellen weg */
  .content-area table:not(.calendar) td:empty {
    display: none;
  }
}

/* =========================================
   1. REPARATUR: WEITERLESEN-BUTTONS
   ========================================= */
/* Wir stellen sicher, dass diese Buttons wieder wie vorher aussehen */
p.readmore a, 
.readmore a,
.btn.readmore {
  background-color: #002855 !important; /* Vereins-Blau */
  color: #FFD100 !important;            /* Vereins-Gelb */
  border: 2px solid #002855 !important;
  
  display: inline-block !important;
  padding: 0.6rem 1.5rem !important;
  border-radius: 4px !important;
  
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  
  /* Reset von möglichen Paginierungs-Fehlern */
  width: auto !important;
  height: auto !important;
  float: none !important;
}

/* Hover für Weiterlesen */
p.readmore a:hover, 
.readmore a:hover {
  background-color: #FFD100 !important;
  color: #002855 !important;
  border-color: #002855 !important;
}

/* =========================================
   PAGINIERUNG - NUR DESIGN (Keine Hacks)
   ========================================= */

/* 1. Die Leiste */
.pagination {
    display: flex !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 20px 0 !important;
    list-style: none !important;
    gap: 0 !important;
}

/* 2. Rahmen weg vom Listenpunkt */
.pagination li {
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    display: flex !important;
}

/* 3. Das Aussehen der Kästchen (Links & Spans) */
.pagination li a,
.pagination li span {
    position: relative !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    
    /* Quadratisch */
    width: 44px !important;
    height: 44px !important;
    
    /* Farben & Rahmen */
    background: #f4f6f8 !important;
    border: 1px solid #ced4da !important;
    color: #002855 !important;
    
    /* Text-Einstellungen */
    font-size: 18px !important; /* Groß genug für Pfeile */
    font-weight: 700 !important;
    text-decoration: none !important;
    margin-left: -1px !important;
}

/* 4. Aktive Seite */
.pagination li.active span,
.pagination li.active a {
    background: #002855 !important;
    color: #FFD100 !important;
    border-color: #002855 !important;
    z-index: 10 !important;
}

/* 5. Hover */
.pagination li a:hover {
    background: #e2e6ea !important;
    z-index: 5 !important;
}

/* =========================================
   JOOMGALLERY ZURÜCK-BUTTON FIX
   ========================================= */

/* Wir sprechen alle 3 Klassen gleichzeitig an -> Maximale Stärke */
a.jg-link.btn.btn-outline-primary {
    background-color: #002855 !important;  /* Vereins-Blau */
    color: #FFD100 !important;             /* Vereins-Gelb */
    border: 2px solid #002855 !important;
    
    /* Button-Form erzwingen */
    display: inline-flex !important;       /* Flexbox hilft beim Icon */
    align-items: center !important;
    padding: 0.6rem 1.5rem !important;
    border-radius: 4px !important;
    
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
}

/* Damit auch das Icon und der Text darin gelb werden */
a.jg-link.btn.btn-outline-primary i,
a.jg-link.btn.btn-outline-primary span {
    color: #FFD100 !important;
}

/* Hover-Effekt (Maus drüber) */
a.jg-link.btn.btn-outline-primary:hover {
    background-color: #FFD100 !important;  /* Gelb */
    color: #002855 !important;             /* Blau */
    border-color: #002855 !important;
}

/* Hover-Farben für Icon und Text */
a.jg-link.btn.btn-outline-primary:hover i,
a.jg-link.btn.btn-outline-primary:hover span {
    color: #002855 !important;
}

/* Kleiner Abstand zwischen Pfeil und Text */
a.jg-link.btn.btn-outline-primary i {
    margin-right: 8px !important;
}

/* =========================================
   NOTBREMSE: Such-Link wieder verstecken
   ========================================= */

/* Dieser Befehl ist spezifischer als der Design-Code und gewinnt deshalb */
a.jg-link.btn.btn-outline-primary[href*="view=gallery"] {
    display: none !important;
}

/* =========================================
   FINALER FIX (Basiert auf Screenshot-Analyse)
   ========================================= */

/* 1. Die "nackte" h3 Überschrift ("Unterkategorien") entfernen */
/* Wir nutzen einen Trick: "Wähle jedes h3, das nach einem blauen Button kommt" */
a.jg-link.btn.btn-outline-primary ~ h3 {
    display: none !important;
}

/* Falls es noch andere h3s gibt (Sicherheitsnetz) */
.jg-gallery ~ h3,
.jg-gallery h3 {
    display: none !important;
}


/* 2. Den "Zurück"-Button stylen */
/* WICHTIG: Wir nehmen nur den ERSTEN Button (:first-of-type), 
   damit der zweite Button ("Bilder durchsuchen") nicht verändert wird */

a.jg-link.btn.btn-outline-primary:first-of-type {
    position: relative !important;
    font-size: 0 !important;       /* Alten Text ("...") verstecken */
    
    /* Design & Breite */
    display: inline-flex !important; 
    width: auto !important;
    min-width: 280px !important;   /* Mindestbreite */
    padding: 0 25px !important;
    
    height: 45px !important;       
    align-items: center !important;  
    justify-content: center !important; 
    
    /* Farben (Normalzustand) */
    background-color: #002855 !important; /* Blau */
    border: 2px solid #002855 !important;
    border-radius: 4px !important;
    text-decoration: none !important;
}

/* Alte Icons im Button verstecken */
a.jg-link.btn.btn-outline-primary:first-of-type i,
a.jg-link.btn.btn-outline-primary:first-of-type span {
    display: none !important;
}

/* Neuer Text einfügen */
a.jg-link.btn.btn-outline-primary:first-of-type::after {
    content: "← ZURÜCK ZU: SAISON ÜBERSICHT"; 
    
    font-size: 14px !important;    
    font-weight: 700 !important;
    text-transform: uppercase;
    color: #FFD100 !important;     /* Gelb */
    white-space: nowrap !important;
}

/* 3. HOVER-EFFEKT (Nur für den ersten Button) */
a.jg-link.btn.btn-outline-primary:first-of-type:hover {
    background-color: #FFD100 !important; /* Hintergrund Gelb */
    border-color: #002855 !important;
}

a.jg-link.btn.btn-outline-primary:first-of-type:hover::after {
    color: #002855 !important; /* Text Blau */
}


/* OPTIONAL: Den zweiten Button ("Bilder durchsuchen") auch ausblenden? */
/* Wenn du den zweiten Button nicht willst, entferne die Kommentarzeichen (/* ... */) unten: */

/* a.jg-link.btn.btn-outline-primary:nth-of-type(2) {
    display: none !important;
}
*/