/* user.css ----------------------------------------------------------------- */
/* Please don't edit the original of this file.
 * Instead copy into a template and edit the copy.
 */
.hot-info-box p,
.hot-info-box li,
.hot-info-box td p,
.hot-info-box td li {
  max-width: none;
}

.shopping-cart-page th.sc-cell-product,
.shopping-cart-page th.sc-cell-product .sc-product-link {
  font-weight: 400;
}

/* account history spåra knapp disabled */
.account-order-action.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.hot-conditions-page .payment-icons img {
  display: inline-block;
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: 28px !important;
}

.hot-conditions-page h2 {
  margin: 32px 0 12px;
}

.hot-conditions-page p {
  margin: 0 0 14px;
  line-height: 1.6;
}

.hot-conditions-page h2:first-child {
  margin-top: 0;
}

/* House of Tea – logo size */
.navbar-brand.nb-brand img {
  height: 80px;   /* ändra till vad som passar */
  width: auto;
  max-width: none; /* hindrar Bootstrap från att klämma den */
  aspect-ratio: 41.705532 / 14.113247;
  display: block;
}

.navbar-brand.nb-brand img { height: 80px; width: auto; }

@media (max-width: 576px) {
  .navbar-brand.nb-brand img { height: 56px; }
}


body {
  background-color: #e3e4d6; /* Change this to your desired color */
  color: #000000;
  font-family: var(--hot-body-font-stack);
  font-size: var(--hot-body-font-size);
  line-height: var(--hot-body-line-height);
  font-weight: var(--hot-body-font-weight);
  letter-spacing: var(--hot-body-letter-spacing);
  /* other styles */
}

html {
  overflow-y: scroll;
  scrollbar-gutter: stable;
}

/* **************************** */
/* Sök: ren men tydlig kontur */
.cm-header-search .input-group .form-control,
.cm-header-search .input-group .btn {
  border: 1px solid #c2bbaa;

}

/* Behåll att de ser ihopkopplade ut */
.cm-header-search .input-group .form-control {
  border-right: 0;
}

.cm-header-search .input-group .btn {
  background: #f9d607;
  border-left: 0;
  border: 1px solid #c2bbaa !important;
}

/* Liten “separeringslinje” mellan input och knapp så gult inte flyter ut */
.cm-header-search .input-group .input-group-append {
  position: relative;
}
.cm-header-search .input-group .input-group-append::before {
  content: "";
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 1px;
  background: rgba(59, 36, 21, 0.18); /* diskret brunton från din text */
  pointer-events: none;
}

/* Fokus: tydligt men inte skrikigt */
.cm-header-search .input-group .form-control:focus,
.cm-header-search .input-group .btn:focus {
  outline: 0;
  border-color: #9aa331; /* din rubrik-oliv */
  box-shadow: 0 0 0 3px rgba(154, 163, 49, 0.18);
}

/* Hover på gula knappen: lite mörkare + micro-contrast */
.cm-header-search .input-group .btn:hover {
  background: #e6c700;
}

/* Valfritt: gör ikonen lite “tyngre” visuellt */
.cm-header-search .input-group .btn i {
  color: #3b2415;

}

/* 2) Tvinga TA-boxen att bli en riktig dropdown UNDER inputgruppen */
.cm-header-search .input-group > .ta-box {
  position: absolute !important;
  top: calc(100% + 6px) !important;   /* under sökrutan */
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;

  margin: 0 !important;               /* Bootstrap container-fluid kan lägga marginaler */
  z-index: 9999 !important;           /* över headern */
}

/* Mobile/navbar typeahead must use the same dropdown positioning as header search. */
.nb-search,
.nb-search .input-group,
.cm-navbar .navbar-collapse,
.cm-navbar .navbar-nav {
  overflow: visible !important;
}

.nb-search .input-group > .ta-box {
  position: absolute !important;
  top: calc(100% + 6px) !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  z-index: 10040 !important;
}
:root { --header-search-gap: 0.6rem; } /* justera: 0.4–1.0rem */
/* 3) Om din header/kolumn råkar ha en låg z-index eller klippning */
.header,
.header .container-xl,
.cm-header-search {
  overflow: visible !important;
  margin-top: var(--header-search-gap);
  margin-bottom: var(--header-search-gap);
}

/* *************************** */
/* =========================
   HOUSE OF TEA – DESIGN TOKENS
   ========================= */
:root {
  --hot-body-font-stack: "Spectral", Helvetica, Arial, sans-serif;
  --hot-body-font-size: 17px;
  --hot-body-line-height: 1.7;
  --hot-body-font-weight: 400;
  --hot-body-letter-spacing: 0.1px;
  --hot-body-measure: 62ch;
  --hot-bg: #e3e4d6;
  --hot-surface: #ffffff;
  --hot-surface-muted: #f1f1e6;
  --hot-text: #3b2415;
  --hot-text-strong: #000000;
  --hot-border: #d8d2c4;
  --hot-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
  --hot-accent: #f9d607;
  --hot-accent-hover: #e6c700;
  --hot-heading: #9aa331;
  --hot-danger: #b3261e;
  --hot-danger-hover: #8f1f16;
  --hot-danger-text: #ffffff;
  --hot-btn-radius: 999px;
  --hot-btn-font: 1.1rem;
  --hot-btn-font-sm: 0.95rem;
  --hot-btn-pad-y: 0.35rem;
  --hot-btn-pad-x: 0.9rem;
  --hot-btn-pad-y-sm: 0.2rem;
  --hot-btn-pad-x-sm: 0.6rem;
  --hot-focus-ring: 0 0 0 0.2rem rgba(0, 0, 0, 0.15);
  --hot-disabled-opacity: 0.65;
  --hot-input-group-radius: 12px;
  --hot-heading-font-stack: "Spectral", Georgia, "Times New Roman", Times, serif;

}

main p,
main li {
  max-width: var(--hot-body-measure);
}

/* Shopping cart stock warning: full text width inside alert */
.shopping-cart-page .cm-sc-stock-notice .alert p,
.shopping-cart-page #hot-sc-stock-notice .alert p {
  max-width: none !important;
  width: 100%;
}

/* =========================
   HOUSE OF TEA – BUTTON SYSTEM
   ========================= */
.btn.hot-primary,
.btn.hot-secondary,
.btn.hot-ghost,
.btn.hot-danger {
  border-radius: var(--hot-btn-radius) !important;
  font-size: var(--hot-btn-font);
  padding: var(--hot-btn-pad-y) var(--hot-btn-pad-x);
  line-height: 1.2;
  box-shadow: none !important;
  text-transform: none;
}

.btn.hot-sm {
  font-size: var(--hot-btn-font-sm) !important;
  padding: var(--hot-btn-pad-y-sm) var(--hot-btn-pad-x-sm) !important;
}

.btn.hot-primary:focus-visible,
.btn.hot-secondary:focus-visible,
.btn.hot-ghost:focus-visible,
.btn.hot-danger:focus-visible {
  outline: none !important;
  box-shadow: var(--hot-focus-ring) !important;
}

.btn.hot-primary:disabled,
.btn.hot-primary.disabled,
.btn.hot-secondary:disabled,
.btn.hot-secondary.disabled,
.btn.hot-ghost:disabled,
.btn.hot-ghost.disabled,
.btn.hot-danger:disabled,
.btn.hot-danger.disabled {
  opacity: var(--hot-disabled-opacity) !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

.btn.hot-primary {
  background-color: var(--hot-accent) !important;
  border: 1px solid var(--hot-text-strong) !important;
  color: var(--hot-text) !important;
}

.btn.hot-primary:hover,
.btn.hot-primary:active {
  background-color: var(--hot-accent-hover) !important;
  border-color: var(--hot-text-strong) !important;
  color: var(--hot-text) !important;
}

.btn.hot-secondary {
  background-color: var(--hot-surface) !important;
  border: 1px solid var(--hot-heading) !important;
  color: var(--hot-text) !important;
}

.btn.hot-secondary:hover,
.btn.hot-secondary:active {
  background-color: var(--hot-surface-muted) !important;
  border-color: var(--hot-heading) !important;
  color: var(--hot-text) !important;
}

.btn.hot-ghost {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--hot-text) !important;
  padding-left: calc(var(--hot-btn-pad-x) * 0.6);
  padding-right: calc(var(--hot-btn-pad-x) * 0.6);
}

.btn.hot-ghost:hover,
.btn.hot-ghost:active {
  background-color: var(--hot-surface-muted) !important;
  border-color: var(--hot-border) !important;
  color: var(--hot-text) !important;
}

.btn.hot-danger {
  background-color: var(--hot-danger) !important;
  border: 1px solid var(--hot-danger) !important;
  color: var(--hot-danger-text) !important;
}

.btn.hot-danger:hover,
.btn.hot-danger:active {
  background-color: var(--hot-danger-hover) !important;
  border-color: var(--hot-danger-hover) !important;
  color: var(--hot-danger-text) !important;
}

/* Input-group safety: avoid full-pill buttons when button touches input */
.input-group > .btn.hot-primary,
.input-group > .btn.hot-secondary,
.input-group > .btn.hot-ghost,
.input-group > .btn.hot-danger {
  border-radius: 0 !important;
}

.input-group > .btn.hot-primary:first-child,
.input-group > .btn.hot-secondary:first-child,
.input-group > .btn.hot-ghost:first-child,
.input-group > .btn.hot-danger:first-child {
  border-top-left-radius: var(--hot-input-group-radius) !important;
  border-bottom-left-radius: var(--hot-input-group-radius) !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.input-group > .btn.hot-primary:last-child,
.input-group > .btn.hot-secondary:last-child,
.input-group > .btn.hot-ghost:last-child,
.input-group > .btn.hot-danger:last-child {
  border-top-right-radius: var(--hot-input-group-radius) !important;
  border-bottom-right-radius: var(--hot-input-group-radius) !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

/* TypeAhead base styles moved here to avoid late style injection reflow. */
@keyframes taThumbIn {
  from { opacity: 0; transform: translateY(4px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes taPanelIn {
  0% { opacity: 0; transform: translateY(-10px) scale(0.985); }
  30% { opacity: 0; transform: translateY(-10px) scale(0.985); }
  75% { opacity: 1; transform: translateY(0) scale(1.01); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

.ta-box.ta-panel-animate {
  animation: taPanelIn 900ms cubic-bezier(.2, .9, .2, 1) both;
  animation-delay: 50ms;
  will-change: transform, opacity;
}

.ta-image-block {
  opacity: 1;
  transform: none;
  animation: none;
}

.ta-box.ta-animate-items .ta-image-block {
  opacity: 0;
  transform: translateY(4px) scale(0.98);
  animation: taThumbIn 400ms ease-out forwards;
  will-change: opacity, transform;
}

.ta-box.ta-animate-items .ta-prod-row:nth-child(1) .ta-image-block { animation-delay: 0ms; }
.ta-box.ta-animate-items .ta-prod-row:nth-child(2) .ta-image-block { animation-delay: 120ms; }
.ta-box.ta-animate-items .ta-prod-row:nth-child(3) .ta-image-block { animation-delay: 240ms; }
.ta-box.ta-animate-items .ta-prod-row:nth-child(4) .ta-image-block { animation-delay: 360ms; }
.ta-box.ta-animate-items .ta-prod-row:nth-child(5) .ta-image-block { animation-delay: 480ms; }

@media (prefers-reduced-motion: reduce) {
  .ta-image-block,
  .ta-box {
    animation: none !important;
    opacity: 1;
    transform: none;
  }
}

.ta-box {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}

.ta-box {
  position: absolute;
  top: 0px;
  left: 0px;
  background: #ffffff;
  width: 100%;
  z-index: 300;
  border-radius: 0px 0px 0.5em 0.5em;
  border: 1px solid #d4d4d4;
  overflow-x: hidden;
  padding: 0px;
  color: #111111;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.10);
  border-color: rgba(0, 0, 0, 0.10);
}

.input-group .ta-box {
  width: 100%;
  right: 0;
  left: auto;
}

.ta-box * {
  color: #111111;
}

.ta-box .text-danger {
  color: #111111 !important;
}

.ta-box .col-1 {
  position: relative;
}

.ta-box > .row > div.ta-box-details {
  background-color: #ffffff;
}

.ta-box h5 {
  font-size: 1em !important;
}

.ta-container-fluid {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
}

.input-group .ta-container-fluid {
  margin-left: 0px;
  padding-left: 0px;
  padding-right: 0px;
  width: 100%;
}

#columnRight .ta-container-fluid,
#columnLeft .ta-container-fluid {
  padding-right: 0px;
  padding-left: 0px;
  width: 100%;
}

.ta-hint-box-w {
  position: fixed !important;
  top: -100px !important;
  left: -100px !important;
  padding-right: 0px;
  display: table;
  white-space: nowrap;
}

.ta-hint-box {
  position: absolute;
  top: 0px;
  left: 0px;
  background: transparent;
  color: #111111;
  z-index: 30;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 1.5em;
  overflow: hidden;
  max-width: 200px;
  tex-align: left;
}

.ta-prod-description {
  max-height: 40px;
  width: 100%;
  overflow: hidden;
}

.ta-prod-row .row,
.ta-prod-body {
  flex-wrap: nowrap;
  align-items: center;
}

.ta-prod-row .ta-image-block {
  flex: 0 0 80px;
  width: 80px;
  max-width: 80px;
  padding-right: 8px;
}

.ta-prod-row .row > div:not(.ta-image-block) {
  flex: 1 1 auto;
  min-width: 0;
}

.ta-prod-row:nth-child(odd),
.ta-prod-row:nth-child(even),
.ta-result-block {
  background-color: #ffffff;
}

.ta-prod-row:hover,
.ta-result-block .ta-category-line:hover,
.ta-category-line:hover {
  background-color: #f3f4f6;
}

#ta-box-details {
  max-height: 50vh;
  overflow: auto;
}

.ta-image-block img {
  width: 80px;
  height: 80px;
  max-width: none;
  display: block;
  object-fit: contain;
}

.ta-header {
  padding: 6px 10px 0;
  border-bottom: none;
  background: #ffffff;
  align-items: center;
}

.ta-header-stack {
  align-items: flex-start;
  margin-bottom: -2px;
}

.ta-header-stack .ta-header-title {
  padding-bottom: 0;
}

.ta-header-stack + .ta-subline {
  padding-top: 0;
  margin-top: -1px;
}

.ta-header-stack + .ta-subline + .ta-subline,
.ta-header-stack + .ta-subline + .ta-subline + .ta-subline,
.ta-subline + .ta-subline {
  margin-top: -1px;
}

.ta-header-title {
  font-weight: 600;
  font-size: 0.85rem;
}

.ta-header-close {
  display: flex;
  justify-content: flex-end;
}

.ta-close-btn {
  background: transparent;
  border: 1px solid #cbd5f5;
  border-radius: 4px;
  padding: 0 6px;
  line-height: 1.2;
  cursor: pointer;
}

.ta-subline {
  padding: 0 10px 2px;
  font-size: 0.8em;
  line-height: 1.05;
}

.ta-subline .row {
  margin-left: 0;
  margin-right: 0;
}

.ta-subline .col {
  padding-left: 10px;
  padding-right: 10px;
}

.ta-subtext {
  color: #111111;
}

.ta-divider {
  height: 1px;
  background: #e5e7eb;
  margin: 2px 0 0;
}

.ta-divider-after {
  margin: 3px 0 2px;
}

.ta-prod-body {
  padding: 2px 4px;
  align-items: center;
}

.ta-prod-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ta-prod-name:hover {
  color: inherit;
}

.ta-prod-meta {
  display: flex;
  gap: 2px;
  font-size: 0.85em;
  margin-top: 2px;
}

.ta-category-line {
  font-size: 0.8em;
  padding: 6px 10px 4px;
}

.ta-category-line,
.ta-prod-row {
  transition: background-color 120ms ease-in-out;
}

.ta-category-link {
  color: inherit;
  text-decoration: none;
}

.ta-category-link:hover {
  color: inherit;
  text-decoration: none;
}

#columnRight .ta-box,
#columnLeft .ta-box {
  font-size: 0.8em;
  width: 100%;
}

#columnRight #ta-box-details .col-3,
#columnRight #ta-box-details .col-9,
#columnRight #ta-box-details .col-10,
#columnRight #ta-box-details .col-2,
#columnRight .ta-box,
#columnLeft #ta-box-details .col-3,
#columnLeft #ta-box-details .col-9,
#columnLeft #ta-box-details .col-10,
#columnLeft #ta-box-details .col-2,
#columnLeft .ta-box {
  margin: 0px;
}

#columnRight .ta-prod-description,
#columnLeft .ta-prod-description {
  max-height: 40px;
}

#columnRight #ta-box-details,
#columnLeft #ta-box-details {
  margin: 0px;
  padding: 0px;
}

#columnRight .ta-image-block,
#columnLeft {
  margin: 5px 0px;
  padding: 0px;
}

#columnRight .row,
#columnLeft .row,
#columnRight .container-fluid,
#columnLeft .container-fluid {
  margin: 0px;
  padding: 0px;
}

.ta-category-suggest {
  padding: 8px 10px;
  background: #f8fafc;
}

.ta-category-suggest:hover {
  background: #f1f5f9;
}

.ta-category-line {
  font-size: 0.75em;
  opacity: 0.75;
  cursor: default;
}

.ta-meta-sep {
  opacity: 0.5;
  padding: 0 4px;
}

@view-transition {
  navigation: none;
}

.alert-success {
  background-color: #f1f1e6;
  border-color: #d5d6c5;
  color: #3b2415;
}

.alert-info {
  background-color: #f1f1e6;
  border-color: #d5d6c5;
  color: #3b2415;
}

.alert-warning {
  border-color: #a39b84;
}

.card {
  background-color: #f1f1e6;
  border-color: #d5d6c5;
}

.card-header {
  background-color: #ffffff;
  border-bottom-color: #d5d6c5;
}
.bm-categories .card-header a {
  color: inherit;
  text-decoration: none;
  pointer-events: none;
}
.bm-categories .card-header {
  position: relative;
  z-index: 2;
  pointer-events: auto;
}
.bm-categories .list-group {
  position: relative;
  z-index: 1;
}
.bm-categories .card-header::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: auto;
}
.bm-categories .list-group-item {
  position: relative;
  z-index: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.card .list-group-item {
  background-color: #f1f1e6;
  border-color: #d5d6c5;
  color: #9aa331;
  flex-wrap: nowrap;
}

h2.display-4 {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-weight: 400;
  text-transform: uppercase;
}

@media (max-width: 970px) {
  #bodyContent {
    order: 1 !important;
  }
  #columnLeft,
  #columnRight {
    flex: 0 0 100%;
    max-width: 100%;
    order: 3 !important;
  }
}

.cm-ip-title h1 {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-size: 1.4rem;
  font-weight: 400;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}

.cm-in-title h1 {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-size: 1.4rem;
  font-weight: 400;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}

h1.display-4 {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-size: 1.8rem;
  font-weight: 400;
  text-transform: uppercase;
}

.cm-pi-price .display-4,
.pi-price .display-4 {
  font-size: 1.6rem;
}

.hot-product-info-box {
  background-color: #ffffff;
  border-radius: 6px;
  padding: 1.5rem;
}

.hot-product-info-box.is-weight-loading {
  position: relative;
  pointer-events: none;
}

.hot-info-box {
  background-color: #ffffff;
  border-radius: 8px;
  padding: 2rem;
}

.hot-info-box h1,
.hot-info-box h2,
.hot-info-box h3,
.hot-info-box h4,
.hot-info-box h5,
.hot-info-box h6 {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 400;
}

.hot-info-box h2 {
  font-size: 1.4rem;
}

.hot-info-box h3 {
  font-size: 1.2rem;
}

.hot-info-box .infosubmenu ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
}

.hot-info-box .infosubmenu .nav.nav-stacked {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.hot-info-box .infosubmenu .nav.nav-stacked li {
  margin: 0;
}

.hot-info-box .infosubmenu a {
  color: #3b2415;
  text-decoration: none;
  font-family: var(--hot-heading-font-stack);
  letter-spacing: 0.03em;
}

.hot-info-box .infosubmenu a:hover,
.hot-info-box .infosubmenu a:focus {
  color: #6b3b1f;
}

.infosubmenu .list-group {
  border-radius: 6px;
  overflow: hidden;
}

.infosubmenu .list-group-item {
  background-color: #f1f1e6;
  border: 1px solid #d5d6c5;
  border-bottom: 0;
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-size: 1rem;
  letter-spacing: 0.03em;
  text-transform: capitalize;
}

.infosubmenu .list-group-item:last-child {
  border-bottom: 1px solid #d5d6c5;
}

.infosubmenu .list-group-item:hover,
.infosubmenu .list-group-item:focus {
  background-color: #ffffff;
  color: #748029;
  text-decoration: none;
}
.hot-info-box img {
  max-width: 100%;
  height: auto;
}

.hot-product-info-box .cm-pi-modular,
.hot-product-info-box .cm-pi-description,
.hot-product-info-box .cm-pi-name,
.hot-product-info-box .cm-pi-price,
.hot-product-info-box .cm-pi-buy-button,
.hot-product-info-box .cm-pi-reviews {
  background-color: transparent;
  padding: 0;
}

.hot-product-row {
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 6px;
  padding: 0.75rem 1rem;
  margin-bottom: 0.75rem;
  background-color: #ffffff;
}

.hot-product-image {
  text-align: left;
}

.organic-image-wrap {
  position: relative;
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  overflow: visible;
  vertical-align: top;
}

.organic-image-wrap--card {
  display: block;
}

.organic-image-wrap--card > a {
  display: block;
}

.organic-image-wrap .hot-product-thumb {
  display: block;
  float: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.organic-stamp {
  position: absolute;
  left: 0.4rem;
  top: 0.4rem;
  z-index: 2;
  pointer-events: none;
  height: auto;
}

.organic-stamp--small {
  width: clamp(34px, 6vw, 42px);
}

.organic-stamp--large {
  width: clamp(56px, 11vw, 88px);
}

.hot-product-thumb {
  width: min(180px, 100%);
  height: auto;
  max-height: 180px;
  object-fit: contain;
  border-radius: 4px;
  float: none !important;
}

.hot-product-name {
  font-family: var(--hot-heading-font-stack);
  font-size: 1.1rem;
  margin-bottom: 0.35rem;
}

.hot-product-name a {
  color: #000000;
  text-decoration: none;
}

.hot-product-name a:hover {
  color: #7f8628;
}

.hot-product-description {
  color: #333333;
  font-size: 0.98rem;
}

.hot-product-buy-form {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.hot-product-price {
  font-weight: 600;
  font-size: 1.10rem;
}

.hot-product-controls {
  display: flex;
  gap: 0.4rem;
  align-items: center;
  flex-wrap: wrap;
}

.hot-product-controls .input-group {
  width: auto;
  flex-wrap: nowrap;
  min-width: 140px;
}

.hot-product-qty {
  max-width: 70px;
  border: 1px solid #E6E6DE;
  border-radius: 999px;
  background-color: #FAFAF7;
  color: #3b2415;
  text-align: center;
}

.hot-product-controls .btn.spinner {
  padding: 0.2rem 0.45rem;
  font-size: 0.75rem;
}

.hot-product-controls .btn.spinner:hover,
.hot-product-controls .btn.spinner:focus {
  color: var(--hot-text-strong);
}

.hot-product-controls .input-group > .btn.spinner:first-child {
  border-top-left-radius: var(--hot-input-group-radius);
  border-bottom-left-radius: var(--hot-input-group-radius);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.hot-product-controls .input-group > .btn.spinner:last-child {
  border-top-right-radius: var(--hot-input-group-radius);
  border-bottom-right-radius: var(--hot-input-group-radius);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.hot-product-controls .input-group > .hot-product-qty {
  border-radius: 0;
  border-left: 0;
  border-right: 0;
}

.hot-product-buy-button {
  border-radius: var(--hot-btn-radius);
  white-space: nowrap;
  background-color: var(--hot-accent) !important;
  border: 1px solid var(--hot-text-strong) !important;
  color: var(--hot-text) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.hot-product-buy-button:hover,
.hot-product-buy-button:focus {
  background-color: var(--hot-accent-hover) !important;
  border-color: var(--hot-text-strong) !important;
  color: var(--hot-text) !important;
}

.hot-product-buy-button .fa-shopping-cart {
  color: #3b2415;
}

.hot-stock-disabled-btn,
.hot-stock-disabled-btn:hover,
.hot-stock-disabled-btn:focus {
  background-color: #d6d6cd !important;
  border-color: #b9b9ae !important;
  color: #5d5d54 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

.hot-stock-disabled-btn .fa-shopping-cart {
  color: #5d5d54 !important;
}

.hot-product-controls .btn[disabled],
.pi-qty-input .btn[disabled],
.hot-product-controls input[disabled],
.pi-qty-input input[disabled] {
  cursor: not-allowed;
  opacity: 0.72;
}

.hot-out-of-stock-note {
  width: 100%;
  margin-top: 0.35rem;
  font-size: 0.88rem;
  line-height: 1.35;
}

.hot-compare-price-note {
  width: 100%;
  margin-top: 0.35rem;
  font-size: 0.88rem;
  line-height: 1.35;
  color: #3b2415;
}

.hot-lowest-30d-note {
  width: 100%;
  margin-top: 0.2rem;
  font-size: 0.84rem;
  line-height: 1.35;
  color: #5a5143;
}

.cm-pi-lowest-30d {
  margin-top: 0.2rem;
}

.cm-pi-lowest-30d .small {
  color: #5a5143;
}

.pi-lowest-30d-line {
  margin-top: 0.2rem;
  line-height: 1.35;
  color: #5a5143 !important;
  text-align: right;
}

@media (max-width: 991.98px) {
  .hot-product-controls {
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.35rem;
  }

  .hot-product-controls .input-group {
    flex: 0 0 116px;
    width: 116px;
    min-width: 116px;
    max-width: 116px;
  }

  .hot-product-controls .hot-product-buy-button {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    min-width: auto;
    white-space: nowrap;
  }

  .hot-product-controls .cm-inline-cart-toast-anchor {
    flex: 0 0 100%;
    width: 100%;
  }
}

@media (max-width: 767.98px) {
  .organic-stamp--small {
    width: 42px;
  }
}

@media (max-width: 575.98px) {
  .organic-stamp--small {
    width: 36px;
  }

  .organic-stamp--large {
    width: 60px;
  }
}

.hot-product-name a {
  color: #111111;
  text-decoration: none;
}

.hot-product-name a:hover,
.hot-product-name a:focus {
  color: #111111;
  text-decoration: none;
}

.sc-product-link {
  color: #111111;
  text-decoration: none;
}

.sc-product-link:hover,
.sc-product-link:focus {
  color: #111111;
  text-decoration: none;
}

.shopping-cart-page tr.hot-sc-inline-toast-row > td {
  border-top: 0;
  padding: 0.35rem 0 0.2rem;
  background: transparent;
}

.shopping-cart-page tr.hot-sc-inline-toast-row .cm-inline-cart-toast {
  margin-top: 0;
}

.hot-sc-order-total-checkout-wrap {
  clear: both;
  width: 100%;
}

/* Keep listing toast CTA buttons on a single row when there is room */
[data-cart-inline-toast-anchor="listing"] .cm-inline-cart-toast__msg {
  flex: 0 0 100%;
}

[data-cart-inline-toast-anchor="listing"] .cm-inline-cart-toast__actions {
  width: 100%;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  gap: 0.45rem;
}

[data-cart-inline-toast-anchor="listing"] .cm-inline-cart-toast__btn {
  flex: 0 1 auto;
  max-width: 100%;
  white-space: nowrap;
}

@media (max-width: 1099.98px) {
  [data-cart-inline-toast-anchor="listing"] .cm-inline-cart-toast__actions {
    flex-wrap: wrap;
  }
}

@media (max-width: 575.98px) {
  [data-cart-inline-toast-anchor="listing"] .cm-inline-cart-toast__actions {
    flex-wrap: wrap;
  }

  [data-cart-inline-toast-anchor="listing"] .cm-inline-cart-toast__btn {
    flex: 1 1 100%;
  }
}

.sc-qty-group {
  width: auto;
  justify-content: flex-start;
  flex-wrap: nowrap;
  min-width: 6.8rem;
}

.sc-qty-input {
  max-width: 3rem;
  min-width: 2.6rem;
  font-size: 0.85rem;
  padding: 0.2rem 0.3rem;
  border: 1px solid #E6E6DE;
  border-left: 0;
  border-right: 0;
  background-color: #FAFAF7;
  color: #3b2415;
  text-align: center;
}

.sc-qty-input::-webkit-outer-spin-button,
.sc-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.sc-qty-input {
  -moz-appearance: textfield;
  appearance: textfield;
}

.sc-qty-btn {
  padding: 0.2rem 0.45rem;
  font-size: 0.75rem;
  border: 1px solid var(--hot-heading);
  color: var(--hot-text);
  background-color: var(--hot-surface);
}

.sc-qty-btn:hover,
.sc-qty-btn:focus {
  background-color: var(--hot-surface-muted);
  border-color: var(--hot-heading);
  color: var(--hot-text-strong);
}

.sc-qty-group > .sc-qty-btn[data-qty-change="-1"] {
  border-top-left-radius: var(--hot-input-group-radius);
  border-bottom-left-radius: var(--hot-input-group-radius);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.sc-qty-group > .sc-qty-btn[data-qty-change="1"] {
  border-top-right-radius: var(--hot-input-group-radius) !important;
  border-bottom-right-radius: var(--hot-input-group-radius) !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

.i-hero {
  font-family: var(--hot-heading-font-stack);
}

.i-hero h3.h5 {
  font-size: 1.4rem;
}

.i-hero h3 {
  color: #9aa331;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.nb-houseoftea-menu .nav-link,
.nb-purchase-info .nav-link,
.nb-news .nav-link,
.nb-about-tea .nav-link {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-size: 1.4rem;
  letter-spacing: 1px;
  margin-right: 1rem;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color 500ms ease;
}

.nb-houseoftea-menu .nav-link i,
.nb-purchase-info .nav-link i,
.nb-news .nav-link i,
.nb-about-tea .nav-link i {
  transition: color 500ms ease;
}

.nb-houseoftea-menu .nav-link:hover,
.nb-houseoftea-menu .nav-link:hover i,
.nb-purchase-info .nav-link:hover,
.nb-purchase-info .nav-link:hover i,
.nb-news .nav-link:hover,
.nb-news .nav-link:hover i,
.nb-about-tea .nav-link:hover,
.nb-about-tea .nav-link:hover i {
  color: #7f8628;
}

.nb-purchase-info,
.nb-news {
  margin-right: 0.75rem;
}

@media (min-width: 768px) and (max-width: 839.98px) {
  .navbar-brand.nb-brand img {
    height: 66px;
  }

  .nb-houseoftea-menu .nav-link,
  .nb-purchase-info .nav-link,
  .nb-news .nav-link,
  .nb-about-tea .nav-link {
    font-size: 0.96rem;
    letter-spacing: 0;
    margin-right: 0.04rem;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
  }

  .cm-navbar #collapseCoreNav .navbar-nav.navbar-nav-right .nav-link {
    padding-left: 0.2rem;
    padding-right: 0.2rem;
  }
}

@media (min-width: 840px) and (max-width: 991.98px) {
  .navbar-brand.nb-brand img {
    height: 70px;
  }

  .nb-houseoftea-menu .nav-link,
  .nb-purchase-info .nav-link,
  .nb-news .nav-link,
  .nb-about-tea .nav-link {
    font-size: 1.03rem;
    letter-spacing: 0.02px;
    margin-right: 0.08rem;
    padding-left: 0.28rem;
    padding-right: 0.28rem;
  }

  .cm-navbar #collapseCoreNav .navbar-nav.navbar-nav-right .nav-link {
    padding-left: 0.24rem;
    padding-right: 0.24rem;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .nb-houseoftea-menu .nav-link,
  .nb-purchase-info .nav-link,
  .nb-news .nav-link,
  .nb-about-tea .nav-link {
    font-size: 1.2rem;
    letter-spacing: 0.35px;
    margin-right: 0.35rem;
  }
}

@media (min-width: 768px) {
  .cm-navbar #collapseCoreNav .offcanvas-body {
    justify-content: flex-start !important;
  }

  .cm-navbar #collapseCoreNav .offcanvas-body > .navbar-nav.navbar-nav-left,
  .cm-navbar #collapseCoreNav .offcanvas-body > .navbar-nav.navbar-nav-center {
    min-width: 0;
    flex: 1 1 auto;
  }

  .cm-navbar #collapseCoreNav .offcanvas-body > .navbar-nav.navbar-nav-right {
    margin-left: auto;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .cm-navbar #collapseCoreNav .offcanvas-body > .navbar-nav.navbar-nav-right > .nav-item {
    flex-shrink: 0;
  }
}

@media (max-width: 767.98px) {
  .cm-navbar .navbar-toggler {
    margin-right: 0.55rem;
  }
}

.cm-navbar .navbar-toggler.nb-hamburger-button {
  width: 52px;
  height: 52px;
  padding: 0;
  border: 0 !important;
  background: transparent;
  box-shadow: none !important;
  border-radius: 999px;
  text-align: center;
  line-height: 1;
}

.cm-navbar .navbar-toggler.nb-hamburger-button:hover {
  filter: brightness(0.98);
}

.cm-navbar .navbar-toggler.nb-hamburger-button:focus {
  box-shadow: none !important;
}

.cm-navbar .nb-hamburger-ring {
  width: 44px;
  height: 44px;
  display: block;
  transition: transform 0.12s ease;
}

.cm-navbar .nb-ring-bg {
  fill: #9aa331;
}

.cm-navbar .nb-bar {
  fill: none;
  stroke: #ffffff;
  stroke-width: 3.6;
  stroke-linecap: round;
}

.cm-navbar .nb-hamburger-button:active .nb-hamburger-ring {
  transform: scale(0.97);
}

@media (max-width: 575.98px) {
  .cm-navbar .container-xl,
  .cm-navbar .container-lg,
  .cm-navbar .container-md,
  .cm-navbar .container-sm,
  .cm-navbar .container {
    position: relative;
    min-height: 64px;
  }

  .cm-navbar .nb-brand {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    z-index: 1;
  }

  .cm-navbar .navbar-toggler,
  .cm-navbar .navbar-top-cart {
    position: relative;
    z-index: 2;
  }
}

.nb-languages .nav-link,
.nb-account .nav-link,
.cm-navbar .nav-link.navbar-top-cart {
  color: #9aa331;
}

/* Konto i navbar: visa ikon även i minsta läget (ingen "namn, du är inloggad"-text) */
.nb-account .nav-link > span.d-inline.d-sm-none {
  display: none !important;
}

/* Minsta läget: visa account-check + cart-ikon i offcanvas men håll namntext dold */
@media (max-width: 575.98px) {
  .cm-navbar #collapseCoreNav .nb-account .d-none.d-sm-inline,
  .cm-navbar #collapseCoreNav .nb-shopping-cart .d-none.d-sm-inline {
    display: inline !important;
  }
}

.nb-languages .nav-link i,
.nb-account .nav-link i,
.cm-navbar .nav-link.navbar-top-cart i {
  color: #9aa331;
}

.nb-languages .nav-link,
.nb-account .nav-link {
  transition: color 500ms ease;
}

.nb-languages .nav-link i,
.nb-account .nav-link i {
  transition: color 500ms ease;
}

.nb-languages .nav-link:hover,
.nb-languages .nav-link:hover i,
.nb-account .nav-link:hover,
.nb-account .nav-link:hover i {
  color: #7f8628;
}

.cm-navbar .fa-shopping-cart {
  color: #9aa331;
  transition: color 500ms ease;
}

.cm-navbar .fa-shopping-cart:hover {
  color: #7f8628;
}

.cm-navbar .badge.bg-primary {
  background-color: #fff !important;
  border: 1px solid #c1b2b2 !important;
  color: #000 !important;
}

.cm-navbar .badge.bg-primary .cart-count {
  color: #000 !important;
}

.nb-houseoftea-menu .nav-link:last-child,
.nb-purchase-info .nav-link:last-child,
.nb-news .nav-link:last-child,
.nb-about-tea .nav-link:last-child {
  margin-right: 0;
}

.nb-search .input-group {
  margin-bottom: 0.5rem;
}

.nb-search .form-control {
  margin-bottom: 0.5rem;
  border-radius: 12px;
  -moz-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.24);
}

.nb-search .btn-search {
  background-color: #f9d607;
  border-color: #f9d607;
  color: #000000;
  border-radius: 0 12px 12px 0;
  -moz-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.24);
}

.cm-header-search .form-control {
  width: 1%;
  border-radius: 12px;
}

.cm-header-search {
  margin-bottom: 0.9rem;
  margin-top: 0;
  display: flex;
  justify-content: flex-end;
  flex: 0 0 100%;
  max-width: 100%;
}

.cm-header-search form {
  display: flex;
  justify-content: flex-end;
}

.cm-header-search .input-group {
  margin-left: auto;
  width: 18rem;
}


@media (max-width: 991.98px) {
  .cm-header-search {
    width: 100%;
  }

  .cm-header-search .input-group {
    width: 100%;
    margin-left: 0;
  }
}

@media (max-width: 575.98px) {
  .cm-header-search {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  .cm-header-search form {
    width: 100%;
    justify-content: stretch;
  }

  .cm-header-search .input-group {
    width: 100% !important;
    margin-left: 0 !important;
  }
}

.cm-header-search .btn {
  background-color: var(--hot-accent);
  border: 0 !important;
  color: var(--hot-text-strong);
  border-radius: 0 var(--hot-input-group-radius) var(--hot-input-group-radius) 0;
  -moz-box-shadow: none !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.cm-header-search .btn:hover,
.cm-header-search .btn:focus {
  background-color: var(--hot-accent-hover);
  border-color: transparent;
  color: var(--hot-text-strong);
  box-shadow: none !important;
  outline: none !important;
}

.cm-header-search .btn:focus-visible {
  box-shadow: none !important;
  outline: none !important;
}


@media (max-width: 539.98px) {
}

.cm-pi-buy-button .btn-buy,
.btn.btn-product-info.btn-buy {
  background-color: var(--hot-accent);
  border-color: var(--hot-text-strong);
  border-width: 1px;
  border-style: solid;
  color: var(--hot-text-strong);
}

.cm-pi-buy-button .btn-buy:hover,
.cm-pi-buy-button .btn-buy:focus,
.btn.btn-product-info.btn-buy:hover,
.btn.btn-product-info.btn-buy:focus {
  background-color: var(--hot-accent-hover);
  border-color: var(--hot-text-strong);
  color: var(--hot-text-strong);
}

.hot-product-thumb,
.pi-gallery img {
  color: transparent;
  font-size: 0;
  line-height: 0;
  text-indent: -9999px;
}

/* Om Bootstrap sätter top:0 via annan selector */
.alert-dismissible .btn-close {
  top: 50% !important;
  transform: translateY(-50%) !important;
}

.pi-qty-input .btn.spinner {
  background-color: var(--hot-surface);
  border-color: var(--hot-heading);
  color: var(--hot-text);
}

.pi-qty-input .btn.spinner:hover,
.pi-qty-input .btn.spinner:focus {
  background-color: var(--hot-surface-muted);
  border-color: var(--hot-heading);
  color: var(--hot-text-strong);
}

.pi-qty-input .form-control-lg {
  font-size: 1.1rem;
  padding: 0.35rem 0.6rem;
  max-width: 4.75rem;
  border: 1px solid #E6E6DE;
  border-left: 0;
  border-right: 0;
  border-radius: 999px;
  background-color: #FAFAF7;
  color: #3b2415;
}

.pi-qty-input .btn.spinner {
  padding: 0.25rem 0.7rem;
  font-size: 0.85rem;
  border: 1px solid var(--hot-heading);
  color: var(--hot-text);
  background-color: var(--hot-surface);
  border-radius: 0;
  height: 45px;
}

.pi-qty-input .input-group > .btn.spinner:first-child {
  border-top-left-radius: var(--hot-input-group-radius);
  border-bottom-left-radius: var(--hot-input-group-radius);
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.pi-qty-input .input-group > .btn.spinner:last-child {
  border-top-right-radius: var(--hot-input-group-radius);
  border-bottom-right-radius: var(--hot-input-group-radius);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.btn.btn-product-info.btn-buy {
  font-size: 1.2rem;
  padding: 0.35rem 0.9rem;
  width: auto;
  white-space: nowrap;
  margin-left: auto;
  margin-right: 0;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  border-radius: var(--hot-btn-radius);
  background-color: var(--hot-accent);
  border-color: var(--hot-text-strong);
  color: var(--hot-text);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
  height: 45px;
}

.pi-buy-button .btn-buy,
.cm-pi-buy-button .btn-buy {
  width: 100%;

}

.pi-buy-button,
.cm-pi-buy-button {
  max-width: 18rem;
  margin-left: auto;
  margin-right: 0;
  text-align: right;

}

.pi-qty-input {
  max-width: 18rem;
  background-color: transparent;
  padding: 0.6rem 0 0.25rem;
  margin-left: auto;
  margin-right: 0.5rem;
  text-align: right;
}

.pi-qty-buy {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  margin-top: 0.5rem;
}

.pi-qty-buy-row {
  display: flex;
  gap: 0.85rem;
  align-items: center;
  flex-wrap: nowrap;
  align-content: center;
}

.pi-qty-input,
.pi-buy-button,
.pi-qty-buy-row .pi-buy-button .btn {
  flex: 0 0 auto;
}

.pi-qty-buy .pi-qty-input {
  margin-left: 0;
  margin-right: 0;
  padding: 0;
  background: transparent;
  align-self: baseline;
}

.pi-qty-buy-row .pi-buy-button .btn {
  align-self: stretch;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.pi-qty-buy-row .pi-qty-input .form-control {
  height: auto;
  padding: 0.35rem 0.75rem;
  min-width: 3.2rem;
  max-width: 3.8rem;
}

.pi-qty-buy .pi-qty-input .input-group {
  margin: 0;
}

.pi-qty-buy-row .pi-qty-input {
  align-self: baseline;
}

.pi-qty-buy-row .pi-buy-button {
  align-self: baseline;
}

.pi-qty-buy .pi-buy-button {
  margin: 0;
}

.pi-qty-buy .hot-out-of-stock-note {
  margin-top: 0.45rem;
  text-align: left;
}

.pi-price,
.cm-pi-price {
  margin-bottom: 0.75rem;
}

.pi-qty-input .input-group {
  margin-left: auto;
}

.pi-qty-input .input-group {
  width: auto;
  justify-content: flex-end;
}

.pi-name,
.cm-pi-name {
  text-align: right;
  margin-bottom: 0.75rem;
}

.cm-pi-info-block,
.pi-info-block {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  text-align: right;
}

.pi-info-block {
  margin-top: 1.25rem;
}

.pi-info-list {
  margin: 0;
}

.pi-info-row {
  display: grid;
  grid-template-columns: auto 1fr;
  column-gap: 0.5rem;
  align-items: baseline;
  justify-content: end;
}

.pi-right-stack {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.pi-right-stack .pi-name,
.pi-right-stack .cm-pi-name {
  order: 10;
  width: 100%;
  margin: 0 0 0.35rem 0;
  padding-left: 0;
  padding-right: 0;
  text-align: left;
}

.pi-title-price-inline {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  font-family: var(--hot-heading-font-stack) !important;
  color: #9aa331 !important;
}

.pi-title-price-inline .display-4,
.pi-title-price-inline > h1.display-4 {
  display: inline-block;
  max-width: 100%;
  margin-bottom: 0.15rem;
  font-family: var(--hot-heading-font-stack) !important;
  color: #9aa331 !important;
}

.pi-title-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  column-gap: 1rem;
  width: 100%;
  max-width: 100%;
}

.pi-category-line {
  margin-top: 0;
  font-size: 1.08rem;
  font-weight: 600;
  font-family: inherit !important;
  color: inherit !important;
  line-height: 1.3;
}

.pi-inline-price {
  margin-left: auto;
  text-align: right;
  font-size: 1.6rem;
  font-weight: 400;
  font-family: inherit !important;
  line-height: 1.1;
  white-space: nowrap;
  color: inherit !important;
}

.pi-inline-price .productPrice,
.pi-inline-price .specialPrice,
.pi-inline-price del,
.pi-inline-price s {
  font-size: inherit;
  font-family: var(--hot-heading-font-stack);
  color: #9aa331 !important;
}

.pi-inline-price .text-danger,
.pi-inline-price .productSpecialPrice,
.pi-inline-price .productPrice.text-danger {
  color: var(--hot-danger, #b32020) !important;
}

.pi-right-stack .pi-price,
.pi-right-stack .cm-pi-price {
  display: none;
}

.pi-right-stack .pi-info-block {
  text-align: left;
  padding-left: 0;
  order: 30;
}

.pi-right-stack .pi-qty-buy {
  order: 40;
}

.pi-right-stack .pi-qty-input,
.pi-right-stack .pi-buy-button,
.pi-right-stack .cm-pi-buy-button {
  text-align: left;
  margin-left: 0;
  margin-right: auto;
}

.pi-right-stack .pi-qty-input {
  margin-top: 1.25rem;
  order: 40;
}

.pi-right-stack .pi-buy-button,
.pi-right-stack .cm-pi-buy-button {
  order: 50;
}

.pi-right-stack .pi-price .display-4,
.pi-right-stack .cm-pi-price .display-4 {
  margin-left: auto;
  margin-bottom: 0;
  text-align: right;
  white-space: nowrap;
}

.pi-right-stack .pi-buy-button {
  width: auto;
}

.pi-right-stack .pi-buy-button .d-grid {
  justify-items: start;
}

.pi-right-stack .pi-buy-button .btn {
  width: auto;
  margin-left: 0;
}

.pi-right-stack .pi-qty-input .input-group {
  margin-left: 0;
  justify-content: flex-start;
}

.cm-pi-weight-sizes {
  margin-top: 0.75rem;
}

.pi-weight-sizes-inner {
  border: 0;
  border-radius: 12px;
  background: #fff;
  padding: 0.55rem 0.65rem;
  min-height: 84px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.4rem;
}

.pi-weight-sizes-label {
  font-size: 0.82rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: #7b6950;
}

.pi-weight-sizes-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}

.pi-weight-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.75rem;
}

.pi-weight-chip.is-current {
  pointer-events: none;
}

.pi-weight-chip.is-disabled {
  opacity: 0.6;
}

.pi-weight-sizes-select-wrap {
  width: 100%;
  max-width: 260px;
}

.pi-weight-sizes-select {
  min-height: 36px;
  border-radius: 999px;
}

.pi-right-stack .cm-pi-weight-sizes {
  order: 45;
  text-align: left;
}

.pi-right-stack .cm-pi-weight-sizes .pi-weight-sizes-inner {
  margin-left: 0;
  margin-right: auto;
}

.pi-qty-buy .cm-pi-weight-sizes {
  margin-top: 0.2rem;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: auto;
  align-self: flex-start;
  width: auto;
  max-width: 18rem;
}

.pi-qty-buy .cm-pi-weight-sizes .pi-weight-sizes-inner {
  max-width: 18rem;
  min-height: 0;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0.35rem 0 0;
}

.pi-qty-buy .cm-pi-weight-sizes .pi-weight-sizes-label,
.pi-qty-buy .cm-pi-weight-sizes .pi-weight-sizes-chips {
  margin-left: 0;
  padding-left: 0;
}

/* Hide legacy standalone placement; weight sizes render inline in qty/buy block. */
.hot-product-info-box > .row.is-product > .cm-pi-weight-sizes {
  display: none !important;
}

.pi-right-stack .pi-buy-button {
  align-items: flex-start;
}

.pi-right-stack .pi-brew-profile {
  order: 60;
  text-align: left;
}

.pi-right-stack .cm-pi-review-stars,
.pi-right-stack .pi-review-stars {
  order: 70;
  text-align: left;
  margin-top: 1.25rem;
}

.pi-review-stars a {
  color: #000000;
}

.pi-review-stars a:hover,
.pi-review-stars a:focus {
  color: #3b2415;
}

.pi-brew-profile {
  margin-top: 1.25rem;
  padding: 0;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  color: #3b2415;
}

.pi-brew-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--hot-heading-font-stack);
  font-size: 0.95rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #6b3b1f;
  margin-bottom: 0.65rem;
}

.pi-brew-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}

.pi-brew-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  font-size: 0.85rem;
  color: #3b2415;
}

.pi-brew-chip-label {
  text-transform: uppercase;
  font-size: 0.65rem;
  letter-spacing: 0.08em;
  color: #6b3b1f;
}

.pi-brew-more {
  border: 1px solid rgba(0, 0, 0, 0.18);
  background: transparent;
  color: #6b3b1f;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  font-size: 0.9rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background-color 200ms ease, border-color 200ms ease;
}

.pi-brew-more:hover,
.pi-brew-more:focus {
  background-color: rgba(107, 59, 31, 0.08);
  border-color: rgba(107, 59, 31, 0.5);
}

.pi-brew-more-wrap {
  position: relative;
  display: inline-flex;
}

.pi-brew-tooltip {
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  min-width: 180px;
  max-width: 240px;
  padding: 0.55rem 0.65rem;
  border-radius: 8px;
  border: 1px solid rgba(0, 0, 0, 0.18);
  background: #ffffff;
  color: #3b2415;
  font-size: 0.82rem;
  line-height: 1.35;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
  transition: opacity 150ms ease, transform 150ms ease;
  z-index: 5;
}

.pi-brew-more-wrap:hover .pi-brew-tooltip,
.pi-brew-more-wrap:focus-within .pi-brew-tooltip,
.pi-brew-more-wrap.is-open .pi-brew-tooltip {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}


.pi-info-row dt {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 600;
  color: #6b3b1f;
}

.pi-info-row dd {
  margin: 0;
  font-size: 0.9rem;
  color: #3b2415;
}

.hot-product-buy-button {
  background-color: var(--hot-accent) !important;
  border-color: var(--hot-text-strong) !important;
  color: var(--hot-text) !important;
}

.hot-product-buy-button:hover,
.hot-product-buy-button:focus {
  background-color: var(--hot-accent-hover) !important;
  border-color: var(--hot-text-strong) !important;
  color: var(--hot-text-strong) !important;
}

.hot-checkout-box {
  background-color: #f1f1e6;
  border-radius: 6px;
  padding: 1.5rem;
}

.hot-checkout-box.checkout-shipping-page,
.hot-checkout-box.checkout-payment-page,
.hot-checkout-box.checkout-confirmation-page,
.hot-checkout-box.checkout-success-page,
.hot-checkout-box.contact-us-page,
.hot-checkout-box.logoff-page,
.hot-checkout-box.address-book-page,
.hot-checkout-box.address-book-process-page,
.hot-checkout-box.account-notifications-page,
.hot-checkout-box.account-newsletters-page,
.hot-checkout-box.account-nuke-page,
.hot-checkout-box.guest-review-page,
.hot-checkout-box.guest-order-page,
.hot-checkout-box.hot-gdpr-page {
  background-color: #ffffff;
}

.hot-checkout-box .list-group-item,
.hot-checkout-box .table > :not(caption) > * > * {
  background-color: #ffffff;
}

.hot-newsletter-optin {
  margin-top: 0.35rem;
}

.hot-newsletter-optin .form-check-label {
  color: var(--hot-text);
}

.hot-newsletter-consent-panel {
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transition: max-height 240ms ease, opacity 220ms ease;
}

.hot-newsletter-consent-panel.is-open {
  max-height: 400px;
  opacity: 1;
}

.hot-newsletter-consent-panel .alert {
  background-color: #ffffff !important;
  color: var(--hot-text);
}

.checkout-combined-shipping {
  --hot-shipping-price-col-width: 8.75rem;
}

.checkout-combined-shipping .checkout-shipping-headline {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.35rem;
}

.checkout-combined-shipping .checkout-shipping-brand {
  width: var(--hot-shipping-price-col-width);
  display: flex;
  align-items: center;
  justify-content: center;
}

.checkout-combined-shipping .checkout-shipping-brand img {
  display: block;
  width: auto;
  max-height: 24px;
}

.checkout-combined-shipping table[data-shipping-table] td.text-end {
  width: var(--hot-shipping-price-col-width);
  white-space: nowrap;
}

.hot-checkout-progress {
  margin-top: 1rem;
}

.hot-checkout-progress__steps {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem;
  margin: 0.55rem 0 0;
  padding: 0;
}

.hot-checkout-progress__step {
  color: #767676;
  font-weight: 500;
  width: max-content;
  justify-self: start;
  text-align: left;
}

.hot-checkout-progress__step:nth-child(2) {
  justify-self: center;
  text-align: center;
}

.hot-checkout-progress__step:nth-child(3) {
  justify-self: end;
  text-align: right;
}

.hot-checkout-progress__label {
  font-size: 0.88rem;
  line-height: 1.2;
}

.hot-checkout-progress__step.is-active {
  color: #1f1f1f;
  font-weight: 700;
}

.hot-checkout-progress__step.is-completed {
  color: #767676;
  font-weight: 500;
}

.hot-checkout-progress__bar {
  height: 8px;
  border-radius: 999px;
  background-color: #e2e2e2;
  overflow: hidden;
}

.hot-checkout-progress__bar > span {
  display: block;
  height: 100%;
  background-color: #8f8f8f;
  transition: width 220ms ease;
}

@media (max-width: 767.98px) {
  .hot-checkout-progress__steps {
    display: block;
    margin-top: 0.45rem;
  }

  .hot-checkout-progress__step,
  .hot-checkout-progress__step:nth-child(2),
  .hot-checkout-progress__step:nth-child(3) {
    display: none;
    width: auto;
    max-width: 100%;
    justify-self: start;
    text-align: left;
  }

  .hot-checkout-progress__step.is-active {
    display: block;
  }

  /* Optional checkout fields (c/o, company): keep toggle links left-aligned on mobile widths. */
  .checkout-payment-page .hot-optional-field-toggle,
  .checkout-guest-page .hot-optional-field-toggle,
  .checkout-payment-address-page .hot-optional-field-toggle,
  .checkout-shipping-address-page .hot-optional-field-toggle {
    text-align: left !important;
  }

  .checkout-payment-page .hot-optional-toggle,
  .checkout-guest-page .hot-optional-toggle,
  .checkout-payment-address-page .hot-optional-toggle,
  .checkout-shipping-address-page .hot-optional-toggle {
    display: inline-block;
    max-width: 100%;
    text-align: left !important;
    white-space: normal;
  }
}

.guest-order-login-hint {
  margin-bottom: 1rem;
  color: #3b2415;
  background-color: #fafaf4;
  border-color: #dfdfd3 !important;
}

.guest-order-login-hint .alert-link {
  color: #3b2415;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* I offcanvas: runda +/- oavsett att hidden input ligger sist */
#offcanvasAjaxCart .input-group > button.spinner[data-qty-change="1"]{
  border-top-right-radius: var(--hot-input-group-radius) !important;
  border-bottom-right-radius: var(--hot-input-group-radius) !important;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}

#offcanvasAjaxCart .input-group > button.spinner[data-qty-change="-1"]{
  border-top-left-radius: var(--hot-input-group-radius) !important;
  border-bottom-left-radius: var(--hot-input-group-radius) !important;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* Se till att mitten (number input) inte rundas */
#offcanvasAjaxCart .input-group > input[type="number"]{
  border-radius: 0 !important;
}

@media (min-width: 768px) {
  .cm-header-search {
    flex: 0 0 50%;
    max-width: 50%;
    margin-left: auto;
    display: flex;
    justify-content: flex-end;
  }
  .cm-header-search form {
    width: 50%;
    max-width: 50%;
  }
  .cm-header-search .input-group {
    width: 100%;
    margin-left: auto;
  }
}

@media (min-width: 992px) {
  #columnRight {
    flex: 0 0 8cm;
    max-width: 8cm;
  }
  #columnLeft {
    position: sticky;
    top: 95px;
    align-self: flex-start;
  }
}

.nb-offcanvas-cart-title {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.nb-offcanvas-qty input[name="cart_quantity[]"] {
  max-width: 58px;
  text-align: center;
}

.nb-offcanvas-item-link {
  color: #111111;
}

.nb-offcanvas-item-link:hover,
.nb-offcanvas-item-link:focus {
  color: #111111;
  text-decoration: none;
}

.nb-offcanvas-item-row {
  gap: 8px;
  display: flex;
  align-items: center;
  width: 100%;
}

.nb-offcanvas-item-image {
  flex: 0 0 64px;
  max-width: 64px;
}

.nb-offcanvas-qty {
  flex: 0 0 120px;
  min-width: 120px;
  margin-left: auto;
}

.nb-offcanvas-line-total {
  flex: 0 0 90px;
  min-width: 90px;
}

.nb-offcanvas-item-image img {
  display: block;
  width: 64px;
  height: 64px;
  object-fit: contain;
}

.nb-offcanvas-qty.pi-qty-input {
  margin: 0;
  padding: 0;
}

.nb-offcanvas-qty .input-group {
  justify-content: center;
  flex-wrap: nowrap;
}

.nb-offcanvas-qty .form-control-lg {
  max-width: 2.8rem;
  min-width: 2.8rem;
  font-size: 0.8rem;
  padding: 0.2rem 0.25rem;
}

.nb-offcanvas-qty .btn.spinner {
  padding: 0.15rem 0.4rem;
  font-size: 0.75rem;
  border-radius: 0 !important;
  position: relative; /* så z-index tar */
  z-index: 1;
}

.nb-offcanvas-qty .input-group > .btn.spinner:first-child {
  border-top-left-radius: 999px !important;
  border-bottom-left-radius: 999px !important;
  position: relative; /* så z-index tar */
  z-index: 1;
}

.nb-offcanvas-qty .input-group > .btn.spinner:last-child {
  border-top-right-radius: 999px !important;
  border-bottom-right-radius: 999px !important;
}

.nb-offcanvas-actions-body {
  background-color: #f1f1e6;
}

.nb-offcanvas-actions {
  background-color: #f1f1e6;
  border-bottom-left-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
  overflow: visible;
}

.nb-offcanvas-meta-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  column-gap: 0.75rem;
}

#offcanvasAjaxCart .nb-offcanvas-meta-row .nb-offcanvas-scroll-hint {
  grid-column: 1;
}

#offcanvasAjaxCart .nb-offcanvas-meta-row .nb-offcanvas-clear {
  grid-column: 2;
  justify-self: end;
  text-align: right !important;
}

#offcanvasAjaxCart .nb-offcanvas-meta-row .nb-offcanvas-clear > a {
  display: inline-flex;
  align-items: center;
  min-height: 1.95rem;
}

.nb-offcanvas-cart .offcanvas-body {
  background-color: #f1f1e6;
  position: relative;
  overscroll-behavior: contain;
}

.nb-offcanvas-cart .list-group-item {
  background-color: #ffffff;
}

.nb-offcanvas-actions .nb-offcanvas-cta {
  background-color: #9aa331;
  border-color: #9aa331;
  color: #ffffff;
}

.nb-offcanvas-actions .nb-offcanvas-cta:hover,
.nb-offcanvas-actions .nb-offcanvas-cta:focus {
  background-color: #7f8628;
  border-color: #7f8628;
  color: #ffffff;
}

.nb-offcanvas-cart.is-cart-locked .nb-offcanvas-qty .spinner,
.nb-offcanvas-cart.is-cart-locked .nb-offcanvas-qty input[name="cart_quantity[]"] {
  opacity: 0.55;
  cursor: not-allowed;
}

.nb-offcanvas-cart.is-cart-locked .nb-offcanvas-qty .spinner {
  pointer-events: none;
}

.nb-offcanvas-cart.is-cart-locked .nb-offcanvas-clear .is-disabled {
  opacity: 0.6;
  cursor: not-allowed;
  display: inline-block;
}

.nb-offcanvas-total {
  font-size: 1.05rem;
}

.nb-offcanvas-scroll-hint {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin: 0;
  font-size: 0.8rem;
  cursor: pointer;
  user-select: none;
  align-self: end;
  justify-self: start;
  min-height: 1.95rem;
  padding: 0 0.6rem !important;
  position: relative;
  top: 1px;
}

#offcanvasAjaxCart .nb-offcanvas-scroll-hint.btn,
#offcanvasAjaxCart .nb-offcanvas-scroll-hint.btn:hover,
#offcanvasAjaxCart .nb-offcanvas-scroll-hint.btn:focus,
#offcanvasAjaxCart .nb-offcanvas-scroll-hint.btn:focus-visible,
#offcanvasAjaxCart .nb-offcanvas-scroll-hint.btn:active,
#offcanvasAjaxCart .nb-offcanvas-scroll-hint.btn.active {
  background-color: #ffffff !important;
  border-color: var(--hot-border, #d8d2c4) !important;
  color: var(--hot-text, #3b2415) !important;
  box-shadow: none !important;
}

#offcanvasAjaxCart .nb-offcanvas-scroll-hint.d-none {
  display: inline-flex !important;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

#offcanvasAjaxCart.has-scroll-hint .nb-offcanvas-scroll-hint {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.nb-offcanvas-scroll-hint:hover,
.nb-offcanvas-scroll-hint:focus {
  color: #3b2415;
  text-decoration: none;
  outline: none;
}

.nb-offcanvas-scroll-hint .fa-chevron-down {
  font-size: 0.74rem;
  opacity: 0.85;
}

.nb-offcanvas-cart:not(.has-scroll-hint) .nb-offcanvas-scroll-hint {
  display: none !important;
}

.cm-login-form .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost),
.cm-forgot-password .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost),
.cm-create-account-link .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost),
.cm-pwa_login .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost) {
  background-color: #9aa331 !important;
  border-color: #9aa331 !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.cm-login-form .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):hover,
.cm-login-form .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):focus,
.cm-forgot-password .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):hover,
.cm-forgot-password .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):focus,
.cm-create-account-link .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):hover,
.cm-create-account-link .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):focus,
.cm-pwa_login .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):hover,
.cm-pwa_login .btn:not(.hot-primary):not(.hot-secondary):not(.hot-danger):not(.hot-ghost):focus {
  background-color: #7f8628 !important;
  border-color: #7f8628 !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.guest-review-side {
  background-color: #fafaf4;
  border: 1px solid #e2e2d6;
  border-radius: 6px;
  padding: 0.85rem;
}

.guest-review-image img {
  width: 100%;
  height: auto;
}

.guest-review-description {
  font-size: 0.95rem;
  line-height: 1.5;
}

.rating .rating-best-label {
  margin-inline-start: 0.55em;
}

.hot-review-headline {
  font-size: 28.8px !important;
}

.cm-login-form.offset-sm-3,
.cm-forgot-password.offset-sm-3,
.cm-create-account-link.offset-sm-3,
.cm-pwa_login.offset-sm-3 {
  margin-left: 0 !important;
}

.cm-login-form,
.cm-forgot-password,
.cm-create-account-link,
.cm-pwa_login {
  width: 100%;
}

.cm-login-form .inputRequirement,
.cm-login-form .form-control-feedback {
  display: none;
}

.product-total-spacer td {
  padding: 0.75rem 0;
  border: 0;
}

.hot-checkout-box table.table tbody tr:last-child td {
  border-bottom: 0;
}

.hot-checkout-box .table-group-divider {
  border-top: 1px solid #d7dcc3;
}

.hot-checkout-box .card {
  background-color: #ffffff;
  border-color: #e2e2d6;
  border: none;
}

.account-history-full {
  margin: 0;
}

.account-history-full .table {
  margin-bottom: 0;
}

.account-history-head th {
  background-color: #efefea;
  color: #000000;
  border-bottom: 1px solid #d7dcc3;
}

.hot-checkout-box .table > .account-history-head > tr > th {
  background-color: #efefea !important;
  color: #000000 !important;
}

.account-history-list {
  background-color: transparent;
  border-radius: 0;
  padding: 0;
}

.account-order-block {
  border: 1px solid #e6e6db;
  border-radius: 10px;
  padding: 1rem 1.1rem;
  margin-bottom: 0.9rem;
  background-color: #ffffff;
}

.account-order-block:last-child {
  margin-bottom: 0;
}

.account-order-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.55rem 1.1rem;
  flex-wrap: wrap;
}

.account-order-row-main {
  border-bottom: 1px solid #ecece2;
  padding-bottom: 0.65rem;
  margin-bottom: 0.65rem;
}

.account-order-main-left {
  display: grid;
  gap: 0.2rem;
  font-size: 1rem;
}

.account-order-id-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem;
}

.account-order-main-left strong {
  font-size: 1.1rem;
  color: #1f1f1f;
}

.account-order-status-line {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.4rem;
}

.account-order-status-value {
  color: #3b2415;
  font-weight: 700;
  font-size: 1.12rem;
}

.account-order-main-right {
  margin-left: auto;
  text-align: right;
  display: grid;
  gap: 0.2rem;
}

.account-order-main-right > div {
  display: flex;
  justify-content: flex-end;
  align-items: baseline;
  gap: 0.4rem;
}

.account-order-total {
  font-weight: 700;
  font-size: 1.12rem;
  color: #2a2a2a;
}

.account-order-items {
  color: #44443a;
  font-size: 0.92rem;
}

.account-order-label {
  color: #6f6f64;
  font-weight: 600;
  font-size: 0.73rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.account-order-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1rem;
  color: #2f2f2f;
  font-size: 0.94rem;
}

.account-order-meta-group {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.45rem 0.75rem;
}

.account-order-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  justify-content: flex-end;
  margin-left: auto;
}

.account-order-actions--left {
  margin-left: 0;
  margin-right: auto;
  justify-content: flex-start;
  align-items: flex-start;
  position: relative;
}

.account-order-actions--right {
  margin-left: auto;
  justify-content: flex-end;
}

.account-order-request-details {
  position: relative;
}

.account-order-request-details > summary {
  display: inline-flex;
  align-items: center;
  list-style: none;
  cursor: pointer;
}

.account-order-request-details > summary::-webkit-details-marker {
  display: none;
}

.account-order-request-details[open] > summary {
  margin-bottom: 0;
}

.account-order-request-body {
  width: min(520px, calc(100vw - 2rem));
  background: #f8f8f4;
  border: 1px solid #dfdfd3;
  border-radius: 8px;
  padding: 0.75rem 0.85rem;
  position: absolute;
  top: calc(100% + 0.4rem);
  left: 0;
  z-index: 25;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.08);
  max-width: calc(100vw - 2rem);
}

.account-order-action-panel-inline {
  background: #ffffff;
  border: 1px solid #e6e6db;
  border-radius: 10px;
  box-shadow: none;
  padding: 0.75rem 0.8rem;
}

.account-order-action-panel-inline .oar-actions-inline {
  display: flex;
  flex-wrap: nowrap;
  gap: 0.45rem;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  overflow: visible;
  overflow-y: visible;
  padding-bottom: 0.1rem;
}

.account-order-action-panel-inline .oar-actions-inline > .account-order-request-details {
  margin: 0;
  flex: 0 0 auto;
}

.account-order-action-panel-inline .oar-actions-inline > .account-order-request-details > summary {
  white-space: nowrap;
}

.account-order-action-panel-inline .account-order-request-body {
  background: #ffffff;
  border-color: #dfdfd3;
  box-shadow: none;
  box-sizing: border-box;
  overflow: visible;
  min-width: 0;
}

@media (max-width: 1199.98px) {
  .account-order-action-panel-inline .oar-actions-inline {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    gap: 0.35rem;
    align-items: flex-start;
    width: 100%;
    padding-bottom: 0;
    overflow: visible;
  }

  .account-order-action-panel-inline .oar-actions-inline > .account-order-request-details {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
  }

  .account-order-action-panel-inline .oar-actions-inline > .account-order-request-details > summary {
    width: 100%;
    min-width: 0;
    justify-content: center;
    text-align: center;
    white-space: nowrap;
    line-height: 1.2;
    padding-left: 0.45rem !important;
    padding-right: 0.45rem !important;
  }

  .account-order-action-panel-inline .oar-actions-inline > .account-order-request-details:not([open]) > .account-order-request-body {
    display: none;
  }

  .account-order-action-panel-inline .account-order-request-body {
    position: absolute !important;
    top: calc(100% + 0.45rem) !important;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
    width: calc(200% + 0.35rem) !important;
    max-width: none !important;
    margin-top: 0;
    z-index: 35;
    box-sizing: border-box;
  }

  .account-order-action-panel-inline .oar-actions-inline > .account-order-request-details:nth-child(2) > .account-order-request-body {
    left: auto !important;
    right: 0 !important;
  }

  .account-order-action-panel-inline .oar-actions-inline > .account-order-request-details:only-child > .account-order-request-body {
    width: 100% !important;
  }
}

@media (min-width: 576px) and (max-width: 1199.98px) {
  .account-order-action-panel-inline .oar-actions-inline {
    gap: 0.25rem;
  }

  .account-order-action-panel-inline .oar-actions-inline > .account-order-request-details > summary {
    font-size: 0.84rem !important;
    padding-left: 0.3rem !important;
    padding-right: 0.3rem !important;
  }
}

.oar-panel-close {
  position: absolute;
  top: 0.3rem;
  right: 0.45rem;
  border: 0;
  background: transparent;
  color: #6d6d61;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 0.9;
  padding: 0.1rem 0.2rem;
  cursor: pointer;
}

.oar-panel-close:hover,
.oar-panel-close:focus {
  color: #2f2f2f;
}

.account-oar-lines-heading {
  font-weight: 600;
  font-size: 0.96rem;
}

.account-order-inline-toast {
  width: 100%;
  margin-top: 0.65rem;
}

.account-order-inline-toast .cm-inline-cart-toast {
  margin-top: 0;
}

.account-order-action {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  border-radius: var(--hot-btn-radius);
  font-weight: 600;
  text-decoration: none;
}

.account-order-action:hover,
.account-order-action:focus {
  text-decoration: none;
}

.account-order-action.is-disabled {
  background-color: #ececec;
  border-color: #cfcfcf;
  color: #666666;
  pointer-events: none;
}

.account-order-action--secondary {
  background: #f8f8f3;
  border-color: #dfdfd3;
  color: #3d3d3d;
  font-weight: 500;
}

.account-order-action--secondary:hover,
.account-order-action--secondary:focus {
  background: #f0f0e9;
  border-color: #d5d5c8;
  color: #262626;
}

.account-order-action.account-order-action--secondary.is-disabled {
  background-color: #ececec;
  border-color: #cfcfcf;
  color: #666666;
}

.account-history-page {
  background-color: transparent;
  padding: 0;
}

.account-history-info-page {
  background-color: #ffffff;
}

.account-history-info-page .account-history-product-cell {
  font-weight: 600;
}

.account-history-info-page .account-history-product-cell small {
  font-weight: 400;
}

.order-history-comment-text {
  overflow-wrap: anywhere;
  word-break: break-word;
}

.account-invoice-wrapper {
  background-color: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 6px;
  padding: 1rem;
}

.account-invoice-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.75rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  margin-bottom: 0.75rem;
  padding-bottom: 0.75rem;
}

.account-invoice-subtitle {
  color: #111111;
  font-weight: 600;
}

.account-invoice-meta {
  text-align: right;
}

.account-invoice-address {
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 6px;
  padding: 0.75rem;
  background-color: #ffffff;
}

.account-invoice-table th {
  color: #000000;
}

@media (max-width: 767.98px) {
  .account-order-main-right {
    width: 100%;
    margin-left: 0;
    text-align: left;
    gap: 0.15rem;
  }

  .account-order-main-right > div {
    justify-content: flex-start;
  }

  .account-order-actions {
    width: 100%;
    justify-content: flex-start;
    margin-left: 0;
    gap: 0.4rem;
  }

  .account-order-actions--right,
  .account-order-actions--left {
    width: 100%;
    gap: 0.4rem;
    margin-right: 0;
  }

  .account-order-action {
    flex: 0 1 auto;
  }

  .account-invoice-meta {
    text-align: left;
  }
}

@media print {
  .invoice-actions,
  .guest-order-login-hint,
  .guest-order-actions,
  .cm-navbar,
  .footer,
  .footer-extra,
  .breadcrumb {
    display: none !important;
  }

  body,
  .hot-checkout-box,
  .account-invoice-wrapper {
    background: #ffffff !important;
  }

  .account-invoice-wrapper {
    border: 0 !important;
    padding: 0 !important;
  }
}

.hot-login-box {
  background-color: transparent;
  padding: 0;
}

.cm-login-form,
.cm-forgot-password,
.cm-create-account-link,
.cm-pwa_login {
  background-color: #ffffff;
  padding: 1.5rem;
  border-radius: 6px;
}

.cm-login-form {
  margin-bottom: 0 !important;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  padding-bottom: 0.75rem;
}

.cm-forgot-password {
  margin-top: 0 !important;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  padding-top: 0.5rem;
}

.cm-create-account-link {
  margin-top: 1.25rem !important;
}

.cm-pwa_login {
  margin-top: 1.25rem !important;
}

.cm-login-section-title {
  color: #9aa331;
  font-family: var(--hot-heading-font-stack);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.cm-login-section-icon {
  font-size: 1rem;
  opacity: 0.85;
}

.cm-login-form::after,
.cm-create-account-link::after {
  content: "";
  display: block;
  height: 1px;
  background-color: rgba(154, 163, 49, 0.2);
  margin-top: 1.25rem;
}

.cm-login-form .d-grid {
  margin-bottom: 0.75rem;
}

.nb-offcanvas-actions .nb-offcanvas-cta {
  border-radius: var(--hot-btn-radius);
  font-weight: 600;
}

.nb-offcanvas-actions .nb-offcanvas-cta:hover,
.nb-offcanvas-actions .nb-offcanvas-cta:focus {
  text-decoration: none;
}

.nb-offcanvas-cart .empty-cart p {
  font-size: 1.15rem;
}

.nb-offcanvas-cart .nb-offcanvas-toast-slot {
  border-top: 0;
  padding: 0.4rem 0.75rem 0.2rem;
  background: transparent;
}

.nb-offcanvas-cart .nb-offcanvas-toast-slot .cm-inline-cart-toast {
  margin-top: 0;
}

@media (max-width: 576px) {
  .nb-offcanvas-cart {
    --bs-offcanvas-width: 100vw;
  }
}

/* House of Tea navbar/header background */
.cm-navbar,
.header,
.bg-body-secondary,
.bg-body-tertiary {
  --bs-secondary-bg-rgb: 227, 228, 214 !important;
  --bs-tertiary-bg-rgb: 227, 228, 214 !important;
  background-color: #e3e4d6 !important;
}

/* Navbar offcanvas (hamburger): behåll sidans bakgrundston */
.cm-navbar #collapseCoreNav.offcanvas,
.cm-navbar #collapseCoreNav .offcanvas-header,
.cm-navbar #collapseCoreNav .offcanvas-body {
  --bs-secondary-bg-rgb: 227, 228, 214 !important;
  --bs-tertiary-bg-rgb: 227, 228, 214 !important;
  background-color: #e3e4d6 !important;
}

/* Offcanvas section helpers */
.cm-navbar #collapseCoreNav .hot-offcanvas-only {
  display: none;
}

.cm-navbar .hot-nav-icon-label {
  display: none;
}

@media (max-width: 991.98px) {
  /* Show these helpers only when offcanvas menu is actually open */
  .cm-navbar #collapseCoreNav.show .hot-offcanvas-only,
  .cm-navbar #collapseCoreNav.showing .hot-offcanvas-only,
  .cm-navbar #collapseCoreNav.hiding .hot-offcanvas-only {
    display: block;
  }

  .cm-navbar #collapseCoreNav.show li.hot-offcanvas-only,
  .cm-navbar #collapseCoreNav.showing li.hot-offcanvas-only,
  .cm-navbar #collapseCoreNav.hiding li.hot-offcanvas-only {
    display: list-item;
  }

  .cm-navbar #collapseCoreNav .hot-offcanvas-header-title {
    color: #9aa331;
    font-family: var(--hot-heading-font-stack);
    font-size: 1.4rem;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 400;
  }

  .cm-navbar #collapseCoreNav .hot-offcanvas-divider {
    margin: 0.9rem 0 0.45rem;
    padding-top: 0.72rem;
    border-top: 1px solid rgba(59, 36, 21, 0.18);
  }

  .cm-navbar #collapseCoreNav .hot-offcanvas-contact-link {
    color: #9aa331 !important;
    font-family: var(--hot-heading-font-stack);
    font-size: 1.4rem;
    letter-spacing: 1px;
    text-transform: uppercase;
    font-weight: 400;
  }

  .cm-navbar #collapseCoreNav.show .hot-nav-icon-label,
  .cm-navbar #collapseCoreNav.showing .hot-nav-icon-label,
  .cm-navbar #collapseCoreNav.hiding .hot-nav-icon-label {
    display: inline-block;
    color: #3b2415;
    font-size: 1rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-transform: none;
    white-space: nowrap;
  }

  .cm-navbar #collapseCoreNav .hot-offcanvas-contact-link:hover,
  .cm-navbar #collapseCoreNav .hot-offcanvas-contact-link:focus {
    color: #7f8628 !important;
  }
}

/* Mobil offcanvas: en vit panel över hela menydelen */
@media (max-width: 767.98px) {
  .cm-navbar #collapseCoreNav .offcanvas-body {
    background-color: #ffffff !important;
    border: 1px solid #e6e1d4;
    border-radius: 12px;
    margin: 0.5rem;
    padding: 0.5rem !important;
  }

  .cm-navbar #collapseCoreNav .offcanvas-body > .navbar-nav.navbar-nav-left,
  .cm-navbar #collapseCoreNav .offcanvas-body > .navbar-nav.navbar-nav-center,
  .cm-navbar #collapseCoreNav .offcanvas-body > .navbar-nav.navbar-nav-right {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    padding: 0 !important;
  }
}

@media (max-width: 575.98px) {
  .checkout-combined-shipping .checkout-shipping-brand,
  .checkout-combined-shipping table[data-shipping-table] td.text-end {
    width: auto;
  }
}
table[data-shipping-table] > tbody > tr.table-selection.table-active {
  --bs-table-active-bg: #ebebeb;
}
.table-success.table-active {
  --bs-table-hover-bg: #f1f0f0;
}
.table-success.table-active {
  --bs-table-hover-bg: #f1f0f0;
}

.table-selection.table-active {
  --bs-table-hover-bg: #f1f0f0;
}
table[data-payment-table] td,
table[data-payment-table] th,
table[data-payment-table] label {
  font-family: inherit;
}

table[data-payment-table].table-hover > tbody > tr.table-selection:hover > * {
  background-color: #f1f0f0 !important;
  background-image: none !important;
}

table[data-payment-table] tr.table-success,
table[data-payment-table] tr.table-success > td,
table[data-payment-table] tr.table-success > th {
  --bs-table-bg: #e1e1e1 !important;
  --bs-table-accent-bg: #e1e1e1 !important;
  --bs-table-hover-bg: #e1e1e1 !important;
  background-color: #e1e1e1 !important;
  background-image: none !important;
}

table[data-payment-table].table-hover tr.table-success:hover,
table[data-payment-table].table-hover tr.table-success:hover > td,
table[data-payment-table].table-hover tr.table-success:hover > th {
  background-color: #e1e1e1 !important;
  background-image: none !important;
}

table[data-payment-table].table-hover > tbody > tr:hover > * {
  background-color: #f1f0f0 !important;
  background-image: none !important;
}

table[data-payment-table] .form-check-label {
  font-weight: 600;
}

table[data-payment-table] .checkout-payment-method-title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

table[data-payment-table] .checkout-payment-method-help {
  margin-top: 0.2rem;
}

table[data-payment-table] .checkout-payment-method-icons {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

table[data-payment-table] .checkout-payment-method-icons img {
  display: block;
  width: auto;
  height: 24px;
}

table[data-payment-table] .checkout-payment-method-icons img.checkout-payment-icon-visa {
  height: 20px;
}

table[data-payment-table] .checkout-payment-method-icons img.checkout-payment-icon-mastercard {
  height: 30px;
}

table[data-payment-table] .checkout-payment-method-icons img.checkout-payment-icon-swish {
  height: 40px;
}

table[data-payment-table] .checkout-payment-method-icons img.checkout-payment-icon-bankgiro {
  height: 26px;
  max-width: 128px;
}

/* Rabattkortet: tona ner Bootstrap-card */
.cm-sc-discount .card {
/*   border: 1px solid rgba(0,0,0,.08);*/
  border-radius: 10px;
}

.cm-sc-discount .card-header {
  background: transparent;
  border-bottom: 0;
  padding: .75rem .9rem .2rem;
  font-weight: 600;
}

.cm-sc-discount .card-body {
  padding: .6rem .9rem .9rem;

}
.cm-sc-discount form[name="discount"] .btn.btn-danger {
  background: transparent;
  color: #3b2415;
  border-radius: 10px;
  padding: .45rem .75rem;
}

.cm-sc-discount form[name="discount"] .btn.btn-danger:hover {
  background: #F2F2EA;
  border-color: #D2CCBA;
}
/* Begränsa rabattkortets bredd på desktop */
@media (min-width: 768px){
  .cm-sc-discount{
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }

  .cm-sc-checkout{
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    margin-top: 1rem;
    margin-left: auto;
  }
}

/* Checkout payment: keep discount module on the left side */
.checkout-payment-page .cm-sc-discount {
  margin-left: 0 !important;
  margin-right: auto;
}

.checkout-payment-page .hook-discountcode-container {
  margin-left: 0 !important;
  margin-right: auto !important;
}

@media (min-width: 768px) {
  .checkout-payment-page .row > .cm-sc-discount {
    order: -1;
  }
}

.contact-us-info {
  max-width: 480px;
  color: #3b2415;
  line-height: 1.45;
}

.contact-us-info a {
  color: #3b2415;
  text-decoration: none;
}

.contact-us-info a:hover,
.contact-us-info a:focus {
  color: #000000;
  text-decoration: underline;
}

.contact-us-email-image {
  max-width: 100%;
  height: auto;
}

.contact-us-turnstile-slot .turnstile-wrap {
  margin-top: 0 !important;
}

/* Rabattkod input: samma känsla som navbar search */
.cm-sc-discount .input-group > .form-control:not([type="hidden"]) {
  border-radius: 12px 0 0 12px;
  -moz-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.24);
}

.hook-discountcode-container .input-group > .form-control:not([type="hidden"]) {
  border-radius: 12px 0 0 12px !important;
  -moz-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.24);
}

.cm-sc-discount .input-group .btn {
  border-radius: 0 12px 12px 0;
  -moz-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.24);
}

.hook-discountcode-container .input-group .btn {
  border-radius: 0 12px 12px 0;
  -moz-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.4);
  box-shadow: inset 1px 2px 2px rgba(0, 0, 0, 0.24);
}

.hook-discountcode .form-control {
  border-radius: 12px;
}

.cm-sc-discount .form-control.is-valid,
.hook-discountcode-container .form-control.is-valid,
.hook-discountcode .form-control.is-valid {
  padding-right: 2.25rem;
  background-position: right 0.65rem center;
}
.cm-sc-discount .btn-apply-discount,
.cm-sc-discount button[type="submit"].btn,
.cm-sc-discount input[type="submit"].btn {
  background-color: var(--hot-surface);
  border: 1px solid var(--hot-heading);
  color: var(--hot-text);
  border-radius: 10px;
}

.cm-sc-discount .btn-apply-discount:hover,
.cm-sc-discount button[type="submit"].btn:hover,
.cm-sc-discount input[type="submit"].btn:hover {
  background-color: var(--hot-surface-muted);
  border-color: var(--hot-heading);
  color: var(--hot-text);
}
.cm-sc-discount .btn-apply-discount:disabled,
.cm-sc-discount .btn-apply-discount.disabled {
  background-color: var(--hot-surface) !important;
  color: rgba(59, 36, 21, 0.55) !important;
  opacity: .65;               /* tydligt disabled */
}
.cm-sc-discount .btn.btn-primary{
  background-color: var(--hot-surface) !important;
  border-color: var(--hot-heading) !important;
  color: var(--hot-text) !important;
}
.cm-sc-discount .btn.btn-primary:hover{
  background-color: var(--hot-surface-muted) !important;
  border-color: var(--hot-heading) !important;
  color: var(--hot-text) !important;
}

.cm-sc-discount .discount-apply {
  background-color: var(--hot-surface) !important;
  border-color: var(--hot-heading) !important;
  color: var(--hot-text) !important;
}

.discount-code-toggle-link {
  background: none;
  border: 0;
  display: inline-block;
  font: inherit;
  margin-top: 0.5rem;
  padding: 0;
  color: #3b2415;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
}

.discount-code-toggle-link:hover,
.discount-code-toggle-link:focus {
  color: #000000;
}

/* Checkout knapp shopping cart */

.cm-sc-checkout .shopping-cart-checkout-btn {
  width: 190px;
  text-align: center;
  border-radius: var(--hot-btn-radius) !important;
}

@media (min-width: 768px){
  .cm-sc-checkout .d-grid{
    display: flex !important;
    justify-content: flex-end;
    margin-top: 2.35rem;
  }

  .cm-sc-checkout .shopping-cart-checkout-btn {
    margin-right: 15px;
    padding-left: 1.2rem;
    padding-right: 1.2rem;
  }
}

/* Delsumma + ordertotal: vit bakgrund ner till summeringsslutet */
.cm-sc-order-subtotal,
.cm-sc-discount,
.cm-sc-checkout,
.cm-sc-order-total {
  background-color: #ffffff;
}

.cm-sc-order-subtotal {
  padding: 0.5rem 0.75rem;
  flex: 0 0 100%;
  max-width: 100%;
  width: 100%;
  margin-left: 0 !important;
}

.cm-sc-order-subtotal p {
  text-align: right !important;
  margin-left: 0;
  margin-right: 0 !important;
  max-width: none !important;
  width: 100%;
}

/* Fill full width under cart table in shopping cart only. */
.hot-checkout-box.shopping-cart-page > .row {
  background-color: #ffffff;
}


/* Ensure cart remove buttons look identical on every row. */
.shopping-cart-page .sc-remove-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 2.1rem;
  height: 2rem;
  padding: 0 0.58rem !important;
  line-height: 1;
  white-space: nowrap;
  --bs-btn-bg: var(--hot-danger);
  --bs-btn-border-color: var(--hot-danger);
  --bs-btn-hover-bg: var(--hot-danger-hover);
  --bs-btn-hover-border-color: var(--hot-danger-hover);
  --bs-btn-active-bg: var(--hot-danger-hover);
  --bs-btn-active-border-color: var(--hot-danger-hover);
  background: var(--hot-danger) !important;
  background-color: var(--hot-danger) !important;
  border-color: var(--hot-danger) !important;
}

.shopping-cart-page .sc-remove-btn .sc-remove-icon {
  color: #ffffff !important;
  font-size: 0.95rem;
  line-height: 1;
}

/* Fallback: enforce same remove-button look in the last cart column. */
.shopping-cart-page .cm-sc-product-listing tbody tr.sc-row td:last-child .btn,
.shopping-cart-page .cm-sc-product-listing tbody tr.sc-row td:last-child a.btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 2.1rem !important;
  min-width: 2.1rem !important;
  height: 2rem !important;
  padding: 0 !important;
  border-radius: 999px !important;
  background-color: var(--hot-danger) !important;
  border: 1px solid var(--hot-danger) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

.shopping-cart-page .cm-sc-product-listing tbody tr.sc-row td:last-child .btn:hover,
.shopping-cart-page .cm-sc-product-listing tbody tr.sc-row td:last-child a.btn:hover {
  background-color: var(--hot-danger-hover) !important;
  border-color: var(--hot-danger-hover) !important;
  color: #ffffff !important;
}

/* Shopping cart compact layout: product name above qty/price/remove */
@media (max-width: 899.98px) {
  .shopping-cart-page .cm-sc-product-listing .table-responsive {
    overflow-x: visible;
  }

  .shopping-cart-page .cm-sc-product-listing thead {
    display: none !important;
  }

  /* Hide image column in compact layout */
  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row > td.sc-cell-image {
    display: none !important;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row {
    display: grid !important;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    grid-template-areas:
      "product product product product"
      "qty stock price remove";
    gap: 0.55rem 0.65rem;
    border-bottom: 1px solid #ece8dd;
    padding: 0.7rem 0.15rem 0.85rem;
    align-items: center;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row:last-child {
    border-bottom: none;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row > th,
  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row > td {
    display: block !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    padding: 0;
    margin: 0;
    box-shadow: none !important;
    background-color: transparent !important;
    vertical-align: middle !important;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-product {
    grid-area: product;
    padding: 0 0.2rem;
    min-width: 0;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-qty {
    grid-area: qty;
    padding: 0 0.2rem;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-price {
    grid-area: price;
    padding: 0 0.2rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    white-space: nowrap;
    align-self: center;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-remove {
    grid-area: remove;
    padding: 0 0.2rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    align-self: center;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-stock {
    grid-area: stock;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 0.2rem;
    color: #6b6b6b;
    font-size: 0.92rem;
    line-height: 1.3;
    white-space: nowrap;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-stock .fa-check,
  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-stock .fa-2x {
    font-size: 1.05rem !important;
    line-height: 1;
  }

  /* When stock row is visible, avoid duplicate out-of-stock marker in product cell. */
  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-mobile-oos {
    display: none !important;
  }

  .shopping-cart-page .cm-sc-product-listing .sc-qty-group {
    max-width: 9.4rem;
    flex-wrap: nowrap;
  }

  .shopping-cart-page .cm-sc-product-listing .sc-qty-input {
    min-width: 2.7rem;
    width: 3rem;
    text-align: center;
  }

  .shopping-cart-page .cm-sc-product-listing .sc-remove-btn {
    width: 2rem !important;
    min-width: 2rem !important;
    height: 2rem !important;
    padding: 0 !important;
    margin: 0;
  }
}

@media (max-width: 575.98px) {
  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row {
    grid-template-columns: minmax(0, 1fr) auto auto;
    grid-template-areas:
      "product product product"
      "qty price remove";
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-cell-stock {
    display: none !important;
  }

  .shopping-cart-page .cm-sc-product-listing tbody tr.sc-row .sc-mobile-oos {
    display: inline !important;
  }
}

/* Slightly smaller subtotal text/amount. */
.cm-sc-order-subtotal p {
  font-size: 1.2rem !important;
}

.cm-sc-order-total .card,
.cm-sc-order-total .card-header,
.cm-sc-order-total .card-body,
.cm-sc-order-total table,
.cm-sc-order-total table td {
  background-color: #ffffff !important;
}

.cm-sc-order-total .card {
  max-width: calc(18rem + 4ch) !important;
}

/* Lägg till adress knapp i cart shipping: samma gula stil */
.cm-sc-shipping .estimator-padding {
  margin-bottom: 0.95rem !important;
}

.cm-sc-shipping .card-body h5 {
  font-weight: 700 !important;
  margin-top: 0.15rem !important;
  margin-bottom: 0.55rem !important;
}

.cm-sc-shipping .btn {
  background-color: var(--hot-surface) !important;
  border: 1px solid var(--hot-heading) !important;
  color: var(--hot-text) !important;
  border-radius: var(--hot-btn-radius) !important;
  width: 190px;
  text-align: center;
}

.cm-sc-shipping .btn {
  box-shadow: none !important;
}

.cm-sc-shipping .btn:hover,
.cm-sc-shipping .btn:focus {
  background-color: var(--hot-surface-muted) !important;
  border-color: var(--hot-heading) !important;
  color: var(--hot-text) !important;
}

/* Rabatt i cart: sekundär handling när checkout finns samtidigt */
.cm-sc-discount .btn,
.cm-sc-discount .btn-apply-discount,
.cm-sc-discount button[type="submit"].btn,
.cm-sc-discount input[type="submit"].btn {
  background-color: var(--hot-surface) !important;
  border: 1px solid var(--hot-heading) !important;
  color: var(--hot-text) !important;
  box-shadow: none !important;
}

.cm-sc-discount .input-group .btn {
  border-radius: 0 var(--hot-input-group-radius) var(--hot-input-group-radius) 0 !important;
}

.cm-sc-discount .btn:hover,
.cm-sc-discount .btn:focus,
.cm-sc-discount .btn-apply-discount:hover,
.cm-sc-discount .btn-apply-discount:focus {
  background-color: var(--hot-surface-muted) !important;
  border-color: var(--hot-heading) !important;
  color: var(--hot-text) !important;
}

/* Toast-lik styling för messageStack/alerts (t.ex. i varukorgen) */
.messageStackSuccess,
.messageStackError,
.messageStackWarning,
.messageStackInfo,
#messageStack,
.messageStack,
.alert {
  border: 1px solid #d8d2c4 !important;
  background: #f1f1e6 !important;
  color: #3b2415 !important;

  border-radius: 8px;
  padding: 0.55rem 0.75rem;
  margin: 0.75rem 0;
  box-shadow: 0 10px 20px rgba(0,0,0,.10);
}

/* Om Bootstrap sätter gröna/röda bakgrunder på alert-typer */
.alert-success,
.alert-danger,
.alert-info {
  border-color: #d8d2c4 !important;
  background: #f1f1e6 !important;
  color: #3b2415 !important;
}

/* MessageStack: WARNING / out-of-stock */
.messageStackWarning,
.alert.alert-warning{
  background: #fff6d9 !important;
  border: 1px solid #e7d39a !important;
  color: #3b2415 !important;
}

.messageStackError,
.alert.alert-danger{
  background: #fde8e8 !important;
  border: 1px solid #f2b6b6 !important;
  color: #3b2415 !important;
}

/* Om messageStack innehåller länkar: håll dem i din stil */
.messageStackSuccess a,
.messageStackError a,
.messageStackWarning a,
.messageStackInfo a,
.alert a {
  color: #3b2415;
  text-decoration: underline;
}

.messageStackSuccess a:hover,
.messageStackError a:hover,
.messageStackWarning a:hover,
.messageStackInfo a:hover,
.alert a:hover {
  color: #6b3b1f;
}

.messageStackWarning a,
.alert.alert-warning a{
  color: #3b2415 !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.messageStackWarning a.btn,
.messageStackWarning a.btn:hover,
.messageStackWarning a.btn:focus,
.messageStackWarning a.btn:active,
.alert.alert-warning a.btn,
.alert.alert-warning a.btn:hover,
.alert.alert-warning a.btn:focus,
.alert.alert-warning a.btn:active {
  text-decoration: none !important;
}

#epaywindow-popup-fallback a.btn.hot-secondary.hot-sm,
#epaywindow-popup-fallback a.btn.hot-secondary.hot-sm:hover,
#epaywindow-popup-fallback a.btn.hot-secondary.hot-sm:focus,
#epaywindow-popup-fallback a.btn.hot-secondary.hot-sm:active,
#epaywindow-popup-fallback a.btn.hot-secondary.hot-sm:visited {
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
  text-underline-offset: 0 !important;
}

/* Tighta gapet mellan navbar (cm-navbar) och sökheader (header) */
:root {
  --hot-header-gap-bottom: 0.6rem; /* LUFT under söket (behåll) */
}

.cm-navbar {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.cm-navbar .offcanvas-body {
  padding-bottom: 0 !important;
}

.header {
  margin-top: 0 !important;
  padding-top: 0 !important;

  /* behåll luften under, men gör den robust (padding kollapsar inte) */
  padding-bottom: var(--hot-header-gap-bottom) !important;
  margin-bottom: 0 !important;
}

/* Hindra inre wrappers från att lägga tillbaka top-luft */
.header .container-xl,
.header .row,
.header .cm-header-search {
  margin-top: 0 !important;
  padding-top: 0 !important;
}


/* Lyft vänsterkolumnen lite för bättre linjering */
@media (min-width: 768px) { /* bara desktop/tablet */
  #columnLeft {
    margin-top: -1px;
  }
}

/* ************************************* */

.cm-pi-related_product .card {
  height: 100%;
}

@media (min-width: 768px) {
  .cm-pi-related_product .col {
    max-width: 360px;
  }
}
/* Relaterade produkter: gör dem lugna */
.cm-pi-related_product .card-footer {
  display: none;
}

.cm-pi-related_product .card-title {
  margin-bottom: 0.4rem !important;
}

.cm-pi-related_product .card-subtitle {
  margin-bottom: 0 !important;
}

.cm-pi-related_product h4 {
  margin-bottom: 0.5rem;
  font-weight: 700;
}

.cm-pi-related_product {
  margin-top: 1rem !important;
}
/* Relaterade produkter: inga blå länkar, rubrikkänsla */
.cm-pi-related_product .card-title a.stretched-link {
  color: #3b2415;              /* din bruna */
  text-decoration: none;
  display: inline;             /* behåll rubrikkänslan */
}

/* Hover: subtilt, inte “link-blue” */
.cm-pi-related_product .card:hover .card-title a.stretched-link {
  color: #2b1a10;              /* lite mörkare brun */
  text-decoration: none;
}

/* Pris-raden (om du vill matcha din lugna palett) */
.cm-pi-related_product .card-subtitle {
  color: #6b6b6b;              /* eller använd din design-token/neutral */
}

/* Gör kortet “klickbart” utan knappar */
.cm-pi-related_product .card {
  cursor: pointer;
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease;
}

/* Subtil hover: lyft lite + lätt kant (inte skrikigt) */
@media (hover: hover) {
  .cm-pi-related_product .card:hover {
    transform: translateY(-1px);
    border-color: #d8d2c4;
    box-shadow: 0 6px 14px rgba(0,0,0,.08);
  }
}

/* Tydlig fokus för tangentbord utan att bli fult */
.cm-pi-related_product .card:focus-within {
  outline: 2px solid rgba(154, 163, 49, 0.35); /* din oliv, men mjuk */
  outline-offset: 3px;
  border-radius: 8px; /* om dina kort har radius */
}
.cm-pi-related_product .card-title {
  font-size: 1rem !important;   /* istället för fs-5 */
  font-weight: 700 !important;
  margin-bottom: 0.35rem !important;
}

/* Slut i lager: behall knapptext/stil men med gra bakgrund */
.hot-product-buy-button.hot-stock-disabled-btn,
.btn.btn-product-info.btn-buy.hot-stock-disabled-btn,
.hot-product-buy-button.hot-stock-disabled-btn:hover,
.hot-product-buy-button.hot-stock-disabled-btn:focus,
.btn.btn-product-info.btn-buy.hot-stock-disabled-btn:hover,
.btn.btn-product-info.btn-buy.hot-stock-disabled-btn:focus {
  background-color: #d6d6cd !important;
  border-color: var(--hot-text-strong) !important;
  color: var(--hot-text) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
}

.hot-product-buy-button.hot-stock-disabled-btn .fa-shopping-cart,
.btn.btn-product-info.btn-buy.hot-stock-disabled-btn .fa-shopping-cart {
  color: var(--hot-text) !important;
}

/* GDPR: anvand samma knappstil som ovriga frontend */
.hot-gdpr-page .btn.btn-info,
.hot-gdpr-page .btn.btn-primary {
  background-color: var(--hot-accent) !important;
  border: 1px solid var(--hot-text-strong) !important;
  color: var(--hot-text) !important;
  border-radius: var(--hot-btn-radius) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.hot-gdpr-page .btn.btn-info:hover,
.hot-gdpr-page .btn.btn-info:focus,
.hot-gdpr-page .btn.btn-primary:hover,
.hot-gdpr-page .btn.btn-primary:focus {
  background-color: var(--hot-accent-hover) !important;
  border-color: var(--hot-text-strong) !important;
  color: var(--hot-text-strong) !important;
}

.hot-gdpr-page .btn.btn-info.text-white {
  color: var(--hot-text) !important;
}

@media (max-width: 575.98px) {
  .address-book-page .address-book-actions .ab-btn-delete {
    font-size: 0 !important;
    min-width: 2.2rem;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  .address-book-page .address-book-actions .ab-btn-delete i,
  .address-book-page .address-book-actions .ab-btn-delete .fas {
    font-size: 0.95rem !important;
    margin-right: 0 !important;
  }
}

/* GDPR layout: hantera langa cookie-/tokenstrangar utan att bryta sidokolumn-layout */
@media (min-width: 768px) {
  #bodyContent {
    min-width: 0;
  }
}

.hot-gdpr-page .table {
  table-layout: fixed;
}

.hot-gdpr-page .table th,
.hot-gdpr-page .table td {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* Checkout success: two clearly separated blocks */
.checkout-success-page .hot-success-block {
  background: #ffffff;
  border: 1px solid #d8d2c4;
  border-radius: 8px;
  padding: 1rem;
}

.checkout-success-page .hot-success-primary-block {
  margin-bottom: 1rem;
}

.checkout-success-page .cm-cs-pwa-keep-account {
  margin-top: 0.75rem;
}

.checkout-success-page .hot-success-account-block {
  animation: hot-account-choice-highlight 4.4s ease-in-out 0.2s 1 both;
}

.checkout-success-page .hot-success-account-block .hot-keep-account-check {
  animation: hot-account-check-emphasis 3.8s ease-in-out 0.55s 1 both;
}

@keyframes hot-account-choice-highlight {
  0% {
    border-color: #d8d2c4;
    background-color: #ffffff;
    box-shadow: 0 0 0 0 rgba(59, 36, 21, 0);
  }
  26% {
    border-color: #b8ab8f;
    background-color: #ece7d9;
    box-shadow: 0 0 0 0.48rem rgba(59, 36, 21, 0.08);
  }
  62% {
    border-color: #ccc1a8;
    background-color: #f5f2e9;
    box-shadow: 0 0 0 0.24rem rgba(59, 36, 21, 0.04);
  }
  100% {
    border-color: #d8d2c4;
    background-color: #ffffff;
    box-shadow: 0 0 0 0 rgba(59, 36, 21, 0);
  }
}

@keyframes hot-account-check-emphasis {
  0% {
    background-color: #f8f6ec;
  }
  34% {
    background-color: #f0eada;
  }
  100% {
    background-color: #f8f6ec;
  }
}

@media (prefers-reduced-motion: reduce) {
  .checkout-success-page .hot-success-account-block,
  .checkout-success-page .hot-success-account-block .hot-keep-account-check {
    animation: none;
  }
}

.checkout-success-page .cm-cs-thank-you a,
.checkout-success-page .cm-cs-pwa-keep-account a {
  color: #3b2415;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.checkout-success-page #pwaSetPasswordInline {
  border-top: 1px solid #e7e3d7;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
}

.checkout-success-page .hot-keep-account-check {
  background: #f8f6ec;
  border: 1px solid #d8d2c4;
  border-radius: 8px;
  padding: 0.6rem 0.75rem 0.6rem 2rem;
}

.checkout-success-page .hot-keep-account-input {
  width: 1.1rem;
  height: 1.1rem;
  margin-top: 0.15rem;
}

.checkout-success-page .hot-keep-account-label {
  font-weight: 600;
  color: #3b2415;
  cursor: pointer;
}

.checkout-success-page .hot-keep-account-check:focus-within {
  border-color: #9aa331;
  box-shadow: 0 0 0 0.15rem rgba(154, 163, 49, 0.18);
}

.checkout-success-page .hot-keep-account-check.hot-keep-account-invalid {
  border-color: #d15656;
  box-shadow: 0 0 0 0.12rem rgba(209, 86, 86, 0.14);
}

.checkout-success-page .hot-keep-account-error {
  display: block;
  margin-top: -0.1rem;
}

/* Checkout inline address edit */
html.checkout-inline-scroll-stable {
  overflow-y: scroll;
  scrollbar-gutter: stable;
}

.hot-inline-edit {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transform: translateY(-4px);
  transition: max-height 350ms ease, opacity 250ms ease, transform 250ms ease;
}

.hot-inline-edit.is-open {
  max-height: 1400px;
  opacity: 1;
  transform: none;
}

.hot-inline-edit,
.hot-inline-edit-form-shell {
  scroll-margin-top: 5rem;
}

[data-inline-address-edit].hot-inline-edit-trigger-active::after {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 0.35em;
  vertical-align: middle;
  border-left: 0.32em solid transparent;
  border-right: 0.32em solid transparent;
  border-top: 0.42em solid currentColor;
}

.hot-inline-edit .hot-inline-edit-form-shell {
  border-top: 1px solid var(--hot-border, #d8d2c4);
  padding-top: 0.75rem;
}

.hot-inline-edit .form-control.is-valid,
.hot-inline-edit .form-control.is-invalid,
.hot-inline-edit .form-select.is-valid,
.hot-inline-edit .form-select.is-invalid {
  padding-right: 2.25rem;
  background-position: right 0.65rem center;
}

.checkout-payment-page.is-address-editing [data-payment-panel] {
  opacity: 0.7;
}

.checkout-payment-page.is-address-editing [data-payment-panel].is-compact {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.checkout-payment-page.is-address-editing [data-payment-table] {
  pointer-events: none;
}

.checkout-payment-page.is-address-editing [data-invoice-id-row="1"],
.checkout-payment-page.is-address-editing #invoice_id_block {
  display: none !important;
}

.hot-discount-code-tag {
  color: #6b6b6b;
  font-weight: 400;
}

/* Account/Guest order action requests (cancel/withdrawal) */
.account-order-action-panel {
  background: #ffffff;
  box-shadow: none;
}

.account-order-action-panel details > summary {
  display: inline-flex;
  align-items: center;
  list-style: none;
  cursor: pointer;
}

.account-order-action-panel details > summary::-webkit-details-marker {
  display: none;
}

.account-order-action-panel details[open] > summary {
  margin-bottom: 0.25rem;
}