/* Shared storefront presentation; palette, type and spacing come from theme.json. */
body {
    --wpsite-border: color-mix(in srgb, var(--wp--preset--color--ink) 20%, transparent);
    --wpsite-radius: var(--wp--custom--radius--card);
}

*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; height: auto; }
a, button, input, select, textarea { touch-action: manipulation; }
a { text-underline-offset: 0.2em; }
a:hover { text-decoration-thickness: 2px; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid var(--wp--preset--color--primary);
    outline-offset: 4px;
    box-shadow: 0 0 0 2px var(--wp--preset--color--surface);
}

.wp-site-blocks > header {
    position: sticky;
    top: 0;
    z-index: 30;
    margin-block-start: 0;
    background: var(--wp--preset--color--canvas);
}
.admin-bar .wp-site-blocks > header { top: var(--wp-admin--admin-bar--height, 32px); }
.wpsite-announcement { position: relative; padding: var(--wp--preset--spacing--20) 48px; }
.wpsite-announcement p { margin: 0; }
.wpsite-announcement-dismiss { position: absolute; right: 8px; top: 0; width: 44px; min-height: 38px; margin: 0; padding: 0; border: 0; background: transparent; color: inherit; font-size: 1.25rem; cursor: pointer; }
.wpsite-announcement[hidden] { display: none; }
.wpsite-announcement-dismiss:focus-visible { outline-color: var(--wp--preset--color--surface); outline-offset: -4px; }
.wpsite-header, .wpsite-checkout-header {
    padding-block: var(--wp--preset--spacing--40);
    border-bottom: 1px solid var(--wpsite-border);
}
.wpsite-header-row, .wpsite-header-tools { gap: var(--wp--preset--spacing--50); }
.wpsite-brand { gap: var(--wp--preset--spacing--30); flex-shrink: 0; }
.wpsite-brand .wp-block-site-title { margin: 0; white-space: nowrap; }
.wpsite-header-tools .wp-block-search { width: 220px; max-width: 100%; margin: 0; }
.wpsite-header-tools .wp-block-navigation { flex-shrink: 0; }
.wpsite-header .wp-block-navigation-item__content { padding-block: var(--wp--preset--spacing--30); }
.wp-block-search__inside-wrapper {
    border: 1px solid var(--wpsite-border);
    border-radius: var(--wp--custom--radius--small);
    background: var(--wp--preset--color--surface);
    padding: 2px;
}
.wp-block-search__input { width: 100%; min-width: 0; border: 0; background: transparent; }
.wp-block-search__button { margin-left: 0; min-height: 44px; padding: var(--wp--preset--spacing--20); flex-shrink: 0; white-space: nowrap; }
.wc-block-mini-cart__button { min-width: 44px; min-height: 44px; }

.wp-site-blocks main {
    padding-block: var(--wp--preset--spacing--70) var(--wp--preset--spacing--80);
    min-height: 50vh;
    overflow-wrap: anywhere;
}
.wp-site-blocks main.wpsite-home { padding-top: var(--wp--preset--spacing--50); }
.wpsite-home > .wp-block-post-content { max-width: var(--wp--style--global--wide-size); }
.wpsite-home .wp-block-post-content > * + * { margin-block-start: var(--wp--preset--spacing--80); }
.wpsite-hero {
    border-radius: var(--wpsite-radius);
    overflow: hidden;
    background: var(--wp--preset--color--accent);
    gap: 0;
}
.wpsite-hero > .wp-block-column { min-width: 0; }
.wpsite-hero > .wp-block-column:first-child { padding: var(--wp--preset--spacing--70); }
.wpsite-hero h1 { font-size: var(--wp--preset--font-size--display); max-width: 12ch; }
.wpsite-hero p { max-width: 42ch; }
.wpsite-hero .wp-block-image { margin: 0; height: 100%; }
.wpsite-hero img { display: block; width: 100%; height: 100%; min-height: 380px; object-fit: cover; }
.wpsite-categories { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--wp--preset--spacing--50); }
.wpsite-category { min-width: 0; }
.wpsite-categories > .wpsite-category { margin-block-start: 0; }
.wpsite-category .wp-block-image { margin: 0 0 var(--wp--preset--spacing--40); }
.wpsite-category img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--wpsite-radius); }
.wpsite-category h3 { margin-block: var(--wp--preset--spacing--30); }
.wpsite-promotion { padding: var(--wp--preset--spacing--70); border-radius: var(--wpsite-radius); overflow: hidden; background: var(--wp--preset--color--accent); }
.wpsite-catalog-filters { padding: var(--wp--preset--spacing--50); border: 1px solid var(--wpsite-border); border-radius: var(--wpsite-radius); gap: var(--wp--preset--spacing--70); }
.wpsite-catalog-filters > * { min-width: 0; margin-block-start: 0; }

/* Override the collection's saved column count consistently at each viewport. */
.wp-block-woocommerce-product-collection .wc-block-product-template {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--wp--preset--spacing--70) var(--wp--preset--spacing--50);
}
.wc-block-product-template > li { min-width: 0; display: flex; flex-direction: column; gap: var(--wp--preset--spacing--30); }
.woocommerce .wp-block-woocommerce-product-collection ul.wc-block-product-template > li.product { width: auto; float: none; margin: 0; }
.wc-block-product-template > li > * { margin-block: 0; }
.wc-block-product-template .wc-block-components-product-image { border-radius: var(--wpsite-radius); overflow: hidden; }
.wc-block-product-template .wc-block-components-product-image img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.wc-block-product-template .wp-block-post-title { font-size: var(--wp--preset--font-size--body); line-height: 1.4; }
.wc-block-product-template .wp-block-woocommerce-product-price { color: var(--wp--preset--color--muted); }
.wc-block-product-template .wp-block-woocommerce-product-button { margin-block-start: auto; padding-top: var(--wp--preset--spacing--20); }
.wc-block-product-template .wp-block-button__link { width: 100%; }
.wp-block-query-pagination { gap: var(--wp--preset--spacing--40); padding-block: var(--wp--preset--spacing--60); }
.wp-block-query-pagination :where(a, .page-numbers) { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.woocommerce-product-gallery, .wp-block-woocommerce-product-image-gallery { max-width: 100%; }
.woocommerce-product-gallery img { border-radius: var(--wpsite-radius); }
.woocommerce-product-gallery .flex-control-thumbs { display: flex; gap: var(--wp--preset--spacing--20); flex-wrap: wrap; }
.single-product main > .wp-block-columns { gap: var(--wp--preset--spacing--70); }
.wp-block-woocommerce-product-meta { color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--small); }
.woocommerce div.product form.cart { display: flex; align-items: center; gap: var(--wp--preset--spacing--40); flex-wrap: wrap; }
.woocommerce div.product form.variations_form { display: block; }
.woocommerce .variations_form .variations select { height: auto; line-height: 1.4; padding-block: var(--wp--preset--spacing--30); }

:where(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), select, textarea) {
    max-width: 100%;
    min-height: 44px;
    border: 1px solid var(--wpsite-border);
    border-radius: var(--wp--custom--radius--small);
    padding: var(--wp--preset--spacing--30);
    background-color: var(--wp--preset--color--surface);
    color: var(--wp--preset--color--ink);
    font: inherit;
}
:where(input[type="checkbox"], input[type="radio"]) { accent-color: var(--wp--preset--color--primary); }
:where(button, input[type="submit"], .wp-element-button, .wc-block-components-button, .woocommerce a.button, .woocommerce button.button) { min-height: 44px; }
.woocommerce :where(a.button, button.button, input.button), .wc-block-components-button:not(.is-link) {
    border-radius: var(--wp--custom--radius--small);
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--surface);
    font-size: var(--wp--preset--font-size--body);
    font-weight: 600;
}
.wc-block-cart, .wc-block-checkout { font-size: var(--wp--preset--font-size--body); }
.wc-block-cart__sidebar, .wc-block-checkout__sidebar {
    background: var(--wp--preset--color--surface);
    border: 1px solid var(--wpsite-border);
    border-radius: var(--wpsite-radius);
    padding: var(--wp--preset--spacing--50);
    align-self: start;
}
.wc-block-components-text-input input, .wc-block-components-combobox input { color: var(--wp--preset--color--ink); }
.wc-block-components-validation-error, .woocommerce-invalid label { font-weight: 600; }
.woocommerce-notices-wrapper, .wc-block-components-notice-banner { overflow-wrap: anywhere; }
.woocommerce :where(.woocommerce-message, .woocommerce-info), .wc-block-components-notice-banner.is-info {
    background: var(--wp--preset--color--accent);
    color: var(--wp--preset--color--ink);
    border-color: var(--wp--preset--color--primary);
    border-radius: var(--wp--custom--radius--small);
}
.wpsite-empty-state, .wp-block-woocommerce-empty-cart-block {
    padding-block: var(--wp--preset--spacing--70);
    text-align: center;
}
.wpsite-empty-state .wp-block-buttons { justify-content: center; }
.wpsite-empty-state .wp-block-search { max-width: 480px; margin-inline: auto; }
.wpsite-footer { border-top: 1px solid var(--wpsite-border); padding-block: var(--wp--preset--spacing--70); }
.wpsite-footer .wp-block-navigation { max-width: 820px; }
.wpsite-footer .wp-block-navigation__container { gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50); }
.wpsite-footer .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; }

@media (max-width: 960px) {
    .wpsite-header-row { gap: var(--wp--preset--spacing--40); }
    .wpsite-header-tools { gap: var(--wp--preset--spacing--30); }
    .wpsite-header-tools .wp-block-search { width: 170px; }
    .wp-block-woocommerce-product-collection .wc-block-product-template { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .wpsite-hero > .wp-block-column:first-child { padding: var(--wp--preset--spacing--60); }
    .single-product main > .wp-block-columns { gap: var(--wp--preset--spacing--50); }
    .single-product main > .wp-block-columns > .wp-block-column { flex-basis: 0 !important; flex-grow: 1; }
}

@media (max-width: 720px) {
    .wpsite-catalog-filters { grid-template-columns: 1fr; gap: var(--wp--preset--spacing--50); }
    .wpsite-header-tools { width: 100%; justify-content: space-between; }
    .wpsite-header-tools .wp-block-search { flex: 1; width: auto; }
    .wpsite-header-row > .wp-block-navigation { margin-left: auto; }
    .wpsite-categories, .wp-block-woocommerce-product-collection .wc-block-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .wpsite-categories { gap: var(--wp--preset--spacing--40); }
    .wpsite-hero { flex-direction: column; }
    .wpsite-hero img { min-height: 0; max-height: 420px; aspect-ratio: 4 / 3; }
    .single-product main > .wp-block-columns { flex-direction: column; }
    .single-product main > .wp-block-columns > .wp-block-column { flex-basis: auto !important; }
    .wc-block-cart .wc-block-components-main, .wc-block-checkout .wc-block-components-main,
    .wc-block-cart__sidebar, .wc-block-checkout__sidebar { width: 100%; padding-inline: var(--wp--preset--spacing--40); }
    .wc-block-cart .wc-block-components-sidebar-layout, .wc-block-checkout .wc-block-components-sidebar-layout { flex-direction: column; }
    .wpsite-footer > .wp-block-group { flex-direction: column; }
    .wpsite-promotion { padding: var(--wp--preset--spacing--60); }
}

@media (max-width: 480px) {
    .wp-site-blocks main { padding-block: var(--wp--preset--spacing--60) var(--wp--preset--spacing--70); }
    .wpsite-home .wp-block-post-content > * + * { margin-block-start: var(--wp--preset--spacing--70); }
    .wpsite-header-tools { flex-wrap: wrap; }
    .wpsite-header-tools .wp-block-search { min-width: 140px; }
    .wpsite-header-tools .wp-block-navigation { font-size: var(--wp--preset--font-size--small); }
    .wpsite-hero > .wp-block-column:first-child, .wpsite-promotion { padding: var(--wp--preset--spacing--50); }
    .wp-block-woocommerce-product-collection .wc-block-product-template { gap: var(--wp--preset--spacing--50) var(--wp--preset--spacing--30); }
    .wc-block-product-template .wp-block-button__link { padding-inline: var(--wp--preset--spacing--20); font-size: var(--wp--preset--font-size--small); }
    .wc-block-cart__sidebar, .wc-block-checkout__sidebar { padding: var(--wp--preset--spacing--40); }
    .wpsite-checkout-header .wp-block-group { gap: var(--wp--preset--spacing--30); }
}
