/* ==========================================================================
   ROOT VARIABELEN (kleuren, theming)
   ========================================================================== */
:root {
	--color-primary-purple: #cc00cc;
  	--color-primary-green: #51cb20;
  	--color-secondary-light-green: #aeee95;
	--color-secondary-light-green-tint2: #c7ed82;
}

/* ==========================================================================
   NAVIGATIE
   ========================================================================== */
div.nav {
  	transform: translateY(130%);
}

/* ==========================================================================
   LAYOUT & STRUCTUUR
   ========================================================================== */
div#sitemain.site-main,
.content-area .site-main {
  	width: 100%;
}

.full-width-content {
  	width: 100%;
  	margin: 0 auto;
}

/* ==========================================================================
   HOME / HEADER / TYPOGRAPHY
   ========================================================================== */
.elementor-widget-heading .elementor-heading-title, 
h2 {
	color: var(--color-secondary-light-green-tint2) !important;
}

h1.elementor-heading-title.elementor-size-default, h2, h3 {
	font-size: 30px;
	color: var(--color-secondary-light-green) !important;
}

.header .header-inner .nav ul li a:hover, 
.header .header-inner .nav ul li.current_page_item a, 
a.wc-block-components-product-name {
	color: var(--color-secondary-light-green) !important;
}

p, span {
	color: #bababa !important;
}

/*
h1.entry-title, h1.page-title {
	background: none;
}
*/

.nivo-prevNav {
	margin-left: 10px;
}
.nivo-nextNav {
	margin-right: 10px;
}

/* ==========================================================================
   PRODUCT LIJST (animatie bij laden)
   ========================================================================== */
.products li.product:nth-child(1) {
  	opacity: 0;
  	transform: translateX(-50px);
  	animation: slideIn 0.5s ease-out forwards;
}
.products li.product:nth-child(2) {
  	opacity: 0;
  	transform: translateY(80px);
  	animation: slideIn 0.7s cubic-bezier(0.25, 1.25, 0.5, 1) forwards;
}
.products li.product:nth-child(3) {
  	opacity: 0;
  	transform: translateX(50px);
  	animation: slideIn 0.5s ease-out forwards;
}

.products li.product:nth-child(1) {
	animation-delay: 0.1s;
}
.products li.product:nth-child(2) {
  	animation-delay: 0.3s;
}
.products li.product:nth-child(3) {
  	animation-delay: 0.1s;
}

@keyframes slideIn {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ==========================================================================
   PRODUCTKNOPPEN (add to cart)
   ========================================================================== */
li.product > a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
	font-size: 15px;
	text-align: center;
  	width: -webkit-fill-available;
	background-color: var(--color-primary-purple);
	color: #fff;
	padding:1rem;
}

a.wp-block-button__link.add_to_cart_button.ajax_add_to_cart {
	font-size: 15px;
	text-align: center;
  	width: -webkit-fill-available;
	background-color: var(--color-primary-purple);
	color: #fff;
	padding:1rem;
	border-radius: 5px;
}

span.woocommerce-Price-amount.amount {
	color: var(--color-secondary-light-green-tint2);
}

/* ==========================================================================
   VOORTGANG AFBEELDING AANTAL SALES
   ========================================================================== */
div.progress-container {
	display: flex;
	gap: 2.5rem;
	flex-wrap: wrap;
}

/* ==========================================================================
   SINGLE PRODUCT PAGINA
   ========================================================================== */
/*
div#slider-page > .product-page-slider {
	display: none;
}

div#slider-page {
	margin-top: 7rem;
}
*/

.related.products {
	display: inline-block;
}

.product-sku {
	margin-top: .5rem;
}

.product-sku-ruler {
    border: none;
  	height: 1px;
  	background-color: lightgray;
}

h1.entry-title {
  	text-align: left;
}

.stock.in-stock {
  	margin-bottom: .5rem;
}

.summary.entry-summary > form.cart {
  	display: flex;
  	align-items: center;
}

div.quantity > input.input-text.qty.text {
  	padding: .3em;
}

button.single_add_to_cart_button.button.alt {
  	padding: .9em;
}

.woocommerce-products-header {
    display: none;
}

/* ==========================================================================
   CHECKOUT PAGINA
   ========================================================================== */
p#billing_country_field {
  	display: none;
}

h3#order_review_heading,
.cart_item {
  	color: #676767;
}

div.col-2.order_review-overview {
  	background-color: #fff;
  	padding: .8rem;
}

.interest-total {
	display: flex;
    justify-content: space-between;
	font: normal 18px Oswald;
	font-weight: 600;
	color: #676767;
	margin-bottom: 1rem;
}

.woocommerce-Price-amount.interest-amount {
	color: var(--color-secondary-light-green-tint2);
}

.woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
	float: none;
	background-color: var(--color-primary-purple);
	border-radius: 5px;
	width: -webkit-fill-available;
	font-size: 1rem;
	padding: 1rem;
}

#inform_others_emails_field { 
	display: none; 
}

p#inform_others_emails_field > label > span.optional {
	display: none;
}

div.wc-block-cart__submit-container > a.wc-block-components-button.wp-element-button.wc-block-cart__submit-button.contained {
	font-size: 16px;
	font-weight: 600; 
	background-color: var(--color-primary-purple);
	border-radius: 5px;
	color: #fff;
}

span.privacy > a {
	color: var(--color-primary-purple) !important;
	text-decoration: underline;
}

span.let-op {
	color: var(--color-secondary-light-green-tint2) !important;
}

.woocommerce-checkout #payment ul.payment_methods li label[for="payment_method_pronamic_pay_credit_card"] > img {
  margin-left: 43px;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
#footer .footer-top {
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    -o-box-shadow: none;
	border-bottom: 1px solid #595959;
}

div#footer > div.footer-top {
	padding: 2rem;
	background-color: #303030;
}

div.footer-top > div.middle-align {
	margin: 1.8rem auto 1.5rem;
}

div.footer-columns {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
}

div.footer-column {
	margin-right: 0;
}

.footer-column.first,
.footer-column.second,
.footer-column.last {
	text-align: center;
}

.footer-button {
	font-weight: 600;
	color: #fff;
	background-color: var(--color-primary-purple);
	border-radius: 5px;
	padding: 10px;
}

div.afm-img {
	margin-top: 2.5rem;
}

/* ==========================================================================
   RESPONSIVE STIJL (mobiel, <500px)
   ========================================================================== */
/* header overflow */
@media (min-width: 981px) and (max-width: 1050px) {
	.header, #slider-page {
    	width: 107%;
  	}
}
@media (min-width: 938px) and (max-width: 980px) {
	.header, #slider-page {
    	width: 112%;
  	}
}

/* Content blokken home page mobile view (zwrtruimte) */
@media(max-width: 766px) {
	div.elementor-element.elementor-element-cc18ba3.e-con-full.e-flex.e-con.e-child {
		display: inherit !important;
	}
}

/* product colums */
@media(max-width: 500px) {
  ul.products.columns-3 {
	  display: flex;
	  flex-direction: column;
  }

  .woocommerce ul.products[class*=columns-] li.product,
  .woocommerce-page ul.products[class*=columns-] li.product {
	  width: 100%;
  }
}

/* Footer butons */
@media(max-width: 500px) {
	div.footer-columns {
		flex-direction: column;
	}
}
