/* =====================================================
   PRODUCT PAGE MODERNIZATION
   Nobel-Hobel.de - B2B E-Commerce Redesign
   Datei: product-modern.css
   Kann rückstandslos entfernt werden (reine CSS-Overrides)
   ===================================================== */

/* ===== 1. HEADER KOMPAKTER: USP-Bar ausblenden, Platz sparen ===== */

/* Top-Ribbon (Über uns, Schnelle Lieferung etc.) - BEHALTEN */
/* .mf-header-top-ribbon bleibt sichtbar */

/* Header-Schatten und ALLE Linien komplett entfernen */
header.page-header {
    box-shadow: none !important;
    border-bottom: none !important;
    border-top: none !important;
}

/* DIE LINIE: .mf-navigation-bar hat border-bottom: 2px solid #2563eb in stylesheet.css:5659 */
.mf-navigation-bar {
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
}

/* Sicherheitshalber alle anderen Header-Elemente auch */
#menu,
.mf-nav-container,
header.page-header .container,
.mf-header-nav,
.navbar,
#header,
.mf-header-top-section {
    border-bottom: none !important;
    border-top: none !important;
    box-shadow: none !important;
}

/* Leere Divs nach Header entfernen */
#content-wrapper {
    display: contents !important;
}

.header-spacer {
    display: none !important;
}

/* ===== 2. PRODUKTTITEL-BEREICH: Linie entfernen, kompakter ===== */

/* Neuer Breadcrumb oben - linksbündig, kompakt */
#product-product .product-breadcrumb-top {
    padding: 6px 0 0 0 !important;
    margin: 0 !important;
}

#product-product .product-breadcrumb-top .breadcrumb {
    background: none !important;
    padding: 0 !important;
    margin: 0 0 4px 0 !important;
    font-size: 12px !important;
    color: #888 !important;
    text-align: left !important;
}

/* Alter Breadcrumb im Content-Bereich: ausblenden (Duplikat) */
#product-product .product-page > .container-fluid > .page-header:first-child {
    display: none !important;
}

/* Titel-Bereich: kompakter Abstand */
#product-product .page-header.title-top {
    border: none !important;
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
    box-shadow: none !important;
}

/* Produkttitel moderner + kompakter */
#product-product .page-header.title-top h1 {
    font-size: 1.4em !important;
    font-weight: 600 !important;
    color: #1a1a2e !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    text-align: left !important;
}

/* ===== 3. SONDERANGEBOT-BADGE: Modern & auffällig ===== */

.product-gallery-wrapper .label.label-success.product-badge,
.label.label-success.product-badge {
    background: linear-gradient(135deg, #e8a33d 0%, #f0c060 100%) !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
    padding: 8px 24px !important;
    border-radius: 6px !important;
    text-transform: uppercase !important;
    box-shadow: 0 2px 8px rgba(232, 163, 61, 0.3) !important;
    display: inline-block !important;
}

/* ===== 4. ANSPRECHPARTNER-BOX: Modern statt Bootstrap-Panel ===== */

/* Panel-Rahmen: dezente graue Linie als eigener Block */
.contact-panel.panel.panel-info {
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: none !important;
    margin-bottom: 12px !important;
    background: #fff !important;
}

/* Panel-Header: warm statt kaltes Blau */
.contact-panel.panel.panel-info .panel-heading {
    background: linear-gradient(135deg, #f8f4ee 0%, #faf6f0 100%) !important;
    border-bottom: 1px solid #ede5d8 !important;
    padding: 10px 14px !important;
}

.contact-panel.panel.panel-info .panel-title {
    color: #8b6914 !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    letter-spacing: 0.02em !important;
}

/* Panel-Body etwas mehr Luft */
.contact-panel.panel.panel-info .panel-body {
    padding: 12px 14px !important;
}

/* WhatsApp-Button: IMMER weiss auf gruen (Logo-Richtlinien!) */
.btn-whatsapp-modern,
.btn-whatsapp-modern:link,
.btn-whatsapp-modern:visited,
.btn-whatsapp-modern:active,
.contact-panel .btn-whatsapp-modern,
.panel .btn-whatsapp-modern {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #25d366 !important;
    color: #fff !important;
    padding: 9px 18px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    border: none !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    box-shadow: 0 2px 8px rgba(37, 211, 102, 0.25) !important;
}

.btn-whatsapp-modern:hover {
    background: #1fb855 !important;
    color: #fff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 14px rgba(37, 211, 102, 0.4) !important;
    text-decoration: none !important;
}

.btn-whatsapp-modern .fa-whatsapp {
    font-size: 18px !important;
}

/* ===== 5. PREISBEREICH: Klarer, moderner, B2B-gerecht ===== */

/* Preis-Container - kein Rahmen */
#product .price.col-md-100 {
    background: none !important;
    border-radius: 0 !important;
    padding: 14px 0 !important;
    border: none !important;
    margin-bottom: 12px !important;
}

/* Alter Preis: deutlicher durchgestrichen */
#product .price-old {
    color: #aaa !important;
    font-size: 0.95em !important;
}

#product .price-old strike,
#product .price-old .holder_price_reg,
#product .price-old .holder_tax_reg {
    text-decoration: line-through !important;
    color: #aaa !important;
}

/* Neuer Preis: Karley-Orange statt Rot */
#product .price-new,
#product .price-new .holder_price_reg,
#product .price-padding-special .holder_price_reg {
    color: #d4922e !important;
    font-weight: 700 !important;
}

#product .price-new .holder_tax_reg,
#product .price-padding-special .holder_tax_reg {
    color: #e8a33d !important;
    font-weight: 600 !important;
}

/* "exkl. MwSt." / "inkl. MwSt." Labels */
#product .price-padding-special span[style*="font-weight: bold"] {
    font-weight: 600 !important;
    color: #888 !important;
}

/* ===== 6. WARENKORB-BUTTON: Auffällig & einladend ===== */

/* Hauptbutton: Dunkles Gold für WCAG-Kontrast (4.68:1 statt 2.71:1) */
#product-product .btn-cart,
#product-product a.btn-cart,
#product-product #button-cart {
    background: linear-gradient(135deg, #d4922e 0%, #b37a1a 100%) !important;
    border: none !important;
    border-color: transparent !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    padding: 12px 20px !important;
    border-radius: 8px !important;
    text-transform: none !important;
    letter-spacing: 0.03em !important;
    box-shadow: 0 3px 12px rgba(179, 122, 26, 0.35) !important;
    transition: all 0.25s ease !important;
}

#product-product .btn-cart:hover,
#product-product a.btn-cart:hover,
#product-product #button-cart:hover {
    background: linear-gradient(135deg, #b37a1a 0%, #9a6815 100%) !important;
    box-shadow: 0 4px 16px rgba(179, 122, 26, 0.45) !important;
    transform: translateY(-1px) !important;
    opacity: 1 !important;
}

#product-product .btn-cart:active,
#product-product #button-cart:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 8px rgba(179, 122, 26, 0.3) !important;
}

/* ===== 7. AKTIONS-BUTTONS: Hierarchie & Farbe ===== */

/* Wunschpreis-Button: Neutral wie die anderen Buttons (kein Gold) */
#product-product .button_wunsch {
    background: transparent !important;
    color: #555 !important;
    border: 1px solid #ccc !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    transition: all 0.2s !important;
    box-shadow: 0 2px 6px rgba(232, 163, 61, 0.2) !important;
}

#product-product .button_wunsch:hover {
    background: #f5f5f5 !important;
    border-color: #999 !important;
    color: #333 !important;
}

/* Beratung anfordern: sekundär hervorgehoben */
#product-product [name="more-buttons"] .btn-default[title*="anfordern"],
#product-product [name="more-buttons"] .btn-default:nth-of-type(2) {
    background: #2563eb !important;
    color: #fff !important;
    border-color: #2563eb !important;
    border-radius: 6px !important;
    font-weight: 500 !important;
    transition: all 0.2s !important;
}

#product-product [name="more-buttons"] .btn-default[title*="anfordern"]:hover,
#product-product [name="more-buttons"] .btn-default:nth-of-type(2):hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
    color: #fff !important;
}

/* Restliche Buttons: dezenter aber modern */
#product-product [name="more-buttons"] .btn-default {
    border-radius: 6px !important;
    border-color: #d0d0d0 !important;
    font-weight: 500 !important;
    transition: all 0.2s !important;
    color: #444 !important;
}

#product-product [name="more-buttons"] .btn-default:hover {
    background: #f5f5f5 !important;
    border-color: #bbb !important;
    color: #222 !important;
}

/* Flexvelop-Button: gleiches Design wie die Aktions-Buttons */
#product-product .btn-flexvelop {
    border-radius: 6px !important;
    border: 1px solid #d0d0d0 !important;
    background: transparent !important;
    color: #444 !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    transition: all 0.2s !important;
    text-decoration: none !important;
    vertical-align: middle !important;
}

#product-product .btn-flexvelop:hover {
    background: #f5f5f5 !important;
    border-color: #bbb !important;
    color: #222 !important;
    text-decoration: none !important;
}

/* ===== 8. VERFÜGBARKEITS-ANZEIGE ===== */

/* Lager-Info etwas hervorheben */
#product-product [name="verfuegbarkeit"] {
    font-size: 13px !important;
}

/* ===== 9. QUANTITY INPUT: Modern ===== */

#product-product .form-control.input-sm[name="quantity"] {
    border-radius: 6px !important;
    text-align: center !important;
    font-weight: 600 !important;
    border-color: #ddd !important;
}

/* Plus/Minus Buttons */
#product-product .input-group-btn .btn {
    border-radius: 6px !important;
    border-color: #ddd !important;
}

/* ===== 10. TABS: Moderner Look ===== */

#product-product .nav-tabs {
    border-bottom: 2px solid #e8e8e8 !important;
}

#product-product .nav-tabs > li > a {
    border: none !important;
    border-bottom: 2px solid transparent !important;
    margin-bottom: -2px !important;
    color: #777 !important;
    font-weight: 500 !important;
    padding: 10px 20px !important;
    transition: all 0.2s !important;
}

#product-product .nav-tabs > li > a:hover {
    background: none !important;
    color: #e8a33d !important;
    border-bottom-color: #e8a33d !important;
}

#product-product .nav-tabs > li.active > a,
#product-product .nav-tabs > li.active > a:hover,
#product-product .nav-tabs > li.active > a:focus {
    background: none !important;
    color: #e8a33d !important;
    border: none !important;
    border-bottom: 2px solid #e8a33d !important;
    font-weight: 600 !important;
}

/* ===== 11. SPEZIALANGEBOT-HINWEIS: Subtiles Urgency-Element ===== */

#product-product .text-muted[style*="font-size: 10px"] {
    color: #e8a33d !important;
    font-weight: 500 !important;
    font-size: 11px !important;
}

/* ===== 12. PRODUKTBILD-BEREICH: Kein Rahmen ===== */

#product-product .product-gallery-wrapper {
    border: none !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    background: none !important;
    box-shadow: none !important;
}

/* Thumbnails */
#product-product .product-gallery-wrapper .additional-images img,
#product-product .image-additional img {
    border-radius: 6px !important;
    border: 1px solid #eee !important;
    transition: border-color 0.2s !important;
}

#product-product .product-gallery-wrapper .additional-images img:hover,
#product-product .image-additional img:hover {
    border-color: #e8a33d !important;
}

/* ===== 13. SPACING & LAYOUT OPTIMIERUNG ===== */

/* Weniger vertikaler Abstand zwischen Sektionen */
#product-product .product-info-wrapper {
    margin-top: 0 !important;
}

/* Separator zwischen Ansprechpartner und Preis entfernen */
#product-product .product-info-wrapper > .contact-panel + * {
    margin-top: 10px !important;
}

/* ===== 14. TRUST SIGNALS: Micro-Badges bei Verfügbarkeit ===== */

/* Verfügbarkeits-Text grün hervorheben */
#product-product [name="verfuegbarkeit"] span[style*="color: green"],
#product-product [name="verfuegbarkeit"] .text-success {
    font-weight: 600 !important;
}

/* ===== 15. FARBHARMONISIERUNG: Konsistente Palette ===== */

/* --- A. Navigation: Neutral-Dark statt Blau (#2563eb → #2d2d44) --- */
.mf-nav-item > a:hover,
.mf-nav-list > li > a:hover {
    background: #2d2d44 !important;
    color: #fff !important;
}

/* Home-Button falls farbig */
.mf-nav-item.home a {
    background: transparent !important;
}

.mf-nav-item.home a:hover {
    background: #2d2d44 !important;
    color: #fff !important;
}

/* Mobile Menu Header neutral */
@media (max-width: 981px) {
    .mobile-menu-header {
        background: #2d2d44 !important;
    }
}

/* --- B. Panel-Info global neutralisieren (weg vom kalten Teal) --- */
.panel.panel-info {
    border-color: #d4d4de !important;
}

.panel.panel-info > .panel-heading {
    background: #f5f5f8 !important;
    border-bottom-color: #d4d4de !important;
    color: #2d2d44 !important;
}

.panel.panel-info .panel-title {
    color: #2d2d44 !important;
}

/* --- C. Preisfarbe global: Orange statt Rot --- */
.price-new {
    color: #d4922e !important;
}

/* Sale-Labels global */
.label-success {
    background: #e8a33d !important;
}

/* Telefonnummer: ein konsistenter Blauton + kein Zeilenumbruch */
a[href^="tel"] {
    color: #2563eb !important;
}

.mf-contact-number,
.mf-contact-info {
    white-space: nowrap !important;
    width: auto !important;
    min-width: max-content !important;
}

/* --- D. ALLE Blautöne auf einen einzigen (#2563eb) vereinheitlichen --- */

/* Header-Icons: #0857bb → #2563eb (NICHT die Lupe - die bleibt weiß auf farbigem Button!) */
.mf-header-main .fa-user,
.mf-header-main .fa-heart,
.mf-header-main .fa-heart-o,
.mf-header-main .fa-exchange,
.mf-header-main .fa-shopping-cart,
.mf-header-main .fa-check-circle,
#top-links i.fa:not(.fa-search),
.top-links i.fa:not(.fa-search) {
    color: #2563eb !important;
}

/* Lupe im Suchfeld: Immer weiß (auf farbigem Button) */
.mf-search-button .fa-search,
#search .fa-search,
.btn-search .fa-search {
    color: #fff !important;
}

/* Tab-Höhe reduzieren */
#tabs.nav-pills > li > a {
    padding: 6px 15px !important;
}

/* Aktiver Tab PRODUKTSEITE: Gefüllter Pill #2563eb */
#tabs.nav-pills > li.active > a,
#tabs.nav-pills > li.active > a:hover,
#tabs.nav-pills > li.active > a:focus,
body .nav-tabs > li.active > a,
body .nav-tabs > li.active > a:hover,
body .nav-tabs > li.active > a:focus {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
}

/* Aktiver Tab HOMEPAGE (tabbed_products): Dezent, nur Unterstrich */
.tabbed-products .nav-pills > li.active > a,
.tabbed-products .nav-pills > li.active > a:hover,
.tabbed-products .nav-pills > li.active > a:focus {
    background: transparent !important;
    color: #2d2d44 !important;
    border-bottom: 3px solid #e8a33d !important;
    border-radius: 0 !important;
}

/* Homepage Tab Arrow-Indicator: Gold statt Grau */
.tabbed-products .nav-pills > li.active > a:before {
    border-top-color: #e8a33d !important;
}

/* Tab Hover: Produktseite */
#tabs.nav-pills > li > a:hover,
body .nav-tabs > li > a:hover {
    border-color: #2563eb !important;
    color: #2563eb !important;
    background-color: rgba(37, 99, 235, 0.08) !important;
}

/* Tab Hover: Homepage dezent */
.tabbed-products .nav-pills > li > a:hover {
    background: transparent !important;
    color: #2d2d44 !important;
    border-bottom: 3px solid rgba(232, 163, 61, 0.4) !important;
    border-radius: 0 !important;
}

/* "Sonderangebot -XX%" Labels: Karley-Gold statt Knallrot */
.onsale {
    color: #d4922e !important;
    background: rgba(255, 255, 255, 0.92) !important;
    font-weight: 600 !important;
}

/* Auch im Owl-Carousel (Homepage) */
.owl-carousel .onsale,
.tabbed-products .onsale {
    color: #d4922e !important;
}

/* Mega-Dropdown Border-Top: #0857bb → #2563eb */
.dropdown-menu.mega-dropdown,
.mf-nav-list .dropdown-menu {
    border-top-color: #2563eb !important;
}

/* Info-Card Icon bg → einheitlich */
.info-card-icon.blue {
    background: #2563eb !important;
}

/* Warenkorb-Badge bleibt #2563eb (OK) */

/* ===== E. KATEGORIE-SEITE: Alle Blautöne → #2563eb ===== */

/* MegaFilter Counter-Badges: #428bca → #2563eb */
.mfilter-counter {
    background-color: #2563eb !important;
}

/* MegaFilter Such-Button: #428bca → #2563eb (inkl. Lupe im Suchfeld!) */
.mfilter-free-button,
.mfilter-button-search,
#mfilter-search-button,
#mfilter-opts-search_button,
.mfilter-search #mfilter-opts-search_button,
.mfilter-box .btn-primary {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
}

/* MegaFilter Preis-Slider Track: #428bca → #2563eb */
.mfilter-box .ui-slider-range,
.ui-slider-range.ui-widget-header {
    background: #2563eb !important;
}

/* MegaFilter Slider Handle: #1c94c4 → #2563eb */
.mfilter-box .ui-slider-handle,
.ui-slider-handle.ui-state-default {
    border-color: #2563eb !important;
}

/* "Preis auf Anfrage" Link-Farbe: #33a1ff → #2563eb */
.product-list .price span[style*="color"],
.product-grid .price span[style*="color"],
.price a,
.price span a {
    color: #2563eb !important;
}

/* Generische btn-primary: Blau (für Unterkategorien etc.) */
.btn-primary {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* ALLE Buttons in Produktkarten: Einheitliches Design */

/* Haupt-CTA (Warenkorb / Optionen): Gold-Gradient */
.product-thumb .button-group .btn-primary,
.product-list .button-group .btn-primary,
.product-layout .button-group .btn-primary,
.product-thumb .btn-primary[onclick*="cart.add"],
.product-layout .btn-primary[onclick*="cart.add"] {
    background: linear-gradient(135deg, #d4922e 0%, #b37a1a 100%) !important;
    border-color: #b37a1a !important;
    color: #fff !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    border-radius: 25px !important;
    padding: 10px 20px !important;
    box-shadow: 0 2px 8px rgba(179, 122, 26, 0.25) !important;
    transition: all 0.2s ease !important;
}

.product-thumb .button-group .btn-primary:hover,
.product-list .button-group .btn-primary:hover,
.product-layout .button-group .btn-primary:hover {
    background: linear-gradient(135deg, #b37a1a 0%, #96650f 100%) !important;
    box-shadow: 0 4px 12px rgba(179, 122, 26, 0.35) !important;
    transform: translateY(-1px) !important;
}

/* Sekundaer-Button (Optionen, Testen, Mieten): Blau */
.product-thumb .button-group .btn-success,
.product-list .button-group .btn-success,
.product-layout .button-group .btn-success,
.product-thumb .button-group .btn-info,
.product-list .button-group .btn-info,
.product-layout .button-group .btn-info {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
    font-weight: 600 !important;
    border-radius: 25px !important;
    padding: 8px 18px !important;
    transition: all 0.2s ease !important;
}

.product-thumb .button-group .btn-success:hover,
.product-list .button-group .btn-success:hover,
.product-layout .button-group .btn-success:hover,
.product-thumb .button-group .btn-info:hover,
.product-list .button-group .btn-info:hover,
.product-layout .button-group .btn-info:hover {
    background-color: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* Globale btn-success/btn-info Absicherung (nicht nur in Produktkarten) */
.btn-success {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
}

.btn-success:hover,
.btn-success:focus {
    background-color: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

.btn-info {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
}

.btn-info:hover,
.btn-info:focus {
    background-color: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* ===== GLOBALE BUTTON-HARMONISIERUNG ===== */
/* Alle Seiten: Checkout, Account, Login, Kontakt etc. */

/* btn-primary: IMMER mit Hintergrund (Theme macht Outline → Fix!) */
.btn-primary {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
    color: #fff !important;
}

/* btn-login: #0857bb (verboten!) → #2563eb */
.btn-login,
.btn-login:link,
.btn-login:visited {
    background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 25px !important;
}

.btn-login:hover,
.btn-login:focus {
    background: linear-gradient(135deg, #1d4ed8 0%, #1742a0 100%) !important;
    color: #fff !important;
}

/* btn-register: Grün (verboten!) → Gold-Gradient */
.btn-register,
.btn-register:link,
.btn-register:visited {
    background: linear-gradient(135deg, #d4922e 0%, #b37a1a 100%) !important;
    border: none !important;
    color: #fff !important;
    border-radius: 25px !important;
}

.btn-register:hover,
.btn-register:focus {
    background: linear-gradient(135deg, #b37a1a 0%, #96650f 100%) !important;
    color: #fff !important;
}

/* btn-secondary (Bootstrap 4 in BS3 Projekt → definieren) */
.btn-secondary {
    background-color: #f5f5f8 !important;
    border: 1px solid #ccc !important;
    color: #2d2d44 !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: #e8e8ec !important;
    border-color: #999 !important;
}

/* btn-danger: Nur für destruktive Aktionen (Löschen) - angepasstes Rot */
.btn-danger {
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
    color: #fff !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
}

.btn-danger:hover,
.btn-danger:focus {
    background-color: #c82333 !important;
    border-color: #c82333 !important;
    color: #fff !important;
}

/* ===== WARENKORB-SEITE: Buttons modernisieren ===== */

/* "Zur Kasse" Haupt-CTA: Gold-Gradient (wie Produktseite Warenkorb) */
#checkout-cart #button-checkout,
#button-checkout.btn-cart,
.btn-cart,
a.btn-cart {
    background: linear-gradient(135deg, #d4922e 0%, #b37a1a 100%) !important;
    border-color: #b37a1a !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    border-radius: 25px !important;
    padding: 12px 24px !important;
    box-shadow: 0 2px 8px rgba(179, 122, 26, 0.25) !important;
    transition: all 0.2s ease !important;
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
}

#checkout-cart #button-checkout:hover,
.btn-cart:hover,
a.btn-cart:hover {
    background: linear-gradient(135deg, #b37a1a 0%, #96650f 100%) !important;
    box-shadow: 0 4px 12px rgba(179, 122, 26, 0.35) !important;
    transform: translateY(-1px) !important;
}

/* Unterkategorien-Button: dezent, nicht wie Warenkorb */
.subcat-btn,
a.subcat-btn,
.subcat-btn.btn-cart {
    background: transparent !important;
    border: 1px solid #d4922e !important;
    color: #d4922e !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 6px 16px !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* Produktvergleich: Buttons kompakter */
#product-compare .btn-cart {
    font-size: 13px !important;
    padding: 6px 16px !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

#product-compare .btn-cart:hover {
    transform: none !important;
}

.subcat-btn:hover,
a.subcat-btn:hover,
.subcat-btn.btn-cart:hover {
    background: #d4922e !important;
    color: #fff !important;
    box-shadow: none !important;
    transform: none !important;
}

/* "Weiter Einkaufen": Outline-Style, dezent */
#checkout-cart #continue-shopping {
    background: transparent !important;
    border: 2px solid #2563eb !important;
    color: #2563eb !important;
    font-weight: 600 !important;
    border-radius: 25px !important;
    padding: 12px 24px !important;
    transition: all 0.2s ease !important;
}

#checkout-cart #continue-shopping:hover {
    background: #2563eb !important;
    color: #fff !important;
}

/* "Versandkosten berechnen" und andere Neben-Buttons im Cart */
#checkout-cart .btn-danger,
#checkout-cart .panel .btn-primary,
#checkout-cart .panel .btn-default:not(#button-checkout) {
    background: #2563eb !important;
    border-color: #2563eb !important;
    color: #fff !important;
    border-radius: 25px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
}

#checkout-cart .btn-danger:hover,
#checkout-cart .panel .btn-primary:hover {
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* Checkout-Bestätigungs-Button: auch Gold */
#button-confirm {
    background: linear-gradient(135deg, #d4922e 0%, #b37a1a 100%) !important;
    border-color: #b37a1a !important;
    color: #fff !important;
    font-weight: 700 !important;
    border-radius: 25px !important;
    padding: 14px 30px !important;
    font-size: 16px !important;
}

/* toTop-Button: Neutral statt Rot */
#toTop:hover {
    background: #2d2d44 !important;
}

/* ===== 16. NEWS-KALENDER DATUMSANZEIGEN ===== */

/* Datums-Badge: Bootstrap bg-primary (#337ab7) → Design-Richtlinie Blau (#2563eb) */
.news-date,
.news-date.bg-primary {
    background-color: #2563eb !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.3) !important;
}

/* Tag-Zahl */
.news-date .news-day {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #fff !important;
    line-height: 1.1 !important;
}

/* Monatsname */
.news-date .news-month {
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    color: rgba(255, 255, 255, 0.85) !important;
    letter-spacing: 0.5px !important;
}

/* News-Titel Link: konsistentes Blau bei Hover */
.news-title a:hover {
    color: #2563eb !important;
}

/* Pagination Dots: aktiv → #2563eb */
.news-slider .owl-page.active span {
    background: #2563eb !important;
}

/* ===== 17. RESPONSIVE ANPASSUNGEN ===== */

@media (max-width: 991px) {
    #product-product .page-header.title-top h1 {
        font-size: 1.3em !important;
    }

    #product-product .btn-cart,
    #product-product #button-cart {
        padding: 10px 16px !important;
        font-size: 14px !important;
    }
}

@media (max-width: 767px) {
    #product-product .page-header.title-top h1 {
        font-size: 1.15em !important;
    }

    .contact-panel.panel.panel-info {
        margin-top: 15px !important;
    }

    #product .price.col-md-100 {
        padding: 10px 12px !important;
    }
}
