/* ====================================================================
   ROHFUTTER FÜR HUNDE — Theme-Skin v8 (clean rewrite)
   Modified eCommerce 3.3.0 / tpl_modified_nova
   Reproduziert das Klon-Look-and-feel von rohfutter-fuer-hunde.de
   2026-05-08
   ==================================================================== */

/* ---------------- DESIGN TOKENS ---------------- */
:root {
  --rf-green:        #0a8028;
  --rf-green-dark:   #087a28;
  --rf-green-darker: #06621f;
  --rf-green-soft:   #d8f0e1;
  --rf-green-tint:   #e8f5ec;
  --rf-text:         #333333;
  --rf-text-soft:    #666666;
  --rf-headline:     #0e1a13;
  --rf-bg:           #ffffff;
  --rf-bg-alt:       #f7f7f7;
  --rf-border:       #e5e5e5;

  --rf-radius:       3px;
  --rf-radius-lg:    6px;

  --rf-fs-h1: clamp(2rem, 4.2vw, 3.4rem);
  --rf-fs-h2: clamp(1.5rem, 2.6vw, 2.1rem);
  --rf-fs-h3: 1.25rem;
  --rf-fs-base: 16px;

  --rf-shadow-sm: 0 2px 4px rgba(0,0,0,.06);
  --rf-shadow-md: 0 6px 16px rgba(0,0,0,.08);
  --rf-shadow-lg: 0 18px 38px rgba(0,0,0,.12);

  --rf-section-y: clamp(48px, 6vw, 96px);
}

/* ---------------- BASE ---------------- */
body, .layout_wrap {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif !important;
  color: var(--rf-text);
  background: var(--rf-bg);
  font-size: var(--rf-fs-base);
  line-height: 1.55;
}

h1, h2, h3, h4, h5, h6 {
  font-family: Arial, sans-serif !important;
  color: var(--rf-headline);
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.15;
  margin: 0 0 0.6em;
}
h1 { font-size: var(--rf-fs-h1); }
h2 { font-size: var(--rf-fs-h2); }
h3 { font-size: var(--rf-fs-h3); font-weight: 600; }

p { margin: 0 0 1em; }
strong, b { font-weight: 700; color: var(--rf-headline); }
em, i { font-style: italic; }

a {
  color: var(--rf-green);
  text-decoration: none;
  transition: color .15s ease;
}
a:hover { color: var(--rf-green-dark); text-decoration: underline; }

img { max-width: 100%; height: auto; }

/* ---------------- HEADER ---------------- */
.layout_header,
.layout_header_inner {
  background: #fff !important;
  box-shadow: none;
  border-bottom: none;
}

/* Logo-Image jetzt komplett-gemerged (Schriftzug + Hund) — kein CSS-Hack mehr */
.nav-logo {
  display: flex;
  align-items: center;
  text-decoration: none !important;
}
.nav-logo img,
img[src*="logo_head"] {
  display: block !important;
  max-width: 100%;
  height: auto;
}

/* Cat-Nav */
.layout_categories,
.layout_categories_inner {
  background: #fff !important;
  border-bottom: 1px solid var(--rf-border);
}
.layout_categories ul.menu_items > li > a,
.layout_categories ul.menu_items > li.level1 > a {
  color: var(--rf-headline) !important;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.05em;
  padding: 14px 16px;
  transition: all .15s ease;
}
.layout_categories ul.menu_items > li.active1 > a,
.layout_categories ul.menu_items > li:hover > a,
.layout_categories ul.menu_items > li > a:hover {
  background: var(--rf-green) !important;
  color: #fff !important;
}

.col_cart i, .col_account i, .col_search i, .col_settings i,
.search_closer i, .search_help i {
  color: var(--rf-green);
}

/* ALLE Modifies-Buttons: Icons weiß, Text+Icon flex-nebeneinander (nicht überlagernd) */
.cssButton,
.cssButton.cssButtonColor1,
.cssButton.cssButtonColor2,
.cssButton.cssButtonColor3,
.cssButton.cssButtonColor4 {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
  position: relative;
}
.cssButton i,
.cssButton .cssButtonIcon,
.cssButton .cssButtonIcon i,
.cssButton .cssButtonText,
.cssButton.cssButtonColor1 i,
.cssButton.cssButtonColor1 .cssButtonIcon i,
.cssButton.cssButtonColor2 i,
.cssButton.cssButtonColor2 .cssButtonIcon i,
.cssButton.cssButtonColor3 i,
.cssButton.cssButtonColor3 .cssButtonIcon i,
.cssButton.cssButtonColor4 i,
.cssButton.cssButtonColor4 .cssButtonIcon i {
  color: #fff !important;
}
.cssButton .cssButtonIcon {
  display: inline-flex;
  align-items: center;
  font-size: 14px;
}
.cssButton .cssButtonText {
  display: inline;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}
.cssButton:hover .cssButtonIcon i,
.cssButton:hover i,
.cssButton:hover .cssButtonText { color: #fff !important; }

/* Icon-only Buttons (Such-Submit, Cart-Add, Schnellkauf-Submit):
   Wenn kein sichtbarer Text → Button bleibt klein, Icon sitzt mittig durch flex */
.search_button .cssButton,
.col_search .cssButton {
  min-width: 44px;
  min-height: 44px;
}

/* ---------------- BUTTONS ---------------- */
button, .button, .btn,
.product_button, .add_to_cart_button, .single_add_to_cart_button,
a.button, input[type="submit"], input[type="button"],
button.cssButtonText, .cssButton, .cssButtonColor1, .cssButtonColor2 {
  background: var(--rf-green) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--rf-radius) !important;
  padding: 14px 28px !important;
  font-family: Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  line-height: 1.2 !important;
  cursor: pointer;
  transition: background .15s ease, transform .1s ease;
  display: inline-block;
  text-decoration: none !important;
}
button:hover, .button:hover, .btn:hover,
input[type="submit"]:hover, .cssButton:hover {
  background: var(--rf-green-dark) !important;
  color: #fff !important;
  text-decoration: none !important;
}

.cssButton button {
  background: transparent !important; border: none !important;
  padding: 0 !important; color: #fff !important;
}

a.button-secondary, .button-secondary, .btn-secondary {
  background: #fff !important;
  color: var(--rf-green) !important;
  border: 2px solid var(--rf-green) !important;
  padding: 12px 26px !important;
}
a.button-secondary:hover, .button-secondary:hover, .btn-secondary:hover {
  background: var(--rf-green) !important;
  color: #fff !important;
}

/* ---------------- LAYOUT WRAPPER ---------------- */
.layout_content,
.dm_home,
.layout_main,
.content_big {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0;
  width: 100%;
}

/* Modifies Welcome-Wrapper: greeting_text hat column-count:2 (zerteilt content in 2 Spalten!)
   Plus clearfix-Floats. Beides killen für unser Sections-Layout. */
.box_greeting,
.box_greeting .greeting_text,
.box_greeting .greeting_text.cf,
.greeting_text {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  float: none !important;
  clear: both !important;
  column-count: 1 !important;
  columns: 1 !important;
  column-width: auto !important;
}
.box_greeting .greeting_text > *,
.greeting_text > * {
  float: none !important;
  clear: both !important;
  width: auto !important;
  max-width: none !important;
  break-inside: avoid !important;
  column-span: all !important;
}
.box_greeting .greeting_text::before,
.box_greeting .greeting_text::after,
.greeting_text::before, .greeting_text::after { content: none !important; }

/* Welcome-Container voll-breit machen (kein Container-Padding der Modifies-Standard-Boxen) */
.layout_content.dm_home {
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
.layout_content.dm_home > .content_big {
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}

/* ====================================================================
   WELCOME-PAGE SEKTIONEN (rendert in content_text der content_id mit
   content_group=5 — eine eigene Inhaltsseite "Willkommen")
   ==================================================================== */

/* Welcome — Container voll-breit, keine 100vw-Tricks */
.rf-welcome {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  clear: both !important;
  margin: 0 !important;
  padding: 0 !important;
}
.rf-welcome p { color: var(--rf-text); }
.rf-welcome > section,
.rf-welcome > .rf-section,
.rf-welcome > .rf-hero,
.rf-welcome > .rf-testimonial {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  clear: both !important;
  box-sizing: border-box !important;
}

/* ---------- HERO ---------- */
.rf-hero {
  position: relative;
  padding: clamp(48px, 7vw, 96px) clamp(20px, 4vw, 60px) !important;
  background: linear-gradient(180deg, #fff 0%, #fafafa 100%);
  overflow: hidden;
}
.rf-hero__inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  align-items: center;
  gap: clamp(32px, 5vw, 100px);
  max-width: 1240px;
  margin: 0 auto;
}
.rf-hero__text { z-index: 2; min-width: 0; }
.rf-hero__claim {
  font-size: clamp(2.4rem, 5.5vw, 4.4rem) !important;
  font-weight: 800;
  color: var(--rf-headline);
  line-height: 1.05 !important;
  letter-spacing: -0.025em;
  text-transform: uppercase;
  margin: 0 0 28px !important;
  font-family: Arial, sans-serif;
}
.rf-hero__claim em {
  display: inline;
  font-style: normal;
  color: var(--rf-green);
}
.rf-hero__lead {
  font-size: 18px !important;
  line-height: 1.6 !important;
  color: var(--rf-text);
  margin: 0 0 32px !important;
  max-width: 480px;
}
.rf-hero__cta {
  display: inline-block !important;
  margin: 0 0 14px !important;
  padding: 18px 40px !important;
  font-size: 15px !important;
  box-shadow: 0 6px 16px rgba(10,150,50,0.25);
}
.rf-hero__cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(10,150,50,0.35);
}
.rf-hero__delivery {
  font-size: 13px;
  color: var(--rf-text-soft);
  font-style: italic;
  margin: 0;
}
.rf-hero__visual {
  position: relative;
  min-height: 440px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-width: 0;
}
.rf-hero__visual img {
  max-width: 100% !important;
  max-height: 520px !important;
  width: auto;
  height: auto;
  filter: drop-shadow(0 16px 40px rgba(0,0,0,0.2));
  object-fit: contain;
}

/* ---------- SECTIONS ---------- */
.rf-section {
  padding: var(--rf-section-y) clamp(20px, 4vw, 40px);
  background: var(--rf-bg);
}
.rf-section--alt {
  background: var(--rf-bg-alt);
}
.rf-section__inner {
  max-width: 1240px;
  margin: 0 auto;
}
.rf-section__h {
  font-size: var(--rf-fs-h2);
  text-align: center;
  margin: 0 0 clamp(28px, 4vw, 48px);
  color: var(--rf-headline);
  font-weight: 700;
}
.rf-section__h--green { color: var(--rf-green); }

/* ---------- SECTION 2: 4 Hunde + "Wichtigste Grundlage" ---------- */
.rf-promise {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: clamp(32px, 5vw, 80px);
  max-width: 1240px;
  margin: 0 auto;
}
.rf-promise__visual img {
  width: 100%;
  max-width: 540px;
  height: auto;
  display: block;
}
.rf-promise__text h2 {
  font-size: clamp(1.4rem, 2.6vw, 2.1rem);
  margin: 0 0 18px;
  line-height: 1.25;
  color: var(--rf-headline);
}
.rf-promise__text h2 strong { color: var(--rf-green); font-weight: 900; }
.rf-promise__text p {
  font-size: 16px;
  color: var(--rf-text);
  line-height: 1.6;
  margin: 0;
}

/* ---------- SECTION 3: Highlight-Boxen ---------- */
.rf-highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(16px, 2vw, 28px);
  max-width: 880px;
  margin: 0 auto;
}
.rf-highlight {
  background: var(--rf-green);
  color: #fff !important;
  padding: clamp(28px, 4vw, 44px) clamp(20px, 3vw, 36px);
  text-align: center;
  border-radius: var(--rf-radius-lg);
  box-shadow: var(--rf-shadow-md);
  transition: transform .2s ease, box-shadow .2s ease;
}
.rf-highlight:hover {
  transform: translateY(-3px);
  box-shadow: var(--rf-shadow-lg);
}
.rf-highlight h3 {
  color: #fff !important;
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 12px;
}
.rf-highlight p {
  color: rgba(255,255,255,0.92) !important;
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

/* ---------- SECTION 4: Bestellargumente-Grid ---------- */
.rf-args {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: clamp(14px, 1.8vw, 24px);
  max-width: 1240px;
  margin: 0 auto;
}
.rf-arg {
  background: #fff;
  border: 1px solid var(--rf-border);
  border-top: 3px solid var(--rf-green);
  padding: 28px 22px;
  text-align: center;
  border-radius: var(--rf-radius);
  font-size: 14px;
  font-weight: 700;
  color: var(--rf-headline);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  line-height: 1.4;
  transition: transform .2s ease, box-shadow .2s ease, border-top-color .2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100px;
  position: relative;
}
.rf-arg::before {
  content: "✓";
  display: block;
  position: absolute;
  top: -16px; left: 50%;
  transform: translateX(-50%);
  width: 32px; height: 32px;
  background: var(--rf-green);
  color: #fff;
  border-radius: 50%;
  line-height: 32px;
  font-size: 16px;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(10,150,50,0.3);
}
.rf-arg:hover {
  transform: translateY(-3px);
  box-shadow: var(--rf-shadow-lg);
  border-top-color: var(--rf-green-dark);
}

/* ---------- SECTION 5: Testimonial Fred ---------- */
.rf-testimonial {
  background: var(--rf-bg-alt);
}
.rf-testimonial__inner {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: clamp(24px, 3vw, 48px);
  max-width: 700px;
  margin: 0 auto;
  background: #fff;
  padding: clamp(24px, 3vw, 40px);
  border-radius: var(--rf-radius-lg);
  box-shadow: var(--rf-shadow-md);
}
.rf-testimonial__photo {
  width: clamp(120px, 14vw, 180px);
  height: auto;
}
.rf-testimonial__photo img { width: 100%; height: auto; display: block; }
.rf-testimonial__quote {
  font-family: Georgia, serif;
  font-style: italic;
  color: var(--rf-green);
  font-size: clamp(1.4rem, 2.5vw, 2rem);
  line-height: 1.25;
  margin: 0 0 14px;
  font-weight: 600;
}
.rf-testimonial__author {
  font-size: 14px;
  color: var(--rf-text-soft);
  margin: 0;
  font-weight: 600;
}

/* ====================================================================
   SUB-PAGE BANNER (4 Hunde) — nur auf Sub-Pages, nicht auf Welcome
   ==================================================================== */
.layout_categories { position: relative; }
.layout_categories::after {
  content: "";
  display: block;
  width: 100%;
  max-width: 1240px;
  height: 220px;
  margin: 24px auto 32px;
  background: url("img/rohfutter/dogs.png") no-repeat center;
  background-size: contain;
}
/* Banner NICHT auf: Welcome, Inhaltsseiten (haben eigenen Hero), Login */
body:has(.dm_home) .layout_categories::after,
.layout_wrap:has(.dm_home) .layout_categories::after,
body:has(.dm_content) .layout_categories::after,
.layout_wrap:has(.dm_content) .layout_categories::after,
body:has(.dm_login) .layout_categories::after,
.layout_wrap:has(.dm_login) .layout_categories::after,
body:has(.dm_account) .layout_categories::after,
.layout_wrap:has(.dm_account) .layout_categories::after {
  display: none !important;
}

/* Modifies Default-Slider/Welcome-Banner ausblenden */
.slider_row,
.splide_slider_single,
.splide.splide_slider_single { display: none !important; }

/* ====================================================================
   TOUREN-SEITE
   ==================================================================== */
.rf-touren {
  font-family: Arial, sans-serif;
  color: var(--rf-text);
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 20px;
}
.rf-tour-hero {
  position: relative;
  height: 460px;
  background-position: right center;
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0 auto 40px;
  border-radius: var(--rf-radius-lg);
  overflow: hidden;
}
.rf-tour-hero__steak {
  position: absolute;
  left: 50%; top: 50%;
  transform: translate(-110%, -50%);
  max-width: 480px; max-height: 400px;
  height: auto;
  filter: drop-shadow(0 8px 20px rgba(0,0,0,0.15));
}

/* Hero v3: nur EIN Bild (header-1.jpg enthält Steak + Welpe) — voll-breit zentriert */
.rf-tour-hero-v3 {
  text-align: center;
  margin: 20px auto 50px;
  padding: 0 clamp(20px, 3vw, 30px);
  max-width: 1240px;
}
.rf-tour-hero-v3 img {
  width: 100%;
  max-width: 1100px;
  height: auto;
  display: inline-block;
  filter: drop-shadow(0 12px 30px rgba(0,0,0,0.12));
}
.rf-tour-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin: 30px auto 40px;
}
.rf-tour-tabs a {
  display: inline-block;
  padding: 10px 18px;
  background: #f0f0f0;
  color: var(--rf-green);
  border-radius: var(--rf-radius);
  font-size: 13px;
  font-weight: 600;
  transition: all .15s ease;
  text-decoration: none !important;
}
.rf-tour-tabs a:hover {
  background: var(--rf-green);
  color: #fff !important;
}

.rf-section-h {
  font-size: 22px;
  font-weight: 700;
  color: var(--rf-headline);
  margin: 30px 0 18px;
}

.rf-liefer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 40px;
}
.rf-liefer-grid ul { list-style: disc; padding-left: 20px; margin: 0; }
.rf-liefer-grid li { padding: 5px 0; font-size: 14px; }

.rf-witz {
  text-align: center;
  margin: 70px auto 60px;
  max-width: 1100px;
  padding: 0 20px;
  display: flex !important;
  justify-content: center;
}
.rf-witz img {
  width: 100% !important;
  max-width: 800px !important;
  min-width: 320px;
  height: auto;
  display: block !important;
  margin: 0 auto;
}

.rf-tour-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin: 40px 0;
}
.rf-tour-card {
  border-top: 3px solid var(--rf-green);
  padding: 14px 0;
}
.rf-tour-card__h {
  font-size: 14px; font-weight: 700; color: var(--rf-headline);
  text-transform: uppercase; letter-spacing: 0.08em; margin: 0 0 4px;
}
.rf-tour-card__date { font-size: 12px; color: var(--rf-text-soft); margin-bottom: 12px; font-style: italic; }
.rf-tour-card ul { list-style: none; padding: 0; margin: 0; }
.rf-tour-card li { padding: 5px 0; font-size: 14px; color: var(--rf-green); font-weight: 600; }

.rf-tour-foot { text-align: center; font-size: 13px; margin: 30px 0 50px; color: var(--rf-text-soft); }

/* ====================================================================
   PRODUCT / KATEGORIE / SHOP
   ==================================================================== */
.products_price, .product_info .price, .product .price {
  color: var(--rf-green) !important;
  font-weight: 700;
  font-size: 22px;
}

.breadcrumbs, .breadcrumb {
  background: var(--rf-bg-alt);
  padding: 10px 18px;
  border-radius: var(--rf-radius);
  font-size: 13px;
  color: var(--rf-text-soft);
}

table th {
  background: var(--rf-green);
  color: #fff;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.05em;
}

/* ---------------- INPUTS ---------------- */
input[type="text"], input[type="email"], input[type="password"],
textarea, select {
  border: 1px solid var(--rf-border) !important;
  border-radius: var(--rf-radius) !important;
  padding: 10px 14px !important;
  font-family: Arial, sans-serif !important;
  font-size: 14px;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, textarea:focus, select:focus {
  border-color: var(--rf-green) !important;
  outline: none;
  box-shadow: 0 0 0 3px rgba(10, 150, 50, 0.18);
}

/* ====================================================================
   FOOTER (vollflächig grün, weißer Text)
   ==================================================================== */
.layout_footer,
.layout_footer_inner,
footer.layout_footer {
  background: var(--rf-green) !important;
  color: #fff !important;
  padding: clamp(40px, 5vw, 64px) 0 !important;
}

.layout_footer,
.layout_footer *,
.layout_footer p, .layout_footer span, .layout_footer div, .layout_footer li,
.layout_footer h1, .layout_footer h2, .layout_footer h3, .layout_footer h4,
.layout_footer .content_box_header,
.layout_footer .footer_text,
.layout_footer label, .layout_footer strong, .layout_footer em, .layout_footer small {
  color: #fff !important;
}

.layout_footer h1, .layout_footer h2, .layout_footer h3, .layout_footer h4,
.layout_footer .content_box_header {
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  font-size: 14px !important;
  margin-bottom: 18px !important;
}

.layout_footer a, .layout_footer a:link, .layout_footer a:visited {
  color: #fff !important;
  text-decoration: none !important;
  border-bottom: 1px solid transparent;
  transition: border-color .15s ease;
}
.layout_footer a:hover, .layout_footer a:focus {
  color: #fff !important;
  text-decoration: none !important;
  border-bottom-color: rgba(255,255,255,0.7);
}

.layout_footer ul { list-style: none; padding: 0; margin: 0; }
.layout_footer ul li { padding: 5px 0; }

.layout_footer input[type="text"], .layout_footer input[type="email"] {
  background: #fff !important;
  color: var(--rf-headline) !important;
  border: 1px solid rgba(255,255,255,0.3) !important;
}

/* Footer-Bottom (mod_copyright) */
.mod_copyright {
  color: #fff !important;
  font-size: 13px !important;
  text-align: center;
  margin-top: 32px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,0.18);
  line-height: 1.6;
}
.mod_copyright a, .mod_copyright a:link, .mod_copyright a:visited {
  color: #fff !important;
  text-decoration: underline !important;
}

/* Zahlungs-Logos: weißer Hintergrund damit dunkle Logos sichtbar */
.layout_footer img[src*="payment"],
.layout_footer .payment_logo img,
.layout_footer .ot_logo img {
  background: #fff !important;
  padding: 6px 8px !important;
  border-radius: var(--rf-radius) !important;
  display: inline-block;
}

/* Footer-Hund entfernt — Fred ist schon im Testimonial-Card */
.layout_footer { position: relative; }
.layout_footer::before { content: none !important; }

/* Newsletter-Box ausblenden (zusätzlich zur Backend-Deaktivierung als Sicherheit) */
.box_newsletter,
[class*="newsletter"]:not(.layout_footer):not(.layout_footer *),
.module_smarty_newsletter,
.module_newsletter,
form#newsletter_signup,
form[action*="newsletter"] {
  display: none !important;
}

/* Footer minimaler: KONTAKT + INFORMATIONEN nebeneinander, keine Zahlungsmethoden, keine Social */
.layout_footer .content_box_payment,
.layout_footer .content_box_social {
  display: none !important;
}
/* Kompletten footer_item ausblenden, der nur Payment+Social enthielt */
.layout_footer .footer_item:has(.content_box_payment),
.layout_footer .footer_item:has(.content_box_social) {
  display: none !important;
}
/* Leere footer_items raus */
.layout_footer .footer_item:empty { display: none !important; }

/* Footer-Layout: 2 Spalten (Kontakt links, Informationen rechts daneben) */
.layout_footer .layout_footer_inner > .flex_footer_row,
.layout_footer .layout_footer_inner > .footer_inner_wrap {
  display: flex !important;
  flex-wrap: wrap;
  gap: clamp(32px, 5vw, 80px);
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 clamp(20px, 4vw, 40px);
  justify-content: flex-start;
  align-items: flex-start;
}
.layout_footer .footer_item {
  flex: 0 1 auto;
  min-width: 220px;
  max-width: 380px;
}

/* Sub-Page Sidebar (Informationen rechts neben dem Hauptcontent) ausblenden — alles steht im Footer */
.flex_content_col_2 { display: none !important; }
.flex_content_col_1 {
  flex: 1 1 100% !important;
  width: 100% !important;
  max-width: 100% !important;
}
.flex_content_row {
  display: block !important;
}

/* ====================================================================
   RESPONSIVE
   ==================================================================== */
@media (max-width: 900px) {
  .rf-hero__inner { grid-template-columns: 1fr; gap: 32px; text-align: center; }
  .rf-hero__lead { margin-left: auto; margin-right: auto; }
  .rf-hero__visual { min-height: 280px; }
  .rf-promise { grid-template-columns: 1fr; gap: 24px; text-align: center; }
  .rf-highlights { grid-template-columns: 1fr; }
  .rf-tour-hero { height: 320px; }
  .rf-tour-hero__steak { max-width: 240px; transform: translate(-50%, -50%); left: 50%; }
  .rf-liefer-grid, .rf-tour-grid { grid-template-columns: 1fr 1fr; }
  .rf-witz { grid-template-columns: 1fr; }
  .rf-testimonial__inner { grid-template-columns: 1fr; text-align: center; justify-items: center; }
}
@media (max-width: 560px) {
  .rf-liefer-grid, .rf-tour-grid { grid-template-columns: 1fr; }
  .rf-args { grid-template-columns: 1fr; }
  .rf-hero__claim { font-size: 1.8rem; }
  .layout_footer::before { display: none; }
}

/* ---------------- ABSCHLUSS ---------------- */

/* ---------------- LEGAL/CONTENT TYPOGRAPHY ---------------- */
.content_site p,
.greeting_text p,
.product_info_description p {
  margin: 0 0 1em 0 !important;
  line-height: 1.6;
}
.content_site h2,
.content_site h3,
.content_site h4 {
  margin-top: 1.6em !important;
  margin-bottom: 0.5em !important;
  color: #1a1a1a;
  font-weight: 700;
}
.content_site h3 { font-size: 1.15rem; }
.content_site h2 { font-size: 1.4rem; }
.content_site ul,
.content_site ol {
  margin: 0 0 1em 1.4em;
  padding: 0;
  line-height: 1.6;
}
.content_site li { margin-bottom: 0.3em; }
.content_site a { color: #0a8028; text-decoration: underline; }
.content_site a:hover { color: #086f25; }


/* ---------------- PRODUKT-INFO-TABELLE ---------------- */
table.rf-info-table {
  width: 100%;
  border-collapse: collapse;
  margin: 1em 0 2em 0;
  font-size: 0.95rem;
}
table.rf-info-table th,
table.rf-info-table td {
  text-align: left;
  vertical-align: top;
  padding: 0.6em 0.8em;
  border-bottom: 1px solid #e5e5e5;
}
table.rf-info-table th {
  width: 28% !important;
  background: #f7faf6 !important;
  color: #1a1a1a !important;
  font-weight: 600 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 0.95rem !important;
}
table.rf-info-table td { color: #333; }
.product_info_description h3 {
  margin-top: 1.6em !important;
  margin-bottom: 0.5em !important;
  font-size: 1.15rem;
  color: #1a1a1a;
  font-weight: 700;
}


/* ---------------- MINDESTBESTELLWERT-HINWEIS ---------------- */
.rf-min-order-notice {
  display: flex;
  align-items: center;
  gap: 14px;
  background: #fff8e1;
  border: 1px solid #f0c040;
  border-radius: 6px;
  padding: 14px 18px;
  margin: 16px 0;
  color: #5a4a18;
  line-height: 1.5;
}
.rf-min-order-notice--blocked {
  background: #fff3cd;
  border-color: #d4a818;
}
.rf-min-order-icon {
  font-size: 28px;
  line-height: 1;
  flex: 0 0 auto;
}
.rf-min-order-text {
  flex: 1 1 auto;
  font-size: 14px;
}
.rf-min-order-text strong { color: #1a1a1a; }

/* Weltkugel/Settings-Toggle ausblenden — nur 1 Sprache, 1 Währung, 1 Versandland (DE), Panel nutzlos */
.col_settings,
#toggle_settings,
.toggle_settings { display: none !important; }

/* ---------------- CART SIDE-PANEL ---------------- */
.rf-cart-overlay {
  position: fixed; inset: 0;
  background: rgba(0,0,0,0.45);
  opacity: 0; pointer-events: none;
  transition: opacity .25s ease;
  z-index: 9998;
}
.rf-cart-overlay.open { opacity: 1; pointer-events: auto; }

.rf-cart-panel {
  position: fixed; top: 0; right: -460px;
  width: 100%; max-width: 420px; height: 100vh;
  background: #fff;
  box-shadow: -8px 0 30px rgba(0,0,0,0.2);
  display: flex; flex-direction: column;
  transition: right .3s ease;
  z-index: 9999;
  font-family: Arial, sans-serif;
}
.rf-cart-panel.open { right: 0; }

.rf-cart-panel__header {
  background: #0a8028; color: #fff;
  padding: 18px 22px;
  display: flex; align-items: center; justify-content: space-between;
  font-size: 16px; font-weight: 700;
}
.rf-cart-panel__header i { margin-right: 8px; }
.rf-cart-panel__close {
  background: transparent; border: none; color: #fff;
  font-size: 28px; line-height: 1; cursor: pointer; padding: 0 4px;
}
.rf-cart-panel__close:hover { opacity: 0.8; }

.rf-cart-panel__body { flex: 1; overflow-y: auto; padding: 24px 22px; }
.rf-cart-panel__product { display: flex; gap: 16px; align-items: flex-start; }
.rf-cart-panel__img {
  width: 96px; height: 96px; object-fit: cover;
  border: 1px solid #e5e5e5; border-radius: 4px;
  background: #fafafa;
}
.rf-cart-panel__info { flex: 1; min-width: 0; }
.rf-cart-panel__qty {
  display: inline-block;
  background: #f7faf6; color: #0a8028;
  font-size: 12px; font-weight: 700;
  padding: 3px 10px; border-radius: 12px;
  margin-bottom: 8px;
}
.rf-cart-panel__name {
  font-size: 15px; font-weight: 700;
  color: #1a1a1a; line-height: 1.3;
  margin-bottom: 6px;
  overflow-wrap: break-word;
}
.rf-cart-panel__price {
  font-size: 18px; font-weight: 700;
  color: #0a8028;
}

.rf-cart-panel__footer {
  padding: 18px 22px;
  border-top: 1px solid #e5e5e5;
  display: flex; flex-direction: column; gap: 10px;
}
.rf-cart-panel__btn {
  display: block; text-align: center;
  padding: 13px 20px;
  border-radius: 4px;
  font-size: 14px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em;
  cursor: pointer;
  text-decoration: none !important;
  border: 2px solid transparent;
  transition: all .15s ease;
}
.rf-cart-panel__btn--primary {
  background: #0a8028 !important; color: #fff !important;
  border-color: #0a8028;
}
.rf-cart-panel__btn--primary:hover { background: #086f25 !important; border-color: #086f25; }
.rf-cart-panel__btn--secondary {
  background: #fff; color: #0a8028 !important;
  border-color: #0a8028;
}
.rf-cart-panel__btn--secondary:hover { background: #f7faf6; }

@media (max-width: 480px) {
  .rf-cart-panel { max-width: 100%; }
}

/* ---------- Cart-Panel Spezifitäts-Fix gegen globale Skin-Regeln ---------- */
.rf-cart-panel .rf-cart-panel__header,
header.rf-cart-panel__header {
  background: #0a8028 !important;
  color: #fff !important;
}
.rf-cart-panel .rf-cart-panel__header *,
.rf-cart-panel .rf-cart-panel__title,
.rf-cart-panel .rf-cart-panel__title i,
.rf-cart-panel .rf-cart-panel__close {
  color: #fff !important;
}
.rf-cart-panel .rf-cart-panel__btn--secondary,
.rf-cart-panel button.rf-cart-panel__btn--secondary {
  background: #fff !important;
  color: #0a8028 !important;
  border: 2px solid #0a8028 !important;
  text-transform: uppercase !important;
  padding: 13px 20px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  border-radius: 4px !important;
}
.rf-cart-panel .rf-cart-panel__btn--secondary:hover,
.rf-cart-panel button.rf-cart-panel__btn--secondary:hover {
  background: #f7faf6 !important;
  color: #0a8028 !important;
}
.rf-cart-panel .rf-cart-panel__btn--primary {
  text-transform: uppercase !important;
  padding: 13px 20px !important;
  font-size: 14px !important;
  letter-spacing: 0.04em !important;
}

/* Cart-Panel über alles, auch über Modifies-Admin-Toolbar */
.rf-cart-overlay { z-index: 2147483646 !important; }
.rf-cart-panel   { z-index: 2147483647 !important; }

/* ---------- Quantity-Stepper (+/- Buttons um products_qty) ---------- */
.rf-qty-stepper {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid #d5d5d5;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  height: 44px;
}
.rf-qty-stepper input[name='products_qty'] {
  border: none !important;
  border-left: 1px solid #d5d5d5 !important;
  border-right: 1px solid #d5d5d5 !important;
  border-radius: 0 !important;
  text-align: center;
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  margin: 0 !important;
  padding: 0 6px !important;
  height: 100% !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  background: #fff !important;
  box-shadow: none !important;
  -moz-appearance: textfield;
}
.rf-qty-stepper input[name='products_qty']::-webkit-outer-spin-button,
.rf-qty-stepper input[name='products_qty']::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.rf-qty-stepper input[name='products_qty']:focus {
  outline: none !important;
  box-shadow: none !important;
}
.rf-qty-stepper__btn {
  background: #f5f5f5 !important;
  color: #333 !important;
  border: none !important;
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 100% !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  cursor: pointer !important;
  padding: 0 !important;
  margin: 0 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  user-select: none;
  transition: background .12s ease;
}
.rf-qty-stepper__btn:hover { background: #e8e8e8 !important; color: #0a8028 !important; }
.rf-qty-stepper__btn:active { background: #d8d8d8 !important; }

/* Layout-Fix: Stepper nicht von Cart-Button überlappen lassen */
.pd_addtobasket_input {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 140px !important;
  max-width: none !important;
  margin-right: 12px !important;
}
.pd_addtobasket_input .rf-qty-stepper {
  width: 140px;
  flex: 0 0 140px;
}
.pd_addtobasket_cart {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
.pd_addtobasket {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  flex-wrap: nowrap !important;
}
@media (max-width: 540px) {
  .pd_addtobasket { flex-wrap: wrap !important; }
  .pd_addtobasket_input { margin-right: 0 !important; margin-bottom: 12px; width: 100% !important; }
  .pd_addtobasket_input .rf-qty-stepper { width: 100% !important; flex: 1 1 100% !important; }
  .pd_addtobasket_cart { width: 100% !important; }
}

/* Mega-Menü-Dropdown beim Hovern deaktivieren – Sub-Kategorien werden nur über die Kategorie-Seite gezeigt */
.layout_categories ul.menu_items > li > .mega_menu,
.layout_categories ul.menu_items > li > ul.level2,
.layout_categories ul.menu_items > li > ul,
.layout_categories ul.menu_items li:hover > .mega_menu,
.layout_categories ul.menu_items li:hover > ul {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
/* Caret/Pfeil neben Top-Kategorien (deutet Dropdown an) ausblenden */
.layout_categories ul.menu_items > li > a > .fa-chevron-down,
.layout_categories ul.menu_items > li > a > .fa-angle-down,
.layout_categories ul.menu_items > li > a > i.fa {
  display: none !important;
}

/* RF: Cart-Stepper-Layout-Fix (richtiger Container ist .pd_addtobasket_row) */
.pd_addtobasket_row {
  display: flex !important;
  align-items: stretch !important;
  flex-wrap: nowrap !important;
  gap: 12px;
}
.pd_addtobasket_row .pd_addtobasket_input {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 140px !important;
  max-width: none !important;
  margin-right: 0 !important;
}
.pd_addtobasket_row .pd_addtobasket_input .rf-qty-stepper {
  width: 140px !important;
  flex: 0 0 140px !important;
}
.pd_addtobasket_row .pd_addtobasket_cart {
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
/* Cart-Button-Text auf Mobile schmaler */
.pd_addtobasket_row .pd_addtobasket_cart .cssButton {
  width: 100% !important;
  min-width: 0 !important;
  padding: 14px 12px !important;
}

@media (max-width: 600px) {
  .pd_addtobasket_row {
    flex-wrap: wrap !important;
    gap: 10px;
  }
  .pd_addtobasket_row .pd_addtobasket_input,
  .pd_addtobasket_row .pd_addtobasket_input .rf-qty-stepper {
    width: 100% !important;
    flex: 1 1 100% !important;
  }
  .pd_addtobasket_row .pd_addtobasket_cart { width: 100% !important; flex: 1 1 100% !important; }
}

/* ---------------- Tour-Landing-Pages ---------------- */
.rf-tour-lead {
  font-size: 18px;
  line-height: 1.6;
  color: var(--rf-text);
  margin: 0 0 28px;
  max-width: 900px;
}
.rf-tour-map {
  margin: 32px 0;
  text-align: center;
}
.rf-tour-map img {
  max-width: 100%;
  height: auto;
  border: 1px solid var(--rf-border);
  border-radius: var(--rf-radius);
  box-shadow: var(--rf-shadow-sm);
  display: inline-block;
}
.rf-tour-map figcaption {
  font-size: 12px;
  color: var(--rf-text-soft);
  margin-top: 8px;
  font-style: italic;
}
.rf-tour-meta {
  background: #f7faf6;
  border-left: 4px solid var(--rf-green);
  padding: 14px 18px;
  margin: 24px 0;
  font-size: 15px;
  border-radius: 0 var(--rf-radius) var(--rf-radius) 0;
}
.rf-tour-cities {
  background: #fafafa;
  padding: 20px 24px;
  border-radius: var(--rf-radius);
  margin: 16px 0 24px;
}
.rf-tour-cities p {
  margin: 0 0 10px;
  line-height: 1.55;
}
.rf-tour-cities p:last-child { margin-bottom: 0; }
.rf-tour-cities strong { color: var(--rf-headline); }
.rf-tour-faq h4 {
  font-size: 16px;
  font-weight: 700;
  color: var(--rf-headline);
  margin: 22px 0 6px;
}
.rf-tour-faq p { margin: 0 0 14px; }
.rf-tour-cta {
  background: var(--rf-green-tint);
  border: 1px solid var(--rf-green-soft);
  border-radius: var(--rf-radius-lg);
  padding: 28px 24px;
  text-align: center;
  margin: 36px 0 12px;
}
.rf-tour-cta-btn {
  display: inline-block;
  background: var(--rf-green) !important;
  color: #fff !important;
  padding: 14px 32px !important;
  border-radius: var(--rf-radius);
  font-weight: 700;
  font-size: 15px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none !important;
  margin-bottom: 8px;
}
.rf-tour-cta-btn:hover {
  background: var(--rf-green-dark) !important;
  color: #fff !important;
}
.rf-tour-cta-sub {
  margin: 4px 0 0;
  font-size: 14px;
  color: var(--rf-text-soft);
}
.rf-tour-cta-sub a { color: var(--rf-green); font-weight: 700; }

.rf-tour-card__more {
  margin: 12px 0 0;
  padding-top: 10px;
  border-top: 1px solid #eee;
}
.rf-tour-card__more a {
  display: inline-block;
  font-size: 13px;
  font-weight: 700;
  color: var(--rf-green);
  text-decoration: none;
  letter-spacing: 0.03em;
}
.rf-tour-card__more a:hover { color: var(--rf-green-dark); text-decoration: underline; }

/* ---------------- Info-Sub-Pages ---------------- */
.rf-info-disclaimer {
  background: #fff8e1;
  border-left: 4px solid #f0c040;
  padding: 14px 18px;
  margin: 0 0 24px;
  border-radius: 0 var(--rf-radius) var(--rf-radius) 0;
  font-size: 14px;
  line-height: 1.55;
}
.rf-info-disclaimer p { margin: 0; }
.rf-info-intro {
  font-size: 17px;
  line-height: 1.6;
  color: var(--rf-text);
  margin: 0 0 24px;
  max-width: 900px;
}
.rf-info-image {
  margin: 24px 0;
  text-align: center;
}
.rf-info-image img {
  max-width: 100%;
  height: auto;
  border-radius: var(--rf-radius);
  box-shadow: var(--rf-shadow-sm);
  display: inline-block;
}
.rf-info-list { padding-left: 20px; margin: 0 0 16px; }
.rf-info-list li { margin-bottom: 8px; line-height: 1.55; }
.rf-info-source {
  margin-top: 32px;
  padding: 12px 16px;
  background: #fafafa;
  border-radius: var(--rf-radius);
  font-size: 13px;
  color: var(--rf-text-soft);
}

/* Hub-Page Tiles */
.rf-info-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 18px;
  margin: 28px 0;
}
.rf-info-tile {
  display: block;
  background: #fff;
  border: 1px solid var(--rf-border);
  border-top: 3px solid var(--rf-green);
  border-radius: var(--rf-radius);
  padding: 22px 20px;
  text-decoration: none !important;
  color: inherit;
  transition: transform .15s ease, box-shadow .15s ease, border-top-color .15s ease;
}
.rf-info-tile:hover {
  transform: translateY(-3px);
  box-shadow: var(--rf-shadow-md);
  border-top-color: var(--rf-green-dark);
}
.rf-info-tile h3 {
  font-size: 17px;
  font-weight: 700;
  color: var(--rf-headline);
  margin: 0 0 10px;
}
.rf-info-tile p {
  font-size: 14px;
  color: var(--rf-text);
  line-height: 1.5;
  margin: 0 0 12px;
}
.rf-info-tile__more {
  font-size: 13px;
  font-weight: 700;
  color: var(--rf-green);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* Bücher-Grid */
.rf-book-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
  margin: 24px 0;
}
.rf-book {
  background: #fafafa;
  border-radius: var(--rf-radius);
  padding: 18px;
  text-align: center;
}
.rf-book img {
  max-width: 140px;
  height: auto;
  margin: 0 auto 14px;
  display: block;
  border-radius: var(--rf-radius);
  box-shadow: var(--rf-shadow-sm);
}
.rf-book h4 {
  font-size: 15px;
  font-weight: 700;
  color: var(--rf-headline);
  margin: 0 0 8px;
}
.rf-book p {
  font-size: 13px;
  color: var(--rf-text);
  line-height: 1.5;
  margin: 0;
  text-align: left;
}

/* Sub-Nav für Info-Pages (BARF-Wissen Tabs) */
.rf-info-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 28px;
  padding: 0 0 16px;
  border-bottom: 1px solid var(--rf-border);
}
.rf-info-subnav a {
  display: inline-block;
  padding: 8px 16px;
  background: #f1f3f5;
  color: var(--rf-text);
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: background .15s ease, color .15s ease;
  white-space: nowrap;
  line-height: 1.4;
}
.rf-info-subnav a:hover {
  background: #e2e6ea;
  color: var(--rf-headline);
}
.rf-info-subnav a[aria-current="page"] {
  background: var(--rf-green);
  color: #fff;
}
.rf-info-subnav a[aria-current="page"]:hover {
  background: var(--rf-green-dark);
  color: #fff;
}
@media (max-width: 600px) {
  .rf-info-subnav { gap: 6px; padding-bottom: 12px; }
  .rf-info-subnav a { padding: 7px 12px; font-size: 12px; }
}

/* H1 in Info-Pages (im content_text statt im Template, damit Subnav drüber liegen kann) */
h1.rf-info-h1 {
  font-size: 38px;
  font-weight: 800;
  color: var(--rf-headline);
  margin: 8px 0 24px;
  line-height: 1.2;
}
@media (max-width: 600px) {
  h1.rf-info-h1 { font-size: 28px; margin: 4px 0 18px; }
}

/* Chevron-Pfeile in Header-Nav ausblenden — Mike findet sie überflüssig */
.layout_categories .menu_items .sub_cats_arrow,
#mobile_menu .sub_cats_arrow { display: none !important; }

/* Buch-Cover als klickbarer Link */
.rf-book__cover {
  display: block;
  text-decoration: none;
  transition: opacity .15s ease;
}
.rf-book__cover:hover { opacity: 0.85; }
.rf-book h4 a {
  color: var(--rf-headline);
  text-decoration: none;
}
.rf-book h4 a:hover { color: var(--rf-green); }
.rf-book__buy {
  margin: 12px 0 0 !important;
  text-align: center !important;
  font-size: 13px !important;
}
.rf-book__buy a {
  display: inline-block;
  padding: 8px 14px;
  background: var(--rf-green);
  color: #fff !important;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  transition: background .15s ease;
}
.rf-book__buy a:hover { background: var(--rf-green-dark); }

/* Splide-Slider Pfeil-Buttons (Cross-Selling, etc.) — SVG sichtbar machen */
.splide__arrow svg,
.splide__arrow svg path {
  fill: #fff !important;
}
.splide__arrow:hover svg,
.splide__arrow:hover svg path {
  fill: #fff !important;
}
.splide__arrow:disabled {
  opacity: 0.4;
}

/* Splide-Pfeile: SVG-Größe forcieren (CSS reset macht width:0) */
.splide__arrow svg {
  width: 16px !important;
  height: 16px !important;
  fill: #fff !important;
}
.splide__arrow--prev svg {
  transform: scaleX(-1);  /* Spiegelung — Splide nutzt einen SVG-Pfad für beide Pfeile */
}
.splide__arrow {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

/* Splide-Button: Padding war 14px 28px → SVG hatte keinen Platz */
.splide__arrow {
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  border-radius: 50% !important;
}
.splide__arrow svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  flex-shrink: 0 !important;
}
.splide__arrow--prev { left: -20px !important; }
.splide__arrow--next { right: -20px !important; }

/* Splide-Pfeile: SVG verstecken, klare Unicode-Chevrons stattdessen */
.splide__arrow svg { display: none !important; }
.splide__arrow {
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  opacity: 1 !important;
  background: var(--rf-green, #0a8028) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #fff !important;
  line-height: 1;
}
.splide__arrow:hover {
  background: var(--rf-green-dark, #0a7a28) !important;
}
.splide__arrow--next::before { content: '›'; }
.splide__arrow--prev::before { content: '‹'; }
.splide__arrow:disabled {
  opacity: 0.4 !important;
  cursor: not-allowed;
}

/* Splide-Pfeile: innerhalb des Slider-Bereichs (nicht überstehend) */
.splide__arrow--prev { left: 8px !important; right: auto !important; }
.splide__arrow--next { right: 8px !important; left: auto !important; }
.splide__arrows { z-index: 10; }

/* Produkt-Listing: Bilder füllen den Container (Whitespace-Rand wird abgeschnitten) */
.prod_image img,
.lb_image img,
.product_listing_module .prod_image img,
.box_products_content .prod_image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
.prod_image,
.lb_image {
  overflow: hidden;
  background: #fff;
}

/* Produktdetail: Hauptbild nicht beschneiden (Container an Bild anpassen) */
.product_image_main img,
.product_info_image img,
.lightbox img,
.zoomImg {
  object-fit: contain !important;  /* Detail: kein Beschnitt */
  background: #fff;
}

/* Widerruf-Link im Footer hervorheben (laut Modul-INSTALL.txt) */
ul.content_box_list li.withdraw_link a span {
  color: var(--rf-green, #0a8028);
  font-size: 14px;
  line-height: 40px;
  font-weight: 700;
}

/* Impressum-Layout: klar gegliederte Sektionen */
.rf-impressum {
  max-width: 760px;
  font-size: 14px;
  line-height: 1.6;
}
.rf-impressum-section {
  margin: 0 0 28px;
  padding: 0 0 18px;
  border-bottom: 1px solid #eee;
}
.rf-impressum-section:last-child { border-bottom: none; }
.rf-impressum-section h3 {
  color: var(--rf-green, #0a8028);
  font-size: 16px;
  font-weight: 700;
  margin: 0 0 10px;
  padding: 0;
}
.rf-impressum-section h4 {
  font-size: 14px;
  font-weight: 700;
  color: var(--rf-headline, #1a1a1a);
  margin: 16px 0 6px;
}
.rf-impressum-section p { margin: 0 0 8px; }
.rf-impressum-section a { color: var(--rf-green, #0a8028); text-decoration: none; }
.rf-impressum-section a:hover { text-decoration: underline; }
/* ================================================================
   BS5 OVERRIDE — clean rebuild 2026-05-10
   Mike's Vorgaben:
   - Top-Bar oben: WEISS BG, schwarz Text, grüne Icons
   - Action-Bar (Startseite/Mein Konto/Warenkorb/Menü): WEISS, hover->grün+weiß
   - Hauptnavi: WEISS, hover->grün+weiß
   - Hero/Trust-Boxen: rf-green Nova-Style
   - Footer: WEISS BG, grüne Schrift, KEIN Hover, KEINE Zahlarten/Social
   - WCAG AA via #0a8028 (4.55:1 mit Weiß)
   ================================================================ */

:root {
  --rf-green:        #0a8028;
  --rf-green-bright: #0a8028;
  --rf-green-dark:   #056b1c;
  --rf-headline:     #1c1c1c;
  --bs-primary:           #0a8028;
  --bs-primary-rgb:       10, 128, 40;
  --bs-success:           #0a8028;
  --bs-success-rgb:       10, 128, 40;
  --bs-link-color:        #056b1c;
  --bs-link-hover-color:  #044a14;
}

/* ============ TOP-BAR (oben mit Lieferung/Tel/Mail) ============ */
.bg-body-tertiary,
.navbar-light.bg-body-tertiary,
[class*="bg-tertiary"] {
  background-color: #ffffff !important;
  color: #1c1c1c !important;
  border-bottom: 1px solid #e8e2d5;
}
.bg-body-tertiary,
.bg-body-tertiary *,
.text-body-secondary,
.bg-body-tertiary .text-body-secondary {
  color: #1c1c1c !important;
}
.bg-body-tertiary a,
.bg-body-tertiary .link-light,
.link-light {
  color: #056b1c !important;
  text-decoration: none;
}
.bg-body-tertiary a:hover {
  color: #044a14 !important;
  text-decoration: underline;
}
.bg-body-tertiary i.fa,
.bg-body-tertiary i[class*="fa-"] {
  color: #0a8028 !important;
}

/* ============ ACTION-BAR (Startseite / Mein Konto / Warenkorb / Menü) ============ */
button#login,
button#cart,
button#setbtn,
button#hc-nav-opener,
a#login, a#cart, a#setbtn,
.text-secondary-emphasis,
button.text-secondary-emphasis,
.nav-link.text-secondary-emphasis,
button.nav-link[id] {
  background-color: #ffffff !important;
  color: #1c1c1c !important;
  border: 1px solid #e8e2d5 !important;
  border-radius: 4px !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}
button#login i,
button#cart i,
button#setbtn i,
button#hc-nav-opener i,
.text-secondary-emphasis i,
.text-secondary-emphasis svg,
button.nav-link[id] i {
  color: #1c1c1c !important;
  fill: #1c1c1c !important;
}
button#login:hover, button#login:focus,
button#cart:hover, button#cart:focus,
button#setbtn:hover, button#setbtn:focus,
button#hc-nav-opener:hover, button#hc-nav-opener:focus,
.text-secondary-emphasis:hover,
button.text-secondary-emphasis:hover,
button.nav-link[id]:hover {
  background-color: #0a8028 !important;
  color: #ffffff !important;
  border-color: #0a8028 !important;
}
button#login:hover i, button#cart:hover i, button#setbtn:hover i, button#hc-nav-opener:hover i,
.text-secondary-emphasis:hover i, .text-secondary-emphasis:hover svg,
button.nav-link[id]:hover i {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* ============ HAUPTNAVI (Beimixe / Dosen / Fleisch / etc) ============ */
.navbar,
.navbar.bg-success,
nav.navbar,
nav#nav_container,
#nav_container,
header nav.navbar {
  background-color: #ffffff !important;
  border-top: 1px solid #e8e2d5;
  border-bottom: 1px solid #e8e2d5;
}
.navbar .nav-link,
.navbar a,
nav.navbar .nav-link,
nav.navbar a {
  color: #1c1c1c !important;
  background-color: transparent !important;
  border-radius: 4px;
  padding: 8px 14px !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.navbar i,
.navbar [class*="fa-"],
.navbar svg {
  color: #1c1c1c !important;
  fill: #1c1c1c !important;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus,
.navbar a:hover,
.navbar a:focus,
.navbar .nav-link.active,
.navbar .active > .nav-link,
.navbar .show > .nav-link {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}
.navbar .nav-link:hover i,
.navbar a:hover i,
.navbar .nav-link.active i {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* ============ SEARCH BUTTON ============ */
form#quick_find button,
form#quick_find #inputStringSubmit,
button.btn-suchen,
.search button[type=submit] {
  background-color: #0a8028 !important;
  border-color: #0a8028 !important;
  color: #ffffff !important;
}

/* ============ PRIMARY/SUCCESS BUTTONS ============ */
.btn-primary,
.btn-success {
  background-color: #0a8028 !important;
  border-color: #0a8028 !important;
  color: #ffffff !important;
}
.btn-primary:hover, .btn-success:hover,
.btn-primary:focus, .btn-success:focus {
  background-color: #056b1c !important;
  border-color: #056b1c !important;
}
.btn-outline-primary, .btn-outline-success {
  border-color: #0a8028 !important;
  color: #056b1c !important;
  background-color: transparent !important;
}
.btn-outline-primary:hover, .btn-outline-success:hover {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}

/* ============ HERO ============ */
.rf-hero__claim {
  font-size: clamp(1.8rem, 4vw, 3.4rem) !important;
  word-break: keep-all !important;
  hyphens: manual !important;
  color: #1c1c1c !important;
}
.rf-hero__claim em {
  color: #0a8028 !important;
  display: inline !important;
  font-style: normal !important;
}
.rf-hero__cta,
a.button.rf-hero__cta {
  background-color: #0a8028 !important;
  border-color: #0a8028 !important;
  color: #ffffff !important;
  padding: 12px 28px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.rf-hero__cta:hover {
  background-color: #056b1c !important;
  border-color: #056b1c !important;
  color: #ffffff !important;
}

/* ============ TRUST-BOXEN (rf-highlight) ============ */
.rf-highlight {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}
.rf-highlight,
.rf-highlight p,
.rf-highlight strong,
.rf-highlight span,
.rf-highlight h3 {
  color: #ffffff !important;
}

/* ============ CARDS / Bestseller ============ */
.card-footer .lb_tax a,
.card-footer a.iframe,
.lb_tax a,
.card .stretched-link,
.card a.btn-secondary,
.card-footer .small a,
.small a,
small a {
  color: #056b1c !important;
  text-decoration: underline !important;
  text-underline-offset: 2px;
}

/* ============ FOOTER (komplett weiß, grüne Schrift, kein Hover) ============ */
#layout_footer,
footer#layout_footer,
footer.bg-body-tertiary,
footer.bg-white {
  background-color: #ffffff !important;
  color: #056b1c !important;
  border-top: 2px solid #0a8028;
}
#layout_footer,
#layout_footer *,
#layout_footer_inner,
#layout_footer_inner *,
#layout_footer .box-contact,
#layout_footer .box-info,
#layout_footer .box-contact *,
#layout_footer .box-info *,
#layout_footer h1, #layout_footer h2, #layout_footer h3, #layout_footer h4,
#layout_footer p, #layout_footer li, #layout_footer span, #layout_footer strong,
#layout_footer a {
  background-color: transparent !important;
  color: #056b1c !important;
}
#layout_footer .box-heading,
#layout_footer h2,
#layout_footer h3 {
  color: #044a14 !important;
  font-weight: 700 !important;
  border-bottom: 1px solid #0a8028;
  padding-bottom: 10px;
  margin-bottom: 14px;
}
#layout_footer a,
#layout_footer a:link,
#layout_footer a:visited,
#layout_footer a:hover,
#layout_footer a:focus {
  color: #056b1c !important;
  text-decoration: none !important;
  background-color: transparent !important;
}

/* Hide payment + social + box-misc entirely */
.content_box_payment,
.content_box_social,
#layout_footer .box-misc,
#layout_footer .content_box_payment,
#layout_footer .content_box_social {
  display: none !important;
}

/* Footer parent .navbar wrapper kills width — force normal block layout */
#layout_footer > .container-xxl,
#layout_footer > .container-xxl.navbar,
footer#layout_footer .container-xxl {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  flex-wrap: initial !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
/* Make the row full-width */
#layout_footer #layout_footer_inner.row,
#layout_footer #layout_footer_inner {
  display: flex !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}
/* Two visible cols (Kontakt + Informationen) each 50%, others hidden */
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(1),
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(3) {
  flex: 0 0 50% !important;
  max-width: 50% !important;
  width: 50% !important;
  display: block !important;
  padding: 0 24px !important;
}
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(2),
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(4) {
  display: none !important;
}
@media (max-width: 767px) {
  #layout_footer #layout_footer_inner > div.col-lg-3:nth-child(1),
  #layout_footer #layout_footer_inner > div.col-lg-3:nth-child(3) {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }
}

/* Box-Info als 2-Spalten Liste */
@media (min-width: 768px) {
  #layout_footer .box-info ul {
    columns: 2;
    column-gap: 32px;
    list-style: none;
    padding-left: 0;
    margin: 0;
  }
  #layout_footer .box-info li {
    break-inside: avoid;
    padding: 4px 0;
  }
}
#layout_footer .box-info li a {
  display: inline-block;
  white-space: normal;
}

/* Copyright bar (ganz unten) */
body > div.copyright,
body > div.copyright * {
  background-color: #ffffff !important;
  color: #056b1c !important;
  border-top: 1px solid #e8e2d5 !important;
}
body > div.copyright a {
  color: #056b1c !important;
  text-decoration: none !important;
}
#layout_footer .mod_copyright,
#layout_footer .mod_copyright * {
  background-color: transparent !important;
  color: #056b1c !important;
}
#layout_footer .mod_copyright a {
  color: #056b1c !important;
  text-decoration: underline !important;
}

/* ============ IMPRESSUM / LEGAL CONTENT ============ */
.rf-impressum-section h2,
.rf-impressum-section h3 {
  color: #056b1c !important;
  background: transparent !important;
  font-weight: 600;
}
.rf-impressum-section a {
  color: #056b1c !important;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* ============ BREADCRUMB ============ */
.breadcrumb .link-secondary,
.breadcrumb-item a,
.breadcrumb a.link-secondary {
  color: #5a6268 !important;
}

/* ============ FOCUS RING (BFSG) ============ */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #ffd400 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 4px rgba(0,0,0,0.15) !important;
}

/* ============ COOKIE-BANNER ============ */
.consent-button,
[id*="cookie"] .btn-primary,
[id*="cookie"] button.btn-primary {
  background-color: #0a8028 !important;
  border-color: #0a8028 !important;
  color: #fff !important;
}

/* ================================================================
   ALLE Section-Hintergründe = WEISS (Mike 2026-05-10)
   Ausnahmen: rf-highlight (Trust-Boxen, grün) und Hover-Zustände
   ================================================================ */
body,
#container,
.rf-hero,
.rf-section,
.rf-section--alt,
.rf-promise,
.rf-promise__text,
.rf-args,
.box_greeting,
.box_greeting.homesite,
.box_best_sellers,
.box_manufacturers_carousel,
.bg-body,
.bg-body-secondary,
.bg-secondary-subtle,
.bg-secondary-bg,
.bg-light,
.bg-light-subtle,
section,
div.row,
div.container-xxl,
div.container-fluid,
div.container,
.layout_content,
#content {
  background-color: #ffffff !important;
  background: #ffffff !important;
}

/* Hero-Background-Gradient sicherheitshalber löschen */
.rf-hero {
  background-image: none !important;
}
.rf-promise__text {
  background-color: #ffffff !important;
  border: none !important;
  padding: 0 !important;
}

/* Trust-Boxen bleiben grün (das ist Mike's gewollte Ausnahme) */
.rf-highlight {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}

/* Hersteller- und Bestseller-Karusell: weisser BG, keine grauen Pfeile */
.box_best_sellers,
.box_manufacturers_carousel,
.box_best_sellers *,
.box_manufacturers_carousel * {
  background-color: transparent !important;
}
.carousel-control-prev,
.carousel-control-next {
  background-color: #0a8028 !important;
  border-radius: 4px;
  width: 32px;
  height: 32px;
  top: 50%;
  transform: translateY(-50%);
}


/* ============ FOOTER 3-Spalten zentriert: Nützliches | Rechtliches | Kontakt ============ */
#layout_footer #layout_footer_inner {
  justify-content: center !important;
}
#layout_footer #layout_footer_inner > div {
  flex: 0 1 320px !important;
  max-width: 320px !important;
  width: auto !important;
  padding: 0 24px !important;
  display: block !important;
}
@media (max-width: 767px) {
  #layout_footer #layout_footer_inner > div {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}
/* Override the previous 50/50 nth-child rules — let JS-rebuilt cols win */
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(1),
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(2),
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(3),
#layout_footer #layout_footer_inner > div.col-lg-3:nth-child(4) {
  display: block !important;
  flex: 0 1 320px !important;
  max-width: 320px !important;
  width: auto !important;
}

/* Footer-Spalten breiter + keine column-Aufteilung mehr */
@media (min-width: 768px) {
  #layout_footer #layout_footer_inner > div {
    flex: 0 1 360px !important;
    max-width: 360px !important;
  }
  #layout_footer .box-info ul {
    columns: 1 !important;
    column-count: 1 !important;
    list-style: none;
    padding-left: 0;
    margin: 0;
  }
}
#layout_footer .box-info li {
  padding: 4px 0 !important;
  break-inside: auto !important;
  white-space: nowrap;
}
#layout_footer .box-info li a {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
}

/* ================================================================
   ALLE dezenten Trenn-Linien raus (Mike 2026-05-10)
   - Bootstrap .border-* light-subtle Linien überall im body
   - Footer/Header-Trennlinien
   - Box-Heading underlines
   - Card-Borders dezent
   ================================================================ */
.border-top,
.border-bottom,
.border-start,
.border-end,
.border,
.border-light-subtle,
.border-secondary-subtle,
hr,
hr.border,
hr.border-1 {
  border: none !important;
}

/* Footer: keine Border-Top mehr */
#layout_footer,
footer#layout_footer {
  border-top: none !important;
  border-bottom: none !important;
}

/* Box-Heading underlines raus */
#layout_footer .box-heading,
.box-heading,
.box-heading.border-bottom {
  border-bottom: none !important;
  border: none !important;
}

/* Top-Bar Border-Bottom raus */
.bg-body-tertiary,
.navbar-light.bg-body-tertiary {
  border-bottom: none !important;
  border: none !important;
}

/* Hauptnavi: keine Border-Top/Bottom */
.navbar,
nav.navbar,
nav#nav_container {
  border-top: none !important;
  border-bottom: none !important;
}

/* Action-Bar Buttons: keinen Rahmen mehr (war 1px solid e8e2d5) */
button#login,
button#cart,
button#setbtn,
button#hc-nav-opener,
.text-secondary-emphasis,
button.text-secondary-emphasis,
button.nav-link[id] {
  border: none !important;
}

/* Copyright-Bar: keine Trennlinie */
body > div.copyright,
#layout_footer .mod_copyright {
  border-top: none !important;
  border: none !important;
}

/* Cards (Bestseller-Karten): nur sehr dezenter Schatten statt Border */
.card {
  border: none !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}
.card-footer {
  border-top: none !important;
}

/* Karusell-Pfeile (Prev/Next): grüner Kreis mit weißem Pfeil */
.carousel-control-prev,
.carousel-control-next,
.carousel-control-prev:focus,
.carousel-control-next:focus,
.carousel-control-prev:hover,
.carousel-control-next:hover {
  background-color: #0a8028 !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  opacity: 1 !important;
  border: none !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}
.carousel-control-prev { left: 8px !important; }
.carousel-control-next { right: 8px !important; }
.carousel-control-prev:hover,
.carousel-control-next:hover {
  background-color: #056b1c !important;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
  width: 18px !important;
  height: 18px !important;
  filter: brightness(0) invert(1);
}
/* Bei Bestsellern liegen die Pfeile evtl. außerhalb der Cards — z-index hoch */
.box_best_sellers .carousel-control-prev,
.box_best_sellers .carousel-control-next,
[id*="Carousel"] .carousel-control-prev,
[id*="Carousel"] .carousel-control-next {
  z-index: 10;
}

/* Karusell-Pfeile IMMER grün — auch im Default-State */
.carousel .carousel-control-prev,
.carousel .carousel-control-next,
div[id*="Carousel"] .carousel-control-prev,
div[id*="Carousel"] .carousel-control-next,
.box_best_sellers .carousel-control-prev,
.box_best_sellers .carousel-control-next {
  background-color: #0a8028 !important;
  background: #0a8028 !important;
  background-image: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Bestseller- + Hersteller-Karusell-Pfeile (resBtn leftRs/rightRs) */
button.resBtn,
button.resBtn.btn,
button.resBtn.btn.btn-light,
.leftRs,
.rightRs,
button.leftRs,
button.rightRs {
  background-color: #0a8028 !important;
  background: #0a8028 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 50% !important;
  width: 40px !important;
  height: 40px !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  z-index: 10;
}
button.resBtn:hover,
.leftRs:hover,
.rightRs:hover {
  background-color: #056b1c !important;
  color: #ffffff !important;
}
button.resBtn i,
button.resBtn svg,
.leftRs i, .leftRs svg,
.rightRs i, .rightRs svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* DETAILS-Button in Produktkarten: Hover muss weiße Schrift auf grün BG geben */
.card .btn,
.card .btn-outline-secondary,
.card .stretched-link,
.card a.btn,
.card .lb_buttons a,
.card .lb_buttons .btn,
a.btn-outline-secondary,
.btn-outline-secondary {
  color: #056b1c !important;
  border-color: #0a8028 !important;
  background-color: transparent !important;
}
.card .btn:hover,
.card .btn:focus,
.card .btn-outline-secondary:hover,
.card .btn-outline-secondary:focus,
.card .stretched-link:hover,
.card .stretched-link:focus,
.card a.btn:hover,
.card a.btn:focus,
.card .lb_buttons a:hover,
.card .lb_buttons .btn:hover,
a.btn-outline-secondary:hover,
.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
  background-color: #0a8028 !important;
  color: #ffffff !important;
  border-color: #0a8028 !important;
}
.card .btn:hover i,
.card .btn:hover svg,
.btn-outline-secondary:hover i,
.btn-outline-secondary:hover svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Image-Viewer (Lightbox) Buttons müssen sichtbar bleiben */
.viewer-container,
.viewer-canvas,
.viewer-backdrop {
  z-index: 99999 !important;
}
.viewer-button,
.viewer-toolbar > ul > li,
.viewer-prev,
.viewer-next,
.viewer-play,
.viewer-close,
.viewer-zoom-in,
.viewer-zoom-out,
.viewer-one-to-one,
.viewer-reset,
.viewer-rotate-left,
.viewer-rotate-right,
.viewer-flip-horizontal,
.viewer-flip-vertical {
  background-color: rgba(0,0,0,0.65) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}
.viewer-button:hover,
.viewer-toolbar > ul > li:hover {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}
.viewer-button .fa,
.viewer-toolbar .fa,
.viewer-button i,
.viewer-toolbar i {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Viewer Lightbox: alle Buttons grün, Icons via FA-Unicode garantiert sichtbar */
.viewer-button,
.viewer-toolbar > ul > li {
  background-color: #0a8028 !important;
  color: #ffffff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px;
  width: 40px;
  height: 40px;
}
.viewer-button:hover,
.viewer-toolbar > ul > li:hover {
  background-color: #056b1c !important;
}


/* ================================================================
   ALLE Modal/Offcanvas/Dialog-Buttons sichtbar wiederherstellen
   Mein vorheriger 'border:none' + bg-overrides haben Bootstraps
   eigene Icons (btn-close SVG, btn-dark fa-xmark, etc.) zerstört.
   ================================================================ */

/* Bootstrap btn-close (X-Icon) — die nutzt SVG als background-image */
.btn-close,
button.btn-close {
  background-color: transparent !important;
  background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3E%3Cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3E%3C/svg%3E") center/1em auto no-repeat !important;
  border: none !important;
  width: 1em !important;
  height: 1em !important;
  padding: .25em .25em !important;
  opacity: .75 !important;
  border-radius: .25rem !important;
}
.btn-close:hover,
button.btn-close:hover {
  opacity: 1 !important;
}

/* Modal/Offcanvas Header — close-Button inside */
.modal-header .btn-close,
.offcanvas-header .btn-close {
  background-color: transparent !important;
}

/* Modifies-Spezial-Close (btn btn-dark fa fa-xmark) */
.btn.btn-dark.fa-xmark,
button.btn.btn-dark.fa-xmark,
.btn-dark.fa.fa-xmark,
button[class*="fa-xmark"] {
  background-color: #1c1c1c !important;
  color: #ffffff !important;
  border: none !important;
  width: 36px;
  height: 36px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
button[class*="fa-xmark"]:hover {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}

/* Modal-Footer-Buttons (z.B. Schliessen) */
.modal-footer .btn,
.modal-footer button.btn {
  background-color: #0a8028 !important;
  color: #ffffff !important;
  border: 1px solid #0a8028 !important;
}
.modal-footer .btn:hover {
  background-color: #056b1c !important;
}
.modal-footer .btn-dark {
  background-color: #1c1c1c !important;
}
.modal-footer .btn-dark:hover {
  background-color: #0a8028 !important;
}

/* Allgemein: KEINE Border-Reset für Modal-/Dialog-Buttons */
.modal *, .offcanvas * {
  /* Lass Bootstrap rendern */
}

/* Off-Canvas Header-BG: cremig statt weiß */
.offcanvas-header.bg-secondary-subtle {
  background-color: #f8f5ef !important;
}

/* Login/Account/Search Off-Canvas Buttons */
#account .btn,
#settings .btn,
#canvas_cart .btn {
  background-color: #0a8028 !important;
  color: #ffffff !important;
  border: 1px solid #0a8028 !important;
}
#account .btn:hover,
#settings .btn:hover,
#canvas_cart .btn:hover {
  background-color: #056b1c !important;
}
#account .btn-dark,
#settings .btn-dark,
#canvas_cart .btn-dark {
  background-color: #1c1c1c !important;
}

/* Form-Inputs in Modals */
.modal input, .modal select, .modal textarea,
.offcanvas input, .offcanvas select, .offcanvas textarea {
  border: 1px solid #cccccc !important;
  background-color: #ffffff !important;
  color: #1c1c1c !important;
}

/* Bootstrap data-bs-toggle Icons (Hamburger, Cart, Account etc.) */
.btn[data-bs-toggle],
button[data-bs-toggle] {
  /* erlauben Bootstrap-Standard-Look */
}
.btn[data-bs-toggle] i,
button[data-bs-toggle] i,
.btn[data-bs-toggle] svg,
button[data-bs-toggle] svg {
  display: inline-block !important;
  visibility: visible !important;
}


/* === Modal/Offcanvas Close-X (FA klasse fa-xmark mit bs5_awesome font) === */
/* DON'T touch ::before content — die FA-Klasse rendert das selbst.
   Wir setzen NUR background + color. */
.btn.btn-dark.fa-xmark,
button.btn.btn-dark.fa-xmark,
button.btn-dark.fa,
button.btn.btn-dark.fa {
  background-color: #1c1c1c !important;
  color: #ffffff !important;
  border: none !important;
  width: 36px;
  height: 36px;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  font-family: 'bs5_awesome', inherit !important;
  font-size: 16px;
}
.btn.btn-dark.fa-xmark:hover,
button.btn.btn-dark.fa-xmark:hover,
button.btn-dark.fa:hover {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}

/* === Image Viewer (.viewer-button .fa) - lass die FA-Klasse arbeiten === */
.viewer-button,
.viewer-toolbar > ul > li {
  background-color: rgba(0,0,0,0.7) !important;
  color: #ffffff !important;
  font-family: 'bs5_awesome', inherit !important;
}
.viewer-button:hover,
.viewer-toolbar > ul > li:hover {
  background-color: #0a8028 !important;
}
.viewer-button .fa,
.viewer-toolbar .fa {
  color: #ffffff !important;
}

/* === Force bs5_awesome font + correct codepoints on close + xmark buttons === */
.btn.fa,
.btn.fas,
.btn.fab,
button.fa,
button.fas,
button.fab,
.fa-xmark,
button.fa-xmark,
.fa.fa-xmark,
.btn.btn-dark.fa-xmark,
.btn-close.fa,
.btn-close {
  font-family: 'bs5_awesome' !important;
}
.btn.fa::before,
.btn.fas::before,
button.fa::before,
.fa-xmark::before,
button.fa-xmark::before,
.fa.fa-xmark::before,
.btn.btn-dark.fa-xmark::before {
  font-family: 'bs5_awesome' !important;
  font-style: normal !important;
  font-weight: normal !important;
  speak: none !important;
  display: inline-block !important;
  text-decoration: inherit !important;
  text-align: center !important;
  font-variant: normal !important;
  text-transform: none !important;
  line-height: 1em !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}
/* Specific codepoints from bs5_awesome */
.fa-xmark::before,
button.fa-xmark::before,
.fa.fa-xmark::before,
.btn.btn-dark.fa-xmark::before { content: '\e83d ' !important; }
.fa-bars::before { content: '\e80b ' !important; }
.fa-chevron-up::before { content: '\e812 ' !important; }
.fa-chevron-down::before { content: '\e80f ' !important; }

/* Reset Bootstrap btn-close so it doesn't conflict */
.offcanvas-header .btn.btn-dark.fa-xmark,
.modal-header .btn.btn-dark.fa-xmark {
  background-image: none !important;
}

/* === Image Viewer (Lightbox) buttons — use bs5_awesome codepoints === */
.viewer-button,
.viewer-toolbar > ul > li {
  background-color: rgba(0,0,0,0.7) !important;
  color: #ffffff !important;
  font-family: 'bs5_awesome' !important;
  font-style: normal !important;
  font-weight: normal !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.viewer-button:hover,
.viewer-toolbar > ul > li:hover {
  background-color: #0a8028 !important;
}
.viewer-button::before,
.viewer-toolbar > ul > li::before {
  font-family: 'bs5_awesome' !important;
  font-style: normal !important;
  font-weight: normal !important;
  display: inline-block !important;
  color: #ffffff !important;
  font-size: 16px;
}
/* Codepoints */
.viewer-close::before,
li.viewer-close::before  { content: '\e83d ' !important; }
.viewer-prev::before,
li.viewer-prev::before   { content: '\e810 ' !important; }
.viewer-next::before,
li.viewer-next::before   { content: '\e811 ' !important; }
.viewer-zoom-in::before,
li.viewer-zoom-in::before  { content: '\e82d ' !important; }
.viewer-zoom-out::before,
li.viewer-zoom-out::before { content: '\e82c ' !important; }
.viewer-one-to-one::before,
li.viewer-one-to-one::before { content: '1:1' !important; font-family: inherit !important; font-weight: 700 !important; font-size: 13px; }
.viewer-reset::before,
li.viewer-reset::before  { content: '\e83a ' !important; }
.viewer-rotate-left::before,
li.viewer-rotate-left::before  { content: '\e834 ' !important; }
.viewer-rotate-right::before,
li.viewer-rotate-right::before { content: '\e83a ' !important; }
.viewer-play::before,
li.viewer-play::before   { content: '\e810 ' !important; }

/* Viewer Close-Button: korrekt im sichtbaren Bereich positionieren */
.viewer-button.viewer-close,
.viewer-close,
button.viewer-close {
  top: 16px !important;
  right: 16px !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  position: absolute !important;
  z-index: 100000 !important;
  font-size: 18px !important;
  background-color: rgba(0,0,0,0.7) !important;
  color: #ffffff !important;
}
.viewer-button.viewer-close:hover,
.viewer-close:hover {
  background-color: #0a8028 !important;
}

/* Force perfect circles for ALL round buttons (viewer + carousel arrows) */
.viewer-button,
.viewer-button.viewer-close,
.viewer-close,
.viewer-prev,
.viewer-next,
button.viewer-button,
.viewer-toolbar > ul > li,
button.resBtn,
button.resBtn.btn.btn-light,
.leftRs,
.rightRs,
button.leftRs,
button.rightRs {
  box-sizing: border-box !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  aspect-ratio: 1 / 1 !important;
  flex: 0 0 40px !important;
  line-height: 40px !important;
}

/* Produktkacheln: Titel komplett anzeigen, kein Clipping */
.card .lb_title,
.card .products_name,
.card-body .lb_title,
.card .card-body h2,
.card .card-body h3,
.card .card-body .h5,
.box_best_sellers .card .lb_title,
.box_new_products .card .lb_title,
.products_listing .card .lb_title {
  display: block !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  overflow: visible !important;
  text-overflow: unset !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  min-height: 0 !important;
  max-height: none !important;
  white-space: normal !important;
  word-break: keep-all;
  overflow-wrap: break-word;
  padding: 0 8px;
}


/* Einstellungen-Button (Zahnrad) komplett ausblenden — kein Sprach-Switcher mehr */
button#setbtn,
#setbtn,
a#setbtn,
[data-bs-target="#settings"] {
  display: none !important;
}
/* Settings-Offcanvas selbst auch deaktivieren */
#settings,
.offcanvas#settings {
  display: none !important;
}

/* === Mengen-Stepper auf Produktseite — sauber & symmetrisch === */
.input-group.qty,
.qty .input-group,
form .input-group:has(input[name="products_quantity"]) {
  align-items: stretch;
}
form button.btn.btn-outline-secondary,
.input-group button.btn-outline-secondary,
.qty button {
  background-color: #ffffff !important;
  border: 1px solid #0a8028 !important;
  color: #0a8028 !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  font-size: 18px !important;
  font-weight: 700;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  line-height: 1 !important;
}
form button.btn.btn-outline-secondary:hover,
.input-group button.btn-outline-secondary:hover,
.qty button:hover {
  background-color: #0a8028 !important;
  color: #ffffff !important;
  border-color: #0a8028 !important;
}
input[name="products_quantity"],
input.qty_input,
.input-group input[type="text"][name*="quantity"],
.input-group input[type="number"] {
  height: 44px !important;
  text-align: center !important;
  border: 1px solid #0a8028 !important;
  border-left: none !important;
  border-right: none !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  width: 60px !important;
  flex: 0 0 60px;
}
button[name="add_product"],
button[name="products_id"],
form button.btn-secondary.px-4,
form button[type="submit"]:not(.btn-light):not(.btn-dark) {
  background-color: #0a8028 !important;
  border: 1px solid #0a8028 !important;
  color: #ffffff !important;
  height: 44px !important;
  padding: 0 24px !important;
  font-weight: 600;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
button[name="add_product"]:hover {
  background-color: #056b1c !important;
  border-color: #056b1c !important;
}

/* Cart-Page Stepper: gleiche Optik wie auf Produktseite */
.cart-stepper { display: inline-flex !important; align-items: stretch !important; }
.cart-stepper .cart-stepper-btn {
  background-color: #ffffff !important;
  border: 1px solid #0a8028 !important;
  color: #0a8028 !important;
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  padding: 0 !important;
  font-size: 18px !important;
  font-weight: 700;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
.cart-stepper .cart-stepper-btn:first-child { border-top-left-radius: 4px !important; border-bottom-left-radius: 4px !important; }
.cart-stepper .cart-stepper-btn:last-child  { border-top-right-radius: 4px !important; border-bottom-right-radius: 4px !important; }
.cart-stepper .cart-stepper-btn:hover {
  background-color: #0a8028 !important;
  color: #ffffff !important;
}
.cart-stepper .cart-stepper-input {
  height: 40px !important;
  border: 1px solid #0a8028 !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 0 !important;
  text-align: center !important;
  font-weight: 600;
}

/* Top-Bar Inhalt auf Hauptbreite begrenzen, statt edge-to-edge */
#top,
.top.bg-body-tertiary {
  background-color: #ffffff !important;
}
#top > .d-flex,
.top.bg-body-tertiary > .d-flex {
  max-width: 1320px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
  justify-content: space-between !important;
}

/* SUCHEN-Button: voll lesbar, nicht abgeschnitten */
form#quick_find button,
form#quick_find #inputStringSubmit,
button.btn-suchen,
.search button[type=submit],
form#quick_find button[type=submit] {
  min-width: 110px !important;
  padding: 0 22px !important;
  white-space: nowrap !important;
  overflow: visible !important;
  flex-shrink: 0 !important;
}

/* Cart-Stepper: input MUSS gleiche Höhe wie Buttons haben */
.cart-stepper {
  align-items: stretch !important;
}
.cart-stepper .cart-stepper-btn,
.cart-stepper .cart-stepper-input {
  height: 40px !important;
  min-height: 40px !important;
  max-height: 40px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  vertical-align: middle;
}
.cart-stepper .cart-stepper-input {
  width: 56px !important;
  flex: 0 0 56px !important;
  font-size: 15px !important;
  padding: 0 !important;
}

/* PLZ-Liefercheck im Hero-Bereich */
.rf-plz-check {
  background: #ffffff !important;
  padding: 32px 16px;
  text-align: center;
}
.rf-plz-check__inner {
  max-width: 720px;
  margin: 0 auto;
  padding: 28px 28px;
  border: 2px solid rgba(10, 128, 40, 0.35);
  border-radius: 14px;
  background: rgba(10, 128, 40, 0.04);
  box-shadow: 0 2px 12px rgba(10, 128, 40, 0.08);
}
.rf-plz-check__title {
  color: #056b1c;
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 700;
  margin: 0 0 8px;
}
.rf-plz-check__sub {
  color: #555555;
  font-size: 15px;
  margin: 0 0 18px;
}
.rf-plz-check__form {
  display: flex;
  gap: 8px;
  justify-content: center;
  align-items: stretch;
  flex-wrap: wrap;
}
#rf-plz-input {
  height: 48px;
  font-size: 18px;
  padding: 0 16px;
  border: 2px solid #0a8028;
  border-radius: 6px;
  width: 200px;
  text-align: center;
  font-weight: 600;
  letter-spacing: 1px;
}
#rf-plz-input:focus {
  outline: 3px solid #ffd400;
  outline-offset: 2px;
}
#rf-plz-btn {
  height: 48px;
  padding: 0 28px;
  background: #0a8028;
  color: #ffffff;
  border: 2px solid #0a8028;
  border-radius: 6px;
  font-weight: 700;
  font-size: 16px;
  cursor: pointer;
  transition: background 0.15s;
}
#rf-plz-btn:hover { background: #056b1c; border-color: #056b1c; }
.rf-plz-result {
  margin-top: 18px;
  padding: 14px 18px;
  border-radius: 6px;
  font-size: 15px;
  display: none;
}
.rf-plz-result.rf-plz-result--ok,
.rf-plz-result.rf-plz-result--no,
.rf-plz-result.rf-plz-result--info,
.rf-plz-result.rf-plz-result--loading { display: block; }
.rf-plz-result--ok { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.rf-plz-result--no { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
.rf-plz-result--info { background: #fff3cd; color: #664d00; border: 1px solid #ffe69c; }
.rf-plz-result--loading { background: #f3f3f3; color: #555; border: 1px solid #ddd; }
.rf-plz-result a { color: inherit; text-decoration: underline; }

/* Doppel-Submit Spinner */
.rf-submit-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  vertical-align: -2px;
  margin-right: 6px;
  animation: rf-spin 0.8s linear infinite;
}
@keyframes rf-spin { to { transform: rotate(360deg); } }
button[disabled][aria-busy="true"] {
  pointer-events: none !important;
  cursor: wait !important;
}






/* === RF-CATEGORY-IMAGE-FIX === V6 (300px Bild + Magazin-Text) */

/* Header: Bild links, Text rechts via Flexbox */
.cat_description {
  display: flex !important;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 36px;
  margin: 24px 0 36px !important;
}
.cat_description > div { float: none !important; margin: 0 !important; }
.cat_description > div:first-child {
  flex: 0 0 300px;
  max-width: 300px;
  padding: 0 !important;
  text-align: left !important;
}
.cat_description > div:last-child {
  flex: 1 1 340px;
  min-width: 0;
  padding-top: 4px;
}
@media (max-width: 575.98px) {
  .cat_description { flex-direction: column; gap: 18px; }
  .cat_description > div:first-child {
    flex: 0 0 auto;
    max-width: 240px;
    margin: 0 auto !important;
    text-align: center !important;
  }
}

img.cat_image {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 16px;
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
  display: block;
  margin: 0 !important;
}

/* Text-Block — Magazin-Style */
.cat_description > div:last-child h2,
.cat_description .rf-cat-headline {
  font-size: 1.55rem;
  line-height: 1.25;
  color: #056b1c;
  font-weight: 700;
  margin: 0 0 4px;
  letter-spacing: -0.01em;
}
.cat_description .rf-cat-lead {
  font-size: 1.05rem;
  color: #6b6357;
  font-style: italic;
  margin: 0 0 16px;
  line-height: 1.5;
}
.cat_description > div:last-child p {
  font-size: 15.5px;
  line-height: 1.65;
  color: #2c2a26;
  margin: 0 0 12px;
}
.cat_description > div:last-child p:last-child { margin-bottom: 0; }

/* Falls noch alter <strong>-Style-Content drin ist (Fleischprodukte etc.) */
.cat_description > div:last-child > p:first-child > strong:first-child,
.cat_description > div:last-child > strong:first-child {
  display: block;
  font-size: 1.4rem;
  color: #056b1c;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 6px;
}

/* ====== SUBKATEGORIEN ====== */
.listing-subcats { margin-top: 32px; clear: both; }
.listing-subcats .heading {
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  color: #6b6357 !important;
  background: transparent !important;
  border: 0 !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
}
.listing-subcats .row { --bs-gutter-x: 14px !important; --bs-gutter-y: 14px !important; }
.listing-subcats .card,
.listing-subcats .card:hover,
.listing-subcats .card:focus,
.listing-subcats .card:focus-within {
  background: #ffffff !important;
  background-color: #ffffff !important;
  border: 1px solid #ece6d8 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.03) !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
  overflow: hidden !important;
  min-height: 0 !important;
  height: 100%;
  text-decoration: none !important;
}
.listing-subcats .card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(10,128,40,.10) !important;
  border-color: #0a8028 !important;
}
.listing-subcats .card-body,
.listing-subcats .card-body > div,
.listing-subcats .card-body .mt-2 {
  background: transparent !important;
  background-color: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  min-height: 0 !important;
}
.listing-subcats .card .cat_image {
  width: 100% !important;
  aspect-ratio: 1 / 1 !important;
  margin: 0 !important; padding: 0 !important; min-height: 0 !important;
  max-width: none !important;
  background: #f8f5ef !important;
  display: block; overflow: hidden;
  border-radius: 0 !important; box-shadow: none !important; float: none !important;
}
.listing-subcats .card img.cat_image,
.listing-subcats .card .cat_image img {
  width: 100% !important; height: 100% !important; max-width: 100% !important;
  max-height: none !important; aspect-ratio: 1 / 1 !important;
  object-fit: cover;
  border-radius: 0 !important; box-shadow: none !important;
  margin: 0 !important; float: none !important; display: block;
}
.listing-subcats .card .cat_image:empty { display: flex; align-items: center; justify-content: center; }
.listing-subcats .card .cat_image:empty::before { content: '🐾'; font-size: 36px; opacity: 0.22; }
.listing-subcats .card .mt-2,
.listing-subcats .card .card-body > div:last-child {
  padding: 12px 12px 14px !important;
  text-align: center;
  background: #ffffff !important;
}
.listing-subcats .card a.stretched-link,
.listing-subcats .card a.stretched-link:hover,
.listing-subcats .card a.link-secondary,
.listing-subcats .card a.link-secondary:hover {
  color: #2c2a26 !important;
  background: transparent !important;
  font-weight: 600; font-size: 14px; line-height: 1.35;
  text-decoration: none !important; display: block;
}
.listing-subcats .card:hover a.stretched-link,
.listing-subcats .card:hover a.link-secondary { color: #056b1c !important; }

/* === RF-CATEGORY-IMAGE-FIX END === */

/* === RF-CAT-TEXT-FRAME === zarter grüner Rahmen um den Text-Block */
.cat_description > div:last-child {
  border: 1px solid #cce6d4;
  border-radius: 14px;
  padding: 20px 24px !important;
  background: #fafdfb;
}
@media (max-width: 575.98px) {
  .cat_description > div:last-child {
    padding: 16px 18px !important;
  }
}
/* === RF-CAT-TEXT-FRAME END === */

/* === RF-PRODUCT-CARD === Produktkarten konsistent zu Kategoriekarten */

/* Produktkarten-Container — abgerundet, sanfter Schatten, dezenter Akzent */
.listingbox .card,
.listingrow.card,
.resCarousel .card {
  border: 1px solid #ece6d8 !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.03) !important;
  overflow: hidden !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
.listingbox .card:hover,
.listingrow.card:hover,
.resCarousel .card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(10,128,40,.10) !important;
  border-color: #0a8028 !important;
}

/* Produktbild-Zone — quadratisch wie Kategoriebilder, weiches Beige als Hintergrund für 'Eckigkeit'-Schutz */
.listingbox .prod_image,
.listingrow .prod_image,
.resCarousel .prod_image {
  background: #faf7f0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
  padding: 8px !important;
  border-bottom: 1px solid #ece6d8;
  position: relative;
}
.listingbox .prod_image img,
.listingrow .prod_image img,
.resCarousel .prod_image img {
  border-radius: 8px;
  object-fit: contain;
  max-width: 92% !important;
  max-height: 92% !important;
}

/* Produkt-Label (kleines 'Pille' oben links) für visuelle Unterscheidung zu Kategorien */
.listingbox .prod_image::after,
.listingrow .prod_image::after,
.resCarousel .prod_image::after {
  content: 'Produkt';
  position: absolute;
  top: 8px;
  left: 8px;
  background: rgba(255,255,255,0.92);
  color: #056b1c;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 3px 8px;
  border-radius: 10px;
  border: 1px solid #cce6d4;
  z-index: 2;
  pointer-events: none;
}

/* Produkttitel + Footer-Bereich */
.listingbox .card .lb_name,
.listingrow.card .lb_name {
  text-align: center;
  padding: 12px 12px 6px !important;
  font-weight: 600;
  font-size: 15px;
  color: #2c2a26;
}
.listingbox .card .lb_name a,
.listingrow.card .lb_name a {
  color: inherit !important;
  text-decoration: none !important;
}
.listingbox .card .lb_name a:hover,
.listingrow.card .lb_name a:hover {
  color: #056b1c !important;
}

/* Preis-Zeile dezenter */
.listingbox .lb_price,
.listingrow .lb_price {
  border-top: 1px solid #ece6d8;
  background: #fafafa;
}

/* === RF-PRODUCT-CARD END === */

/* === RF-PROD-SECTIONS === Produkt-Detail klar sektioniert */
.rf-prod-lead {
  font-size: 1.1rem;
  color: #056b1c;
  font-weight: 600;
  margin: 0 0 20px;
  padding: 0 4px;
}

.rf-prod-section {
  border: 1px solid #cce6d4;
  border-radius: 14px;
  background: #fafdfb;
  padding: 16px 20px;
  margin: 0 0 16px;
}
.rf-prod-section h3 {
  margin: 0 0 12px;
  font-size: 0.95rem;
  font-weight: 700;
  color: #056b1c;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding-bottom: 8px;
  border-bottom: 1px solid #cce6d4;
}
.rf-prod-section table.rf-info-table { margin: 0 !important; }
.rf-prod-section ul { margin: 0; padding-left: 18px; }
.rf-prod-section ul li { padding: 3px 0; }

/* Tipp-Box: extra freundlich, gelb-warm statt grün */
.rf-prod-tip {
  border: 1px solid #f5e0a1;
  background: #fffcf2;
  border-radius: 14px;
  padding: 14px 18px;
  margin: 0 0 16px;
  font-size: 0.95rem;
}
.rf-prod-tip strong:first-child { color: #8b6a00; }
.rf-prod-tip p { margin: 0; }

/* rf-info-table: bessere Lesbarkeit innerhalb der Section */
.rf-prod-section .rf-info-table th,
.rf-prod-section .rf-info-table td {
  padding: 8px 10px !important;
  background: transparent !important;
}
.rf-prod-section .rf-info-table tr {
  border-bottom: 1px solid #e3eee5;
}
.rf-prod-section .rf-info-table tr:last-child { border-bottom: 0; }
.rf-prod-section .rf-info-table th {
  font-weight: 600;
  color: #2c2a26;
  width: 45%;
}
.rf-prod-section .rf-info-table td { color: #2c2a26; }
/* === RF-PROD-SECTIONS END === */

/* Herkunfts-Hinweis unten rechts (z.B. *gemäß Herstellerangaben) */
.rf-prod-source {
  display: block;
  text-align: right;
  font-size: 11px;
  font-style: italic;
  color: #8a8479;
  margin-top: 10px;
  padding-top: 6px;
  border-top: 1px dashed #e3eee5;
}

/* 2-spaltige Info-Tabelle (z.B. Analytische Bestandteile) */
.rf-info-table-2col tbody {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 22px;
  row-gap: 0;
}
.rf-info-table-2col tbody tr {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: 8px;
  padding: 3px 0;
  border-bottom: 1px solid #e3eee5;
}
.rf-info-table-2col tbody tr:last-child,
.rf-info-table-2col tbody tr:nth-last-child(2) { border-bottom: 0; }
.rf-info-table-2col th, .rf-info-table-2col td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}
@media (max-width: 575.98px) {
  .rf-info-table-2col tbody { grid-template-columns: 1fr; }
}


/* === RF-FIX-2COL-AND-MANU === V2 (festes 2x3 Raster, volle Labels) */
.rf-prod-section .rf-info-table-2col tbody {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 28px !important;
  row-gap: 0 !important;
}
.rf-prod-section .rf-info-table-2col tbody tr {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: baseline;
  gap: 12px;
  padding: 8px 0 !important;
  border-bottom: 1px solid #e3eee5;
  min-width: 0;
}
.rf-prod-section .rf-info-table-2col tbody tr th,
.rf-prod-section .rf-info-table-2col tbody tr td {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
.rf-prod-section .rf-info-table-2col tbody tr th {
  text-align: left;
  font-weight: 600;
  color: #2c2a26;
}
.rf-prod-section .rf-info-table-2col tbody tr td {
  text-align: right;
  white-space: nowrap;
  font-weight: 500;
}
@media (max-width: 575.98px) {
  .rf-prod-section .rf-info-table-2col tbody { grid-template-columns: 1fr !important; }
}

/* Hersteller-Logo natürlich proportional */
body.manufacturers img.cat_image,
.manufacturers_listing img.cat_image,
img.cat_image[src*="manufacturers/"],
img.cat_image[data-src*="manufacturers/"] {
  aspect-ratio: auto !important;
  object-fit: contain !important;
  max-width: 200px !important;
  width: auto !important;
  height: auto !important;
  background: #fff;
  padding: 8px;
}
/* === RF-FIX-2COL-AND-MANU END === */

/* BARF-Wissen Tiles mit Bildern (2026-05-12) */
.rf-info-tile--has-img {
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
.rf-info-tile__img {
  display: block;
  width: 100%;
  height: 200px;
  object-fit: cover;
  border-bottom: 3px solid var(--rf-green, #056b1c);
}
.rf-info-tile__body {
  padding: 18px 20px 20px;
}
.rf-info-tile--has-img:hover .rf-info-tile__img {
  filter: brightness(1.05) saturate(1.08);
  transition: filter 0.25s ease;
}
.rf-info-tile--has-img h3 {
  margin-top: 0;
}

/* ============ VACATION BANNER (Lieferpause-Hinweis) ============ */
.rf-vacation-banner {
  max-width: 1200px;
  margin: 0 auto 28px;
  padding: 18px 24px;
  border-radius: 12px;
  display: flex;
  gap: 18px;
  align-items: flex-start;
  box-shadow: 0 4px 14px rgba(0,0,0,0.08);
  font-family: Arial, sans-serif;
}
.rf-vacation-banner__icon {
  font-size: 32px;
  line-height: 1;
  flex-shrink: 0;
}
.rf-vacation-banner__body { flex: 1; min-width: 0; }
.rf-vacation-banner__title {
  font-size: 17px;
  font-weight: 800;
  margin: 0 0 6px;
  letter-spacing: -0.01em;
}
.rf-vacation-banner__text {
  font-size: 15px;
  line-height: 1.55;
  margin: 0;
  color: #2a2a2a;
}
.rf-vacation-banner__text strong { color: #056b1c; }
.rf-vacation-banner--upcoming {
  background: linear-gradient(135deg, #fff7e0 0%, #ffeec2 100%);
  border-left: 5px solid #d99800;
}
.rf-vacation-banner--upcoming .rf-vacation-banner__title { color: #8a6200; }
.rf-vacation-banner--active {
  background: linear-gradient(135deg, #ffe9c8 0%, #ffd596 100%);
  border-left: 5px solid #c5550c;
}
.rf-vacation-banner--active .rf-vacation-banner__title { color: #7a3206; }
@media (max-width: 600px) {
  .rf-vacation-banner { padding: 14px 18px; gap: 12px; }
  .rf-vacation-banner__icon { font-size: 26px; }
  .rf-vacation-banner__title { font-size: 16px; }
  .rf-vacation-banner__text { font-size: 14px; }
}

/* HEADER-BACKGROUND-BILD entfernt — Logo + Hund jetzt als gemerged PNG in logo_head.png */

/* Testimonial mit integriertem Schriftzug (Bild enthält schon Zitat + Author) */
.rf-testimonial--integrated {
  text-align: center;
  max-width: 1100px;
  margin: 0 auto !important;
  padding: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  border: 0 !important;
}
.rf-testimonial--integrated img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
  box-shadow: none !important;
  border: 0 !important;
}

/* ============ WIDERRUFSBUTTON-HIGHLIGHT (Pflicht ab 19.06.2026) ============ */
/* Den Widerruf-Listenpunkt im Footer/Menü als auffälligen Pill-Button stylen */
li:has(> a[href*="Widerruf:_:51"]) {
  list-style: none !important;
}
li:has(> a[href*="Widerruf:_:51"]) > a,
a.nav-link[href*="Widerruf:_:51"] {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  padding: 8px 16px !important;
  margin: 6px 0 !important;
  border: 2px solid var(--rf-green, #0a8028) !important;
  border-radius: 999px !important;
  background: rgba(10, 128, 40, 0.05);
  font-weight: 700 !important;
  color: var(--rf-green, #056b1c) !important;
  transition: all .15s ease;
}
li:has(> a[href*="Widerruf:_:51"]) > a:hover,
a.nav-link[href*="Widerruf:_:51"]:hover {
  background: var(--rf-green, #0a8028);
  color: #ffffff !important;
  transform: translateY(-1px);
}
/* Chevron-Icon ersetzen durch Widerrufs-Pfeil */
li:has(> a[href*="Widerruf:_:51"]) > a > .fa-chevron-right {
  display: none !important;
}
li:has(> a[href*="Widerruf:_:51"]) > a::before {
  content: "↩";
  font-size: 1.1em;
  font-weight: 900;
}