/*
 Theme Name:   Official Tebex
 Description:  Custom premium-dark WooCommerce child theme for official-tebex.io. Designed for FiveM script stores — premium dark design system (azure accent, Inter + Space Grotesk), WCAG AA, mobile-first.
 Author:       Official Tebex
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* Google Fonts — must come before all rules (CSS spec) */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap');

/* =====================================================================
   OFFICIAL TEBEX DESIGN SYSTEM
   Premium-dark, azure accent. CSS-first over WoodMart's markup.
   No neon glow. WCAG AA contrast enforced.
   ===================================================================== */

/* ------------------------------------------------------------------
   1. DESIGN TOKENS
   ------------------------------------------------------------------ */
:root {
  /* Background layers */
  --otx-bg:        #0A0B0D;
  --otx-surface:   #111317;
  --otx-surface-2: #17191E;
  --otx-surface-3: #1E2026;

  /* Borders */
  --otx-line:      rgba(255,255,255,.08);
  --otx-line-2:    rgba(255,255,255,.14);
  --otx-line-3:    rgba(255,255,255,.22);

  /* Text */
  --otx-txt:       #F2F4F7;
  --otx-muted:     #9BA1AD;
  --otx-faint:     #6B7280;

  /* Accent — azure */
  --otx-accent:    #5AC8FA;
  --otx-accent-dk: #04121A;   /* dark ink on azure buttons — WCAG AA */
  --otx-accent-bg: rgba(90,200,250,.08);
  --otx-accent-bd: rgba(90,200,250,.3);

  /* Success / error */
  --otx-success:   #1FB871;
  --otx-success-dk:#03130C;
  --otx-error:     #F87171;

  /* Geometry */
  --otx-radius:    16px;
  --otx-radius-sm: 10px;
  --otx-radius-pill: 999px;

  /* Shadows */
  --otx-shadow:    0 8px 32px rgba(0,0,0,.48);
  --otx-shadow-card: 0 2px 12px rgba(0,0,0,.4);
  --otx-shadow-hover: 0 12px 36px rgba(0,0,0,.6);

  /* Typography */
  --otx-font-body: 'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --otx-font-head: 'Space Grotesk', 'Inter', system-ui, sans-serif;

  /* Transitions */
  --otx-ease: .18s ease;
}

/* ------------------------------------------------------------------
   2. GOOGLE FONTS — loaded via @import at top of file (CSS spec requires
      @import before all rules; see line 10 above).
   ------------------------------------------------------------------ */

/* ------------------------------------------------------------------
   3. BASE RESET / GLOBAL OVERRIDES
   ------------------------------------------------------------------ */
html, body {
  background: var(--otx-bg) !important;
  color: var(--otx-txt) !important;
  font-family: var(--otx-font-body) !important;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

*, *::before, *::after {
  box-sizing: border-box;
}

a {
  color: var(--otx-accent);
  text-decoration: none;
  transition: color var(--otx-ease);
}
a:hover { color: var(--otx-txt); }

/* Page wrapper — dark background */
.wd-page-wrapper,
.website-wrapper,
.site,
#page {
  background: var(--otx-bg) !important;
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--otx-font-head) !important;
  color: var(--otx-txt) !important;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -.01em;
}

/* Container max-width nudge */
.container {
  max-width: 1600px;
}

/* Horizontal rules */
hr {
  border-color: var(--otx-line);
}

/* ------------------------------------------------------------------
   4. HEADER — darken, tighten, match footer bg
   ------------------------------------------------------------------ */
header.whb-header,
.whb-header,
.wd-header {
  background: var(--otx-surface) !important;
  border-bottom: 1px solid var(--otx-line) !important;
  box-shadow: none !important;
}

/* Nav links */
.whb-header .wd-nav > li > a,
.whb-header .wd-nav > li > span,
.woodmart-navigation .menu-item > a {
  color: var(--otx-muted) !important;
  font-size: .9rem !important;
  font-weight: 500 !important;
  letter-spacing: .01em;
  transition: color var(--otx-ease) !important;
}
.whb-header .wd-nav > li > a:hover,
.whb-header .wd-nav > li.current-menu-item > a,
.woodmart-navigation .menu-item:hover > a {
  color: var(--otx-accent) !important;
}

/* Cart in header */
.whb-header .wd-header-cart .wd-header-cart-sum,
.whb-header .wd-header-cart .wd-header-cart-total {
  color: var(--otx-txt) !important;
}
.whb-header .wd-cart-icon .wd-icon-count {
  background: var(--otx-accent) !important;
  color: var(--otx-accent-dk) !important;
  font-weight: 700;
}

/* Dropdown menu */
.wd-dropdown-menu,
.wd-sub-menu-wrap {
  background: var(--otx-surface-2) !important;
  border: 1px solid var(--otx-line-2) !important;
  border-radius: var(--otx-radius-sm) !important;
  box-shadow: var(--otx-shadow) !important;
}
.wd-dropdown-menu .menu-item a {
  color: var(--otx-muted) !important;
  font-size: .875rem !important;
}
.wd-dropdown-menu .menu-item a:hover {
  color: var(--otx-accent) !important;
  background: var(--otx-accent-bg) !important;
}

/* ------------------------------------------------------------------
   5. BREADCRUMBS
   ------------------------------------------------------------------ */
.wd-breadcrumbs,
.woocommerce-breadcrumb {
  color: var(--otx-faint) !important;
  font-size: .82rem !important;
}
.wd-breadcrumbs a,
.woocommerce-breadcrumb a {
  color: var(--otx-muted) !important;
}
.wd-breadcrumbs a:hover,
.woocommerce-breadcrumb a:hover {
  color: var(--otx-accent) !important;
}

/* ------------------------------------------------------------------
   6. BUTTONS — azure pill, dark ink. WCAG AA.
   ------------------------------------------------------------------ */
.button,
a.button,
button.button,
input[type="submit"],
input[type="button"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wp-element-button,
.wp-block-button__link,
.woocommerce-Button,
.checkout-button,
.single_add_to_cart_button,
.wc-proceed-to-checkout .checkout-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: .5rem !important;
  padding: .75rem 1.5rem !important;
  background: var(--otx-accent) !important;
  color: var(--otx-accent-dk) !important;
  border: none !important;
  border-radius: var(--otx-radius-pill) !important;
  font-family: var(--otx-font-body) !important;
  font-size: .9rem !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  line-height: 1 !important;
  cursor: pointer !important;
  transition: transform var(--otx-ease), box-shadow var(--otx-ease), background var(--otx-ease) !important;
  -webkit-tap-highlight-color: transparent !important;
  box-shadow: none !important;
  white-space: nowrap !important;
}
.button:hover,
a.button:hover,
button.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.wp-element-button:hover,
.wp-block-button__link:hover,
.woocommerce-Button:hover,
.checkout-button:hover,
.single_add_to_cart_button:hover,
.wc-proceed-to-checkout .checkout-button:hover {
  background: #7ED5FB !important;
  color: var(--otx-accent-dk) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(90,200,250,.25) !important;
  text-decoration: none !important;
}
.button:active,
a.button:active,
.woocommerce a.button:active {
  transform: translateY(0) !important;
}

/* Alt/ghost button variant */
.button.alt,
a.button.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
  background: transparent !important;
  color: var(--otx-accent) !important;
  border: 1px solid var(--otx-accent-bd) !important;
}
.button.alt:hover,
a.button.alt:hover {
  background: var(--otx-accent-bg) !important;
  color: var(--otx-accent) !important;
  border-color: var(--otx-accent) !important;
}

/* ------------------------------------------------------------------
   7. PRODUCT CARDS — shop/archive grid
      Target WoodMart's .wd-product and .product-wrapper
   ------------------------------------------------------------------ */

/* Card shell */
.wd-product,
li.product {
  border-radius: var(--otx-radius) !important;
  overflow: visible !important;
}

.wd-product .product-wrapper,
li.product .product-wrapper {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  overflow: hidden;
  transition: transform var(--otx-ease), border-color var(--otx-ease), box-shadow var(--otx-ease) !important;
  box-shadow: var(--otx-shadow-card) !important;
  display: flex;
  flex-direction: column;
}
.wd-product:hover .product-wrapper,
li.product:hover .product-wrapper {
  transform: translateY(-4px) !important;
  border-color: var(--otx-line-2) !important;
  box-shadow: var(--otx-shadow-hover) !important;
}

/* Product image area */
.wd-product .product-element-top,
li.product .product-element-top {
  background: var(--otx-surface-2) !important;
  overflow: hidden;
  border-radius: var(--otx-radius) var(--otx-radius) 0 0 !important;
  position: relative;
}
.wd-product .product-image-link img,
li.product .product-image-link img {
  transition: transform .3s ease !important;
  width: 100%;
  height: auto;
  display: block;
}
.wd-product:hover .product-image-link img,
li.product:hover .product-image-link img {
  transform: scale(1.04) !important;
}

/* Product info area (below image) */
.wd-product .product-element-bottom,
.wd-product .wd-product-grid-item,
li.product .product-element-bottom {
  padding: 1.1rem 1.1rem .9rem !important;
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* Product title */
.wd-product .woocommerce-loop-product__title,
li.product .woocommerce-loop-product__title {
  font-family: var(--otx-font-head) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--otx-txt) !important;
  line-height: 1.35 !important;
  margin: 0 0 .5rem !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* Price */
.wd-product .price,
li.product .price {
  color: var(--otx-txt) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  margin: 0 0 .75rem !important;
  display: block;
}
.wd-product .price del,
li.product .price del {
  color: var(--otx-faint) !important;
  font-weight: 400 !important;
  font-size: .85em !important;
  margin-right: .3rem;
}
.wd-product .price ins,
li.product .price ins {
  text-decoration: none !important;
  color: var(--otx-accent) !important;
}

/* Add to cart button in grid */
.wd-product .wd-add-btn a.button,
.wd-product .wd-add-btn-replace a.button,
li.product .add_to_cart_button {
  width: 100% !important;
  margin-top: auto !important;
}

/* WoodMart hover action buttons (wishlist/quick-view) */
.wd-product .wd-buttons,
li.product .wd-buttons {
  background: rgba(10,11,13,.7) !important;
  backdrop-filter: blur(8px) !important;
  border-radius: 0 var(--otx-radius-sm) 0 0 !important;
}
.wd-product .wd-buttons .wd-action-btn,
li.product .wd-buttons .wd-action-btn {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line-2) !important;
  border-radius: 50% !important;
  color: var(--otx-muted) !important;
  width: 36px !important;
  height: 36px !important;
  transition: background var(--otx-ease), color var(--otx-ease), border-color var(--otx-ease) !important;
}
.wd-product .wd-buttons .wd-action-btn:hover,
li.product .wd-buttons .wd-action-btn:hover {
  background: var(--otx-accent) !important;
  border-color: var(--otx-accent) !important;
  color: var(--otx-accent-dk) !important;
}

/* Single-product Add to Cart — force solid azure.
   WoodMart's Elementor builder applies .wd-btn-design-full on the widget wrapper
   and its inline CSS rule is: .wd-btn-design-full form.cart :where(.single_add_to_cart_button)
   We must beat that specificity + inline position by being more specific AND using !important. */
.wd-btn-design-full form.cart .single_add_to_cart_button,
.wd-btn-design-full form.cart button[name="add-to-cart"],
.single-product form.cart .single_add_to_cart_button,
.single-product form.cart button[name="add-to-cart"],
.woocommerce.single-product form.cart button.button.alt {
  background: var(--otx-accent) !important;
  background-color: var(--otx-accent) !important;
  color: var(--otx-accent-dk) !important;
  border: none !important;
  border-color: transparent !important;
  padding: .9rem 2.2rem !important;
  font-size: 1rem !important;
  width: 100% !important;
  box-shadow: none !important;
}
.wd-btn-design-full form.cart .single_add_to_cart_button:hover,
.wd-btn-design-full form.cart button[name="add-to-cart"]:hover,
.single-product form.cart .single_add_to_cart_button:hover,
.single-product form.cart button[name="add-to-cart"]:hover {
  background: #7ED5FB !important;
  background-color: #7ED5FB !important;
  color: var(--otx-accent-dk) !important;
}

/* Product labels: New / Sale — WCAG AA */
.product-labels .new,
.product-labels span.new,
.wd-product .wd-label-new {
  background: var(--otx-accent) !important;
  color: var(--otx-accent-dk) !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  border-radius: var(--otx-radius-pill) !important;
}
.product-labels .onsale,
.product-labels span.onsale,
.wd-product .wd-label-sale {
  background: var(--otx-success) !important;
  color: var(--otx-success-dk) !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  border-radius: var(--otx-radius-pill) !important;
}

/* Rating stars */
.star-rating span::before,
.star-rating::before {
  color: var(--otx-accent) !important;
}

/* No products found */
.woocommerce-info,
.woocommerce .woocommerce-info {
  background: var(--otx-surface) !important;
  border-top-color: var(--otx-accent) !important;
  color: var(--otx-txt) !important;
  border-radius: var(--otx-radius-sm) !important;
}

/* ------------------------------------------------------------------
   8. SHOP / ARCHIVE PAGE
   ------------------------------------------------------------------ */

/* Shop header / title area */
.wd-shop-top-panel,
.woocommerce-products-header {
  border-bottom: 1px solid var(--otx-line) !important;
  padding-bottom: 1rem !important;
  margin-bottom: 1.5rem !important;
}
.woocommerce-products-header__title,
.page-title,
h1.page-title {
  font-size: clamp(1.6rem, 3vw, 2.2rem) !important;
  color: var(--otx-txt) !important;
}

/* Orderby / results count */
.woocommerce-ordering select,
.woocommerce-result-count {
  background: var(--otx-surface) !important;
  color: var(--otx-muted) !important;
  border: 1px solid var(--otx-line-2) !important;
  border-radius: var(--otx-radius-sm) !important;
  font-size: .875rem !important;
}
.woocommerce-ordering select:focus {
  outline: 2px solid var(--otx-accent) !important;
  outline-offset: 2px !important;
}

/* Filter sidebar */
.widget.woocommerce,
.widget_layered_nav,
.widget_price_filter {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  padding: 1.2rem !important;
}
.widget-title,
.widgettitle {
  font-family: var(--otx-font-head) !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--otx-faint) !important;
  margin-bottom: .8rem !important;
}

/* Pagination */
.woocommerce-pagination ul li a,
.woocommerce-pagination ul li span,
.page-numbers li a,
.page-numbers li span {
  background: var(--otx-surface) !important;
  color: var(--otx-muted) !important;
  border: 1px solid var(--otx-line-2) !important;
  border-radius: var(--otx-radius-sm) !important;
  transition: all var(--otx-ease) !important;
}
.woocommerce-pagination ul li a:hover,
.page-numbers li a:hover {
  background: var(--otx-surface-3) !important;
  border-color: var(--otx-accent-bd) !important;
  color: var(--otx-accent) !important;
}
.woocommerce-pagination ul li span.current,
.page-numbers li .current {
  background: var(--otx-accent) !important;
  color: var(--otx-accent-dk) !important;
  border-color: var(--otx-accent) !important;
  font-weight: 700 !important;
}

/* ------------------------------------------------------------------
   9. SINGLE PRODUCT PAGE
   ------------------------------------------------------------------ */

/* Main wrapper */
.single-product .product {
  background: var(--otx-bg) !important;
}

/* Gallery area */
.wd-product-images,
.woocommerce-product-gallery {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  overflow: hidden;
}
.woocommerce-product-gallery img {
  background: var(--otx-surface-2) !important;
}

/* Thumbnail strips */
.flex-control-thumbs li img {
  border: 2px solid var(--otx-line) !important;
  border-radius: var(--otx-radius-sm) !important;
  opacity: .65;
  transition: opacity var(--otx-ease), border-color var(--otx-ease) !important;
}
.flex-control-thumbs li img.flex-active,
.flex-control-thumbs li img:hover {
  opacity: 1 !important;
  border-color: var(--otx-accent) !important;
}

/* Summary panel */
.single-product .summary.entry-summary {
  color: var(--otx-txt) !important;
}

/* Product title */
.single-product h1.product_title {
  font-family: var(--otx-font-head) !important;
  font-size: clamp(1.6rem, 3vw, 2.4rem) !important;
  font-weight: 700 !important;
  color: var(--otx-txt) !important;
  line-height: 1.2 !important;
  margin-bottom: .5rem !important;
}

/* Price */
.single-product .price {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: var(--otx-accent) !important;
  display: block;
  margin: .5rem 0 1rem !important;
}
.single-product .price del {
  color: var(--otx-faint) !important;
  font-weight: 400 !important;
  font-size: .75em !important;
}

/* Short description */
.woocommerce-product-details__short-description,
.single-product .woocommerce-product-details__short-description p {
  color: var(--otx-muted) !important;
  font-size: .95rem !important;
  line-height: 1.7 !important;
  margin-bottom: 1.25rem !important;
}

/* Add to cart button in single */
.single_add_to_cart_button {
  padding: .9rem 2rem !important;
  font-size: 1rem !important;
}

/* Meta (SKU, categories) */
.product_meta {
  color: var(--otx-faint) !important;
  font-size: .85rem !important;
  border-top: 1px solid var(--otx-line) !important;
  padding-top: 1rem !important;
  margin-top: 1rem !important;
}
.product_meta a {
  color: var(--otx-muted) !important;
}
.product_meta a:hover {
  color: var(--otx-accent) !important;
}

/* Product tabs */
.woocommerce-tabs ul.tabs,
.wd-tabs .wd-tabs-list {
  border-bottom: 1px solid var(--otx-line) !important;
  margin-bottom: 1.5rem !important;
}
.woocommerce-tabs ul.tabs li,
.wd-tabs .wd-tabs-list li {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
}
.woocommerce-tabs ul.tabs li.active,
.woocommerce-tabs ul.tabs li:hover,
.wd-tabs .wd-tabs-list li.active,
.wd-tabs .wd-tabs-list li:hover {
  border-bottom-color: var(--otx-accent) !important;
}
.woocommerce-tabs ul.tabs li a,
.wd-tabs .wd-tabs-list li a {
  color: var(--otx-muted) !important;
  font-size: .9rem !important;
  font-weight: 600 !important;
  padding: .6rem 1rem !important;
  transition: color var(--otx-ease) !important;
}
.woocommerce-tabs ul.tabs li.active a,
.woocommerce-tabs ul.tabs li:hover a,
.wd-tabs .wd-tabs-list li.active a,
.wd-tabs .wd-tabs-list li:hover a {
  color: var(--otx-txt) !important;
}

/* Tab content */
.woocommerce-tabs .panel,
.woocommerce-Tabs-panel {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: 0 var(--otx-radius) var(--otx-radius) var(--otx-radius) !important;
  padding: 1.5rem !important;
  color: var(--otx-txt) !important;
}
.woocommerce-tabs .panel h2,
.woocommerce-tabs .panel h3 {
  color: var(--otx-txt) !important;
  font-size: 1.1rem !important;
  margin-bottom: .75rem !important;
}
.woocommerce-tabs .panel p,
.woocommerce-tabs .panel li {
  color: var(--otx-muted) !important;
  line-height: 1.7 !important;
}

/* Related products */
.related.products > h2,
.upsells.products > h2 {
  font-family: var(--otx-font-head) !important;
  font-size: 1.3rem !important;
  color: var(--otx-txt) !important;
  margin-bottom: 1.25rem !important;
  padding-bottom: .75rem !important;
  border-bottom: 1px solid var(--otx-line) !important;
}

/* ------------------------------------------------------------------
   10. CART PAGE (note: cart→checkout redirect is active)
   ------------------------------------------------------------------ */
.woocommerce-cart .cart_totals,
.woocommerce-cart table.shop_table {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  overflow: hidden;
}
.woocommerce-cart table.shop_table th {
  background: var(--otx-surface-2) !important;
  color: var(--otx-faint) !important;
  font-size: .8rem !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  padding: .85rem 1rem !important;
  border-color: var(--otx-line) !important;
}
.woocommerce-cart table.shop_table td {
  color: var(--otx-txt) !important;
  border-color: var(--otx-line) !important;
  padding: 1rem !important;
  vertical-align: middle !important;
}
.woocommerce-cart table.shop_table td.product-name a {
  color: var(--otx-txt) !important;
  font-weight: 500 !important;
}
.woocommerce-cart table.shop_table td.product-name a:hover {
  color: var(--otx-accent) !important;
}
.woocommerce-cart table.shop_table .cart-subtotal,
.woocommerce-cart table.shop_table .order-total {
  background: var(--otx-surface-3) !important;
}
.woocommerce-cart table.shop_table .order-total strong {
  color: var(--otx-accent) !important;
  font-size: 1.1rem !important;
}

/* ------------------------------------------------------------------
   11. CHECKOUT PAGE
   ------------------------------------------------------------------ */
.woocommerce-checkout h3 {
  font-family: var(--otx-font-head) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  color: var(--otx-txt) !important;
  margin-bottom: 1rem !important;
  padding-bottom: .6rem !important;
  border-bottom: 1px solid var(--otx-line) !important;
}

/* Form fields */
.woocommerce form .form-row label,
.woocommerce-checkout .form-row label {
  color: var(--otx-muted) !important;
  font-size: .85rem !important;
  font-weight: 500 !important;
  margin-bottom: .35rem !important;
  display: block !important;
}
.woocommerce form .form-row input,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout select,
.woocommerce-checkout textarea {
  background: var(--otx-surface-2) !important;
  color: var(--otx-txt) !important;
  border: 1px solid var(--otx-line-2) !important;
  border-radius: var(--otx-radius-sm) !important;
  padding: .7rem .95rem !important;
  font-family: var(--otx-font-body) !important;
  font-size: .9rem !important;
  width: 100% !important;
  transition: border-color var(--otx-ease), box-shadow var(--otx-ease) !important;
}
.woocommerce form .form-row input:focus,
.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
  outline: none !important;
  border-color: var(--otx-accent) !important;
  box-shadow: 0 0 0 3px rgba(90,200,250,.15) !important;
}
.woocommerce form .form-row input::placeholder,
.woocommerce-checkout input::placeholder {
  color: var(--otx-faint) !important;
}

/* Order review box */
#order_review,
.woocommerce-checkout-review-order {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  padding: 1.5rem !important;
}
#order_review table.shop_table {
  background: transparent !important;
  border: none !important;
}
#order_review table.shop_table th,
#order_review table.shop_table td {
  color: var(--otx-txt) !important;
  border-color: var(--otx-line) !important;
}
#order_review table.shop_table .order-total td strong {
  color: var(--otx-accent) !important;
  font-size: 1.1rem !important;
}

/* Payment section */
#payment {
  background: var(--otx-surface-2) !important;
  border-radius: var(--otx-radius) !important;
  border: 1px solid var(--otx-line) !important;
}
#payment .payment_methods li {
  border-color: var(--otx-line) !important;
  color: var(--otx-muted) !important;
}
#payment .payment_methods li.wc_payment_method input[type="radio"]:checked + label {
  color: var(--otx-txt) !important;
}
#payment div.payment_box {
  background: var(--otx-surface-3) !important;
  color: var(--otx-muted) !important;
  border-radius: var(--otx-radius-sm) !important;
}
#payment div.payment_box::before {
  border-bottom-color: var(--otx-surface-3) !important;
}

/* ------------------------------------------------------------------
   12. MY ACCOUNT PAGE
   ------------------------------------------------------------------ */
.woocommerce-MyAccount-navigation {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  padding: 1rem !important;
  overflow: hidden;
}
.woocommerce-MyAccount-navigation ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.woocommerce-MyAccount-navigation li {
  border-radius: var(--otx-radius-sm) !important;
}
.woocommerce-MyAccount-navigation li a {
  display: block !important;
  padding: .7rem 1rem !important;
  color: var(--otx-muted) !important;
  font-size: .9rem !important;
  font-weight: 500 !important;
  border-radius: var(--otx-radius-sm) !important;
  transition: background var(--otx-ease), color var(--otx-ease) !important;
}
.woocommerce-MyAccount-navigation li a:hover,
.woocommerce-MyAccount-navigation li.is-active a {
  background: var(--otx-accent-bg) !important;
  color: var(--otx-accent) !important;
}

/* Account content area */
.woocommerce-MyAccount-content {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  padding: 1.5rem !important;
  color: var(--otx-txt) !important;
}
.woocommerce-MyAccount-content p,
.woocommerce-MyAccount-content .woocommerce-Address-title {
  color: var(--otx-muted) !important;
}
.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
  color: var(--otx-txt) !important;
  font-size: 1.05rem !important;
  margin-bottom: .75rem !important;
}

/* Orders table in account */
.woocommerce-orders-table {
  width: 100% !important;
  border-collapse: collapse !important;
}
.woocommerce-orders-table th {
  background: var(--otx-surface-2) !important;
  color: var(--otx-faint) !important;
  font-size: .78rem !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  padding: .8rem 1rem !important;
  text-align: left !important;
  border-bottom: 1px solid var(--otx-line) !important;
}
.woocommerce-orders-table td {
  color: var(--otx-txt) !important;
  padding: .85rem 1rem !important;
  border-bottom: 1px solid var(--otx-line) !important;
  font-size: .9rem !important;
}
.woocommerce-orders-table tr:last-child td {
  border-bottom: none !important;
}
.woocommerce-orders-table mark.order-status {
  background: var(--otx-surface-3) !important;
  color: var(--otx-txt) !important;
  padding: .25rem .6rem !important;
  border-radius: var(--otx-radius-pill) !important;
  font-size: .78rem !important;
  font-weight: 600 !important;
}
.woocommerce-orders-table mark.order-status.status-completed {
  background: rgba(31,184,113,.15) !important;
  color: var(--otx-success) !important;
}
.woocommerce-orders-table mark.order-status.status-processing {
  background: rgba(90,200,250,.12) !important;
  color: var(--otx-accent) !important;
}

/* Login form on my-account */
.wd-registration-page {
  background: var(--otx-bg) !important;
}
.wd-registration-page .wd-login-title {
  font-family: var(--otx-font-head) !important;
  color: var(--otx-txt) !important;
  font-size: 1.4rem !important;
  margin-bottom: 1.25rem !important;
}
/* Login form card */
#customer_login .wd-col,
#customer_login .col-login,
#customer_login .col-register {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  padding: 1.75rem !important;
}

/* WoodMart login form inputs */
.wd-login-form .form-row input,
.woocommerce-form-login input,
.woocommerce-form-register input {
  background: var(--otx-surface-2) !important;
  color: var(--otx-txt) !important;
  border: 1px solid var(--otx-line-2) !important;
  border-radius: var(--otx-radius-sm) !important;
  padding: .7rem .95rem !important;
  font-size: .9rem !important;
  width: 100% !important;
  transition: border-color var(--otx-ease), box-shadow var(--otx-ease) !important;
}
.wd-login-form .form-row input:focus,
.woocommerce-form-login input:focus {
  outline: none !important;
  border-color: var(--otx-accent) !important;
  box-shadow: 0 0 0 3px rgba(90,200,250,.15) !important;
}

/* ------------------------------------------------------------------
   13. FORMS — GLOBAL
   ------------------------------------------------------------------ */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="url"],
input[type="search"],
textarea,
select {
  background: var(--otx-surface-2) !important;
  color: var(--otx-txt) !important;
  border: 1px solid var(--otx-line-2) !important;
  border-radius: var(--otx-radius-sm) !important;
  font-family: var(--otx-font-body) !important;
  transition: border-color var(--otx-ease), box-shadow var(--otx-ease) !important;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
textarea:focus,
select:focus {
  outline: none !important;
  border-color: var(--otx-accent) !important;
  box-shadow: 0 0 0 3px rgba(90,200,250,.15) !important;
}
label {
  color: var(--otx-muted) !important;
  font-size: .875rem !important;
  font-weight: 500 !important;
}

/* Checkbox / radio */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--otx-accent) !important;
}

/* ------------------------------------------------------------------
   14. NOTICES & MESSAGES
   ------------------------------------------------------------------ */
.woocommerce-message,
.wc-block-components-notice-banner,
.woocommerce-error,
.woocommerce-notice {
  border-radius: var(--otx-radius-sm) !important;
  font-size: .9rem !important;
}
.woocommerce-message {
  background: rgba(31,184,113,.1) !important;
  border-top-color: var(--otx-success) !important;
  color: var(--otx-txt) !important;
}
.woocommerce-error {
  background: rgba(248,113,113,.1) !important;
  border-top-color: var(--otx-error) !important;
  color: var(--otx-txt) !important;
}

/* ------------------------------------------------------------------
   15. THANK YOU / ORDER RECEIVED PAGE
   ------------------------------------------------------------------ */
.woocommerce-order {
  max-width: 680px !important;
  margin: 0 auto !important;
}
.woocommerce-thankyou-order-received {
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  color: var(--otx-success) !important;
  display: flex !important;
  align-items: center !important;
  gap: .6rem !important;
  padding: 1rem 1.25rem !important;
  background: rgba(31,184,113,.08) !important;
  border: 1px solid rgba(31,184,113,.25) !important;
  border-radius: var(--otx-radius) !important;
  margin-bottom: 1.5rem !important;
}
.woocommerce-order-overview {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  padding: 1.25rem 1.5rem !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 1.25rem !important;
  list-style: none !important;
  margin: 0 0 1.5rem !important;
}
.woocommerce-order-overview li {
  color: var(--otx-muted) !important;
  font-size: .875rem !important;
}
.woocommerce-order-overview li strong {
  display: block !important;
  color: var(--otx-txt) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  margin-top: .2rem !important;
}

/* Order details table */
.woocommerce-table--order-details {
  background: var(--otx-surface) !important;
  border-collapse: collapse !important;
  width: 100% !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  overflow: hidden !important;
}
.woocommerce-table--order-details th,
.woocommerce-table--order-details td {
  padding: .85rem 1rem !important;
  border-bottom: 1px solid var(--otx-line) !important;
  color: var(--otx-txt) !important;
}
.woocommerce-table--order-details tfoot tr:last-child td,
.woocommerce-table--order-details tfoot tr:last-child th {
  border-bottom: none !important;
}

/* ------------------------------------------------------------------
   16. SIDEBAR
   ------------------------------------------------------------------ */
#sidebar,
.sidebar,
.wd-sidebar {
  background: transparent !important;
}
.widget {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line) !important;
  border-radius: var(--otx-radius) !important;
  padding: 1.25rem !important;
  margin-bottom: 1.25rem !important;
}

/* ------------------------------------------------------------------
   17. QUANTITY — hidden per woodmart-child (kept)
   ------------------------------------------------------------------ */
.quantity {
  display: none !important;
}

/* ------------------------------------------------------------------
   18. ADDITIONAL FIELDS — hidden per woodmart-child (kept)
   ------------------------------------------------------------------ */
.woocommerce-additional-fields {
  display: none !important;
}

/* ------------------------------------------------------------------
   19. WoodMart-specific DARK MODE overrides
      Force WoodMart color-scheme elements into our palette
   ------------------------------------------------------------------ */
.wd-scroll-top,
.wd-scroll-top:hover {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line-2) !important;
  color: var(--otx-muted) !important;
}
.wd-mini-cart {
  background: var(--otx-surface) !important;
  border: 1px solid var(--otx-line-2) !important;
}
.wd-mini-cart .mini_cart_item {
  border-color: var(--otx-line) !important;
  color: var(--otx-txt) !important;
}
.wd-mini-cart .mini_cart_item a {
  color: var(--otx-txt) !important;
}

/* Cookie / notice bars */
.wd-notice-bar {
  background: var(--otx-surface-2) !important;
  border-top: 1px solid var(--otx-line) !important;
  color: var(--otx-muted) !important;
}

/* Search form */
.wd-search-form input[type="search"],
.site-search input[type="search"] {
  background: var(--otx-surface-2) !important;
  border: 1px solid var(--otx-line-2) !important;
  color: var(--otx-txt) !important;
  border-radius: var(--otx-radius-pill) !important;
  padding: .5rem 1rem !important;
}

/* ------------------------------------------------------------------
   20. MOBILE — responsive adjustments
   ------------------------------------------------------------------ */
@media (max-width: 768px) {
  .woocommerce-MyAccount-navigation {
    margin-bottom: 1rem !important;
  }
  .woocommerce-MyAccount-content {
    padding: 1.1rem !important;
  }
  #order_review,
  .woocommerce-checkout-review-order {
    padding: 1rem !important;
  }
  .wd-product .product-wrapper,
  li.product .product-wrapper {
    border-radius: 12px !important;
  }
  h1.page-title,
  .woocommerce-products-header__title {
    font-size: 1.4rem !important;
  }
}
@media (max-width: 480px) {
  .woocommerce-order-overview {
    flex-direction: column !important;
    gap: .75rem !important;
  }
}

/* ------------------------------------------------------------------
   21. ACCESSIBILITY — focus ring
   ------------------------------------------------------------------ */
:focus-visible {
  outline: 2px solid var(--otx-accent) !important;
  outline-offset: 3px !important;
}
/* Remove default outline when using mouse */
:focus:not(:focus-visible) {
  outline: none !important;
}

/* Skip link */
.skip-link {
  position: absolute !important;
  top: -100% !important;
  left: 1rem !important;
  background: var(--otx-accent) !important;
  color: var(--otx-accent-dk) !important;
  padding: .5rem 1rem !important;
  border-radius: 0 0 var(--otx-radius-sm) var(--otx-radius-sm) !important;
  font-weight: 700 !important;
  z-index: 9999 !important;
}
.skip-link:focus {
  top: 0 !important;
}

/* ------------------------------------------------------------------
   22. OTX-A11Y — carried from Customizer CSS (post 154)
      These live in Additional CSS keyed to woodmart-child, so under
      official-tebex they must be re-applied here.
   ------------------------------------------------------------------ */
.product-labels .new,
.product-labels span.new { background:#5AC8FA !important; color:#04121A !important; font-weight:700; text-shadow:none !important; }
.product-labels .onsale,
.product-labels span.onsale { background:#1FB871 !important; color:#03130C !important; font-weight:700; text-shadow:none !important; }
.wd-cat-design-default .wd-cat-image { min-height:44px; }
