/* ============================================================
   TM MODERN POLISH  -  LIVE + STAGING2  -  revertible
   Verzacht boxy standaard-onderdelen (WooCommerce, formulieren,
   accordeon, losse content-templates) naar de moderne V9-look:
   zachte ronding, warme randen, lichte schaduw.

   Raakt BEWUST GEEN V9-componenten: de checkout (.tmv2-*, .tm-checkout-*),
   de PDP-viewer, de catalog-kaarten (.tm-catalog-*) en de world (.tmv9-*)
   houden hun eigen styling. Alleen hoek-ronding/rand/schaduw, nooit layout.

   Terugdraaien = mu-plugin-bestand tm-modern-polish.php verwijderen.
   Documentatie per blok: 2026-07-18-staging2-modern-polish-changelog.
   ============================================================ */
:root{
  --tmp-radius:12px;          /* vlakken/cards */
  --tmp-radius-input:10px;    /* inputs, dropdowns, paginering */
  --tmp-line:#ddddda;         /* zachte warme rand (= --tmv2-line) */
  --tmp-shadow:0 8px 24px rgba(0,0,0,.06);
  --tmp-shadow-card:0 12px 30px rgba(20,20,20,.07);
  --tmp-red:#AD1716;
}

/* -------- GLOBAL 0: off-canvas panelen boven de sticky V9-header -------- */
.wd-side-hidden{
  z-index:1100 !important;
}
body:has(.wd-side-hidden.wd-opened) .wd-close-side.wd-close-side-opened{
  z-index:1090;
}

/* -------- GLOBAL 1: formulier-velden -------- */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
input[type="text"],input[type="email"],input[type="tel"],input[type="url"],
input[type="password"],input[type="number"],input[type="search"],input[type="date"],
textarea,select{
  border-radius:var(--tmp-radius-input) !important;
  border-color:var(--tmp-line) !important;
}
.select2-container--default .select2-selection,
.select2-dropdown{
  border-radius:var(--tmp-radius-input) !important;
  border-color:var(--tmp-line) !important;
}

/* -------- GLOBAL 2: knoppen -> chique 12px rondje (Monir 25-07) --------
   Geharmoniseerd met de "Bestel tegelmonsters"-knop in de menubalk (12px).
   Was eerder volle pil (999px); bij twee-regelige knoppen oogde dat overdreven. */
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.wc-block-components-button,
button.button,.button.alt,
.woocommerce-form-login .button,.woocommerce-form-register .button{
  border-radius:12px !important;
}

/* -------- GLOBAL 3: winkelwagen (block + classic) -------- */
.woocommerce-cart .shop_table,
.woocommerce-cart .cart_totals,
.woocommerce-cart .woocommerce-cart-form,
.cart-collaterals .cart_totals,
.wc-block-cart-items,
.wp-block-woocommerce-cart-order-summary-block,
.wc-block-components-sidebar,
.wc-block-cart .wc-block-cart-items{
  border-radius:var(--tmp-radius) !important;
  border-color:var(--tmp-line) !important;
  overflow:hidden;
}

/* -------- WINKELWAGEN 2026-07-22: verwijderknop vrij van sticky header -------- */
body.woocommerce-cart .tmv9-header{
  position:relative !important;
  top:auto !important;
}
body.woocommerce-cart .wc-block-cart-item__remove-link,
body.woocommerce-cart .product-remove a.remove{
  pointer-events:auto;
}

/* -------- WINKELWAGEN 2026-07-22: enkele moderne aantal-kiezer -------- */
body.woocommerce-cart .wc-block-components-quantity-selector{
  width:112px !important;
  height:42px !important;
  display:inline-grid !important;
  grid-template-columns:36px 40px 36px;
  align-items:center;
  overflow:hidden;
  box-sizing:border-box;
  border:1px solid var(--tmp-line) !important;
  border-radius:var(--tmp-radius-input) !important;
  background:#fff !important;
  box-shadow:0 1px 2px rgba(20,20,20,.04) !important;
}
body.woocommerce-cart .wc-block-components-quantity-selector::after{
  border:0 !important;
  box-shadow:none !important;
}
body.woocommerce-cart .wc-block-components-quantity-selector__button{
  width:36px !important;
  min-width:36px !important;
  height:40px !important;
  min-height:40px !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--tmp-red) !important;
  font-family:Poppins,Arial,sans-serif !important;
  font-size:18px !important;
  font-weight:600 !important;
  line-height:1 !important;
  box-shadow:none !important;
}
body.woocommerce-cart .wc-block-components-quantity-selector__button:hover{
  background:rgba(173,23,22,.07) !important;
}
body.woocommerce-cart .wc-block-components-quantity-selector__button:focus-visible{
  outline:2px solid var(--tmp-red);
  outline-offset:-3px;
}
body.woocommerce-cart input.wc-block-components-quantity-selector__input{
  width:40px !important;
  min-width:40px !important;
  height:40px !important;
  margin:0 !important;
  padding:0 4px !important;
  border:0 !important;
  border-radius:0 !important;
  background:#f7f7f5 !important;
  color:#242424 !important;
  font-family:Poppins,Arial,sans-serif !important;
  font-size:15px !important;
  font-weight:600 !important;
  line-height:40px !important;
  box-shadow:none !important;
  appearance:textfield;
}

/* Klassieke WooCommerce-fallback voor carttemplates zonder Cart Block. */
body.woocommerce-cart .quantity{
  display:inline-flex !important;
  align-items:center;
  overflow:hidden;
  height:42px;
  border:1px solid var(--tmp-line) !important;
  border-radius:var(--tmp-radius-input) !important;
  background:#fff !important;
  box-shadow:0 1px 2px rgba(20,20,20,.04) !important;
}
body.woocommerce-cart .quantity .minus,
body.woocommerce-cart .quantity .plus,
body.woocommerce-cart .quantity input.qty{
  height:40px !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  font-family:Poppins,Arial,sans-serif !important;
}
body.woocommerce-cart .quantity .minus,
body.woocommerce-cart .quantity .plus{
  width:36px !important;
  min-width:36px !important;
  padding:0 !important;
  background:transparent !important;
  color:var(--tmp-red) !important;
  font-size:18px !important;
  font-weight:600 !important;
}
body.woocommerce-cart .quantity input.qty{
  width:40px !important;
  min-width:40px !important;
  padding:0 4px !important;
  background:#f7f7f5 !important;
  color:#242424 !important;
  font-size:15px !important;
  font-weight:600 !important;
}

/* -------- WINKELWAGEN 2026-07-22: cross-sells typografie -------- */
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block > .wp-block-heading,
body.woocommerce-cart .cross-sells > h2{
  font-family:Poppins,Arial,sans-serif !important;
  font-size:clamp(22px,2vw,26px) !important;
  font-weight:600 !important;
  line-height:1.3 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-name,
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-products-block .wc-block-components-product-name,
body.woocommerce-cart .cross-sells .wd-entities-title,
body.woocommerce-cart .cross-sells .woocommerce-loop-product__title{
  font-family:Poppins,Arial,sans-serif !important;
  font-size:clamp(17px,1.45vw,18px) !important;
  font-weight:500 !important;
  line-height:1.45 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-button__button,
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-products-block .wc-block-components-product-button__button,
body.woocommerce-cart .cross-sells .button{
  min-height:44px !important;
  max-width:100%;
  padding:11px 18px !important;
  font-family:Poppins,Arial,sans-serif !important;
  font-size:14px !important;
  font-weight:600 !important;
  line-height:1.35 !important;
  letter-spacing:.01em;
}

/* -------- GLOBAL 4: JetSmartFilters paginering (zwarte vierkantjes) -------- */
.jet-smart-filters-pagination .jet-filters-pagination__item{
  border-radius:10px !important;
}

/* -------- MY-ACCOUNT (login/registreren + dashboard) -------- */
body.woocommerce-account .wd-registration-page,
body.woocommerce-account .woocommerce-MyAccount-navigation,
body.woocommerce-account .woocommerce-MyAccount-content{
  background:#fff !important;
  border:1px solid var(--tmp-line) !important;
  border-radius:var(--tmp-radius) !important;
  box-shadow:var(--tmp-shadow-card);
  padding:34px !important;
}
body.woocommerce-account .wd-registration-page{
  max-width:1040px; margin-left:auto; margin-right:auto;
}

/* -------- FAQ accordeon (page-id-1408) -------- */
body.page-id-1408 .e-n-accordion-item{
  border-radius:var(--tmp-radius) !important;
  border:1px solid var(--tmp-line) !important;
  box-shadow:var(--tmp-shadow);
  overflow:hidden;
  margin-bottom:12px;
}
body.page-id-1408 .e-n-accordion-item-title{
  border-radius:var(--tmp-radius) !important;
}

/* -------- CONTACT (page-id-1412): icoon-tegels, kaart, beeld -------- */
body.page-id-1412 .elementor-view-stacked .elementor-icon{
  border-radius:var(--tmp-radius) !important;
}
body.page-id-1412 .elementor-widget-google_maps iframe,
body.page-id-1412 .elementor-widget-image img,
body.page-id-1412 .wpforms-container,
body.page-id-1412 form.wpcf7-form{
  border-radius:var(--tmp-radius) !important;
  overflow:hidden;
}

/* -------- CIRCULAIR (page-id-1418): beelden + gallery -------- */
body.page-id-1418 .elementor-widget-image img,
body.page-id-1418 .wp-block-image img,
body.page-id-1418 .elementor-widget-text-editor img,
body.page-id-1418 .e-gallery-image,
body.page-id-1418 .elementor-gallery-item{
  border-radius:var(--tmp-radius) !important;
}
body.page-id-1418 .elementor-gallery-item{ overflow:hidden; }

/* -------- OVER ONS (page-id-7): teamfoto's -------- */
body.page-id-7 img.size-thumbnail,
body.page-id-7 img.attachment-thumbnail,
body.page-id-7 .elementor-widget-text-editor img,
body.page-id-7 .elementor-widget-image img,
body.page-id-7 .wp-block-image img{
  border-radius:var(--tmp-radius) !important;
}

/* -------- CHECKOUT: login-melding zonder pil-rand (Monir 24-07) --------
   "Terugkerende klant? Klik hier voor login" toonde een functieloze
   pil-omlijning tegen de bovenrand. Alleen de tekst + link blijven. */
.woocommerce-form-login-toggle .woocommerce-info{
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  padding-left:0 !important;
  margin-top:14px !important;
}


/* -------- WINKELWAGEN cross-sells "Misschien ook interessant" (Monir 25-07) --------
   30% compacter, plaatjes in vast vierkant, prijzen en knoppen uitgelijnd.
   NB: een bestaande cart-stylingregel zet deze maten met clamp() !important en
   hoge specificiteit; daarom winnen deze selectors bewust op specificiteit. */
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block > h2.wp-block-heading.has-large-font-size,
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block > h2.wp-block-heading{
  font-size:19px !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block > div{
  display:grid !important;
  grid-template-columns:repeat(auto-fill, minmax(190px, 1fr)) !important;
  gap:22px !important;
  align-items:stretch !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product{
  display:flex !important;
  flex-direction:column !important;
  width:auto !important;
  max-width:none !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product img{
  aspect-ratio:1/1 !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product h3.wc-block-components-product-title,
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product h3.wc-block-components-product-title a.wc-block-components-product-name{
  font-size:14px !important;
  line-height:1.35 !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-price,
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-price *{
  font-size:14px !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wp-block-button,
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-button{
  margin-top:auto !important;
}
body.woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product a.wp-block-button__link.wp-element-button.add_to_cart_button{
  border-radius:12px !important;
  font-size:11px !important;
  padding:9px 16px !important;
}

/* -------- CHECKOUT: Plaats bestelling-knop zelfde 12px-rondje (Monir 25-07) -------- */
body form.checkout #place_order,
body .woocommerce-checkout #place_order{
  border-radius:12px !important;
}

/* Aantal-kiezer (Monir 27/7): kale plus/min zonder boxen - de knopranden voegden niets toe */
.quantity input.minus,
.quantity input.plus {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

/* -------- ZOEKRESULTAAT: 2 KOLOMMEN OP MOBIEL (2026-08-20) -------- */
/* De zoekresultatengrid stond op 4 kolommen voor desktop, tablet en mobiel.
   Op 390px werd een tegelkaart daardoor 97,5px breed en braken de zes
   eigenschap-iconen in zes rijen door titel en foto heen. De catalogus
   /tegels/ staat op 2 kolommen mobiel; deze regel trekt de zoekpagina
   daarmee gelijk. Zodra de kolominstelling zelf in de bouwer wordt
   gecorrigeerd, matcht deze regel niet meer en dooft hij vanzelf uit. */
@media (max-width:767px){
  .jet-listing-grid__items.grid-col-mobile-4{ --columns:2 !important; }
}
@media (min-width:768px) and (max-width:1024px){
  .jet-listing-grid__items.grid-col-tablet-4{ --columns:3 !important; }
}