/**
 * DEYZA — pages and WooCommerce surfaces.
 * WooCommerce's own CSS stays loaded; this brings its native Cart, Checkout,
 * Mini-Cart and My Account into the identity. UI text is DM Sans, headings
 * Fraunces, controls pill-shaped, primary action emerald.
 */

/* ---- Generic page shell ---------------------------------------------------
   A patterned blush title band, then a CENTRED body. Pages used to open as
   bare text on cream with the content hugging the left of a 1,900px screen. */
.dz-page { width: 100%; max-width: var(--dz-layout-max); margin-inline: auto; padding: var(--dz-space-lg) var(--dz-layout-gutter) var(--dz-layout-section-top); min-height: 50vh; }
.dz-page__band { padding: clamp(1.75rem, 4vw, 3.25rem) clamp(1.25rem, 4vw, 3.5rem); border-radius: 1.25rem; background: var(--dz-blush); overflow: hidden; margin-bottom: var(--dz-space-xl); }
.dz-page__band--center { display: grid; justify-items: center; gap: var(--dz-space-sm); text-align: center; padding-block: clamp(3rem, 8vw, 6rem); }
.dz-page__title { margin: 0; font-size: var(--dz-size-h2); letter-spacing: -0.03em; }
@media (min-width: 768px) { .dz-page__title { font-size: clamp(2.5rem, 1.9rem + 2vw, 3.5rem); } }
.dz-page--404 { min-height: 0; padding-bottom: 0; }
.dz-page--404 .dz-page__band { margin-bottom: 0; }

/* Prose pages: one centred reading column. */
.dz-page--prose .dz-page__body { max-width: 52rem; margin-inline: auto; }
.dz-page__body > .wp-block-post-content > * + *, .dz-page--prose .dz-page__body > * + * { margin-top: var(--dz-space-md); }
.dz-page__body h2 { font-size: var(--dz-size-h3); margin-top: var(--dz-space-xl); }
.dz-page__body a { color: var(--dz-emerald); }
.dz-page__body ul:not([class]), .dz-page__body .wp-block-list { padding-inline-start: 1.25rem; display: grid; gap: 0.375rem; }

/* Tables: row rules only. The table block's default is a black grid round every cell. */
.dz-page .wp-block-table { margin: var(--dz-space-lg) 0; padding: var(--dz-space-sm) var(--dz-space-md); border-radius: 1rem; background: var(--dz-white); box-shadow: var(--dz-shadow-card); overflow-x: auto; }
.dz-page .wp-block-table table { width: 100%; border-collapse: collapse; border: 0; font-family: var(--dz-font-ui); font-size: var(--dz-size-ui); }
.dz-page .wp-block-table th, .dz-page .wp-block-table td { padding: 0.9375rem 0.75rem; border: 0; border-bottom: 1px solid var(--dz-line); text-align: start; font-variant-numeric: tabular-nums; }
.dz-page .wp-block-table thead { border: 0; }
.dz-page .wp-block-table thead th { font-size: var(--dz-size-eyebrow); letter-spacing: 0.16em; text-transform: uppercase; color: var(--dz-ink-muted); font-weight: 600; }
.dz-page .wp-block-table tbody tr:last-child td { border-bottom: 0; }
.dz-page .wp-block-table tbody td:first-child { font-weight: 700; color: var(--dz-emerald); }

/* ---- Shared Woo typography ---------------------------------------------- */
.wc-block-cart, .wc-block-checkout, .wc-block-mini-cart__drawer, .woocommerce-account .woocommerce,
.wc-block-components-notice-banner, .woocommerce-message, .woocommerce-info, .woocommerce-error,
.wc-block-order-confirmation-status, .wp-block-woocommerce-order-confirmation-totals, .woocommerce-order {
	font-family: var(--dz-font-ui);
	font-size: var(--dz-size-ui);
	line-height: 1.5;
}
.wc-block-cart h2, .wc-block-checkout h2, .wc-block-mini-cart__title, .woocommerce-account h2, .woocommerce-order h2,
.wc-block-components-checkout-step__title, .wc-block-cart__totals-title {
	font-family: var(--dz-font-display) !important;
	font-weight: 400 !important;
	letter-spacing: -0.015em;
	text-transform: none !important;
	color: var(--dz-ink);
}
.wc-block-components-checkout-step__title, .wc-block-cart__totals-title { font-size: 1.5rem !important; }

/* ---- Buttons ------------------------------------------------------------- */
.wc-block-components-button:not(.is-link), .woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.wc-block-mini-cart__footer-actions .wc-block-components-button, .wp-block-button__link {
	min-height: 3.25rem;
	padding: 0.75rem 2rem;
	border: 0;
	border-radius: var(--dz-radius-pill) !important;
	background: var(--dz-emerald);
	color: var(--dz-cream);
	font-family: var(--dz-font-ui);
	font-size: var(--dz-size-button);
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color var(--dz-motion-dur-2) var(--dz-motion-ease);
}
.wc-block-components-button:not(.is-link):hover, .woocommerce a.button:hover, .woocommerce button.button:hover, .wp-block-button__link:hover {
	background: var(--dz-emerald-deep); color: var(--dz-cream);
}
.wc-block-mini-cart__footer-actions .wc-block-components-button.outlined,
.wc-block-components-button.outlined:not(.is-link) { background: transparent; color: var(--dz-ink); box-shadow: inset 0 0 0 1.5px var(--dz-line-strong); }
.wc-block-components-button.outlined:not(.is-link):hover { background: var(--dz-ink); color: var(--dz-cream); }

/* ---- Fields -------------------------------------------------------------- */
.wc-block-components-text-input input, .wc-block-components-combobox input, .wc-blocks-components-select__select,
.wc-block-components-textarea, .woocommerce form .input-text, .woocommerce form select {
	border: 1px solid var(--dz-line-strong) !important;
	border-radius: var(--dz-radius-sm) !important;
	background: var(--dz-white) !important;
	color: var(--dz-ink) !important;
	font-family: var(--dz-font-ui) !important;
}
.wc-block-components-text-input input:focus, .woocommerce form .input-text:focus { border-color: var(--dz-emerald) !important; box-shadow: 0 0 0 1px var(--dz-emerald) !important; outline: none; }
.wc-block-components-checkbox__input[type="checkbox"]:checked { background: var(--dz-emerald); border-color: var(--dz-emerald); }
.wc-block-components-radio-control__input:checked::before { background: var(--dz-emerald); }

/* ---- Cart + checkout panels --------------------------------------------- */
.wc-block-cart, .wc-block-checkout { max-width: none !important; }
.wc-block-components-sidebar, .wc-block-cart__sidebar .wc-block-components-panel, .wp-block-woocommerce-checkout-order-summary-block {
	background: var(--dz-white);
	border: 1px solid var(--dz-line) !important;
	border-radius: 1rem;
}
.wc-block-cart__sidebar, .wc-block-checkout__sidebar { padding: var(--dz-space-md) !important; }
.wc-block-cart-items th { font-size: var(--dz-size-eyebrow) !important; letter-spacing: 0.16em; color: var(--dz-ink-muted); }
.wc-block-cart-item__image img, .wc-block-components-order-summary-item__image img { border-radius: 0.5rem; aspect-ratio: 3 / 4; object-fit: cover; }
.wc-block-components-product-name { font-family: var(--dz-font-display); font-size: 1.25rem; color: var(--dz-ink); text-decoration: none; }
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value { font-family: var(--dz-font-display); font-size: 1.625rem; }
.wc-block-components-product-badge { border-radius: var(--dz-radius-pill); border-color: var(--dz-coral); color: var(--dz-coral-text); }
.wc-block-cart__empty-cart__title { font-family: var(--dz-font-display) !important; font-weight: 400 !important; }

/* ---- Mini-cart drawer ---------------------------------------------------- */
.wc-block-mini-cart__drawer .wc-block-components-drawer__content { background: var(--dz-cream); color: var(--dz-ink); }
.wc-block-mini-cart__title { font-size: 1.75rem !important; }
.wc-block-mini-cart__footer { border-top: 1px solid var(--dz-line); background: var(--dz-cream); }

/* ---- Notices ------------------------------------------------------------- */
.wc-block-components-notice-banner, .woocommerce-message, .woocommerce-info, .woocommerce-error {
	border: 1px solid var(--dz-line) !important;
	border-radius: 0.75rem;
	background: var(--dz-white) !important;
	color: var(--dz-ink) !important;
}
.wc-block-components-notice-banner.is-success, .woocommerce-message { border-inline-start: 4px solid var(--dz-emerald) !important; }
.wc-block-components-notice-banner.is-error, .woocommerce-error { border-inline-start: 4px solid var(--dz-coral-text) !important; }
.woocommerce-message::before, .woocommerce-info::before { color: var(--dz-emerald); }
/* WooCommerce moves focus to a notice so screen readers announce it. It is not
   interactive, so the site's focus ring on it just reads as a second border. */
.wc-block-components-notice-banner:focus, .wc-block-components-notice-banner:focus-visible { outline: none !important; }
.wc-block-components-notice-banner { align-items: center !important; padding: 0.75rem 1rem !important; }
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content {
	display: flex; flex: 1; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem;
}
/* The action ("View bag") ships floated right at 70% opacity with no fill. */
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward {
	float: none !important; opacity: 1 !important; margin: 0 !important;
	display: inline-flex !important; align-items: center; min-height: 2.25rem; line-height: 1 !important;
	padding: 0 1.125rem !important; border-radius: var(--dz-radius-pill);
	background: var(--dz-emerald) !important; color: var(--dz-cream) !important; text-decoration: none !important;
	font-family: var(--dz-font-ui); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; white-space: nowrap;
}
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward:hover { background: var(--dz-emerald-deep) !important; }
.woocommerce-notices-wrapper { max-width: var(--dz-layout-max); margin-inline: auto; padding-inline: var(--dz-layout-gutter); }

/* ---- My account ---------------------------------------------------------- */
.woocommerce-account .woocommerce { display: grid; gap: var(--dz-space-xl); }
@media (min-width: 1024px) { .woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) { grid-template-columns: 16rem minmax(0, 1fr); } }
.woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { float: none !important; width: auto !important; }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.25rem; }
.woocommerce-MyAccount-navigation a { display: block; padding: 0.75rem 1rem; border-radius: var(--dz-radius-pill); text-decoration: none; }
.woocommerce-MyAccount-navigation .is-active a, .woocommerce-MyAccount-navigation a:hover { background: var(--dz-blush); color: var(--dz-ink); }
.woocommerce-account form.login, .woocommerce-account form.register { border: 1px solid var(--dz-line) !important; border-radius: 1rem !important; background: var(--dz-white); padding: var(--dz-space-lg) !important; max-width: 32rem; }
.woocommerce form .form-row label { font-size: var(--dz-size-small); color: var(--dz-ink-muted); }

/* WooCommerce's product-grid buttons inherit the theme link colour, which is
   the same emerald as the button fill: 1:1, invisible text. */
.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link,
.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link:hover { color: var(--dz-cream) !important; }
.wc-block-grid__product-title { font-family: var(--dz-font-display); font-weight: 400; color: var(--dz-ink); }
.wc-block-grid__product-image img { aspect-ratio: 3 / 4; object-fit: cover; }

/* ---- Empty bag ------------------------------------------------------------
   WooCommerce ships a crying-face icon, a dotted separator and a gapless strip
   of square photos. Replace the tone and give the grid the site's card shape. */
.wc-block-cart__empty-cart__title.with-empty-cart-icon::before { display: none !important; }
.wp-block-woocommerce-empty-cart-block { display: grid; gap: var(--dz-space-md); justify-items: center; text-align: center; }
.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title { font-family: var(--dz-font-display) !important; font-weight: 400 !important; font-size: var(--dz-size-h3) !important; letter-spacing: -0.02em; margin: 0 !important; }
.wp-block-woocommerce-empty-cart-block .wp-block-separator { display: none; }
.wp-block-woocommerce-empty-cart-block > h2:not(.wc-block-cart__empty-cart__title) { font-family: var(--dz-font-display); font-weight: 400; font-size: var(--dz-size-h3); margin: var(--dz-space-xl) 0 0; }
.wp-block-woocommerce-empty-cart-block .wc-block-grid { width: 100%; }
.wc-block-grid__products { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--dz-space-lg) var(--dz-space-md); margin: 0 !important; padding: 0; text-align: start; }
@media (min-width: 1024px) { .wc-block-grid__products { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.wc-block-grid__product { width: auto !important; max-width: none !important; flex: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; display: grid; gap: 0.375rem; align-content: start; }
.wc-block-grid__product-image { margin: 0 0 0.5rem !important; }
.wc-block-grid__product-image img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 0.875rem; outline: 1px solid oklch(0 0 0 / 0.1); outline-offset: -1px; }
.wc-block-grid__product-title { font-family: var(--dz-font-ui) !important; font-size: var(--dz-size-ui) !important; font-weight: 500 !important; text-transform: lowercase; color: var(--dz-ink); }
.wc-block-grid__product-price { font-family: var(--dz-font-ui); font-size: var(--dz-size-ui); font-weight: 500; margin: 0 !important; }
.wc-block-grid__product-add-to-cart.wp-block-button { margin: 0.25rem 0 0 !important; }
.wc-block-grid__product-add-to-cart.wp-block-button .wp-block-button__link { min-height: 2.75rem; padding: 0.5rem 1.25rem; font-size: 0.75rem; }

/* ---- My account, signed out: a centred card, not a 260px box in a corner --- */
.dz-page--account .woocommerce:not(:has(.woocommerce-MyAccount-navigation)) { max-width: 30rem; margin-inline: auto; display: block; }
.dz-page--account .woocommerce:not(:has(.woocommerce-MyAccount-navigation)) > h2 { font-size: var(--dz-size-h3); margin-bottom: var(--dz-space-md); text-align: center; }
.dz-page--account form.login, .dz-page--account form.register, .dz-page--account form.lost_reset_password { max-width: none !important; margin: 0 !important; box-shadow: var(--dz-shadow-card); border: 0 !important; }
.dz-page--account form .form-row { display: grid; gap: 0.375rem; margin-bottom: var(--dz-space-sm); padding: 0 !important; }
.dz-page--account form .input-text { min-height: 3rem; padding-inline: 0.875rem; width: 100%; }
.dz-page--account form .woocommerce-form-login__submit, .dz-page--account form button[type="submit"] { width: 100%; margin-top: 0.5rem; }
.dz-page--account .woocommerce-form-login__rememberme { display: inline-flex; align-items: center; gap: 0.5rem; font-size: var(--dz-size-small); }
.dz-page--account .lost_password { text-align: center; margin: var(--dz-space-sm) 0 0; font-size: var(--dz-size-small); }
.wc-block-grid__product-link, .wc-block-grid__product-title { text-decoration: none !important; }
.wc-block-grid__product-link:hover .wc-block-grid__product-title { color: var(--dz-emerald); }

/* ---- Place order: readable in every state -------------------------------
   While it submits and redirects to payment, WooCommerce empties the button
   and shows a small tick — on a slow phone connection that sat on screen for
   seconds and looked broken. It now says what is happening, at full size. */
.wc-block-components-checkout-place-order-button { min-height: 3.5rem !important; width: 100%; font-size: 0.875rem !important; letter-spacing: 0.14em; }
@media (min-width: 768px) { .wc-block-components-checkout-place-order-button { width: auto; min-width: 18rem; } }
.wc-block-components-checkout-place-order-button:disabled,
.wc-block-components-checkout-place-order-button--loading,
.wc-block-components-checkout-place-order-button[data-dz-waiting] { opacity: 1 !important; cursor: progress; }
.wc-block-components-checkout-place-order-button:is(:disabled, .wc-block-components-checkout-place-order-button--loading, [data-dz-waiting]):not(:has(.wc-block-components-checkout-place-order-button__text:not(:empty))) > * { display: none !important; }
.wc-block-components-checkout-place-order-button:is(:disabled, .wc-block-components-checkout-place-order-button--loading, [data-dz-waiting]):not(:has(.wc-block-components-checkout-place-order-button__text:not(:empty)))::after {
	content: "Placing your order\2026"; display: inline-flex; align-items: center; gap: 0.75rem;
}
.wc-block-components-checkout-place-order-button:is(:disabled, .wc-block-components-checkout-place-order-button--loading, [data-dz-waiting]):not(:has(.wc-block-components-checkout-place-order-button__text:not(:empty)))::before {
	content: ""; width: 1.125rem; height: 1.125rem; margin-inline-end: 0.75rem; border-radius: 50%;
	border: 2px solid currentColor; border-right-color: transparent; animation: dz-spin 0.7s linear infinite;
}
@keyframes dz-spin { to { transform: rotate(360deg); } }

/* ---- Phones: one left edge for the whole page ---------------------------
   The title band indented its text 20px inside a band that was itself inset
   20px, so the title started at 40px while every form heading below it
   started at 20px — which read as "no padding" on the content. On phones the
   band runs edge to edge and its text shares the page's 20px gutter. */
@media (max-width: 767.98px) {
	.dz-page__band { margin-inline: calc(-1 * var(--dz-layout-gutter)); border-radius: 0; padding-inline: var(--dz-layout-gutter); }
}

/* ---- Checkout on phones: one order summary, no box inside a box ---------
   WooCommerce shows a collapsible summary at the top AND a second copy in the
   form under 700px; the theme's !important card border also beat Woo's mobile
   border:none, nesting a bordered summary inside a padded card around an empty
   notices strip. */
@media (max-width: 699.98px) {
	.wc-block-checkout__sidebar.wc-block-components-sidebar { padding: 0 !important; border: 0 !important; background: none !important; }
	.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block { border: 1px solid var(--dz-line) !important; border-radius: 1rem; background: var(--dz-white); }
	.wc-block-checkout__sidebar .wc-block-components-notices:empty,
	.wc-block-checkout__sidebar .wc-block-store-notices:empty { display: none; }
	.checkout-order-summary-block-fill-wrapper { display: none !important; }
	.wc-block-components-checkout-order-summary__title { padding-inline: var(--dz-space-md) !important; border: 0 !important; }
	.wc-block-components-checkout-order-summary__content { padding-inline: var(--dz-space-md); }
}

/* ---- Message after a cancelled / failed payment (inc/checkout.php) ------- */
.dz-checkout-notice {
	margin: 0 0 var(--dz-space-lg); padding: 1rem 1.125rem; border-radius: 0.875rem;
	background: var(--dz-white); border: 1px solid var(--dz-line); border-inline-start: 4px solid var(--dz-coral-text);
	font-family: var(--dz-font-ui); font-size: var(--dz-size-ui); line-height: 1.5; color: var(--dz-ink);
}
.dz-checkout-notice p { margin: 0; }