/*
  Allegory — per-variant stock status indicator on size picker buttons.

  Renders a small colored dot at the top-right of each size label so
  customers can tell at a glance which sizes are in stock vs pre-order
  without having to click each one.

  Driven by the `data-allegory-stock-state` attribute emitted in
  snippets/product-variant-options.liquid:

    data-allegory-stock-state="in-stock"   → green dot
    data-allegory-stock-state="pre-order"  → amber dot
    data-allegory-stock-state="sold-out"   → no dot (falls back to theme's
                                             built-in disabled styling)
*/

/* Ensure labels can host the pseudo-element dot */
.product-form__controls-group label[data-allegory-stock-state] {
  position: relative;
}

/* Base dot styling — shared across in-stock / pre-order.
   Sized at ~6px (smaller than the original 7px) to feel like a subtle indicator,
   not a badge. Tucked into the top-right corner. No pulse animation. */
.product-form__controls-group label[data-allegory-stock-state="in-stock"]::after,
.product-form__controls-group label[data-allegory-stock-state="pre-order"]::after {
  content: "";
  position: absolute;
  top: 4px;
  right: 4px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  pointer-events: none;
}

/* In-stock: green */
.product-form__controls-group label[data-allegory-stock-state="in-stock"]::after {
  background-color: #0a8f4e;
}

/* Pre-order: amber */
.product-form__controls-group label[data-allegory-stock-state="pre-order"]::after {
  background-color: #e89b2e;
}

/* Sold-out variants: hide the dot, let the theme's disabled styling take over.
   Non-size options (color, material, style): also no dot. */
.product-form__controls-group label[data-allegory-stock-state="sold-out"]::after,
.product-form__controls-group label[data-allegory-stock-state="none"]::after {
  display: none;
}

/* Color swatch labels (color options with swatch UI) — no dot either.
   Belt-and-suspenders alongside the Liquid-side suppression. */
.product-form__controls--colors label[data-allegory-stock-state]::after {
  display: none;
}
