/*
 * Gushy WooCommerce look (theme, builder B). Loaded after gushy.css on
 * WooCommerce screens only (inc/commerce.php), replacing WooCommerce's own
 * stylesheets, which are switched off.
 *
 * Everything sits in the `components` cascade layer that the compiled Tailwind
 * stylesheet declares, so a Tailwind utility in any template always wins over
 * these rules. Plain CSS on purpose (no build step); the tokens are the
 * preview's :root variables from src/styles.css.
 *
 * Scopes: .gushy-wc (cart / checkout / account shell, woocommerce/gushy-page.php),
 * .gushy-add-to-cart (merch product form) and .woocommerce-notices-wrapper.
 */

@layer components {
  /* ------------------------------------------------------------------ */
  /* Accessibility helpers WooCommerce expects from the theme            */
  /* ------------------------------------------------------------------ */
  .screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    overflow-wrap: normal !important;
  }
  .screen-reader-text:focus {
    clip: auto !important;
    clip-path: none;
    display: block;
    height: auto;
    left: 5px;
    top: 5px;
    width: auto;
    z-index: 100000;
    padding: 0.75rem 1rem;
    background: var(--card);
    color: var(--ink);
    border-radius: 9999px;
  }

  /* ------------------------------------------------------------------ */
  /* Type and links inside WooCommerce content                          */
  /* ------------------------------------------------------------------ */
  .gushy-wc .woocommerce :is(h2, h3):not(.display) {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 1.6rem;
    line-height: 1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    margin: 0 0 1rem;
  }
  .gushy-wc .woocommerce :is(p, address, ul, ol, table, fieldset, form) + :is(h2, h3):not(.display) {
    margin-top: 2rem;
  }
  .gushy-wc .woocommerce p:not([class]) + p:not([class]) {
    margin-top: 0.75rem;
  }
  .gushy-wc a:where(:not([class*="pill"]):not(.button):not(.remove)),
  .woocommerce-notices-wrapper a:where(:not(.button)) {
    color: inherit;
    font-weight: 700;
    text-decoration-line: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
    transition: color 160ms ease;
  }
  .gushy-wc a:where(:not([class*="pill"]):not(.button):not(.remove)):hover,
  .woocommerce-notices-wrapper a:where(:not(.button)):hover {
    color: var(--green);
  }
  .gushy-wc mark {
    background: color-mix(in srgb, var(--gold) 35%, transparent);
    color: var(--ink);
    padding: 0 0.3em;
    border-radius: 0.35em;
    font-weight: 700;
  }
  .gushy-wc strong {
    font-weight: 700;
  }
  .gushy-wc address {
    font-style: normal;
    line-height: 1.7;
  }

  /* ------------------------------------------------------------------ */
  /* Buttons: .button = the site's primary pill (pill-solid)             */
  /* ------------------------------------------------------------------ */
  :is(.gushy-wc, .gushy-add-to-cart, .woocommerce-notices-wrapper)
    :is(.button, [id="place_order"], .single_add_to_cart_button) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--btn-gap);
    border-radius: var(--btn-radius);
    padding: var(--btn-py) var(--btn-px);
    min-height: 44px;
    font-family: var(--font-sans);
    font-size: var(--btn-font-size);
    font-weight: var(--btn-font-weight);
    line-height: 1;
    text-transform: lowercase;
    text-decoration: none;
    white-space: nowrap;
    border: var(--btn-border) solid transparent;
    background: var(--green);
    color: #fff;
    box-shadow: 0 10px 24px -14px rgba(46, 144, 68, 0.7);
    cursor: pointer;
    transition:
      transform 160ms ease,
      box-shadow 160ms ease,
      opacity 160ms ease,
      background 160ms ease,
      color 160ms ease;
  }
  :is(.gushy-wc, .gushy-add-to-cart, .woocommerce-notices-wrapper)
    :is(.button, [id="place_order"], .single_add_to_cart_button)::before {
    content: "";
    width: 1.35em;
    height: 1.35em;
    flex: none;
    background-color: currentColor;
    -webkit-mask: var(--btn-mark) center / contain no-repeat;
    mask: var(--btn-mark) center / contain no-repeat;
  }
  :is(.gushy-wc, .gushy-add-to-cart, .woocommerce-notices-wrapper)
    :is(.button, [id="place_order"], .single_add_to_cart_button):hover {
    transform: translateY(-2px);
    box-shadow: 0 20px 45px -20px rgba(46, 144, 68, 0.45);
  }
  :is(.gushy-wc, .gushy-add-to-cart, .woocommerce-notices-wrapper)
    :is(.button, [id="place_order"], .single_add_to_cart_button):is(:disabled, .disabled, [aria-disabled="true"]) {
    opacity: 0.45;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
  }

  /* Secondary actions = the outline pill (pill-outline). */
  .gushy-wc
    :is(
      button[name="update_cart"],
      button[name="apply_coupon"],
      .woocommerce-orders-table .button,
      .woocommerce-pagination .button,
      .woocommerce-Address .edit,
      .order-again .button,
      .woocommerce-MyAccount-downloads .button,
      .shipping-calculator-form .button,
      .wc-backward:not(.pill-solid)
    ) {
    background: transparent;
    color: var(--ink);
    border-color: var(--ink);
    box-shadow: none;
  }
  .gushy-wc
    :is(
      button[name="update_cart"],
      button[name="apply_coupon"],
      .woocommerce-orders-table .button,
      .woocommerce-pagination .button,
      .order-again .button,
      .woocommerce-MyAccount-downloads .button,
      .shipping-calculator-form .button,
      .wc-backward:not(.pill-solid)
    ):hover {
    background: var(--ink);
    color: var(--sand);
    box-shadow: none;
  }
  /* Small pills inside tables and notices. */
  :is(.gushy-wc, .woocommerce-notices-wrapper)
    :is(.woocommerce-orders-table .button, .woocommerce-message .button, .woocommerce-info .button, .woocommerce-error .button) {
    min-height: 40px;
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
  }
  .gushy-wc .woocommerce-orders-table .button + .button {
    margin-left: 0.375rem;
  }
  /* Order actions in the order details table (order received, view order):
     small pills; "pay" stays the solid pill, the rest are outline, and
     cancel turns to the error color on hover. */
  .gushy-wc .order-actions-button {
    min-height: 40px;
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
  }
  .gushy-wc .order-actions-button + .order-actions-button {
    margin-left: 0.375rem;
  }
  .gushy-wc .order-actions-button:not(.pay) {
    background: transparent;
    color: var(--ink);
    border-color: var(--ink);
    box-shadow: none;
  }
  .gushy-wc .order-actions-button:not(.pay):hover {
    background: var(--ink);
    color: var(--sand);
    box-shadow: none;
  }
  .gushy-wc :is(.order-actions-button, .woocommerce-orders-table .button).cancel:hover {
    background: var(--destructive);
    border-color: var(--destructive);
    color: #fff;
  }

  /* ------------------------------------------------------------------ */
  /* Notices                                                             */
  /* ------------------------------------------------------------------ */
  .woocommerce-notices-wrapper:empty {
    display: none;
  }
  :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    margin: 0 0 1.5rem;
    padding: 1rem 1.25rem 1rem 3.25rem;
    list-style: none;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    box-shadow:
      0 1px 2px rgba(40, 37, 32, 0.04),
      0 10px 30px -16px rgba(40, 37, 32, 0.12);
    color: var(--ink);
    font-size: 0.925rem;
    font-weight: 600;
    line-height: 1.5;
  }
  :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before {
    content: "";
    position: absolute;
    left: 1.1rem;
    top: 1.05rem;
    width: 1.35rem;
    height: 1.35rem;
    background-color: var(--green);
    -webkit-mask: var(--gushy-notice-icon) center / contain no-repeat;
    mask: var(--gushy-notice-icon) center / contain no-repeat;
  }
  /* Notices are not controls; WooCommerce focuses them for screen readers. */
  :is(.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-NoticeGroup):focus {
    outline: none;
  }
  :is(.gushy-wc, .gushy-add-to-cart) :is(input, textarea)::placeholder {
    text-transform: lowercase;
    color: color-mix(in srgb, var(--ink) 45%, transparent);
  }
  .woocommerce-message {
    --gushy-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E");
    border-left: 4px solid var(--green);
  }
  .woocommerce-info {
    --gushy-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");
    border-left: 4px solid var(--gold);
  }
  .woocommerce-info::before {
    background-color: color-mix(in srgb, var(--gold) 70%, var(--ink));
  }
  .woocommerce-error {
    --gushy-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 8v4'/%3E%3Cpath d='M12 16h.01'/%3E%3C/svg%3E");
    flex-direction: column;
    align-items: flex-start;
    gap: 0.35rem;
    border-left: 4px solid var(--destructive);
  }
  .woocommerce-error::before {
    background-color: var(--destructive);
  }
  :is(.woocommerce-message, .woocommerce-info) .button {
    order: 2;
    margin-left: auto;
  }
  /* Error lists: one row per message. A message with its own button ("view
     cart" after a stock refusal) lays out like the other notices: text left,
     button right, both on the icon's line. */
  .woocommerce-error > li {
    width: 100%;
  }
  .woocommerce-error > li:has(> .button) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
  }
  .woocommerce-error > li > .button {
    order: 2;
    margin-left: auto;
  }
  @media (min-width: 768px) {
    .woocommerce-error:has(> li:only-child > .button)::before {
      top: 50%;
      transform: translateY(-50%);
    }
  }
  /* A button inside an error is a way out, not the main action: outline. */
  :is(.gushy-wc, .gushy-add-to-cart, .woocommerce-notices-wrapper, .gushy-site-notices) .woocommerce-error .button {
    background: transparent;
    color: var(--ink);
    border-color: var(--ink);
    box-shadow: none;
  }
  :is(.gushy-wc, .gushy-add-to-cart, .woocommerce-notices-wrapper, .gushy-site-notices) .woocommerce-error .button:hover {
    background: var(--ink);
    color: var(--sand);
    box-shadow: none;
  }
  /* Checkout error lists link each message to its field: the whole line is
     the link, so it reads as text and underlines on hover only. */
  .woocommerce-error > li > a:only-child:not(.button) {
    text-decoration-line: none;
  }
  .woocommerce-error > li > a:only-child:not(.button):hover {
    text-decoration-line: underline;
    color: var(--destructive);
  }
  /* From tablet up the text and its button share one row: center the icon on
     that row (on phones the button wraps under the text and the icon stays
     on the first line). */
  @media (min-width: 768px) {
    :is(.woocommerce-message, .woocommerce-info):has(> .button)::before {
      top: 50%;
      transform: translateY(-50%);
    }
  }
  /* Product page notices ("added to your cart"): clear of the breadcrumb, and
     the grid's own top margin spaces them from the product. */
  .gushy-product-notices > .woocommerce-notices-wrapper:not(:empty) {
    margin-top: 1rem;
  }
  @media (min-width: 768px) {
    .gushy-product-notices > .woocommerce-notices-wrapper:not(:empty) {
      margin-top: 1.5rem;
    }
  }
  .gushy-product-notices > .woocommerce-notices-wrapper > :last-child {
    margin-bottom: 0;
  }
  /* Store notice bar (WooCommerce > Settings > Store notice, printed on every
     page): a dark floating bar at the bottom, clear of the sticky header,
     with the dismiss link as a small outline pill. */
  .woocommerce-store-notice {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 80;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    max-width: 56rem;
    margin: 0 auto;
    padding: 0.8rem 0.8rem 0.8rem 1.25rem;
    background: var(--ink);
    color: var(--sand);
    border-radius: 1.25rem;
    box-shadow: 0 20px 50px -20px rgba(40, 37, 32, 0.55);
    font-family: var(--font-sans);
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.45;
  }
  .woocommerce-store-notice a {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .woocommerce-store-notice a.woocommerce-store-notice__dismiss-link {
    display: inline-flex;
    align-items: center;
    min-height: 36px;
    margin-left: auto;
    padding: 0.4rem 0.9rem;
    border: 1.5px solid color-mix(in srgb, var(--sand) 45%, transparent);
    border-radius: 9999px;
    font-size: 0.75rem;
    text-decoration: none;
    transition:
      background 150ms ease,
      color 150ms ease;
  }
  .woocommerce-store-notice a.woocommerce-store-notice__dismiss-link:hover {
    background: var(--sand);
    color: var(--ink);
  }
  @media (min-width: 768px) {
    .woocommerce-store-notice {
      left: 1.5rem;
      right: 1.5rem;
      bottom: 1.5rem;
    }
  }

  /* WooCommerce's loading overlay (cart updates, checkout review, coupon):
     its white veil stays, with the site's green spinner on top. */
  .blockUI.blockOverlay::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 2rem;
    height: 2rem;
    margin: -1rem 0 0 -1rem;
    border: 3px solid color-mix(in srgb, var(--green) 22%, transparent);
    border-top-color: var(--green);
    border-radius: 9999px;
    animation: gushy-wc-spin 0.8s linear infinite;
  }
  @media (prefers-reduced-motion: reduce) {
    .blockUI.blockOverlay::before {
      animation-duration: 2.4s;
    }
  }

  /* The empty-cart message is the headline of the empty-state card. */
  .gushy-cart-empty .wc-empty-cart-message {
    margin-top: 1.25rem;
  }
  .gushy-cart-empty .cart-empty.woocommerce-info {
    display: block;
    margin: 0;
    padding: 0;
    background: none;
    border: 0;
    box-shadow: none;
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 1.5rem;
    line-height: 1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
  }
  .gushy-cart-empty .cart-empty.woocommerce-info::before {
    display: none;
  }

  /* ------------------------------------------------------------------ */
  /* Form fields                                                         */
  /* ------------------------------------------------------------------ */
  :is(.gushy-wc, .gushy-add-to-cart) :is(.form-row, .woocommerce-form-row) {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin: 0 0 1rem;
  }
  :is(.gushy-wc, .gushy-add-to-cart) :is(.form-row, .woocommerce-form-row) > label:not(.checkbox):not(.woocommerce-form__label-for-checkbox),
  .gushy-wc fieldset legend {
    font-family: var(--font-display);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    line-height: 1.2;
    text-transform: lowercase;
    color: color-mix(in srgb, var(--ink) 72%, transparent);
  }
  .gushy-wc .required {
    color: var(--destructive);
    text-decoration: none;
    border: 0;
  }
  .gushy-wc .optional {
    color: var(--muted-foreground);
    font-weight: 500;
  }
  .gushy-wc .woocommerce-input-wrapper {
    display: block;
    width: 100%;
  }

  :is(.gushy-wc, .gushy-add-to-cart)
    :is(.form-row, .woocommerce-form-row, .coupon, .quantity, table.variations, .woocommerce-address-fields)
    :is(
      input[type="text"],
      input[type="email"],
      input[type="tel"],
      input[type="password"],
      input[type="number"],
      input[type="search"],
      input[type="url"],
      input[type="date"],
      input.input-text,
      textarea,
      select
    ) {
    width: 100%;
    min-height: 48px;
    padding: 0.7rem 1rem;
    border: 1px solid var(--border);
    border-radius: 14px;
    background-color: var(--card);
    color: var(--ink);
    font: inherit;
    font-size: 0.95rem;
    font-weight: 500;
    line-height: 1.4;
    text-transform: none;
    transition:
      border-color 150ms ease,
      box-shadow 150ms ease;
  }
  :is(.gushy-wc, .gushy-add-to-cart)
    :is(.form-row, .woocommerce-form-row, .coupon, .quantity, table.variations, .woocommerce-address-fields)
    :is(input, textarea, select):focus {
    outline: none;
    border-color: var(--green);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--green) 22%, transparent);
  }
  :is(.gushy-wc, .gushy-add-to-cart) :is(.form-row, .woocommerce-form-row) textarea {
    min-height: 120px;
    resize: vertical;
  }
  :is(.gushy-wc, .gushy-add-to-cart) :is(.form-row, .woocommerce-form-row, table.variations, .woocommerce-address-fields) select {
    appearance: none;
    cursor: pointer;
    padding-right: 2.75rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23282520' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1rem;
  }
  .gushy-wc .woocommerce-invalid :is(input, select, textarea) {
    border-color: var(--destructive);
  }
  .gushy-wc .woocommerce-validated :is(input, select):not(:focus) {
    border-color: color-mix(in srgb, var(--green) 45%, var(--border));
  }
  .gushy-wc .checkout-inline-error-message {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--destructive);
  }
  :is(.gushy-wc, .gushy-add-to-cart) input:is([type="checkbox"], [type="radio"]) {
    width: 1.1rem;
    height: 1.1rem;
    flex: none;
    accent-color: var(--green);
    cursor: pointer;
  }
  .gushy-wc :is(label.checkbox, .woocommerce-form__label-for-checkbox) {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.925rem;
    font-weight: 600;
    color: var(--ink);
    cursor: pointer;
  }
  .gushy-wc .form-row .description,
  .gushy-wc .woocommerce-form-row em,
  .gushy-wc fieldset em {
    font-size: 0.8rem;
    font-style: normal;
    color: var(--muted-foreground);
  }
  .gushy-wc fieldset {
    margin: 1.5rem 0 1rem;
    padding: 1.25rem 1.25rem 0.25rem;
    border: 1px solid var(--border);
    border-radius: 1.25rem;
  }
  .gushy-wc fieldset legend {
    padding: 0 0.5rem;
  }

  /* Two-column address grids (checkout, edit address). */
  .gushy-wc
    :is(
      .woocommerce-billing-fields__field-wrapper,
      .woocommerce-shipping-fields__field-wrapper,
      .woocommerce-address-fields__field-wrapper,
      .woocommerce-additional-fields__field-wrapper
    ) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    column-gap: 1rem;
  }
  @media (min-width: 640px) {
    .gushy-wc
      :is(
        .woocommerce-billing-fields__field-wrapper,
        .woocommerce-shipping-fields__field-wrapper,
        .woocommerce-address-fields__field-wrapper
      ) {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
    .gushy-wc
      :is(
        .woocommerce-billing-fields__field-wrapper,
        .woocommerce-shipping-fields__field-wrapper,
        .woocommerce-address-fields__field-wrapper
      )
      > .form-row:not(.form-row-first):not(.form-row-last) {
      grid-column: 1 / -1;
    }
    .gushy-wc .woocommerce-EditAccountForm {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      column-gap: 1rem;
    }
    .gushy-wc .woocommerce-EditAccountForm > :not(.form-row-first):not(.form-row-last) {
      grid-column: 1 / -1;
    }
  }
  .gushy-wc .woocommerce-EditAccountForm > .clear,
  .gushy-wc .clear {
    display: none;
  }

  /* Password field: WooCommerce wraps it and adds a show/hide button. */
  .gushy-wc .password-input {
    position: relative;
    display: block;
    width: 100%;
  }
  .gushy-wc .password-input input {
    padding-right: 3rem !important;
  }
  .gushy-wc .show-password-input {
    position: absolute;
    right: 0.6rem;
    top: 50%;
    width: 2.25rem;
    height: 2.25rem;
    transform: translateY(-50%);
    border-radius: 9999px;
    background-color: var(--muted-foreground);
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")
      center / 1.15rem no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E")
      center / 1.15rem no-repeat;
    cursor: pointer;
  }
  .gushy-wc .show-password-input.display-password {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49'/%3E%3Cpath d='M14.084 14.158a3 3 0 0 1-4.242-4.242'/%3E%3Cpath d='M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143'/%3E%3Cpath d='m2 2 20 20'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49'/%3E%3Cpath d='M14.084 14.158a3 3 0 0 1-4.242-4.242'/%3E%3Cpath d='M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143'/%3E%3Cpath d='m2 2 20 20'/%3E%3C/svg%3E");
  }
  .gushy-wc .woocommerce-password-strength {
    margin-top: 0.5rem;
    padding: 0.4rem 0.8rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 700;
    text-align: center;
    background: color-mix(in srgb, var(--destructive) 14%, var(--card));
    color: var(--destructive);
  }
  .gushy-wc .woocommerce-password-strength.good {
    background: color-mix(in srgb, var(--gold) 25%, var(--card));
    color: color-mix(in srgb, var(--gold) 45%, var(--ink));
  }
  .gushy-wc .woocommerce-password-strength.strong {
    background: color-mix(in srgb, var(--green) 14%, var(--card));
    color: var(--green);
  }
  .gushy-wc .woocommerce-password-hint {
    display: block;
    margin-top: 0.4rem;
    font-size: 0.8rem;
    color: var(--muted-foreground);
  }

  /* Quantity */
  :is(.gushy-wc, .gushy-add-to-cart) .quantity {
    display: inline-flex;
  }
  :is(.gushy-wc, .gushy-add-to-cart) div.quantity input.input-text.qty {
    width: 5.5rem;
    min-height: 44px;
    border-radius: 9999px;
    text-align: center;
    font-weight: 700;
  }

  /* ------------------------------------------------------------------ */
  /* Tables (cart, checkout review, orders, order details)               */
  /* ------------------------------------------------------------------ */
  .gushy-wc table.shop_table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.625rem;
    overflow: hidden;
    box-shadow:
      0 1px 2px rgba(40, 37, 32, 0.04),
      0 10px 30px -16px rgba(40, 37, 32, 0.12);
    font-size: 0.95rem;
  }
  .gushy-wc table.shop_table :is(th, td) {
    padding: 1rem 1.25rem;
    text-align: left;
    vertical-align: middle;
    border-top: 1px solid var(--border);
  }
  .gushy-wc table.shop_table thead th {
    border-top: 0;
    background: color-mix(in srgb, var(--sand) 70%, var(--card));
    font-family: var(--font-display);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: lowercase;
    color: color-mix(in srgb, var(--ink) 65%, transparent);
  }
  .gushy-wc table.shop_table:not(:has(thead)) tbody tr:first-child :is(th, td) {
    border-top: 0;
  }
  .gushy-wc table.shop_table tfoot :is(th, td) {
    font-weight: 700;
  }
  .gushy-wc table.shop_table :is(.order-total, .order_total) :is(th, td) {
    font-size: 1.1rem;
    font-weight: 800;
  }
  .gushy-wc table.shop_table .product-name a {
    font-weight: 700;
  }
  .gushy-wc table.shop_table .product-quantity,
  .gushy-wc table.shop_table .product-total {
    white-space: nowrap;
  }
  .gushy-wc table.shop_table :is(.wc-item-meta, .variation) {
    margin-top: 0.35rem;
    font-size: 0.8rem;
    color: var(--muted-foreground);
    list-style: none;
  }
  .gushy-wc table.shop_table :is(.wc-item-meta, .variation) :is(p, dd, dt, li) {
    display: inline;
    margin: 0;
  }

  /* Cart table */
  .gushy-wc table.cart .product-thumbnail {
    width: 96px;
  }
  .gushy-wc table.cart .product-thumbnail img {
    width: 72px;
    height: 72px;
    object-fit: contain;
    border-radius: 14px;
    background: var(--cream);
    border: 1px solid var(--border);
  }
  .gushy-wc table.cart .product-remove {
    width: 56px;
  }
  .gushy-wc a.remove {
    display: grid;
    place-items: center;
    width: 2rem;
    height: 2rem;
    border-radius: 9999px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--muted-foreground);
    font-size: 1.15rem;
    line-height: 1;
    text-decoration: none;
    transition:
      background 150ms ease,
      color 150ms ease,
      border-color 150ms ease;
  }
  .gushy-wc a.remove:hover {
    background: var(--destructive);
    border-color: var(--destructive);
    color: #fff;
  }
  .gushy-wc table.cart td.actions {
    background: color-mix(in srgb, var(--sand) 55%, var(--card));
  }
  .gushy-wc table.cart td.actions::after {
    content: "";
    display: table;
    clear: both;
  }
  .gushy-wc table.cart td.actions .coupon {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
  }
  .gushy-wc table.cart td.actions .coupon .input-text {
    width: 12rem;
    min-height: 44px;
    border-radius: 9999px;
  }
  .gushy-wc table.cart td.actions > button[name="update_cart"] {
    float: right;
  }
  /* Inline coupon error (cart and checkout coupon forms): its own line under
     the field, in the error color. */
  .gushy-wc .coupon-error-notice {
    display: block;
    flex-basis: 100%;
    width: 100%;
    margin: 0.15rem 0 0;
    padding-left: 1rem;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.4;
    color: var(--destructive);
    text-align: left;
  }
  .gushy-wc table.cart td.actions .coupon:has(.coupon-error-notice) {
    max-width: 100%;
  }
  @media (min-width: 768px) {
    /* Keep "update cart" on the coupon row while an inline error shows. */
    .gushy-wc table.cart td.actions .coupon:has(.coupon-error-notice) {
      max-width: calc(100% - 12rem);
    }
  }

  /* Responsive tables on phones (WooCommerce's shop_table_responsive). */
  @media (max-width: 767px) {
    .gushy-wc table.shop_table_responsive thead {
      display: none;
    }
    .gushy-wc table.shop_table_responsive tbody tr {
      display: block;
      border-top: 1px solid var(--border);
    }
    .gushy-wc table.shop_table_responsive tbody tr:first-child {
      border-top: 0;
    }
    /* Row headers (the order number in My account > Orders is a <th>) are
       shown like the other cells. The label is pushed left by its auto
       margin, so the cell's own pieces (e.g. "$25.00" + "for 1 item") stay
       together on the right. */
    .gushy-wc table.shop_table_responsive tbody th:not([data-title]) {
      display: none;
    }
    .gushy-wc table.shop_table_responsive tbody td,
    .gushy-wc table.shop_table_responsive tbody th[data-title] {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 0 0.3em;
      padding: 0.55rem 1.25rem;
      text-align: right;
      border-top: 0;
    }
    .gushy-wc table.shop_table_responsive tbody td[data-title]::before,
    .gushy-wc table.shop_table_responsive tbody th[data-title]::before {
      content: attr(data-title);
      margin-right: auto;
      padding-right: 1rem;
      font-weight: 700;
      text-align: left;
      color: color-mix(in srgb, var(--ink) 65%, transparent);
    }
    .gushy-wc table.shop_table_responsive tbody td:is(.product-remove, .product-thumbnail, .actions) {
      justify-content: flex-start;
    }
    .gushy-wc table.shop_table_responsive tbody tr :is(td, th):first-child {
      padding-top: 1rem;
    }
    .gushy-wc table.shop_table_responsive tbody tr :is(td, th):last-child {
      padding-bottom: 1rem;
    }
    .gushy-wc table.cart td.actions {
      flex-direction: column;
      align-items: stretch;
      text-align: left;
    }
    .gushy-wc table.cart td.actions .coupon {
      display: flex;
      margin-bottom: 0.5rem;
    }
    .gushy-wc table.cart td.actions .coupon > :is(.input-text, .button) {
      flex: 1 1 100%;
      width: 100%;
    }
    .gushy-wc table.cart tr.cart_item {
      position: relative;
    }
    .gushy-wc table.cart td.product-remove {
      position: absolute;
      top: 1rem;
      right: 1.25rem;
      width: auto;
      padding: 0 !important;
    }
    .gushy-wc table.cart td.actions > button[name="update_cart"] {
      float: none;
    }
    .gushy-wc table.shop_table_responsive .woocommerce-orders-table__cell-order-actions {
      flex-wrap: wrap;
      gap: 0.4rem;
    }
    /* Phones: view + cancel share the row with their label, so the table
       pills drop the brand mark and some padding. */
    .gushy-wc .woocommerce-orders-table .button {
      padding: 0.45rem 0.85rem;
    }
    .gushy-wc .woocommerce-orders-table .button::before {
      display: none;
    }
    .gushy-wc .woocommerce-orders-table .button + .button {
      margin-left: 0;
    }
  }

  /* ------------------------------------------------------------------ */
  /* Cart page layout + totals                                           */
  /* ------------------------------------------------------------------ */
  .gushy-wc .woocommerce:has(> .woocommerce-cart-form) {
    display: grid;
    gap: 2rem;
  }
  @media (min-width: 1024px) {
    .gushy-wc .woocommerce:has(> .woocommerce-cart-form) {
      grid-template-columns: minmax(0, 1fr) 400px;
      align-items: start;
    }
    .gushy-wc .woocommerce:has(> .woocommerce-cart-form) > * {
      grid-column: 1 / -1;
    }
    .gushy-wc .woocommerce:has(> .woocommerce-cart-form) > .woocommerce-cart-form {
      grid-column: 1;
    }
    .gushy-wc .woocommerce:has(> .woocommerce-cart-form) > .cart-collaterals {
      grid-column: 2;
      position: sticky;
      top: 92px;
    }
  }
  .gushy-wc .woocommerce > .woocommerce-notices-wrapper:empty,
  .gushy-wc .woocommerce > .woocommerce-notices-wrapper:not(:has(*)) {
    display: none;
  }
  .gushy-wc .cart-collaterals :is(.cart_totals, .cross-sells) {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.625rem;
    padding: 1.5rem;
    box-shadow:
      0 1px 2px rgba(40, 37, 32, 0.04),
      0 10px 30px -16px rgba(40, 37, 32, 0.12);
  }
  /* Totals first, suggestions under them. */
  .gushy-wc .cart-collaterals {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }
  .gushy-wc .cart-collaterals .cart_totals {
    order: 1;
  }
  .gushy-wc .cart-collaterals .cross-sells {
    order: 2;
  }
  .gushy-wc .cross-sells > h2:not(.display) {
    font-size: 1.25rem;
  }

  /* WooCommerce product loops (cart cross-sells, any [products] list): one
     compact row per product, thumbnail + name + price, small pill action. */
  .gushy-wc ul.products {
    list-style: none;
    display: grid;
    gap: 0.75rem;
    margin: 0;
    padding: 0;
  }
  .gushy-wc ul.products li.product {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1rem;
    padding: 0.75rem;
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    background: var(--cream);
  }
  .gushy-wc ul.products li.product .woocommerce-loop-product__link {
    flex: 1 1 9rem;
    min-width: 0;
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 1rem;
    align-items: center;
    color: inherit;
    font-weight: inherit;
    text-decoration-line: none;
  }
  .gushy-wc ul.products li.product .woocommerce-loop-product__link img {
    grid-row: 1 / span 2;
    width: 64px;
    height: 64px;
    object-fit: cover;
    border: 1px solid var(--border);
    border-radius: 14px;
    background: var(--card);
  }
  .gushy-wc ul.products li.product .woocommerce-loop-product__title {
    align-self: end;
    margin: 0;
    font-family: var(--font-sans);
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1.25;
    letter-spacing: 0;
    text-transform: lowercase;
    transition: color 160ms ease;
  }
  .gushy-wc ul.products li.product .woocommerce-loop-product__link:hover .woocommerce-loop-product__title {
    color: var(--green);
  }
  .gushy-wc ul.products li.product .price {
    align-self: start;
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--muted-foreground);
  }
  .gushy-wc ul.products li.product .woocommerce-loop-product__link > :is(.onsale, .star-rating) {
    display: none;
  }
  .gushy-wc ul.products li.product .button {
    flex: none;
    margin-left: auto;
    min-height: 36px;
    padding: 0.45rem 0.9rem;
    font-size: 0.75rem;
  }
  .gushy-wc ul.products li.product .button:not(.add_to_cart_button) {
    background: transparent;
    color: var(--ink);
    border-color: var(--ink);
    box-shadow: none;
  }
  .gushy-wc ul.products li.product .button:not(.add_to_cart_button):hover {
    background: var(--ink);
    color: var(--sand);
  }
  .gushy-wc ul.products li.product .button.loading {
    opacity: 0.6;
    pointer-events: none;
  }
  .gushy-wc ul.products li.product .added_to_cart {
    font-size: 0.75rem;
  }
  .gushy-wc :is(.cart_totals, #order_review) table.shop_table {
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }
  .gushy-wc .cart_totals table.shop_table :is(th, td) {
    padding: 0.8rem 0;
  }
  .gushy-wc .cart_totals table.shop_table td {
    text-align: right;
  }
  .gushy-wc .cart_totals table.shop_table tr:first-child :is(th, td) {
    border-top: 0;
  }
  @media (max-width: 767px) {
    .gushy-wc .cart_totals table.shop_table_responsive tbody td {
      padding: 0.8rem 0;
    }
  }
  .gushy-wc .wc-proceed-to-checkout {
    margin-top: 1.25rem;
  }
  .gushy-wc .wc-proceed-to-checkout .checkout-button {
    width: 100%;
    min-height: 52px;
    font-size: 1rem;
  }
  .gushy-wc :is(#shipping_method, .woocommerce-shipping-methods) {
    list-style: none;
    display: grid;
    gap: 0.4rem;
    justify-items: end;
  }
  .gushy-wc :is(#shipping_method, .woocommerce-shipping-methods) li {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
  }
  .gushy-wc :is(.woocommerce-shipping-destination, .woocommerce-shipping-contents) {
    margin-top: 0.5rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: var(--muted-foreground);
  }
  .gushy-wc .shipping-calculator-form {
    margin-top: 0.75rem;
    text-align: left;
  }

  /* ------------------------------------------------------------------ */
  /* Checkout                                                            */
  /* ------------------------------------------------------------------ */
  .gushy-wc :is(.woocommerce-form-coupon-toggle, .woocommerce-form-login-toggle) .woocommerce-info {
    margin-bottom: 1rem;
  }
  .gushy-wc :is(form.checkout_coupon, form.woocommerce-form-login.login:not(#customer_login form)) {
    margin: 0 0 1.5rem;
    padding: 1.5rem;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.625rem;
  }
  .gushy-wc form.checkout_coupon {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
  }
  .gushy-wc form.checkout_coupon .form-row {
    margin: 0;
  }
  .gushy-wc form.checkout_coupon > p:not(.form-row) {
    flex-basis: 100%;
    margin-bottom: 0.75rem;
    font-size: 0.9rem;
  }
  .gushy-wc form.checkout_coupon .form-row {
    flex: 1 1 12rem;
  }
  .gushy-wc form.checkout_coupon .form-row-last {
    flex: 0 0 auto;
  }

  .gushy-wc form.checkout {
    display: grid;
    gap: 1.5rem;
  }
  .gushy-wc form.checkout > #order_review_heading {
    margin: 0;
  }
  @media (min-width: 1024px) {
    .gushy-wc form.checkout {
      grid-template-columns: minmax(0, 1fr) 440px;
      grid-template-rows: auto auto 1fr;
      column-gap: 2rem;
      row-gap: 0;
      align-items: start;
    }
    .gushy-wc form.checkout > * {
      grid-column: 1 / -1;
    }
    .gushy-wc form.checkout > #customer_details {
      grid-column: 1;
      grid-row: 2 / span 2;
    }
    .gushy-wc form.checkout > #order_review_heading {
      grid-column: 2;
      grid-row: 2;
      margin: 0 0 1rem;
    }
    .gushy-wc form.checkout > #order_review {
      grid-column: 2;
      grid-row: 3;
      position: sticky;
      top: 92px;
    }
  }
  .gushy-wc #customer_details {
    display: grid;
    gap: 1.5rem;
  }
  .gushy-wc #customer_details > :is(.col-1, .col-2),
  .gushy-wc #order_review {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.625rem;
    padding: 1.5rem;
    box-shadow:
      0 1px 2px rgba(40, 37, 32, 0.04),
      0 10px 30px -16px rgba(40, 37, 32, 0.12);
  }
  @media (min-width: 768px) {
    .gushy-wc #customer_details > :is(.col-1, .col-2),
    .gushy-wc #order_review {
      padding: 2rem;
    }
  }
  .gushy-wc #ship-to-different-address {
    margin: 0 0 1rem;
    font-size: 1rem;
  }
  .gushy-wc #ship-to-different-address label {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    cursor: pointer;
  }
  .gushy-wc #order_review table.shop_table :is(th, td) {
    padding: 0.8rem 0;
  }
  .gushy-wc #order_review table.shop_table thead th {
    background: transparent;
  }
  .gushy-wc #order_review table.shop_table :is(.product-total, .product-subtotal, tfoot td) {
    text-align: right;
  }
  /* Pay for order (order-pay endpoint): the review form is the whole page,
     so it keeps a readable width instead of spanning the container. */
  .gushy-wc form#order_review {
    max-width: 56rem;
  }
  .gushy-wc #payment {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--border);
  }
  .gushy-wc #payment ul.payment_methods {
    list-style: none;
    display: grid;
    gap: 0.6rem;
    margin: 0 0 1.25rem;
  }
  .gushy-wc #payment ul.payment_methods > li:not(.woocommerce-notice) {
    padding: 0.9rem 1rem;
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: var(--card);
    transition: border-color 150ms ease;
  }
  .gushy-wc #payment ul.payment_methods > li:not(.woocommerce-notice):has(input:checked) {
    border-color: var(--green);
    background: color-mix(in srgb, var(--green) 5%, var(--card));
  }
  .gushy-wc #payment ul.payment_methods > li > label {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-left: 0.4rem;
    font-weight: 700;
    cursor: pointer;
  }
  .gushy-wc #payment ul.payment_methods > li img {
    display: inline-block;
    max-height: 1.5rem;
    width: auto;
  }
  .gushy-wc #payment .payment_box {
    margin-top: 0.6rem;
    font-size: 0.85rem;
    color: var(--muted-foreground);
  }
  .gushy-wc #payment .payment_box p {
    margin: 0;
  }
  .gushy-wc #payment .place-order {
    margin: 0;
    display: grid;
    gap: 1rem;
  }
  .gushy-wc #place_order {
    width: 100%;
    min-height: 52px;
    font-size: 1rem;
  }
  .gushy-wc :is(.woocommerce-privacy-policy-text, .woocommerce-terms-and-conditions-wrapper) {
    font-size: 0.8rem;
    color: var(--muted-foreground);
  }
  .gushy-wc .woocommerce-terms-and-conditions {
    max-height: 200px;
    overflow: auto;
    margin: 0.75rem 0;
    padding: 1rem;
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: var(--card);
  }
  .gushy-wc .woocommerce-NoticeGroup {
    grid-column: 1 / -1;
  }
  .gushy-wc .blockUI.blockOverlay {
    border-radius: inherit;
  }

  /* ------------------------------------------------------------------ */
  /* Order received + order details                                      */
  /* ------------------------------------------------------------------ */
  .gushy-wc .woocommerce-order > .woocommerce-notice,
  .gushy-wc .woocommerce-thankyou-order-received {
    margin: 0 0 1.5rem;
    font-family: var(--font-display);
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.02em;
    text-transform: uppercase;
  }
  .gushy-wc .woocommerce-order > .woocommerce-notice--error {
    color: var(--destructive);
  }
  /* Overview cards size to their content (a long email gets the room it
     needs instead of breaking mid-word) and share the row. */
  .gushy-wc ul.woocommerce-order-overview {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0 0 2rem;
  }
  .gushy-wc ul.woocommerce-order-overview li {
    flex: 1 1 auto;
    min-width: 9rem;
  }
  /* Phones: two columns, the email on its own row (order | date, email,
     total | payment method) instead of five stacked cards. */
  @media (max-width: 639px) {
    .gushy-wc ul.woocommerce-order-overview li {
      flex: 1 1 calc(50% - 0.375rem);
      min-width: 0;
    }
    .gushy-wc ul.woocommerce-order-overview li.woocommerce-order-overview__email {
      flex-basis: 100%;
    }
  }
  .gushy-wc ul.woocommerce-order-overview li {
    padding: 1rem 1.25rem;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    font-family: var(--font-display);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: color-mix(in srgb, var(--ink) 62%, transparent);
  }
  .gushy-wc ul.woocommerce-order-overview li strong {
    display: block;
    margin-top: 0.35rem;
    font-family: var(--font-sans);
    font-size: 1.05rem;
    font-weight: 800;
    letter-spacing: 0;
    color: var(--ink);
    overflow-wrap: anywhere;
  }
  .gushy-wc :is(.woocommerce-order-details, .woocommerce-customer-details, .woocommerce-bacs-bank-details) {
    margin-top: 2rem;
  }
  /* Order details (order received, view order): amounts line up on the right. */
  .gushy-wc table.woocommerce-table--order-details :is(thead th:last-child, td.product-total, tfoot td) {
    text-align: right;
  }
  .gushy-wc .woocommerce-columns--addresses {
    display: grid;
    gap: 1rem;
  }
  @media (min-width: 768px) {
    .gushy-wc .woocommerce-columns--addresses {
      grid-template-columns: 1fr 1fr;
    }
  }
  .gushy-wc .woocommerce-customer-details address {
    padding: 1.25rem 1.5rem;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.25rem;
  }
  .gushy-wc .woocommerce-customer-details address p {
    margin-top: 0.5rem;
  }
  .gushy-wc .woocommerce-OrderUpdates {
    list-style: none;
    display: grid;
    gap: 0.75rem;
  }
  .gushy-wc .woocommerce-OrderUpdate {
    padding: 1rem 1.25rem;
    border: 1px solid var(--border);
    border-radius: 1rem;
    background: var(--cream);
  }
  .gushy-wc .woocommerce-OrderUpdate-meta {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--muted-foreground);
  }
  .gushy-wc .order-again {
    margin-top: 1.5rem;
  }

  /* ------------------------------------------------------------------ */
  /* My account content                                                  */
  /* ------------------------------------------------------------------ */
  .gushy-wc .woocommerce-MyAccount-content > :first-child {
    margin-top: 0;
  }
  /* The address editor repeats the page title ("billing address") as its
     first heading: keep it for screen readers only. */
  .gushy-wc .woocommerce-MyAccount-content form > h2:first-child {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .gushy-wc .woocommerce-MyAccount-content table.shop_table {
    box-shadow: none;
  }
  .gushy-wc .woocommerce-MyAccount-content > p {
    font-size: 0.95rem;
    color: color-mix(in srgb, var(--ink) 80%, transparent);
  }
  .gushy-wc .woocommerce-pagination {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1.25rem;
  }
  .gushy-wc .woocommerce-Addresses {
    display: grid;
    gap: 1rem;
    margin-top: 1.25rem;
  }
  @media (min-width: 768px) {
    .gushy-wc .woocommerce-Addresses {
      grid-template-columns: 1fr 1fr;
    }
  }
  .gushy-wc .woocommerce-Address {
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--border);
    border-radius: 1.25rem;
    background: var(--cream);
  }
  .gushy-wc .woocommerce-Address-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
  }
  .gushy-wc .woocommerce-Address-title :is(h2, h3) {
    margin: 0;
    font-size: 1.25rem;
  }
  .gushy-wc .woocommerce-Address .edit {
    font-size: 0.8rem;
  }
  .gushy-wc .woocommerce-address-fields > p:last-child,
  .gushy-wc .woocommerce-EditAccountForm > p:last-of-type {
    margin-top: 0.5rem;
  }

  /* Lost / reset password forms */
  .gushy-wc :is(.woocommerce-ResetPassword, .lost_reset_password) {
    max-width: 34rem;
    padding: 1.5rem;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 1.625rem;
    box-shadow:
      0 1px 2px rgba(40, 37, 32, 0.04),
      0 10px 30px -16px rgba(40, 37, 32, 0.12);
  }
  @media (min-width: 768px) {
    .gushy-wc :is(.woocommerce-ResetPassword, .lost_reset_password) {
      padding: 2.5rem;
    }
  }
  .gushy-wc :is(.woocommerce-ResetPassword, .lost_reset_password) > p:first-child {
    margin-bottom: 1.25rem;
    font-size: 0.95rem;
    color: color-mix(in srgb, var(--ink) 80%, transparent);
  }
  .gushy-wc .woocommerce-ResetPassword .form-row-first,
  .gushy-wc .woocommerce-ResetPassword .form-row-last {
    width: 100%;
  }

  /* ------------------------------------------------------------------ */
  /* Merch product: add-to-cart form                                     */
  /* ------------------------------------------------------------------ */
  .gushy-add-to-cart form.cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
  }
  .gushy-add-to-cart form.cart.variations_form {
    display: block;
  }
  .gushy-add-to-cart .stock {
    margin-bottom: 0.75rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--green);
  }
  .gushy-add-to-cart .stock.out-of-stock {
    color: var(--destructive);
  }
  .gushy-add-to-cart table.variations {
    width: 100%;
    max-width: 28rem;
    margin-bottom: 1rem;
    border-collapse: separate;
    border-spacing: 0 0.6rem;
  }
  .gushy-add-to-cart table.variations :is(th, td) {
    display: block;
    padding: 0;
    text-align: left;
  }
  .gushy-add-to-cart table.variations th label {
    font-family: var(--font-display);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    color: color-mix(in srgb, var(--ink) 72%, transparent);
  }
  .gushy-add-to-cart table.variations select {
    margin-top: 0.4rem;
  }
  .gushy-add-to-cart .reset_variations {
    display: inline-block;
    margin-top: 0.5rem;
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .gushy-add-to-cart .single_variation_wrap .woocommerce-variation {
    margin-bottom: 0.75rem;
  }
  .gushy-add-to-cart .woocommerce-variation-price .price {
    font-size: 1.5rem;
    font-weight: 800;
  }
  .gushy-add-to-cart .woocommerce-variation-add-to-cart {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem;
  }
  .gushy-add-to-cart .single_add_to_cart_button {
    min-height: 48px;
  }

  /* Prices: sale price struck through. */
  :is(.gushy-wc, .gushy-add-to-cart, .gushy-price) del {
    opacity: 0.55;
    font-weight: 600;
    margin-right: 0.35em;
  }
  :is(.gushy-wc, .gushy-add-to-cart, .gushy-price) ins {
    text-decoration: none;
  }
}

@keyframes gushy-wc-spin {
  to {
    transform: rotate(360deg);
  }
}
