/* DuPaDent_NOVA – Design auf Basis von NOVA (wird nach themes/clear/clear.css geladen)
   Prinzip: ruhige, klinisch saubere Flaechen mit feinen Linien; die Navy-Menueleiste mit
   Cyan-Markierung ist das eine praegnante Element. Cyan wird nur als Signal eingesetzt. */

/* ---------- Schriften (lokal, kein Google-Fonts-Abruf) ---------- */
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 400; font-display: swap; src: url('../../fonts/roboto-400-latin.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 500; font-display: swap; src: url('../../fonts/roboto-500-latin.woff2') format('woff2'); }
@font-face { font-family: 'Roboto'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../fonts/roboto-700-latin.woff2') format('woff2'); }
@font-face { font-family: 'Quicksand'; font-style: normal; font-weight: 500; font-display: swap; src: url('../../fonts/quicksand-500-latin.woff2') format('woff2'); }
@font-face { font-family: 'Quicksand'; font-style: normal; font-weight: 600; font-display: swap; src: url('../../fonts/quicksand-600-latin.woff2') format('woff2'); }
@font-face { font-family: 'Quicksand'; font-style: normal; font-weight: 700; font-display: swap; src: url('../../fonts/quicksand-700-latin.woff2') format('woff2'); }

/* ---------- Tokens ---------- */
:root {
    --dp-navy: #25408f;
    --dp-navy-deep: #1b3074;
    --dp-cyan: #51c8e8;
    --dp-ice: #eef8fc;
    --dp-line: #dce3f0;
    --dp-muted: #5a6b97;
    --dp-salmon: #ee7f65;
    --dp-radius-pill: 25px;
    --dp-radius: 8px;
    --dp-display: 'Quicksand', 'Roboto', sans-serif;

    --primary: var(--dp-navy);
    --secondary: var(--dp-cyan);
}

/* ---------- Grundtypografie (Skala 1.25) ---------- */
body {
    font-family: 'Roboto', -apple-system, 'Segoe UI', Arial, sans-serif;
    color: var(--dp-navy);
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--dp-display);
    font-weight: 700;
    color: var(--dp-navy);
    letter-spacing: -.005em;
}
a { color: var(--dp-navy); }
a:hover { color: var(--dp-navy-deep); }
:focus-visible { outline: 2px solid var(--dp-cyan); outline-offset: 2px; }
.price, .productbox-price, .item-slider-price { font-variant-numeric: tabular-nums; }

/* ---------- Buttons & Formulare ---------- */
.btn { font-family: var(--dp-display); font-weight: 700; border-radius: var(--dp-radius-pill); }
.btn-primary, .btn-primary:not(:disabled):not(.disabled):active {
    background-color: var(--dp-navy); border-color: var(--dp-navy); color: #fff;
}
.btn-primary:hover, .btn-primary:focus { background-color: var(--dp-navy-deep); border-color: var(--dp-navy-deep); color: #fff; }
.btn-outline-primary { border-color: var(--dp-navy); color: var(--dp-navy); }
.btn-outline-primary:hover { background-color: var(--dp-navy); border-color: var(--dp-navy); color: #fff; }
.btn-secondary { background-color: var(--dp-cyan); border-color: var(--dp-cyan); color: var(--dp-navy); }
.form-control:focus, .custom-select:focus { border-color: var(--dp-cyan); box-shadow: 0 0 0 .2rem rgba(81, 200, 232, .25); }
.custom-control-input:checked ~ .custom-control-label::before { background-color: var(--dp-navy); border-color: var(--dp-navy); }

/* ---------- Hinweisleiste (B2B) ---------- */
.dp-notice { background: var(--dp-navy); color: #fff; font-size: .85rem; }
.dp-notice[hidden] { display: none; }
.dp-notice-inner { display: flex; align-items: center; gap: 1rem; padding-top: .45rem; padding-bottom: .45rem; }
.dp-notice-text { margin: 0; flex: 1; text-align: center; }
.dp-notice-text strong { color: var(--dp-cyan); font-weight: 500; }
.dp-notice-close { background: none; border: 0; color: #fff; font-size: 1.3rem; line-height: 1; cursor: pointer; opacity: .8; }
.dp-notice-close:hover { opacity: 1; }

/* ---------- Topbar (News, Kontakt) ---------- */
#header-top-bar, .topbar-wrapper { background: #fff; font-size: .85rem; }
#header-top-bar a, .topbar-wrapper .nav-link { color: var(--dp-muted); }
#header-top-bar a:hover { color: var(--dp-navy); }

/* ---------- Header: Logo | breite Suche | Icons ---------- */
#jtl-nav-wrapper { background: #fff; box-shadow: none; border-bottom: 0; }
#jtl-nav-wrapper .nav-icons-wrapper .nav-link,
#jtl-nav-wrapper .nav-icons-wrapper .fas,
#jtl-nav-wrapper .nav-icons-wrapper .far { color: var(--dp-navy); }
#jtl-nav-wrapper .fa-sup, #jtl-nav-wrapper .badge { background: var(--dp-cyan); color: var(--dp-navy); }

#jtl-nav-wrapper #search-header {
    height: 48px;
    border: 1.5px solid var(--dp-line);
    border-right: 0;
    border-radius: var(--dp-radius-pill) 0 0 var(--dp-radius-pill);
    padding-left: 1.25rem;
    font-size: 1rem;
    background: #fff;
}
#jtl-nav-wrapper #search-header:focus { border-color: var(--dp-cyan); box-shadow: none; }
#jtl-nav-wrapper .search-wrapper .btn,
#jtl-nav-wrapper .main-search .btn {
    height: 48px;
    min-width: 56px;
    border-radius: 0 var(--dp-radius-pill) var(--dp-radius-pill) 0;
    background: var(--dp-navy);
    border-color: var(--dp-navy);
    color: #fff;
}
@media (min-width: 992px) {
    #jtl-nav-wrapper .main-search-wrapper { flex: 1 1 auto; max-width: 680px; margin: 0 auto; }
    #jtl-nav-wrapper .main-search-wrapper .search-wrapper,
    #jtl-nav-wrapper .main-search-wrapper .form-group,
    #jtl-nav-wrapper .main-search-wrapper .input-group { width: 100%; max-width: none; }
}

/* ---------- Hauptnavigation: Navy-Leiste mit Cyan-Markierung ---------- */
@media (min-width: 992px) {
    /* Leiste ueber die volle Breite: Hintergrund am vollbreiten Container der Menuezeile
       (kein clip-path, sonst wird das Mega-Menue abgeschnitten) */
    #jtl-nav-wrapper > div:has(#mainNavigation),
    #mainNavigation {
        background: var(--dp-navy);
    }
    #mainNavigation .navbar-nav > .nav-item > .nav-link {
        position: relative;
        color: #fff;
        font-family: var(--dp-display);
        font-weight: 700;
        font-size: 1rem;
        letter-spacing: .01em;
        padding-top: .8rem;
        padding-bottom: .8rem;
        background: transparent;
    }
    #mainNavigation .navbar-nav > .nav-item > .nav-link::before {
        content: '';
        position: absolute;
        left: 1rem;
        right: 1rem;
        bottom: 0;
        height: 3px;
        border: 0;
        border-radius: 3px 3px 0 0;
        background: var(--dp-cyan);
        transform: scaleX(0);
        transition: transform .18s ease-out;
    }
    #mainNavigation .navbar-nav > .nav-item > .nav-link:hover::before,
    #mainNavigation .navbar-nav > .nav-item.active > .nav-link::before,
    #mainNavigation .navbar-nav > .nav-item.show > .nav-link::before { transform: scaleX(1); }
    #mainNavigation .navbar-nav > .nav-item > .nav-link:hover,
    #mainNavigation .navbar-nav > .nav-item.active > .nav-link,
    #mainNavigation .navbar-nav > .nav-item.show > .nav-link { color: #fff; background: transparent; }
    #mainNavigation .navbar-nav > .nav-item > .nav-link::after { border-color: rgba(255, 255, 255, .7); }

    /* Mega-Menue */
    #mainNavigation .navbar-nav > .nav-item > .dropdown-menu {
        border: 0;
        border-top: 3px solid var(--dp-cyan);
        border-radius: 0 0 var(--dp-radius) var(--dp-radius);
        box-shadow: 0 18px 40px rgba(27, 48, 116, .14);
    }
    /* verschachtelte Listen im Mega-Menue: flach, ohne Rahmen */
    #mainNavigation .dropdown-menu .dropdown-menu,
    #mainNavigation .dropdown-menu .nav,
    #mainNavigation .dropdown-menu .categories-recursive-dropdown {
        border: 0 !important;
        box-shadow: none !important;
        border-radius: 0;
        background: transparent;
    }
    #mainNavigation .dropdown-menu .nav-item,
    #mainNavigation .dropdown-menu .categories-recursive-link { border: 0; }
    #mainNavigation .dropdown-menu .categories-recursive-link,
    #mainNavigation .dropdown-menu .submenu-headline {
        padding-bottom: .5rem;
        margin-bottom: .35rem;
        border-bottom: 1px solid var(--dp-line) !important;
        font-size: 1rem;
    }
    #mainNavigation .dropdown-menu .nav-link { padding: .18rem 0; color: var(--dp-muted); }
    #mainNavigation .dropdown-menu .nav-link:hover { color: var(--dp-navy); }
    #mainNavigation .dropdown-menu a { color: var(--dp-navy); }
    #mainNavigation .dropdown-menu a:hover { color: var(--dp-navy-deep); text-decoration: underline; text-decoration-color: var(--dp-cyan); text-underline-offset: 4px; }
    #mainNavigation .dropdown-menu .categories-recursive-link,
    #mainNavigation .dropdown-menu .nav-mobile-heading,
    #mainNavigation .dropdown-menu .submenu-headline { font-family: var(--dp-display); font-weight: 700; }
    #mainNavigation .nav-scrollbar-arrow { background: var(--dp-navy); color: #fff; }
}
@media (prefers-reduced-motion: reduce) {
    #mainNavigation .navbar-nav > .nav-item > .nav-link::before { transition: none; }
}

/* ---------- USP-Leiste (unter dem Menue) ---------- */
.dp-usps { background: var(--dp-ice); }
.dp-usps-list {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .25rem 2.5rem;
    margin: 0;
    padding-top: .5rem;
    padding-bottom: .5rem;
    list-style: none;
    font-size: .85rem;
    color: var(--dp-navy);
}
.dp-usps-list li::before { content: '\2713'; margin-right: .45rem; color: var(--dp-navy); font-weight: 700; }
@media (max-width: 767.98px) { .dp-usps-list li:not(:first-child) { display: none; } }

/* ---------- Startseite: Hero ---------- */
.dp-hero {
    position: relative;
    overflow: hidden;
    min-height: 460px;
    display: flex;
    align-items: center;
    background: var(--dp-ice);
}
.dp-hero-bg, .dp-hero-bg img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left center;
}
/* Handy: Foto als eigener Block oben, Text darunter (sonst liegt der Text ueber dem Gesicht) */
@media (max-width: 767.98px) {
    .dp-hero { display: block; background: #fff; }
    .dp-hero::after { display: none; }
    .dp-hero-bg, .dp-hero-bg img { position: static; display: block; height: auto; }
    .dp-hero-bg img { aspect-ratio: 4 / 3; object-position: 30% 15%; }
    .dp-hero-inner { padding-top: 1.5rem; padding-bottom: 1.75rem; }
}
.dp-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 35%, rgba(255, 255, 255, .82) 58%, rgba(255, 255, 255, .92) 100%);
}
.dp-hero-inner { position: relative; z-index: 1; display: flex; justify-content: flex-end; padding-top: 3rem; padding-bottom: 3rem; }
.dp-hero-text { max-width: 540px; margin-right: 4%; }
.dp-hero-brand { margin: 0 0 .5rem; font-family: var(--dp-display); font-weight: 700; font-size: 1.25rem; color: var(--dp-cyan); }
.dp-hero-brand span { color: inherit; }
.dp-hero-title { margin: 0 0 1rem; font-size: 2.44rem; line-height: 1.12; }
.dp-hero-lead { font-size: 1.1rem; line-height: 1.6; margin-bottom: 1.75rem; color: var(--dp-navy); }
.dp-hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.dp-hero-actions .btn-lg { padding: .75rem 1.75rem; }
@media (max-width: 991.98px) {
    .dp-hero { min-height: 0; }
    .dp-hero::after { background: linear-gradient(180deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .92) 55%); }
    .dp-hero-inner { justify-content: flex-start; padding-top: 2rem; padding-bottom: 2rem; }
    .dp-hero-text { margin-right: 0; }
    .dp-hero-title { font-size: 1.75rem; }
    .dp-hero-lead { font-size: 1rem; }
}

/* ---------- Startseite: Sortiment (Kategoriebild + direkte Links) ---------- */
.dp-range { padding-top: 3rem; padding-bottom: 1rem; }
.dp-range-title, .dp-shelf-title {
    margin: 0 0 1.25rem;
    font-size: 1.6rem;
    color: var(--dp-navy);
}
.dp-range-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.5rem; }
.dp-range-item { display: flex; flex-direction: column; }
.dp-range-media { display: block; text-decoration: none; }
.dp-range-media img {
    display: block;
    width: 100%;
    height: 210px;
    object-fit: contain;
    border-radius: var(--dp-radius);
    border: 1px solid var(--dp-line);
    background: #fff;
}
.dp-range-media.no-image::before {
    content: '';
    display: block;
    height: 210px;
    border-radius: var(--dp-radius);
    background: var(--dp-ice);
}
.dp-range-name {
    display: block;
    margin-top: .9rem;
    padding-bottom: .5rem;
    border-bottom: 2px solid var(--dp-navy);
    color: var(--dp-navy);
    font-family: var(--dp-display);
    font-weight: 700;
    font-size: 1.35rem;
    line-height: 1.15;
}
.dp-range-media:hover .dp-range-name { border-bottom-color: var(--dp-cyan); }
.dp-range-media:hover img { border-color: var(--dp-cyan); }
.dp-range-media:focus-visible { outline-offset: 3px; }
.dp-range-links { list-style: none; margin: .25rem 0 .4rem; padding: 0; }
.dp-range-links li { border-bottom: 1px solid var(--dp-line); }
.dp-range-links a { display: block; padding: .4rem 0; color: var(--dp-navy); text-decoration: none; font-size: .95rem; }
.dp-range-links a:hover { color: var(--dp-navy-deep); text-decoration: underline; text-decoration-color: var(--dp-cyan); text-underline-offset: 4px; }
.dp-range-all { margin-top: .35rem; font-size: .9rem; font-weight: 500; color: var(--dp-muted); text-decoration: none; }
.dp-range-all:hover { color: var(--dp-navy); }
@media (max-width: 991.98px) { .dp-range-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) {
    .dp-range { padding-top: 2rem; }
    .dp-range-grid { gap: 1rem; }
    .dp-range-name { font-size: 1.1rem; }
    .dp-range-links { display: none; }
}

/* ---------- Startseite: Produkt-Regale (DuPaDent empfiehlt, Sonderangebot) ---------- */
.product-slider-wrapper { padding-top: 2.5rem; padding-bottom: 2rem; }
.product-slider-wrapper .slick-slider-other-container { position: relative; }
/* Regal auf dieselbe Inhaltsbreite wie Ueberschrift und Sortiment */
.product-slider-wrapper > .slick-slider-other > .slick-type-product { max-width: 1250px; margin-left: auto; margin-right: auto; }
.product-slider-wrapper .hr-sect {
    display: block;
    margin: 0 0 1.25rem;
    text-align: left;
    font-size: 1.6rem;
}
.product-slider-wrapper .hr-sect::before, .product-slider-wrapper .hr-sect::after { display: none; }
.product-slider-wrapper .hr-sect a {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    color: var(--dp-navy);
    text-decoration: none;
}
.product-slider-wrapper .hr-sect a::after {
    content: 'Alle anzeigen';
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: .95rem;
    color: var(--dp-navy);
    text-decoration: underline;
    text-decoration-color: var(--dp-cyan);
    text-underline-offset: 4px;
}
/* Regal: Produkte auf einer Linie, feine Trenner */
.product-slider-wrapper .slick-list { border-top: 1px solid var(--dp-line); border-bottom: 1px solid var(--dp-line); }
/* NOVA friert die Kachelhoehe beim Start per JS ein (vor Bildern/Schriften) – Hoehe stattdessen per Flexbox */
.slick-type-product .slick-track { display: flex; align-items: stretch; }
.slick-type-product .slick-slide.product-wrapper-product { height: auto !important; float: none; }
.product-wrapper-product.slick-slide { padding: 0; border-right: 1px solid var(--dp-line); }
.product-wrapper-product.slick-slide > a { display: block; padding: 1.25rem 1rem 1.1rem; }
.product-wrapper-product a, .productbox a { text-decoration: none; }
.product-wrapper-product .item-slider { border-radius: 6px; }
/* text-clamp-2 von NOVA nicht aushebeln: Namen bleiben zweizeilig, Kacheln gleich hoch */
.item-slider-desc { margin-top: .85rem; font-size: .95rem; line-height: 1.35; min-height: 2.7em; color: var(--dp-navy); text-align: left; }
/* NOVA zentriert wenige Produkte im Regal – linksbuendig wirkt bei 2–5 Artikeln aufgeraeumter */
.slick-type-product .slick-slide.ml-auto-util { margin-left: 0 !important; border-left: 1px solid var(--dp-line); }
.slick-type-product .slick-slide.mr-auto { margin-right: 0 !important; }
.slick-type-product .slick-track { margin-left: 0 !important; margin-right: 0 !important; justify-content: flex-start; }
.item-slider-price { margin-top: .4rem; text-align: left; }
.item-slider-price .price { font-size: 1.1rem; }
.product-wrapper-product .price-note, .product-wrapper-product .old-price { color: var(--dp-muted); font-size: .8rem; text-align: left; }
.product-wrapper-product.slick-slide:hover .item-slider-desc { text-decoration: underline; text-decoration-color: var(--dp-cyan); text-underline-offset: 3px; }
/* Pfeile als runde Umriss-Buttons */
.product-slider-wrapper .slick-arrow {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: #fff;
    border: 1.5px solid var(--dp-line);
    color: var(--dp-navy);
    box-shadow: 0 4px 14px rgba(27, 48, 116, .1);
    opacity: 1;
}
.product-slider-wrapper .slick-arrow:hover { background: var(--dp-navy); border-color: var(--dp-navy); color: #fff; }
/* Produkt-Slider aus dem OnPage Composer (z. B. "DuPaDent Produkte") wie die Regale ausrichten */
#content > .opc-Container:has(.opc-ProductStream-slider) {
    max-width: 1282px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2.5rem;
    padding-bottom: 1rem;
}
#content > .opc-Container:has(.opc-ProductStream-slider) h1,
#content > .opc-Container:has(.opc-ProductStream-slider) h2,
#content > .opc-Container:has(.opc-ProductStream-slider) .h2 {
    margin: 0 0 1.25rem;
    font-size: 1.6rem;
    text-align: left;
    color: var(--dp-navy);
}
.opc-ProductStream-slider .slick-list { border-top: 1px solid var(--dp-line); border-bottom: 1px solid var(--dp-line); }
#content > .opc-Divider-empty { display: none; }

/* Sonderangebot hebt sich ab: Eis-Band, Preise in Lachs */
.product-slider-wrapper.product-slider-Sonderangebote { background: var(--dp-ice); }
.product-slider-Sonderangebote .slick-list { background: #fff; border: 1px solid var(--dp-line); border-radius: var(--dp-radius); }
.product-slider-Sonderangebote .item-slider-price .price { color: #c9583d; }
.link-content h1:empty { display: none; }
.index-news-wrapper a { text-decoration: none; }

/* ---------- Kategorieseite: Kopf ---------- */
.dp-cat-head {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
    align-items: start;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--dp-line);
}
.dp-cat-head.has-image { grid-template-columns: minmax(0, 1fr) 300px; }
.dp-cat-title { font-size: 2rem; line-height: 1.15; margin: 0 0 .75rem; }
.dp-cat-desc { position: relative; max-width: 72ch; max-height: 4.8em; overflow: hidden; line-height: 1.6; color: var(--dp-navy); }
.dp-cat-desc p:last-child { margin-bottom: 0; }
.dp-cat-desc:not(.is-open)::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 1.6em;
    background: linear-gradient(rgba(255, 255, 255, 0), #fff);
}
.dp-cat-desc.is-open { max-height: none; }
.dp-cat-more {
    margin-top: .5rem;
    padding: 0;
    background: none;
    border: 0;
    color: var(--dp-navy);
    font-weight: 500;
    text-decoration: underline;
    text-decoration-color: var(--dp-cyan);
    text-underline-offset: 4px;
    cursor: pointer;
}
.dp-cat-head-image img { width: 100%; height: 190px; object-fit: cover; border-radius: var(--dp-radius); }
@media (max-width: 767.98px) {
    .dp-cat-head.has-image { grid-template-columns: 1fr; }
    .dp-cat-head-image { order: -1; }
    .dp-cat-head-image img { height: 140px; }
    .dp-cat-title { font-size: 1.6rem; }
}

/* ---------- Kategorieseite: Unterkategorien ---------- */
.dp-subcats { margin: 0 0 1.75rem; }
.dp-subcats-list { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.dp-subcat {
    display: inline-block;
    padding: .45rem 1rem;
    border: 1.5px solid var(--dp-line);
    border-radius: var(--dp-radius-pill);
    font-size: .92rem;
    font-weight: 500;
    color: var(--dp-navy);
    text-decoration: none;
    background: #fff;
}
.dp-subcat:hover { border-color: var(--dp-navy); background: var(--dp-navy); color: #fff; text-decoration: none; }
@media (max-width: 767.98px) {
    .dp-subcats { margin-left: -16px; margin-right: -16px; }
    .dp-subcats-list {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding: 0 16px 4px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }
    .dp-subcats-list::-webkit-scrollbar { display: none; }
    .dp-subcats-list li { flex: 0 0 auto; scroll-snap-align: start; }
    .dp-cat-head { padding-bottom: 1rem; margin-bottom: 1rem; }
}

/* ---------- Kategorieseite: Produktraster wie ein Katalog ---------- */
#product-list.layout-gallery { margin-left: 0; margin-right: 0; border-top: 1px solid var(--dp-line); border-left: 1px solid var(--dp-line); }
#product-list.layout-gallery > .product-wrapper {
    padding: 1rem;
    margin-bottom: 0;
    border-right: 1px solid var(--dp-line);
    border-bottom: 1px solid var(--dp-line);
    background: #fff;
}
#product-list.layout-gallery > .product-wrapper:hover { background: #fbfdff; }
#product-list .productbox, #product-list .productbox-inner { box-shadow: none; border: 0; background: transparent; }
#product-list .productbox-hover:hover .productbox-inner { box-shadow: none; }
.productbox-title a { color: var(--dp-navy); font-weight: 500; }
.productbox:hover .productbox-title a { text-decoration: underline; text-decoration-color: var(--dp-cyan); text-underline-offset: 3px; }
.productbox-price, .price { color: var(--dp-navy); font-weight: 700; }
.price-note { color: var(--dp-muted); }
.ribbon, .badge-primary { background-color: var(--dp-navy); color: #fff; }
.ribbon-2, .ribbon-sale, .badge-danger, .ribbon-1 { background-color: var(--dp-salmon); color: #fff; }

/* Sortierung / Ansicht / Seitennavigation */
.productlist-page-nav .btn, .productlist-page-nav .dropdown-toggle { border-color: var(--dp-line); color: var(--dp-navy); }
.page-link { color: var(--dp-navy); }
.page-item.active .page-link, .pagination .active > .page-link { background-color: var(--dp-navy); border-color: var(--dp-navy); color: #fff; }

/* ---------- Seitenleiste: NOVA-Gelb ersetzen ---------- */
.box-categories .nav-item.active > .nav-link,
.box-categories .nav-item.active > .nav-link > a { color: var(--dp-navy); font-weight: 700; }
.box-categories .nav-panel > .nav > .nav-item.active > .nav-link { border-bottom-color: var(--dp-cyan) !important; }
.box-categories .snippets-categories-collapse { background: var(--dp-ice); }
.box-categories .nav-link { color: var(--dp-navy); }
.box-categories .nav-link:hover { color: var(--dp-navy-deep); }
.box .productlist-filter-headline, .box-title, .sidepanel-left .h5 { font-family: var(--dp-display); font-weight: 700; color: var(--dp-navy); }
.noUi-connect { background: var(--dp-navy); }
.noUi-handle { border-color: var(--dp-navy); background: #fff; }
.noUi-target { background: var(--dp-line); }

/* ---------- Footer: dunkles Navy, Telefonnummer als Anker ---------- */
#footer {
    --f-text: #d6def0;
    --f-line: rgba(255, 255, 255, .14);
    background: var(--dp-navy-deep);
    color: var(--f-text);
    padding-top: 0;
    margin-top: 3rem;
    font-size: .95rem;
}
#footer a:not(.btn) { color: var(--f-text); text-decoration: none; }
#footer a:not(.btn):hover, #footer a:not(.btn):focus-visible {
    color: #fff;
    text-decoration: underline;
    text-decoration-color: var(--dp-cyan);
    text-underline-offset: 4px;
}

/* Kontakt-Band */
.dp-foot-contact {
    display: grid;
    grid-template-columns: 1.1fr 1.3fr 1fr;
    gap: 2rem 3rem;
    align-items: start;
    padding: 3rem 0 2.5rem;
    border-bottom: 1px solid var(--f-line);
}
.dp-foot-logo img { width: 210px; height: auto; display: block; }
.dp-foot-claim { margin: .75rem 0 0; color: var(--f-text); }
/* Hilfe: Kontaktformular als Hauptweg, Telefon bewusst klein */
.dp-foot-help-title { margin: 0 0 .3rem; color: #fff; font-family: var(--dp-display); font-weight: 700; font-size: 1.25rem; }
.dp-foot-help-text { margin: 0 0 1rem; }
#footer .btn.dp-foot-cta {
    padding: .6rem 1.4rem;
    background: var(--dp-cyan);
    border: 0;
    color: var(--dp-navy-deep);
}
#footer .btn.dp-foot-cta:hover { background: #fff; color: var(--dp-navy-deep); }
.dp-foot-direct { margin: 1rem 0 0; font-size: .85rem; line-height: 1.6; color: #aab6d6; }
#footer .dp-foot-direct a:not(.btn) { color: #aab6d6; }
.dp-foot-address { margin: 0; font-style: normal; line-height: 1.7; }

/* Spalten aus den Admin-Boxen + Service */
.dp-foot-cols {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 2rem 3rem;
    padding: 2.25rem 0 1.5rem;
}
#footer .dp-foot-col .box { margin: 0; border: 0; background: transparent; }
#footer .dp-foot-col .box-normal-hr, #footer .dp-foot-col hr { display: none; }
#footer .dp-foot-heading,
#footer .dp-foot-col .productlist-filter-headline,
#footer .dp-foot-col .box-title,
#footer .dp-foot-col .h5,
#footer .dp-foot-col .h2 {
    margin: 0 0 .9rem;
    padding: 0;
    border: 0;
    color: #fff;
    font-family: var(--dp-display);
    font-weight: 700;
    font-size: 1.05rem;
}
#footer .dp-foot-col a.nav-link:not(.btn) { padding: .22rem 0; color: var(--f-text); }
#footer .dp-foot-col a.nav-link:not(.btn):hover { color: #fff; }
.dp-foot-links { list-style: none; margin: 0 0 1.25rem; padding: 0; }
.dp-foot-links li { padding: .22rem 0; }

/* Zahlungs- und Versandlogos aus der Admin-Box als kleine Kaertchen */
#footer .box-custom .box-content-wrapper { display: flex; flex-wrap: wrap; gap: .5rem; }
#footer .box-custom .box-content-wrapper > *:not(img):not(div) { flex-basis: 100%; }
#footer .box-custom .box-content-wrapper > br,
#footer .box-custom .box-content-wrapper > p:empty,
#footer .box-custom .box-content-wrapper > div:empty { display: none; }
#footer .box-custom .box-content-wrapper > div { display: contents; }
#footer .box-custom img {
    width: 62px;
    height: 40px;
    object-fit: contain;
    margin: 0;
    padding: 4px 6px;
    border-radius: 6px;
    background: #fff;
    box-shadow: none;
}

/* Widerrufsbutton (gesetzlich vorgeschrieben): klar erkennbar, aber zurueckhaltend */
#footer .dp-foot-withdrawal .withdrawal-link,
#footer .withdrawal-link {
    display: inline-block;
    white-space: nowrap;
    width: auto;
    padding: .55rem 1.25rem;
    background: transparent;
    border: 1.5px solid rgba(255, 255, 255, .55);
    color: #fff;
    font-size: .9rem;
}
#footer .withdrawal-link:hover { background: #fff; border-color: #fff; color: var(--dp-navy-deep); text-decoration: none; }

/* Social Media (nur wenn in den Template-Einstellungen gepflegt) */
#footer .footer-social-media { margin: 0; }
#footer .footer-social-media ul { display: flex; gap: .5rem; margin: 0 0 1.5rem; }
#footer .footer-social-media .btn { background: rgba(255, 255, 255, .1); border: 0; color: #fff; border-radius: 50%; }
#footer .footer-social-media .btn:hover { background: var(--dp-cyan); color: var(--dp-navy-deep); }

/* Preishinweis + Copyright */
#footer .footnote-vat { padding: 1rem 0 1.5rem; border-top: 1px solid var(--f-line); color: var(--f-text); }
#footer .footnote-vat a:not(.btn) { text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .4); }
#copyright { background: #152660; color: #aab6d6; font-size: .85rem; padding: .9rem 0; }
#footer #copyright a:not(.btn) { color: #fff; }

@media (max-width: 991.98px) {
    .dp-foot-contact { grid-template-columns: 1fr 1fr; }
    .dp-foot-brand { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
    .dp-foot-contact { grid-template-columns: 1fr; padding-top: 2.25rem; }
    .dp-foot-cols { grid-template-columns: 1fr; gap: 1.75rem; }
}

/* Nach-oben-Button */
.smoothscroll-top {
    background: var(--dp-navy);
    color: #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 2px #fff, 0 4px 14px rgba(27, 48, 116, .3);
}
.smoothscroll-top:hover { background: var(--dp-cyan); color: var(--dp-navy-deep); }

/* ---------- Formensprache: Pille = Aktion, 8px = Flaeche/Eingabe ---------- */
.form-control, .custom-select, .input-group > .form-control { border-radius: var(--dp-radius); border-color: var(--dp-line); }
.input-group > .form-control:not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .form-control:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.alert { border-radius: var(--dp-radius); }
.alert-info { background: var(--dp-ice); border-color: var(--dp-line); color: var(--dp-navy); }

/* Status-Badges leise, nur Rabatte duerfen auffallen */
.ribbon {
    text-transform: none;
    letter-spacing: 0;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    font-size: .78rem;
    padding: .2rem .6rem;
    border-radius: 999px;
    box-shadow: none;
}
.ribbon::before, .ribbon::after { display: none; }
.ribbon-8, .ribbon-9, .ribbon-1 { background: var(--dp-ice); color: var(--dp-navy); }
.ribbon-2, .ribbon-3 { background: var(--dp-salmon); color: #fff; }
.productbox-ribbon { top: .5rem; left: .5rem; }

/* Menueleiste ohne Leerraum unter den Punkten (NOVA versteckt damit die Scrollleiste) */
@media (min-width: 992px) {
    #mainNavigation .nav-scrollbar-inner { padding-bottom: 0; margin-bottom: 0; scrollbar-width: none; }
    #mainNavigation .nav-scrollbar-inner::-webkit-scrollbar { display: none; }
}

/* ---------- Artikelseite ---------- */
#product-offer { margin-top: .5rem; }
#product-offer .product-gallery #gallery,
#product-offer .product-gallery .slick-list { border-radius: var(--dp-radius); }
#product-offer .product-gallery img { border-radius: var(--dp-radius); }

/* Merkzettel/Vergleich: kleine Umriss-Icons auf der Bildecke statt Cyan-Kreise */
#image_wrapper { position: relative; }
#product-offer .product-actions {
    position: absolute;
    top: .75rem;
    right: 1.5rem;
    z-index: 5;
    display: flex;
    gap: .4rem;
    margin: 0;
}
#product-offer .product-actions .btn.badge-circle-1 {
    width: 40px;
    height: 40px;
    background: #fff;
    border: 1.5px solid var(--dp-line);
    color: var(--dp-navy);
    box-shadow: none;
}
#product-offer .product-actions .btn.badge-circle-1:hover,
#product-offer .product-actions .btn.badge-circle-1.on-list { border-color: var(--dp-navy); background: var(--dp-navy); color: #fff; }

#product-offer .product-title { font-size: 2rem; line-height: 1.15; margin-bottom: 1rem; }

/* Artikelnummer, GTIN, HAN als ruhige Tabelle */
#product-offer ul.info-essential.list-unstyled {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: .2rem 1rem;
    padding: .75rem 1rem;
    margin-bottom: 1.25rem;
    background: var(--dp-ice);
    border-radius: var(--dp-radius);
    font-size: .9rem;
}
#product-offer .info-essential li { display: contents; }
#product-offer .info-essential strong { font-weight: 500; color: var(--dp-muted); }
#product-offer .info-essential span { color: var(--dp-navy); font-variant-numeric: tabular-nums; }

#product-offer .price_wrapper .price { font-size: 2.2rem; }
#product-offer .price-note, #product-offer .vat_info { color: var(--dp-muted); font-size: .88rem; }
#product-offer .delivery-status .status-2, #product-offer .delivery-status .text-success { color: #1d7f4e !important; }

/* Menge + Warenkorb: beide Pillen, gleiche Hoehe */
#product-offer .form-counter {
    height: 50px;
    border: 1.5px solid var(--dp-line);
    border-radius: var(--dp-radius-pill);
    overflow: hidden;
    background: #fff;
}
#product-offer .form-counter .form-control { border: 0; height: 100%; font-weight: 500; font-size: 1.05rem; }
#product-offer .form-counter .btn { border: 0; height: 100%; color: var(--dp-navy); background: transparent; border-radius: 0; }
#product-offer .form-counter .btn:hover { background: var(--dp-ice); }
#product-offer #add-to-cart .btn-primary, #product-offer .js-cfg-validate { height: 50px; font-size: 1.05rem; }
/* Button-Text auch auf dem Handy zeigen – wichtigste Aktion der Seite */
#add-to-cart .btn-basket-check > span { display: inline !important; margin-right: .4rem; }

/* Beschreibung + Technische Daten */
.tab-navigation .nav-tabs .nav-link { font-family: var(--dp-display); font-weight: 700; }
#tab-description .desc { max-width: 78ch; line-height: 1.65; }
.dp-specs {
    width: 100%;
    max-width: 640px;
    margin: 1.25rem 0 .5rem;
    border-collapse: collapse;
    font-size: .95rem;
}
.dp-specs caption {
    caption-side: top;
    padding: 0 0 .6rem;
    color: var(--dp-navy);
    font-family: var(--dp-display);
    font-weight: 700;
    font-size: 1.15rem;
    text-align: left;
}
.dp-specs th, .dp-specs td { padding: .55rem .75rem; border-bottom: 1px solid var(--dp-line); vertical-align: top; }
.dp-specs th { width: 45%; font-weight: 500; color: var(--dp-muted); }
.dp-specs td { color: var(--dp-navy); font-variant-numeric: tabular-nums; }
.dp-specs tr:nth-child(odd) { background: var(--dp-ice); }

/* Artikelmerkmale von NOVA (Gewicht, Inhalt …) im selben Stil */
#tab-description .product-attributes { max-width: 640px; margin-top: 1.5rem; }
#tab-description .product-attributes table { width: 100%; border: 0; font-size: .95rem; }
#tab-description .product-attributes th,
#tab-description .product-attributes td { padding: .55rem .75rem; border: 0; border-bottom: 1px solid var(--dp-line); background: transparent; }
#tab-description .product-attributes tr:nth-child(odd) { background: var(--dp-ice); }
#tab-description .product-attributes td:first-child,
#tab-description .product-attributes th { width: 45%; font-weight: 500; color: var(--dp-muted); }

/* ---------- Bestaetigung "in den Warenkorb gelegt": kompakte Leiste statt Riesenkarte ---------- */
#pushed-success.card {
    margin: 0 0 1.75rem;
    padding: 0;
    border: 1px solid var(--dp-line);
    border-left: 4px solid #1d7f4e;
    border-radius: var(--dp-radius);
    box-shadow: 0 6px 20px rgba(27, 48, 116, .08);
    background: #fff;
}
#pushed-success .card-header.alert-success {
    margin: 0;
    padding: .8rem 1.25rem .2rem;
    border: 0;
    background: transparent;
    color: #1d7f4e;
    font-weight: 500;
    text-align: left;
}
#pushed-success .card-header.alert-success::before { content: '\2713'; margin-right: .5rem; font-weight: 700; }
#pushed-success .card-body { padding: .5rem 1.25rem 1rem; }
#pushed-success .card-body > .row > .col {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem 2rem;
    max-width: none;
    flex: 1 1 100%;
}
#pushed-success .productbox-inner > .row {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    grid-template-areas: "img title" "img details";
    column-gap: 1rem;
    align-items: center;
    margin: 0;
}
#pushed-success .productbox-inner > .row > .col { max-width: none; flex: none; padding: 0; }
#pushed-success .productbox-inner > .row > .col:first-child { grid-area: title; }
#pushed-success .pushed-success-image-wrapper { grid-area: img; }
#pushed-success .productbox-inner > .row > .col:last-child { grid-area: details; }
#pushed-success .pushed-success-image-wrapper img {
    width: 72px;
    height: 72px;
    object-fit: contain;
    border: 1px solid var(--dp-line);
    border-radius: 6px;
    background: #fff;
}
#pushed-success .productbox-title { margin: 0; font-family: var(--dp-display); font-weight: 700; font-size: 1.05rem; color: var(--dp-navy); }
#pushed-success dl.form-row { display: flex; flex-wrap: wrap; gap: 0 .35rem; margin: .15rem 0 0; font-size: .85rem; color: var(--dp-muted); }
#pushed-success dl.form-row dt, #pushed-success dl.form-row dd { flex: none; max-width: none; width: auto; padding: 0; margin: 0; font-weight: 400; }
#pushed-success dl.form-row dd { margin-right: .9rem; color: var(--dp-navy); }
#pushed-success .pushed-success-buttons { display: flex; flex-wrap: nowrap; gap: .6rem; margin: 0; }
#pushed-success .pushed-success-buttons > .col { flex: none; width: auto; max-width: none; padding: 0; }
#pushed-success .pushed-success-buttons .btn { width: auto; padding: .55rem 1.3rem; white-space: nowrap; }
#pushed-success .pushed-success-buttons .fa-arrow-circle-left { display: none; }
@media (max-width: 767.98px) {
    #pushed-success .card-body > .row > .col { grid-template-columns: 1fr; }
    #pushed-success .pushed-success-buttons > .col { flex: 1 1 0; }
    #pushed-success .pushed-success-buttons .btn { width: 100%; padding-left: .5rem; padding-right: .5rem; }
}

/* ---------- Hinweise: Warnung warm und lesbar, Info ruhig ---------- */
.alert-warning {
    background: #fff6e8;
    border: 1px solid #f3d9ae;
    border-left: 4px solid #e39a2c;
    color: #6b4210;
}
.alert-warning a, .alert-warning .alert-link { color: #6b4210; text-decoration: underline; }
.alert-warning .fa-exclamation-triangle, .alert-warning .fas { color: #e39a2c; }
.alert-success { background: #eef8f2; border-color: #cfe8d9; color: #17633d; }
.alert-danger { border-left: 4px solid #b90000; }

/* ---------- Warenkorb ---------- */
.basket-items .cart-items-header { color: var(--dp-muted); font-size: .85rem; font-weight: 500; }
.basket-items .cart-items-body { padding: 1.1rem 0; border-bottom: 1px solid var(--dp-line); }
.basket-items .cart-items-body hr { display: none; }
.basket-items .cart-items-image img { border: 1px solid var(--dp-line); border-radius: 6px; background: #fff; }
.basket-items a.cart-items-name { font-family: var(--dp-display); font-weight: 700; font-size: 1.05rem; color: var(--dp-navy); text-decoration: none; }
.basket-items a.cart-items-name:hover { text-decoration: underline; text-decoration-color: var(--dp-cyan); text-underline-offset: 4px; }
.basket-items .cart-items-price .price_overall { font-family: var(--dp-display); font-weight: 700; font-size: 1.1rem; color: var(--dp-navy); }
.basket-items .list-unstyled { font-size: .85rem; color: var(--dp-muted); }
.basket-items .list-unstyled strong { font-weight: 500; }
.basket-items .btn-link, .basket-items .cart-items-delete, .basket-items .wishlist-button { font-size: .85rem; color: var(--dp-muted); text-decoration: none; }
.basket-items .btn-link:hover { color: var(--dp-navy); }

/* Mengenauswahl ueberall als Pille (Warenkorb, Listen) */
.form-counter.choose_quantity {
    border: 1.5px solid var(--dp-line);
    border-radius: var(--dp-radius-pill);
    overflow: hidden;
    background: #fff;
    flex-wrap: nowrap;
}
.form-counter.choose_quantity .form-control { border: 0; box-shadow: none; text-align: center; font-weight: 500; }
.form-counter.choose_quantity .btn { border: 0; border-radius: 0; background: transparent; color: var(--dp-navy); }
.form-counter.choose_quantity .btn:hover { background: var(--dp-ice); }

/* ---------- Doofinder-Suchfenster im DuPaDent-Stil ----------
   Doofinder laedt sein CSS dynamisch nach diesem; daher !important, aber nur innerhalb von .dfd-root */
body .dfd-root.dfd-classic {
    font-family: 'Roboto', -apple-system, 'Segoe UI', Arial, sans-serif !important;
    color: var(--dp-navy) !important;
    border: 0 !important;
    border-top: 3px solid var(--dp-cyan) !important;
    border-radius: 0 0 12px 12px !important;
    box-shadow: 0 24px 60px rgba(27, 48, 116, .22) !important;
    overflow: hidden;
}
body .dfd-root .dfd-layer { background: #fff !important; }
body .dfd-root .dfd-title-lg {
    font-family: var(--dp-display) !important;
    font-weight: 700 !important;
    font-size: 1.15rem !important;
    color: var(--dp-navy) !important;
}
/* Linke Spalte: beliebte Suchen, Kategorien, Marken */
body .dfd-root .dfd-bc-aside { border-right: 1px solid var(--dp-line); }
body .dfd-root .dfd-bc-aside a,
body .dfd-root .dfd-bc-aside [class*="term"],
body .dfd-root .dfd-bc-aside li { color: var(--dp-navy) !important; font-size: .95rem !important; }
body .dfd-root .dfd-bc-aside a:hover,
body .dfd-root .dfd-bc-aside [class*="term"]:hover { text-decoration: underline; text-decoration-color: var(--dp-cyan); text-underline-offset: 4px; }
/* Produktkarten wie im Shop-Raster */
body .dfd-root .dfd-card {
    border: 1px solid var(--dp-line) !important;
    border-radius: var(--dp-radius) !important;
    box-shadow: none !important;
    background: #fff !important;
    transition: border-color .15s;
}
body .dfd-root .dfd-card:hover { border-color: var(--dp-navy) !important; }
body .dfd-root .dfd-card-thumbnail { background: #fff !important; }
body .dfd-root .dfd-card-thumbnail-404 { background: var(--dp-ice) !important; border-radius: 6px; }
body .dfd-root .dfd-card-title {
    color: var(--dp-navy) !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: .92rem !important;
    line-height: 1.35 !important;
}
body .dfd-root .dfd-card:hover .dfd-card-title { text-decoration: underline; text-decoration-color: var(--dp-cyan); text-underline-offset: 3px; }
body .dfd-root .dfd-card-price {
    color: var(--dp-navy) !important;
    font-family: var(--dp-display) !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    font-variant-numeric: tabular-nums;
}
body .dfd-root .dfd-card-price--sale, body .dfd-root .dfd-card-price.dfd-card-price--sale { color: #c9583d !important; }
/* Pfeile, "Alle anzeigen", Schliessen */
body .dfd-root .dfd-view-all-link-button {
    padding: .35rem 1rem !important;
    border: 1.5px solid var(--dp-navy) !important;
    border-radius: var(--dp-radius-pill) !important;
    background: #fff !important;
    color: var(--dp-navy) !important;
    font-family: var(--dp-display) !important;
    font-weight: 700 !important;
}
body .dfd-root .dfd-view-all-link-button:hover { background: var(--dp-navy) !important; color: #fff !important; }
body .dfd-root .dfd-close-button { opacity: .6; }
body .dfd-root .dfd-close-button:hover { opacity: 1; }
body .dfd-root .dfd-branding { opacity: .45; }

/* ---------- Doofinder "Alle anzeigen": Ergebnisliste ersetzt den Seiteninhalt ---------- */
body.dp-dfd-embedded #main-wrapper > :not(#content-wrapper),
body.dp-dfd-embedded #content-wrapper > :not(.dfd-root):not(#doofinder_result) { display: none !important; }
body.dp-dfd-embedded #content-wrapper { padding-top: 1.5rem; }
body .dfd-root.dfd-embedded {
    max-width: 1250px;
    margin: 0 auto 3rem;
    border-top: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
body .dfd-root.dfd-embedded .dfd-results-grid { gap: 0 !important; border-top: 1px solid var(--dp-line); border-left: 1px solid var(--dp-line); }
body .dfd-root.dfd-embedded .dfd-card {
    border: 0 !important;
    border-right: 1px solid var(--dp-line) !important;
    border-bottom: 1px solid var(--dp-line) !important;
    border-radius: 0 !important;
}
body .dfd-root.dfd-embedded .dfd-card:hover { background: #fbfdff !important; }
body .dfd-root.dfd-embedded .dfd-aside, body .dfd-root.dfd-embedded [class*="dfd-facets"] { color: var(--dp-navy); }
body .dfd-root.dfd-embedded .dfd-btn,
body .dfd-root.dfd-embedded button[class*="load-more"],
body .dfd-root.dfd-embedded [class*="load-more"] button {
    padding: .6rem 1.75rem !important;
    border: 0 !important;
    border-radius: var(--dp-radius-pill) !important;
    background: var(--dp-navy) !important;
    color: #fff !important;
    font-family: var(--dp-display) !important;
    font-weight: 700 !important;
}
body .dfd-root.dfd-embedded .dfd-btn:hover { background: var(--dp-navy-deep) !important; }

/* ---------- Sonstiges ---------- */
main#main-wrapper > #content-wrapper { padding-top: 1.25rem; }
.breadcrumb-wrapper { margin-bottom: 1.5rem; }
.breadcrumb { font-size: .85rem; }
.breadcrumb-item a { color: var(--dp-muted); }
.breadcrumb-item.active, .breadcrumb-item:last-child { color: var(--dp-navy); }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link { color: var(--dp-navy); border-bottom-color: var(--dp-cyan); }