/* check24-embed.css — Slots fuer CHECK24-Whitelabel-Embeds (Slice 49).
   SLICE-C24b: token-rein — KEINE Farbliterale, KEINE font-size-/box-shadow-
   Literale mehr (Design-Budget-Kanon Slice 30: Seiten-CSS nutzt var()
   aus tokens.css, das auf jeder einbindenden Seite zuerst geladen wird
   und von design-tokens-Gate bewacht wird). Fruehere Hex-Fallbacks fuer
   nie existierende Farb- und Schatten-Tokens waren tot und sind auf
   echte Kanon-Tokens gemappt (Optik bleibt: helle Box, Linie, ein Schatten). */

[data-check24-embed] {
  min-height: 96px;                 /* CLS-Platzhalter, auch im Fallback */
  margin: 0 0 var(--sp-5);
}

.c24-embed__fallback {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-4);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
}

.c24-embed__fallback-text {
  margin: 0;
  flex: 1 1 240px;
  color: var(--text-muted);
  font-size: var(--fs-sm);
  line-height: 1.5;
}

.c24-embed__fallback-cta {
  flex: 0 0 auto;
  white-space: nowrap;
}

.c24-embed__noscript-cta {
  display: inline-block;
  min-height: 48px;
  padding: var(--sp-3) var(--sp-5);
  background: var(--bg-elevated);
  border: 1.5px solid var(--primary);
  border-radius: var(--radius-sm);
  color: var(--primary);
  font-size: var(--fs-base);
  text-decoration: none;
}

.c24-embed__noscript-cta:hover {
  background: var(--primary);
  color: var(--text-on-primary);
  text-decoration: none;
}

.c24-embed__frame-wrap {
  position: relative;
  width: 100%;
  border-radius: var(--radius-md);
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--bg-elevated);
}

.c24-embed__frame {
  display: block;
  width: 100%;
  border: 0;
}

@media (max-width: 640px) {
  .c24-embed__fallback { padding: var(--sp-4); }
}

/* SLICE-C24 — 2-Klick-Consent-Schicht (vor dem ersten Klick laedt nichts
   von files.check24.net). Der Button ist bewusst Secondary im Kanon
   (Outline/Primary-Optik via .btn-Klassen des Seiten-Systems), damit
   pro Viewport nur der Haupt-CTA accent-farben bleibt. */
.c24-embed__consent {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-3);
  padding: var(--sp-4);
  background: var(--bg-elevated);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  /* var(--shadow-md) bewusst statt --shadow-sm: liegt bereits im
     homepage.css-Bundle (Design-Budget: max 4 distinct shadows). */
  box-shadow: var(--shadow-md);
}

.c24-embed__consent-text {
  margin: 0;
  flex: 1 1 240px;
  color: var(--text-muted);
  font-size: var(--fs-sm);
  line-height: 1.5;
}

.c24-embed__consent-cta {
  flex: 0 0 auto;
  white-space: nowrap;
  min-height: 48px;              /* Daumen-freundliches Tap-Target */
  padding-left: var(--sp-4);
  padding-right: var(--sp-4);
}

/* Own the control styling: the homepage does not load legacy .btn rules. */
.c24-embed__consent .c24-embed__consent-cta,
.c24-embed__fallback .c24-embed__fallback-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  max-width: 100%;
  padding: var(--sp-3) var(--sp-5);
  border: 1px solid var(--primary);
  border-radius: var(--radius-sm);
  background: var(--primary);
  color: var(--text-on-primary);
  font-family: var(--font-body);
  font-size: var(--fs-base);
  font-weight: 700;
  line-height: 1.4;
  white-space: normal;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.c24-embed__consent .c24-embed__consent-cta:hover,
.c24-embed__fallback .c24-embed__fallback-cta:hover { background: var(--primary-dark); }
.c24-embed__consent-cta:focus-visible,
.c24-embed__fallback-cta:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.c24-embed__consent { padding: var(--sp-5); border-radius: var(--radius-sm); box-shadow: none; }
.c24-embed__consent-text { flex-basis: 100%; font-size: var(--fs-base); }

/* SLICE-C24 — Pflicht-Impressum-Hinweis (CHECK24.net Partnerprogramm,
   Portal-Text 1:1). Dezent unter dem Widget. */
.c24-embed__disclosure {
  margin: 0 0 var(--sp-5);
  padding: var(--sp-3) var(--sp-4);
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  font-size: var(--fs-sm);
  line-height: 1.5;
  color: var(--text-muted);
}

.c24-embed__disclosure p { margin: 0 0 8px; }
.c24-embed__disclosure p:last-child { margin-bottom: 0; }
.c24-embed__disclosure a {
  display: inline-flex; align-items: center; min-height: 44px;
  color: var(--primary);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

@media (max-width: 640px) {
  .c24-embed__consent { padding: var(--sp-4); }
  .c24-embed__disclosure { padding: var(--sp-3) var(--sp-4); }
}

.c24-embed__disclosure { padding: var(--sp-4) 0; border: 0; border-top: 1px solid var(--border); border-radius: 0; background: transparent; }