:root {
  --theme-gradient-start: #ffffff;
  --theme-gradient-end: #eaf8f5;
  --theme-accent: #078d87;
  --theme-accent-hover: #08736f;
  --theme-text: #172a33;
  --theme-discount: #ff6b55;
  --theme-promo: #078d87;
  --theme-radius: 8px;
  --theme-surface: #ffffff;
  --theme-soft: #eef8f6;
  --theme-border: #dce7e7;
  --theme-promo-text: #ffffff;
  --teal: var(--theme-accent);
  --teal-dark: var(--theme-accent-hover);
  --ink: var(--theme-text);
  --line: var(--theme-border);
}

/* Спільний вигляд перемикачів фасування у каталозі, модалі та картці. */
.variant-picker{display:flex!important;flex-wrap:wrap;justify-content:flex-start!important;align-items:center;gap:6px;width:100%;margin:10px 0 14px}
.variant-picker button{min-height:34px;padding:7px 13px;border:1px solid var(--theme-border);border-radius:calc(var(--theme-radius) + 4px);background:var(--theme-surface);color:var(--theme-text);font:700 12px/1.2 Manrope,system-ui,sans-serif;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s}
.variant-picker button:hover{border-color:var(--theme-accent);background:var(--theme-soft)}
.variant-picker button.active{color:var(--theme-text);border-color:var(--theme-accent);background:color-mix(in srgb,var(--theme-accent) 13%,var(--theme-surface));box-shadow:inset 0 0 0 1px var(--theme-accent)}
.variant-picker button:focus-visible{outline:2px solid var(--theme-accent);outline-offset:3px}
.variant-picker.modal button,.variant-picker.page button{min-height:40px;padding:9px 16px;font-size:13px}

html:not([data-theme-preset="normal"]) body { color: var(--theme-text); background: radial-gradient(ellipse 85% 80% at 50% 46%, color-mix(in srgb, var(--theme-gradient-start) 92%, var(--theme-gradient-end)) 0%, var(--theme-gradient-end) 48%, color-mix(in srgb, var(--theme-gradient-end) 74%, var(--theme-accent)) 78%, color-mix(in srgb, var(--theme-gradient-end) 45%, var(--theme-accent)) 100%) fixed; }
html:not([data-theme-preset="normal"]) .topline { background: linear-gradient(90deg, var(--theme-accent-hover), var(--theme-accent)); }
html:not([data-theme-preset="normal"]) :is(.site-header,.product-card,.benefits,dialog,.filter,.secondary-button) { background-color: var(--theme-surface); }
html:not([data-theme-preset="normal"]) :is(.primary-button,.add-button,.category-nav .catalog-trigger,.filter.active,.filter:hover) { border-color: var(--theme-accent); border-radius: var(--theme-radius); background: var(--theme-accent); }
html:not([data-theme-preset="normal"]) :is(.primary-button:hover,.add-button:hover) { background: var(--theme-accent-hover); }
html:not([data-theme-preset="normal"]) :is(.product-card,.benefits,.promo-slider,.product-full,.recommendations,.reviews-section) { border-color: var(--theme-border); border-radius: calc(var(--theme-radius) + 6px); }
html:not([data-theme-preset="normal"]) :is(.product-badge:not(.hit),.price-sale) { background: var(--theme-discount); }
html:not([data-theme-preset="normal"]) .promo-copy .primary-button { color: var(--theme-promo-text); background: var(--theme-promo); }
html:not([data-theme-preset="normal"]) :is(footer,.payment-note,.catalog-filters) { background: var(--theme-soft); }
html:not([data-theme-preset="normal"]) .promo-slider { background: linear-gradient(135deg, var(--theme-gradient-start), var(--theme-gradient-end)); }
html:not([data-theme-preset="normal"]) .promo-slide:not([style]) { background-image: linear-gradient(105deg, color-mix(in srgb, var(--theme-gradient-start) 92%, white), color-mix(in srgb, var(--theme-gradient-end) 86%, var(--theme-accent))); }
@media (max-width:700px) { html:not([data-theme-preset="normal"]) body { background: radial-gradient(ellipse 115% 58% at 50% 35%, color-mix(in srgb, var(--theme-gradient-start) 88%, var(--theme-gradient-end)) 0%, var(--theme-gradient-end) 58%, color-mix(in srgb, var(--theme-gradient-end) 42%, var(--theme-accent)) 100%) fixed; } }