/*!
 * Kat en Tuin — opmaak-/UX-laag (KT_Restyle)
 * Wordt ALLEEN geladen wanneer "Nieuwe huisstijl" AAN staat. Verandert uitsluitend de opmaak
 * (knoppen, kaarten, typografie, witruimte, formulieren, menu) binnen de groene huisstijl.
 * Geen inhoud. Uitzetten in de plugin = deze laag laadt niet meer = originele opmaak terug.
 * Richt zich op Divi- en WooCommerce-elementen; laat de eigen plugin-widgets (events/quick-cart) met rust.
 */
:root{
  --kt-green:#2e7d32;
  --kt-green-deep:#1b5e20;
  --kt-green-bright:#4caf50;
  --kt-ink:#1c2b1e;
  --kt-line:#e4e9df;
  --kt-radius:12px;
  --kt-radius-lg:16px;
  --kt-shadow:0 2px 10px rgba(20,40,22,.06);
  --kt-shadow-lg:0 16px 40px rgba(20,40,22,.14);
}

/* ── Basis: iets rustiger tekstbeeld ─────────────────────────────────────── */
body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
#main-content h1,#main-content h2,#main-content h3,#main-content h4{ letter-spacing:-.01em; }
h1,h2,h3{ text-wrap:balance; }

/* Zachtere, consistente focus voor toetsenbordgebruikers */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:3px solid rgba(76,175,80,.55)!important; outline-offset:2px!important;
}

/* ── Knoppen: pill-vorm, gevuld groen, subtiele hover-lift ───────────────── */
.et_pb_button,
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.woocommerce #respond input#submit, .woocommerce #respond input#submit.alt,
.woocommerce #content input.button,
.wp-block-button__link,
input[type=submit]{
  background-color:var(--kt-green)!important;
  color:#fff!important;
  border:2px solid var(--kt-green)!important;
  border-radius:999px!important;
  box-shadow:0 4px 14px rgba(27,77,32,.16)!important;
  transition:background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease!important;
}
.et_pb_button:hover,
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover,
.woocommerce #respond input#submit:hover,
.woocommerce #content input.button:hover,
.wp-block-button__link:hover,
input[type=submit]:hover{
  background-color:var(--kt-green-deep)!important;
  border-color:var(--kt-green-deep)!important;
  color:#fff!important;
  transform:translateY(-2px)!important;
  box-shadow:0 9px 24px rgba(27,77,32,.28)!important;
}
/* Divi-pijltje netjes uitlijnen binnen de pill */
.et_pb_button:after{ line-height:1.7em; }

/* ── Links in de content: groene hover ───────────────────────────────────── */
#main-content a:not(.et_pb_button):not(.button):not(.wp-block-button__link){ transition:color .15s ease; }
#main-content a:not(.et_pb_button):not(.button):not(.wp-block-button__link):hover{ color:var(--kt-green); }

/* ── Hoofdmenu: groene hover ─────────────────────────────────────────────── */
#top-menu li a:hover,
.et_pb_menu .et-menu li a:hover,
.et_pb_fullwidth_menu .et-menu li a:hover{ color:var(--kt-green)!important; opacity:1!important; }

/* ── Productkaarten (webshop / catalogus) ────────────────────────────────── */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  background:#fff!important;
  border:1px solid var(--kt-line)!important;
  border-radius:var(--kt-radius-lg)!important;
  padding:10px 10px 18px!important;
  box-shadow:var(--kt-shadow)!important;
  transition:transform .18s ease, box-shadow .18s ease!important;
  overflow:hidden;
}
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover{
  transform:translateY(-4px);
  box-shadow:var(--kt-shadow-lg)!important;
}
.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img{
  border-radius:12px!important;
  margin-bottom:12px!important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3{
  padding:0 6px!important; font-weight:700!important; line-height:1.35!important;
}
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .price{
  color:var(--kt-green-deep)!important; font-weight:800!important;
}
.woocommerce ul.products li.product .price del{ color:#9aa79a!important; font-weight:500!important; }
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart{ margin:6px 6px 0!important; }

/* ── Prijs op productpagina ──────────────────────────────────────────────── */
.woocommerce div.product p.price, .woocommerce div.product span.price{
  color:var(--kt-green-deep)!important;
}

/* ── Formulieren: rustiger velden met groene focus ───────────────────────── */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce .quantity input.qty,
.et_pb_contact_field input, .et_pb_contact_field textarea,
input[type=text], input[type=email], input[type=tel], input[type=number],
input[type=search], input[type=password], textarea, select{
  border-radius:10px!important;
  border:1.5px solid var(--kt-line)!important;
  padding:11px 14px!important;
  background:#fff!important;
  transition:border-color .15s ease, box-shadow .15s ease!important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
input[type=text]:focus, input[type=email]:focus, input[type=tel]:focus,
input[type=number]:focus, input[type=search]:focus, input[type=password]:focus,
textarea:focus, select:focus{
  border-color:var(--kt-green)!important;
  box-shadow:0 0 0 3px rgba(76,175,80,.18)!important;
  outline:none!important;
}

/* ── Meldingen (WooCommerce) in de huisstijl ─────────────────────────────── */
.woocommerce-message, .woocommerce-info{ border-top-color:var(--kt-green)!important; }
.woocommerce-message::before, .woocommerce-info::before{ color:var(--kt-green)!important; }

/* ── Winkelmand / tabellen: iets zachter ─────────────────────────────────── */
.woocommerce table.shop_table{ border-radius:var(--kt-radius)!important; overflow:hidden; }

/* ── Afbeeldingen in content: subtiele afronding (geen logo's/iconen) ─────── */
#left-area .post .entry-content img.wp-post-image,
.et_pb_image_wrap img{ border-radius:10px; }

/* Respecteer voorkeur voor minder beweging */
@media (prefers-reduced-motion:reduce){
  .et_pb_button,.woocommerce .button,.woocommerce ul.products li.product{ transition:none!important; }
  .woocommerce ul.products li.product:hover{ transform:none!important; }
}