/* School Band Class — ShopGPT storefront
   Black + red, aggressive tech-luxury aesthetic */

:root {
  --sbc-black: #050505;
  --sbc-black-2: #0d0d0d;
  --sbc-black-3: #141414;
  --sbc-panel: #111111;
  --sbc-border: #2a2a2a;
  --sbc-red: #e10600;
  --sbc-red-hot: #ff1f1f;
  --sbc-red-dim: #8b0000;
  --sbc-text: #f2f2f2;
  --sbc-muted: #c8c8c8;
  --sbc-white: #ffffff;
  --sbc-font: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Global shell */
html body,
body#index,
body#cms,
body#category,
body#product,
body#checkout,
body#authentication,
body#cart {
  background: var(--sbc-black) !important;
  color: var(--sbc-text) !important;
  font-family: var(--sbc-font) !important;
}

#wrapper,
#main,
#content-wrapper,
.page-content,
#footer,
.footer-container,
#header,
.header-top,
.header-banner,
.header-nav {
  /* keep solid under status bar; never transparent into the notch */
  background: #000 !important;
}

#header {
  background: linear-gradient(180deg, #000 0%, #0a0a0a 100%) !important;
  border-bottom: 1px solid var(--sbc-border) !important;
  box-shadow: 0 8px 32px rgba(225, 6, 0, 0.12) !important;
}

.header-nav,
.header-top {
  background: #000 !important;
}

#header a,
.header-nav a,
.menu a,
.top-menu a,
#footer a,
.breadcrumb a {
  color: var(--sbc-text) !important;
}

#header a:hover,
.menu a:hover,
#footer a:hover {
  color: var(--sbc-red) !important;
}

.logo img {
  filter: none;
}

/* Top bar red line */
#header::after {
  content: "";
  display: block;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--sbc-red), transparent);
}

/* ===== TASK-76 / 77 — header home + brand red (not white) ===== */
.sbc-header-home-link,
.sbc-header-home-link-mobile,
.sbc-brand-logo {
  color: var(--sbc-red) !important;
  text-decoration: none !important;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
}
.sbc-header-home-link {
  margin-right: 1rem;
  font-size: 0.78rem;
  border: 1px solid rgba(0, 0, 0, 0.35);
  padding: 0.35rem 0.65rem;
  border-radius: 999px;
  background: rgba(225, 6, 0, 0.08);
}
.sbc-header-home-link:hover,
.sbc-brand-logo:hover {
  color: var(--sbc-red-hot) !important;
  border-color: var(--sbc-red);
}
.sbc-header-home-link-mobile {
  font-size: 0.85rem;
  line-height: 2.4;
  color: var(--sbc-red) !important;
}
.sbc-brand-logo .sbc-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 6px;
  background: var(--sbc-red);
  color: #fff !important;
  font-size: 0.72rem;
  font-weight: 900;
}
.sbc-brand-logo .sbc-brand-name {
  color: var(--sbc-red) !important;
  font-size: 0.92rem;
  line-height: 1.15;
}
.sbc-logo-wrap a,
#header .logo a,
#_desktop_logo a,
#_mobile_logo a {
  color: var(--sbc-red) !important;
}
#header .header-nav,
#header .header-top {
  background: #000 !important;
}
/* TASK-77: kill white header chrome → brand red accents */
#header .header-nav a,
#header .header-top a,
#header .menu a,
#header .top-menu a,
#header .account,
#header .cart-preview,
#header .blockcart,
#header .user-info a,
#header .currency-selector,
#header .language-selector,
#header #contact-link a,
#header .expand-more,
#header span,
#header .material-icons {
  color: var(--sbc-red) !important;
}
#header .header-nav a:hover,
#header .header-top a:hover,
#header .menu a:hover,
#header .top-menu a:hover {
  color: var(--sbc-red-hot) !important;
}
/* Active menu stays readable red, not white */
#header .top-menu .current > a,
#header .top-menu a[aria-current="page"] {
  color: var(--sbc-red-hot) !important;
  border-bottom: 2px solid var(--sbc-red);
}
#header .dropdown-menu {
  background: #0a0a0a !important;
  border: 1px solid var(--sbc-border) !important;
}
#header .dropdown-menu a {
  color: var(--sbc-red) !important;
}
#header .dropdown-menu a:hover {
  background: rgba(225, 6, 0, 0.12) !important;
  color: #fff !important;
}
/* Search / inputs stay dark, accents red */
#header input,
#header select,
#header .search-widget form input[type="text"] {
  background: #0a0a0a !important;
  border-color: var(--sbc-border) !important;
  color: var(--sbc-text) !important;
}
#header .search-widget form button,
#header button[type="submit"] {
  color: var(--sbc-red) !important;
}
.sbc-mobile-menu-home {
  padding: 0.75rem 1rem;
  border-top: 1px solid var(--sbc-border);
}
.sbc-mobile-menu-home a {
  color: var(--sbc-red) !important;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-size: 0.85rem;
}
/* Global home chip (all pages, not only homepage) */
.sbc-global-homebar {
  display: none;
}
@media (max-width: 767px) {
  .sbc-global-homebar {
    display: none !important;
    position: fixed;
    left: 0.65rem;
    bottom: 4.6rem;
    z-index: 99970;
  }
  body#index .sbc-global-homebar {
    /* homepage already has mobile tools bar */
    bottom: 4.6rem;
  }
  .sbc-global-homebar a {
    background: var(--sbc-red);
    color: #fff !important;
    font-weight: 800;
    font-size: 0.72rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none !important;
    padding: 0.65rem 0.85rem;
    border-radius: 999px;
    box-shadow: 0 0 22px rgba(0, 0, 0, 0.35);
  }
}

/* Buttons */
.btn-primary,
.btn.btn-primary,
.add-to-cart,
.product-add-to-cart .add-to-cart,
button[type="submit"].btn-primary {
  background: var(--sbc-red) !important;
  border-color: var(--sbc-red) !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  border-radius: 2px !important;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
}

.btn-primary:hover,
.btn.btn-primary:hover,
.add-to-cart:hover {
  background: var(--sbc-red-hot) !important;
  border-color: var(--sbc-red-hot) !important;
  transform: translateY(-1px);
  box-shadow: 0 0 28px rgba(0, 0, 0, 0.4) !important;
}

.btn-secondary,
.btn-tertiary,
.btn-outline-primary {
  background: transparent !important;
  border: 1px solid var(--sbc-red) !important;
  color: var(--sbc-red) !important;
}

/* Product cards */
.product-miniature,
.product,
.card,
.cart-grid,
.cart-summary {
  background: var(--sbc-panel) !important;
  border: 1px solid var(--sbc-border) !important;
  color: var(--sbc-text) !important;
}

.product-title a,
.product-price,
.h1, .h2, .h3, h1, h2, h3, h4 {
  color: var(--sbc-text) !important;
}

.product-price,
.current-price,
.price {
  color: var(--sbc-red) !important;
  font-weight: 700 !important;
}

/* Forms */
input, select, textarea, .form-control {
  background: #0a0a0a !important;
  border: 1px solid var(--sbc-border) !important;
  color: var(--sbc-text) !important;
}

/* Footer */
#footer {
  background: #000 !important;
  border-top: 1px solid var(--sbc-border) !important;
  color: var(--sbc-muted) !important;
}

#footer .block-contact,
#footer .links a {
  color: var(--sbc-muted) !important;
}

/* Breadcrumb */
.breadcrumb {
  background: transparent !important;
  color: var(--sbc-muted) !important;
}

/* CMS pages */
#cms #content,
body#cms .page-content {
  max-width: 880px;
  margin: 0 auto;
  padding: 2rem 1.25rem 4rem;
  line-height: 1.7;
}

body#cms h1 {
  color: var(--sbc-red) !important;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  border-bottom: 1px solid var(--sbc-border);
  padding-bottom: 0.75rem;
  margin-bottom: 1.5rem;
}

body#cms h2 {
  color: var(--sbc-red) !important;
  font-size: 1.15rem;
  margin-top: 2rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

body#cms a {
  color: var(--sbc-red) !important;
}

/* ========== HOMEPAGE HERO ========== */
.sbc-home {
  /* full-width without 100vw breakout (breaks iOS phones) */
  margin: 0;
  width: 100%;
  max-width: 100%;
  background: var(--sbc-black);
  color: var(--sbc-text);
  overflow-x: hidden;
  overflow-y: visible;
}

.sbc-hero {
  position: relative;
  min-height: 78vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 4rem 1.25rem 3rem;
  background:
    radial-gradient(ellipse 80% 60% at 50% 30%, rgba(225, 6, 0, 0.22), transparent 60%),
    radial-gradient(ellipse 50% 40% at 80% 80%, rgba(225, 6, 0, 0.08), transparent 50%),
    linear-gradient(180deg, #000 0%, #0a0a0a 50%, #000 100%);
}

.sbc-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(225, 6, 0, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(225, 6, 0, 0.05) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse at center, black 20%, transparent 70%);
  pointer-events: none;
}

.sbc-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 920px;
}

.sbc-kicker {
  display: inline-block;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--sbc-red);
  border: 1px solid rgba(0, 0, 0, 0.35);
  padding: 0.45rem 0.9rem;
  margin-bottom: 1.5rem;
  background: rgba(225, 6, 0, 0.08);
}

.sbc-hero h1 {
  font-size: clamp(2.4rem, 7vw, 4.6rem);
  font-weight: 900;
  line-height: 0.98;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  margin: 0 0 1rem;
  color: #fff !important;
  text-shadow: 0 0 40px rgba(225, 6, 0, 0.25);
}

.sbc-hero h1 span {
  color: var(--sbc-red);
  display: block;
}

.sbc-hero-lead {
  font-size: clamp(1rem, 2.2vw, 1.25rem);
  color: var(--sbc-muted);
  max-width: 640px;
  margin: 0 auto 2rem;
  line-height: 1.55;
}

.sbc-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  justify-content: center;
  margin-bottom: 2.5rem;
}

.sbc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.95rem 1.6rem;
  font-weight: 800;
  font-size: 0.85rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none !important;
  border-radius: 2px;
  transition: all 0.15s ease;
}

.sbc-btn-primary {
  background: var(--sbc-red);
  color: #fff !important;
  box-shadow: 0 0 24px rgba(0, 0, 0, 0.35);
}

.sbc-btn-primary:hover {
  background: var(--sbc-red-hot);
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 0 36px rgba(0, 0, 0, 0.45);
}

.sbc-btn-ghost {
  border: 1px solid var(--sbc-red);
  color: var(--sbc-red) !important;
  background: transparent;
}

.sbc-btn-ghost:hover {
  background: rgba(225, 6, 0, 0.12);
  color: #fff !important;
}

.sbc-tech-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem 1.2rem;
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--sbc-muted);
}

.sbc-tech-strip strong {
  color: var(--sbc-red);
  font-weight: 700;
}

/* Sections */
.sbc-section {
  padding: 4rem 1.25rem;
  max-width: 1120px;
  margin: 0 auto;
}

.sbc-section-title {
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 0.5rem;
  color: #fff !important;
}

.sbc-section-title em {
  font-style: normal;
  color: var(--sbc-red);
}

.sbc-section-sub {
  color: var(--sbc-muted);
  margin: 0 0 2rem;
  max-width: 560px;
}

.sbc-grid-3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1.1rem;
}

.sbc-card {
  background: linear-gradient(160deg, #121212 0%, #0a0a0a 100%);
  border: 1px solid var(--sbc-border);
  padding: 1.6rem 1.4rem;
  position: relative;
  overflow: hidden;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  text-decoration: none !important;
  color: inherit !important;
  display: block;
  min-height: 170px;
}

.sbc-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--sbc-red), transparent);
  opacity: 0.7;
}

.sbc-card:hover {
  border-color: rgba(0, 0, 0, 0.4);
  transform: translateY(-3px);
  box-shadow: 0 12px 40px rgba(225, 6, 0, 0.12);
}

.sbc-card h3 {
  margin: 0 0 0.6rem;
  font-size: 1.05rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--sbc-red) !important;
}

.sbc-card p {
  margin: 0;
  color: var(--sbc-muted);
  font-size: 0.95rem;
  line-height: 1.5;
}

/* Tech flex band */
.sbc-tech-band {
  background: #000;
  border-top: 1px solid var(--sbc-border);
  border-bottom: 1px solid var(--sbc-border);
  padding: 3.5rem 1.25rem;
}

.sbc-tech-band-inner {
  max-width: 1120px;
  margin: 0 auto;
}

.sbc-tech-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}

.sbc-tech-item {
  border: 1px solid var(--sbc-border);
  background: var(--sbc-black-2);
  padding: 1.1rem 1rem;
}

.sbc-tech-item .label {
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sbc-red);
  font-weight: 700;
  margin-bottom: 0.35rem;
}

.sbc-tech-item .value {
  font-size: 0.95rem;
  color: var(--sbc-text);
  font-weight: 600;
}

/* Trust row */
.sbc-trust {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
  margin-top: 1rem;
}

.sbc-trust div {
  text-align: center;
  padding: 1.2rem 0.8rem;
  border: 1px solid var(--sbc-border);
  background: rgba(225, 6, 0, 0.04);
}

.sbc-trust strong {
  display: block;
  color: var(--sbc-red);
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 0.35rem;
}

.sbc-trust span {
  color: var(--sbc-muted);
  font-size: 0.9rem;
}

/* CTA footer strip */
.sbc-bottom-cta {
  text-align: center;
  padding: 4rem 1.25rem 5rem;
  background:
    radial-gradient(ellipse 70% 80% at 50% 100%, rgba(225, 6, 0, 0.18), transparent 60%),
    #000;
}

.sbc-bottom-cta h2 {
  font-size: clamp(1.5rem, 4vw, 2.4rem);
  font-weight: 900;
  text-transform: uppercase;
  margin: 0 0 0.75rem;
  color: #fff !important;
}

.sbc-bottom-cta p {
  color: var(--sbc-muted);
  margin: 0 0 1.5rem;
}

/* Hide default home hook clutter if empty looking */
.page-home > .sbc-home + * {
  margin-top: 0;
}

/* Footer */
.sbc-footer {
  background: #000 !important;
  border-top: 1px solid var(--sbc-border);
  padding: 2.5rem 0 1.5rem;
  color: var(--sbc-muted);
}
.sbc-footer-title {
  color: var(--sbc-red);
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-size: 0.78rem;
  margin-bottom: 0.85rem;
}
.sbc-footer-brand p {
  margin: 0 0 0.5rem;
  font-size: 0.92rem;
}
.sbc-footer-tech strong {
  color: var(--sbc-red);
}
.sbc-footer-links {
  list-style: none;
  padding: 0;
  margin: 0;
}
.sbc-footer-links li {
  margin: 0.35rem 0;
}
.sbc-footer-links a,
.sbc-footer a {
  color: var(--sbc-text) !important;
  text-decoration: none;
  font-size: 0.92rem;
}
.sbc-footer-links a:hover,
.sbc-footer a:hover {
  color: var(--sbc-red) !important;
}
.sbc-copy {
  margin-top: 1.5rem;
  color: #666 !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.04em;
}
.sbc-footer-main {
  margin-bottom: 1rem;
}
.sbc-footer-4 .col-md-3 {
  margin-bottom: 1.25rem;
}
@media (min-width: 768px) {
  .sbc-footer-4 {
    display: flex;
    flex-wrap: wrap;
  }
  .sbc-footer-4 > div {
    flex: 1 1 22%;
    max-width: 25%;
  }
}

/* Floating help */
.sbc-help-widget {
  position: fixed;
  right: 1.1rem;
  bottom: 1.1rem;
  z-index: 99999;
  font-family: var(--sbc-font);
}
.sbc-help-toggle {
  border: none;
  cursor: pointer;
  background: var(--sbc-red);
  color: #fff;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.78rem;
  padding: 0.95rem 1.2rem;
  border-radius: 999px;
  box-shadow: 0 0 28px rgba(0, 0, 0, 0.4);
}
.sbc-help-toggle:hover {
  background: var(--sbc-red-hot);
}
.sbc-help-panel {
  position: absolute;
  right: 0;
  bottom: 3.4rem;
  width: min(300px, calc(100vw - 2rem));
  background: #0a0a0a;
  border: 1px solid var(--sbc-border);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.55);
  padding: 1rem;
}
.sbc-help-panel-hd {
  color: var(--sbc-red);
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 0.75rem;
  margin-bottom: 0.5rem;
}
.sbc-help-panel p {
  color: var(--sbc-muted);
  font-size: 0.88rem;
  margin: 0 0 0.75rem;
  line-height: 1.45;
}
.sbc-help-link {
  display: block;
  color: #fff !important;
  text-decoration: none;
  border: 1px solid var(--sbc-border);
  padding: 0.55rem 0.7rem;
  margin: 0.4rem 0;
  font-size: 0.85rem;
  transition: border-color 0.15s ease, color 0.15s ease;
}
.sbc-help-link:hover {
  border-color: var(--sbc-red);
  color: var(--sbc-red) !important;
}

/* Category / product polish */
#category .block-category,
#product .product-container,
.page-product .product-information {
  color: var(--sbc-text);
}
.product-flags .product-flag {
  background: var(--sbc-red) !important;
  color: #fff !important;
}
.thumbnail-container {
  background: #0a0a0a !important;
  border: 1px solid var(--sbc-border);
}

/* Category hero */
.sbc-cat-hero {
  text-align: center;
  padding: 2.25rem 1rem 1.75rem;
  margin: 0 0 1.5rem;
  background:
    radial-gradient(ellipse 70% 80% at 50% 0%, rgba(225, 6, 0, 0.18), transparent 60%),
    #000;
  border: 1px solid var(--sbc-border);
}
.sbc-cat-title {
  font-size: clamp(1.6rem, 4vw, 2.4rem) !important;
  font-weight: 900 !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #fff !important;
  margin: 0.4rem 0 !important;
}
.sbc-cat-sub {
  color: var(--sbc-muted);
  margin: 0;
  font-size: 0.95rem;
}

/* Product trust strip */
.sbc-product-trust {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.75rem;
  margin: 2rem 0 1rem;
  padding: 0;
}
.sbc-product-trust div {
  border: 1px solid var(--sbc-border);
  background: #0a0a0a;
  padding: 0.9rem 0.75rem;
  text-align: center;
}
.sbc-product-trust strong {
  display: block;
  color: var(--sbc-red);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 0.3rem;
}
.sbc-product-trust span {
  color: var(--sbc-muted);
  font-size: 0.85rem;
}

/* Sticky mobile ATC — superseded by SBC sticky ATC fix 2026-07-23 */

/* Product page title/price */
body#product h1.h1,
body#product .product-prices .current-price {
  color: #fff !important;
}
body#product .current-price-value,
body#product .product-price {
  color: var(--sbc-red) !important;
  font-size: 1.45rem !important;
  font-weight: 800 !important;
}
body#product .product-information,
body#product .tabs {
  background: #0a0a0a;
  border: 1px solid var(--sbc-border);
  padding: 1rem;
}

/* Mobile */
@media (max-width: 767px) {
  .sbc-hero {
    min-height: 70vh;
    padding-top: 3rem;
  }
  .sbc-cta-row {
    flex-direction: column;
    align-items: stretch;
  }
  .sbc-btn {
    width: 100%;
  }
  .sbc-help-widget {
    right: 0.75rem;
    bottom: 0.75rem;
  }
}

/* ===== Homepage full potential (TASK-64–75) ===== */
.sbc-trust-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 0.65rem;
  margin: 1.5rem auto 0;
  text-align: center;
}
.sbc-badge {
  background: rgba(0, 0, 0, 0.55);
  border: 1px solid var(--sbc-border);
  border-radius: 10px;
  padding: 0.55rem 0.75rem;
  min-width: 7.5rem;
}
.sbc-badge strong {
  display: block;
  color: var(--sbc-red);
  font-size: 0.85rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.sbc-badge span {
  color: var(--sbc-muted);
  font-size: 0.78rem;
}

.sbc-hub-label {
  color: var(--sbc-red);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin: 1.25rem 0 0.75rem;
}
.sbc-hub-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.85rem;
}
.sbc-hub-grid-3 {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 900px) {
  .sbc-hub-grid,
  .sbc-hub-grid-3 {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 560px) {
  .sbc-hub-grid,
  .sbc-hub-grid-3 {
    grid-template-columns: 1fr;
  }
}
.sbc-hub-card {
  display: block;
  background: var(--sbc-panel);
  border: 1px solid var(--sbc-border);
  border-radius: 14px;
  padding: 1.1rem 1.15rem;
  color: inherit !important;
  text-decoration: none !important;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.sbc-hub-card:hover {
  border-color: var(--sbc-red);
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(225, 6, 0, 0.15);
}
.sbc-hub-card-hot {
  border-color: rgba(0, 0, 0, 0.35);
  background: linear-gradient(160deg, #140808, #0d0d0d 55%);
}
.sbc-hub-icon {
  display: inline-block;
  color: var(--sbc-red);
  font-size: 1.25rem;
  margin-bottom: 0.45rem;
}
.sbc-hub-card h3 {
  margin: 0 0 0.4rem !important;
  font-size: 1.05rem !important;
  color: #fff !important;
}
.sbc-hub-card p {
  margin: 0 0 0.65rem;
  color: var(--sbc-muted);
  font-size: 0.9rem;
  line-height: 1.45;
}
.sbc-hub-cta {
  color: var(--sbc-red);
  font-size: 0.82rem;
  font-weight: 700;
}

/* ShopByInstrument image tiles (generated 2026-07-10) */
.sbc-shopby .sbc-cat-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.85rem;
}
@media (max-width: 900px) {
  .sbc-shopby .sbc-cat-grid {
    grid-template-columns: 1fr 1fr;
  }
}
.sbc-cat-tile {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 160px;
  padding: 1rem;
  border-radius: 12px;
  border: 1px solid var(--sbc-border);
  background-color: #111;
  background-image:
    linear-gradient(180deg, rgba(0, 0, 0, 0.15) 0%, rgba(0, 0, 0, 0.82) 100%),
    var(--sbc-cat-img, none),
    radial-gradient(circle at 30% 20%, rgba(225, 6, 0, 0.25), transparent 55%);
  background-size: cover, cover, auto;
  background-position: center, center, center;
  background-repeat: no-repeat;
  color: #f2f2f2 !important;
  text-decoration: none !important;
  transition: border-color 0.15s ease, transform 0.15s ease;
  overflow: hidden;
}
.sbc-cat-tile:hover {
  border-color: var(--sbc-red);
  transform: translateY(-2px);
}
.sbc-cat-tile span {
  font-weight: 800;
  font-size: 1.05rem;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0,0,0,0.7);
}
.sbc-cat-tile em {
  color: rgba(255, 255, 255, 0.78);
  font-style: normal;
  font-size: 0.82rem;
  margin-top: 0.2rem;
  text-shadow: 0 1px 2px rgba(0,0,0,0.7);
}

.sbc-center-link {
  text-align: center;
  margin-top: 1.25rem;
}
.sbc-center-link .sbc-btn {
  margin: 0.25rem;
}

.sbc-repair-banner {
  margin: 0;
  padding: 2.5rem 1.25rem;
  background:
    radial-gradient(ellipse 80% 100% at 10% 50%, rgba(225, 6, 0, 0.22), transparent 55%),
    #080000;
  border-top: 1px solid var(--sbc-border);
  border-bottom: 1px solid var(--sbc-border);
}
.sbc-repair-inner {
  max-width: 1100px;
  margin: 0 auto;
  display: flex;
  gap: 1.5rem;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.sbc-repair-banner h2 {
  margin: 0.35rem 0 0.5rem !important;
  color: #fff !important;
  font-size: clamp(1.5rem, 3vw, 2rem) !important;
}
.sbc-repair-banner h2 em {
  color: var(--sbc-red);
  font-style: normal;
}
.sbc-repair-banner p {
  color: var(--sbc-muted);
  margin: 0.25rem 0;
}
.sbc-repair-stat {
  font-size: 0.9rem !important;
}
.sbc-repair-actions {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 220px;
}

.sbc-school-grid {
  display: grid;
  grid-template-columns: 1.3fr 0.9fr;
  gap: 1.5rem;
  align-items: start;
}
@media (max-width: 800px) {
  .sbc-school-grid {
    grid-template-columns: 1fr;
  }
}
.sbc-check-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem;
}
.sbc-check-list li {
  position: relative;
  padding: 0.4rem 0 0.4rem 1.4rem;
  color: var(--sbc-text);
}
.sbc-check-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--sbc-red);
  font-weight: 800;
}
.sbc-quote {
  margin: 1rem 0 0.35rem;
  padding: 0.9rem 1rem;
  border-left: 3px solid var(--sbc-red);
  background: #111;
  color: #ddd;
  font-style: italic;
}
.sbc-quote-attr {
  color: var(--sbc-muted);
  font-size: 0.85rem;
  margin: 0 !important;
}
.sbc-school-ctas {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}
.sbc-school-ctas .sbc-btn {
  text-align: center;
}

.sbc-arrivals-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 1rem;
}
.sbc-pill {
  border: 1px solid var(--sbc-border);
  border-radius: 999px;
  padding: 0.25rem 0.65rem;
  font-size: 0.75rem;
  color: var(--sbc-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.sbc-parts-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
}
@media (max-width: 800px) {
  .sbc-parts-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 500px) {
  .sbc-parts-grid {
    grid-template-columns: 1fr;
  }
}
.sbc-part-card {
  background: #111;
  border: 1px solid var(--sbc-border);
  border-radius: 12px;
  padding: 0.95rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.sbc-part-card strong {
  color: #fff;
}
.sbc-part-card span {
  color: var(--sbc-muted);
  font-size: 0.85rem;
}
.sbc-part-card a {
  margin-top: 0.45rem;
  color: var(--sbc-red) !important;
  font-weight: 700;
  font-size: 0.85rem;
  text-decoration: none;
}

.sbc-testi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.85rem;
}
@media (max-width: 1000px) {
  .sbc-testi-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 560px) {
  .sbc-testi-grid {
    grid-template-columns: 1fr;
  }
}
.sbc-testi-card {
  background: var(--sbc-panel);
  border: 1px solid var(--sbc-border);
  border-radius: 14px;
  padding: 1.1rem;
}
.sbc-stars {
  color: var(--sbc-red);
  letter-spacing: 0.08em;
  margin-bottom: 0.5rem;
}
.sbc-testi-card p {
  color: #ddd;
  font-size: 0.92rem;
  line-height: 1.5;
  margin: 0 0 0.85rem;
}
.sbc-testi-card strong {
  display: block;
  color: #fff;
  font-size: 0.9rem;
}
.sbc-testi-card span {
  color: var(--sbc-muted);
  font-size: 0.8rem;
}
.sbc-testi-card.sbc-testi-verified {
  border-color: rgba(0, 0, 0, 0.35);
  box-shadow: 0 0 0 1px rgba(225, 6, 0, 0.12);
}
.sbc-verified-tag {
  color: var(--sbc-red);
  font-style: normal;
  font-weight: 700;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.sbc-testi-howto {
  margin-top: 1.25rem;
}

/* Lazy-ish media defaults */
.page-home img {
  max-width: 100%;
  height: auto;
}

/* ===== Phase 6c homepage polish ===== */
.sbc-jump {
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(0, 0, 0, 0.92);
  border-bottom: 1px solid var(--sbc-border);
  backdrop-filter: blur(8px);
}
.sbc-jump-inner {
  max-width: 1120px;
  margin: 0 auto;
  display: flex;
  flex-wrap: nowrap;
  gap: 0.35rem;
  overflow-x: auto;
  padding: 0.65rem 1rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.sbc-jump-inner::-webkit-scrollbar {
  display: none;
}
.sbc-jump a {
  flex: 0 0 auto;
  color: var(--sbc-text) !important;
  text-decoration: none !important;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 0.45rem 0.75rem;
  border: 1px solid var(--sbc-border);
  border-radius: 999px;
  white-space: nowrap;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.sbc-jump a:hover,
.sbc-jump a.is-active {
  border-color: var(--sbc-red);
  color: var(--sbc-red) !important;
  background: rgba(225, 6, 0, 0.1);
}

.sbc-how-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.85rem;
}
@media (max-width: 900px) {
  .sbc-how-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 520px) {
  .sbc-how-grid {
    grid-template-columns: 1fr;
  }
}
.sbc-how-step {
  background: linear-gradient(165deg, #141010 0%, #0a0a0a 100%);
  border: 1px solid var(--sbc-border);
  border-radius: 14px;
  padding: 1.15rem 1.1rem 1.25rem;
  min-height: 150px;
}
.sbc-how-num {
  display: block;
  color: var(--sbc-red);
  font-weight: 900;
  font-size: 0.85rem;
  letter-spacing: 0.16em;
  margin-bottom: 0.55rem;
}
.sbc-how-step h3 {
  margin: 0 0 0.45rem !important;
  font-size: 1rem !important;
  color: #fff !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sbc-how-step p {
  margin: 0;
  color: var(--sbc-muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.sbc-pill-hot {
  border-color: rgba(0, 0, 0, 0.4);
  color: var(--sbc-red);
  background: rgba(225, 6, 0, 0.08);
}

/* Product modules inside Just In */
.sbc-arrivals-hook {
  margin-top: 0.5rem;
}
.sbc-arrivals-hook .products-section,
.sbc-arrivals-hook .featured-products,
.sbc-arrivals-hook .new-products {
  margin: 0 0 1.75rem !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
.sbc-arrivals-hook .products-section h2,
.sbc-arrivals-hook .products-section .h2,
.sbc-arrivals-hook .featured-products h2,
.sbc-arrivals-hook .new-products h2 {
  font-size: 1rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--sbc-red) !important;
  margin: 0 0 0.85rem !important;
  border-bottom: 1px solid var(--sbc-border);
  padding-bottom: 0.5rem;
}
.sbc-arrivals-hook .products {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem 1rem;
  margin: 0 !important;
  width: 100% !important;
  /* kill Bootstrap .row negative margins that collapse cards */
  margin-left: 0 !important;
  margin-right: 0 !important;
}
/* Presta wraps each card: .js-product.product.col-*-* — without this,
   col-xl-3 (25%) sits *inside* a 4-col grid cell → ultra-skinny cards */
.sbc-arrivals-hook .products > .product,
.sbc-arrivals-hook .products > .js-product,
.sbc-arrivals-hook .products > [class*="col-"] {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 0 0 100% !important;
  float: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.sbc-arrivals-hook .product-miniature,
.sbc-arrivals-hook article.product-miniature {
  width: 100% !important;
  max-width: 100% !important;
  height: 100%;
  display: flex !important;
  flex-direction: column !important;
}
.sbc-arrivals-hook .thumbnail-container,
.sbc-arrivals-hook .thumbnail-top {
  width: 100% !important;
}
.sbc-arrivals-hook .product-thumbnail,
.sbc-arrivals-hook .thumbnail-top a.thumbnail {
  display: block !important;
  width: 100% !important;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #0a0a0a !important;
}
.sbc-arrivals-hook .product-thumbnail img,
.sbc-arrivals-hook .thumbnail-top img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}
.sbc-arrivals-hook .product-description {
  width: 100% !important;
  padding: 0.75rem 0.85rem 0.95rem !important;
  flex: 1 1 auto;
}
@media (max-width: 1000px) {
  .sbc-arrivals-hook .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 520px) {
  .sbc-arrivals-hook .products {
    grid-template-columns: 1fr;
  }
}
.sbc-arrivals-hook .product-miniature,
.sbc-arrivals-hook article.product-miniature {
  background: #0d0d0d !important;
  border: 1px solid var(--sbc-border) !important;
  border-radius: 12px !important;
  overflow: hidden;
  margin: 0 !important;
  width: 100% !important;
  float: none !important;
  transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}
.sbc-arrivals-hook .product-miniature:hover {
  border-color: rgba(0, 0, 0, 0.4) !important;
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(225, 6, 0, 0.12);
}
.sbc-arrivals-hook .thumbnail-container {
  border: 0 !important;
  background: #080808 !important;
}
.sbc-arrivals-hook .product-title a {
  color: #fff !important;
  font-weight: 700 !important;
  font-size: 0.92rem !important;
}
.sbc-arrivals-hook .product-price-and-shipping .price {
  color: var(--sbc-red) !important;
  font-weight: 800 !important;
}
.sbc-arrivals-hook .all-product-link {
  color: var(--sbc-red) !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.78rem;
}

/* Hide leftover classic home widgets if any reappear */
body#index .carousel,
body#index .homeslider,
body#index #carousel,
body#index .banner:not(.sbc-repair-banner):not([class*="sbc-"]),
body#index div.custom-text:not(.sbc-home):not(#content) {
  display: none !important;
}
/* never hide homepage shell */
body#index .sbc-home,
body#index .sbc-hero,
body#index #content.page-home {
  display: block !important;
}

/* Rentals block */
.sbc-rentals {
  background:
    radial-gradient(ellipse 70% 90% at 90% 40%, rgba(225, 6, 0, 0.14), transparent 55%),
    #070707;
  border-top: 1px solid var(--sbc-border);
  border-bottom: 1px solid var(--sbc-border);
  max-width: none;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.sbc-rentals-inner {
  max-width: 1120px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 0.8fr;
  gap: 1.5rem;
  align-items: center;
}
@media (max-width: 800px) {
  .sbc-rentals-inner {
    grid-template-columns: 1fr;
  }
}
.sbc-section-sub-inline {
  margin-bottom: 1rem;
}

/* Mobile sticky tools bar — TASK-83 polish */
.sbc-mobile-tools {
  display: none;
}
@media (max-width: 767px) {
  .sbc-mobile-tools {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99980;
    background: rgba(0, 0, 0, 0.96);
    backdrop-filter: blur(10px);
    border-top: 1px solid var(--sbc-border);
    box-shadow: 0 -10px 30px rgba(225, 6, 0, 0.18);
    padding: 0.15rem 0 calc(0.35rem + env(safe-area-inset-bottom));
  }
  .sbc-mobile-tools a {
    text-align: center;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 0.55rem 0.15rem 0.45rem;
    border-right: 1px solid #1a1a1a;
    min-height: 48px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    -webkit-tap-highlight-color: transparent;
  }
  .sbc-mobile-tools a::before {
    content: "";
    display: block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--sbc-red);
    opacity: 0.85;
  }
  .sbc-mobile-tools a:last-child {
    border-right: 0;
  }
  .sbc-mobile-tools a:active,
  .sbc-mobile-tools a:hover {
    color: var(--sbc-red) !important;
    background: #0a0a0a;
  }
  body#index .sbc-help-widget {
    bottom: 4.8rem;
  }
  body#index #footer {
    padding-bottom: 5rem;
  }
  .sbc-jump {
    top: 0;
  }
}

/* ===== Trade-In / Buy-Back (Phase 1) ===== */
.sbc-tradein {
  max-width: 920px;
  margin: 0 auto 4rem;
  padding: 0 0.25rem;
  color: var(--sbc-text);
}
.sbc-ti-hero {
  padding: 1.5rem 0 1.25rem;
  border-bottom: 1px solid var(--sbc-border);
  margin-bottom: 1.25rem;
}
.sbc-ti-kicker {
  color: var(--sbc-red);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.75rem;
  font-weight: 700;
  margin-bottom: 0.75rem;
}
.sbc-ti-hero h1 {
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.1;
  margin: 0 0 0.75rem;
  font-weight: 800;
  color: #fff !important;
}
.sbc-ti-hero h1 span {
  color: var(--sbc-red);
  display: block;
}
.sbc-ti-lead {
  color: var(--sbc-muted);
  font-size: 1.05rem;
  max-width: 40rem;
  margin: 0 0 1.25rem;
}
.sbc-ti-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem;
}
.sbc-ti-steps div {
  background: var(--sbc-black-2);
  border: 1px solid var(--sbc-border);
  border-radius: 10px;
  padding: 0.75rem;
  font-size: 0.85rem;
  color: #ccc;
}
.sbc-ti-steps strong {
  display: block;
  color: var(--sbc-red);
  font-size: 1.1rem;
  margin-bottom: 0.25rem;
}
.sbc-ti-card {
  background: #0d0d0d;
  border: 1px solid var(--sbc-border);
  border-radius: 14px;
  padding: 1.25rem 1.35rem;
  margin-bottom: 1rem;
}
.sbc-ti-card h2 {
  margin: 0 0 1rem;
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff !important;
}
.sbc-ti-hint {
  color: #888;
  font-weight: 500;
  font-size: 0.85rem;
}
.sbc-ti-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0.85rem;
}
.sbc-ti-form label {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.8rem;
  color: #aaa;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.sbc-ti-form input,
.sbc-ti-form select,
.sbc-ti-form textarea {
  background: #111 !important;
  border: 1px solid #333 !important;
  border-radius: 8px !important;
  color: #f2f2f2 !important;
  padding: 0.65rem 0.75rem !important;
  font-size: 0.95rem !important;
  text-transform: none;
  letter-spacing: 0;
}
.sbc-ti-form input:focus,
.sbc-ti-form select:focus,
.sbc-ti-form textarea:focus {
  outline: none;
  border-color: var(--sbc-red) !important;
  box-shadow: 0 0 0 2px rgba(225, 6, 0, 0.25);
}
.sbc-ti-full {
  margin-top: 0.85rem;
}
.sbc-ti-muted {
  color: #888;
  font-size: 0.9rem;
  margin: 0.35rem 0 1rem;
}
.sbc-ti-preview {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.sbc-ti-preview img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid #333;
}
.sbc-ti-ballpark {
  margin-top: 1rem;
  padding: 1rem;
  border-radius: 12px;
  background: linear-gradient(135deg, #1a0505, #120000);
  border: 1px solid #5a0000;
}
.sbc-ti-bp-title {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--sbc-red);
  margin-bottom: 0.35rem;
}
.sbc-ti-bp-range {
  font-size: 1.6rem;
  font-weight: 800;
  color: #fff;
}
.sbc-ti-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  margin: 1.25rem 0;
}
.sbc-ti-actions .sbc-btn {
  border: 0;
  cursor: pointer;
}
.sbc-ti-actions .sbc-btn:disabled {
  opacity: 0.55;
  cursor: wait;
}
.sbc-ti-status {
  padding: 1rem;
  border-radius: 10px;
  margin-top: 1rem;
}
.sbc-ti-status.err {
  background: #2a0a0a;
  border: 1px solid var(--sbc-red);
  color: #ffb4b4;
}
.sbc-ti-status.ok {
  background: #0a1a0a;
  border: 1px solid #1a7a3a;
  color: #b8ffd0;
}
.sbc-ti-success {
  text-align: center;
  padding: 2rem 1rem;
  background: #0d0d0d;
  border: 1px solid var(--sbc-border);
  border-radius: 16px;
}
.sbc-ti-success h2 {
  color: var(--sbc-red) !important;
  font-size: 2rem;
  margin-bottom: 0.5rem;
}
#sbc-ti-success-quote {
  display: inline-block;
  text-align: left;
  min-width: 260px;
}


/* =====================================================================
   Jeremy tasks 4 / 11 / header — 2026-07-10
   Global white → black, product grey → red, modules black, no white header
   ===================================================================== */

:root {
  --sbc-red: #E30613;
  --sbc-red-hot: #ff1f1f;
  --sbc-black: #000000;
  --sbc-text: #f2f2f2;
  /* product-page muted is forced red below; keep shell muted slightly lighter red-grey for contrast */
  --sbc-muted: #c8c8c8;
}

/* Kill residual white/light backgrounds from classic parent */
html body,
body,
#wrapper,
#main,
#content-wrapper,
#content,
.page-content,
.container,
.card,
.card-block,
.modal-content,
.dropdown-menu,
.search-widget form input[type="text"],
.form-control,
select.form-control,
textarea.form-control,
.input-group .form-control,
.product-cover,
.images-container,
.product-images > li.thumb-container,
.tabs,
.nav-tabs,
.tab-pane,
.product-actions,
.product-additional-info,
.product-quantities,
.product-discounts,
.product-customization,
.product-features,
.product-variants,
.product-information,
.product-description,
.product-description-short,
#product-availability,
.product-prices,
.product-flags,
.block-category,
.facet-label,
#search_filters,
#search_filters_wrapper,
.pagination,
.page-footer,
.cart-grid,
.cart-overview,
.checkout-step,
.order-confirmation,
#notifications,
.alert,
.popover,
.tooltip-inner {
  background-color: #000 !important;
  background: #000 !important;
  color: #f2f2f2 !important;
}

/* Header: absolutely no white */
#header,
#header .header-nav,
#header .header-top,
#header .header-banner,
#header .container,
#header .row,
#header .menu,
#header .top-menu,
#header .popover,
#header .dropdown-menu,
#header .search-widget form input,
#header .ui-autocomplete,
#header .cart-preview,
#_desktop_cart .cart-preview,
.header-top,
.header-nav,
.sbc-header-nav,
.sbc-header-top,
#mobile_top_menu_wrapper,
.js-top-menu-bottom {
  background: #000 !important;
  background-color: #000 !important;
  color: #E30613 !important;
  border-color: #2a2a2a !important;
}

#header a,
#header .menu a,
#header .top-menu a,
#header .material-icons,
#header .account,
#header .cart-products-count,
#header .header-nav a,
#header .user-info a,
#header .blockcart a,
.sbc-header-home-link,
.sbc-brand-name,
.sbc-brand-mark {
  color: #E30613 !important;
}

#header a:hover,
#header .menu a:hover {
  color: #ff1f1f !important;
}

/* Kill white text backgrounds in header widgets */
#header .btn,
#header button,
#header .btn-unstyle {
  background: #000 !important;
  color: #E30613 !important;
  border-color: #E30613 !important;
}

/* Product page: all grey-ish text → brand red; modules black */
body#product,
body#product #main,
body#product #content,
body#product .product-container,
body#product .product-information,
body#product .product-description,
body#product .product-description-short,
body#product .product-actions,
body#product .tabs,
body#product .tab-pane,
body#product .product-features,
body#product .product-variants,
body#product .product-additional-info,
body#product .product-customization,
body#product .product-discounts,
body#product .product-quantities,
body#product .images-container,
body#product .product-cover,
body#product .product-images,
body#product .js-product-images,
body#product .product-flags,
body#product section,
body#product .card,
body#product .card-block,
body#product .modal-content,
body#product #blockcart-modal .modal-content,
body#product .product-accessories,
body#product .featured-products,
body#product .products,
body#product .product-miniature,
body#product .thumbnail-container {
  background: #000 !important;
  background-color: #000 !important;
  color: #E30613 !important;
  border-color: #2a2a2a !important;
}

body#product,
body#product p,
body#product span,
body#product li,
body#product label,
body#product .label,
body#product .form-control-label,
body#product .product-reference,
body#product .product-quantities,
body#product .product-availability,
body#product .product-minimal-quantity,
body#product .product-discount,
body#product .regular-price,
body#product .discount,
body#product .tax-shipping-delivery-label,
body#product .product-features dt,
body#product .product-features dd,
body#product .product-description,
body#product .product-description-short,
body#product .product-information,
body#product .tabs .nav-link,
body#product .nav-tabs .nav-link,
body#product .breadcrumb,
body#product .breadcrumb a,
body#product .control-label,
body#product small,
body#product .text-muted,
body#product .grey,
body#product .sbc-product-trust span,
body#product .sbc-thoughts-body,
body#product .sbc-chat-hint {
  color: #E30613 !important;
}

body#product h1,
body#product h2,
body#product h3,
body#product .h1,
body#product .product-title,
body#product .current-price,
body#product .current-price-value,
body#product .product-price {
  color: #E30613 !important;
}

body#product .add-to-cart,
body#product button.btn-primary,
body#product .btn-primary {
  background: #E30613 !important;
  border-color: #E30613 !important;
  color: #fff !important;
}

/* Category + CMS same black shell */
body#category #main,
body#cms #main,
body#cms .page-content,
body#category .block-category {
  background: #000 !important;
  color: #E30613 !important;
}

/* ShopGPT Thoughts + product chat */
.sbc-thoughts {
  margin: 1.25rem 0 1rem;
  padding: 1.1rem 1.15rem;
  border: 1px solid #E30613;
  border-radius: 12px;
  background: linear-gradient(180deg, #120000 0%, #000 100%) !important;
}
.sbc-thoughts-kicker {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #E30613 !important;
  font-weight: 800;
  margin-bottom: 0.35rem;
}
.sbc-thoughts h3 {
  margin: 0 0 0.65rem;
  color: #fff !important;
  font-size: 1.15rem;
}
.sbc-thoughts-body {
  color: #E30613 !important;
  line-height: 1.5;
  font-size: 0.95rem;
  margin-bottom: 0.75rem;
}
.sbc-thoughts-upsell {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.sbc-thoughts-upsell a {
  display: inline-block;
  padding: 0.45rem 0.85rem;
  border-radius: 999px;
  border: 1px solid #E30613;
  color: #fff !important;
  background: #1a0000 !important;
  font-size: 0.82rem;
  font-weight: 700;
  text-decoration: none !important;
}
.sbc-thoughts-upsell a:hover {
  background: #E30613 !important;
  color: #fff !important;
}

.sbc-product-chat {
  margin: 0 0 1.25rem;
  padding: 1rem;
  border: 1px solid #2a2a2a;
  border-radius: 12px;
  background: #0a0a0a !important;
}
.sbc-product-chat h3 {
  margin: 0 0 0.4rem;
  color: #E30613 !important;
  font-size: 1rem;
}
.sbc-product-chat .sbc-chat-hint {
  font-size: 0.85rem;
  margin-bottom: 0.65rem;
  color: #E30613 !important;
}
.sbc-product-chat-log {
  max-height: 220px;
  overflow-y: auto;
  margin-bottom: 0.65rem;
  padding: 0.5rem;
  border: 1px solid #222;
  border-radius: 8px;
  background: #000 !important;
  font-size: 0.88rem;
}
.sbc-product-chat-log .msg {
  margin: 0.4rem 0;
  padding: 0.45rem 0.55rem;
  border-radius: 8px;
}
.sbc-product-chat-log .msg.user {
  background: #1a0505 !important;
  color: #fff !important;
}
.sbc-product-chat-log .msg.bot {
  background: #0d0d0d !important;
  color: #E30613 !important;
  border: 1px solid #331111;
}
.sbc-product-chat-form {
  display: flex;
  gap: 0.45rem;
}
.sbc-product-chat-form input {
  flex: 1;
  background: #000 !important;
  border: 1px solid #333 !important;
  color: #E30613 !important;
  border-radius: 999px;
  padding: 0.55rem 0.9rem;
}
.sbc-product-chat-form button {
  background: #E30613 !important;
  color: #fff !important;
  border: 0;
  border-radius: 999px;
  padding: 0.55rem 1rem;
  font-weight: 700;
  cursor: pointer;
}

/* Analog needle (homepage widget) */
.shopgpt-tuner-widget .analog-meter {
  position: relative;
  width: 100%;
  max-width: 280px;
  margin: 0.75rem auto 0.5rem;
  aspect-ratio: 2 / 1;
}
.shopgpt-tuner-widget .analog-meter svg {
  width: 100%;
  height: 100%;
  display: block;
}
.shopgpt-tuner-widget .analog-needle {
  transform-origin: 50% 100%;
  transition: transform 0.08s linear;
}

/* ==========================================================================
   SBC KILL-WHITE — modules + catalog + classic leftovers
   Loaded last in custom.css. Forces black/red storefront everywhere.
   ========================================================================== */

/* Base surfaces that classic theme paints white */
body,
html body,
#page,
#wrapper,
#main,
#content,
#content-wrapper,
#columns,
.page-content,
.page-content-wrapper,
.container,
.container-fluid,
.row > [class*="col-"],
section#wrapper,
section#content,
.layout-left-column,
.layout-right-column,
.layout-full-width,
#js-product-list,
#js-product-list-header,
#js-product-list-top,
#js-product-list-bottom,
#search_filters_wrapper,
#search_filters,
#search_filter_controls,
.block-categories,
.facet,
.pagination,
.products-selection,
.products-sort-order,
.product-list,
.products,
.featured-products,
.product-accessories,
.product-miniature,
article.product-miniature,
.thumbnail-container,
.product-description,
.product-flags,
.card,
.card-block,
.card-body,
.modal-content,
.popover,
.dropdown-menu,
.quickview,
#product,
.page-product,
.product-container,
.product-information,
.tabs,
.product-cover,
.images-container,
.product-images,
#product-modal,
.cart-grid,
.cart-container,
.cart-overview,
.cart-summary,
.cart-detailed,
.checkout-step,
.order-confirmation,
#notifications,
.alert,
.custom-checkbox,
.form-control-comment,
.page-footer,
.block-contact,
.links,
.footer-container,
#footer,
#index .featured-products,
#index .products,
.productcomments,
.product-comment,
.product-comment-list,
.module-productcomments,
.wishlist,
.compare,
.brand,
.manufacturer,
.supplier,
.sitemap,
.stores,
.contact-rich,
#contact,
.contact-form,
.login-form,
.register-form,
#authentication,
#password,
#identity,
#address,
#order-detail,
#history,
#order-slip,
#discount,
#module-ps_emailsubscription,
.block_newsletter,
.ps_emailsubscription,
.ps_featuredproducts,
.ps_newproducts,
.ps_bestsellers,
.ps_specials,
.ps_categoryproducts,
.ps_crossselling,
.ps_viewedproduct,
.ps_imageslider,
.carousel,
.carousel-inner,
.carousel-item {
  background-color: #050505 !important;
  background-image: none !important;
  color: #f2f2f2 !important;
}

/* Explicit white killers */
[style*="background:#fff"],
[style*="background: #fff"],
[style*="background:#ffffff"],
[style*="background: #ffffff"],
[style*="background-color:#fff"],
[style*="background-color: #fff"],
[style*="background-color:#ffffff"],
[style*="background-color: #ffffff"],
[style*="background:white"],
[style*="background: white"],
[style*="background-color:white"],
[style*="background-color: white"],
.bg-white,
.bg-light,
.bg-body,
.table,
.table td,
.table th,
.table-striped tbody tr:nth-of-type(odd),
.list-group-item,
.pagination .page-link,
.page-item .page-link,
.custom-radio,
.custom-select,
select.form-control,
input.form-control,
textarea.form-control {
  background: #0d0d0d !important;
  background-color: #0d0d0d !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

/* Product cards / modules */
.product-miniature .thumbnail-container,
.product-miniature .product-description,
.product-miniature .product-title,
.product-miniature .highlighted-informations,
.products .product,
#js-product-list .product-miniature,
.featured-products .product-miniature,
.product-accessories .product-miniature,
.sbc-arrivals-hook .product-miniature,
.sbc-arrivals-hook article {
  background: #111111 !important;
  border: 1px solid #2a2a2a !important;
  color: #f2f2f2 !important;
}

.product-miniature .product-title a,
.product-miniature .product-price-and-shipping,
.product-flags li {
  color: #f2f2f2 !important;
  background: transparent !important;
}

.product-miniature .product-price-and-shipping .price,
.product-price,
.current-price,
span.price {
  color: #e10600 !important;
}

/* Catalog filters / left column */
#search_filters .facet,
#search_filters .facet .title,
#search_filters .facet .collapse,
#search_filters .facet .facet-label,
.block-categories .category-top-menu,
.block-categories ul,
.block-categories li a {
  background: #0d0d0d !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

/* Images keep natural look but no white letterbox */
.thumbnail-container,
.product-thumbnail,
.product-cover img,
.product-images img {
  background: #0a0a0a !important;
}

/* Classic bootstrap whites */
.btn-light,
.btn-outline-light,
.badge-light,
.list-group-item-light,
.alert-light,
.table-light {
  background: #141414 !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

/* Module productcomments white panels */
.product-comment-list-item,
.product-comments-list,
#product-comments-list,
.product-comment-modal .modal-content,
.product-comments-additional-info {
  background: #111 !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

/* Newsletter / footer modules */
.block_newsletter form-control,
#footer .block_newsletter,
.links .wrapper,
.footer-container li a {
  background: transparent !important;
  color: #9a9a9a !important;
}

/* Ensure body never reverts white on category/product */
body#category,
body#product,
body#index,
body#cms,
body#module-ps_emailalerts-account,
body#module-productcomments-list,
body#module-ps_shoppingcart,
body#cart,
body#checkout,
body#order-confirmation,
body#prices-drop,
body#new-products,
body#best-sales,
body#search,
body#manufacturer,
body#supplier {
  background: #050505 !important;
  color: #f2f2f2 !important;
}

/* Pagination active */
.pagination .current a,
.page-item.active .page-link {
  background: #e10600 !important;
  border-color: #e10600 !important;
  color: #fff !important;
}

/* Quick view / modal overlays — ONLY when actually open (.show/.in).
   Forcing opacity on all .modal-backdrop made wishlist backdrops a permanent
   black sheet on phones (fixed help/bar still visible above z-index). */
.modal-backdrop {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.modal-backdrop.show,
.modal-backdrop.in {
  display: block !important;
  background: #000 !important;
  opacity: 0.75 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
/* Homepage: never allow backdrops (wishlist injects 4 of them) */
body#index .modal-backdrop,
body#index .modal-backdrop.show,
body#index .modal-backdrop.in,
body#index .modal-backdrop.fade {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: -1 !important;
  width: 0 !important;
  height: 0 !important;
}
.modal-header,
.modal-footer,
.modal-body {
  background: #111 !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

/* === SBC kill residual inline whites + hover overlays (2026-07-15 refresh) === */
.highlighted-informations,
.product-miniature .highlighted-informations,
.product-miniature .highlighted-informations.no-variants,
.thumbnail-container .highlighted-informations {
  background: rgba(5, 5, 5, 0.92) !important;
  background-color: rgba(5, 5, 5, 0.92) !important;
  color: #f2f2f2 !important;
  border-top: 1px solid #2a2a2a !important;
}
.highlighted-informations a,
.highlighted-informations .quick-view {
  color: #e10600 !important;
  background: transparent !important;
}

/* Beat inline style="background-color:#ffffff" (stylesheet !important wins) */
*[style*="background-color:#ffffff"],
*[style*="background-color: #ffffff"],
*[style*="background-color:#fff"],
*[style*="background-color: #fff"],
*[style*="background:#ffffff"],
*[style*="background: #ffffff"],
*[style*="background:#fff"],
*[style*="background: #fff"] {
  background: #0d0d0d !important;
  background-color: #0d0d0d !important;
}

/* Classic product list top bar */
#js-product-list-top,
.products-selection,
.sort-by-row,
#search_filter_toggler {
  background: #0a0a0a !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

/* Ensure custom assets win after classic parent */
#wrapper .product-miniature,
#wrapper .thumbnail-container,
#wrapper .card {
  background: #111 !important;
  color: #f2f2f2 !important;
}

/* === Help widget fix 2026-07-15 === */
.sbc-help-widget {
  position: fixed !important;
  right: 1rem !important;
  bottom: 1rem !important;
  z-index: 100000 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 0.5rem !important;
  pointer-events: auto !important;
}
body#index .sbc-help-widget {
  bottom: 5.2rem !important; /* above mobile tools bar */
  z-index: 100000 !important;
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.sbc-help-toggle {
  pointer-events: auto !important;
  cursor: pointer !important;
  z-index: 100001 !important;
  border: 0 !important;
  background: #e10600 !important;
  color: #fff !important;
  font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 0.85rem 1.1rem !important;
  border-radius: 999px !important;
  box-shadow: 0 0 24px rgba(0, 0, 0, 0.35) !important;
}
.sbc-help-panel {
  display: none !important;
  width: min(320px, calc(100vw - 2rem)) !important;
  background: #0d0d0d !important;
  color: #f2f2f2 !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 12px !important;
  padding: 0.85rem !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.55) !important;
  pointer-events: auto !important;
}
.sbc-help-panel.is-open,
.sbc-help-panel:not([hidden]) {
  display: block !important;
}
.sbc-help-panel[hidden] {
  display: none !important;
}
.sbc-help-link {
  display: block !important;
  padding: 0.55rem 0.65rem !important;
  margin: 0.25rem 0 !important;
  color: #e10600 !important;
  text-decoration: none !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 8px !important;
  background: #111 !important;
}
.sbc-help-link:hover {
  background: rgba(225,6,0,0.12) !important;
  color: #fff !important;
}

/* Help panel open state — must be last */
.sbc-help-panel.is-open {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  right: 0 !important;
  bottom: 3.6rem !important;
  z-index: 100002 !important;
}

/* === Visual pack 2026-07-15 — banners + stronger category tiles === */
.sbc-hero {
  background: #000 !important;
  min-height: 50vh;
}
.sbc-hero::after {
  display: none !important;
  content: none !important;
}
.sbc-hero-inner { z-index: 2; }

.sbc-cat-tile {
  min-height: 220px !important;
  box-shadow: inset 0 0 0 1px rgba(225,6,0,0.08);
}
@media (min-width: 901px) {
  .sbc-cat-tile { min-height: 260px !important; }
}
.sbc-cat-tile span {
  font-size: 1.15rem !important;
  letter-spacing: 0.04em;
}

/* Photo section bands */
.sbc-vis {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--sbc-border);
  margin: 0 0 1.25rem;
  min-height: 200px;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: flex-end;
}
.sbc-vis::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.82) 100%);
}
.sbc-vis-cap {
  position: relative;
  z-index: 1;
  padding: 1.25rem 1.35rem;
  color: #fff;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-shadow: 0 2px 8px rgba(0,0,0,0.7);
}
.sbc-vis-cap em {
  font-style: normal;
  color: var(--sbc-red);
}
.sbc-vis-tradein { background-image: url(/themes/shopgpt/assets/img/banners/tradein.jpg); }
.sbc-vis-donate { background-image: url(/themes/shopgpt/assets/img/banners/donate.jpg); }
.sbc-vis-repair { background-image: url(/themes/shopgpt/assets/img/banners/repair.jpg); min-height: 240px; border-radius: 0; border-left: 0; border-right: 0; }
.sbc-vis-rental { background-image: url(/themes/shopgpt/assets/img/banners/rental.jpg); }
.sbc-vis-schools { background-image: url(/themes/shopgpt/assets/img/banners/schools.jpg); }

.sbc-repair-banner {
  background:
    linear-gradient(100deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.72) 45%, rgba(0,0,0,0.55) 100%),
    url(/themes/shopgpt/assets/img/banners/repair.jpg) center / cover no-repeat,
    #080000 !important;
}
.sbc-section.sbc-how,
.sbc-section.sbc-donate,
.sbc-section.sbc-rentals,
.sbc-section#schools {
  max-width: 1120px;
}
.sbc-bottom-cta {
  background:
    linear-gradient(180deg, rgba(0,0,0,0.75), rgba(0,0,0,0.92)),
    url(/themes/shopgpt/assets/img/banners/hero.jpg) center 60% / cover no-repeat,
    #000 !important;
}

/* === Catalog expand + hub card images 2026-07-15b === */
.sbc-shopby .sbc-cat-grid-full {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.85rem;
}
@media (max-width: 1100px) {
  .sbc-shopby .sbc-cat-grid-full { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .sbc-shopby .sbc-cat-grid-full { grid-template-columns: repeat(2, 1fr); }
}
.sbc-hub-card-img {
  position: relative;
  min-height: 210px !important;
  justify-content: flex-end !important;
  background-color: #0a0a0a !important;
  background-image:
    linear-gradient(180deg, rgba(0,0,0,0.25) 0%, rgba(0,0,0,0.88) 72%),
    var(--sbc-hub-img, none) !important;
  background-size: cover !important;
  background-position: center !important;
  border-color: rgba(225,6,0,0.25) !important;
  overflow: hidden;
}
.sbc-hub-card-img::before {
  opacity: 0.9;
}
.sbc-hub-card-img .sbc-hub-icon {
  position: absolute;
  top: 0.9rem;
  right: 0.9rem;
  background: rgba(0,0,0,0.45);
  border: 1px solid rgba(225,6,0,0.45);
  border-radius: 8px;
  padding: 0.25rem 0.45rem;
  font-size: 1rem;
}
.sbc-hub-card-img h3,
.sbc-hub-card-img p,
.sbc-hub-card-img .sbc-hub-cta {
  position: relative;
  z-index: 1;
  text-shadow: 0 1px 4px rgba(0,0,0,0.75);
}
.sbc-hub-card-img h3 { color: #fff !important; }
.sbc-hub-card-img p { color: rgba(255,255,255,0.82) !important; }
.sbc-hub-card-img .sbc-hub-cta { color: var(--sbc-red) !important; font-weight: 800; }
.sbc-hub-card-img:hover {
  border-color: var(--sbc-red) !important;
  transform: translateY(-3px);
  box-shadow: 0 14px 40px rgba(225,6,0,0.18);
}
.sbc-hub-grid-visual {
  gap: 1rem;
}

/* =====================================================================
   MOBILE HOMEPAGE BLANK FIX — 2026-07-15
   iOS/Safari: 100vw full-bleed + overflow:hidden can shove content off-screen
   so the user only sees a black shell. Keep layout in normal flow on phones.
   ===================================================================== */
html {
  overflow-x: hidden !important;
  max-width: 100% !important;
}
html body,
body#index {
  overflow-x: hidden !important;
  max-width: 100% !important;
  position: relative !important;
  width: 100% !important;
}

/* Never let the shell collapse / hide */
body#index #wrapper,
body#index #main,
body#index #content-wrapper,
body#index #content,
body#index .page-content,
body#index section#content,
body#index .page-home {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  color: #f2f2f2 !important;
  background-color: #000 !important;
  position: relative !important;
  transform: none !important;
  left: auto !important;
  right: auto !important;
}

/* Kill the classic 100vw breakout that blanks phones */
body#index .sbc-home,
.sbc-home {
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  left: auto !important;
  right: auto !important;
  position: relative !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  transform: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  min-height: 50vh !important;
  color: #f2f2f2 !important;
  background: #000 !important;
}

/* Hero stays readable and on-screen */
body#index .sbc-hero,
.sbc-hero {
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 70vh !important;
  overflow: hidden !important;
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
body#index .sbc-hero-inner,
.sbc-hero-inner {
  position: relative !important;
  z-index: 3 !important;
  visibility: visible !important;
  opacity: 1 !important;
  max-width: 100% !important;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
body#index .sbc-hero h1,
body#index .sbc-hero-lead,
body#index .sbc-section-title,
body#index .sbc-section-sub,
body#index .sbc-cat-tile span,
body#index .sbc-hub-card h3 {
  visibility: visible !important;
  opacity: 1 !important;
}
body#index .sbc-hero h1 {
  color: #fff !important;
}
body#index .sbc-hero-lead,
body#index .sbc-section-sub {
  color: #cfcfcf !important;
}

/* Full-bleed sections without 100vw */
body#index .sbc-repair-banner,
body#index .sbc-tech-band,
body#index .sbc-rentals,
body#index .sbc-bottom-cta {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  left: auto !important;
}

/* Mobile menu must stay closed until opened */
#mobile_top_menu_wrapper[style*="display: none"],
#mobile_top_menu_wrapper[style*="display:none"] {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}

@media (max-width: 767px) {
  body#index .sbc-hero {
    min-height: 58vh !important;
    padding: 2.5rem 1rem 2rem !important;
  }
  body#index .sbc-hero h1 {
    font-size: clamp(1.7rem, 8vw, 2.4rem) !important;
    line-height: 1.05 !important;
  }
  body#index .sbc-cta-row {
    gap: 0.55rem !important;
  }
  body#index .sbc-btn {
    padding: 0.75rem 1rem !important;
    font-size: 0.72rem !important;
  }
  /* sections have room above sticky bar */
  body#index .sbc-home {
    padding-bottom: 4.5rem !important;
  }
  body#index #footer,
  body#index .footer-container {
    padding-bottom: 5.5rem !important;
    display: block !important;
    visibility: visible !important;
  }
  /* category / hub tiles stay in view */
  body#index .sbc-cat-tile,
  body#index .sbc-hub-card {
    visibility: visible !important;
    opacity: 1 !important;
  }
  body#index .sbc-jump {
    max-width: 100% !important;
  }
}

/* Safety: never paint main homepage content white-on-white or invisible */
body#index .sbc-home a,
body#index .sbc-home p,
body#index .sbc-home h1,
body#index .sbc-home h2,
body#index .sbc-home h3 {
  visibility: visible !important;
}

/* =====================================================================
   TEXT CONTRAST FIX — 2026-07-15c
   Black shell was swallowing classic-theme dark greys (#232323 etc).
   Force light text / red accents everywhere on the storefront.
   ===================================================================== */
:root {
  --sbc-text: #f2f2f2 !important;
  --sbc-muted: #c8c8c8 !important;
  --sbc-red: #e10600 !important;
}

html,
body,
body#index,
body#category,
body#cms,
body#product,
body#checkout,
body#cart,
body#authentication,
#page,
#wrapper,
#main,
#content,
#content-wrapper,
.page-content,
.page-home,
.container,
.container-fluid {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: initial !important;
}

/* Headings + body copy — never classic dark grey on black */
body h1, body h2, body h3, body h4, body h5, body h6,
body .h1, body .h2, body .h3, body .h4, body .h5, body .h6,
body p, body li, body td, body th, body label, body span,
body small, body strong, body b, body em, body div,
body#index h1, body#index h2, body#index h3, body#index h4,
body#index p, body#index span, body#index li, body#index div,
body#index .sbc-home,
body#index .sbc-home h1,
body#index .sbc-home h2,
body#index .sbc-home h3,
body#index .sbc-home p,
body#index .sbc-home span,
body#index .sbc-home em,
body#index .sbc-home strong,
body#index .sbc-section-title,
body#index .sbc-section-sub,
body#index .sbc-hero-lead,
body#index .sbc-hero h1,
body#index .sbc-kicker,
body#index .sbc-cat-tile,
body#index .sbc-cat-tile span,
body#index .sbc-cat-tile em,
body#index .sbc-hub-card,
body#index .sbc-hub-card h3,
body#index .sbc-hub-card p,
body#index .sbc-hub-cta,
body#index .sbc-how-step,
body#index .sbc-how-step h3,
body#index .sbc-how-step p,
body#index .sbc-vis-cap,
body#index .sbc-testi-card,
body#index .sbc-testi-card p,
body#index .sbc-testi-card strong,
body#index .sbc-testi-card span,
body#index .sbc-tech-item,
body#index .sbc-tech-item .label,
body#index .sbc-tech-item .value,
body#index .sbc-bottom-cta h2,
body#index .sbc-bottom-cta p,
body#index .sbc-trust-badges,
body#index .sbc-badge,
body#index .sbc-badge strong,
body#index .sbc-badge span,
body#index .sbc-jump a,
body#index .sbc-check-list li,
body#category h1, body#category h2, body#category p,
body#category .product-title, body#category .product-price-and-shipping,
body#cms h1, body#cms h2, body#cms h3, body#cms p, body#cms li {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Soft muted (still light enough on black) */
body#index .sbc-section-sub,
body#index .sbc-hero-lead,
body#index .sbc-cat-tile em,
body#index .sbc-hub-card p,
body#index .sbc-how-step p,
body#index .sbc-testi-card span,
body#index .sbc-badge span,
body .text-muted,
body small {
  color: #c8c8c8 !important;
  -webkit-text-fill-color: #c8c8c8 !important;
}

/* Brand red accents */
body a,
body#index a,
body#index .sbc-btn-ghost,
body#index .sbc-section-title em,
body#index .sbc-hero h1 span,
body#index .sbc-kicker,
body#index .sbc-hub-cta,
body#index .sbc-hub-card h3,
body#index .sbc-how-num,
body#index .sbc-vis-cap em,
body#index .sbc-tech-item .label,
body#index .sbc-footer-title,
#footer a,
.footer-container a,
.sbc-footer a {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
}

/* Primary buttons: white text on red */
body .sbc-btn-primary,
body#index .sbc-btn-primary,
body .btn-primary,
body button.btn-primary,
body .add-to-cart {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #e10600 !important;
  border-color: #e10600 !important;
}

/* White titles that must stay white */
body#index .sbc-hero h1,
body#index .sbc-section-title,
body#index .sbc-cat-tile span,
body#index .sbc-bottom-cta h2,
body#index .sbc-vis-cap {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body#index .sbc-section-title em,
body#index .sbc-hero h1 span {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
}

/* Cards/tiles: force light text even with color:inherit */
body#index .sbc-card,
body#index .sbc-hub-card,
body#index .sbc-cat-tile,
body#index .sbc-hub-card-img {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}
body#index .sbc-hub-card-img h3 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body#index .sbc-hub-card-img p {
  color: rgba(255, 255, 255, 0.88) !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.88) !important;
}
body#index .sbc-hub-card-img .sbc-hub-cta {
  color: #ff4d4d !important;
  -webkit-text-fill-color: #ff4d4d !important;
}

/* Mobile sticky bar */
body#index .sbc-mobile-tools a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Product miniatures on homepage hooks */
body#index .product-miniature .product-title a,
body#index .product-miniature .product-title,
body#index .product-miniature .price,
body#index .product-miniature .regular-price,
body#index .product-description,
body#index .product-price-and-shipping {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}

/* Undo any accidental black text from classic */
body [style*="color:#000"],
body [style*="color: #000"],
body [style*="color:#000000"],
body [style*="color: #000000"],
body [style*="color:black"],
body [style*="color: black"],
body [style*="color:#232323"],
body [style*="color: #232323"],
body [style*="color:#363a42"],
body [style*="color: #363a42"] {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}

/* =====================================================================
   PHONE BLANK FIX 2026-07-15d — stuck modal/backdrop + force content paint
   Help button + bottom bar are position:fixed (z~100k). A Bootstrap
   .modal-backdrop (z~1040) blacks out the page while fixed UI still shows.
   ===================================================================== */

/* Kill stuck overlays that sit above page content but below fixed chrome */
body#index .modal-backdrop,
body .modal-backdrop,
body#index .modal-backdrop.show,
body#index .modal-backdrop.fade,
body#index .modal-backdrop.in,
.modal-backdrop,
.modal-backdrop.show,
.modal-backdrop.fade,
.modal-backdrop.in {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: -1 !important;
  height: 0 !important;
  width: 0 !important;
}

/* Homepage: never leave modals open covering the storefront */
body#index .modal,
body#index .modal.show,
body#index .modal.fade,
body#index .modal.in,
body#index .modal.fade.show {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  z-index: -1 !important;
}
body#index.modal-open {
  overflow: auto !important;
  padding-right: 0 !important;
}
body#index.modal-open #wrapper,
body#index.modal-open #main,
body#index.modal-open #content {
  filter: none !important;
  pointer-events: auto !important;
}

/* Force main storefront content above any leftover layer, below fixed UI */
body#index #wrapper,
body#index #main,
body#index #content-wrapper,
body#index #content,
body#index .page-home,
body#index .sbc-home {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  clip: auto !important;
  clip-path: none !important;
  max-height: none !important;
  height: auto !important;
  overflow: visible !important;
  color: #f2f2f2 !important;
  background-color: #000 !important;
  pointer-events: auto !important;
}

/* Header stays on top of content but not a full-screen black sheet */
body#index #header {
  position: relative !important;
  z-index: 100 !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Explicit light text on all homepage copy — beat Classic #232323 */
body#index #content,
body#index #content *,
body#index .sbc-home,
body#index .sbc-home * {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  opacity: 1 !important;
  visibility: visible !important;
}
body#index .sbc-home a,
body#index .sbc-home .sbc-btn-ghost,
body#index .sbc-home .sbc-hub-cta,
body#index .sbc-home .sbc-section-title em,
body#index .sbc-home .sbc-hero h1 span,
body#index .sbc-home .sbc-kicker,
body#index .sbc-home .sbc-vis-cap em,
body#index .sbc-home .sbc-tech-item .label {
  color: #ff2a2a !important;
  -webkit-text-fill-color: #ff2a2a !important;
}
body#index .sbc-home .sbc-btn-primary,
body#index .sbc-home .sbc-btn-primary * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body#index .sbc-home h1,
body#index .sbc-home h2.sbc-section-title,
body#index .sbc-home .sbc-cat-tile span,
body#index .sbc-home .sbc-vis-cap,
body#index .sbc-home .sbc-bottom-cta h2 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Rocket.Chat livechat widget must not cover the homepage */
body#index #rocketchat-iframe,
body#index iframe[src*="livechat"],
body#index iframe[src*="rocketchat"],
body#index .rocketchat-widget,
body#index #rocketchat-livechat {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
}

/* Ensure fixed chrome stays usable */
body#index .sbc-mobile-tools {
  z-index: 99980 !important;
  display: grid !important;
}
body#index .sbc-help-widget {
  z-index: 100000 !important;
}

/* RED-OVERLAY-FINAL-20260715j */

/* RED-OVERLAY-FINAL-20260715j */
/* Kill black overlays */
html body .modal-backdrop,
body .modal-backdrop,
div.modal-backdrop,
.modal-backdrop.fade,
.modal-backdrop.show,
.modal-backdrop.in,
.fancybox-overlay,
.mfp-bg,
.ui-widget-overlay,
.offcanvas-backdrop {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  position: absolute !important;
  left: -99999px !important;
  width: 0 !important;
  height: 0 !important;
  z-index: -99999 !important;
  background: transparent !important;
}
body.modal-open {
  overflow: auto !important;
  padding-right: 0 !important;
}
/* Homepage layout stable */
body#index #wrapper,
body#index #main,
body#index #content,
body#index #content-wrapper,
body#index .page-home,
body#index .sbc-home {
  position: relative !important;
  left: 0 !important;
  right: 0 !important;
  transform: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  z-index: 2 !important;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  background: #000 !important;
  color: #e10600 !important;
}
/* RED TEXT on homepage */
body#index .sbc-home,
body#index .sbc-home p,
body#index .sbc-home span,
body#index .sbc-home div,
body#index .sbc-home li,
body#index .sbc-home h1,
body#index .sbc-home h2,
body#index .sbc-home h3,
body#index .sbc-home h4,
body#index .sbc-home a,
body#index .sbc-home em,
body#index .sbc-home strong,
body#index .sbc-section-title,
body#index .sbc-section-sub,
body#index .sbc-hero-lead,
body#index .sbc-cat-tile span,
body#index .sbc-cat-tile em,
body#index .sbc-hub-card h3,
body#index .sbc-hub-card p,
body#index .sbc-hub-cta,
body#index .sbc-kicker,
body#index .sbc-vis-cap,
body#index .sbc-how-step h3,
body#index .sbc-how-step p,
body#index .sbc-testi-card,
body#index .sbc-testi-card p,
body#index .sbc-tech-item,
body#index .sbc-bottom-cta h2,
body#index .sbc-bottom-cta p,
body#index .product-title a,
body#index .price {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
  opacity: 1 !important;
  visibility: visible !important;
}
body#index .sbc-btn-primary,
body#index .sbc-btn-primary * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  background: #e10600 !important;
}
body#index .sbc-mobile-tools a {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
body#index .sbc-hero::before,
body#index .sbc-hero::after {
  pointer-events: none !important;
  z-index: 0 !important;
  opacity: 0.2 !important;
}
body#index .sbc-hero-inner {
  position: relative !important;
  z-index: 5 !important;
}
body#index .sbc-home::before,
body#index .sbc-home::after,
body#index #content::before,
body#index #content::after,
body#index #wrapper::before,
body#index #wrapper::after {
  content: none !important;
  display: none !important;
}

/* HOME-EMERGENCY-k */
body#index .sbc-home, body#index .sbc-home * {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
}
body#index .sbc-btn-primary, body#index .sbc-btn-primary * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
.modal-backdrop { display:none !important; opacity:0 !important; pointer-events:none !important; }


/* JUMP-NAV-SHEET-FIX-20260715m — sticky jump must never paint a full-page black sheet */
html {
  height: auto !important;
  min-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
body#index {
  height: auto !important;
  min-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}
body#index .sbc-jump,
.sbc-jump {
  position: sticky !important;
  top: 0 !important;
  z-index: 40 !important;
  height: auto !important;
  max-height: 4.75rem !important;
  min-height: 0 !important;
  align-self: flex-start !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  overflow: hidden !important;
  background: rgba(0, 0, 0, 0.92) !important;
}
body#index .sbc-jump-inner,
.sbc-jump-inner {
  height: auto !important;
  max-height: 4.75rem !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
/* keep homepage content above any residual cover */
body#index .sbc-home {
  position: relative !important;
  z-index: 5 !important;
  display: block !important;
  height: auto !important;
  overflow: visible !important;
}


/* NORMAL-TEXT-RESTORE-20260715n
   Drop diagnostic all-red text. Brand palette:
   light copy, white headings, red accents, WHITE on red primary buttons. */
body#index #wrapper,
body#index #main,
body#index #content,
body#index #content-wrapper,
body#index .page-home,
body#index .sbc-home {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  background: #000 !important;
}

/* Neutralize prior "paint everything red" emergency rules */
body#index .sbc-home,
body#index .sbc-home *:not(svg):not(path):not(.sbc-btn-primary):not(.sbc-btn-primary *) {
  /* reset fill so specific rules below can win without inherit of forced red */
}
body#index .sbc-home p,
body#index .sbc-home li,
body#index .sbc-home div,
body#index .sbc-home span,
body#index .sbc-home strong,
body#index .sbc-section-sub,
body#index .sbc-hero-lead,
body#index .sbc-how-step p,
body#index .sbc-testi-card,
body#index .sbc-testi-card p,
body#index .sbc-tech-item .value,
body#index .sbc-tech-item .label,
body#index .sbc-bottom-cta p,
body#index .product-title a,
body#index .price {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}
body#index .sbc-home h1,
body#index .sbc-home h2,
body#index .sbc-home h3,
body#index .sbc-home h4,
body#index .sbc-section-title,
body#index .sbc-bottom-cta h2,
body#index .sbc-cat-tile span,
body#index .sbc-hub-card h3,
body#index .sbc-how-step h3,
body#index .sbc-vis-cap {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body#index .sbc-cat-tile em,
body#index .sbc-hub-card p,
body#index .sbc-badge span,
body#index .sbc-hero-lead {
  color: #b8b8b8 !important;
  -webkit-text-fill-color: #b8b8b8 !important;
}
/* Red accents */
body#index .sbc-kicker,
body#index .sbc-hero h1 span,
body#index .sbc-section-title em,
body#index .sbc-hub-cta,
body#index .sbc-vis-cap em,
body#index .sbc-how-num,
body#index .sbc-home a:not(.sbc-btn):not(.sbc-btn-primary):not(.sbc-btn-ghost),
body#index .sbc-btn-ghost,
body#index .sbc-btn-ghost * {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
}

/* PRIMARY BUTTONS — solid red bg + solid white text */
html body#index a.sbc-btn-primary,
html body#index a.sbc-btn.sbc-btn-primary,
html body#index .sbc-btn-primary,
html body#index .sbc-cta-row .sbc-btn-primary,
html body#index .sbc-home a.sbc-btn-primary,
html body#index .sbc-home .sbc-btn-primary,
html body#index .sbc-btn-primary span,
html body#index .sbc-btn-primary strong,
html body#index .sbc-btn-primary em,
html body#index .sbc-home .sbc-btn-primary *,
html body#index a.sbc-btn-primary * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #e10600 !important;
  background-color: #e10600 !important;
  border-color: #e10600 !important;
}
html body#index a.sbc-btn-primary:hover,
html body#index .sbc-btn-primary:hover,
html body#index .sbc-btn-primary:hover * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: #ff1f1f !important;
  background-color: #ff1f1f !important;
}

/* Ghost buttons: red text on transparent, not red-on-red */
html body#index a.sbc-btn-ghost,
html body#index .sbc-btn-ghost,
html body#index .sbc-btn-ghost * {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
  background: transparent !important;
  background-color: transparent !important;
}
html body#index a.sbc-btn-ghost:hover,
html body#index .sbc-btn-ghost:hover,
html body#index .sbc-btn-ghost:hover * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: rgba(225, 6, 0, 0.18) !important;
}

/* Bottom bar + help stay readable */
body#index .sbc-mobile-tools a {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body#index .sbc-help-widget,
body#index .sbc-help-widget * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}


/* SBC-LOGO-SIZE-20260715 — asset d7a3df3abc45 logo sizing on dark header */
/* neutralized wide logo rule */
@media (max-width: 767px) {
  #_mobile_logo .logo,
  .sbc-logo-wrap .logo {
    max-height: 40px !important;
    max-width: 120px !important;
  }
}
.sbc-logo-wrap {
  margin: 0 !important;
  line-height: 0 !important;
}
.sbc-logo-wrap a {
  display: inline-flex !important;
  align-items: center !important;
}

/* === SBC subcategory image grid === */
.sbc-subcats {
  margin: 1.25rem 0 2rem;
  padding: 1rem 1.1rem 1.25rem;
  background: #0a0a0a;
  border: 1px solid #222;
  border-radius: 12px;
}
.sbc-subcats__heading {
  margin: 0 0 1rem;
  font-size: 1.15rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.02em;
  border-left: 4px solid #E30613;
  padding-left: 0.65rem;
}
.sbc-subcats__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}
@media (min-width: 576px) {
  .sbc-subcats__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 992px) {
  .sbc-subcats__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.sbc-subcats__item { margin: 0; }
.sbc-subcats__card {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none !important;
  color: #fff !important;
  background: #111;
  border: 1px solid #2a2a2a;
  border-radius: 10px;
  overflow: hidden;
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.sbc-subcats__card:hover {
  border-color: #E30613;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(227, 6, 19, 0.18);
}
.sbc-subcats__image {
  display: block;
  aspect-ratio: 1 / 1;
  background: #0a0a0a;
  overflow: hidden;
}
.sbc-subcats__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.sbc-subcats__name {
  display: block;
  padding: 0.65rem 0.7rem 0.8rem;
  font-size: 0.92rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.25;
}
/* classic fallback list polish */
#subcategories.card .subcategories-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 1rem;
  list-style: none;
  padding: 0;
}
#subcategories.card .subcategory-image img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  object-fit: cover;
}
.sbc-cat-mini__image img {
  width: 100%;
  max-width: 280px;
  height: auto;
  border-radius: 10px;
  border: 1px solid #2a2a2a;
}

/* ShopGPT Thoughts photo analysis */
.sbc-thoughts-loading { color: #c41e3a; font-weight: 600; }
.sbc-thoughts-meta { opacity: 0.85; font-size: 0.9em; }
.sbc-thoughts-body ul { margin: 0.4rem 0 0.8rem 1.1rem; }
.sbc-thoughts-body li { margin: 0.2rem 0; }

/* Hide Customer Reassurance (Security / Delivery / Return) on product pages */
body#product #block-reassurance,
body#product .blockreassurance,
body#product .block-reassurance,
body#product .product-reassurance,
body#product [id*="block-reassurance"],
body#product [class*="block-reassurance"],
body#product [class*="blockreassurance"] {
  display: none !important;
}

/* ShopGPT Thoughts under product gallery */
.sbc-thoughts--under-photo {
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(196, 30, 58, 0.35);
  border-radius: 12px;
  background: #0e0e10;
}
.sbc-thoughts--under-photo .sbc-thoughts-kicker {
  color: #c41e3a;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.35rem;
}
.sbc-thoughts--under-photo h3 {
  margin: 0 0 0.65rem;
  font-size: 1.15rem;
  color: #f5f5f5;
}
.sbc-thoughts--under-photo .sbc-thoughts-body {
  color: #e8e8ea;
  font-size: 0.95rem;
  line-height: 1.45;
}

/* Crisp product/category images — no red rim glow */
.sbc-image-crisp,
.product-miniature img,
.product-cover img,
.images-container img,
.sbc-subcats__image img,
.sbc-cat-mini__image img,
.sbc-shop-by img,
[class*="shop-by"] img,
.banner img,
.carousel img {
  filter: none !important;
  box-shadow: none !important;
  image-rendering: auto;
}
.logo img {
  filter: none !important;
}


/* ==========================================================================
   SBC HEADER LAYOUT FIX v4 — no overlap, aligned rows
   ========================================================================== */

/* Kill previous absolute-center mobile logo tricks that caused cart overlap */
#header .header-nav .mobile.sbc-mobile-nav,
#header .sbc-mobile-nav {
  display: grid !important;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  column-gap: 0.5rem;
  min-height: 56px;
  padding: 0.35rem 0;
  position: relative !important;
  text-align: left !important;
}
#header .sbc-mobile-nav__left,
#header .sbc-mobile-nav__center,
#header .sbc-mobile-nav__right {
  position: static !important;
  float: none !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  display: flex !important;
  align-items: center;
}
#header .sbc-mobile-nav__left {
  justify-content: flex-start;
}
#header .sbc-mobile-nav__center {
  justify-content: center;
  max-width: none;
  margin: 0;
}
#header .sbc-mobile-nav__right {
  justify-content: flex-end;
  gap: 0.35rem;
  flex-wrap: nowrap;
}
#header .sbc-mobile-nav .clearfix {
  display: none !important;
}
/* Undo classic float layout inside mobile nav */
#header .sbc-mobile-nav .float-xs-left,
#header .sbc-mobile-nav .float-xs-right {
  float: none !important;
}

#header #menu-icon {
  position: static !important;
  float: none !important;
  cursor: pointer;
  width: 44px;
  height: 44px;
  min-width: 44px;
  min-height: 44px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  color: #fff !important;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  line-height: 1;
}
#header #menu-icon .material-icons {
  font-size: 26px;
  line-height: 1;
}

#header #_mobile_logo,
#header .sbc-mobile-nav__center.top-logo {
  position: static !important;
  left: auto !important;
  transform: none !important;
  max-width: 130px;
  margin: 0 auto;
  line-height: 0;
}
#header #_mobile_logo .logo,
#header #_mobile_logo img,
#header .sbc-mobile-nav__center .logo {
  max-height: 36px !important;
  max-width: 120px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
}

#header #_mobile_cart,
#header #_mobile_user_info {
  position: static !important;
  float: none !important;
  display: flex !important;
  align-items: center;
}
#header #_mobile_cart .blockcart,
#header #_mobile_cart .header,
#header #_mobile_user_info .user-info,
#header #_mobile_user_info a {
  display: inline-flex !important;
  align-items: center;
  gap: 0.15rem;
  min-width: 0 !important;
  min-height: 40px;
  line-height: 1.1;
  white-space: nowrap;
}

/* Desktop utility bar */
#header .header-nav {
  border-bottom: 1px solid #1a1a1a;
}
#header .sbc-nav-left,
#header .sbc-nav-right {
  display: flex;
  align-items: center;
  min-height: 42px;
  gap: 0.75rem;
  flex-wrap: wrap;
}
#header .sbc-nav-right {
  justify-content: flex-end;
}
#header .header-nav a,
#header .header-nav button.btn-unstyle,
#header .header-nav .user-info a,
#header .header-nav #contact-link a {
  min-width: 0 !important;
  min-height: 0 !important;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  line-height: 1.2;
  vertical-align: middle;
}
#header .header-nav .blockcart .header {
  display: inline-flex !important;
  align-items: center;
  gap: 0.25rem;
  min-height: 36px;
}
#header .header-nav .material-icons {
  font-size: 20px;
  line-height: 1;
  vertical-align: middle;
}
#header .currency-selector {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

/* Desktop logo + search row */
#header .sbc-header-top-row {
  display: flex;
  align-items: center;
  min-height: 64px;
  margin: 0;
}
#header .sbc-desktop-logo {
  display: flex !important;
  align-items: center;
  min-height: 64px;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
#header .sbc-logo-link {
  display: inline-block;
  line-height: 0;
  max-width: 100%;
}
#header .sbc-desktop-logo .logo,
#header #_desktop_logo .logo,
#header .header-top .logo {
  max-height: 46px !important;
  max-width: 140px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  display: block !important;
}
#header .sbc-header-top-right {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  min-height: 64px;
}
/* Main menu + search alignment */
#header .header-top .menu,
#header .header-top .top-menu,
#header .header-top #_desktop_top_menu,
#header .header-top .search-widget,
#header .header-top #search_widget {
  display: flex;
  align-items: center;
  margin: 0;
}
#header .header-top #search_widget form,
#header .header-top .search-widget form {
  display: flex;
  align-items: center;
  margin: 0;
}
#header .header-top input[type="text"] {
  min-height: 40px;
  height: 40px;
  line-height: 1.2;
  vertical-align: middle;
}

/* Prevent classic absolute positioning conflicts in header */
#header .header-nav .mobile > * {
  position: static !important;
}
#header .header-nav .row {
  margin-left: 0;
  margin-right: 0;
}

/* Desktop: hide empty mobile row artifacts */
@media (min-width: 768px) {
  #header .sbc-mobile-nav {
    display: none !important;
  }
  #header .sbc-desktop-logo {
    display: flex !important;
  }
}
@media (max-width: 767px) {/* NEUTRALIZED desktop logo hide */
/* 
  #header .sbc-desktop-logo,
  #header #_desktop_logo {
    display: none !important;
  } */

  /* On mobile, header-top is mainly search/menu clone area */
  #header .sbc-header-top-row {
    min-height: 0;
  }
  #header .sbc-header-top-right {
    min-height: 48px;
    justify-content: stretch;
    width: 100%;
  }
  #header .header-top #search_widget,
  #header .header-top .search-widget {
    width: 100%;
  }
  #header .header-top #search_widget form,
  #header .header-top .search-widget form {
    width: 100%;
  }
  #header .header-top input[type="text"] {
    width: 100%;
  }
}

/* Skip link off-canvas until focused */
.sbc-skip-link {
  position: absolute;
  left: 0.75rem;
  top: 0.5rem;
  z-index: 100000;
  padding: 0.55rem 0.85rem;
  background: #fff;
  color: #000 !important;
  font-weight: 700;
  border: 2px solid #e30613;
  border-radius: 4px;
  transform: translateY(-180%);
  transition: transform 0.12s ease;
  text-decoration: none !important;
}
.sbc-skip-link:focus,
.sbc-skip-link:focus-visible {
  transform: translateY(0);
}

/* Force square logo — overrides older rectangular header rules */
#header .sbc-hdr-logo img,
#header #_desktop_logo img,
#header .logo.img-fluid,
#header .sbc-logo-wrap .logo {
  width: 56px !important;
  height: 56px !important;
  max-width: 56px !important;
  max-height: 56px !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: contain !important;
}
#header .sbc-hdr-logo--mobile img {
  width: 44px !important;
  height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
}
/* Search stacking above body */
#header { z-index: 5000 !important; position: relative !important; overflow: visible !important; }
#wrapper, #content, #main { z-index: 1 !important; position: relative !important; }
#header #search_widget, #header .search-widget { z-index: 5002 !important; position: relative !important; }
/* Burger box alignment */
#header .sbc-hdr-burger, #header #menu-icon {
  width: 44px !important; height: 44px !important;
  min-width: 44px !important; min-height: 44px !important;
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  padding: 0 !important; margin: 0 !important; box-sizing: border-box !important;
}

/* SBC HEADER EMERGENCY OVERRIDE */
#header { display: block !important; visibility: visible !important; opacity: 1 !important;
  position: relative !important; z-index: 5000 !important; height: auto !important;
  max-height: none !important; overflow: visible !important; background: #000 !important; }
#header #_desktop_logo { display: flex !important; visibility: visible !important; }
@media (max-width: 767px) {
  #header #_desktop_logo.sbc-hdr-logo-slot { display: none !important; }
}
#header #_desktop_cart, #header #_desktop_user_info, #header .blockcart, #header .user-info {
  float: none !important; position: relative !important; top: auto !important; right: auto !important;
  left: auto !important; transform: none !important;
}
#header .header-top .search-widget { float: none !important; }

/* Product photo prop disclaimer */
.sbc-photo-disclaimer {
  margin: 0.75rem 0 0.35rem;
  padding: 0.7rem 0.9rem;
  border-left: 3px solid #E30613;
  border-radius: 0 8px 8px 0;
  background: rgba(225, 6, 0, 0.08);
  color: #e8e8ea !important;
  font-size: 0.88rem;
  line-height: 1.45;
}
.sbc-photo-disclaimer strong {
  color: #ff6b6b !important;
  font-weight: 800;
}
body#product .sbc-photo-disclaimer {
  max-width: 100%;
}

/* SBC safe-area header hard override */
#header,
header#header {
  padding-top: constant(safe-area-inset-top) !important;
  padding-top: env(safe-area-inset-top, 0px) !important;
  background: #000 !important;
  background-color: #000 !important;
}
#header .header-nav,
#header .header-top,
#header .sbc-hdr-util,
#header .sbc-hdr-main {
  background: #000 !important;
}

/* SBC: kill floating bottom-left Home chip */
.sbc-global-homebar,
div.sbc-global-homebar,
body .sbc-global-homebar {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
  position: absolute !important;
  left: -9999px !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  z-index: -1 !important;
}


/* === SBC sticky ATC fix 2026-07-23 === */
@media (max-width: 767px) {
  /* old full-bar sticky ATC disabled — see SBC product ATC layout fix 2026-07-23b */
body#product .product-add-to-cart.js-product-add-to-cart { position: relative !important; }
  body#product .product-add-to-cart > .control-label,
  body#product .product-add-to-cart > .product-minimal-quantity,
  body#product .product-add-to-cart > #product-availability,
  body#product .product-add-to-cart [class*="wishlist"] {
    display: none !important;
  }
  body#product .product-add-to-cart .product-quantity {
    display: flex !important;
    flex: 1 1 auto !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.65rem !important;
    width: 100% !important;
    margin: 0 !important;
    float: none !important;
  }
  body#product .product-add-to-cart .product-quantity::before,
  body#product .product-add-to-cart .product-quantity::after {
    display: none !important;
    content: none !important;
  }
  body#product .product-add-to-cart .qty {
    flex: 0 0 auto !important;
    float: none !important;
    margin: 0 !important;
  }
  body#product .product-add-to-cart #quantity_wanted {
    width: 3.4rem !important;
    min-height: 44px !important;
    text-align: center !important;
    background: #111 !important;
    border: 1px solid #333 !important;
    color: #fff !important;
  }
  body#product .product-add-to-cart .add {
    flex: 1 1 auto !important;
    float: none !important;
    margin: 0 !important;
  }
  body#product .product-add-to-cart button.add-to-cart {
    width: 100% !important;
    min-height: 48px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: auto !important;
    z-index: 100051 !important;
  }
  body#product #footer,
  body#product .sbc-product-chat,
  body#product .sbc-product-trust {
    padding-bottom: 5.5rem !important;
  }
  body#product .sbc-help-widget {
    bottom: 5.6rem !important;
    z-index: 100040 !important;
  }
}
.sbc-help-panel[hidden] {
  display: none !important;
  visibility: hidden !important;
}
#rocketchat-livechat-iframe,
iframe[src*="livechat"],
.rocketchat-widget,
#rocketchat-livechat,
#rocketchat-iframe,
#rocketchat-livechat-widget {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
}


/* === SBC auth form contrast fix 2026-07-23 === */
/* Login / create account / password recovery / customer account forms
   Classic parent + dark theme were fighting → white text on white fields. */
body#authentication,
body#registration,
body#password,
body#identity,
body#address,
body#order-detail,
body#history,
body.page-authentication,
body.page-registration,
body.page-customer-account,
body.page-password {
  background: #050505 !important;
  color: #f2f2f2 !important;
}

body#authentication #main,
body#registration #main,
body#password #main,
body#identity #main,
body#address #main,
body.page-customer-account #main,
body#authentication #content,
body#registration #content,
body#password #content,
body.page-customer-account #content,
body#authentication .page-content,
body#registration .page-content,
body#password .page-content,
body.page-customer-account .page-content,
body#authentication .card,
body#registration .card,
body#password .card,
body.page-customer-account .card,
body#authentication .card-block,
body#registration .card-block,
body#password .card-block,
body.page-customer-account .card-block,
body#authentication .login-form,
body#registration .register-form,
body#authentication .no-account,
body#registration form,
body#authentication form {
  background: #0a0a0a !important;
  background-color: #0a0a0a !important;
  color: #f2f2f2 !important;
}

body#authentication h1,
body#registration h1,
body#password h1,
body.page-customer-account h1,
body#authentication .page-header h1,
body#registration .page-header h1,
body#authentication label,
body#registration label,
body#password label,
body.page-customer-account label,
body#authentication .form-control-comment,
body#registration .form-control-comment,
body#authentication .field-label,
body#registration .field-label,
body#authentication .custom-checkbox label,
body#registration .custom-checkbox label,
body#authentication .no-account,
body#authentication a,
body#registration a,
body#password a {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}

body#authentication a:hover,
body#registration a:hover,
body#password a:hover {
  color: #ff4d57 !important;
  -webkit-text-fill-color: #ff4d57 !important;
}

/* Inputs: always dark field + light typed text (incl. autofill) */
body#authentication input.form-control,
body#registration input.form-control,
body#password input.form-control,
body#identity input.form-control,
body#address input.form-control,
body.page-customer-account input.form-control,
body#authentication input[type="text"],
body#authentication input[type="email"],
body#authentication input[type="password"],
body#authentication input[type="tel"],
body#authentication input[type="number"],
body#authentication input[type="search"],
body#authentication input[type="date"],
body#registration input[type="text"],
body#registration input[type="email"],
body#registration input[type="password"],
body#registration input[type="tel"],
body#registration input[type="number"],
body#registration input[type="date"],
body#password input[type="text"],
body#password input[type="email"],
body#password input[type="password"],
body.page-customer-account input[type="text"],
body.page-customer-account input[type="email"],
body.page-customer-account input[type="password"],
body.page-customer-account input[type="tel"],
body#authentication textarea,
body#registration textarea,
body#password textarea,
body.page-customer-account textarea,
body#authentication select,
body#registration select,
body.page-customer-account select,
body#authentication select.form-control,
body#registration select.form-control,
body.page-customer-account select.form-control,
body#authentication textarea.form-control,
body#registration textarea.form-control,
body.page-customer-account .form-control {
  background: #151515 !important;
  background-color: #151515 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ffffff !important;
  border: 1px solid #3a3a3a !important;
  border-radius: 4px !important;
  opacity: 1 !important;
}

body#authentication input.form-control::placeholder,
body#registration input.form-control::placeholder,
body#password input.form-control::placeholder,
body.page-customer-account input.form-control::placeholder,
body#authentication textarea::placeholder,
body#registration textarea::placeholder,
body#authentication input::placeholder,
body#registration input::placeholder {
  color: #9a9a9a !important;
  -webkit-text-fill-color: #9a9a9a !important;
  opacity: 1 !important;
}

body#authentication input.form-control:focus,
body#registration input.form-control:focus,
body#password input.form-control:focus,
body.page-customer-account input.form-control:focus,
body#authentication input:focus,
body#registration input:focus,
body#password input:focus,
body#authentication select:focus,
body#registration select:focus,
body#authentication textarea:focus,
body#registration textarea:focus {
  background: #1a1a1a !important;
  background-color: #1a1a1a !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #e10600 !important;
  box-shadow: 0 0 0 1px rgba(225, 6, 0, 0.45) !important;
  outline: none !important;
}

/* Chrome/Safari autofill forces pale yellow/white — override hard */
body#authentication input:-webkit-autofill,
body#authentication input:-webkit-autofill:hover,
body#authentication input:-webkit-autofill:focus,
body#authentication input:-webkit-autofill:active,
body#registration input:-webkit-autofill,
body#registration input:-webkit-autofill:hover,
body#registration input:-webkit-autofill:focus,
body#registration input:-webkit-autofill:active,
body#password input:-webkit-autofill,
body#password input:-webkit-autofill:focus,
body.page-customer-account input:-webkit-autofill,
body.page-customer-account input:-webkit-autofill:focus {
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ffffff !important;
  box-shadow: 0 0 0 1000px #151515 inset !important;
  -webkit-box-shadow: 0 0 0 1000px #151515 inset !important;
  transition: background-color 99999s ease-out 0s !important;
  border: 1px solid #3a3a3a !important;
}

body#authentication .btn-primary,
body#registration .btn-primary,
body#password .btn-primary,
body.page-customer-account .btn-primary,
body#authentication button[type="submit"],
body#registration button[type="submit"] {
  background: #e10600 !important;
  border-color: #e10600 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Password show/hide eye icon stays visible */
body#authentication .field-password-policy,
body#registration .field-password-policy,
body#authentication .js-visible-password,
body#registration .js-visible-password,
body#authentication .input-group-btn,
body#registration .input-group-btn {
  color: #f2f2f2 !important;
}


/* === SBC header menu layout fix 2026-07-23 === */
/* Top-level only: horizontal row. Never dump nested category trees into the bar. */
#header .sbc-hdr-tools {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.35rem 0.75rem !important;
  min-width: 0 !important;
}

#header .sbc-hdr-tools .menu.js-top-menu,
#header #_desktop_top_menu {
  display: flex !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: visible !important;
}

#header #top-menu.top-menu,
#header .top-menu[data-depth="0"] {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 0.15rem 0.1rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
  max-width: 100% !important;
}

#header .top-menu[data-depth="0"] > li {
  display: inline-flex !important;
  position: relative !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#header .top-menu[data-depth="0"] > li > a.dropdown-item,
#header .top-menu[data-depth="0"] > li > a {
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  padding: 0.45rem 0.55rem !important;
  margin: 0 !important;
  color: #f2f2f2 !important;
  font-weight: 700 !important;
  font-size: 0.82rem !important;
  letter-spacing: 0.02em !important;
  text-decoration: none !important;
  border-radius: 2px !important;
  float: none !important;
}

#header .top-menu[data-depth="0"] > li > a:hover {
  color: #e10600 !important;
  background: rgba(225, 6, 0, 0.08) !important;
}

/* Hide ALL nested / popover / collapse category dumps from header bar */
#header .top-menu .popover,
#header .top-menu .sub-menu,
#header .top-menu .js-sub-menu,
#header .top-menu .collapse,
#header .top-menu ul[data-depth="1"],
#header .top-menu ul[data-depth="2"],
#header .top-menu ul[data-depth="3"],
#header .top-menu .navbar-toggler,
#header .top-menu .collapse-icons,
#header .top-menu span.float-xs-right {
  display: none !important;
  visibility: hidden !important;
  position: absolute !important;
  left: -9999px !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Search stays on the right, doesn't get crushed by menu */
#header .sbc-hdr-tools #search_widget,
#header .sbc-hdr-tools .search-widget {
  flex: 0 0 auto !important;
  max-width: 220px !important;
  margin-left: 0.5rem !important;
}

@media (max-width: 991px) {
  #header .top-menu[data-depth="0"] > li > a {
    padding: 0.4rem 0.4rem !important;
    font-size: 0.75rem !important;
  }
}

/* Desktop only for desktop menu (mobile uses drawer) */
@media (max-width: 767px) {
  #header #_desktop_top_menu,
  #header .sbc-hdr-tools .menu.js-top-menu.hidden-sm-down {
    display: none !important;
  }
}


/* === SBC qty touchspin align fix 2026-07-23 === */
/* Quantity spinner: keep +/- beside the number, dark theme readable */
body#product .product-quantity,
body#product .js-product-add-to-cart .product-quantity {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0.75rem !important;
  float: none !important;
  clear: none !important;
}

body#product .product-quantity::before,
body#product .product-quantity::after {
  display: none !important;
  content: none !important;
}

body#product .product-quantity .qty,
body#product .js-product-add-to-cart .qty {
  display: inline-flex !important;
  align-items: center !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  vertical-align: middle !important;
}

/* Bootstrap TouchSpin wrapper (theme.js injects this around #quantity_wanted) */
body#product .bootstrap-touchspin,
body#product .qty .bootstrap-touchspin {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  float: none !important;
  width: auto !important;
  max-width: 100% !important;
  vertical-align: middle !important;
  border: 1px solid #3a3a3a !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  background: #151515 !important;
}

body#product .bootstrap-touchspin > input,
body#product .bootstrap-touchspin input.form-control,
body#product .bootstrap-touchspin input.input-group,
body#product #quantity_wanted,
body#product input#quantity_wanted {
  display: inline-block !important;
  float: none !important;
  width: 3.25rem !important;
  min-width: 3.25rem !important;
  max-width: 4rem !important;
  height: 44px !important;
  min-height: 44px !important;
  margin: 0 !important;
  padding: 0.35rem 0.25rem !important;
  text-align: center !important;
  border: 0 !important;
  border-left: 1px solid #3a3a3a !important;
  border-right: 1px solid #3a3a3a !important;
  border-radius: 0 !important;
  background: #151515 !important;
  background-color: #151515 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 1rem !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
}

/* Vertical button column on the RIGHT of the input (classic layout) */
body#product .bootstrap-touchspin .input-group-btn-vertical {
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  float: none !important;
  width: 2.25rem !important;
  min-width: 2.25rem !important;
  vertical-align: middle !important;
  white-space: normal !important;
}

body#product .bootstrap-touchspin .input-group-btn-vertical > .btn,
body#product .bootstrap-touchspin .btn-touchspin,
body#product .bootstrap-touchspin-up,
body#product .bootstrap-touchspin-down {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  float: none !important;
  width: 100% !important;
  min-height: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #1c1c1c !important;
  background-color: #1c1c1c !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: none !important;
  line-height: 1 !important;
  position: relative !important;
}

body#product .bootstrap-touchspin .bootstrap-touchspin-up {
  border-bottom: 1px solid #333 !important;
}

body#product .bootstrap-touchspin .btn-touchspin:hover,
body#product .bootstrap-touchspin-up:hover,
body#product .bootstrap-touchspin-down:hover {
  background: #e10600 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Material / chevron icons inside spin buttons */
body#product .bootstrap-touchspin .btn-touchspin i,
body#product .bootstrap-touchspin .input-group-btn-vertical i,
body#product .bootstrap-touchspin .material-icons {
  position: static !important;
  top: auto !important;
  left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  line-height: 1 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
}

/* If theme uses horizontal +/- on sides */
body#product .bootstrap-touchspin .input-group-btn {
  display: flex !important;
  align-items: stretch !important;
}

body#product .product-add-to-cart > .control-label,
body#product .js-product-add-to-cart > .control-label {
  display: block !important;
  color: #c8c8c8 !important;
  -webkit-text-fill-color: #c8c8c8 !important;
  margin-bottom: 0.4rem !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
}

body#product #product-availability,
body#product .js-product-availability {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}

body#product #product-availability .material-icons {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
  vertical-align: middle !important;
}

/* Sticky mobile bar: qty spin + add button in one row */
/* old mobile full-bar sticky replaced by 2026-07-23b */


/* === SBC checkout/cart dark theme 2026-07-23 === */
/* Force black panels through cart + multi-step checkout (classic modules often ship white cards) */

body#cart,
body#checkout,
body#order-confirmation,
body.page-cart,
body.page-order,
body.page-order-confirmation {
  background: #050505 !important;
  color: #f2f2f2 !important;
}

body#cart #wrapper,
body#checkout #wrapper,
body#cart #main,
body#checkout #main,
body#cart #content,
body#checkout #content,
body#cart #content-wrapper,
body#checkout #content-wrapper,
body#cart .page-content,
body#checkout .page-content,
body#cart .container,
body#checkout .container {
  background: transparent !important;
  color: #f2f2f2 !important;
}

/* Cards / panels used by cart + checkout summary */
body#cart .card,
body#checkout .card,
body#cart .card-block,
body#checkout .card-block,
body#cart .cart-container,
body#checkout .cart-grid,
body#cart .cart-grid-body,
body#checkout .cart-grid-body,
body#cart .cart-grid-right,
body#checkout .cart-grid-right,
body#cart .cart-summary,
body#checkout .js-cart,
body#checkout .cart-summary-products,
body#checkout .cart-summary-top,
body#checkout .cart-summary-subtotals-container,
body#checkout .cart-summary-totals,
body#cart .cart-detailed-totals,
body#cart .cart-overview,
body#cart .cart-item,
body#cart .cart-items,
body#checkout .checkout-step,
body#checkout .checkout-step.-current,
body#checkout .checkout-step.-reachable,
body#checkout .checkout-step.-complete,
body#checkout section.checkout-step,
body#checkout .content,
body#checkout .tab-content,
body#checkout .tab-pane,
body#checkout #checkout-personal-information-step,
body#checkout #checkout-addresses-step,
body#checkout #checkout-delivery-step,
body#checkout #checkout-payment-step,
body#checkout #delivery,
body#checkout #payment,
body#checkout .payment-options,
body#checkout .delivery-options,
body#checkout .delivery-option,
body#checkout .address,
body#checkout .address-item,
body#checkout .js-address-form,
body#checkout .js-address-selector,
body#checkout .order-options,
body#checkout .condition-label,
body#checkout #conditions-to-approve,
body#checkout .modal-content,
body#checkout .js-checkout-modal .modal-content,
body#cart .promo-code,
body#cart .block-promo,
body#checkout .block-promo,
body#cart .voucher,
/* payment / carrier module wrappers */
body#checkout [id*="payment"],
body#checkout [class*="payment-option"],
body#checkout [class*="payment_module"],
body#checkout .payment-option,
body#checkout .payment_module,
body#checkout #hook-display-after-carrier,
body#checkout .carrier-extra-content,
body#checkout .additional-information,
/* local pay / wire / check style modules */
body#checkout .sbc-localpay,
body#checkout .localpay,
body#checkout .ps_checkout,
body#checkout .paypal,
body#checkout #ps_checkout,
body#checkout .module_payment,
body#order-confirmation .card,
body#order-confirmation #content-hook_order_confirmation,
body#order-confirmation #order-details,
body#order-confirmation #order-items {
  background: #0d0d0d !important;
  background-color: #0d0d0d !important;
  background-image: none !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

/* Headings / labels / text */
body#cart h1, body#cart h2, body#cart h3, body#cart h4,
body#checkout h1, body#checkout h2, body#checkout h3, body#checkout h4,
body#cart .h1, body#cart .h3, body#checkout .h3,
body#checkout .step-title,
body#checkout .step-number,
body#checkout .step-edit,
body#cart label, body#checkout label,
body#cart .label, body#checkout .label,
body#cart .cart-summary-line,
body#checkout .cart-summary-line,
body#cart .product-line-info,
body#cart .product-price,
body#checkout .product-price,
body#cart a, body#checkout a,
body#cart .js-subtotal,
body#checkout .text-muted,
body#checkout .form-control-comment,
body#checkout .form-informations,
body#checkout .form-informations-title,
body#checkout .form-informations-option,
body#checkout .form-informations-subtitle {
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}

body#checkout .text-muted,
body#checkout .step-edit.text-muted,
body#checkout .form-control-comment,
body#checkout .form-informations-subtitle {
  color: #bdbdbd !important;
  -webkit-text-fill-color: #bdbdbd !important;
}

body#cart a:hover,
body#checkout a:hover,
body#checkout .step-edit:hover {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
}

/* Forms on checkout (personal info / addresses) */
body#cart input.form-control,
body#checkout input.form-control,
body#cart select.form-control,
body#checkout select.form-control,
body#cart textarea.form-control,
body#checkout textarea.form-control,
body#checkout input[type="text"],
body#checkout input[type="email"],
body#checkout input[type="password"],
body#checkout input[type="tel"],
body#checkout input[type="number"],
body#checkout textarea,
body#checkout select,
body#checkout #delivery_message,
body#checkout #gift_message,
body#cart .bootstrap-touchspin input {
  background: #151515 !important;
  background-color: #151515 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ffffff !important;
  border: 1px solid #3a3a3a !important;
}

body#checkout input::placeholder,
body#checkout textarea::placeholder,
body#cart input::placeholder {
  color: #9a9a9a !important;
  -webkit-text-fill-color: #9a9a9a !important;
}

body#checkout input:focus,
body#checkout select:focus,
body#checkout textarea:focus,
body#cart input:focus {
  border-color: #e10600 !important;
  box-shadow: 0 0 0 1px rgba(225,6,0,0.4) !important;
  outline: none !important;
}

body#checkout input:-webkit-autofill,
body#checkout input:-webkit-autofill:focus,
body#cart input:-webkit-autofill {
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 0 0 1000px #151515 inset !important;
  -webkit-box-shadow: 0 0 0 1000px #151515 inset !important;
}

/* Radio / checkbox delivery & payment options */
body#checkout .custom-radio,
body#checkout .custom-checkbox,
body#checkout .payment-option,
body#checkout .delivery-option,
body#checkout .address-item {
  background: #121212 !important;
  border: 1px solid #2a2a2a !important;
  color: #f2f2f2 !important;
}

body#checkout .delivery-option,
body#checkout .payment-option,
body#checkout .address-item {
  padding: 0.65rem 0.75rem !important;
  margin-bottom: 0.5rem !important;
  border-radius: 6px !important;
}

body#checkout .delivery-option:hover,
body#checkout .payment-option:hover,
body#checkout .address-item:hover {
  border-color: #e10600 !important;
}

body#checkout .custom-radio input[type="radio"] + span,
body#checkout .custom-checkbox input[type="checkbox"] + span {
  border-color: #666 !important;
  background: #151515 !important;
}

/* Step headers */
body#checkout .checkout-step .step-title {
  background: #0a0a0a !important;
  border-bottom: 1px solid #2a2a2a !important;
  color: #fff !important;
  padding: 0.85rem 1rem !important;
}

body#checkout .checkout-step {
  border: 1px solid #2a2a2a !important;
  border-radius: 8px !important;
  margin-bottom: 1rem !important;
  overflow: hidden !important;
}

body#checkout .checkout-step .content {
  padding: 1rem !important;
  background: #0d0d0d !important;
}

body#checkout .checkout-step.-unreachable {
  opacity: 0.72 !important;
}

/* Totals emphasize */
body#cart .cart-total,
body#checkout .cart-total,
body#cart .cart-summary-line.cart-total .value,
body#checkout .cart-summary-line.cart-total .value,
body#cart .product-price,
body#checkout .product-price {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
  font-weight: 800 !important;
}

/* Buttons */
body#cart .btn-primary,
body#checkout .btn-primary,
body#cart .checkout a.btn,
body#cart .cart-detailed-actions a,
body#checkout button[type="submit"],
body#checkout .continue,
body#cart .checkout {
  background: #e10600 !important;
  border-color: #e10600 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body#cart .btn-primary:hover,
body#checkout .btn-primary:hover {
  background: #ff1a1a !important;
  border-color: #ff1a1a !important;
}

body#cart .btn-secondary,
body#checkout .btn-secondary,
body#checkout .cancel-address,
body#cart .btn-tertiary {
  background: transparent !important;
  border: 1px solid #e10600 !important;
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
}

/* Tables / media lists in summary */
body#cart table,
body#checkout table,
body#cart .media,
body#checkout .media,
body#checkout #cart-summary-product-list,
body#checkout #order-items {
  background: #0d0d0d !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}

body#cart hr,
body#checkout hr {
  border-top-color: #2a2a2a !important;
}

/* Alert boxes */
body#cart .alert,
body#checkout .alert,
body#cart .notifications,
body#checkout #notifications {
  background: #151515 !important;
  color: #f2f2f2 !important;
  border-color: #3a3a3a !important;
}

/* Kill residual pure white panels from modules */
body#cart [style*="background: #fff"],
body#cart [style*="background:#fff"],
body#cart [style*="background: white"],
body#cart [style*="background-color: #fff"],
body#cart [style*="background-color:#fff"],
body#checkout [style*="background: #fff"],
body#checkout [style*="background:#fff"],
body#checkout [style*="background: white"],
body#checkout [style*="background-color: #fff"],
body#checkout [style*="background-color:#fff"],
body#checkout [style*="background-color: white"],
body#cart .bg-white,
body#checkout .bg-white,
body#cart .bg-light,
body#checkout .bg-light {
  background: #0d0d0d !important;
  background-color: #0d0d0d !important;
  color: #f2f2f2 !important;
}

/* Password strength meter on guest checkout */
body#checkout .password-strength-feedback,
body#checkout .password-requirements,
body#cart .password-strength-feedback {
  background: #111 !important;
  color: #ddd !important;
}

/* sbc_localpay module */
body#checkout .sbc_localpay,
body#checkout [class*="sbc-local"],
body#checkout [class*="localpay"],
body#checkout #sbc-localpay,
body#order-confirmation .sbc_localpay {
  background: #0d0d0d !important;
  color: #f2f2f2 !important;
  border: 1px solid #2a2a2a !important;
}


/* === SBC checkout form layout fix 2026-07-23 === */
/* Personal info / address forms: restore Bootstrap row columns so fields
   no longer overlap labels and helper text. */

body#checkout .checkout-step .content,
body#checkout #checkout-personal-information-step .content,
body#checkout #checkout-addresses-step .content,
body#checkout #checkout-delivery-step .content,
body#checkout #checkout-payment-step .content {
  position: relative !important;
  overflow: visible !important;
  display: block !important;
  padding: 1rem 1.1rem 1.25rem !important;
}

/* Guest / login forms */
body#checkout .js-customer-form,
body#checkout form.js-customer-form,
body#checkout .js-address-form,
body#checkout form.js-address-form {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
}

/* Each field row: label | input | comment */
body#checkout .form-group.row,
body#checkout .js-customer-form .form-group,
body#checkout .js-address-form .form-group {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  position: relative !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 1rem 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}

/* Bootstrap-like columns inside checkout forms */
body#checkout .form-group > .form-control-label,
body#checkout .form-group > label.form-control-label,
body#checkout .form-group > label.col-md-3,
body#checkout .form-group > .col-md-3.form-control-label {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  position: relative !important;
  float: none !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  display: block !important;
  margin: 0 0 0.35rem 0 !important;
  padding: 0 0.15rem !important;
  line-height: 1.35 !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  white-space: normal !important;
  z-index: 1 !important;
}

body#checkout .form-group > .js-input-column,
body#checkout .form-group > .col-md-6,
body#checkout .form-group > .col-md-6.js-input-column,
body#checkout .form-group > .form-control-valign {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  position: relative !important;
  float: none !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 1 !important;
}

/* Trailing comment column — stack under field, don't float over inputs */
body#checkout .form-group > .form-control-comment,
body#checkout .form-group > .col-md-3.form-control-comment {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  position: relative !important;
  float: none !important;
  display: block !important;
  margin: 0.25rem 0 0 0 !important;
  padding: 0 0.15rem !important;
  color: #bdbdbd !important;
  -webkit-text-fill-color: #bdbdbd !important;
  font-size: 0.8rem !important;
  line-height: 1.35 !important;
  z-index: 0 !important;
}

/* Helper text under inputs */
body#checkout .js-input-column > .form-control-comment,
body#checkout .js-input-column .form-control-comment {
  display: block !important;
  position: relative !important;
  float: none !important;
  width: 100% !important;
  margin-top: 0.3rem !important;
  color: #bdbdbd !important;
  -webkit-text-fill-color: #bdbdbd !important;
  font-size: 0.78rem !important;
  line-height: 1.35 !important;
}

/* Inputs fill their column only — no absolute overlap */
body#checkout .js-input-column .form-control,
body#checkout .js-input-column input.form-control,
body#checkout .js-input-column input[type="text"],
body#checkout .js-input-column input[type="email"],
body#checkout .js-input-column input[type="password"],
body#checkout .js-input-column input[type="tel"],
body#checkout .js-input-column input[type="number"],
body#checkout .js-input-column input[type="date"],
body#checkout .js-input-column select.form-control,
body#checkout .js-input-column textarea.form-control,
body#checkout .js-customer-form input.form-control,
body#checkout .js-address-form input.form-control {
  position: relative !important;
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 44px !important;
  height: auto !important;
  margin: 0 !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  box-sizing: border-box !important;
  z-index: 1 !important;
}

/* Password field with show/hide addon */
body#checkout .js-input-column .input-group,
body#checkout .input-group.js-parent-focus {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  float: none !important;
}

body#checkout .input-group .form-control,
body#checkout .input-group.js-parent-focus .form-control {
  flex: 1 1 auto !important;
  width: 1% !important; /* flex item grow */
  min-width: 0 !important;
  position: relative !important;
}

body#checkout .input-group-btn,
body#checkout .input-group .btn {
  position: relative !important;
  float: none !important;
  z-index: 2 !important;
  flex: 0 0 auto !important;
}

/* Gender radios */
body#checkout .form-control-valign,
body#checkout .js-input-column.form-control-valign {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.75rem 1.25rem !important;
  min-height: 44px !important;
}

body#checkout .radio-inline {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  margin: 0 !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  position: relative !important;
  float: none !important;
}

/* Create-account blurb */
body#checkout .form-informations {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  margin: 0.5rem 0 1rem 0 !important;
  padding: 0.75rem 0.85rem !important;
  background: #121212 !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 6px !important;
  color: #f2f2f2 !important;
}

body#checkout .form-footer {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  clear: both !important;
  margin-top: 1rem !important;
  float: none !important;
}

/* Desktop: label left, field right (readable two-column, no overlap) */
@media (min-width: 768px) {
  body#checkout .form-group.row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: flex-start !important;
  }
  body#checkout .form-group > .form-control-label,
  body#checkout .form-group > label.col-md-3,
  body#checkout .form-group > .col-md-3.form-control-label {
    flex: 0 0 28% !important;
    max-width: 28% !important;
    width: 28% !important;
    padding-right: 0.85rem !important;
    padding-top: 0.65rem !important;
    text-align: right !important;
  }
  body#checkout .form-group > .js-input-column,
  body#checkout .form-group > .col-md-6,
  body#checkout .form-group > .col-md-6.js-input-column,
  body#checkout .form-group > .form-control-valign {
    flex: 0 0 52% !important;
    max-width: 52% !important;
    width: 52% !important;
  }
  body#checkout .form-group > .form-control-comment,
  body#checkout .form-group > .col-md-3.form-control-comment {
    flex: 0 0 20% !important;
    max-width: 20% !important;
    width: 20% !important;
    padding-left: 0.65rem !important;
    padding-top: 0.65rem !important;
    margin-top: 0 !important;
  }
  /* When comment column is empty, still reserve space so layout stays stable */
  body#checkout .form-group > .col-md-3.form-control-comment:empty {
    min-height: 1px !important;
  }
}

/* Mobile: stack cleanly */
@media (max-width: 767px) {
  body#checkout .form-group.row {
    flex-direction: column !important;
  }
  body#checkout .form-group > .form-control-label,
  body#checkout .form-group > label.col-md-3 {
    text-align: left !important;
    padding-top: 0 !important;
  }
}

/* Tabs (sign in / create account) */
body#checkout .nav-tabs,
body#checkout .nav.nav-tabs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.35rem !important;
  border-bottom: 1px solid #2a2a2a !important;
  margin-bottom: 1rem !important;
  background: transparent !important;
}

body#checkout .nav-tabs .nav-item,
body#checkout .nav-tabs .nav-link {
  background: #151515 !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 4px 4px 0 0 !important;
  margin: 0 !important;
  position: relative !important;
  float: none !important;
}

body#checkout .nav-tabs .nav-link.active,
body#checkout .nav-tabs .nav-item.active .nav-link {
  background: #0d0d0d !important;
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
  border-bottom-color: #0d0d0d !important;
}

body#checkout .tab-content,
body#checkout .tab-pane {
  position: relative !important;
  float: none !important;
  width: 100% !important;
  display: block !important;
}

body#checkout .tab-pane:not(.active) {
  display: none !important;
}

body#checkout .tab-pane.active {
  display: block !important;
}


/* === SBC checkout unified black surfaces 2026-07-23 === */
/* Personal info / checkout was mixing #050505, #0a0a0a, #0d0d0d, #121212.
   Unify: page = #000, panels/steps/forms = #0a0a0a, inputs = #151515 only. */
:root {
  --sbc-chk-page: #000000;
  --sbc-chk-panel: #0a0a0a;
  --sbc-chk-field: #151515;
  --sbc-chk-border: #2a2a2a;
}

body#cart,
body#checkout,
body#order-confirmation {
  background: var(--sbc-chk-page) !important;
  background-color: var(--sbc-chk-page) !important;
}

body#cart #wrapper,
body#checkout #wrapper,
body#cart #main,
body#checkout #main,
body#cart #content-wrapper,
body#checkout #content-wrapper,
body#cart #content,
body#checkout #content,
body#cart .page-content,
body#checkout .page-content,
body#cart .container,
body#checkout .container,
body#cart .cart-grid,
body#checkout .cart-grid,
body#cart .cart-grid-body,
body#checkout .cart-grid-body,
body#cart .cart-grid-right,
body#checkout .cart-grid-right {
  background: transparent !important;
  background-color: transparent !important;
}

/* All checkout/cart panels same black */
body#cart .card,
body#checkout .card,
body#cart .card-block,
body#checkout .card-block,
body#cart .cart-container,
body#cart .cart-summary,
body#cart .cart-overview,
body#cart .cart-item,
body#cart .cart-items,
body#cart .cart-detailed-totals,
body#cart .cart-detailed-subtotals,
body#cart .cart-summary-totals,
body#cart .cart-detailed-actions,
body#checkout .js-cart,
body#checkout .cart-summary-top,
body#checkout .cart-summary-products,
body#checkout .cart-summary-subtotals-container,
body#checkout .cart-summary-totals,
body#checkout .checkout-step,
body#checkout .checkout-step.-current,
body#checkout .checkout-step.-reachable,
body#checkout .checkout-step.-complete,
body#checkout .checkout-step.-unreachable,
body#checkout section.checkout-step,
body#checkout .checkout-step .step-title,
body#checkout .checkout-step .content,
body#checkout .tab-content,
body#checkout .tab-pane,
body#checkout .tab-pane.active,
body#checkout .js-customer-form,
body#checkout form.js-customer-form,
body#checkout .js-address-form,
body#checkout .form-informations,
body#checkout .nav-tabs,
body#checkout .nav-tabs .nav-link,
body#checkout .nav-tabs .nav-link.active,
body#checkout .payment-options,
body#checkout .delivery-options,
body#checkout .delivery-option,
body#checkout .payment-option,
body#checkout .address,
body#checkout .address-item,
body#checkout .order-options,
body#checkout #conditions-to-approve,
body#checkout .condition-label,
body#checkout .additional-information,
body#checkout .carrier-extra-content,
body#checkout #hook-display-after-carrier,
body#checkout .modal-content,
body#checkout .js-checkout-modal .modal-content,
body#cart .promo-code,
body#cart .block-promo,
body#checkout .block-promo {
  background: var(--sbc-chk-panel) !important;
  background-color: var(--sbc-chk-panel) !important;
  background-image: none !important;
  border-color: var(--sbc-chk-border) !important;
}

/* Step title: same fill as body, only a bottom line for separation */
body#checkout .checkout-step .step-title {
  background: var(--sbc-chk-panel) !important;
  background-color: var(--sbc-chk-panel) !important;
  border-bottom: 1px solid var(--sbc-chk-border) !important;
  box-shadow: none !important;
}

body#checkout .checkout-step .content {
  background: var(--sbc-chk-panel) !important;
  background-color: var(--sbc-chk-panel) !important;
}

/* Tabs same panel color; active = red text only, not a different black */
body#checkout .nav-tabs {
  background: transparent !important;
  border-bottom: 1px solid var(--sbc-chk-border) !important;
}
body#checkout .nav-tabs .nav-item .nav-link,
body#checkout .nav-tabs .nav-link {
  background: var(--sbc-chk-panel) !important;
  background-color: var(--sbc-chk-panel) !important;
  border: 1px solid var(--sbc-chk-border) !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
}
body#checkout .nav-tabs .nav-link.active,
body#checkout .nav-tabs .nav-item .nav-link.active {
  background: var(--sbc-chk-panel) !important;
  background-color: var(--sbc-chk-panel) !important;
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
  border-color: #e10600 !important;
}

/* Create-account blurb same panel as form */
body#checkout .form-informations {
  background: var(--sbc-chk-panel) !important;
  background-color: var(--sbc-chk-panel) !important;
  border: 1px solid var(--sbc-chk-border) !important;
}

/* Only real form fields use the slightly lighter field black */
body#checkout input.form-control,
body#checkout select.form-control,
body#checkout textarea.form-control,
body#checkout input[type="text"],
body#checkout input[type="email"],
body#checkout input[type="password"],
body#checkout input[type="tel"],
body#checkout input[type="number"],
body#checkout textarea,
body#checkout select,
body#cart input.form-control,
body#cart select.form-control,
body#cart textarea.form-control {
  background: var(--sbc-chk-field) !important;
  background-color: var(--sbc-chk-field) !important;
}

/* Radio/checkbox rows on delivery/payment — same panel black, not a third shade */
body#checkout .delivery-option,
body#checkout .payment-option,
body#checkout .address-item,
body#checkout .custom-radio,
body#checkout .custom-checkbox {
  background: var(--sbc-chk-panel) !important;
  background-color: var(--sbc-chk-panel) !important;
}


/* === SBC product ATC layout fix 2026-07-23b === */
/*
  Only the qty + Add to cart row is sticky on mobile.
  Availability ("Last items in stock") and Share stay in normal page flow.
*/

/* Desktop / default: normal stacked layout */
body#product .product-add-to-cart,
body#product .product-add-to-cart.js-product-add-to-cart {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  top: auto !important;
  display: block !important;
  flex-wrap: unset !important;
  align-items: stretch !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 0 1rem 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  z-index: auto !important;
}

body#product .product-add-to-cart > .control-label {
  display: block !important;
  margin: 0 0 0.4rem 0 !important;
  color: #c8c8c8 !important;
  -webkit-text-fill-color: #c8c8c8 !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
}

body#product .product-add-to-cart .product-quantity {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0.75rem !important;
  width: 100% !important;
  margin: 0 0 0.75rem 0 !important;
  float: none !important;
  clear: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
}

body#product .product-add-to-cart .product-quantity .qty,
body#product .product-add-to-cart .product-quantity .bootstrap-touchspin {
  flex: 0 0 auto !important;
}

body#product .product-add-to-cart .product-quantity .add {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  float: none !important;
}

body#product .product-add-to-cart .product-quantity .add .add-to-cart {
  width: 100% !important;
  max-width: 280px !important;
  min-height: 48px !important;
}

/* wishlist-button unhidden — styled below */

/* Availability under qty/ATC — never beside the button */
body#product .product-add-to-cart > #product-availability,
body#product .product-add-to-cart > .js-product-availability,
body#product #product-availability,
body#product .js-product-availability {
  display: flex !important;
  align-items: center !important;
  gap: 0.35rem !important;
  position: relative !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  margin: 0.35rem 0 0.85rem 0 !important;
  padding: 0 !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  font-size: 0.92rem !important;
  line-height: 1.35 !important;
  white-space: normal !important;
}

body#product #product-availability .material-icons,
body#product .js-product-availability .material-icons {
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
  font-size: 1.15rem !important;
}

body#product .product-minimal-quantity {
  display: block !important;
  width: 100% !important;
  margin: 0 0 0.5rem 0 !important;
  color: #bdbdbd !important;
}

/* Share block: below availability, not in ATC row */
body#product .product-additional-info,
body#product .js-product-additional-info {
  display: block !important;
  position: relative !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  margin: 0.75rem 0 1.25rem 0 !important;
  padding: 0.75rem 0 0 0 !important;
  border-top: 1px solid #2a2a2a !important;
  background: transparent !important;
}

body#product .social-sharing {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.65rem 0.85rem !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #f2f2f2 !important;
}

body#product .social-sharing > span {
  color: #c8c8c8 !important;
  -webkit-text-fill-color: #c8c8c8 !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

body#product .social-sharing ul {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 0.5rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body#product .social-sharing li {
  display: inline-flex !important;
  margin: 0 !important;
  float: none !important;
}

body#product .social-sharing li a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 2.25rem !important;
  min-height: 2.25rem !important;
  padding: 0.35rem 0.55rem !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 4px !important;
  background: #151515 !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  text-indent: 0 !important;
  font-size: 0 !important; /* hide text-hide label; show via attr if needed */
  overflow: hidden !important;
}

/* classic uses text-hide — make labels readable on dark theme */
body#product .social-sharing li a.text-hide {
  font-size: 0.75rem !important;
  text-indent: 0 !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  width: auto !important;
  height: auto !important;
}

body#product .social-sharing li a:hover {
  border-color: #e10600 !important;
  color: #e10600 !important;
  -webkit-text-fill-color: #e10600 !important;
}

/* Mobile: sticky ONLY the qty+button row */
@media (max-width: 767px) {
  body#product .product-add-to-cart,
  body#product .product-add-to-cart.js-product-add-to-cart {
    position: relative !important;
    display: block !important;
    padding-bottom: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  body#product .product-add-to-cart > .control-label {
    display: block !important;
    margin-bottom: 0.35rem !important;
  }

  /* Sticky strip = product-quantity only */
  body#product .product-add-to-cart .product-quantity {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    z-index: 100050 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.65rem !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0.65rem 0.85rem calc(0.65rem + env(safe-area-inset-bottom)) !important;
    background: #000 !important;
    border-top: 1px solid #2a2a2a !important;
    box-shadow: 0 -10px 28px rgba(0,0,0,0.55) !important;
  }

  body#product .product-add-to-cart .product-quantity .add .add-to-cart {
    max-width: none !important;
    width: 100% !important;
  }

  /* wishlist-button unhidden — styled below */

  /* Availability + share remain in page content above the sticky bar */
  body#product .product-add-to-cart > #product-availability,
  body#product .product-add-to-cart > .js-product-availability,
  body#product #product-availability {
    display: flex !important;
    margin: 0.5rem 0 0.75rem 0 !important;
  }

  body#product .product-additional-info {
    display: block !important;
    margin: 0.5rem 0 5.5rem 0 !important; /* room above sticky ATC */
    padding-top: 0.75rem !important;
  }

  body#product #footer,
  body#product .sbc-product-chat,
  body#product .sbc-product-trust,
  body#product .tabs {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  body#product .product-actions,
  body#product #add-to-cart-or-refresh {
    padding-bottom: 0.25rem !important;
  }

  body#product .sbc-help-widget {
    bottom: 5.6rem !important;
  }
}

/* Desktop: never sticky */
@media (min-width: 768px) {
  body#product .product-add-to-cart .product-quantity {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
}


/* === SBC availability under ATC 2026-07-23c === */
/* Force stock line under Add to cart, never to the right */
body#product .product-add-to-cart,
body#product .product-add-to-cart.js-product-add-to-cart {
  display: block !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
}

body#product .product-add-to-cart > .product-quantity {
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  clear: both !important;
}

body#product .product-add-to-cart > #product-availability,
body#product .product-add-to-cart > .js-product-availability,
body#product .product-add-to-cart > .product-minimal-quantity {
  display: flex !important;
  flex: 0 0 100% !important;
  flex-basis: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  clear: both !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0.65rem !important;
  order: 3 !important;
}

body#product .product-add-to-cart > .control-label {
  display: block !important;
  width: 100% !important;
  order: 1 !important;
}

body#product .product-add-to-cart > .product-quantity {
  order: 2 !important;
}

body#product .product-additional-info {
  display: block !important;
  width: 100% !important;
  clear: both !important;
  float: none !important;
  margin-top: 0.85rem !important;
}


/* === SBC wishlist heart ATC align 2026-07-23 === */
/* Heart sits in the qty/ATC row, vertically centered, readable on dark theme */

body#product .product-add-to-cart .product-quantity {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0.65rem !important;
}

body#product .product-add-to-cart .product-quantity .qty {
  flex: 0 0 auto !important;
  order: 1 !important;
}

body#product .product-add-to-cart .product-quantity .add {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  order: 2 !important;
  display: flex !important;
  align-items: center !important;
}

body#product .product-add-to-cart .product-quantity .add .add-to-cart {
  width: 100% !important;
  max-width: 280px !important;
  min-height: 48px !important;
  height: 48px !important;
  margin: 0 !important;
}

/* Wishlist host + rendered button */
body#product .product-add-to-cart .wishlist-button,
body#product .product-add-to-cart .product-quantity .wishlist-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  order: 3 !important;
  float: none !important;
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  vertical-align: middle !important;
  background: transparent !important;
  border: 0 !important;
}

body#product .wishlist-button-add,
body#product .wishlist-button-add.wishlist-button-product,
body#product .product-add-to-cart .wishlist-button-add,
body#product .product-quantity .wishlist-button-add {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  margin: 0 0 0 0 !important;
  margin-left: 0 !important;
  padding: 0 !important;
  border: 1px solid #3a3a3a !important;
  border-radius: 4px !important;
  background: #151515 !important;
  background-color: #151515 !important;
  color: #e10600 !important;
  box-shadow: none !important;
  float: none !important;
  position: relative !important;
  top: auto !important;
  right: auto !important;
  vertical-align: middle !important;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease !important;
}

body#product .wishlist-button-add:hover,
body#product .wishlist-button-add.wishlist-button-product:hover {
  background: #1c1c1c !important;
  border-color: #e10600 !important;
  opacity: 1 !important;
  transform: none !important;
}

body#product .wishlist-button-add:focus {
  outline: 1px solid #e10600 !important;
  outline-offset: 1px !important;
}

body#product .wishlist-button-add i,
body#product .wishlist-button-add .material-icons,
body#product .wishlist-button-add svg,
body#product .wishlist-button-product i {
  color: #e10600 !important;
  fill: #e10600 !important;
  font-size: 22px !important;
  line-height: 1 !important;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Hide any white text label next to heart if module injects one */
body#product .wishlist-button-add span:not(.material-icons),
body#product .wishlist-button .wishlist-button-add + span,
body#product .wishlist-button span:not([class*="material"]):not(.sr-only) {
  /* keep icon-only control */
}

/* Mobile sticky qty row: keep heart aligned with button height */
@media (max-width: 767px) {
  body#product .product-add-to-cart .product-quantity {
    align-items: center !important;
  }
  body#product .product-add-to-cart .product-quantity .add .add-to-cart {
    max-width: none !important;
    height: 48px !important;
  }
  body#product .product-add-to-cart .wishlist-button,
  body#product .wishlist-button-add {
    width: 48px !important;
    height: 48px !important;
  }
}

/* Wishlist modals readable on dark theme */
.wishlist-modal .modal-content,
.wishlist-modal .modal-header,
.wishlist-modal .modal-body,
.wishlist-modal .modal-footer {
  background: #0a0a0a !important;
  color: #f2f2f2 !important;
  border-color: #2a2a2a !important;
}
.wishlist-modal .modal-header h5,
.wishlist-modal .modal-text,
.wishlist-modal .close {
  color: #f2f2f2 !important;
}
.wishlist-modal .modal-body .form-control {
  background: #151515 !important;
  color: #fff !important;
  border-color: #3a3a3a !important;
}

/* ========== Branded social share buttons (X / Facebook / Pinterest) ========== */
.social-sharing.sbc-social-sharing,
.sbc-social-sharing {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.75rem;
  margin: 0.75rem 0 0.25rem;
  padding: 0;
}

.sbc-social-sharing .sbc-share-label {
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #cfcfcf;
  margin-right: 0.15rem;
}

.sbc-social-sharing ul.sbc-share-list,
.sbc-social-sharing ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.sbc-social-sharing li.sbc-share-item {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  background: none !important;
  background-image: none !important;
  width: auto !important;
  height: auto !important;
  float: none !important;
}

/* Kill classic theme text-only / sprite share styles */
.sbc-social-sharing li a,
.social-sharing.sbc-social-sharing li a {
  background-image: none !important;
  text-indent: 0 !important;
  overflow: visible !important;
  font-size: inherit !important;
}

.sbc-share-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 40px;
  min-width: 40px;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  border: 1px solid transparent;
  text-decoration: none !important;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  color: #fff !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease, background 0.15s ease;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.sbc-share-btn:hover,
.sbc-share-btn:focus {
  transform: translateY(-1px);
  filter: brightness(1.08);
  color: #fff !important;
  text-decoration: none !important;
  outline: 2px solid rgba(255, 255, 255, 0.35);
  outline-offset: 2px;
}

.sbc-share-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
}

.sbc-share-icon svg {
  display: block;
  width: 18px;
  height: 18px;
}

.sbc-share-text {
  display: inline-block;
  white-space: nowrap;
}

/* Icon-only on very narrow product columns */
@media (max-width: 420px) {
  .sbc-share-btn {
    padding: 0.45rem;
    min-width: 42px;
    min-height: 42px;
  }
  .sbc-share-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
  }
  .sbc-share-btn {
    position: relative;
  }
}

/* Facebook brand */
.sbc-share-btn.sbc-share-facebook,
.sbc-share-item.facebook .sbc-share-btn {
  background: #1877F2 !important;
  border-color: #166fe5 !important;
}
.sbc-share-btn.sbc-share-facebook:hover {
  background: #166fe5 !important;
}

/* X (Twitter) brand — black logo button */
.sbc-share-btn.sbc-share-twitter,
.sbc-share-item.twitter .sbc-share-btn {
  background: #000000 !important;
  border-color: #333333 !important;
  color: #ffffff !important;
}
.sbc-share-btn.sbc-share-twitter:hover {
  background: #141414 !important;
}

/* Pinterest brand */
.sbc-share-btn.sbc-share-pinterest,
.sbc-share-item.pinterest .sbc-share-btn {
  background: #E60023 !important;
  border-color: #c7001e !important;
}
.sbc-share-btn.sbc-share-pinterest:hover {
  background: #c7001e !important;
}

/* Legacy class hooks from classic (background sprites) — neutralize */
.social-sharing li.facebook,
.social-sharing li.twitter,
.social-sharing li.pinterest {
  background-image: none !important;
}

/* ========== Product image gallery viewer (2026-07-24 modal3) ========== */
/* Above sticky ATC / help / header; centered in viewport; single gallery stage */

body.modal-open #header,
body.modal-open #header .header-top,
body.modal-open #_desktop_top_menu,
body.modal-open .sbc-sticky-atc,
body.modal-open .sbc-help-widget,
body.modal-open .sbc-help-fab {
  /* Keep site chrome under the full-screen viewer */
  z-index: 1 !important;
}

#product-modal.sbc-product-images-modal,
#product-modal.sbc-product-images-modal.show,
#product-modal.sbc-product-images-modal.in,
#product-modal.sbc-product-images-modal.fade.show {
  position: fixed !important;
  inset: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 200100 !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  background: rgba(0, 0, 0, 0.88) !important;
  overflow: hidden !important;
  padding: max(12px, env(safe-area-inset-top, 0px)) 12px max(12px, env(safe-area-inset-bottom, 0px)) !important;
  margin: 0 !important;
  transform: none !important;
}

#product-modal.sbc-product-images-modal.fade:not(.show):not(.in) {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

#product-modal .modal-dialog,
#product-modal .sbc-product-modal-dialog {
  position: relative !important;
  max-width: min(960px, 96vw) !important;
  width: 100% !important;
  margin: 0 auto !important;
  max-height: min(90vh, 920px) !important;
  height: auto !important;
  pointer-events: auto !important;
  z-index: 200101 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  transform: none !important;
  top: auto !important;
}

#product-modal .modal-content,
#product-modal .sbc-product-modal-content {
  background: #111 !important;
  color: #f2f2f2 !important;
  border: 1px solid #333 !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.6) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  max-height: min(90vh, 920px) !important;
  width: 100% !important;
  margin: 0 !important;
}

.sbc-product-modal-header {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex: 0 0 auto !important;
  position: relative !important;
  top: auto !important;
  padding: 0.65rem 0.85rem !important;
  border-bottom: 1px solid #2a2a2a !important;
  background: #0d0d0d !important;
  z-index: 2;
}

.sbc-product-modal-title {
  margin: 0 !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  color: #f2f2f2 !important;
  line-height: 1.25 !important;
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sbc-product-modal-header-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  flex: 0 0 auto;
}

.sbc-product-modal-counter {
  font-size: 0.8rem;
  font-weight: 700;
  color: #cfcfcf;
  white-space: nowrap;
}

.sbc-product-modal-close,
#product-modal .close.sbc-product-modal-close {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  margin: 0 !important;
  padding: 0.35rem 0.7rem !important;
  min-height: 40px;
  min-width: 40px;
  border: 1px solid #e10600 !important;
  border-radius: 8px !important;
  background: #e10600 !important;
  color: #fff !important;
  opacity: 1 !important;
  float: none !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  text-shadow: none !important;
  box-shadow: 0 2px 8px rgba(225, 6, 0, 0.35);
  z-index: 3;
}

.sbc-product-modal-close:hover,
.sbc-product-modal-close:focus {
  filter: brightness(1.08);
  color: #fff !important;
  outline: 2px solid rgba(255, 255, 255, 0.45);
  outline-offset: 2px;
}

.sbc-product-modal-close-x {
  font-size: 1.55rem;
  font-weight: 700;
  line-height: 0.8;
}

.sbc-product-modal-close-text {
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

#product-modal .modal-body,
#product-modal .sbc-product-modal-body {
  background: #111 !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important; /* stage + thumbs layout; no nested page scroll */
  display: flex !important;
  flex-direction: column !important;
  gap: 0.65rem;
  padding: 0.75rem !important;
}

/* Main photo stage — centered */
.sbc-product-modal-stage {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  background: #0a0a0a;
  border-radius: 8px;
  overflow: hidden;
}

.sbc-product-modal-figure {
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
  width: 100%;
  min-width: 0;
  height: 100%;
  max-height: min(58vh, 560px);
  float: none !important;
}

#product-modal .product-cover-modal,
#product-modal .js-modal-product-cover,
.sbc-product-modal-cover {
  display: block !important;
  max-width: 100% !important;
  max-height: min(58vh, 560px) !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  background: #0a0a0a !important;
  pointer-events: none; /* clicks go to stage / nav, not stuck on img */
}

.sbc-product-modal-nav {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid #3a3a3a;
  background: rgba(20, 20, 20, 0.92);
  color: #fff;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 4;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

.sbc-product-modal-nav:hover,
.sbc-product-modal-nav:focus {
  background: #e10600;
  border-color: #e10600;
  outline: none;
}

/* Thumb strip under stage — always visible, horizontal */
#product-modal #thumbnails,
#product-modal aside.thumbnails,
#product-modal .js-thumbnails,
.sbc-product-modal-thumbs {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
}

#product-modal .js-modal-mask,
#product-modal .sbc-product-modal-mask {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
}

#product-modal .js-modal-product-images,
#product-modal ul.product-images,
.sbc-product-modal-thumbs-list {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 0.5rem;
  list-style: none !important;
  margin: 0 !important;
  padding: 0.15rem 0 0.35rem !important;
  width: max-content !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

#product-modal .js-modal-product-images .thumb-container,
#product-modal .js-modal-product-images li {
  display: inline-flex !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto;
}

.sbc-product-modal-thumb-btn {
  display: inline-flex;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  border-radius: 8px;
  line-height: 0;
}

#product-modal .js-modal-thumb,
#product-modal .js-modal-product-images .thumb {
  width: 72px !important;
  height: 72px !important;
  object-fit: cover !important;
  border: 2px solid #333 !important;
  border-radius: 8px !important;
  cursor: pointer !important;
  background: #0a0a0a !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

#product-modal .js-modal-thumb:hover,
#product-modal .js-modal-thumb.selected,
#product-modal .js-modal-product-images .thumb.selected,
.sbc-product-modal-thumb-btn:focus .js-modal-thumb {
  border-color: #e10600 !important;
  box-shadow: 0 0 0 1px #e10600;
}

#product-modal .js-modal-arrows,
#product-modal .arrows.js-modal-arrows {
  display: none !important;
}

.sbc-product-modal-footer {
  display: flex !important;
  justify-content: center;
  flex: 0 0 auto !important;
  position: relative !important;
  padding: 0.7rem !important;
  border-top: 1px solid #2a2a2a !important;
  background: #0d0d0d !important;
}

.sbc-product-modal-done,
#product-modal .sbc-product-modal-done {
  background: #e10600 !important;
  border-color: #e10600 !important;
  color: #fff !important;
  font-weight: 700 !important;
  min-height: 44px;
  min-width: 160px;
  border-radius: 8px !important;
  padding: 0.55rem 1.25rem !important;
}

@media (max-width: 575px) {
  .sbc-product-modal-close-text { display: inline !important; }
  .sbc-product-modal-nav {
    width: 38px;
    height: 38px;
    font-size: 1.15rem;
  }
  .sbc-product-modal-figure,
  #product-modal .product-cover-modal,
  #product-modal .js-modal-product-cover {
    max-height: min(46vh, 420px) !important;
  }
  #product-modal .js-modal-thumb {
    width: 60px !important;
    height: 60px !important;
  }
}

/* ========== Product modal thumbs fix (2026-07-24 modal4) ========== */
/* Classic theme uses #product-modal ... margin-left:-35% + vertical side rail.
   That clips our stacked gallery so only the first/selected thumb appears.
   Fully reset modal body layout and show ALL thumbs in a horizontal strip. */

#product-modal.sbc-product-images-modal .modal-content {
  padding: 0 !important;
  background: #111 !important;
  border: 1px solid #333 !important;
}

#product-modal.sbc-product-images-modal .modal-content .modal-body,
#product-modal.sbc-product-images-modal .sbc-product-modal-body {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  margin: 0 !important;
  margin-left: 0 !important; /* kill classic -35% side-rail offset */
  margin-right: 0 !important;
  padding: 0.75rem !important;
  width: 100% !important;
  max-width: 100% !important;
  left: auto !important;
  right: auto !important;
  position: relative !important;
  overflow: hidden !important;
  gap: 0.65rem !important;
}

/* Stage / main image — full width, not side-by-side with thumbs */
#product-modal.sbc-product-images-modal .sbc-product-modal-stage {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
  min-height: 200px !important;
  position: relative !important;
}

#product-modal.sbc-product-images-modal .sbc-product-modal-figure,
#product-modal.sbc-product-images-modal .modal-body figure {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  float: none !important;
  position: relative !important;
  left: auto !important;
}

#product-modal.sbc-product-images-modal .modal-content .modal-body .product-cover-modal,
#product-modal.sbc-product-images-modal .js-modal-product-cover {
  width: auto !important;
  max-width: 100% !important;
  max-height: min(52vh, 520px) !important;
  height: auto !important;
  background: #0a0a0a !important;
  margin: 0 auto !important;
}

/* Thumbnail rail — full width under image, all thumbs visible */
#product-modal.sbc-product-images-modal .modal-content .modal-body .thumbnails,
#product-modal.sbc-product-images-modal #thumbnails,
#product-modal.sbc-product-images-modal .sbc-product-modal-thumbs,
#product-modal.sbc-product-images-modal .js-thumbnails {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 84px !important;
  height: auto !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  overflow: visible !important;
  flex: 0 0 auto !important;
  z-index: 5 !important;
}

#product-modal.sbc-product-images-modal .modal-content .modal-body .mask,
#product-modal.sbc-product-images-modal .js-modal-mask,
#product-modal.sbc-product-images-modal .sbc-product-modal-mask {
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
  min-height: 80px !important;
  margin: 0 !important;
  margin-top: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
}

#product-modal.sbc-product-images-modal .modal-content .modal-body .product-images,
#product-modal.sbc-product-images-modal .js-modal-product-images,
#product-modal.sbc-product-images-modal .sbc-product-modal-thumbs-list {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  gap: 0.5rem !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0.25rem 0 !important;
  width: max-content !important;
  min-width: 100% !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  transform: none !important; /* classic velocity translateY for vertical rail */
  position: relative !important;
  top: auto !important;
  left: auto !important;
}

#product-modal.sbc-product-images-modal .modal-content .modal-body .product-images > li,
#product-modal.sbc-product-images-modal .js-modal-product-images .thumb-container,
#product-modal.sbc-product-images-modal .js-thumb-container {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  float: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: 0 0 auto !important;
  position: relative !important;
  transform: none !important;
}

#product-modal.sbc-product-images-modal .sbc-product-modal-thumb-btn {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: transparent !important;
  cursor: pointer !important;
  line-height: 0 !important;
}

#product-modal.sbc-product-images-modal .modal-content .modal-body .product-images img,
#product-modal.sbc-product-images-modal .js-modal-thumb,
#product-modal.sbc-product-images-modal .modal-body .thumb {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 76px !important;
  min-width: 76px !important;
  height: 76px !important;
  max-width: 76px !important;
  object-fit: cover !important;
  cursor: pointer !important;
  background: #0a0a0a !important;
  border: 2px solid #444 !important;
  border-radius: 8px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

#product-modal.sbc-product-images-modal .js-modal-thumb.selected,
#product-modal.sbc-product-images-modal .js-modal-thumb.js-thumb-selected,
#product-modal.sbc-product-images-modal .modal-content .modal-body .product-images img.selected {
  border-color: #e10600 !important;
  border-width: 3px !important;
  box-shadow: 0 0 0 1px #e10600;
}

#product-modal.sbc-product-images-modal .modal-content .modal-body .product-images img:hover {
  border-color: #e10600 !important;
}

/* Hide classic vertical arrow chrome completely */
#product-modal.sbc-product-images-modal .modal-content .modal-body .arrows,
#product-modal.sbc-product-images-modal .js-modal-arrows {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Caption (if any) should not steal layout */
#product-modal.sbc-product-images-modal .image-caption {
  display: none !important;
}

/* ========== Product chat capital UI (2026-07-24) ========== */
.sbc-social-proof {
  margin: 0 0 0.65rem;
  padding: 0.45rem 0.65rem;
  border: 1px solid #2a2a2a;
  border-radius: 8px;
  background: #141414;
  color: #cfcfcf;
  font-size: 0.86rem;
}
.sbc-chat-ctas, .sbc-intent-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0.65rem 0 0.35rem;
}
.sbc-cta-chip, .sbc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid #3a3a3a;
  background: #1a1a1a;
  color: #f2f2f2 !important;
  font-size: 0.8rem;
  font-weight: 700;
  padding: 0.4rem 0.75rem;
  cursor: pointer;
  text-decoration: none !important;
}
.sbc-cta-chip:hover, .sbc-btn:hover {
  border-color: #e10600;
  color: #fff !important;
}
.sbc-cta-mini { font-size: 0.75rem; padding: 0.3rem 0.6rem; margin-top: 0.4rem; }
.sbc-chat-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.sbc-btn-live {
  background: #e10600 !important;
  border-color: #e10600 !important;
  color: #fff !important;
}
.sbc-btn-ghost {
  background: transparent !important;
}
.sbc-lead-form {
  margin-top: 0.85rem;
  padding: 0.75rem;
  border: 1px solid #2a2a2a;
  border-radius: 10px;
  background: #111;
  display: grid;
  gap: 0.45rem;
}
.sbc-lead-form-title {
  font-weight: 700;
  color: #f2f2f2;
  margin-bottom: 0.2rem;
}
.sbc-lead-form input,
.sbc-lead-form textarea {
  width: 100%;
  background: #0d0d0d !important;
  color: #f2f2f2 !important;
  border: 1px solid #333 !important;
  border-radius: 8px;
  padding: 0.5rem 0.65rem;
}
.sbc-lead-form-actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.sbc-lead-status {
  color: #9fef9f;
  font-size: 0.85rem;
  margin: 0.25rem 0 0;
}
.sbc-product-faq {
  margin: 1.25rem 0 0.5rem;
  padding: 1rem;
  border: 1px solid #2a2a2a;
  border-radius: 12px;
  background: #0d0d0d;
}
.sbc-product-faq h3 {
  margin: 0 0 0.35rem;
  color: #f2f2f2;
  font-size: 1.1rem;
}
.sbc-faq-hint {
  color: #9a9a9a;
  font-size: 0.86rem;
  margin: 0 0 0.75rem;
}
.sbc-faq-item {
  border-top: 1px solid #2a2a2a;
  padding: 0.55rem 0;
}
.sbc-faq-item summary {
  cursor: pointer;
  font-weight: 700;
  color: #f2f2f2;
}
.sbc-faq-a {
  margin-top: 0.4rem;
  color: #cfcfcf;
  line-height: 1.45;
  font-size: 0.92rem;
}

/* ========== FirstChair AI duo layout (equal columns) ========== */
.sbc-ai-duo {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1rem !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 1.5rem 0 1rem !important;
  align-items: stretch !important;
  clear: both !important;
  box-sizing: border-box;
}

.sbc-ai-duo > .sbc-thoughts,
.sbc-ai-duo > .sbc-product-chat {
  min-width: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  box-sizing: border-box;
  padding: 1rem !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 12px !important;
  background: #0d0d0d !important;
}

/* Kill old "under photo" stacking constraints */
.sbc-thoughts--under-photo,
.sbc-thoughts--duo {
  position: relative !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
}

.sbc-ai-duo .sbc-thoughts-kicker {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #e10600;
  margin-bottom: 0.35rem;
}

.sbc-ai-duo h3 {
  margin: 0 0 0.5rem !important;
  font-size: 1.05rem !important;
  line-height: 1.25 !important;
  color: #f2f2f2 !important;
}

.sbc-ai-duo .sbc-thoughts-body {
  flex: 1 1 auto !important;
  min-height: 200px;
  max-height: 420px;
  overflow: auto;
  color: #cfcfcf !important;
  font-size: 0.92rem;
  line-height: 1.45;
}

.sbc-ai-duo .sbc-chat-hint {
  font-size: 0.82rem !important;
  color: #9a9a9a !important;
  margin: 0 0 0.5rem !important;
}

.sbc-ai-duo .sbc-product-chat-log {
  flex: 1 1 auto !important;
  min-height: 200px !important;
  max-height: 280px !important;
  overflow-y: auto !important;
  margin-bottom: 0.5rem !important;
}

.sbc-ai-duo .sbc-product-chat-form {
  flex: 0 0 auto;
}

.sbc-ai-duo .sbc-chat-ctas,
.sbc-ai-duo .sbc-chat-actions,
.sbc-ai-duo .sbc-lead-form {
  flex: 0 0 auto;
}

/* FAQ / trust sit full width under the duo */
.sbc-product-faq,
.sbc-product-trust {
  width: 100%;
  clear: both;
}

@media (max-width: 991px) {
  .sbc-ai-duo {
    grid-template-columns: 1fr !important;
  }
  .sbc-ai-duo .sbc-thoughts-body,
  .sbc-ai-duo .sbc-product-chat-log {
    max-height: 320px !important;
  }
}

/* ========== Product FAQ full answers (SEO) ========== */
.sbc-product-faq {
  margin: 1.25rem 0 1rem !important;
  padding: 1.1rem 1.15rem !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 12px !important;
  background: #0d0d0d !important;
  color: #f2f2f2 !important;
}
.sbc-product-faq h3 {
  margin: 0 0 0.35rem !important;
  color: #f2f2f2 !important;
  font-size: 1.2rem !important;
}
.sbc-faq-hint {
  color: #9a9a9a !important;
  font-size: 0.88rem !important;
  margin: 0 0 0.9rem !important;
}
.sbc-faq-item,
.sbc-faq-item--open {
  border-top: 1px solid #2a2a2a !important;
  padding: 0.85rem 0 !important;
  display: block !important;
}
.sbc-faq-item:first-child {
  border-top: 0 !important;
  padding-top: 0.2rem !important;
}
.sbc-faq-q {
  margin: 0 0 0.45rem !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.3 !important;
}
.sbc-faq-a {
  margin: 0 !important;
  color: #d8d8d8 !important;
  line-height: 1.55 !important;
  font-size: 0.95rem !important;
  white-space: pre-wrap;
}
.sbc-faq-a [itemprop="text"] {
  color: #d8d8d8 !important;
}
.sbc-faq-source {
  margin: 0.45rem 0 0 !important;
  font-size: 0.75rem !important;
  color: #888 !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
/* legacy details styles no longer primary */
.sbc-faq-item summary {
  display: none !important;
}

/* ========== Product Details tab — red bg, white text ========== */
body#product .tabs .nav-tabs .nav-link,
body#product .nav-tabs .nav-link {
  background: #1a1a1a !important;
  border: 1px solid #333 !important;
  color: #f2f2f2 !important;
  -webkit-text-fill-color: #f2f2f2 !important;
  font-weight: 700 !important;
  border-radius: 8px 8px 0 0 !important;
  padding: 0.55rem 1rem !important;
  margin-right: 0.25rem;
}

/* Active tab (Product Details / Description / etc.) */
body#product .tabs .nav-tabs .nav-link.active,
body#product .tabs .nav-tabs .nav-link.js-product-nav-active,
body#product .nav-tabs .nav-link.active,
body#product .nav-tabs .nav-link.js-product-nav-active,
body#product a.nav-link[href="#product-details"].active,
body#product a.nav-link[href="#product-details"].js-product-nav-active,
body#product .tabs .nav-item .nav-link.active {
  background: #E30613 !important;
  border-color: #E30613 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

body#product .tabs .nav-tabs .nav-link:hover,
body#product .nav-tabs .nav-link:hover {
  background: #2a2a2a !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #E30613 !important;
}

body#product .tabs .nav-tabs .nav-link.active:hover,
body#product .nav-tabs .nav-link.active:hover {
  background: #c00510 !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #c00510 !important;
}

/* Accent under Product Details panel */
body#product #product-details {
  border-top: 3px solid #E30613;
}

/* ========== Homepage trust badges — centered ========== */
body#index .sbc-trust-badges,
.sbc-home .sbc-trust-badges,
.sbc-hero .sbc-trust-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-items: stretch !important;
  gap: 0.75rem !important;
  margin: 1.5rem auto 0 !important;
  width: 100% !important;
  max-width: 920px !important;
  text-align: center !important;
}

body#index .sbc-trust-badges .sbc-badge,
.sbc-home .sbc-trust-badges .sbc-badge,
.sbc-hero .sbc-badge {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  min-width: 8.5rem !important;
  max-width: 11rem;
  flex: 0 1 auto !important;
  padding: 0.7rem 0.9rem !important;
  margin: 0 !important;
  float: none !important;
}

body#index .sbc-badge strong,
.sbc-hero .sbc-badge strong {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  color: #E30613 !important;
  -webkit-text-fill-color: #E30613 !important;
}

body#index .sbc-badge span,
.sbc-hero .sbc-badge span {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
}

/* Keep hero inner content centered as a block */
body#index .sbc-hero-inner,
.sbc-hero-inner {
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

@media (max-width: 767px) {
  body#index .sbc-trust-badges,
  .sbc-hero .sbc-trust-badges {
    justify-content: center !important;
    gap: 0.55rem !important;
  }
  body#index .sbc-trust-badges .sbc-badge {
    min-width: calc(50% - 0.55rem) !important;
    max-width: none;
    flex: 1 1 calc(50% - 0.55rem) !important;
  }
}


/* ---- D'Addario Playback partner strip (footer) ---- */
.sbc-playback {
  display: flex;
  align-items: center;
  gap: 1.1rem 1.35rem;
  flex-wrap: wrap;
  margin: 0.5rem 0 0.25rem;
  padding: 1.1rem 0 0.35rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.sbc-playback-logo-link {
  display: inline-flex;
  flex: 0 0 auto;
  line-height: 0;
  border-radius: 6px;
  background: transparent;
  padding: 0.15rem 0;
}
.sbc-playback-logo {
  display: block;
  width: 110px;
  height: auto;
  max-height: 72px;
  object-fit: contain;
}
.sbc-playback-copy {
  flex: 1 1 220px;
  min-width: 0;
}
.sbc-playback-title {
  color: #f2f2f2 !important;
  font-weight: 800;
  font-size: 0.82rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin: 0 0 0.35rem;
}
.sbc-playback-desc {
  margin: 0 0 0.4rem !important;
  font-size: 0.88rem !important;
  line-height: 1.45;
  color: #a8a8a8 !important;
  max-width: 46rem;
}
.sbc-playback-links {
  margin: 0 !important;
  font-size: 0.84rem !important;
}
.sbc-playback-links a {
  color: #ddd !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.sbc-playback-links a:hover {
  color: var(--sbc-red, #e10600) !important;
}
.sbc-playback-sep {
  margin: 0 0.45rem;
  color: #666;
}
@media (max-width: 575px) {
  .sbc-playback {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
  }
  .sbc-playback-logo {
    width: 96px;
  }
}