/** Shopify CDN: Minification failed

Line 1493:40 Expected ":"
Line 1493:141 Expected ":"

**/
/*
  JDM Florida Custom Design Styles
  Designed to supplement Dawn with a premium, high-performance auto theme aesthetic.
*/

:root {
  --jdm-red: #F00;
  --Red: #F00;
  --jdm-dark: #111111;
  --jdm-light-dark: #1E1E1E;
  --jdm-light: #F5F5F5;
  --jdm-medium-gray: #AAAAAA;
  --jdm-yellow: #FFD15C;
  --font-heading-family: "Sprintura Demo", "Hunterra", "Impact", "Arial Black", sans-serif;
}

/* Global resets & typography */
body {
  font-family: var(--font-body-family);
  background-color: rgb(var(--color-background));
  color: rgb(var(--color-foreground));
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: 700 !important;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

.jdm-gradient-heading {
  font-family: "Sprintura Demo", var(--font-heading-family), sans-serif !important;
  font-size: 54px !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: normal !important;
  letter-spacing: -1.08px !important;
  background: linear-gradient(181deg, #1A1A1A 0.91%, rgba(135, 129, 129, 0.80) 167.29%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

/* Custom Header Styles (Figma & Screenshot Match) */
.header-wrapper,
.section-header,
sticky-header,
.shopify-section-header-sticky {
  background-color: #ffffff !important;
  z-index: 1000 !important;
  border-bottom: 1px solid #e5e5e5 !important;
}

.shopify-section-header-sticky {
  position: sticky !important;
  top: 0 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
}

/* Announcement Bar stacking fix for Mobile Drawer */
.announcement-bar-section,
.announcement-bar {
  z-index: 1 !important;
  position: relative !important;
}

.jdm-header-container {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.jdm-header-top-tier {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 0 10px 0;
  width: 100%;
}

.jdm-header-bottom-tier {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0 18px 0;
  gap: 24px;
  width: 100%;
}

.jdm-header-tagline {
  font-family: var(--font-heading-family, "Hunterra", "Impact", sans-serif);
  font-size: 3.2rem;
  font-weight: 900;
  font-style: italic;
  text-transform: uppercase;
  letter-spacing: -0.03em;
  line-height: 0.95;
  color: #111111;
  margin: 0;
  flex-shrink: 0;
}

.jdm-header-search-wrapper {
  display: block;
  width: 100%;
  max-width: 380px;
  position: relative;
}

.jdm-header-search-form {
  display: flex;
  align-items: center;
  width: 100%;
  position: relative;
}

.jdm-header-search-input {
  width: 100%;
  height: 44px;
  padding: 0 54px 0 16px;
  border: none;
  border-bottom: 1.5px solid #bcbcbc;
  background: transparent;
  font-size: 1.3rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #111111;
  outline: none;
}

.jdm-header-search-input::placeholder {
  color: #a0a0a0;
  font-weight: 700;
}

.jdm-header-search-submit {
  position: absolute;
  right: 0;
  top: 0;
  height: 44px;
  width: 44px;
  background-color: #1a1a1a;
  color: #ffffff;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s ease;
  z-index: 2;
}

.jdm-header-search-submit:hover {
  background-color: var(--jdm-red, #d82c2c);
}

.jdm-header-bottom-tier,
.jdm-header-search-wrapper,
.jdm-header-search-form {
  overflow: visible !important;
}

/* Auto-Suggestions Predictive Search Popup */
predictive-search:not([open]) .predictive-search--header {
  display: none !important;
}

predictive-search[open] .predictive-search--header {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.predictive-search--header {
  position: absolute !important;
  top: calc(100% + 4px) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  background-color: #ffffff !important;
  border: 1px solid #dcdcdc !important;
  border-top: none !important;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.25) !important;
  border-radius: 0 0 8px 8px !important;
  z-index: 99999 !important;
  max-height: 480px !important;
  overflow-y: auto !important;
}

.predictive-search__item {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 12px 16px !important;
  text-decoration: none !important;
  color: #111111 !important;
  border-bottom: 1px solid #f0f0f0 !important;
  transition: background-color 0.2s ease !important;
}

.predictive-search__item:hover,
.predictive-search__item[aria-selected="true"] {
  background-color: #f8f8f8 !important;
}

.predictive-search__item-heading {
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  color: #111111 !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

.predictive-search__item .price {
  color: var(--Red, #F00) !important;
  font-weight: 800 !important;
  font-size: 1.2rem !important;
}

.jdm-header-phone-btn {
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  padding: 10px 20px !important;
  border-radius: 4px !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none !important;
  transition: background-color 0.2s ease !important;
}

.jdm-header-phone-btn:hover {
  background-color: var(--jdm-red, #d82c2c) !important;
}

.jdm-header-nav-right {
  display: flex;
  align-items: center;
  gap: 20px;
}

.jdm-nav-separator {
  color: #cccccc;
  font-weight: 300;
  font-size: 1.6rem;
}

/* Hardcoded Top Nav Styles */
.jdm-top-nav-menu {
  display: flex;
  align-items: center;
}

.jdm-top-nav-list {
  display: flex;
  align-items: center;
  gap: 24px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.jdm-top-nav-item {
  position: relative;
}

.jdm-top-nav-link {
  color: #111111 !important;
  font-family: var(--font-body-family, sans-serif);
  font-weight: 700 !important;
  font-size: 1.3rem !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 0;
  transition: color 0.2s ease;
}

.jdm-top-nav-link:hover {
  color: var(--jdm-red, #F00) !important;
}

.jdm-dropdown-arrow {
  transition: transform 0.2s ease;
}

.jdm-top-nav-item:hover .jdm-dropdown-arrow {
  transform: rotate(180deg);
}

.jdm-top-dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 200px;
  background-color: #ffffff;
  border: 1px solid #e5e5e5;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  list-style: none;
  padding: 8px 0;
  margin: 0;
  border-radius: 4px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
  z-index: 100;
}

.jdm-top-nav-item:hover .jdm-top-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.jdm-top-dropdown li {
  margin: 0;
  padding: 0;
}

.jdm-top-dropdown a {
  display: block;
  padding: 10px 18px;
  color: #222222 !important;
  font-weight: 600 !important;
  font-size: 1.25rem !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-decoration: none !important;
  transition: color 0.2s ease, background-color 0.2s ease;
}

.jdm-top-dropdown a:hover {
  background-color: #f8f8f8 !important;
  color: var(--jdm-red, #F00) !important;
}

.header__menu-item {
  color: var(--jdm-dark) !important;
  font-family: var(--font-body-family);
  font-weight: 700 !important;
  font-size: 1.4rem !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  transition: color 0.2s ease;
}

.header__menu-item:hover {
  color: var(--jdm-red) !important;
  text-decoration: none;
}

.header__active-menu-item {
  color: var(--jdm-red) !important;
  text-decoration: none !important;
}

.header__icon {
  color: var(--jdm-dark) !important;
  transition: color 0.2s ease;
}

.header__icon:hover {
  color: var(--jdm-red) !important;
}

@media screen and (max-width: 989px) {
  .jdm-header-bottom-tier {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  .jdm-header-search-form {
    max-width: 100%;
  }
  .jdm-header-tagline {
    font-size: 2.4rem;
  }
}

/* Footer Custom Styling (Screenshot Match with Engine Backdrop) */
.jdm-footer-wrapper {
  position: relative !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-color: #0b0b0b !important;
  overflow: hidden !important;
  color: #a0a0a0 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.jdm-footer-overlay {
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(180deg, rgba(11, 11, 11, 0.92) 0%, rgba(5, 5, 5, 0.97) 100%) !important;
  z-index: 1 !important;
}

.footer__content-top,
.footer__content-bottom {
  position: relative !important;
  z-index: 2 !important;
}

.footer-block__heading {
  font-family: var(--font-heading-family, "Hunterra", "Impact", sans-serif) !important;
  font-size: 1.4rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: #ffffff !important;
  margin-bottom: 16px !important;
}

.footer-block__details-content .link--text {
  color: #aaaaaa !important;
  font-size: 1.25rem !important;
  transition: color 0.2s ease !important;
}

.footer-block__details-content .link--text:hover {
  color: var(--jdm-red, #d82c2c) !important;
}

.footer__copyright {
  font-size: 1.1rem !important;
  color: #777777 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding-top: 20px !important;
}

/* Global Premium Buttons styling */
.button, .shopify-challenge__button, .customer button {
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
  border: 1px solid var(--jdm-red) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
  box-shadow: none !important;
  border-radius: 0px !important;
}

.button:hover, .shopify-challenge__button:hover, .customer button:hover {
  background-color: var(--jdm-dark) !important;
  border-color: var(--jdm-dark) !important;
  color: #ffffff !important;
  transform: translateY(-2px) !important;
}

.button--secondary {
  background-color: transparent !important;
  color: rgb(var(--color-foreground)) !important;
  border: 2px solid var(--jdm-dark) !important;
}

.button--secondary:hover {
  background-color: var(--jdm-dark) !important;
  color: #ffffff !important;
  border-color: var(--jdm-dark) !important;
}

/* Custom Footer Styles (Deep Black swatches) */
.footer {
  background-color: var(--jdm-dark) !important;
  color: var(--jdm-medium-gray) !important;
  border-top: 1px solid #222 !important;
}

.footer h2, .footer .footer-block__heading {
  color: #ffffff !important;
  font-family: var(--font-heading-family) !important;
  font-size: 1.8rem !important;
  letter-spacing: 0.05em;
  margin-bottom: 20px;
  text-transform: uppercase;
}

.footer a, .footer-block__details-content a {
  color: var(--jdm-medium-gray) !important;
  text-decoration: none !important;
  transition: color 0.2s ease;
  font-size: 1.5rem !important;
}

.footer a:hover, .footer-block__details-content a:hover {
  color: var(--jdm-red) !important;
}

.footer-block__details-content .list-menu__item {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.footer__copyright {
  border-top: 1px solid #222 !important;
  padding-top: 2rem;
  margin-top: 4rem;
}

.footer__copyright content {
  color: var(--jdm-medium-gray) !important;
  font-size: 1.3rem !important;
}

/* Product Card Micro-Animations */
.card-wrapper {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 0px !important;
}

.card-wrapper:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.1);
}

.card__inner {
  border-radius: 0px !important;
  overflow: hidden;
}

.card__media img {
  transition: transform 0.5s ease !important;
}

.card-wrapper:hover .card__media img {
  transform: scale(1.08) !important;
}

/* Custom Hero Layout */
.jdm-hero {
  position: relative;
  background-size: cover;
  background-position: center;
  min-height: 480px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 0; /* Padding is handled by content spacing */
  color: #ffffff;
}

.jdm-hero::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.15); /* Very subtle overlay as Figma sky is clean */
  z-index: 1;
}

.jdm-hero-inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
}

.jdm-hero-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  align-items: center;
  padding-top: 80px;
  padding-bottom: 80px;
}

@media screen and (max-width: 749px) {
  .jdm-hero-grid {
    grid-template-columns: 1fr;
    gap: 40px;
    padding-top: 45px;
    padding-bottom: 45px;
    text-align: center;
  }
}

.jdm-hero-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 30px;
}

@media screen and (max-width: 749px) {
  .jdm-hero-content {
    align-items: center;
  }
}

.jdm-hero-title {
  font-family: 'Hunterra', 'Impact', 'Arial Black', sans-serif !important;
  font-size: 60px !important;
  font-style: normal;
  font-weight: 400;
  line-height: 1.05 !important;
  letter-spacing: -1.2px !important;
  text-transform: uppercase;
  margin: 0;
  
  /* Metallic gradient text as per user's css */
  background: linear-gradient(181deg, #4E4E4E 0.91%, rgba(135, 129, 129, 0.80) 167.29%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@media screen and (max-width: 749px) {
  .jdm-hero-title {
    font-size: 38px !important;
    letter-spacing: -0.8px !important;
  }
}

/* User's exact CSS for Hero Button */
.jdm-hero-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  font-family: 'Outfit', sans-serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: #ffffff !important;
  padding: 14px 28px;
  border-radius: 10px !important;
  background: #4E4E4E !important; /* Grey color: #4E4E4E */
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
}

.jdm-hero-btn:hover {
  background: var(--jdm-red) !important; /* Hover transitions to JDM Red */
  transform: translateY(-2px);
}

.jdm-hero-right {
  display: flex;
  justify-content: flex-end;
}

@media screen and (max-width: 749px) {
  .jdm-hero-right {
    justify-content: center;
  }
}

.jdm-florida-badge {
  text-align: right;
  display: inline-block;
}

@media screen and (max-width: 749px) {
  .jdm-florida-badge {
    text-align: center;
  }
}

.jdm-florida-badge-text {
  font-family: 'Outfit', sans-serif;
  font-size: 1.8rem;
  font-weight: 800;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--jdm-dark); /* In Figma screenshot, this text is dark black */
  margin: 0 0 10px 0;
  display: block;
}

.jdm-florida-badge-line {
  display: inline-block;
  width: 60px;
  height: 4px;
  background-color: var(--jdm-red);
}

/* Shop By Brand Bar */
.jdm-brand-bar {
  background-color: #111111;
  border-top: 1px solid #222;
  padding: 24px 0;
  position: relative;
  z-index: 3;
}

.jdm-brand-bar-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

@media screen and (max-width: 749px) {
  .jdm-brand-bar-inner {
    flex-direction: column;
    text-align: center;
  }
}

.jdm-brand-bar-title {
  font-family: 'Outfit', sans-serif;
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: #ffffff;
  margin: 0;
}

.jdm-brand-bar-logos {
  display: flex;
  align-items: center;
  gap: 40px;
}

@media screen and (max-width: 749px) {
  .jdm-brand-bar-logos {
    gap: 24px;
    justify-content: center;
    flex-wrap: wrap;
  }
}

.jdm-brand-logo-svg {
  color: rgba(255, 255, 255, 0.4);
  transition: color 0.3s ease;
}

.jdm-brand-logo-svg:hover {
  color: #ffffff;
}

/* Custom Contact callout bar styling */
.jdm-contact-bar {
  background-color: var(--jdm-red);
  color: #ffffff;
  padding: 20px 0;
  text-align: center;
}

.jdm-contact-bar a {
  color: #ffffff;
  text-decoration: none;
  font-weight: 800;
  font-size: clamp(1.4rem, 3vw, 2.2rem);
  letter-spacing: 0.05em;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: opacity 0.2s ease;
}

.jdm-contact-bar a:hover {
  opacity: 0.9;
}

/* Custom Promo Banner two-column style */
.jdm-promo-banner {
  display: grid;
  grid-template-columns: 1fr;
  background-color: var(--jdm-dark);
  color: #ffffff;
  overflow: hidden;
}

@media screen and (min-width: 750px) {
  .jdm-promo-banner {
    grid-template-columns: 1fr 1fr;
  }
}

.jdm-promo-content {
  padding: 60px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

@media screen and (min-width: 750px) {
  .jdm-promo-content {
    padding: 100px 80px;
  }
}

.jdm-promo-image {
  min-height: 350px;
  background-size: cover;
  background-position: center;
}

/* Custom About Us rows */
.jdm-about-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
  align-items: center;
  padding: 50px 0;
}

@media screen and (min-width: 750px) {
  .jdm-about-row {
    grid-template-columns: 1fr 1fr;
  }
  .jdm-about-row.image-right .jdm-about-image-col {
    order: 2;
  }
}

.jdm-about-image {
  width: 100%;
  height: 450px;
  object-fit: cover;
  border-left: 5px solid var(--jdm-red);
}

/* Custom Contact Page Grid */
.jdm-contact-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 60px;
  padding: 40px 0;
}

@media screen and (min-width: 750px) {
  .jdm-contact-grid {
    grid-template-columns: 1fr 1fr;
  }
}

.jdm-contact-info {
  background-color: var(--jdm-light);
  padding: 40px;
  border-left: 6px solid var(--jdm-red);
}

.jdm-contact-info h3 {
  margin-top: 0;
}

.jdm-contact-info p {
  line-height: 1.7;
}

.jdm-contact-map {
  margin-top: 30px;
  height: 300px;
  width: 100%;
  background-color: #e0e0e0;
  border: 1px solid #ddd;
}

/* Collection & Catalog Overrides */
.collection-hero__title {
  font-family: var(--font-heading-family);
  font-size: clamp(2.5rem, 5vw, 3.5rem) !important;
  color: #111;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.facets-container {
  padding-top: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px solid #ddd;
}

.facet-checkbox {
  padding: 0.8rem 1rem 0.8rem 0;
  font-size: 1.4rem;
  font-weight: 500;
}

.facet-checkbox input[type='checkbox'] {
  border-radius: 0px !important;
  border: 1px solid #aaa !important;
}

.facet-checkbox input[type='checkbox']:checked {
  background-color: var(--jdm-red) !important;
  border-color: var(--jdm-red) !important;
}

.facets__header {
  border-bottom: 2px solid var(--jdm-dark) !important;
  padding-bottom: 10px;
}

.facets__summary {
  font-family: var(--font-heading-family);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.active-facets__button-wrapper * {
  font-family: var(--font-heading-family);
  font-weight: 700;
  text-transform: uppercase;
}

/* ==========================================================================
   PRODUCT CARD GRID — EQUAL HEIGHT WITH BUTTON ALWAYS AT BOTTOM
   ========================================================================== */

/* The grid itself: every row same height — tallest card sets row height */
.product-grid.grid {
  align-items: stretch !important;
  grid-auto-rows: 1fr !important; /* Forces all rows to equal height */
}

/* Each grid cell stretches to fill the row */
.product-grid .grid__item {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important; /* Must fill the grid row */
}

/* Card wrapper fills the full grid cell */
.card-wrapper {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* The .card element fills card-wrapper */
.card-wrapper .card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background-color: transparent !important;
  border: none !important;
}

/* Image container — fixed 1:1 aspect ratio so all images same height */
.card-wrapper .card__inner {
  flex-shrink: 0 !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  background-color: #f0f0f0 !important;
  border: none !important;
  position: relative !important;
  aspect-ratio: 1 / 1 !important;  /* Forces square image area */
}

.card-wrapper .card__media,
.card-wrapper .card__media img {
  width: 100% !important;
  height: 100% !important;
  background-color: #f0f0f0 !important;
  border-radius: 12px !important;
}


/* card__content: flex column, grows to fill remaining height */
.card-wrapper .card > .card__content {
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  padding: 14px 0 4px 0 !important;
  background-color: transparent !important;
  overflow: visible !important;
}

/* Dawn's inner hidden card__content (accessibility duplicate inside card__inner) */
.card-wrapper .card .card__inner > .card__content {
  display: none !important;
}

/* card__information wrapper: also flex column, grows */
.card-wrapper .card > .card__content .card__information,
.card-wrapper .card > .card__content .card-information {
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
}

/* Star ratings row */
.card-wrapper .card > .card__content .product-rating-stars {
  flex-shrink: 0 !important;
  margin: 0 0 8px 0 !important;
}

/* Product title — grows to push price+button down */
.card-wrapper .card > .card__content .card__heading {
  flex-grow: 1 !important;
  margin: 0 0 10px 0 !important;
  font-family: var(--font-body-family) !important;
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  line-height: 1.4 !important;
}

.card-wrapper .card > .card__content .card__heading a {
  color: var(--jdm-dark) !important;
  text-decoration: none !important;
}
.card-wrapper .card > .card__content .card__heading a:hover {
  color: var(--jdm-red) !important;
}

/* Price area — give it a min-height so cards without sale price still align */
.card-wrapper .card > .card__content .price {
  flex-shrink: 0 !important;
  min-height: 34px !important;
  margin: 0 0 10px 0 !important;
  font-size: 1.8rem !important;
  font-weight: 800 !important;
  color: var(--jdm-red) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
}
.card-wrapper .card > .card__content .price * { color: var(--jdm-red) !important; }

/* Strikethrough compare price */
.card-wrapper .card > .card__content .price__sale .price-item--regular {
  font-size: 1.3rem !important;
  font-weight: 500 !important;
  color: #aaaaaa !important;
  text-decoration: line-through !important;
}

/* Quick-add form — always at very bottom */
.card-wrapper .card > .card__content .quick-add {
  flex-shrink: 0 !important;
  width: 100% !important;
  margin: 0 !important;
}

.card-wrapper .card > .card__content .quick-add__submit {
  background-color: var(--jdm-dark) !important;
  border: none !important;
  border-radius: 6px !important;
  color: #ffffff !important;
  font-family: var(--font-body-family) !important;
  font-weight: 700 !important;
  font-size: 1.3rem !important;
  padding: 11px 16px !important;
  width: 100% !important;
  min-height: auto !important;
  text-transform: capitalize !important;
  letter-spacing: normal !important;
  cursor: pointer !important;
  transition: background-color 0.3s ease !important;
}

.card-wrapper .card > .card__content .quick-add__submit:hover {
  background-color: var(--jdm-red) !important;
}

/* Sold Out button */
.card-wrapper .card > .card__content .quick-add__submit[disabled] {
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

/* Sale badge */
.card-wrapper .badge {
  font-family: var(--font-body-family) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
}

/* Remove the out-of-stock overlay (the ::after pseudo) */
.card-wrapper .card__inner::after { display: none !important; }

/* Hide the standard sold-out badge (we show it on the button) */
.card-wrapper .badge--bottom-left { display: none !important; }


/* ==========================================================================
   FACETS / FILTER BUTTONS STYLING
   ========================================================================== */

/* Active Facets (Charcoal Pills) */
.active-facets__button {
  background-color: #333333 !important;
  border: none !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  padding: 6px 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 8px 8px 0 !important;
  font-size: 1.2rem !important;
  font-weight: 700 !important;
  text-transform: capitalize !important;
}

.active-facets__button:hover {
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
}

.active-facets__button svg {
  width: 10px !important;
  height: 10px !important;
  fill: currentColor !important;
}

.active-facets__button-remove {
  color: #333333 !important;
  text-decoration: underline !important;
  font-size: 1.2rem !important;
}


/* ==========================================================================
   PAGINATION STYLING (Red Circle match)
   ========================================================================== */
.pagination__list {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 15px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 40px 0 0 0 !important;
}

.pagination__item {
  display: inline-block !important;
}

.pagination__item a,
.pagination__item span {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  font-family: var(--font-body-family) !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: #555555 !important;
  text-decoration: none !important;
  border: none !important;
  background: transparent !important;
  transition: color 0.3s ease !important;
}

.pagination__item a:hover {
  color: var(--jdm-red) !important;
}

/* Active current page (Red Circle) */
.pagination__item--current {
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
  border-radius: 50% !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.pagination__item--current span {
  color: #ffffff !important;
}

/* ==========================================================================
   FACET SIDEBAR CLEAN UP (Figma Mockup match)
   ========================================================================== */

/* Hide the Sort By form at top - it's a vertical sidebar layout issue */
.facets-vertical-sort { display: none !important; }

/* Sidebar wrapper - no border, clean padding */
.facets-vertical .facets-wrapper {
  border-right: 1px solid #f0f0f0 !important;
  padding-right: 24px !important;
  min-width: 180px !important;
}

/* ---- Vertical form container ---- */
.facets__form-vertical {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

/* ---- "Filter Options" sidebar title ---- */
.facets__heading--vertical,
.facets-vertical #verticalTitle {
  display: none !important; /* Hidden — we show jdm-sidebar-title instead */
}

/* Hide the active-facets area above filters */
.active-facets { display: none !important; }

/* ---- Each filter group <details> ---- */
.facets__disclosure-vertical {
  border-bottom: 1px solid #eeeeee !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ---- Group Summary (clickable heading) ---- */
.facets__disclosure-vertical > summary.facets__summary {
  font-family: var(--font-body-family) !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  color: #111111 !important;
  text-transform: capitalize !important;
  letter-spacing: normal !important;
  list-style: none !important;
  cursor: pointer !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 14px 0 !important;
  margin: 0 !important;
  user-select: none !important;
  transition: color 0.2s ease !important;
}

.facets__disclosure-vertical > summary.facets__summary:hover {
  color: var(--jdm-red) !important;
}

.facets__disclosure-vertical > summary.facets__summary::-webkit-details-marker { display: none !important; }

/* +/- toggle indicator on right of summary */
.facets__disclosure-vertical > summary.facets__summary::after {
  content: '+' !important;
  font-size: 1.8rem !important;
  font-weight: 400 !important;
  color: #aaaaaa !important;
  line-height: 1 !important;
  transition: color 0.2s ease !important;
  flex-shrink: 0 !important;
}

.facets__disclosure-vertical[open] > summary.facets__summary::after {
  content: '−' !important;
  color: var(--jdm-red) !important;
}

/* Hide caret SVG — we use ::after for toggle */
.facets__summary .icon-caret,
.facets__summary .svg-wrapper { display: none !important; }

/* Count badge */
.facets__selected { color: #aaaaaa !important; font-weight: 400 !important; font-size: 1.2rem !important; }

/* Content area inside open <details> */
.facets__display-vertical {
  padding: 0 0 14px 0 !important;
}

/* ---- Filter Items List ---- */
.facets__list--vertical {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

/* ---- Each checkbox row ---- */
.facets__label.facet-checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  cursor: pointer !important;
  font-family: var(--font-body-family) !important;
  font-size: 1.4rem !important;
  font-weight: 400 !important;
  color: #444444 !important;
  line-height: 1.4 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.facets__label.facet-checkbox:hover { color: var(--jdm-red) !important; }

.facets__label.facet-checkbox.active {
  color: #111111 !important;
  font-weight: 700 !important;
}

/* Native checkbox */
.facets__label.facet-checkbox input[type="checkbox"] {
  position: relative !important;
  width: 15px !important;
  height: 15px !important;
  flex-shrink: 0 !important;
  opacity: 1 !important;
  margin: 0 !important;
  accent-color: var(--jdm-red) !important;
  cursor: pointer !important;
}

/* Hide Dawn's custom SVG checkbox icons */
.facets__label.facet-checkbox .svg-wrapper,
.facets__label.facet-checkbox > svg { display: none !important; }
label.facet-checkbox .svg-wrapper { display: none !important; }
label.facet-checkbox > svg { display: none !important; }
.facets__item label .svg-wrapper { display: none !important; }

/* Filter item count text */
.facet-checkbox__text-label { font-family: var(--font-body-family) !important; font-size: 1.4rem !important; color: inherit !important; }

/* Disabled */
.facets__label.facet-checkbox.disabled { opacity: 0.4 !important; cursor: not-allowed !important; }

/* Show more button */
.button-show-more {
  font-family: var(--font-body-family) !important;
  font-size: 1.3rem !important;
  font-weight: 600 !important;
  color: var(--jdm-red) !important;
  text-decoration: underline !important;
  margin-top: 10px !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  cursor: pointer !important;
  display: inline-block !important;
}

/* ---- Price Range section heading (shown inside <details>) ---- */
.facets__header-vertical { display: none !important; }

/* The price-range custom element */
price-range.facets__price {
  display: block !important;
  padding: 0 !important;
}


/* ==========================================================================
   JDM GRID HEADER & ACTIVE FACETS PILLS
   ========================================================================== */
.jdm-grid-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 25px;
  border-bottom: 2px solid #f0f0f0;
  padding-bottom: 15px;
  flex-wrap: wrap;
  gap: 15px;
}

.jdm-grid-title {
  font-family: var(--font-body-family) !important;
  font-size: 2.4rem !important;
  font-weight: 700 !important;
  color: #111111 !important;
  margin: 0 !important;
  text-transform: capitalize !important;
  letter-spacing: normal !important;
}

.jdm-active-facets {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}

.jdm-active-facet-pill {
  background-color: #333333 !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  padding: 8px 14px !important;
  font-family: var(--font-body-family) !important;
  font-size: 1.3rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: background-color 0.2s ease;
  text-transform: capitalize;
}

.jdm-active-facet-pill:hover {
  background-color: var(--jdm-red) !important;
}

.jdm-active-facet-pill svg {
  width: 8px !important;
  height: 8px !important;
  display: block;
}

/* Double Range Price Slider Thumbs Styles (Figma Match) */
.price-slider-input {
  pointer-events: none;
  outline: none;
}

/* Webkit (Chrome, Safari, Edge) Thumbs */
.price-slider-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: var(--jdm-red) !important;
  border: 2px solid var(--jdm-red) !important;
  cursor: pointer !important;
  pointer-events: auto !important; /* Enable interaction with knobs */
  position: relative !important;
  z-index: 5 !important;
  transition: transform 0.1s ease !important;
}

.price-slider-input::-webkit-slider-thumb:hover {
  transform: scale(1.2) !important;
}

/* Firefox Thumbs */
.price-slider-input::-moz-range-thumb {
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: var(--jdm-red) !important;
  border: 2px solid var(--jdm-red) !important;
  cursor: pointer !important;
  pointer-events: auto !important; /* Enable interaction with knobs */
  position: relative !important;
  z-index: 5 !important;
  transition: transform 0.1s ease !important;
}

.price-slider-input::-moz-range-thumb:hover {
  transform: scale(1.2) !important;
}

/* ==========================================================================
   CRITICAL: HIDE DUPLICATE SVG CHECKBOXES (Dawn renders native + 2 SVGs)
   ========================================================================== */

/* Dawn renders: [native input] [square.svg wrapper] [checkmark.svg wrapper]
   We only want the native checkbox, so hide all SVG wrappers inside labels */
label.facet-checkbox .svg-wrapper { display: none !important; }
label.facet-checkbox > svg { display: none !important; }

/* Also hide from list items */
.facets__item label .svg-wrapper { display: none !important; }
.facets__item label > svg { display: none !important; }

/* The visually-hidden text span inside facet-checkbox */
.facet-checkbox__text .visually-hidden { display: none !important; }


/* ==========================================================================
   SORT BY section in vertical sidebar — clean look
   ========================================================================== */
/* Dawn renders Sort By as a radio group inside the vertical facet sidebar.
   Style it cleanly like a filter group */
.facets__form-vertical .facets__sort {\n  display: none !important; /* Hide the Sort By section from sidebar - it's shown in grid header */\n}\n\n/* If sort is inside FacetsWrapperDesktop for vertical, clean it */
#FacetsWrapperDesktop .facets__sort {
  display: none !important;
}


/* ==========================================================================
   COLLECTION HERO BANNER — taller, better spacing
   ========================================================================== */
.collection-hero-custom {
  min-height: 400px !important;
  padding: 70px 0 !important;
}

.collection-hero-title-custom {
  font-size: clamp(3.5rem, 6vw, 6rem) !important;
  margin-bottom: 14px !important;
}

.collection-hero-breadcrumbs-custom {
  font-size: 1.4rem !important;
  letter-spacing: 0.08em !important;
}


/* ==========================================================================
   CARD — ensure quick-add button is ALWAYS fully visible at bottom
   ========================================================================== */

/* The quick-add form that Dawn wraps around the submit button */
.card-wrapper .card > .card__content quick-add-bulk,
.card-wrapper .card > .card__content .quick-add {
  margin-top: auto !important; /* Push to bottom when in flex column */
  flex-shrink: 0 !important;
  width: 100% !important;
}

/* Prevent card content from overflowing and hiding the button */
.card-wrapper .card > .card__content {
  overflow: visible !important;
  padding-bottom: 4px !important;
}

/* Make the card item in the grid stretch to fill column height */
.product-grid.grid > .grid__item {
  height: auto !important;
}

/* Sale badge */
.card-wrapper .badge {
  font-family: var(--font-body-family) !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
}

/* ==========================================================================
   SIDEBAR + PRODUCT GRID — TOP ALIGNMENT
   ========================================================================== */

/* The vertical layout container from Dawn */
@media screen and (min-width: 990px) {
  .facets-vertical {
    display: grid !important;
    grid-template-columns: 230px 1fr !important;
    gap: 0 40px !important;
    align-items: start !important; /* Both start at same top */
  }
}

@media screen and (max-width: 989px) {
  .facets-vertical {
    display: flex !important;
    flex-direction: column !important;
    gap: 24px !important;
    width: 100% !important;
  }

  .facets-wrapper.jdm-sidebar,
  .facets-wrapper,
  .facets-container {
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    margin-bottom: 10px !important;
  }

  .product-grid-container {
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Sidebar aside */
.facets-wrapper.jdm-sidebar {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Product grid container */
.product-grid-container {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Remove any padding Dawn applies to the top of sidebar */
.facets-vertical .facets-wrapper {
  padding-top: 0 !important;
}

/* Hide the Dawn facets container top (the "Filter by:" heading + clear all link above filter groups) */
.facets-container .active-facets-vertical-filter {
  display: none !important;
}

/* The facets form vertical container inside Dawn */
.facets__form-vertical {
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* ==========================================================================
   PRICE SLIDER — Red track between two knobs
   ========================================================================== */

/* The grey track background */
.price-slider-container {
  background: #e0e0e0 !important;
  border-radius: 4px !important;
}

/* The red fill between the knobs (set via inline style from Liquid) */
.price-slider-track {
  background: var(--jdm-red) !important;
  border-radius: 4px !important;
  height: 100% !important;
}

/* Webkit thumb */
.price-slider-input::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: var(--jdm-red) !important;
  border: 2px solid #ffffff !important;
  box-shadow: 0 0 0 1px var(--jdm-red) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  z-index: 5 !important;
  position: relative !important;
}

/* Firefox thumb */
.price-slider-input::-moz-range-thumb {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: var(--jdm-red) !important;
  border: 2px solid #ffffff !important;
  box-shadow: 0 0 0 1px var(--jdm-red) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
}

/* Hide Firefox default range track */
.price-slider-input::-moz-range-track { background: transparent; }
.price-slider-input::-webkit-slider-runnable-track { background: transparent; }

/* Price label text */
.price-slider-text {
  font-family: var(--font-body-family) !important;
  font-size: 1.35rem !important;
  font-weight: 600 !important;
  color: #555555 !important;
}



/* ==========================================================================
   PRODUCT DETAIL PAGE CUSTOM STYLING OVERRIDES (Mockup Match)
   ========================================================================== */

/* Main layout wrapper alignment */
.product__info-wrapper {
  padding-top: 0 !important;
}

/* Category Breadcrumb/Vendor Prefix */
.product__text.caption-with-letter-spacing {
  font-family: var(--font-body-family) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: #999999 !important;
  margin-bottom: 8px !important;
}

/* Product title */
.product__title h1,
.product__title h2 {
  font-family: var(--font-body-family) !important;
  font-size: clamp(2.2rem, 3.5vw, 3rem) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  color: var(--jdm-dark) !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  margin: 0 0 14px 0 !important;
}

/* Gold star rating wrapper styling */
.product__info-container .rating {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-bottom: 15px !important;
}

.product__info-container .rating-star {
  --color-icon: #FFC107 !important; /* Gold */
}

/* Custom Price styling */
.product__info-container .price {
  font-size: 2.8rem !important;
  font-weight: 800 !important;
  color: var(--jdm-red) !important;
  margin-bottom: 15px !important;
}

.product__info-container .price * {
  color: var(--jdm-red) !important;
  font-size: 2.8rem !important;
  font-weight: 800 !important;
}

/* Sale active styling */
.product__info-container .price--on-sale .price-item--sale,
.product__info-container .price__sale .price-item--sale {
  color: var(--jdm-red) !important;
  font-size: 2.8rem !important;
  font-weight: 800 !important;
}

/* Strikethrough regular price ONLY when on sale */
.product__info-container .price--on-sale .price-item--regular,
.product__info-container .price__sale .price-item--regular {
  color: #aaaaaa !important;
  font-size: 1.8rem !important;
  font-weight: 600 !important;
  text-decoration: line-through !important;
}

/* If not on sale, ensure price-item--regular is not struck through and is red/large */
.product__info-container .price:not(.price--on-sale) .price-item--regular {
  color: var(--jdm-red) !important;
  font-size: 2.8rem !important;
  font-weight: 800 !important;
  text-decoration: none !important;
}

/* Quantity Selector Override - horizontal layout matching mockup */
.product-form__quantity {
  margin-bottom: 24px !important;
  display: flex !important;
  align-items: center !important;
  gap: 15px !important;
}

.product-form__quantity .quantity__label {
  font-family: var(--font-body-family) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: var(--jdm-dark) !important;
  text-transform: capitalize !important;
  margin: 0 !important;
}

.quantity {
  border: 1.5px solid #cccccc !important;
  border-radius: 4px !important;
  min-height: 38px !important;
  height: 38px !important;
  width: 110px !important;
  background: #ffffff !important;
  display: flex !important;
  overflow: hidden !important;
}

.quantity__button {
  width: 32px !important;
  height: 100% !important;
  color: #555555 !important;
  background: transparent !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
}

.quantity__button:hover {
  background-color: #f5f5f5 !important;
  color: var(--jdm-red) !important;
}

.quantity__input {
  font-family: var(--font-body-family) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: #111111 !important;
  border-left: 1px solid #cccccc !important;
  border-right: 1px solid #cccccc !important;
  height: 100% !important;
  padding: 0 !important;
}

/* Product Buttons Layout (Add to Cart + Buy Now side-by-side or stacked mockup style) */
.product-form__buttons {
  display: flex !important;
  gap: 12px !important;
  max-width: 100% !important;
  margin-bottom: 24px !important;
}

.product-form__buttons .product-form__submit {
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  font-family: var(--font-body-family) !important;
  font-weight: 700 !important;
  font-size: 1.4rem !important;
  text-transform: capitalize !important;
  letter-spacing: normal !important;
  min-height: 48px !important;
  flex: 1 !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  transition: background-color 0.2s ease !important;
}

.product-form__buttons .product-form__submit::after,
.product-form__buttons .product-form__submit::before {
  display: none !important;
}

.product-form__buttons .product-form__submit:hover {
  background-color: var(--jdm-dark) !important;
}

/* Dynamic buy now buttons wrapper */
.shopify-payment-button {
  margin-top: 0 !important;
  flex: 1 !important;
}

.shopify-payment-button__button--unbranded {
  background-color: var(--jdm-dark) !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  font-family: var(--font-body-family) !important;
  font-weight: 700 !important;
  font-size: 1.4rem !important;
  text-transform: capitalize !important;
  letter-spacing: normal !important;
  min-height: 48px !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  transition: background-color 0.2s ease !important;
}

.shopify-payment-button__button--unbranded::after,
.shopify-payment-button__button--unbranded::before {
  display: none !important;
}

.shopify-payment-button__button--unbranded:hover {
  background-color: var(--jdm-red) !important;
}

/* Share & Warranty Layout */
.jdm-product-meta-row {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid #eeeeee;
  margin-top: 24px;
}

.jdm-meta-item {
  display: flex;
  align-items: center;
  gap: 15px;
  font-family: var(--font-body-family);
  font-size: 1.4rem;
  color: #555555;
}

.jdm-meta-item strong {
  color: var(--jdm-dark);
  width: 90px;
}

.jdm-share-icons {
  display: flex;
  gap: 10px;
}

.jdm-share-link {
  color: #555555;
  transition: color 0.2s ease;
}

.jdm-share-link:hover {
  color: var(--jdm-red);
}

.jdm-warranty-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  color: var(--jdm-red);
  font-size: 1.3rem;
  text-transform: uppercase;
}


/* ==========================================================================
   TABS LAYOUT (MOCKUP ACCORDION ALTERNATIVE)
   ========================================================================== */
.jdm-product-tabs-container {
  margin-top: 50px;
  border-top: 1px solid #e0e0e0;
}

.jdm-tabs-header {
  display: flex;
  gap: 30px;
  border-bottom: 1px solid #e0e0e0;
  padding-top: 0;
  padding-bottom: 0;
}

.jdm-tab-btn {
  background: none;
  border: none;
  font-family: var(--font-body-family);
  font-size: 1.6rem;
  font-weight: 700;
  color: #999999;
  padding: 18px 0;
  cursor: pointer;
  position: relative;
  text-transform: capitalize;
  transition: color 0.2s ease;
}

.jdm-tab-btn:hover {
  color: var(--jdm-dark);
}

.jdm-tab-btn.active {
  color: var(--jdm-dark);
}

.jdm-tab-btn.active::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 3px;
  background-color: var(--jdm-red);
}

.jdm-tabs-content {
  padding-top: 30px;
  padding-bottom: 50px;
}

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

.jdm-tab-panel.active {
  display: block;
}

/* Tabs content grid columns (Left main 70%, Right sidebar 30%) */
.jdm-tab-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 40px;
}

@media screen and (min-width: 990px) {
  .jdm-tab-grid {
    grid-template-columns: 7fr 3fr;
  }
}

.jdm-tab-main {
  display: flex;
  flex-direction: column;
  gap: 35px;
}

/* Specs Table */
.jdm-specs-section {
  display: block;
}

.jdm-section-heading {
  font-family: var(--font-body-family);
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--jdm-dark);
  text-transform: capitalize;
  margin: 0 0 18px 0;
  letter-spacing: normal;
  border-bottom: 2px solid #111111;
  padding-bottom: 8px;
}

.jdm-specs-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
}

.jdm-specs-table th {
  background-color: #f7f7f7;
  color: var(--jdm-dark);
  font-family: var(--font-body-family);
  font-weight: 700;
  font-size: 1.4rem;
  text-align: left;
  padding: 12px 16px;
  border-bottom: 2px solid #dddddd;
}

.jdm-specs-table td {
  padding: 12px 16px;
  border-bottom: 1px solid #eeeeee;
  font-family: var(--font-body-family);
  font-size: 1.4rem;
  color: #444444;
}

.jdm-specs-table tr:hover td {
  background-color: #fafafa;
}

/* Extra info paragraph lists */
.jdm-extra-info-section p {
  font-family: var(--font-body-family);
  font-size: 1.45rem;
  line-height: 1.6;
  color: #555555;
  margin: 0 0 14px 0;
}

.jdm-extra-info-section ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.jdm-extra-info-section ul li {
  position: relative;
  padding-left: 20px;
  font-family: var(--font-body-family);
  font-size: 1.45rem;
  color: #555555;
  line-height: 1.5;
}

.jdm-extra-info-section ul li::before {
  content: '•';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--jdm-red);
  font-size: 1.8rem;
  line-height: 1;
}

/* Sidebar Related Products list style */
.jdm-tab-sidebar {
  border-left: none;
  padding-left: 0;
}

@media screen and (min-width: 990px) {
  .jdm-tab-sidebar {
    border-left: 1px solid #eeeeee;
    padding-left: 30px;
  }
}

.jdm-sidebar-heading {
  font-family: var(--font-body-family);
  font-size: 1.8rem;
  font-weight: 700;
  color: var(--jdm-dark);
  margin: 0 0 20px 0;
  padding-bottom: 8px;
  border-bottom: 2px solid #111111;
  text-transform: capitalize;
}

.jdm-related-grid {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 15px !important;
}

.jdm-related-grid-card {
  display: flex !important;
  flex-direction: column !important;
  background: #ffffff !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.jdm-related-grid-image {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1.1 / 1 !important;
  background-color: #f0f0f0 !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}

.jdm-related-grid-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.jdm-grid-sale-badge {
  position: absolute !important;
  bottom: 8px !important;
  left: 8px !important;
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
  font-family: var(--font-body-family) !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  padding: 3px 6px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  z-index: 2 !important;
}

.jdm-related-grid-stars {
  display: flex !important;
  gap: 2px !important;
  margin-top: 10px !important;
  margin-bottom: 4px !important;
}

.jdm-star-gold {
  color: #FFC107 !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
}

.jdm-related-grid-title {
  font-family: var(--font-body-family) !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--jdm-dark) !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  line-height: 1.35 !important;
  margin-bottom: 6px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.jdm-related-grid-title:hover {
  color: var(--jdm-red) !important;
}

.jdm-related-grid-price {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.jdm-related-grid-price .current {
  font-family: var(--font-body-family) !important;
  font-size: 1.45rem !important;
  font-weight: 800 !important;
  color: var(--jdm-red) !important;
}

.jdm-related-grid-price .compare {
  font-family: var(--font-body-family) !important;
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  color: #aaaaaa !important;
  text-decoration: line-through !important;
}

/* FAQ elements styles */
.jdm-faq-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.jdm-faq-item h4 {
  font-family: var(--font-body-family);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--jdm-dark);
  margin: 0 0 8px 0;
}

.jdm-faq-item p {
  font-family: var(--font-body-family);
  font-size: 1.4rem;
  color: #666666;
  line-height: 1.5;
  margin: 0;
}

/* ==========================================================================
   PRODUCT IMAGE GALLERY SLIDER (Mockup Match)
   ========================================================================== */

/* Main image area card */
.product__media-container {
  display: flex !important;
  flex-direction: column !important;
}

/* Active main image container */
.product__media-item {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid #eeeeee !important;
  background-color: #f7f7f7 !important;
}

.product__media-item img {
  border-radius: 12px !important;
  object-fit: contain !important;
}

/* Hide standard slider counter/buttons on desktop since we want clean gallery */
@media screen and (min-width: 750px) {
  .product__media-container slider-component .slider-buttons {
    display: none !important;
  }
}

/* Thumbnail slider horizontal alignment */
.thumbnail-slider {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-top: 15px !important;
  position: relative !important;
}

/* Hide navigation arrow buttons inside thumbnails to keep it clean */
.thumbnail-slider .slider-button {
  display: none !important;
}

.thumbnail-list {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.thumbnail-list__item {
  width: 80px !important;
  max-width: 80px !important;
  flex-shrink: 0 !important;
}

.thumbnail {
  border-radius: 8px !important;
  border: 1.5px solid #e0e0e0 !important;
  overflow: hidden !important;
  background-color: #f7f7f7 !important;
  padding: 0 !important;
  width: 100% !important;
  height: 80px !important;
  display: block !important;
  cursor: pointer !important;
  transition: border-color 0.2s ease !important;
  opacity: 0.75 !important;
}

.thumbnail img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  border-radius: 6px !important;
}

/* Active thumbnail selection highlight */
.thumbnail[aria-current="true"] {
  border-color: var(--jdm-red) !important;
  opacity: 1 !important;
  box-shadow: 0 0 0 1px var(--jdm-red) !important;
}

.thumbnail:hover {
  opacity: 1 !important;
  border-color: var(--jdm-red) !important;
}


/* ==========================================================================
   PRODUCT INFO DETAILS BLOCK CLEAN UP
   ========================================================================== */

/* Space between details and sidebar columns in the tabs */
.jdm-tab-grid {
  margin-top: 20px !important;
}

/* Make page description and Specs look clean & premium */
.jdm-product-description {
  font-family: var(--font-body-family) !important;
  font-size: 1.45rem !important;
  line-height: 1.6 !important;
  color: #444444 !important;
}

/* Product header category */
.product__info-container .product__text {
  margin-bottom: 5px !important;
}

/* Adjust title layout spacing */
.product__info-container .product__title {
  margin-bottom: 8px !important;
}


/* ==========================================================================
   CART PAGE CUSTOM STYLE OVERRIDES (Mockup Match)
   ========================================================================== */

/* Cart page wrapper padding */
.main-cart-items {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

/* Page Heading Title: "YOUR CART" */
.cart__title {
  font-family: var(--font-heading-family) !important;
  font-size: clamp(3rem, 5vw, 4.5rem) !important;
  font-weight: 700 !important;
  color: var(--jdm-dark) !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
  margin: 0 !important;
  line-height: 1.1 !important;
}

/* Continue shopping link wrapper */
.title-wrapper-with-link a {
  font-family: var(--font-body-family) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: #555555 !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
  transition: color 0.2s ease !important;
}

.title-wrapper-with-link a:hover {
  color: var(--jdm-red) !important;
}

/* Table header column labels (Product, Quantity, Total) */
.cart-items th {
  font-family: var(--font-body-family) !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  color: #888888 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  border-bottom: 1.5px solid #eeeeee !important;
  padding-bottom: 15px !important;
}

/* Cart Item Rows spacing */
.cart-item {
  border-bottom: 1px solid #eeeeee !important;
  padding: 24px 0 !important;
}

/* Product details image rounded corners */
.cart-item__image-container {
  border-radius: 8px !important;
  overflow: hidden !important;
  border: 1px solid #eeeeee !important;
  background-color: #f7f7f7 !important;
}

.cart-item__image {
  border-radius: 8px !important;
  object-fit: contain !important;
}

/* CRITICAL FIX: Product item title inside cart (Must use clean body font!) */
.cart-item__name {
  font-family: var(--font-body-family) !important;
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  color: var(--jdm-dark) !important;
  text-transform: uppercase !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  margin-bottom: 8px !important;
  display: block !important;
  letter-spacing: normal !important;
}

.cart-item__name:hover {
  color: var(--jdm-red) !important;
}

/* Item details pricing text */
.cart-item__discounted-prices,
.cart-item__price-wrapper {
  font-family: var(--font-body-family) !important;
  font-size: 1.35rem !important;
  font-weight: 600 !important;
  color: #666666 !important;
}

/* Quantity input box override */
.cart-item quantity-input.quantity {
  border: 1.5px solid #cccccc !important;
  border-radius: 4px !important;
  min-height: 38px !important;
  height: 38px !important;
  width: 100px !important;
  background: #ffffff !important;
  display: inline-flex !important;
  overflow: hidden !important;
}

.cart-item .quantity__button {
  width: 30px !important;
  height: 100% !important;
  color: #555555 !important;
  background: transparent !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cart-item .quantity__button:hover {
  color: var(--jdm-red) !important;
  background-color: #f5f5f5 !important;
}

.cart-item .quantity__input {
  font-family: var(--font-body-family) !important;
  font-size: 1.4rem !important;
  font-weight: 700 !important;
  color: #111111 !important;
  border-left: 1px solid #cccccc !important;
  border-right: 1px solid #cccccc !important;
  height: 100% !important;
}

/* Trash / remove button (Solid red background mockup style) */
cart-remove-button .button {
  background-color: var(--jdm-red) !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: none !important;
  padding: 0 !important;
  margin-left: 10px !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
}

cart-remove-button .button:hover {
  opacity: 0.9 !important;
  background-color: var(--jdm-dark) !important;
}

cart-remove-button .button svg {
  width: 18px !important;
  height: 18px !important;
  color: #ffffff !important;
}

/* Total row price column */
.cart-item__totals .price {
  font-family: var(--font-body-family) !important;
  font-size: 1.55rem !important;
  font-weight: 800 !important;
  color: var(--jdm-dark) !important;
}


/* ==========================================================================
   CART FOOTER SUMMARY BLOCK
   ========================================================================== */
.cart__blocks {
  margin-top: 30px !important;
}

/* Title: "ESTIMATED TOTAL" */
.totals__total {
  font-family: var(--font-heading-family) !important;
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  color: var(--jdm-dark) !important;
  text-transform: uppercase !important;
  letter-spacing: -0.01em !important;
}

/* Value: "$1,100.00 USD" */
.totals__total-value {
  font-family: var(--font-body-family) !important;
  font-size: 1.9rem !important;
  font-weight: 800 !important;
  color: var(--jdm-dark) !important;
}

/* Tax notice text */
.tax-note {
  font-family: var(--font-body-family) !important;
  font-size: 1.25rem !important;
  color: #777777 !important;
  margin-top: 8px !important;
  margin-bottom: 20px !important;
}

/* Main Checkout Button (Large red button, rounded 6px, bold) */
.cart__checkout-button {
  background-color: var(--jdm-red) !important;
  color: #ffffff !important;
  border-radius: 6px !important;
  font-family: var(--font-body-family) !important;
  font-weight: 700 !important;
  font-size: 1.5rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  min-height: 52px !important;
  width: 100% !important;
  max-width: 360px !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  transition: background-color 0.2s ease !important;
  cursor: pointer !important;
}

.cart__checkout-button:hover {
  background-color: var(--jdm-dark) !important;
}

/* Align checkout buttons column wrapper to the right on desktop */
@media screen and (min-width: 750px) {
  .cart__footer .grid {
    justify-content: flex-end !important;
  }
}



span.jdm-florida-badge-text:after {
        content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40px;
    height: 2px;
    background-color: var(--jdm-red);
    transition: width 0.3s ease;
}
h1.jdm-hero-title {
  font-size: 54px !important;
  line-height: 100%;
  letter-spacing: -2%;
  background: linear-gradient(
    180.83deg,
    #4e4e4e 0.91%,
    rgba(135, 129, 129, 0.8) 167.29%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
div:empty {
  display: block !important;
}
.about-brand-logo-img{
      height: 52px;
    width: 52px;
}
.about-brand-bar-logos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 50px;
}
.category-card-title{
  font-size: 16px !important;
}
.collection .loading-overlay{
  display:none !important;
}

/* Custom Header Drawer Overlay (Screenshot Match media_1790154622738.png Refined) */
.jdm-custom-menu-drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 400px !important;
  height: 100vh !important;
  background: rgba(255, 255, 255, 0.96) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  box-shadow: -10px 0 35px rgba(0, 0, 0, 0.15) !important;
  z-index: 9999 !important;
  overflow-y: auto !important;
  transition: transform 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.jdm-drawer-inner {
  display: flex !important;
  flex-direction: column !important;
  min-height: 100% !important;
  padding: 24px 28px 32px 28px !important;
}

.jdm-drawer-top-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 16px !important;
  width: 100% !important;
  margin-bottom: 32px !important;
}

.jdm-drawer-cart-link {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #111111 !important;
  text-decoration: none !important;
  padding: 8px !important;
}

.jdm-drawer-cart-badge {
  position: absolute !important;
  top: 2px !important;
  right: 2px !important;
  background-color: var(--Red, #F00) !important;
  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.jdm-drawer-close-square {
  width: 42px !important;
  height: 42px !important;
  background-color: #111111 !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
}

.jdm-drawer-close-square:hover {
  background-color: var(--Red, #F00) !important;
}

.jdm-drawer-columns-wrapper {
  display: flex !important;
  justify-content: space-between !important;
  gap: 24px !important;
  width: 100% !important;
  margin-bottom: 32px !important;
  padding-right: 0 !important;
}

.jdm-drawer-col {
  display: flex !important;
  flex-direction: column !important;
  text-align: left !important;
  flex: 1 !important;
}

.jdm-drawer-col-heading {
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #888888 !important;
  margin: 0 0 16px 0 !important;
}

.jdm-drawer-nav-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.jdm-drawer-nav-list a {
  color: #111111 !important;
  font-family: var(--font-body-family, sans-serif) !important;
  font-size: 2.1rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
  text-decoration: none !important;
  transition: color 0.2s ease, transform 0.2s ease !important;
  display: inline-block !important;
}

.jdm-drawer-nav-list a:hover {
  color: var(--Red, #F00) !important;
  transform: translateX(4px) !important;
}

.jdm-drawer-footer-call {
  margin-top: auto !important;
  padding-top: 20px !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

.jdm-drawer-phone-btn {
  background-color: #111111 !important;
  color: #ffffff !important;
  padding: 16px 20px !important;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-decoration: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
  position: relative !important;
  width: 100% !important;
  border-radius: 4px !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15) !important;
}

.jdm-drawer-phone-underline {
  width: 36px !important;
  height: 3px !important;
  background-color: var(--Red, #F00) !important;
}

@media screen and (max-width: 575px) {
  .jdm-custom-menu-drawer {
    max-width: 100% !important;
  }
  .jdm-drawer-columns-wrapper {
    gap: 20px !important;
  }
  .jdm-drawer-nav-list a {
    font-size: 1.8rem !important;
  }
}

/* Ensure mobile menu drawer is always above announcement bar & header */
.jdm-custom-menu-drawer {
  z-index: 9999999 !important;
}

/* Product Page Mobile Responsiveness Fix */
@media screen and (max-width: 749px) {
  .product.grid,
  .product--large:not(.product--no-media),
  .product--medium:not(.product--no-media),
  .product--small:not(.product--no-media) {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 24px !important;
  }

  .product__media-wrapper,
  .product__info-wrapper,
  .product__media-list,
  .product__media-item,
  .product__column-sticky {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .product-form,
  .product-form__buttons,
  .product-form__submit,
  .shopify-payment-button {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .product__info-container {
    padding: 0 16px !important;
  }
}

/* Hide AMEX Payment Icon in Footer */
.list-payment__item [data-payment-type="american_express"],
.list-payment__item [data-payment-type="amex"],
.icon--full-color[aria-labelledby*="american_express"],
.icon--full-color[aria-labelledby*="amex"],
.icon--full-color[aria-labelledby*="American Express"] {
  display: none !important;
}