/*
 * Ferrari Firearms - Product Detail Page CSS
 * For WordPress/WooCommerce Implementation
 * Version: 1.0
 * Last Updated: January 2026
 */

/* ============================================
   PRODUCT PAGE - MAIN CONTAINER
   ============================================ */

/* ============================================
   PRODUCT PAGE - MAIN CONTAINER
   ============================================ */

.product-page {
  background-color: #11161d; /* Target Navy Background */
  min-height: 100vh;
  padding: 40px 0 80px;
}

.product-container {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ============================================
   BREADCRUMB NAVIGATION
   ============================================ */

.product-breadcrumb {
  margin-bottom: 32px;
  padding: 16px 0;
  border-bottom: 1px solid #1f2937;
  overflow-x: auto; /* Allow scroll if screen is too narrow */
}

.product-breadcrumb-list {
  display: flex;
  align-items: center;
  flex-wrap: nowrap; /* Force one line */
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
  white-space: nowrap; /* Prevent breaking */
}

.product-breadcrumb-item {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #c4c4c4; /* Light Gray */
}

.product-breadcrumb-link {
  color: #c4c4c4; /* Light Gray - Fixed purple issue */
  text-decoration: none;
  transition: color 0.3s ease;
}

.product-breadcrumb-link:hover {
  color: #D32F2F;
}

.product-breadcrumb-separator {
  color: #424242;
  margin: 0 4px;
}

/* ============================================
   PRODUCT MAIN SECTION
   ============================================ */

/* WooCommerce gallery image shrink-to-fit fix */
.woocommerce-product-gallery__image img {
  object-fit: contain !important;
  width: 100% !important;
  height: auto !important;
  max-height: 600px; /* Prevent it from getting too tall on large screens */
}

.product-main {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  margin-bottom: 80px;
}

/* Center Column Box Effect (Right side) */
.product-info {
  background-color: transparent; 
  position: relative;
}

.product-info-inner-box {
    background-color: #1A2332 !important; /* User Requested BG */
    border: 2px solid #2A3C4D !important; /* User Requested Border */
    padding: 32px;
}

/* ============================================
   PRODUCT PRICING
   ============================================ */

.product-price-container {
  margin-bottom: 32px;
  padding: 0;
  background-color: transparent;
  border: none;
}

/* ... existing pricing styles ... */

/* ============================================
   PRODUCT FEATURES / HIGHLIGHTS
   ============================================ */

.product-features {
  margin-bottom: 32px;
  padding: 24px;
  background-color: #1A2332 !important; /* Match Box Style */
  border: 2px solid #2A3C4D !important; /* Match Box Style */
  border-radius: 0;
}

.product-current-price {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
  color: #D4A574; /* Gold Price */
  margin: 0;
}

.product-original-price {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 32px;
  color: #6B7280;
  text-decoration: line-through;
  margin: 0;
}

.product-discount-badge {
    background-color: #c41e3a; /* Ferrari Red */
    font-size: 13px;
    padding: 4px 10px;
}

/* ============================================
   ADD TO CART BUTTON
   ============================================ */

.product-btn-primary {
  background-color: #D32F2F; /* Specific Red */
  color: #FFFFFF;
  border: none;
  width: 100%; /* Full Width */
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.product-btn-secondary {
    width: 100%;
    margin-top: 12px;
    background-color: #2d3748;
    border: 1px solid #4a5568;
    color: #FFF;
}

.product-variations {
  margin-bottom: 32px;
}

.product-variation-group {
  margin-bottom: 24px;
}

.product-variation-label {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-transform: uppercase;
  color: #E0E0E0;
  margin-bottom: 12px;
  display: block;
}

.product-variation-options {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.product-variation-option {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  color: #E0E0E0;
  background-color: #1A1A1A;
  border: 2px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
  padding: 12px 20px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.product-variation-option:hover {
  border-color: #D32F2F;
  color: #FFFFFF;
}

.product-variation-option.active {
  background-color: #D32F2F;
  border-color: #D32F2F;
  color: #FFFFFF;
}

.product-variation-option.disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

/* Dropdown Variation */
.product-variation-select {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #FFFFFF;
  background-color: #1A1A1A;
  border: 2px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
  padding: 12px 16px;
  width: 100%;
  cursor: pointer;
  transition: border-color 0.3s ease;
}

.product-variation-select:hover {
  border-color: #D32F2F;
}

.product-variation-select:focus {
  border-color: #D32F2F;
  outline: none;
}

/* ============================================
   QUANTITY SELECTOR
   ============================================ */

.product-quantity-wrapper {
  margin-bottom: 32px;
}

.product-quantity-label {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-transform: uppercase;
  color: #E0E0E0;
  margin-bottom: 12px;
  display: block;
}

.product-quantity-selector {
  display: inline-flex;
  align-items: center;
  border: 2px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
  background-color: #1A1A1A;
}

.product-quantity-btn {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 18px;
  font-weight: 600;
  color: #FFFFFF;
  background-color: transparent;
  border: none;
  width: 44px;
  height: 44px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-quantity-btn:hover {
  background-color: #D32F2F;
  color: #FFFFFF;
}

.product-quantity-btn:disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.product-quantity-input {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: #FFFFFF;
  background-color: transparent;
  border: none;
  border-left: 1px solid #2A2A2A;
  border-right: 1px solid #2A2A2A;
  width: 60px;
  height: 44px;
  text-align: center;
  padding: 0;
}

.product-quantity-input:focus {
  outline: none;
}

/* ============================================
   ADD TO CART SECTION
   ============================================ */

.product-actions {
  margin-bottom: 32px;
  display: flex;
  gap: 12px;
}

.product-btn {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  border: none;
  border-radius: 0; /* Sharp corners */
  padding: 16px 32px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  text-decoration: none;
  flex: 1;
}

.product-btn-primary {
  background-color: #D32F2F;
  color: #FFFFFF;
  border: 2px solid #D32F2F;
}

.product-btn-primary:hover {
  background-color: #B71C1C;
  border-color: #B71C1C;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(211, 47, 47, 0.4);
}

.product-btn-secondary {
  background-color: transparent;
  color: #D32F2F;
  border: 2px solid #D32F2F;
  flex: 0 0 auto;
}

.product-btn-secondary:hover {
  background-color: #D32F2F;
  color: #FFFFFF;
}

.product-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.product-btn:disabled:hover {
  transform: none;
  box-shadow: none;
}

/* ============================================
   WISHLIST & COMPARE
   ============================================ */

.product-secondary-actions {
  display: flex;
  gap: 16px;
  margin-bottom: 32px;
  padding-bottom: 32px;
  border-bottom: 1px solid #2A2A2A;
}

.product-action-link {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-transform: uppercase;
  color: #9E9E9E;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color 0.3s ease;
}

.product-action-link:hover {
  color: #D32F2F;
}

.product-action-link.active {
  color: #D32F2F;
}

/* ============================================
   PRODUCT FEATURES / HIGHLIGHTS
   ============================================ */

.product-features {
  margin-bottom: 32px;
  padding: 24px;
  background-color: #121212;
  border: 1px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
}

.product-features-title {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 18px;
  font-weight: 700;
  line-height: 24px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin: 0 0 16px 0;
}

.product-features-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.product-features-item {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #E0E0E0;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.product-features-item:last-child {
  margin-bottom: 0;
}

.product-features-item::before {
  content: '✓';
  color: #4CAF50;
  font-weight: 700;
  flex-shrink: 0;
}

/* ============================================
   PRODUCT SOCIAL SHARE
   ============================================ */

.product-share {
  display: flex;
  align-items: center;
  gap: 12px;
}

.product-share-label {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-transform: uppercase;
  color: #9E9E9E;
}

.product-share-buttons {
  display: flex;
  gap: 8px;
}

.product-share-btn {
  width: 36px;
  height: 36px;
  background-color: #1A1A1A;
  border: 1px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
  display: flex;
  align-items: center;
  justify-content: center;
  color: #9E9E9E;
  cursor: pointer;
  transition: all 0.3s ease;
  text-decoration: none;
}

.product-share-btn:hover {
  background-color: #D32F2F;
  border-color: #D32F2F;
  color: #FFFFFF;
}

/* ============================================
   PRODUCT TABS SECTION
   ============================================ */

.product-tabs-section {
  margin-bottom: 80px;
}

.product-tabs-nav {
  display: flex;
  gap: 0;
  border-bottom: 2px solid #2A2A2A;
  margin-bottom: 40px;
  overflow-x: auto;
  scrollbar-width: thin;
}

.product-tab-btn {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  text-transform: uppercase;
  color: #9E9E9E;
  background-color: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  padding: 16px 32px;
  cursor: pointer;
  transition: all 0.3s ease;
  white-space: nowrap;
}

.product-tab-btn:hover {
  color: #D32F2F;
}

.product-tab-btn.active {
  color: #D32F2F;
  border-bottom-color: #D32F2F;
}

/* Fix for incomplete rectangle (focus states) */
.product-tab-btn:focus,
.product-tab-btn:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.product-tabs-content {
  background-color: #1A1A1A;
  border: 1px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
  padding: 40px;
}

.product-tab-panel {
  display: none;
}

.product-tab-panel.active {
  display: block;
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ============================================
   TAB: DESCRIPTION
   ============================================ */

.product-description h2,
.product-description h3,
.product-description h4 {
  font-family: 'Chakra Petch', sans-serif;
  color: #FFFFFF;
  margin: 0 0 16px 0;
}

.product-description h2 {
  font-size: 24px;
  font-weight: 700;
  line-height: 32px;
  text-transform: uppercase;
  color: #D32F2F;
}

.product-description h3 {
  font-size: 20px;
  font-weight: 600;
  line-height: 28px;
}

.product-description h4 {
  font-size: 18px;
  font-weight: 600;
  line-height: 26px;
}

.product-description p {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #E0E0E0;
  margin: 0 0 16px 0;
}

.product-description ul,
.product-description ol {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #E0E0E0;
  margin: 0 0 16px 0;
  padding-left: 24px;
}

.product-description li {
  margin-bottom: 8px;
}

/* ============================================
   TAB: SPECIFICATIONS
   ============================================ */

.product-specifications-table {
  width: 100%;
  border-collapse: collapse;
}

.product-specifications-table tr {
  border-bottom: 1px solid #2A2A2A;
}

.product-specifications-table tr:last-child {
  border-bottom: none;
}

.product-specifications-table th,
.product-specifications-table td {
  font-family: 'Chakra Petch', sans-serif;
  padding: 16px;
  text-align: left;
}

.product-specifications-table th {
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  text-transform: uppercase;
  color: #BDBDBD;
  width: 40%;
}

.product-specifications-table td {
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #E0E0E0;
}

/* ============================================
   TAB: REVIEWS
   ============================================ */

.product-reviews {
  max-width: 100%;
}

.product-reviews-summary {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 40px;
  margin-bottom: 40px;
  padding-bottom: 40px;
  border-bottom: 1px solid #2A2A2A;
}

.product-reviews-score {
  text-align: center;
}

.product-reviews-average {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 56px;
  font-weight: 700;
  line-height: 64px;
  color: #D32F2F;
  margin: 0 0 12px 0;
}

.product-reviews-stars-large {
  display: flex;
  justify-content: center;
  gap: 4px;
  margin-bottom: 8px;
}

.product-reviews-stars-large .product-star {
  font-size: 24px;
}

.product-reviews-total {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #9E9E9E;
}

.product-reviews-breakdown {
  flex: 1;
}

.product-reviews-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.product-reviews-bar-label {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #E0E0E0;
  min-width: 60px;
}

.product-reviews-bar-track {
  flex: 1;
  height: 8px;
  background-color: #2A2A2A;
  border-radius: 0; /* Sharp corners */
  overflow: hidden;
}

.product-reviews-bar-fill {
  height: 100%;
  background-color: #D32F2F;
  transition: width 0.5s ease;
}

.product-reviews-bar-count {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 20px;
  color: #9E9E9E;
  min-width: 40px;
  text-align: right;
}

/* Individual Reviews */
.product-reviews-list {
  margin-bottom: 40px;
}

.product-review-item {
  padding: 32px 0;
  border-bottom: 1px solid #2A2A2A;
}

.product-review-item:first-child {
  padding-top: 0;
}

.product-review-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.product-review-author {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* ============================================
   STAR RATING COLORS
   ============================================ */
.star-rating,
.stars,
.product-star,
.comment-form-rating .stars a,
.star-rating span:before,
.quantity .plus, 
.quantity .minus {
    color: #D4A574 !important; /* Gold Stars */
}

.comment-form-rating .stars a:hover,
.comment-form-rating .stars a.active {
    color: #D32F2F !important; /* Red on hover */
}

/* Ensure color applies to the link itself */
.comment-form-rating .stars a {
    color: #D4A574 !important;
}


.product-review-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background-color: #D32F2F;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Chakra Petch', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #FFFFFF;
}

.product-review-author-info {
  display: flex;
  flex-direction: column;
}

.product-review-name {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: #FFFFFF;
}

.product-review-date {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: #9E9E9E;
}

.product-review-rating {
  display: flex;
  gap: 4px;
}

.product-review-content {
  margin-bottom: 16px;
}

.product-review-title {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  color: #FFFFFF;
  margin: 0 0 8px 0;
}

.product-review-text {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: #E0E0E0;
  margin: 0;
}

.product-review-helpful {
  display: flex;
  align-items: center;
  gap: 16px;
}

.product-review-helpful-label {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: #9E9E9E;
}

.product-review-helpful-btn {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 18px;
  text-transform: uppercase;
  color: #9E9E9E;
  background-color: transparent;
  border: 1px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
  padding: 6px 12px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.product-review-helpful-btn:hover {
  color: #D32F2F;
  border-color: #D32F2F;
}

/* Write Review Button */
.product-write-review-btn {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #FFFFFF;
  background-color: #D32F2F;
  border: 2px solid #D32F2F;
  border-radius: 0; /* Sharp corners */
  padding: 16px 32px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.product-write-review-btn:hover {
  background-color: #B71C1C;
  border-color: #B71C1C;
}

/* ============================================
   RELATED PRODUCTS SECTION
   ============================================ */

.product-related-section {
  max-width: 1200px;
  margin: 0 auto 80px auto;
  padding: 0 1rem;
}

.woocommerce-tabs {
    max-width: 1200px;
    margin: 4rem auto;
    padding: 0 1rem;
}

.product-related-header {
  text-align: center;
  margin-bottom: 40px;
}

.product-related-title {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
  text-transform: uppercase;
  color: #D32F2F;
  margin: 0 0 12px 0;
}

.product-related-subtitle {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  color: #757575;
  margin: 0;
}

/* FORCE RESET TO RELATED PRODUCTS CONTAINER */
.related.products,
.product-related-section {
  display: block !important;
  width: 100% !important;
  clear: both !important;
  margin-top: 60px;
  box-sizing: border-box !important;
}

/* Hide Default Woo Title (We added manual one) */
.related.products > h2 {
    display: none !important;
}

/* Manual Title Styling (redundant if inline, but good practice) */
.product-related-title {
    width: 100%;
    display: block;
    text-align: center;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 32px;
    font-weight: 700;
    color: #D32F2F;
    margin-bottom: 24px;
    text-transform: uppercase;
}

/* Revert to Standard Display but ensure spacing */
/* INCREASE SPECIFICITY TO OVERRIDE WOOCOMMERCE FLEX */
/* FINAL CORRECTED LAYOUT - GRID WITH SCALED SPECIFICITY */

/* DESKTOP: 4 Column Grid */
/* Use correct selectors from custom theme structure: .product-related-section is the wrapper */
.product-related-section ul.products,
.related.products ul.products,
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  justify-content: start !important;
  box-sizing: border-box !important;
  list-style: none !important;
}

/* Reset Items */
.related.products ul.products li.product,
.product-related-section .products li.product,
.woocommerce ul.products li.product {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 10px !important;
    display: block !important;
    float: none !important;
    box-sizing: border-box !important;
    flex: unset !important; /* Kill any residual flex */
}

/* Remove floating behavior pseudo-elements on ITEMS */
.woocommerce ul.products li.product::before,
.woocommerce ul.products li.product::after {
    display: none !important;
}

/* Remove pseudo-elements on CONTAINER */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.related.products ul.products::before,
.related.products ul.products::after {
    display: none !important;
}


/* Use bestseller card styles for related products */

/* ============================================
   TRUST BADGES / GUARANTEES
   ============================================ */

.product-trust-badges {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 80px;
  padding: 40px;
  background-color: #1A1A1A;
  border: 1px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
}

.product-trust-badge {
  text-align: center;
  padding: 20px;
}

.product-trust-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #D32F2F;
  font-size: 32px;
}

.product-trust-title {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin: 0 0 8px 0;
}

.product-trust-description {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: #9E9E9E;
  margin: 0;
}

/* ============================================
   RESPONSIVE DESIGN - TABLET
   ============================================ */

@media (max-width: 1024px) {
  .product-main {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .product-gallery {
    position: static;
  }

  .product-thumbnails {
    grid-template-columns: repeat(6, 1fr);
  }

  .product-title {
    font-size: 32px;
    line-height: 40px;
  }

  .product-current-price {
    font-size: 28px;
    line-height: 36px;
  }

  /* Tablet Override: Switch to GRID 2 Columns */
  .product-related-section ul.products,
  .related.products ul.products {
      display: grid !important;
      grid-template-columns: repeat(2, 1fr) !important;
      justify-content: start !important;
      gap: 16px !important;
  }
  
  /* Reset Items for Grid Context */
  .related.products ul.products li.product,
  .product-related-section .products li.product {
      width: 100% !important;
      max-width: 100% !important;
      flex: unset !important; 
      margin: 0 !important;
  }

  .product-trust-badges {
    grid-template-columns: repeat(2, 1fr);
  }

  .product-reviews-summary {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* ============================================
   RESPONSIVE DESIGN - MOBILE
   ============================================ */

@media (max-width: 768px) {
  .product-page {
    padding: 24px 0 60px;
  }

  .product-container {
    padding: 0 16px;
  }

  .product-breadcrumb {
    margin-bottom: 24px;
    padding: 12px 0;
    overflow-x: auto;
  }

  .product-main {
    gap: 32px;
  }

  .product-title {
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 12px;
  }

  .product-rating {
    margin-bottom: 16px;
    padding-bottom: 16px;
  }

  .product-meta {
    margin-bottom: 16px;
    padding-bottom: 16px;
  }

  .product-price-container {
    padding: 20px;
    margin-bottom: 24px;
  }

  .product-current-price {
    font-size: 24px;
    line-height: 32px;
  }

  .product-original-price {
    font-size: 18px;
    line-height: 26px;
  }

  .product-short-description {
    margin-bottom: 24px;
  }

  .product-variations {
    margin-bottom: 24px;
  }

  .product-quantity-wrapper {
    margin-bottom: 24px;
  }

  .product-actions {
    flex-direction: column;
    margin-bottom: 24px;
  }

  .product-btn {
    width: 100%;
    padding: 14px 24px;
  }

  .product-secondary-actions {
    margin-bottom: 24px;
    padding-bottom: 24px;
  }

  .product-features {
    padding: 20px;
    margin-bottom: 24px;
  }

  .product-tabs-nav {
    margin-bottom: 24px;
  }

  .product-tab-btn {
    font-size: 14px;
    padding: 12px 20px;
  }

  .product-tabs-content {
    padding: 24px;
  }

  .product-related-section {
    margin-bottom: 60px;
  }

  .product-related-header {
    margin-bottom: 32px;
  }

  .product-related-title {
    font-size: 24px;
    line-height: 32px;
  }

  /* Mobile Override: Switch to GRID 1 Column */
  .product-related-section ul.products,
  .related.products ul.products {
      display: grid !important;
      grid-template-columns: 1fr !important;
      gap: 16px !important;
  }

  .related.products ul.products li.product,
  .product-related-section .products li.product {
      width: 100% !important;
      max-width: 100% !important;
      flex: unset !important;
      margin-bottom: 24px !important;
  }

  .product-trust-badges {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px;
    margin-bottom: 60px;
  }

  .product-thumbnails {
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
  }

  .product-reviews-bar {
    gap: 8px;
  }

  .product-reviews-bar-label {
    min-width: 50px;
    font-size: 12px;
  }

  .product-reviews-bar-count {
    min-width: 30px;
    font-size: 12px;
  }

  .product-review-item {
    padding: 16px;
  }
}

/* Remove floating behavior pseudo-elements on ITEMS */
.woocommerce ul.products li.product::before,
.woocommerce ul.products li.product::after {
    display: none !important;
}

/* Remove pseudo-elements on CONTAINER (Crucial for Grid) */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.related.products ul.products::before,
.related.products ul.products::after {
    display: none !important;
}


/* Use bestseller card styles for related products */

/* ============================================
   TRUST BADGES / GUARANTEES
   ============================================ */

.product-trust-badges {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 80px;
  padding: 40px;
  background-color: #1A1A1A;
  border: 1px solid #2A2A2A;
  border-radius: 0; /* Sharp corners */
}

.product-trust-badge {
  text-align: center;
  padding: 20px;
}

.product-trust-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #D32F2F;
  font-size: 32px;
}

.product-trust-title {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
  color: #FFFFFF;
  margin: 0 0 8px 0;
}

.product-trust-description {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 12px;
  font-weight: 400;
  line-height: 18px;
  color: #9E9E9E;
  margin: 0;
}

/* ============================================
   RESPONSIVE DESIGN - TABLET
   ============================================ */

@media (max-width: 1024px) {
  .product-main {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .product-gallery {
    position: static;
  }

  .product-thumbnails {
    grid-template-columns: repeat(6, 1fr);
  }

  .product-title {
    font-size: 32px;
    line-height: 40px;
  }

  .product-current-price {
    font-size: 28px;
    line-height: 36px;
  }

  /* Tablet override if needed */
  /* Tablet override: 2 Columns */
  /* Tablet Override: Switch to GRID 2 Columns */
  .related.products ul.products,
  .product-related-section .products {
      display: grid !important;
      grid-template-columns: repeat(2, 1fr) !important;
      justify-content: start !important;
      gap: 16px !important;
  }
  
  /* Reset Items for Grid Context */
  .related.products ul.products li.product,
  .product-related-section .products li.product {
      width: 100% !important;
      max-width: 100% !important;
      flex: unset !important; /* Disable Flex desktop rules */
      margin: 0 !important;
  }

  .product-trust-badges {
    grid-template-columns: repeat(2, 1fr);
  }

  .product-reviews-summary {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* ============================================
   RESPONSIVE DESIGN - MOBILE
   ============================================ */

@media (max-width: 768px) {
  .product-page {
    padding: 24px 0 60px;
  }

  .product-container {
    padding: 0 16px;
  }

  .product-breadcrumb {
    margin-bottom: 24px;
    padding: 12px 0;
    overflow-x: auto;
  }

  .product-main {
    gap: 32px;
  }

  .product-title {
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 12px;
  }

  .product-rating {
    margin-bottom: 16px;
    padding-bottom: 16px;
  }

  .product-meta {
    margin-bottom: 16px;
    padding-bottom: 16px;
  }

  .product-price-container {
    padding: 20px;
    margin-bottom: 24px;
  }

  .product-current-price {
    font-size: 24px;
    line-height: 32px;
  }

  .product-original-price {
    font-size: 18px;
    line-height: 26px;
  }

  .product-short-description {
    margin-bottom: 24px;
  }

  .product-variations {
    margin-bottom: 24px;
  }

  .product-quantity-wrapper {
    margin-bottom: 24px;
  }

  .product-actions {
    flex-direction: column;
    margin-bottom: 24px;
  }

  .product-btn {
    width: 100%;
    padding: 14px 24px;
  }

  .product-secondary-actions {
    margin-bottom: 24px;
    padding-bottom: 24px;
  }

  .product-features {
    padding: 20px;
    margin-bottom: 24px;
  }

  .product-tabs-nav {
    margin-bottom: 24px;
  }

  .product-tab-btn {
    font-size: 14px;
    padding: 12px 20px;
  }

  .product-tabs-content {
    padding: 24px;
  }

  .product-related-section {
    margin-bottom: 60px;
  }

  .product-related-header {
    margin-bottom: 32px;
  }

  .product-related-title {
    font-size: 24px;
    line-height: 32px;
  }

  /* Mobile override: 1 Column */
  /* Mobile Override: Switch to GRID 1 Column */
  .related.products ul.products,
  .product-related-section .products {
      display: grid !important;
      grid-template-columns: 1fr !important;
      gap: 16px !important;
  }

  .related.products ul.products li.product,
  .product-related-section .products li.product {
      width: 100% !important;
      max-width: 100% !important;
      flex: unset !important;
      margin-bottom: 24px !important;
  }

  .product-trust-badges {
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 24px;
    margin-bottom: 60px;
  }

  .product-thumbnails {
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
  }

  .product-reviews-bar {
    gap: 8px;
  }

  .product-reviews-bar-label {
    min-width: 50px;
    font-size: 12px;
  }

  .product-reviews-bar-count {
    min-width: 30px;
    font-size: 12px;
  }

  .product-review-item {
    padding: 24px 0;
  }

  .product-review-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
}

/* ============================================
   RESPONSIVE DESIGN - SMALL MOBILE
   ============================================ */

@media (max-width: 480px) {
  .product-title {
    font-size: 20px;
    line-height: 28px;
  }

  .product-current-price {
    font-size: 20px;
    line-height: 28px;
  }

  /* Force 1 column on Small Mobile */
  .related.products ul.products li.product,
  .product-related-section .products li.product {
      width: 100% !important;
      float: none !important;
      margin-right: 0 !important;
      margin-left: 0 !important;
  }

  .product-thumbnails {
    grid-template-columns: repeat(3, 1fr);
  }

  .product-variation-options {
    gap: 8px;
  }

  .product-variation-option {
    font-size: 13px;
    padding: 10px 16px;
  }
}

/* ============================================
   WOOCOMMERCE INTEGRATION
   ============================================ */

/* WooCommerce Product Page */
.woocommerce div.product {
  background-color: transparent;
}

.woocommerce div.product .product_title {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 36px;
  font-weight: 700;
  line-height: 44px;
  color: #FFFFFF;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 32px;
  font-weight: 700;
  color: #D32F2F;
}

/* Add to Cart Button Styling to match .product-btn-primary */
.woocommerce div.product form.cart .button {
  font-family: 'Chakra Petch', sans-serif;
  background-color: #D32F2F;
  color: #FFFFFF;
  border: 2px solid #D32F2F;
  border-radius: 0;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 16px 32px;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  cursor: pointer;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: auto; /* Override Woo defaults */
}

.woocommerce div.product form.cart .button:hover {
  background-color: #B71C1C;
  border-color: #B71C1C;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(211, 47, 47, 0.4);
  color: #FFFFFF;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
  border-bottom: 2px solid #2A2A2A;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  border-radius: 0;
  background-color: transparent;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: 'Chakra Petch', sans-serif;
  color: #9E9E9E;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: #D32F2F;
}

/* WooCommerce Reviews */
.woocommerce #reviews #comments ol.commentlist li {
  border-bottom: 1px solid #2A2A2A;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
  border-radius: 0;
  background-color: transparent;
}

.woocommerce .star-rating {
  color: #FFC107;
}

/* ============================================
   ACCESSIBILITY
   ============================================ */

.product-btn:focus,
.product-tab-btn:focus,
.product-quantity-btn:focus,
.product-variation-option:focus,
.product-variation-select:focus {
  outline: 2px solid #D32F2F;
  outline-offset: 2px;
}

.product-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

/* ============================================
   STICKY ADD TO CART (Mobile)
   ============================================ */

@media (max-width: 768px) {
  .product-sticky-cart {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #121212;
    border-top: 2px solid #D32F2F;
    padding: 16px;
    z-index: 1000;
    display: none;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.5);
  }

  .product-sticky-cart.visible {
    display: flex;
    gap: 12px;
    align-items: center;
  }

  .product-sticky-price {
    font-family: 'Chakra Petch', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #D32F2F;
    flex-shrink: 0;
  }

  .product-sticky-cart .product-btn {
    flex: 1;
    padding: 12px 24px;
  }
}

/* ============================================
   PRINT STYLES
   ============================================ */

@media print {
  .product-page {
    background-color: white;
  }

  .product-actions,
  .product-secondary-actions,
  .product-share,
  .product-tabs-nav,
  .product-related-section {
    display: none;
  }

  .product-title,
  .product-current-price {
    color: #000;
  }

  .product-main {
    grid-template-columns: 1fr 1fr;
  }
}

/* ============================================
   END OF STYLESHEET
   ============================================ */

/* ============================================
   TABS STYLING (TARGET MATCH)
   ============================================ */

.woocommerce-tabs ul.tabs {
    padding: 0 0 0 0 !important;
    margin: 0 0 0 0 !important;
    border-bottom: 2px solid #2d3748 !important;
    background-color: transparent !important;
    display: flex;
    gap: 2px;
}

.woocommerce-tabs ul.tabs li {
    background-color: #1a202c !important; /* Inactive Tab Bg */
    border: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.woocommerce-tabs ul.tabs li a {
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    color: #a0aec0 !important; /* Inactive Text */
    padding: 16px 32px !important;
    display: block;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.woocommerce-tabs ul.tabs li.active {
    background-color: #0f131a !important; /* Active Tab Darker Bg */
    border-top: 2px solid #D32F2F !important; /* Top Red Line */
    border-bottom: 1px solid #0f131a !important; /* Blend with content */
}

.woocommerce-tabs ul.tabs li.active a {
    color: #FFF !important;
}

.woocommerce-Tabs-panel {
    background-color: #0f131a !important; /* Dark Box Bg */
    padding: 40px !important;
    border: 1px solid #2d3748 !important;
    border-top: none !important;
}

.woocommerce-Tabs-panel h2 {
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 24px !important;
    color: #FFF !important;
    margin-bottom: 24px !important;
    text-transform: uppercase;
}

.woocommerce-Tabs-panel p, 
.woocommerce-Tabs-panel li {
    font-family: 'Inter', sans-serif !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #cbd5e0 !important;
}

/* Add to Cart Area - specific alignment */
form.cart {
    margin-bottom: 24px;
}

.quantity {
    display: inline-block;
    vertical-align: top;
    margin-right: 16px;
}

.quantity input {
    background-color: #1a202c !important;
    border: 1px solid #4a5568 !important;
    color: #FFF !important;
    height: 48px;
    width: 60px;
    text-align: center;
    font-weight: 600;
}

/* Trust Badges in Sidebar (below cart) */
.product-trust-badges-sidebar {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.trust-badge-item {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    color: #a0aec0;
}

.trust-badge-item svg {
    width: 20px;
    height: 20px;
    color: #D32F2F; /* Icon Red */
}

/* ============================================
   PRODUCT GALLERY OVERRIDES (Added Request)
   ============================================ */

/* Main Image */
.product-main-image-container {
  position: relative;
  width: 100%;
  background-color: #FFFFFF; /* White Background as requested */
  border: 1px solid #2d3748;
  border-radius: 0;
  overflow: hidden;
  margin-bottom: 16px;
  aspect-ratio: 1 / 1;
}

.product-main-image {
  width: 100%;
  height: 100%;
  object-fit: contain; /* Ensure entire image is visible */
  padding: 20px; /* Reduced padding */
  transition: transform 0.3s ease;
  cursor: zoom-in;
}

/* Badges on Image - Re-declare for override context */
.product-badges {
  position: absolute;
  top: 20px;
  left: 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 10;
}

/* Thumbnail Gallery */
.product-thumbnails {
  display: grid !important; /* Use Grid for 4-col wrap */
  grid-template-columns: repeat(4, 1fr) !important; /* Max 4 per row */
  gap: 12px;
  padding-bottom: 0;
  overflow: visible !important;
}

.product-thumbnail {
  position: relative;
  width: 100% !important; /* Fill grid cell */
  aspect-ratio: 1 / 1;
  background-color: #FFFFFF; /* White Background */
  border: 1px solid #2d3748;
  border-radius: 0;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.3s ease;
}

.product-thumbnail:hover {
  border-color: #D32F2F;
}

.product-thumbnail.active {
  border-color: #D32F2F;
  box-shadow: 0 0 0 2px rgba(211, 47, 47, 0.2);
}

.product-thumbnail-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 8px;
}

/* ============================================
   PRODUCT DETAIL OVERRIDES (Added Request)
   ============================================ */

/* 1. Category/Brand: Gold Color */
.product-category-label.gold-text {
    color: #D4A574 !important;
    text-decoration: underline;
    font-size: 14px;
    font-weight: 500;
}

/* 2. Product Name */
.product-title {
    color: #FFF !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 30px !important;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 36px !important; /* 120% */
    margin-bottom: 8px !important;
}

/* 3. Review Row (Stars + Count in one line) */
.product-rating-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

.rating-stars-inline {
    display: flex;
    gap: 2px;
}

.rating-stars-inline .star {
    font-size: 14px;
    color: #FFF;
}

.product-rating-text {
    color: #FFF;
    font-size: 14px;
    margin-top: 2px;
}

/* 4. Price Block */
.product-detail-price-block {
    border-top: 1px solid #2A3C4D;
    border-bottom: 1px solid #2A3C4D;
    display: flex;
    /* width: 556px; -- Removed fixed width to be responsive */
    width: 100%; 
    padding: 17px 0 17px 0; /* Adjusted padding slightly for balance */
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 24px;
}

.product-price-line {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Price Value */
.product-detail-price-block .product-current-price, 
.product-detail-price-block .amount {
    color: #D4A574 !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 36px !important;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 40px !important; /* 111.111% */
}

/* Old Price */
.product-detail-price-block .product-original-price,
.product-detail-price-block del .amount {
    color: #6A7282 !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 20px !important;
    font-style: normal;
    font-weight: 400 !important;
    line-height: 28px !important; /* 140% */
    text-decoration-line: line-through !important;
}

/* Save Badge */
.product-save-badge {
    display: inline-flex;
    /* width: 101.445px; -- flexible width */
    height: 28px;
    padding: 3.5px 8px;
    justify-content: center;
    align-items: center;
    background-color: #c41e3a; /* Ferrari Red or User specific code if diff */
    color: #FFF;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    text-transform: uppercase;
}

/* 5. SKU Row (Below Price) */
.product-sku-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 24px;
}

.sku-label {
    color: #FFF;
    font-weight: 600;
}
.sku-value {
    color: #D4A574; /* Gold SKU value or white? Assuming Gold/White contrast */
    color: #FFF;
}

/* ============================================
   LATEST OVERRIDES (Availability, Qty, Buttons)
   ============================================ */

/* Availability - override default */
.product-stock-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    text-transform: uppercase;
}

.product-stock-status.in-stock {
    color: #05DF72;
}

.product-stock-status.in-stock::before {
    background-color: #05DF72;
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.product-stock-status.out-of-stock {
    color: #D32F2F; /* Ferrari Red */
}

/* Quantity Section */
.product-quantity-wrapper {
    margin-top: 24px;
    margin-bottom: 24px;
}

.product-quantity-label {
    color: #FFF;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

/* Quantity Input Block - Dark Box with white text */
.quantity {
    display: inline-flex !important;
    background-color: #1A2332; /* Or darker */
    border: none;
}

.quantity input.qty {
    background-color: #0F151E !important; /* Darker inner input */
    color: #FFF !important;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 20px;
    border: 1px solid #2A3C4D !important;
    height: 50px;
    width: 60px;
    text-align: center;
}

/* Add to Cart Button */
.product-actions-wrapper button.single_add_to_cart_button {
    background-color: #7B61FF !important; /* Purple as seen in screenshot or Red if requested? Request said 'Add to cart' but image showed purple button. Request text said 'Ferrari red or out of stock'. Wait, the REQUEST text for button says:
    display: flex; padding: 16px 0 ... 
    The screenshot shows a Purple button (Add to cart). 
    The previous prompt asked for Red. 
    The LATEST prompt text says "Add to cart button... color: #FFF... text-transform: uppercase". It didn't specify background color hex in text, but screenshot shows purple. 
    However, earlier "Ferrari Red" was a key theme. 
    Let's look at the screenshot: It shows PURPLE.
    I will use the Purple from the screenshot for now to match the visual provided: #8B5CF6 (approx) or use the specific purple if I can derive it. 
    Actually, the previous prompt had a button code block "Add to cart" with class . I'll style that.
    Wait, the screenshot shows PURPLE #7B61FF or similar. I'll use a nice purple to match.
    If the user previously said Red, but now sends a screenshot with Purple and asks to "fix it one by one... attached design", the Design (Screenshot) is the truth. 
    I will use Purple styling for the button.
    */
    background-color: #925AC2 !important; /* Matches 'Add to cart' purple in dark mode shot approx */
    color: #FFF !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    width: 100%;
    padding: 16px 0;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s;
}

.product-actions-wrapper button.single_add_to_cart_button:hover {
    opacity: 0.9;
}

/* Wishlist / Compare (Side by side below cart) */
.product-secondary-actions {
    display: flex;
    justify-content: flex-start; /* Or space-between? Screenshot implies left align or stretch */
    gap: 24px;
    border-bottom: none; /* Remove separator if present */
    margin-top: 16px;
}

.product-action-link {
    color: #FFF;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase; 
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.product-action-link svg {
    color: #FFF; /* White Icons */
}

/* Trust Blocks (3 lines) */
.product-trust-badges {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    margin-top: 32px;
    padding-top: 25px;
    border-top: 1px solid #2A3C4D;
}

.product-trust-badge {
    display: flex;
    align-items: center;
    gap: 12px;
}

.product-trust-icon {
    display: flex;
    color: #05DF72; /* Green Checkmarks per screenshot */
}

/* If icon is raw SVG, style it */
.product-trust-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
}

.product-trust-title {
    display: none; /* Hide title if we just want text */
}

.product-trust-description {
    color: #D1D5DC;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 14px;
    font-weight: 400;
}

/* Fix for Button selector typo in previous command if any */
.product-actions-wrapper button.single_add_to_cart_button {
    background-color: #925AC2 !important; 
    color: #FFF !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    width: 100%;
    padding: 16px 0;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s;
}

/* ============================================
   LATEST OVERRIDES 2 (Prices)
   ============================================ */

/* Old Price Update: Gray, Small, Strikethrough */
.product-detail-price-block .product-original-price,
.product-detail-price-block del .amount {
    color: #6A7282 !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 20px !important;
    font-style: normal;
    font-weight: 400 !important;
    line-height: 28px !important; /* 140% */
    text-decoration-line: line-through !important;
}

/* Save Badge Text Update */
/* Ensure the price inside matches the 'SAVE' text */
.product-save-badge {
    color: #FFF !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 14px !important;
    font-style: normal; 
    font-weight: 700 !important;
    line-height: 20px !important; 
    text-transform: uppercase !important;
}

/* Override WooCommerce amount span inside the badge if it exists */
.product-save-badge .amount {
    color: #FFF !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

/* ============================================
   LATEST OVERRIDES 3 (Cleanup & Cart Icon)
   ============================================ */

/* 1. Add to Cart Button: Ferrari Red */
.product-actions-wrapper button.single_add_to_cart_button {
    background-color: #D32F2F !important; /* Ferrari Red requested */
    color: #FFF !important;
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    width: 100%;
    padding: 16px 0;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s;
    
    /* Flexbox for icon alignment */
    display: flex !important;
    justify-content: center;
    align-items: center;
    gap: 12px;
}

.product-actions-wrapper button.single_add_to_cart_button:hover {
    background-color: #B71C1C !important;
}

/* 2. Add Cart Icon via pseudo-element */
.product-actions-wrapper button.single_add_to_cart_button::before {
    content: '';
    display: block;
    width: 24px;
    height: 24px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path></svg>');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Hide Short Description Text if still present via PHP output */
.product-short-description {
    display: none !important;
}

/* Hide Features List if still present (php removed it but just in case) */
.product-features, .product-features-title, .product-features-list {
    display: none !important;
}

/* ============================================
   LATEST OVERRIDES 4 (Image Fix)
   ============================================ */
/* 
   Make Image Fill Placeholder:
   - Remove fixed aspect ratio which causes whitespace if image is diff shape
   - Ideally use object-fit: contain (which adds bars if ratio mismatch) or cover (crops).
   User said "fill the placeholder". Usually means remove the empty space.
   I will set height to auto and remove the 1/1 ratio constraint, letting it adapt to the image height.
   Or if they want it square but FILLED, use object-fit: cover.
   "Fill the placeholder" typically implies no letterboxing.
   However, tactical gear usually needs to be seen fully ('contain').
   The user *also* said: "or move this two small images to the white space below the image".
   This implies the white space is undesired.
   
   Strategy:
   1. Remove aspect-ratio on container so it collapses to fit the image height.
   2. Ensure image is centered.
*/

.product-main-image-container {
    aspect-ratio: auto !important; /* Let image define height */
    height: auto !important;
    display: flex;
    justify-content: center;
    background-color: transparent !important; /* Or keep white if requested earlier, but 'transparent' helps merge if PNG */
    border: none !important; /* Remove border if it exacerbates the 'box' look */
}

.product-main-image {
    position: relative !important;
    width: 100%;
    height: auto !important;
    max-height: 500px; /* Cap height reasonable */
    object-fit: contain !important;
    padding: 0 !important; /* Remove padding */
}

/* Thumbnails - ensure they are close */
.product-thumbnails {
    margin-top: 12px;
}

/* ============================================
   LATEST OVERRIDES 5 (Breadcrumbs, Price, Image BG)
   ============================================ */

/* 1. Breadcrumbs: FORCE Light Gray (Override default Woo purple) */
.product-breadcrumb-link,
.woocommerce-breadcrumb a {
    color: #c4c4c4 !important; /* Light Gray */
    text-decoration: none;
}
.product-breadcrumb-link:hover,
.woocommerce-breadcrumb a:hover {
    color: #D32F2F !important;
}
.woocommerce-breadcrumb {
    color: #c4c4c4 !important;
}

/* 2. Old Price: Gray, Small, Line-Through */
.product-detail-price-block .product-original-price,
.product-detail-price-block del .amount,
.product-detail-price-block del span.amount {
    color: #6A7282 !important; /* Specific Gray */
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 20px !important; /* Small */
    font-weight: 400 !important;
    text-decoration-line: line-through !important;
    opacity: 1 !important; /* Ensure visibility */
}

/* 3. Main Image Background: Restore White Background */
/* User asked "why without white background now?". 
   I removed it because I thought they wanted it transparent in the last turn to "fill placeholder". 
   Restoring White Background now. */
.product-main-image-container {
    background-color: #FFFFFF !important; /* White Background */
    border: 1px solid #2d3748 !important; /* Keep border if desired or remove if totally flat */
    padding: 20px !important; /* Add padding back so image doesn't touch edges if contained */
}

/* Ensure image fits within the white box nicely */
.product-main-image {
    object-fit: contain !important;
    max-height: 500px;
    width: 100%;
    height: auto;
}

/* ============================================
   FFL WARNING BOX
   ============================================ */
.ffl-warning-box {
    background-color: rgba(26, 35, 50, 0.5); /* Semi-transparent dark bg */
    border-left: 4px solid #c41e3a; /* Ferrari Red */
    padding: 1.5rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.ffl-warning-header {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.ffl-warning-icon {
    width: 24px;
    height: 24px;
    color: #FACC15; /* Warning Yellow */
    flex-shrink: 0;
}

.ffl-warning-title {
    color: #FFFFFF;
    font-family: 'Chakra Petch', sans-serif;
    font-size: 16px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0;
}

.ffl-warning-text {
    color: #9CA3AF; /* Gray-400 */
    font-family: 'Chakra Petch', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    margin: 0;
}


/* ============================================
   AVAILABILITY META STYLES
   ============================================ */
.product-meta-item {
  display: flex;
  align-items: center;
  flex-wrap: wrap; 
  gap: 8px;
  margin-bottom: 24px;
}

.product-meta-label {
  font-family: 'Chakra Petch', sans-serif;
  font-weight: 600;
  font-size: 16px; 
  color: #E0E0E0;
  line-height: 1.2;
}

.product-stock-status {
  font-family: 'Chakra Petch', sans-serif;
  font-size: 16px;
  line-height: 1.2;
  display: inline-flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}


/* ============================================
   SPECIFICATIONS TAB STYLING (Attributes as Cards)
   ============================================ */
.woocommerce table.shop_attributes {
    border: none !important;
    margin: 0 !important;
    width: 100% !important;
    display: block !important; /* Forces block for grid capability */
    background: transparent !important;
}

.woocommerce table.shop_attributes tbody {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    width: 100%;
}

.woocommerce table.shop_attributes tr {
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: #1A2332 !important;
    border: 1px solid #2A3C4D !important;
    padding: 16px !important;
    border-radius: 0 !important;
    transition: all 0.3s ease;
}

.woocommerce table.shop_attributes tr:hover {
    border-color: #D4A574 !important; /* Gold Hover */
    transform: translateY(-2px);
}

.woocommerce table.shop_attributes th {
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    color: #99A1AF !important; /* Custom Gray Label */
    padding: 0 0 8px 0 !important;
    background: none !important;
    border: none !important;
    width: 100% !important;
    text-align: left !important;
    display: block !important;
}

.woocommerce table.shop_attributes td {
    font-family: 'Chakra Petch', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #FFFFFF !important; /* White Value */
    padding: 0 !important;
    background: none !important;
    border: none !important;
    font-style: normal !important;
    width: 100% !important;
    text-align: left !important;
    display: block !important;
}

.woocommerce table.shop_attributes td p {
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
}

/* Responsive */
@media (max-width: 900px) {
    .woocommerce table.shop_attributes tbody {
        grid-template-columns: repeat(2, 1fr); /* 2 columns on tablet */
    }
}

@media (max-width: 600px) {
    .woocommerce table.shop_attributes tbody {
        grid-template-columns: 1fr; /* 1 column on mobile */
    }
}

/* Reduce spacing between specs and related products on mobile */
@media (max-width: 767px) {
    .woocommerce-tabs {
        margin: 2rem auto 1.5rem auto !important; /* Reduce bottom margin of specs */
    }
    .related.products,
    .product-related-section {
        margin-top: 15px !important; /* Reduce top margin of related products */
    }
}

