/*
Theme Name: JR 2021 Wholesale Child
Theme URI: https://www.jr2021wholesale.com
Description: Professional wholesale theme for JR 2021 Wholesale — built on Astra. Includes full WooCommerce support, wholesale-ready design, and brand colors.
Author: JR 2021 Wholesale
Author URI: https://www.jr2021wholesale.com
Template: astra
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: jr2021-child
Tags: woocommerce, wholesale, business, ecommerce
*/

/* ═══════════════════════════════════════════════
   JR 2021 WHOLESALE — BRAND VARIABLES
═══════════════════════════════════════════════ */
:root {
  --jr-navy:   #0a1628;
  --jr-gold:   #e8b84b;
  --jr-gold2:  #c89a2e;
  --jr-red:    #c0392b;
  --jr-blue:   #1a3a6e;
  --jr-light:  #f4f6f9;
  --jr-white:  #ffffff;
  --jr-text:   #1a1a2e;
  --jr-muted:  #6b7280;
  --jr-green:  #16a34a;
  --jr-border: #e2e8f0;
}

/* ═══════════════════════════════════════════════
   GLOBAL OVERRIDES
═══════════════════════════════════════════════ */
body {
  font-family: 'Barlow', -apple-system, BlinkMacSystemFont, sans-serif !important;
  background: var(--jr-light) !important;
  color: var(--jr-text) !important;
}

/* ═══════════════════════════════════════════════
   HEADER / SITE BRANDING
═══════════════════════════════════════════════ */
.site-header,
.ast-masthead-custom-menu-items,
.main-header-bar {
  background-color: var(--jr-navy) !important;
}

.site-header .site-title a,
.site-header .site-description {
  color: var(--jr-white) !important;
}

/* Gold announcement bar */
.ast-header-break-point .site-header,
.ast-above-header-bar {
  background-color: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
}

/* ═══════════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════════ */
.main-navigation .menu > li > a,
.ast-nav-link {
  color: rgba(255, 255, 255, 0.85) !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  font-size: 0.88rem !important;
  transition: color 0.2s !important;
}

.main-navigation .menu > li > a:hover,
.ast-nav-link:hover {
  color: var(--jr-gold) !important;
}

/* Highlighted CTA button in nav */
.main-navigation .menu .menu-item-has-classes.nav-cta > a,
.ast-button-component {
  background: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
  border-radius: 6px !important;
  padding: 8px 18px !important;
  font-weight: 700 !important;
}

.main-navigation .menu .menu-item-has-classes.nav-cta > a:hover {
  background: var(--jr-gold2) !important;
}

/* Dropdown menus */
.main-navigation .sub-menu {
  background: var(--jr-navy) !important;
  border-top: 3px solid var(--jr-gold) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,0.3) !important;
}

.main-navigation .sub-menu a {
  color: rgba(255, 255, 255, 0.75) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.main-navigation .sub-menu a:hover {
  background: rgba(232, 184, 75, 0.1) !important;
  color: var(--jr-gold) !important;
}

/* ═══════════════════════════════════════════════
   BUTTONS — GLOBAL
═══════════════════════════════════════════════ */
.ast-button,
.button,
.wp-block-button__link,
input[type="submit"],
button[type="submit"] {
  background-color: var(--jr-navy) !important;
  color: var(--jr-white) !important;
  border: none !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  transition: all 0.2s !important;
}

.ast-button:hover,
.button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background-color: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(232, 184, 75, 0.3) !important;
}

/* Primary / accent buttons */
.ast-button.primary,
.button.primary,
.woocommerce-page .button.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
  background-color: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
}

.ast-button.primary:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background-color: var(--jr-gold2) !important;
}

/* ═══════════════════════════════════════════════
   HEADINGS
═══════════════════════════════════════════════ */
h1, h2, h3, h4, h5, h6 {
  color: var(--jr-navy) !important;
  font-family: 'Barlow Condensed', 'Barlow', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
}

.entry-title,
.page-title {
  color: var(--jr-navy) !important;
}

/* ═══════════════════════════════════════════════
   LINKS
═══════════════════════════════════════════════ */
a {
  color: var(--jr-blue) !important;
  transition: color 0.2s !important;
}

a:hover {
  color: var(--jr-gold) !important;
}

/* ═══════════════════════════════════════════════
   WOOCOMMERCE — PRODUCT CARDS
═══════════════════════════════════════════════ */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
  background: var(--jr-white) !important;
  border: 1px solid var(--jr-border) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  transition: all 0.25s !important;
  box-shadow: none !important;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.1) !important;
  border-color: var(--jr-gold) !important;
}

/* Product title */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  color: var(--jr-navy) !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

/* Product price */
.woocommerce ul.products li.product .price,
.woocommerce .price {
  color: var(--jr-navy) !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
}

.woocommerce ul.products li.product .price ins {
  color: var(--jr-green) !important;
}

.woocommerce ul.products li.product .price del {
  color: var(--jr-muted) !important;
  opacity: 0.6 !important;
}

/* Add to cart button */
.woocommerce ul.products li.product .button,
.woocommerce a.button.add_to_cart_button {
  background-color: var(--jr-navy) !important;
  color: var(--jr-white) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.5px !important;
  padding: 10px 16px !important;
  transition: all 0.2s !important;
}

.woocommerce ul.products li.product .button:hover {
  background-color: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
}

/* Sale badge */
.woocommerce span.onsale {
  background-color: var(--jr-red) !important;
  color: var(--jr-white) !important;
  border-radius: 6px !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  padding: 4px 8px !important;
  min-height: auto !important;
  min-width: auto !important;
  line-height: 1 !important;
}

/* ═══════════════════════════════════════════════
   WOOCOMMERCE — SINGLE PRODUCT PAGE
═══════════════════════════════════════════════ */
.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 2px solid var(--jr-gold) !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--jr-navy) !important;
  border-bottom: 2px solid var(--jr-gold) !important;
}

.woocommerce div.product p.price {
  color: var(--jr-navy) !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
  font-family: 'Barlow Condensed', sans-serif !important;
}

/* ═══════════════════════════════════════════════
   WOOCOMMERCE — CART & CHECKOUT
═══════════════════════════════════════════════ */
.woocommerce #payment {
  background: var(--jr-light) !important;
  border-radius: 12px !important;
}

.woocommerce-checkout #payment .place-order .button {
  background-color: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
  font-size: 1.1rem !important;
  padding: 16px 32px !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  width: 100% !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

.woocommerce-checkout #payment .place-order .button:hover {
  background-color: var(--jr-gold2) !important;
  transform: translateY(-2px) !important;
}

/* Cart totals */
.woocommerce .cart_totals,
.woocommerce-page .cart_totals {
  background: var(--jr-navy) !important;
  border-radius: 16px !important;
  padding: 2rem !important;
  color: var(--jr-white) !important;
}

.woocommerce .cart_totals h2,
.woocommerce-page .cart_totals h2 {
  color: var(--jr-gold) !important;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  font-size: 1.05rem !important;
}

/* ═══════════════════════════════════════════════
   PRODUCT CATEGORY PAGES — FILTER SIDEBAR
═══════════════════════════════════════════════ */
.widget_product_categories .product-categories a,
.widget_layered_nav_filters a {
  color: var(--jr-blue) !important;
  font-weight: 600 !important;
}

.widget_product_categories .product-categories a:hover {
  color: var(--jr-gold) !important;
}

/* Category count badges */
.widget_product_categories .count {
  background: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
  border-radius: 100px !important;
  padding: 1px 8px !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
}

/* ═══════════════════════════════════════════════
   SIDEBAR WIDGETS
═══════════════════════════════════════════════ */
.widget-title {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  text-transform: uppercase !important;
  color: var(--jr-navy) !important;
  padding-bottom: 0.5rem !important;
  border-bottom: 2px solid var(--jr-gold) !important;
  margin-bottom: 1rem !important;
}

/* ═══════════════════════════════════════════════
   WOOCOMMERCE NOTICES
═══════════════════════════════════════════════ */
.woocommerce-message,
.woocommerce-info {
  border-top-color: var(--jr-gold) !important;
  background: rgba(232, 184, 75, 0.08) !important;
  color: var(--jr-navy) !important;
}

.woocommerce-error {
  border-top-color: var(--jr-red) !important;
  background: rgba(192, 57, 43, 0.08) !important;
}

/* ═══════════════════════════════════════════════
   FORMS — GLOBAL
═══════════════════════════════════════════════ */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
textarea,
select {
  border: 2px solid var(--jr-border) !important;
  border-radius: 8px !important;
  font-family: 'Barlow', sans-serif !important;
  font-size: 0.95rem !important;
  padding: 10px 14px !important;
  transition: border-color 0.2s !important;
  background: var(--jr-white) !important;
  outline: none !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border-color: var(--jr-gold) !important;
  box-shadow: 0 0 0 3px rgba(232, 184, 75, 0.1) !important;
}

/* ═══════════════════════════════════════════════
   PAGE HERO BANNER
═══════════════════════════════════════════════ */
.ast-page-builder-template .entry-content {
  padding: 0 !important;
}

/* Custom hero for inner pages */
.jr-page-hero {
  background: var(--jr-navy);
  color: var(--jr-white);
  padding: 4rem 2rem;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.jr-page-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at center, rgba(232,184,75,0.06), transparent 70%);
}

.jr-page-hero h1 {
  font-family: 'Bebas Neue', sans-serif !important;
  font-size: 3.5rem !important;
  letter-spacing: 4px !important;
  color: var(--jr-white) !important;
  position: relative;
}

.jr-page-hero h1 span {
  color: var(--jr-gold) !important;
}

/* ═══════════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════════ */
.site-footer,
.footer-widget-area,
#colophon {
  background: #060e1a !important;
  color: rgba(255, 255, 255, 0.5) !important;
}

.site-footer .widget-title {
  color: var(--jr-white) !important;
  border-bottom-color: var(--jr-gold) !important;
}

.site-footer a,
.footer-widget-area a {
  color: rgba(255, 255, 255, 0.5) !important;
}

.site-footer a:hover,
.footer-widget-area a:hover {
  color: var(--jr-gold) !important;
}

.footer-bar,
.ast-footer-copyright {
  background: rgba(0, 0, 0, 0.3) !important;
  color: rgba(255, 255, 255, 0.4) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 1rem 2rem !important;
}

/* ═══════════════════════════════════════════════
   WHOLESALE PRICING — BADGE STYLING
═══════════════════════════════════════════════ */
.wholesale-price,
.wcwp-wholesale-price {
  background: var(--jr-gold) !important;
  color: var(--jr-navy) !important;
  padding: 4px 10px !important;
  border-radius: 6px !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  display: inline-block !important;
  margin-top: 4px !important;
}

.wholesale-price-label {
  color: var(--jr-muted) !important;
  font-size: 0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  font-weight: 600 !important;
}

/* ═══════════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════════ */
@media (max-width: 768px) {
  .ast-above-header-bar {
    font-size: 0.72rem !important;
    padding: 0.4rem 1rem !important;
  }

  .jr-page-hero h1 {
    font-size: 2.5rem !important;
  }

  .woocommerce ul.products[class*="columns-"] li.product {
    margin-bottom: 1rem !important;
  }
}

/* ═══════════════════════════════════════════════
   GOOGLE FONTS IMPORT — Place in functions.php
   @import url is here for reference only
═══════════════════════════════════════════════ */
/* Fonts loaded via functions.php enqueue */