/*
Theme Name: Divi Child Theme
Theme URI: https://kahlo.nl
Description: Child theme for the Divi Theme
Author: Karen Nijst
Author URI: https://kahlo.nl
Template: Divi
Version: 1.3
*/

@charset "UTF-8";
.container {
    width: 94%;
    max-width: 1440px;
    margin: auto;
    position: relative;
}
#et-top-navigation .et-cart-info {
    float: left;
    margin: -6px 0 0 22px;
    font-size: 21px;
	    padding: 8px; /* ivm betere focus opmaak bij tab */
}
/* standaard page.php zonder builder */
.et_pb_section_0.pageNormal {
    padding-top: 77px;
    padding-bottom: 40px;
    background-color: #b21144 !important;
}
.et_pb_section_0.pageNormal .et_pb_row {
    width: 90%;
}
.et_pb_section_0.pageNormal h1 {
	color: #FFF!important; 
}
.et_pb_section_0.pageNormal.section_has_divider.et_pb_bottom_divider .et_pb_bottom_inside_divider {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwJSIgaGVpZ2h0PSI0MHB4IiB2aWV3Qm94PSIwIDAgMTI4MCAxNDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0iI0ZGRkZGRiI+PHBhdGggZD0iTTEyODAgODZjLTE5LjktMTcuMjEtNDAuMDgtMzkuNjktNzkuODktMzkuNjktNTcuNDkgMC01Ni45MyA0Ni41OS0xMTUgNDYuNTktNTMuNjEgMC01OS43Ni0zOS42Mi0xMTUuNi0zOS42MkM5MjMuNyA1My4yNyA5MjQuMjYgODcgODUzLjg5IDg3Yy04OS4zNSAwLTc4Ljc0LTg3LTE4OC4yLTg3QzU1NCAwIDU0My45NSAxMjEuOCA0MjMuMzIgMTIxLjhjLTEwMC41MiAwLTExNy44NC01NC44OC0xOTEuNTYtNTQuODgtNzcuMDYgMC0xMDAgNDguNTctMTUxLjc1IDQ4LjU3LTQwIDAtNjAtMTIuMjEtODAtMjkuNTF2NTRIMTI4MHoiLz48L2c+PC9zdmc+);
    background-size: 100% 40px;
    bottom: 0;
    height: 40px;
    z-index: 1;
    transform: scale(1, 1);
}
/*pagina's zonder builder page.php in dit theme */
#main-content #left-area,
#left-area{
        width: 90.25%!important;
        padding-left: 2% !important;
    }
#main-content #sidebar,
#sidebar{
        width: 0%;
        display: none;
}
/* hinderlijk streepje */
    #main-content .container:before {
        width: 0px!important;
    }

/* ---------------------------
   Corps (body) standaard instellen
------------------------------ */
h1, h2, h3{
    font-weight: 600!important;
}
.post-meta{
	display:none!important; 
}
code{
	background-color: #EBEBEB;
	font-weight: 700; 
}
a[href^="http"]:not([href*="toegankelijkewebsitemaken.nl"])::after {
  content: "\2197";  /* pijltje omhoog */
  font-size: 0.9em;
  margin-left: 4px;
  vertical-align: baseline;
}

.et_pb_text ol, .et_pb_text ul, #beschrijving_onderaan ol, #beschrijving_onderaan ul{
    padding-bottom: 1em;
    padding-top: 1em;
}
/* --------------------------------------------------------------------------*/

/* code module bovenaan <a href="#main-content" class="skip-link">Direct naar inhoud</a>
In functions.php:  <a id="skip-to-content" class="skip-link" href="#main-content">Direct naar de inhoud</a>
  */
/* --------------------------------------------------------------------------*/


.et-pb-slider-arrows a[role="button"]:focus-visible {
  outline: 2px solid #005fcc;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px #fff, 0 0 0 6px #005fcc;
}

/* einde focus */

/* screen-reader helpers (veilig, geen -9999px) */
.screen-reader-text,
.sr-only,.sr-onlyKahlo {
  position:absolute !important; width:1px !important; height:1px !important;
  padding:0 !important; margin:0 !important; overflow:hidden !important;
  clip:rect(1px,1px,1px,1px) !important; clip-path: inset(50%) !important;
  white-space:nowrap !important; border:0 !important; left:auto !important;
}

/* zoekveld krijgt alleen interactie als het zichtbaar/open is */
.et_pb_menu__search-form input[type="search"] {
  pointer-events: none;   /* geen klik / geen focus via muis */
}
/* als jij het open zet (JS hieronder), wordt ’ie weer interactief */
.et-search-open .et_pb_menu__search-form input[type="search"] {
  pointer-events: auto;
}


/* bar indien ingelogd */
body.admin-bar #wpadminbar #adminbar-search input,
body.admin-bar #wpadminbar #adminbar-search {
  color: #1c1c1c !important;
  background-color: #ffffff !important;
}



/* Zorg dat iconen nooit op opacity:0 blijven door waypoint/animatie */
.et_pb_blurb .et_pb_image_wrap .et-pb-icon,
.et_pb_blurb .et-waypoint .et-pb-icon {
  opacity: 1 !important;
}

/* Zet het juiste icon-font + zichtbare kleur (zonder alpha) */
.et_pb_blurb .et-pb-icon {
  font-family: "ETmodules" !important;
  color: #0e366d !important; /* geen #0e366d00 */
}

/* DEMO buttons simulatie (in functions.php) [a11y_simulatie] */
/* Alleen stijlen binnen de shortcode wrapper */
.a11y-sim .demo-section {
  margin-bottom: 2rem;
  padding: 1rem;
  border: 2px solid #ddd;
  border-radius: 8px;
}

/* Buttons binnen de shortcode */
.a11y-sim button {
  margin: 0.5rem 0.5rem 1rem 0;
  padding: 0.5rem 1rem;
  border: none;
  border-radius: 5px;
  background-color: #005fcc;
  color: white;
  cursor: pointer;
  font-size: 1.1rem;
  font-weight: 600;
	min-width: 196px;
}

.a11y-sim button:focus {
  outline: 3px solid orange;
  outline-offset: 2px;
}

/* Filtereffecten die op body worden toegepast */
body.low-contrast {
  filter: contrast(30%);
  background-color: #DBD8D8;
  color: #555;
}

body.blur {
  filter: blur(3px);
}

body.grayscale {
  filter: grayscale(100%);
}
/* einde opmaak en effect [a11y_simulatie] */




/* --------------------------------------------------------------------------*/
/* einde toegankelijkheid */
/* --------------------------------------------------------------------------*/

/*WPForms */
/* contactform */
#wpforms-112
{
	max-width: 900px; 
}

div.wpforms-container-full input[type=checkbox]:before, div.wpforms-container-full input[type=radio]:before {
    border-width: var(--wpforms-field-border-size);
    border-style: var(--wpforms-field-border-style);
    border-color: rgb(0 0 0 / 70%);
}
/* Radio-knoppen groter maken */
.wpcf7-form input[type="radio"] {
  transform: scale(1.5);   /* schaal factor, bv. 1.5 = 150% */
  margin-right: 0.5em;     /* extra ruimte tussen knop en label */
}
div.wpforms-container-full input[type=checkbox]+label,
div.wpforms-container-full input[type=radio]+label {
    padding-inline-start: 12px;
    padding-right: 20px !important;
}

.wpforms-error {
    font-weight: bold !important;
    color: #b30000 !important;
    margin-top: 8px !important;
    font-size: 1em !important;
    position: relative;
    padding-left: 1.6em!important; /* ruimte voor icoon links */
}

div.wpforms-container-full .wpforms-form em.wpforms-error::before {
    content: "\26A0"; /* Unicode waarschuwingsteken */
    position: absolute;
    left: 0;
    top: 0.1em;
    font-size: 1.2em;
    color: #b30000;
    line-height: 1;
    margin-right: 0.5em;
}
div.wpforms-container-full .wpforms-field-limit-text{
	font-weight: bold !important;
    color: #313787 !important;
}
/* Algemene styling */
#wpforms-submit-112.algemeenVerzendButton {
  display: inline-block;
      padding: 1rem 2rem 2.5rem;
    font-size: 1.225rem;
  font-weight: 600;
  color: #fff;
  background-color: #b53e54; /* Goed contrast op wit */
  border: none;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.1s ease;
}

/* Hover en focus */
#wpforms-submit-112.algemeenVerzendButton:hover,
#wpforms-submit-112.algemeenVerzendButton:focus {
  background-color: #005f8d;
  outline: none;
  transform: translateY(-1px);
}

/* Keyboard focus indicator */
#wpforms-submit-112.algemeenVerzendButton:focus-visible {
  outline: 3px solid #ffbf47; /* Opvallende WCAG-AA-kleur */
  outline-offset: 3px;
}

/* Disabled state (als je dat gebruikt) */
#wpforms-submit-112.algemeenVerzendButton:disabled {
  background-color: #ccc;
  cursor: not-allowed;
  color: #666;
}

#wpforms-form-112 input.text, 
#wpforms-form-112 input.title, 
#wpforms-form-112 input[type=email], 
#wpforms-form-112 input[type=password], 
#wpforms-form-112 input[type=tel], 
#wpforms-form-112 input[type=text], 
#wpforms-form-112 select, 
#wpforms-form-112 textarea {
    background-color: #fff;
    border: 2px solid #a7b0d4 !important;
    color: #242121 !important;
}
div.wpforms-container-full .wpforms-confirmation-container-full, div[submit-success]>.wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
    background: #FFFFFF;
    border: 0px solid #C3D0DC; 
    box-sizing: border-box;
}
/* Voor alle placeholders op de site */
#wpforms-form-112 ::placeholder {
  color: #666666; /* Donkergrijs – pas aan naar wens */
  opacity: 1;     /* Zorgt dat het niet semi-transparant is */
}

/* Voor oudere browsers (Edge, Firefox) */
#wpforms-form-112 ::-webkit-input-placeholder {
  color: #666666;
  opacity: 1;
}
#wpforms-form-112 :-moz-placeholder {
  color: #666666;
  opacity: 1;
}
#wpforms-form-112 ::-moz-placeholder {
  color: #666666;
  opacity: 1;
}
#wpforms-form-112 :-ms-input-placeholder {
  color: #666666;
  opacity: 1;
}
/*
///////////////////////////////////////////////////////////////////// WOOCOMMERCE */

/* opmaak kruimelpad */
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) .woocommerce-breadcrumb a {
    color: #235bbc!important;
	font-weight: 600!important;
}

/* shop */
/* Verwijder hover-effect van productafbeelding */
.et_shop_image:hover img,
.et_shop_image:hover .et_overlay {
  transform: none !important;
  opacity: 1 !important;
}

/* Verwijder overlay helemaal (optioneel) */
.et_overlay {
  display: none !important;
}

/* Focus-stijl toevoegen aan hele productlink */
/* Hover/focus-stijl voor hele productlink */
.woocommerce-LoopProduct-link:hover,
.woocommerce-LoopProduct-link:focus,
.woocommerce-LoopProduct-link:focus-visible {
  outline: 3px solid #005fcc;  /* duidelijke blauwe rand */
  outline-offset: 4px;         /* ruimte tussen rand en element */
  border-radius: 4px;          /* optioneel: afgeronde hoekjes */
  text-decoration: none;       /* onderstreping weghalen */
}

/* Hover-effect van het plaatje weghalen (blijft actief uit vorige fix) */
.et_shop_image:hover img,
.et_shop_image:hover .et_overlay {
  transform: none !important;
  opacity: 1 !important;
}

.et_shop_image .et_overlay {
  display: none !important;
}
.woocommerce div.product form.cart div.quantity, .woocommerce-page div.product form.cart div.quantity {
    display: none;
}
/* afrekenen wagen en checkout */ 

/* weghalen appartemnent suite */
.wc-block-components-address-form__address_2-toggle {
  display: none!important;
}
/* voorkom gat tussen e-mailadres en factuurgegevens */
.wc-block-components-form .wc-block-components-checkout-step {
  margin: 0 0 -10px 0!important;
}
/*weghalen dunne lijntje bovenaan akkoord privacy :*/
.wc-block-checkout__terms.wc-block-checkout__terms--with-separator {
    border-top: 0px solid hsla(0, 0%, 7%, .11) !important;
}
.woocommerce-cart table.cart img, .woocommerce-checkout table.cart img {
    width: 120px;
}
/* aantal verwijderen uit tabel winkelmand */
th.product-quantity,
td.product-quantity{
	display:none; 
}
.et_pb_wc_checkout_payment_info_0_tb_body .woocommerce-checkout #payment{
    background: transparent !important;
    width: 100%;
}
/* button bestellen */
.woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
    float: left;
}
#OverzichtProductPrijs #order_review_heading{
	display: none!important;
}
/* foutmelding bij bv leeglaten verplichte velden in checkout */
ul.woocommerce-error li a {
    color: #FFF;
}


/* bevestiging allerlaatse pagina */
.page-id-133 .et_pb_wc_checkout_payment_info_0_tb_body .woocommerce-order p{
	margin-bottom: 20px; 
}

.page-id-133 ul.order_details li {
    margin-bottom: 20px;
}
.page-id-133 ul.order_details {
    margin: 0 0 3em -17px;
    list-style: none;
}
.page-id-133 ul.order_details li {
    font-size: .915em;
}
.page-id-133 ul.order_details li strong {
    display: block;
    font-size: 1.2em;
}

/* //////////////////////////////// einde woocommerce */
@media only screen and (min-width: 1100px) {
    #logo {
        max-height: 70%!important;
    }
}
@media only screen and (max-width: 1099px) {
	 #logo {
        max-height: 40%!important;
    }
	#et-top-navigation{
		padding-left: 0px!important; 
	}
	#top-menu li a {
    font-size: 17px;
}
}
@media only screen and (min-width: 981px) {

	/* menu padding aanpassen ivm betere weergave focus opmaak*/
    .et_header_style_left #et-top-navigation nav>ul>li>a, .et_header_style_split #et-top-navigation nav>ul>li>a {
        padding-bottom: 50px;
        padding-top: 10px;
    }
}

@media (max-width: 980px) {
    .et_header_style_left .et-search-form {
        width: 40% !important;
	}
}
@media only screen and (max-width: 768px) {
	 #logo {
        max-height: 60%!important;
    }
/* winkelmandje grootte */
#et-top-navigation .et-cart-info {
    float: left;
    margin: -6px 0 0 22px;
    font-size: 20px;
	}
/* menu bar */
#et_mobile_nav_menu {
    margin-top: -5px;
	}
/* grootte bar menu */
.mobile_menu_bar:before {
    font-size: 50px;
	}
/* zoekfunctie weg uit menu */
#et_top_search {
	display:none!important; 
	}
	
/* layout pagina's */
#main-content #left-area {
     width: 95%!important;
      padding-left: 3% !important;
 }

}