/*
 Theme Name:     Bureau Peters - Childtheme
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Bureau Peters - Childtheme
 Author:         Bureau Peters
 Author URI:     https://www.www.bureaupeters.nl
 Template:       Divi
 Version:        1.0.0
*/

/* LET OP, MAAK GEEN WIJZIGINGEN IN DIT DOCUMENT ZONDER UITRUKKELIJKE TOESTEMMING
------------------------------------------------------- */

/* Superfly Menu */
.sfm-menu {
  font-family: "Arial", "Helvetica" !important;
}

.sfm-logo {
  padding-bottom: 30px !important;
}

.sfm-style-full .sfm-sidebar-close {
  right: 0px !important;
}

.sfm-style-full .sfm-sidebar-close {
  display: block;
}

span.mobile_menu_bar:before {
  display: none;
}

#sfm-sidebar.sfm-hl-line .sfm-menu li.sfm-submenu-visible > a,
#sfm-sidebar.sfm-hl-line .sfm-menu li:hover > a,
#sfm-sidebar.sfm-hl-line .sfm-menu li > a:focus {
  background-color: transparent !important;
}

#sfm-sidebar .sfm-has-child-menu > .sfm-child-menu a {
  /* font-family: "circular-light", Georgia, "Arial", serif; */
  font-size: 16px !important;
}

/* Superfly align menu items to the top left*/

.sfm-full-single .sfm-nav {
	display:block !important;
}

.sfm-va-middle li {
	text-align:left !important;
}

.sfm-va-middle {
	margin-left:50px !important;
}

.sfm-child-menu {
	margin-left:40px !important;
}

/* Superfly CTA - Button in mobiele menu */

li.sfm-menu-item-XXX{
    background-color: white;
	color:black !important;
    margin-top: 50px!important;
    border-radius: 100px;
    width:200px !important;
}

li.sfm-menu-item-XXX a{
	color:black !important;
	margin-top:-7px !important;
	margin-bottom:-7px !important;
}


/*Remove table style */


table,
tr,
hr,
td {
  border: 1px solid rgba(193, 66, 66, 0);
}
table {
  border: 1px solid #ccc !important;
  border-collapse: collapse !important;
}

td {
  border: none !important;
}




.vertical-column {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* Important styling - do not edit */
#page-container {
  overflow: hidden;
}

/* Buttons inline */
.btn-inline .et_pb_button_module_wrapper {
  display: inline-block;
  margin: 0 0 0 5px;
}

/* Back to top */
.et_pb_scroll_top.et-pb-icon {
  background-color: #666 !important;
  z-index: 10000000 !important;
}

/* Header menu (Font weight and text-transform) */
#et-top-navigation {
  font-weight: 400 !important;
  text-transform: lowercase !important;
}

/* Remove dropdown icon */

#top-menu .menu-item-has-children > a:first-child:after {
  content: initial !important;
}

#top-menu .menu-item-has-children > a:first-child {
  margin-right: -10px !important;
}

/* Menu item spacing */

ul#top-menu li.menu-item:not(:last-child) {
  padding-right: 40px !important;
}

/* Fix button animation delay */
.et_pb_button:hover, .et_pb_button, .et_pb_button:after {
 transition: all 50ms ease-in!important;
}

/* Custom bullet points 

#main-content .et_pb_section ul li {
list-style-type: none;
list-style-position: inside;
text-indent: -1.4em;
}
#main-content .et_pb_section ul li:before {
content: "●";
padding-right: 10px;
padding-left:7px;
color:black !important;
font-size:0.8em !important;
}

*/

/* Succes message on forms */
.et-pb-contact-message {
    text-align:center;
    background:#deffde;

    border-radius: 15px;
}

.et-pb-contact-message span {
    padding:20px;
}

/* Remove blur animation */
.et_pb_animation_top.et-animated {
animation: none;
transition: 0s!important;
}

/* Remove white background from modal*/
.el_modal_popup .el_modal_popup_inner_wrap {
	background-color:rgba(255, 255, 255, 0) !important;
}

.mijn-lijst .cart-link {
    width:200px !important;
    height:50px !important;
    transform:scale(5) !important;
}


.bp-add-to-cart .qty {
    height:50px !important;
    width:63px !important;
    padding-left:14px !important;
}

.bp-add-to-cart .button {
    width:66px;
    height:50px;
    overflow:hidden !important;
    background-image:url("https://blok.bureaupeters.dev/wp-content/uploads/2021/06/mijn-lijst.svg") !important;
    background-size:cover !important;
    margin-left:-10px !important;
}

.bp-add-to-cart .button:hover {
    opacity:0.8;
}

.bp-description table  {
    width:100%;
}





.bp-description table td:first-child
  {
    width:60%;
}

.bp-description table td {

    padding-top:8px !important;
    padding-bottom:8px !important;
    padding-left:10px !important;
}

.bp-description table tr:first-child
  {
    width:100%;
    font-weight:700;
}

.bp-description table tr:not(:last-child) {
        border-bottom:1px solid #bfb5a3 !important;
}

.woocommerce .zoekbalk button.button{
    color:white !important;
    font-size:1px !important;

}






 .bp-filters .divi-filter-item {
    background-color: transparent !important;
}



 .bp-filters input[type='radio']:after {
        width: 11px;
        height: 11px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: white;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 4px solid white;
    }

    input[type='radio']:checked:after {
        width: 11px;
        height: 11px;
        border-radius: 15px;
        top: -2px;
        left: -1px;
        position: relative;
        background-color: black;
        content: '';
        display: inline-block;
        visibility: visible;
        border: 4px solid white;
    }
    
.bp-filters .radio-label {
    margin-left:7px !important;
}

.bp-filters .et_pb_contact_field_radio {
    margin-bottom:6px !important;
}

.woocommerce #content .quantity input.qty, .woocommerce-cart table.cart td.actions .coupon .input-text, .woocommerce-page #content .quantity input.qty, .woocommerce-page .quantity input.qty, .woocommerce .quantity input.qty {
    background-color:white !important;
    border:1px solid #DDDDDD !important;
    border-radius: 0px !important;
    color:black !important;
    margin-bottom:5px !important;
}

/* 2 column layout */
@media (min-width: 981px) {
  .woocommerce-checkout .woocommerce { overflow: hidden;}
  .woocommerce-checkout .woocommerce:after { clear: both; }
  .woocommerce-checkout .woocommerce .col2-set .col-1, .woocommerce-checkout .col2-set .col-1 { width: 100%; }
  .woocommerce-checkout .woocommerce .col2-set .col-2, .woocommerce-checkout 
 .woocommerce-page .col2-set .col-2 { display: none; }
 .woocommerce-checkout .woocommerce .col2-set, .woocommerce-checkout .woocommerce-page .col2-set { float:left; width: 48%; }
  .woocommerce-checkout #order_review_heading, .woocommerce-checkout .woocommerce #order_review, .woocommerce-checkout .woocommerce-page #order_review { 
    float: left; 
    width:48%; 
    margin-left: 4%; 
  }
}

.wp-checkout input{
    border-radius: 0px !important;
    border:1px solid black;
}

.wp-checkout .select2-selection--single{
    border-radius: 0px !important;
    border:1px solid black;
    height:50px !important;
    padding-top:10px;
}

b {
    position: absolute !important;
    top:23px !important;
    left:0px !important;
    border-color:black transparent transparent transparent !important;
}

#place_order {
    margin-top:30px;
}


/* container mijn lijst header */
.mijn-lijst-container {
    transition: 0.3s;
	cursor: pointer!important;
  }

.mijn-lijst-container:hover {
    background-color: #eeeae2;
  }

.mijn-lijst-container:hover .misha-cart{
    background-color: #FABA00;
  }
  
.misha-cart {
	background-color: white;
	width: 30px!important;
	height: 30px!important;
	border-radius: 50%!important;
	color: #2a2420!important;
	position: absolute!important;
	line-height: 30px!important;
	text-align: center!important;
	font-size: 16px!important;
	font-weight: bolder!important;
  	right: 12px;
  	top: 9px;
	transition: 0.3s;
	
}

.bp-add-to-cart .single_add_to_cart_button {
    position: relative;
    top:-2px;
}

.bc-link-whole-grid-card {
    margin-right:-1px;
    margin-bottom:-1px;
}


.divi-filter-loop-container>:not(.no-results-layout){
    grid-gap: 0px !important;
}

.bc-price-after {
    font-size:13px !important;
	color:#969696;
	margin-left:2px;
}

.bc-price-after {
    font-size:14px !important;
}

.divi-filter-loop-container>:not(.no-results-layout){
    grid-gap: 0px !important;
}

.product-type-simple { 
    margin-bottom:-1px !important;
}

.woocommerce-message {
  display: none !important;
}

#custom-toegevoegd-popup {
  animation: fadeInZoom 0.3s ease-out;
}

@keyframes fadeInZoom {
  from {
    opacity: 0;
    transform: scale(0.95) translate(-50%, -50%);
  }
  to {
    opacity: 1;
    transform: scale(1) translate(-50%, -50%);
  }
}



/* Basis styling voor de remove link (prullenbak) */
.woocommerce .product-remove a.remove {
  font-size: 0;
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url('https://blok.bureaupeters.dev/wp-content/uploads/2025/04/Blok-icon-prullebak.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: filter 0.3s ease;
  border: none;
  background-color: transparent;

  /* 🔥 voorkom standaard link-styling */
  color: transparent;
  text-decoration: none;
  outline: none;
}

/* Bij hover: prullenbak kleurt rood */
.woocommerce .product-remove a.remove:hover {
  filter: brightness(0) saturate(100%) invert(25%) sepia(92%) saturate(4405%) hue-rotate(356deg) brightness(101%) contrast(101%);
  color: transparent;
  text-decoration: none;
  outline: none;
}

/* 1. Prullenbak iets omhoog positioneren */
.woocommerce .product-remove a.remove {
  vertical-align: middle;
  position: relative;
  top: -2px; /* pas aan indien nodig, bv. -3px of -1px */
}

/* Forceer links uitlijnen van kolomtitels */
.woocommerce-cart-form .shop_table thead th {
  text-align: left !important;
  padding-left: 0 !important;
}

/* Zorg dat data-cellen netjes volgen */
.woocommerce-cart-form .shop_table tbody td {
  text-align: left;
  padding-left: 0 !important;
}

/* Alleen totaal en prullenbak rechts uitlijnen (zoals hoort) */
.woocommerce-cart-form .shop_table td.product-subtotal,
.woocommerce-cart-form .shop_table td.product-remove,
.woocommerce-cart-form .shop_table th.product-subtotal {
  text-align: left !important;
}


th.product-remove {
    display: none;
}



/* Labels */
.gform_wrapper.gravity-theme .gfield_label {
    display: inline-block !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    margin-bottom: 8px !important;
    padding: 0 !important;
}

/* Specifieke velden styling */
#field_2_1 {
    font-size: 30px !important;
    font-family: 'averta-regular' !important;
    line-height: 40px !important;
    padding-bottom: 37px !important;
}

/* Specifieke velden styling */
#field_2_3 {
    font-size: 30px !important;
    font-family: 'averta-regular' !important;
    line-height: 40px !important;
    padding-bottom: 37px !important;
}

#field_2_13 {
	font-size: 30px !important;
    font-family: 'averta-regular' !important;
    line-height: 40px !important;
    padding-top: 50px !important;
	padding-bottom: 37px !important;
}

/* Form grid spacing */
.gform_wrapper.gravity-theme .gform_fields {
    grid-column-gap: 7% !important;
}

.gform_wrapper.gravity-theme .gfield .ginput_container input:not([type="submit"]),
.gform_wrapper.gravity-theme .gfield .ginput_container select,
.gform_wrapper.gravity-theme .gfield .ginput_container textarea {
    padding: 16px !important;
}





/* Form title verbergen */
h2.gform_title {
    display: none !important;
}

/* Buttons styling */
/* Gravity Forms submit button specifiek targeten */
#gform_submit_button_2,
#gform_submit_button_2:hover {
    color: #fff !important;
    background: #FABA00 !important;
    border: none !important;
    border-radius: 0 !important;
    transition: background 0.3s ease, color 0.3s ease !important;
}

/* Hover effect */
#gform_submit_button_2:hover {
    background: #000 !important;
    color: #fff !important;
}

@media (max-width: 768px) {
  .gform_wrapper.gravity-theme .gform_fields {
    display: flex !important;
    flex-direction: column !important;
  }

  /* Optioneel: forceer volgorde als het niet goed zit */
  #field_2_3 { order: 1; } /* Contactpersoon */
  #field_2_1 { order: 5; } /* Bedrijfsgegevens */
  #field_2_6 { order: 2; } /* Volledige naam */
  #field_2_9 { order: 6; } /* Bedrijfsnaam */
  #field_2_7 { order: 3; } /* E-mailadres */
  #field_2_10 { order: 7; } /* KvK nummer */
  #field_2_8 { order: 4; } /* Telefoon */
  #field_2_12 { order: 8; } /* BTW nummer */
  #field_2_13 { order: 9; } /* Bericht label */
  #field_2_14 { order: 10; } /* Onderwerp */
  #field_2_15 { order: 11; } /* Bericht / vraag */
}

@media (max-width: 767px) {
    /* Mobile styling */
    #field_2_1 {
        font-size: 20px !important;
        line-height: 28px !important;
        padding-bottom: 25px !important;
		padding-top: 30px !important;
    }

    #field_2_3 {
        font-size: 20px !important;
        line-height: 28px !important;
        padding-bottom: 25px !important;
    }

    #field_2_13 {
        font-size: 22px !important;
        line-height: 30px !important;
        padding-top: 30px !important;
        padding-bottom: 25px !important;
    }
}
body.woocommerce-account:not(.logged-in) .login-box.et_pb_row {
  width: 25% !important;
}

@media (max-width: 1024px) {
  body.woocommerce-account:not(.logged-in) .login-box.et_pb_row {
    width: 80% !important;
    max-width: 100% !important;
  }
}

.custom-bg-slider {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  transition: background-image 1s ease-in-out;
}
.gform-confirmation-custom {
  background-color: #4BB0B8;
  color: white;
  font-family: 'Averta', sans-serif;
  font-size: 17px;
  line-height: 28px;
  padding: 16px 20px;
  max-width: 500px;
}

