/* =========================================================
   FLIPPER x KUTEGO – LEAN CSS (CLEAN, STABIL)
   - Desktop Tabelle: schlank + CI
   - Mobile Cards: neue Struktur + alter Look
   - Buttontext bleibt ORIGINAL ("Buchen")
   - Warteliste: #eb6308
   - Kalender/Termindetails-Spalte: EIN (Desktop)
   - Mobile: Preis-Zusatztexte per Kurs-ID (Whitelist)
   ========================================================= */

:root{
  --flipper-blue:#165297;
  --flipper-blue-hover:#1d6dc9;

  --text:#000;
  --muted:#6b7280;
  --muted2:#9ca3af;

  --success:#38a169;
  --danger:#e53e3e;
  --warning:#f0ad4e;

  --radius:16px;
  --pill:999px;

  --waitlist:#eb6308;
  --waitlist-hover:#c95606;
}

/* =========================================================
   1) DESKTOP TABLE – Controls aus (lean)
   ========================================================= */

.course-module ul.nav.nav-tabs,
.tab-style-1 .nav.nav-tabs,
[id^="datatable_courses"][id$="_wrapper"] .dataTables_filter,
[id^="datatable_courses"][id$="_wrapper"] .dataTables_length,
[id^="datatable_courses"] thead tr.filter,
.visible-xs.mobile-filter,
.visible-xs.mobile-filter + .btn-group,
.visible-xs.mobile-filter + .btn-group + .btn-group{
  display:none !important;
}

/* Sort Icons weg */
[id^="datatable_courses"] thead th.sorting::before,
[id^="datatable_courses"] thead th.sorting::after,
[id^="datatable_courses"] thead th.sorting_asc::before,
[id^="datatable_courses"] thead th.sorting_asc::after,
[id^="datatable_courses"] thead th.sorting_desc::before,
[id^="datatable_courses"] thead th.sorting_desc::after{
  display:none !important;
  content:none !important;
}

/* Abstand oben weg */
[id^="datatable_courses"][id$="_wrapper"],
.course-module .tab-content,
.tab-style-1 .nav-tabs + .tab-content,
.course-module .nav-tabs + .tab-content{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* Fußnoten/Sternchen weg */
[id^="datatable_courses"] sup,
[id^="datatable_courses"][id$="_wrapper"] ~ small,
.course-module small,
[id^="datatable_courses"] ~ small.tax-hint,
.course-module small.tax-hint{
  display:none !important;
}

/* ✅ Termindetails/Kalender-Spalte bleibt EIN -> KEINE .details display:none Regeln */


/* =========================================================
   2) DESKTOP TABLE – Preis & Buttons
   ========================================================= */

[id^="d_price_"]{
  font-size:1.5rem !important;
  font-weight:800 !important;
  color:var(--text) !important;
}
[id^="d_price_"] > span::after{
  content:" \20AC" !important;
}

/* Hauptbutton letzte Spalte */
[id^="datatable_courses"] tbody td:last-child button,
[id^="datatable_courses"] tbody td:last-child .btn{
  display:inline-block !important;
  padding:.75rem 1.5rem !important;
  font-size:1.1rem !important;
  font-weight:800 !important;
  color:#fff !important;
  background-color:var(--flipper-blue) !important;
  border:0 !important;
  border-radius:var(--radius) !important;
  background-image:none !important;
}
[id^="datatable_courses"] tbody td:last-child button:hover,
[id^="datatable_courses"] tbody td:last-child .btn:hover{
  background-color:var(--flipper-blue-hover) !important;
}

/* Warteliste Desktop */
[id^="datatable_courses"] tbody td:last-child button.waiting-list,
[id^="datatable_courses"] tbody td:last-child .btn.waiting-list{
  background-color:var(--waitlist) !important;
}
[id^="datatable_courses"] tbody td:last-child button.waiting-list:hover,
[id^="datatable_courses"] tbody td:last-child .btn.waiting-list:hover{
  background-color:var(--waitlist-hover) !important;
}

/* Plätze Icons rund */
[id^="datatable_courses"] tbody .btn-success,
[id^="datatable_courses"] tbody .btn-danger,
[id^="datatable_courses"] tbody td .btn-warning.btn-sm{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:2.2rem !important;
  height:2.2rem !important;
  padding:0 !important;
  border-radius:50% !important;
  border:0 !important;
  color:#fff !important;
  font-size:1.2rem !important;
}
[id^="datatable_courses"] tbody .btn-success{ background:var(--success) !important; }
[id^="datatable_courses"] tbody .btn-danger{ background:var(--danger) !important; }
[id^="datatable_courses"] tbody td .btn-warning.btn-sm{ background:var(--warning) !important; }
[id^="datatable_courses"] tbody td .btn-warning.btn-sm .fa-warning{ color:#fff !important; }

/* Ladda-Text immer weiß */
.book-btn .ladda-label{ color:#fff !important; }


/* =========================================================
   3) MOBILE – Cards (NEUE STRUKTUR + alter Look)
   ========================================================= */
@media (max-width: 767px){

  /* Desktop Tabelle aus, Cards an */
  .courses-table.hidden-xs{ display:none !important; }

  /* Card */
  div[id^="mobile_courses"] .coursedate.pricing{
    background:#fff !important;
    border-radius:16px !important;
    box-shadow:0 10px 30px rgba(0,0,0,.06) !important;
    margin:16px 0 !important;
    padding:16px !important;
    border:1px solid rgba(0,0,0,.06) !important;

    display:flex !important;
    flex-direction:column !important;
  }

  /* Reihenfolge: Content -> Head -> Footer */
  div[id^="mobile_courses"] .coursedate.pricing .pricing-content{ order:1 !important; }
  div[id^="mobile_courses"] .coursedate.pricing .pricing-head{    order:2 !important; }
  div[id^="mobile_courses"] .coursedate.pricing .pricing-footer{  order:3 !important; }

  /* ---------- CONTENT: Standort + Zeit groß ---------- */
  div[id^="mobile_courses"] .coursedate .pricing-content{
    margin:0 !important;
    padding:0 !important;
  }

  div[id^="mobile_courses"] .coursedate .pricing-content li{
    text-align:center !important;
    font-size:15px !important;
    line-height:1.35 !important;
    color:#374151 !important;
    border:0 !important;
    margin:6px 0 !important;
    padding:0 !important;
  }

  /* Standort */
  div[id^="mobile_courses"] .coursedate .pricing-content li:nth-child(1){
    font-size:25px !important;
    font-weight:900 !important;
    color:#111 !important;
    letter-spacing:-0.3px !important;
    margin-top:2px !important;
    margin-bottom:6px !important;
  }

  /* Standort-Icon (Pin) weg */
  div[id^="mobile_courses"] .coursedate .pricing-content li:nth-child(1) i{
    display:none !important;
  }

  /* Tag/Uhrzeit */
  div[id^="mobile_courses"] .coursedate .pricing-content li:nth-child(2){
    font-size:18px !important;
    font-weight:800 !important;
    color:#1f2937 !important;
    margin-bottom:10px !important;
  }

  /* Kalender-Icon links beim Termin AUS */
  div[id^="mobile_courses"] .coursedate .pricing-content li:nth-child(2) i{
    display:none !important;
  }

  /* Termindetails Chip */
  div[id^="mobile_courses"] .coursedate .pricing-content li a.view-details{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:8px 12px !important;          /* kompakter */
    border-radius:999px !important;
    border:1px solid rgba(22,82,151,.20) !important;
    color:var(--flipper-blue) !important;
    text-decoration:none !important;
    font-weight:800 !important;
    background:rgba(22,82,151,.06) !important;
    margin-top:8px !important;
    margin-bottom:2px !important;         /* weniger Abstand nach unten */
  }

  /* Lupe weg */
  div[id^="mobile_courses"] .coursedate .pricing-content li .fa-search{
    display:none !important;
  }

  /* ---------- HEAD: Abo-Button ausblenden (nur Mobile) ---------- */
  /* (Das ist der "FLIPPER Monatsabo 89" Button: .termBtn / .termTxt_...) */
  div[id^="mobile_courses"] .coursedate .pricing-head .termBtn,
  div[id^="mobile_courses"] .coursedate .pricing-head .termTxt_{
    display:none !important;
  }
  div[id^="mobile_courses"] .coursedate .pricing-head .margin-top-10{
    display:none !important;
  }

  /* ---------- Preisblock: stabil (Mobile) ---------- */
  div[id^="mobile_courses"] [id^="m_price_"]{
    text-align:center !important;
    margin:10px 0 0 !important;
    line-height:1.2 !important;
  }

  /* alles ausblenden damit "-, EUR" etc. nicht stören */
  div[id^="mobile_courses"] [id^="m_price_"] *{
    display:none !important;
  }

  /* nur Zahl wieder anzeigen */
  div[id^="mobile_courses"] [id^="m_price_"] > span:first-of-type{
    display:inline-block !important;
    font-size:20px !important;
    font-weight:900 !important;
    color:var(--muted) !important;
    line-height:1.2 !important;
  }

  /* DEFAULT: nur € (keine Zusätze) */
  div[id^="mobile_courses"] [id^="m_price_"] > span:first-of-type::after{
    content:"\00a0€" !important;
    font-weight:800 !important;
    color:var(--muted2) !important;
  }
  div[id^="mobile_courses"] [id^="m_price_"]::after{
    content:"" !important;
    display:none !important;
  }

  /* WHITELIST: NUR Kurs 27976 bekommt Zusatz */
  #mobile_courses27976 [id^="m_price_"] > span:first-of-type::after{
    content:"\00a0€\00a0pro 4 Wochen" !important;
  }
  #mobile_courses27976 [id^="m_price_"]::after{
    content:"monatlich kündbar" !important;
    display:block !important;
    margin-top:6px !important;
    font-size:12px !important;
    font-weight:700 !important;
    color:var(--muted2) !important;
    text-align:center !important;
  }

  /* BLACKLIST: 27982 & 27984 garantiert ohne Zusätze */
  #mobile_courses27982 [id^="m_price_"] > span:first-of-type::after,
  #mobile_courses27984 [id^="m_price_"] > span:first-of-type::after{
    content:"\00a0€" !important;
  }
  #mobile_courses27982 [id^="m_price_"]::after,
  #mobile_courses27984 [id^="m_price_"]::after{
    content:"" !important;
    display:none !important;
  }

  /* ---------- FOOTER: Button dick + 3D ---------- */
  div[id^="mobile_courses"] .coursedate .pricing-footer{
    margin-top:12px !important;
    padding-top:0 !important;
    border-top:none !important;
  }

  div[id^="mobile_courses"] .coursedate .pricing-footer .btn,
  div[id^="mobile_courses"] .visible-xs .book-btn,
  div[id^="mobile_courses"] .visible-xs button.book-btn{
    display:block !important;
    width:100% !important;
    padding:16px 16px !important;
    border-radius:999px !important;
    font-size:14px !important;
    font-weight:900 !important;
    letter-spacing:.2px !important;
    background:var(--flipper-blue) !important;
    border:0 !important;
    color:#fff !important;
    background-image:none !important;
    box-shadow:
      0 14px 26px rgba(22,82,151,.25),
      inset 0 1px 0 rgba(255,255,255,.22) !important;
  }
  div[id^="mobile_courses"] .coursedate .pricing-footer .btn:hover,
  div[id^="mobile_courses"] .visible-xs .book-btn:hover{
    background:var(--flipper-blue-hover) !important;
  }

  /* Warteliste Button Orange */
  div[id^="mobile_courses"] .visible-xs .book-btn.waiting-list,
  div[id^="mobile_courses"] .visible-xs button.book-btn.waiting-list,
  div[id^="mobile_courses"] .coursedate .pricing-footer .btn.waiting-list{
    background:var(--waitlist) !important;
    box-shadow:
      0 14px 26px rgba(235,99,8,.22),
      inset 0 1px 0 rgba(255,255,255,.18) !important;
  }
  div[id^="mobile_courses"] .visible-xs .book-btn.waiting-list:hover,
  div[id^="mobile_courses"] .visible-xs button.book-btn.waiting-list:hover,
  div[id^="mobile_courses"] .coursedate .pricing-footer .btn.waiting-list:hover{
    background:var(--waitlist-hover) !important;
  }
}

/* =========================================================
   4) KURSÜBERSICHT (courses-index im iFrame) – CI
   ========================================================= */

.courses-index img,
.courses-index .row img{
  border-radius:20px !important;
}

.courses-index .row{
  border:1px solid var(--flipper-blue) !important;
  border-radius:24px !important;
  padding:2rem 1rem !important;
  background:#fff !important;
  box-shadow:0 10px 30px rgba(0,0,0,.05) !important;
}

.courses-index .row h3,
.courses-index .row h3 a{
  color:var(--flipper-blue) !important;
  font-weight:800 !important;
}

.courses-index h1,
.courses-index h2{
  color:#000 !important;
  font-weight:800 !important;
}

.courses-index a.btn,
.courses-index .btn{
  background-color:var(--flipper-blue) !important;
  border-color:var(--flipper-blue) !important;
  color:#fff !important;
  border:none !important;
  border-radius:var(--pill) !important;
  padding:.75rem 1.5rem !important;
  font-weight:700 !important;
  box-shadow:none !important;
  background-image:none !important;
}
.courses-index a.btn:hover,
.courses-index .btn:hover{
  background-color:var(--flipper-blue-hover) !important;
  border-color:var(--flipper-blue-hover) !important;
}

/* Mobile: Termine & Infos Button links */
@media (max-width: 767px){
  .courses-index .row .btn,
  .courses-index .row a.btn{
    float:left !important;
  }
}

/* ==================================================
   FIX: Mobile – "EUR" / "-, EUR" komplett entfernen
   ================================================== */
@media (max-width: 767px){

  /* Container auf 0 -> killt "-, EUR" Textnodes */
  div[id^="mobile_courses"] [id^="m_price_"]{
    font-size:0 !important;
  }

  /* nur der Preis-Span soll wieder sichtbar sein */
  div[id^="mobile_courses"] [id^="m_price_"] > span:first-of-type{
    font-size:20px !important;
    display:inline-block !important;
  }

  /* ALLES andere (z.B. Text "-, EUR", Hints, Tage) weg */
  div[id^="mobile_courses"] [id^="m_price_"] .hints,
  div[id^="mobile_courses"] [id^="m_price_"] .days,
  div[id^="mobile_courses"] [id^="m_price_"] > span:not(:first-of-type){
    display:none !important;
  }
}



/* ==================================================
   MOBILE: Nur Anzeige-Texte steuern (Whitelist)
   - Standard: pro Monat + keine zweite Zeile
   - Nur bestimmte Kurs-IDs: alle 4 Wochen + monatlich kündbar
   ================================================== */
@media (max-width: 767px){

  /* DEFAULT für ALLE Kurse */
  div[id^="mobile_courses"] [id^="m_price_"] > span:first-of-type::after{
    content:"\00a0€\00a0pro Monat" !important;
  }
  div[id^="mobile_courses"] [id^="m_price_"]::after{
    content:"" !important;
    display:none !important;
  }

  /* WHITELIST: HIER soll "alle 4 Wochen" + "monatlich kündbar" rein */
  #mobile_courses27986 [id^="m_price_"] > span:first-of-type::after,
  #mobile_courses27985 [id^="m_price_"] > span:first-of-type::after,
  #mobile_courses27980 [id^="m_price_"] > span:first-of-type::after,
  #mobile_courses27979 [id^="m_price_"] > span:first-of-type::after{
    content:"\00a0€\00a0pro 4 Wochen" !important;
  }

  #mobile_courses27986 [id^="m_price_"]::after,
  #mobile_courses27985 [id^="m_price_"]::after,
  #mobile_courses27980 [id^="m_price_"]::after,
  #mobile_courses27979 [id^="m_price_"]::after{
    content:"monatlich kündbar" !important;
    display:block !important;
    margin-top:6px !important;
    font-size:12px !important;
    font-weight:700 !important;
    color:var(--muted2) !important;
    text-align:center !important;
  }
}

@media (max-width: 767px){

  /* Zweite Zeile darunter (grün) */
  #mobile_courses27982 [id^="m_price_"]::after,
  #mobile_courses27984 [id^="m_price_"]::after{
    content:"Bis zu 150€ von der Krankenkasse!" !important;
    display:block !important;
    margin-top:6px !important;
    font-size:12px !important;
    font-weight:800 !important;
    color: var(--success, #38a169) !important; /* ✅ grün */
    text-align:center !important;
  }
}

@media (max-width: 767px){
  #mobile_courses27982 [id^="m_price_"] > span:first-of-type::after{
    content:"\00a0€\00a0pro 12 Einheiten" !important;
    font-weight:800 !important;
    color:#9ca3af !important;
  }
}

@media (max-width: 767px){
  #mobile_courses27982 .pricing-content .text-warning i.fa,
  #mobile_courses27982 .pricing-content .text-warning i.fa-exclamation{
    display:none !important;
  }
}

@media (max-width: 767px){

  /* ✅ Status-Icons ausblenden (gelbes ! + grüner Haken) */
  #mobile_courses27982 .pricing-content li span i.fa,
  #mobile_courses27982 .pricing-content li span i.fa-exclamation,
  #mobile_courses27982 .pricing-content li span i.fa-check{
    display:none !important;
  }

}


@media (max-width: 767px){
  /* der Termin-Block bekommt 2 Zeilen sauber */
  div[id^="mobile_courses"] .coursedate .pricing-content li.kutego-split-datetime{
    text-align:center !important;
    margin:6px 0 10px !important;
    padding:0 !important;
    border:0 !important;
  }

  div[id^="mobile_courses"] .coursedate .pricing-content li.kutego-split-datetime .date-range{
    display:block !important;
    font-size:18px !important;
    font-weight:800 !important;
    color:#1f2937 !important;
    line-height:1.25 !important;
  }

  div[id^="mobile_courses"] .coursedate .pricing-content li.kutego-split-datetime .day-time{
    display:block !important;
    margin-top:4px !important;
    font-size:15px !important;
    font-weight:700 !important;
    color:#6b7280 !important;
    line-height:1.25 !important;
  }
}

#team_categories {
	display: none;
}