/* Newsletter Archiv - Minimal Custom CSS */

/* Header Gradient (falls Bootstrap bg-gradient-light nicht verfügbar) */
.bg-gradient-light {
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%) !important;
}

/* Artikel Hover-Effekt */
.newsletter-article:hover .card {
    transform: translateY(-2px);
    transition: transform 0.2s ease-in-out;
}

/* Sprungmarken-Index Hover */
.article-index .smooth-scroll:hover {
    background-color: rgba(198, 12, 48, 0.1);
    border-radius: 4px;
    padding: 2px 4px;
    transition: all 0.2s ease;
}

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* Markdown Content Spacing */
.lh-lg p {
    margin-bottom: 1rem;
}

.lh-lg h1, .lh-lg h2, .lh-lg h3, 
.lh-lg h4, .lh-lg h5, .lh-lg h6 {
    margin-top: 1.5rem;
    margin-bottom: 1rem;
}

/* Custom Border Color für Mobile Autor-Band */
.border-danger {
    --bs-border-color: #c60c30 !important;
}

.nlbefore li {
  position: relative; /* wichtig für das ::before-Positionieren */
  padding-left: 2rem; /* Platz für das Icon schaffen */
  list-style: none; /* falls der Browser eigene Bullets hat */
}

.nlbefore li::before {
  content: "";
  position: absolute;
  left: 0; /* Icon an den linken Rand setzen */
  top: 50%;
  transform: translateY(-50%);
  width: 1rem;
  height: 1rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  /* Dein SVG-Icon */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23c60c30' d='M8 5v14l11-7z'/></svg>");
}