/* ==========================================================================
   WordPress + WooCommerce bridge
   ==========================================================================

   Everything above this file is the original storefront's visual system,
   shipped unmodified: style.css (design tokens), css/fonts.css, css/theme.css,
   css/revflare.css, css/revflare-cart.css, css/rev-flare-tokens.css and
   css/rev-flare-ab.css.

   This sheet exists for exactly two reasons:

     1. The original markup was authored by hand.  WordPress and WooCommerce
        generate their own class names (.woocommerce-message, .shop_table,
        .screen-reader-text, block alignment classes ...).  Those have no
        counterpart upstream and must be mapped onto the brand vocabulary.

     2. A handful of templates are still WooCommerce's own -- the cart page,
        checkout, the account dashboard, the orders table.  They are presented
        here in the same visual language as the ported pages rather than being
        restyled from scratch.

   Nothing in this file changes the appearance of a page that was ported 1:1.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Layout scaffolding
   -------------------------------------------------------------------------- */

.page-wrapper {
  --dqt-header-offset: var(--header-height, var(--dqt-header-height));
}

/*
 * The shop and product templates in this theme render their own section
 * wrappers, so WooCommerce's generic content wrapper would double the gutter.
 */
.woocommerce-page .page-wrapper > main {
  width: 100%;
}

.dqt-notices {
  margin: 0 auto;
  max-width: var(--dqt-max-width);
  padding: 16px var(--dqt-gutter);
  width: 100%;
}

/* --------------------------------------------------------------------------
   2. Accessibility primitives
   -------------------------------------------------------------------------- */

.screen-reader-text,
.sr-only:not(svg):not(use) {
  border: 0;
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  white-space: nowrap;
  width: 1px;
}

.screen-reader-text:focus,
.skip-to-content-link:focus {
  background: var(--background-primary);
  border-radius: var(--dqt-radius-input);
  box-shadow: var(--dqt-shadow-md);
  clip-path: none;
  color: var(--dqt-ink);
  display: block;
  font-size: 0.875rem;
  height: auto;
  left: 16px;
  padding: 12px 16px;
  top: 16px;
  width: auto;
  z-index: 1000;
}

[hidden] {
  display: none !important;
}

/* --------------------------------------------------------------------------
   3. WordPress block output
   -------------------------------------------------------------------------- */

.entry-content > * {
  margin-block: 0 var(--spacing-6, 1.5rem);
}

.entry-content > *:last-child {
  margin-block-end: 0;
}

.alignleft {
  float: left;
  margin: 0 1.5rem 1rem 0;
}

.alignright {
  float: right;
  margin: 0 0 1rem 1.5rem;
}

.aligncenter {
  display: block;
  margin-inline: auto;
}

.alignwide {
  margin-inline: calc(var(--dqt-gutter) * -1);
  max-width: 1100px;
}

.alignfull {
  margin-inline: calc(50% - 50vw);
  max-width: 100vw;
  width: 100vw;
}

.wp-caption,
.wp-caption-text,
figcaption {
  color: var(--dqt-ink);
  font-size: 0.8125rem;
  opacity: 0.65;
  text-align: center;
}

.wp-block-quote,
blockquote.wp-block-quote {
  border-inline-start: 2px solid var(--dqt-line);
  padding-inline-start: 1.5rem;
}

.wp-block-table table,
.wp-block-table th,
.wp-block-table td {
  border-color: var(--border-color);
}

.wp-block-button__link {
  align-items: center;
  background: var(--button-primary-background, var(--accent));
  border-radius: var(--dqt-radius-button);
  color: var(--button-primary-text, #fff);
  display: inline-flex;
  font-size: 0.875rem;
  justify-content: center;
  min-height: 46px;
  padding: 12px 24px;
  text-decoration: none;
}

.wp-block-image img {
  height: auto;
  max-width: 100%;
}

/* --------------------------------------------------------------------------
   4. WooCommerce notices
   -------------------------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
  background: var(--product-card-background, #f7f7f7);
  border: 0;
  border-inline-start: 3px solid var(--accent);
  border-radius: var(--dqt-radius-input);
  color: var(--dqt-ink);
  font-size: 0.875rem;
  line-height: 1.5;
  list-style: none;
  margin: 0 auto 1rem;
  max-width: var(--dqt-max-width);
  padding: 14px 18px;
}

.woocommerce-error {
  border-inline-start-color: var(--error-text, #b3261e);
}

.woocommerce-error li + li {
  margin-block-start: 6px;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  display: none;
}

.woocommerce-message a,
.woocommerce-info a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* --------------------------------------------------------------------------
   5. Buttons -- WooCommerce's own, mapped onto the brand button
   -------------------------------------------------------------------------- */

.button,
button.button,
input[type="submit"],
.woocommerce-Button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.wc-block-components-button,
.woocommerce-form-login__submit,
.woocommerce-ResetPassword .button {
  background: var(--button-primary-background, var(--accent));
  border: 0;
  border-radius: var(--dqt-radius-button);
  /*color: var(--button-primary-text, #fff);*/
  cursor: pointer;
  display: inline-flex;
  font-family: var(--dqt-font-body);
  font-size: 0.875rem;
  font-weight: 600;
  justify-content: center;
  letter-spacing: 0;
  line-height: 1;
  min-height: 46px;
  padding: 14px 26px;
  text-align: center;
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  opacity: 0.85;
}

.button.alt,
.woocommerce a.button.alt {
  background: var(--button-secondary-background, var(--accent));
  color: var(--button-secondary-text, #fff);
}

.button:disabled,
.button[disabled] {
  cursor: not-allowed;
  opacity: 0.45;
}

.button.wc-backward {
  margin-block-start: 1rem;
}

/* --------------------------------------------------------------------------
   6. Forms -- WooCommerce's markup, presented with floating labels
   -------------------------------------------------------------------------- */

/*
 * WooCommerce emits label-above-input.  The ported pages use the brand's
 * floating-label field, so a generic WooCommerce field is re-expressed in the
 * same material without changing the underlying DOM.
 */
.woocommerce form .form-row,
.woocommerce-page form .form-row,
.woocommerce-EditAccountForm p,
.lost_reset_password p {
  display: block;
  margin: 0 0 14px;
  padding: 0;
}

.woocommerce form .form-row label,
.woocommerce-page form .form-row label {
  color: var(--dqt-ink);
  display: block;
  font-size: 0.8125rem;
  margin-block-end: 6px;
  opacity: 0.7;
}

.woocommerce form .form-row .required {
  color: var(--error-text, #b3261e);
  opacity: 1;
  text-decoration: none;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-Input,
.woocommerce-Input--text,
.woocommerce-Input--email,
.woocommerce-Input--password,
.lost_reset_password input[type="text"],
.lost_reset_password input[type="password"] {
  background: transparent;
  border: 1px solid var(--border-color);
  border-radius: var(--dqt-radius-input);
  box-sizing: border-box;
  color: var(--dqt-ink);
  font-family: inherit;
  font-size: 1rem;
  min-height: 52px;
  padding: 14px 16px;
  width: 100%;
}

.woocommerce form .form-row input.input-text:focus,
.woocommerce-Input:focus,
.lost_reset_password input:focus {
  border-color: var(--accent);
  outline: 2px solid transparent;
  outline-offset: 2px;
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
  display: inline-block;
  width: calc(50% - 7px);
}

.woocommerce form .form-row-last {
  float: right;
}

.woocommerce-form__label-for-checkbox {
  align-items: center;
  display: inline-flex;
  font-size: 0.8125rem;
  gap: 8px;
  margin-block: 4px 12px;
}

/* --------------------------------------------------------------------------
   7. Account pages
   -------------------------------------------------------------------------- */

.woocommerce-account .page-wrapper > main {
  padding-block: var(--section-outer-spacing-block, 48px);
}

.woocommerce-MyAccount-navigation ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 20px;
  list-style: none;
  margin: 0 0 28px;
  padding: 0;
}

.woocommerce-MyAccount-navigation a {
  color: inherit;
  font-size: 0.875rem;
  opacity: 0.7;
  text-decoration: none;
}

.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation a:hover {
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 4px;
}

.woocommerce-Addresses {
  display: grid;
  gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
}

.woocommerce-Address-title {
  align-items: baseline;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

/* --------------------------------------------------------------------------
   8. Tables -- cart, orders, order details
   -------------------------------------------------------------------------- */

.shop_table {
  border-collapse: collapse;
  margin-block-end: 24px;
  width: 100%;
}

.shop_table th,
.shop_table td {
  border-block-end: 1px solid var(--border-color);
  padding: 14px 10px;
  text-align: start;
  vertical-align: middle;
}

.shop_table thead th {
  font-size: 0.75rem;
  letter-spacing: 0.06em;
  opacity: 0.6;
  text-transform: uppercase;
}

.shop_table .product-thumbnail img {
  border-radius: var(--dqt-radius-input);
  height: auto;
  max-width: 72px;
}

.shop_table .product-remove a {
  color: var(--dqt-ink);
  opacity: 0.5;
  text-decoration: none;
}

.shop_table .product-remove a:hover {
  opacity: 1;
}

.quantity input.qty {
  background: transparent;
  border: 1px solid var(--border-color);
  border-radius: var(--dqt-radius-input);
  color: var(--dqt-ink);
  min-height: 44px;
  padding: 8px;
  text-align: center;
  width: 68px;
}

.cart_totals,
.woocommerce-checkout-review-order {
  border: 1px solid var(--border-color);
  border-radius: var(--dqt-radius-input);
  padding: 20px 22px;
}

.cart_totals h2,
.woocommerce-checkout-review-order h2 {
  font-size: 1rem;
  margin-block: 0 12px;
}

/* WooCommerce block checkout/cart: product names render as <h3> and inherit
   the oversized heading scale -- pull them down to body-adjacent sizing. */
.wc-block-components-order-summary-item .wc-block-components-product-name {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4;
  margin-block: 0;
}

/* --------------------------------------------------------------------------
   9. Catalogue bits WooCommerce still owns
   -------------------------------------------------------------------------- */

.woocommerce-ordering select,
.woocommerce-result-count,
.woocommerce-breadcrumb {
  color: var(--dqt-ink);
  font-size: 0.8125rem;
}

.woocommerce-ordering select {
  background: transparent;
  border: 1px solid var(--border-color);
  border-radius: var(--dqt-radius-input);
  min-height: 44px;
  padding: 8px 32px 8px 12px;
}

.woocommerce-pagination {
  margin-block-start: 40px;
  text-align: center;
}

.woocommerce-pagination ul.page-numbers {
  display: inline-flex;
  gap: 6px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.woocommerce-pagination .page-numbers a,
.woocommerce-pagination .page-numbers span {
  align-items: center;
  border: 1px solid var(--border-color);
  border-radius: var(--dqt-radius-input);
  color: var(--dqt-ink);
  display: inline-flex;
  font-size: 0.8125rem;
  justify-content: center;
  min-height: 40px;
  min-width: 40px;
  padding: 0 10px;
  text-decoration: none;
}

.woocommerce-pagination .page-numbers .current {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--button-primary-text, #fff);
}

.woocommerce .star-rating span::before,
.woocommerce-page .star-rating span::before {
  color: var(--review-star-color, var(--dqt-accent));
}

.product_meta {
  color: var(--dqt-ink);
  font-size: 0.8125rem;
  opacity: 0.65;
}

.product_meta > span {
  display: block;
  margin-block-end: 2px;
}

/* --------------------------------------------------------------------------
   10. Password-recovery email step
   --------------------------------------------------------------------------

   WooCommerce renders this step inline rather than through a template, so it
   cannot be re-marked-up.  Its `lost_reset_password` class is the only handle
   we get, and it is enough to make the step look like the rest of the flow.
   -------------------------------------------------------------------------- */

.woocommerce-lost-password .lost_reset_password {
  background: var(--product-card-background, #f7f7f7);
  border-radius: var(--dqt-radius-lg);
  margin-inline: auto;
  max-width: 480px;
  padding: 40px 32px;
  text-align: center;
}

.woocommerce-lost-password .lost_reset_password p {
  font-size: 0.875rem;
  text-align: start;
}

.woocommerce-lost-password .lost_reset_password .button {
  width: 100%;
}

/* --------------------------------------------------------------------------
   11. WP admin bar offset
   -------------------------------------------------------------------------- */

body.admin-bar .shopify-section--header,
body.admin-bar .header-wrapper {
  top: var(--wp-admin--admin-bar--height, 32px);
}

/* --------------------------------------------------------------------------
   12. Reduced motion
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  .button,
  .woocommerce a.button {
    transition: none;
  }
}

/* ==========================================================================
   Body-class collision guard
   ==========================================================================

   WordPress tags <body> with `page` on every static page.  The original
   theme ships a `.page` component (the boxed article container:
   display:grid + max-width:80ch), and that selector happily matches the
   body class too -- squeezing the announcement bar, header, sections and
   footer into a 768px column on every WP page except products.

   The original `.page` component is not used by the ported markup, so the
   body-level reset below is safe and final. */
body.page {
  display: block;
  gap: normal;
  max-width: none;
  margin-inline: 0;
}

/* ==========================================================================
   WordPress block-library anchor guard
   ==========================================================================

   wp-includes/css/dist/block-library/style.css ships
   `a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--ink);
   text-decoration: underline; }`.  Same specificity as the theme's own
   `a { color: inherit }` but loaded later, so every link that relied on
   inheritance (footer menus, drawer links, ...) turned "ink" on dark
   backgrounds and picked up underlines the original never had.  WP also
   prints its global-styles <style> AFTER this sheet, so the guard raises
   specificity one notch to win the cascade regardless of order. */
body a:where(:not(.wp-element-button)) {
  color: inherit;
  text-decoration: inherit;
}

/* Long-form WP content keeps readable underlined links. */
body .prose a:where(:not(.wp-element-button)) {
  text-decoration: underline;
}

/* ==========================================================================
   Product reviews section
   ==========================================================================

   WooCommerce's comments_template() has no container of its own; the
   original rendered reviews in a boxed section below the product split. */
.dqt-reviews {
  padding-block-start: var(--spacing-12);
  padding-block-end: var(--spacing-14);
}

.dqt-reviews #reviews h2 {
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  letter-spacing: var(--heading-letter-spacing);
  text-transform: uppercase;
  font-size: var(--text-h2);
  line-height: 1.1;
  color: rgb(var(--text-primary));
}

.dqt-reviews .comment-form {
  max-width: 60ch;
}

/* ==========================================================================
   rev-card-grid inner wrapper
   ==========================================================================

   The ported markup wraps every card in `.rev-card-grid__inner`
   (data-rev-grid-inner), but the grid columns are declared on the outer
   `.rev-card-grid`.  Without this rule the wrapper is the grid's only
   child, so every collection / recommendations grid collapses into a
   single narrow column.  display:contents makes the wrapper transparent
   to the grid layout, as on the original site. */
.rev-card-grid__inner {
  display: contents;
}

/* ==========================================================================
   Product detail page sections below the split
   ========================================================================== */

/* Full-width product video. */
.dqt-video-media {
  position: relative;
  display: block;
  min-height: 420px;
  background: var(--rev-background, #b5b423);
}

.dqt-video-media video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Related products: 4-up grid matching the original carousel density. */
.dqt-related-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin: 0 max(var(--rev-gutter-min, 24px), calc((100vw - var(--rev-max-width, 1440px)) / 2));
  padding-block: var(--spacing-6, 24px);
}

@media (max-width: 1000px) {
  .dqt-related-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Judge.me reviews widget replica. */
.dqt-jdgm {
  padding: var(--spacing-10, 40px) 24px;
}

/* Judge.me revamp widget header replica (jm-* classes). */
.jm-review-widget__header {
  display: grid;
  gap: 20px;
  margin-block-end: var(--spacing-8, 32px);
}

.jm-review-widget-header__summary-section {
  text-align: center;
}

.jm-review-widget-header__title {
  font-family: var(--heading-font-family);
  font-size: var(--text-h2);
  letter-spacing: var(--heading-letter-spacing);
  text-transform: uppercase;
  color: rgb(var(--text-primary));
  margin: 0 0 10px;
}

.jm-average-rating-display {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.jm-avg {
  font-size: 20px;
  font-weight: 700;
  color: rgb(var(--text-primary));
}

.jm-count {
  font-size: 13px;
  color: #7b7b7b;
}

.jm-verified-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 10px;
  border-radius: 999px;
  background: #d7f2ea;
  color: #1d7a5f;
  font-size: 12px;
  font-weight: 600;
}

.jm-review-widget-header__main-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.jm-histogram {
  flex: 0 1 300px;
  display: grid;
  gap: 8px;
}

.jm-histogram-row {
  display: grid;
  grid-template-columns: 10px 12px 1fr 40px;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #3f4444;
}

.jm-histogram-row__star {
  color: #f1b824;
  font-size: 13px;
  line-height: 1;
}

.jm-progress-bar {
  height: 3px;
  background: #e5e5e5;
  border-radius: 2px;
  overflow: hidden;
}

.jm-progress-bar__fill {
  display: block;
  height: 100%;
  background: #ffb74a;
}

.jm-histogram-row__frequency {
  text-align: right;
  color: #3f4444;
}

.jm-media-preview {
  flex: 0 0 auto;
}

.jm-media-grid__container {
  display: flex;
  gap: 10px;
}

.jm-media-grid__item {
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}

.jm-media-grid__image-container {
  display: block;
  width: 58px;
  height: 58px;
  border-radius: 6px;
  overflow: hidden;
}

.jm-media-grid__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.jm-action-buttons {
  flex: 0 0 auto;
}

.jm-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 24px;
  border: 0;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
}

.jm-button--primary {
  background: #3f4444;
  color: #fff;
}

.jm-button--secondary {
  background: #fff;
  color: #3f4444;
  border: 1px solid #d9d9d9;
}

.jm-review-widget-header__filters-wrapper {
  display: flex;
  justify-content: flex-end;
}

.jm-filters {
  display: flex;
  align-items: center;
  gap: 12px;
}

.jm-sort-filter {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.jm-sort-filter__select {
  appearance: none;
  padding: 8px 34px 8px 14px;
  border: 1px solid #d9d9d9;
  border-radius: 4px;
  background: #fff;
  font-size: 13px;
  color: #3f4444;
  cursor: pointer;
}

.jm-sort-filter__select::-ms-expand {
  display: none;
}

.jm-sort-filter::after {
  content: "";
  position: absolute;
  inset-inline-end: 14px;
  width: 7px;
  height: 7px;
  border-right: 1.5px solid #3f4444;
  border-bottom: 1.5px solid #3f4444;
  transform: rotate(45deg) translateY(-2px);
  pointer-events: none;
}

.jdgm-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

@media (max-width: 900px) {
  .jm-review-widget-header__main-content {
    flex-direction: column;
    align-items: center;
  }
}

.dqt-jdgm__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

@media (max-width: 1000px) {
  .dqt-jdgm__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .dqt-jdgm__grid {
    grid-template-columns: 1fr;
  }
}

.dqt-jdgm__card {
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  padding: 16px;
  background: #fff;
}

.dqt-jdgm__card-stars {
  color: #f1b824;
  font-size: 14px;
  letter-spacing: 2px;
}

.dqt-jdgm__card-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-block-start: 8px;
}

.dqt-jdgm__card-name {
  font-weight: 700;
  font-size: 13px;
  color: rgb(var(--text-primary));
}

.dqt-jdgm__card-verified {
  font-size: 11px;
  padding: 2px 8px;
  border: 1px solid #d0d0d0;
  border-radius: 999px;
  color: #3f4444;
}

.dqt-jdgm__card-date {
  font-size: 12px;
  color: #7b7b7b;
}

.dqt-jdgm__card-title {
  font-weight: 600;
  margin: 8px 0 0;
  font-size: 14px;
}

.dqt-jdgm__card-body {
  margin: 6px 0 0;
  font-size: 14px;
  line-height: 1.55;
  color: rgb(var(--text-primary));
}

.dqt-jdgm__more-wrap {
  text-align: center;
  margin-block-start: 24px;
}

.dqt-jdgm__more {
  padding: 10px 24px;
  border: 1px solid #cfcfcf;
  border-radius: 4px;
  background: #fff;
  color: #3f4444;
  font-size: 14px;
  cursor: pointer;
}

.dqt-jdgm__more.is-loading,
.dqt-jdgm__more:disabled {
  opacity: .55;
  cursor: default;
}

.dqt-jdgm__page-status {
  margin: 10px 0 0;
  font-size: 12px;
  color: #7b7b7b;
}

/* Review cards carrying customer photos / shop replies. */
.dqt-jdgm__card-pics {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-block-start: 10px;
}

.dqt-jdgm__card-pics img {
  width: 88px;
  height: 88px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid #ececec;
}

.dqt-jdgm__card-reply {
  margin-block-start: 12px;
  padding: 10px 12px;
  border-inline-start: 3px solid #f1b824;
  background: #faf8f3;
  border-radius: 0 4px 4px 0;
}

.dqt-jdgm__card-reply-name {
  display: block;
  font-weight: 700;
  font-size: 12px;
  color: rgb(var(--text-primary));
  margin-block-end: 4px;
}

.dqt-jdgm__card-reply p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: #4a4a4a;
}

/* Native WooCommerce review form, revealed by "Write a review". */
.dqt-jdgm__review-form {
  margin-block-start: 32px;
  padding-block-start: 24px;
  border-block-start: 1px solid #e8e8e8;
}

.dqt-jdgm__form-title {
  font-size: 20px;
  font-weight: 600;
  margin-block-end: 16px;
}

.dqt-jdgm__review-form .comment-form-rating .stars {
  margin-block-end: 8px;
}

.dqt-jdgm__review-form textarea {
  width: 100%;
  min-height: 140px;
  padding: 12px;
  border: 1px solid #cfcfcf;
  border-radius: 4px;
  font-size: 14px;
  font-family: inherit;
}

.dqt-jdgm__review-form label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  margin-block-end: 6px;
}

.dqt-jdgm__review-form .form-submit {
  margin-block-start: 12px;
}

/* Star rating input inside the review form. */
.dqt-rating-stars {
  display: inline-flex;
  flex-direction: row-reverse;
  gap: 2px;
}

.dqt-rating-stars input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.dqt-rating-stars label {
  font-size: 26px;
  line-height: 1;
  color: #d8d8d8;
  cursor: pointer;
  transition: color .12s ease;
  margin-block-end: 0 !important;
}

.dqt-rating-stars label:hover,
.dqt-rating-stars label:hover ~ label,
.dqt-rating-stars input:checked ~ label {
  color: #f1b824;
}

.dqt-jdgm__review-form .jm-button {
  padding: 12px 28px;
  border: 0;
  border-radius: 4px;
  background: #2a2a2a;
  color: #fff;
  font-size: 14px;
  cursor: pointer;
}

/* Accordion prose images (e.g. press logos in descriptions). */
.accordion__content .prose img {
  max-width: 100%;
  height: auto;
}

/* Comparison chart relies on theme.css layout; only seed the column count.
   The source theme renders this section's stack main full width; our ported
   theme.css defaults `.section-stack__main` to 50% which clips the chart. */
#shopify-section-product-comparison {
  --feature-chart-values-columns-count: 3;
}
#shopify-section-product-comparison .section-stack__main {
  width: 100%;
}

/* ==========================================================================
   Re-enable A/B-gated blocks
   ==========================================================================

   rev-flare-ab.css ships experiment variants that hide the comparison
   table and the product richtext ("Most Common Use: ...") unless an
   experiment bucket class is present on <body>.  The live site runs with
   these visible, so force them back on. */
body.rev-template-product .shopify-section--comparison-table {
  display: block !important;
}

body.rev-template-product .rev-product-item.rev-block-richtext {
  display: block !important;
}

/* --- Judge.me "no reviews" empty state ------------------------------- */
.jm-no-reviews-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  padding: 28px 0 6px;
}

.jm-no-reviews-state__text {
  margin: 0;
  font-size: 15px;
  color: #3f4444;
}

/* --- Global "cart:error" toast ---------------------------------------- */
/* theme.js only renders the inline error banner through <buy-buttons> on the
   product page; theme-bridge.js appends this toast anywhere else (homepage
   direct-add cards) so failed adds are never silent. */
.dqt-cart-error-toast {
  position: fixed;
  left: 50%;
  bottom: max(24px, env(safe-area-inset-bottom, 0px) + 24px);
  transform: translate(-50%, 12px);
  z-index: 9999;
  max-width: min(92vw, 420px);
  margin: 0;
  opacity: 0;
  pointer-events: none;
  box-shadow: 0 8px 30px rgb(0 0 0 / 0.18);
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.dqt-cart-error-toast--visible {
  opacity: 1;
  transform: translate(-50%, 0);
}