/* ============================================
   WCOOMMERCE SHOP - CLASSIC V3 DESIGN SYSTEM
   ============================================ */
:root {
  --v3-primary: #3338A0;
  --v3-primary-dark: #252978;
  --v3-primary-rgb: 51, 56, 160;
  --v3-gold: #C59560;
  --v3-gold-light: #D9B17E;
  --v3-accent: #FCC61D;
  --v3-bg: #F7F7F7;
  --v3-white: #FFFFFF;
  --v3-dark: #1A1A2E;
  --v3-text: #444;
  --v3-muted: #888;
  --v3-border: #EAEAEA;
  --v3-radius: 16px;
  --v3-radius-sm: 8px;
  --v3-ease: cubic-bezier(.25, .46, .45, .94);
  --v3-font: 'Be Vietnam Pro', -apple-system, sans-serif;
  --v3-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
  --v3-shadow-hover: 0 20px 40px rgba(51, 56, 160, 0.08);
}

/* Base modifications for WooCommerce pages */
.archive.post-type-archive-product,
.archive.tax-product_cat,
.archive.tax-product_tag {
  background-color: var(--v3-bg) !important;
  font-family: var(--v3-font) !important;
}

.archive.post-type-archive-product h1,
.archive.post-type-archive-product h2,
.archive.post-type-archive-product h3,
.archive.post-type-archive-product p,
.archive.post-type-archive-product a,
.archive.post-type-archive-product span,
.archive.tax-product_cat h1,
.archive.tax-product_cat h2,
.archive.tax-product_cat h3,
.archive.tax-product_cat p,
.archive.tax-product_cat a,
.archive.tax-product_cat span {
  font-family: var(--v3-font) !important;
}

/* ============================================
   SHOP HERO / BANNER
   ============================================ */
.shop-hero-v3 {
  background: linear-gradient(135deg, var(--v3-primary) 0%, var(--v3-primary-dark) 100%) !important;
  color: var(--v3-white) !important;
  padding: 60px 0 !important;
  position: relative !important;
  overflow: hidden !important;
  border-bottom-left-radius: 24px !important;
  border-bottom-right-radius: 24px !important;
  margin-bottom: 40px !important;
}

.shop-hero-v3::before {
  content: '' !important;
  position: absolute !important;
  width: 450px !important;
  height: 450px !important;
  background: radial-gradient(circle, rgba(252, 198, 29, 0.1) 0%, transparent 70%) !important;
  top: -200px !important;
  right: -100px !important;
  border-radius: 50% !important;
  pointer-events: none !important;
}

.shop-hero-v3-container {
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
}

.shop-hero-v3-content {
  position: relative !important;
  z-index: 2 !important;
  text-align: left !important;
}

.shop-hero-v3 h1 {
  font-size: 38px !important;
  font-weight: 800 !important;
  color: var(--v3-white) !important;
  margin: 0 0 12px 0 !important;
  letter-spacing: -0.5px !important;
  text-transform: none !important;
}

.shop-hero-v3-desc {
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 15px !important;
  max-width: 700px !important;
  line-height: 1.6 !important;
}

/* ============================================
   BREADCRUMBS & CONTROL BAR
   ============================================ */
.woocommerce-breadcrumb,
.shop-sidebar .woocommerce-breadcrumb,
.sidebar-inner .woocommerce-breadcrumb,
.breadcrumbs {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  color: var(--v3-muted) !important;
  margin-bottom: 24px !important;
  padding: 0 !important;
  background: transparent !important;
}

.woocommerce-breadcrumb a,
.breadcrumbs a {
  color: var(--v3-muted) !important;
}

.woocommerce-breadcrumb a:hover,
.breadcrumbs a:hover {
  color: var(--v3-primary) !important;
}

/* Customize result count and order select */
.shop-container .woocommerce-result-count {
  font-size: 14px !important;
  color: var(--v3-muted) !important;
  font-weight: 500 !important;
  float: none !important;
  display: inline-block !important;
  margin: 0 !important;
}

.shop-container select.orderby {
  padding: 10px 36px 10px 20px !important;
  border-radius: 30px !important;
  border: 1px solid var(--v3-border) !important;
  background-color: var(--v3-white) !important;
  font-family: var(--v3-font) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--v3-text) !important;
  cursor: pointer !important;
  outline: none !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.02) !important;
  transition: all 0.3s !important;
  appearance: none !important;
}

.shop-container select.orderby:hover,
.shop-container select.orderby:focus {
  border-color: var(--v3-primary) !important;
}

/* Custom layout for filter row */
.category-filtering-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 30px !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  border: none !important;
  background: transparent !important;
  padding: 0 !important;
}

/* ============================================
   SIDEBAR & WIDGETS
   ============================================ */
#shop-sidebar,
.shop-sidebar,
.sidebar-inner,
.widget-area {
  padding-right: 0px !important;
}

#shop-sidebar .widget,
.sidebar-inner .widget,
.shop-sidebar .widget,
.widget-area .widget {
  background: var(--v3-white) !important;
  border-radius: var(--v3-radius) !important;
  padding: 24px !important;
  border: 1px solid var(--v3-border) !important;
  box-shadow: var(--v3-shadow) !important;
  margin-bottom: 30px !important;
}

#shop-sidebar .widget-title,
.sidebar-inner .widget-title,
.shop-sidebar .widget-title,
.widget-area .widget-title,
#shop-sidebar .widgettitle,
.sidebar-inner .widgettitle,
.shop-sidebar .widgettitle,
.widget-area .widgettitle {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--v3-dark) !important;
  margin-bottom: 20px !important;
  position: relative !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid var(--v3-bg) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

#shop-sidebar .widget-title::after,
.sidebar-inner .widget-title::after,
.shop-sidebar .widget-title::after,
.widget-area .widget-title::after,
#shop-sidebar .widgettitle::after,
.sidebar-inner .widgettitle::after,
.shop-sidebar .widgettitle::after,
.widget-area .widgettitle::after {
  content: '' !important;
  position: absolute !important;
  bottom: -2px !important;
  left: 0 !important;
  width: 50px !important;
  height: 2px !important;
  background: var(--v3-primary) !important;
}

/* Product Categories Widget list */
#shop-sidebar .widget_product_categories ul,
.sidebar-inner .widget_product_categories ul,
.widget-area .widget_product_categories ul {
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
}

#shop-sidebar .widget_product_categories ul li,
.sidebar-inner .widget_product_categories ul li,
.widget-area .widget_product_categories ul li {
  padding: 0 !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

#shop-sidebar .widget_product_categories ul li a,
.sidebar-inner .widget_product_categories ul li a,
.widget-area .widget_product_categories ul li a {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #555 !important;
  padding: 4px 0 !important;
  transition: all 0.3s !important;
}

#shop-sidebar .widget_product_categories ul li a:hover,
.sidebar-inner .widget_product_categories ul li a:hover,
.widget-area .widget_product_categories ul li a:hover,
#shop-sidebar .widget_product_categories ul li.current-cat a,
.sidebar-inner .widget_product_categories ul li.current-cat a,
.widget-area .widget_product_categories ul li.current-cat a {
  color: var(--v3-primary) !important;
  padding-left: 6px !important;
}

/* Float Category counts beautifully */
#shop-sidebar .widget_product_categories ul li .count,
.sidebar-inner .widget_product_categories ul li .count,
.widget-area .widget_product_categories ul li .count {
  background: var(--v3-bg) !important;
  color: var(--v3-muted) !important;
  padding: 2px 8px !important;
  border-radius: 20px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  float: right !important;
  transition: all 0.3s !important;
}

#shop-sidebar .widget_product_categories ul li a:hover + .count,
.sidebar-inner .widget_product_categories ul li a:hover + .count,
.widget-area .widget_product_categories ul li a:hover + .count,
#shop-sidebar .widget_product_categories ul li.current-cat .count,
.sidebar-inner .widget_product_categories ul li.current-cat .count,
.widget-area .widget_product_categories ul li.current-cat .count {
  background: var(--v3-primary) !important;
  color: var(--v3-white) !important;
}

/* Price Filter Widget */
#shop-sidebar .widget_price_filter .ui-slider,
.sidebar-inner .widget_price_filter .ui-slider,
.widget-area .widget_price_filter .ui-slider {
  height: 6px !important;
  background: #E0E0E0 !important;
  border-radius: 5px !important;
  border: none !important;
  margin: 25px 0 15px !important;
}

#shop-sidebar .widget_price_filter .ui-slider .ui-slider-range,
.sidebar-inner .widget_price_filter .ui-slider .ui-slider-range,
.widget-area .widget_price_filter .ui-slider .ui-slider-range {
  background: var(--v3-primary) !important;
}

#shop-sidebar .widget_price_filter .ui-slider .ui-slider-handle,
.sidebar-inner .widget_price_filter .ui-slider .ui-slider-handle,
.widget-area .widget_price_filter .ui-slider .ui-slider-handle {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  background: var(--v3-white) !important;
  border: 4px solid var(--v3-primary) !important;
  cursor: pointer !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15) !important;
  top: -6px !important;
  outline: none !important;
}

#shop-sidebar .widget_price_filter .price_slider_amount,
.sidebar-inner .widget_price_filter .price_slider_amount,
.widget-area .widget_price_filter .price_slider_amount {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--v3-muted) !important;
  margin-top: 15px !important;
}

#shop-sidebar .widget_price_filter .price_slider_amount .price_label,
.sidebar-inner .widget_price_filter .price_slider_amount .price_label,
.widget-area .widget_price_filter .price_slider_amount .price_label {
  order: 1 !important;
}

#shop-sidebar .widget_price_filter .price_slider_amount button.button,
.sidebar-inner .widget_price_filter .price_slider_amount button.button,
.widget-area .widget_price_filter .price_slider_amount button.button {
  order: 2 !important;
  background: var(--v3-primary) !important;
  color: var(--v3-white) !important;
  border: none !important;
  padding: 8px 20px !important;
  border-radius: 20px !important;
  font-family: var(--v3-font) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: all 0.3s !important;
  margin: 0 !important;
}

#shop-sidebar .widget_price_filter .price_slider_amount button.button:hover,
.sidebar-inner .widget_price_filter .price_slider_amount button.button:hover,
.widget-area .widget_price_filter .price_slider_amount button.button:hover {
  background: var(--v3-primary-dark) !important;
  transform: translateY(-1px) !important;
}

/* ============================================
   PRODUCT GRID & CARDS
   ============================================ */
.products.row {
  margin: 0 -12px !important;
}

.products.row .product-small.col {
  padding: 0 12px 24px 12px !important;
}

.product-small.box {
  background: var(--v3-white) !important;
  border-radius: var(--v3-radius) !important;
  overflow: hidden !important;
  border: 1px solid var(--v3-border) !important;
  box-shadow: var(--v3-shadow) !important;
  transition: all 0.4s var(--v3-ease) !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  margin: 0 !important;
}

.product-small.box:hover {
  transform: translateY(-6px) !important;
  box-shadow: var(--v3-shadow-hover) !important;
  border-color: rgba(51, 56, 160, 0.1) !important;
}

/* Thumbnail wrapper */
.product-small.box .box-image {
  background-color: #F4F4F9 !important;
  border-bottom: 1px solid var(--v3-border) !important;
}

.product-small.box .box-image img {
  width: 100% !important;
  height: auto !important;
  transition: transform 0.6s var(--v3-ease) !important;
}

.product-small.box:hover .box-image img {
  transform: scale(1.08) !important;
}

/* Customizing WooCommerce default badges (Sale, Hot) */
.product-small.box .badge {
  border-radius: 20px !important;
  padding: 4px 12px !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  top: 12px !important;
  left: 12px !important;
  right: auto !important;
}

.product-small.box .badge-inner.back-green,
.product-small.box .badge-inner.onsale {
  background-color: #EF4444 !important;
}

/* Card Body text wrapper */
.product-small.box .box-text {
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  background-color: var(--v3-white) !important;
  text-align: left !important;
}

/* Category styling */
.product-small.box .product-cat-wrapper {
  font-size: 11px;
  font-weight: 700;
  color: var(--v3-gold) !important;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 8px;
  line-height: 1;
}

.product-small.box .product-cat-wrapper a {
  color: var(--v3-gold) !important;
}

/* Title wrapper */
.product-small.box .title-wrapper {
  margin-bottom: 12px !important;
}

.product-small.box .title-wrapper p.name {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--v3-dark) !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  height: 42px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.product-small.box .title-wrapper p.name a {
  color: var(--v3-dark) !important;
}

.product-small.box .title-wrapper p.name a:hover {
  color: var(--v3-primary) !important;
}

/* Price & Add to Cart wrapper */
.product-small.box .product-price-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-top: auto !important;
  padding-top: 12px !important;
  border-top: 1px dashed var(--v3-border) !important;
}

.product-small.box .price-wrapper {
  padding: 0 !important;
  margin: 0 !important;
}

/* FORCE RED COLOR ON ALL PRICES */
.product-small.box .price-wrapper .price,
.product-small.box .price-wrapper .price *,
.product-small.box .price,
.product-small.box .price * {
  font-size: 17px !important;
  font-weight: 800 !important;
  color: #EF4444 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}

.product-small.box .price-wrapper .price del,
.product-small.box .price-wrapper .price del *,
.product-small.box .price del,
.product-small.box .price del * {
  font-size: 12px !important;
  color: var(--v3-muted) !important;
  text-decoration: line-through !important;
  font-weight: 500 !important;
  margin-right: 6px !important;
}

.product-small.box .price-wrapper .price ins,
.product-small.box .price-wrapper .price ins *,
.product-small.box .price ins,
.product-small.box .price ins * {
  background: transparent !important;
  text-decoration: none !important;
  color: #EF4444 !important;
  font-weight: 800 !important;
}

/* Add to Cart icon button styling */
.product-small.box .add-to-cart-wrapper .add_to_cart_button,
.product-small.box .add-to-cart-wrapper .product_type_variable {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: var(--v3-bg) !important;
  color: var(--v3-primary) !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.3s !important;
  font-size: 0 !important; /* Hide text */
  padding: 0 !important;
  margin: 0 !important;
  position: relative !important;
  text-transform: none !important;
  box-shadow: none !important;
}

.product-small.box .add-to-cart-wrapper .add_to_cart_button::before,
.product-small.box .add-to-cart-wrapper .product_type_variable::before {
  content: '🛒';
  font-size: 15px;
  display: block;
}

.product-small.box:hover .add-to-cart-wrapper .add_to_cart_button,
.product-small.box:hover .add-to-cart-wrapper .product_type_variable {
  background: var(--v3-primary) !important;
  color: var(--v3-white) !important;
}

.product-small.box .add-to-cart-wrapper .add_to_cart_button:hover,
.product-small.box .add-to-cart-wrapper .product_type_variable:hover {
  transform: scale(1.1) !important;
}

/* Hide standard ajax success indicators */
.product-small.box .add-to-cart-wrapper .added_to_cart {
  display: none !important;
}

/* ============================================
   PAGINATION
   ============================================ */
.shop-container ul.page-numbers {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  margin-top: 48px !important;
  border: none !important;
  padding: 0 !important;
  list-style: none !important;
}

.shop-container ul.page-numbers li {
  border: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.shop-container ul.page-numbers li a,
.shop-container ul.page-numbers li span.current {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  color: var(--v3-text) !important;
  border: 1px solid var(--v3-border) !important;
  background: var(--v3-white) !important;
  transition: all 0.3s !important;
  padding: 0 !important;
  line-height: 1 !important;
}

.shop-container ul.page-numbers li a:hover,
.shop-container ul.page-numbers li span.current {
  background: var(--v3-primary) !important;
  color: var(--v3-white) !important;
  border-color: var(--v3-primary) !important;
  box-shadow: 0 4px 12px rgba(51, 56, 160, 0.2) !important;
}

/* Next / Prev arrow */
.shop-container ul.page-numbers li a.next,
.shop-container ul.page-numbers li a.prev {
  font-size: 18px !important;
}