/*
Theme Name: WrestleBelts Official Theme
Template: hello-elementor
Author: Child Theme Configurator
Version: 2.5.202607250001
Updated: 2026-07-25 00:00:01

*/

@media (max-width: 1024px) {
  footer .footer-menu a {
    justify-content: center;
  }
}

footer .footer-menu a:hover {
  font-weight: bold !important;
}

footer .footer-menu li {
  position: relative;
}

footer .footer-menu li:hover:after {
  opacity: 1;
  width: 12px;
}

@media (max-width: 1024px) {
  footer .footer-menu li::after {
    display: none;
  }
}

footer .footer-menu li::after {
  transition: all 0.2s;
  content: "";
  position: absolute;
  height: 3px;
  width: 8px;
  opacity: 0.5;
  border-radius: 100px;
  background-color: white;
  top: 50%;
  left: 0;
  transform: translate(0%, -50%);
}

.page-id-9 .wp-block-woocommerce-cart {
  margin-inline: 0px !important;
}

hr.wp-block-separator {
  margin-block: 2rem !important;
  opacity: 0.5;
}

/* REX ORDER TRACK STYLING START */

.rex-order-track-form {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.rex-order-track-form .track-info {
  max-width: 500px;
  text-align: center;
}

.rex-order-track-form .rex-form {
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 1px solid var(--e-global-color-45f7b27);
  max-width: 500px;
  width: 100%;
  border-radius: 8px;
  padding: 16px;
  position: relative;
  overflow: hidden;
  z-index: 200;
}
.rex-order-track-form .rex-form::before {
  content: "";
  z-index: -100;
  opacity: 0.3;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.rex-order-track-form .rex-form .submit-holder {
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.rex-order-track-form .rex-form .submit-holder button[type="submit"] {
  background-color: var(--e-global-color-primary);
  color: white;
}

.rex-order-track-form .rex-form > * {
  width: 100% !important;
}

/* REX ORDER TRACK STYLING END */

.woocommerce-form.login .button,
.woocommerce-form.register .button {
  background-color: var(--e-global-color-45f7b27);
  color: black;
}

.woocommerce-form.login .button:hover,
.woocommerce-form.register .button:hover {
  color: var(--e-global-color-45f7b27);
  background-color: black;
}

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
  border-radius: 8px;
}

.woocommerce-error {
  border: 1px solid rgb(199, 32, 32);
  background-color: rgb(199, 32, 32, 0.15);
}
.woocommerce-error::before {
  color: rgb(199, 32, 32) !important;
}

.woocommerce-message {
  border: 1px solid rgb(32, 199, 90);
  background-color: rgb(32, 199, 90, 0.15);
}
.woocommerce-message::before {
  color: rgb(32, 199, 90) !important;
}

.woocommerce-info {
  border: 1px solid rgb(61, 108, 250);
  background-color: rgb(61, 108, 250, 0.1);
}
.woocommerce-info::before {
  color: rgb(61, 108, 250) !important;
}

.woocommerce-MyAccount-navigation ul {
  border-radius: 8px;
  background-color: rgb(235, 235, 235);
  list-style: none;
  padding: 8px;
  overflow: hidden;
}
.woocommerce-MyAccount-navigation li {
  border-radius: 6px !important;
  overflow: hidden;
}
.woocommerce-MyAccount-navigation li a {
  color: var(--e-global-color-de4b121) !important;
  opacity: 0.7;
  padding: 8px 16px;
  display: block;
}

.woocommerce-MyAccount-navigation li a:hover {
  opacity: 1;
}

.woocommerce-MyAccount-navigation li.is-active a {
  color: white !important;
  background-color: var(--e-global-color-45f7b27);
  font-weight: bold;
  opacity: 1;
}

.woocommerce-MyAccount-content {
  padding: 16px;
  border: 1px solid rgb(235, 235, 235);
  border-radius: 8px !important;
}

.products .product .rex-hover-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.3s ease;
  border-radius: 8px;
}

.products .product a.woocommerce-LoopProduct-link {
  position: relative;
  display: block;
}

.products .product:hover .rex-hover-image {
  opacity: 1;
}

.woocommerce-pagination li {
  border-radius: 4px;
  min-width: 30px;
}

.woocommerce-pagination .page-numbers li:not(:last-child) {
  margin-right: 4px;
}

.rex-btn button.button {
  background: linear-gradient(135deg, #145a32, #70cf74, #145a32);

  background-size: 400% 400%;
  animation: rexGradientShift 6s ease infinite;
  color: #edeae0;
  border: none;
  padding: 14px 32px;
  font-weight: 600;
  letter-spacing: 0.5px;
  border-radius: 4px;
  cursor: pointer;
  transition: transform 0.05s ease;
}

.rex-btn button:hover {
  transform: scale(1.03);
}

@keyframes rexGradientShift {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.price {
  margin-bottom: 0px;
}
.price .saving {
  background-color: rgb(255, 92, 92);
  color: white;
  padding: 6px 12px;
  border-radius: 8px;
  display: inline-block;
}

.woocommerce .checkout-button {
  display: none;
  color: var(--e-global-color-text) !important;
  background-color: var(--e-global-color-accent) !important;
}

.woocommerce .cart .product-name a {
  font-weight: 600;
  color: var(--e-global-color-text) !important;
}

.woocommerce .cart .product-name .variation {
  color: var(--e-global-color-secondary);
}

#rex-variation-price {
  display: none;
  padding-bottom: 1em;
  font-size: 20px !important;
}

#rex-variation-price span {
  font-size: 20px !important;
}

#rex-variation-price .sale-price,
#rex-variation-price .sale-price .price {
  color: var(--e-global-color-text) !important;
  font-size: 20px !important;
  font-weight: 600;
}

#rex-variation-price .original-price,
#rex-variation-price .original-price .price {
  color: var(--e-global-color-text) !important;
  opacity: 0.7;
  font-size: 14px !important;
  text-decoration: line-through;
}

.button[name="update_cart"]{
    display: none !important;
}

/* Desktop header breaks out of the 1200px content grid (2026-07-20).
   Scoped to the single desktop header wrapper only — all other .wb-container
   elements (homepage, product, footer) keep the 1200px branding grid.
   Parent .elementor-element-26a0f4c is elementor-hidden-tablet, so this is
   desktop-only by construction; the media query is belt-and-braces. */
@media (min-width: 1025px) {
  .elementor-element-26a0f4c > .elementor-element-a6046cd.wb-container {
    max-width: none !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

/* header menu true-center v1 (2026-07-21) — 3-container nav row: give logo + right cluster equal flex so the menu stays dead-centered no matter their widths */
.elementor-35 .elementor-element.elementor-element-ddf460d > .elementor-element.elementor-element-9167f78 { flex:1 1 0 !important; }
.elementor-35 .elementor-element.elementor-element-ddf460d > .elementor-element.elementor-element-b114648 { flex:1 1 0 !important; }
.elementor-35 .elementor-element.elementor-element-ddf460d > .elementor-element.elementor-element-f87f611 { flex:0 1 auto !important; }
.elementor-35 .elementor-element.elementor-element-ddf460d > .elementor-element.elementor-element-9167f78 { max-width:none !important; }

/* menu items center v3 (2026-07-21) — the menu CONTAINER is centered, but the <ul> items were left-aligned inside it. Center the items within the nav so the visible menu is truly centered. */
.elementor-35 .elementor-element.elementor-element-f87f611 nav { justify-content:center !important; }
.elementor-35 .elementor-element.elementor-element-f87f611 nav > ul { justify-content:center !important; }

/* menu ul margin-center v4 (2026-07-21) — the <ul> has margin-right:auto (Elementor left-align) which pushes it left and overrides justify-content. Balance with margin-left:auto so it truly centers. */
.elementor-35 .elementor-element.elementor-element-f87f611 ul.elementor-nav-menu { margin-left:auto !important; margin-right:auto !important; }

/* ---------- accessibility: hide screen-reader-only text ----------
   WordPress/WooCommerce emit .screen-reader-text spans (e.g. "Original price
   was: $199. Current price is: $160.") alongside sale prices. This theme never
   defined the class, so that text rendered visibly on shop cards and anywhere
   else a sale price appears. Standard WP clip technique: invisible on screen,
   still announced by assistive tech. */
.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;
  width: 1px;
  word-wrap: normal !important;
}
.screen-reader-text:focus {
  clip: auto !important;
  clip-path: none;
  height: auto;
  width: auto;
  display: block;
  padding: 15px 23px 14px;
  background: #fff;
  z-index: 100000;
}

/* ===== Fix hello-elementor reset.css placeholder pink (#cc3366) leaking onto
   unstyled buttons/tabs on :hover/:focus. Same selectors as reset.css but this
   child stylesheet loads later, so it wins. Styled buttons (Add to Cart, Buy
   Now, etc.) set their own hover bg at higher specificity and are unaffected.
   (2026-07-25) ===== */
button, [type="button"], [type="submit"], [type="reset"] { border-color: currentColor; }
button:hover, button:focus,
[type="button"]:hover, [type="button"]:focus,
[type="submit"]:hover, [type="submit"]:focus,
[type="reset"]:hover, [type="reset"]:focus { background-color: transparent; }
/* Buttons that set a base background but no :hover would go transparent under the
   rule above — pin their hover back to their intended colour. */
.rex-order-track-form .rex-form .submit-holder button[type="submit"]:hover { background-color: var(--e-global-color-primary); }