/* Entfernt die "Previous" und "Next" Navigation unter der Produktgalerie */
.flex-direction-nav,
.woocommerce-product-gallery__navigation {
    display: none !important;
}

/* "Vorrätig"-Hinweis bei allen Produktarten ausblenden */
.woocommerce-variation-availability,
.woocommerce div.product .stock {
    display: none !important;
}

/* Variantenpreis (unter dem Warenkorb) an Hauptpreis (Style: Medium) anpassen */
.woocommerce-variation-price .price {
    font-size: 1.25rem !important; /* entspricht "Medium" */
    font-weight: 500 !important;
    font-family: inherit !important;
    line-height: 1.3 !important;
    margin-top: 0.5rem;
    display: block;
}

/* Produktseite - Rahmen um das gesamte Mengenfeld (inkl. Minus, Zahl, Plus) */
.woocommerce div.quantity {
  border: 2px solid #111111;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  padding: 0 5px;
  height: 45px; /* optional für gleiche Höhe wie Auswahlbuttons */
  box-sizing: border-box;
}

/* Darstellung des jeweiligen Headers für Desktop oder mobile */
.only-desktop {
  display: inherit;
  visibility: visible;
  position: static;
}

.only-mobile {
  display: none;
  visibility: hidden;
  position: absolute;
  top: -9999px;
  left: -9999px;
}

@media screen and (max-width: 1024px) {
  .only-desktop {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    top: -9999px;
    left: -9999px;
  }
  .only-mobile {
    display: inherit !important;
    visibility: visible !important;
    position: static !important;
  }
}

/* Text-mit-Pfeil – Grundstil */
.wp-block-button.is-style-gtmt-text-arrow .wp-block-button__link {
  color: #000 !important;                                        /* Text schwarz */
  background: var(--wp--preset--color--background, #fff) !important; /* Hintergrund = Theme-Hintergrund */
  border: none !important;
  box-shadow: none !important;
}


/* ----------------------------------- PRODUCT ADD ONS EINSTELLUNGEN ---------------------------- */


/* =============== 1) ALLGEMEIN – SCHRIFTEN (Desktop + Mobile) =============== */

/* Gruppenbeschreibung fett */
.pewc-group-description {
  font-weight: 600 !important;
  font-family: inherit !important;
}

/* Feld-Labels (Durchmesser, Standfuß, Stromzufuhr) wie normaler Text */
.pewc-product-extra-groups-wrap .pewc-field-label,
.pewc-product-extra-groups-wrap h4.pewc-field-label {
  font-size: inherit !important;
  font-weight: 400 !important;
  line-height: inherit !important;
  margin: 0 0 6px 0 !important;
  padding: 0 !important;
  text-transform: none !important;
  letter-spacing: normal !important;

  /* Abstand fürs Sternchen (wirkt nur bei Pflichtfeldern) */
  margin-right: 14px !important;
}

/* Sternchen höher setzen */
.pewc-field-label .required {
  vertical-align: text-top;
  position: relative;
  top: -4px;
}

/* Preisübersicht unten (Startpreis / Optionen / Gesamt) Standardgröße */
.pewc-total-field,
.pewc-total-field span,
.pewc-total-label {
  font-size: 16px !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
  color: inherit !important;
  font-family: inherit !important;
}



/* =============== 2) ALLGEMEIN – DESIGN / LAYOUT (Desktop + Mobile) =============== */

/* Options-Container: 2-Spalten Grid, gleich breite Boxen */
.pewc-product-extra-groups-wrap ul.pewc-checkbox-group-wrapper {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px 12px;  /* vertikal / horizontal */
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  width: 100%;
}

/* Jede LI volle Spaltenbreite */
.pewc-product-extra-groups-wrap ul.pewc-checkbox-group-wrapper > li {
  width: 100%;
}

/* Box + Text (Swatch/Radio-Label) */
.pewc-product-extra-groups-wrap .pewc-radio-form-label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;

  padding: 8px 12px;
  border: 2px solid #111111;
  border-radius: 7px;
  box-sizing: border-box;
  background: transparent;
  cursor: pointer;

  width: 100%;
  min-height: 44px;

  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;

  margin: 0 !important;  /* Grid regelt Abstand */
  text-align: center;
}

/* Text in der Box */
.pewc-product-extra-groups-wrap .pewc-radio-form-label .pewc-radio-option-text {
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.4 !important;
  color: inherit !important;
  font-family: inherit !important;
}

/* Radiokreis sichtbar lassen (Desktop + Mobile Standard) */
.pewc-product-extra-groups-wrap .pewc-radio-form-label input[type="radio"] {
  appearance: auto !important;
  -webkit-appearance: radio !important;
  width: 16px;
  height: 16px;
  margin: 0;
  flex: 0 0 auto;
}



/* =============== 3) MOBILE – FEINTUNING (nur Mobile) =============== */

@media (max-width: 768px) {

  /* Boxen schmaler / enger */
  .pewc-product-extra-groups-wrap .pewc-radio-form-label {
    padding: 6px 6px !important;
    margin: 0 6px 6px 0 !important;
    gap: 6px !important;
  }

  /* Schrift in den Boxen kleiner */
  .pewc-product-extra-groups-wrap .pewc-radio-form-label .pewc-radio-option-text {
    font-size: 13px !important;
  }

  /* Mobile: Swatch-Buttons wirklich mittig + kein "unsichtbarer Einzug" vom Radio */
  .pewc-product-extra-groups-wrap
  .pewc-checkbox-group-wrapper
  label.pewc-radio-form-label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 6px 6px !important;
    border: 2px solid #111111 !important;
    border-radius: 7px !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    gap: 0 !important;
    margin: 0 6px 6px 0 !important;
  }

  /* Mobile: Radio-Input raus, damit er keinen Platz links klaut */
  .pewc-product-extra-groups-wrap
  .pewc-checkbox-group-wrapper
  label.pewc-radio-form-label input[type="radio"] {
    display: none !important;
  }

  /* Mobile: Text zentrieren */
  .pewc-product-extra-groups-wrap
  .pewc-checkbox-group-wrapper
  label.pewc-radio-form-label .pewc-radio-option-text {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
  }
}


/* ----------------------------------- PRODUCT ADD ONS EINSTELLUNGEN ENDE ---------------------------- */

/* Text im Warenkorb schwarz – aber ohne Buttons umzuhauen */
.wc-block-cart,
.wc-block-cart p,
.wc-block-cart span,
.wc-block-cart li,
.wc-block-cart dt,
.wc-block-cart dd,
.wc-block-cart th,
.wc-block-cart td {
    color: #111111 !important;
}

/* Text im Checkout schwarz – aber ohne Buttons umzuhauen */
.wc-block-checkout,
.wc-block-checkout p,
.wc-block-checkout span,
.wc-block-checkout li,
.wc-block-checkout dt,
.wc-block-checkout dd,
.wc-block-checkout th,
.wc-block-checkout td,
.wc-block-checkout label {
  color: #111111 !important;
}



/* Kurzbeschreibung in jeder Warenkorb-Position ausblenden */
.wc-block-cart .wc-block-cart-item__product > p,
.wc-block-cart .wc-block-cart-item__product .wc-block-cart-item__description,
.wc-block-cart .wc-block-cart-item__product .wc-block-cart-item__short-description {
    display: none !important;
}

/* Fallback: erstes p im Produktblock verstecken (ist in der Regel die Kurzbeschreibung) */
.wc-block-cart .wc-block-cart-item__product p:nth-of-type(1) {
    display: none !important;
}

/* Entfernt auch Überschrift (z. B. h4) aus der Kurzbeschreibung im Warenkorb */
.wc-block-cart .wc-block-cart-item__product h4,
.wc-block-cart .wc-block-cart-item__product h3,
.wc-block-cart .wc-block-cart-item__product h5 {
    display: none !important;
}

/* NUR Mobile: Optionen-Labels im Warenkorb fett, Werte normal */
@media (max-width: 768px) {

  /* Label: Durchmesser, Standfuß, Stromzufuhr, Größe, etc. */
  .wc-block-cart .wc-block-components-product-details__name {
      font-weight: 700 !important;
  }

  /* Wert: 335mm, Ja, USB-Kabel, Größe L, usw. */
  .wc-block-cart .wc-block-components-product-details__value {
      font-weight: 400 !important;
  }
}

/* Hinter dem EINZELPREIS im Warenkorb „ / Stück“ anzeigen */
.wc-block-cart .wc-block-cart-item__product .wc-block-components-product-price__value::after {
    content: " / Stück";
    margin-left: 0.25em;
    font-weight: 400;
}

/* MINI-WARENKORB: Einzelpreis normal gewichten */
.wc-block-mini-cart__drawer .wc-block-components-product-price__value {
    font-weight: 400 !important;   /* nicht fett */
    color: #111111 !important;     /* schwarz, wie im großen Warenkorb */
}

/* MINI-WARENKORB – Titel wie "Durchmesser", "Standfuß", "Stromzufuhr" fett + schwarz */
.wc-block-mini-cart__drawer .wc-block-components-product-details__name {
  font-weight: 600 !important;   /* fett */
  color: #111111 !important;     /* schwarz */
  font-family: inherit !important; /* Theme-Schrift */
}

/* MINI-WARENKORB – Wert normal + schwarz (falls eigene Klasse vorhanden ist) */
.wc-block-mini-cart__drawer .wc-block-components-product-details__value {
  font-weight: 400 !important;
  color: #111111 !important;
  font-family: inherit !important;
}

/* MINI-WARENKORB: Nur beim EINZELPREIS "/ Stück" anzeigen */
.wc-block-mini-cart__drawer 
  .wc-block-cart-item__prices 
  .wc-block-components-product-price__value::after {
    content: " / Stück";
    margin-left: 0.25em;
    font-weight: 400;
    color: inherit;
}

/* MINI-WARENKORB: Bei der Gesamtsumme KEIN "/ Stück" anzeigen */
.wc-block-mini-cart__drawer 
  .wc-block-cart-item__total 
  .wc-block-components-product-price__value::after {
    content: none !important;
}



/* ================= PRODUKTKATALOG / KATEGORIEN / SCHLAGWORTE ================= */
/* ================= Rahmen + abgerundete Ecken für Produktbilder ================= */

/* Produktseite Hauptbild + Wrapper */
.wp-block-woocommerce-product-image-gallery
.woocommerce-product-gallery__image img,
.wp-block-woocommerce-product-image-gallery
.woocommerce-product-gallery__wrapper img {
    border: 2px solid #111111;
    border-radius: 7px;
    box-sizing: border-box;
}

/* Produktseite Thumbnails */
.wp-block-woocommerce-product-image-gallery
.flex-control-thumbs li img {
    border: 2px solid #111111;
    border-radius: 7px;
    box-sizing: border-box;
}

/* Klassiker: WooCommerce-Archiv (Shop, Kategorien, Tags) */
.woocommerce-shop ul.products li.product img,
.tax-product_cat ul.products li.product img,
.tax-product_tag ul.products li.product img,
.post-type-archive-product ul.products li.product img {
  border: 2px solid #111111 !important;
  border-radius: 7px !important;
  box-sizing: border-box !important;
  display: block;
}

/* Block-Themes / WooCommerce Blocks (Product Grid / Product Collection) */
.wc-block-grid__product-image img,
.wc-block-components-product-image img,
.wp-block-woocommerce-product-image img,
.wp-block-woocommerce-product-collection img {
  border: 2px solid #111111 !important;
  border-radius: 7px !important;
  box-sizing: border-box !important;
  display: block;
}

/* Produktseite Hover-Zoom-Bild (zoomImg Overlay) komplett ausblenden */
.wp-block-woocommerce-product-image-gallery .zoomImg,
.woocommerce-product-gallery .zoomImg {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Produktseite Keine Zoom-Cursor / keine Transform-Animation beim Hover */
.wp-block-woocommerce-product-image-gallery img,
.woocommerce-product-gallery img {
  cursor: default !important;
  transform: none !important;
}

/* WooCommerce Schriftart – font-display optimieren */
@font-face {
  font-family: "WooCommerce";
  src: url("/wp-content/themes/woocommerce/fonts/WooCommerce.woff2") format("woff2");
  font-display: swap;
}

/* Heebo – Variable Font */
@font-face {
  font-family: "Heebo";
  src: url("/wp-content/themes/blocksy/fonts/Heebo-VariableFont_wght.ttf") format("truetype");
  font-display: swap;
}