/* =========================================================
   TextilArt Academy – Custom CSS (Child Theme)
   ========================================================= */

/* =========================
   0) Farb-Variablen (optional)
   ========================= */
:root{
  --ta-accent: #FF6600;   /* Button 1 */
  --ta-gold:   #F3B70D;   /* Special */
  --ta-blue:   #146CB4;   /* Header 2 */
  --ta-green:  #82A309;   /* Header 1 */
  --ta-text:   #606060;   /* Text */
  --ta-bg:     #F8F5F2;   /* Background */

  /* Quiz/LD-Unterbereich */
  --ldq-primary: #c4161c;
  --ldq-primary-dark: #9e1116;
  --ldq-ok: #1a7f37;
  --ldq-bad: #b42318;
  --ldq-border: #e6e6e6;
  --ldq-card-bg:#fff;
  --ldq-muted:#5f6b7a;
  --ldq-radius: 14px;
  --ldq-gap: 16px;
}

/* =========================
   1) Baselines / Utilities
   ========================= */

/* Anker-Offset für Sprungziele im Inhalt */
.entry-content [id]{ scroll-margin-top:120px; }
@media (max-width:640px){
  .entry-content [id]{ scroll-margin-top:90px; }
}

/* Vertical rhythm in Kadence-Spalten:
   margin der Grundblöcke neutralisieren, damit nur der Spalten-Gap wirkt */
.entry-content .kt-inside-inner-col :where(h2,h3,h4,p,ul,ol,figure){
  margin-block: 0;
}

/* Doppelte Kursliste vermeiden, falls zweimal gerendert */
.single-sfwd-courses .entry-content .ld-course-content + .ld-course-content {
  display: none;
}

/* Link-/Fokus-Defaults */
a { text-decoration: none; }
a:focus-visible { outline: 2px dashed var(--ta-blue); outline-offset: 2px; }

/* =========================
   2) Typografie
   ========================= */
h1,h2,h3 { letter-spacing: .02em; }
.entry-content h3{
  font-size:1.15rem; line-height:1.4; margin-top:1.6em; color:var(--global-palette9,#222);
}

/* =========================
   3) Global Buttons (Theme-weit)
   ========================= */
.wp-block-button__link,
button, .button, input[type=submit] {
  border-radius: 12px;
  font-weight: 600;
  min-height: 44px;
}

/* Gutenberg Buttons – Primär */
.wp-block-button__link,
.wp-element-button{
  display:inline-block;
  text-decoration:none;
  text-align:center;
  padding:.75em 1.4em;
  border-radius:9999px;
  font-weight:700;
  transition:all .2s ease;
  background:var(--global-palette1, var(--ta-blue));
  color:#fff;
  border:none;
}
.wp-block-button__link:hover,
.wp-element-button:hover{
  background:var(--global-palette2, #00983a);
  color:#fff;
}

/* Outline-Variante */
.is-style-outline > .wp-block-button__link,
.wp-element-button.is-link{
  background:transparent;
  border:2px solid var(--global-palette1, var(--ta-blue));
  color:var(--global-palette1, var(--ta-blue));
}
.is-style-outline > .wp-block-button__link:hover,
.wp-element-button.is-link:hover{
  background:var(--global-palette1, var(--ta-blue));
  color:#fff;
}

/* =========================
   4) Medien im Inhalt
   ========================= */
.entry-content .wp-block-image img,
.entry-content .kadence-advanced-image img{
  max-width: 680px; display:block; margin-inline:auto;
}
.entry-content figure.wp-block-image figcaption{
  text-align:center; font-size:.95rem; color:#666; margin-top:.4rem;
}

/* =========================
   5) Komponenten – EU Disclaimer
   ========================= */
.eu-disclaimer{
  background:#f5f5f5;
  padding:1.2em 1.4em;
  margin:1.5em 0;
  border-left:4px solid #ccc;
  font-size:0.9em;
  line-height:1.6;
  color:#444;
}
.eu-disclaimer a{ text-decoration:underline; }
.eu-disclaimer__head{
  display:flex; gap:16px; align-items:center; margin-bottom:0.8em;
}
.eu-disclaimer__logo{ height:42px; width:auto; display:block; }
.eu-disclaimer__body p{ margin:0.4em 0; }

@media (max-width:640px){
  .eu-disclaimer{ font-size:0.85em; padding:1em; }
  .eu-disclaimer__logo{ height:36px; }
  .eu-disclaimer__head{ gap:12px; flex-wrap:wrap; }
}

.eu-disclaimer{ margin-top: 1.25rem; }
.single-sfwd-courses .eu-disclaimer{ /* ggf. seiten-spezifische Styles hier */ }

/* =========================
   6) LearnDash – Buttons & Navigations
   ========================= */

/* Primäre LD-/Quiz-Buttons */
body .learndash-wrapper .ld-button,
body .wpProQuiz_content .wpProQuiz_button {
  background: var(--ta-accent) !important;
  color: #fff !important;
  border: 2px solid transparent !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  padding: 12px 18px !important;
  min-height: 44px !important;
  cursor: pointer !important;
  transition: background-color .15s, color .15s, box-shadow .15s !important;
}
body .learndash-wrapper .ld-button:hover,
body .wpProQuiz_content .wpProQuiz_button:hover {
  background: #cc5200 !important;
  color: #fff !important;
}

/* Fokus-Styles */
body .learndash-wrapper .ld-button:focus,
body .wpProQuiz_content .wpProQuiz_button:focus,
body .learndash-wrapper .ld-expand-button:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px var(--ta-gold),
              0 0 0 5px var(--ta-blue) !important;
}

/* Sekundäre/Transparente Buttons */
body .learndash-wrapper .ld-expand-button,
body .learndash-wrapper .ld-item-list-actions .ld-button.ld-button-transparent,
body .learndash-wrapper a.ld-secondary-color {
  background: transparent !important;
  color: var(--ta-blue) !important;
  border: 2px solid var(--ta-blue) !important;
  border-radius: 12px !important;
  padding: 10px 16px !important;
  min-height: 44px !important;
}
body .learndash-wrapper .ld-expand-button:hover,
body .learndash-wrapper .ld-item-list-actions .ld-button.ld-button-transparent:hover,
body .learndash-wrapper a.ld-secondary-color:hover {
  background: var(--ta-blue) !important;
  color: #fff !important;
}

/* Erfolgs-/Statuschips */
body .learndash-wrapper .ld-status-complete,
body .learndash-wrapper .ld-status-complete .ld-status-icon {
  background: var(--ta-green) !important;
  color: #fff !important;
}

/* Prev/Next-Navigation */
.ld-nav{
  display:flex; flex-wrap:wrap; gap:.6rem;
  max-width: 760px; margin: 2rem auto 1rem auto;
}
@media (min-width: 768px){
  .ld-nav{ justify-content: space-between; }
}
.ld-nav a{
  display:inline-block; text-decoration:none; text-align:center;
  background: var(--global-palette1, var(--ta-blue));
  color:#fff; border:none; border-radius:9999px; font-weight:700;
  padding:.7rem 1.1rem; transition: all .2s ease;
}
.ld-nav a:hover,
.ld-nav a:focus{
  background: var(--global-palette2, #00983a);
  color:#fff; outline: 3px solid transparent;
}
.ld-nav a + a{ margin-left:.5rem; }

/* Back-Link unter der Navi */
.ld-back{
  max-width: 760px; margin: .25rem auto 0 auto; text-align: left;
}
.ld-back a{ text-decoration: underline; text-underline-offset: .16em; }
@media (max-width:640px){
  .ld-nav{ justify-content:center; }
  .ld-nav a{ width:100%; max-width:420px; }
  .ld-back{ text-align:center; opacity:.85; }
  .ld-back a{ color:inherit; }
  .ld-back a:hover{ color:var(--global-palette1,var(--ta-blue)); }
}

/* Kurs-/Lektions-Navigation als Liste */
.learndash-wrapper .ld-course-navigation{
  max-width: 760px; margin: 2rem auto; padding: 16px 18px;
  background:#fff; border:1px solid rgba(0,0,0,.08); border-radius:14px;
}
.learndash-wrapper .ld-course-navigation .ld-item-list{
  display:grid; grid-template-columns: 1fr; gap:.25rem;
}
/* reparierte Zeile (vorher abgebrochen) */
.learndash-wrapper .ld-course-navigation .ld-item-list .ld-item-list-item{
  display:flex; align-items:center; justify-content:space-between; gap:.5rem;
  padding:.5rem .75rem; border-radius:10px;
}

/* =========================
   7) LearnDash Quiz – Starter Style
   ========================= */
.ld-quiz .wpProQuiz_content{
  max-width: 980px; margin: 0 auto;
}
.ld-quiz .wpProQuiz_question{
  background: var(--ldq-card-bg);
  border: 1px solid var(--ldq-border);
  border-radius: var(--ldq-radius);
  padding: 1.2rem 1.4rem;
  box-shadow: 0 2px 10px rgba(0,0,0,.04);
}
.ld-quiz .wpProQuiz_questionList > li{
  border: 1px solid var(--ldq-border);
  border-radius: 12px;
  padding: .85rem 1rem;
  margin: .55rem 0;
  background: #fff;
  transition: border-color .15s, box-shadow .15s, background .15s;
  position: relative;
}
.ld-quiz .wpProQuiz_questionList > li:hover{
  border-color: var(--ldq-primary);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--ldq-primary) 25%, transparent);
}
.ld-quiz .wpProQuiz_questionList input[type="radio"],
.ld-quiz .wpProQuiz_questionList input[type="checkbox"]{
  transform: scale(1.15);
  margin-right: .6rem;
}
/* Fokus sichtbarer (Tastatur) */
.ld-quiz .wpProQuiz_questionList > li:has(input:focus-visible){
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--ldq-primary) 35%, transparent);
}
/* Quiz-Buttons */
.ld-quiz .wpProQuiz_button,
.ld-quiz .wpProQuiz_button2,
.ld-quiz .ld-button{
  background: var(--ldq-primary);
  color: #fff !important;
  border: none;
  border-radius: 9999px;
  padding: .78rem 1.2rem;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  box-shadow: 0 1px 0 rgba(0,0,0,.06);
}
.ld-quiz .wpProQuiz_button:hover,
.ld-quiz .wpProQuiz_button2:hover,
.ld-quiz .ld-button:hover{
  background: var(--ldq-primary-dark);
}
/* Ergebnis-Seiten */
.ld-quiz .wpProQuiz_results,
.ld-quiz .wpProQuiz_resultTable{
  background: var(--ldq-card-bg);
  border: 1px solid var(--ldq-border);
  border-radius: var(--ldq-radius);
  padding: 1.2rem 1.4rem;
}
.ld-quiz .wpProQuiz_resultTable td,
.ld-quiz .wpProQuiz_resultTable th{
  padding: .6rem .75rem;
}
/* Feedback korrekt/falsch */
.ld-quiz .wpProQuiz_answerCorrect,
.ld-quiz .is-correct{
  background: #eef8f2;
  border-color: color-mix(in srgb, var(--ldq-ok) 40%, #fff);
}
.ld-quiz .wpProQuiz_answerIncorrect,
.ld-quiz .is-incorrect{
  background: #fff4f3;
  border-color: color-mix(in srgb, var(--ldq-bad) 40%, #fff);
}
/* Breadcrumb/Topbar (falls vorhanden) */
.ld-quiz .ld-breadcrumbs{
  background: #f8fafc;
  border: 1px solid var(--ldq-border);
  border-radius: 10px;
  padding: .5rem .75rem;
}
/* Hinweis-Buttons / kleine Badges */
.ld-quiz .wpProQuiz_tipp{
  background: #fffdf2;
  border: 1px solid #f1e3b0;
  border-radius: 10px;
  padding: .9rem 1rem;
  color: #6a5e2e;
}
/* Paginierung */
.ld-quiz .wpProQuiz_pagination{ margin-top: var(--ldq-gap); }
.ld-quiz .wpProQuiz_page{
  display: inline-flex; min-width: 34px; height: 34px;
  align-items: center; justify-content: center;
  border-radius: 9999px; border: 1px solid var(--ldq-border);
  margin-right: .4rem; background: #fff;
}
.ld-quiz .wpProQuiz_page.wpProQuiz_pageCurrent{
  background: var(--ldq-primary); color: #fff; border-color: var(--ldq-primary);
}

/* =========================
   8) Media Queries (global)
   ========================= */
@media (max-width: 782px){
  /* mobile Tweaks nach Bedarf */
}

/* =========================
   9) Final Overrides (nur bei Bedarf)
   ========================= */
/* nur nutzen, wenn etwas hartnäckig drüberbügelt */
/*
.learndash-wrapper .ld-button,
.wpProQuiz_content .wpProQuiz_button {
  background: var(--ta-accent) !important;
  color: #fff !important;
  border-color: transparent !important;
}
.learndash-wrapper .ld-button:hover,
.wpProQuiz_content .wpProQuiz_button:hover {
  background: #cc5200 !important;
}
*/
/* ===== LD Quiz Button – Hard Override (Start/Weiter/Absenden) ===== */
html body .ld-quiz .wpProQuiz_content .wpProQuiz_button,
html body .ld-quiz .wpProQuiz_content .wpProQuiz_button:hover,
html body .ld-quiz .wpProQuiz_content .wpProQuiz_button:focus,
html body .ld-quiz .wpProQuiz_content .wpProQuiz_button:active {
  background: #FF6600 !important;
  color: #fff !important;
  border: 2px solid transparent !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  padding: 12px 18px !important;
  min-height: 44px !important;
}

html body .ld-quiz .wpProQuiz_content .wpProQuiz_button:hover,
html body .ld-quiz .wpProQuiz_content .wpProQuiz_button:active {
  background: #cc5200 !important;
}

/* (falls LD eine zweite Klasse nutzt) */
html body .ld-quiz .wpProQuiz_content .wpProQuiz_button2 {
  background: #FF6600 !important;
  color: #fff !important;
  border: 2px solid transparent !important;
  border-radius: 12px !important;
}

/* optional: Breadcrumbs im Quiz nicht rot anzeigen */
html body .ld-quiz .ld-breadcrumbs,
html body .ld-quiz .ld-breadcrumbs a {
  color: #fff !important;          /* Schrift hell */
}
html body .ld-quiz .ld-breadcrumbs {
  background: #146CB4 !important;  /* dein Blau */
  border-color: transparent !important;
  border-radius: 12px !important;
}

