/* swatchbook — script-less fallback.
 *
 * Include this stylesheet whenever a page contains <swatch-book> but might load
 * WITHOUT swatchbook.js (e.g. production, or before the script executes). While
 * the element is undefined it would otherwise render every swatch stacked; this
 * collapses it to the single default swatch so the page looks finished.
 *
 * Once swatchbook.js defines the element, `:not(:defined)` stops matching and
 * the component takes over rendering — so this rule is inert when the script is
 * present. It's safe (and recommended) to ship on every page.
 */

swatch-book:not(:defined) > [data-swatch]:not([data-default]) {
  display: none;
}

/* If no swatch is marked data-default, keep only the first. */
swatch-book:not(:defined):not(:has(> [data-default]))
  > [data-swatch]:not(:first-child) {
  display: none;
}