/* ============================================================
   OTTA – Cookie-Consent & blockierte Drittinhalte
   Nutzt die Design-Tokens aus der Haupt-Stylesheet-Datei.
   Ablage: public/css/consent.css
   ============================================================ */

/* ---------- Banner ---------- */
.otta-cc{
  position:fixed;
  left:0; right:0; bottom:0;
  z-index:300;
  padding:18px;
  display:none;
}
.otta-cc.is-open{ display:block; }

.otta-cc__box{
  max-width:var(--maxw,1180px);
  margin:0 auto;
  background:var(--card,#FDFAF1);
  border:1px solid var(--line,#E4DBC5);
  border-top:3px solid var(--sage,#6E8360);
  border-radius:var(--radius,22px);
  box-shadow:var(--shadow-lg,0 30px 70px rgba(46,58,40,.2));
  padding:24px 28px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:18px 28px;
  font-family:"DM Sans",system-ui,sans-serif;
}

.otta-cc__txt{
  flex:1 1 320px;
  color:var(--ink-soft,#5C5A52);
  font-size:.94rem;
  line-height:1.55;
}
.otta-cc__txt b{
  display:block;
  margin-bottom:5px;
  font-family:"Fraunces",Georgia,serif;
  font-size:1.12rem;
  font-weight:600;
  color:var(--ink,#2A2926);
}
.otta-cc__txt a{
  color:var(--sage-deep,#54684A);
  text-decoration:underline;
  text-underline-offset:3px;
}

.otta-cc__btns{ display:flex; gap:12px; flex-wrap:wrap; flex:none; }

/* Beide Buttons bewusst gleich stark – Vorgabe der Aufsichtsbehoerden */
.otta-cc__btn{
  font-family:"DM Sans",system-ui,sans-serif;
  font-weight:600;
  font-size:.95rem;
  padding:12px 24px;
  border-radius:999px;
  border:2px solid var(--forest,#2E3A28);
  cursor:pointer;
  transition:background .25s var(--ease,ease), color .25s var(--ease,ease),
             transform .25s var(--ease,ease), box-shadow .25s var(--ease,ease);
}
.otta-cc__btn--no{ background:transparent; color:var(--forest,#2E3A28); }
.otta-cc__btn--yes{ background:var(--forest,#2E3A28); color:#fff; }
.otta-cc__btn--no:hover,
.otta-cc__btn--yes:hover{
  background:var(--sage-deep,#54684A);
  border-color:var(--sage-deep,#54684A);
  color:#fff;
  transform:translateY(-2px);
  box-shadow:var(--shadow-md,0 18px 40px rgba(46,58,40,.14));
}
.otta-cc__btn:focus-visible{ outline:3px solid var(--amber,#E3A72C); outline-offset:3px; }

/* Textlink-Button im Footer (Widerruf) */
.otta-cc__link{
  background:none; border:0; padding:0;
  font:inherit; color:inherit;
  cursor:pointer; text-decoration:underline;
}
.otta-cc__link:hover{ color:#fff; }

/* ---------- Blockierte Einbettungen ---------- */
.otta-embed{ position:relative; }

/* Optik, solange nichts geladen ist */
.otta-embed:not(.otta-embed--on){
  display:grid;
  place-items:center;
  padding:40px;
  text-align:center;
  background:linear-gradient(150deg,#DCE4D0,#B7C79F);
  color:var(--forest,#2E3A28);
}
.otta-embed__load{
  display:flex; flex-direction:column; align-items:center;
  gap:12px;
}
.otta-embed__load b{
  font-family:"Fraunces",Georgia,serif;
  font-size:1.3rem;
}
.otta-embed--on .otta-embed__load{ display:none; }

/* Ladebutton verstecken, solange keine Embed-URL hinterlegt ist */
.otta-embed[data-otta-src=""] [data-otta-yes]{ display:none; }

/* Ladebutton verstecken, solange keine Embed-URL hinterlegt ist */
.otta-embed[data-otta-src=""] [data-otta-yes]{ display:none; }

@media (max-width:720px){
  .otta-cc{ padding:12px; }
  .otta-cc__box{ padding:20px; }
  .otta-cc__btns{ width:100%; }
  .otta-cc__btn{ flex:1 1 auto; }
}
@media (prefers-reduced-motion:reduce){
  .otta-cc__btn{ transition:none; }
}
