/* EU-Pflichtangaben (Gewährleistung) — Optik des Hinweises. * * ALLE Eigenschaften mit !important. Das ist keine Schlamperei, sondern * Notwehr: Der Hinweis hängt als Geschwister ZWISCHEN Ecwids Modulen, und * Ecwids Reset nullt eingehängtes Markup mit stärkerem Selektor — dabei * gerade die unauffälligen Eigenschaften wie Rand, Füllung und Abstand. * Farbe und Rundung lässt er durch, es sieht also fast richtig aus und ist * trotzdem kaputt. Auf der Schwesterseite hat genau das zwei Lieferungen * gekostet. * * Bewusst KEINE eigenen Schriften und keine Markenfarben: Das Plugin läuft * unter einem gekauften Theme und soll sich einfügen, nicht auffallen. * Es erbt die Schrift der Produktseite (font: inherit) und nutzt neutrale * Grautöne. */ .ldeu { box-sizing: border-box !important; display: flex !important; align-items: center !important; gap: 12px !important; width: 100% !important; max-width: 100% !important; margin: 16px 0 6px !important; padding: 10px 12px !important; border: 1px solid rgba(0, 0, 0, 0.12) !important; border-radius: 12px !important; background: #fff !important; font: inherit !important; line-height: 1.35 !important; text-align: left !important; /* Umbruch generell erlauben, nicht erst bei schmalem FENSTER: Das Plugin laeuft unter einem fremden Theme und weiss nicht, wie breit die Produktspalte dort ist. Live gemessen auf treppenlift-preisportal.de: 341 px Spaltenbreite bei 1280 px Fenster - eine Media-Query auf die Fensterbreite haette dort nie gegriffen, und die Zeile wurde 108 px hoch. */ flex-wrap: wrap !important; } .ldeu * { box-sizing: border-box !important; } .ldeu__mini { width: 34px !important; height: auto !important; flex: 0 0 auto !important; margin: 0 !important; border-radius: 3px !important; } .ldeu__txt { display: flex !important; flex-direction: column !important; gap: 2px !important; /* Darf schrumpfen, aber nicht unter eine lesbare Breite: Darunter rutscht der Knopf in die naechste Zeile - das ist gewollt. */ flex: 1 1 190px !important; min-width: 0 !important; } .ldeu__txt strong { font-size: 13.5px !important; font-weight: 600 !important; color: #1d2327 !important; line-height: 1.3 !important; } .ldeu__txt span { font-size: 12px !important; color: #50575e !important; line-height: 1.3 !important; } .ldeu__btn { margin-left: auto !important; flex: 0 0 auto !important; padding: 7px 14px !important; border: 1px solid rgba(0, 0, 0, 0.18) !important; border-radius: 999px !important; background: #fff !important; font: inherit !important; font-size: 13px !important; font-weight: 600 !important; color: #1d2327 !important; cursor: pointer !important; white-space: nowrap !important; } .ldeu__btn:hover { border-color: rgba(0, 0, 0, 0.42) !important; } /* Vollbild-Fassung: die amtliche Mitteilung direkt auf der Seite. */ .ldeu.is-voll { display: block !important; padding: 0 !important; border: 0 !important; background: none !important; } .ldeu__voll { display: block !important; width: 100% !important; max-width: 340px !important; height: auto !important; border: 1px solid rgba(0, 0, 0, 0.12) !important; border-radius: 10px !important; } /* Auf schmalen Geraeten nimmt der umgebrochene Knopf die volle Breite, statt links zu kleben. Der Umbruch IM Knopf wuerde die Zeile hoeher machen statt schmaler - deshalb bleibt der Text dort einzeilig. */ @media (max-width: 480px) { .ldeu__btn { margin-left: 0 !important; width: 100% !important; text-align: center !important; } } /* -------------------------------------------------------------------- * Das Fenster mit der amtlichen Mitteilung. * Hängt am (siehe ldeu.js), deshalb hier ohne Ecwid-Sorgen — * !important bleibt trotzdem, weil manche Themes