/* PageSpeed CLS-Fix: Kategorie-Bannerbild - nur Desktop/Tablet */
@media(min-width:768px){
.categoryimage{position:relative;padding-bottom:19.6%;overflow:hidden;}
.categoryimage img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;}
}

/* PageSpeed CLS-Fix: Unterkategorie-Bilder (quadratisch 1:1) */
.category-desctop .prop-1-1{position:relative;padding-bottom:100%;overflow:hidden;}
.category-desctop .prop-1-1 img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;}

/* PageSpeed CLS-Fix: Footer Social-Media und Payment Icons */
.widget-social-icons img,.widget-payment-icons img{width:38px;height:28px;}

/* PageSpeed CLS-Fix: Newsletter-Banner im Footer */
.footer img.img-contain{width:451px;height:150px;}

/* CLS-Fix: Startseiten-Kategoriebilder (quadratisch, 1:1) - nur inline-caption */
.widget-image-box-inline-caption.widget-retain-aspect-ratio picture{display:block;position:relative;padding-bottom:100%;overflow:hidden;}
.widget-image-box-inline-caption.widget-retain-aspect-ratio picture img.img-cover{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;}

/* CLS-Fix: Startseiten-Kategoriebilder Mobile (lazy-img) */
.widget-image-box-inline-caption.widget-retain-aspect-ratio img.img-cover{aspect-ratio:1/1;width:100%;height:auto;}

/* font-display: swap fuer Rajdhani - WOFF2 (vorher TTF), verhindert Textblockierung */
@font-face{font-family:"Rajdhani-Regular";src:url("https://cdn02.plentymarkets.com/uugltyeuze37/frontend/PUB/fonts/Rajdhani-Regular.woff2") format("woff2"),url("https://cdn02.plentymarkets.com/uugltyeuze37/frontend/PUB/fonts/Rajdhani-Regular.ttf") format("truetype");font-display:swap;}
@font-face{font-family:"Rajdhani-Bold";src:url("https://cdn02.plentymarkets.com/uugltyeuze37/frontend/PUB/fonts/Rajdhani-Bold.woff2") format("woff2"),url("https://cdn02.plentymarkets.com/uugltyeuze37/frontend/PUB/fonts/Rajdhani-Bold.ttf") format("truetype");font-display:swap;}
@font-face{font-family:"Rajdhani-Medium";src:url("https://cdn02.plentymarkets.com/uugltyeuze37/frontend/PUB/fonts/Rajdhani-Medium.woff2") format("woff2"),url("https://cdn02.plentymarkets.com/uugltyeuze37/frontend/PUB/fonts/Rajdhani-Medium.ttf") format("truetype");font-display:swap;}

/* === CLS-Fix Kategoriebeschreibungen (13.04.2026) === */
/* Reserviert Platz fuer verzoegert gerenderte Beschreibungstexte.
   Hoehen am 13.04.2026 mit headless Chrome (1366px Desktop) gemessen.
   Bei Aenderung der Texte ueber Plenty-Backend NEU vermessen,
   sonst kommt CLS zurueck oder es entsteht Leerraum. */

/* Kurzer oberer Beschreibungstext - alle Kategorien (max 153 px gemessen) */
._category-description{min-height:160px;}

/* Langer Desktop-SEO-Text - exakt pro Hauptkategorie */
body.category-214 .widget.category-desctop{min-height:2001px;} /* Weihnachten */
body.category-198 .widget.category-desctop{min-height:1454px;} /* Ostern und Fruehling */
body.category-274 .widget.category-desctop{min-height:970px;}  /* Schalling */

/* === Schrift-Fix 23.09.2026 ===
   Ceres bindet die Shop-Schrift als "Custom-Font" mit font-display:optional ein
   (TTF, 350 KB). Kommt sie nicht in ~100 ms, bleibt die Seite in Helvetica.
   Diese Regel ueberschreibt die Quelle (WOFF2) und setzt swap. */
@font-face{font-family:"Custom-Font";src:url("https://cdn02.plentyone.com/uugltyeuze37/frontend/PUB/fonts/Rajdhani-Medium.woff2") format("woff2");font-display:optional;}

/* === CLS-Fix Artikelseite (29.09.2026) ===
   1) Bewertungssterne: Regeln wortgleich aus plugin feedback/css/main.css, das nachgeladen wird
      (media=none/onload). Ohne sie stehen die 10 Sterne kurz untereinander (231 px statt 30 px).
   2) Bilder-Karussell: kommt leer vom Server und erscheint erst im Browser. Solange es leer ist,
      Platz reservieren: Hauptbild 70vh (eigene Regel .single-carousel) + Vorschaubilder ca. 1/5 der
      Spaltenbreite. Etwas knapper als gemessen (19,5 statt 20 %), damit nie eine Luecke entsteht. */
.feedback-stars-average{width:120px;height:30px;margin-left:10px;position:relative;display:inline-block;vertical-align:bottom}
.feedback-stars-average .feedback-star{height:30px;width:24px;line-height:32px;font-size:24px;float:left;text-align:center;color:orange}
.feedback-stars-average .feedback-stars-background .feedback-star{color:rgba(0,0,0,.1)}
.feedback-stars-average .feedback-stars-background,.feedback-stars-average .feedback-stars-overlay,.feedback-stars-average .feedback-stars-overlay-wrap{position:absolute;top:0px;left:0px;width:120px;height:30px;overflow:hidden}
.feedback-stars-average .feedback-stars-overlay-wrap{width:0%}
.feedback-stars-average.feedback-category-view{margin-left:0px;width:85px}
.feedback-stars-average.feedback-category-view .feedback-star{height:20px;width:17px;line-height:22px;font-size:17px}
.feedback-stars-average.feedback-category-view .feedback-count{position:absolute;right:-20px;top:-1px}
.widget-feedback-average .small-stars{width:85px;margin-left:0px}
.widget-feedback-average .small-stars .feedback-stars-background{width:85px}
.widget-feedback-average .small-stars .feedback-star{height:20px;width:17px;line-height:22px;font-size:17px}
.widget-feedback-average span.small-stars{font-size:1em;display:inline-block;height:30px}
.widget-feedback-average .big-stars .feedback-star{height:30px;width:24px;line-height:32px;font-size:24px}
.widget-item-image:empty::before{content:"";display:block;height:70vh;padding-bottom:19.5%}

/* === CLS-Fix Kategorie-Banner (29.09.2026) ===
   Oberstes Vollbreiten-Bild jeder Kategorie (<picture>, ohne width/height) war bis zum Laden ~21 px hoch
   und schob danach den Inhalt um ~243 px. Formate (42 Kategorien geprueft): ab 768 px 1920x376,
   darunter quadratisch (1200x1200 bzw. 600x600). Kategorien mit ShopBuilder-Platzhalter (data:-SVG) ausgenommen. */
.categoriegrid .widget-fw picture:not(:has(source[srcset^="data:"])) > img.img-fluid.w-100{aspect-ratio:1/1}
@media (min-width:768px){.categoriegrid .widget-fw picture:not(:has(source[srcset^="data:"])) > img.img-fluid.w-100{aspect-ratio:1920/376}}

/* === Kategorie-Banner: Ergaenzung (29.09.2026) ===
   Beim Umschalten ueber 768 px Breite zeigt der Browser kurz noch das alte Bild im neuen Seitenverhaeltnis.
   object-fit:cover schneidet es in diesem Moment zu statt es zu verzerren. Beim passenden Bild ohne Wirkung. */
.categoriegrid .widget-fw picture:not(:has(source[srcset^="data:"])) > img.img-fluid.w-100{object-fit:cover}

/* === CLS-Fix Kachel-Navigation Weihnachten + Schalling (29.09.2026) ===
   Die Kacheln (Widget "Schritt-fuer-Schritt-Navigation", angepasste Komponente) kommen nicht fertig vom Server,
   sondern werden erst im Browser eingesetzt und schieben alles darunter nach unten. Bis dahin wird ihr Platz
   unter dem Kategorietext freigehalten. Die Reservierung endet automatisch, sobald die Kacheln da sind (:has),
   und gilt nur ab 769 px – darunter blendet der Shop die Kacheln aus. Hoehen am 29.09.2026 gemessen (769–2560 px).
   Browser ohne :has verwerfen diese Regeln komplett – dort bleibt alles wie vorher.
   WICHTIG: Aendert sich im ShopBuilder die Zahl der Kacheln (Unterkategorien) oder das Kachel-Widget,
   muss die Hoehe der betroffenen Regel neu gemessen werden – sonst entsteht wieder ein Sprung oder eine Luecke.
   Figuren I Miniaturen (242), Basteln (234), Kerzen & Raeucherkerzen (231) nutzen eine andere Komponente,
   dort wirkt diese Reservierung nicht – bewusst nicht enthalten, eigene Untersuchung offen. */
@media (min-width:769px){
  /* Weihnachten (Kategorie 214), 12 Kacheln */
  body.category-214 .categoriegrid > .row > .col-12:not(:has(.widget-step-by-step-navigation)) > .widget-fw:first-child + .widget-code::after{content:"";display:block;height:calc(2057px + 1.3333 * max(0px, 100vw - 1366px))}
  /* Schalling (Kategorie 274), 6 Kacheln */
  body.category-274 .categoriegrid > .row > .col-12:not(:has(.widget-step-by-step-navigation)) > .widget-fw:first-child + .widget-code::after{content:"";display:block;height:calc(1026px + 0.6667 * max(0px, 100vw - 1366px))}
}