/*
 * Miniaturbahn theme 1.2.2 for OpenCart 4.1.0.4
 * Klassik originalgetreu: Masse, Verlaeufe und Schatten am alten Shop (www.miniaturbahn.at,
 * 1004px-Seite) nachgemessen und in CSS nachgebaut - runde, schattierte Titelbalken,
 * offene Boxen mit Seitenlinien, Seitenschiene mit weichem Schatten.
 * Einzige Grafik ist das Kopfbild (header_desktop_112.jpg / header.jpg / header_mobile.jpg).
 * Desktop >= 992px: Look von www.miniaturbahn.at; darunter responsive (Offcanvas-Menue).
 */
:root {
  /* Farben aus dem alten Shop */
  --mb-border-color: darkgreen;   /* Produktzeilen/Kacheln (#006400 wie im Original) */
  --mb-line: #205423;             /* Seiten- und Spaltenlinien */
  --mb-bg-light: #EEFFEE;
  --mb-box-top: #2e8133;
  --mb-box-bottom: #1a4622;
  --mb-bar: #447744;              /* Konto/Warenkorb-Leiste im Kopf */
  --mb-red: #ff0000;
  --mb-link-hover: #AABBDD;
  /* Geometrie (Original-Masse) */
  --mb-bw: 1px;
  --mb-frame: var(--mb-bw) solid var(--mb-border-color);
  --mb-lw: 2px;                                        /* Linienbreite Seite/Spalte */
  --mb-rail: var(--mb-lw) solid var(--mb-line);
  --mb-radius: 0;
  --mb-gap: 10px;
  --mb-pad: 8px;
  --mb-page: 1004px;                                   /* Seite inkl. Schatten */
  --mb-col: 219px;                                     /* linke Spalte inkl. Linien */
  --mb-content: 690px;                                 /* Inhaltsspalte = Ueberschriftbalken */
  --mb-col-gap: 29px;                                  /* Spalte -> Inhalt */
  --mb-head-h: 36px;                                   /* Titel- und Ueberschriftbalken */
  --mb-title-radius: 14px;
  --mb-heading-radius: 0 16px 4px 0;
  --mb-header-ratio: 985 / 211;
  --mb-header-ratio-mobile: 632 / 211;
  --mb-title-family: Verdana, "DejaVu Sans", Arial, sans-serif;
  /* Box-Titel: senkrechter Verlauf wie im Original (Glanzkante oben, dunkle Unterkante) */
  --mb-title-gradient: linear-gradient(to bottom,
      #7a9a69 0, #69974f 1px, #5d924e 2px, #4d8a44 3px, #3c8239 4px, #327e33 5px,
      #2e8133 6px, #2e8133 17px, #2b772f 21px, #27682b 26px, #1f5823 31px,
      #1b4520 34px, #1c3d22 100%);
  /* Seiten-Ueberschrift: dunkler nach rechts, heller nach unten, Glanzkante oben */
  --mb-heading-gradient:
      linear-gradient(to bottom, rgba(200,180,140,.42) 0, rgba(200,180,140,.25) 1px, rgba(200,180,140,.06) 2px, transparent 3px,
                      transparent calc(100% - 3px), rgba(0,0,0,.14) 100%),
      linear-gradient(to right, rgba(255,255,255,.25) 0, transparent 2px),
      linear-gradient(5.7deg, #2e7f33 0, #2e7f33 58%, #276b2b 73%, #205423 89%, #205423 100%);
  --mb-box-gradient: var(--mb-title-gradient);
  --mb-btn-gradient: linear-gradient(to bottom,
      #7da168 0, #6f9a5f 1px, #5d9150 3px, #468740 5px, #468740 13px, #43803d 17px,
      #3e7438 21px, #3a6b34 22px, #2f6432 24px, #215b25 25px, #16461c 100%);
  --mb-shadow-text: 1px 1px 1px rgba(0, 0, 0, .7);
  --mb-outline-text: 1px 0 0 #000, -1px 0 0 #000, 0 1px 0 #000, 0 -1px 0 #000, 1px 1px 0 #000, 2px 2px 1px rgba(0,0,0,.6);
  /* Bootstrap-Variablen angleichen */
  --bs-link-color: #000;
  --bs-link-color-rgb: 0, 0, 0;
  --bs-link-hover-color: #AABBDD;
  --bs-link-hover-color-rgb: 170, 187, 221;
  --bs-primary: #3e8239;
  --bs-primary-rgb: 62, 130, 57;
  --bs-border-color: darkgreen;
  --bs-border-radius: 3px;
}

/* ---------- Grundgeruest (hebt die absolute Positionierung von stylesheet.css auf) ---------- */
html, body { overflow-x: hidden; }
body.mb-theme { font-family: Verdana, Arial, sans-serif; color: #000; background: #fff; }
.mb-theme *, .mb-theme *::before, .mb-theme *::after { box-sizing: border-box; }
body.mb-theme h1, body.mb-theme h2, body.mb-theme h3, body.mb-theme h4, body.mb-theme h5 { color: #000; font-family: Verdana, Arial, sans-serif; }
.mb-theme a { color: #000; text-decoration: none; }
.mb-theme a:hover { color: var(--mb-link-hover); text-decoration: underline; }
.mb-theme img { max-width: 100%; height: auto; }
.mb-theme #container.mb-page { position: static; min-height: 0; margin: 0 auto; width: 100%; background: #fff; }
.mb-theme #content, .mb-theme #column-left, .mb-theme #column-right { padding-bottom: 0; }
.mb-theme #mb-main { background: #fff; }
.mb-theme #mb-main .container { max-width: none; width: 100%; padding: 0; margin: 0; }
.mb-theme #mb-main .container > .row { margin: 0; --bs-gutter-x: 0; --bs-gutter-y: 0; }
.mb-theme #content .row { --bs-gutter-x: var(--mb-gap); }
.mb-theme #content .row > .col.mb-3, .mb-theme #content .row > [class*="col-"].mb-3 { margin-bottom: var(--mb-gap) !important; }
.mb-theme .btn-primary { --bs-btn-bg: #3e8239; --bs-btn-border-color: var(--mb-line); --bs-btn-hover-bg: var(--mb-box-bottom); --bs-btn-hover-border-color: var(--mb-line); --bs-btn-active-bg: var(--mb-box-bottom); --bs-btn-color: #fff; --bs-btn-hover-color: #fff; background-image: var(--mb-btn-gradient); text-shadow: var(--mb-shadow-text); }
.mb-theme .btn-primary:hover { color: #fff; text-decoration: none; background-image: none; }
.mb-theme .btn-light { --bs-btn-border-color: var(--mb-border-color); }
.mb-theme .pagination { --bs-pagination-color: #000; --bs-pagination-border-color: var(--mb-border-color); --bs-pagination-active-bg: #3e8239; --bs-pagination-active-border-color: var(--mb-border-color); --bs-pagination-hover-bg: var(--mb-bg-light); --bs-pagination-hover-color: #000; }
.mb-theme .form-control, .mb-theme .form-select, .mb-theme .input-group-text { border-color: var(--mb-border-color); }
.mb-theme .img-thumbnail { border: var(--mb-frame); border-radius: 0; padding: 2px; }
.mb-theme #content .carousel, .mb-theme .mb-sidebar .carousel { border: var(--mb-frame); overflow: hidden; background: #fff; margin-bottom: var(--mb-gap); box-shadow: none; }
.mb-theme .carousel img { box-shadow: none; }
.mb-theme #content hr { border-color: var(--mb-border-color); opacity: 1; }
.mb-theme .price-new { font-weight: bold; }
.mb-theme .price-old { color: var(--mb-red); text-decoration: line-through; }

/* ---------- Kopf (einzige Grafik) ---------- */
#mb-header { position: relative; width: 100%; aspect-ratio: var(--mb-header-ratio); background: url(../image/header.jpg) no-repeat 0 0 / 100% 100%; }
.mb-logo-link { position: absolute; display: block; }
.mb-crumb { font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
.mb-crumb a { color: #000; }
.mb-headbox .mb-account > a { color: orange; }
.mb-headbox .mb-account .mb-logout { color: #fff; }
.mb-headbox .mb-account .mb-sep { color: #fff; padding: 0 4px; }
.mb-theme .mb-cart-btn, .mb-cart-btn { display: block; width: 100%; border: 0; background: var(--mb-bar); color: #fff; text-align: center; text-decoration: none; }
.mb-theme .mb-cart-btn:visited { color: #fff; }
.mb-theme .mb-cart-btn:hover { color: #fff; text-decoration: underline; }
.mb-cart-btn .fa-solid { margin-right: 3px; }
.mb-theme #cart { margin: 0; }

/* ---------- Titelbalken (Box) und Ueberschriftbalken (Inhalt) - rund, schattiert ---------- */
.mb-box-heading,
.mb-theme #content > h1, .mb-theme #content h1.mb-heading, .mb-theme #content > #shopping-cart > h1 {
  position: relative; z-index: 1;
  display: block; margin: 0;
  height: var(--mb-head-h);
  padding: 0 var(--mb-pad);
  color: #fff !important; font-family: var(--mb-title-family); font-weight: bold; font-size: 12px; line-height: var(--mb-head-h);
  letter-spacing: 2px; text-shadow: var(--mb-outline-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  border: 0;
}
.mb-box-heading {
  text-align: center;
  background: var(--mb-title-gradient);
  box-shadow: 0 4px 4px -1px rgba(10, 25, 15, .85);       /* weicher Schatten in die Box */
}
.mb-box-heading.mb-box-heading-top { border-top-right-radius: var(--mb-title-radius); }
.mb-theme #content > h1, .mb-theme #content h1.mb-heading, .mb-theme #content > #shopping-cart > h1 {
  background: var(--mb-heading-gradient);
  border-radius: var(--mb-heading-radius);
  padding-left: 40px; letter-spacing: 3px; overflow: visible;
  box-shadow: 2px 5px 6px rgba(0, 0, 0, .7), -3px 2px 3px rgba(0, 0, 0, .12);
}

/* ---------- Linke Spalte: offene Boxen (nur Seitenlinien) ---------- */
.mb-box { background: #fff; margin: 0; border: 0; }
.mb-box-content { padding: 9px var(--mb-pad) 10px; background: #fff; }
.mb-box-content p { margin: 0 0 4px; }
.mb-box-content p:last-child { margin-bottom: 0; }
.mb-cat { list-style: none; margin: 0; padding: 0; }
.mb-cat .mb-cat { padding-left: 10px; }
.mb-cat a { font-family: Arial, sans-serif; font-weight: bold; color: #000; }
.mb-cat .mb-raquo { color: var(--mb-red); font-weight: bold; }
.mb-cat .mb-count { color: var(--mb-red); }
.mb-cat li.current > a { color: var(--mb-red); }
.mb-search { display: flex; align-items: center; gap: 4px; }
.mb-search input { flex: 1; min-width: 0; border: 1px solid #7a9a7a; border-radius: 0; font-family: Verdana, Arial, sans-serif; }
.mb-search button { border: 0; background: none; color: #3e8239; padding: 0 2px; }
.mb-small-link { font-weight: bold; }
.mb-links, .mb-best { margin: 0; padding: 0; list-style: none; }
.mb-best { list-style: decimal-leading-zero inside; }
.mb-contact .fa-solid, .mb-contact .fa-regular { color: #3e8239; width: 18px; }
.mb-module { margin: 0; }

/* ---------- Produkte: Zeilen (Liste) und Kacheln (Raster) wie im Original ---------- */
.mb-theme .product-thumb.mb-thumb { border: var(--mb-frame); border-radius: 0; overflow: hidden; background: var(--mb-bg-light); height: 100%; }
.mb-thumb .image { background: #fff; text-align: center; padding: 4px; margin: 0; }
.mb-thumb .description { padding: 6px var(--mb-pad); margin: 0; }
.mb-thumb .description h4 { font-family: Verdana, Arial, sans-serif; font-weight: bold; margin: 0 0 6px; }
.mb-thumb .description p { font-style: italic; color: #000; margin: 0; }
.mb-thumb .mb-buy { text-align: center; padding: 6px var(--mb-pad); }
.mb-thumb .price { margin: 6px 0 0; font-family: Arial, sans-serif; font-weight: bold; color: #000; }
.mb-thumb .price-tax { display: block; font-weight: normal; color: #555; }
.mb-btn-cart {
  display: inline-block; border: 0; border-radius: 1px;
  background: var(--mb-btn-gradient);
  color: #fff; font-family: Verdana, "DejaVu Sans", Arial, sans-serif; font-weight: bold; letter-spacing: 1px;
  text-shadow: var(--mb-outline-text); cursor: pointer; white-space: nowrap;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .25);
}
.mb-btn-cart:hover { filter: brightness(1.12); }
.mb-theme .row:not(.product-list) > .col > .mb-thumb { display: flex; flex-direction: column; text-align: center; }
.mb-theme .row:not(.product-list) > .col > .mb-thumb .content { display: flex; flex-direction: column; flex: 1; justify-content: space-between; }
.mb-theme .row:not(.product-list) > .col > .mb-thumb .description p { display: none; }

/* ---------- Fuss (CSS-Verlauf statt 1_end.jpg) ---------- */
#mb-footer { position: static; border: 0; padding: 0; margin: 0; background: none; color: #fff; width: auto; }
#mb-footer a { color: #fff; }
#mb-footer a:hover { color: #FFFF33; }
.mb-footer-green { background: linear-gradient(to bottom, #4e972c, #3d8030 45%, #1a4b1e); }
.mb-footer-line { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 6px; }
.mb-footer-menu { text-align: center; background: #fff; }
.mb-footer-menu a { color: #eee !important; font-family: Verdana, "DejaVu Sans", Arial, sans-serif; font-weight: bold; text-shadow: 1px 0 0 #555, -1px 0 0 #555, 0 1px 0 #555, 0 -1px 0 #555, 2px 2px 2px #999; }
.mb-footer-menu a:hover { color: #cfe8c8 !important; text-decoration: none; }

/* =====================================================================
   DESKTOP >= 992px  (Masse wie www.miniaturbahn.at)
   ===================================================================== */
@media (min-width: 992px) {
  html { font-size: 13px; }
  body.mb-theme { font-size: 11px; background: #fff; }
  .mb-theme #container.mb-page { width: var(--mb-page); max-width: none; margin: 0 auto; background: transparent; }
  /* Kopf (ab 1.1.2): Bildinneres 989 x 236 zwischen denselben 2px-Seitenlinien wie die Seite
     (x 8 und 999, gleicher Schatten) -> Linien laufen ohne Versatz vom Kopf bis zum Fuss */
  /* Seitenschiene (ab 1.1.2 ein Element um Kopf + Inhalt): 2px-Linien bei x 8 und 999 mit weichem
     Schatten laufen ohne Versatz vom Kopf bis zum Fuss; Kopf oben rund */
  .mb-shell {
    margin: 0 3px 0 8px;
    border: var(--mb-rail); border-bottom: 0; border-radius: 10px 10px 0 0;
    box-shadow: -3px 0 3px -1px rgba(0, 0, 0, .35), 3px 0 3px -1px rgba(0, 0, 0, .35), 0 -2px 3px -1px rgba(0, 0, 0, .3),
                inset 2px 0 1px -1px rgba(0, 0, 0, .25), inset -3px 0 2px -1px rgba(0, 0, 0, .3);
    background: #fff;
  }
  /* Kopf: Bildinneres 989 x 236 (Kopfbild ohne eigenen Rand), ca. 12px hoeher als 1.1.1 */
  #mb-header { width: auto; height: 236px; aspect-ratio: auto; border-radius: 8px 8px 0 0; background: #4f9a2f url(../image/header_desktop_112.jpg) no-repeat 0 0; }
  .mb-logo-link { left: -2px; top: 26px; width: 300px; height: 140px; }
  .mb-crumb { position: absolute; left: 11px; top: 190px; font-size: 11px; line-height: 15px; max-width: 620px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* 1.1.9: wie alter Shop: Verdana 10px, Warenkorb weiss, mit Abstand unter "Mein Konto" */
  .mb-headbox { position: absolute; left: 657px; top: 193px; width: 317px; font-family: Verdana, Arial, sans-serif; font-size: 10px; }
  .mb-headbox .mb-account { width: 157px; height: 15px; margin-left: auto; padding: 0 9px 0 4px; background: var(--mb-bar); text-align: right; line-height: 15px; }
  .mb-theme .mb-headbox #cart { margin-top: 2px; }
  .mb-headbox .mb-cart .mb-cart-btn, .mb-headbox .mb-cart .mb-cart-btn:visited { height: 15px; padding: 0 6px; font-size: 10px; line-height: 15px; color: #fff; }
  .mb-mobilebar { display: none; }
  /* Seitenschiene: 2px-Linien links/rechts mit weichem Schatten (x 8..1000 von 1004) */
  .mb-theme #mb-main { margin: 0; padding: 66px 0 0; border: 0; box-shadow: none; min-height: 500px; background: transparent; }
  .mb-theme #mb-main .container > .row { flex-wrap: nowrap; align-items: stretch; }
  /* Linke Spalte: ueber der Seitenlinie, eigene Linie rechts + Schatten, bis zum Fuss */
  .mb-theme #column-left.mb-sidebar {
    flex: 0 0 var(--mb-col); width: var(--mb-col); max-width: var(--mb-col);
    margin-left: calc(-1 * var(--mb-lw)); visibility: visible; padding: 0;
    border-left: var(--mb-rail); border-right: var(--mb-rail);
    border-top-right-radius: var(--mb-title-radius);
    box-shadow: 2px 0 2px rgba(0, 0, 0, .3);
    background: #fff;
  }
  .mb-sidebar-body { display: block !important; padding: 0; overflow: visible; }
  /* Titel deckt die Spaltenlinien ab (wie im Original durchgehend) */
  .mb-box-heading { margin: 0 calc(-1 * var(--mb-lw)); font-size: 12px; }
  .mb-box-content { font-size: 11px; line-height: 15px; }
  .mb-cat li { margin: 0; }
  .mb-cat a { font-size: 11px; }
  .mb-cat .mb-raquo { font-size: 12px; }
  .mb-cat .mb-count { font-size: 11px; }
  .mb-search input { font-size: 11px; height: 20px; padding: 0 3px; }
  .mb-search button { font-size: 16px; }
  .mb-small-link { font-size: 10px; }
  .mb-box:first-child > .mb-box-content { padding-bottom: 15px; }
  .mb-sidebar .list-group { margin: 0 0 var(--mb-gap); }
  /* Inhalt: 29px nach der Spalte, 690px breit; Text/Zeilen innen 34px links, 28px rechts */
  .mb-theme #content {
    flex: 0 0 var(--mb-content); width: var(--mb-content); max-width: var(--mb-content); min-width: 0;
    margin-left: var(--mb-col-gap); padding: 0 28px 30px 34px; font-size: 11px; line-height: 1.5;
  }
  .mb-theme #content > h1, .mb-theme #content h1.mb-heading, .mb-theme #content > #shopping-cart > h1 { font-size: 12px; margin: 6px -30px 29px -32px; }
  .mb-theme #column-right { flex: 0 0 var(--mb-col); max-width: var(--mb-col); padding: 0; }
  /* Liste: Zeilen 628px, 136px hoch, 5px Abstand, Bildzelle 150px weiss */
  .mb-theme #product-list.product-list, .mb-theme #mb-cat-list.product-list { --bs-gutter-x: 0; margin: 0; }
  .mb-theme #content #product-list.product-list > .col, .mb-theme #content #mb-cat-list.product-list > .col { flex: 0 0 100%; max-width: 100%; margin-bottom: 5px !important; }
  .mb-theme .product-list .mb-thumb { display: flex; min-height: 136px; }
  .mb-theme .product-list .mb-thumb .image { flex: 0 0 150px; display: flex; align-items: center; justify-content: center; padding: 6px; }
  .mb-theme .product-list .mb-thumb .image img { max-height: 122px; width: auto; }
  .mb-theme .product-list .mb-thumb .content { display: flex; flex: 1; align-items: center; position: static; flex-direction: row; }
  .mb-theme .product-list .mb-thumb .description { flex: 1; padding: 8px 10px 8px 17px; }
  .mb-theme .product-list .mb-thumb .mb-buy { flex: 0 0 248px; }
  .mb-theme .product-list .mb-thumb .price { margin-top: 11px; font-size: 16px; }
  .mb-thumb .description h4 { font-size: 11px; line-height: 1.4; }
  .mb-thumb .description p { font-size: 11px; }
  .mb-thumb .price { font-size: 13px; }
  .mb-thumb .price-tax { font-size: 9px; }
  .mb-btn-cart { font-size: 10px; height: 28px; min-width: 120px; padding: 0 8px; line-height: 28px; }
  .mb-theme .row:not(.product-list) > .col > .mb-thumb { font-size: 10px; }
  .mb-theme .row:not(.product-list) > .col > .mb-thumb .image img { max-height: 120px; width: auto; }
  .mb-theme .row:not(.product-list) > .col > .mb-thumb .mb-btn-cart { min-width: 0; width: 100%; max-width: 120px; letter-spacing: 0; }
  /* Fuss: gruener Block 997 x 179 mit Schatten, darunter Menue */
  .mb-footer-green {
    margin: 0 1px 0 7px; min-height: 179px; padding: 28px 31px 14px 26px; font-size: 11px;
    display: flex; flex-direction: column; justify-content: flex-end;
    box-shadow: 0 5px 6px -1px rgba(0, 0, 0, .45), inset -7px 0 6px -4px rgba(190, 220, 170, .55), inset 1px 0 0 rgba(255, 255, 255, .2);
  }
  .mb-footer-line { margin-top: var(--mb-gap); font-size: 11px; }
  .mb-footer-menu { padding: 30px 0 20px; }
  .mb-footer-menu a { font-size: 12px; letter-spacing: 1px; }
  .mb-footer-menu a + a::before { content: "|"; color: #aaa; margin: 0 10px; text-shadow: none; }
}

/* =====================================================================
   HANDY / TABLET < 992px
   ===================================================================== */
@media (max-width: 991.98px) {
  :root { --mb-gap: 12px; --mb-pad: 12px; --mb-head-h: 40px; --mb-radius: 4px; }
  html { font-size: 16px; }
  body.mb-theme { font-size: 15px; line-height: 1.5; }
  /* Bild oben in voller Breite, Konto/Warenkorb/Brotkrumen darunter */
  #mb-header { aspect-ratio: auto; background-size: 100% auto; padding-top: calc(100% * 211 / 985); }
  .mb-logo-link { left: 0; top: 0; width: 46%; aspect-ratio: 985 / 211; height: auto; max-height: 100%; }
  .mb-crumb { display: block; padding: 8px var(--mb-gap) 4px; font-size: 13px; font-weight: bold; line-height: 1.6; }
  .mb-crumb a { display: inline-block; padding: 4px 0; margin-right: 4px; }
  .mb-headbox { display: flex; gap: 6px; padding: 4px var(--mb-gap) 8px; }
  .mb-headbox .mb-account { flex: 0 0 38%; display: flex; }
  .mb-headbox .mb-account { gap: 6px; }
  .mb-headbox .mb-account .mb-sep { display: none; }
  .mb-headbox .mb-account:has(.mb-logout) { flex: 0 0 55%; }
  .mb-headbox .mb-account > a.mb-logout { flex: 0 0 auto; padding: 0 10px; font-weight: normal; }
  .mb-headbox .mb-account > a { display: flex; align-items: center; justify-content: center; flex: 1; min-height: 44px; white-space: nowrap; background: var(--mb-bar); font-weight: bold; font-size: 14px; border-radius: var(--mb-radius); }
  .mb-headbox .mb-cart { flex: 1; min-width: 0; }
  .mb-cart-btn { min-height: 44px; font-size: 14px; padding: 6px 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; border-radius: var(--mb-radius); }
  .mb-mobilebar {
    position: sticky; top: 0; z-index: 1030;
    display: flex; align-items: center; gap: 6px; padding: 6px 10px;
    background: linear-gradient(to bottom, #4f9a43, #2e8133 30%, #1a4622); border-top: var(--mb-frame); border-bottom: var(--mb-frame);
  }
  .mb-burger {
    flex: 1; min-height: 44px; display: flex; align-items: center; gap: 10px;
    border: 1px solid rgba(255,255,255,.6); border-radius: var(--mb-radius); background: rgba(0,0,0,.15);
    color: #fff; font-weight: bold; font-size: 16px; letter-spacing: 1px; padding: 0 12px; text-align: left;
  }
  .mb-mobilebar .mb-icon { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: #fff; font-size: 20px; }
  .mb-mobilebar .mb-icon:hover { color: #FFFF33; }
  #mb-main { padding: var(--mb-gap) var(--mb-gap) 0; }
  .mb-theme #column-left.mb-sidebar { --bs-offcanvas-width: min(340px, 88vw); background: #fff; padding: 0; }
  .mb-offcanvas-header { background: linear-gradient(to bottom, #4f9a43, #2e8133 30%, #1a4622); color: #fff; font-size: 17px; min-height: 56px; }
  .mb-sidebar-body { padding: var(--mb-gap); }
  .mb-box-heading { font-size: 13px; letter-spacing: 2px; }
  .mb-box { border-left: var(--mb-rail); border-right: var(--mb-rail); }
  .mb-box:last-of-type { border-bottom: var(--mb-rail); }
  .mb-box-heading { margin: 0 calc(-1 * var(--mb-lw)); }
  .mb-module { margin: var(--mb-gap) 0 0; }
  .mb-box-content { font-size: 15px; padding: 4px var(--mb-pad) 8px; }
  .mb-cat li { border-bottom: 1px solid #dfeedd; }
  .mb-cat li:last-child { border-bottom: 0; }
  .mb-cat a { display: block; padding: 10px 2px; min-height: 44px; font-size: 15px; }
  .mb-cat .mb-raquo { font-size: 17px; }
  .mb-cat .mb-count { font-size: 13px; }
  .mb-links a, .mb-best a, .mb-contact a, .mb-box-content > a { display: inline-block; padding: 9px 0; min-height: 44px; }
  .mb-links li, .mb-best li { border-bottom: 1px solid #eee; }
  .mb-search input { height: 44px; font-size: 16px; padding: 0 8px; }
  .mb-search button { width: 44px; height: 44px; font-size: 22px; }
  .mb-theme #content { padding: 0 0 var(--mb-gap); min-width: 0; width: 100%; flex: 1 1 100%; }
  .mb-theme #column-right { display: none; }
  .mb-theme #content > h1, .mb-theme #content h1.mb-heading, .mb-theme #content > #shopping-cart > h1 { font-size: 13px; letter-spacing: 2px; padding-left: 16px; margin: 0 4px 16px 0; }
  .mb-theme #product-list > .col, .mb-theme #mb-cat-list > .col { flex: 0 0 100%; max-width: 100%; }
  .mb-theme .mb-thumb { display: flex; flex-wrap: wrap; }
  .mb-thumb .image { flex: 0 0 110px; display: flex; align-items: center; justify-content: center; }
  .mb-thumb .image img { max-height: 140px; width: auto; }
  .mb-theme .mb-thumb .content { flex: 1; min-width: 0; display: flex; flex-direction: column; position: static; }
  .mb-thumb .description h4 { font-size: 16px; line-height: 1.3; }
  .mb-thumb .description p { font-size: 13px; }
  .mb-thumb .mb-buy { text-align: left; padding: 6px var(--mb-pad) 10px; }
  .mb-btn-cart { display: block; width: 100%; min-height: 44px; font-size: 14px; padding: 8px 10px; background-size: 100% 100%; }
  .mb-thumb .price { font-size: 17px; }
  .mb-thumb .price-tax { font-size: 12px; }
  .mb-theme .row:not(.product-list) > .col > .mb-thumb { flex-direction: row; text-align: left; }
  .mb-theme .row:not(.product-list) > .col > .mb-thumb .description p { display: block; }
  .mb-theme .btn, .mb-theme .form-control, .mb-theme .form-select { min-height: 44px; }
  .mb-theme .table-responsive, .mb-theme table { max-width: 100%; }
  .mb-footer-green { padding: 18px var(--mb-gap); }
  .mb-footer-line { margin-top: 14px; font-size: 13px; flex-direction: column; }
  .mb-footer-menu { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; padding: 14px 10px 26px; }
  .mb-footer-menu a { display: inline-block; padding: 10px 4px; font-size: 14px; text-shadow: none; color: var(--mb-line) !important; }
}
@media (max-width: 639.98px) {
  #mb-header { background-image: url(../image/header_mobile.jpg); padding-top: calc(100% * 211 / 632); }
}

/* ---------- Fremd-Module in der Spalte (z.B. OpenCart-Kategorie-Modul) im gleichen Rahmen ---------- */
.mb-sidebar .list-group { --bs-list-group-border-color: #cfe5cc; --bs-list-group-active-bg: var(--mb-box-top); --bs-list-group-active-border-color: var(--mb-border-color); --bs-list-group-color: #000; border: var(--mb-frame); border-radius: var(--mb-radius); overflow: hidden; margin-bottom: var(--mb-gap); }
.mb-sidebar .list-group-item { border-left: 0; border-right: 0; font-size: inherit; }
.mb-sidebar .list-group-item:first-child { border-top: 0; }
.mb-sidebar .list-group-item:last-child { border-bottom: 0; }
.mb-sidebar .list-group-item.active { background: var(--mb-box-gradient); color: #fff; }
.mb-theme #content h2, .mb-theme #content h3 { font-size: 1.1em; font-weight: bold; margin: var(--mb-gap) 0; }
@media (min-width: 992px) { .mb-sidebar .list-group-item { padding: 4px var(--mb-pad); font-size: 10px; } }
@media (max-width: 991.98px) { .mb-sidebar .list-group-item { padding: 10px var(--mb-pad); min-height: 44px; } }
/* Tablet: Kacheln im Raster senkrecht (Bild oben), gleiche Rahmen */
@media (min-width: 576px) and (max-width: 991.98px) {
  .mb-theme .row:not(.product-list) > .col:not(#product-list > .col) > .mb-thumb { flex-direction: column; flex-wrap: nowrap; text-align: center; }
  .mb-theme .row:not(.product-list) > .col:not(#product-list > .col) > .mb-thumb .image { flex: none; border-right: 0; }
  .mb-theme .row:not(.product-list) > .col:not(#product-list > .col) > .mb-thumb .description p { display: none; }
  .mb-theme .row:not(.product-list) > .col:not(#product-list > .col) > .mb-thumb .mb-buy { text-align: center; }
}

/* 1.1.3: Startseiten-Inhalt aus dem alten Shop (HTML-Modul) und Infoseiten */
.mb-home section { margin-bottom: 18px; }
.mb-home h2 { font-size: 15px; font-weight: bold; text-decoration: underline; margin: 10px 0 8px; color: #000; }
.mb-home-links ul.mb-links, .mb-home ul.mb-columns { list-style: none; padding-left: 0; font-size: 12px; }
.mb-home-links ul.mb-links li::before { content: "\25BA\00a0"; color: #006600; font-size: 8px; vertical-align: middle; }
.mb-home ul.mb-columns { columns: 3 160px; column-gap: 20px; font-size: 11px; }
.mb-home ul.mb-columns li { break-inside: avoid; margin-bottom: 4px; }
#information-information .mb-content-table td { padding: 2px 6px; vertical-align: top; }

/* 1.1.4: Produktseite wie im alten Shop (Produktdetails, Preisbalken, Bild rechts, Angebote) */
.mb-theme #content h2.mb-pi-title { font-size: 16px; font-weight: bold; margin: 0 0 4px; line-height: 1.3; }
.mb-pi-model { font-size: 10px; margin-bottom: 8px; }
.mb-pi-pricebar { background: #EEEEEE; text-align: right; padding: 6px 10px 7px; margin: 0 0 12px; }
.mb-pi-price .price-new { font-size: 18px; font-weight: bold; color: #000; font-family: Verdana, Arial, sans-serif; }
.mb-pi-price .price-old { font-size: 12px; color: #555; text-decoration: line-through; margin-right: 6px; }
.mb-pi-price .mb-pi-special { color: var(--mb-red); }
.mb-pi-taxnote, .mb-pi-discounts { font-size: 10px; line-height: 1.4; }
.mb-pi-taxnote a { text-decoration: underline; }
.mb-pi-body { display: flow-root; }
.mb-pi-side { float: right; width: 180px; margin: 0 0 12px 16px; text-align: center; }
.mb-pi-image > a { display: block; color: #000; }
.mb-pi-image > a > img { display: block; width: 120px; height: 120px; object-fit: contain; margin: 0 auto 4px; }
.mb-pi-enlarge { display: block; font-size: 10px; line-height: 1.3; margin-bottom: 8px; }
.mb-pi-more { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; margin-bottom: 8px; }
.mb-pi-more img { width: 40px; height: 40px; object-fit: contain; border: 1px solid #ccc; }
.mb-pi-side #form-product { text-align: right; }
.mb-pi-side #form-product .mb-3 { text-align: left; font-size: 11px; }
.mb-btn-cart.mb-pi-cart { width: 170px; height: 40px; line-height: 40px; padding: 0 8px; font-size: 12px; min-width: 0; }
.mb-pi-minimum { font-size: 10px; margin-top: 4px; }
.mb-pi-desc { min-width: 0; overflow-wrap: break-word; }
.mb-pi-desc img { max-width: 100%; height: auto; }
.mb-pi-attr { margin-top: 10px; border-collapse: collapse; }
.mb-pi-attr th, .mb-pi-attr td { padding: 2px 6px; border-bottom: 1px solid #ddd; }
.mb-pi-offers { clear: both; margin-top: 18px; }
.mb-pi-offers-title { color: darkgreen; font-weight: bold; font-size: 11px; padding-bottom: 3px; border-bottom: 1px solid darkgreen; margin-bottom: 10px; }
.mb-pi-offers-list { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; }
.mb-pi-offer { flex: 0 0 118px; height: 155px; border: 1px solid darkgreen; border-radius: 12px; padding: 4px 5px; background: #fff;
  display: flex; flex-direction: column; align-items: center; text-align: center; font-size: 10px; line-height: 1.3; color: #000; overflow: hidden; }
.mb-pi-offer:hover { color: #000; border-color: var(--mb-box-top); box-shadow: 0 1px 4px rgba(0,0,0,.25); }
.mb-pi-offer-img { height: 92px; width: 100%; display: flex; align-items: center; justify-content: center; margin-bottom: 3px; }
.mb-pi-offer-img img { max-width: 100%; max-height: 90px; width: auto; height: auto; }
.mb-pi-offer-name { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mb-pi-offer b { margin-top: auto; }
@media (max-width: 991.98px) {
  .mb-pi-model { font-size: 13px; }
  .mb-theme #content h2.mb-pi-title { font-size: 18px; }
  .mb-pi-price .price-new { font-size: 22px; }
  .mb-pi-taxnote, .mb-pi-discounts { font-size: 12px; }
  .mb-pi-side { float: none; width: auto; margin: 0 0 14px; }
  .mb-pi-image > a > img { width: auto; height: auto; max-width: 100%; max-height: 280px; }
  .mb-pi-enlarge { font-size: 12px; }
  .mb-pi-side #form-product { text-align: center; }
  .mb-btn-cart.mb-pi-cart { width: 100%; height: auto; min-height: 44px; line-height: 1.3; font-size: 15px; }
  .mb-pi-desc { font-size: 14px; line-height: 1.5; }
  .mb-pi-offers-title { font-size: 14px; }
  .mb-pi-offers-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
  .mb-pi-offer { height: auto; min-height: 170px; font-size: 12px; padding: 6px; }
}

/* 1.1.5: Angebote-Kacheln gruen (wie die Kacheln "Neue Artikel" im alten Shop: #EEFFEE, Rahmen darkgreen) */
.mb-pi-offer { background: var(--mb-bg-light); }

/* 1.1.5: Artikelanzahl im Kategorienmenue wie im alten Shop: rotes fettes "•" bei Unterkategorien, "(53)" Arial fett rot */
.mb-cat .mb-sub { color: var(--mb-red); font-family: Arial, Helvetica, sans-serif; font-weight: bold; margin-left: 4px; }
.mb-cat .mb-count { color: var(--mb-red); font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
@media (min-width: 992px) {
  .mb-cat .mb-sub { font-size: 13px; line-height: 1; }
  .mb-cat .mb-count { font-size: 10px; }
}
@media (max-width: 991.98px) {
  .mb-cat .mb-sub { font-size: 16px; line-height: 1; }
  .mb-cat .mb-count { font-size: 13px; }
}

/* 1.1.5: Schlagwortwolke im gruenen Fussblock wie im alten Shop (schwarz, Blocksatz, 5 Groessen) */
.mb-tagcloud { margin-bottom: auto; }
#mb-footer .mb-tagcloud p { margin: 12px 0 12px 5px; padding: 0; text-align: justify; font-family: "Times New Roman", Times, serif; line-height: normal; color: #000; }
#mb-footer .mb-tagcloud a { color: #000; text-decoration: none; }
#mb-footer .mb-tagcloud a:hover, #mb-footer .mb-tagcloud a:focus { color: var(--mb-link-hover); text-decoration: underline; }
#mb-footer .mb-tag0 { font-size: 10px; }
#mb-footer .mb-tag1 { font-size: 13px; }
#mb-footer .mb-tag2 { font-size: 16px; }
#mb-footer .mb-tag3 { font-size: 18px; }
#mb-footer .mb-tag4 { font-size: 24px; }
@media (max-width: 991.98px) {
  #mb-footer .mb-tagcloud p { margin: 0 0 10px; text-align: center; line-height: 2; }
  #mb-footer .mb-tag0 { font-size: 12px; }
  #mb-footer .mb-tagcloud a { padding: 4px 2px; }
}

/* 1.1.5: Infoseiten wie im alten Shop (Arial 13px schwarz; Datenschutz Arial 11pt; Gutschein-FAQ Verdana 11px) */
.mb-info { font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: normal; color: #000; overflow-wrap: break-word; }
.mb-info p { margin: 0 0 13px; }
.mb-info h1 { font-family: Arial, Helvetica, sans-serif; font-size: 20px; font-weight: bold; line-height: 1.2; margin: 18px 0 12px; color: #000; }
.mb-info > h1:first-child { margin-top: 0; }
.mb-info h2, .mb-info h3 { font-family: inherit; font-size: 14px; font-weight: bold; line-height: 1.3; margin: 14px 0 6px; color: #000; }
.mb-info a { color: #000; text-decoration: underline; }
.mb-info a:hover { color: var(--mb-link-hover); }
.mb-info img { max-width: 100%; height: auto; }
.mb-info .mb-red { color: #ff0000; }
.mb-info .mb-u { text-decoration: underline; }
.mb-info .mb-fs4 { font-size: 18px; }
.mb-info .mb-fs5 { font-size: 24px; }
.mb-info .mb-fs6 { font-size: 32px; }
.mb-info .text-center { text-align: center; }
.mb-info .mb-content-table { width: auto; max-width: 100%; margin: 0 0 13px; font-size: inherit; color: inherit; --bs-table-bg: transparent; }
.mb-info .mb-content-table td, .mb-info .mb-content-table th { padding: 2px 10px 6px 0; vertical-align: top; background: transparent; color: inherit; }
.mb-info-1 { font-size: 14.67px; line-height: 18.67px; }
.mb-info-1 p { margin: 0 0 6px; }
.mb-info-1 h1 { font-size: 20px; margin: 22px 0 10px; }
.mb-info-3 .mb-fs4 { font-weight: bold; }
.mb-info-3 > div { margin-bottom: 13px; }
.mb-info-5 { font-family: Verdana, Arial, sans-serif; font-size: 11px; line-height: 16.5px; }
.mb-info-5 h3 { font-size: 12px; }
@media (max-width: 575.98px) {
  .mb-info table { display: block; overflow-x: auto; }
  .mb-info-2 .mb-content-table, .mb-info-2 .mb-content-table tbody, .mb-info-2 .mb-content-table tr, .mb-info-2 .mb-content-table td { display: block; width: auto; }
  .mb-info-2 .mb-content-table td { padding: 0 0 2px; }
  .mb-info-2 .mb-content-table tr { margin-bottom: 8px; }
}

/* 1.1.5: News (Startseite und Seite "Aktuelle News") wie im alten Shop: Datum | Trennstrich | Titel + "..... weiterlesen" */
.mb-news-item { background: #efffef; padding: 6px; margin: 0 0 5px; width: 96%; font-family: Arial, Helvetica, sans-serif; }
.mb-news-item summary { display: flex; align-items: center; cursor: pointer; list-style: none; }
.mb-news-item summary::-webkit-details-marker { display: none; }
.mb-news-item .mb-news-date { flex: 0 0 90px; width: 90px; margin-left: 10px; text-align: center; font-size: 12px; line-height: 14px; color: #336633; }
.mb-news-head { flex: 1 1 auto; min-width: 0; min-height: 40px; margin-left: 15px; padding-left: 15px; border-left: 1px solid #559955; }
.mb-news-title { display: block; font-size: 14px; font-weight: bold; color: #000; line-height: 16px; }
.mb-news-item .mb-more { display: block; margin-top: 3px; font-size: 12px; font-style: italic; color: #336633; }
.mb-news-item summary:hover .mb-more { color: #ff0000; }
.mb-news-item[open] .mb-more { display: none; }
.mb-news-body { padding: 8px 10px 4px 131px; font-size: 12px; color: #336633; }
.mb-news-item .mb-news-sub { display: block; margin-top: 3px; font-size: 12px; font-style: italic; color: #000; }
.mb-news-item .mb-news-sub .mb-more { display: inline; margin-top: 0; }
.mb-news-item summary:hover .mb-news-sub { color: #ff0000; }
.mb-news-item[open] .mb-news-sub .mb-more { display: none; }
.mb-news-all { width: 96%; text-align: right; font-size: 12px; padding-right: 20px; }
.mb-news-all a { color: #000; }
.mb-info-6 .mb-news-item { width: 100%; }
@media (max-width: 575.98px) {
  .mb-news-item { width: 100%; }
  .mb-news-item .mb-news-date { flex-basis: 74px; width: 74px; margin-left: 0; }
  .mb-news-head { margin-left: 8px; padding-left: 8px; }
  .mb-news-body { padding-left: 0; }
  .mb-news-all { width: 100%; padding-right: 0; }
}

/* 1.1.5: Startseite wie im alten Shop (Arial; Titel 28px, Untertitel 14px, Text 13px, Links 12px, Hersteller 11px) */
.mb-home { font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #000; }
.mb-home .mb-intro-title { margin: 0 0 6px; }
.mb-home .mb-intro-title strong { font-size: 28px; font-weight: bold; line-height: 1.2; }
.mb-home .mb-home-intro h2 { font-size: 14px; text-decoration: none; margin: 0 0 8px; }
.mb-home .mb-home-intro .mb-tag { font-size: 10px; font-style: italic; }
.mb-home .mb-home-intro u, .mb-home .mb-home-manufacturers h2 { text-decoration: underline; }
.mb-home .mb-home-manufacturers h2 { font-size: 13px; }
.mb-home-links ul.mb-links { font-size: 12px; }
.mb-home ul.mb-columns { font-size: 11px; }
.mb-home a { color: #000; }
@media (min-width: 992px) {
  .mb-home-links .row, .mb-home ul.mb-columns { padding-left: 60px; }
}

/* 1.1.9: Kontoseite wie osCommerce account.php (infoBox-Rahmen #b6b7cb, Verdana 11px, Pfeil arrow_green.gif) */
.mb-account-page { font-family: Verdana, Arial, sans-serif; font-size: 11px; line-height: 1.5; width: 90%; margin: 10px auto 0; }
.mb-account-page .mb-acc-title { padding: 2px; }
.mb-account-page .mb-acc-title a { color: #000; }
.mb-account-page .mb-acc-box { display: flex; align-items: center; gap: 10px; border: 1px solid #b6b7cb; background: #fff; padding: 4px 10px; margin-bottom: 10px; }
.mb-account-page .mb-acc-icon { flex: 0 0 60px; }
.mb-account-page .mb-acc-links { list-style: none; margin: 0; padding: 0; }
.mb-account-page .mb-acc-links li { padding: 2px 0 2px 16px; background: url(../image/account/arrow_green.gif) no-repeat 0 50%; }
.mb-account-page .mb-acc-links a { color: #000; }
.mb-account-page .mb-acc-prev { flex: 0 0 130px; text-align: center; }
.mb-account-page .mb-acc-orders { width: 100%; }
.mb-account-page .mb-acc-orders td { padding: 2px; cursor: pointer; }
.mb-account-page .mb-acc-orders tr:hover { background: #EEFFEE; }
.mb-account-page .mb-acc-orders .mb-acc-date { width: 80px; }
@media (max-width: 639.98px) {
  .mb-account-page { width: 100%; font-size: 14px; }
  .mb-account-page .mb-acc-links li { padding: 8px 0 8px 16px; }
  .mb-account-page .mb-acc-icon { flex-basis: 40px; width: 40px; height: 40px; }
  .mb-account-page .mb-acc-prev { display: none; }
}

/* 1.1.11: was es im alten Shop nicht gab: Newsletter bei der Registrierung, "Erneut kaufen"/"Retoure" in der Bestellansicht */
#form-register fieldset:has(#input-newsletter) { display: none; }
#account-order table:has(button[form^="form-product"]) tr > :last-child { display: none; }

/* 1.2.0: kleine Flaggen im Kopf - ab 1.2.2 ersetzt durch .mb-langbar (unten) */

/* =====================================================================
   1.2.2 Sprachwahl: grosse Flaggen mit "Deutsch" / "English" (nur noch einmal, ueber der Produktsuche)
   ===================================================================== */
.mb-langbar .mb-lang { display: flex; gap: 8px; margin: 0; }
.mb-theme .mb-langbar .mb-lang-btn {
  display: inline-flex; margin: 0; line-height: 1.2; opacity: 1; align-items: center; gap: 7px; width: auto; flex: 1 1 0; justify-content: center;
  padding: 4px 10px; border: var(--mb-frame); border-radius: 4px; background: #fff; color: var(--mb-line);
  font-family: Verdana, "DejaVu Sans", Arial, sans-serif; font-weight: bold; white-space: nowrap; cursor: pointer;
  box-shadow: 1px 2px 3px rgba(0, 0, 0, .25);
}
.mb-theme .mb-langbar .mb-lang-btn:hover, .mb-theme .mb-langbar .mb-lang-btn:focus-visible { background: var(--mb-bg-light); color: #000; outline: none; }
.mb-theme .mb-langbar .mb-lang-btn.active { background: var(--mb-btn-gradient); color: #fff; text-shadow: var(--mb-shadow-text); cursor: default; }
.mb-langbar .mb-lang-btn img { width: 30px; height: 20px; border: 1px solid rgba(0, 0, 0, .35); flex: 0 0 auto; }
@media (min-width: 992px) {
  .mb-theme #mb-main { position: relative; }
  /* im freien weissen Streifen (66px) ueber der Box "Produktsuche", so breit wie die linke Spalte */
  .mb-langbar { position: absolute; top: 15px; left: 0; width: calc(var(--mb-col) - 2 * var(--mb-lw)); z-index: 2; }
  .mb-theme .mb-langbar .mb-lang-btn { height: 34px; font-size: 11px; letter-spacing: .5px; }
}
@media (max-width: 991.98px) {
  .mb-langbar { margin: 0 0 var(--mb-gap); }
  .mb-langbar .mb-lang { justify-content: flex-end; }
  .mb-theme .mb-langbar .mb-lang-btn { flex: 0 1 auto; min-height: 44px; padding: 6px 14px; font-size: 15px; }
}

/* =====================================================================
   1.2.2 Kategorieseite wie im alten Shop (osCommerce index.php)
   ===================================================================== */
.mb-cat-title { text-align: center; font-family: Verdana, Arial, sans-serif; font-weight: bold; color: #000; }
.mb-cat-desc { margin: 0 0 var(--mb-gap); }
.mb-cat-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; width: 90%; margin: 0 auto; }
.mb-theme a.mb-cat-tile {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0;
  min-height: 120px; padding: 2px; border: 1px solid #000; background: #fff;
  font-family: Verdana, Arial, sans-serif; font-size: 12px; line-height: 1.25; color: #000; text-align: center; text-decoration: none;
  overflow-wrap: break-word;
}
.mb-theme a.mb-cat-tile:hover { color: var(--mb-link-hover); }
.mb-cat-tile img { display: block; max-width: 100%; height: auto; }
.mb-cat-tile-noimg span { font-weight: bold; }
.mb-cat-filter { text-align: right; margin: 0 0 10px; }
.mb-cat-filter label { margin-right: 4px; }
.mb-cat-filter select { border: 1px solid #7a9a7a; font-family: Verdana, Arial, sans-serif; max-width: 100%; }
.mb-cat-split {
  display: flex; align-items: center; justify-content: space-between; gap: 6px 16px;
  background: var(--mb-heading-gradient); border-radius: 0 4px 16px 0;
  box-shadow: 2px 5px 6px rgba(0, 0, 0, .7), -3px 2px 3px rgba(0, 0, 0, .12);
  color: #fff; font-family: Verdana, Arial, sans-serif;
}
.mb-cat-split b { color: #fff; }
.mb-theme .mb-cat-split a.pageResults, .mb-theme .mb-cat-split a.pageResults:visited { color: #FF9900; text-decoration: underline; }
.mb-theme .mb-cat-split a.pageResults:hover { color: #FFFF33; }
.mb-cat-pages { text-align: right; }
.mb-cat-pages a, .mb-cat-pages b { margin-left: 6px; }
.mb-cat-empty { margin: var(--mb-gap) 0; }
@media (min-width: 992px) {
  .mb-cat-title { font-size: 18px; margin: 0 0 24px; }
  .mb-cat-desc { font-size: 11px; }
  .mb-cat-filter, .mb-cat-filter select { font-size: 11px; }
  /* wie Kopfbalken: Breite 700 (Inhalt + Ueberstand), 36px hoch, Text 10px */
  .mb-cat-split { min-height: var(--mb-head-h); margin: 14px -30px 10px -32px; padding: 0 28px 0 24px; font-size: 10px; }
}
@media (max-width: 991.98px) {
  .mb-cat-title { font-size: 18px; margin: 0 0 16px; }
  .mb-cat-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; width: 100%; }
  .mb-theme a.mb-cat-tile { min-height: 120px; font-size: 14px; padding: 8px 6px; border-radius: 2px; }
  .mb-cat-filter { display: flex; align-items: center; gap: 8px; justify-content: flex-end; flex-wrap: wrap; font-size: 15px; }
  .mb-cat-filter select { min-height: 44px; font-size: 15px; flex: 1 1 180px; }
  .mb-cat-split { flex-direction: column; align-items: stretch; margin: 6px 4px 12px 0; padding: 10px 14px 12px; font-size: 13px; border-radius: 0 4px 16px 0; }
  .mb-cat-pages { text-align: left; }
  .mb-cat-pages a, .mb-cat-pages b { display: inline-block; min-width: 32px; padding: 8px 4px; margin-left: 2px; text-align: center; }
}
@media (min-width: 640px) and (max-width: 991.98px) {
  .mb-cat-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* 1.2.3: "Angebote aus unserem Shop" wie im alten Shop unten in der Inhaltsspalte, buendig mit dem Ende der linken Spalte */
@media (min-width: 992px) {
  #content.mb-offers-bottom { display: flex; flex-direction: column; }
  #content.mb-offers-bottom > * { flex-shrink: 0; max-width: 100%; }
  #content.mb-offers-bottom > .mb-pi-offers { margin-top: auto; padding-top: 18px; }
}

/* 1.2.4: Rahmen der Produktliste wie im alten Shop - Kopfbalken "Produktliste" (1_button_auswahl.jpg, 700px) und
   untere Seitenleiste (1_button_auswahl_foot.jpg, 700px) gleich breit, Artikelzeilen (90 %) innerhalb.
   Ursache des Ueberstands: die Flex-Spalte aus 1.2.3 begrenzte alle Kinder auf max-width:100%, dadurch wurden
   Kopfbalken und Seitenleiste (negative Raender) 62px schmaler als vorgesehen und endeten vor den Zeilen. */
@media (min-width: 992px) {
  #content.mb-offers-bottom > h1, #content.mb-offers-bottom > .mb-cat-split, #content.mb-offers-bottom > #shopping-cart { max-width: none; }
}
@media (max-width: 991.98px) {
  /* Kopfbalken und Seitenleiste lassen rechts 4px fuer den Schatten frei - die Zeilen auch */
  .mb-theme #content > #mb-cat-list, .mb-theme #content > #product-list { margin-left: 0; margin-right: 4px; max-width: calc(100% - 4px); }
}
.mb-list-foot .pagination { display: inline-flex; flex-wrap: wrap; margin: 0; padding: 0; gap: 0 2px; vertical-align: middle; }
.mb-list-foot .page-item .page-link { background: none; border: 0; padding: 0 4px; color: #FF9900; text-decoration: underline; font-size: inherit; box-shadow: none; }
.mb-list-foot .page-item .page-link:hover { color: #FFFF33; background: none; }
.mb-list-foot .page-item.active .page-link { color: #fff; font-weight: bold; text-decoration: none; background: none; }
.mb-list-foot .mb-cat-results { color: #fff; }

/* 1.2.4: Preis und Button wie im alten Shop (osC product_listing.php): rechte Spalte buendig am Zeilenrand,
   Button 137x40 (1_button_klein_korb.gif), darunter der Preis zentriert, Verdana 16px fett (font size=3 + b).
   Sonderpreis: alter Preis durchgestrichen (schwarz), daneben der Aktionspreis rot (productSpecialPrice). */
.mb-theme .mb-thumb .price { font-family: Verdana, Arial, sans-serif; }
.mb-theme .mb-thumb .price-old { color: #000; font-weight: normal; text-decoration: line-through; }
.mb-theme .mb-thumb .price-special { color: #ff0000; font-weight: normal; }
@media (min-width: 992px) {
  .mb-theme .product-list .mb-thumb .description { padding-right: 12px; }
  .mb-theme .product-list .mb-thumb .mb-buy { flex: 0 0 139px; width: 139px; margin-left: auto; padding: 0 1px 0 0; text-align: center; }
  .mb-theme .product-list .mb-thumb .mb-btn-cart { width: 137px; height: 40px; line-height: 40px; min-width: 0; padding: 0; font-size: 10px; letter-spacing: 1px; }
  .mb-theme .product-list .mb-thumb .price { margin-top: 13px; font-size: 16px; line-height: 19px; }
  .mb-theme .row:not(.product-list) > .col > .mb-thumb .price { font-size: 13px; }
  /* Artikelseite: Preis buendig am rechten Rand des grauen Balkens (pageHeading align=right), Button wie 1_button_klein_warenkorb.jpg */
  .mb-pi-pricebar { padding: 3px 2px 3px 10px; }
  .mb-btn-cart.mb-pi-cart { margin-right: 9px; }
}
.mb-pi-was, .mb-pi-now { font-size: 18px; font-weight: bold; font-family: Verdana, Arial, sans-serif; color: #000; }
.mb-pi-price .mb-pi-was .price-old { font-size: inherit; color: #000; margin: 0; text-decoration: line-through; }
.mb-pi-price .mb-pi-now .mb-pi-special { color: #ff0000; }
@media (max-width: 991.98px) {
  /* mobil: Button und Preis rechtsbuendig untereinander (Preis unter dem Button zentriert), Preis groesser */
  .mb-theme .mb-thumb .mb-buy { display: grid; justify-content: end; justify-items: center; text-align: center; padding: 6px var(--mb-pad) 10px; }
  .mb-theme .mb-thumb .mb-btn-cart { display: block; width: auto; min-width: 180px; }
  .mb-theme .mb-thumb .price { font-size: 20px; line-height: 1.2; margin-top: 8px; }
  .mb-pi-was, .mb-pi-now { font-size: 20px; }
}
@media (min-width: 576px) and (max-width: 991.98px) {
  .mb-theme .row:not(.product-list) > .col:not(#product-list > .col) > .mb-thumb .mb-buy { justify-content: center; }
}

/* 1.2.5: Warenkorb-Button in der Artikelzeile mit Abstand zum rechten Rahmen (12px, wie links), Preis mittig darunter;
   abgerundete Ecken (6px) einheitlich fuer alle gruenen Shop-Buttons (Zeilen, Kacheln, Artikelseite, Warenkorb, Kasse) */
.mb-btn-cart, .mb-theme .btn-primary { border-radius: 6px; --bs-btn-border-radius: 6px; }
.mb-theme .input-group > .btn-primary:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.mb-theme .input-group > .btn-primary:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
@media (min-width: 992px) {
  .mb-theme .product-list .mb-thumb .mb-buy { flex: 0 0 151px; width: 151px; padding: 0 12px 0 0; }
}
/* mobil: Button endet bereits ca. 13px vor dem Rahmen (Innenabstand 8px + Spalte) - unveraendert */
/* "Neu im Shop": Bild "NO IMAGE" wie im alten Shop 120x120 */
.mb-latest img[width="120"] { width: 120px; height: 120px; }

/* ================================================================
   1.2.6: Kopf rechts groesser (Mein Konto nach oben, Warenkorb nach unten), "Zur Kasse" weiss,
   Warenkorb-Seite ohne Tabellenlinien, "Zurueck" unter den Suchergebnissen
   ================================================================ */
.mb-headbox .mb-account a.mb-checkout-link,
.mb-headbox .mb-account a.mb-checkout-link:link,
.mb-headbox .mb-account a.mb-checkout-link:visited,
.mb-headbox .mb-account a.mb-checkout-link:hover,
.mb-headbox .mb-account a.mb-checkout-link:focus,
.mb-headbox .mb-account a.mb-checkout-link:active,
.mb-headbox .mb-account a.mb-logout:visited,
.mb-headbox .mb-account a.mb-logout:hover { color: #fff; }
.mb-headbox .mb-account a.mb-account-link:visited { color: orange; }
.mb-headbox .mb-account a.mb-account-link:hover { color: #FFCC33; }
.mb-headbox .mb-account a { text-decoration: none; white-space: nowrap; }
.mb-headbox .mb-account a:hover { text-decoration: underline; }
.mb-headbox .mb-account .fa-solid { margin-right: 4px; }

@media (min-width: 992px) {
  /* freie Hoehe unter der Schiene (ab ca. 182px) bis Kopfende (236px) nutzen */
  .mb-crumb { max-width: 520px; }
  .mb-crumb a, .mb-crumb a:visited, .mb-crumb a:hover { color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, .55); }
  .mb-headbox { left: 540px; top: 182px; width: 434px; font-size: 13px; }
  .mb-headbox .mb-account { width: auto; display: flex; justify-content: flex-end; align-items: center; width: max-content; max-width: 100%; height: 22px; line-height: 22px; padding: 0 10px; font-weight: bold; font-size: 13px; }
  .mb-headbox .mb-account .mb-sep { padding: 0 8px; opacity: .7; }
  .mb-theme .mb-headbox #cart { margin-top: 4px; }
  .mb-headbox .mb-cart .mb-cart-btn, .mb-headbox .mb-cart .mb-cart-btn:visited { height: 27px; padding: 0 10px; font-size: 14px; font-weight: bold; line-height: 27px; }
  .mb-headbox .mb-cart .mb-cart-btn .fa-solid { font-size: 17px; margin-right: 8px; vertical-align: -2px; }
}
@media (max-width: 991.98px) {
  /* Zeile 1: Mein Konto | Zur Kasse, Zeile 2: Warenkorb ueber die ganze Breite */
  .mb-headbox { flex-wrap: wrap; }
  .mb-headbox .mb-account, .mb-headbox .mb-account:has(.mb-logout) { flex: 0 0 100%; }
  .mb-headbox .mb-account > a { font-size: 15px; padding: 0 8px; }
  .mb-headbox .mb-cart { flex: 0 0 100%; }
  .mb-cart-btn { font-size: 16px; font-weight: bold; min-height: 48px; line-height: 36px; }
  .mb-cart-btn .fa-solid { font-size: 19px; margin-right: 8px; vertical-align: -2px; }
}

/* Warenkorb-Seite (checkout/cart): Zeilen statt Tabelle */
.mb-cl { margin: 0 0 16px; }
.mb-cl-head, .mb-cl-row { display: grid; grid-template-columns: 76px minmax(0, 1fr) 96px 96px; grid-template-areas: "img name price total" "img qty price total"; gap: 6px 12px; align-items: center; padding: 10px 12px; }
.mb-cl-head { grid-template-areas: "img name price total"; }
.mb-cl-head .mb-cl-qty { display: none; }
.mb-cl-img { grid-area: img; } .mb-cl-name { grid-area: name; align-self: end; } .mb-cl-qty { grid-area: qty; align-self: start; } .mb-cl-price { grid-area: price; } .mb-cl-total { grid-area: total; }
.mb-cl-head .mb-cl-name { align-self: center; }
.mb-cl-head { padding-top: 4px; padding-bottom: 6px; font-weight: bold; color: #555; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; }
.mb-cl-row { border-radius: 6px; background: #fff; }
.mb-cl-row:nth-of-type(even) { background: #F1F7F1; }
.mb-cl-row + .mb-cl-row { margin-top: 6px; }
.mb-cl-img img { display: block; max-width: 72px; height: auto; border-radius: 4px; }
.mb-cl-name > a { font-weight: bold; color: #1a4d1a; }
.mb-cl-name ul { margin-top: 2px; color: #666; }
.mb-cl-price, .mb-cl-total { text-align: right; white-space: nowrap; }
.mb-cl-total { font-weight: bold; }
.mb-cl-qtybox { display: flex; gap: 6px; align-items: center; }
.mb-cl-qtybox .form-control { width: 56px; flex: 0 0 56px; text-align: center; border-radius: 6px; }
.mb-cl-qtybox .btn { border-radius: 6px; padding: 5px 8px; font-size: 12px; white-space: nowrap; }
.mb-cl-qtybox .btn-danger { background: #fff; color: #b02a37; border: 1px solid #e3b3b8; }
.mb-cl-qtybox .btn-danger:hover { background: #b02a37; color: #fff; }
.mb-cl-totals { width: 100%; max-width: 380px; margin: 14px 0 0 auto; padding: 10px 12px; background: #F1F7F1; border-radius: 6px; }
.mb-cl-sum { display: flex; justify-content: space-between; gap: 16px; padding: 3px 0; }
.mb-cl-sum > span:last-child { text-align: right; white-space: nowrap; }
.mb-cl-sum.mb-cl-grand { margin-top: 6px; padding-top: 8px; font-weight: bold; font-size: 1.3em; color: #1a4d1a; }
.mb-cl-modules { margin: 18px 0 0; }
.mb-cl-modules .accordion-item, .mb-cl-modules .accordion-button { border: 0; box-shadow: none; }
.mb-cl-modules .accordion-item { margin-bottom: 6px; background: #F1F7F1; border-radius: 6px; overflow: hidden; }
.mb-cl-modules .accordion-button { background: #F1F7F1; }
.mb-cl-actions { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin: 20px 0 10px; }
.mb-cl-actions-empty { justify-content: flex-start; }
.mb-theme .mb-cl-btn { min-height: 46px; padding: 10px 22px; font-size: 16px; font-weight: bold; border-radius: 8px; }
.mb-theme .mb-cl-actions .btn-light { background: #fff; border: 1px solid #b9cdb9; color: #1a4d1a; }
.mb-theme .mb-cl-actions .btn-light:hover { background: #F1F7F1; color: #1a4d1a; }
.mb-theme a.btn.btn-primary, .mb-theme a.btn.btn-primary:link, .mb-theme a.btn.btn-primary:visited,
.mb-theme a.btn.btn-primary:hover, .mb-theme a.btn.btn-primary:focus, .mb-theme a.btn.btn-primary:active { color: #fff; }
.mb-theme .mb-cl-checkout { background: var(--mb-bar); border-color: var(--mb-bar); }
.mb-theme .mb-cl-checkout:hover { filter: brightness(1.12); background: var(--mb-bar); border-color: var(--mb-bar); }
@media (max-width: 767.98px) {
  .mb-cl-head { display: none; }
  .mb-cl-row { grid-template-columns: 72px minmax(0, 1fr); grid-template-areas: "img name" "qty qty" "price total"; gap: 8px 12px; padding: 12px; }
  .mb-cl-row .mb-cl-img { grid-area: img; }
  .mb-cl-row .mb-cl-img img { max-width: 72px; }
  .mb-cl-row .mb-cl-name { grid-area: name; font-size: 15px; align-self: center; }
  .mb-cl-row .mb-cl-qty { grid-area: qty; }
  .mb-cl-row .mb-cl-price { grid-area: price; text-align: left; }
  .mb-cl-row .mb-cl-total { grid-area: total; }
  .mb-cl-price::before, .mb-cl-total::before { content: attr(data-label) ": "; font-weight: normal; color: #666; }
  .mb-cl-qtybox .form-control { min-height: 44px; }
  .mb-cl-qtybox .btn { min-height: 44px; flex: 1; font-size: 14px; }
  .mb-cl-totals { max-width: none; font-size: 15px; }
  .mb-cl-actions { flex-direction: column-reverse; }
  .mb-theme .mb-cl-btn { width: 100%; min-height: 50px; font-size: 17px; }
}

/* "Zurueck" unter den Suchergebnissen (alter Shop: 1_button_back.jpg, 137x40, mittig unter der Seitenleiste) */
.mb-list-back { text-align: center; margin: 12px 0 6px; }
.mb-theme .mb-list-back .mb-btn-back, .mb-theme .mb-list-back .mb-btn-back:visited, .mb-theme .mb-list-back .mb-btn-back:hover { color: #fff; }
.mb-theme .mb-list-back .mb-btn-back { display: inline-block; width: 137px; height: 40px; line-height: 40px; min-width: 0; padding: 0; font-size: 12px; text-decoration: none; }
@media (max-width: 991.98px) { .mb-theme .mb-list-back .mb-btn-back { width: 100%; max-width: 320px; min-height: 44px; height: auto; line-height: 44px; font-size: 15px; } }

/* 1.2.7: Alle Buttons einheitlich gruen mit weisser Schrift und 6px Radius (auch Hover/Fokus/Aktiv/Deaktiviert/besucht).
   Betrifft Bootstrap .btn (primary, light, info, danger, secondary, outline ...), submit/button-Felder, Shop-Buttons,
   Suchknopf im Kopf und den Menueknopf am Handy. Ausnahme bewusst: Sprachwahl (mb-lang-btn) und Kopfleisten-Links. */
.mb-theme .btn:not(.btn-close):not(.btn-link), .mb-theme input[type=submit], .mb-theme input[type=button], .mb-theme input[type=reset],
.mb-theme .mb-btn-cart, .mb-btn-cart, .mb-theme .mb-search button, .mb-theme .mb-burger {
  --bs-btn-color: #fff; --bs-btn-bg: #3e8239; --bs-btn-border-color: #2d6a2a;
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #346f30; --bs-btn-hover-border-color: #2d6a2a;
  --bs-btn-active-color: #fff; --bs-btn-active-bg: #2d6a2a; --bs-btn-active-border-color: #2d6a2a;
  --bs-btn-disabled-color: #fff; --bs-btn-disabled-bg: #3e8239; --bs-btn-disabled-border-color: #2d6a2a;
  --bs-btn-focus-shadow-rgb: 62, 130, 57; --bs-btn-border-radius: 6px;
  color: #fff !important; background-color: #3e8239 !important; background-image: var(--mb-btn-gradient) !important;
  border: 1px solid #2d6a2a !important; border-radius: 6px !important; text-shadow: var(--mb-shadow-text);
}
.mb-theme .btn:not(.btn-close):not(.btn-link):is(:hover, :focus, :focus-visible, :active, .active, :visited, :link),
.mb-theme input[type=submit]:is(:hover, :focus, :active), .mb-theme input[type=button]:is(:hover, :focus, :active),
.mb-theme .mb-btn-cart:is(:hover, :focus, :active, :visited, :link), .mb-btn-cart:is(:hover, :focus, :visited),
.mb-theme .mb-search button:is(:hover, :focus), .mb-theme .mb-burger:is(:hover, :focus) { color: #fff !important; text-decoration: none; }
.mb-theme .btn:not(.btn-close):not(.btn-link):is(:hover, :active, .active), .mb-theme input[type=submit]:hover,
.mb-theme .mb-btn-cart:hover, .mb-btn-cart:hover, .mb-theme .mb-search button:hover, .mb-theme .mb-burger:hover {
  background-image: none !important; background-color: #346f30 !important; filter: none;
}
.mb-theme .btn:not(.btn-close):not(.btn-link):focus-visible { box-shadow: 0 0 0 .2rem rgba(62, 130, 57, .45); }
.mb-theme .btn:not(.btn-close):not(.btn-link):is(:disabled, .disabled), .mb-theme input[type=submit]:disabled { color: #fff !important; background-color: #3e8239 !important; opacity: .65; }
.mb-theme .btn i, .mb-theme .btn .fa-solid { color: #fff; }
/* Eingabegruppen: Button mit Abstand statt angesetzt, damit der 6px-Radius ringsum passt */
.mb-theme .input-group > .btn:not(:first-child) { margin-left: 4px !important; }
.mb-theme .input-group > .btn:not(:last-child) { margin-right: 4px; }
/* Suchknopf im Kopf: gruenes Feld mit weisser Lupe */
.mb-theme .mb-search button { padding: 0 6px; line-height: 1; min-width: 26px; align-self: stretch; }

/* ===== 1.3.0: Kasse - Auswahllisten Versand/Zahlung, Zusammenfassung, Sperre ===== */
#checkout-checkout .mb-co-method .input-group-text { background: var(--mb-bg-light); color: #3e8239; border-radius: 8px 0 0 8px; }
#checkout-checkout .mb-co-select { border-radius: 0 8px 8px 0; background-color: #fff; font-weight: bold; color: #1a4622; cursor: pointer; }
#checkout-checkout .mb-co-select:disabled { background-color: #fff; opacity: 1; cursor: default; color: #1a4622; }
#checkout-checkout .mb-co-select:disabled option[value=""] { color: #777; }
#checkout-checkout .mb-co-select.mb-co-single { background-image: none; padding-right: .75rem; }
#checkout-checkout .mb-co-select:focus { border-color: #3e8239; box-shadow: 0 0 0 .2rem rgba(62, 130, 57, .25); }
#checkout-checkout .mb-co-hint { color: #555; margin-top: 4px; }
#checkout-checkout .mb-co-method { padding: 10px 12px 12px; border: 1px solid #cfe3cf; border-radius: 10px; background: #fff; transition: box-shadow .3s, border-color .3s; }
#checkout-checkout .mb-co-method legend { float: none; width: auto; padding: 0 6px; margin: 0 0 4px -6px; font-size: 1.15rem; color: #1a4622; }
#checkout-checkout .mb-co-flash { border-color: #3e8239; box-shadow: 0 0 0 3px rgba(62, 130, 57, .35); }
#checkout-checkout .mb-co-summary { padding: 12px 14px; margin-bottom: 14px; border: 1px solid #3e8239; border-radius: 10px; background: var(--mb-bg-light); color: #1a2e1a; }
#checkout-checkout .mb-co-summary-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; color: #1a4622; font-size: 1.05rem; }
#checkout-checkout .mb-co-summary-head .fa-solid { color: #3e8239; }
#checkout-checkout .mb-co-summary .mb-co-change { margin-left: auto; padding: 3px 12px; border: 1px solid #3e8239; border-radius: 14px; background: #fff; color: #3e8239; font-size: .9rem; text-decoration: none; white-space: nowrap; }
#checkout-checkout .mb-co-summary .mb-co-change:hover { background: #3e8239; color: #fff; }
#checkout-checkout .mb-co-label { font-weight: bold; color: #3e8239; margin-bottom: 2px; }
#checkout-checkout .mb-co-lock { margin: 0 0 8px; padding: 8px 12px; border: 1px dashed #3e8239; border-radius: 10px; background: #fff; color: #1a4622; font-weight: bold; }
#checkout-checkout .mb-co-lock .fa-solid { color: #3e8239; }
#checkout-checkout #checkout-confirm.mb-co-locked { opacity: .45; pointer-events: none; filter: grayscale(.6); user-select: none; }
@media (max-width: 767.98px) {
  #checkout-checkout .mb-co-select, #checkout-checkout .mb-co-method .input-group-text { min-height: 48px; font-size: 16px; }
  #checkout-checkout .mb-co-summary .mb-co-change { margin-left: 0; min-height: 36px; line-height: 28px; }
  #checkout-checkout .mb-co-summary-head { font-size: 1rem; }
}

/* ===================================================================== 1.3.2: Meldungen (#alert)
   Vorher: OpenCart-Popup blassgrün/-rot mit dunkler 11px-Schrift bei 30 % Höhe über Inhalt und Sprachwahl,
   nach 3 s ausgeblendet. Jetzt: unter dem Kopf mittig (Position per mb_alert.js), Miniaturbahn-Grün/Rot mit
   weißer Schrift, Info/Hinweis neutral, 6px Ecken, leichter Schatten; Handy volle Breite. */
#alert {
  position: fixed; z-index: 1090; top: 190px; left: 50%; right: auto; bottom: auto;
  width: min(560px, calc(100vw - 24px)); margin: 0; padding: 0; transform: translateX(-50%);
  pointer-events: none;
}
#alert .alert {
  pointer-events: auto; display: flex; align-items: center; gap: 10px; flex-wrap: nowrap;
  margin: 0 0 8px; padding: 12px 14px; border: 0; border-radius: 6px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .22); font-size: 14px; line-height: 1.4; font-weight: normal;
  background: #f4f6f4; color: #1d2b1f; text-align: left;
  animation: mb-alert-in .18s ease-out;
}
#alert .alert.mb-alert-out { opacity: 0; transform: translateY(-6px); transition: opacity .3s ease, transform .3s ease; }
@keyframes mb-alert-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
#alert .alert-success { background: linear-gradient(#2e8133, #1f5e26); color: #fff; }
#alert .alert-danger  { background: #c62828; color: #fff; }
#alert .alert-warning { background: #fff8e1; color: #3b2f00; border-left: 5px solid #e0a800; }
#alert .alert-info, #alert .alert-primary, #alert .alert-secondary, #alert .alert-light, #alert .alert-dark {
  background: #f4f6f4; color: #1d2b1f; border-left: 5px solid #2e8133;
}
#alert .mb-alert-icon { flex: 0 0 auto; font-size: 18px; }
#alert .mb-alert-body { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; }
#alert .mb-alert-text { flex: 1 1 220px; min-width: 0; overflow-wrap: anywhere; }
#alert .alert-success a, #alert .alert-danger a,
#alert .alert-success a:visited, #alert .alert-danger a:visited { color: #fff; text-decoration: underline; font-weight: bold; }
#alert .alert-success a:hover, #alert .alert-danger a:hover { color: #fff; text-decoration: none; }
#alert .alert-warning a, #alert .alert-info a { color: #1a4622; text-decoration: underline; }
#alert .alert a.mb-alert-btn, #alert .alert a.mb-alert-btn:visited {
  flex: 0 0 auto; padding: 5px 12px; border: 1px solid #fff; border-radius: 6px; background: rgba(255, 255, 255, .14);
  color: #fff; font-weight: bold; text-decoration: none; white-space: nowrap;
}
#alert .alert a.mb-alert-btn:hover, #alert .alert a.mb-alert-btn:focus { background: #fff; color: #1f5e26; text-decoration: none; }
#alert .mb-alert-close {
  flex: 0 0 auto; width: 30px; height: 30px; margin: -4px -6px -4px 0; padding: 0; border: 0; border-radius: 6px;
  background: transparent; color: inherit; font-size: 24px; line-height: 28px; cursor: pointer; opacity: .9;
}
#alert .mb-alert-close:hover, #alert .mb-alert-close:focus { opacity: 1; background: rgba(255, 255, 255, .18); }
#alert .alert-warning .mb-alert-close:hover, #alert .alert-info .mb-alert-close:hover { background: rgba(0, 0, 0, .07); }
#alert .btn-close { filter: invert(1); opacity: .9; }
@media (max-width: 767.98px) {
  #alert { left: 0; right: 0; width: auto; transform: none; padding: 0 6px; }
  #alert .alert { margin: 6px 0 0; padding: 12px; font-size: 15px; }
  #alert .alert a.mb-alert-btn { padding: 8px 14px; }
  #alert .mb-alert-icon { align-self: flex-start; margin-top: 2px; }
  #alert .mb-alert-close { align-self: flex-start; }
  #alert .mb-alert-close { width: 40px; height: 40px; line-height: 38px; }
}
/* Meldungen im Inhalt (Konto, Kasse, Kontakt …): gleich gut lesbar */
.mb-theme #mb-main .alert { border-radius: 6px; font-size: 13px; }
.mb-theme #mb-main .alert-success { background: #2e8133; border-color: #2e8133; color: #fff; }
.mb-theme #mb-main .alert-success a { color: #fff; text-decoration: underline; }
.mb-theme #mb-main .alert-danger { background: #c62828; border-color: #c62828; color: #fff; }
.mb-theme #mb-main .alert-danger a { color: #fff; text-decoration: underline; }
.mb-theme #mb-main .alert-info, .mb-theme #mb-main .alert-warning { background: #f4f6f4; border: 0; border-left: 5px solid #2e8133; color: #1d2b1f; }
.mb-theme #mb-main .alert-warning { border-left-color: #e0a800; background: #fff8e1; color: #3b2f00; }
.mb-theme #mb-main .alert .btn-close { filter: none; }
.mb-theme #mb-main .alert-success .btn-close, .mb-theme #mb-main .alert-danger .btn-close { filter: invert(1); }
/* 1.5.2: Newsletter-Box Startseite wie im alten Shop (408x247 Hintergrundbild, Text ab 60 px, gelbes Eingabefeld) */
.mb-theme .mb-newsletter { position: relative; width: 408px; max-width: 100%; height: 247px; margin: 12px auto; background: url('../image/1_newsletter_box.jpg') no-repeat center top; text-align: center; font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #000; }
.mb-theme .mb-newsletter .mb-nl-title { margin: 0; padding-top: 60px; font-size: 12px; line-height: 1.35; }
.mb-theme .mb-newsletter .mb-nl-row { margin: 12px 0 0; }
.mb-theme .mb-newsletter label { font-size: 12px; margin-right: 6px; }
.mb-theme .mb-newsletter input[type=email] { background: #ffc; border: 1px solid #006; width: 223px; max-width: 70%; font-size: 12px; padding: 1px 3px; border-radius: 0; }
.mb-theme .mb-newsletter .mb-nl-btn { display: block; margin: 20px auto 0; border: 0; padding: 0; }

/* 1.5.5: News aus Admin > News (CMS-Beiträge) - Startseite, Liste, Einzel-News */
.mb-news-item .mb-news-link { margin: 6px 0 0; font-size: 11px; }
.mb-news-page .mb-news-all { width: 100%; padding-right: 0; margin-top: 8px; }

/* 1.5.6: Anfrage nur angemeldet - Hinweis statt Kontaktformular für Gäste */
.mb-contact-login .alert { margin: 4px 0 12px; font-size: 13px; }
.mb-contact-login .alert p { margin: 0 0 10px; }
.mb-contact-login .mb-contact-buttons { margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.mb-contact-login .mb-contact-buttons .btn { min-width: 120px; }
