/* =============================================================
   TM24 Master Header Design-System
   Einheitliche Tokens für Shop, Ankauf & B2B
   Version: 1.0.0 – 2026-03-04
   ============================================================= */

:root {
  /* ── Farben ── */
  --tm-blue: #2E2BCB;
  --tm-blue-dark: #1a1278;
  --tm-text: #111;
  --tm-muted: #6b7280;
  --tm-bg: #fff;
  --tm-border: #eee;
  --tm-input-bg: #f0f0f5;
  --tm-input-border: #e0e0e6;
  --tm-focus-shadow: rgba(46, 43, 203, 0.15);

  /* ── Topbar ── */
  --topbar-bg: linear-gradient(90deg, #1a1278 0%, #2E2BCB 50%, #1a1278 100%);
  --topbar-color: #fff;
  --topbar-font: 12px;
  --topbar-weight: 600;
  --topbar-spacing: 0.3px;
  --topbar-py: 8px;
  --topbar-gap: 28px;

  /* ── Header ── */
  --header-bg: #fff;
  --header-py: 16px;
  --header-border: 1px solid #eee;
  --header-z: 100;

  /* ── Logo ── */
  --logo-size: 26px;
  --logo-weight: 900;
  --logo-color: var(--tm-blue);
  --logo-span: #111;

  /* ── Pills ── */
  --pill-px: 16px;
  --pill-py: 8px;
  --pill-radius: 50px;
  --pill-font: 14px;
  --pill-weight: 600;
  --pill-color: #444;
  --pill-bg: transparent;
  --pill-border: 1px solid #ddd;
  --pill-gap: 6px;
  --pill-hover-bg: #f0f0f5;
  --pill-active-bg: var(--tm-blue);
  --pill-active-color: #fff;
  --pill-active-border: var(--tm-blue);
  --pill-sell-bg: transparent;
  --pill-sell-border: #2ecc71;
  --pill-sell-color: #2ecc71;
  --pill-sell-active-bg: #2ecc71;
  --pill-sell-active-color: #fff;

  /* ── Suche ── */
  --search-max-w: 420px;
  --search-mx: 20px;
  --search-radius: 50px;
  --search-bg: var(--tm-input-bg);
  --search-border: 1px solid var(--tm-input-border);
  --search-font: 14px;
  --search-py: 10px;
  --search-px: 16px;
  --search-pl: 40px;

  /* ── Icon-Links ── */
  --icon-color: #6b7280;
  --icon-hover: var(--tm-blue);
  --icon-size: 22px;
  --icon-label: 11px;
  --icon-label-weight: 500;
  --icon-gap: 2px;

  /* ── Burger ── */
  --burger-line-w: 24px;
  --burger-line-h: 2.5px;
  --burger-line-c: #333;
  --burger-line-r: 2px;
  --burger-gap: 5px;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   TOPBAR  (Klasse: [bereich]-topbar)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-topbar,
.ankauf-topbar,
.b2b-topbar {
  background: var(--topbar-bg);
  color: var(--topbar-color);
  font-size: var(--topbar-font);
  font-weight: var(--topbar-weight);
  letter-spacing: var(--topbar-spacing);
  padding: var(--topbar-py) 0;
  text-align: center;
}

.shop-topbar-inner,
.ankauf-topbar-inner,
.b2b-topbar-inner {
  display: flex;
  justify-content: center;
  gap: var(--topbar-gap);
  flex-wrap: wrap;
}

.shop-topbar-inner span,
.ankauf-topbar-inner span,
.b2b-topbar-inner span {
  white-space: nowrap;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HEADER  (Klasse: [bereich]-header)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-header,
.ankauf-header,
.b2b-header {
  background: var(--header-bg);
  padding: var(--header-py) 0;
  border-bottom: var(--header-border);
  position: sticky;
  top: 0;
  z-index: var(--header-z);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   LOGO  (Klasse: [bereich]-logo)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-logo,
.ankauf-logo,
.b2b-logo {
  font-weight: var(--logo-weight);
  font-size: var(--logo-size);
  color: var(--logo-color);
  text-decoration: none !important;
}

.shop-logo span,
.ankauf-logo span,
.b2b-logo span {
  color: var(--logo-span);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   PILLS  (Klasse: [bereich]-pills / [bereich]-pill)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-pills,
.ankauf-pills,
.b2b-pills {
  display: flex;
  gap: var(--pill-gap);
  align-items: center;
  flex-wrap: nowrap;
}

.shop-pill,
.ankauf-pill,
.b2b-pill {
  display: inline-flex;
  align-items: center;
  padding: var(--pill-py) var(--pill-px);
  border-radius: var(--pill-radius);
  font-size: var(--pill-font);
  font-weight: var(--pill-weight);
  color: var(--pill-color);
  background: var(--pill-bg);
  border: var(--pill-border);
  text-decoration: none;
  transition: all 0.2s ease;
  white-space: nowrap;
}

.shop-pill:hover,
.ankauf-pill:hover,
.b2b-pill:hover {
  background: var(--pill-hover-bg);
  text-decoration: none;
  color: var(--pill-color);
}

.shop-pill.is-active,
.ankauf-pill.is-active,
.b2b-pill.is-active {
  background: var(--pill-active-bg);
  color: var(--pill-active-color);
  border-color: var(--pill-active-border);
}

.shop-pill.is-active:hover,
.ankauf-pill.is-active:hover,
.b2b-pill.is-active:hover {
  opacity: 0.9;
}

/* Verkaufen-Pill (grün) */
.shop-pill.is-sell,
.ankauf-pill.is-sell,
.b2b-pill.is-sell {
  background: var(--pill-sell-bg);
  border-color: var(--pill-sell-border);
  color: var(--pill-sell-color);
}

.shop-pill.is-sell:hover,
.ankauf-pill.is-sell:hover,
.b2b-pill.is-sell:hover {
  background: rgba(46, 204, 113, 0.08);
}

.shop-pill.is-sell.is-active,
.ankauf-pill.is-sell.is-active,
.b2b-pill.is-sell.is-active {
  background: var(--pill-sell-active-bg);
  color: var(--pill-sell-active-color);
  border-color: var(--pill-sell-active-bg);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   ICON-LINKS  (Klasse: [bereich]-icon-link)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-icon-link,
.ankauf-icon-link,
.b2b-icon-link {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: var(--icon-gap);
  text-decoration: none;
  color: var(--icon-color);
  transition: color 0.2s;
}

.shop-icon-link:hover,
.ankauf-icon-link:hover,
.b2b-icon-link:hover {
  color: var(--icon-hover);
  text-decoration: none;
}

.shop-icon-link i,
.ankauf-icon-link i,
.b2b-icon-link i {
  font-size: var(--icon-size);
}

.shop-icon-link span,
.ankauf-icon-link span,
.b2b-icon-link span {
  font-size: var(--icon-label);
  font-weight: var(--icon-label-weight);
  white-space: nowrap;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   SUCHE  (Klasse: [bereich]-suche-*)
   Nur Shop + Ankauf – B2B hat KEINE Suche
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-search,
.ankauf-suche-wrapper,
.ankauf-search {
  flex: 1;
  max-width: var(--search-max-w);
  margin: 0 var(--search-mx);
  position: relative;
  z-index: 200;
}

.ankauf-suche-box {
  position: relative;
}

.shop-search-input,
.ankauf-suche-input,
.ankauf-search-input {
  width: 100%;
  padding: var(--search-py) var(--search-px) var(--search-py) var(--search-pl);
  font-size: var(--search-font);
  border-radius: var(--search-radius);
  background: var(--search-bg);
  border: var(--search-border);
  box-shadow: none;
  outline: none;
  transition: all 0.2s;
}

.shop-search-input:focus,
.ankauf-suche-input:focus,
.ankauf-search-input:focus {
  background: #fff;
  box-shadow: 0 2px 12px var(--tm-focus-shadow);
  border-color: var(--tm-blue);
}

.shop-search-input::placeholder,
.ankauf-suche-input::placeholder,
.ankauf-search-input::placeholder {
  color: #999;
}

.shop-search-icon,
.ankauf-suche-icon,
.ankauf-search-icon {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: #999;
  font-size: 14px;
  z-index: 2;
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   BURGER  (Klasse: [bereich]-burger-btn)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-burger-btn,
.ankauf-burger-btn,
.b2b-burger-btn {
  background: none;
  border: none;
  padding: 6px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: var(--burger-gap);
  z-index: 1001;
}

.shop-burger-btn span,
.ankauf-burger-btn span,
.b2b-burger-btn span {
  display: block;
  width: var(--burger-line-w);
  height: var(--burger-line-h);
  background: var(--burger-line-c);
  border-radius: var(--burger-line-r);
  transition: 0.3s;
}

.shop-burger-btn.active span:nth-child(1),
.ankauf-burger-btn.active span:nth-child(1),
.b2b-burger-btn.active span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

.shop-burger-btn.active span:nth-child(2),
.ankauf-burger-btn.active span:nth-child(2),
.b2b-burger-btn.active span:nth-child(2) {
  opacity: 0;
}

.shop-burger-btn.active span:nth-child(3),
.ankauf-burger-btn.active span:nth-child(3),
.b2b-burger-btn.active span:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   RESPONSIVE
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media (max-width: 768px) {

  .shop-topbar-inner,
  .ankauf-topbar-inner,
  .b2b-topbar-inner {
    gap: 12px;
    font-size: 11px;
  }

  .shop-search,
  .ankauf-suche-wrapper,
  .ankauf-search {
    display: none;
  }

  .shop-pills,
  .ankauf-pills,
  .b2b-pills {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   UTILITIES  (Bootstrap-Ersatz für B2B/Ankauf)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.d-none {
  display: none !important;
}

.d-flex {
  display: flex !important;
}

@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }

  .d-md-inline-flex {
    display: inline-flex !important;
  }

  .d-md-flex {
    display: flex !important;
  }
}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   MEGAMENU / CATSBAR  (Klasse: [bereich]-megamenu)
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.shop-catsbar,
.ankauf-catsbar,
.b2b-catsbar {
  background: #fff;
  border-bottom: 1px solid #eee;
  position: relative;
  z-index: 90;
}

.shop-megamenu,
.ankauf-megamenu {
  display: flex;
  justify-content: center;
}

.shop-megamenu-list,
.ankauf-megamenu-list {
  display: flex;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.shop-megamenu-item,
.ankauf-megamenu-item {
  position: relative;
}

.shop-megamenu-link,
.ankauf-megamenu-link {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 12px 16px;
  color: #000 !important;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  transition: color 0.2s;
}

.shop-megamenu-link:hover,
.ankauf-megamenu-link:hover {
  color: var(--tm-blue);
  text-decoration: none;
}

/* Panels: Standard hidden, sichtbar bei hover */
.shop-megapanel,
.ankauf-megapanel {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, .12);
  padding: 24px 28px;
  z-index: 999;
  min-width: 600px;
}

.shop-megamenu-item:hover>.shop-megapanel,
.ankauf-megamenu-item:hover>.ankauf-megapanel {
  display: block;
}

.shop-megapanel-inner,
.ankauf-megapanel-inner {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 20px;
}

.shop-mega-group,
.ankauf-mega-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.shop-mega-heading,
.ankauf-mega-heading {
  font-weight: 700;
  font-size: 13px;
  color: #111;
  margin-bottom: 4px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.shop-mega-sublink,
.ankauf-mega-sublink {
  color: #444 !important;
  text-decoration: none;
  font-size: 13px;
  padding: 3px 0;
  transition: color 0.2s;
}

.shop-mega-sublink:hover,
.ankauf-mega-sublink:hover {
  color: var(--tm-blue);
}

.shop-chevron,
.ankauf-chevron {
  transition: transform 0.2s;
}

.shop-megamenu-item:hover .shop-chevron,
.ankauf-megamenu-item:hover .ankauf-chevron {
  transform: rotate(180deg);
}

@media (max-width: 768px) {

  .shop-catsbar,
  .ankauf-catsbar {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .shop-megapanel,
  .ankauf-megapanel {
    position: fixed;
    left: 0;
    right: 0;
    transform: none;
    min-width: unset;
    border-radius: 0 0 12px 12px;
  }
}

/* Megapanel Grid-Varianten */
.shop-megapanel-3col,
.ankauf-megapanel-3col {
  grid-template-columns: repeat(3, 1fr);
}

.shop-megapanel-4col,
.ankauf-megapanel-4col {
  grid-template-columns: repeat(4, 1fr);
}

.shop-home-catsbar,
.ankauf-home-catsbar {
  padding: 0;
}



/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
   HEADER PIXELGLEICH – CSS GRID (Shop / Ankauf / B2B)
   3 Spalten: [Logo+Pills] | [Suche/Platzhalter] | [Icons+Burger]
   ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

/* ── Das Grid-Layout: EIN Container fuer alle 3 Seiten ── */
/* Ankauf-Standard: 1140px max-width, 15px Padding */
.tm24-header-grid {
  display: grid !important;
  grid-template-columns: max-content 1fr max-content;
  align-items: center;
  max-width: 1140px !important;
  width: 100% !important;
  margin: 0 auto !important;
  padding: 0 15px !important;
  gap: 20px;
  box-sizing: border-box !important;
}

/* ── Parent-Container neutralisieren (Shop hat Bootstrap .container) ── */
.shop-header .container,
.ankauf-header .container,
.b2b-header .container {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* ── Alle Direct-Child divs: gleiche Breite (ueberschreibt custom.css) ── */
.shop-header>.tm24-header-grid,
.ankauf-header>.tm24-header-grid,
.b2b-header>.tm24-header-grid,
.shop-header>div,
.ankauf-header>div,
.b2b-header>div {
  max-width: 1140px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
  box-sizing: border-box !important;
}

/* ── Links: Logo + Pills (schrumpft nicht) ── */
.tm24-header-left {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-shrink: 0;
}

/* ── Mitte: Suche, oder leerer Platzhalter bei B2B ── */
.tm24-header-center {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 40px;
}

/* ── Rechts: Icons + Burger ── */
.tm24-header-right {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-shrink: 0;
}

/* ── Defensive Order-Resets: verhindert dass custom.css die Reihenfolge umkehrt ── */
.tm24-header-grid>.tm24-header-left {
  order: 0 !important;
}

.tm24-header-grid>.tm24-header-center {
  order: 0 !important;
}

.tm24-header-grid>.tm24-header-right {
  order: 0 !important;
}

/* ── Logo: identisch ueberall ── */
.shop-logo,
.ankauf-logo,
.b2b-logo {
  font-size: 26px !important;
  font-weight: 900 !important;
  color: #111 !important;
  text-decoration: none !important;
  white-space: nowrap;
  letter-spacing: -0.5px;
}

.shop-logo span,
.ankauf-logo span,
.b2b-logo span {
  color: var(--tm-blue, #2E2BCB) !important;
  font-weight: 900 !important;
}

/* ── Pills: identisch ueberall ── */
.shop-pills,
.ankauf-pills,
.b2b-pills {
  display: flex !important;
  gap: 6px !important;
  align-items: center !important;
}

.shop-pill,
.ankauf-pill,
.b2b-pill {
  padding: 7px 18px !important;
  border-radius: 20px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  transition: all 0.2s !important;
  border: 1.5px solid transparent !important;
  color: #555 !important;
  background: transparent !important;
}

/* Aktive Pill */
.shop-pill.is-active,
.ankauf-pill.is-active,
.b2b-pill.is-active {
  background: var(--tm-blue, #2E2BCB) !important;
  color: #fff !important;
  border-color: var(--tm-blue, #2E2BCB) !important;
}

/* Sell-Pill (gruen wenn aktiv) */
.shop-pill.is-sell.is-active,
.ankauf-pill.is-sell.is-active,
.b2b-pill.is-sell.is-active {
  background: #16a34a !important;
  color: #fff !important;
  border-color: #16a34a !important;
}

/* Hover (nicht-aktive Pills) */
.shop-pill:not(.is-active):hover,
.ankauf-pill:not(.is-active):hover,
.b2b-pill:not(.is-active):hover {
  border-color: #ddd !important;
  background: #f5f5f5 !important;
  color: #111 !important;
}

/* ── Suche in der Mitte: flex-grow fuellt den Grid-Platz ── */
.tm24-header-center .header-suche-wrapper,
.tm24-header-center .ankauf-suche-wrapper,
.tm24-header-center .ankauf-search,
.tm24-header-center .shop-search {
  flex: 1;
  max-width: 420px;
  width: 100%;
  position: relative;
  z-index: 200;
}

/* ── Icons: identisch ueberall ── */
.shop-icon-link,
.ankauf-icon-link,
.b2b-icon-link,
.header-icon-link {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 2px !important;
  font-size: 11px !important;
  color: #555 !important;
  text-decoration: none !important;
  min-width: 56px !important;
  transition: color 0.2s !important;
}

.shop-icon-link:hover,
.ankauf-icon-link:hover,
.b2b-icon-link:hover,
.header-icon-link:hover {
  color: var(--tm-blue, #2E2BCB) !important;
  text-decoration: none !important;
}

.shop-icon-link i,
.ankauf-icon-link i,
.b2b-icon-link i,
.header-icon-link i {
  font-size: 20px !important;
}

.shop-icon-link span,
.ankauf-icon-link span,
.b2b-icon-link span,
.header-icon-link span {
  font-size: 11px !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

/* ── MOBILE: Grid wird 2-spaltig (Logo+Pills | Icons) ── */
@media (max-width: 768px) {
  .tm24-header-grid {
    grid-template-columns: 1fr max-content;
    gap: 8px;
    padding: 0 12px !important;
  }

  /* Mitte (Suche) auf Mobil ausblenden */
  .tm24-header-center {
    display: none !important;
  }

  .shop-pills,
  .ankauf-pills,
  .b2b-pills {
    gap: 4px !important;
  }

  .shop-pill,
  .ankauf-pill,
  .b2b-pill {
    padding: 5px 12px !important;
    font-size: 12px !important;
  }
}

/* =========================================================
   TM24 MEGA-MENU RESPONSIVE FIX (ALL DESKTOP DEVICES)
   Verhindert das Abschneiden der Mega-Menüs bei kleinen Bildschirmen
   ========================================================= */

/* 1. Die Haupt-Navigation-Leiste wird der Positions-Anker */
.shop-catsbar .container,
.ankauf-catsbar .container,
.shop-home-catsbar .container,
.ankauf-home-catsbar .container {
    position: relative !important;
}

/* 2. Mega-Menü-Items (die grossen Panels) dürfen NICHT "relative" sein, 
      damit das Panel aus dem Listenpunkt-Raster ausbrechen kann */
.shop-megamenu-item.has-megapanel,
.ankauf-megamenu-item.has-megapanel {
    position: static !important;
}

/* 3. Das MegaPanel umspannt nun den vollen Container (volle Desktop-Breite)
      Sicher innerhalb der 15px Paddings vom Container! */
html body .shop-megapanel,
html body .ankauf-megapanel {
    position: absolute !important;
    top: 100% !important;
    left: 15px !important;
    right: 15px !important;
    transform: none !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important; 
    align-items: flex-start !important;
    pointer-events: none; /* Mouse durchlassen solange hidden */
}

/* 4. Hover-Status aktiviert das Panel */
html body .shop-megamenu-item.has-megapanel:hover .shop-megapanel,
html body .ankauf-megamenu-item.has-megapanel:hover .ankauf-megapanel {
    pointer-events: auto;
}

/* 5. Das sichtbare Inner-Panel (weisse Box) */
html body .shop-megapanel-inner,
html body .ankauf-megapanel-inner {
    display: grid !important;
    width: 100% !important;
    max-width: 100% !important;
    background: #fff !important;
    border: 1px solid rgba(0, 0, 0, .08) !important;
    border-radius: 14px !important;
    border-top: 3px solid var(--p, #2E2BCB) !important;
    box-shadow: 0 16px 48px rgba(46, 43, 203, .12), 0 2px 8px rgba(0, 0, 0, .06) !important;
    padding: 24px 28px !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
}

/* 6. Normale "kleine" Dropdowns der Navi muessen unter dem Item bleiben! */
.shop-megamenu-item.has-dropdown {
    position: relative !important;
}

/* Mobile Fallback: Fixiere wie bisher auf dem Bildschirm */
@media (max-width: 991px) {
    html body .shop-megapanel,
    html body .ankauf-megapanel {
        position: fixed !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        padding: 0 !important;
    }
}

