/*
 * Stylar WooCommerce/RnB:s produktsida, varukorg och kassa med samma
 * designtokens som resten av premium-temat — rör aldrig Woo/RnB:s egen
 * markup eller PHP, bara CSS ovanpå. Laddas bara på Woo-sidor
 * (is_woocommerce()/is_cart()/is_checkout()) via functions.php.
 */

.woocommerce {
	font-family: var(--font-sans);
	color: var(--color-text);
}

.woocommerce h1,
.woocommerce h2,
.woocommerce h3,
.woocommerce .product_title {
	font-family: var(--font-serif);
	color: var(--color-ink);
}

/* Produktsida */
.woocommerce div.product {
	background: var(--color-cream);
	padding: var(--space-6);
	border-radius: var(--radius-lg);
}

.woocommerce div.product .product_title {
	font-size: var(--fs-h2);
	margin-bottom: var(--space-3);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
	font-family: var(--font-serif);
	font-size: 1.75rem;
	color: var(--color-accent-dark);
}

/* Enhetlig bildyta i produktgalleriet — fast höjd med "contain" istället
   för hård kvadratisk beskärning ("cover"), eftersom fotobåsen är höga/
   smala produkter och en kvadratisk beskärning klippte bort själva
   apparaten (bara stativben syntes). Detta visar alltid hela bilden,
   oavsett vilket format en framtida produktbild har. */
.woocommerce div.product .woocommerce-product-gallery {
	border-radius: var(--radius-md);
	overflow: hidden;
	box-shadow: var(--shadow-card);
	background: var(--color-surface);
}

.woocommerce div.product .woocommerce-product-gallery img {
	height: 420px !important;
	width: 100% !important;
	object-fit: contain !important;
	object-position: center !important;
	background: var(--color-surface);
}

.woocommerce ul.products li.product img,
.woocommerce-page ul.products li.product img {
	height: 260px !important;
	width: 100% !important;
	object-fit: contain !important;
	background: var(--color-surface);
	border-radius: var(--radius-md);
}

.woocommerce ul.products li.product {
	background: var(--color-surface);
	border-radius: var(--radius-lg);
	padding: var(--space-4);
	box-shadow: var(--shadow-card);
}

.woocommerce ul.products li.product h3,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-serif);
	color: var(--color-ink);
}

/* Knappar */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #payment #place_order,
.woocommerce a.checkout-button {
	background: var(--color-accent);
	color: var(--color-ink);
	border: none;
	border-radius: var(--radius-sm);
	font-weight: 700;
	padding: var(--space-3) var(--space-6);
	transition: background-color var(--transition-base);
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #payment #place_order:hover,
.woocommerce a.checkout-button:hover {
	background: var(--color-accent-light);
	color: var(--color-ink);
}

/* Varukorg */
.woocommerce table.cart,
.woocommerce-cart table.cart,
.woocommerce table.shop_table {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	overflow: hidden;
}

.woocommerce table.shop_table th {
	background: var(--color-ink);
	color: var(--color-text-on-dark);
	font-family: var(--font-sans);
	font-weight: 600;
}

.woocommerce-cart .cart-collaterals .cart_totals,
.woocommerce-checkout #order_review {
	background: var(--color-surface);
	border-radius: var(--radius-md);
	padding: var(--space-5);
	box-shadow: var(--shadow-card);
}

/* Kassan + formulärfält (matchar samma stil som CF7-formuläret) */
.woocommerce-checkout input.input-text,
.woocommerce-checkout select,
.woocommerce-checkout textarea,
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	background: var(--color-cream);
	padding: var(--space-3);
}

.woocommerce-checkout input.input-text:focus,
.woocommerce-checkout select:focus,
.woocommerce form .form-row input.input-text:focus {
	outline: none;
	border-color: var(--color-accent);
	box-shadow: 0 0 0 3px var(--color-border);
}

/* RnB:s datumväljare + "Boka nu"/"Begär offert"-knappar — verifierade
   klasser/id:n mot den riktiga produktsidan (iPad Photobooth). */
#pickup-date,
#pickup-time,
#dropoff-date,
#dropoff-time {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-sm);
	background: var(--color-surface);
	padding: var(--space-3);
	width: 100%;
}

#pickup-date:focus,
#pickup-time:focus,
#dropoff-date:focus,
#dropoff-time:focus {
	outline: none;
	border-color: var(--color-accent);
	box-shadow: 0 0 0 3px var(--color-border);
}

.single_add_to_cart_button.btn-book-now,
.redq_request_for_a_quote.btn-book-now {
	background: var(--color-accent) !important;
	color: var(--color-ink) !important;
	border: none;
	border-radius: var(--radius-sm);
	font-weight: 700;
	width: 100%;
}

.single_add_to_cart_button.btn-book-now:hover,
.redq_request_for_a_quote.btn-book-now:hover {
	background: var(--color-accent-light) !important;
}

.ui-datepicker .ui-datepicker-header {
	background: var(--color-ink);
	color: var(--color-text-on-dark);
}

.ui-state-active,
.ui-datepicker td a.ui-state-active {
	background: var(--color-accent) !important;
	color: var(--color-ink) !important;
}