/**
 * Scents of Dubai – huisstijl voor de WooCommerce winkelwagen- en afrekenblokken.
 * Wordt alleen geladen op de winkelwagen- en afrekenpagina (zie inc/woocommerce.php).
 */

.woocommerce-cart,
.woocommerce-checkout {
	--sod-brown: #705738;
	--sod-gold: #ab8e67;
	--sod-cream: #f6f3ef;
	--sod-line: #e9e2d8;
	--sod-text: #0a0a0a;
	--sod-muted: #666666;
	--sod-font: "Jost", sans-serif;
}

/* ---------- Layout & paginatitel ---------- */

.woocommerce-cart #page-wrapper,
.woocommerce-checkout #page-wrapper {
	padding: 40px 0 70px;
}

.woocommerce-cart #content.container,
.woocommerce-checkout #content.container {
	max-width: 1280px;
	padding-left: 20px;
	padding-right: 20px;
}

.woocommerce-cart #content > .row,
.woocommerce-checkout #content > .row {
	margin-left: 0;
	margin-right: 0;
}

.woocommerce-cart #primary,
.woocommerce-checkout #primary {
	padding-left: 0;
	padding-right: 0;
}

.woocommerce-cart .entry-header,
.woocommerce-checkout .entry-header {
	margin-bottom: 28px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--sod-line);
}

.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title {
	margin: 0;
	font-family: var(--sod-font);
	font-size: 38px;
	font-weight: 500;
	line-height: 1.2;
	color: var(--sod-text);
}

.woocommerce-cart .entry-footer,
.woocommerce-checkout .entry-footer {
	font-family: var(--sod-font);
	font-size: 13px;
}

.woocommerce-cart .entry-footer a,
.woocommerce-checkout .entry-footer a {
	color: var(--sod-muted);
}

/* ---------- Basis typografie ---------- */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.wp-block-woocommerce-cart button,
.wp-block-woocommerce-checkout button,
.wp-block-woocommerce-cart input,
.wp-block-woocommerce-checkout input,
.wp-block-woocommerce-checkout select,
.wp-block-woocommerce-checkout textarea {
	font-family: var(--sod-font);
}

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
	color: var(--sod-text);
}

.wp-block-woocommerce-cart a,
.wp-block-woocommerce-checkout a {
	color: var(--sod-brown);
}

.wp-block-woocommerce-cart a:hover,
.wp-block-woocommerce-checkout a:hover {
	color: var(--sod-gold);
}

.wp-block-woocommerce-checkout .wc-block-components-title.wc-block-components-title,
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__title {
	font-family: var(--sod-font);
	font-size: 20px;
	font-weight: 500;
	color: var(--sod-text);
}

.wp-block-woocommerce-checkout .wc-block-components-checkout-step__description,
.wp-block-woocommerce-checkout .wc-block-checkout__terms,
.wp-block-woocommerce-cart .wc-block-components-totals-item__description,
.wp-block-woocommerce-checkout .wc-block-components-totals-item__description {
	color: var(--sod-muted);
}

/* Kopregels (Product / Totaal / Totalen winkelwagen) */
.wp-block-woocommerce-cart .wc-block-cart-items__header,
.wp-block-woocommerce-cart .wc-block-cart__totals-title.wc-block-cart__totals-title {
	font-family: var(--sod-font);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--sod-muted);
}

.wp-block-woocommerce-cart .wc-block-cart-items__header {
	border-bottom-color: var(--sod-line);
}

/* ---------- Producten ---------- */

.wp-block-woocommerce-cart .wc-block-cart-items td,
.wp-block-woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row {
	border-color: var(--sod-line);
}

.wp-block-woocommerce-cart .wc-block-cart-item__image img,
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image img {
	border-radius: 8px;
	background: #fff;
}

.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image {
	border-radius: 8px;
}

.wp-block-woocommerce-cart .wc-block-components-product-name,
.wp-block-woocommerce-checkout .wc-block-components-product-name {
	font-size: 16px;
	font-weight: 500;
	color: var(--sod-text);
	text-decoration: none;
}

.wp-block-woocommerce-cart a.wc-block-components-product-name:hover {
	color: var(--sod-brown);
}

.wp-block-woocommerce-cart .wc-block-components-product-metadata,
.wp-block-woocommerce-checkout .wc-block-components-product-metadata {
	color: var(--sod-muted);
}

.wp-block-woocommerce-cart .wc-block-components-product-price,
.wp-block-woocommerce-cart .wc-block-cart-item__total .wc-block-components-formatted-money-amount {
	font-weight: 500;
	color: var(--sod-text);
}

.wp-block-woocommerce-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item__quantity {
	background: var(--sod-brown);
	border-color: var(--sod-cream);
	color: #fff;
	box-shadow: none;
}

.wp-block-woocommerce-checkout .wc-block-components-order-summary .wc-block-components-order-summary-item__quantity span {
	color: #fff;
}

/* Aantal-selector als pil, zoals op de productpagina */
.wp-block-woocommerce-cart .wc-block-components-quantity-selector {
	border-radius: 50px;
	overflow: hidden;
}

.wp-block-woocommerce-cart .wc-block-components-quantity-selector::after {
	border-color: var(--sod-line);
	border-radius: 50px;
	opacity: 1;
}

.wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	color: var(--sod-brown);
}

.wp-block-woocommerce-cart .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button:hover {
	background: var(--sod-cream);
}

.wp-block-woocommerce-cart .wc-block-cart-item__remove-link {
	color: var(--sod-muted);
}

.wp-block-woocommerce-cart .wc-block-cart-item__remove-link:hover {
	color: var(--sod-brown);
}

/* ---------- Totalen / besteloverzicht ---------- */

.wp-block-woocommerce-cart .wp-block-woocommerce-cart-totals-block,
.wp-block-woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block {
	background: var(--sod-cream);
	border: 0;
	border-radius: 12px;
	padding: 20px 4px;
}

.wp-block-woocommerce-cart .wp-block-woocommerce-cart-totals-block {
	padding: 20px 20px 24px;
}

.wp-block-woocommerce-cart .wp-block-woocommerce-cart-totals-block .wc-block-cart__totals-title {
	padding-top: 0;
}

.wp-block-woocommerce-cart .wc-block-components-totals-wrapper,
.wp-block-woocommerce-checkout .wc-block-components-totals-wrapper,
.wp-block-woocommerce-checkout .wc-block-components-checkout-order-summary__title,
.wp-block-woocommerce-checkout .wc-block-components-order-summary {
	border-color: var(--sod-line);
}

.wp-block-woocommerce-cart .wc-block-components-totals-footer-item,
.wp-block-woocommerce-checkout .wc-block-components-totals-footer-item {
	color: var(--sod-text);
}

.wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
.wp-block-woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__label {
	font-weight: 500;
}

.wp-block-woocommerce-cart .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wp-block-woocommerce-checkout .wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
	font-weight: 600;
	color: var(--sod-brown);
}

.wp-block-woocommerce-cart .wc-block-components-panel__button,
.wp-block-woocommerce-checkout .wc-block-components-panel__button {
	font-weight: 500;
	color: var(--sod-text);
}

.wp-block-woocommerce-cart .wc-block-components-panel__button:hover,
.wp-block-woocommerce-checkout .wc-block-components-panel__button:hover {
	color: var(--sod-brown);
}

/* ---------- Knoppen ---------- */

.wp-block-woocommerce-cart .wc-block-components-button:not(.is-link),
.wp-block-woocommerce-checkout .wc-block-components-button:not(.is-link) {
	min-height: 48px;
	padding: 10px 28px;
	border: 0;
	border-radius: 50px;
	background-color: var(--sod-brown);
	color: #fff;
	font-family: var(--sod-font);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	box-shadow: none;
	transition: background-color 0.2s ease;
}

.wp-block-woocommerce-cart .wc-block-components-button:not(.is-link):hover,
.wp-block-woocommerce-cart .wc-block-components-button:not(.is-link):focus,
.wp-block-woocommerce-checkout .wc-block-components-button:not(.is-link):hover,
.wp-block-woocommerce-checkout .wc-block-components-button:not(.is-link):focus {
	background-color: var(--sod-gold);
	color: #fff;
}

.wp-block-woocommerce-cart .wc-block-components-button:not(.is-link):focus-visible,
.wp-block-woocommerce-checkout .wc-block-components-button:not(.is-link):focus-visible {
	outline: 2px solid var(--sod-brown);
	outline-offset: 2px;
}

.wp-block-woocommerce-cart .wc-block-components-button:not(.is-link):disabled,
.wp-block-woocommerce-checkout .wc-block-components-button:not(.is-link):disabled {
	background-color: var(--sod-gold);
	opacity: 0.6;
}

/* Coupon "Toepassen" iets compacter */
.wp-block-woocommerce-cart .wc-block-components-totals-coupon__button.wc-block-components-button,
.wp-block-woocommerce-checkout .wc-block-components-totals-coupon__button.wc-block-components-button {
	min-height: 50px;
	padding: 0 22px;
	font-size: 13px;
}

.wp-block-woocommerce-cart .wc-block-components-button.is-link,
.wp-block-woocommerce-checkout .wc-block-components-button.is-link,
.wp-block-woocommerce-checkout .wc-block-components-address-form__address_2-toggle {
	color: var(--sod-brown);
}

/* ---------- Formuliervelden ---------- */

.wp-block-woocommerce-cart .wc-block-components-text-input input,
.wp-block-woocommerce-checkout .wc-block-components-text-input input,
.wp-block-woocommerce-checkout .wc-blocks-components-select .wc-blocks-components-select__select,
.wp-block-woocommerce-checkout .wc-block-components-combobox .wc-block-components-combobox-control input,
.wp-block-woocommerce-checkout .wc-block-components-textarea {
	border: 1px solid var(--sod-line);
	border-radius: 8px;
	background-color: #fff;
	color: var(--sod-text);
	font-family: var(--sod-font);
	box-shadow: none;
}

.wp-block-woocommerce-cart .wc-block-components-text-input input:focus,
.wp-block-woocommerce-checkout .wc-block-components-text-input input:focus,
.wp-block-woocommerce-checkout .wc-blocks-components-select .wc-blocks-components-select__select:focus,
.wp-block-woocommerce-checkout .wc-block-components-combobox .wc-block-components-combobox-control input:focus,
.wp-block-woocommerce-checkout .wc-block-components-textarea:focus {
	border-color: var(--sod-brown);
	box-shadow: 0 0 0 1px var(--sod-brown);
	outline: none;
}

.wp-block-woocommerce-checkout .wc-blocks-components-select .wc-blocks-components-select__container {
	border-radius: 8px;
	background: #fff;
}

.wp-block-woocommerce-cart .wc-block-components-text-input label,
.wp-block-woocommerce-checkout .wc-block-components-text-input label,
.wp-block-woocommerce-checkout .wc-blocks-components-select .wc-blocks-components-select__label {
	color: var(--sod-muted);
}

.wp-block-woocommerce-checkout .wc-block-components-text-input.has-error input,
.wp-block-woocommerce-checkout .wc-blocks-components-select.has-error .wc-blocks-components-select__select {
	border-color: #cc1818;
	box-shadow: 0 0 0 1px #cc1818;
}

/* Checkboxen */
.wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border: 1px solid var(--sod-line);
	border-radius: 4px;
	background: #fff;
	accent-color: var(--sod-brown);
}

.wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:checked {
	border-color: var(--sod-brown);
	background: var(--sod-brown);
}

.wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__mark {
	fill: #fff;
}

.wp-block-woocommerce-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"]:focus {
	outline: 2px solid var(--sod-brown);
	outline-offset: 2px;
}

/* Radio's (verzend- en betaalopties) */
.wp-block-woocommerce-checkout .wc-block-components-radio-control__input {
	border-color: var(--sod-line);
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control__input:checked {
	border-color: var(--sod-brown);
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control__input:checked::before {
	background: var(--sod-brown);
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control__option,
.wp-block-woocommerce-checkout .wc-block-components-radio-control--highlight-checked .wc-block-components-radio-control-accordion-option,
.wp-block-woocommerce-checkout .wc-block-components-radio-control--highlight-checked::after {
	border-color: var(--sod-line);
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control--highlight-checked {
	border-radius: 8px;
}

.wp-block-woocommerce-checkout .wc-block-components-radio-control__option--checked-option-highlighted,
.wp-block-woocommerce-checkout .wc-block-components-radio-control-accordion-option--checked-option-highlighted {
	border-radius: 8px;
	box-shadow: inset 0 0 0 2px var(--sod-brown);
}

/* "Voer een verzendadres in"-melding */
.wp-block-woocommerce-checkout .wc-block-components-shipping-rates-control__no-shipping-address-message,
.wp-block-woocommerce-checkout .wc-block-checkout__no-shipping-placeholder,
.wp-block-woocommerce-checkout .wc-block-components-notice-banner.is-info {
	border-radius: 8px;
	background: var(--sod-cream);
}

.wp-block-woocommerce-cart .wc-block-components-notice-banner,
.wp-block-woocommerce-checkout .wc-block-components-notice-banner {
	border-radius: 8px;
}

/* ---------- Lege winkelwagen ---------- */

.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title {
	font-family: var(--sod-font);
	font-weight: 500;
	color: var(--sod-text);
}

.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title::before {
	background-color: var(--sod-gold);
}

/* ---------- Mobiel ---------- */

@media (max-width: 767px) {
	.woocommerce-cart #page-wrapper,
	.woocommerce-checkout #page-wrapper {
		padding: 24px 0 48px;
	}

	.woocommerce-cart .entry-title,
	.woocommerce-checkout .entry-title {
		font-size: 30px;
	}

	.wp-block-woocommerce-cart .wp-block-woocommerce-cart-totals-block,
	.wp-block-woocommerce-checkout .wp-block-woocommerce-checkout-order-summary-block {
		border-radius: 10px;
	}
}