/* Redesign (Figma PAX V1.2): header, categoriepagina */

/* Actiebalk en linkjesbalk boven de header: HTML staat in admin (HTML-widgets), opmaak hier */
.pax-actiebalk {
    padding: 10px 16px;
    background: #e67429;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
    color: #fff;
}

.pax-actiebalk a {
    color: #fff;
}

.pax-actiebalk a:hover {
    text-decoration: underline;
}

/* Black Friday-variant (admin-HTML met class pax-bf): label, staffelblokjes, dagenteller (script in _Root.cshtml), witte knop */
.pax-actiebalk.pax-bf {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 16px;
    background: #000;
    font-weight: bold;
}

.pax-bf > * + * {
    margin-left: 28px;
}

.pax-bf .pax-bf-label {
    padding: 2px 10px;
    background: #fff;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .5px;
    line-height: 22px;
    color: #000;
    white-space: nowrap;
    transform: rotate(-6deg);
}

.pax-bf .pax-bf-staffel {
    display: flex;
    align-items: flex-end;
}

.pax-bf .pax-bf-staffel:hover {
    text-decoration: none;
}

.pax-bf .pax-bf-staffel span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 5px;
    padding: 2px 8px;
    background: #ffa400;
    font-weight: 800;
    line-height: 1;
}

.pax-bf .pax-bf-staffel span:first-child {
    margin-left: 0;
    height: 26px;
    font-size: 13px;
}

.pax-bf .pax-bf-staffel span:nth-child(2) {
    height: 30px;
    font-size: 14px;
}

.pax-bf .pax-bf-staffel span:nth-child(3) {
    height: 34px;
    font-size: 16px;
}

.pax-bf .pax-bf-staffel span:nth-child(4) {
    height: 38px;
    font-size: 18px;
}

.pax-bf .pax-bf-staffel small {
    font-size: 8px;
    letter-spacing: .5px;
}

.pax-bf .pax-bf-dagen {
    font-size: 15px;
    color: #ffa400;
    white-space: nowrap;
}

.pax-bf .pax-bf-knop {
    padding: 6px 18px;
    border-radius: 20px;
    background: #fff;
    font-size: 14px;
    color: #000;
    white-space: nowrap;
}

.pax-bf .pax-bf-knop:hover {
    background: #ffa400;
    text-decoration: none;
    color: #000;
}

/* mobiel: knop weg (staffel is zelf een link), alles kleiner op één regel */
@media (max-width: 768px) {
    .pax-actiebalk.pax-bf {
        padding: 10px 8px;
    }

    .pax-bf > * + * {
        margin-left: 12px;
    }

    .pax-bf .pax-bf-label {
        padding: 1px 6px;
        font-size: 13px;
    }

    .pax-bf .pax-bf-staffel span:nth-child(n) {
        margin-left: 3px;
        padding: 2px 4px;
        height: auto;
        font-size: 12px;
    }

    .pax-bf .pax-bf-staffel span:first-child {
        margin-left: 0;
    }

    .pax-bf .pax-bf-staffel small,
    .pax-bf .pax-bf-knop,
    .pax-bf .pax-bf-nu {
        display: none;
    }

    .pax-bf .pax-bf-dagen {
        font-size: 13px;
    }
}

.pax-topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
    padding: 11px 15px;
    max-width: 1280px;
    font-size: 14px;
    line-height: 20px;
    color: #007ba4;
    white-space: nowrap;
}

.pax-topbar-links,
.pax-topbar-rechts {
    display: flex;
    align-items: center;
}

.pax-topbar-links > * {
    margin-right: 33px;
}

.pax-topbar-rechts > * {
    margin-left: 50px;
}

.pax-topbar a {
    color: inherit;
}

.pax-topbar a:hover {
    text-decoration: underline;
}

.pax-topbar .fa {
    margin-right: 8px;
}

.pax-topbar .pax-score .fa {
    margin-right: 3px;
    color: #e67429;
}

.pax-topbar .pax-score strong {
    margin: 0 12px 0 9px;
    color: #333;
}

.pax-topbar .pax-grijs {
    color: #9ea4a6;
}

.pax-topbar .pax-oranje {
    color: #e67429;
}

@media (max-width: 1024px) {
    .pax-topbar {
        justify-content: center;
        padding: 8px 10px;
        font-size: 13px;
    }

    /* mobiel: alleen hulp en telefoon */
    .pax-topbar-rechts,
    .pax-topbar-links > :nth-child(n+3) {
        display: none;
    }

    .pax-topbar-links > :nth-child(2) {
        margin-right: 0;
    }

    .pax-actiebalk {
        padding: 8px 10px;
        font-size: 13px;
        line-height: 18px;
    }
}

/* Iconen (Figma) i.p.v. de prisma-font, alle schermbreedtes */
.responsive-nav-wrapper .personal-button > span::after,
.responsive-nav-wrapper .wishlist-button a::after,
.responsive-nav-wrapper .shopping-cart-link > a::after,
.responsive-nav-wrapper .samplebasket a::after,
.responsive-nav-wrapper .search-wrap > span::after {
    content: "";
    width: 22px;
    height: 22px;
    background: no-repeat center center;
}

.responsive-nav-wrapper .personal-button > span::after {
    background-image: url("images/icon-account.svg");
}

.responsive-nav-wrapper .wishlist-button a::after {
    background-image: url("images/icon-offerte.svg");
}

.responsive-nav-wrapper .shopping-cart-link > a::after {
    background-image: url("images/icon-winkelmand.svg");
}

.responsive-nav-wrapper .samplebasket a::after {
    background-image: url("images/icon-kleurstalen.svg");
}

.responsive-nav-wrapper .search-wrap > span::after {
    background-image: url("images/icon-zoeken.svg");
}

.responsive-nav-wrapper .samplebasket .image {
    display: none;
}

.header-icon-label {
    display: none;
}

/* Mobiel/tablet: menu links, logo, iconen rechts; zoekbalk klapt open onder de rij via de loep */
@media (max-width: 1024px) {
    /* admin-CSS zet 30px */
    .master-wrapper-page .master-header-wrapper {
        margin-bottom: 0;
    }

    /* tussenlagen weg, zodat logo, menu, iconen en zoekbalk één flex-rij vormen */
    .master-header-wrapper .header,
    .master-header-wrapper .responsive-nav-wrapper-parent,
    .master-header-wrapper .responsive-nav-wrapper {
        display: contents;
    }

    .master-header-wrapper .header-wrapper {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 8px 10px;
    }

    .master-header-wrapper .header-wrapper::after,
    .master-header-wrapper .keurmerk {
        display: none;
    }

    /* hamburger met "MENU" eronder (niet de .menu-title in de drawer) */
    .master-header-wrapper .responsive-nav-wrapper .menu-title {
        order: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        cursor: pointer;
    }

    .master-header-wrapper .responsive-nav-wrapper .menu-title > span {
        width: 100%;
        height: 28px;
    }

    .master-header-wrapper .responsive-nav-wrapper .menu-title .menu-text {
        font-size: 10px;
        font-weight: bold;
        line-height: 12px;
        color: #fff;
    }

    /* zoek-icoon is grijs (desktop-zoekbalk): op de blauwe balk wit */
    .master-header-wrapper .search-wrap > span::after {
        filter: brightness(0) invert(1);
    }

    /* iconen iets smaller, zodat het grotere logo past */
    .master-header-wrapper .responsive-nav-wrapper > div:not(.menu-title) {
        width: 36px;
    }

    .master-header-wrapper .header-logo {
        order: 2;
        flex: 1;
        text-align: center;
    }

    .master-header-wrapper .header-logo img {
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 72px;
        vertical-align: middle;
    }

    .master-header-wrapper .responsive-nav-wrapper .search-wrap {
        display: inline-block;
        order: 3;
    }

    .master-header-wrapper .personal-button {
        order: 4;
    }

    .master-header-wrapper .responsive-nav-wrapper .wishlist-button {
        display: inline-block;
        order: 5;
    }

    .master-header-wrapper .shopping-cart-link {
        order: 6;
    }

    .master-header-wrapper .samplebasket {
        order: 7;
        float: none;
    }

    .master-header-wrapper .responsive-nav-wrapper .menu-title > span::after {
        content: "";
        width: 22px;
        height: 22px;
        background: url("images/icon-menu.svg") no-repeat center center;
    }

    /* zoekbalk: verborgen tot de loep is aangeklikt (pax-zoek-open, script in _Root.cshtml), dan witte pil over de volle breedte */
    .master-header-wrapper .store-search-box {
        display: none;
    }

    .master-header-wrapper.pax-zoek-open .store-search-box {
        display: block;
        position: static;
        order: 8;
        flex-basis: 100%;
        margin-top: 8px;
        border-radius: 22px;
        background: #fff;
        box-shadow: none;
        text-align: left;
    }

    .master-header-wrapper .store-search-box span.search-box-text {
        width: 100%;
    }

    .master-header-wrapper .search-box.store-search-box input.search-box-text {
        width: 100%;
        height: 44px;
        padding: 0 16px 0 48px;
        border-radius: 22px;
        background: transparent;
        font-size: 16px;
        color: #444;
    }

    .master-header-wrapper .search-box.store-search-box input.search-box-text::placeholder {
        color: #9ea4a6;
    }

    .master-header-wrapper .store-search-box input.search-box-button {
        position: absolute;
        top: 0;
        left: 14px;
        width: 22px;
        height: 44px;
        background: url("images/icon-zoeken.svg") no-repeat center center;
    }
}

@media (min-width: 1025px) {
    /* redesign-logo's (PAX, rolgordijnenexpert, jaloezieenexpert) vast op 132px, ook als winkel-CSS een andere breedte zet (rolgordijnenexpert: 320px) */
    .master-header-wrapper .header-logo img.pax-logo {
        width: 132px;
        height: auto;
    }

    /* Logo, zoekbalk, keurmerken en iconen naast elkaar */
    .master-header-wrapper .header-wrapper {
        display: flex;
        align-items: center;
    }

    .master-header-wrapper .header-wrapper::after {
        display: none;
    }

    .master-header-wrapper .header {
        flex: 1;
        width: auto;
    }

    .master-header-wrapper .keurmerk {
        padding-top: 0;
    }

    .master-header-wrapper .responsive-nav-wrapper-parent {
        margin: 0 0 0 20px;
    }

    /* Zoekbalk: wit, rond, vergrootglas links */
    .master-header-wrapper .header .search-box {
        margin: 10px auto;
        border: 0;
        border-radius: 28px;
        width: calc(100% - 170px);
        max-width: 560px;
        height: 55px;
        background: #fff;
    }

    /* invoerveld over de hele breedte, zodat de suggesties onder de balk uitlijnen */
    .master-header-wrapper .store-search-box span.search-box-text {
        width: 100%;
    }

    .master-header-wrapper .search-box .search-box-button {
        position: absolute;
        top: 0;
        left: 18px;
        width: 26px;
        height: 55px;
        background: url("images/icon-zoeken.svg") no-repeat center center;
    }

    .master-header-wrapper .search-box input.search-box-text {
        height: 55px;
        padding: 0 25px 0 70px;
        border-radius: 28px;
        background: transparent;
        font-size: 15px;
        color: #444;
    }

    .master-header-wrapper .search-box input.search-box-text::placeholder {
        color: #9ea4a6;
    }

    /* Iconen met label eronder, volgorde als Figma (kleurstalen achteraan) */
    .master-header-wrapper .responsive-nav-wrapper {
        display: flex;
        align-items: flex-start;
    }

    .master-header-wrapper .samplebasket {
        order: 1;
    }

    .master-header-wrapper .responsive-nav-wrapper > div {
        width: auto;
        height: auto;
        margin-left: 15px;
    }

    .master-header-wrapper .responsive-nav-wrapper > div > span,
    .master-header-wrapper .responsive-nav-wrapper > div > a {
        padding: 24px 2px 0;
    }

    .master-header-wrapper .responsive-nav-wrapper > div:hover > span,
    .master-header-wrapper .responsive-nav-wrapper > div:hover > a {
        background: none;
    }

    .master-header-wrapper .responsive-nav-wrapper > div span::after,
    .master-header-wrapper .responsive-nav-wrapper > div a::after {
        top: 0;
        transform: translateX(-50%);
    }

    .master-header-wrapper .samplebasket {
        float: none;
    }

    .master-header-wrapper .header-icon-label {
        display: block;
        font-size: 14px;
        line-height: 20px;
        color: #fff;
        white-space: nowrap;
    }

    .master-header-wrapper .responsive-nav-wrapper > div:hover .header-icon-label {
        text-decoration: underline;
    }

    /* Tellers rechtsboven het icoon */
    .master-header-wrapper .responsive-nav-wrapper > div span.cart-qty,
    .master-header-wrapper .responsive-nav-wrapper > div span.wishlist-qty,
    .master-header-wrapper .samplebasket .counter {
        top: -6px;
        bottom: auto;
        right: auto;
        left: calc(50% + 6px);
    }

    /* Menubalk: blauw met witte tekst. Mobiel (drawer) blijft ongewijzigd. */
    /* iets lichter dan het PAX-blauw (#007ba4); witte tekst blijft goed leesbaar */
    .master-header-wrapper .header-menu {
        background: #1287b0;
    }

    .master-header-wrapper .header-menu > ul > li > a,
    .master-header-wrapper .header-menu > ul > li > span {
        color: #fff;
    }

    /* productgroepen links (pijltje bij submenu), service rechts (pax-menu-service via script in _Root.cshtml) */
    /* niet breder dan de header (1280px): op een breed scherm anders helemaal tegen de linkerrand; blauwe balk blijft vol */
    .master-header-wrapper .header-menu > ul.mega-menu {
        display: flex;
        flex-wrap: wrap;
        box-sizing: border-box;
        max-width: 1280px;
        margin-right: auto;
        margin-left: auto;
        padding: 0 20px;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li > a {
        padding: 15px 6px 13px;
        font-size: 13px;
        font-weight: normal;
        box-shadow: inset 0 -3px 0 transparent;
        transition: box-shadow .2s;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li:hover > a {
        box-shadow: inset 0 -3px 0 #e67429;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li.has-sublist > a::after {
        content: "\f107";
        margin-left: 4px;
        font-family: FontAwesome;
        font-weight: normal;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li.pax-menu-service {
        order: 1;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li.pax-menu-actie {
        margin-left: auto;
    }

    /* uitklapmenu van het laatste item (tegen de rechterrand) naar links openen */
    .master-header-wrapper .header-menu > ul.mega-menu > li:last-child {
        position: relative;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li:last-child > .sublist-wrap {
        right: 0;
        left: auto;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li.pax-menu-actie > a {
        background: #e67429;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li.pax-menu-actie:hover > a {
        box-shadow: none;
        background: #cf6320;
    }
}

/* smal desktopscherm: kleiner, zodat de 13 items op één regel passen; breder scherm: zelfde maat, menu max. 1280px breed */
@media (min-width: 1025px) and (max-width: 1279px) {
    .master-header-wrapper .header-menu > ul.mega-menu {
        padding: 0 10px;
    }

    .master-header-wrapper .header-menu > ul.mega-menu > li > a {
        padding-right: 3px;
        padding-left: 3px;
        font-size: 12px;
    }
}

/* BLACK FRIDAY-thema: header zwart, menubalk zwart met oranje lijn, Actieproducten oranje.
   Gaat vanzelf aan zolang de actiebalk in de admin class "pax-bf" heeft (script in _Root.cshtml zet html.pax-bf-thema).
   Terug naar normaal: in de admin de gewone actiebalk-HTML plakken (zonder pax-bf). Dit blok mag dan blijven staan of weg.
   Normale stijl ter referentie: header #007ba4 (admin-CSS), menubalk #1287b0, Actieproducten #e67429 (regels hierboven). */
html.pax-bf-thema .master-wrapper-page .master-header-wrapper {
    background: #000;
}

@media (min-width: 1025px) {
    html.pax-bf-thema .master-header-wrapper .header-menu {
        border-top: 1px solid #2a2a2a;
        background: #000;
        box-shadow: inset 0 -3px 0 #ffa400;
    }

    html.pax-bf-thema .master-header-wrapper .header-menu > ul.mega-menu > li:hover > a {
        background: rgba(255, 255, 255, .08);
        box-shadow: inset 0 -3px 0 #fff;
    }

    html.pax-bf-thema .master-header-wrapper .header-menu > ul.mega-menu > li.pax-menu-actie > a {
        background: #ffa400;
        color: #000;
    }

    html.pax-bf-thema .master-header-wrapper .header-menu > ul.mega-menu > li.pax-menu-actie:hover > a {
        background: #e69300;
        box-shadow: none;
    }
}

/* Categoriekop (Figma 2125:577): titel geheel blauw (span "op maat" via CategoryTitleHelper erft mee), intro donkergrijs */
.master-wrapper-page .category-page .page-title h1,
.master-wrapper-page .category-page .category-description h1 {
    font-size: 36px;
    font-weight: bold;
    line-height: 1.2;
    text-transform: none;
    color: #007ba4;
}

.master-wrapper-page .category-page .category-description p {
    font-size: 16px;
    line-height: 1.5;
    color: #333;
}

@media (max-width: 768px) {
    .master-wrapper-page .category-page .page-title h1,
    .master-wrapper-page .category-page .category-description h1 {
        font-size: 26px;
    }

    .master-wrapper-page .category-page .category-description p {
        font-size: 15px;
    }
}

/* Categoriepagina (Figma 2104:474) */

/* Breadcrumb klein en links boven de titel */
@media (min-width: 1025px) {
    .master-wrapper-page .category-page .page-title {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }

    /* SEO-template: titelbalk lag absoluut over de omschrijving (breadcrumb rechts); nu erboven */
    .master-wrapper-page .seo-category-page .page-title {
        position: static;
    }

    .master-wrapper-page .category-page .page-title .breadcrumb {
        order: -1;
        display: block;
        float: none;
        margin: 0 0 10px;
        text-align: left;
    }
}

/* Subcategorie-kaarten: afgeronde kaart, titel onder de foto, tagline als label op de foto.
   USP's, prijzen en knop blijven (conversie). */
.master-wrapper-page .sub-category-grid .item-box {
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(158, 164, 166, 0.32);
    border-radius: 15px;
    overflow: hidden;
    background: #fff;
}

.master-wrapper-page .sub-category-grid .sub-category-item {
    display: contents;
}

.master-wrapper-page .sub-category-grid .sub-category-item .picture {
    position: relative;
    order: 0;
    margin: 0;
    border: 0;
    padding: 0;
    min-height: 0;
}

.master-wrapper-page .sub-category-grid .sub-category-item .picture .subtitle {
    position: absolute;
    top: 8px;
    left: 8px;
    margin: 0;
    padding: 2px 10px;
    border-radius: 35px;
    background: #e67429;
    font-size: 12px;
    font-weight: bold;
    font-style: normal;
    line-height: 16px;
    color: #fff;
}

.master-wrapper-page .sub-category-grid .item-box .title {
    order: 1;
    margin: 0;
    padding: 15px 10px 5px;
    text-align: left;
    font-size: 15px;
}

.master-wrapper-page .sub-category-grid .item-box .title a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #333;
}

.master-wrapper-page .sub-category-grid .item-box .title a::after {
    content: "\f105";
    margin-left: 10px;
    font-family: FontAwesome;
    color: #007ba4;
}

.master-wrapper-page .sub-category-grid .sub-category-item .content-wrapper {
    order: 2;
    padding: 0 10px;
}

    /* USP-regel (Prisma: line-height 30px): lange tekst loopt compact door naast het bolletje */
    .master-wrapper-page .sub-category-grid .sub-category-item .content-wrapper > div {
        display: flex;
        align-items: center;
        gap: 5px;
        min-height: 30px;
        line-height: 1.3;
    }

        .master-wrapper-page .sub-category-grid .sub-category-item .content-wrapper > div img {
            flex: none;
            margin: 0;
        }

/* kaarten per rij even hoog; prijs en knop altijd onderaan, ook bij een lange USP */
.master-wrapper-page .sub-category-grid .item-grid {
    display: flex;
    flex-wrap: wrap;
}

.master-wrapper-page .sub-category-grid .sub-category-item .prices {
    order: 3;
    margin-top: auto;
    padding: 0 10px;
}

/* knop: oranje rand, vol oranje bij hover */
.master-wrapper-page .sub-category-grid .sub-category-item .configurebutton {
    order: 4;
    margin: 5px 10px 12px;
    border: 2px solid #e67429;
    border-radius: 35px;
    padding: 6px;
    background: none;
    transition: background-color 0.2s;
}

.master-wrapper-page .sub-category-grid .sub-category-item .configurebutton a {
    display: block;
    font-size: 14px;
    font-weight: bold;
    color: #e67429;
}

.master-wrapper-page .sub-category-grid .sub-category-item .configurebutton .fa {
    margin-left: 6px;
}

.master-wrapper-page .sub-category-grid .sub-category-item .configurebutton:hover {
    background-color: #e67429;
}

.master-wrapper-page .sub-category-grid .sub-category-item .configurebutton:hover a {
    color: #fff;
}

/* Productoverzicht (Figma 2239:1679): productboxen op categoriepagina's met producten */
.master-wrapper-page .category-page .product-grid .item-grid {
    display: flex;
    flex-wrap: wrap;
}

.master-wrapper-page .category-page .page-body .product-grid .item-grid .item-box {
    display: flex;
    float: none;
    margin-bottom: 30px;
    border-bottom: 0;
}

/* product zonder kader (rand paste niet bij de ribbons); op mobiel scheidt een grijze band de producten (zie max-width 480px) */
.master-wrapper-page .category-page .product-grid .product-item {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    width: 100%;
    /* geen binnenruimte opzij: foto over de volle breedte, zoals live */
    padding: 0 0 6px;
}

/* Prisma houdt 25px wit boven de foto (daardoor geen zichtbare ronde hoeken en labels half erboven) */
.master-wrapper-page .category-page .page-body .product-grid .item-box .picture {
    padding-top: 0;
    border-radius: 10px;
    overflow: hidden;
}

.master-wrapper-page .category-page .product-grid .details {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 14px 0 0;
}

.master-wrapper-page .category-page .product-grid .product-title {
    height: auto;
    max-height: none;
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: normal;
    line-height: 1.35;
}

.master-wrapper-page .category-page .product-grid .product-title a {
    font-size: 16px;
    color: #007ba4;
}

.master-wrapper-page .category-page .product-grid .product-title a:hover {
    text-decoration: underline;
}

.master-wrapper-page .category-page .product-grid .description {
    height: auto;
    min-height: 0;
    margin-bottom: 14px;
    font-size: 13px;
    line-height: 23px;
}

.master-wrapper-page .category-page .product-grid .description a {
    color: #666;
}

/* oude bullet-plaatjes (in de korte omschrijving uit de admin) als blauw pijltje: padding verbergt het plaatje */
.master-wrapper-page .category-page .product-grid .description img[src$="product_bullet.png"] {
    box-sizing: content-box;
    width: 0;
    height: 14px;
    margin-right: 5px;
    padding-left: 9px;
    background: url("images/icon-bullet.svg") no-repeat center center / 9px 14px;
    vertical-align: -1px;
}

/* prijs links, knop rechts, lijn erboven; altijd onderaan de kaart */
.master-wrapper-page .category-page .product-grid .add-info {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin-top: auto;
    border-top: 1px solid rgba(158, 164, 166, .32);
    padding-top: 12px;
}

.master-wrapper-page .category-page .product-grid .prices {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    align-items: baseline;
    height: auto;
    margin: 0;
}

/* geen sterren in productboxen (overal) */
.master-wrapper-page .product-item .product-rating-box {
    display: none;
}

.master-wrapper-page .category-page .product-grid .old-price {
    margin-right: 8px;
    font-size: 13px;
    color: #9ea4a6;
}

.master-wrapper-page .category-page .product-grid .actual-price {
    font-size: 22px;
    font-weight: 600;
    color: #e67429;
}

/* "Samenstellen ›" als blauw linkje (Figma); onderstreept zodra je over de kaart beweegt */
.master-wrapper-page .category-page .product-grid .add-info .product-box-add-to-cart-button {
    width: auto;
    height: auto;
    margin: 0;
    border: 0;
    padding: 4px 0;
    background: none;
    text-transform: none;
    font-size: 16px;
    font-weight: normal;
    color: #007ba4;
}

.master-wrapper-page .category-page .product-grid .product-item:hover .product-box-add-to-cart-button {
    background: none;
    text-decoration: underline;
}

/* labels op de foto (SevenSpikes-ribbons uit de admin): tekstlabels als pilletje, kleur uit de admin blijft */
.master-wrapper-page .category-page .product-grid .ribbon-position .product-ribbon {
    border-radius: 35px;
    padding: 4px 12px !important;
}

.master-wrapper-page .category-page .product-grid .ribbon-position .ribbon-text {
    font-size: 12px !important;
    font-weight: normal;
    white-space: nowrap;
}

.master-wrapper-page .category-page .product-grid .ribbon-position.top-middle {
    top: 12px;
}

.master-wrapper-page .category-page .product-grid .ribbon-position.bottom-middle {
    bottom: 12px;
}

    /* label op volle breedte (admin: width 100%, bv. Black Friday): strip tegen de onderkant van de foto */
    .master-wrapper-page .category-page .product-grid .ribbon-position.bottom-middle .product-ribbon[style*="100%"] {
        position: relative;
        top: 12px;
        border-radius: 0;
    }

    /* klein label onderaan (bv. "Ook elektrisch") viel over de strip: erboven, met wat ruimte */
    .master-wrapper-page .category-page .product-grid .ribbon-position.bottom-middle .product-ribbon:not([style*="100%"]) {
        position: relative;
        top: -18px;
    }

/* rond icoon links (plaatje-label, admin 45px breed) was te klein */
.master-wrapper-page .category-page .product-grid .ribbon-position.left-middle .product-ribbon img {
    width: 54px;
    max-width: none;
}

.master-wrapper-page .category-page .product-grid .ribbon-position.left-middle .product-ribbon[style*="45px"] {
    width: 54px !important;
}


/* sorteren: geen grijs vlak meer, klein en rechts uitgelijnd ("Sorteren op Positie ⌄", Figma) */
.master-wrapper-page .category-page .product-selectors {
    margin: 0 0 14px;
    border: 0;
    padding: 0;
    background: none;
    text-align: right;
}

.master-wrapper-page .category-page .product-selectors .product-sorting {
    float: none;
    height: auto;
}

.master-wrapper-page .category-page .product-selectors span {
    font-size: 14px;
    color: #9ea4a6;
}

.master-wrapper-page .category-page .product-selectors select {
    width: auto;
    height: auto;
    border: 0;
    padding: 4px 22px 4px 4px;
    background-color: transparent;
    background-position: 100% 50%;
    font-size: 14px;
    color: #333;
    cursor: pointer;
}

/* mobiel: kaarten over de volle breedte (was 277px van 375px door inspringingen) */
@media (max-width: 480px) {
    .master-wrapper-page .category-page .categoryfilter .right {
        padding-left: 0;
    }

    .master-wrapper-page .category-page .categoryfilter .product-grid {
        width: auto;
        margin: 0;
        padding: 0 10px;
    }

    .master-wrapper-page .category-page .page-body .product-grid .item-grid .item-box {
        width: 100%;
        margin-left: 0;
    }

    /* grijze band tussen de producten, tot de schermrand (productgrid heeft 10px opvulling) */
    .master-wrapper-page .category-page .page-body .product-grid .item-grid .item-box {
        width: calc(100% + 20px);
        margin: 0 -10px;
        padding: 6px 10px 10px;
        border-bottom: 10px solid #f2f4f5;
    }
}

/* Filters (SevenSpikes AjaxFilters), Figma "Filterblok" */
/* smallere filterkolom (was 263px), meer ruimte voor de productkaarten */
@media (min-width: 1025px) {
    .master-wrapper-page .category-page .categoryfilter .left {
        flex: 0 0 220px;
        width: 220px;
    }

    .master-wrapper-page .category-page .categoryfilter .right {
        flex: 1;
        width: auto;
        padding-left: 24px;
    }
}

/* banners (admin-HTML) met width/height-attribuut: hoogte meeschalen met de smallere kolom */
.master-wrapper-page .category-page .categoryfilter .left .html-widget img {
    height: auto;
}

/* wit, niet doorzichtig: op mobiel is dit blok zelf het uitschuifpaneel */
.master-wrapper-page .nopAjaxFilters7Spikes {
    background: #fff;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block .title {
    background: none;
}

@media (max-width: 1024px) {
    .master-wrapper-page .nopAjaxFilters7Spikes .filtersPanel {
        padding: 0 16px;
    }
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block {
    border: 0;
    border-bottom: 1px solid rgba(158, 164, 166, .32);
    background: none;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block .title,
.master-wrapper-page .nopAjaxFilters7Spikes .filtersGroupPanel {
    border-bottom: 0;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block a.toggleControl {
    padding: 14px 30px 8px 0;
    text-transform: none;
    font-size: 15px;
    font-weight: 800;
    color: #333;
}

/* plus/min rechts i.p.v. het blauwe rondje */
.master-wrapper-page .nopAjaxFilters7Spikes .filter-block .title a.toggleControl::after {
    content: "\2212";
    right: 0;
    width: 20px;
    background: none;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 22px;
    font-weight: normal;
    color: #333;
    transform: translateY(-40%);
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block .title a.toggleControl.closed::after {
    content: "+";
    transform: translateY(-40%);
}

/* wissen: "wis \00d7" direct achter de groepsnaam (zichtbaar bij een actief filter in die groep) */
.master-wrapper-page .nopAjaxFilters7Spikes .filter-block .title {
    display: flex;
    align-items: baseline;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block .title a.toggleControl {
    display: inline-block;
    padding-right: 0;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block a.clearFilterOptions {
    position: static;
    width: auto;
    height: auto;
    margin-left: 10px;
    background: none;
    transform: none;
    font-size: 0;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block a.clearFilterOptions::before {
    content: none;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filter-block a.clearFilterOptions::after {
    content: "wis \00d7";
    position: static;
    width: auto;
    height: auto;
    background: none;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 12px;
    line-height: 1;
    color: #007ba4;
    text-decoration: underline;
}

/* "Alle filters wissen" bovenaan (Figma "Reset"); de plugin toont de link alleen als er een filter aan staat */
.master-wrapper-page .nopAjaxFilters7Spikes .filtersTitlePanel {
    display: block;
    border: 0;
    padding: 0;
    background: none;
    text-align: right;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filtersTitlePanel .filtersTitle {
    display: none;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filtersTitlePanel .clearFilterOptionsAll {
    float: none;
    padding-top: 6px;
    text-align: right;
    font-size: 0;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filtersTitlePanel .clearFilterOptionsAll::after {
    content: "Alle filters wissen \00d7";
    font-size: 13px;
    color: #007ba4;
    text-decoration: underline;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filtersGroupPanel {
    padding: 0 0 10px;
}

.master-wrapper-page .nopAjaxFilters7Spikes .filtersGroupPanel .checkbox-list label {
    padding: 5px 0 5px 30px;
    text-transform: none;
    font-size: 13px;
    color: #333;
}

/* vinkvakje: afgerond, blauw met wit vinkje als het aan staat */
.master-wrapper-page .nopAjaxFilters7Spikes .checkbox-list input + label::before {
    content: "";
    top: 50%;
    left: 0;
    box-sizing: border-box;
    border: 1px solid rgba(158, 164, 166, .6);
    border-radius: 5px;
    width: 21px;
    height: 19px;
    background: #fff;
    transform: translateY(-50%);
}

.master-wrapper-page .nopAjaxFilters7Spikes .checkbox-list input:checked + label::before {
    content: "\f00c";
    border-color: #007ba4;
    background: #007ba4;
    text-align: center;
    font-family: FontAwesome;
    font-size: 12px;
    line-height: 17px;
    color: #fff;
}

/* kleurgroep: ronde bolletjes */
.master-wrapper-page .nopAjaxFilters7Spikes .colorOptions .checkbox-list input + label::before {
    content: none;
}

.master-wrapper-page .nopAjaxFilters7Spikes .colorOptions .checkbox-list label {
    font-size: 0;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 50%;
    width: 30px;
    height: 30px;
}

.master-wrapper-page .nopAjaxFilters7Spikes .colorOptions .color {
    top: 3px;
    right: 3px;
    width: 24px;
    height: 24px;
    border: 1px solid rgba(158, 164, 166, .6);
    border-radius: 50%;
}

.master-wrapper-page .nopAjaxFilters7Spikes .colorOptions .checkbox-list .checked {
    border: 0;
    background: none;
}

.master-wrapper-page .nopAjaxFilters7Spikes .colorOptions .checkbox-list .checked label {
    border-color: #007ba4;
}

/* "Uw selectie": pilletjes met kruisje */
.master-wrapper-page .nopAjaxFilters7Spikes .selected-options-list > li {
    padding: 4px 0;
    border: 0;
}

.master-wrapper-page .nopAjaxFilters7Spikes .selected-options-list > li span {
    margin: 0 6px 6px 0;
    border-radius: 35px;
    padding: 4px 26px 4px 12px;
    background: #e5f2f6;
    color: #007ba4;
}

/* USP-strip (admin-widget .usp-row): iconen in een licht vlak, zoals Figma */
.master-wrapper-page .category-page .usp-row .flex-2c img {
    box-sizing: content-box;
    margin-right: 8px;
    padding: 8px;
    border-radius: 5px;
    background: rgba(230, 230, 230, 0.32);
    max-width: 24px;
    vertical-align: middle;
}

.master-wrapper-page .category-page .usp-row .flex-2c {
    display: flex;
    align-items: center;
    font-size: 14px;
    font-weight: 600;
}

/* FAQ (PAX.Widget.Faq) */
.pax-faq {
    margin: 40px 0;
}

.pax-faq .titlestart {
    padding-top: 0;
}

.pax-faq .titlestart h2 {
    margin-bottom: 15px;
    font-size: 32px;
    font-weight: bold;
    line-height: 1.2;
    color: #333;
}

.pax-faq .titlestart p {
    margin-bottom: 15px;
    font-size: 16px;
    color: #333;
}

.pax-faq .titlestart a {
    font-size: 16px;
    color: #333;
}

.pax-faq .titlestart a .fa {
    margin-left: 8px;
}

.pax-faq .accordion {
    border: 0;
    border-bottom: 1px solid #9ea4a6;
    padding: 12px 10px;
    background: none;
    font-size: 16px;
    color: #333;
}

.pax-faq-vragen > :first-child .accordion {
    border-top: 1px solid #9ea4a6;
}

.pax-faq .accordion::after {
    content: "\f067";
    font-family: FontAwesome;
    font-weight: normal;
    color: #007ba4;
}

.pax-faq .accordion.active::after {
    content: "\f068";
}

.pax-faq .panel {
    background: none;
    color: #333;
}

@media (min-width: 1025px) {
    .category-page .pax-faq {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
    }

    .category-page .pax-faq .titlestart {
        flex: 0 0 346px;
        margin-right: 40px;
    }

    .category-page .pax-faq .pax-faq-vragen {
        flex: 0 1 860px;
    }
}

/* Footer (Figma 2134:741): donkerblauw, witte titels en links zonder pijltjes */
.footer .footer-middle {
    background-color: #00374d;
    color: #fff;
}

.footer .footer-middle .title,
.footer .footer-block > .title {
    text-transform: none;
    font-size: 20px;
    font-weight: bold;
    color: #fff;
}

.footer .footer-middle > div li,
.footer .footer-middle a {
    color: #fff;
}

.footer .footer-middle .list li,
.footer .footer-middle .list a {
    font-size: 13px;
}

.footer .footer-middle a:hover {
    text-decoration: underline;
}

@media (min-width: 1025px) {
    /* logo-kolom links, overige kolommen rechts */
    .footer .footer-middle {
        display: flex;
        padding: 60px 75px;
        width: auto;
    }

    .footer .footer-middle > div {
        width: auto;
    }

    .footer .footer-middle > div:first-child {
        flex: 1;
    }

    .footer .footer-middle > div:first-child p {
        max-width: 340px;
    }

    .footer .footer-middle > div + div {
        margin-left: 70px;
    }

    .footer .footer-block .list > li {
        padding: 2px 0;
    }

    .footer .footer-block .list > li::before {
        content: none;
    }
}

/* footer-logo uit admin heeft een zwarte achtergrond: nieuw logo eroverheen (padding verbergt het oude plaatje) */
.footer .footer-middle img[src*="logo-footer-pax"] {
    box-sizing: border-box;
    width: 132px;
    height: 74px;
    padding-left: 132px;
    background: url("images/logo-pax.png") no-repeat 0 0 / 132px 74px;
}

/* SEO-tekst onderaan categoriepagina's (admin-widget .cat-page-SEO), Figma 2163:939.
   !important alleen waar de admin-HTML inline styles heeft (groene koppen, randen) */
/* div + .page-body: wint van ".category-page .pager ~ div div { background: none }" */
.master-wrapper-page .page-body div.cat-page-SEO {
    border: 0;
    border-radius: 15px;
    padding: 30px 40px;
    background: #fbf7f1;
    font-size: 15px;
    line-height: 1.6;
    color: #333;
}

.master-wrapper-page .cat-page-SEO h2 {
    border-bottom: 0 !important;
    font-size: 32px;
    font-weight: bold;
    line-height: 1.2;
    color: #333;
}

.master-wrapper-page .cat-page-SEO h3 {
    margin-top: 28px;
    font-size: 20px;
    font-weight: bold;
    line-height: 1.3;
    color: #333;
}

.master-wrapper-page .cat-page-SEO h2 *,
.master-wrapper-page .cat-page-SEO h3 *,
.master-wrapper-page .cat-page-SEO th * {
    color: inherit !important;
}

.master-wrapper-page .cat-page-SEO p {
    color: #333;
}

.master-wrapper-page .cat-page-SEO ul {
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
}

.master-wrapper-page .cat-page-SEO ul li {
    position: relative;
    padding: 3px 0 3px 26px;
}

.master-wrapper-page .cat-page-SEO ul li::before {
    content: "\f00c";
    position: absolute;
    top: 3px;
    left: 0;
    font-family: FontAwesome;
    color: #e67429;
}

@media (max-width: 768px) {
    .master-wrapper-page .cat-page-SEO {
        padding: 20px 12px;
    }

    .master-wrapper-page .cat-page-SEO h2 {
        font-size: 26px;
    }
}

/* Overige SEO-widgets zonder .cat-page-SEO krijgen hetzelfde vlak:
   - widget met een h2 (nieuwere SEO-teksten, ook in de rechterkolom van productgrid-categorieen)
   - oude widget: lijsten + <strong>-koppen (groene <p><span><strong>), zonder divs (niet de linklijstjes)
   NUglify kent geen [attr] of .class binnen :has(); aparte regels, zodat browsers zonder :has()
   de .cat-page-SEO-regels hierboven niet verliezen. */
.master-wrapper-page .category-page .page-body div.html-widget:has(h2),
.master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) {
    margin-top: 30px;
    border-radius: 15px;
    padding: 30px 40px;
    background: #fbf7f1;
    font-size: 15px;
    line-height: 1.6;
    color: #333;
}

/* .cat-page-SEO binnen zo'n widget: geen tweede vlak (inline padding uit de admin overschrijven) */
.master-wrapper-page .category-page .page-body div.html-widget:has(h2) div.cat-page-SEO {
    margin: 0 !important;
    border-radius: 0;
    padding: 0 !important;
    background: none;
}

.master-wrapper-page .category-page .page-body div.html-widget:has(h2) h2,
.master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) h2 {
    border-bottom: 0 !important;
    font-size: 32px;
}

.master-wrapper-page .category-page .page-body div.html-widget:has(h2) span[style*="008000"],
.master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) span[style*="008000"] {
    display: block;
    margin-top: 10px;
    font-size: 20px;
    line-height: 1.3;
    color: #333 !important;
}

.master-wrapper-page .category-page .page-body div.html-widget:has(h2) ul:not(.tick-cross-list),
.master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) ul:not(.tick-cross-list) {
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
}

.master-wrapper-page .category-page .page-body div.html-widget:has(h2) ul:not(.tick-cross-list) li,
.master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) ul:not(.tick-cross-list) li {
    position: relative;
    padding: 3px 0 3px 26px;
}

.master-wrapper-page .category-page .page-body div.html-widget:has(h2) ul:not(.tick-cross-list) li::before,
.master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) ul:not(.tick-cross-list) li::before {
    content: "\f00c";
    position: absolute;
    top: 3px;
    left: 0;
    font-family: FontAwesome;
    color: #e67429;
}

@media (max-width: 768px) {
    .master-wrapper-page .category-page .page-body div.html-widget:has(h2),
    .master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) {
        padding: 20px 12px;
    }

    .master-wrapper-page .category-page .page-body div.html-widget:has(h2) h2,
    .master-wrapper-page .category-page .page-body div.html-widget:has(ul):has(strong):not(:has(div)) h2 {
        font-size: 26px;
    }
}

/* Typografie homepage + categoriepagina's (veel tekst komt uit admin-widgets met oude kleuren/fonts).
   Productpagina's bewust niet: eigen opmaak, conversie-kritisch. */
.home-page-body .master-wrapper-content,
.category-page-body .master-wrapper-content {
    color: #333;
}

.home-page-body .master-wrapper-content .html-widget h2,
.category-page-body .master-wrapper-content .html-widget h2 {
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-size: 28px;
    font-weight: bold;
    line-height: 1.25;
    color: #333;
}

.home-page-body .master-wrapper-content .html-widget h3,
.category-page-body .master-wrapper-content .html-widget h3 {
    font-family: "Open Sans", Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: bold;
    line-height: 1.3;
    color: #333;
}

.home-page-body .master-wrapper-content .html-widget h2 *,
.home-page-body .master-wrapper-content .html-widget h3 *,
.home-page-body .master-wrapper-content .html-widget th,
.home-page-body .master-wrapper-content .html-widget th *,
.category-page-body .master-wrapper-content .html-widget h2 *,
.category-page-body .master-wrapper-content .html-widget h3 *,
.category-page-body .master-wrapper-content .html-widget th,
.category-page-body .master-wrapper-content .html-widget th * {
    color: inherit !important;
}

.home-page-body .master-wrapper-content .html-widget p,
.home-page-body .master-wrapper-content .html-widget li,
.category-page-body .master-wrapper-content .html-widget p,
.category-page-body .master-wrapper-content .html-widget li {
    color: #333;
}

@media (max-width: 768px) {
    .home-page-body .master-wrapper-content .html-widget h2,
    .category-page-body .master-wrapper-content .html-widget h2 {
        font-size: 24px;
    }
}

/* SEO-tekst homepage ("Hoe de juiste raamdecoratie kiezen?", admin-widget #hp-how-select): zelfde vlak als categoriepagina's */
.master-wrapper-page #hp-how-select {
    margin-top: 30px;
    border-radius: 15px;
    padding: 30px 40px;
    background: #fbf7f1;
    font-size: 15px;
    line-height: 1.6;
    color: #333;
}

.master-wrapper-page #hp-how-select > strong {
    display: block;
    padding-left: 0;
    font-size: 32px;
    line-height: 1.2;
    color: #333;
}

.master-wrapper-page .html-widget #hp-how-select .content {
    padding: 15px 0 0;
}

.master-wrapper-page #hp-how-select ul {
    margin: 10px 0 16px;
    padding: 0;
    list-style: none;
}

.master-wrapper-page #hp-how-select ul li {
    position: relative;
    padding: 3px 0 3px 26px;
}

.master-wrapper-page #hp-how-select ul li::before {
    content: "\f00c";
    position: absolute;
    top: 3px;
    left: 0;
    font-family: FontAwesome;
    color: #e67429;
}

@media (max-width: 768px) {
    .master-wrapper-page #hp-how-select {
        padding: 20px 12px;
    }

    .master-wrapper-page #hp-how-select > strong {
        font-size: 26px;
    }
}

/* Mobiel: minder witruimte aan de zijkanten en tussen header en titel */
@media (max-width: 768px) {
    .master-wrapper-page .center-1 .page-title,
    .master-wrapper-page .category-page .category-description,
    .master-wrapper-page .category-page .category-grid,
    .master-wrapper-page .category-page .product-grid,
    .master-wrapper-page .category-page .page-body > .html-widget {
        padding-left: 10px;
        padding-right: 10px;
    }

    .master-wrapper-page .center-1 .page-title .breadcrumb {
        margin-top: 0;
    }
}

/* Winkelwagen (Figma 2239:1829). Opbouw in Cart.cshtml en CustomOrderSummary: .pax-cart-main links, .pax-cart-side rechts */
.html-shopping-cart-page .pax-cart-intro {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    margin-bottom: 0;
    padding: 24px 0 14px;
    text-align: left;
}

.html-shopping-cart-page .page.shopping-cart-page {
    margin-top: 0;
}

.html-shopping-cart-page .pax-cart-intro .breadcrumb {
    flex-basis: 100%;
    margin: 0 0 8px;
}

.html-shopping-cart-page .pax-cart-intro .breadcrumb ul {
    float: none;
    text-align: left;
}

.html-shopping-cart-page .pax-cart-intro h1 {
    margin: 0;
    text-transform: none;
    font-size: 32px;
    font-weight: bold;
    line-height: 1.2;
    color: #007ba4;
}

.html-shopping-cart-page .pax-cart-count {
    order: 3;
    flex-basis: 100%;
    margin-top: 4px;
    font-size: 14px;
    color: #9ea4a6;
}

.html-shopping-cart-page .pax-cart-steps {
    display: flex;
    margin: 0 0 8px auto;
    padding: 0;
    list-style: none;
}

.html-shopping-cart-page .pax-cart-steps li {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #9ea4a6;
}

.html-shopping-cart-page .pax-cart-steps li + li::before {
    content: "";
    width: 40px;
    margin: 0 14px;
    border-top: 1px solid rgba(158, 164, 166, .5);
}

.html-shopping-cart-page .pax-cart-steps span {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    margin-right: 8px;
    border-radius: 50%;
    background: rgba(158, 164, 166, .3);
    font-size: 13px;
    font-weight: bold;
    color: #fff;
}

.html-shopping-cart-page .pax-cart-steps .active {
    font-weight: 600;
    color: #333;
}

.html-shopping-cart-page .pax-cart-steps .active span {
    background: #007ba4;
}

/* twee kolommen: producten links, overzicht rechts (blijft in beeld bij scrollen) */
@media (min-width: 1025px) {
    .html-shopping-cart-page #shopping-cart-form {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 360px;
        align-items: start;
        column-gap: 30px;
    }

    .html-shopping-cart-page #shopping-cart-form > :not(.pax-cart-main):not(.pax-cart-side) {
        grid-column: 1 / -1;
    }

    .html-shopping-cart-page .pax-cart-side {
        position: sticky;
        top: 185px;
    }
}

/* producten als kaart i.p.v. tabel */
.html-shopping-cart-page .cart thead,
.html-wishlist-page .cart thead,
.html-shopping-cart-page .cart .cart-item-row > td:first-child,
.html-shopping-cart-page .cart td label:not(.td-title),
.html-shopping-cart-page .cart .read-more,
.html-wishlist-page .cart .read-more,
.html-shopping-cart-page .cart-options .update-cart-button,
.html-shopping-cart-page .tax-shipping-info {
    display: none;
}

.html-shopping-cart-page .table-wrapper,
.html-wishlist-page .table-wrapper {
    overflow: visible;
    margin: 0;
    padding: 0;
    background: none;
}

.html-shopping-cart-page .cart,
.html-wishlist-page .cart,
.html-shopping-cart-page .cart tbody,
.html-wishlist-page .cart tbody {
    display: block;
    width: 100%;
    border: 0;
    background: none;
}

.html-shopping-cart-page .cart .cart-item-row,
.html-wishlist-page .cart tbody > tr {
    display: grid;
    position: relative;
    float: none;
    width: auto;
    grid-template-columns: 200px minmax(0, 1fr) auto;
    grid-template-areas:
        "foto product product"
        "foto aantal oud"
        "foto aantal prijs";
    column-gap: 24px;
    margin: 0 0 16px;
    border: 1px solid rgba(158, 164, 166, .4);
    border-radius: 12px;
    padding: 12px;
    background: #fff;
}

.html-shopping-cart-page .cart .cart-item-row > td,
.html-wishlist-page .cart tbody > tr > td {
    display: block;
    border: 0;
    padding: 0;
    background: none;
    text-align: left;
}

.html-shopping-cart-page .cart td.product-picture,
.html-wishlist-page .cart td.product-picture {
    grid-area: foto;
    width: auto;
    min-width: 0;
}

.html-shopping-cart-page .cart td.product-picture img,
.html-wishlist-page .cart td.product-picture img {
    width: 100%;
    max-width: none;
    border-radius: 10px;
}

.html-shopping-cart-page .cart td.product,
.html-wishlist-page .cart td.product {
    grid-area: product;
    padding: 4px 0 12px;
}

/* ruimte rechtsboven voor "Verwijderen": alleen de titel wijkt uit, de specs krijgen de volle breedte */
.html-shopping-cart-page .cart td.product::before,
.html-wishlist-page .cart td.product::before {
    content: "";
    float: right;
    width: 110px;
    height: 24px;
}

.html-shopping-cart-page .cart .product-name,
.html-wishlist-page .cart .product-name {
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

.html-shopping-cart-page .cart .attributes-hidden,
.html-wishlist-page .cart .attributes-hidden {
    max-height: none;
    height: auto;
    overflow: visible;
}

/* gekozen opties (Figma 2270:1440): regels naam grijs links | waarde vet rechts, lijntje eronder, twee kolommen.
   Regels .pax-spec maakt het script in _Root; op mobiel ingeklapt achter de knop "Specificaties" */
.html-shopping-cart-page .cart .attributes,
.html-wishlist-page .cart .attributes {
    columns: 2 340px;
    column-gap: 15px;
    clear: both;
    margin-top: 12px;
    font-size: 13px;
    color: #666;
}

.html-shopping-cart-page .cart .attributes br,
.html-wishlist-page .cart .attributes br {
    display: none;
}

.html-shopping-cart-page .cart .pax-spec,
.html-wishlist-page .cart .pax-spec {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2px 12px;
    border-bottom: 1px solid rgba(158, 164, 166, .32);
    padding: 5px;
    break-inside: avoid;
}

.html-shopping-cart-page .cart .attributes .attributename,
.html-wishlist-page .cart .attributes .attributename {
    flex-shrink: 0;
    text-align: left;
    font-weight: normal;
    color: #9ea4a6;
}

.html-shopping-cart-page .cart .pax-spec-waarde,
.html-wishlist-page .cart .pax-spec-waarde {
    margin-left: auto;
    text-align: right;
    font-weight: bold;
}

.html-shopping-cart-page .cart .pax-specs-knop,
.html-wishlist-page .cart .pax-specs-knop {
    display: none;
}

@media (max-width: 768px) {
    .html-shopping-cart-page .cart .pax-specs-knop,
    .html-wishlist-page .cart .pax-specs-knop {
        display: inline-block;
        margin-top: 10px;
        border: 0;
        padding: 0;
        background: none;
        font-size: 14px;
        font-weight: 600;
        color: #007ba4;
    }

    .html-shopping-cart-page .cart .pax-specs-knop::after,
    .html-wishlist-page .cart .pax-specs-knop::after {
        content: "\f107";
        margin-left: 6px;
        font-family: FontAwesome;
    }

    .html-shopping-cart-page .cart .pax-specs-knop.pax-open::after,
    .html-wishlist-page .cart .pax-specs-knop.pax-open::after {
        content: "\f106";
    }

    .html-shopping-cart-page .cart .attributes,
    .html-wishlist-page .cart .attributes {
        display: none;
        margin-top: 6px;
    }

    .html-shopping-cart-page .cart .attributes.pax-open,
    .html-wishlist-page .cart .attributes.pax-open {
        display: block;
    }
}

.html-shopping-cart-page .cart .edit-item,
.html-wishlist-page .cart .edit-item,
.html-shopping-cart-page .cart .add-item,
.html-wishlist-page .cart .add-item {
    display: inline-block;
    margin: 12px 14px 0 0;
    border: 0;
    padding: 0;
    background: none;
}

.html-shopping-cart-page .cart .edit-item a,
.html-wishlist-page .cart .edit-item a,
.html-shopping-cart-page .cart .add-item a,
.html-wishlist-page .cart .add-item a {
    display: inline;
    height: auto;
    border: 0;
    padding: 0;
    background: none;
    white-space: nowrap;
    font-size: 14px;
    color: #007ba4;
    text-decoration: underline;
}

/* "Verwijder" rechtsboven (vinkje verborgen, script in CustomOrderSummary werkt direct bij) */
.html-shopping-cart-page .cart td.remove-from-cart,
.html-wishlist-page .cart td.remove-from-cart {
    position: absolute;
    top: 14px;
    right: 16px;
    left: auto;
    width: auto;
    margin: 0;
}

.html-shopping-cart-page .cart td.remove-from-cart input,
.html-wishlist-page .cart td.remove-from-cart input {
    position: absolute;
    opacity: 0;
}

.html-shopping-cart-page .cart td.remove-from-cart label,
.html-wishlist-page .cart td.remove-from-cart label {
    display: inline-block;
    padding: 0;
    font-size: 13px;
    color: #9ea4a6;
    cursor: pointer;
}

.html-shopping-cart-page .cart td.remove-from-cart label::before,
.html-wishlist-page .cart td.remove-from-cart label::before {
    content: "\f014";
    position: static;
    width: auto;
    height: auto;
    margin-right: 6px;
    border: 0;
    background: none;
    font-family: FontAwesome;
    font-size: 15px;
}

.html-shopping-cart-page .cart td.remove-from-cart label:hover,
.html-wishlist-page .cart td.remove-from-cart label:hover {
    color: #e67429;
}

/* tijdens bijwerken (verwijder, - of +): kaarten en overzicht vervagen, draaiend icoon in beeld */
.html-shopping-cart-page #shopping-cart-form.pax-bezig .pax-cart-main,
.html-shopping-cart-page #shopping-cart-form.pax-bezig .pax-cart-side,
.html-wishlist-page form.pax-bezig .wishlist-content {
    opacity: .45;
    pointer-events: none;
    transition: opacity .2s;
}

.html-shopping-cart-page #shopping-cart-form.pax-bezig::after,
.html-wishlist-page form.pax-bezig::after {
    content: "\f110";
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 100;
    margin: -24px 0 0 -24px;
    font-family: FontAwesome;
    font-size: 48px;
    color: #007ba4;
    animation: pax-draai 1s linear infinite;
}

@keyframes pax-draai {
    to {
        transform: rotate(360deg);
    }
}

/* aantal als - 1 + */
.html-shopping-cart-page .cart td.quantity,
.html-wishlist-page .cart td.quantity {
    grid-area: aantal;
    align-self: end;
}

.html-shopping-cart-page .pax-qty,
.html-wishlist-page .pax-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid rgba(158, 164, 166, .5);
    border-radius: 8px;
}

.html-shopping-cart-page .pax-qty button,
.html-wishlist-page .pax-qty button {
    width: 34px;
    height: 34px;
    border: 0;
    padding: 0;
    background: none;
    font-size: 18px;
    color: #007ba4;
    cursor: pointer;
}

.html-shopping-cart-page .cart .pax-qty .qty-input,
.html-wishlist-page .cart .pax-qty .qty-input {
    width: 40px;
    height: 34px;
    border: 0;
    padding: 0;
    background: none;
    text-align: center;
    font-size: 16px;
}

/* prijs rechtsonder: oude prijs klein doorgestreept, prijs oranje */
.html-shopping-cart-page .cart td.unit-price,
.html-wishlist-page .cart td.unit-price {
    grid-area: oud;
    align-self: end;
    text-align: right;
    font-size: 13px;
    color: #9ea4a6;
    text-decoration: line-through;
}

.html-shopping-cart-page .cart td.subtotal,
.html-wishlist-page .cart td.subtotal {
    grid-area: prijs;
    text-align: right;
}

.html-shopping-cart-page .cart .product-subtotal,
.html-wishlist-page .cart .product-subtotal {
    font-size: 22px;
    font-weight: 600;
    color: #e67429;
}

.html-shopping-cart-page .cart td.subtotal .discount,
.html-wishlist-page .cart td.subtotal .discount {
    border: 0;
    padding: 0;
    background: none;
    font-size: 12px;
    color: #1e9e05;
}

/* knoppen onder de producten: licht */
.html-shopping-cart-page .cart-options,
.html-wishlist-page .cart-options {
    margin: 0 0 20px;
    border: 0;
    padding: 0;
    background: none;
    text-align: left;
}

.html-shopping-cart-page .cart-options .common-buttons button,
.html-wishlist-page .cart-options .common-buttons button {
    height: auto;
    margin: 0 10px 0 0;
    border: 1px solid #007ba4;
    border-radius: 8px;
    padding: 8px 18px;
    background: #fff;
    font-size: 14px;
    color: #007ba4;
}

/* Staffelmeter (PAX.Widget.ShoppingCart, PublicInfo.cshtml). Eén opmaak, vier stijlen:
   standaard = meter (Figma), html.pax-bf-thema = Black Friday (automatisch zolang de actiebalk pax-bf heeft),
   .pax-staffel--stappen en .pax-staffel--compact via de variabele "stijl" in de view. */
.master-wrapper-page .pax-staffel,
.html-wishlist-page .montage-widget .montage-header {
    text-align: left;
}

.master-wrapper-page .pax-staffel {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0 0 18px;
    border-radius: 12px;
    padding: 18px 22px;
    background: #fdeee3;
    color: #333;
}

.master-wrapper-page .pax-staffel > * + * {
    margin-left: 20px;
}

.master-wrapper-page .pax-staffel-label,
.master-wrapper-page .pax-staffel-blokjes {
    display: none;
}

.master-wrapper-page .pax-staffel-icoon {
    display: flex;
    flex: 0 0 46px;
    justify-content: center;
    align-items: center;
    height: 46px;
    border-radius: 10px;
    background: #f6c9a8;
    font-size: 22px;
    font-weight: bold;
    color: #e67429;
}

.master-wrapper-page .pax-staffel-tekst {
    flex: 1;
    min-width: 200px;
}

.master-wrapper-page .pax-staffel-tekst strong {
    display: block;
    font-size: 17px;
}

.master-wrapper-page .pax-staffel-tekst small {
    font-size: 13px;
    color: #555;
}

.master-wrapper-page .pax-staffel-meter {
    position: relative;
    flex: 0 0 240px;
    height: 10px;
    margin-bottom: 14px;
    border-radius: 10px;
    background: #fff;
}

.master-wrapper-page .pax-staffel-vulling {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    border-radius: 10px;
    background: #e67429;
}

.master-wrapper-page .pax-staffel-streep {
    position: absolute;
    top: -3px;
    width: 2px;
    height: 16px;
    background: #e0b79a;
}

.master-wrapper-page .pax-staffel-streep em {
    position: absolute;
    top: 18px;
    left: 1px;
    transform: translateX(-50%);
    font-size: 11px;
    font-style: normal;
    font-weight: bold;
    color: #999;
}

.master-wrapper-page .pax-staffel-streep.ok em {
    color: #e67429;
}

.master-wrapper-page .pax-staffel-extra {
    flex-basis: 100%;
    margin: 10px 0 0;
    font-size: 13px;
    color: #1e9e05;
}

/* Black Friday-stijl (gekozen variant B): witte kaart, zwarte rand links, klein zwart label, zwarte voortgangsbalk */
html.pax-bf-thema .master-wrapper-page .pax-staffel {
    row-gap: 8px;
    border: 1px solid rgba(158, 164, 166, .4);
    border-left: 6px solid #000;
    padding: 16px 20px;
    background: #fff;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-icoon {
    display: none;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-label {
    display: inline-block;
    padding: 3px 8px;
    background: #000;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1px;
    white-space: nowrap;
    color: #fff;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-tekst strong {
    font-size: 16px;
    font-weight: 600;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-meter {
    order: 5;
    flex: 0 0 calc(100% - 20px);
    height: 8px;
    margin: 6px 10px 18px;
    background: #eee;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-vulling,
html.pax-bf-thema .master-wrapper-page .pax-staffel-streep.ok {
    background: #000;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-streep {
    background: #ccc;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-streep.ok em {
    color: #000;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-extra {
    order: 9;
    margin: 0;
    font-size: 12px;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-extra div:before {
    content: "\2713  ";
}

.master-wrapper-page .pax-staffel-blokjes span {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-left: 5px;
    padding: 2px 8px;
    background: #3a3a3a;
    line-height: 1;
    color: #888;
}

.master-wrapper-page .pax-staffel-blokjes span:first-child {
    margin-left: 0;
    height: 28px;
    font-size: 14px;
}

.master-wrapper-page .pax-staffel-blokjes span:nth-child(2) {
    height: 34px;
    font-size: 16px;
}

.master-wrapper-page .pax-staffel-blokjes span:nth-child(3) {
    height: 40px;
    font-size: 19px;
}

.master-wrapper-page .pax-staffel-blokjes span.ok {
    background: #ffa400;
    color: #fff;
}

.master-wrapper-page .pax-staffel-blokjes small {
    font-size: 8px;
    font-weight: bold;
    text-transform: uppercase;
}

html.pax-bf-thema .master-wrapper-page .pax-staffel-tekst small {
    color: #777;
}

/* stijl "stappen": tekst met daaronder de staffels als bolletjes */
.master-wrapper-page .pax-staffel--stappen {
    border: 1px solid rgba(158, 164, 166, .4);
    background: #fff;
}

.master-wrapper-page .pax-staffel--stappen .pax-staffel-icoon,
.master-wrapper-page .pax-staffel--stappen .pax-staffel-meter {
    display: none;
}

.master-wrapper-page .pax-staffel--stappen .pax-staffel-blokjes {
    display: flex;
    order: 5;
    flex-basis: 100%;
    margin: 12px 0 0;
}

.master-wrapper-page .pax-staffel--stappen .pax-staffel-blokjes span {
    flex: 1;
    height: auto;
    border-radius: 35px;
    padding: 6px;
    background: #f1f1f1;
    font-size: 14px;
}

.master-wrapper-page .pax-staffel--stappen .pax-staffel-blokjes span.ok {
    background: #e67429;
}

/* stijl "compact": alleen tekst en een dunne balk */
.master-wrapper-page .pax-staffel--compact {
    padding: 0;
    background: none;
}

.master-wrapper-page .pax-staffel--compact .pax-staffel-icoon,
.master-wrapper-page .pax-staffel--compact .pax-staffel-tekst small {
    display: none;
}

.master-wrapper-page .pax-staffel--compact .pax-staffel-meter {
    flex-basis: 100%;
    height: 8px;
    margin: 8px 0 18px;
    background: #f1f1f1;
}

@media (max-width: 768px) {
    .master-wrapper-page .pax-staffel {
        padding: 14px;
    }

    .master-wrapper-page .pax-staffel > * + * {
        margin-left: 12px;
    }

    .master-wrapper-page .pax-staffel-meter {
        flex-basis: 100%;
        margin: 12px 0 18px;
    }}

/* montage bijbestellen (PAX.Widget.Montage): witte kaart met balk links, zelfde stijl als de staffel (zwart tijdens Black Friday) */
.html-shopping-cart-page .montage-widget,
.html-wishlist-page .montage-widget {
    margin: 0 0 20px;
    border: 1px solid rgba(158, 164, 166, .4);
    border-left: 6px solid #007ba4;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}

html.pax-bf-thema.html-shopping-cart-page .montage-widget,
html.pax-bf-thema.html-wishlist-page .montage-widget {
    border-left-color: #000;
}

.html-shopping-cart-page .montage-widget .montage-header,
.html-wishlist-page .montage-widget .montage-header {
    border: 0;
    background: #fff;
    color: #333;
}

.html-shopping-cart-page .montage-widget .montage-header-title,
.html-wishlist-page .montage-widget .montage-header-title,
.html-shopping-cart-page .montage-widget .montage-header-icon,
.html-wishlist-page .montage-widget .montage-header-icon {
    color: #333;
}

.html-shopping-cart-page .montage-widget .montage-header-badge,
.html-wishlist-page .montage-widget .montage-header-badge {
    color: #777;
}

/* pijl 25% groter (was 20px) */
.html-shopping-cart-page .montage-widget .montage-header-icon,
.html-wishlist-page .montage-widget .montage-header-icon {
    font-size: 25px;
}

/* montageplaatje (actie.png) weg; oranje knop maakt duidelijk dat de balk uitklapt */
.html-shopping-cart-page .montage-widget .montage-header-img,
.html-wishlist-page .montage-widget .montage-header-img {
    display: none;
}

.html-shopping-cart-page .montage-widget .montage-header::after,
.html-wishlist-page .montage-widget .montage-header::after {
    content: "Bekijk hier";
    order: 1;
    margin-left: auto;
    padding: 5px 12px;
    border-radius: 8px;
    background: #e67429;
    color: #fff;
    font-size: 13px;
    line-height: 1.2;
    white-space: nowrap;
}

.html-shopping-cart-page .montage-widget .montage-header-help,
.html-wishlist-page .montage-widget .montage-header-help {
    order: 2;
}

/* uitgeklapt montageformulier: wit, lichtblauwe kopjes, oranje bedragen, blauwe ronde knop (i.p.v. groen) */
.html-shopping-cart-page .montage-widget .montage-body,
.html-wishlist-page .montage-widget .montage-body {
    border: 0;
    border-top: 1px solid rgba(158, 164, 166, .32);
    border-radius: 0;
    background: #fff;
}

.html-shopping-cart-page .montage-widget table th,
.html-wishlist-page .montage-widget table th {
    border-bottom: 1px solid rgba(158, 164, 166, .32);
    background: #fff;
    text-transform: none;
    font-size: 12px;
    color: #9ea4a6;
}

.html-shopping-cart-page .montage-widget table td,
.html-wishlist-page .montage-widget table td {
    border: 0;
    border-bottom: 1px solid rgba(158, 164, 166, .2);
    background: #fff;
}

.html-shopping-cart-page .montage-widget .montage-item-row td.montage-product,
.html-wishlist-page .montage-widget .montage-item-row td.montage-product,
.html-shopping-cart-page .montage-widget .montage-surcharge-row td,
.html-wishlist-page .montage-widget .montage-surcharge-row td {
    background: #fff;
}

.html-shopping-cart-page .montage-widget table td.montage-product,
.html-wishlist-page .montage-widget table td.montage-product {
    font-size: 14px;
    color: #333;
}

.html-shopping-cart-page .montage-widget .montage-product-num,
.html-wishlist-page .montage-widget .montage-product-num {
    color: #007ba4;
}

.html-shopping-cart-page .montage-widget table td.montage-price,
.html-wishlist-page .montage-widget table td.montage-price {
    font-weight: normal;
    color: #333;
}

.html-shopping-cart-page .montage-widget table td.montage-subtotal,
.html-wishlist-page .montage-widget table td.montage-subtotal,
.html-shopping-cart-page .montage-widget .montage-total-row td.montage-total-amount,
.html-wishlist-page .montage-widget .montage-total-row td.montage-total-amount {
    color: #e67429;
}

.html-shopping-cart-page .montage-widget table td.montage-subtotal.deselected,
.html-wishlist-page .montage-widget table td.montage-subtotal.deselected {
    color: #ccc;
}

.html-shopping-cart-page .montage-widget .montage-surcharges-header,
.html-wishlist-page .montage-widget .montage-surcharges-header {
    border: 0;
    background: #e5f2f6;
    text-transform: none;
    letter-spacing: 0;
    font-size: 14px;
    color: #007ba4;
}

.html-shopping-cart-page .montage-widget table input[type="checkbox"],
.html-wishlist-page .montage-widget table input[type="checkbox"] {
    accent-color: #007ba4;
}

.html-shopping-cart-page .montage-widget .montage-total-row td,
.html-wishlist-page .montage-widget .montage-total-row td {
    border-top: 1px solid rgba(158, 164, 166, .32);
    background: #fff;
}

.html-shopping-cart-page .montage-widget .montage-total-row td.montage-total-label,
.html-wishlist-page .montage-widget .montage-total-row td.montage-total-label {
    text-transform: none;
    color: #333;
}

.html-shopping-cart-page .montage-widget .montage-travel-select,
.html-wishlist-page .montage-widget .montage-travel-select {
    border: 1px solid rgba(158, 164, 166, .6);
    border-radius: 8px;
}

.html-shopping-cart-page .montage-widget .montage-actions,
.html-wishlist-page .montage-widget .montage-actions {
    border: 0;
}

.html-shopping-cart-page .montage-widget .montage-add-button,
.html-wishlist-page .montage-widget .montage-add-button {
    border-radius: 35px;
    padding: 10px 26px;
    background: #007ba4;
}

.html-shopping-cart-page .montage-widget .montage-add-button:hover,
.html-wishlist-page .montage-widget .montage-add-button:hover {
    background: #00668a;
}

/* overzicht rechts */
.html-shopping-cart-page .pax-cart-side .cart-footer {
    margin: 0;
    border: 1px solid rgba(158, 164, 166, .4);
    border-radius: 12px;
    padding: 18px;
    background: #fff;
}

.html-shopping-cart-page .pax-cart-side-title {
    margin: 0 0 14px;
    font-size: 22px;
    font-weight: bold;
    color: #333;
}

.html-shopping-cart-page .pax-cart-side .cart-collaterals,
.html-shopping-cart-page .pax-cart-side .totals,
.html-shopping-cart-page .pax-cart-side .deals {
    float: none;
    width: auto;
    min-height: 0 !important;
    margin: 0;
    border: 0;
    padding: 0;
    background: none;
}

.html-shopping-cart-page .pax-cart-side .deals > div {
    margin: 0 0 10px;
    border: 0;
    padding: 0;
    background: none;
}

.html-shopping-cart-page .pax-cart-side .deals .title {
    margin: 0 0 4px;
    border: 0;
    padding: 0;
    background: none;
    font-size: 13px;
    color: #9ea4a6;
}

.html-shopping-cart-page .pax-cart-side .deals .title strong {
    font-weight: normal;
}

.html-shopping-cart-page .pax-cart-side .deals .hint {
    display: none;
}

.html-shopping-cart-page .pax-cart-side .deals .coupon-code,
.html-shopping-cart-page .pax-cart-side .deals .giftcard-code {
    display: flex;
    border: 1px solid rgba(158, 164, 166, .5);
    border-radius: 8px;
    overflow: hidden;
}

.html-shopping-cart-page .pax-cart-side .deals input[type="text"] {
    flex: 1;
    width: auto;
    height: 38px;
    border: 0;
    background: #fff;
}

.html-shopping-cart-page .pax-cart-side .deals input[type="submit"] {
    width: auto;
    height: 38px;
    border: 0;
    padding: 0 14px;
    background: none;
    text-transform: none;
    font-size: 13px;
    color: #007ba4;
}

.html-shopping-cart-page .pax-cart-side .total-info {
    margin: 10px 0 0;
    border: 0;
    border-top: 1px solid rgba(158, 164, 166, .32);
    padding: 12px 0 0;
    background: none;
}

.html-shopping-cart-page .pax-cart-side .cart-total td {
    border: 0;
    padding: 3px 0;
    font-size: 13px;
    color: #333;
}

.html-shopping-cart-page .pax-cart-side .cart-total label {
    font-weight: normal;
    color: #333;
}

.html-shopping-cart-page .pax-cart-side .cart-total .value-summary {
    color: #333 !important;
}

.html-shopping-cart-page .pax-cart-side .cart-total .order-subtotal-discount .value-summary {
    color: #e67429 !important;
}

.html-shopping-cart-page .pax-cart-side .cart-total .order-total,
.html-shopping-cart-page .pax-cart-side .checkout-savings {
    border: 0;
}

.html-shopping-cart-page .pax-cart-side .cart-total .order-total td {
    border: 0;
    border-top: 1px solid rgba(158, 164, 166, .32);
    padding-top: 12px;
}

.html-shopping-cart-page .pax-cart-side .cart-total .order-total label {
    font-weight: bold;
}

.html-shopping-cart-page .pax-cart-side .cart-total .order-total .value-summary,
.html-shopping-cart-page .pax-cart-side .cart-total .order-total strong {
    font-size: 22px;
    color: #007ba4 !important;
    white-space: nowrap;
}

.html-shopping-cart-page .pax-cart-side .checkout-savings {
    margin: 4px 0 12px;
    font-size: 13px;
    color: #e67429;
}

.html-shopping-cart-page .pax-cart-side .checkout-button {
    width: 100%;
    height: 48px;
    border-radius: 8px;
    font-weight: bold;
}

/* tablet en mobiel (één kolom): alles 16px van de schermrand */
@media (max-width: 1024px) {
    .html-shopping-cart-page .order-summary-content {
        padding: 0 16px;
    }

    .html-shopping-cart-page .master-wrapper-page .center-1 .pax-cart-intro {
        padding-right: 16px;
        padding-left: 16px;
    }

    .html-wishlist-page .master-wrapper-page .center-1 .page-title {
        padding-right: 16px;
        padding-left: 16px;
    }

    .html-wishlist-page .wishlistTab .tabeList,
    .html-wishlist-page .wishlist-content {
        padding: 0 16px;
    }

    .html-wishlist-page .wishlist-content .table-wrapper {
        padding-right: 0;
        padding-left: 0;
    }

    .html-wishlist-page .share-info,
    .html-wishlist-page .advisormenu {
        margin-right: 16px;
        margin-left: 16px;
    }
}

@media (max-width: 768px) {
    .html-shopping-cart-page .pax-cart-intro h1 {
        font-size: 28px;
    }

    .html-shopping-cart-page .pax-cart-steps {
        order: 4;
        margin: 12px 0 0;
    }

    .html-shopping-cart-page .cart .cart-item-row,
    .html-wishlist-page .cart tbody > tr {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "foto foto"
            "product product"
            "aantal oud"
            "aantal prijs";
        column-gap: 12px;
    }

    .html-shopping-cart-page .cart td.product-picture img,
    .html-wishlist-page .cart td.product-picture img {
        width: 120px;
    }

    .html-shopping-cart-page .cart td.product,
    .html-wishlist-page .cart td.product {
        padding: 12px 0;
    }

    .html-shopping-cart-page .pax-cart-side {
        margin-top: 10px;
    }
}

/* Offertepagina (Multiwishlist): productkaarten, prijs en montage delen de winkelwagen-regels hierboven (.html-wishlist-page).
   Hier alleen wat de offerte extra heeft: titel, optie-tabs, "Kopieer naar", totalen, deel-link en adviseur. */
.html-wishlist-page .page-title {
    padding: 24px 0 14px;
    text-align: left;
}

.html-wishlist-page .page-title h1 {
    text-align: left;
    text-transform: none;
    font-size: 32px;
    font-weight: bold;
    color: #007ba4;
}

.html-wishlist-page .cart td.unit-price .td-title,
.html-wishlist-page .cart td.quantity .td-title,
.html-wishlist-page .cart td.subtotal .td-title {
    display: none;
}


/* thema zet overflow-x: hidden op body en .master-wrapper-page: dan werkt sticky niet. clip knipt ook af zonder scrollcontainer te worden */
.html-shopping-cart-page body,
.html-shopping-cart-page .master-wrapper-page,
.html-wishlist-page body,
.html-wishlist-page .master-wrapper-page {
    overflow-x: clip;
}

/* PAX.Widgets.Facebook (styles.css) zet op elke .active een min-teken (bedoeld voor een accordeon): niet onder de actieve optie */
.html-wishlist-page .wishlistTab .tabeData .wishlist-content > div.active::after {
    content: none;
}

/* twee kolommen per optie (opbouw via script in _Root): staffel + producten links, overzicht rechts */
@media (min-width: 1025px) {
    .html-wishlist-page .wishlistTab .tabeData .wishlist-content > div.active {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 340px;
        align-items: start;
        column-gap: 30px;
    }

    .html-wishlist-page .wishlistTab .tabeData .wishlist-content > div.active > :not(.pax-cart-main):not(.pax-cart-side) {
        grid-column: 1 / -1;
    }

    .html-wishlist-page .wishlist-content .pax-cart-side {
        position: sticky;
        top: 185px;
    }
}

.html-wishlist-page .pax-cart-side-title {
    margin: 0 0 12px;
    text-align: left;
    font-size: 20px;
    font-weight: bold;
    color: #333;
}

.html-wishlist-page .pax-cart-side .order-total .cart-total-right {
    text-align: right;
}

.html-wishlist-page .pax-cart-side .order-total .value-summary strong {
    white-space: nowrap;
}

/* feedback-knop: plugin zet hem als verticale tab aan de zijkant, hier gewone knop boven "Naar bestellen" */
.html-wishlist-page .pax-cart-side .wishlist-add-feedback-button {
    position: static;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 40px;
    margin: 0 0 10px;
    border: 1px solid #007ba4;
    border-radius: 8px;
    background: #fff;
    transform: none;
}

.html-wishlist-page .pax-cart-side .wishlist-add-feedback-button i,
.html-wishlist-page .pax-cart-side .wishlist-add-feedback-button span {
    width: auto;
    height: auto;
    transform: none;
    writing-mode: horizontal-tb;
    font-size: 14px;
    font-weight: 600;
    color: #007ba4;
}

.html-wishlist-page .cart .product-name i {
    font-size: 12px;
    font-weight: normal;
    color: #9ea4a6;
}

/* "Kopieer naar" klein onderin de kaart, boven - 1 + */
.html-wishlist-page .cart td.copy-from-choice {
    position: static;
    grid-area: aantal;
    align-self: start;
    width: auto;
    margin: 10px 0 0;
    font-size: 13px;
    color: #9ea4a6;
}

.html-wishlist-page .cart td.copy-from-choice .td-title {
    display: inline;
    margin-right: 6px;
    font-size: 13px;
    color: #9ea4a6;
}

.html-wishlist-page .cart td.copy-from-choice select {
    width: auto;
    height: 28px;
    border: 1px solid rgba(158, 164, 166, .5);
    border-radius: 6px;
    padding: 0 6px;
    background-color: #fff;
    font-size: 13px;
}

.html-wishlist-page .cart-options .common-buttons {
    border: 0;
    padding: 0;
    background: none;
}

.html-wishlist-page .cart-options .common-buttons button {
    width: auto;
}

.html-wishlist-page .cart .qty-input {
    width: 50px;
    height: 34px;
    border: 1px solid rgba(158, 164, 166, .5);
    border-radius: 8px;
    background: #fff;
    text-align: center;
}

/* optie-tabs (boven de producten; de tabs floaten, de kaarten eronder) */
.html-wishlist-page .wishlistTab .tabeData {
    clear: both;
    padding-top: 14px;
}

/* optie-knoppen als pillen: actief blauw vol, rest wit met rand; vaste rand (plugin gaf actief 2px extra = verspringen) */
.html-wishlist-page .tabeList {
    float: none;
    padding: 0;
}

.html-wishlist-page .tabeList ul {
    display: flex;
    flex-wrap: wrap;
    overflow: visible;
    margin: 0;
    padding: 0;
}

.html-wishlist-page .tabeList ul li,
.html-wishlist-page .tabeList ul li#choice5:last-child {
    width: auto;
    margin: 0 8px 8px 0;
    border: 1px solid rgba(158, 164, 166, .5);
    border-radius: 35px;
    padding: 0;
    background: #fff;
    transition: border-color .2s, background-color .2s;
}

.html-wishlist-page .tabeList ul li > div {
    display: flex;
    align-items: center;
    border: 0;
    padding: 8px 18px;
    background: none;
}

.html-wishlist-page .tabeList ul li .imgQuot {
    display: none;
}

/* nog maar 3 opties: optie 4 en 5 verborgen (tab en "Kopieer naar"); bestaande regels daarin blijven bewaard */
.html-wishlist-page .tabeList ul li#choice4,
.html-wishlist-page .tabeList ul li#choice5,
.html-wishlist-page .tabeList ul li#choice5:last-child,
.html-wishlist-page .cart td.copy-from-choice option[value="4"],
.html-wishlist-page .cart td.copy-from-choice option[value="5"] {
    display: none;
}

/* thema zet een "−" achter elk .active-element */
.html-wishlist-page .tabeList ul li::after,
.html-wishlist-page .tabeList ul li > div::after {
    content: none;
}

.html-wishlist-page .tabeList ul li > div::before {
    content: "\f0f6";
    margin-right: 8px;
    font-family: FontAwesome;
    font-size: 15px;
    color: #9ea4a6;
}

.html-wishlist-page .tabeList ul li .quiteImgBox,
.html-wishlist-page .tabeList ul li:hover .quiteImgBox,
.html-wishlist-page .tabeList ul li.active .quiteImgBox {
    padding: 0;
    background: none;
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.html-wishlist-page .tabeList ul li:hover {
    border-color: #007ba4;
}

.html-wishlist-page .tabeList ul li.active {
    border: 1px solid #007ba4;
    background: #007ba4;
}

.html-wishlist-page .tabeList ul li.active .quiteImgBox,
.html-wishlist-page .tabeList ul li.active > div::before {
    color: #fff;
}

/* totalen als kaart, groene knop rond */
.html-wishlist-page .wishlist-content .totals {
    float: none;
    width: auto;
    margin: 0 0 14px;
    border: 1px solid rgba(158, 164, 166, .4);
    border-radius: 12px;
    padding: 18px 20px;
    background: #fff;
}

.html-wishlist-page .wishlist-content .totals .total-info,
.html-wishlist-page .wishlist-content .totals .cart-total td {
    border: 0;
    background: none;
}

.html-wishlist-page .wishlist-content .totals .cart-total td {
    padding: 3px 0;
    font-size: 14px;
    color: #333;
}

.html-wishlist-page .wishlist-content .totals .cart-total label {
    font-weight: normal;
    color: #333;
}

.html-wishlist-page .wishlist-content .totals .value-summary,
.html-wishlist-page .wishlist-content .totals .cart-total span {
    color: #333 !important;
}

.html-wishlist-page .wishlist-content .totals .order-subtotal-discount .value-summary {
    color: #e67429 !important;
}

.html-wishlist-page .wishlist-content .totals .order-total td {
    border-top: 1px solid rgba(158, 164, 166, .32);
    padding-top: 12px;
}

.html-wishlist-page .wishlist-content .totals .order-total label {
    text-transform: none;
    font-weight: bold;
}

.html-wishlist-page .wishlist-content .totals .order-total .value-summary,
.html-wishlist-page .wishlist-content .totals .order-total strong {
    font-size: 22px;
    color: #007ba4 !important;
}

.html-wishlist-page .wishlist-content .checkout-buttons .wishlist-add-to-cart-button {
    width: 100%;
    height: 48px;
    border-radius: 8px;
    font-weight: bold;
}

/* deel-link en adviseur: lichte kaarten */
.html-wishlist-page .share-info,
.html-wishlist-page .advisormenu ul li {
    border: 1px solid rgba(158, 164, 166, .4);
    border-radius: 12px;
    background: #fff;
}

.html-wishlist-page .advisormenu .imgQuot {
    color: #007ba4;
}

@media (max-width: 768px) {
    .html-wishlist-page .master-wrapper-page .center-1 .page-title {
        padding-top: 12px;
        padding-bottom: 10px;
    }

    .html-wishlist-page .page-title h1 {
        font-size: 26px;
    }

    .html-wishlist-page .tabeList ul li > div {
        padding: 6px 12px;
    }

    .html-wishlist-page .tabeList ul li .quiteImgBox {
        font-size: 13px;
    }

    .html-wishlist-page .cart td.product {
        padding-right: 0;
    }
}

/* popup na "in winkelwagen" (SevenSpikes AjaxCart) en uitklapmandje: geen specs, werd te lang; staan op de winkelwagenpagina */
.productAddedToCartWindow .attributeInfo,
.flyout-cart .mini-shopping-cart .attributes {
    display: none;
}

/* Prisma-template zet een fa-forward-icoon voor de subcategorieën; die zijn op productpagina's verborgen (theme.custom) en tussen de nieuwe kaarten werd het icoon zichtbaar */
.master-wrapper-page .categoryfilter .right > i.fa-forward {
    display: none;
}