/* ZER0COLOUR — Elementor compatibility layer
 * Loaded AFTER Elementor's stylesheets so the theme's typography, colour
 * tokens and animation timings always win. Nothing here changes the theme's
 * own design: every value is read from the existing CSS variables.
 */

/* --- Typography: Elementor widgets inherit the theme, not Elementor's kit -- */
.elementor-widget-container,
.elementor-heading-title,
.elementor-widget-text-editor,
.elementor-widget-heading,
.elementor-button,
.elementor-field-group,
.elementor-widget-woocommerce-product-title,
.elementor-widget-woocommerce-product-price {
  font-family: inherit;
  color: inherit;
  letter-spacing: inherit;
}

.elementor-heading-title {
  font-weight: inherit;
  line-height: inherit;
}

/* Theme utility classes keep their own definitions when used inside widgets. */
.elementor .display,
.elementor .eyebrow,
.elementor .story-link,
.elementor .btn-press {
  font-family: var(--font-display, inherit);
}

.elementor-widget .eyebrow,
.elementor-widget .display {
  letter-spacing: unset;
}

/* --- Surfaces / colours --------------------------------------------------- */
body.elementor-page,
.elementor-kit-default,
.elementor-section,
.elementor-element {
  background-color: transparent;
}

body.elementor-page {
  background: var(--bg, #000);
  color: var(--fg, #fff);
}

body.elementor-page #site-content {
  padding: 0;
}

.elementor-section.elementor-section-boxed > .elementor-container,
.elementor-widget-container > .e-con-inner {
  max-width: 1600px;
}

/* --- Buttons: adopt the theme press effect, never Elementor's default ----- */
.elementor-button,
.elementor .elementor-button-link {
  border-radius: 0;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  font-size: 12px;
  transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.18s ease;
}
.elementor-button:active,
.elementor .elementor-button-link:active {
  transform: scale(0.97);
}

/* --- Animation ownership -------------------------------------------------- */
/* Elementor entrance animations and the theme's reveal-on-scroll must not both
 * transform the same node. The theme's JS skips `.elementor-invisible` nodes;
 * this rule makes sure Elementor's own timing curve matches the theme's. */
.elementor-invisible,
.animated {
  animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Keep the theme's marquee running inside Elementor containers. */
.elementor .marquee,
.elementor .marquee__track {
  animation-play-state: running;
}

@media (prefers-reduced-motion: reduce) {
  .elementor-invisible,
  .animated {
    animation: none !important;
    opacity: 1 !important;
  }
}

/* --- WooCommerce widgets inherit the theme's product card design ---------- */
.elementor-widget-woocommerce-products ul.products,
.elementor-widget-wc-archive-products ul.products {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.elementor-widget-woocommerce-products ul.products li.product,
.elementor-widget-wc-archive-products ul.products li.product {
  width: 100%;
  margin: 0;
  float: none;
  display: flex;
  flex-direction: column;
}
.elementor-widget-woocommerce-products ul.products li.product img,
.elementor-widget-wc-archive-products ul.products li.product img {
  aspect-ratio: 3 / 4;
  object-fit: cover;
  width: 100%;
}
.elementor-widget-woocommerce-products ul.products li.product .price,
.elementor-widget-wc-archive-products ul.products li.product .price {
  color: #bdbdbd;
  font-size: 13px;
}

@media (max-width: 1024px) {
  .elementor-widget-woocommerce-products ul.products,
  .elementor-widget-wc-archive-products ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 600px) {
  .elementor-widget-woocommerce-products ul.products,
  .elementor-widget-wc-archive-products ul.products {
    grid-template-columns: 1fr;
  }
}

/* Cart / checkout / account widgets: strip Elementor's rounded, tinted UI. */
.elementor-widget-woocommerce-cart,
.elementor-widget-woocommerce-checkout-page,
.elementor-widget-woocommerce-my-account {
  --e-wc-form-fields-border-radius: 0;
}
.elementor-widget-woocommerce-cart input,
.elementor-widget-woocommerce-checkout-page input,
.elementor-widget-woocommerce-checkout-page textarea,
.elementor-widget-woocommerce-checkout-page select,
.elementor-widget-woocommerce-my-account input {
  background: #0a0a0a;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 0;
}
.elementor-widget-woocommerce-cart table,
.elementor-widget-woocommerce-checkout-page table,
.elementor-widget-woocommerce-my-account table {
  border-color: rgba(255, 255, 255, 0.12);
}
.elementor-widget-woocommerce-cart a,
.elementor-widget-woocommerce-my-account a {
  color: #fff;
}

/* Editor canvas: keep the black canvas so contrast is truthful while editing. */
.elementor-editor-active body,
body.elementor-editor-active {
  background: var(--bg, #000);
}
