/* ==========================================================================
   Team8 Shop – global.css
   Bricks child theme utility stylesheet
   ========================================================================== */

/* ---- 1. Overflow fix (kritiskt – läs Bricks-guiden §6) ------------------- */
html, body {
  overflow-x: hidden !important;
  max-width: 100vw !important;
}

/* ---- 2. CSS Custom Properties -------------------------------------------- */
:root {
  /* Primary brand colors */
  --t8-pink:        #f24162;
  --t8-pink-dark:   #d82f50;
  --t8-dark:        #25323a;
  --t8-white:       #ffffff;
  --t8-light:       #eff2f4;
  --t8-light-warm:  #f7f8f9;

  /* Supporting colors */
  --t8-dark-soft:   #5a6670;
  --t8-border:      #e1e5e8;
  --t8-teal:        #1b8b8f;
  --t8-amber:       #eea630;

  /* Text on dark */
  --t8-on-dark-strong: rgba(255,255,255,1);
  --t8-on-dark-muted:  rgba(255,255,255,0.65);
  --t8-on-dark-dim:    rgba(255,255,255,0.45);

  /* Radius */
  --t8-radius-sm:  8px;
  --t8-radius-md:  20px;
  --t8-radius-lg:  32px;
  --t8-radius-pill: 999px;

  /* Fonts */
  --t8-font-mono:    'Roboto Mono', monospace;
  --t8-font-display: 'Paytone One', sans-serif;
  --t8-font-heading: 'Manrope', sans-serif;
  --t8-font-body:    'Manrope', sans-serif;
  --t8-font-detail:  'Caveat', cursive;

  /* Shadows */
  --t8-shadow-card: 0 10px 30px -12px rgba(37, 50, 58, 0.15);
  --t8-shadow-device: 0 40px 60px -20px rgba(37, 50, 58, 0.3);
}

/* ---- 3. Base typography -------------------------------------------------- */
body {
  font-family: var(--t8-font-body);
  color: var(--t8-dark);
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2 {
  font-family: var(--t8-font-display);
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--t8-dark);
  line-height: 1.1;
}

h3, h4, h5, h6 {
  font-family: var(--t8-font-heading);
  font-weight: 500;
  letter-spacing: -0.02em;
  color: var(--t8-dark);
  line-height: 1.1;
}

/* ==========================================================================
   4. Typography utilities
   ========================================================================== */

/* --- Headings --- */
.t8-h-hero {
  font-family: var(--t8-font-display);
  font-weight: 500;
  font-size: clamp(36px, 6vw, 60px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: var(--t8-dark);
}

.t8-h-section {
  font-family: var(--t8-font-display);
  font-weight: 500;
  font-size: clamp(28px, 4vw, 40px);
  line-height: 1.1;
  letter-spacing: -0.03em;
  color: var(--t8-dark);
}

.t8-h-panel {
  font-family: var(--t8-font-heading);
  font-weight: 500;
  font-size: clamp(24px, 3vw, 34px);
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.t8-h-card {
  font-family: var(--t8-font-heading);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--t8-dark);
}

.t8-h-cat {
  font-family: var(--t8-font-heading);
  font-weight: 500;
  font-size: 22px;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--t8-dark);
}

/* --- Caveat eyebrows (detalj-typsnitt) --- */
.t8-eyebrow {
  font-family: var(--t8-font-detail);
  font-weight: 500;
  font-size: 26px;
  color: var(--t8-pink);
  line-height: 1;
}

/* --- Monospace labels --- */
.t8-label {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--t8-pink);
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.t8-label::before {
  content: '';
  width: 24px;
  height: 1px;
  background: currentColor;
}

/* Label utan linje */
.t8-label-plain {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--t8-pink);
}

/* --- Body text --- */
.t8-lead {
  font-family: var(--t8-font-body);
  font-size: 18px;
  line-height: 1.6;
  color: var(--t8-dark-soft);
}

.t8-body {
  font-family: var(--t8-font-body);
  font-size: 15px;
  line-height: 1.6;
  color: var(--t8-dark-soft);
}

.t8-small {
  font-family: var(--t8-font-body);
  font-size: 13px;
  line-height: 1.5;
  color: var(--t8-dark-soft);
}

/* --- Mono details (priser, SKU, metadata) --- */
.t8-price {
  font-family: var(--t8-font-body);
  font-weight: 600;
  font-size: 16px;
  color: var(--t8-dark);
}

.t8-price .t8-price-per {
  font-size: 12px;
  font-weight: 500;
  color: var(--t8-dark-soft);
}

.t8-price-label {
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-dark-soft);
  display: block;
}

.t8-mono-small {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 500;
  color: var(--t8-dark-soft);
  letter-spacing: 0.08em;
}

.t8-cat-label {
  font-family: var(--t8-font-body);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-weight: 500;
  color: var(--t8-dark-soft);
}

/* ==========================================================================
   5. Color utilities
   ========================================================================== */
.t8-pink  { color: var(--t8-pink); }
.t8-dark-c  { color: var(--t8-dark); }
.t8-dark-soft-c { color: var(--t8-dark-soft); }
.t8-white-c { color: var(--t8-white); }
.t8-amber-c { color: var(--t8-amber); }

.t8-bg-pink  { background-color: var(--t8-pink); color: var(--t8-white); }
.t8-bg-dark  { background-color: var(--t8-dark); color: var(--t8-white); }
.t8-bg-light { background-color: var(--t8-light); }
.t8-bg-light-warm { background-color: var(--t8-light-warm); }
.t8-bg-white { background-color: var(--t8-white); }

/* Text on dark backgrounds */
.t8-bg-dark h1,
.t8-bg-dark h2,
.t8-bg-dark h3,
.t8-bg-dark h4 { color: var(--t8-white); }
.t8-bg-dark .t8-body,
.t8-bg-dark .t8-lead,
.t8-bg-dark .t8-small { color: var(--t8-on-dark-muted); }

/* ==========================================================================
   6. Buttons — styling native Bricks knappar
   ========================================================================== */

/* Core reset applied to all t8-button variants */
.brxe-button.t8-btn,
.brxe-button.t8-btn a {
  font-weight: 500;
  font-size: 14px;
  padding: 16px 28px;
  border-radius: var(--t8-radius-pill);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background 0.2s, transform 0.2s, color 0.2s, border-color 0.2s;
  text-decoration: none;
  border: none;
  cursor: pointer;
  line-height: 1;
}

.t8-btn,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="image"],
a.button,
.button,
.brxe-button,
.bricks-button,
.brxe-button a {
  font-family: var(--t8-font-body) !important;
}

/* Primary – rosa bakgrund, vit text */
.brxe-button.t8-btn-primary,
.brxe-button.t8-btn-primary a {
  background: var(--t8-pink);
  color: var(--t8-white);
}
.brxe-button.t8-btn-primary:hover,
.brxe-button.t8-btn-primary:hover a {
  background: var(--t8-pink-dark);
  transform: translateY(-1px);
}

/* Secondary – transparent med mörk border */
.brxe-button.t8-btn-secondary,
.brxe-button.t8-btn-secondary a {
  background: transparent;
  color: var(--t8-dark);
  border: 1.5px solid var(--t8-dark);
}
.brxe-button.t8-btn-secondary:hover,
.brxe-button.t8-btn-secondary:hover a {
  background: var(--t8-dark);
  color: var(--t8-white);
}

/* Light – mörk knapp som behåller hover-färgen */
.brxe-button.t8-btn-light,
.brxe-button.t8-btn-light a {
  background: var(--t8-dark);
  color: var(--t8-white);
  border: 1px solid transparent;
}
.brxe-button.t8-btn-light:hover,
.brxe-button.t8-btn-light:hover a {
  background: rgba(37, 50, 58, 0.95);
  color: var(--t8-white);
}
.t8-bg-pink .brxe-button.t8-btn-light:hover,
.t8-bg-pink .brxe-button.t8-btn-light:hover a,
.t8-bg-dark .brxe-button.t8-btn-light:hover,
.t8-bg-dark .brxe-button.t8-btn-light:hover a {
  background: rgba(37, 50, 58, 0.95);
  color: var(--t8-white);
}

/* Liten mono-länk med understrykning */
.t8-link-arrow {
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--t8-dark);
  border-bottom: 1.5px solid var(--t8-dark);
  padding-bottom: 2px;
  display: inline-block;
  text-decoration: none;
  transition: color 0.2s, border-color 0.2s;
}
.t8-link-arrow:hover {
  color: var(--t8-pink);
  border-color: var(--t8-pink);
}

/* ==========================================================================
   7. Badges & pills
   ========================================================================== */
.t8-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--t8-white);
  padding: 8px 16px;
  border-radius: var(--t8-radius-pill);
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--t8-pink);
}
.t8-badge-dot {
  width: 8px;
  height: 8px;
  background: var(--t8-pink);
  border-radius: 50%;
}

/* Produkt-taggar (Nyhet, Populär etc) */
.t8-tag {
  background: var(--t8-dark);
  color: var(--t8-white);
  padding: 6px 12px;
  border-radius: var(--t8-radius-pill);
  font-family: var(--t8-font-body);
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  display: inline-block;
}
.t8-tag-pink { background: var(--t8-pink); }
.t8-tag-amber { background: var(--t8-amber); color: var(--t8-dark); }

/* Cart-badge (antal i varukorg) */
.t8-cart-badge {
  background: var(--t8-amber);
  color: var(--t8-dark);
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid var(--t8-white);
}

/* ==========================================================================
   8. Card-komponenter
   ========================================================================== */

/* Base card */
.t8-card {
  background: var(--t8-white);
  border-radius: var(--t8-radius-md);
  border: 1px solid transparent;
  transition: border-color 0.3s, transform 0.3s;
  overflow: hidden;
}
.t8-card:hover {
  border-color: var(--t8-light);
  transform: translateY(-4px);
}

/* Kategori-kort (med hover till mörk) */
.t8-cat-card {
  background: var(--t8-light);
  border-radius: var(--t8-radius-md);
  padding: 32px 28px;
  aspect-ratio: 1 / 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: background 0.3s, color 0.3s, transform 0.3s;
  position: relative;
  overflow: hidden;
  color: var(--t8-dark);
}
.t8-cat-card:hover {
  background: var(--t8-dark);
  color: var(--t8-white);
  transform: translateY(-4px);
}
.t8-cat-card:hover h3 { color: var(--t8-white); }
.t8-cat-card:hover .t8-cat-count { color: rgba(255,255,255,0.6); }
.t8-cat-card:hover .t8-cat-arrow {
  background: var(--t8-pink);
  transform: rotate(-45deg);
}
.t8-cat-card:hover .t8-cat-arrow svg { stroke: var(--t8-white); }

/* Kategori-ikon-ruta */
.t8-cat-icon {
  width: 56px;
  height: 56px;
  background: var(--t8-white);
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* Pil i nedre högra hörnet på kategori-kort */
.t8-cat-arrow {
  position: absolute;
  bottom: 24px;
  right: 24px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--t8-white);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s, transform 0.3s;
}

.t8-cat-count {
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-dark-soft);
  margin-top: 6px;
  font-weight: 500;
  display: block;
}

/* ==========================================================================
   9. Feature-tiles (mörk bakgrund, "Varför team8")
   ========================================================================== */
.t8-feature {
  background: rgba(255,255,255,0.04);
  border-radius: var(--t8-radius-md);
  padding: 28px;
  transition: background 0.2s;
}
.t8-feature:hover { background: rgba(255,255,255,0.07); }

.t8-feature-num {
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-pink);
  letter-spacing: 0.15em;
  margin-bottom: 24px;
  display: block;
}

.t8-feature-icon {
  width: 44px;
  height: 44px;
  background: rgba(255,255,255,0.08);
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
}

/* ==========================================================================
   10. Split-banner paneler
   ========================================================================== */
.t8-panel {
  padding: 64px 56px;
  border-radius: var(--t8-radius-md);
  position: relative;
  overflow: hidden;
}
.t8-panel-dark {
  background: var(--t8-dark);
  color: var(--t8-white);
}
.t8-panel-pink {
  background: var(--t8-pink);
  color: var(--t8-white);
}
.t8-panel-dark h3,
.t8-panel-pink h3 { color: var(--t8-white); }

/* Label inne i paneler (med streck före) */
.t8-panel .t8-label,
.t8-panel .t8-label-plain {
  color: var(--t8-on-dark-strong);
  opacity: 0.85;
  margin-bottom: 20px;
}

/* ==========================================================================
   11. Shortcuts strip (genvägsraden)
   ========================================================================== */
.t8-shortcuts {
  display: flex;
  align-items: center;
  gap: 48px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  overflow-x: auto;
  padding: 24px 0;
}

.t8-shortcut {
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--t8-dark);
  text-decoration: none;
  transition: color 0.15s;
}
.t8-shortcut:hover { color: var(--t8-pink); }

.t8-shortcut .t8-count {
  font-size: 10px;
  color: var(--t8-dark-soft);
  background: var(--t8-white);
  padding: 2px 6px;
  border-radius: 4px;
  border: 1px solid var(--t8-border);
}

/* ==========================================================================
   12. Hero-visual sticker & stats
   ========================================================================== */
.t8-sticker {
  background: var(--t8-amber);
  color: var(--t8-dark);
  width: 96px;
  height: 96px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: var(--t8-font-detail);
  font-weight: 600;
  font-size: 20px;
  line-height: 1.1;
  transform: rotate(12deg);
}

.t8-stats-card {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 14px 18px;
  font-size: 13px;
  border: 1px solid var(--t8-light);
}
.t8-stats-card strong {
  font-family: var(--t8-font-body);
  font-weight: 600;
  font-size: 20px;
  color: var(--t8-dark);
  display: block;
}
.t8-stats-card span { color: var(--t8-dark-soft); }

/* ==========================================================================
   13. Frames / Aspect-ratio wrappers (för bilder)
   ========================================================================== */
.t8-frame {
  overflow: hidden;
  border-radius: var(--t8-radius-md);
  background: var(--t8-light);
  position: relative;
}
.t8-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.t8-frame-1-1 { aspect-ratio: 1 / 1; }
.t8-frame-4-5 { aspect-ratio: 4 / 5; }
.t8-frame-16-9 { aspect-ratio: 16 / 9; }

/* Produktbild – padding för luft runt produkten */
.t8-product-image {
  aspect-ratio: 1;
  background: var(--t8-light);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px;
}
.t8-product-image img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

/* ==========================================================================
   15. Footer-specifika
   ========================================================================== */
.t8-footer {
  background: var(--t8-dark);
  color: var(--t8-white);
  padding: 72px 0 32px;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.t8-footer h5 {
  font-family: var(--t8-font-body);
  color: var(--t8-white);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.t8-footer h5::before {
  content: '→';
  color: var(--t8-pink);
}

.t8-footer a {
  color: rgba(255,255,255,0.6);
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s;
}
.t8-footer a:hover { color: var(--t8-pink); }

.t8-footer-bottom {
  padding-top: 32px;
  font-family: var(--t8-font-body);
  color: rgba(255,255,255,0.5);
  font-size: 12px;
}

/* Social icons */
.t8-socials {
  display: flex;
  gap: 10px;
}
.t8-socials a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
}
.t8-socials a:hover { background: var(--t8-pink); }

/* ==========================================================================
   16. Container-bredd override (läs Bricks-guide §5)
   ========================================================================== */
@media (max-width: 991px) {
  .brxe-container {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* ==========================================================================
   17. WooCommerce-specifika anpassningar (minimalt – resten i product-mall)
   ========================================================================== */

/* WooCommerce notices — transparent wrapper, stil läggs på ul:en själv */
.woocommerce-notices-wrapper {
  background: transparent !important;
  padding: 0 !important;
  border: none !important;
}
/* Notice-bar: matchar sidans grå bakgrund, full-bredd,
   meddelandet centrerat på en rad och kompakt */
.woocommerce-notices-wrapper:not(:empty) {
  background: var(--t8-light) !important;
  padding: 14px 32px !important;
  margin: 0 calc(50% - 50vw) !important;
  width: 100vw !important;
  max-width: none !important;
}

.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
  list-style: none !important;
  margin: 0 auto !important;
  padding: 10px 16px !important;
  border-radius: 10px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  border: 1px solid var(--t8-border) !important;
  max-width: 640px !important;
  width: auto !important;
}
.woocommerce-error {
  background: #fde6ec !important;
  color: var(--t8-pink-dark, #c8214a) !important;
  border-color: #f8b6c6 !important;
}
.woocommerce-message {
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  border-color: var(--t8-border) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  flex-wrap: nowrap !important;
}
.woocommerce-message::before {
  display: none !important;
}
.woocommerce-message .button.wc-forward {
  background: var(--t8-pink);
  color: var(--t8-white);
  font-family: var(--t8-font-body);
  font-weight: 500;
  font-size: 13px;
  padding: 8px 18px;
  border-radius: var(--t8-radius-pill);
  text-decoration: none;
  border: 0;
  transition: background .15s ease;
  white-space: nowrap;
}
.woocommerce-message .button.wc-forward:hover,
.woocommerce-message .button.wc-forward:focus {
  background: var(--t8-pink-dark);
  color: var(--t8-white);
}
.woocommerce-info {
  background: #eaf1f8 !important;
  color: var(--t8-dark) !important;
  border-color: #c6d4e3 !important;
}
.woocommerce-error li,
.woocommerce-message li,
.woocommerce-info li {
  margin: 0 !important;
  padding: 0 !important;
}

/* Priser i produktloopar */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: var(--t8-font-body);
  font-weight: 600;
  color: var(--t8-dark);
}


/* ==========================================================================
   HEADER – all styling för header-mallen
   ========================================================================== */

/* --- Topbar --- */
.t8-topbar {
  background: var(--t8-dark);
}
.t8-topbar,
.t8-topbar a,
.t8-topbar span {
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: rgba(255,255,255,0.75);
  text-decoration: none;
}
.t8-topbar a:hover {
  color: var(--t8-white);
}

/* --- Logo --- */
.t8-logo {
  display: flex !important;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
  text-decoration: none;
}
.t8-logo img {
  height: 28px;
  width: auto;
  display: block;
}
.t8-logo-white img {
  filter: brightness(0) invert(1);
}
.t8-logo-pill {
  background: var(--t8-pink);
  color: var(--t8-white);
  padding: 4px 10px 5px;
  border-radius: 6px;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: -0.01em;
  line-height: 1;
  display: inline-block;
}

/* --- Kategorier-trigger (toggle) --- */
.t8-mega-trigger {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: var(--t8-radius-pill);
  background: var(--t8-light);
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--t8-dark);
  border: none;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  text-decoration: none;
}
.t8-mega-trigger:hover {
  background: #e4e8ec;
}
.t8-mega-trigger.brx-open,
.t8-mega-trigger[aria-expanded="true"] {
  background: var(--t8-dark);
  color: var(--t8-white);
}
.t8-mega-trigger i,
.t8-mega-trigger svg {
  font-size: 14px;
}

/* --- Sökruta --- */
.t8-search-pill {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  border-radius: var(--t8-radius-pill);
  background: var(--t8-light);
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark-soft);
  cursor: text;
  transition: background 0.2s;
  flex-grow: 1;
  max-width: 440px;
}
.t8-search-pill:hover {
  background: #e4e8ec;
}
.t8-search-pill i,
.t8-search-pill svg {
  font-size: 18px;
  color: var(--t8-dark);
  flex-shrink: 0;
}
.t8-search-key {
  margin-left: auto;
  background: var(--t8-white);
  padding: 3px 8px;
  border-radius: 4px;
  font-family: var(--t8-font-body);
  font-size: 11px;
  color: var(--t8-dark-soft);
  flex-shrink: 0;
}

/* --- Nav ikon-knappar (hjärta, person) --- */
.t8-nav-icon {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: transparent;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  text-decoration: none;
  border: none;
  cursor: pointer;
}
.t8-nav-icon:hover {
  background: var(--t8-light);
}
.t8-nav-icon i,
.t8-nav-icon svg {
  font-size: 20px;
  color: var(--t8-dark);
}

/* --- Varukorgsknapp (desktop) --- */
.t8-cart-btn {
  background: var(--t8-pink);
  color: var(--t8-white);
  padding: 12px 20px 12px 16px;
  border-radius: var(--t8-radius-pill);
  font-family: var(--t8-font-body);
  font-weight: 500;
  font-size: 13px;
  display: inline-flex !important;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  transition: background 0.2s, transform 0.2s;
  position: relative;
}
.t8-cart-btn:hover {
  background: var(--t8-pink-dark);
  transform: translateY(-1px);
  color: var(--t8-white);
}
.t8-cart-btn i,
.t8-cart-btn svg {
  font-size: 18px;
  color: var(--t8-white);
}

/* --- Varukorgs-ikonknapp (mobil) --- */
.t8-cart-icon-btn {
  width: 44px;
  height: 44px;
  background: var(--t8-pink);
  border-radius: 50%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: background 0.2s;
}
.t8-cart-icon-btn:hover {
  background: var(--t8-pink-dark);
}
.t8-cart-icon-btn i,
.t8-cart-icon-btn svg {
  font-size: 20px;
  color: var(--t8-white);
}

/* --- Hamburgerknapp (mobil toggle) --- */
.t8-hamburger {
  width: 44px;
  height: 44px;
  background: var(--t8-light);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  transition: background 0.2s;
}
.t8-hamburger:hover {
  background: #e4e8ec;
}
.t8-hamburger i,
.t8-hamburger svg {
  font-size: 22px;
  color: var(--t8-dark);
}

/* ==========================================================================
   DRAWER (off-canvas) – mobil meny
   ========================================================================== */

.t8-drawer-inner {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  background: var(--t8-white);
}

.t8-drawer-header {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  padding: 20px;
  border-bottom: 1px solid var(--t8-light);
  flex-shrink: 0;
}

.t8-drawer-close {
  width: 44px;
  height: 44px;
  background: var(--t8-light);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  transition: background 0.2s;
}
.t8-drawer-close:hover {
  background: #e4e8ec;
}
.t8-drawer-close i,
.t8-drawer-close svg {
  font-size: 22px;
  color: var(--t8-dark);
}

.t8-drawer-body {
  padding: 20px;
  overflow-y: auto;
  flex-grow: 1;
}

/* IKS Menu inuti drawer */
.t8-drawer-body .iks-menu,
.t8-drawer-body .iks-menu ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.t8-drawer-body .iks-menu li {
  border-bottom: 1px solid var(--t8-light);
}
.t8-drawer-body .iks-menu li:last-child {
  border-bottom: none;
}
.t8-drawer-body .iks-menu a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  font-family: var(--t8-font-body);
  font-size: 15px;
  color: var(--t8-dark);
  text-decoration: none;
  transition: color 0.15s;
}
.t8-drawer-body .iks-menu a:hover {
  color: var(--t8-pink);
}
.t8-drawer-body .iks-menu ul {
  padding-left: 16px;
  border-left: 2px solid var(--t8-pink);
  margin: 4px 0 12px;
}
.t8-drawer-body .iks-menu ul a {
  padding: 10px 0;
  font-size: 14px;
  color: var(--t8-dark-soft);
}

.t8-drawer-footer {
  background: var(--t8-light-warm);
  padding: 20px;
  border-top: 1px solid var(--t8-light);
  flex-shrink: 0;
}

.t8-drawer-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-bottom: 16px;
}

.t8-drawer-action {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 14px;
  background: var(--t8-white);
  border-radius: 8px;
  border: 1px solid var(--t8-border);
  text-decoration: none;
  transition: border-color 0.2s;
}
.t8-drawer-action:hover {
  border-color: var(--t8-dark);
}
.t8-drawer-action i,
.t8-drawer-action svg {
  font-size: 16px;
  color: var(--t8-dark);
}
.t8-drawer-action span {
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--t8-dark);
}

.t8-drawer-contact {
  display: block;
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-dark-soft);
  text-decoration: none;
  padding: 3px 0;
}
.t8-drawer-contact:hover {
  color: var(--t8-pink);
}


/* ==========================================================================
   HEADER FIXES (oktober 2026 iteration)
   ========================================================================== */

/* --- 1. "Alla produkter"-knapp: r\u00e4tt textstorlek + visuell tydlighet --- */
.t8-search-pill {
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.t8-search-pill .brxe-toggle {
  background: transparent !important;
  border: none;
  padding: 0;
  display: inline-flex;
  align-items: center;
  cursor: pointer;
}
.t8-search-pill .brxe-toggle svg {
  width: 18px !important;
  height: 18px !important;
}
.t8-search-pill .brxe-heading {
  font-family: var(--t8-font-body);
  font-size: 13px !important;
  font-weight: 500;
  color: var(--t8-dark);
  margin: 0;
  line-height: 1;
}
.t8-search-pill:hover {
  background: #e4e8ec;
}

/* --- 2. Nav-ikoner: centrera SVG mitt i 44px-cirkeln --- */
.t8-nav-icon {
  width: 44px;
  height: 44px;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative;
  transition: background 0.2s;
}
.t8-nav-icon:hover {
  background: var(--t8-light);
}

/* SVG ska v\u00e4xa till h\u00f6jd 20px och vara horisontellt centrerad */
.t8-nav-icon a,
.t8-nav-icon > .bricks-link-wrapper {
  width: 100%;
  height: 100%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}
.t8-nav-icon svg.brxe-icon {
  width: 20px !important;
  height: 20px !important;
  display: block;
}

/* S\u00f6kikon-wrapper (Ajax search) */
.t8-nav-icon .dgwt-wcas-search-wrapp {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.t8-nav-icon .dgwt-wcas-search-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.t8-nav-icon .dgwt-wcas-ico-magnifier-handler {
  width: 18px !important;
  height: 18px !important;
  fill: var(--t8-dark);
}

/* Mini-cart: centrera och anpassa storlek */
.t8-nav-icon .brxe-woocommerce-mini-cart {
  width: 20px;
  height: 20px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.t8-nav-icon .mini-cart-link {
  width: 100%;
  height: 100%;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  position: relative;
}
.t8-nav-icon .cart-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.t8-nav-icon .cart-icon svg {
  width: 20px !important;
  height: 20px !important;
}

/* Cart count badge */
.t8-nav-icon .cart-count {
  position: absolute;
  top: -8px;
  right: -10px;
  background: var(--t8-pink);
  color: var(--t8-white);
  font-family: var(--t8-font-body);
  font-size: 10px;
  font-weight: 600;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* --- 3. Mini-cart dropdown: snyggare styling --- */
.t8-nav-icon .cart-detail {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  width: 380px;
  max-width: 90vw;
  background: var(--t8-white);
  border: 1px solid var(--t8-border);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(37, 50, 58, 0.12);
  padding: 0;
  z-index: 1000;
  display: none;
  overflow: hidden;
}
.t8-nav-icon .cart-detail.show,
.t8-nav-icon .cart-detail[style*="block"] {
  display: block !important;
}

.t8-nav-icon .widget_shopping_cart_content {
  padding: 0;
}

.t8-nav-icon .woocommerce-mini-cart {
  list-style: none;
  margin: 0;
  padding: 12px;
  max-height: 400px;
  overflow-y: auto;
}

.t8-nav-icon .woocommerce-mini-cart-item {
  display: grid !important;
  grid-template-columns: 56px 1fr auto;
  grid-gap: 12px;
  align-items: center;
  padding: 12px 8px;
  border-bottom: 1px solid var(--t8-light);
  position: relative;
}
.t8-nav-icon .woocommerce-mini-cart-item:last-child {
  border-bottom: none;
}

/* Bilden – tydlig position */
.t8-nav-icon .woocommerce-mini-cart-item > a:not(.remove) {
  display: contents;
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark);
  font-weight: 500;
  line-height: 1.3;
  text-decoration: none;
}
.t8-nav-icon .woocommerce-mini-cart-item img {
  grid-column: 1;
  grid-row: 1 / span 2;
  width: 56px !important;
  height: 56px !important;
  border-radius: 8px;
  object-fit: contain;
  background: var(--t8-light-warm);
  padding: 4px;
}

/* Quantity rad */
.t8-nav-icon .woocommerce-mini-cart-item .quantity {
  grid-column: 2;
  grid-row: 2;
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-dark-soft);
  font-weight: 400;
}
.t8-nav-icon .woocommerce-mini-cart-item .quantity .woocommerce-Price-amount {
  color: var(--t8-dark);
  font-weight: 500;
}
.t8-nav-icon .ingram-mst-cart-suffix {
  color: var(--t8-dark-soft);
  font-size: 11px;
}

/* Variation-info (anv\u00e4ndare) */
.t8-nav-icon .woocommerce-mini-cart-item .variation {
  grid-column: 2;
  grid-row: 2;
  margin: 0;
  padding: 0;
  font-size: 11px;
  color: var(--t8-dark-soft);
}
.t8-nav-icon .woocommerce-mini-cart-item .variation dt,
.t8-nav-icon .woocommerce-mini-cart-item .variation dd {
  display: inline;
  margin: 0;
  font-weight: 400;
}
.t8-nav-icon .woocommerce-mini-cart-item .variation p {
  display: inline;
  margin: 0;
}

/* Remove-knapp (X) – snyggare i h\u00f6gerkanten */
.t8-nav-icon .woocommerce-mini-cart-item .remove {
  grid-column: 3;
  grid-row: 1;
  width: 24px;
  height: 24px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background: var(--t8-light);
  color: var(--t8-dark-soft);
  border-radius: 50%;
  font-size: 14px;
  text-decoration: none;
  position: static;
  font-weight: 400;
  line-height: 1;
  transition: background 0.15s, color 0.15s;
}
.t8-nav-icon .woocommerce-mini-cart-item .remove:hover {
  background: var(--t8-pink);
  color: var(--t8-white);
}

/* Total-rad */
.t8-nav-icon .woocommerce-mini-cart__total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0;
  padding: 16px;
  background: var(--t8-light-warm);
  border-top: 1px solid var(--t8-light);
  font-family: var(--t8-font-body);
  font-size: 13px;
  flex-wrap: wrap;
}
.t8-nav-icon .woocommerce-mini-cart__total strong {
  font-weight: 500;
  color: var(--t8-dark-soft);
}
.t8-nav-icon .woocommerce-mini-cart__total .woocommerce-Price-amount {
  color: var(--t8-dark);
  font-weight: 600;
  font-size: 15px;
}
.t8-nav-icon .ingram-mst-minicart-monthly {
  width: 100%;
  margin-top: 6px !important;
  padding-top: 6px;
  border-top: 1px dashed var(--t8-border);
  font-size: 12px !important;
}
.t8-nav-icon .ingram-mst-minicart-monthly small {
  color: var(--t8-dark-soft);
}

/* Knappar */
.t8-nav-icon .woocommerce-mini-cart__buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0;
  padding: 12px 16px 16px;
}
.t8-nav-icon .woocommerce-mini-cart__buttons .button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 500;
  text-decoration: none;
  transition: background 0.2s;
}
.t8-nav-icon .woocommerce-mini-cart__buttons .button:not(.checkout) {
  background: var(--t8-light);
  color: var(--t8-dark);
}
.t8-nav-icon .woocommerce-mini-cart__buttons .button:not(.checkout):hover {
  background: #e4e8ec;
}
.t8-nav-icon .woocommerce-mini-cart__buttons .button.checkout {
  background: var(--t8-pink);
  color: var(--t8-white);
}
.t8-nav-icon .woocommerce-mini-cart__buttons .button.checkout:hover {
  background: var(--t8-pink-dark);
}

/* --- 4. Mobil/sm\u00e5 sk\u00e4rmar: tighta ihop --- */
@media (max-width: 767px) {
  /* Mobil header navbar - mindre gap */
  #brxe-312c68 .brxe-container {
    gap: 8px !important;
  }

  /* Logga aningen mindre */
  #brxe-hzabht .bricks-site-logo img,
  #brxe-hzabht .bricks-site-logo source {
    height: 22px !important;
    width: auto !important;
  }

  /* Logo-pill mindre p\u00e5 mobil */
  .t8-logo-pill {
    font-size: 11px !important;
    padding: 3px 7px 4px !important;
  }

  /* Nav-ikoner aningen mindre i mobilen */
  .t8-nav-icon {
    width: 36px !important;
    height: 36px !important;
  }
  .t8-nav-icon svg.brxe-icon,
  .t8-nav-icon .cart-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
  .t8-nav-icon .cart-count {
    top: -4px;
    right: -4px;
    width: 14px;
    height: 14px;
    font-size: 9px;
  }

  /* H\u00f6gerikon-grupp mindre gap */
  #brxe-dpwjnq {
    gap: 2px !important;
  }

  /* D\u00f6lj favoriter p\u00e5 mobile portrait f\u00f6r att f\u00e5 plats */
  #brxe-vipjkz {
    display: none !important;
  }

  /* Mini-cart dropdown - bredd anpassad */
  .t8-nav-icon .cart-detail {
    position: fixed;
    top: auto !important;
    right: 8px !important;
    left: 8px !important;
    width: auto;
    max-width: none;
  }
}

@media (max-width: 380px) {
  /* P\u00e5 sm\u00e5 sk\u00e4rmar - \u00e4nnu mindre */
  #brxe-312c68 .brxe-container {
    gap: 4px !important;
  }
  .t8-nav-icon {
    width: 32px !important;
    height: 32px !important;
  }
  .t8-nav-icon svg.brxe-icon,
  .t8-nav-icon .cart-icon svg,
  .t8-nav-icon .dgwt-wcas-ico-magnifier-handler {
    width: 16px !important;
    height: 16px !important;
  }
}


/* ==========================================================================
   MEGA-MENY (off-canvas slide down)
   ========================================================================== */

#brxe-megoff {
  /* Box-shadow under mega-menyn n\u00e4r \u00f6ppen */
  box-shadow: 0 8px 24px rgba(37, 50, 58, 0.08);
}

/* L\u00e4nkarna - hover-effekt */
#brxe-megoff a.brxe-text-link {
  display: inline-block;
  padding: 4px 0;
  text-decoration: none;
  transition: color 0.15s, padding-left 0.15s;
  border-left: 2px solid transparent;
  padding-left: 0;
}
#brxe-megoff a.brxe-text-link:hover {
  color: var(--t8-pink) !important;
  padding-left: 8px;
  border-left-color: var(--t8-pink);
}

/* Backdrop - mjukare */
#brxe-megoff + .brx-offcanvas-backdrop,
[id^="brxe-megoff"] .brx-offcanvas-backdrop {
  background: rgba(37, 50, 58, 0.4);
}

/* P\u00e5 mobilen - h\u00f6gre offcanvas s\u00e5 alla kategorier syns */
@media (max-width: 767px) {
  #brxe-megoff {
    max-height: 90vh;
  }
}




/* ==========================================================================
   MEGA-TRIGGER ("Alla produkter")
   --------------------------------------------------------------------------
   Bricks toggle-element renderar bara ikon, inte text. Vi lägger till
   texten via CSS ::before pseudo-element.
   ========================================================================== */

.t8-mega-trigger.brxe-toggle {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 10px 16px !important;
  border-radius: 999px !important;
  background: transparent !important;
  border: 1px solid var(--t8-border) !important;
  color: var(--t8-dark) !important;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.t8-mega-trigger.brxe-toggle::before {
  content: "Alla produkter";
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--t8-dark);
  white-space: nowrap;
  line-height: 1;
  order: 1; /* texten före ikonen */
}

/* SVG-ikonen (chevron eller annat) */
.t8-mega-trigger.brxe-toggle svg {
  width: 10px !important;
  height: 10px !important;
  order: 2;
  transition: transform 0.2s;
}

/* Hover */
.t8-mega-trigger.brxe-toggle:hover {
  background: var(--t8-light) !important;
}

/* Aktiv (offcanvas öppen) */
.t8-mega-trigger.brxe-toggle.brx-open,
.t8-mega-trigger.brxe-toggle[aria-expanded="true"] {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-dark) !important;
}
.t8-mega-trigger.brxe-toggle.brx-open::before,
.t8-mega-trigger.brxe-toggle[aria-expanded="true"]::before {
  color: var(--t8-white);
}
.t8-mega-trigger.brxe-toggle.brx-open svg path,
.t8-mega-trigger.brxe-toggle[aria-expanded="true"] svg path {
  fill: var(--t8-white) !important;
}
.t8-mega-trigger.brxe-toggle.brx-open svg,
.t8-mega-trigger.brxe-toggle[aria-expanded="true"] svg {
  transform: rotate(180deg);
}


/* ==========================================================================
   TOP-NAV TEXT-LINKS (Som tjänst, Kontakt)
   ========================================================================== */

.t8-nav-link {
  display: inline-flex !important;
  align-items: center;
  padding: 10px 16px !important;
  border-radius: 999px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  text-decoration: none !important;
  transition: background 0.15s;
  white-space: nowrap;
  line-height: 1;
}

.t8-nav-link:hover {
  background: var(--t8-light);
  color: var(--t8-dark) !important;
}

/* Active sida */
.t8-nav-link.is-active,
.t8-nav-link[aria-current="page"] {
  color: var(--t8-pink) !important;
}





/* ==========================================================================
   FOOTER
   ========================================================================== */

/* Kolumnrubrik (“→ KONTAKT”-stil) */
.t8-footer-heading {
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--t8-pink) !important;
  margin-top: 0 !important;
}

/* Footer-länkar hover */
.t8-footer-link {
  text-decoration: none !important;
  transition: color 0.15s !important;
}
.t8-footer-link:hover {
  color: var(--t8-pink) !important;
}

/* Bricks list-element i footer - tvinga ikoner att få rätt färg */
footer .brxe-list .icon svg {
  fill: var(--t8-border) !important;
  stroke: var(--t8-border) !important;
  width: 16px !important;
  height: 16px !important;
}

/* Hover - rosa färg på hela list-item */
footer .brxe-list li:hover .icon svg {
  fill: var(--t8-pink) !important;
  stroke: var(--t8-pink) !important;
}
footer .brxe-list li:hover .title {
  color: var(--t8-pink) !important;
}

/* Spacing mellan ikoner och text i list */
footer .brxe-list .content {
  gap: 10px !important;
}



/* ==========================================================================
   STARTSIDA
   ========================================================================== */

/* --- Sektioner ---------------------------------------------------------- */
.t8-section { background: var(--t8-white); }
.t8-section--soft { background: var(--t8-light-warm); }
.t8-section--dark { background: var(--t8-dark); }

.t8-section__head { width: 100%; }

/* --- Typografi-utility -------------------------------------------------- */
.t8-h1 {
  font-family: var(--t8-font-display) !important;
  font-size: 56px !important;
  font-weight: 500 !important;
  line-height: 1.05 !important;
  letter-spacing: -0.02em !important;
  color: var(--t8-dark) !important;
  margin: 0 !important;
}
@media (max-width: 991px) { .t8-h1 { font-size: 44px !important; } }
@media (max-width: 767px) { .t8-h1 { font-size: 36px !important; } }
@media (max-width: 478px) { .t8-h1 { font-size: 32px !important; } }

.t8-h2 {
  font-family: var(--t8-font-display) !important;
  font-size: 36px !important;
  font-weight: 500 !important;
  line-height: 1.1 !important;
  letter-spacing: -0.01em !important;
  color: var(--t8-dark) !important;
  margin: 0 !important;
}
.t8-h2--light { color: var(--t8-white) !important; }
@media (max-width: 767px) { .t8-h2 { font-size: 28px !important; } }

.t8-lead {
  font-family: var(--t8-font-body) !important;
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: var(--t8-dark-soft) !important;
  max-width: 480px !important;
  margin: 0 !important;
}

/* --- Eyebrows ----------------------------------------------------------- */
.t8-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 !important;
}
.t8-eyebrow--mono {
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--t8-pink) !important;
}
.t8-eyebrow--script {
  font-family: 'Caveat', cursive !important;
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--t8-pink) !important;
  line-height: 1 !important;
}

.t8-eyebrow-line {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: currentColor;
}
.t8-eyebrow-line__bar {
  display: block;
  width: 24px;
  height: 1px;
  background: currentColor;
}
.t8-eyebrow-line--pink { color: var(--t8-pink); }

/* --- Pill (med dot) ----------------------------------------------------- */
.t8-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: var(--t8-white);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--t8-dark);
  width: fit-content;
}
.t8-pill__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--t8-pink);
}

/* --- Knappar ------------------------------------------------------------ */
.t8-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 14px 24px !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  border: 1px solid transparent !important;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, transform 0.15s;
  white-space: nowrap;
}
.t8-btn--primary {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
}
.t8-btn--primary:hover {
  background: var(--t8-pink-dark) !important;
}
.t8-btn--outline {
  background: transparent !important;
  color: var(--t8-dark) !important;
  border-color: var(--t8-dark) !important;
}
.t8-btn--outline:hover {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
}
.t8-btn--white {
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  width: fit-content;
}
.t8-btn--white:hover {
  transform: translateY(-2px);
}

/* --- Länk med pil ------------------------------------------------------- */
.t8-link-arrow {
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--t8-dark);
  padding-bottom: 4px !important;
  transition: color 0.15s, border-color 0.15s;
}
.t8-link-arrow:hover {
  color: var(--t8-pink) !important;
  border-bottom-color: var(--t8-pink);
}

/* ==========================================================================
   1. HERO
   ========================================================================== */
.t8-hero { background: var(--t8-light); }

.t8-hero__grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
@media (max-width: 991px) {
  .t8-hero__grid { grid-template-columns: 1fr; }
}

.t8-hero__visual {
  position: relative;
  background: var(--t8-white);
  border-radius: 24px;
  padding: 48px;
  box-shadow: 0 16px 48px rgba(37,50,58,0.08);
}

.t8-hero__phone {
  display: block;
  width: 100%;
  max-width: 320px;
  aspect-ratio: 1 / 1.1;
  margin: 0 auto;
  position: relative;
  object-fit: contain;
}
/* Bricks <picture>-wrapper — inre <img> ska fylla och contain-fit:a */
picture.t8-hero__phone {
  display: block;
}
picture.t8-hero__phone img,
.t8-hero__phone img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
/* Fallback: om elementet är en tom div utan bild — visa placeholder-gradient */
div.t8-hero__phone:empty {
  background: linear-gradient(135deg, var(--t8-dark) 0%, var(--t8-dark-soft) 100%);
  border-radius: 32px;
}
/* Notch — bara aktiv om .t8-hero__phone är en div (placeholder-läget) */
.t8-hero__notch {
  position: absolute;
  top: 24px;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 14px;
  background: #1a2227;
  border-radius: 8px;
}

.t8-hero__rotbadge {
  position: absolute;
  top: 32px;
  right: 32px;
  width: 96px;
  height: 96px;
  border-radius: 50%;
  background: var(--t8-amber);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-family: 'Caveat', cursive;
  font-size: 18px;
  color: var(--t8-white);
  line-height: 1.1;
  font-weight: 600;
  transform: rotate(8deg);
}

.t8-hero__price {
  position: absolute;
  bottom: 32px;
  left: 32px;
  background: var(--t8-white);
  padding: 14px 18px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(37,50,58,0.1);
}
.t8-hero__price-amount {
  font-family: var(--t8-font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--t8-dark);
  line-height: 1;
}
.t8-hero__price-label {
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-dark-soft);
  margin-top: 2px;
}

/* ==========================================================================
   2. GENVÄGAR
   ========================================================================== */
.t8-genv {
  background: var(--t8-light-warm);
  border-top: 1px solid var(--t8-border);
  border-bottom: 1px solid var(--t8-border);
}

.t8-genv__list {
  flex: 1;
}

.t8-genv__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--t8-dark);
  text-decoration: none;
  transition: color 0.15s;
}
.t8-genv__link:hover {
  color: var(--t8-pink);
}

.t8-badge {
  background: var(--t8-light);
  color: var(--t8-dark-soft);
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 500;
}

/* ==========================================================================
   3. PRODUKTKORT (Populärt just nu)
   ========================================================================== */
.t8-product-card {
  background: var(--t8-white) !important;
  border-radius: 16px !important;
  overflow: hidden;
  border: 1px solid var(--t8-border);
  display: flex !important;
  flex-direction: column !important;
}

.t8-product-card__media {
  position: relative;
  aspect-ratio: 1 / 1;
  background: var(--t8-white);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  overflow: hidden;
}
.t8-product-card__media > img,
.t8-product-card__media .brxe-image,
.t8-product-card__media .brxe-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 0;
  box-sizing: border-box;
}

.t8-product-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  color: var(--t8-white);
  padding: 4px 10px;
  border-radius: 6px;
  font-family: var(--t8-font-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.t8-badge--new { background: var(--t8-pink); }
.t8-badge--popular { background: var(--t8-dark); }

.t8-product-card__heart {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 32px;
  height: 32px;
  background: var(--t8-white);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--t8-dark);
  transition: color 0.15s;
}
.t8-product-card__heart:hover { color: var(--t8-pink); }
.t8-product-card__heart i { font-size: 16px; line-height: 1; }

/* Default visual: real WC photo. Image element fills media, contain-fit. */
.t8-product-card__visual {
  width: 100%;
  height: 100%;
  background: var(--t8-white);
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.t8-product-card__visual img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  padding: 16px;
  box-sizing: border-box;
}

/* Demo placeholder shapes på startsidan (utan riktig bild) */
.t8-product-card__visual--phone:not(:has(img)),
.t8-product-card__visual--phone:empty {
  width: 60%;
  height: 80%;
  aspect-ratio: 1 / 2;
  background: var(--t8-dark);
  border-radius: 16px;
}
.t8-product-card__visual--laptop:not(:has(img)),
.t8-product-card__visual--laptop:empty {
  width: 80%;
  height: 60%;
  aspect-ratio: 1.5 / 1;
  background: var(--t8-dark);
  border-radius: 8px;
}

.t8-product-card__body {
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px;
  flex: 1;
}

.t8-product-card__cat {
  font-family: var(--t8-font-body) !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--t8-dark-soft) !important;
}

/* Varumärkesnamn (t.ex. "Apple") — samma vertikala plats som cat */
.t8-product-card__brand {
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em !important;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

.t8-product-card__title {
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  line-height: 1.3 !important;
  margin: 0 0 16px 0 !important;
  flex: 1;
}

.t8-product-card__foot {
  margin-top: auto !important;
  width: 100%;
}

.t8-product-card__price {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.t8-product-card__price-from {
  font-family: var(--t8-font-body);
  font-size: 11px;
  color: var(--t8-dark-soft);
}
.t8-product-card__price-amount {
  font-family: var(--t8-font-body);
  font-size: 16px;
  font-weight: 600;
  color: var(--t8-dark);
}
.t8-product-card__price-unit {
  font-size: 11px;
  font-weight: 400;
  color: var(--t8-dark-soft);
}

.t8-product-card__plus {
  width: 36px;
  height: 36px;
  background: var(--t8-dark);
  border: none;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--t8-white);
  transition: background 0.15s;
}
.t8-product-card__plus:hover { background: var(--t8-pink); }
.t8-product-card__plus i { font-size: 14px; line-height: 1; }

/* ==========================================================================
   4. KATEGORIKORT
   ========================================================================== */
.t8-cat-grid {
  width: 100% !important;
}
.t8-cat-grid > * {
  width: 100%;
  min-width: 0;
}

.t8-cat-card {
  background: var(--t8-light);
  border-radius: 20px;
  padding: 32px 28px;
  text-decoration: none;
  color: inherit;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 240px;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  position: relative;
  transition: background 0.2s, color 0.2s, transform 0.2s, box-shadow 0.2s;
}
.t8-cat-card:hover {
  background: var(--t8-dark);
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(37,50,58,0.16);
}
/* Hover-färger på inre element (deras egna explicita färger måste overrideas) */
.t8-cat-card:hover .t8-cat-card__name {
  color: var(--t8-white);
}
.t8-cat-card:hover .t8-cat-card__count {
  color: rgba(255,255,255,0.65);
}
.t8-cat-card:hover .t8-cat-card__icon {
  background: rgba(255,255,255,0.10);
  color: var(--t8-white);
}
.t8-cat-card:hover .t8-cat-card__arrow {
  background: var(--t8-pink);
  color: var(--t8-white);
}

.t8-cat-card__icon {
  width: 48px;
  height: 48px;
  background: var(--t8-white);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--t8-dark);
}
.t8-cat-card__icon i { font-size: 22px; line-height: 1; }

.t8-cat-card__name {
  font-family: var(--t8-font-body);
  font-size: 18px;
  font-weight: 600;
  color: var(--t8-dark);
  margin-bottom: 6px;
}
.t8-cat-card__count {
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark-soft);
}

.t8-cat-card__arrow {
  position: absolute;
  bottom: 24px;
  right: 24px;
  width: 40px;
  height: 40px;
  background: var(--t8-white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--t8-dark);
}
.t8-cat-card__arrow i { font-size: 16px; line-height: 1; }

/* ==========================================================================
   5. KUND-PUFF
   ========================================================================== */
.t8-puff-card {
  border-radius: 24px;
  padding: 48px;
}
.t8-puff-card--dark {
  background: var(--t8-dark);
  color: var(--t8-white);
}
.t8-puff-card--pink {
  background: var(--t8-pink);
  color: var(--t8-white);
}

.t8-puff-card__title {
  font-family: var(--t8-font-body) !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.01em !important;
  color: var(--t8-white) !important;
  margin: 0 !important;
}
@media (max-width: 767px) { .t8-puff-card__title { font-size: 26px !important; } }

.t8-puff-card__desc {
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,0.85) !important;
  max-width: 380px !important;
  margin: 0 !important;
}
.t8-puff-card--dark .t8-puff-card__desc {
  color: rgba(255,255,255,0.75) !important;
}

/* ==========================================================================
   6. WHY-CARDS (Varför handla hos oss)
   ========================================================================== */
.t8-why-card {
  background: rgba(255,255,255,0.04);
  border-radius: 20px;
  padding: 32px;
  color: var(--t8-white);
  display: flex !important;
  flex-direction: column !important;
  position: relative;
}
/* Ikonen positioneras till topp-höger oavsett DOM-ordning i Bricks */
.t8-why-card .t8-why-card__icon {
  position: absolute;
  top: 32px;
  right: 32px;
  margin-bottom: 0;
}

.t8-why-card__num {
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--t8-pink) !important;
  margin-bottom: 32px !important;
}

.t8-why-card__icon {
  width: 44px;
  height: 44px;
  background: rgba(242,65,98,0.15);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--t8-pink);
  margin-bottom: 24px;
}
.t8-why-card__icon i { font-size: 20px; line-height: 1; }

.t8-why-card__title {
  font-family: var(--t8-font-body) !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  color: var(--t8-white) !important;
  margin: 0 0 12px 0 !important;
}

.t8-why-card__desc {
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: rgba(255,255,255,0.7) !important;
  margin: 0 !important;
}

/* ==========================================================================
   12. PRODUKTKORT — JetEngine-listing overrides
   Stylar WC/Bricks-element och wishlist-pluggens output så listing-mallen
   ser ut som de statiska demokorten på startsidan.
   ========================================================================== */

/* Wishlist (TI WooCommerce Wishlist) — render som hjärt-knapp, top-right.
   Positionera ENDAST den yttre .brxe-shortcode wrappern. Inre .tinv-wraper
   ska vara static så den inte cascadar offset från outer. */
.t8-product-card__media .brxe-shortcode {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  left: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  z-index: 5;
}
.t8-product-card__media .brxe-shortcode .tinv-wraper,
.t8-product-card__media .brxe-shortcode .tinv-wishlist {
  position: static !important;
  top: auto !important;
  right: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
  border: none !important;
  display: block !important;
}
/* Tooltip ska aldrig påverka layout */
.t8-product-card__media .tinv-wraper .tinvwl-tooltip {
  position: absolute;
  pointer-events: none;
}
/* Hjärt-knapp — explicit storlek + flex-centrering for att besegra plugin's 18x18 */
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button,
.t8-product-card__media .brxe-shortcode .tinv-wishlist a.tinvwl_add_to_wishlist_button,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart.no-txt,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart-plus,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart-plus.no-txt {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 0 !important;
  background: #fff !important;
  border: none !important;
  border-radius: 50% !important;
  box-shadow: 0 1px 4px rgb(37 50 58 / 15%) !important;
  vertical-align: top !important;
  line-height: 1 !important;
  overflow: visible !important;
}

/* Default-ikon */
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button::before,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart.no-txt::before,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart-plus.no-txt::before {
  content: "\eab9" !important;
  font-family: 'team8' !important;
  font-size: 16px !important;
  color: inherit;
  padding: 0;
  /* Reset plugin's absolut-centrering — anvander flex pa parent istallet */
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
}

/* Aktiv state — produkten ligger i favoritlistan: pink fyllnad så vit ikon syns */
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-product-in-list,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-product-make-remove {
  background: var(--t8-pink) !important;
}
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-product-in-list::before,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-product-make-remove::before {
  content: "\eab9" !important;
  font-family: 'team8' !important;
  font-size: 16px !important;
  color: #fff;
  padding: 0;
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin: 0 !important;
  transform: none !important;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
}

/* Dölj pluginets egen ikon (SVG eller font-icon) och text */
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button > i,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button > svg,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button .ftinvwl,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl_add_to_wishlist_button > span,
.t8-product-card__media .brxe-shortcode .tinv-wishlist .tinvwl-txt {
  display: none !important;
}

/* Product tag-taxonomy — render som badge, top-left */
.t8-product-card__media .brxe-post-taxonomy {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 0;
}
.t8-product-card__media .brxe-post-taxonomy a,
.t8-product-card__media .brxe-post-taxonomy span,
.t8-product-card__media .brxe-post-taxonomy .post-taxonomy-item {
  display: inline-block;
  padding: 6px 14px;
  background: var(--t8-dark);
  color: var(--t8-white);
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  pointer-events: none;
  line-height: 1.2;
}
/* Slug-baserad accent: nyhet/ny = pink (specialvariant), default = dark */
.t8-product-card__media .brxe-post-taxonomy [class*="-nyhet"],
.t8-product-card__media .brxe-post-taxonomy [class*="-ny"],
.t8-product-card__media .brxe-post-taxonomy a[href*="nyhet"] {
  background: var(--t8-pink);
}

/* WC product-price (Bricks-element) — kortets pris-rad */
.t8-product-card .brxe-product-price {
  font-weight: 700;
  font-size: 18px;
  color: var(--t8-pink);
  margin: 0;
}
.t8-product-card .brxe-product-price .price {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  flex-wrap: wrap;
}
.t8-product-card .brxe-product-price .from,
.t8-product-card .brxe-product-price .woocommerce-price-from {
  color: var(--t8-dark-soft);
  font-weight: 400;
  font-size: 12px;
  font-family: var(--t8-font-body);
}
.t8-product-card .brxe-product-price del {
  display: none;
}
.t8-product-card .brxe-product-price ins {
  text-decoration: none;
  background: none;
}

/* WC add-to-cart (Bricks-element) — full-bredd pill-knapp med synlig text
   Tre states (sätts via functions.php-filter på <a class="button ...">):
     - "Lägg i varukorg" → simple in-stock          → vit pill, dark text
     - "Välj köpsätt"    → har alternativ            → vit pill, dark text
     - "Ring sälj"       → slut i lager → tel:-länk → pink pill, vit text */
.t8-product-card__foot {
  width: 100% !important;
  margin-top: 28px !important;
}
.t8-product-card .brxe-product-add-to-cart {
  width: 100%;
  display: flex;
}
.t8-product-card__foot > a.button,
.t8-product-card__foot > a.brxe-button,
.t8-product-card__foot > a.bricks-button,
.t8-product-card .brxe-product-add-to-cart .button,
.t8-product-card .brxe-product-add-to-cart a.button,
.t8-product-card .brxe-product-add-to-cart .added_to_cart {
  width: 100% !important;
  min-height: 44px !important;
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  padding: 12px 20px !important;
  margin: 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-transform: none;
  text-indent: 0;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.t8-product-card__foot > a.button:hover,
.t8-product-card__foot > a.brxe-button:hover,
.t8-product-card__foot > a.bricks-button:hover,
.t8-product-card .brxe-product-add-to-cart .button:hover,
.t8-product-card .brxe-product-add-to-cart a.button:hover {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-dark) !important;
}

/* Ring sälj — dämpad ljusgrå (out-of-stock är en neutral handling, inte CTA).
   Klassen sätts via functions.php-filtret. */
.t8-product-card .brxe-product-add-to-cart .button.ring-salj,
.t8-product-card .brxe-product-add-to-cart a.button.ring-salj,
.t8-product-card .brxe-product-add-to-cart a[href^="tel:"] {
  background: var(--t8-light) !important;
  color: var(--t8-dark-soft) !important;
  border-color: var(--t8-border) !important;
}
.t8-product-card .brxe-product-add-to-cart .button.ring-salj:hover,
.t8-product-card .brxe-product-add-to-cart a.button.ring-salj:hover,
.t8-product-card .brxe-product-add-to-cart a[href^="tel:"]:hover {
  background: var(--t8-border) !important;
  border-color: transparent !important;
  color: var(--t8-dark) !important;
}

/* Loading-spinner från WC AJAX add-to-cart */
.t8-product-card .brxe-product-add-to-cart .button.loading {
  opacity: 0.7;
}
.t8-product-card .brxe-product-add-to-cart .button.loading::after {
  display: none;
}

/* Hantera-loop-add — fristående "Lägg i varukorg"-knapp (utanför produktkortet).
   Samma stil som default-knappen i kort-foten. */
.brxe-product-add-to-cart .button.hantera-loop-add,
button.hantera-loop-add {
  min-height: 44px !important;
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  padding: 12px 20px !important;
  margin: 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-transform: none;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.brxe-product-add-to-cart .button.hantera-loop-add:hover,
button.hantera-loop-add:hover {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-pink) !important;
}

/* ----------------------------------------------------------------------
   Ingram-shortcodes i kortets body
   ---------------------------------------------------------------------- */

/* [ingram_mst_from] — "Delbetala från xx kr/mån" under priset (alt-produkter) */
.t8-product-card__body .ingram-mst-from,
.t8-product-card__body .ingram-mst-monthly,
.t8-product-card__body [class*="ingram-mst"]:not([class*="cart"]):not([class*="minicart"]) {
  display: block;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--t8-dark-soft);
  margin-top: -2px;
  margin-bottom: 8px;
  line-height: 1.4;
  text-align: left;
}

/* [ingram_stock] — pluginet renderar .ingram-stock-short med inline <style>
   per render. Vi använder !important på colors/background för att vinna mot
   pluginets inline-CSS oavsett laddordning. */
.t8-product-card__body .ingram-stock-short,
.brxe-shortcode .ingram-stock-short {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
}
.t8-product-card__body .ingram-stock-short__dots,
.brxe-shortcode .ingram-stock-short__dots {
  display: inline-flex;
  gap: 3px;
}
/* Default dot = tom (ljus border-fag) */
.t8-product-card__body .ingram-stock-short__dots span,
.brxe-shortcode .ingram-stock-short__dots span {
  width: 5px !important;
  height: 5px !important;
  border-radius: 50% !important;
  background: var(--t8-border) !important;
  display: inline-block !important;
}

/* Alla texter samma mork farg (oavsett state) */
.t8-product-card__body .ingram-stock-short__text,
.brxe-shortcode .ingram-stock-short__text,
.t8-product-card__body .ingram-stock-short--in .ingram-stock-short__text,
.brxe-shortcode .ingram-stock-short--in .ingram-stock-short__text,
.t8-product-card__body .ingram-stock-short--low .ingram-stock-short__text,
.brxe-shortcode .ingram-stock-short--low .ingram-stock-short__text,
.t8-product-card__body .ingram-stock-short--oos .ingram-stock-short__text,
.brxe-shortcode .ingram-stock-short--oos .ingram-stock-short__text {
  color: var(--t8-dark-soft) !important;
}

.ingram-stock__text {
  font-size: 13px !important;
}

/* I lager — alla 3 prickar fyllda i morkgra */
.t8-product-card__body .ingram-stock-short--in .ingram-stock-short__dots span,
.brxe-shortcode .ingram-stock-short--in .ingram-stock-short__dots span {
  background: var(--t8-dark) !important;
}

/* Fa i lager — forsta pricken fylld i gra, ovriga 2 tomma */
.t8-product-card__body .ingram-stock-short--low .ingram-stock-short__dots span,
.brxe-shortcode .ingram-stock-short--low .ingram-stock-short__dots span {
  background: var(--t8-border) !important;
}
.t8-product-card__body .ingram-stock-short--low .ingram-stock-short__dots span:first-child,
.brxe-shortcode .ingram-stock-short--low .ingram-stock-short__dots span:first-child {
  background: var(--t8-dark-soft) !important;
}

/* Slut i lager — alla 3 prickar tomma (ljus gra) */
.t8-product-card__body .ingram-stock-short--oos .ingram-stock-short__dots span,
.brxe-shortcode .ingram-stock-short--oos .ingram-stock-short__dots span {
  background: var(--t8-border) !important;
}

/* ----------------------------------------------------------------------
   Avdelare i produktkortet (Bricks divider med klass .t8-divider)
   Ljus linje med extra utrymme nedåt — separerar bilden från body-innehållet
   ---------------------------------------------------------------------- */
.t8-divider {
  margin: 0 0 24px 0 !important;
  width: 100%;
}
.t8-divider .line,
.t8-divider hr {
  background: var(--t8-border) !important;
  border-color: var(--t8-border) !important;
  height: 1px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

/* ----------------------------------------------------------------------
   JetEngine listing-grid inom .t8-section
   Listing-wrappern är direkt-barn till section (inte i container) så den
   stretchar full bredd. Konstrar max-bredd + centrerar + ger luft över/under.
   ---------------------------------------------------------------------- */
.t8-section .brxe-jet-engine-listing-grid,
.t8-section .jet-listing-grid {
  max-width: 1280px;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100%;
}
.t8-section .brxe-jet-engine-listing-grid {
  margin-top: 40px;
  margin-bottom: 40px;
}
@media (max-width: 991px) {
  .t8-section .brxe-jet-engine-listing-grid {
    margin-top: 32px;
    margin-bottom: 32px;
  }
}
@media (max-width: 478px) {
  .t8-section .brxe-jet-engine-listing-grid {
    margin-top: 24px;
    margin-bottom: 24px;
  }
}

/* ----------------------------------------------------------------------
   Header — matcha container-bredd och padding mot sektioner.
   Bricks default-container är 1100px, men sidans sektioner använder 1280px.
   Vi sätter header-containrarna till 1280px så de linjerar med innehållet.
   ---------------------------------------------------------------------- */
header .brxe-container,
header.brxe-section .brxe-container {
  max-width: 1280px !important;
  width: 100% !important;
}
header > .brxe-block,
header.brxe-section > .brxe-block {
  padding-left: 48px !important;
  padding-right: 48px !important;
}
@media (max-width: 991px) {
  header > .brxe-block,
  header.brxe-section > .brxe-block {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}
@media (max-width: 767px) {
  header > .brxe-block,
  header.brxe-section > .brxe-block {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}
@media (max-width: 478px) {
  header > .brxe-block,
  header.brxe-section > .brxe-block {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ==========================================================================
   13. PRODUKTKORT — LIGGANDE (.t8-product-card--row)
   Modifier som ändrar layout till horizontal: bild vänster, info mitten,
   pris+knapp höger. Återanvänder bas-klasserna så knappstates och wishlist
   funkar utan extra regler.
   ========================================================================== */
/* Hög specificitet: kombinera klass-attribut för att slå Bricks ID-genererade
   regler (#brxe-XXX). 0,0,3,0 + !important — säkerhetsmarginal även om Bricks
   skulle lägga !important på sina egna inline-CSS-block. */
.t8-product-card.t8-product-card--row,
[class*="brxe-"].t8-product-card.t8-product-card--row,
.t8-product-card.t8-product-card--row[class*="brxe-"] {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  gap: 24px !important;
  padding: 24px !important;
}
@media (max-width: 991px) {
  .t8-product-card.t8-product-card--row,
  [class*="brxe-"].t8-product-card.t8-product-card--row,
  .t8-product-card.t8-product-card--row[class*="brxe-"] {
    flex-direction: column !important;
    gap: 20px !important;
    padding: 20px !important;
  }
}

/* Vänster — bild-spalt */
.t8-product-card--row .t8-product-card__media,
[class*="brxe-"].t8-product-card--row > .t8-product-card__media {
  width: 220px !important;
  min-width: 220px !important;
  flex-shrink: 0 !important;
  aspect-ratio: 1 / 1 !important;
  align-self: flex-start !important;
  background: var(--t8-light);
  border-radius: 12px;
}
/* Bilden inuti måste fylla media-rutan helt (override på alla bricks-varianter) */
.t8-product-card--row .t8-product-card__media .brxe-image,
.t8-product-card--row .t8-product-card__media picture,
.t8-product-card--row .t8-product-card__media .t8-product-card__visual,
.t8-product-card--row .t8-product-card__media img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
}
.t8-product-card--row .t8-product-card__media img {
  object-fit: contain !important;
  padding: 0;
  box-sizing: border-box;
}
@media (max-width: 991px) {
  .t8-product-card--row .t8-product-card__media {
    width: 100%;
    max-width: 280px;
  }
}

/* Mitten — info-spalt */
.t8-product-card__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* Större titel i liggande layout */
.t8-product-card--row .t8-product-card__title {
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin: 0 0 4px 0 !important;
  color: var(--t8-dark) !important;
}
@media (max-width: 991px) {
  .t8-product-card--row .t8-product-card__title {
    font-size: 18px !important;
  }
}

/* Produktbeskrivning (post-excerpt) — render som bullet list */
.t8-product-card--row .brxe-post-excerpt,
.t8-product-card--row .t8-product-card__info .brxe-post-excerpt {
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark);
  line-height: 1.6;
  margin: 4px 0 0 0;
}
/* Om excerpten innehåller en <ul>: styla som design-system-lista */
.t8-product-card--row .brxe-post-excerpt ul,
.t8-product-card--row .t8-product-card__info ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0px;
}
.t8-product-card--row .brxe-post-excerpt ul li,
.t8-product-card--row .t8-product-card__info ul li {
  position: relative;
  padding-left: 16px;
  font-size: 13px;
  color: var(--t8-dark);
  line-height: 1.5;
}
.t8-product-card--row .brxe-post-excerpt ul li::before,
.t8-product-card--row .t8-product-card__info ul li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--t8-dark-soft);
  font-weight: bold;
}
.t8-product-card--row .brxe-post-excerpt strong,
.t8-product-card--row .t8-product-card__info ul strong {
  font-weight: 500;
  color: var(--t8-dark-soft);
}
/* Om excerpten är plain text utan listmarkering — radbryt efter `:`
   (fallback för plain-text-excerpter, fungerar bara om innehållet har punkter
    mellan specs). Den verkligt rena fixen är att lägga <ul><li> i excerpten
    eller byta post-excerpt mot ett code-element med bullet-list HTML. */
.t8-product-card--row .brxe-post-excerpt p {
  margin: 0;
  white-space: pre-line;
}

/* Specifikationslista */
.t8-product-card__specs {
  list-style: none;
  padding: 0;
  margin: 8px 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.t8-product-card__specs li {
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark);
  line-height: 1.5;
  position: relative;
  padding-left: 16px;
}
.t8-product-card__specs li::before {
  content: "•";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--t8-dark-soft);
  font-weight: bold;
}
.t8-product-card__specs strong {
  font-weight: 500;
  color: var(--t8-dark-soft);
}

/* Artikelnummer-rad nederst i info-spalten */
.t8-product-card__articles {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 16px;
  font-family: var(--t8-font-body);
  font-size: 11px;
  color: var(--t8-dark-soft);
  margin-top: auto;
  padding-top: 12px;
}
.t8-product-card__articles span,
.t8-product-card__articles div {
  color: var(--t8-dark-soft) !important;
}
/* Dolj artikelnummer pa mobil (≤991px) */
@media (max-width: 991px) {
  .t8-product-card__articles {
    display: none !important;
  }
}

/* Höger — pris-spalt */
.t8-product-card__price-col {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  min-width: 180px;
  text-align: right;
}
@media (max-width: 991px) {
  .t8-product-card__price-col {
    align-items: flex-start;
    text-align: left;
    width: 100%;
  }
}

/* Pris-override i liggande layout — större, mörk (inte pink som vertikal) */
.t8-product-card--row .brxe-product-price {
  font-family: var(--t8-font-body);
  font-weight: 600;
  font-size: 22px;
  color: var(--t8-dark);
  line-height: 1.2;
  margin: 0;
}
/* "exkl. moms" — liten dämpad text under priset */
.t8-product-card__price-note {
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-dark-soft);
  margin: 0;
  line-height: 1.2;
}

/* Admin-info (Kostnad / Påslag) — små grå rader */
.t8-product-card__cost,
.t8-product-card__markup {
  font-family: var(--t8-font-body);
  font-size: 11px;
  color: var(--t8-dark-soft);
  margin: 0;
  line-height: 1.4;
}

/* Foot i liggande — knappen ska tryckas till botten av sin spalt */
.t8-product-card--row .t8-product-card__foot {
  margin-top: auto;
  padding-top: 8px;
  width: 100%;
}

/* ==========================================================================
   14. KATEGORISIDA — ARCHIVE TEMPLATE (.t8-cat-page)
   Två-kolumn layout: sidopanel (kategorinav + filter) + innehåll (titel,
   sort, aktiva filter, listing). Stackar på tablet och mindre.
   ========================================================================== */
.t8-cat-page {
  background: var(--t8-white);
}

.t8-cat-page__crumbs {
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark-soft);
}
.t8-cat-page__crumbs a {
  color: var(--t8-dark-soft);
  text-decoration: none;
}
.t8-cat-page__crumbs a:hover {
  color: var(--t8-pink);
}

.t8-cat-page__layout {
  align-items: start;
}

/* ----- Sidopanel ----- */
.t8-cat-page__sidebar-section {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.t8-cat-page__sidebar-eyebrow {
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--t8-dark-soft) !important;
  margin: 0 0 4px 0 !important;
}

.t8-cat-page__filter-head {
  margin-bottom: 4px;
}
.t8-cat-page__filter-clear .button,
.t8-cat-page__filter-clear a,
.t8-cat-page__filter-clear .jet-smart-filters-remove {
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
}
.t8-cat-page__filter-clear .button:hover,
.t8-cat-page__filter-clear a:hover {
  color: var(--t8-pink) !important;
}

/* IKS Menu i sidopanel — kategori-navigering med aktiv state.
   Overridar pluginens egna inställningar via högre specificitet + !important
   så vi får sketchens design oavsett vilka plugin-settings användaren har. */

/* Reset av plugin-defaults (border-left, bg, padding etc.) */
.t8-cat-page__cat-menu,
.t8-cat-page__cat-menu .iks-menu,
.t8-cat-page__cat-menu ul,
.t8-cat-page__cat-menu .iks-menu__list {
  list-style: none;
  padding: 0;
  margin: 0;
  background: transparent;
  border: none;
}
.t8-cat-page__cat-menu li,
.t8-cat-page__cat-menu .iks-menu__item {
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  list-style: none;
  min-height: 0;
}

/* Länk-stil (default) */
.t8-cat-page__cat-menu a,
.t8-cat-page__cat-menu .iks-menu__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--t8-dark);
  text-decoration: none;
  border-radius: 8px;
  line-height: 1.3;
  transition: background 0.15s, color 0.15s;
}
.t8-cat-page__cat-menu a:hover,
.t8-cat-page__cat-menu .iks-menu__link:hover {
  background: var(--t8-light-warm);
  color: var(--t8-dark);
}

/* Antal-räknare till höger */
.t8-cat-page__cat-menu .post-count,
.t8-cat-page__cat-menu .iks-menu__count,
.t8-cat-page__cat-menu .iks-menu-count,
.t8-cat-page__cat-menu .count {
  margin-left: auto;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--t8-dark-soft);
  background: transparent;
  padding: 0;
  flex-shrink: 0;
}

/* Aktiv-state default — DARK PILL för ALLA current-items.
   Nested (sub-cat) overridas till pink nedan via ul ul-selektor. */
.t8-cat-page__cat-menu li.current-menu-item > a,
.t8-cat-page__cat-menu li.current-menu-parent > a,
.t8-cat-page__cat-menu li.current-menu-ancestor > a,
.t8-cat-page__cat-menu .iks-menu-item-current > a,
.t8-cat-page__cat-menu .iks-menu-item-parent > a,
.t8-cat-page__cat-menu .iks-menu-item-ancestor > a,
.t8-cat-page__cat-menu .iks-menu__item--current > .iks-menu__link,
.t8-cat-page__cat-menu .iks-menu__item--parent-of-current > .iks-menu__link,
.t8-cat-page__cat-menu .iks-menu-item-current > .iks-menu-link,
.t8-cat-page__cat-menu .iks-menu-item-parent > .iks-menu-link {
  background: var(--t8-dark);
  color: var(--t8-white);
  font-weight: 600;
}
/* Räknare på aktiv top-level — vit dämpad */
.t8-cat-page__cat-menu li.current-menu-item > a .post-count,
.t8-cat-page__cat-menu li.current-menu-parent > a .post-count,
.t8-cat-page__cat-menu li.current-menu-item > a .iks-menu-count,
.t8-cat-page__cat-menu li.current-menu-parent > a .iks-menu-count,
.t8-cat-page__cat-menu li.current-menu-item > a .iks-menu__count,
.t8-cat-page__cat-menu .iks-menu-item-current > a .post-count,
.t8-cat-page__cat-menu .iks-menu-item-current > a .iks-menu-count,
.t8-cat-page__cat-menu .iks-menu-item-current > .iks-menu-link .iks-menu-count,
.t8-cat-page__cat-menu .iks-menu__item--current > .iks-menu__link .iks-menu__count {
  color: rgba(255,255,255,0.6);
}

/* Subkategorier — indenterade med vänster-linje.
   Override:ar pluginets pink border-left (container_children_custom). */
.t8-cat-page__cat-menu ul ul,
.t8-cat-page__cat-menu .iks-menu__children,
.t8-cat-page__cat-menu .iks-menu-children,
.t8-cat-page__cat-menu .iks-menu-children-container,
.t8-cat-page__cat-menu .iks-menu__children-container,
.t8-cat-page__cat-menu .sub-menu,
.t8-cat-page__cat-menu [class*="iks-menu"][class*="children"] {
  padding-left: 14px !important;
  border-left: 1px solid var(--t8-border) !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  margin: 4px 0 4px 14px !important;
  background: transparent !important;
}
.t8-cat-page__cat-menu ul ul a,
.t8-cat-page__cat-menu .iks-menu__children .iks-menu__link,
.t8-cat-page__cat-menu .sub-menu a {
  padding: 8px 14px !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  border-radius: 6px !important;
}

/* Aktiv subkategori — pink text, transparent bg.
   Overridar default dark-pill för nested current via ul ul-selektor. */
.t8-cat-page__cat-menu ul ul li.current-menu-item > a,
.t8-cat-page__cat-menu ul ul .iks-menu-item-current > a,
.t8-cat-page__cat-menu ul ul .iks-menu__item--current > .iks-menu__link,
.t8-cat-page__cat-menu .iks-menu__children .iks-menu__item--current > .iks-menu__link,
.t8-cat-page__cat-menu .iks-menu-children .iks-menu-item-current > a,
.t8-cat-page__cat-menu .iks-menu-children-container .iks-menu-item-current > a,
.t8-cat-page__cat-menu .sub-menu li.current-menu-item > a,
.t8-cat-page__cat-menu [class*="children"] li.current-menu-item > a,
.t8-cat-page__cat-menu [class*="children"] .iks-menu-item-current > a {
  color: var(--t8-pink) !important;
  background: transparent !important;
  font-weight: 600 !important;
}
/* Pink räknare på aktiv subkategori */
.t8-cat-page__cat-menu ul ul li.current-menu-item > a .post-count,
.t8-cat-page__cat-menu ul ul li.current-menu-item > a .iks-menu-count,
.t8-cat-page__cat-menu ul ul .iks-menu-item-current > a .post-count,
.t8-cat-page__cat-menu ul ul .iks-menu-item-current > a .iks-menu-count,
.t8-cat-page__cat-menu .iks-menu__children .iks-menu__item--current > .iks-menu__link .iks-menu__count,
.t8-cat-page__cat-menu [class*="children"] li.current-menu-item > a .post-count,
.t8-cat-page__cat-menu [class*="children"] .iks-menu-item-current > a .iks-menu-count {
  color: var(--t8-pink) !important;
}

/* Toggle-knapp (expandera/collapse chevron) */
.t8-cat-page__cat-menu .iks-menu__toggle,
.t8-cat-page__cat-menu .iks-menu-toggle,
.t8-cat-page__cat-menu button.iks-menu__toggle,
.t8-cat-page__cat-menu button.iks-menu-toggle {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  background: transparent !important;
  border: none !important;
  border-left: none !important;
  color: var(--t8-dark-soft) !important;
  font-size: 14px !important;
  cursor: pointer;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.t8-cat-page__cat-menu .iks-menu__toggle:hover,
.t8-cat-page__cat-menu .iks-menu-toggle:hover {
  color: var(--t8-dark) !important;
}
/* Toggle inuti aktiv top-level pill — vit ikon */
.t8-cat-page__cat-menu li.current-menu-item > .iks-menu__toggle,
.t8-cat-page__cat-menu li.current-menu-parent > .iks-menu__toggle,
.t8-cat-page__cat-menu li.current-menu-item > .iks-menu-toggle,
.t8-cat-page__cat-menu .iks-menu-item-current > .iks-menu-toggle {
  color: var(--t8-white) !important;
}

/* Filter-sektioner — JetSmartFilters */
.t8-cat-page__filter .jet-filter-label,
.t8-cat-page__filter h3,
.t8-cat-page__filter h4 {
  font-family: var(--t8-font-body) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  margin: 0 0 10px 0 !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.t8-cat-page__filter .jet-checkboxes-list,
.t8-cat-page__filter ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.t8-cat-page__filter .jet-checkboxes-list__row,
.t8-cat-page__filter label {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  color: var(--t8-dark) !important;
  cursor: pointer;
}
.t8-cat-page__filter input[type="checkbox"],
.t8-cat-page__filter input[type="radio"] {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  border: 1.5px solid var(--t8-border);
  cursor: pointer;
  accent-color: var(--t8-pink);
}
.t8-cat-page__filter .jet-checkboxes-list__count,
.t8-cat-page__filter .count {
  margin-left: auto;
  font-size: 12px;
  color: var(--t8-dark-soft);
}

/* Pris-input (range eller min/max-fält) */
.t8-cat-page__filter input[type="number"],
.t8-cat-page__filter input[type="text"].jet-range__input {
  font-family: var(--t8-font-body);
  font-size: 14px;
  padding: 10px 14px;
  border: 1px solid var(--t8-border);
  border-radius: 8px;
  background: var(--t8-white);
  color: var(--t8-dark);
  width: 100%;
}
.t8-cat-page__filter input[type="number"]:focus {
  outline: none;
  border-color: var(--t8-pink);
}

/* ----- Innehåll ----- */
.t8-cat-page__content {
  min-width: 0;
}

.t8-cat-page__desc {
  font-family: var(--t8-font-body);
  font-size: 16px;
  color: var(--t8-dark);
  line-height: 1.6;
  max-width: 560px;
}

.t8-cat-page__sort-row {
  padding: 16px 0;
  border-top: 1px solid var(--t8-border);
  border-bottom: 1px solid var(--t8-border);
}
.t8-cat-page__count,
.t8-cat-page__count .woocommerce-result-count {
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark);
  margin: 0;
}
.t8-cat-page__count strong {
  font-weight: 600;
}

/* Sort-dropdown — JetSmartFilters select */
.t8-cat-page__sort select,
.t8-cat-page__sort .jet-select__control {
  font-family: var(--t8-font-body);
  font-size: 13px;
  padding: 10px 36px 10px 16px;
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  background: var(--t8-white);
  color: var(--t8-dark);
  cursor: pointer;
}

/* Aktiva filter-chips */
.t8-cat-page__active-label {
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--t8-dark-soft) !important;
}
.t8-cat-page__active-filters .jet-active-filters__item,
.t8-cat-page__active-filters .jet-filter-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: var(--t8-light);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark);
}
.t8-cat-page__active-filters .jet-active-filters__remove,
.t8-cat-page__active-filters .jet-filter-row .jet-active-filters__item-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid var(--t8-border);
  background: var(--t8-white);
  color: var(--t8-dark-soft);
  cursor: pointer;
  font-size: 10px;
}
.t8-cat-page__active-filters .jet-active-filters__remove:hover {
  background: var(--t8-pink);
  color: var(--t8-white);
  border-color: var(--t8-pink);
}

/* Listing-platshållare */
.t8-cat-page__listing {
  min-height: 200px;
}

/* ==========================================================================
   15. JETSMARTFILTERS — RADIO/CHECKBOX SOM PILL-KNAPPAR
   Stylar [jet_smart_filters] eller Bricks jet-smart-filters-radio som kort
   med pill-knappar i flex-wrap-rad. Matchar gamla shop-stilen.
   ========================================================================== */

/* Grupp-wrapper när flera filter renderas tillsammans */
.brxe-jet-smart-filters-radio .jet-filters-group,
.brxe-jet-smart-filters-checkboxes .jet-filters-group {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* Varje filter som ett vitt kort med ljus ram */
.brxe-jet-smart-filters-radio .jet-smart-filters-radio.jet-filter,
.brxe-jet-smart-filters-checkboxes .jet-smart-filters-checkboxes.jet-filter,
.t8-cat-page__filter .jet-smart-filters-radio.jet-filter,
.t8-cat-page__filter .jet-smart-filters-checkboxes.jet-filter {
  background: var(--t8-white);
  border: 1px solid var(--t8-border);
  border-radius: 12px;
  padding: 14px 18px;
}

/* Filter-rubrik (Lagring, Varumärke, etc.) med underrad */
.brxe-jet-smart-filters-radio .jet-filter-label,
.brxe-jet-smart-filters-checkboxes .jet-filter-label,
.t8-cat-page__filter .jet-filter-label {
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  padding-bottom: 10px !important;
  margin: 0 0 12px 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
  display: block !important;
}

/* Radio-listan som flex-wrap-rad av pills */
.brxe-jet-smart-filters-radio fieldset,
.t8-cat-page__filter fieldset {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.brxe-jet-smart-filters-radio .jet-radio-list-wrapper,
.brxe-jet-smart-filters-radio .jet-radio-list {
  display: block;
}
.brxe-jet-smart-filters-radio .jet-radio-list__row {
  margin: 0;
  padding: 0;
  display: inline-flex;
}

/* Dölj rader som pluginets indexer markerar (inga produkter med detta värde) */
.brxe-jet-smart-filters-radio .jet-filter-row-hide,
.brxe-jet-smart-filters-checkboxes .jet-filter-row-hide {
  display: none !important;
}

/* Label/wrapper kring varje option */
.brxe-jet-smart-filters-radio .jet-radio-list__item {
  display: inline-flex;
  cursor: pointer;
  margin: 0;
  padding: 0;
  position: relative;
}

/* Dölj native radio-input visuellt men håll åtkomlig för screen readers */
.brxe-jet-smart-filters-radio .jet-radio-list__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
  width: 0;
  height: 0;
  margin: 0;
}

/* Pill-knapp (default, ej aktiv) */
.brxe-jet-smart-filters-radio .jet-radio-list__button {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  background: var(--t8-white);
  color: var(--t8-dark);
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
.brxe-jet-smart-filters-radio .jet-radio-list__button:hover {
  border-color: var(--t8-dark-soft);
  background: var(--t8-light-warm);
}
.brxe-jet-smart-filters-radio .jet-radio-list__label {
  font: inherit;
  color: inherit;
  margin: 0;
}

/* Aktiv state — input checked → pink pill */
.brxe-jet-smart-filters-radio .jet-radio-list__input:checked + .jet-radio-list__button {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-pink) !important;
}
.brxe-jet-smart-filters-radio .jet-radio-list__input:checked + .jet-radio-list__button:hover {
  background: var(--t8-pink-dark) !important;
  border-color: var(--t8-pink-dark) !important;
}

/* Fokus-stil för tangentbordsnavigering */
.brxe-jet-smart-filters-radio .jet-radio-list__input:focus-visible + .jet-radio-list__button {
  outline: 2px solid var(--t8-pink);
  outline-offset: 2px;
}

/* Samma pill-stil för checkbox-filter (om sådana används) */
.brxe-jet-smart-filters-checkboxes .jet-checkboxes-list,
.t8-cat-page__filter .jet-checkboxes-list {
  display: flex !important;
  flex-wrap: wrap;
  gap: 6px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.brxe-jet-smart-filters-checkboxes .jet-checkboxes-list__row,
.t8-cat-page__filter .jet-checkboxes-list__row {
  margin: 0 !important;
}
.brxe-jet-smart-filters-checkboxes .jet-checkboxes-list__label {
  position: relative;
  cursor: pointer;
}
.brxe-jet-smart-filters-checkboxes .jet-checkboxes-list__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.brxe-jet-smart-filters-checkboxes .jet-checkboxes-list__button {
  display: inline-flex;
  align-items: center;
  padding: 7px 14px;
  background: var(--t8-white);
  color: var(--t8-dark);
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
.brxe-jet-smart-filters-checkboxes .jet-checkboxes-list__input:checked + .jet-checkboxes-list__button {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-pink) !important;
}

/* ==========================================================================
   16. IKS MENU — UNIVERSAL OVERRIDE (catch-all för pluginets rendering)
   Plugin-versioner kan rendera med olika klassnamn. Dessa selektorer
   matchar VAD SOM HELST med "iks-" i klassnamnet inne i sidebar-wrappern.
   ========================================================================== */

/* Reset på allt menu-relaterat */
.t8-cat-page__sidebar [class*="iks-menu"],
.t8-cat-page__sidebar [class*="iks-menu"] ul,
.t8-cat-page__sidebar [class*="iks-menu"] li {
  text-align: left !important;
  background: transparent !important;
  list-style: none !important;
}

/* Alla länkar i menyn — flex med space-between */
.t8-cat-page__sidebar [class*="iks-menu"] a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  text-align: left !important;
  gap: 12px !important;
  padding: 10px 14px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  text-decoration: none !important;
  border-radius: 8px !important;
  line-height: 1.3 !important;
}
.t8-cat-page__sidebar [class*="iks-menu"] a:hover {
  background: var(--t8-light-warm) !important;
}

/* Räknare — endast explicita count-klasser (inte span:last-child som kan
   matcha kategorinamn när count saknas, t.ex. Multimedia & spel) */
.t8-cat-page__sidebar [class*="iks-menu"] [class*="count"] {
  margin-left: auto !important;
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: var(--t8-dark-soft) !important;
  background: transparent !important;
  padding: 0 !important;
  flex-shrink: 0;
  text-align: right !important;
}

/* Aktiv item — ALL current → dark pill som default */
.t8-cat-page__sidebar [class*="iks-menu"] [class*="current"] > a,
.t8-cat-page__sidebar [class*="iks-menu"] [class*="active"] > a {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  font-weight: 600 !important;
}
.t8-cat-page__sidebar [class*="iks-menu"] [class*="current"] > a [class*="count"] {
  color: rgba(255,255,255,0.7) !important;
}

/* Nested ul — sub-cats indenterade */
.t8-cat-page__sidebar [class*="iks-menu"] ul ul,
.t8-cat-page__sidebar [class*="iks-menu"] [class*="children"] {
  padding-left: 14px !important;
  border-left: 1px solid var(--t8-border) !important;
  border-top: none !important;
  border-right: none !important;
  border-bottom: none !important;
  margin: 4px 0 4px 14px !important;
  background: transparent !important;
}
.t8-cat-page__sidebar [class*="iks-menu"] ul ul a,
.t8-cat-page__sidebar [class*="iks-menu"] [class*="children"] a {
  font-size: 13px !important;
  font-weight: 400 !important;
  padding: 8px 14px !important;
}

/* Nested current = pink text (override default dark pill) */
.t8-cat-page__sidebar [class*="iks-menu"] ul ul [class*="current"] > a,
.t8-cat-page__sidebar [class*="iks-menu"] [class*="children"] [class*="current"] > a {
  background: transparent !important;
  color: var(--t8-pink) !important;
  font-weight: 600 !important;
}
.t8-cat-page__sidebar [class*="iks-menu"] ul ul [class*="current"] > a [class*="count"],
.t8-cat-page__sidebar [class*="iks-menu"] [class*="children"] [class*="current"] > a [class*="count"] {
  color: var(--t8-pink) !important;
}

/* Toggle-knapp / chevron */
.t8-cat-page__sidebar [class*="iks-menu"] button,
.t8-cat-page__sidebar [class*="iks-menu"] [class*="toggle"] {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  background: transparent !important;
  border: none !important;
  color: var(--t8-dark-soft) !important;
  font-size: 14px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
}
.t8-cat-page__sidebar [class*="iks-menu"] [class*="current"] > button,
.t8-cat-page__sidebar [class*="iks-menu"] [class*="current"] [class*="toggle"] {
  color: var(--t8-white) !important;
}

/* ==========================================================================
   17. IKS MENU — KORREKTA SELEKTORER (iksm-prefix från plugin 1.12.7)
   Ersätter tidigare gissningar. Klassmönster:
     .iksm-term — individuell kategori
     .iksm-term__link — <a>
     .iksm-term__text — kategorinamn span
     .iksm-term__posts-count / __posts-count__text — räknare
     .iksm-term__toggle — chevron-knapp (div, ej button)
     .iksm-term--current — aktiv kategori
     .iksm-term--expanded — top-level vars children är öppnade (= parent of current)
     .iksm-terms-tree--children — sub-list-wrapper
   ========================================================================== */

/* Reset */
.t8-cat-page__sidebar .iksm-container,
.t8-cat-page__sidebar .iksm-terms,
.t8-cat-page__sidebar .iksm-terms-tree,
.t8-cat-page__sidebar .iksm-terms-tree__inner {
  list-style: none;
  padding: 0;
  margin: 0;
  background: transparent;
  border: none;
}

/* Term-container */
.t8-cat-page__sidebar .iksm-term {
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  min-height: 0;
}
.t8-cat-page__sidebar .iksm-term__inner {
  position: relative;
  display: flex;
  align-items: center;
  background: transparent;
}

/* Länk (<a>) — flex med space-between, text vänster, count höger */
.t8-cat-page__sidebar .iksm-term__link {
  display: flex;
  align-items: center;
  flex: 1 1 auto;
  gap: 5px;
  padding: 10px 14px !important;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--t8-dark);
  text-decoration: none;
  border-radius: 8px;
  line-height: 1.3;
  text-align: left;
  transition: background 0.15s, color 0.15s;
}
.t8-cat-page__sidebar .iksm-term__link:hover {
  background: var(--t8-light-warm);
  color: var(--t8-dark);
}

/* Kategori-namn — fyller bredden så count kan pushas höger */
.t8-cat-page__sidebar .iksm-term__text {
  flex: 1 1 auto;
  text-align: left;
  font: inherit;
  color: inherit;
}

/* Räknare — mono, dämpad, höger-aligned */
.t8-cat-page__sidebar .iksm-term__posts-count {
  margin: 0 0 0 8px;
  padding: 0;
  background: transparent;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
}
.t8-cat-page__sidebar .iksm-term__posts-count__text {
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--t8-dark-soft);
  background: transparent;
  padding: 0;
}

/* Toggle-chevron */
.t8-cat-page__sidebar .iksm-term__toggle {
  width: 28px;
  height: 28px;
  min-width: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--t8-dark-soft);
  font-size: 14px;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  margin: 0 0 0 4px;
}
.t8-cat-page__sidebar .iksm-term__toggle:hover {
  color: var(--t8-dark);
}
.t8-cat-page__sidebar .iksm-term__toggle__inner {
  display: inline-flex;
  transition: transform 0.3s;
}
.t8-cat-page__sidebar .iksm-term--expanded > .iksm-term__inner > .iksm-term__toggle .iksm-term__toggle__inner {
  transform: rotate(180deg);
}

/* Dölj inline-shifts som pluginet använder för indent (vi gör det via CSS i stället) */
.t8-cat-page__sidebar .iksm-term__shifts {
  display: none;
}

/* Default current = mörk pill — bg på INNER (täcker link + toggle/chevron).
   Link och toggle blir transparenta så pillens bg syns igenom. */
.t8-cat-page__sidebar .iksm-term--current > .iksm-term__inner,
.t8-cat-page__sidebar .iksm-term--expanded > .iksm-term__inner {
  background: var(--t8-dark);
  border-radius: 8px;
}
.t8-cat-page__sidebar .iksm-term--current > .iksm-term__inner > .iksm-term__link,
.t8-cat-page__sidebar .iksm-term--expanded > .iksm-term__inner > .iksm-term__link {
  background: transparent;
  color: var(--t8-white);
  font-weight: 600;
}
.t8-cat-page__sidebar .iksm-term--current > .iksm-term__inner > .iksm-term__link .iksm-term__posts-count__text,
.t8-cat-page__sidebar .iksm-term--expanded > .iksm-term__inner > .iksm-term__link .iksm-term__posts-count__text {
  color: rgba(255,255,255,0.7);
}
.t8-cat-page__sidebar .iksm-term--current > .iksm-term__inner > .iksm-term__toggle,
.t8-cat-page__sidebar .iksm-term--expanded > .iksm-term__inner > .iksm-term__toggle {
  color: var(--t8-white);
}

/* Children-list — indenterad med vänster-linje.
   OBS: rör inte display — pluginets JS togglar inline style="display: none|block"
   för slide-funktionen. !important på display skulle frysa läget. */
.t8-cat-page__sidebar .iksm-terms-tree--children {
  padding-left: 14px;
  border-left: 1px solid var(--t8-border);
  margin: 4px 0 4px 14px;
  background: transparent;
}

/* Child-term — mindre font */
.t8-cat-page__sidebar .iksm-term--child .iksm-term__link {
  font-size: 13px;
  font-weight: 400;
  padding: 7px 14px;
  border-radius: 6px;
}

/* Aktivt child (current) = pink text, transparent bg.
   Måste explicit overrida default current-rule som sätter bg på inner. */
.t8-cat-page__sidebar .iksm-terms-tree--children .iksm-term--current > .iksm-term__inner {
  background: transparent;
}
.t8-cat-page__sidebar .iksm-terms-tree--children .iksm-term--current > .iksm-term__inner > .iksm-term__link {
  background: transparent;
  color: var(--t8-pink);
  font-weight: 600;
}
.t8-cat-page__sidebar .iksm-terms-tree--children .iksm-term--current > .iksm-term__inner > .iksm-term__link .iksm-term__posts-count__text {
  color: var(--t8-pink);
}
.t8-cat-page__sidebar .iksm-terms-tree--children .iksm-term--current > .iksm-term__inner > .iksm-term__link:hover {
  background: var(--t8-light-warm);
  color: var(--t8-pink);
}

/* Dölj sidopanel på tablet och mindre */
@media (max-width: 991px) {
  .t8-cat-page__sidebar {
    display: none;
  }
}

/* ==========================================================================
   18. ETIKETT — jet-engine-listing-dynamic-terms som badge top-left
   Renderas som <span class="jet-listing-dynamic-terms__link">Populär</span>
   inuti .brxe-jet-engine-listing-dynamic-terms. Stylar som dark pill.
   ========================================================================== */
.t8-product-card__media .brxe-jet-engine-listing-dynamic-terms {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 3;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  width: auto !important;
}
.t8-product-card__media .brxe-jet-engine-listing-dynamic-terms .jet-listing,
.t8-product-card__media .brxe-jet-engine-listing-dynamic-terms .jet-listing-dynamic-terms {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 0;
  margin: 0;
  background: transparent;
}
/* Term-pill */
.t8-product-card__media .brxe-jet-engine-listing-dynamic-terms .jet-listing-dynamic-terms__link,
.t8-product-card__media .brxe-jet-engine-listing-dynamic-terms a.jet-listing-dynamic-terms__link,
.t8-product-card__media .brxe-jet-engine-listing-dynamic-terms span.jet-listing-dynamic-terms__link {
  display: inline-block;
  padding: 6px 14px;
  background: var(--t8-dark);
  color: var(--t8-white);
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 700;
  border-radius: 999px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  pointer-events: none;
  line-height: 1.2;
}

/* Säkerställ att media har position: relative i row-layouten också,
   så absoluta children (wishlist + etikett) ankrar mot media-rutan */
.t8-product-card--row .t8-product-card__media {
  position: relative !important;
}

/* ==========================================================================
   19. SINGLE PRODUCT PAGE (.t8-spp)
   Tva-kolumn: galleri + info, accordion full-bredd nedanfor.
   Stockchip stylas EJ (kommer fran annat hall per Jennys instruktion).
   ========================================================================== */
.t8-spp {
  background: var(--t8-white);
}

.t8-spp__crumbs {
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark-soft);
}
.t8-spp__crumbs a {
  color: var(--t8-dark-soft);
  text-decoration: none;
}
.t8-spp__crumbs a:hover { color: var(--t8-pink); }

.t8-spp__layout {
  align-items: start;
}

/* ----- Galleri-spalt ----- */
.t8-spp__gallery {
  position: relative;
}
.t8-spp__gallery > .brxe-shortcode {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 5;
}
.t8-spp__gallery > .brxe-jet-engine-listing-dynamic-terms {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 5;
}

.t8-spp__gallery .brxe-woocommerce-product-gallery {
  background: var(--t8-light);
  border-radius: 16px;
  overflow: hidden;
}
.t8-spp__gallery .flex-viewport,
.t8-spp__gallery .woocommerce-product-gallery__image {
  background: var(--t8-light);
}
.t8-spp__gallery .woocommerce-product-gallery__image img {
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

.t8-spp__gallery .flex-control-thumbs {
  display: flex;
  gap: 8px;
  margin: 12px 0 0 0;
  padding: 0;
  list-style: none;
  flex-wrap: wrap;
}
.t8-spp__gallery .flex-control-thumbs li {
  margin: 0;
  flex: 0 0 calc(20% - 7px);
  max-width: calc(20% - 7px);
}
.t8-spp__gallery .flex-control-thumbs img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: var(--t8-light);
  border: 1px solid var(--t8-border);
  border-radius: 8px;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.15s, border-color 0.15s;
}
.t8-spp__gallery .flex-control-thumbs img:hover {
  opacity: 1;
}
.t8-spp__gallery .flex-control-thumbs img.flex-active {
  opacity: 1;
  border-color: var(--t8-dark);
}

/* ----- Info-spalt ----- */
.t8-spp__info {
  min-width: 0;
}

.t8-spp__brand {
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--t8-dark-soft) !important;
  margin: 0 !important;
}

.t8-spp__title {
  font-family: var(--t8-font-body) !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}
@media (max-width: 991px) {
  .t8-spp__title { font-size: 26px !important; }
}

.t8-spp__articles {
  font-family: var(--t8-font-body);
  font-size: 12px;
  color: var(--t8-dark-soft);
}
.t8-spp__articles span,
.t8-spp__articles div {
  color: var(--t8-dark-soft) !important;
}

.t8-spp__divider {
  margin: 8px 0 !important;
}
.t8-spp__divider .line {
  background: var(--t8-border) !important;
  height: 1px !important;
}

.t8-spp .t8-spp__price.brxe-product-price,
.t8-spp .t8-spp__price .price,
.t8-spp .t8-spp__price .woocommerce-Price-amount {
  font-family: var(--t8-font-body) !important;
  font-size: 32px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  line-height: 1 !important;
  margin: 0 !important;
}
.t8-spp .t8-spp__price del {
  font-size: 18px;
  color: var(--t8-dark-soft);
  opacity: 0.6;
}
.t8-spp .t8-spp__price ins {
  text-decoration: none;
  background: none;
}

.t8-spp__price-note {
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  color: var(--t8-dark-soft) !important;
  margin: 0 !important;
}

.t8-spp__cart {
  margin-top: 4px;
}
.t8-spp__cart form.cart {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.t8-spp__cart .quantity {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  padding: 4px;
  background: var(--t8-white);
}
.t8-spp__cart .quantity input.qty {
  width: 44px;
  text-align: center;
  border: none;
  background: transparent;
  font-family: var(--t8-font-body);
  font-size: 15px;
  font-weight: 600;
  color: var(--t8-dark);
  -moz-appearance: textfield;
}
.t8-spp__cart .quantity input.qty::-webkit-outer-spin-button,
.t8-spp__cart .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.t8-spp__cart .quantity button,
.t8-spp__cart .quantity .plus,
.t8-spp__cart .quantity .minus {
  width: 32px;
  height: 32px;
  background: transparent;
  border: none;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 600;
  color: var(--t8-dark);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.t8-spp__cart .quantity button:hover,
.t8-spp__cart .quantity .plus:hover,
.t8-spp__cart .quantity .minus:hover {
  background: var(--t8-light);
}

.t8-spp__cart .single_add_to_cart_button,
.t8-spp__cart button[name="add-to-cart"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 48px !important;
  padding: 12px 24px !important;
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 999px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  text-decoration: none !important;
}
.t8-spp__cart .single_add_to_cart_button:hover {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-dark) !important;
}
.t8-spp__cart .single_add_to_cart_button::before {
  content: "\ec18";
  font-family: 'team8' !important;
  font-size: 18px;
  line-height: 1;
}

/* ----- Feature-grid (Fri frakt, garanti, support, oppet kop) ----- */
.t8-spp__features {
  border-top: 1px solid var(--t8-border);
  padding-top: 24px !important;
}
.t8-spp__feature {
  display: flex;
  align-items: flex-start;
  gap: 14px;
}
.t8-spp__feature i {
  font-size: 22px;
  line-height: 1;
  color: var(--t8-dark);
  flex-shrink: 0;
  margin-top: 2px;
}
.t8-spp__feature-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.t8-spp__feature-title {
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--t8-dark);
  line-height: 1.2;
}
.t8-spp__feature-sub {
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark-soft);
  line-height: 1.3;
}

/* ----- Accordion (full bredd nedanfor grid) ----- */
.t8-spp__accordion {
  margin-top: 16px;
}
.t8-spp__accordion .brxe-accordion-item,
.t8-spp__accordion .accordion-item {
  border-bottom: 1px solid var(--t8-border) !important;
  background: transparent !important;
  margin: 0 !important;
  padding: 0 !important;
}
.t8-spp__accordion .accordion-title-wrapper,
.t8-spp__accordion .brxe-accordion-item__title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 24px 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  cursor: pointer;
  background: transparent !important;
  border: none !important;
  letter-spacing: -0.005em;
}
.t8-spp__accordion .accordion-title-wrapper:hover,
.t8-spp__accordion .brxe-accordion-item__title:hover {
  color: var(--t8-pink) !important;
}
.t8-spp__accordion .accordion-title-icon,
.t8-spp__accordion .brxe-accordion-item__icon {
  width: 36px;
  height: 36px;
  background: var(--t8-dark);
  color: var(--t8-white);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
  transition: transform 0.2s;
}
.t8-spp__accordion .accordion-content-wrapper,
.t8-spp__accordion .brxe-accordion-item__content {
  padding: 0 8px 24px 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 15px !important;
  color: var(--t8-dark) !important;
  line-height: 1.6 !important;
  background: transparent !important;
}
.t8-spp__accordion .accordion-content-wrapper p {
  margin: 0 0 12px 0;
}
.t8-spp__accordion .accordion-content-wrapper p:last-child {
  margin-bottom: 0;
}


/* ==========================================================================
   SPP — fixar enligt feedback (2026-05)
   ========================================================================== */

/* 1. Wishlist i info-spalten — absolut top-right, i linje med brand */
.t8-spp__info {
  position: relative;
}
.t8-spp__info > .brxe-shortcode:has(.tinv-wraper),
.t8-spp__info > .brxe-shortcode:has(.tinvwl_add_to_wishlist_button) {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  z-index: 5;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* 2. Grå ring runt feature-ikoner */
.t8-spp__feature i {
  width: 44px !important;
  height: 44px !important;
  background: var(--t8-light) !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 20px !important;
  color: var(--t8-dark) !important;
  flex-shrink: 0 !important;
  margin-top: 0 !important;
}
.t8-spp__feature {
  align-items: center !important;
}

/* 3. Enhetliga linjer — alla samma ljusgrå */
.t8-spp__divider,
.t8-spp__divider hr,
.t8-spp__divider .line,
.t8-spp__divider::before,
.t8-spp__divider::after {
  background: var(--t8-border) !important;
  border: none !important;
  border-top: none !important;
  height: 1px !important;
  margin: 8px 0 !important;
}
.t8-spp__divider .line {
  width: 100% !important;
  height: 1px !important;
}
/* Ta bort features border-top — dividern ovan sköter separationen */
.t8-spp__features {
  border-top: none !important;
  padding-top: 8px !important;
}

/* 4. Lägg i varukorg — mörk default, pink hover */
.t8-spp__cart .single_add_to_cart_button,
.t8-spp__cart button[name="add-to-cart"] {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-dark) !important;
}
.t8-spp__cart .single_add_to_cart_button:hover,
.t8-spp__cart button[name="add-to-cart"]:hover {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-pink) !important;
}
.t8-spp__cart .single_add_to_cart_button::before {
  color: var(--t8-white);
}

/* 5. Accordion toggle — alltid synlig ikon via ::after på title */
.t8-spp__accordion .accordion-title-wrapper,
.t8-spp__accordion .brxe-accordion-item__title,
.t8-spp__accordion details summary {
  position: relative;
  padding-right: 56px !important;
}
.t8-spp__accordion .accordion-title-wrapper::after,
.t8-spp__accordion .brxe-accordion-item__title::after,
.t8-spp__accordion details summary::after {
  content: "+";
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 36px;
  height: 36px;
  background: var(--t8-dark);
  color: var(--t8-white);
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--t8-font-body);
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
  transition: background 0.2s, transform 0.2s;
}
/* Aktivt/expanderat state — minus istället för plus */
.t8-spp__accordion .brxe-accordion-item.active .accordion-title-wrapper::after,
.t8-spp__accordion .brxe-accordion-item.brx-open .brxe-accordion-item__title::after,
.t8-spp__accordion .accordion-title-wrapper[aria-expanded="true"]::after,
.t8-spp__accordion details[open] summary::after {
  content: "−";
  background: var(--t8-pink);
}
/* Dölj eventuell native Bricks-ikon eftersom vi använder vår ::after */
.t8-spp__accordion .accordion-title-icon,
.t8-spp__accordion .brxe-accordion-item__icon {
  display: none !important;
}


/* ==========================================================================
   SPP ACCORDION-NESTED — Bricks nestable accordion
   Items har egen accordion-title-wrapper + accordion-content-wrapper-blocks.
   Toggle-ikon ar en riktig Bricks icon-element som vi roterar via CSS.
   ========================================================================== */

.t8-spp .brxe-accordion-nested {
  margin-top: 16px;
}

/* Varje accordion-item — border-bottom som separator */
.t8-spp .brxe-accordion-nested > .brxe-block {
  border-bottom: 1px solid var(--t8-border) !important;
  padding: 0 !important;
  background: transparent !important;
  margin: 0 !important;
}
.t8-spp .brxe-accordion-nested > .brxe-block:last-child {
  border-bottom: none !important;
}

/* Title-wrapper (heading + ikon) — klickbar */
.t8-spp .brxe-accordion-nested .accordion-title-wrapper {
  padding: 22px 8px !important;
  cursor: pointer;
  background: transparent !important;
  border: none !important;
  transition: color 0.15s;
}
.t8-spp .brxe-accordion-nested .accordion-title-wrapper h3,
.t8-spp .brxe-accordion-nested .accordion-title-wrapper h2,
.t8-spp .brxe-accordion-nested .accordion-title-wrapper h4 {
  font-family: var(--t8-font-body) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  transition: color 0.15s;
}
.t8-spp .brxe-accordion-nested .accordion-title-wrapper:hover h3,
.t8-spp .brxe-accordion-nested .accordion-title-wrapper:hover h2,
.t8-spp .brxe-accordion-nested .accordion-title-wrapper:hover h4 {
  color: var(--t8-pink) !important;
}

/* Ikonen (ion-ios-arrow-forward eller liknande) — rotera vid open */
.t8-spp .brxe-accordion-nested .accordion-title-wrapper .brxe-icon,
.t8-spp .brxe-accordion-nested .accordion-title-wrapper [class*="isAccordionIcon"] {
  color: var(--t8-dark);
  font-size: 18px;
  transition: transform 0.25s, color 0.15s;
  flex-shrink: 0;
}
.t8-spp .brxe-accordion-nested .accordion-title-wrapper:hover .brxe-icon {
  color: var(--t8-pink);
}

/* Roteringen — flera fallback-selektorer for olika Bricks-versioner */
.t8-spp .brxe-accordion-nested > .brxe-block.brx-open .accordion-title-wrapper .brxe-icon,
.t8-spp .brxe-accordion-nested > .brxe-block.active .accordion-title-wrapper .brxe-icon,
.t8-spp .brxe-accordion-nested > .brxe-block[aria-expanded="true"] .accordion-title-wrapper .brxe-icon,
.t8-spp .brxe-accordion-nested .accordion-title-wrapper[aria-expanded="true"] .brxe-icon {
  transform: rotate(90deg);
  color: var(--t8-pink);
}

/* Content-wrapper — body-font med generos line-height */
.t8-spp .brxe-accordion-nested .accordion-content-wrapper {
  padding: 0 8px 24px 8px !important;
  background: transparent !important;
  font-family: var(--t8-font-body);
  font-size: 15px;
  color: var(--t8-dark);
  line-height: 1.6;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper p {
  margin: 0 0 12px 0;
  font-family: var(--t8-font-body);
  font-size: 15px;
  color: var(--t8-dark);
  line-height: 1.6;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper p:last-child {
  margin-bottom: 0;
}

/* WC product attributes-tabell inuti Specifikationer */
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--t8-font-body);
  font-size: 14px;
  margin: 0;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes tr,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes tr {
  border-bottom: 1px solid var(--t8-border);
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes tr:last-child,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes tr:last-child {
  border-bottom: none;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes th,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes th {
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--t8-dark-soft) !important;
  text-align: left !important;
  padding: 12px 16px 12px 0 !important;
  width: 35%;
  vertical-align: top;
  background: transparent !important;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes td,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes td {
  padding: 12px 0 !important;
  color: var(--t8-dark) !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  background: transparent !important;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes p,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes p {
  margin: 0;
}


/* Hover på spec-tabellrader */
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes tr,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes tr {
  transition: background 0.15s;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes tr:hover,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes tr:hover {
  background: var(--t8-light-warm) !important;
}
/* Padding-shift på hover borttagen — bara bg-färgskifte räcker */

/* Dölj "Ytterligare information"-rubriken som WC injicerar i Bricks
   woocommerce-product-additional-information-element. Stark override. */
.brxe-product-additional-information h2,
.brxe-product-additional-information > h2,
.t8-spp .brxe-product-additional-information h2,
.t8-spp .brxe-accordion-nested .brxe-product-additional-information h2 {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  font-size: 0 !important;
}

/* Mindre text i accordion-content (specifikationsvärden m.fl.) */
.t8-spp .brxe-accordion-nested .accordion-content-wrapper p,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper td p {
  font-size: 13px !important;
  margin: 0 !important;
}
.t8-spp .brxe-accordion-nested .accordion-content-wrapper .woocommerce-product-attributes td,
.t8-spp .brxe-accordion-nested .accordion-content-wrapper table.shop_attributes td {
  font-size: 13px !important;
}
/* ==========================================================================
   SPP — fixar
   ========================================================================== */

/* Tvinga flex row pa block som innehaller brand + wishlist (sa wishlist
   hamnar till hoger via space-between) */
.t8-spp__info .brxe-block:has(.tinvwl_add_to_wishlist_button) {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px;
}

/* Wishlist-wrapper i SPP – placera ikonen höger */
.t8-spp .tinv-wraper.tinv-wishlist {
  font-size: 100%;
  text-align: right;
  padding: 20px 20px 0 0;
}

/* Wishlist-knapp i SPP — vit cirkel med shadow, team8-iconheart */
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button,
.t8-spp .tinv-wraper a.tinvwl_add_to_wishlist_button,
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button.tinvwl-icon-heart,
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button.tinvwl-icon-heart.no-txt {
  width: auto !important;
  height: auto !important;
  background: #fff !important;
  border: 0px solid #ccc !important;
  border-radius: 50% !important;
  padding: 13px !important;
  box-shadow: 0 0px 5px rgb(37 50 58 / 20%) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  color: var(--t8-dark);
  position: relative;
  font-size: 0;
  text-decoration: none !important;
  margin: 0 !important;
  vertical-align: middle !important;
}

/* team8-iconheart via ::before */
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button::before {
  content: "\eab9" !important;
  font-family: 'team8' !important;
  font-size: 16px !important;
  font-weight: normal !important;
  color: inherit;
  padding: 2px;
  line-height: 1;
}

/* Dolj pluginets egen ikon/text */
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button > i,
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button > svg,
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button .ftinvwl,
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button > span,
.t8-spp .tinv-wraper .tinvwl-txt {
  display: none !important;
}

/* Aktiv state — pink fyllning, vit ikon */
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button.tinvwl-product-in-list,
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button.tinvwl-product-make-remove {
  background: var(--t8-pink) !important;
}
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button.tinvwl-product-in-list::before,
.t8-spp .tinv-wraper .tinvwl_add_to_wishlist_button.tinvwl-product-make-remove::before {
  color: #fff !important;
}

/* Override WC/Bricks default som lagger margin-top pa knappen efter quantity */
.t8-spp form.cart .quantity + button,
.t8-spp form.cart .quantity + .button,
.t8-spp form.cart .quantity + .single_add_to_cart_button,
.t8-spp .t8-spp__cart form.cart .quantity + button,
.t8-spp .t8-spp__cart form.cart .quantity + .button {
  margin-top: 0 !important;
}


/* ==========================================================================
   SIDBAKGRUND + VITA CONTENT-KORT
   ========================================================================== */

/* --- 1. Brand-rad full bredd sa hjartat hamnar langst till hoger --- */
.t8-spp__info .brxe-block:has(.tinvwl_add_to_wishlist_button) {
  width: 100% !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px;
}

/* --- 2. Sektionsbakgrund pa SPP och kategorisida --- */
.t8-spp {
  background: var(--t8-light) !important;
}
.t8-cat-page {
  background: var(--t8-light) !important;
}

/* --- 3. SPP — vita content-kort --- */
.t8-spp__gallery {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 24px;
}
.t8-spp__gallery .brxe-woocommerce-product-gallery {
  background: transparent !important;
}

.t8-spp__info {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 32px;
}

.t8-spp .brxe-accordion-nested {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 8px 32px;
}

/* --- 4. Kategorisida — vita content-block (filter ar redan vita kort) --- */
.t8-cat-page__sort-row {
  background: transparent;
  border: none !important;
  border-radius: 12px;
  padding: 16px 0px !important;
}
.t8-cat-page__active-filters {
  background: var(--t8-white);
  border-radius: 12px;
  padding: 12px 20px;
}
.t8-cat-page__listing,
.t8-cat-page__content .brxe-jet-engine-listing-grid {
  background: transparent;
}
/* Titel och beskrivning kan ligga direkt pa ljusgra bg (eller paddra in dem
   i ett vitt kort om du foredrar — sag till) */


/* ==========================================================================
   1. Dolj tom aktiva-filter-rad (vit strip om inga filter valda)
   ========================================================================== */
.t8-cat-page__active-filters:not(:has(.jet-active-filters__item)):not(:has(.jet-smart-filters-active__item)):not(:has([class*="jet-filter-row"])) {
  display: none !important;
}

/* ==========================================================================
   2. Kategori-beskrivning — full bredd istallet for 560px-max
   ========================================================================== */
.t8-cat-page__desc {
  max-width: none !important;
}

/* ==========================================================================
   3. Vit bg bakom kategorimenyn (sidopanel-wrapper)
   ========================================================================== */
.t8-cat-page__sidebar {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 24px;
}
/* Filtren inuti behover inte egen vit bg langre — bara avskiljare */
.t8-cat-page__sidebar .jet-smart-filters-radio.jet-filter,
.t8-cat-page__sidebar .jet-smart-filters-checkboxes.jet-filter {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
  border-radius: 0 !important;
  padding-bottom: 16px !important;
  margin-bottom: 4px !important;
}
.t8-cat-page__sidebar .jet-smart-filters-radio.jet-filter:last-child,
.t8-cat-page__sidebar .jet-smart-filters-checkboxes.jet-filter:last-child {
  border-bottom: none !important;
}

/* ==========================================================================
   5. Sticky galleri pa SPP (#5 forst eftersom det ar enklast)
   Sticky funkar bara om grid-item har align-self: start (annars stretchar
   det till hela rad-hojden och sticky har ingen att rulla forbi).
   ========================================================================== */
.t8-spp__layout > .t8-spp__gallery,
.t8-spp__gallery {
  position: sticky !important;
  top: 24px !important;
  align-self: start !important;
}
@media (max-width: 991px) {
  /* Pa mindre skarmar — ingen sticky, normal flow */
  .t8-spp__layout > .t8-spp__gallery,
  .t8-spp__gallery {
    position: static !important;
  }
}

/* ==========================================================================
   SPP — splittra info-spalt i sub-cards
   .t8-spp__info blir transparent. Varje direkt block/div-barn blir ett
   eget vitt kort. Standalone dividers doljs (kort-spacingen separerar dem).
   ========================================================================== */
.t8-spp__info {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

.t8-spp__info > .brxe-block,
.t8-spp__info > .brxe-div,
.t8-spp__info > div:not(.brxe-divider) {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 24px;
}

/* Features-grid behaller sin grid-layout men far card-bg */
.t8-spp__info > .t8-spp__features {
  background: var(--t8-white) !important;
  border-radius: 16px !important;
  padding: 24px !important;
  border-top: none !important;
  margin: 0 !important;
}

/* Dolj standalone dividers i info-spalten — korten har egen separation */
.t8-spp__info > .brxe-divider {
  display: none !important;
}

/* ==========================================================================
   SPP — tvinga alla blocks i info-spalten till full bredd
   sa flex-rad (brand+wishlist, pris+cost) kan ranka kor space-between
   ========================================================================== */
.t8-spp__info .brxe-block,
.t8-spp__info > .brxe-div > .brxe-block,
.t8-spp__info > .brxe-block,
.t8-spp__info .brxe-div > .brxe-block {
  width: 100% !important;
}

/* ==========================================================================
   SPP — final fixes
   ========================================================================== */

/* 1. Tvinga card-wrappers (rbndzr, rptkrq, dtukqa) till flex column stretch
   sa inre blocks (speelc, astgaj) far full bredd och flex space-between
   kan trycka isar brand/wishlist resp. pris/cost. */
.t8-spp__info > .brxe-div:not(.t8-spp__features),
.t8-spp__info > .brxe-block:not(.t8-spp__features) {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 12px;
}

/* 2. Brand-row block specifikt — flex row, space-between, full bredd */
.t8-spp__info .brxe-block:has(.tinvwl_add_to_wishlist_button) {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
  gap: 12px;
}

/* 3. Fallback — margin-left auto pa shortcode-wrappern runt wishlist
   sa hjartat hamnar till hoger aven om flex space-between inte fungerar */
.t8-spp__info .brxe-block .brxe-shortcode:has(.tinvwl_add_to_wishlist_button),
.t8-spp__info .brxe-block:has(> .brxe-shortcode > .tinv-wraper) > .brxe-shortcode:last-child {
  margin-left: auto !important;
}

/* 4. Sticky galleri — forstark med height: fit-content + align-self */
.t8-spp__gallery,
.t8-spp__layout > .t8-spp__gallery {
  position: sticky !important;
  top: 24px !important;
  align-self: flex-start !important;
  height: fit-content !important;
}
@media (max-width: 991px) {
  .t8-spp__gallery,
  .t8-spp__layout > .t8-spp__gallery {
    position: static !important;
    height: auto !important;
  }
}

/* ==========================================================================
   KATEGORISIDA — sidopanel-layout
   ========================================================================== */

/* 1. Grid 25/75 (i fraktionsenheter sa gapet inte spranger) */
.t8-cat-page__layout {
  grid-template-columns: 1fr 3fr !important;
}
@media (max-width: 991px) {
  .t8-cat-page__layout {
    grid-template-columns: 1fr !important;
  }
}

/* 2. Sidebar — INTE en stor vit kort. Transparent wrapper. */
.t8-cat-page__sidebar {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* 3. ENBART menu-sektionen far vit bg (forsta sidebar-section, eller den
   som innehaller .t8-cat-page__cat-menu) */
.t8-cat-page__sidebar > .t8-cat-page__sidebar-section:first-of-type,
.t8-cat-page__sidebar > .t8-cat-page__sidebar-section:has(.t8-cat-page__cat-menu) {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 20px;
}

/* 4. Restore filter-card-styling (varje filter ar eget kort) */
.t8-cat-page__sidebar .jet-smart-filters-radio.jet-filter,
.t8-cat-page__sidebar .jet-smart-filters-checkboxes.jet-filter,
.brxe-jet-smart-filters-radio .jet-smart-filters-radio.jet-filter {
  background: var(--t8-white) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  margin-bottom: 0 !important;
}

/* ==========================================================================
   20. KONTAKTSIDA (.t8-kontakt)
   ========================================================================== */
.t8-kontakt {
  background: var(--t8-light);
}

.t8-kontakt__grid {
  align-items: stretch;
}

/* Vita kort */
.t8-kontakt__card {
  background: var(--t8-white);
  border-radius: 20px;
  padding: 40px;
}
@media (max-width: 991px) {
  .t8-kontakt__card { padding: 28px; }
}

/* Ikon-cirkel overst i kortet */
.t8-kontakt__icon {
  width: 56px;
  height: 56px;
  background: var(--t8-light);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--t8-dark);
  margin-bottom: 4px;
}
.t8-kontakt__icon i {
  font-size: 24px;
  line-height: 1;
}

/* Kort-rubrik */
.t8-kontakt__card-title {
  font-family: var(--t8-font-body) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

.t8-kontakt__card-desc {
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark-soft);
  margin: 0 0 8px 0;
  line-height: 1.4;
}

/* Rader (label vanster, varde hoger) */
.t8-kontakt__row {
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--t8-border);
  margin: 0 !important;
}
.t8-kontakt__card .t8-kontakt__row:last-child {
  border-bottom: none;
  padding-bottom: 0 !important;
}
.t8-kontakt__card .t8-kontakt__row:first-of-type {
  border-top: 1px solid var(--t8-border);
}

.t8-kontakt__row-label {
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--t8-dark-soft) !important;
  padding: 0 10px 0 0 !important;
}

.t8-kontakt__row-value {
  font-family: var(--t8-font-body) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  text-decoration: none !important;
  transition: color 0.15s;
}
.t8-kontakt__row-value:hover {
  color: var(--t8-pink) !important;
}

/* ==========================================================================
   21. MINA PRODUKTER-SIDA (.t8-mina)
   Hero + tva vita kort: Utvalda produkter + Favoriter (med wishlist-tabell)
   ========================================================================== */
.t8-mina {
  background: var(--t8-light);
}

.t8-mina__card {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 40px;
}
@media (max-width: 767px) {
  .t8-mina__card { padding: 24px; }
}

.t8-mina__card-title {
  font-family: var(--t8-font-body) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

.t8-mina__card-desc {
  font-family: var(--t8-font-body);
  font-size: 15px;
  color: var(--t8-dark);
  line-height: 1.6;
  margin: 0;
  max-width: 720px;
}
.t8-mina__card-desc a {
  color: var(--t8-pink);
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ---- TI Wishlist-tabell i Favoriter-kortet ---- */
.t8-mina__card .tinv-wishlist {
  background: transparent;
  margin: 0;
  padding: 0;
}
.t8-mina__card .tinv-header {
  margin: 0 0 16px 0;
}
.t8-mina__card .tinv-header h2 {
  font-family: var(--t8-font-body) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

.t8-mina__card .tinvwl-table-manage-list {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--t8-font-body);
}
.t8-mina__card .tinvwl-table-manage-list thead th {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t8-dark-soft);
  padding: 12px 8px;
  border-bottom: 1px solid var(--t8-border);
  text-align: left;
  background: transparent;
}
.t8-mina__card .tinvwl-table-manage-list tbody tr {
  border-bottom: 1px solid var(--t8-border);
  transition: background 0.15s;
}
.t8-mina__card .tinvwl-table-manage-list tbody tr:hover {
  background: var(--t8-light-warm);
}
.t8-mina__card .tinvwl-table-manage-list tbody tr:last-child {
  border-bottom: none;
}
.t8-mina__card .tinvwl-table-manage-list tbody td {
  padding: 16px 8px;
  vertical-align: middle;
  background: transparent;
}

/* Thumbnail */
.t8-mina__card .tinvwl-table-manage-list .product-thumbnail img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  border-radius: 8px;
  background: var(--t8-light);
  display: block;
}

/* Produktnamn */
.t8-mina__card .tinvwl-table-manage-list .product-name a {
  font-family: var(--t8-font-body);
  font-weight: 500;
  font-size: 14px;
  color: var(--t8-dark);
  text-decoration: none;
  transition: color 0.15s;
}
.t8-mina__card .tinvwl-table-manage-list .product-name a:hover {
  color: var(--t8-pink);
}

/* Pris */
.t8-mina__card .tinvwl-table-manage-list .product-price,
.t8-mina__card .tinvwl-table-manage-list .product-price .woocommerce-Price-amount {
  font-family: var(--t8-font-body);
  font-weight: 600;
  font-size: 14px;
  color: var(--t8-dark);
}

/* Checkboxes */
.t8-mina__card .tinvwl-table-manage-list input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: var(--t8-pink);
  margin: 0;
}

/* Radera-knapp (round outline) */
.t8-mina__card .tinvwl-table-manage-list .product-remove button {
  background: transparent;
  border: 1px solid var(--t8-border);
  border-radius: 50%;
  width: 32px;
  height: 32px;
  color: var(--t8-dark-soft);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.t8-mina__card .tinvwl-table-manage-list .product-remove button:hover {
  background: var(--t8-pink);
  color: var(--t8-white);
  border-color: var(--t8-pink);
}
.t8-mina__card .tinvwl-table-manage-list .product-remove button i {
  font-size: 12px;
}

/* Dölj action-kolumnen, checkbox-kolumnen och tfoot i önskelistan */
.tinvwl-table-manage-list th.product-action,
.tinvwl-table-manage-list td.product-action,
.tinvwl-table-manage-list th.product-cb,
.tinvwl-table-manage-list td.product-cb,
.tinvwl-table-manage-list tfoot {
  display: none !important;
}

/* Action-knapp i raden */
.t8-mina__card .tinvwl-table-manage-list .product-action .button,
.t8-mina__card .tinvwl-table-manage-list .product-action button.button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: var(--t8-white);
  color: var(--t8-dark);
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
.t8-mina__card .tinvwl-table-manage-list .product-action .button:hover {
  background: var(--t8-dark);
  color: var(--t8-white);
  border-color: var(--t8-dark);
}
.t8-mina__card .tinvwl-table-manage-list .product-action .button.alt {
  background: var(--t8-dark);
  color: var(--t8-white);
  border-color: var(--t8-dark);
}
.t8-mina__card .tinvwl-table-manage-list .product-action .button.alt:hover {
  background: var(--t8-pink);
  border-color: var(--t8-pink);
}
.t8-mina__card .tinvwl-table-manage-list .product-action .button.alt i {
  margin-right: 4px;
}

/* Ring salj (out-of-stock) — ljusgra dampad (samma som listing) */
.t8-mina__card .tinvwl-table-manage-list .product-action .button.ring-salj,
.t8-mina__card .tinvwl-table-manage-list .product-action a.ring-salj {
  background: var(--t8-light);
  color: var(--t8-dark-soft);
  border-color: var(--t8-border);
}
.t8-mina__card .tinvwl-table-manage-list .product-action .button.ring-salj:hover {
  background: var(--t8-border);
  color: var(--t8-dark);
  border-color: var(--t8-dark-soft);
}

/* Bulk-actions i tfoot */
.t8-mina__card .tinvwl-table-manage-list tfoot td {
  padding: 24px 0 0 0;
  border-top: 1px solid var(--t8-border);
}
.t8-mina__card .tinvwl-table-manage-list tfoot .tinvwl-to-right {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.t8-mina__card .tinvwl-table-manage-list tfoot .tinvwl-to-right .button {
  background: var(--t8-dark);
  color: var(--t8-white);
  border: none;
  padding: 12px 24px;
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.t8-mina__card .tinvwl-table-manage-list tfoot .tinvwl-to-right .button:hover {
  background: var(--t8-pink);
}

/* Tom favoritlista-state */
.t8-mina__card .tinv-wishlist-empty {
  text-align: center;
  padding: 40px 20px;
  font-family: var(--t8-font-body);
  color: var(--t8-dark-soft);
}
.t8-mina__card .tinv-wishlist-empty + .return-to-shop,
.t8-mina__card .return-to-shop {
  text-align: center;
  margin-top: 16px;
}
.t8-mina__card .return-to-shop .button,
.t8-mina__card a.wc-backward {
  display: inline-flex;
  padding: 12px 28px;
  background: var(--t8-dark);
  color: var(--t8-white);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.t8-mina__card a.wc-backward:hover {
  background: var(--t8-pink);
}

/* Mobil — dolj nagra kolumner som blir trangt */
@media (max-width: 767px) {
  .t8-mina__card .tinvwl-table-manage-list .product-cb,
  .t8-mina__card .tinvwl-table-manage-list thead .product-cb {
    display: none;
  }
  .t8-mina__card .tinvwl-table-manage-list tbody td {
    padding: 12px 4px;
  }
  .t8-mina__card .tinvwl-table-manage-list .product-thumbnail img {
    width: 48px;
    height: 48px;
  }
}

/* (Borttaget — ersatt av foundation-klasser .t8-page / .t8-wrap / .t8-card) */

/* ==========================================================================
   FOUNDATION — aterbruksklasser for fullbredd-sidor med kort
   Anvand dessa pa Bricks-block istallet for page-specifik CSS.
   ========================================================================== */

/* Yttre wrapper — ljusgra bg, responsiv padding */
.t8-page {
  background: var(--t8-light);
  padding: 40px 48px 80px 48px;
  min-height: 60vh;
}
@media (max-width: 991px) {
  .t8-page { padding: 32px 32px 60px 32px; }
}
@media (max-width: 478px) {
  .t8-page { padding: 24px 16px 40px 16px; }
}

/* Centrerad container — 1280px max */
.t8-wrap {
  max-width: 1280px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 32px !important;
}

/* Vit card */
.t8-card {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 40px;
}
@media (max-width: 767px) {
  .t8-card { padding: 24px; }
}

/* Card-rubrik (mono medium) */
.t8-card__title {
  font-family: var(--t8-font-body) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  color: var(--t8-dark) !important;
  margin: 0 0 16px 0 !important;
  line-height: 1.2 !important;
}

/* Card-beskrivning (body med pink lank-color) */
.t8-card__desc {
  font-family: var(--t8-font-body);
  font-size: 15px;
  color: var(--t8-dark);
  line-height: 1.6;
  margin: 0;
}
.t8-card__desc a {
  color: var(--t8-pink);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.t8-card__desc a:hover {
  color: var(--t8-pink-dark);
}

/* Page-titel (h1) — kan anvandas direkt eller pa rubrik-element */
.t8-page-title {
  font-family: var(--t8-font-display) !important;
  font-size: 56px !important;
  font-weight: 500 !important;
  letter-spacing: -0.02em !important;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  line-height: 1.05 !important;
}
@media (max-width: 991px) {
  .t8-page-title { font-size: 44px !important; }
}
@media (max-width: 478px) {
  .t8-page-title { font-size: 32px !important; }
}

/* Produktkort som komponerar t8-card foundation
   Override:ar t8-card:s padding sa media-omradet kan ga edge-to-edge */
.t8-card.t8-product-card,
.t8-card.t8-product-card--row {
  padding: 0 !important;
  overflow: hidden;
}

/* ==========================================================================
   Foundation: tvinga t8-wrap children att stretcha till full bredd
   ========================================================================== */
.t8-wrap {
  align-items: stretch !important;
}
.t8-wrap > * {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* ==========================================================================
   TI Wishlist — global styling (matchar foundation, ej page-bunden)
   ========================================================================== */
.t8-card .tinv-wishlist,
.t8-card .tinv-wishlist.woocommerce {
  background: transparent;
  margin: 0;
  padding: 0;
  border: none;
  width: 100%;
}
.t8-card .tinv-header {
  margin: 0 0 16px 0;
}
.t8-card .tinv-header h2 {
  font-family: var(--t8-font-body) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

.t8-card .tinvwl-table-manage-list {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--t8-font-body);
}
.t8-card .tinvwl-table-manage-list thead th {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t8-dark-soft);
  padding: 12px 8px;
  border-bottom: 1px solid var(--t8-border);
  text-align: left;
  background: transparent;
}
.t8-card .tinvwl-table-manage-list tbody tr {
  border-bottom: 1px solid var(--t8-border);
  transition: background 0.15s;
}
.t8-card .tinvwl-table-manage-list tbody tr:hover {
  background: var(--t8-light-warm);
}
.t8-card .tinvwl-table-manage-list tbody tr:last-child {
  border-bottom: none;
}
.t8-card .tinvwl-table-manage-list tbody td {
  padding: 16px 8px;
  vertical-align: middle;
  background: transparent;
}

/* Thumbnail */
.t8-card .tinvwl-table-manage-list .product-thumbnail img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  border-radius: 8px;
  background: var(--t8-light);
  display: block;
}

/* Produktnamn */
.t8-card .tinvwl-table-manage-list .product-name a {
  font-family: var(--t8-font-body);
  font-weight: 500;
  font-size: 14px;
  color: var(--t8-dark);
  text-decoration: none;
  transition: color 0.15s;
}
.t8-card .tinvwl-table-manage-list .product-name a:hover {
  color: var(--t8-pink);
}

/* Pris */
.t8-card .tinvwl-table-manage-list .product-price,
.t8-card .tinvwl-table-manage-list .product-price .woocommerce-Price-amount {
  font-family: var(--t8-font-body);
  font-weight: 600;
  font-size: 14px;
  color: var(--t8-dark);
}

/* Checkboxes */
.t8-card .tinvwl-table-manage-list input[type="checkbox"] {
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: var(--t8-pink);
  margin: 0;
}

/* Radera-knapp (round outline) */
.t8-card .tinvwl-table-manage-list .product-remove button {
  background: transparent;
  border: 1px solid var(--t8-border);
  border-radius: 50%;
  width: 32px;
  height: 32px;
  color: var(--t8-dark-soft);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.t8-card .tinvwl-table-manage-list .product-remove button:hover {
  background: var(--t8-pink);
  color: var(--t8-white);
  border-color: var(--t8-pink);
}
.t8-card .tinvwl-table-manage-list .product-remove button i {
  font-size: 12px;
}

/* Action-knapp i raden (Lås mer, Köp nu, Ring sälj) */
.t8-card .tinvwl-table-manage-list .product-action .button,
.t8-card .tinvwl-table-manage-list .product-action button.button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: var(--t8-white);
  color: var(--t8-dark);
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
.t8-card .tinvwl-table-manage-list .product-action .button:hover {
  background: var(--t8-dark);
  color: var(--t8-white);
  border-color: var(--t8-dark);
}
.t8-card .tinvwl-table-manage-list .product-action .button.alt {
  background: var(--t8-dark);
  color: var(--t8-white);
  border-color: var(--t8-dark);
}
.t8-card .tinvwl-table-manage-list .product-action .button.alt:hover {
  background: var(--t8-pink);
  border-color: var(--t8-pink);
}
.t8-card .tinvwl-table-manage-list .product-action .button.alt i {
  margin-right: 4px;
}

/* Ring salj (out-of-stock) */
.t8-card .tinvwl-table-manage-list .product-action .button.ring-salj,
.t8-card .tinvwl-table-manage-list .product-action a.ring-salj {
  background: var(--t8-light);
  color: var(--t8-dark-soft);
  border-color: var(--t8-border);
}
.t8-card .tinvwl-table-manage-list .product-action .button.ring-salj:hover {
  background: var(--t8-border);
  color: var(--t8-dark);
  border-color: var(--t8-dark-soft);
}

/* Bulk-actions i tfoot (Köp markerade, Köp alla i listan) */
.t8-card .tinvwl-table-manage-list tfoot td {
  padding: 24px 0 0 0;
  border-top: 1px solid var(--t8-border);
}
.t8-card .tinvwl-table-manage-list tfoot .tinvwl-to-right {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
  flex-wrap: wrap;
}
.t8-card .tinvwl-table-manage-list tfoot .tinvwl-to-right .button {
  background: var(--t8-dark);
  color: var(--t8-white);
  border: none;
  padding: 12px 24px;
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
}
.t8-card .tinvwl-table-manage-list tfoot .tinvwl-to-right .button:hover {
  background: var(--t8-pink);
}

/* Mobil — dolj checkbox-kolumnen */
@media (max-width: 767px) {
  .t8-card .tinvwl-table-manage-list .product-cb,
  .t8-card .tinvwl-table-manage-list thead .product-cb {
    display: none;
  }
  .t8-card .tinvwl-table-manage-list tbody td {
    padding: 12px 4px;
  }
  .t8-card .tinvwl-table-manage-list .product-thumbnail img {
    width: 48px;
    height: 48px;
  }
}

/* ==========================================================================
   JetEngine listing tom-tillstand + admin-helper-knapp
   ========================================================================== */

/* Tom-tillstand "No data was found" — styla som dampad notis */
.t8-card .jet-listing-not-found,
.t8-card .jet-listing-grid__items.jet-listing-not-found {
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark-soft);
  text-align: center;
  padding: 32px 16px;
  border: 1px dashed var(--t8-border);
  border-radius: 12px;
  margin-top: 16px;
  background: var(--t8-light-warm);
}

/* Doll JetEngine-admin-helpers pa frontend */
.jet-engine-frontend-query-editor-buttons {
  display: none !important;
}

/* ==========================================================================
   WC MITT KONTO — .t8-account
   Layout: nav vanster + content hoger (sa lange viewport ar bred nog),
   stackar pa <992px. Bada sidor som vita kort.
   ========================================================================== */

.t8-account,
.brxe-woocommerce-account-page.t8-account {
  display: grid !important;
  grid-template-columns: 240px 1fr !important;
  column-gap: 32px !important;
  row-gap: 24px !important;
  align-items: start !important;
}
@media (max-width: 991px) {
  .t8-account {
    grid-template-columns: 1fr !important;
  }
}

/* WooCommerce sjalvgenererar en .woocommerce-wrapper inuti — ta bort den */
.t8-account > .woocommerce {
  display: contents;
}

/* Vanster navigation som vit card */
.t8-account .woocommerce-MyAccount-navigation {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 16px;
}
.t8-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.t8-account .woocommerce-MyAccount-navigation li {
  margin: 0;
}
.t8-account .woocommerce-MyAccount-navigation li a {
  display: block;
  padding: 12px 16px;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--t8-dark);
  text-decoration: none;
  border-radius: 8px;
  transition: background 0.15s, color 0.15s;
}
.t8-account .woocommerce-MyAccount-navigation li a:hover {
  background: var(--t8-light-warm);
  color: var(--t8-pink);
}
/* Aktiv menu-item = mork pill */
.t8-account .woocommerce-MyAccount-navigation li.is-active a,
.t8-account .woocommerce-MyAccount-navigation li.is-active > a {
  background: var(--t8-dark);
  color: var(--t8-white);
  font-weight: 600;
}
/* Logga ut sarskild — pa avstand fran ovriga */
.t8-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--t8-border);
}
.t8-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--t8-dark-soft);
}
.t8-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a:hover {
  color: var(--t8-pink);
  background: transparent;
}

/* Hoger content som vit card */
.t8-account .woocommerce-MyAccount-content {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 40px;
  min-width: 0;
}
@media (max-width: 767px) {
  .t8-account .woocommerce-MyAccount-content {
    padding: 24px;
  }
}

/* Content-typografi */
.t8-account .woocommerce-MyAccount-content p {
  font-family: var(--t8-font-body);
  font-size: 15px;
  color: var(--t8-dark);
  line-height: 1.6;
  margin: 0 0 16px 0;
}
.t8-account .woocommerce-MyAccount-content p:last-child {
  margin-bottom: 0;
}
.t8-account .woocommerce-MyAccount-content a {
  color: var(--t8-pink);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.t8-account .woocommerce-MyAccount-content a:hover {
  color: var(--t8-pink-dark);
}
.t8-account .woocommerce-MyAccount-content h2,
.t8-account .woocommerce-MyAccount-content h3 {
  font-family: var(--t8-font-body) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  margin: 0 0 16px 0 !important;
  line-height: 1.2;
}

/* WC ordertabell, adressrutor m.m. — generisk styling */
.t8-account .woocommerce-MyAccount-content table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--t8-font-body);
  margin: 0 0 24px 0;
}
.t8-account .woocommerce-MyAccount-content table thead th {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t8-dark-soft);
  padding: 12px 8px;
  border-bottom: 1px solid var(--t8-border);
  text-align: left;
}
.t8-account .woocommerce-MyAccount-content table tbody tr {
  border-bottom: 1px solid var(--t8-border);
}
.t8-account .woocommerce-MyAccount-content table tbody td {
  padding: 16px 8px;
  font-size: 14px;
  color: var(--t8-dark);
  vertical-align: middle;
}

/* Adress-rutor (edit-address-vy) */
.t8-account .woocommerce-Address {
  background: var(--t8-light-warm);
  border-radius: 12px;
  padding: 24px;
}
.t8-account .woocommerce-Addresses .u-column1,
.t8-account .woocommerce-Addresses .col-1 {
  display: none !important;
}
.t8-account .woocommerce-Address-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 16px 0;
}
.t8-account .woocommerce-Address-title h3 {
  margin: 0 !important;
}
.t8-account .woocommerce-Address .edit {
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 600;
  padding: 6px 14px;
  background: var(--t8-white);
  color: var(--t8-dark);
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  text-decoration: none;
}
.t8-account .woocommerce-Address .edit:hover {
  background: var(--t8-dark);
  color: var(--t8-white);
  border-color: var(--t8-dark);
}

/* WC-knappar (Spara, Beställ, etc.) */
.t8-account .woocommerce-MyAccount-content .button,
.t8-account .woocommerce-MyAccount-content input[type="submit"],
.t8-account .woocommerce-MyAccount-content button[type="submit"] {
  display: inline-flex;
  align-items: center;
  padding: 12px 24px;
  background: var(--t8-dark);
  color: var(--t8-white);
  border: none;
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s;
  text-decoration: none;
}
.t8-account .woocommerce-MyAccount-content .button:hover,
.t8-account .woocommerce-MyAccount-content input[type="submit"]:hover {
  background: var(--t8-pink);
  color: var(--t8-white);
}

/* Form-falt (edit-address, edit-account) */
.t8-account .woocommerce-MyAccount-content label {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--t8-dark-soft);
  display: block;
  margin-bottom: 6px;
}
.t8-account .woocommerce-MyAccount-content input[type="text"],
.t8-account .woocommerce-MyAccount-content input[type="email"],
.t8-account .woocommerce-MyAccount-content input[type="tel"],
.t8-account .woocommerce-MyAccount-content input[type="password"],
.t8-account .woocommerce-MyAccount-content select {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--t8-border);
  border-radius: 8px;
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark);
  background: var(--t8-white);
  transition: border-color 0.15s;
}
.t8-account .woocommerce-MyAccount-content input[type="text"]:focus,
.t8-account .woocommerce-MyAccount-content input[type="email"]:focus,
.t8-account .woocommerce-MyAccount-content input[type="tel"]:focus,
.t8-account .woocommerce-MyAccount-content input[type="password"]:focus,
.t8-account .woocommerce-MyAccount-content select:focus {
  outline: none;
  border-color: var(--t8-pink);
}

/* ==========================================================================
   Gutenberg post-content i .t8-card — typografi for vanliga sidor
   ========================================================================== */

/* Utvald bild som hero ovanfor titel */
.t8-page-hero,
.t8-page-hero img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  display: block;
  margin: 0 0 24px 0;
}

/* Post-content (the_content) wrapper */
.t8-card .brxe-post-content,
.t8-page-card .brxe-post-content {
  font-family: var(--t8-font-body);
  font-size: 16px;
  line-height: 1.7;
  color: var(--t8-dark);
}

/* Rubriker inuti post-content */
.t8-card .brxe-post-content h2,
.t8-card .brxe-post-content .wp-block-heading {
  font-family: var(--t8-font-body) !important;
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: var(--t8-dark);
  line-height: 1.2;
  margin: 40px 0 16px 0;
}
.t8-card .brxe-post-content h3 {
  font-family: var(--t8-font-body) !important;
  font-size: 20px;
  font-weight: 700;
  color: var(--t8-dark);
  line-height: 1.3;
  margin: 32px 0 12px 0;
}
.t8-card .brxe-post-content h4 {
  font-family: var(--t8-font-body) !important;
  font-size: 16px;
  font-weight: 600;
  color: var(--t8-dark);
  margin: 24px 0 10px 0;
}
.t8-card .brxe-post-content h2:first-child,
.t8-card .brxe-post-content h3:first-child,
.t8-card .brxe-post-content > *:first-child {
  margin-top: 0;
}

/* Paragrafer */
.t8-card .brxe-post-content p {
  margin: 0 0 16px 0;
  font-family: var(--t8-font-body);
  font-size: 16px;
  line-height: 1.7;
  color: var(--t8-dark);
}
.t8-card .brxe-post-content p:last-child,
.t8-card .brxe-post-content > *:last-child {
  margin-bottom: 0;
}
.t8-card .brxe-post-content p:empty {
  display: none;
}

/* Lankar */
.t8-card .brxe-post-content a {
  color: var(--t8-pink);
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.15s;
}
.t8-card .brxe-post-content a:hover {
  color: var(--t8-pink-dark);
}

/* Listor */
.t8-card .brxe-post-content ul,
.t8-card .brxe-post-content ol {
  margin: 0 0 16px 0;
  padding-left: 24px;
  font-family: var(--t8-font-body);
  font-size: 16px;
  line-height: 1.7;
  color: var(--t8-dark);
}
.t8-card .brxe-post-content li {
  margin: 0 0 6px 0;
}
.t8-card .brxe-post-content li:last-child {
  margin-bottom: 0;
}

/* Bilder och figurer */
.t8-card .brxe-post-content img,
.t8-card .brxe-post-content figure {
  max-width: 100%;
  height: auto;
  border-radius: 12px;
  margin: 24px 0;
  display: block;
}
.t8-card .brxe-post-content figcaption {
  font-family: var(--t8-font-body);
  font-size: 13px;
  color: var(--t8-dark-soft);
  text-align: center;
  margin-top: 8px;
}

/* Blockquote */
.t8-card .brxe-post-content blockquote {
  border-left: 3px solid var(--t8-pink);
  padding: 8px 0 8px 20px;
  margin: 24px 0;
  font-style: italic;
  color: var(--t8-dark);
}

/* Code */
.t8-card .brxe-post-content code {
  font-family: var(--t8-font-body);
  font-size: 14px;
  background: var(--t8-light);
  padding: 2px 6px;
  border-radius: 4px;
}

/* HR */
.t8-card .brxe-post-content hr {
  border: none;
  border-top: 1px solid var(--t8-border);
  margin: 32px 0;
}

/* Tabeller i content */
.t8-card .brxe-post-content table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  font-family: var(--t8-font-body);
  font-size: 14px;
}
.t8-card .brxe-post-content table th,
.t8-card .brxe-post-content table td {
  padding: 12px 8px;
  border-bottom: 1px solid var(--t8-border);
  text-align: left;
}
.t8-card .brxe-post-content table th {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t8-dark-soft);
}

/* ==========================================================================
   Utvald bild i .t8-page-card — begransad hojd, panoramic-cover-cropped
   ========================================================================== */
.t8-page-card > .brxe-image,
.t8-page-card > picture.brxe-image,
.t8-page-card > picture.t8-page-hero {
  display: block;
  width: 100%;
  margin: 0 0 24px 0;
  border-radius: 12px;
  overflow: hidden;
}
.t8-page-card > .brxe-image img,
.t8-page-card > picture.brxe-image img,
.t8-page-card > picture.t8-page-hero img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  object-position: center;
  display: block;
}
@media (max-width: 767px) {
  .t8-page-card > .brxe-image img,
  .t8-page-card > picture.brxe-image img {
    height: 200px;
  }
}

/* ==========================================================================
   Utvald bild i .t8-page-card — float right, rektangular, INTE roterad.
   Text flodar pa vanster, och under bilden far text full bredd igen.
   Override:ar tidigare "full-width 280px hojd"-regler.
   ========================================================================== */

.t8-page-card {
  position: relative;
  overflow: hidden;
}

/* Bild floatar hoger i kortet. NO transform/rotate. */
.t8-page-card > .brxe-image,
.t8-page-card > picture.brxe-image,
.t8-page-card > picture.t8-page-hero {
  float: right !important;
  width: 280px !important;
  max-width: 40% !important;
  margin: 0 0 24px 32px !important;
  border-radius: 12px;
  overflow: hidden;
  display: block;
  transform: none !important;
  rotate: 0deg !important;
}

.t8-page-card > .brxe-image img,
.t8-page-card > picture.brxe-image img,
.t8-page-card > picture.t8-page-hero img {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  object-fit: contain !important;
  display: block;
  transform: none !important;
  rotate: 0deg !important;
  border-radius: 12px;
}

/* Clear float pa kortets slut sa nasta content inte krockar */
.t8-page-card::after {
  content: "";
  display: block;
  clear: both;
}

/* Mobile — bild ovanfor text istallet for sida-vid-sida */
@media (max-width: 767px) {
  .t8-page-card > .brxe-image,
  .t8-page-card > picture.brxe-image,
  .t8-page-card > picture.t8-page-hero {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 24px 0 !important;
  }
}

/* ==========================================================================
   VARUKORG (.t8-cart) — 2-col layout: items vanster, totals hoger sticky
   ========================================================================== */

.t8-cart {
  display: grid !important;
  grid-template-columns: 1fr 360px !important;
  gap: 32px !important;
  align-items: start !important;
}
@media (max-width: 991px) {
  .t8-cart {
    grid-template-columns: 1fr !important;
  }
}

/* Vita kort runt items och collaterals */
.t8-cart .brxe-woocommerce-cart-items,
.t8-cart .brxe-woocommerce-cart-collaterals {
  background: var(--t8-white);
  border-radius: 16px;
  padding: 24px;
}

/* Cart-collaterals (totals) sticky pa desktop */
@media (min-width: 992px) {
  .t8-cart .brxe-woocommerce-cart-collaterals {
    position: sticky;
    top: 24px;
  }
}

/* ----- Cart items-tabell ----- */
.t8-cart .shop_table.cart {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--t8-font-body);
}
.t8-cart .shop_table.cart thead th {
  font-family: var(--t8-font-body);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t8-dark-soft);
  padding: 12px 8px;
  border-bottom: 1px solid var(--t8-border);
  text-align: left;
  background: transparent;
}
.t8-cart .shop_table.cart tbody tr.cart_item {
  border-bottom: 1px solid var(--t8-border);
}
.t8-cart .shop_table.cart tbody tr.cart_item:last-of-type {
  border-bottom: none;
}
.t8-cart .shop_table.cart tbody td,
.t8-cart .shop_table.cart tbody th {
  padding: 16px 8px;
  vertical-align: middle;
  background: transparent;
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark);
}

/* Remove-knapp (X) */
.t8-cart .shop_table .product-remove a.remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: transparent;
  border: 1px solid var(--t8-border);
  color: var(--t8-dark-soft);
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.t8-cart .shop_table .product-remove a.remove:hover {
  background: var(--t8-pink);
  color: var(--t8-white);
  border-color: var(--t8-pink);
}

/* Thumbnail */
.t8-cart .shop_table .product-thumbnail img {
  width: 60px;
  height: 60px;
  object-fit: contain;
  border-radius: 8px;
  display: block;
}

/* Produktnamn */
.t8-cart .shop_table .product-name {
  font-family: var(--t8-font-body) !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}
.t8-cart .shop_table .product-name a {
  color: var(--t8-dark);
  text-decoration: none;
  transition: color 0.15s;
}
.t8-cart .shop_table .product-name a:hover {
  color: var(--t8-pink);
}
.t8-cart .shop_table .product-name dl.variation {
  margin: 6px 0 0 0;
  font-size: 12px;
  color: var(--t8-dark-soft);
}
.t8-cart .shop_table .product-name dl.variation dt,
.t8-cart .shop_table .product-name dl.variation dd {
  display: inline;
  margin: 0;
}
.t8-cart .shop_table .product-name dl.variation dt {
  font-weight: 500;
  margin-right: 4px;
}
.t8-cart .shop_table .product-name dl.variation dd p {
  display: inline;
  margin: 0;
}

/* Pris och delsumma */
.t8-cart .shop_table .product-price,
.t8-cart .shop_table .product-subtotal {
  font-family: var(--t8-font-body);
  font-weight: 600;
  color: var(--t8-dark);
  white-space: nowrap;
}
.t8-cart .shop_table .ingram-mst-cart-suffix {
  font-family: var(--t8-font-body);
  font-weight: 400;
  font-size: 12px;
  color: var(--t8-dark-soft);
  margin-left: 4px;
}

/* Quantity-pill med +/- */
.t8-cart .shop_table .quantity {
  position: relative;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 2px;
  background: var(--t8-white);
}
.t8-cart .shop_table .quantity input.qty {
  width: 36px;
  text-align: center;
  border: none;
  background: transparent;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--t8-dark);
  -moz-appearance: textfield;
  padding: 4px 0;
}
.t8-cart .shop_table .quantity input.qty::-webkit-outer-spin-button,
.t8-cart .shop_table .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.t8-cart .shop_table .quantity .action {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--t8-dark);
  transition: color 0.15s;
}
.t8-cart .shop_table .quantity .action:hover {
  color: var(--t8-pink);
}
.t8-cart .shop_table .quantity .action svg {
  width: 16px;
  height: 16px;
}

/* Actions-rad (Rabattkod + Uppdatera varukorg) */
.t8-cart .shop_table tr td.actions {
  padding: 24px 0 0 0;
  border-top: 1px solid var(--t8-border);
}
.t8-cart .shop_table .coupon {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-right: 16px;
}
.t8-cart .shop_table .coupon label {
  display: none;
}
.t8-cart .shop_table .coupon input.input-text {
  padding: 10px 14px;
  border: 1px solid var(--t8-border);
  border-radius: 8px;
  font-family: var(--t8-font-body);
  font-size: 14px;
  background: var(--t8-white);
  color: var(--t8-dark);
  min-width: 180px;
}
.t8-cart .shop_table .coupon input.input-text:focus {
  outline: none;
  border-color: var(--t8-pink);
}
.t8-cart .shop_table .coupon .button,
.t8-cart .shop_table .actions .button {
  padding: 10px 18px;
  background: var(--t8-white);
  color: var(--t8-dark);
  border: 1px solid var(--t8-border);
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.t8-cart .shop_table .coupon .button:hover,
.t8-cart .shop_table .actions .button:hover {
  background: var(--t8-dark);
  color: var(--t8-white);
  border-color: var(--t8-dark);
}
.t8-cart .shop_table .actions button[name="update_cart"][disabled] {
  opacity: 0.4;
  cursor: not-allowed;
}
.t8-cart .shop_table .actions button[name="update_cart"][disabled]:hover {
  background: var(--t8-white);
  color: var(--t8-dark);
  border-color: var(--t8-border);
}

/* ----- Cart totals (hoger sidebar) ----- */
.t8-cart .cart_totals h2 {
  font-family: var(--t8-font-body) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em;
  color: var(--t8-dark) !important;
  margin: 0 0 16px 0 !important;
  line-height: 1.2;
}

.t8-cart .cart_totals table.shop_table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--t8-font-body);
  margin: 0 0 20px 0;
}
.t8-cart .cart_totals table.shop_table tr {
  border-bottom: 1px solid var(--t8-border);
}
.t8-cart .cart_totals table.shop_table tr:last-child {
  border-bottom: none;
}
.t8-cart .cart_totals table.shop_table th {
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--t8-dark-soft);
  padding: 12px 0;
  text-align: left;
  background: transparent;
}
.t8-cart .cart_totals table.shop_table td {
  padding: 12px 0;
  font-family: var(--t8-font-body);
  font-weight: 600;
  font-size: 14px;
  color: var(--t8-dark);
  text-align: right;
  background: transparent;
}

/* Total-raden — sticka ut */
.t8-cart .cart_totals .order-total th,
.t8-cart .cart_totals .order-total td {
  font-family: var(--t8-font-body) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  padding: 16px 0 !important;
}
.t8-cart .cart_totals .order-total td strong {
  font-weight: 700;
}

/* Manadsbetalningar-rad — pink accent */
.t8-cart .cart_totals .ingram-mst-monthly-total th,
.t8-cart .cart_totals .ingram-mst-monthly-total td {
  color: var(--t8-pink) !important;
}
.t8-cart .cart_totals .ingram-mst-monthly-total td small {
  font-family: var(--t8-font-body);
  font-weight: 400;
  font-size: 12px;
  color: var(--t8-pink);
  margin-left: 2px;
}

/* Shipping-rad */
.t8-cart .cart_totals .shipping .woocommerce-shipping-methods {
  list-style: none;
  padding: 0;
  margin: 0;
}
.t8-cart .cart_totals .shipping .woocommerce-shipping-methods li {
  margin: 0 0 4px 0;
}
.t8-cart .cart_totals .shipping .woocommerce-shipping-destination {
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 400;
  color: var(--t8-dark-soft);
  margin: 4px 0 0 0;
  text-align: right;
}

/* Checkout-knappen — stor pink CTA */
.t8-cart .wc-proceed-to-checkout {
  padding: 0;
  margin: 8px 0 0 0;
}
.t8-cart .wc-proceed-to-checkout .checkout-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 16px 24px;
  background: var(--t8-pink);
  color: var(--t8-white);
  border: none;
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s;
  text-align: center;
}
.t8-cart .wc-proceed-to-checkout .checkout-button:hover {
  background: var(--t8-pink-dark);
  color: var(--t8-white);
}

/* Mobile responsivt — tabellen blir staplad */
@media (max-width: 767px) {
  .t8-cart .shop_table.cart thead {
    display: none;
  }
  .t8-cart .shop_table.cart tbody tr.cart_item {
    display: grid;
    grid-template-columns: 60px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
  }
  .t8-cart .shop_table.cart tbody td,
  .t8-cart .shop_table.cart tbody th {
    padding: 4px 0;
    border: none;
  }
  .t8-cart .shop_table .product-remove {
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
  }
  .t8-cart .shop_table .product-thumbnail {
    grid-column: 1;
    grid-row: 1 / span 3;
  }
  .t8-cart .shop_table .product-name {
    grid-column: 2;
    grid-row: 1;
  }
  .t8-cart .shop_table .product-price {
    grid-column: 2;
    grid-row: 2;
    font-size: 13px;
  }
  .t8-cart .shop_table .product-quantity {
    grid-column: 2;
    grid-row: 3;
  }
  .t8-cart .shop_table .product-subtotal {
    grid-column: 3;
    grid-row: 2 / span 2;
    justify-self: end;
  }
}

/* ==========================================================================
   MINICART (dropdown fran header) — .cart-detail
   ========================================================================== */

.cart-detail,
.cart-detail.active {
  background: var(--t8-white) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 16px !important;
  box-shadow: 0 16px 32px rgba(37,50,58,0.12) !important;
  padding: 16px !important;
  min-width: 380px !important;
  max-width: 420px !important;
}

.cart-detail .widget_shopping_cart_content {
  padding: 0;
}

/* Item-listan */
.cart-detail ul.woocommerce-mini-cart,
.cart-detail ul.cart_list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 16px 0 !important;
  display: flex;
  flex-direction: column;
  max-height: none;
  overflow: visible;
}

/* Varje item */
.cart-detail .woocommerce-mini-cart-item,
.cart-detail .mini_cart_item {
  position: relative;
  padding: 12px 36px 12px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
  display: flex;
  align-items: center;
  gap: 12px;
}
.cart-detail .woocommerce-mini-cart-item:last-child {
  border-bottom: none !important;
}

/* Item-thumbnail + namn-lank (WC paketerar dem tillsammans i samma <a>) */
.cart-detail .woocommerce-mini-cart-item > a:not(.remove) {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 1;
  text-decoration: none !important;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--t8-dark);
  line-height: 1.3;
}
.cart-detail .woocommerce-mini-cart-item > a:not(.remove):hover {
  color: var(--t8-pink);
}
.cart-detail .woocommerce-mini-cart-item img {
  width: 48px !important;
  height: 48px !important;
  object-fit: contain;
  border-radius: 8px;
  background: var(--t8-light);
  flex-shrink: 0;
  margin: 0 !important;
}

/* Remove-knapp (X) — top-right av item */
.cart-detail .woocommerce-mini-cart-item .remove,
.cart-detail .remove_from_cart_button {
  position: absolute !important;
  top: 14px !important;
  right: 0 !important;
  width: 24px !important;
  height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  border: 1px solid var(--t8-border) !important;
  background: transparent !important;
  color: var(--t8-dark-soft) !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.cart-detail .woocommerce-mini-cart-item .remove:hover,
.cart-detail .remove_from_cart_button:hover {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-pink) !important;
}

/* Quantity-rad "1 × 8 979 kr" */
.cart-detail .woocommerce-mini-cart-item .quantity {
  display: block;
  width: 100%;
  font-family: var(--t8-font-body);
  font-size: 12px;
  font-weight: 500;
  color: var(--t8-dark-soft);
  margin-top: 4px;
}
.cart-detail .woocommerce-mini-cart-item .quantity .woocommerce-Price-amount {
  font-family: var(--t8-font-body);
  font-weight: 600;
  color: var(--t8-dark);
}
.cart-detail .woocommerce-mini-cart-item .ingram-mst-cart-suffix {
  font-family: var(--t8-font-body);
  font-weight: 400;
  font-size: 11px;
  color: var(--t8-dark-soft);
  margin-left: 2px;
}

/* Variation (Anvandare-meta etc) */
.cart-detail .woocommerce-mini-cart-item dl.variation {
  margin: 4px 0 0 0;
  font-size: 11px;
  color: var(--t8-dark-soft);
  width: 100%;
  font-family: var(--t8-font-body);
}
.cart-detail .woocommerce-mini-cart-item dl.variation dt,
.cart-detail .woocommerce-mini-cart-item dl.variation dd {
  display: inline;
  margin: 0;
}
.cart-detail .woocommerce-mini-cart-item dl.variation dt {
  font-weight: 500;
}
.cart-detail .woocommerce-mini-cart-item dl.variation dd p {
  display: inline;
  margin: 0 0 0 4px;
}

/* Totals-rad (Delsumma + Manadsbetalningar) */
.cart-detail .woocommerce-mini-cart__total {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 14px 0 !important;
  margin: 0 0 14px 0 !important;
  border-top: 1px solid var(--t8-border) !important;
  font-family: var(--t8-font-body);
}
.cart-detail .woocommerce-mini-cart__total > strong:first-child {
  display: inline-flex;
  justify-content: space-between;
  align-items: baseline;
  width: 100%;
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 700;
  color: var(--t8-dark);
}
/* WC packar Delsumma + value som "strong + amount" — gor pa rad med flex */
.cart-detail .woocommerce-mini-cart__total {
  display: grid !important;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  row-gap: 8px;
  column-gap: 8px;
}
.cart-detail .woocommerce-mini-cart__total > strong {
  font-family: var(--t8-font-body);
  font-size: 14px;
  font-weight: 700;
  color: var(--t8-dark);
}
.cart-detail .woocommerce-mini-cart__total > .woocommerce-Price-amount {
  font-family: var(--t8-font-body);
  font-size: 16px;
  font-weight: 700;
  color: var(--t8-dark);
  justify-self: end;
}

/* Manadsbetalningar-raden (Ingram MST) — pink accent */
.cart-detail .ingram-mst-minicart-monthly {
  grid-column: 1 / -1;
  display: flex !important;
  justify-content: space-between !important;
  align-items: baseline;
  margin: 0 !important;
  font-family: var(--t8-font-body);
  font-size: 13px !important;
}
.cart-detail .ingram-mst-minicart-monthly strong {
  font-family: var(--t8-font-body);
  font-weight: 600;
  color: var(--t8-pink);
}
.cart-detail .ingram-mst-minicart-monthly .woocommerce-Price-amount {
  font-family: var(--t8-font-body);
  font-weight: 600;
  color: var(--t8-pink);
}
.cart-detail .ingram-mst-minicart-monthly small {
  font-family: var(--t8-font-body);
  font-weight: 400;
  font-size: 11px;
  color: var(--t8-pink);
}

/* Knappar — Visa varukorg (outline) + Till kassan (pink CTA) */
.cart-detail .woocommerce-mini-cart__buttons {
  display: flex !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.cart-detail .woocommerce-mini-cart__buttons .button {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border-radius: 999px;
  font-family: var(--t8-font-body);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
  white-space: nowrap;
}
/* Visa varukorg — outline */
.cart-detail .woocommerce-mini-cart__buttons .button.wc-forward:not(.checkout) {
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  border: 1px solid var(--t8-border) !important;
}
.cart-detail .woocommerce-mini-cart__buttons .button.wc-forward:not(.checkout):hover {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-dark) !important;
}
/* Till kassan — pink CTA */
.cart-detail .woocommerce-mini-cart__buttons .button.checkout {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border: 1px solid var(--t8-pink) !important;
}
.cart-detail .woocommerce-mini-cart__buttons .button.checkout:hover {
  background: var(--t8-pink-dark) !important;
  border-color: var(--t8-pink-dark) !important;
  color: var(--t8-white) !important;
}

/* Tomt-tillstand (om varukorg ar tom) */
.cart-detail .woocommerce-mini-cart__empty-message,
.cart-detail p.woocommerce-mini-cart__empty-message {
  text-align: center;
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark-soft);
  padding: 24px 16px;
  margin: 0;
}

/* ==========================================================================
   Minicart — fixa item-layout (img+name pa rad, qty under) + knapphojd
   ========================================================================== */

/* Override: item som flex column med wrap sa link, qty, variation hamnar pa egen rad */
.cart-detail .woocommerce-mini-cart-item,
.cart-detail .mini_cart_item {
  position: relative;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 6px 12px !important;
  padding: 12px 36px 12px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
}

/* Link med img + namn — full bredd av li */
.cart-detail .woocommerce-mini-cart-item > a:not(.remove) {
  flex-basis: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-decoration: none !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  line-height: 1.3 !important;
}
.cart-detail .woocommerce-mini-cart-item > a:not(.remove):hover {
  color: var(--t8-pink) !important;
}
.cart-detail .woocommerce-mini-cart-item img {
  width: 48px !important;
  height: 48px !important;
  object-fit: contain;
  border-radius: 8px;
  background: var(--t8-light);
  flex-shrink: 0 !important;
  margin: 0 !important;
}

/* Quantity — egen rad, indenterad sa den linjerar under namnet */
.cart-detail .woocommerce-mini-cart-item .quantity {
  flex-basis: 100% !important;
  padding-left: 60px !important;
  display: block !important;
  width: auto !important;
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--t8-dark-soft) !important;
  margin: 0 !important;
}
.cart-detail .woocommerce-mini-cart-item .quantity .woocommerce-Price-amount {
  font-family: var(--t8-font-body);
  font-weight: 600;
  color: var(--t8-dark);
}

/* Variation — egen rad, indenterad */
.cart-detail .woocommerce-mini-cart-item dl.variation {
  flex-basis: 100% !important;
  padding-left: 60px !important;
  margin: 0 !important;
  font-size: 11px !important;
  color: var(--t8-dark-soft) !important;
}

/* Mindre, kompaktare knappar */
.cart-detail .woocommerce-mini-cart__buttons {
  display: flex !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.cart-detail .woocommerce-mini-cart__buttons .button {
  flex: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 10px 14px !important;
  min-height: 0 !important;
  height: auto !important;
  line-height: 1.2 !important;
  border-radius: 999px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: pointer;
  white-space: nowrap;
}

/* ==========================================================================
   Single page tweaks — narrare card, mer space efter h1, manrope 800 subheads,
   mindre bild
   ========================================================================== */

/* Smalare page-card — reading-friendly bredd */
.t8-page-card,
.t8-wrap > .t8-page-card,
.t8-wrap > .t8-card.t8-page-card {
  max-width: 880px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
}

/* H1 har storre marginal under (30px) */
.t8-page-card > .brxe-post-title.t8-page-title,
.t8-page-card > .t8-page-title {
  margin: 0 0 30px 0 !important;
}

/* Sub-rubriker (h2, h3, h4) inuti post-content — Manrope 800 istallet for mono */
.t8-card .brxe-post-content h2,
.t8-card .brxe-post-content .wp-block-heading,
.t8-page-card .brxe-post-content h2 {
  font-family: var(--t8-font-body) !important;
  font-weight: 800 !important;
  font-size: 26px !important;
  letter-spacing: 0 !important;
}
.t8-card .brxe-post-content h3,
.t8-page-card .brxe-post-content h3 {
  font-family: var(--t8-font-body) !important;
  font-weight: 800 !important;
  font-size: 18px !important;
  letter-spacing: 0 !important;
}
.t8-card .brxe-post-content h4,
.t8-page-card .brxe-post-content h4 {
  font-family: var(--t8-font-body) !important;
  font-weight: 800 !important;
  font-size: 16px !important;
}

/* Mindre flytande bild (var 280, nu 200) */
.t8-page-card > .brxe-image,
.t8-page-card > picture.brxe-image,
.t8-page-card > picture.t8-page-hero {
  width: 200px !important;
  max-width: 30% !important;
}


/* ==========================================================================
   Minicart — fix item-stapling sa quantity och variation visas under namnet
   ========================================================================== */
.cart-detail .woocommerce-mini-cart-item,
.cart-detail .mini_cart_item {
  position: relative !important;
  display: block !important;
  padding: 14px 36px 14px 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
}
.cart-detail .woocommerce-mini-cart-item:last-child {
  border-bottom: none !important;
}

/* Link med img + namn — inline-flex inom block-li */
.cart-detail .woocommerce-mini-cart-item > a:not(.remove) {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  text-decoration: none !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  line-height: 1.3 !important;
  margin: 0 0 6px 0 !important;
  flex-basis: auto !important;
}
.cart-detail .woocommerce-mini-cart-item > a:not(.remove):hover {
  color: var(--t8-pink) !important;
}
.cart-detail .woocommerce-mini-cart-item img {
  width: 48px !important;
  height: 48px !important;
  flex-shrink: 0 !important;
  border-radius: 8px;
  background: var(--t8-light);
  object-fit: contain;
}

/* Quantity — block under namnet, indenterad sa den linjerar under namnet */
.cart-detail .woocommerce-mini-cart-item .quantity {
  display: block !important;
  margin: 0 0 0 60px !important;
  padding: 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--t8-dark-soft) !important;
  width: auto !important;
  flex-basis: auto !important;
}
.cart-detail .woocommerce-mini-cart-item .quantity .woocommerce-Price-amount {
  font-family: var(--t8-font-body);
  font-weight: 600;
  color: var(--t8-dark);
}

/* Variation — block, indenterad */
.cart-detail .woocommerce-mini-cart-item dl.variation {
  display: block !important;
  margin: 4px 0 0 60px !important;
  padding: 0 !important;
  font-size: 11px !important;
  color: var(--t8-dark-soft) !important;
  width: auto !important;
  flex-basis: auto !important;
}

/* Remove × — top-right av item */
.cart-detail .woocommerce-mini-cart-item .remove,
.cart-detail .remove_from_cart_button {
  position: absolute !important;
  top: 16px !important;
  right: 0 !important;
}


/* ==========================================================================
   KASSA (checkout) — 2-kol layout (customer-details vanster, order-review hoger)
   Anvander befintlig .t8-cart grid (1fr 360px) men breddar hoger till 420px
   ========================================================================== */

/* Dolj stale page-content som lacker fram efter <form> */
body.woocommerce-checkout #brx-content > h3,
body.woocommerce-checkout #brx-content > p {
  display: none !important;
}

/* Override grid columns specifikt for checkout (var 1fr 360px → 1fr 420px) */
body.woocommerce-checkout .t8-cart {
  grid-template-columns: minmax(0, 1fr) 440px !important;
}
@media (max-width: 991px) {
  body.woocommerce-checkout .t8-cart {
    grid-template-columns: 1fr !important;
  }
}

/* ----- Before-checkout (rabattkod-area ovanfor formet) ----- */
.woocommerce-checkout .before-checkout {
  max-width: 1280px !important;
  margin: 0 auto 24px auto !important;
  padding: 32px 48px 0 48px !important;
}
.woocommerce-checkout .before-checkout .woocommerce-info {
  background: #eaf3f9 !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 14px 20px !important;
  margin: 0 0 12px 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  color: var(--t8-dark) !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px;
}
.woocommerce-checkout .before-checkout .woocommerce-info::before {
  display: none !important;
}
.woocommerce-checkout .before-checkout .woocommerce-info a.showcoupon {
  color: var(--t8-pink) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon {
  background: var(--t8-white) !important;
  border-radius: 12px !important;
  padding: 16px 20px !important;
  margin: 0 !important;
  gap: 12px !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon p {
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 1 auto !important;
  width: auto !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon p.form-row-last {
  flex: 0 0 auto !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon input[type="text"] {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon button {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border: none !important;
  padding: 12px 24px !important;
  border-radius: 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer;
  white-space: nowrap;
  min-height: 44px;
}
.woocommerce-checkout .before-checkout .checkout_coupon button:hover {
  background: var(--t8-pink-dark) !important;
}
.woocommerce-checkout .before-checkout .clear {
  display: none !important;
}

/* ----- Vita kort runt customer-details och order-review ----- */
.t8-cart .brxe-woocommerce-checkout-customer-details {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
  background: transparent !important;
  padding: 0 !important;
}
.t8-cart #customer_details {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}
.t8-cart .col-1,
.t8-cart .col-2 {
  width: 100% !important;
  float: none !important;
  background: var(--t8-white) !important;
  border-radius: 16px !important;
  padding: 32px !important;
  box-sizing: border-box !important;
}
.t8-cart .col2-set::before,
.t8-cart .col2-set::after {
  display: none !important;
}

/* Card-rubriker (h3 inuti customer-details/order-review) */
.t8-cart .woocommerce-billing-fields > h3,
.t8-cart .woocommerce-shipping-fields > h3,
.t8-cart .woocommerce-additional-fields > h3,
.t8-cart #order_review_heading {
  font-family: var(--t8-font-body) !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  margin: 0 0 20px 0 !important;
  padding: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* "Skicka till" h3 har checkbox inline */
.t8-cart #ship-to-different-address {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.t8-cart #ship-to-different-address-checkbox {
  width: 18px !important;
  height: 18px !important;
  accent-color: var(--t8-pink);
  margin: 0 !important;
  cursor: pointer;
}
.t8-cart #ship-to-different-address .checkbox {
  display: contents;
}

/* "Beställningsanteckningar" h3 (om finns) */
.t8-cart .woocommerce-additional-fields > h3 {
  margin-top: 24px !important;
}

/* ----- Form-rows (2-kol grid for first/last, full for wide) ----- */
.t8-cart .woocommerce-billing-fields__field-wrapper,
.t8-cart .woocommerce-shipping-fields__field-wrapper,
.t8-cart .woocommerce-additional-fields__field-wrapper {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
  width: 100% !important;
}
.t8-cart .form-row {
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  box-sizing: border-box !important;
  float: none !important;
}
.t8-cart .form-row.form-row-first { grid-column: 1 / 2; }
.t8-cart .form-row.form-row-last  { grid-column: 2 / 3; }
.t8-cart .form-row.form-row-wide,
.t8-cart .form-row.form-row-full,
.t8-cart .form-row.notes,
.t8-cart .form-row.address-field {
  grid-column: 1 / -1 !important;
}
.t8-cart .form-row.form-row-first.address-field { grid-column: 1 / 2 !important; }
.t8-cart .form-row.form-row-last.address-field  { grid-column: 2 / 3 !important; }

/* Labels */
.t8-cart .form-row > label {
  display: block !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  margin: 0 0 6px 0 !important;
  padding: 0 !important;
  line-height: 1.3 !important;
}
.t8-cart .form-row .optional {
  color: var(--t8-dark-soft);
  font-weight: 400;
  font-size: 12px;
  font-style: normal;
}
.t8-cart .form-row abbr.required,
.t8-cart .form-row .required {
  color: var(--t8-pink) !important;
  text-decoration: none !important;
  border: none !important;
  margin-left: 2px;
  font-weight: 600;
}

/* Inputs / textarea / select */
.t8-cart .woocommerce-input-wrapper {
  display: block !important;
  width: 100% !important;
}
.t8-cart input[type="text"],
.t8-cart input[type="email"],
.t8-cart input[type="tel"],
.t8-cart input[type="number"],
.t8-cart textarea,
.t8-cart select,
.t8-cart .select2-container--default .select2-selection--single {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  box-sizing: border-box !important;
  line-height: 1.4 !important;
  min-height: 44px !important;
  height: auto !important;
  transition: border-color .15s ease;
}
.t8-cart input:focus,
.t8-cart textarea:focus,
.t8-cart select:focus,
.t8-cart .select2-container--default.select2-container--focus .select2-selection--single {
  outline: none !important;
  border-color: var(--t8-pink) !important;
}
.t8-cart textarea {
  resize: vertical;
  min-height: 90px !important;
  padding-top: 12px !important;
}

/* Select2 (Land/Region) — match input-stil */
.t8-cart .select2-container {
  width: 100% !important;
}
.t8-cart .select2-container--default .select2-selection--single {
  display: flex !important;
  align-items: center !important;
}
.t8-cart .select2-container--default .select2-selection--single .select2-selection__rendered {
  padding: 0 !important;
  line-height: 1.4 !important;
  color: var(--t8-dark) !important;
}
.t8-cart .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 44px !important;
  right: 12px !important;
  top: 0 !important;
}

/* ----- Order review (höger kolumn) ----- */
.t8-cart .brxe-woocommerce-checkout-order-review {
  background: var(--t8-white) !important;
  border-radius: 16px !important;
  padding: 32px !important;
  box-sizing: border-box;
}
@media (min-width: 992px) {
  .t8-cart .brxe-woocommerce-checkout-order-review {
    position: sticky;
    top: 24px;
  }
}

/* Order review table */
.t8-cart .woocommerce-checkout-review-order-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  margin: 0 0 20px 0 !important;
}
.t8-cart .woocommerce-checkout-review-order-table thead th {
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--t8-dark-soft) !important;
  padding: 0 0 12px 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
  background: transparent !important;
  text-align: left !important;
}
.t8-cart .woocommerce-checkout-review-order-table thead .product-total {
  text-align: right !important;
}
.t8-cart .woocommerce-checkout-review-order-table tbody tr.cart_item td {
  padding: 14px 0 !important;
  vertical-align: top !important;
  border-bottom: 1px solid var(--t8-border) !important;
  background: transparent !important;
}
.t8-cart .woocommerce-checkout-review-order-table .product-name {
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  line-height: 1.4 !important;
}
.t8-cart .woocommerce-checkout-review-order-table .product-quantity {
  display: inline-block;
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--t8-dark-soft) !important;
  margin-left: 4px;
}
.t8-cart .woocommerce-checkout-review-order-table .product-total {
  text-align: right !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  white-space: nowrap !important;
}
.t8-cart .woocommerce-checkout-review-order-table .product-total small.ingram-mst-cart-suffix {
  font-family: var(--t8-font-body);
  font-weight: 500;
  color: var(--t8-dark-soft);
  font-size: 12px;
  margin-left: 2px;
}

/* Variation (Användare/...) inom order-review */
.t8-cart .woocommerce-checkout-review-order-table .variation {
  margin: 6px 0 0 0 !important;
  padding: 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  color: var(--t8-dark-soft) !important;
  display: block;
}
.t8-cart .woocommerce-checkout-review-order-table .variation dt,
.t8-cart .woocommerce-checkout-review-order-table .variation dd {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  font-weight: inherit !important;
}
.t8-cart .woocommerce-checkout-review-order-table .variation dt::after {
  content: " ";
}
.t8-cart .woocommerce-checkout-review-order-table .variation p {
  display: inline !important;
  margin: 0 !important;
  color: var(--t8-dark) !important;
  font-weight: 500;
}

/* Totals (tfoot) */
.t8-cart .woocommerce-checkout-review-order-table tfoot th,
.t8-cart .woocommerce-checkout-review-order-table tfoot td {
  padding: 12px 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  background: transparent !important;
  border: none !important;
  vertical-align: middle !important;
}
.t8-cart .woocommerce-checkout-review-order-table tfoot tr {
  border-bottom: 1px solid var(--t8-border) !important;
}
.t8-cart .woocommerce-checkout-review-order-table tfoot tr:last-child {
  border-bottom: none !important;
}
.t8-cart .woocommerce-checkout-review-order-table tfoot th {
  font-weight: 600 !important;
  text-align: left !important;
  color: var(--t8-dark) !important;
}
.t8-cart .woocommerce-checkout-review-order-table tfoot td {
  text-align: right !important;
  font-family: var(--t8-font-body) !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  white-space: nowrap !important;
}
.t8-cart .woocommerce-checkout-review-order-table tr.order-total th,
.t8-cart .woocommerce-checkout-review-order-table tr.order-total td {
  font-size: 16px !important;
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}
.t8-cart .woocommerce-checkout-review-order-table tr.order-total strong {
  font-weight: 700 !important;
}
.t8-cart .woocommerce-checkout-review-order-table tfoot td small {
  font-family: var(--t8-font-body) !important;
  color: var(--t8-dark-soft) !important;
  font-weight: 500 !important;
  font-size: 12px !important;
}

/* Frakt-rad — radio-knapp ej synlig, label hoger */
.t8-cart .woocommerce-shipping-totals ul#shipping_method {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.t8-cart .woocommerce-shipping-totals ul#shipping_method li {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}
.t8-cart .woocommerce-shipping-totals ul#shipping_method label {
  margin: 0 !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
}

/* Månadsbetalningar-rad highlight */
.t8-cart .ingram-mst-monthly-total th,
.t8-cart .ingram-mst-monthly-total td {
  color: var(--t8-pink) !important;
}

/* ----- Notices inom order-review ----- */
.t8-cart .ingram-mst-checkout-notice,
.t8-cart .woocommerce-info {
  background: #eaf3f9 !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  margin: 16px 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: var(--t8-dark) !important;
}
.t8-cart .ingram-mst-checkout-notice::before,
.t8-cart .woocommerce-info::before {
  display: none !important;
}
.t8-cart .ingram-mst-checkout-notice strong {
  color: var(--t8-dark);
}

/* ----- Payment ----- */
.t8-cart .woocommerce-checkout-payment {
  margin-top: 16px;
  background: transparent !important;
}
.t8-cart .wc_payment_methods {
  list-style: none !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
}
.t8-cart .wc_payment_method {
  background: var(--t8-light) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 12px !important;
  padding: 14px 16px !important;
  margin: 0 0 8px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.t8-cart .wc_payment_method:last-child {
  margin-bottom: 0 !important;
}
.t8-cart .wc_payment_method input.input-radio {
  width: 18px;
  height: 18px;
  accent-color: var(--t8-pink);
  margin: 0;
  flex-shrink: 0;
}
.t8-cart .wc_payment_method label {
  margin: 0 !important;
  padding: 0 !important;
  cursor: pointer;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  flex: 1;
}
.t8-cart .wc_payment_method .payment_box {
  flex-basis: 100%;
  font-size: 13px;
  color: var(--t8-dark-soft);
  margin-top: 8px;
}

/* Terms / privacy wrapper */
.t8-cart .woocommerce-terms-and-conditions-wrapper {
  margin: 16px 0 !important;
  padding: 16px !important;
  background: var(--t8-light) !important;
  border-radius: 12px !important;
}
.t8-cart .woocommerce-privacy-policy-text {
  margin-bottom: 12px;
}
.t8-cart .woocommerce-privacy-policy-text p {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  color: var(--t8-dark-soft) !important;
}
.t8-cart .woocommerce-privacy-policy-text a,
.t8-cart .woocommerce-terms-and-conditions-checkbox-text a {
  color: var(--t8-pink) !important;
  text-decoration: underline;
}
.t8-cart .form-row.validate-required {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin: 0 !important;
  grid-column: unset !important;
}
.t8-cart .woocommerce-terms-and-conditions-wrapper .woocommerce-form__label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin: 0 !important;
  cursor: pointer;
}
.t8-cart .woocommerce-terms-and-conditions-wrapper input[type="checkbox"] {
  margin-top: 2px !important;
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0 !important;
  accent-color: var(--t8-pink);
  cursor: pointer;
}
.t8-cart .woocommerce-terms-and-conditions-checkbox-text {
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: var(--t8-dark) !important;
}

/* ----- Place order button ----- */
.t8-cart #place_order {
  display: block !important;
  width: 100% !important;
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border: none !important;
  padding: 16px 24px !important;
  border-radius: 12px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  cursor: pointer;
  text-transform: none !important;
  letter-spacing: 0 !important;
  margin: 16px 0 0 0 !important;
  transition: background .15s ease;
  min-height: 52px;
}
.t8-cart #place_order:hover {
  background: var(--t8-pink-dark) !important;
}

/* Dolj noscript fallback */
.t8-cart noscript {
  display: none !important;
}

/* Dolj loading-overlay-ringen som skapas av WC vid uppdatering */
.t8-cart .blockUI.blockOverlay {
  background: rgba(255,255,255,0.6) !important;
}

/* ==========================================================================
   KASSA fixes — labels ovanfor inputs, kupong-toggle, tabell-luft, notice-layout
   ========================================================================== */

/* ----- FIX 1: Labels ALLTID ovanfor inputs (brute-force block stacking) ----- */
.t8-cart .form-row,
.t8-cart p.form-row,
.t8-cart .form-row.form-row-first,
.t8-cart .form-row.form-row-last,
.t8-cart .form-row.form-row-wide,
.t8-cart .form-row.form-row-full,
.t8-cart .form-row.address-field {
  display: block !important;
  float: none !important;
  flex-wrap: nowrap !important;
}
.t8-cart .form-row > label,
.t8-cart .form-row label.required_field,
.t8-cart p.form-row > label {
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  max-width: 100% !important;
  line-height: 1.3 !important;
  white-space: normal !important;
}
.t8-cart .form-row > .woocommerce-input-wrapper,
.t8-cart .form-row .woocommerce-input-wrapper {
  display: block !important;
  float: none !important;
  clear: both !important;
  width: 100% !important;
  max-width: 100% !important;
}
/* Terms-row har label-wrapping-checkbox — undantag */
.t8-cart .woocommerce-terms-and-conditions-wrapper .form-row label.checkbox {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  width: auto !important;
  clear: none !important;
}

/* ----- FIX 2: Kupong-toggle — lat WC JS styra display, vi sticker inte i det ----- */
.woocommerce-checkout .before-checkout .checkout_coupon {
  background: var(--t8-white);
  border: 1px solid var(--t8-border);
  border-radius: 12px;
  padding: 16px 20px;
  margin: 0;
  gap: 12px;
  align-items: stretch;
  flex-wrap: nowrap;
}

/* Info-notice — knapp-aktig hover, matchar ovrig design (vit kort med pink-text) */
.woocommerce-checkout .before-checkout .woocommerce-info {
  background: var(--t8-white) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 12px !important;
  padding: 16px 20px !important;
  margin: 0 0 12px 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  color: var(--t8-dark) !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 16px;
  box-shadow: none !important;
}
.woocommerce-checkout .before-checkout .woocommerce-info a.showcoupon {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--t8-pink) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: pointer;
}
.woocommerce-checkout .before-checkout .woocommerce-info a.showcoupon::after {
  content: "▾";
  font-size: 12px;
  transition: transform .15s ease;
}
.woocommerce-checkout .before-checkout .woocommerce-info a.showcoupon:hover {
  text-decoration: underline !important;
}

/* ----- FIX 3: "Din beställning" tabell — mer luft + visuell hierarki ----- */

/* Storre padding pa cart_item-rader */
.t8-cart .woocommerce-checkout-review-order-table tbody tr.cart_item td {
  padding: 18px 0 !important;
}

/* Tydligare separator mellan items och totals */
.t8-cart .woocommerce-checkout-review-order-table tbody tr.cart_item:last-of-type td {
  padding-bottom: 20px !important;
}
.t8-cart .woocommerce-checkout-review-order-table tfoot tr:first-child th,
.t8-cart .woocommerce-checkout-review-order-table tfoot tr:first-child td {
  padding-top: 18px !important;
  border-top: 2px solid var(--t8-dark) !important;
}

/* Tydligare totals — minska font pa "Delsumma/Frakt/Moms", okat mellanrum */
.t8-cart .woocommerce-checkout-review-order-table tfoot tr.cart-subtotal th,
.t8-cart .woocommerce-checkout-review-order-table tfoot tr.cart-subtotal td,
.t8-cart .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals th,
.t8-cart .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals td,
.t8-cart .woocommerce-checkout-review-order-table tfoot tr.tax-rate th,
.t8-cart .woocommerce-checkout-review-order-table tfoot tr.tax-rate td {
  font-size: 13px !important;
  color: var(--t8-dark-soft) !important;
  padding: 8px 0 !important;
  border-bottom: none !important;
  font-weight: 500 !important;
}

/* "Totalt att betala nu" — extra framtradande */
.t8-cart .woocommerce-checkout-review-order-table tr.order-total th,
.t8-cart .woocommerce-checkout-review-order-table tr.order-total td {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  padding: 18px 0 14px 0 !important;
  border-top: 1px solid var(--t8-border) !important;
  margin-top: 8px !important;
}
.t8-cart .woocommerce-checkout-review-order-table tr.order-total th {
  font-family: var(--t8-font-body) !important;
}

/* Manadsbetalningar — separat tonad rad under total */
.t8-cart .woocommerce-checkout-review-order-table tr.ingram-mst-monthly-total th,
.t8-cart .woocommerce-checkout-review-order-table tr.ingram-mst-monthly-total td {
  font-size: 13px !important;
  color: var(--t8-pink) !important;
  padding: 6px 0 12px 0 !important;
  border: none !important;
  font-weight: 600 !important;
}

/* Mer marginal under tabellen innan notice/payment */
.t8-cart .woocommerce-checkout-review-order-table {
  margin: 0 0 28px 0 !important;
}

/* ----- FIX 4: "Om din beställning" notice — rubrik ovanfor text ----- */
.t8-cart .ingram-mst-checkout-notice {
  display: block !important;
  background: var(--t8-light) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 12px !important;
  padding: 16px 18px !important;
  margin: 0 0 20px 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  line-height: 1.6 !important;
  color: var(--t8-dark-soft) !important;
  box-shadow: none !important;
}
.t8-cart .ingram-mst-checkout-notice strong {
  display: block !important;
  margin: 0 0 6px 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
/* Dolj <br> direkt efter <strong> sa det inte skapas extra mellanrum */
.t8-cart .ingram-mst-checkout-notice strong + br {
  display: none !important;
}

/* Same for any annan woocommerce-info inom order-review */
.t8-cart .brxe-woocommerce-checkout-order-review .woocommerce-info {
  display: block !important;
  background: var(--t8-light) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 12px !important;
  padding: 16px 18px !important;
  margin: 0 0 16px 0 !important;
}

/* ==========================================================================
   FIX: Mitt konto navigation — knappar mindre/kompaktare
   ========================================================================== */
.t8-account .woocommerce-MyAccount-navigation ul {
  gap: 0 !important;
}
.t8-account .woocommerce-MyAccount-navigation li a {
  padding: 9px 14px !important;
  font-size: 14px !important;
  line-height: 1.3 !important;
  min-height: 0 !important;
}
.t8-account .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout {
  margin-top: 8px !important;
  padding-top: 8px !important;
}

/* ==========================================================================
   FIX: Border pa checkout-tabellen och payment-boxen (Bricks-default)
   ========================================================================== */
.woocommerce-checkout .woocommerce-checkout-payment,
.woocommerce-checkout .woocommerce-checkout-review-order-table {
  border: none !important;
}

/* ==========================================================================
   SOKSIDAN / SHOP-ARKIV — styla ul.products som vara t8-cards
   Galler aven for sok-resultat, kategori-arkiv, butik-arkiv
   ========================================================================== */

/* Page-bakgrund pa sok/arkiv-sidor */
body.search-results,
body.search-results .brx-content,
body.post-type-archive-product,
body.tax-product_cat {
  background: var(--t8-light);
}

/* Title-wrapper (h1 "Sokresultat: ...") */
.bricks-archive-title-wrapper {
  max-width: 1280px;
  margin: 0 auto !important;
  padding: 40px 48px 24px 48px !important;
}
.bricks-archive-title-wrapper .title,
.bricks-archive-title-wrapper h1 {
  font-family: var(--t8-font-body) !important;
  font-size: clamp(36px, 5vw, 56px) !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  margin: 0 !important;
  letter-spacing: -0.02em !important;
  line-height: 1.1 !important;
  text-align: center;
}

/* Wrapper for hela shop-loopen */
.brxe-woocommerce-products {
  max-width: 1280px;
  margin: 0 auto !important;
  padding: 0 48px 80px 48px !important;
}

/* Before-shop-loop: result-count + orderby pa rad */
.brxe-woocommerce-products .bricks-before-shop-loop,
.woocommerce .before-shop-loop {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  margin: 0 0 24px 0 !important;
  padding: 0 !important;
  flex-wrap: wrap;
  gap: 16px;
}
.brxe-woocommerce-products .woocommerce-result-count {
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  color: var(--t8-dark-soft) !important;
  margin: 0 !important;
}
.brxe-woocommerce-products .woocommerce-ordering {
  margin: 0 !important;
}
.brxe-woocommerce-products .woocommerce-ordering select.orderby {
  padding: 10px 36px 10px 14px !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 8px !important;
  background: var(--t8-white) !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  color: var(--t8-dark) !important;
  cursor: pointer;
  min-height: 40px;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235a6670' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 12px;
}

/* Produkt-grid */
.brxe-woocommerce-products ul.products,
.woocommerce ul.products {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  gap: 24px !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
@media (max-width: 991px) {
  .brxe-woocommerce-products ul.products,
  .woocommerce ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 767px) {
  .brxe-woocommerce-products ul.products,
  .woocommerce ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 479px) {
  .brxe-woocommerce-products ul.products,
  .woocommerce ul.products {
    grid-template-columns: 1fr !important;
  }
}

/* Produkt-kort */
.brxe-woocommerce-products ul.products li.product,
.woocommerce ul.products li.product {
  background: var(--t8-white) !important;
  border-radius: 16px !important;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
  float: none !important;
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  position: relative !important;
  overflow: hidden;
  transition: transform .15s ease, box-shadow .15s ease;
}
.brxe-woocommerce-products ul.products li.product:hover,
.woocommerce ul.products li.product:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}

/* Bild-lank wrapper */
.brxe-woocommerce-products ul.products li.product > a.woocommerce-LoopProduct-link,
.woocommerce ul.products li.product > a.woocommerce-LoopProduct-link {
  display: flex !important;
  flex-direction: column;
  text-decoration: none !important;
  color: inherit !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Produktbild */
.brxe-woocommerce-products ul.products li.product img,
.woocommerce ul.products li.product img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background: var(--t8-light);
  margin: 0 !important;
  padding: 16px;
  box-sizing: border-box;
  display: block;
}

/* Produkt-titel (h2) */
.brxe-woocommerce-products ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  margin: 16px 16px 6px 16px !important;
  padding: 0 !important;
  line-height: 1.3 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Pris */
.brxe-woocommerce-products ul.products li.product .price,
.woocommerce ul.products li.product .price {
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  margin: 0 16px 14px 16px !important;
  padding: 0 !important;
  display: block;
}
.brxe-woocommerce-products ul.products li.product .price del {
  color: var(--t8-dark-soft);
  font-weight: 500;
  margin-right: 6px;
}
.brxe-woocommerce-products ul.products li.product .price ins {
  background: none;
  color: var(--t8-pink);
  text-decoration: none;
}

/* CTA-knapp (Valj kopsatt / Lagg i varukorgen / Ring salj) */
.brxe-woocommerce-products ul.products li.product a.button,
.woocommerce ul.products li.product a.button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  margin: 0 16px 16px 16px !important;
  padding: 10px 18px !important;
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border: none !important;
  border-radius: 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  line-height: 1.3 !important;
  cursor: pointer;
  align-self: flex-start;
  transition: background .15s ease;
}
.brxe-woocommerce-products ul.products li.product a.button:hover,
.woocommerce ul.products li.product a.button:hover {
  background: var(--t8-pink-dark) !important;
}

/* Ring salj = outline-stil (sekundar — saljs ej direkt) */
.brxe-woocommerce-products ul.products li.product a.button.ring-salj,
.woocommerce ul.products li.product a.button.ring-salj {
  background: var(--t8-white) !important;
  color: var(--t8-pink) !important;
  border: 1px solid var(--t8-pink) !important;
}
.brxe-woocommerce-products ul.products li.product a.button.ring-salj:hover,
.woocommerce ul.products li.product a.button.ring-salj:hover {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
}

/* Wishlist-hjarta — top-right pa kortet */
.brxe-woocommerce-products ul.products li.product .tinv-wraper {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 2;
}
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: var(--t8-white) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.08);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: none !important;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button::before {
  font-family: 'team8' !important;
  content: "\eab9" !important;
  font-size: 16px !important;
  color: var(--t8-dark-soft) !important;
  line-height: 1 !important;
}
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button:hover::before,
.brxe-woocommerce-products ul.products li.product .tinvwl-product-in-list::before {
  color: var(--t8-pink) !important;
}
.brxe-woocommerce-products ul.products li.product .tinv-wraper .tinvwl-tooltip {
  display: none !important;
}
/* Dolj eventuell extra ikon fran plugin */
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button svg,
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button i:not(.team8-icon) {
  display: none !important;
}

/* Pagination */
.brxe-woocommerce-products .woocommerce-pagination,
.woocommerce-pagination {
  margin: 40px 0 0 0 !important;
  text-align: center;
}
.brxe-woocommerce-products .woocommerce-pagination ul.page-numbers,
.woocommerce-pagination ul.page-numbers {
  display: inline-flex !important;
  gap: 4px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}
.brxe-woocommerce-products .woocommerce-pagination ul.page-numbers li,
.woocommerce-pagination ul.page-numbers li {
  margin: 0 !important;
  border: none !important;
}
.brxe-woocommerce-products .woocommerce-pagination ul.page-numbers .page-numbers,
.woocommerce-pagination ul.page-numbers .page-numbers {
  min-width: 40px;
  height: 40px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 0 12px !important;
  border-radius: 8px !important;
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: 1px solid var(--t8-border) !important;
  line-height: 1 !important;
  transition: background .15s, color .15s, border-color .15s;
}
.brxe-woocommerce-products .woocommerce-pagination ul.page-numbers .page-numbers.current,
.woocommerce-pagination ul.page-numbers .page-numbers.current {
  background: var(--t8-dark) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-dark) !important;
}
.brxe-woocommerce-products .woocommerce-pagination ul.page-numbers a.page-numbers:hover,
.woocommerce-pagination ul.page-numbers a.page-numbers:hover {
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border-color: var(--t8-pink) !important;
}

/* Saknat resultat-meddelande */
.brxe-woocommerce-products .woocommerce-info,
.woocommerce-info {
  background: var(--t8-white);
  border: 1px solid var(--t8-border);
  border-radius: 12px;
  padding: 16px 20px;
  font-family: var(--t8-font-body);
  font-size: 14px;
  color: var(--t8-dark);
}

/* ==========================================================================
   FIX: Pris + /man tight — font-size:0 kollapsar mellanslags-tecknet
   ========================================================================== */
.t8-cart .woocommerce-checkout-review-order-table .product-total {
  font-size: 0 !important;
}
.t8-cart .woocommerce-checkout-review-order-table .product-total .amount,
.t8-cart .woocommerce-checkout-review-order-table .product-total .woocommerce-Price-amount {
  font-size: 14px !important;
  font-family: var(--t8-font-body) !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
}
.t8-cart .woocommerce-checkout-review-order-table .product-total small.ingram-mst-cart-suffix {
  font-size: 12px !important;
  margin-left: 2px !important;
}

/* ==========================================================================
   FIX: Ta bort Bricks-default 20px padding pa #payment
   ========================================================================== */
.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-checkout-payment {
  padding: 0 !important;
}

/* ==========================================================================
   FIX: Rabattkod kompakt + fal-funktion (default hidden, JS toggle)
   ========================================================================== */

/* Hela before-checkout-area kompakt */
.woocommerce-checkout .before-checkout {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 20px 48px 0 48px !important;
}

/* Mindre pill ("Har du en rabattkod?") */
.woocommerce-checkout .before-checkout .woocommerce-info {
  padding: 8px 16px !important;
  margin: 0 !important;
  font-size: 13px !important;
  border-radius: 8px !important;
  min-height: 0 !important;
}
.woocommerce-checkout .before-checkout .woocommerce-info a.showcoupon {
  font-size: 13px !important;
}
.woocommerce-checkout .before-checkout .woocommerce-info a.showcoupon::after {
  font-size: 10px !important;
}

/* Coupon-formet kompakt — INGEN default display-regel, lat WC JS sty toggle */
.woocommerce-checkout .before-checkout .checkout_coupon {
  padding: 10px 12px !important;
  border-radius: 8px !important;
  margin-top: 8px !important;
  gap: 8px !important;
  overflow: hidden;
}
/* Nar JS slideToggle visar formet, gor det till flex sa layout stammer */
.woocommerce-checkout .before-checkout .checkout_coupon[style*="display: block"],
.woocommerce-checkout .before-checkout .checkout_coupon[style*="display:block"] {
  display: flex !important;
}

/* P-wrappers fyller utrymmet — input bred, knapp tight */
.woocommerce-checkout .before-checkout .checkout_coupon p.form-row-first {
  flex: 1 1 auto !important;
  width: auto !important;
  float: none !important;
  margin: 0 !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon p.form-row-last {
  flex: 0 0 auto !important;
  width: auto !important;
  float: none !important;
  margin: 0 !important;
}

/* Kompakt input + knapp */
.woocommerce-checkout .before-checkout .checkout_coupon input[type="text"] {
  width: 100% !important;
  padding: 8px 12px !important;
  font-size: 13px !important;
  min-height: 36px !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 6px !important;
  background: var(--t8-white) !important;
  color: var(--t8-dark) !important;
  outline: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon input[type="text"]:focus {
  border-color: var(--t8-pink) !important;
  outline: none !important;
  box-shadow: none !important;
}
.woocommerce-checkout .before-checkout .checkout_coupon button {
  padding: 8px 16px !important;
  font-size: 13px !important;
  min-height: 36px !important;
  border-radius: 6px !important;
  white-space: nowrap;
}

/* ==========================================================================
   FIX: Article-bg matchar page-bg pa checkout (light grey hela vagen ut)
   ========================================================================== */
body.woocommerce-checkout #brx-content,
body.woocommerce-checkout article#brx-content,
body.woocommerce-checkout .brxe-container.before-checkout {
  background: var(--t8-light) !important;
}

/* ==========================================================================
   FIX: Sokresultat / shop-arkiv — bild-bg vit, knappar fullbredd, hjarta in i kortet
   ========================================================================== */

/* Vit bakgrund pa produktbilden (var grey) */
.brxe-woocommerce-products ul.products li.product img,
.woocommerce ul.products li.product img {
  background: var(--t8-white) !important;
}

/* Knapparna: fullbredd, samma pink-stil for bade "Valj kopsatt" och "Ring salj" */
.brxe-woocommerce-products ul.products li.product a.button,
.brxe-woocommerce-products ul.products li.product a.button.ring-salj,
.brxe-woocommerce-products ul.products li.product a.button.add_to_cart_button,
.woocommerce ul.products li.product a.button {
  display: block !important;
  width: auto !important;
  align-self: stretch !important;
  text-align: center !important;
  margin: 0 16px 16px 16px !important;
  padding: 12px 18px !important;
  background: var(--t8-pink) !important;
  color: var(--t8-white) !important;
  border: none !important;
  border-radius: 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  line-height: 1.3 !important;
  cursor: pointer;
  transition: background .15s ease;
  box-sizing: border-box;
}
.brxe-woocommerce-products ul.products li.product a.button:hover,
.brxe-woocommerce-products ul.products li.product a.button.ring-salj:hover,
.woocommerce ul.products li.product a.button:hover {
  background: var(--t8-pink-dark) !important;
  color: var(--t8-white) !important;
}

/* ----- Wishlist-hjarta: in i kortet (top-right corner) ----- */

/* Wrapper — strong override mot plugin */
.brxe-woocommerce-products ul.products li.product .tinv-wraper,
.brxe-woocommerce-products ul.products li.product div.tinv-wraper.tinvwl-after-add-to-cart {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  left: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 5 !important;
  display: block !important;
}

/* Knapp — runda vita pillen */
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button,
.brxe-woocommerce-products ul.products li.product .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart.no-txt,
.brxe-woocommerce-products ul.products li.product a.tinvwl_add_to_wishlist_button.tinvwl-icon-heart {
  position: relative !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 50% !important;
  background: var(--t8-white) !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.12) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  cursor: pointer;
  transition: background .15s ease;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: hidden;
}

/* Plugin's egna heart-pseudo overridas till team8-iconheart */
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button::before,
.brxe-woocommerce-products ul.products li.product .tinvwl-icon-heart::before,
.brxe-woocommerce-products ul.products li.product .tinvwl-icon-heart-plus::before,
.brxe-woocommerce-products .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart.no-txt::before,
.brxe-woocommerce-products .tinv-wishlist .tinvwl_add_to_wishlist_button.tinvwl-icon-heart-plus.no-txt::before {
  font-family: 'team8' !important;
  content: "\eab9" !important;
  font-size: 16px !important;
  font-weight: normal !important;
  color: var(--t8-dark-soft) !important;
  line-height: 1 !important;
  display: inline-block !important;
  background: none !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  /* Reset plugin's absolut-centrering — vi anvander flex pa parent istallet */
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  transform: none !important;
  -webkit-font-smoothing: antialiased;
}
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button::after {
  display: none !important;
  content: none !important;
}

/* Hover/aktiv = pink */
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button:hover::before,
.brxe-woocommerce-products ul.products li.product .tinvwl-product-in-list::before {
  color: var(--t8-pink) !important;
}
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button:hover {
  background: var(--t8-white) !important;
}

/* Dolj tooltip */
.brxe-woocommerce-products ul.products li.product .tinv-wraper .tinvwl-tooltip {
  display: none !important;
}

/* Dolj eventuell SVG/img fran plugin inom button */
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button svg,
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button img,
.brxe-woocommerce-products ul.products li.product .tinvwl_add_to_wishlist_button i:not([class*="team8"]) {
  display: none !important;
}

/* ==========================================================================
   TACK-SIDAN (woocommerce-checkout-thankyou) — bekraftelse efter kop
   ========================================================================== */

/* Wrapper-card runt hela tack-innehallet */
.brxe-woocommerce-checkout-thankyou {
  background: var(--t8-white) !important;
  border-radius: 16px !important;
  padding: 40px !important;
  box-sizing: border-box;
}
@media (max-width: 767px) {
  .brxe-woocommerce-checkout-thankyou {
    padding: 24px !important;
  }
}

/* "Tack!"-meddelandet — gron success-pill */
.brxe-woocommerce-checkout-thankyou .woocommerce-thankyou-order-received,
.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received {
  background: #e6f4ed !important;
  color: #1e7d50 !important;
  border: 1px solid #c8e6d4 !important;
  border-radius: 12px !important;
  padding: 18px 24px !important;
  margin: 0 0 28px 0 !important;
  font-family: var(--t8-font-body) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  text-align: center !important;
  line-height: 1.4 !important;
}
.brxe-woocommerce-checkout-thankyou .woocommerce-thankyou-order-received::before {
  content: "✓ ";
  margin-right: 4px;
}

/* Tacksida — dölj faktureringsadress-kolumnen */
.woocommerce-order-received .woocommerce-column--billing-address,
.brxe-woocommerce-checkout-thankyou .woocommerce-column--billing-address {
  display: none !important;
}
.woocommerce-order-received .woocommerce-customer-details .woocommerce-columns--2,
.brxe-woocommerce-checkout-thankyou .woocommerce-customer-details .woocommerce-columns--2 {
  display: block !important;
}
.woocommerce-order-received .woocommerce-customer-details .woocommerce-column--shipping-address,
.brxe-woocommerce-checkout-thankyou .woocommerce-customer-details .woocommerce-column--shipping-address {
  width: 100% !important;
  max-width: none !important;
}

/* Order-overview ul — 2x2 grid med 1px-divider */
.brxe-woocommerce-checkout-thankyou .woocommerce-order-overview,
.woocommerce-order-overview.woocommerce-thankyou-order-details {
  list-style: none !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1px !important;
  background: var(--t8-border) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  padding: 0 !important;
  margin: 0 0 32px 0 !important;
}
@media (max-width: 559px) {
  .brxe-woocommerce-checkout-thankyou .woocommerce-order-overview,
  .woocommerce-order-overview.woocommerce-thankyou-order-details {
    grid-template-columns: 1fr !important;
  }
}
.brxe-woocommerce-checkout-thankyou .woocommerce-order-overview li,
.woocommerce-order-overview.woocommerce-thankyou-order-details li {
  background: var(--t8-white) !important;
  padding: 18px 20px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 13px !important;
  color: var(--t8-dark-soft) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  margin: 0 !important;
  border: none !important;
}
.brxe-woocommerce-checkout-thankyou .woocommerce-order-overview li strong,
.woocommerce-order-overview.woocommerce-thankyou-order-details li strong {
  font-family: var(--t8-font-body) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  display: block;
}

/* Beställningsdetaljer-sektion */
.brxe-woocommerce-checkout-thankyou .woocommerce-order-details {
  margin: 0;
}
.brxe-woocommerce-checkout-thankyou .woocommerce-order-details__title,
.woocommerce-order-details h2.woocommerce-order-details__title {
  font-family: var(--t8-font-body) !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  margin: 0 0 20px 0 !important;
  padding: 0 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Order details-tabell */
.brxe-woocommerce-checkout-thankyou .shop_table.order_details {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  margin: 0 0 28px 0 !important;
  background: transparent !important;
  border: none !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details thead th {
  font-family: var(--t8-font-body) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--t8-dark-soft) !important;
  padding: 0 0 12px 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
  background: transparent !important;
  text-align: left !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details thead .product-total {
  text-align: right !important;
}

/* tbody — product-rader */
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tbody tr.order_item td {
  padding: 16px 0 !important;
  vertical-align: top !important;
  border-bottom: 1px solid var(--t8-border) !important;
  background: transparent !important;
  border-top: none !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details .product-name {
  color: var(--t8-dark) !important;
  font-weight: 500 !important;
  font-family: var(--t8-font-body) !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details .product-quantity {
  font-family: var(--t8-font-body) !important;
  font-weight: 600 !important;
  color: var(--t8-dark-soft) !important;
  font-size: 12px !important;
  margin-left: 4px !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details .product-total {
  text-align: right !important;
  font-family: var(--t8-font-body) !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  white-space: nowrap !important;
}

/* tfoot — totals */
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot th,
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot td {
  padding: 10px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  background: transparent !important;
  border: none !important;
  vertical-align: middle !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot th {
  text-align: left !important;
  font-weight: 500 !important;
  color: var(--t8-dark-soft) !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot td {
  text-align: right !important;
  font-family: var(--t8-font-body) !important;
  font-weight: 600 !important;
  color: var(--t8-dark) !important;
  white-space: nowrap !important;
}
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot td .shipped_via {
  font-family: var(--t8-font-body) !important;
  font-weight: 500 !important;
  color: var(--t8-dark-soft) !important;
  font-size: 12px !important;
  margin-left: 2px;
}

/* Totalt-raden (forsta tfoot tr som ar "Totalt:") — extra framtradande */
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot tr:has(th:is(:not(:empty))) {
  /* fallback for browsers utan :has — vi targeting via tr-position nedan */
}
/* Forenklat: target Totalt och Betalningsmetod stargre */
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot tr:nth-last-child(2) th,
.brxe-woocommerce-checkout-thankyou .shop_table.order_details tfoot tr:nth-last-child(2) td {
  font-size: 16px !important;
  font-weight: 700 !important;
  color: var(--t8-dark) !important;
  padding-top: 14px !important;
  border-top: 1px solid var(--t8-border) !important;
}

/* Order-detail extra paragrafer (org.nr, E-post, Telefon) */
.brxe-woocommerce-checkout-thankyou .woocommerce-order-details > p {
  margin: 0 0 8px 0 !important;
  padding: 12px 16px !important;
  background: var(--t8-light) !important;
  border-radius: 8px !important;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  color: var(--t8-dark) !important;
  line-height: 1.5;
}
.brxe-woocommerce-checkout-thankyou .woocommerce-order-details > p strong {
  color: var(--t8-dark-soft) !important;
  font-weight: 600 !important;
  margin-right: 4px;
}
.brxe-woocommerce-checkout-thankyou .woocommerce-order-details > p:last-child {
  margin-bottom: 0 !important;
}

/* ==========================================================================
   "Logga in for att se pris" — placeholder for utloggade
   Tonad ner sa den inte tar over som om det vore ett pris
   ========================================================================== */
.t8-login-to-see-price,
.t8-login-to-see-price *,
.brxe-product-price .t8-login-to-see-price,
.brxe-product-price .t8-login-to-see-price * {
  display: inline-block !important;
  font-family: 'Manrope', system-ui, -apple-system, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  line-height: 1.4 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  text-decoration: none !important;
  font-style: normal !important;
  margin: 0 !important;
  padding: 0 !important;
}
.t8-login-to-see-price a,
.t8-login-to-see-price a:visited,
.t8-login-to-see-price a:hover,
.t8-login-to-see-price a:focus {
  color: var(--t8-dark) !important;
  text-decoration: none !important;
  border-bottom: none !important;
}

/* Dolj tomma p.price som WC/Bricks renderar runt placeholder */
.brxe-product-price:has(.t8-login-to-see-price) p.price:empty {
  display: none !important;
}

/* ==========================================================================
   MOBIL — fixar fran feedback
   ========================================================================== */

/* "Logga in for pris" — nu ren text-span (utan inre <a>), bra lokmark */
.t8-login-to-see-price {
  display: block !important;
  font-family: 'Manrope', system-ui, -apple-system, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  text-transform: none !important;
  font-style: normal !important;
  letter-spacing: 0 !important;
  margin: 4px 0 0 0 !important;
  padding: 0 !important;
}

/* Dolj den separata <a> som WP HTML-parsern drog ut fran tidigare versioner
   (kanske finns kvar i cache pa nan sida) */
.brxe-woocommerce-products ul.products li.product > a[href*="mitt-konto"],
.woocommerce ul.products li.product > a[href*="mitt-konto"] {
  display: none !important;
}

/* Mobil: kompakta kategori-rutor (var 240px min-height, aspect-ratio 1/1, padding 32x28) */
@media (max-width: 991px) {
  .t8-cat-card {
    aspect-ratio: auto !important;
    min-height: 0 !important;
    height: auto !important;
    padding: 16px 16px 56px 16px !important;
    border-radius: 14px !important;
  }
  .t8-cat-card__icon {
    width: 36px !important;
    height: 36px !important;
    border-radius: 8px !important;
    margin-bottom: 14px !important;
  }
  .t8-cat-card__icon i {
    font-size: 16px !important;
  }
  .t8-cat-card__name {
    font-size: 15px !important;
    margin-bottom: 2px !important;
  }
  .t8-cat-card__count {
    font-size: 12px !important;
  }
  .t8-cat-card__arrow {
    width: 28px !important;
    height: 28px !important;
    bottom: 14px !important;
    right: 14px !important;
  }
  .t8-cat-card__arrow i {
    font-size: 12px !important;
  }
}

/* Mobil-navbar: standardisera ikon-storlek + mer luft mellan */
@media (max-width: 991px) {
  /* Mer luft mellan ikonerna (var 8px, nu 18px) + vertikal centrering */
  #brxe-dpwjnq {
    column-gap: 18px !important;
    gap: 18px !important;
    align-items: center !important;
  }
  /* Alla a-wrappers (heart, user, search, cart) — flex med nollad line-height
     sa SVG-en inte far extra vertical space och allt linjerar */
  #brxe-dpwjnq > a,
  #brxe-dpwjnq .bricks-link-wrapper,
  #brxe-dpwjnq .dgwt-wcas-search-icon,
  #brxe-dpwjnq .js-dgwt-wcas-enable-mobile-form,
  #brxe-dpwjnq .mini-cart-link,
  #brxe-dpwjnq .dgwt-wcas-search-wrapp,
  #brxe-dpwjnq .brxe-woocommerce-mini-cart {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    height: 18px !important;
    vertical-align: middle !important;
  }
  /* Cart wrapper ar lite hogre pga badge — tillat */
  #brxe-dpwjnq .brxe-woocommerce-mini-cart {
    height: auto !important;
    position: relative;
  }
  #brxe-dpwjnq .brxe-woocommerce-mini-cart .cart-icon {
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1 !important;
    position: relative;
  }
  /* Search-ikonen fran dgwt-wcas pluginet */
  .dgwt-wcas-search-wrapp .dgwt-wcas-ico-magnifier-handler,
  .dgwt-wcas-search-wrapp .dgwt-wcas-ico-magnifier,
  .dgwt-wcas-search-wrapp svg {
    width: 18px !important;
    height: 18px !important;
  }
  /* Alla brxe-icon i mobile navbar — samma storlek */
  #brxe-dpwjnq svg,
  #brxe-dpwjnq .brxe-icon {
    width: 18px !important;
    height: 18px !important;
  }
  /* Cart-ikon konsekvent */
  #brxe-dpwjnq .brxe-woocommerce-mini-cart .cart-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
  /* Cart-count-badge mindre och tightare placerad */
  #brxe-dpwjnq .brxe-woocommerce-mini-cart .cart-count {
    font-size: 10px !important;
    min-width: 16px !important;
    height: 16px !important;
    line-height: 16px !important;
    padding: 0 4px !important;
    top: -6px !important;
    right: -8px !important;
  }
}

/* Mobil: Genvagar-raden — label egen rad, items som horisontell scroll-strip */
@media (max-width: 767px) {
  .t8-shortcuts {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding: 16px 0 !important;
    overflow: visible !important;
  }
  /* Label-delen (forsta barnet — "→ GENVÄGAR") */
  .t8-shortcuts > :first-child {
    white-space: nowrap !important;
  }
  /* Container med items — gor till horisontell scroll-strip */
  .t8-shortcuts > :not(:first-child) {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .t8-shortcuts > :not(:first-child)::-webkit-scrollbar {
    display: none;
  }
  /* Items pa egen scroll-rad */
  .t8-shortcut {
    flex-shrink: 0;
    padding: 6px 10px;
    background: var(--t8-white);
    border: 1px solid var(--t8-border);
    border-radius: 999px;
    font-size: 12px;
  }
  .t8-shortcut .t8-count {
    font-size: 10px;
    padding: 1px 5px;
  }
}

/* ==========================================================================
   Mobil drawer (offcanvas #brxe-9918a9) — fixa height-chain + scroll-funktion
   sa IKS-menyn inte spranger ut layout nar den ar lang
   ========================================================================== */

/* Offcanvas height styrs via Bricks (inner block 100vh pa tablet portrait).
   Vi rorr inte #brxe-9918a9 sjalv — Bricks position/transform/visibility ska vinna. */

/* IKS-menyn (rzzibs / gontor) — overriding plugin-defaults + tighter spacing */
#brxe-rzzibs .iksm-container,
#brxe-rzzibs .iksm-terms,
#brxe-rzzibs .iksm-terms-tree,
#brxe-rzzibs .iksm-terms-tree__inner,
#brxe-gontor .iksm-container,
#brxe-gontor .iksm-terms,
#brxe-gontor .iksm-terms-tree,
#brxe-gontor .iksm-terms-tree__inner {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  overflow: visible !important;
  transform: none !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
#brxe-rzzibs .iksm-term,
#brxe-gontor .iksm-term {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
#brxe-rzzibs .iksm-term__inner,
#brxe-gontor .iksm-term__inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 15px !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--t8-border) !important;
  min-height: 0 !important;
}
#brxe-rzzibs .iksm-term__link,
#brxe-gontor .iksm-term__link {
  flex: 1 1 auto;
  font-family: var(--t8-font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
  text-decoration: none !important;
  padding: 4px 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
}
#brxe-rzzibs .iksm-term__posts-count,
#brxe-gontor .iksm-term__posts-count {
  color: var(--t8-dark-soft);
  font-size: 12px;
}
#brxe-rzzibs .iksm-term__toggle,
#brxe-gontor .iksm-term__toggle {
  flex-shrink: 0;
  cursor: pointer;
  padding: 4px 8px;
}
#brxe-rzzibs .iksm-terms-tree--children,
#brxe-gontor .iksm-terms-tree--children {
  padding-left: 16px !important;
  margin: 4px 0 0 0 !important;
}
#brxe-rzzibs .iksm-terms-tree--children .iksm-term__link,
#brxe-gontor .iksm-terms-tree--children .iksm-term__link {
  font-size: 13px !important;
  color: var(--t8-dark-soft) !important;
}

/* ==========================================================================
   Mobil drawer — polish efter rebuild
   ========================================================================== */

/* Headern (msfoti) — logo + stang exakt centrerade pa samma rad */
#brxe-msfoti {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-shrink: 0 !important;
  min-height: 0 !important;
  line-height: 1 !important;
}
#brxe-msfoti > * {
  align-self: center !important;
}
#brxe-msfoti #brxe-yvrlgq {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px !important;
  flex: 0 1 auto !important;
  line-height: 1 !important;
}
#brxe-msfoti #brxe-87e7bbl {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
  line-height: 1 !important;
  height: auto !important;
}
#brxe-msfoti #brxe-a2a6b4 {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 4px !important;
}

/* IKS-menyn (gontor) — ingen padding, sa dividers gar hela vagen ut */
#brxe-rzzibs,
#brxe-gontor {
  padding: 0 !important;
  margin-bottom: 16px !important;
}

/* rwcrly: Mitt konto + Favoriter — flex puffar med pink hover */
#brxe-rwcrly {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  gap: 10px !important;
  padding: 0 15px !important;
}
#brxe-a8b241a,
#brxe-a8b241f {
  flex: 1 1 0 !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 14px 10px !important;
  background: var(--t8-white) !important;
  border: 1px solid var(--t8-border) !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .1s ease;
}
#brxe-a8b241a:hover,
#brxe-a8b241f:hover {
  background: var(--t8-pink) !important;
  border-color: var(--t8-pink) !important;
  transform: translateY(-1px);
}
/* Hover: vit text + vit ikon */
#brxe-a8b241a:hover .brxe-text-basic,
#brxe-a8b241f:hover .brxe-text-basic {
  color: var(--t8-white) !important;
}
#brxe-a8b241a:hover svg path,
#brxe-a8b241f:hover svg path {
  fill: var(--t8-white) !important;
}
#brxe-a8b241a:active,
#brxe-a8b241f:active {
  transform: translateY(0);
}
/* Knapptext (Mitt konto / Favoriter) */
#brxe-a8b241at,
#brxe-a8b241ft,
#brxe-rwcrly span.brxe-text-basic {
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--t8-dark) !important;
}

/* Extra overrides för ledtexter */
/* Detta läggs sist så reglerna inte skrivs över av Bricks / plugin-css */
h1, h2, .t8-h-hero, .t8-h-section {
  font-family: 'Paytone One', sans-serif !important;
  font-weight: 500 !important;
}

.t8-product-card__title,
.t8-cat-card__name,
h3, h4, h5, h6, .t8-h-panel, .t8-h-card, .t8-h-cat,
.brxe-subheading, .brxe-text-subheading {
  font-family: 'Manrope', sans-serif !important;
}

/* bagnlq (phone + email kontaktblock) — separator + padding */
#brxe-bagnlq,
#brxe-bgdgtq {
  border-top: 1px solid var(--t8-border) !important;
  padding: 15px !important;
  margin-top: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

/* Phone + email — mono, gra, hover pink */
#brxe-bagnlq #brxe-514290,
#brxe-bagnlq #brxe-f6b331,
#brxe-bgdgtq #brxe-514290,
#brxe-bgdgtq #brxe-f6b331 {
  display: block !important;
  font-family: var(--t8-font-body) !important;
  font-size: 12px !important;
  color: var(--t8-dark-soft) !important;
  text-decoration: none !important;
  padding: 4px 0 !important;
  line-height: 1.4 !important;
}
#brxe-bagnlq #brxe-514290:hover,
#brxe-bagnlq #brxe-f6b331:hover,
#brxe-bgdgtq #brxe-514290:hover,
#brxe-bgdgtq #brxe-f6b331:hover {
  color: var(--t8-pink) !important;
}


/* ==========================================================================
   HANTERA 2.0 — landing page styles
   ========================================================================== */

/* Jamforelse-tabell */
.t8-compare {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--t8-border);
  border-radius: 12px;
  overflow: hidden;
  font-family: var(--t8-font-body);
}
.t8-compare__head,
.t8-compare__row {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr;
}
.t8-compare__head {
  background: var(--t8-dark);
}
.t8-compare__row {
  border-top: 1px solid var(--t8-border);
}
.t8-compare__row:nth-child(odd) {
  background: var(--t8-light);
}
.t8-compare__cell {
  padding: 16px 18px;
  font-size: 14px;
  color: var(--t8-dark);
  display: flex;
  align-items: center;
  border-right: 1px solid var(--t8-border);
}
.t8-compare__cell:last-child {
  border-right: none;
}
.t8-compare__cell--head {
  font-family: var(--t8-font-mono);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--t8-white);
  padding: 14px 18px;
}
.t8-compare__cell--old {
  color: var(--t8-dark-soft);
}
.t8-compare__cell--new {
  color: var(--t8-pink);
  font-weight: 600;
}
.t8-compare__cell--new::before {
  content: "✓";
  margin-right: 8px;
  font-weight: 700;
  color: var(--t8-pink);
}
.t8-compare__cell--old::before {
  content: "✕";
  margin-right: 8px;
  color: var(--t8-dark-soft);
}

@media (max-width: 767px) {
  .t8-compare__head,
  .t8-compare__row {
    grid-template-columns: 1fr;
  }
  .t8-compare__cell {
    border-right: none;
    border-bottom: 1px solid var(--t8-border);
    padding: 12px 16px;
  }
  .t8-compare__row .t8-compare__cell:first-child {
    background: var(--t8-light);
    font-weight: 600;
  }
  .t8-compare__head .t8-compare__cell:not(:last-child) {
    border-bottom-color: rgba(255,255,255,0.2);
  }
}