/* BongoBong Farbwelten — runtime token overrides + visitor control. */

html.bb-theme-jungle {
  --bb-bg: #123722;
  --bb-bg-2: #0d2c1a;
  --bb-surface: #1a4229;
  --bb-ink: #f4f1e2;
  --bb-ink-2: #cfd8c4;
  --bb-muted: #9bb7a3;
  --bb-muted-text: #b7c9ba;
  --bb-line: rgba(244, 241, 226, .18);
  --bb-line-2: rgba(244, 241, 226, .09);
  --bb-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 18px 44px -20px rgba(0, 0, 0, .55);
  color-scheme: dark;
  background: var(--bb-bg);
}

html.bb-theme-jungle body,
html.bb-theme-jungle #main-wrapper,
html.bb-theme-jungle #content-wrapper {
  background: var(--bb-bg);
  color: var(--bb-ink);
}

html.bb-theme-jungle .bb-section { padding-block: clamp(42px, 5.4vw, 66px); }
html.bb-theme-jungle a:not(.btn):hover { color: var(--bb-y); }
html.bb-theme-jungle h1,
html.bb-theme-jungle h2,
html.bb-theme-jungle h3,
html.bb-theme-jungle h4,
html.bb-theme-jungle h5,
html.bb-theme-jungle h6,
html.bb-theme-jungle .bb-disp { color: var(--bb-ink); }

/* JTL/Bootstrap surfaces that still carry compiled light-theme colors. */
html.bb-theme-jungle .card,
html.bb-theme-jungle .modal-content,
html.bb-theme-jungle .dropdown-menu,
html.bb-theme-jungle .list-group-item,
html.bb-theme-jungle .table,
html.bb-theme-jungle .table th,
html.bb-theme-jungle .table td,
html.bb-theme-jungle .form-control,
html.bb-theme-jungle .custom-select,
html.bb-theme-jungle .input-group-text,
html.bb-theme-jungle .pagination .page-link,
html.bb-theme-jungle .breadcrumb,
html.bb-theme-jungle .nav-tabs .nav-link.active {
  background-color: var(--bb-surface);
  border-color: var(--bb-line);
  color: var(--bb-ink);
}
html.bb-theme-jungle .form-control::placeholder { color: var(--bb-muted); opacity: 1; }
html.bb-theme-jungle hr { border-color: var(--bb-line); }
html.bb-theme-jungle .text-muted,
html.bb-theme-jungle small { color: var(--bb-muted-text) !important; }
html.bb-theme-jungle #breadcrumb .breadcrumb-item,
html.bb-theme-jungle #breadcrumb .breadcrumb-link,
html.bb-theme-jungle #breadcrumb .breadcrumb-link span { color: var(--bb-ink-2) !important; }
html.bb-theme-jungle #breadcrumb .breadcrumb-item.active { color: var(--bb-muted-text) !important; }

/* PLP controls: avoid cream text on the compiled cream filter buttons. */
html.bb-theme-jungle #sidepanel_left .btn-filter-box {
  background: var(--bb-bg-2) !important;
  border-color: var(--bb-line);
  color: var(--bb-ink) !important;
}
html.bb-theme-jungle .bb-cat-chip {
  background: var(--bb-y);
  border-color: var(--bb-y);
  color: #17150e;
}

/* PDP short description still uses Sweet's compiled light-theme muted color. */
html.bb-theme-jungle .product-info .shortdesc { color: var(--bb-ink-2); }

/* The sticky contact bar intentionally remains a light utility island. */
html.bb-theme-jungle .contact-bar-wrapper,
html.bb-theme-jungle .contact-bar-wrapper a,
html.bb-theme-jungle .contact-bar-wrapper span,
html.bb-theme-jungle .contact-bar-wrapper small {
  background-color: #f5f2e7;
  color: #17150e !important;
}

/* Product photography stays on a neutral light pool in Jungle. */
html.bb-theme-jungle .productbox .productbox-image,
html.bb-theme-jungle .product-gallery .product-image,
html.bb-theme-jungle .slick-slide .productbox-image,
html.bb-theme-jungle .subcategories-image {
  background-color: #f0ecdd;
}
html.bb-theme-jungle .productbox .wishlist.badge { color: #17150e; }

/* Gold remains a dark-text surface; primary actions flip to gold. */
html.bb-theme-jungle .bb-marquee,
html.bb-theme-jungle .bb-mark--y,
html.bb-theme-jungle .bb-btn--gold { color: #17150e; }
html.bb-theme-jungle .btn-primary,
html.bb-theme-jungle .product-buy #add-to-cart,
html.bb-theme-jungle .productbox .bb-card__add.basket-details-add-to-cart {
  background: var(--bb-y);
  border-color: var(--bb-y);
  color: #17150e;
}
html.bb-theme-jungle .btn-primary:hover,
html.bb-theme-jungle .product-buy #add-to-cart:hover,
html.bb-theme-jungle .productbox .bb-card__add.basket-details-add-to-cart:hover {
  background: var(--bb-r-action);
  border-color: var(--bb-r-action);
  color: #fff;
}

/* Dummy contract: the heritage/manifest block becomes the loud gold island. */
html.bb-theme-jungle .bb-manifesto__panel {
  background: var(--bb-y);
  color: #17150e;
}
html.bb-theme-jungle .bb-manifesto__panel h2,
html.bb-theme-jungle .bb-manifesto__panel .bb-disp,
html.bb-theme-jungle .bb-manifesto__panel .bb-kicker,
html.bb-theme-jungle .bb-manifesto__panel p { color: #17150e; }
html.bb-theme-jungle .bb-manifesto__panel .bb-kicker { opacity: .65; }
html.bb-theme-jungle .bb-manifesto__panel .bb-mark--y {
  background: #17150e;
  color: var(--bb-y);
}
html.bb-theme-jungle .bb-manifesto__panel .bb-btn--gold {
  background: #17150e;
  color: var(--bb-y);
}
html.bb-theme-jungle .bb-manifesto__panel .bb-manifesto__stats { border-color: rgba(23, 21, 14, .22); }
html.bb-theme-jungle .bb-manifesto__panel .bb-manifesto__stats .n { color: var(--bb-r); }
html.bb-theme-jungle .bb-manifesto__panel .bb-manifesto__stats .l { color: rgba(23, 21, 14, .62); }
html.bb-theme-jungle .bb-manifesto__panel .bb-manifesto__deco { color: rgba(23, 21, 14, .06); }

/* Header world shared by Jungle and Mix. */
html.bb-theme-jungle #jtl-nav-wrapper,
html.bb-theme-mix #jtl-nav-wrapper,
html.bb-theme-jungle .fixed-search-wrapper,
html.bb-theme-mix .fixed-search-wrapper {
  background: #123722;
  border-color: rgba(244, 241, 226, .18);
  color: #f4f1e2;
}
html.bb-theme-jungle #shop-logo,
html.bb-theme-mix #shop-logo { filter: brightness(0) invert(1); }
html.bb-theme-jungle #jtl-nav-wrapper .nav-right > .nav-item > .nav-link,
html.bb-theme-mix #jtl-nav-wrapper .nav-right > .nav-item > .nav-link,
html.bb-theme-jungle #jtl-nav-wrapper .navbar-toggler,
html.bb-theme-mix #jtl-nav-wrapper .navbar-toggler,
html.bb-theme-jungle #jtl-nav-wrapper .form-clear,
html.bb-theme-mix #jtl-nav-wrapper .form-clear { color: #f4f1e2; }
html.bb-theme-jungle #jtl-nav-wrapper .nav-right > .nav-item > .nav-link:hover,
html.bb-theme-mix #jtl-nav-wrapper .nav-right > .nav-item > .nav-link:hover { color: var(--bb-y); }

/* Search stays a bright, highly legible island like in the design dummy. */
html.bb-theme-jungle #jtl-nav-wrapper .header-search .form-control,
html.bb-theme-mix #jtl-nav-wrapper .header-search .form-control,
html.bb-theme-jungle #jtl-nav-wrapper .header-search .btn,
html.bb-theme-mix #jtl-nav-wrapper .header-search .btn {
  background: #fff !important;
  border-color: rgba(23, 21, 14, .16);
  color: #17150e;
}

html.bb-theme-jungle .bb-fn.bb-fn,
html.bb-theme-jungle .bb-fn-m.bb-fn-m,
html.bb-theme-mix #jtl-nav-wrapper .bb-fn.bb-fn,
html.bb-theme-mix #jtl-nav-wrapper .bb-fn-m.bb-fn-m {
  --bbfn-rail-bg: #123722;
  --bbfn-rail-bg-2: #0d2c1a;
  --bbfn-rail-fg: #f4f1e2;
  --bbfn-rail-fg-dim: rgba(244, 241, 226, .72);
  --bbfn-panel-bg: #1a4229;
  --bbfn-panel-bg-2: #0d2c1a;
  --bbfn-ink: #f4f1e2;
  --bbfn-ink-soft: #cfd8c4;
  --bbfn-line: rgba(244, 241, 226, .18);
  --bbfn-shadow: 0 1px 2px rgba(0, 0, 0, .3), 0 18px 44px -20px rgba(0, 0, 0, .55);
  --bb-fn-world-color: var(--bb-y);
  --bb-fn-world-bg: rgba(244, 241, 226, .05);
  --bb-fn-world-border: rgba(244, 241, 226, .18);
}
html.bb-theme-jungle .bb-fn-index__head--icon .bb-fn-index__icon,
html.bb-theme-mix #jtl-nav-wrapper .bb-fn-index__head--icon .bb-fn-index__icon {
  background: #f0ecdd;
}
html.bb-theme-jungle .bb-fn-feature__media,
html.bb-theme-jungle .bb-fn-card,
html.bb-theme-jungle .bb-fn-card__media,
html.bb-theme-jungle .bb-fn-imgtile__media,
html.bb-theme-mix #jtl-nav-wrapper .bb-fn-feature__media,
html.bb-theme-mix #jtl-nav-wrapper .bb-fn-card,
html.bb-theme-mix #jtl-nav-wrapper .bb-fn-card__media,
html.bb-theme-mix #jtl-nav-wrapper .bb-fn-imgtile__media { background: #f0ecdd; }

html.bb-theme-jungle #footer { background: #081c0f; color: rgba(244, 241, 226, .72); }
html.bb-theme-jungle #copyright { background: #081c0f; color: rgba(244, 241, 226, .55); }

/* Visitor control — intentionally self-contained and independent of theme tokens. */
.bb-theme-control {
  position: fixed;
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 1035;
  font-family: "Hanken Grotesk", system-ui, sans-serif;
  color: #17150e;
}
.bb-theme-control--right { right: max(16px, env(safe-area-inset-right)); }
.bb-theme-control--left { left: max(16px, env(safe-area-inset-left)); }
@media (min-width: 992px) {
  /* Non-home routes carry Sweet's sticky contact bar at the bottom. */
  body:not([data-page="18"]) .bb-theme-control {
    bottom: max(82px, calc(env(safe-area-inset-bottom) + 16px));
  }
}
.bb-theme-control__trigger {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 7px 14px 7px 10px;
  border: 1.5px solid rgba(23, 21, 14, .18);
  border-radius: 999px;
  background: rgba(253, 252, 247, .96);
  color: #17150e;
  box-shadow: 0 12px 34px -16px rgba(0, 0, 0, .48);
  backdrop-filter: blur(12px);
  cursor: pointer;
}
.bb-theme-control__trigger:hover { border-color: #178a41; }
.bb-theme-control__trigger:focus-visible,
.bb-theme-control__option:focus-visible { outline: 3px solid #eab00e; outline-offset: 2px; }
.bb-theme-control__trigger svg { width: 27px; height: 27px; fill: #178a41; flex: none; }
.bb-theme-control__trigger-copy { display: grid; text-align: left; line-height: 1.08; }
.bb-theme-control__trigger-copy small {
  color: #756f5f !important;
  font: 700 9px/1.2 "Space Mono", ui-monospace, monospace;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.bb-theme-control__trigger-copy strong { margin-top: 3px; font-size: 13px; }
.bb-theme-control__panel {
  position: absolute;
  bottom: calc(100% + 10px);
  width: min(292px, calc(100vw - 32px));
  padding: 8px;
  border: 1.5px solid rgba(23, 21, 14, .16);
  border-radius: 18px;
  background: #fdfcf7;
  box-shadow: 0 24px 60px -24px rgba(0, 0, 0, .55);
}
.bb-theme-control--right .bb-theme-control__panel { right: 0; }
.bb-theme-control--left .bb-theme-control__panel { left: 0; }
.bb-theme-control__panel[hidden] { display: none; }
.bb-theme-control__option {
  display: grid;
  grid-template-columns: 38px 1fr;
  align-items: center;
  gap: 11px;
  width: 100%;
  padding: 10px;
  border: 1.5px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: #17150e;
  text-align: left;
  cursor: pointer;
}
.bb-theme-control__option:hover { background: #f5f2e7; }
.bb-theme-control__option.is-active { border-color: #178a41; background: #edf5ed; }
.bb-theme-control__option > span:last-child { display: grid; gap: 2px; }
.bb-theme-control__option strong { font-size: 13px; }
.bb-theme-control__option small { color: #756f5f !important; font-size: 11px; }
.bb-theme-control__swatch {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(23, 21, 14, .15);
  border-radius: 50%;
  box-shadow: inset 0 0 0 3px rgba(255, 255, 255, .34);
}
.bb-theme-control__option--weiss .bb-theme-control__swatch { background: linear-gradient(135deg, #fdfcf7 0 50%, #fff 50%); }
.bb-theme-control__option--jungle .bb-theme-control__swatch { background: linear-gradient(135deg, #123722 0 50%, #1a4229 50%); }
.bb-theme-control__option--mix .bb-theme-control__swatch { background: linear-gradient(135deg, #123722 0 50%, #fdfcf7 50%); }

@media (max-width: 575.98px) {
  .bb-theme-control { bottom: max(10px, env(safe-area-inset-bottom)); }
  .bb-theme-control--right { right: max(10px, env(safe-area-inset-right)); }
  .bb-theme-control--left { left: max(10px, env(safe-area-inset-left)); }
  .bb-theme-control__trigger { min-height: 44px; padding: 7px 10px; }
  .bb-theme-control__trigger-copy small { display: none; }
  .bb-theme-control__trigger svg { width: 24px; height: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .bb-theme-control *, .bb-theme-control *::before, .bb-theme-control *::after { transition: none !important; }
}
@media print { .bb-theme-control { display: none !important; } }