/** Shopify CDN: Minification failed Line 649:0 Unexpected "/" **/ /* Mobile Header Anpassungen - März 2026 */ @media screen and (max-width: 768px) { /* 1. Abstand Logo → Suchleiste reduzieren (ca. 50%) */ .mobile__header.grid__wrapper.desktop-hide { height: 40px !important; min-height: 40px !important; padding-left: 10px !important; padding-right: 10px !important; } /* Burger-Button: überflüssiges Padding entfernen für exakte Ausrichtung */ .slideout__trigger-mobile-menu { padding-left: 0 !important; padding-right: 0 !important; } /* Burger-Striche dünner + enger zusammen */ page.silberschmuck-reinigen.json .header-section.nav__option-inline { padding-top: 5px !important; padding-bottom: 0px !important; margin-bottom: 0px !important; } /* 2. Suchleisten-Höhe um 30% reduzieren (50px → 35px) */ #boost-pfs-search-box-style3, .xboost-pfs-search-box { height: 35px !important; margin-bottom: 5px !important; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.65012 8.46656C6.75798 8.46656 8.46674 6.7578 8.46674 4.64993C8.46674 2.54207 6.75798 0.833313 4.65012 0.833313C2.54226 0.833313 0.833496 2.54207 0.833496 4.64993C0.833496 6.7578 2.54226 8.46656 4.65012 8.46656Z' stroke='%23534741' stroke-width='0.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M11.7142 11.7141L7.34839 7.34827' stroke='%23534741' stroke-width='0.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: 8px center !important; background-size: 16px 16px !important; } .boost-pfs-search-suggestion-style3-top-panel-input-group { height: 35px !important; } .boost-pfs-search-suggestion-style3-top-panel-input-group svg { height: 16px !important; width: 16px !important; } /* ===================================================== MOBILE HEADER ICONS - Alle 3 Icons gleich hoch (18px) - Account-Icon direkt neben Burger (wie snocks.com) - Abgeschnittene Icons beheben - Alle Icons auf gleicher Linienhöhe ===================================================== */ /* --- Account-Icon: mehr Platz, nicht abgeschnitten, nah am Burger --- */ .mobilxxe-menu__seacrch-link { overflow: visible !important; min-width: 24px !important; margin-left: -30px !important; } .mobilxxe-menu__seacrch-link .cart-links__link-account { height: auto !important; overflow: visible !important; } /* --- Alle drei Icons auf gleiche Größe (18px) --- */ .mobilxxe-menu__seacrch-link svg { height: 18px !important; width: 18px !important; } .mobile-menu__search-link svg { height: 18px !important; width: 18px !important; } .mobile-menu__cart-link svg.testament--icon-theme-bag.cart--icon { height: 18px !important; width: 18px !important; } /* --- Such-Icon Container: nicht abgeschnitten --- */ .mobile-menu__search-link { overflow: visible !important; margin-right: -20px !important; } .mobile-menu__search-link button { overflow: visible !important; } .mobile-menu__search-link li.seeks { height: auto !important; display: block !important; } .mobile-menu__search-link svg, .search-trigger-mobile svg, .trigger-search-mobile svg { overflow: visible !important; } /* --- Suchleisten-Lupe: dünne Striche --- */ .boost-pfs-search-suggestion-style3-top-panel-input-group svg { overflow: visible !important; } /* --- Suchleiste fixed beim Scrollen --- */ .js-header { position: fixed !important; top: 36px !important; left: 0 !important; right: 0 !important; z-index: 4 !important; background: #fff !important; padding: 0 !important; margin-top: 0 !important; box-sizing: border-box !important; height: auto !important; } /* Mobile Header Icons: relativ positioniert innerhalb js-header */ .js-header .mobile__header { position: relative !important; top: auto !important; margin-top: 0 !important; } /* Desktop-Nav verstecken auf Mobile */ .js-header .js-header-wrapper { display: none !important; } /* Suchleiste: Abstand oben und unten gleich (je 10px) */ .js-header .suche-fix-mobil { padding: 10px 10px !important; } /* Body braucht padding-top damit Content nicht verdeckt wird */ body.template-index, body { padding-top: 126px !important; margin-top: 0 !important; } } /* ===================================================== DESKTOP HEADER ICONS — Lupe und Benutzer nicht abgeschnitten ===================================================== */ /* Desktop Suche-Icon: größer und nicht abgeschnitten */ .trigger-search svg.testament--icon-theme-search, button.slideout__trigger-search svg { overflow: visible !important; height: 18px !important; width: 18px !important; } /* Desktop Benutzer-Icon: größer und nicht abgeschnitten */ .cart-links__link-account--icon, svg.testament--icon-theme-user.cart-links__link-account--icon { overflow: visible !important; height: 18px !important; width: 18px !important; } /* Desktop Warenkorb-Icon: konsistent */ svg.testament--icon-theme-bag.cart-links__link-cart--icon { overflow: visible !important; height: 18px !important; width: 18px !important; } .navigation__menulink span { white-space: nowrap !important; } /* Desktop Navigation: Unterstreichung endet genau am Wortende */ .navigation__menulink:hover span { text-decoration: none !important; border-bottom: 1px solid currentColor !important; padding-bottom: 2px !important; margin-right: -3.2px !important; } /* ===================================================== MOBILE: Versandkostenfrei-Leiste sichtbar ueber dem Banner ===================================================== */ @media screen and (max-width: 981px) { #shopify-section-vng-top-bar-mobile { position: relative; z-index: 2; } .vng-top-bar-mobile { position: relative; z-index: 2; } /* Slideshow neg. Margin auf Mobile aufheben, damit die Leiste nicht verdeckt wird */ body #shopify-section-template--21721922994517__slideshow_jWhU9M .slideshow-section { margin-top: 0px !important; } } /* Lupe auf Produktbildern in dunklerem Grau */ .product__section-images .zoom_btn { color: #555555 !important; } .product__section-images .zoom_btn svg path { fill: #555555 !important; } /* Abstand zwischen Trusted Shops Widget und Lagertext reduzieren */ .product__section-details .vng-shipping { margin-top: 5px !important; } .product__section-details .product__form-container { padding-bottom: 0 !important; } /* Wunschliste-Popup: X visuell auf Höhe & Größe des "W" ausgerichtet */ .wishlist-hero-header-close { left: auto !important; width: auto !important; padding: 0 !important; top: 25px !important; right: 24px !important; height: auto !important; line-height: 1 !important; display: inline-flex !important; align-items: flex-start !important; overflow: visible !important; } .wishlist-hero-header-close svg { width: 34px !important; height: 34px !important; margin-top: -7px !important; display: block !important; } /* Mobile-Burgermenue im Stil von eu.boden.com (Farben, Größe, Abstände) */ #slideout-mobile-navigation, #slideout-mobile-navigation .slide-nav, #slideout-mobile-navigation .slide-nav__wrapper { background: #FBF3F5 !important; } #slideout-mobile-navigation .slide-nav__item, #slideout-mobile-navigation .slide-nav__subitem, #slideout-mobile-navigation li.slide-nav__item.menu-link, #slideout-mobile-navigation .slide-nav__wrapper > li { border: none !important; border-bottom: none !important; margin: 0 !important; padding: 12.5px 16px !important; } #slideout-mobile-navigation .slide-nav__link, #slideout-mobile-navigation a.slide-nav__link { font-size: 16px !important; font-weight: 600 !important; color: #0339A0 !important; letter-spacing: 0.5px !important; text-transform: uppercase !important; line-height: 1.3 !important; } #slideout-mobile-navigation .slide-nav__sublink, #slideout-mobile-navigation a.slide-nav__sublink, #slideout-mobile-navigation .slide-nav__subitem a { font-size: 16px !important; font-weight: 400 !important; color: #0339A0 !important; text-transform: none !important; letter-spacing: normal !important; line-height: 1.3 !important; } #slideout-mobile-navigation .slide-nav__subitem { padding: 8px 16px !important; } /* Mobile-Menü: Zurück-Pfeil auf Größe des "Z" und linksbündig zu Menüpunkten */ #slideout-mobile-navigation .js-slide-nav-back, #slideout-mobile-navigation button.js-slide-nav-back { padding: 0 !important; display: flex !important; align-items: center !important; gap: 8px !important; background: transparent !important; border: none !important; width: 100% !important; justify-content: flex-start !important; } #slideout-mobile-navigation .js-slide-nav-back svg { width: auto !important; height: 10px !important; margin: 0 !important; flex-shrink: 0 !important; } /* Leerzeile zwischen "Zurück" und folgendem Menüpunkt */ #slideout-mobile-navigation .slide-nav__submenu > li:first-child, #slideout-mobile-navigation li.slide-nav__item:has(> .js-slide-nav-back) { margin-bottom: 20px !important; } /* Pfeile (Chevron) bei Hauptmenüpunkten mit Untermenü entfernen */ #slideout-mobile-navigation .js-slide-nav-next .slide-nav__icon, #slideout-mobile-navigation button.js-slide-nav-next svg { display: none !important; } /* Lieblingskollektionen Block am Ende des Mobile-Menüs */ #slideout-mobile-navigation .slide-nav__favorites { margin-top: 42px !important; padding: 0 !important; } #slideout-mobile-navigation .slide-nav__favorites-title { padding: 12.5px 16px !important; font-size: 16px !important; font-weight: 700 !important; color: #0339A0 !important; letter-spacing: 0.5px !important; text-transform: uppercase !important; } #slideout-mobile-navigation .slide-nav__favorites-list { list-style: none !important; padding: 0 !important; margin: 0 !important; } /* Lieblingskollektionen ausblenden, wenn ein Submenu offen ist */ #slideout-mobile-navigation:has(.slide-nav__submenu.active) .slide-nav__favorites { display: none !important; } /* Pfeil im Zurück-Button blau */ #slideout-mobile-navigation .js-slide-nav-back svg polygon, #slideout-mobile-navigation .js-slide-nav-back svg path { fill: #0339A0 !important; } /* Overlay Abdunkeln wenn Mobile-Menü offen */ .js-slideout-overlay, .site-overlay { background: #000 !important; } /* X-Button im Mobile-Menü-Header ausblenden */ #slideout-mobile-navigation .slideout__trigger--close { display: none !important; } /* Mobile-Drawer + Overlay unterhalb Announcement + Logo-Header */ @media (max-width: 749px) { #slideout-mobile-navigation, .js-slideout-overlay, .site-overlay { top: 80px !important; height: calc(100vh - 80px) !important; max-height: calc(100vh - 80px) !important; } } /* Filtermenü Mobile in Brand-Blau */ @media (max-width: 749px) { .boost-pfs-filter-tree, .boost-pfs-filter-tree *, .boost-pfs-filter-option-title, .boost-pfs-filter-option-item, .boost-pfs-filter-option-item a, .boost-pfs-filter-option-item span, .boost-pfs-filter-tree-mobile-button-label, .vng-filter-sort-button, .vng-filter-sort-button *, .boost-pfs-filter-refine-by-label, .boost-pfs-filter-refine-by-items, .boost-pfs-filter-refine-by-items * { color: #0339A0 !important; } .boost-pfs-filter-tree svg, .boost-pfs-filter-tree svg path, .boost-pfs-filter-tree svg polygon { fill: #0339A0 !important; stroke: #0339A0 !important; } } /* Filter Details: Trennlinien, Pfeile, X, Checkboxen, Balken */ @media (max-width: 749px) { .boost-pfs-filter-option, .boost-pfs-filter-option-content, .boost-pfs-filter-option-content.toggled, .boost-pfs-filter-options-wrapper, .boost-pfs-filter-options-wrapper > *, .boost-pfs-filter-tree .boost-pfs-filter-option, .boost-pfs-filter-tree { border: none !important; outline: none !important; box-shadow: none !important; } /* Checkboxen behalten ihren blauen Rahmen */ .boost-pfs-check-box { border: 1px solid #0339A0 !important; } .boost-pfs-filter-option-title::after, .boost-pfs-filter-option-title::before, .boost-pfs-filter-collapsible::after { border-color: #0339A0 !important; } .boost-pfs-filter-close, .boost-pfs-filter-close *, .boost-pfs-filter-close span { color: #0339A0 !important; } .boost-pfs-check-box { border-color: #0339A0 !important; } .selected > .boost-pfs-check-box, .boost-pfs-filter-option-item-selected .boost-pfs-check-box, .boost-pfs-filter-option-item.selected .boost-pfs-check-box { background-color: #0339A0 !important; border-color: #0339A0 !important; } .boost-pfs-filter-show-result, .boost-pfs-filter-show-result *, .boost-pfs-filter-mobile-footer button { background-color: #0339A0 !important; color: #FFFFFF !important; } } /* Filter Chevrons (::before auf filter-button) in Blau */ @media (max-width: 749px) { .boost-pfs-filter-button::before, .boost-pfs-filter-button::after, .boost-pfs-filter-option-title-heading::before, .boost-pfs-filter-option-title-heading::after { border-right-color: #0339A0 !important; border-bottom-color: #0339A0 !important; border-top-color: #0339A0 !important; border-left-color: #0339A0 !important; } } /* Filter-Drawer Backdrop: Shop-Flaeche abdunkeln wenn Filter offen */ @media (max-width: 749px) { body.boost-pfs-filter-tree-open-body::after, body:has(.boost-pfs-filter-tree-mobile-open)::after { content: ""; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.6); z-index: 9999; pointer-events: none; } } /* X-Icon im Filter-Mobile (Box blau, Kreuz weiß) + Chevron-Pfeile blau - high specificity */ .boost-pfs-filter-tree .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span, body .boost-pfs-filter-close span { background: #0339A0 !important; } .boost-pfs-filter-tree .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span::before, .boost-pfs-filter-tree .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span::after, body .boost-pfs-filter-close span::before, body .boost-pfs-filter-close span::after { background: #ffffff !important; } /* Chevrons blau - alle Border-Seiten */ body .boost-pfs-filter-tree .boost-pfs-filter-button::before, body .boost-pfs-filter-tree .boost-pfs-filter-button::after, body .boost-pfs-filter-tree .boost-pfs-filter-option-title-heading::before, body .boost-pfs-filter-tree .boost-pfs-filter-option-title-heading::after { border-top-color: #0339A0 !important; border-right-color: #0339A0 !important; border-bottom-color: #0339A0 !important; border-left-color: #0339A0 !important; } /* FILTER/SORTIEREN Buttons oben auf Collection schwarz zurück */ .vng-filter-sort-button, .vng-filter-sort-button *, .vng-filter-sort-container, .vng-filter-sort-container *, .vng-filter-sort-buttons, .vng-filter-sort-buttons * { color: #000000 !important; } /* Abstand Follow us zu Social Icons reduzieren (Desktop + Mobile) */ .all-fifth.social .column--headline, .footer .all-fifth.social .column--headline { margin-bottom: 6px !important; } /* Mobile: Follow us Abstand reduzieren (spezifischer als Desktop-Rule) */ @media (max-width: 749px) { .all-fifth.social .column--headline, .footer-section .all-fifth.social .column--headline, .row .all-fifth.social .column--headline, .footer .all-fifth.social .column--headline, body .all-fifth.social .column--headline { margin-top: 0 !important; margin-bottom: 6px !important; padding-bottom: 0 !important; } .all-fifth.social .social-icons__list_footer, body .all-fifth.social ul.social-icons__list_footer { margin-top: 0 !important; padding-top: 0 !important; } } /* Zusätzliche Pfeile in filter-option-title::after und range-amount::after blau */ body .boost-pfs-filter-option-title::before, body .boost-pfs-filter-option-title::after, body .boost-pfs-filter-option-range-amount::before, body .boost-pfs-filter-option-range-amount::after, body .boost-pfs-filter-tree .boost-pfs-filter-option-title::before, body .boost-pfs-filter-tree .boost-pfs-filter-option-title::after { border-top-color: #0339A0 !important; border-right-color: #0339A0 !important; border-bottom-color: #0339A0 !important; border-left-color: #0339A0 !important; } /* Mobile Pfeile (CSS-Triangle) auf filter-option-title-text::before blau */ .boost-pfs-filter-tree-v .boost-pfs-filter-option-title-text::before, .boost-pfs-filter-tree-v .boost-pfs-filter-option-title-text:before { border-top-color: #0339A0 !important; border-bottom-color: transparent !important; } .boost-pfs-filter-tree-v .boost-pfs-filter-option.boost-pfs-filter-option-collapsed .boost-pfs-filter-option-title-text::before, .boost-pfs-filter-tree-v .boost-pfs-filter-option.boost-pfs-filter-option-collapsed .boost-pfs-filter-option-title-text:before { border-top-color: transparent !important; border-bottom-color: #0339A0 !important; } /* Filter-Close (X) Hintergrund sicher blau */ .boost-pfs-filter-tree-vertical-style-off-canvas .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span { background: #0339A0 !important; } .boost-pfs-filter-tree-vertical-style-off-canvas .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span::before, .boost-pfs-filter-tree-vertical-style-off-canvas .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span::after, .boost-pfs-filter-tree-vertical-style-off-canvas .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span:before, .boost-pfs-filter-tree-vertical-style-off-canvas .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span:after { background: #ffffff !important; } /* Scroll-to-Top Button: Hintergrund transparent statt weiß */ #scrollToTopBtn, button#scrollToTopBtn, body #scrollToTopBtn { background: transparent !important; background-color: transparent !important; } /* X-Button mit maximal spezifischem Selektor (exakt wie Boost PFS Original + body) */ html body .boost-pfs-filter-tree-vertical-style-off-canvas:not(.boost-pfs-filter-tree-horizontal-style-expand) .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span { background: #0339A0 !important; background-color: #0339A0 !important; } html body .boost-pfs-filter-tree-vertical-style-off-canvas:not(.boost-pfs-filter-tree-horizontal-style-expand) .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span::before, html body .boost-pfs-filter-tree-vertical-style-off-canvas:not(.boost-pfs-filter-tree-horizontal-style-expand) .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span::after, html body .boost-pfs-filter-tree-vertical-style-off-canvas:not(.boost-pfs-filter-tree-horizontal-style-expand) .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span:before, html body .boost-pfs-filter-tree-vertical-style-off-canvas:not(.boost-pfs-filter-tree-horizontal-style-expand) .boost-pfs-filter-tree-v .boost-pfs-filter-mobile-toolbar .boost-pfs-filter-close span:after { background: #ffffff !important; background-color: #ffffff !important; } /* Fallback: X überall ohne Wrapper-Selektor */ a.boost-pfs-filter-close > span, .boost-pfs-filter-close > span { background: #0339A0 !important; } /* Mobile-Cart: SVG sichtbar (Theme setzt sonst display:none) */ .mobile-menu__cart-link svg, .mobile-menu__cart-link .cart--icon, .mobile-menu__account-link svg, .mobile-menu__account-link .mobile-menu__account-icon { display: inline-block !important; } /* Account-Icon an Warenkorb heranrücken (transform) */ @media (max-width: 749px) { body .mobile__header .mobile-menu__account-link { transform: translateX(35px) !important; } } /* Warenkorb-Icon nach unten, damit Höhe = Account-Icon */ @media (max-width: 749px) { body .mobile__header .mobile-menu__cart-link.my-cart-link-container svg, body .mobile__header .mobile-menu__cart-link.my-cart-link-container .cart--icon { transform: translateY(3px) !important; } } /* Mobile-Logo -5% verkleinern */ @media (max-width: 749px) { body .mobile__header .mobile-menu__logo img { transform: scale(0.95) !important; transform-origin: center !important; } } /* Account-Icon -5% verkleinern */ @media (max-width: 749px) { body .mobile__header .mobile-menu__account-link svg, body .mobile__header .mobile-menu__account-link .mobile-menu__account-icon { transform: scale(0.95) translateY(2px) !important; transform-origin: center !important; } } /* Cart-Count als schwarzer Kreis auf dem Warenkorb-Icon */ @media (max-width: 749px) { body .mobile__header .mobile-menu__cart-link.my-cart-link-container { position: relative !important; } body .mobile__header .mobile-menu__cart-link.my-cart-link-container > a { position: relative !important; display: inline-block !important; } body .mobile__header .mobile-menu__cart-link.my-cart-link-container .js-cart-count { position: absolute !important; top: -4px !important; right: -6px !important; min-width: 16px !important; height: 16px !important; padding: 0 4px !important; background: #000 !important; color: #fff !important; border-radius: 50% !important; font-size: 10px !important; line-height: 16px !important; text-align: center !important; font-weight: 600 !important; box-sizing: border-box !important; } } / .slideshow-section [style*="aspect-ratio"] { aspect-ratio: auto !important; }