/**
 * custom.css für HSV Vorarlberg Website
 * Version: 1.6.8
 * Zuletzt aktualisiert: 2025-08-17
 */

 /* ============================================================================
   CSS-Variablen: Schriften definieren
   ============================================================================ */
   
   /* Montserrat Regular */
@font-face {
  font-family: 'Montserrat';
  src: url('/templates/shaper_helixultimate/fonts/Montserrat-Regular.woff2') format('woff2'),
       url('/templates/shaper_helixultimate/fonts/Montserrat-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Roboto Regular */
@font-face {
  font-family: 'Roboto';
  src: url('/templates/shaper_helixultimate/fonts/Roboto-Regular.woff2') format('woff2'),
       url('/templates/shaper_helixultimate/fonts/Roboto-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Beispiel für Bold/Fett (optional, falls verwendet) */
@font-face {
  font-family: 'Montserrat';
  src: url('/templates/shaper_helixultimate/fonts/Montserrat-Bold.woff2') format('woff2'),
       url('/templates/shaper_helixultimate/fonts/Montserrat-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('/templates/shaper_helixultimate/fonts/Roboto-Bold.woff2') format('woff2'),
       url('/templates/shaper_helixultimate/fonts/Roboto-Bold.woff') format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Bootstrap-Variable überschreiben */
:root {
  --bs-body-font-family: 'Roboto', Arial, sans-serif;
  --font-headline: 'Montserrat', Arial, sans-serif;
  --font-body: 'Roboto', Arial, sans-serif;
}

/* ============================================================================
   1. CSS-Variablen: zentrales Farbkonzept (Logo-basiert)
   ============================================================================ */
:root {
  --color-primary:   #D60000; /* Signal-Rot aus dem Logo */
  --color-secondary: #C7A358; /* Gold-Akzent */
  --color-text:      #333333; /* Dunkelgrauer Fließtext */
  --color-bg:        #FFFFFF; /* Weißer Haupt-Hintergrund */
  --color-bg-alt:    #F5F5F5; /* Hellgrauer Sekundär-Hintergrund */
  --color-headline:  #000000; /* Schwarze Headlines */
  --f-button-bg: rgba(0, 0, 0, 0.5); /* halbtransparenter Kreis um Slider Navi */
  --f-button-hover-bg: rgba(0, 0, 0, 0.8); /* wenigertransparenter Kreis um Slider Navi */
  --f-button-active-bg: rgba(0, 0, 0, 0.8); /* wenigertransparenter Kreis um Slider Navi */
}

/* ============================================================================
   2. Base: globale Resets & Typografie
   ============================================================================ */
body {
  scroll-behavior: smooth;
  color: var(--color-text);
  background-color: var(--color-bg);
  font-family: var(--font-body);
}

h1, h2, h3, h4, h5 {
  font-family: var(--font-headline);
}

/* Verbergen der Featured-Badges */
.view-featured .blog .article-list .article .featured-article-badge,
.article-list .article .featured-article-badge {
  display: none !important;
}
#sp-header {
    margin-bottom: 15px;
}
	
/* ============================================================================
   3. Layout: Grid-Container & Spacings
   ============================================================================ */
/* 3.1 Newsstream-Grid (3/2/1 Spalten je nach Breite) */
.mod-custom.custom .newsstream-grid {
  display: grid !important;
  gap: 1.5rem !important;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  margin-bottom: 2rem !important;
}
.mod-custom.custom .newsstream-grid .news-teaser {
  width: 100% !important;
}

/* 3.2 Sektionen-Kacheln Grid (3/auto-fit) */
.sektionen-grid {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  justify-items: center;
}
.sektionen-grid .kachel {
  width: 100%;
  max-width: 360px; /* oder gewünschte Breite */
}
.sektionen-grid > * {
  justify-self: center;
}
/* ============================================================================
   4. Komponenten
   ============================================================================ */

/* 4.1 Megamenu Untermenü 
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner {
  font-family: var(--font-headline);
  background: var(--color-primary);
  font-size: 18px;
  font-weight: bold;
}*/
/* neuer Versuch */

.sp-megamenu-parent > li > a,
.sp-megamenu-parent > li > span {
  font-size: 16px;
  font-weight: 500;
  font-family: var(--font-headline);
  transition: all 0.3s ease;
}

.sp-megamenu-parent > li > a:hover,
.sp-megamenu-parent > li > span:hover {
  color: var(--color-secondary); /* z.B. ein schönes Orange oder Blau */
  text-decoration: underline;
  transform: translateY(-2px); /* leichtes Anheben beim Hover */
}



/* 4.2 News-Teaser */
.mod-custom.custom .news-teaser {
  position: relative !important;
  background-color: var(--sektion-bg, var(--color-bg-alt)) !important;
  border: 1px solid rgba(0,0,0,0.12) !important;
  border-radius: 12px !important;
  padding: 1rem !important;
  overflow: hidden !important;
  transition: transform .3s ease, box-shadow .3s ease !important;
}
.mod-custom.custom .news-teaser::before {
  content: "" !important;
  position: absolute !important;
  left: 0; top: 0 !important;
  width: 4px; height: 100% !important;
  background-color: transparent !important;
  border-top-left-radius: 12px !important;
  border-bottom-left-radius: 12px !important;
  transition: background-color .3s ease !important;
}
.mod-custom.custom .news-teaser:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 4px 12px var(--sektion-shadow, rgba(0,0,0,0.2)) !important;
}
.mod-custom.custom .news-teaser:hover::before {
  background-color: var(--sektion-color, var(--color-primary)) !important;
}
.mod-custom.custom .news-teaser img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 350px !important;
  object-fit: cover !important;
  object-position: center !important;
  margin-bottom: .75rem !important;
  border-radius: 8px !important;
}
.mod-custom.custom .news-teaser h5 {
  margin: 0 0 .5rem !important;
  font-size: 1.1rem !important;
  color: var(--color-headline) !important;
}
.mod-custom.custom .news-teaser p {
  margin: 0 0 1rem !important;
  font-size: .95rem !important;
}
.mod-custom.custom .news-teaser a.btn {
  display: inline-block !important;
  border-color: var(--sektion-color, var(--color-primary)) !important;
  color: var(--sektion-color, var(--color-primary)) !important;
}
.mod-custom.custom .news-teaser a.btn:hover {
  background-color: var(--sektion-color, var(--color-primary)) !important;
  color: #fff !important;
}

/* 4.3 Sektionen-Kachel */
.kachel {
  background: var(--color-bg-alt);
  text-align: center;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 12px;
  padding: 1rem;
  box-shadow: 0 1px 4px rgba(0,0,0,0.05);
  transition: all .4s ease;
  position: relative;
  overflow: hidden;
}
.kachel img {
  display: block;
  margin: 0 auto 1rem;
  max-width: 100%;
}
.kachel::before {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: 5px; height: 100%;
  background-color: transparent;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  transition: background-color .3s ease;
}
.kachel:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px var(--sektion-shadow, rgba(0,0,0,0.2));
}
.kachel:hover::before {
  background-color: var(--sektion-color, var(--color-primary));
}

/* 4.4 Teaser-Box (JCE-Vorlage) */
.article-teaser {
  background: var(--color-bg-alt);
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  padding: 1rem;
  position: relative;
  transition: transform .3s ease, box-shadow .3s ease;
}
.article-teaser:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 12px var(--sektion-shadow);
}
.article-teaser::before {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: 4px; height: 100%;
  background-color: transparent;
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
  transition: background-color .3s ease;
}
.article-teaser:hover::before {
  background-color: var(--sektion-color);
}
.article-teaser .btn-outline {
  border-color: var(--sektion-color);
  color: var(--sektion-color);
}
.article-teaser .btn-outline:hover {
  background-color: var(--sektion-color);
  color: #fff;
}

/* 4.5 Artikel-Item Override */
.article-item {
  border-left: 4px solid transparent;
  padding-left: 1rem;
  margin-bottom: 2rem;
  transition: border-color .3s ease, box-shadow .3s ease;
}
.article-item:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
/* Sektion-Farben für Artikel */
.article-item.sektion-fischen    { border-left-color: var(--sektion-color); }
.article-item.sektion-bogenschiessen    { border-left-color: var(--sektion-color); }
.article-item.sektion-schiessen  { border-left-color: var(--sektion-color); }
.article-item.sektion-alpin      { border-left-color: var(--sektion-color); }
.article-item.sektion-dart       { border-left-color: var(--sektion-color); }
.article-item.sektion-fussball   { border-left-color: var(--sektion-color); }
.article-item.sektion-gymnastik  { border-left-color: var(--sektion-color); }
.article-item.sektion-hundesport { border-left-color: var(--sektion-color); }
.article-item.sektion-paddeln    { border-left-color: var(--sektion-color); }
.article-item.sektion-tauchen    { border-left-color: var(--sektion-color); }

/* 4.6 Akkordeon */
.accordion-item {
  border: 1px solid #ddd;
  border-radius: 5px;
  margin-bottom: 1rem;
  background-color: #fff;
  overflow: hidden;
}
.accordion-button {
  font-weight: 600;
  font-size: 1.05rem;
  border: none;
  transition: all .3s ease-in-out;
  color: #111;
}
.accordion-button:focus {
  box-shadow: none;
}
.accordion-body {
  padding: 1rem 1.25rem;
  font-size: .95rem;
  line-height: 1.6;
  color: #333;
}

	
/* ============================================================================
   4.7 Kachel-Artikel (Beiträge – Kategorie)
   Optik: Sektionsfarbe, fixer Bodybereich mit "Mehr erfahren"-Button
   ============================================================================ */

/* Basisvariablen für Farben, Schatten, Kartenhöhe und Bodyhöhe */
.hsv-kacheln{
  --accent: var(--sektion-color, var(--color-primary));
  --shadow: var(--sektion-shadow, rgba(0,0,0,.18));
  --card-h: 320px;   /* Standardhöhe der Karte */
  --body-h: 120px;   /* Standardhöhe des Textbereichs */
}

/* Grid-Layout */
.hsv-kacheln.kachel-grid{ display:grid; gap:20px; grid-template-columns:repeat(3,1fr); }
@media (min-width:1200px){ .hsv-kacheln.kachel-grid.kachel-4{ grid-template-columns:repeat(4,1fr);} }
@media (max-width:991px){ .hsv-kacheln.kachel-grid{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:575px){ .hsv-kacheln.kachel-grid{ grid-template-columns:1fr; }}

/* Karte */
.hsv-card{
  position:relative;
  display:flex;
  flex-direction:column;
  height:var(--card-h);
  background:#fff;
  border-radius:12px;
  overflow:hidden;
  text-decoration:none;
  box-shadow:0 8px 24px -8px var(--shadow);
  transition:transform .18s ease, box-shadow .18s ease;
}
.hsv-card:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 32px -8px var(--shadow);
}

/* linker Farbstreifen */
.hsv-card__stripe{
  position:absolute;
  inset:0 auto 0 0;
  width:8px;
  background:var(--accent);
}

/* Bildbereich: Höhe = Gesamthöhe – Bodyhöhe */
.hsv-card__image{
  height:calc(var(--card-h) - var(--body-h));
  background:#f2f2f2;
  flex:0 0 auto;
}
.hsv-card__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* Bodybereich: Hintergrund in Sektionsfarbe */
.hsv-card__body{
  height:var(--body-h);
  padding:12px 14px 14px 16px;
  display:flex;
  flex-direction:column;
  gap:8px;
  background:var(--sektion-bg, rgba(0,0,0,.04));
}

/* Titel auf 2 Zeilen beschränkt */
.hsv-card__title{
  font-size:1.05rem;
  line-height:1.25;
  color:#111;
  margin:0;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* Introtext auf 1 Zeile beschränkt */
.hsv-card__intro{
  margin:0;
  color:#444;
  font-size:.95rem;
  line-height:1.35;
  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* "Mehr erfahren"-Button */
.hsv-card__btn{
  margin-top:auto;
  align-self:flex-start;
  display:inline-block;
  padding:.35rem .7rem;
  border-radius:8px;
  font-size:.9rem;
  border:1px solid var(--accent);
  color:var(--accent);
  background:transparent;
}
.hsv-card:hover .hsv-card__btn{
  background:var(--accent);
  color:#fff;
}

/* Utility-Klassen mit automatischer Bodyhöhe je Kartenhöhe */
.hsv-kacheln.card-h-280{ --card-h:280px; --body-h:100px; }
.hsv-kacheln.card-h-320{ --card-h:320px; --body-h:110px; }
.hsv-kacheln.card-h-360{ --card-h:360px; --body-h:140px; }
.hsv-kacheln.card-h-400{ --card-h:400px; --body-h:160px; }

/* … deine bisherigen 4.7-Kachel-Styles … */

/* Accent je Karte aus ihrer eigenen Sektion ziehen */
.hsv-card[class*="sektion-"]{
  --accent: var(--sektion-color);
  --shadow: var(--sektion-shadow, rgba(0,0,0,.18));
}

/* Stripe direkt aus Sektion färben */
.hsv-card__stripe{
  background: var(--sektion-color, var(--accent, var(--color-primary)));
}

/* ============================================================================
   4.7.1 Kachel-Stripe: Sektion pro Karte erzwingen (überschreibt Wrapper)
   ============================================================================ */
.hsv-card.sektion-fischen        .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-bogenschiessen .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-schiessen      .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-alpin          .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-dart           .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-fussball       .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-gymnastik      .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-hundesport     .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-paddeln        .hsv-card__stripe { background-color: var(--sektion-color) !important; }
.hsv-card.sektion-tauchen        .hsv-card__stripe { background-color: var(--sektion-color) !important; }

/* Optional: Body-Hintergrund pro Karte noch etwas kräftiger */
.hsv-card.sektion-fischen        .hsv-card__body,
.hsv-card.sektion-bogenschiessen .hsv-card__body,
.hsv-card.sektion-schiessen      .hsv-card__body,
.hsv-card.sektion-alpin          .hsv-card__body,
.hsv-card.sektion-dart           .hsv-card__body,
.hsv-card.sektion-fussball       .hsv-card__body,
.hsv-card.sektion-gymnastik      .hsv-card__body,
.hsv-card.sektion-hundesport     .hsv-card__body,
.hsv-card.sektion-paddeln        .hsv-card__body,
.hsv-card.sektion-tauchen        .hsv-card__body {
  background: var(--sektion-bg, rgba(0,0,0,.05)) !important;
}

.hsv-card.sektion-default .hsv-card__stripe{ background: var(--color-primary) !important; }

/* ============================================================================
   5. Utilities & Media-Queries
   ============================================================================ */
/* Blur-Reset Animation */
@keyframes blur-reset {
  0%   { backdrop-filter: blur(2px); }
  100% { backdrop-filter: none; }
}
/* Mobile-Tweaks */
@media (max-width: 768px) {
  .mod-custom.custom .newsstream-grid { grid-template-columns: 1fr !important; }
  .sektion-teaser, .news-teaser, .article-item { padding: 1rem; }
}

/* ============================================================================
   6. Sektion-Farben
   ============================================================================ */
.sektion-fischen {
  --sektion-color: #1e88e5;
  --sektion-shadow: rgba(30,136,229,0.3);
  --sektion-bg: rgba(30,136,229,0.08);
}
.sektion-bogenschiessen {
  --sektion-color: #8e24aa;
  --sektion-shadow: rgba(142,36,170,0.3);
  --sektion-bg: rgba(142,36,170,0.08);
}
.sektion-schiessen {
  --sektion-color: #c62828;
  --sektion-shadow: rgba(198,40,40,0.3);
  --sektion-bg: rgba(198,40,40,0.08);
}
.sektion-alpin {
  --sektion-color: #2e7d32;
  --sektion-shadow: rgba(46,125,50,0.3);
  --sektion-bg: rgba(46,125,50,0.08);
}
.sektion-dart {
  --sektion-color: #f9a825;
  --sektion-shadow: rgba(249,168,37,0.3);
  --sektion-bg: rgba(249,168,37,0.08);
}
.sektion-fussball {
  --sektion-color: #1565c0;
  --sektion-shadow: rgba(21,101,192,0.3);
  --sektion-bg: rgba(21,101,192,0.08);
}
.sektion-gymnastik {
  --sektion-color: #d81b60;
  --sektion-shadow: rgba(216,27,96,0.3);
  --sektion-bg: rgba(216,27,96,0.08);
}
.sektion-hundesport {
  --sektion-color: #5d4037;
  --sektion-shadow: rgba(93,64,55,0.3);
  --sektion-bg: rgba(93,64,55,0.08);
}
.sektion-paddeln {
  --sektion-color: #00897b;
  --sektion-shadow: rgba(0,137,123,0.3);
  --sektion-bg: rgba(0,137,123,0.08);
}
.sektion-tauchen {
  --sektion-color: #00acc1;
  --sektion-shadow: rgba(0,172,193,0.3);
  --sektion-bg: rgba(0,172,193,0.08);
}

/* ============================================================================
   7. Fehlerseite: Bild transparent darstellen
   ============================================================================ */
body.error-page::before {
  content: "";
  background: inherit;
  opacity: 0.5;
  position: fixed;
  inset: 0;
  z-index: -1;
}

/* HSV Kontakt-Button */
.btn-hsv-contact{
  --hsv-red:#D60000;    /* Primary */
  --hsv-gold:#C7A358;   /* Accent */
  --hsv-text:#ffffff;   /* Text on red */

  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--hsv-red);
  color:var(--hsv-text);
  border:2px solid var(--hsv-gold);
  padding:.65rem 1.1rem;
  border-radius:999px;              /* Pill */
  font-weight:700; letter-spacing:.2px;
  text-decoration:none;
  box-shadow:0 6px 16px rgba(0,0,0,.15);
  transition:transform .12s ease, box-shadow .12s ease, background .2s ease;
}
.btn-hsv-contact:hover,
.btn-hsv-contact:focus{
  background:#b80000;               /* dunkleres Rot */
  box-shadow:0 8px 22px rgba(0,0,0,.22);
  transform:translateY(-1px);
  color:#fff; text-decoration:none;
}
.btn-hsv-contact:active{ transform:translateY(0); }

/* Optionale Größen */
.btn-hsv-contact.btn-sm{ padding:.45rem .9rem; font-size:.95rem; }
.btn-hsv-contact.btn-lg{ padding:.85rem 1.25rem; font-size:1.05rem; }

/* Zentrierung */
.hsv-contact-center{
  text-align:center;     /* horizontal zentrieren */
  margin:1.5rem 0;       /* Abstand oben/unten */
}
	

/*  ============================================================================
	Bild im Beitrag zentrieren + Abstand + Linie darunter 
	============================================================================*/

/* Artikel-Introbild zentrieren + Abstände */
.article-full-image.float-img-center { 
  text-align: center; 
  margin: 20px 0;            /* top/bottom 20px */
}
.article-full-image.float-img-center img {
  display: inline-block;     /* oder block + auto-Margins */
  vertical-align: middle;
  border-radius: 12px;       /* falls gewünscht */
}
/* Wenn du lieber block nutzen willst:
.article-full-image.float-img-center img { display:block; margin:0 auto; }
*/
	
*/ Fancy-Button bei Slider mit halbtransparentem Background versehen /*
	
	/* Fancybox Buttons (angepasst) */
.fancybox__button {
  background-color: var(--f-button-bg, rgba(0, 0, 0, 0.5)) !important;
  transition: background-color 0.3s ease;
}

.fancybox__button:hover {
  background-color: var(--f-button-hover-bg, rgba(0, 0, 0, 0.8)) !important;
}

.fancybox__button:active {
  background-color: var(--f-button-active-bg, rgba(0, 0, 0, 0.8)) !important;
}

/* ===========================
   DPCalendar – Edles HSV-Theme
   Primär: Rot #D60000
   Akzent: Petrol #006D77
   Sekundär: Gold #B8860B
   Neutral: Anthrazit #2C2C2C, Hell #FAFAFA
   =========================== */

/* --- Toolbar/Buttons (Kalenderkopf, Pager) --- */
.fc .fc-button,
.dpc-button,
button.dpc-btn,
a.dpc-btn {
  background: #D60000;
  border: 0;
  color: #fff;
  border-radius: 10px;
  padding: .5rem .9rem;
  font-weight: 600;
}
.fc .fc-button:hover,
.dpc-button:hover,
button.dpc-btn:hover,
a.dpc-btn:hover { background: #006D77; }
.fc .fc-button-primary:disabled { opacity:.6; }

/* Titel & Filterzeile */
.dpc-calendar .fc-toolbar-title,
.dpc-calendar .dpc-heading {
  font-weight: 800;
  letter-spacing:.3px;
  color:#2C2C2C;
}
.dpc-calendar .dpc-filters select,
.dpc-calendar .dpc-filters input[type="search"],
.dpc-calendar .dpc-filters .chosen-container {
  border-radius:10px;
  border:1px solid #ddd;
  background:#FAFAFA;
}

/* --- Basis-Badge --- */
.dpc-category-badge,
.dpc-event__category {
  border-radius: 999px;
  padding: .2rem .7rem;
  font-size: .82rem;
  font-weight: 600;
  color: #fff;
  background:#006D77; /* Standard Petrol */
  box-shadow: 0 0 0 1px rgba(0,0,0,.03), 0 2px 6px rgba(0,0,0,.06);
}

/* --- Monatsansicht (FullCalendar) --- */
.fc-theme-standard .fc-scrollgrid,
.fc-theme-standard td, .fc-theme-standard th { border-color:#eee; }
.fc .fc-daygrid-day-number { font-weight:700; color:#2C2C2C; }
.fc .fc-daygrid-day-frame { padding:6px; }

/* Event-Plaketten im Grid */
.fc .fc-daygrid-event {
  background:#006D77; /* Default Petrol */
  color:#fff;
  border:0;
  border-radius:8px;
  padding:2px 6px;
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.fc .fc-daygrid-event:hover {
  background:#B8860B; /* Gold */
  color:#fff;
}

/* Heute-Markierung subtil in Gold */
.fc .fc-daygrid-day.fc-day-today { background: rgba(184,134,11,.08); }

/* --- Listen-/Upcoming-Ansichten --- */
.dpc-event-list .dpc-event,
.dpc-events .dpc-event {
  background:#FAFAFA;
  border:1px solid #eee;
  border-left:5px solid #D60000; /* Rot als Marker */
  border-radius:12px;
  padding:1rem;
  margin-bottom:.9rem;
  box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.dpc-event .dpc-title a { color:#2C2C2C; font-weight:800; }
.dpc-event .dpc-title a:hover { color:#006D77; }
.dpc-event .dpc-meta { color:#555; }
.dpc-event .dpc-meta i { opacity:.7; }

/* --- Event-Detailseite --- */
.dpc-event-detail .dpc-title { font-weight:900; color:#2C2C2C; }
.dpc-event-detail .dpc-actions a,
.dpc-event-detail .dpc-actions button {
  background:#006D77; color:#fff; border:0; border-radius:10px; padding:.55rem .95rem;
}
.dpc-event-detail .dpc-actions a:hover,
.dpc-event-detail .dpc-actions button:hover { background:#B8860B; }
.dpc-event-detail hr { border:0; border-top:2px solid rgba(184,134,11,.2); margin:1rem 0; }

/* --- Karten (OSM/Leaflet Container) --- */
.dpc-map { min-height:340px; border-radius:12px; overflow:hidden; border:1px solid #eee; }
.leaflet-control-zoom a {
  background:#006D77; color:#fff !important; border:0; box-shadow:0 2px 6px rgba(0,0,0,.15);
}
.leaflet-control-zoom a:hover { background:#B8860B; }

/* --- Formulare (Buchung/Frontend-Edit) --- */
.dpc-form input[type="text"],
.dpc-form input[type="email"],
.dpc-form input[type="number"],
.dpc-form input[type="datetime-local"],
.dpc-form select, .dpc-form textarea {
  background:#FAFAFA; border:1px solid #ddd; border-radius:10px; padding:.55rem .7rem;
}
.dpc-form input:focus, .dpc-form select:focus, .dpc-form textarea:focus {
  outline:none; border-color:#006D77; box-shadow:0 0 0 3px rgba(0,109,119,.15);
}
.dpc-form .btn-primary,
.dpc-booking button[type="submit"] {
  background:#D60000; color:#fff; border:0; border-radius:10px; padding:.6rem 1rem; font-weight:700;
}
.dpc-form .btn-primary:hover,
.dpc-booking button[type="submit"]:hover { background:#006D77; }

/* --- Links/Hover allgemein --- */
.dpc-calendar a, .dpc-events a { color:#D60000; }
.dpc-calendar a:hover, .dpc-events a:hover { color:#006D77; text-decoration:underline; }

/* =============================
   Sektionen-Farbanpassungen je Kategorie
   ============================= */

/* Fischen */
.dpc-event--category-hsv-fischen .dpc-category-badge,
.dpc-event[data-category-alias="hsv-fischen"] .dpc-category-badge {
  background: var(--sektion-color, #1e88e5);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(30,136,229,0.3));
}

/* Bogenschiessen */
.dpc-event--category-hsv-bogenschiessen .dpc-category-badge,
.dpc-event[data-category-alias="hsv-bogenschiessen"] .dpc-category-badge {
  background: var(--sektion-color, #8e24aa);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(142,36,170,0.3));
}

/* Schießen */
.dpc-event--category-hsv-schiessen .dpc-category-badge,
.dpc-event[data-category-alias="hsv-schiessen"] .dpc-category-badge {
  background: var(--sektion-color, #c62828);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(198,40,40,0.3));
}

/* Alpin */
.dpc-event--category-hsv-alpin .dpc-category-badge,
.dpc-event[data-category-alias="hsv-alpin"] .dpc-category-badge {
  background: var(--sektion-color, #2e7d32);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(46,125,50,0.3));
}

/* Dart (hell -> dunkle Schrift) */
.dpc-event--category-hsv-dart .dpc-category-badge,
.dpc-event[data-category-alias="hsv-dart"] .dpc-category-badge {
  background: var(--sektion-color, #f9a825);
  color: #111;
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(249,168,37,0.3));
}

/* Fußball */
.dpc-event--category-hsv-fussball .dpc-category-badge,
.dpc-event[data-category-alias="hsv-fussball"] .dpc-category-badge {
  background: var(--sektion-color, #1565c0);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(21,101,192,0.3));
}

/* Gymnastik */
.dpc-event--category-hsv-gymnastik .dpc-category-badge,
.dpc-event[data-category-alias="hsv-gymnastik"] .dpc-category-badge {
  background: var(--sektion-color, #d81b60);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(216,27,96,0.3));
}

/* Hundesport */
.dpc-event--category-hsv-hundesport .dpc-category-badge,
.dpc-event[data-category-alias="hsv-hundesport"] .dpc-category-badge {
  background: var(--sektion-color, #5d4037);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(93,64,55,0.3));
}

/* Paddeln */
.dpc-event--category-hsv-paddeln .dpc-category-badge,
.dpc-event[data-category-alias="hsv-paddeln"] .dpc-category-badge {
  background: var(--sektion-color, #00897b);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(0,137,123,0.3));
}

/* Tauchen */
.dpc-event--category-hsv-tauchen .dpc-category-badge,
.dpc-event[data-category-alias="hsv-tauchen"] .dpc-category-badge {
  background: var(--sektion-color, #00acc1);
  box-shadow: 0 0 6px var(--sektion-shadow, rgba(0,172,193,0.3));
}

/* ========= luftigeres Upcoming Event ========= */
.mod-upcoming-home .dpc-event-list .dpc-event {
  border-radius: 12px; border: 1px solid #eee; padding: .8rem 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,.04);
}

/* ========= Sektionen-Hinterlegung im Monatskalender ========= */
.sektion-fischen .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(30,136,229,0.08)); }
.sektion-bogenschiessen .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(142,36,170,0.08)); }
.sektion-schiessen .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(198,40,40,0.08)); }
.sektion-alpin .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(46,125,50,0.08)); }
.sektion-dart .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(249,168,37,0.08)); color:#111; }
.sektion-fussball .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(21,101,192,0.08)); }
.sektion-gymnastik .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(216,27,96,0.08)); }
.sektion-hundesport .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(93,64,55,0.08)); }
.sektion-paddeln .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(0,137,123,0.08)); }
.sektion-tauchen .fc .fc-daygrid-event { background: var(--sektion-bg, rgba(0,172,193,0.08)); }

/* --- Dark Mode (optional) --- */
html.dark .dpc-event-list .dpc-event { background:#111; border-color:#222; }
html.dark .dpc-event .dpc-title a { color:#fff; }
html.dark .fc-theme-standard .fc-scrollgrid { border-color:#2a2a2a; }
html.dark .fc .fc-daygrid-day-number { color:#eee; }
html.dark .fc .fc-daygrid-event { box-shadow:none; }