/* Diwan Canada: client palette, shared by Cascade and Shopify components. */
:root:root {
	--diwan-red: #c63d32;
	--diwan-orange: #f28a3a;
	--diwan-cream: #fff8ef;
	--diwan-graphite: #2d2926;
	--diwan-peach: #f7dfd0;
	--diwan-white: #ffffff;

	/* Override Customizer color variables without changing saved settings. */
	--cs-light-site-background: var(--diwan-white);
	--cs-light-layout-background: var(--diwan-white);
	--cs-light-primary-color: var(--diwan-graphite);
	--cs-light-secondary-color: color-mix(in srgb, var(--diwan-graphite) 78%, var(--diwan-cream));
	--cs-light-border-color: color-mix(in srgb, var(--diwan-graphite) 22%, var(--diwan-cream));
	--cs-light-divider-color: var(--diwan-orange);
	--cs-light-input-background: var(--diwan-white);
	--cs-light-input-color: var(--diwan-graphite);
	--cs-light-button-background: var(--diwan-red);
	--cs-light-button-color: var(--diwan-white);
	--cs-light-button-hover-background: color-mix(in srgb, var(--diwan-red) 85%, var(--diwan-graphite));
	--cs-light-button-hover-color: var(--diwan-white);
	--cs-light-overlay-background: rgb(45 41 38 / 40%);

	--cs-dark-site-background: var(--diwan-graphite);
	--cs-dark-layout-background: color-mix(in srgb, var(--diwan-white) 7%, var(--diwan-graphite));
	--cs-dark-primary-color: var(--diwan-cream);
	--cs-dark-secondary-color: color-mix(in srgb, var(--diwan-cream) 78%, var(--diwan-graphite));
	--cs-dark-border-color: color-mix(in srgb, var(--diwan-cream) 25%, var(--diwan-graphite));
	--cs-dark-divider-color: var(--diwan-orange);
	--cs-dark-input-background: var(--cs-dark-layout-background);
	--cs-dark-input-color: var(--diwan-cream);
	--cs-dark-button-background: var(--diwan-red);
	--cs-dark-button-color: var(--diwan-white);
	--cs-dark-button-hover-background: color-mix(in srgb, var(--diwan-red) 85%, var(--diwan-graphite));
	--cs-dark-button-hover-color: var(--diwan-white);
	--cs-dark-overlay-background: rgb(45 41 38 / 65%);
}

:root,
[data-scheme] {
	--diwan-link: var(--cs-color-primary);
	--diwan-link-hover: var(--diwan-red);
	--diwan-panel-background: var(--cs-site-background);
	--diwan-section-background: var(--diwan-peach);
	--cs-color-header-background: var(--cs-layout-background);
	--cs-color-submenu-background: var(--cs-layout-background);
	--cs-color-footer-background: var(--cs-site-background);
	--cs-wc-accent-color: var(--diwan-red);
	--cs-palette-color-primary: var(--cs-color-primary);
	--cs-palette-color-blue: var(--diwan-red);
	--cs-palette-color-red: var(--diwan-red);
	--cs-palette-color-orange: var(--diwan-orange);
	--cs-palette-color-layout: var(--cs-layout-background);
	--cs-palette-color-border: var(--cs-color-border);
	--cs-palette-color-divider: var(--diwan-orange);
}
[data-scheme="dark"],
[data-scheme="inverse"] {
	--diwan-section-background: var(--cs-dark-layout-background);
}
[data-scheme="inverse"] {
	--cs-site-background: var(--cs-dark-site-background);
	--cs-layout-background: var(--cs-dark-layout-background);
	--cs-color-primary: var(--cs-dark-primary-color);
	--cs-color-secondary: var(--cs-dark-secondary-color);
	--cs-color-border: var(--cs-dark-border-color);
	--cs-color-divider: var(--diwan-orange);
}
@media (prefers-color-scheme: dark) {
	[data-scheme="auto"] {
		--diwan-section-background: var(--cs-dark-layout-background);
	}
}

/* Elementor's saved kit colors otherwise retain the previous blue/gold. */
body[class*="elementor-kit-"] {
	--e-global-color-primary: var(--cs-color-primary);
	--e-global-color-secondary: var(--diwan-link);
	--e-global-color-text: var(--cs-color-primary);
	--e-global-color-accent: var(--diwan-red);
	background-color: var(--cs-site-background);
	color: var(--cs-color-primary);
}
.cs-site a {
	color: var(--diwan-link);
}
.cs-site a:hover,
.cs-site a:focus-visible {
	color: var(--diwan-link-hover);
}
.cs-site :is(a, button, input, select, textarea, summary):focus-visible {
	outline-color: var(--diwan-red);
}
.cs-site :is(a.button, a.cs-button, a.elementor-button, a.wp-element-button) {
	background-color: var(--cs-color-button);
	color: var(--cs-color-button-contrast);
}
.cs-site :is(a.button, a.cs-button, a.elementor-button, a.wp-element-button):hover {
	background-color: var(--cs-color-button-hover);
	color: var(--cs-color-button-hover-contrast);
}
.cs-site .cs-featured-products__button .cs-button {
	/* Cascade forces these button colors with !important. */
	background-color: var(--cs-color-button) !important;
	border-color: var(--cs-color-button);
	color: var(--cs-color-button-contrast) !important;
}
.cs-site .cs-featured-products__button .cs-button:hover {
	background-color: var(--cs-color-button-hover) !important;
	border-color: var(--cs-color-button-hover);
	color: var(--cs-color-button-hover-contrast) !important;
}

/* Navigation links and shared menu surfaces. */
.cs-header.diwan-header .cs-header__nav-inner :is(a, a > span:not(.expanded)),
.cs-header.diwan-header :is(.diwan-mega__trigger, .diwan-mega__links a),
.cs-offcanvas .widget_nav_menu .menu-item > a {
	color: var(--diwan-link);
}
.cs-header.diwan-header .cs-header__nav-inner a:hover > span,
.cs-header.diwan-header .cs-header__nav-inner a:hover,
.cs-header.diwan-header :is(.diwan-mega__trigger:hover, .diwan-mega__links a:hover),
.cs-offcanvas .widget_nav_menu .menu-item > a:hover {
	color: var(--diwan-link-hover);
}
.cs-header.diwan-header .diwan-mega--current > .diwan-mega__trigger,
.cs-header.diwan-header .diwan-mega__links a[aria-current="page"],
.cs-header.diwan-header .cs-header__nav-inner li:is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > a,
.cs-header.diwan-header .cs-header__nav-inner li:is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > a > span:not(.expanded),
.cs-offcanvas .widget_nav_menu .menu-item:is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > a,
.product-search-sidebar .menu-item:is(.current-menu-item, .current-menu-parent, .current-menu-ancestor) > a {
	color: var(--diwan-red);
}
.cs-header__cart .cs-header__cart-quantity,
.csco-badge-primary {
	background: var(--diwan-orange);
	color: var(--diwan-graphite);
}
.collection-search-layout .collection-tools-panel,
.cs-header .cs-header__product-search-hint {
	background: var(--diwan-panel-background);
}
.cs-site-subscribe,
.cs-footer__subscribe-container {
	background: var(--diwan-section-background);
	color: var(--cs-color-primary);
}
.cs-footer__subscribe-container {
	padding: 24px;
}
.cs-footer__subscribe .cs-footer__subscribe-form-group {
	flex-wrap: wrap;
	gap: 12px;
}
.cs-footer__subscribe .cs-footer__subscribe-form-group input {
	flex: 1 1 180px;
	min-width: 0;
}
.cs-footer__subscribe .cs-footer__subscribe-form-group button {
	width: auto;
	margin-left: 0;
}
.cs-site :is(.cs-breadcrumbs, .woocommerce-breadcrumb) a {
	color: var(--cs-color-primary);
	background-image: linear-gradient(var(--diwan-orange), var(--diwan-orange));
}
.cs-site :is(.cs-breadcrumbs, .woocommerce-breadcrumb) a:hover {
	color: var(--diwan-red);
}
.cs-site :is(.cs-breadcrumbs, .woocommerce-breadcrumb) .cs-separator::after {
	background: var(--diwan-orange);
}
.cs-header.diwan-header .cs-header__product-search-input,
.product-search-sidebar :is(input, select),
#diwan-author-search,
#diwan-publisher-search {
	background: var(--cs-color-input);
	color: var(--cs-color-input-contrast);
	border-color: var(--cs-color-border);
}
.cs-site input::placeholder,
.cs-site textarea::placeholder {
	color: var(--cs-color-secondary);
	opacity: 1;
}
.cs-header.diwan-header .cs-header__product-search-submit {
	background: var(--cs-color-button);
	color: var(--cs-color-button-contrast);
}
.cs-header.diwan-header .cs-header__product-search-submit:hover {
	background: var(--cs-color-button-hover);
	color: var(--cs-color-button-hover-contrast);
}

/* Product cards, product details, and Quick View. */
.woocommerce ul.products li.product .woocommerce-thumbnail {
	overflow: visible;
}
.woocommerce ul.products li.product .woocommerce-thumbnail img,
.woocommerce ul.products li.product .woocommerce-thumbnail shopify-media::part(image) {
	background: transparent !important;
	filter: drop-shadow(0 2px 3px rgb(45 41 38 / 50%));
}
.cs-site :is(.single-product__author-line, .single-product__author, .single-product__categories, .single-product__publisher) a {
	color: var(--diwan-link);
}
.cs-site :is(.single-product__author-line, .single-product__author, .single-product__categories, .single-product__publisher) a:hover,
.cs-site :is(.single-product__author-line, .single-product__author, .single-product__categories, .single-product__publisher) a:focus-visible {
	color: var(--diwan-link-hover);
}
.single-product__main-image {
	background: var(--cs-layout-background);
}
.cs-site .woocommerce-loop-product__link,
.cs-site .woocommerce-loop-product__link:hover,
.single-product-layout :is(.single-product__title, .single-product__price, .single-product__description-text),
#product-modal :is(.product-modal__title, .product-modal__price-container, .product-modal__description-text) {
	color: var(--cs-color-primary);
}
.elementor .cs-featured-products__heading {
	/* Widget-specific saved heading colors must follow the new brand too. */
	color: var(--cs-color-primary) !important;
}
/* Reading text has a 16px floor; button and icon sizes stay independent. */
.cs-site label,
.cs-site :is(.cs-breadcrumbs, .woocommerce-breadcrumb) {
	font-size: max(1rem, var(--cs-font-primary-size, 1rem));
}
.cs-site small {
	font-size: max(1rem, 0.8em);
}
.single-product-layout :is(.single-product__description-text, .single-product__count),
#product-modal :is(.product-modal__description-text, .product-modal__vendor) {
	font-size: 1rem;
}
.cs-footer__copyright,
.cs-entry__excerpt,
.woocommerce ul.products li.product .woocommerce-excerpt {
	font-size: max(1rem, var(--cs-font-entry-excerpt-size, 1rem));
}
#product-modal,
#product-modal .product-modal__content {
	background: var(--cs-layout-background);
	color: var(--cs-color-primary);
}
#product-modal .product-modal__media {
	background: var(--cs-layout-background);
}
#product-modal::backdrop {
	background: var(--cs-color-overlay-background);
}
.single-product-layout .single-product__add-button,
.single-product-layout .single-product__add-button:disabled,
#product-modal .product-modal__add-button {
	background: var(--cs-color-button);
	border-color: var(--cs-color-button);
	color: var(--cs-color-button-contrast);
}
.single-product-layout .single-product__add-button:hover:not(:disabled),
#product-modal .product-modal__add-button:hover:not(:disabled) {
	background: var(--cs-color-button-hover);
	border-color: var(--cs-color-button-hover);
	color: var(--cs-color-button-hover-contrast);
	opacity: 1;
}
#product-modal .product-modal__close {
	background: var(--cs-layout-background);
	border-color: var(--cs-color-border);
	color: var(--cs-color-primary);
}
#product-modal .product-modal__close:hover {
	color: var(--diwan-red);
}

/* Use the web components' supported parts; no injected shadow styles needed. */
shopify-cart::part(dialog) {
	background: var(--cs-layout-background);
	color: var(--cs-color-primary);
}
shopify-cart::part(primary-button) {
	background: var(--cs-color-button);
	color: var(--cs-color-button-contrast);
}
shopify-cart::part(primary-button):hover {
	background: var(--cs-color-button-hover);
	color: var(--cs-color-button-hover-contrast);
	opacity: 1;
}
shopify-cart::part(secondary-button),
shopify-cart::part(tertiary-button),
shopify-cart::part(discount-code) {
	background: var(--diwan-panel-background);
	border-color: var(--cs-color-border);
	color: var(--cs-color-primary);
}
shopify-cart::part(line-price) {
	color: var(--cs-color-primary);
}
shopify-cart::part(line-options) {
	color: var(--cs-color-secondary);
	font-size: 1rem;
}
shopify-variant-selector::part(radio),
shopify-variant-selector::part(select) {
	background: var(--cs-layout-background);
	border-color: var(--cs-color-border);
	color: var(--cs-color-primary);
}
shopify-variant-selector::part(radio):hover,
shopify-variant-selector::part(radio-selected) {
	background: var(--cs-color-button);
	border-color: var(--cs-color-button);
	color: var(--cs-color-button-contrast);
}
shopify-variant-selector::part(select) {
	font-size: 1rem;
}

/* Standalone Shopify cart page. */
.shopify-cart-page :is(.cart-items, .cart-summary, .cart-line-item) {
	background: var(--cs-layout-background);
	border-color: var(--cs-color-border);
}
.shopify-cart-page .empty-cart-message {
	background: var(--diwan-panel-background);
}
.shopify-cart-page :is(h1, h2, h3, p, .price, .quantity, .line-variant) {
	color: var(--cs-color-primary);
}
.shopify-cart-page :is(.quantity, .line-variant) {
	font-size: 1rem;
}
.shopify-cart-page :is(.checkout-btn, .continue-shopping-btn) {
	background: var(--cs-color-button);
	color: var(--cs-color-button-contrast);
}
.shopify-cart-page :is(.checkout-btn, .continue-shopping-btn):hover {
	background: var(--cs-color-button-hover);
	color: var(--cs-color-button-hover-contrast);
	opacity: 1;
}
