/* GO DTF: Design- und Barrierefreiheits-Fixes aus dem Audit vom 02.11.2026 */

:root {
  --gd-pink-text: #E0174A;   /* schon in .dtflp-bar als Button-Farbe im Einsatz: 4,78:1 auf Weiß */
  --gd-ink: #1b1c1f;
  --gd-muted: #5c6066;       /* schon im Lead-Text der Startseite: 6,33:1 auf Weiß */
  --gd-tap: 44px;
}

/* --- 1. Cookie-Dialog mobil: Entscheidungsbuttons ohne Scrollen erreichbar ----
   Text bleibt vollständig, er scrollt nur in einem eigenen Bereich.
   Rechtstext-Kürzung nicht enthalten; Darstellung bitte vom Anwalt absegnen lassen. */
@media (max-width: 767px) {
  .brlbs-cmpnt-dialog-entrance-description {
    max-height: 26dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-right: 6px;
  }
  .brlbs-cmpnt-dialog-box-header img { max-height: 36px; width: auto; }
  .brlbs-cmpnt-dialog-entrance-headline { font-size: 18px !important; line-height: 1.2 !important; }
}

/* --- 2. Kontrast: Pink nur in der AA-tauglichen Variante für Text und Buttons --- */
/* Bewusst eng: nicht Footer (dunkel), nicht .lp-link (steht auf dunklen Flächen), nicht Buttons */
.dtflp-tax-btn.is-on,
.dtflp-express-count,
.dtflp-subtitle--loop,
.shipping-costs-info a,
.single-post .entry-content p a,
.single-post .entry-content p a span,
.et_pb_tab_content p a { color: var(--gd-pink-text) !important; }

/* Inline-Style im Plugin setzt opacity:.75 und drückt den Kontrast weiter */
.dtflp-subtitle--loop { opacity: 1 !important; }

.dtflp-submit:not(.disabled):not(:disabled) { background-color: var(--gd-pink-text) !important; }
.brlbs-btn-accept-all { background-color: var(--gd-pink-text) !important; }

.woocommerce-result-count,
.woocommerce-breadcrumb,
.woocommerce-breadcrumb a,
.rank-math-breadcrumb,
.rank-math-breadcrumb a { color: var(--gd-muted) !important; }

/* Noch nicht berechneter Preis sieht sonst deaktiviert aus */
.dtflp-total-amount { color: var(--gd-ink) !important; }

/* Startseite "IN DEN WARENKORB" gegen Produktseite "In den Warenkorb" */
.dtflp-submit { text-transform: none !important; }

/* --- 3. Typo-Hierarchie: H1 immer größer als H2 ------------------------------ */
.single-post .entry-title,
.page-id-224097 main h1,
.post-type-archive-product .woocommerce-products-header__title {
  font-size: clamp(28px, 4.2vw, 40px) !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
}
.single-post .entry-content h2 { font-size: clamp(22px, 2.6vw, 28px) !important; line-height: 1.25 !important; }

/* --- 4. Ratgeber: Lesebreite, Zeilenhöhe, Bildhöhe --------------------------- */
.single-post .et_post_meta_wrapper,
.single-post .entry-content .et_pb_row { max-width: 760px !important; margin-inline: auto !important; }
/* Divi setzt .et_pb_text_0 auf width:90 % und rückt den Text gegen Bild und H1 ein */
.single-post .entry-content .et_pb_text { width: 100% !important; max-width: none !important; }
/* Initial-Block (.mein-initial) hat zusätzlich max-width:80 % */
.single-post .mein-initial .et_pb_blurb_content { max-width: 100% !important; margin-inline: 0 !important; }
.single-post .entry-content p,
.single-post .entry-content li { line-height: 1.65 !important; }
.single-post .et_post_meta_wrapper > img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 14px; }

/* --- 5. Mobil: Divi-80-%-Spalte auf die 20-px-Rand-Linie der Produktseite ziehen -- */
@media (max-width: 767px) {
  .single-post #main-content .container,
  .post-type-archive-product #main-content .container { width: calc(100% - 40px) !important; padding-top: 24px !important; }
  .page-id-224097 main .et_pb_row { width: calc(100% - 40px) !important; }
  .single-post .entry-content .et_pb_row { width: 100% !important; }
  .single-post .entry-content .et_pb_text { padding-inline: 0 !important; margin-inline: 0 !important; }
}

/* --- 6. FAQ: kompakter Block statt 1152-px-Balken ----------------------------- */
@media (min-width: 981px) {
  .page-id-224097 main .et_pb_row { max-width: 860px !important; }
}

/* --- 7. Shop: Preis vor Pflichtangaben, gleiche Kartenhöhen, 2 Spalten mobil --- */
.woocommerce ul.products { display: grid !important; gap: 28px 20px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.woocommerce ul.products::before,
.woocommerce ul.products::after { display: none !important; }
.woocommerce ul.products li.product {
  width: auto !important; margin: 0 !important; float: none !important; clear: none !important;
  display: flex !important; flex-direction: column;
}
.woocommerce ul.products li.product .woocommerce-loop-product__link { display: flex !important; flex-direction: column; flex: 1; }
.woocommerce ul.products li.product .price {
  margin-top: auto !important; font-size: 19px !important; font-weight: 800 !important; color: var(--gd-ink) !important;
}
.woocommerce ul.products li.product .price .amount { font-size: inherit !important; }
.woocommerce ul.products li.product .dtflp-per-meter { font-size: 13px; font-weight: 500; color: var(--gd-muted); }
/* Pflichtangaben bleiben sichtbar, nur nicht mehr fetter als der Preis */
.woocommerce ul.products li.product .wc-gzd-additional-info-loop {
  display: block; height: auto !important; min-height: 0 !important; line-height: 1.4 !important;
  margin: 4px 0 0 !important; padding: 0 !important;
  font-size: 13px !important; font-weight: 400 !important; color: var(--gd-muted) !important;
}
.gd-card-cta {
  display: flex; align-items: center; justify-content: center; min-height: var(--gd-tap); margin-top: 12px;
  border-radius: 999px; background: var(--gd-pink-text); color: #fff !important; font-weight: 700; font-size: 15px;
}
.gd-card-cta:hover, .gd-card-cta:focus-visible { background: #c9103f; }
@media (max-width: 980px) { .woocommerce ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .woocommerce ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 12px; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 15px !important; line-height: 1.25 !important; }
  .woocommerce ul.products li.product .price { font-size: 17px !important; }
}

/* --- 8. Tap-Ziele ------------------------------------------------------------- */
@media (pointer: coarse), (max-width: 980px) {
  .dtflp-tax-btn { min-height: 36px; padding-inline: 14px !important; }
  .dtflp-info { position: relative; }
  .dtflp-info::after { content: ""; position: absolute; inset: -12px; } /* Trefferfläche 44 px, Optik bleibt */
  .dtflp-express-opt input[type="checkbox"] { width: 22px; height: 22px; accent-color: var(--gd-pink-text); }
  .woocommerce-pagination a.page-numbers,
  .woocommerce-pagination span.page-numbers { min-width: var(--gd-tap); min-height: var(--gd-tap); display: inline-flex !important; align-items: center; justify-content: center; }
  .woocommerce-ordering select { min-height: var(--gd-tap); font-size: 16px !important; } /* 16 px verhindert iOS-Auto-Zoom */
  .et_pb_tabs_controls li a { min-height: var(--gd-tap); display: flex !important; align-items: center; }
  footer.et-l--footer .et_pb_text_inner p a { display: inline-block; padding-block: 10px; }
  footer.et-l--footer .et_pb_text_inner p { padding-bottom: 0 !important; }
  footer.et-l--footer .et_pb_social_network_link a.icon { width: var(--gd-tap) !important; height: var(--gd-tap) !important; line-height: var(--gd-tap) !important; }
}

/* --- 9. Schwebende Elemente mobil ---------------------------------------------- */
@media (max-width: 767px) {
  /* WhatsApp kleiner und näher an den Rand, damit es weniger Inhalt verdeckt */
  #ht-ctc-chat { right: 6px !important; }
  #ht-ctc-chat svg, #ht-ctc-chat .ctc_s_2 img { width: 44px !important; height: 44px !important; }
  /* iPhone-Home-Indikator (nicht auf echtem iPhone getestet) */
  .dtflp-bar { padding-bottom: max(10px, env(safe-area-inset-bottom)) !important; }
}
/* Offenes Menü: Sticky-Leiste und WhatsApp verdecken sonst Telefonnummer und Login-Link */
html:has(.dtflp-hd-drawer.is-open) .dtflp-bar,
html:has(.dtflp-hd-drawer.is-open) #ht-ctc-chat,
html:has(.dtflp-hd-drawer.is-open) .brlbs-cmpnt-widget { display: none !important; }

/* --- 11. Trustindex in Hausschrift, spart den Poppins-Download ------------------- */
.ti-widget, .ti-widget * { font-family: Inter, system-ui, sans-serif !important; }

/* --- 12. Breadcrumbs: gleicher Abstand auf Produkt und Shop ---------------------- */
.rank-math-breadcrumb, .woocommerce-breadcrumb { padding-top: 12px !important; font-size: 13px !important; }

/* --- Barrierefreiheit --- */
/* Sprunglink */
.gd-skip{position:fixed;left:8px;top:-80px;z-index:100000;padding:12px 16px;background:#1f4e92;color:#fff!important;font-weight:700;border-radius:4px}
.gd-skip:focus{top:8px}
/* Sichtbarer Fokus überall, auf hellem und dunklem Grund */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role=button]:focus-visible,[tabindex="0"]:focus-visible{outline:3px solid #1f4e92!important;outline-offset:2px;box-shadow:0 0 0 2px #fff!important}
/* Kontraste 1.4.3 / 1.4.1 */
.dtflp-tax-btn.is-on,.dtflp-express-count,.et_pb_tab_content a{color:#e0174a!important}
.et_pb_tab_content a{text-decoration:underline}
.rank-math-breadcrumb a{color:#6b7075!important;text-decoration:underline}
/* Kontaktformular: dauerhaft sichtbare Beschriftung, lesbarer Platzhalter */
.et_pb_contact_form_label{display:block!important;margin-bottom:4px;font-weight:600}
.et_pb_contact_form input::placeholder,.et_pb_contact_form textarea::placeholder{color:#6b6b6b!important;opacity:1}
/* Zielgröße 2.5.8 */
.dtflp-info{min-width:24px;min-height:24px}
/* FAQ-Button */
.gd-acc-btn{all:unset;display:block;width:100%;cursor:pointer}
/* Video-Pause */
.gd-video-pause{position:absolute;right:12px;bottom:12px;z-index:5;min-height:44px;padding:8px 14px;background:#1f4e92;color:#fff;border:0;border-radius:4px;font-weight:700;cursor:pointer}
/* Borlabs: Akzeptieren-Button und Content-Blocker-Buttons */
.brlbs-btn-accept-all{background:#e0174a!important}
.brlbs-cmpnt-cb-btn{background:#1a66d9!important}
/* Divi-Senden und Warenkorb-CTA im selben Pink wie der Header */
.et_pb_contact_submit,.single_add_to_cart_button{background:#e0174a!important}
/* 400 % Zoom: Sticky-Leisten geben den Inhalt frei (2.4.11, 1.4.10) */
@media (max-height:480px){.et-l--header,.dtflp-hd,.dtflp-bar{position:static!important}}

/* --- Express-Hinweis in Warenkorb und Kasse --- */
.dtflp-express-note{margin:0 0 16px;padding:12px 16px;border-left:4px solid #e0174a;background:#f4f4f6;color:#111214}