/* ── Eerste scherm 2026-11-10 ────────────────────────────────────────────────
   1) Mobiele categoriepagina's: eerste paneel op het eerste scherm (plafondpagina
      eerste product van 679 naar 436 px op iPhone 13). Kruimelpad weg, kleinere
      titel, "Hoe groot is je ruimte?"-label weg, keuzehulp-blok op één regel
      (de zwevende "Hulp bij kiezen"-knop blijft werken, die kijkt naar dit blok).
   2) Desktop-productpagina: staffel en vermogenscheck onder de koopknop, optionele
      extra's compact, en de bestaande koopbalk ook op desktop zodra de knop uit
      beeld is (met naam, gekozen uitvoering en aantal; uit pakket 8-11).
   Terugdraaien = inc/eerste-scherm.php niet meer laden. */

@media (max-width: 600px) {
  body.tax-product_cat .dh-shop-wrap { padding-top: 12px; }
  body.tax-product_cat .dh-shop-wrap > .dh-pdp-bc { display: none; }
  body.tax-product_cat .dh-archive-head { margin-bottom: 8px; }
  body.tax-product_cat .dh-archive-title { margin-bottom: 8px; font-size: 24px; line-height: 1.2; }
  body.tax-product_cat .dh-filter-quick { margin: 0 0 8px; }
  body.tax-product_cat .dh-filter-quick__label { display: none; }
  body.tax-product_cat .dh-kh-entry { flex-direction: row; align-items: center; gap: 10px; margin: 0 0 12px; padding: 6px 6px 6px 14px; }
  body.tax-product_cat .dh-kh-entry span { display: none; }
  body.tax-product_cat .dh-kh-entry strong { font-size: 14px; line-height: 1.3; }
  body.tax-product_cat .dh-kh-entry__btn { min-height: 38px; padding: 0 14px; font-size: 14px; }
}

@media (min-width: 901px) {
  .dh-pdp-buy-cta { display: flex; flex-direction: column; }
  .dh-pdp-buy-cta > .dh-staffel { order: 2; margin-top: 16px; }
  .dh-pdp-buy-cta > .dh-vc { order: 3; margin-top: 12px; }
  /* Optionele wieltjes compact, zodat de knop bij Superia ook boven de vouw blijft */
  .dh-pdp-buy-cta form.cart .dh-pdp-bundle-contents { margin-bottom: 10px; padding: 10px 14px; }
  .dh-pdp-buy-cta form.cart .dh-pdp-bundle-heading { margin-bottom: 6px; font-size: 14px; }
  .dh-pdp-buy-cta form.cart .bundle_form { padding-top: 0 !important; }
  .dh-pdp-buy-cta form.cart .bundled_product_excerpt { display: none !important; }
  .dh-pdp .dh-pdp-buy-cta form.cart .bundled_product_summary { margin: 0 0 6px; padding: 8px 10px !important; }
  .dh-pdp .dh-pdp-buy-cta form.cart .bundled_product_summary:last-of-type { margin-bottom: 0; }
  .dh-pdp .dh-pdp-buy-cta form.cart h4.bundled_product_title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 10px; margin-bottom: 2px; }
  .dh-pdp .dh-pdp-buy-cta form.cart .bundled_product_title_link { margin-top: 0; }

  body .dh-pdp-bar.is-visible {
    display: flex !important;
    flex-wrap: nowrap;
    gap: 16px;
    z-index: 200; /* onder menu (210) en mini-winkelwagen (220) */
    bottom: 0 !important;
    padding: 10px max(24px, calc((100vw - 1400px) / 2));
  }
  .dh-pdp-bar.is-visible .dh-pdp-bar__meta { display: none; }
  .dh-pdp-bar.is-visible .dh-pdp-bar__price { flex: 0 0 auto; order: 2; }
  .dh-pdp-bar.is-visible .dh-pdp-bar__price ins { text-decoration: none; }
  .dh-pdp-bar.is-visible .dh-pdp-bar__btn { order: 4; height: 44px; }
  .dh-koopbalk__info { flex: 1 1 auto; order: 1; min-width: 0; margin: 0; }
  .dh-koopbalk__name,
  .dh-koopbalk__variant {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dh-koopbalk__name { color: var(--dh-ink); font-size: 15px; font-weight: 800; line-height: 1.3; }
  .dh-koopbalk__variant { color: var(--dh-muted); font-size: 13px; font-weight: 600; line-height: 1.3; }
  .dh-koopbalk__qty {
    display: inline-flex;
    flex: 0 0 auto;
    order: 3;
    align-items: center;
    height: 44px;
    border: 1px solid var(--dh-line);
    border-radius: var(--dh-r-md);
  }
  .dh-koopbalk__qty button {
    width: 36px;
    height: 42px;
    border: 0;
    background: none;
    color: var(--dh-ink);
    font: 700 18px/1 var(--dh-font);
    cursor: pointer;
  }
  .dh-koopbalk__qty output { min-width: 28px; color: var(--dh-ink); font-weight: 700; text-align: center; }

  /* Ruimte maken: footer, cookiekaart (linksonder) en Ray (rechtsonder) boven de balk */
  body.has-pdp-bar { padding-bottom: 72px; }
  body:has(.dh-pdp-bar.is-visible) .dh-consent:not(.is-prefs) { bottom: 64px; }
  body:has(.dh-pdp-bar.is-visible) .gc-chat:not(.is-open) { bottom: 88px !important; }
}

