/**
 * Overrides voor Bootstrap e.d. 
 * Laadt na alle parent-theme styles.
 */

/* General */
p, ul li, span, a {
	font-size: 18px;
}

small, .small {
	font-size: 1rem !important;
}

span.inline p {
	display: inline;
}

ul.wp-block-list {
	list-style-type: disc;
	margin-left: 1rem;
	margin-bottom: 1rem;
}

ol.list-decimal {
	list-style-type: decimal;
}

h1, h2, a h2 {
	color: hsl(var(--primary));
}

h1.banner-header {
	color: hsl(var(--foreground));
}

.entry-content h1 {
	margin-bottom: 1rem;
}

.entry-content h2.wp-block-heading {
	font-size: 1.5rem;
}

.entry-content h3.wp-block-heading {
	font-size: 1.3rem;
	color: hsl(var(--primary)) !important;
}

.entry-content p {
	margin-bottom: 1rem;
}

.bg-primary h1, .bg-primary h2, .bg-primary h3, .bg-primary h4 {
	color: #fff !important;
}

a:hover, a:focus, a:hover h2, a:focus h2 {
	color: hsl(var(--accent)) !important;
}

.bg-primary {
	background-color: hsl(var(--primary)) !important;
}

a.bg-primary:hover,
a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
	background-color: hsl(var(--primary) / 0.9) !important;
}

a.hover\:bg-accent\/90:hover, a.hover\:bg-accent\/90:focus {
	background-color: hsl(var(--accent) / .9);
	color: #fff !important;
}

.py-5 {
    padding-top: 1.25rem !important;
    padding-bottom: 1.25rem !important;
}

.edescoot-layout .bg-card\/95 {
	background-color: hsl(var(--card) / 0.95) !important;
}

#main-content .info {
	text-align: center;
}

#main-content .kop-tekst p {
	margin-bottom: 1rem;
}

@media (min-width: 768px) {
    .section-container {
		padding-top: 2rem;
        padding-bottom: 2rem;
	}
}

/* Header+ Menu */
@media (min-width: 1024px) {
    .lg\:flex {
        display: flex !important;
    }
    .lg\:hidden {
        display: none !important;
    }
}

@media (min-width: 1024px) and (max-width: 1260px) {
	header nav ul li a.px-4 {
		padding: .625rem !important;
	}
} 

@media screen and (max-width:768px) {
	.sticky {
		position: relative;
	}

	#edescoot-mobile-menu .wpmenucart-contents {
		padding: 1rem 1.5rem;
	}
}

.woocommerce header nav img, .woocommerce-page  header nav img {
    height: 4rem;
    max-width: 100%;
}
.text-accent {
  color:hsl(var(--accent)) !important;
}

.text-lg {
    font-size: 1.125rem !important;
    line-height: 1.7 !important;
}

input[type="submit"].bg-accent,
button.bg-accent[type="submit"],
.wpcf7 input[type="submit"].bg-accent {
	background-color: hsl(var(--accent)) !important;
	color: hsl(var(--accent-foreground)) !important;
	border-color: transparent !important;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

input[type="submit"].bg-accent:hover,
button.bg-accent[type="submit"]:hover,
.wpcf7 input[type="submit"].bg-accent:hover {
	background-color: hsl(var(--accent-hover)) !important;
	color: hsl(var(--accent-foreground)) !important;
}
a.bg-secondary, a.bg-secondary:hover, a.bg-secondary:focus, button.bg-secondary:hover, button.bg-secondary:focus {
    background-color: hsl(var(--secondary)) !important;
}

#wpmenucartli {
	color: hsl(var(--primary)) !important;
}

/* Cart in menu */ 
li.wpmenucartli a.wpmenucart-contents span {
	width: 1ch;
    overflow: hidden;
    white-space: nowrap;
	font-size: 12pt;
	display: inline-block;
    position: absolute;
    top: 20px;
}

/* Banner */
a.buttonleft {
	color: #fff !important;
}
a.buttonleft:hover, a.buttonright:focus {
	color: hsl(var(--secondary)) !important;
}
a.buttonright {
	color: hsl(var(--primary)) !important;
}
a.buttonright:hover, a.buttonright:focus {
	color: hsl(var(--secondary)) !important;
}

.banner .buttons {
	padding-bottom: 2rem;
}

/* Sectie Welkom */ 
.text-primary {
    color: hsl(var(--primary)) !important;
}
.text-muted-foreground {
    color: hsl(var(--muted-foreground)) !important;
}
.leading-relaxed {
    line-height: 1.625 !important;
}
.text-lg {
    font-size: 1.125rem !important;
    line-height: 1.7 !important;
}
input[type=submit].text-lg {
	line-height: 0.2 !important;
	margin-top: 2rem;
}

.min-h-\[80px\] {
    min-height: 200px;
}

/* Sectie Video */
section.video {
	padding: 100px 0;
}

section.video h3 {
	color: hsl(var(--primary));
}

section.video h3 span.orange {
	color: hsl(var(--accent));
	font-size: inherit;
}

section.video p {
	font-size: 15px;
	margin-bottom: 0.5rem;
}

section.video .buttons {
	margin-top: 1rem;
}

section.video .buttons a {
	width: 200px;
	margin-top: 1rem;
}

section.video .buttons a.buttonright {
	background-color: hsl(var(--primary));
	color: #fff !important;
}

section.video .buttons a.buttonright:hover, section.video .buttons a.buttonright:focus {
	background-color: #fff;
	color: hsl(var(--primary)) !important;
}

section.video video {
	margin-top: 0.5rem;
}

@media screen and (max-width: 992) {
	section.video .right {
		padding: 0 2rem;
	}	
	section.video .buttons {
		margin-bottom: 1rem;
	}
	section.video .buttons a {
		margin: 0;
	}
	section.video p, section.video h3 {
		text-align: center;
	}
}

@media screen and (min-width:992px) and (max-width: 1199px)
{
	section.video video {
		margin: auto 0 !important;
	}
}

/* Contact + Offerte aanvragen */
form label {
	margin: 0.5rem 0 0 0; 
}

.woocommerce-variation-add-to-cart button, .woocommerce-variation-add-to-cart p {
	width: 100%;
	float: none;
	text-align: center;
	margin: 0 auto;
}

.woocommerce div.product form.cart .woocommerce-variation-add-to-cart button.button {
	margin-top: 0.5rem;
	float: none;
	padding: 1rem;
	text-align: center;
}

.woocommerce div.product form.cart .woocommerce-variation-add-to-cart button.button:hover, .woocommerce div.product form.cart .woocommerce-variation-add-to-cart button.button:focus {
	background-color: hsl(var(--accent));
	color: #fff !important;
}

.woocommerce-variation-add-to-cart button.button:hover a, .woocommerce-variation-add-to-cart button.button:focus a {
	background-color: transparent !important;
	color: #fff !important;
	text-align: center;
}

.woocommerce-variation-add-to-cart p, .wc-proceed-to-checkout p {
	margin-top: 0.5rem;
}

.woocommerce-variation-add-to-cart p a, .wc-proceed-to-checkout p a {
	cursor: pointer;
}

.woocommerce-variation-add-to-cart button a {
	padding: 0 !important;
	background-color: transparent !important;
	text-align: center;
}

a.popup-trigger {
	text-align: center;
	display: block;
}

.wc-proceed-to-checkout p a.popup-trigger:hover, .wc-proceed-to-checkout p a.popup-trigger:focus, .woocommerce-cart-form__cart-item a:hover, .woocommerce-cart-form__cart-item a:focus {
	color: hsl(var(--accent)) !important;
}

:where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button:focus {
	background-color: hsl(var(--accent));
	color: #fff !important;
}

.woocommerce .wc-proceed-to-checkout button.button {
	width:100%;
	padding: 1rem;
}

.woocommerce .wc-proceed-to-checkout button.button a {
	background-color: transparent !important;
}

.woocommerce .wc-proceed-to-checkout button.button a {
	color: #515151;
	font-size: 1rem;
}

.woocommerce .wc-proceed-to-checkout button.button:hover, .woocommerce .wc-proceed-to-checkout button.button:focus, .woocommerce .wc-proceed-to-checkout button.button:hover a, .woocommerce button.button:focus {
	color: #fff !important;
}

@media screen and (max-width:768px) {
	.contact .col-12 {
		margin-bottom: 2rem;
	}
}

/* WooCommerce archive / content-product */
/* content volle breedte van de container */
.woocommerce .container .row > main#primary.content-area,
.woocommerce .container .row > #primary,
.woocommerce-cart .container .row > #primary,
body.woocommerce .container .row > main {
	flex: 0 0 100% !important;
	max-width: 100% !important;
	width: 100% !important;
	min-width: 0;
}
.post-type-archive-product #primary.content-area,
.post-type-archive-product .site-content,
.post-type-archive-product .section,
.post-type-archive-product .entry-content {
	max-width: none !important;
	width: 100% !important;
}
.post-type-archive-product #primary.content-area {
	flex: 0 0 100% !important;
}

main#primary {
	padding: 100px 0;
}

.entry-summary {
    margin: 0 !important;
}

h3.text-foreground:hover, h3.text-foreground:focus {
	color: hsl(var(--accent));
}

@media screen and (max-width:768px) {
	.woocommerce .columns-3, article.product .entry-summary, article.product .woocommerce-product-gallery, article.product .related.products {
		padding: 0 50px;
	}
}

/* Prijs in catalogus */
.product {
    position: relative;
	min-height: 400px;
}
.price-tag {
    position: absolute;
    top: 10px;
    right: 10px;
    background: hsl(var(--accent));
    color: white;
    padding: 4px 15px;
    border-radius: 25px;
	font-weight: bold;
    z-index: 1;
	top: 80px;
}

/* Product pagina */
.single-product main#primary, .woocommerce-cart main#primary {
	padding: 50px 0;
}

.woocommerce-product-details__short-description h2 {
	font-size: 1.5rem;
}

ul.vinkjes li:before, .woocommerce-product-details__short-description ul li:before, .woocommerce .short-description ul li:before {
	content: '\2713';
	padding-right: 9px;
}

.woocommerce .short-description h2 {
	font-size: 1rem;
	min-height: 3rem;
	line-height: 1.5rem;
	vertical-align: top;
} 

.woocommerce div.product form.cart .reset_variations {
	display: none !important;
}

.woocommerce div.product form.cart table.variations th.label, .woocommerce table.variations td.value {
	padding: 0 1rem;
	line-height: 1.5rem;
	font-size: 1rem;	
    vertical-align: bottom;
}
.woocommerce div.product form.cart table.variations th.label{
	vertical-align: top;
}

.woocommerce-variation-add-to-cart {
	display: flex;
	flex-direction: column;
}

/* Prijs */
.price {
	color: hsl(var(--primary)) !important;
}

.woocommerce div.wapf-product-totals span.price {
	font-size: 18px !important;
}

.woocommerce .wapf-grand-total.price.amount {
	font-weight: bold;
}

/* Aanbetaling */
.awcdp-deposits-wrapper .awcdp-deposits-option {
	width: 100%;
}

.awcdp-deposits-wrapper .awcdp-deposits-option .awcdp-radio input[type=radio]+.awcdp-radio-label {
	line-height: 24px;
	font-size: 18px;
}

.awcdp-deposits-wrapper .awcdp-deposits-option .awcdp-radio .awcdp-deposits-description {
	margin-left: 2rem;
	font-size: 18px;
}

/* Opties */
.wapf {
	order: 3;
	display: flex;
	flex-direction: column;
}

.wapf-wrapper {
	order: 2;
}

.options h3 {
	font-size: 1.2rem;
	color: hsl(var(--primary));
	margin-top: 2rem;
}

.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price, .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price {
	font-size: 2rem;
}

p.price span {
	font-size: 2rem;
}

.woocommerce div.product .woocommerce-product-gallery__wrapper {
	padding: 10%;
}

/*
 * Flexslider zet inline width op .woocommerce-product-gallery__wrapper (alle slides) en op elke
 * .woocommerce-product-gallery__image (≈ viewportbreedte). Dat is normaal; layout breekt als de kolom
 * niet mag krimpen of de strip naar buiten drukt. Galerij begrenzen + viewport forceren.
 */
.woocommerce div.product {
	min-width: 0;
	max-width: 100%;
}

.woocommerce div.product .woocommerce-product-gallery {
	max-width: min(100%, 36rem);
	margin-left: auto;
	margin-right: auto;
	overflow-x: hidden;
}

.woocommerce div.product .woocommerce-product-gallery .flex-viewport {
	width: 100% !important;
	max-width: 100% !important;
	max-height: min(75vh, 34rem) !important;
	box-sizing: border-box;
}

.woocommerce div.product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image img {
	width: 100% !important;
	height: auto !important;
	max-height: min(75vh, 34rem);
	object-fit: contain;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li {
	overflow: hidden;
}

.woocommerce div.product .woocommerce-product-gallery .flex-control-thumbs li img {
	width: 100% !important;
	height: auto !important;
	max-height: 5rem !important;
	aspect-ratio: 1;
	object-fit: cover;
	display: block;
}

.related .products {
	margin-top: 50px;
}

.product_meta {
    display: none;
}

.wapf-field-input input[type=checkbox], .wapf-field-input input[type=radio] {
	margin-top: 8px;
}

@media screen and (max-width:768px) {
	article.product .woocommerce-tabs, article.product .entry-header {
		padding: 0 15px;
	}

	article.product .entry-content table {
		width: 90%;
	}

	.woocommerce div.product .woocommerce-tabs ul.tabs {
		padding: 0;
	}
}

/* Winkelwagen */ 
.woocommerce-cart h1 {
	margin-bottom: 2rem;
}

table.shop_table_responsive tr td.product-remove a {
	text-align: center;
}

.woocommerce-cart table.cart td.actions .coupon .input-text {
	width: auto;
}

.wc-proceed-to-checkout a.checkout-button:hover, .wc-proceed-to-checkout a.checkout-button:focus
{
    color: #fff !important;
}

.cart-collaterals .wc-proceed-to-checkout .options {
	display: none;
}

@media screen and (max-width:768px) {
	.woocommerce-cart-form, .cart-collaterals, .page .entry-content h1 {
		padding: 0 15px;
	}

	.woocommerce-cart-form .coupon button[type=submit] {
		float: none !important;
		width: 100% !important;
		margin-top: 0.5rem;
	}

	.woocommerce-cart-form .coupon input[type=text] {
		width: 100% !important;
	}
}

/* Product add-to-cart */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, p.no-comments {
	background-color: hsl(var(--accent)) !important;
	font-size: 1.25rem;
	border-top: none;
	margin-top: 1rem;
}

.woocommerce-message a, .woocommerce-info a, .woocommerce-error a {
	font-size: 1.25rem;
}


.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt {
	background-color: hsl(var(--primary)) !important;
	font-size: 1.25rem;
}

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce #respond input#submit.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce a.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce button.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor)) .woocommerce input.button.alt:hover {
	background-color: hsl(var(--accent)) !important;
}

.woocommerce .woocommerce-error .button, .woocommerce .woocommerce-info .button, .woocommerce .woocommerce-message .button, .woocommerce-page .woocommerce-error .button, .woocommerce-page .woocommerce-info .button, .woocommerce-page .woocommerce-message .button {
    margin-left: 30px;
}

.woocommerce-message::before {
    content: "\e015";
    color: hsl(var(--primary)) ;
}

.woocommerce .quantity .qty {
    font-size: 1.3rem;
}
.woocommerce-cart .quantity .qty {
	font-size: 1rem;
}

.woocommerce .quantity input[type=number]::-webkit-inner-spin-button,
.woocommerce .quantity input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

.woocommerce .woocommerce-message .button.wc-forward {
    margin-left: 30px;
	font-size: 1.3rem;
	float: right;
}

/* Productbeschrijving */
.woocommerce-tabs h4, .woocommerce-tabs th, .woocommerce-tabs td {
	font-size: 1.2rem;
	margin-top: 1rem;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.additional_information_tab {
	display: none;
}

@media screen and (max-width:768px) {
	.woocommerce .woocommerce-message .button.wc-forward {
		margin: 0 auto;
	}
}

/* Afrekenen */ 
.woocommerce-checkout form p.form-row-first, .woocommerce-checkout form p.form-row-last  {
	width: 100%;
	float: none;
}

.woocommerce-checkout .form-row { 
	display: block;
}

.woocommerce-checkout .form-row label { 
	line-height: 1.25rem;
	margin-bottom: 0;
}

.woocommerce-checkout form .form-row .input-text, .woocommerce-checkout form .form-row textarea {
	width: 60%;
}

.woocommerce-checkout form .form-row textarea {
	min-height: 200px;
}

.woocommerce-checkout form .form-row .select2-container {
	width: 60% !important;
}

.woocommerce-privacy-policy-text {
	padding: 1em 0;
}

.woocommerce-checkout-payment {
	margin-top: 2rem;
}

.woocommerce-checkout #payment #place_order, .woocommerce-page #payment #place_order {
	float: none;
}

.woocommerce-checkout .woocommerce-additional-fields {
	margin-top: 2rem;
}

#order_review_heading {
	margin: 2rem 0 15px 15px;
}

#order_review {
	padding: 0 15px;
}

@media screen and (max-width:992px) {
	.woocommerce table.shop_table, .woocommerce-checkout-payment {
		width: 90%;
	}
}

@media screen and (max-width:768px) {
	.woocommerce-checkout form .form-row .input-text, .woocommerce-checkout form .form-row textarea {
		width: 90%;
	}
}

/* Diensten */ 
.services .card-elevated {
	text-align: center;
	min-height: 335px;
}

.card-elevated > div {
	margin: 0 auto;
}

@media (min-width: 768px) and (max-width: 1024px) {
    .services .card-elevated {
		min-height: 460px;
	}
}

/* FAQ */  
.space-y-12 h2 {
	margin-top: 54px !important;
}

.pb-5 {
	padding-bottom: 1.25rem !important;
}

.card-elevated .accordion-content {
	text-align: left;
}

/* Pop-up */
.es-popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: auto;
}
.es-popup-inner {
    background: white;
    padding: 32px;
    border-radius: 8px;
    max-width: 768px;
    width: 90%;
    position: relative;
	height: 80%;
	text-align: left;
	overflow: scroll;
    pointer-events: auto;
}

#popup-contact {
	max-height: 200px;
	font-size: 1.2rem;
}

#popup-contact p  {
	text-align: center;
}

.es-popup-inner .es-popup-close {
    position: absolute;
    top: 12px;
    right: 16px;
	text-align: right;
    font-size: 24px;
    cursor: pointer;
    background: none;
    border: none;
}

.es-popup-inner .es-popup-content p {
	text-align: left;
}

.es-popup-inner ul {
	margin-bottom: 1rem;
	text-align: left;
}

.es-popup-inner ul li {
	list-style-type: disc;
	margin-left: 1rem;
}

/* Over ons */ 
.over-ons .over-ons-foto {
	flex: 2;
}

.over-ons .over-ons-foto .over-ons-foto-img {
	width: 100%;
}

.over-ons .over-ons-tekst {
	flex: 3;
	margin-top: 0 !important;
}

.over-ons .over-ons-tekst p {
	margin-bottom: 0.5rem;
}

/* scootmobiel-kopen-ede */ 
.assortiment {
	padding: 50px 1rem;
}

.assortiment a:focus {
	border: none;
}

.assortiment .assortiment-info {
	font-size: 1.2rem;
	text-align: center;
}

.assortiment img {
	min-height: 300px;
}

@media screen and (min-width: 1200px) {
	.assortiment {
		padding: 50px 0;
	}
	.assortiment img {
		min-height: auto;
	}
}

@media screen and (min-width:768px) and (max-width: 992px) {
	.assortiment {
		padding: 50px 100px;
	}
}

@media screen and (max-width:768px) {
	.over-ons-sectie1 {
		display: block;
	}

	.over-ons .over-ons-foto {
		padding: 1rem;
	}

	.assortiment {
		padding: 50px 100px;
	}

	.assortiment img {
		min-height: auto;
	}
}