/* css styles */

/* ==========================================================================
 *   1. NAVBAR & BRANDING
 *   ========================================================================== */

/* Kompass als Logo */
.navbar-brand {
  font-size: 1.8rem;
  filter: sepia(0.5);
}

/* Navigations-Links (Textfarben korrigiert für Sichtbarkeit) */
.navbar-nav .nav-link {
  font-family: 'Verdana', sans-serif;
  font-weight: 500;
  /* Solarized Base 1 (Hellgrau/Silber) statt Dunkelgrün für Dark Mode */
  color: #93a1a1 !important;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
}

/* Der rebellische Regenbogen-Fallschirm 🪂 */
.nav-link[href="crw.qmd"] {
  font-weight: bold !important;
  filter: drop-shadow(0 0 2px rgba(0,0,0,0.3));
}

/* Hover-Effekt: Der Fallschirm "fliegt" */
.navbar-nav .nav-link:hover {
  color: #cb4b16 !important; /* Solar Orange */
  transform: translateY(-2px) scale(1.05);
  transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Trennstrich-Fix: Jetzt am nav-link oder nav-item sauber definiert */
.navbar-nav .nav-item:not(:last-child) {
  /* Hellerer, subtilerer Strich für das Solar-Dunkel */
  border-right: 1px solid rgba(147, 161, 161, 0.3);
  margin-right: 8px;
  padding-right: 8px;
  display: flex;
  align-items: center;
}

/* Sonderfall: Aktiv-Zustand (damit man sieht, wo man ist) */
.navbar-nav .nav-link.active {
  color: #268bd2 !important; /* Solar Blau für aktive Seite */
}

/* ==========================================================================
 *   2. ZITAT-STYLING (INDEX.QMD & CRW.QMD)
 *   ========================================================================== */

.hero-quote {
  font-family: "Georgia", "Times New Roman", serif;
  font-size: 2.4rem;
  color: #93a1a1; /* Hellere Farbe für bessere Lesbarkeit */
  font-style: italic;
  text-align: center;
  line-height: 1.3;
  margin-top: 30px;
  padding: 0 10%;
}

.hero-quote p {
  margin-bottom: 0;
}

.hero-quote::before, .hero-quote::after {
  color: #b58900; /* Solar Gold */
}

.hero-author {
  font-family: "Verdana", sans-serif;
  font-size: 0.9rem;
  color: #586e75; /* Solar Base 01 */
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin-top: 10px;
}

.hero-author::after {
  content: "";
  display: block;
  width: 40px;
  height: 2px;
  background-color: #586e75;
  margin: 20px auto;
  opacity: 0.4;
}

/* ==========================================================================
 *   3. BUTTONS & ICONS
 *   ========================================================================== */

.about-links .btn {
  border: none;
  font-family: 'Verdana', sans-serif;
  letter-spacing: 0.5px;
  color: #b58900 !important;
}

.about-links .btn:hover {
  color: #cb4b16 !important;
  background: transparent !important;
}

.about-links .btn i.bi-globe {
  color: #268bd2 !important;
}

.about-links .btn i.bi-creative-commons {
  color: #859900 !important;
}

/* Logbuch-Listing Anpassungen */
.listing-date {
  color: #b58900 !important; /* Solar Gold */
  font-family: 'Verdana', sans-serif;
  font-weight: bold;
}

.listing-categories .listing-category {
  background-color: #073642; /* Solar Base 02 */
  color: #859900;           /* Solar Grün */
  border: 1px solid #859900;
  border-radius: 3px;
  text-transform: uppercase;
  font-size: 0.7rem;
}

.listing-reading-time {
  font-style: italic;
  opacity: 0.7;
}

/* Ergänzung in deiner styles.css */
.listing-reading-time::before {
  content: "Lesezeit : ";
}

/* ==========================================================================
 *   4. INHALTSSEITEN
 *   ========================================================================== */

h2 {
  font-family: "Georgia", serif;
  color: #eee8d5; /* Helles Beige für Überschriften im Dark Mode */
  border-left: 4px solid #cb4b16;
  padding-left: 15px;
  margin-top: 40px;
}

@media (max-width: 768px) {
  .hero-quote {
    font-size: 1.6rem;
  }
  /* Trennstriche mobil ausblenden für besseren Flow */
  .navbar-nav .nav-item {
    border-right: none !important;
  }
}