/*dahsboard addresses*/
 tr#addres_type, tr#ext_id, tr#save_to_address_book_if_order_row{
    display: none;
}
 a.winkelwagen-knop.red.btn.btn-sm.btn-danger.mb-4 {
    margin-right: 0.5rem;
}
 /* events on demand pagina*/
a#content_39 {
    display: none;
}

 /* winkelwagen opslaan als offerte knop*/
a#save_as_offer {
    width: 100%;
    margin-right: 0 !important;
    margin-top: 0.5rem !important;
}
 
 .nav.container.p-0.justify-content-between.align-items-center.bg-white.builder-top-header-bg-color::before {
    content: '';
    position: absolute;
    left: 1rem;
    top: 3rem;
    background-image: url(/files/public/fck/1/overheid%20content/xerox_logo_red-RGB_tm.svg);
    background-size: contain;
    background-repeat: no-repeat;
    width: 120px;
    height: 40px;
}
.nav.container.p-0.justify-content-between.align-items-center.bg-white.builder-top-header-bg-color {
    position: relative;
}
@media screen and (min-width: 992px) {
    #navbarCollapse .nav {
        justify-content: end !important;
    }
}
 /* styling tegen grote rode knop offertes akash checkt of goed is. Geplaatst op 16-07-25*/
table.table.table-sm.table-borderless {
    border-spacing: 1.5rem !important;
}
 /*chili*/
span#chili-pages .btn-outline-secondary {
    background-color: #007bc7 !important;
}

 /* LOGIN SCHERM */
.login-page {
    height: screen;
}

.login-page .login-container:first-child {
    height: 90dvh !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-page .login-container img {
    display: none !important;
}

.login-page .login-container .login-content {
    background: #fff !important;
    padding: 2rem !important;
    border: 1px solid #CBD5E1;
    border-radius: 1rem !important;
    /*box-shadow: 0 0 20px 0px #0000001f;*/
}

.login-page .login-container .login-content:has(.login-container) {
    background: transparent !important;
    border: none;
}

.login-page .login-container .login-content:before {
    content: "Inloggen op het bestelportaal";
    display: block;
    margin-bottom: 2rem;
    font-size: 2rem;
    font-weight: bold;
}

.login-page .login-container .login-content:has(.login-container):before {
    content: "" !important;
    display: none !important;
}

.login-page .login-container .login-content:has(.login-container):before .login-content:before {
    text-align: center;
    margin: 0 auto;
}

.login-page .login-container .login-content form table td:first-child {
    font-weight: bold;
}

.login-page .login-container .login-content form table tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

@media screen and (min-width: 992px) {
    .login-page .login-container .login-content {
        flex: 0 0 25%;
        max-width: 25%;
    }
    .login-page .login-container .login-content:has(.login-container) {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }
}

.login-page .login-container .login-content .btn, .login_email, .login_password {
    width: 100% !important;
}

.login-page .login-container .login-content form table tr .token-container {
    margin: 5px 0;
    margin-left: -1.5rem;
}

.login-page .login-container .login-content form table tr .token-input {
    width: 40px !important;
    height: 40px !important;
    margin: 0 3px;
}



/*AI tool*/
a[href="https://supportfast.ai/"], .distanza-footer {
    display: none !important;
}

/*.footer-zona-input .footer-text-input::placeholder {*/
/*    content: "Stel hier je vraag" !important;*/
/*    color: red !important;*/
/*}*/

/* Style for the entire chat bubble container */
#chat-widget-container .zona-nuvoletta {
    background-color: transparent; /* container should be transparent so only the bubble shows the color */
    border: none; 
     
 }

/* Style for the chat bubble itself */
#chat-widget-container .msg-nuvoletta {
    background-color: #d9ebf8 !important;
    border: none !important;
}

/* Style for the text inside the bubble */
#chat-widget-container .msg-nuvoletta span {
    color: #154273 !important;
}



/*HEADER*/
@media screen and (max-width: 991px) {
    .builder-mid-header-bg-color {
        display:none;
    }
    .header-c {
        /*border-bottom: 1px solid #E2E8F0;*/
        border-bottom: 0 !important;
    }
}

/*.header-c {*/
/*    position: relative;*/
/*    z-index: 40;*/
/*}*/

.builder-mid-header-bg-color {
    position: relative !important;
    border-top: none !important;
    margin-top: 1rem;
    border-color: #E2E8F0 !important;
}

/*section menu*/
.builder-mid-header-bg-color .nav ul li a {
    color: #154273 !important;
}

.builder-mid-header-bg-color .nav ul li .dropdown-menu {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: #D9EBF7 !important;
    border: none;
    border-radius: 20px !important;
    min-width: 1340px;
    /*justify-content: center;*/
}

.builder-mid-header-bg-color .nav ul li:hover .dropdown-menu {
    display: flex;
}

.builder-mid-header-bg-color .nav ul li:hover .dropdown-menu:has(div > div > a) {
    padding: 1rem .5rem !important;
}

.builder-mid-header-bg-color .nav ul li .dropdown-menu > div {
    width: 90%;
}

.builder-mid-header-bg-color .nav ul li .dropdown-menu > div #category_123 {
    display: none !important;
}



.builder-mid-header-bg-color .nav ul li .dropdown-menu > div > div {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    background: #D9EBF7 !important;
    flex: 0 0 100%;
    max-width: 100%;
    /*max-width: none;*/
    width: 100%;
    margin: 0 .5rem;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    display: flex;
}
.builder-mid-header-bg-color .nav ul li .dropdown-menu > div > div a {
    padding: .5rem !important;
    padding-bottom: .5rem !important;
    margin: 1rem;
    flex-direction: column;
    background: #B8DAEF;
    border-radius: .3rem;
    align-items: start !important;
    padding-left: .5rem;
    padding-right: .5rem;
    max-width: 8rem;
    position: relative;
    white-space: normal;
}

.builder-mid-header-bg-color .nav ul li .dropdown-menu > div > div a img {
    max-height: 5rem !important;
    max-width: 5rem !important;
    margin-left: auto;
    margin-right: -.8rem !important;
    margin-bottom: -.7rem !important;
    order: 2;
}

/* Flatten the structure to allow cross-column reordering */
.dropdown-menu .row {
    display: flex !important;
    flex-wrap: wrap !important;
    align-content: flex-start !important;
}

/* Make all column divs into a single flex container */
.dropdown-menu .row > div {
    display: contents !important; /* This removes the column wrapper from the layout */
}

/* Each anchor element becomes a flex item that can be reordered */
.dropdown-menu .row a {
    width: 25% !important; /* Keep 4-column layout */
    flex: 0 0 25% !important;
    box-sizing: border-box !important;
    padding: 0.5rem !important; /* Adjust padding as needed */
}


/* Now reorder the individual anchor elements */
/* 1. Kaart */
a[href="/Kaart"] { order: 1; }
a[href="/Kaarten"] { order: 1; }

/* 2. Flyer */
a[href="/Flyer"] { order: 2; }
a[href="/Flyers"] { order: 2; }

/* 3. Poster */
a[href="/Poster"] { order: 3; }
a[href="/Posters"] { order: 3; }

/* 4. Brochure */
a[href="/Brochure"] { order: 4; }

/* 5. Magazine */
a[href="/Magazine"] { order: 5; }

/* 6. Boek */
a[href="/Boek"] { order: 6; }

/* 7. DTP en opmaak */
a[href="/DTP-en-opmaak"] { order: 7; }
a[href="/DTP[-]-en-opmaak"] { order: 7; }

/* 8. Folder */
a[href="/Folder"] { order: 8; }

/* 9. Roll-up banner */
a[href="/Roll[-]up-banner"] { order: 9; }
a[href="/Roll[-]up-banners"] { order: 9; }

/* 10. Vlag */
a[href="/Vlag"] { order: 10; }

/* 11. Spandoek */
a[href="/Spandoek"] { order: 11; }

/* 12. Badge */
a[href="/Badge"] { order: 12; }
a[href="/Badges"] { order: 12; }

/* 13. Pasje */
a[href="/Pasje"] { order: 13; }

/* 14. Mailing (fysieke mailing) */
a[href*="mailing"] { order: 14; }

/* 15. Notitieboek */
a[href="/Notitieboek"] { order: 15; }

/* 16. Keycord */
a[href="/Keycord"] { order: 16; }

/* 17. Pen */
a[href="/Pen"] { order: 17; }

/* 18. Tas */
a[href="/Tas"] { order: 18; }

/* 19. Sticker */
a[href="/Sticker"] { order: 19; }

/* 20. Foamboard */
a[href="/Foamboard"] { order: 20; }

/* 21. Repro opdracht */
a[href="/Repro[-]opdracht"] { order: 21; }

/* 22. Temp category (keep at end) */
a[href*="temp-cat"] { order: 99; }


.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Kaart"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Kaarten"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Flyer"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Flyers"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Poster"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Posters"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Brochure"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Magazine"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Boek"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/DTP[-]-en-opmaak"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/DTP-en-opmaak"]:before {
    content: 'Ook digitaal';
    background: #D9EBF7;
    padding: .2rem .5rem;
    border-radius: 50px;
    position: absolute;
    bottom: .5rem;
    left: .5rem;
    font-size: .6rem;
}


/* Akash wilde dit weg*/

/* First 6 items from reordered list: Kaart, Flyer, Poster, Brochure, Magazine, Boek 
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Kaart"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Kaarten"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Flyer"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Flyers"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Poster"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Posters"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Brochure"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Magazine"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Boek"]:after,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Folder"]:after {
    content: 'Standaard';
    background: #D9EBF7;
    padding: .2rem .5rem;
    border-radius: 50px;
    position: absolute;
    bottom: 2rem;
    left: .5rem;
    font-size: .6rem;
}

.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Folder"]:after {
    bottom: .5rem;
}
*/
/* Akash wilde dit weg*/
/* Items 8-13 (Roll-up banner, Vlag, Spandoek, Badge, Pasje, Mailing) 
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Roll[-]up-banner"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Roll[-]up-banners"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Vlag"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Spandoek"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Badge"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Badges"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Pasje"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Notitieboek"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Keycord"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Pen"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Tas"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Sticker"]:before,
.builder-mid-header-bg-color .nav ul li .dropdown-menu a[href="/Foamboard"]:before {
    content: 'Niet standaard';
    background: #D9EBF7;
    padding: .2rem .5rem;
    border-radius: 50px;
    position: absolute;
    bottom: .5rem;
    left: .5rem;
    font-size: .6rem;
}
*/

/*account*/
#customer-service {
    display: none !important;
}

@media screen and (min-width: 992px) {
    #navbarCollapse .nav {
        justify-content: end !important;
    }
}

#navbarCollapse .nav-container div {
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
}

/*logo*/
#navbarCollapse > div > div .logo img {
    max-height: 85px !important;
}
#navbarCollapse > div > div .logo {
    margin-left: 9.5rem !important;
}

@media screen and (max-width: 768px) {
    #navbarCollapse > div > div .logo {
        min-width: 300px;
        position: absolute;
        left: 35%;
        top:0;
    }
}

@media screen and (max-width: 576px) {
    #navbarCollapse > div > div .logo {
        min-width: 300px;
        position: absolute;
        left: 20%;
        top:0;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
    #navbarCollapse > div > div .logo {
        min-width: 300px;
        position: absolute;
        left: 50%;
        transform: translateX(calc(50% - 4.25rem));
    }
}

/*user account*/
@media screen and (max-width: 992px) {
    #navbarCollapse > div > div .user-menu {
        display: none !important;
    }
}

@media screen and (min-width: 992px) {
    #navbarCollapse > div > div .user-menu {
        margin-top: -3rem;
        font-size: .9375rem;
        width: 75%;
        justify-content: end;
        text-align: right;
        display: flex !important;
        align-items: center;
    }
}

#navbarCollapse > div > div .user-menu a {
    color: #154273 !important;
}
#navbarCollapse > div > div .user-menu a {
    font-size: .9375rem;
    margin-left: 1rem;
}

/*shoppingcart*/

@media screen and (max-width: 991px) {
    #navbarCollapse > div > div .shopping-cart {
        width: 45% !important;
        justify-content: end;
        text-align: right;
        margin-left: 0 !important;
        margin-right: 0 !important;
        top: 3.7rem;
        position: absolute;
    }
}

@media screen and (max-width: 768px) {
    #navbarCollapse > div > div .shopping-cart {
        position: absolute !important;
        top: 0;
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: flex-start;
        justify-content: flex-end;
        align-items: flex-end;
        height: 1rem;
        padding-right: .5rem;
    }
    
    
}

@media screen and (max-width: 991px) {
    #navbarCollapse > div > div .shopping-cart .builder-basket-link-color {
        display: none !important;
    }
}


@media screen and (min-width: 768px) {
    #navbarCollapse > div > div .shopping-cart {
        width: 45% !important;
        justify-content: end;
        text-align: right;
        margin-left: 0 !important;
        margin-right: 0 !important;
        top: 3.7rem;
        position: absolute;
    }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
    #navbarCollapse > div > div .shopping-cart {
        width: 45% !important;
        justify-content: end;
        text-align: right;
        margin-left: 0 !important;
        margin-right: 0 !important;
        top: -1rem;
        position: absolute;
    }
}

#navbarCollapse > div > div .shopping-cart:before {
    content: "\f07a" !important; /* This is the Unicode for fa-shopping-cart */
    font-family: 'Font Awesome 5 Pro';
    font-weight: normal;
    font-style: normal;
    font-size: 12px;
    margin-right: .5rem;
    margin-top: 0.2rem;
    color: #007bc7;
}

#navbarCollapse > div > div .shopping-cart div {
    display: flex;
}

#navbarCollapse > div > div .shopping-cart a {
    color: #154273 !important;
}
#navbarCollapse > div > div .shopping-cart a:nth-child(2) {
    visibility: hidden;
}
#navbarCollapse > div > div .shopping-cart a:nth-child(2) small {
    visibility: visible;
}

#navbarCollapse > div > div .shopping-cart a:nth-child(3) {
    position: absolute;
    top:-2rem;
    right: 0;
    font-weight: 700
}

#navbarCollapse > div > div .shopping-cart a:nth-child(3):hover {
    text-decoration: none;
    
}

@media screen and (min-width: 768px) {
    #navbarCollapse > div > div + div {
        flex: 0 0 33.3333% !important;
        max-width: 33.3333% !important;
    }
}


/*SUBHEADER*/
/*left*/
.builder-mid-header-bg-color .nav .builder-bottom-header-bg-color {
    flex: 0 0 calc(60% - 3rem);
    max-width: calc(60% - 3rem);
}

.builder-mid-header-bg-color .nav .builder-bottom-header-bg-color ul li:nth-of-type(2):after {
    content: "\f078";
    font-family: 'Font Awesome 5 Pro';
    font-weight: normal;
    font-style: normal;
    font-size: 12px;
    margin:0px 10px 0px -10px;
    text-decoration:none;
}

/* Menu item Meest duurzaam groen maken */
.builder-mid-header-bg-color .nav .builder-bottom-header-bg-color ul li:last-of-type a {
    color: #39870b !important;
}



/*search*/ 
.builder-mid-header-bg-color .nav .search-bar {
    order: 3;
    width: 6rem !important;
    justify-content: end;
    /*position: relative;*/
    /*background: #EEF7FC !important;*/
    color: #154273 !important;
    margin-right: 12rem !important;
}
.builder-mid-header-bg-color .nav .search-bar input {
    width: 7rem !important;
    border-radius: 0;
    background: #EEF7FC !important;
    color: #154273 !important;
    border: none;
    margin-left: auto;
    height: 2.5rem !important;
    
}
.builder-mid-header-bg-color .nav .search-bar:after {
    /*content: 'Zoeken';*/
    position: absolute;
    top: .5rem;
    right: 1.3rem;
    
}
.builder-mid-header-bg-color .nav .search-bar button i {
    display: none;
    left: 1rem;
}

.search-b input#searchInput:focus, .search-b input#searchInput:hover {
    width: 7rem !important;
}

.search-b input#searchInput:focus, .search-b input#searchInput:focus {
    width: 1050px !important;
    background: #EEF7FC !important;
}
.search-b input#searchInput:focus, .search-b input#searchInput::placeholder {
    content: 'zoeken';
}

/*search result*/
.search_result_link {
    display: none !important;
}

/*right*/ 
.builder-mid-header-bg-color .nav div:nth-of-type(3) {
    flex: 0 0 calc(24% - 3rem);
    max-width: calc(24% - 3rem);
    order: 2;
    /*position: absolute;*/
    /*top: 0;*/
    /*right: 20rem;*/
    /*z-index: 50;*/
}

/*body > header + div + div .content-wrapper div {*/
/*    display: flex;*/
/*}*/




@view-transition {
  navigation: auto;
}

/*Section page styling*/
.aanpak-container .col-lg-3 .bg-secondary {
    /*background: #B8DAEF !important;*/
}

/* inspiratie afbeelding */
.aanpak-container div div img {
    padding: 0 !important;
    /*background-color: #fff !important;*/
}

/*PRODUCT OVERVIEW STYLING*/
.content-container .content-wrapper > div > .categorie-div-container > div {
    margin: .9rem 0rem !important;
}

.content-container .content-wrapper > div > .categorie-div-container .categorie-div {
    border: none;
    background: #B8DAEF;
    padding: 0rem;
}

.content-container .content-wrapper > div > .categorie-div-container .categorie-div .categorie-titel {
    color: #154273;
    font-weight: 300;
    font-size: 1.5rem;
    padding: 1rem !important; 
}

.content-container .content-wrapper > div > .categorie-div-container .categorie-div .categorie-foto {
    text-align: right !important;
}

.content-container .content-wrapper > div > .categorie-div-container .categorie-div .categorie-foto img {
    padding: 0 !important;
}

.content-container .content-wrapper > div > .categorie-div-container .categorie-div .categorie-meer-info {
    display: none;
}

/*STEP SELECTOR LAYOUT */
.content-container .content-wrapper {
    padding-right: 0 !important;
}

.content-container .content-wrapper > div > .content {
    width: 100%;
}

/*card header styling*/
.content-container .content-wrapper .card .card-header, .content-container .content-wrapper .card .card-footer {
    background: #fff;
    border: none;
}
.content-container .content-wrapper > div {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.content-container .content-wrapper > div > nav, .content-container .content-wrapper > div > .nav_extra, .content-container .content-wrapper > div > #product_description {
    width: 100%;
}

.content-container .content-wrapper > div #product_description {
    min-height: 460px;
}
.content-container .content-wrapper > div #product_description #app .left-images {
   background: #B8DAEF !important;
   padding: 0rem;
   border-radius: .5rem;
}

.content-container .content-wrapper > div #product_description #app .left-images img {
    border: none;
}
.content-container .content-wrapper > div #product_description #app .right-tabs {
    padding-left: 3rem;
    padding-right: 0rem;
    padding-top: 0;
}
.content-container .content-wrapper > div #product_description #app .right-tabs .tabs-component {
   border: 1px solid #E2E8F0 !important;
   border-radius: .5rem;
}
.content-container .content-wrapper > div #product_description #app .right-tabs .tabs-component .tabs-component-tabs .tabs-component-tab {
   border: 0;
   font-size: 22px;
   font-weight: 700;
   color:#154273;
   margin-left: .5rem;
}
.content-container .content-wrapper > div #product_description #app .right-tabs .tabs-component .tabs-component-tabs .tabs-component-tab a {
   padding-bottom:0;
}
.content-container .content-wrapper > div #product_description #app .right-tabs .tabs-component .tabs-component-panels {
    padding-top: 0;
    border-top: 0;
    border-radius: .5rem;
}

.content-container .content-wrapper > div .categorie-div-container {
    width: 100% !important;
}

.content-container .content-wrapper > div .steps_selector {
    margin-left: 0;
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
    order: 2;
}
.content-container .content-wrapper > div .steps_selector > div {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
}

.content-container .content-wrapper > div .steps_selector .option-card-container, .content-container .content-wrapper > div .steps_selector .gekozen_product_wrapper {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0 !important;
}

.content-container .content-wrapper > div .steps_selector > div .option_container {
    
}
.content-container .content-wrapper > div .steps_selector > div .option_container header {
    
}
.content-container .content-wrapper > div .steps_selector > div .option_container .inner .icon_selector ul {
    justify-content: start !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.content-container .content-wrapper > div .steps_selector > div .option_container .inner .icon_selector ul li {
    display: flex;
    flex-direction: column;
    overflow: visible;
    margin: .5rem !important;
    flex: 0 0 23%;
    max-width: 23%;
}


.content-container .content-wrapper > div .steps_selector > div .option_container .inner .icon_selector ul li .recommended.badge {
    background: #E2EDDB !important;
    color: black;
    font-weight: 500;
    position: absolute;
    top: -15px;
    right: -5px;
}
.content-container .content-wrapper > div .steps_selector > div .option_container .inner .radio_selector ul {
    justify-content: start;
}
.content-container .content-wrapper > div .steps_selector > div .option_container .inner .radio_selector ul li {
    margin: .5rem !important;
    flex: 0 0 23%;
    max-width: 23%;
}

/*BEREND: achtergrond van de opties in de Step selector in blauw*/
.custom-control.custom-radio.custom-control-inline.col-10.col-lg-3.my-2.mx-0.pr-0.has_image.card.p-0.active {
  background: #cce5f4;
}

.content-container .content-wrapper > div .steps_selector > div .option_container .inner .dynamic_selector .form-group {
    display:flex;
    flex-wrap: wrap;
    
}
.content-container .content-wrapper > div .steps_selector > div .option_container .inner .dynamic_selector .form-group label {
    width: 100%;
}
.content-container .content-wrapper > div .steps_selector > div .option_container .inner .dynamic_selector .form-group input {
    width: 80%;
}
.content-container .content-wrapper > div .steps_selector > div .option_container .inner .dynamic_selector .form-group a {
    width: 20%;
    border-radius: 0;
}

.content-container .content-wrapper > div .steps_selector > div .prijs_selector ul li [id^="date_"]  {
    max-width: 100%;
    flex: 0 0 100%;
}


.content-container .content-wrapper > div .steps_selector > div .prijs_selector ul li [id^="date_"] input {
    border: 1px solid #b0bec5;
}

.content-container .content-wrapper > div .steps_selector > div .prijs_selector ul li [id^="date_"] i {
    font-weight: 100 !important;
}

.content-container .content-wrapper > div .steps_selector > div .prijs_selector .add_to_cartbutton, .content-container .content-wrapper > div .steps_selector .option-card-container .add_to_cartbutton  {
    display: none !important;
}

.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper  {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
}


/*Gekozen product styling*/
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product ul {
    padding:.5rem 1.5rem !important;
    width: 100%;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product ul li  {
    padding: .5rem 0;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product ul li:last-of-type  {
    border-bottom: 0 !important;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product ul li span {
    padding: 0;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product header {
    width: 100%;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product footer {
    width: 100%;
}

.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product #card_footer + div {
    width: 100%;
}

.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product > .add_to_cartbutton {
    /*width: 49%;*/
    margin-left: 1rem !important;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product > div .add_to_cartbutton {
    /*width: 49%;*/
    background: #fff !important;
    color: #0077b6 !important;
    border: 2px #0077b6 solid;
}
.content-container .content-wrapper > div .steps_selector > .gekozen_product_wrapper .gekozen_product > div .add_to_cartbutton:hover {
    /*width: 49%;*/
    background: #eef7fc !important;
    color: #0077b6 !important;
    
}

.content-container .content-wrapper > div #long_text {
    flex: 0 0 33.3333%;
    max-width: 33.33333%;
}


/*ICOONSELECTOR STYLING*/
/*icoonselector product overview*/
.content-container .content-wrapper .producten-div-container {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
}

.content-container .content-wrapper .producten-div-container #productlist {
    padding: 0;
}

.content-container .content-wrapper .producten-div-container #productlist > div .product-div .card {
    border: 0 !important;
    background: #EEF7FC;
    padding: 1rem;
    border-radius: .5rem;
}

.content-container .content-wrapper .producten-div-container #productlist > div .product-div .card div.row.p-2 { 
  display: none;
}

.content-container .content-wrapper .producten-div-container #productlist > div .product-div .card .product-meer-info.btn.btn-sm.btn-outline-primary.m-2 {
  display: none;
}

.content-container .content-wrapper > div .nav_extra .foto .foto-met-extra {
    border: 0 !important;
    background: #EEF7FC;
    padding: 1rem;
    border-radius: .5rem;
}

.content-container .content-wrapper > div .nav_extra .right table {
    background: white !important;
    padding: 0 !important;
}

.content-container .content-wrapper > div .nav_extra .right table input {
    border-radius: .2rem !important;
}

.content-container .content-wrapper > div .nav_extra .right .icon_selector .row.bg-light {
    background: white !important;
    align-items: center;
}

.content-container .content-wrapper > div .nav_extra .right .icon_selector .border {
    border: .5px solid #e2e8f0 !important;
    margin-bottom: 1rem;
}

.content-container .content-wrapper > div .nav_extra .right .icon_selector .row.even.bg-light span:first-of-type {
    padding-left: 0 !important;
}

.content-container .content-wrapper > div .nav_extra .right .icon_selector .row.even.bg-light span input, .content-container .content-wrapper > div .nav_extra .right .icon_selector .row.even.bg-light span .button {
    border-radius: .2rem;
    padding: .25rem !important;
}

.content-container .content-wrapper > div .nav_extra .right .icon_selector .row.even.heading span {
    justify-content: start !important;
    text-align: left !important;
    color: #154273 !important;
}

.content-container .content-wrapper > div .nav_extra .content {
    flex: 0 0 50%;
    max-width: 50%;
    margin-left: auto;
    padding: 1.5rem;
    border-radius: .5rem;
    border: 1px solid #e2e8f0;
}

.content-container .content-wrapper > div .nav_extra .content .specs.specs_info {
    padding: .5rem 0;
    border-bottom: 1px solid #e2e8f0;
}

.content-container .content-wrapper > div .nav_extra .content .specs.specs_info:last-of-type {
    border-bottom: 0;
}

.content-container .content-wrapper > div .nav_extra .right .add_to_cartbutton, .content-container .content-wrapper > div .nav_extra .right p {
    display: inline-block !important;
}

.content-container .content-wrapper > div .nav_extra .right p > .add_to_cartbutton {
    background: #fff !important;
    color: #0077b6 !important;
    border: 2px #0077b6 solid;
}

.table-striped tbody tr:nth-of-type(odd) {
    background: #E9F5FD !important;
}

/* vooraad groen maken */
 .specs_stock .specs_stock {
     color: #007bc7!important;
     margin-bottom: 1rem;
 }


/*WINKELWAGEN EN ACCOUNT MENU GENERIEK*/
.content-container .content-wrapper .producten-lijst > h1 {
    width: 100%;
}

.content-container .content-wrapper .producten-lijst > h1 + br + p {
    width: 100%;
}

.content-container .content-wrapper .producten-lijst > h1 + br + p + p {
    width: 100%;
}

.content-container .content-wrapper .producten-lijst > h1 + br + p + p +  br + br + h3 {
    width: 100%;
}

.content-container .content-wrapper .producten-lijst > h1 + br + style + span {
    width: 100% !important;
}

.content-container .content-wrapper .producten-lijst > h1 + br  + span {
    width: 100% !important;
}

.content-container .content-wrapper .content-marge-4.nav.nav-tabs  {
    margin-top: 2rem;
    border-color: #E2E8F0 ;
}

.content-container .content-wrapper .content-marge-4.nav.nav-tabs a.active  {
    border: none;
    border-bottom: 3px solid #007bc7;
    color: #154273;
}

.winkelwagen-page .content-container .content-wrapper .content-marge-4.nav.nav-tabs a.active  {
    border-bottom: none !important;
}


.content-container .content-wrapper .producten-lijst table#styleid, .content-container .content-wrapper .producten-lijst .table  {
    /*border-collapse: separate;*/
    /*border-spacing: .5rem;*/
}
.content-container .content-wrapper .producten-lijst table#styleid tbody, .content-container .content-wrapper .producten-lijst .table tbody {
    /*border: 1px solid #E2E8F0;*/
    border-radius: .5rem !important;
}
.content-container .content-wrapper .producten-lijst table#styleid th, .content-container .content-wrapper .producten-lijst .table th  {
    /*border: none !important;*/
    color: #154273;
    border-collapse: collapse !important;
    border-color: #fff !important;
}

body:not(.wrapper.bg-white.h-100.account) .content-container .content-wrapper .producten-lijst table#styleid td, body:not(.wrapper.bg-white.h-100.account) .content-container .content-wrapper .producten-lijst .table td {
    /*border: none !important;*/
    color: #154273;
    /*border-collapse: collapse !important;*/
    /*border-color: #fff !important;*/
    padding: 1rem .5rem;
}




/*WINKELWAGEN*/
/*nav*/

.content-container .content-wrapper .content-marge-4.nav.nav-tabs .winkelwagen-icoon  {
    margin-top: -1.5rem;
}
.content-container .content-wrapper .content-marge-4.nav.nav-tabs .winkelwagen-icoon .kleur  {
  font-size: 2.5rem;
  font-weight: 700;
  color: #154273;
}

/*body*/
.content-container .content-wrapper .producten-lijst {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    color: #154273;
    width: 100%;
}


.content-container .content-wrapper .producten-lijst > h5 {
    width: 100%;
    margin-top: 2rem;
    font-weight: 700;
    font-size: 2rem;
}

@media (min-width: 992px) {
    .content-container .content-wrapper .producten-lijst .combined-product-container {
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%;
    }
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok {
    background: #fff !important;
    border-radius: .5rem;
    border-color: #b8daef !important;
    display: flex;
    flex-direction: column;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-1 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    flex: 0 0 100%;
    max-width: 100%;
    order: 2;
    margin-top: -.5rem;
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-1 .winkel-foto {
    flex: 0 0 20% !important;
    max-width: 20% !important;
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-1 .winkel-foto img {
    border: 0 !important;
    background: #EEF7FC ;
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-1 .winkel-beschrijving .winkel-titel {
    font-size: 1.5rem;
    padding-right: 182px;
    /*display: block;*/
    margin-top: 0rem !important;
}


.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: between;
    flex: 0 0 100%;
    max-width: calc(100% - 2rem);
    padding: 1rem;
    /*visibility: hidden;*/
    order: 4;
    
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(div.content)  {
    color: #FBEAD9;
    background-color: #FBEAD9;
    border-radius: .5rem;
    margin: 0 1rem .5rem 1rem;
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(.design_file)  {
    background-color: #E2EDDB;
    min-height: auto !important;
    border-radius: .5rem;
    margin: 0 1rem .5rem 1rem;
    justify-content: end;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(a.basketButton)  {
    color: #FBEAD9;
    background-color: #FBEAD9;
    border-radius: .5rem;
    margin: 0 1rem .5rem 1rem;
    display: flex;
    min-height: auto !important;
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(a.basketButton.hasfile)  {
    background-color: #E2EDDB;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(a.basketButton) > a.basketButton  {
    order: 1;
    margin-left: auto;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(a.basketButton):has(.fa-pencil-paintbrush)  {
    padding: 0 1rem;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(a.basketButton) > p  {
    order: 3;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2:has(a.basketButton) > form  {
    order: 3;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > a.design_file  {
   width: 90%;
   padding-left: 2rem;
   visibility: visible;
   margin-bottom: 1rem;
   
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > a + a  {
   margin-left: 1rem;
   margin-bottom: 1rem;
   /*padding-right: 2rem;*/
   visibility: visible;
   width: calc(10% -3rem);
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > .content {
   margin-left: auto; 
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > .content .producten-lijst  {
   margin-left: 1rem;
   padding-right: 1rem;
   visibility: visible;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > .content .producten-lijst .wls-upload-button {
    color: #007bc7;
    border: 1px solid;
    border-color: #007bc7;
    border-radius: .5rem;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > .content .producten-lijst .wls-upload-button:hover {
    background-color: #EEF7FC;
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > .content .producten-lijst .wls-upload-drop-area {
    background-color: #EEF7FC;
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-2 > p {
    font-size: .8rem;
    background: #EEF7FC;
    color: black;
    border-radius: .5rem;
    padding: 1rem;
    visibility: visible;
    margin-top: 1rem;
    /*margin: 1rem;*/
}

.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-3 {
    display: flex;
    flex-wrap: wrap;
    flex: 0 0 100%;
    max-width: 100%;
    justify-content: end;
    order: 2;
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-3 .aantal-3 .kleur {
    font-size: 1.5rem;
    margin-top: 0rem;
    margin-top: -1.5rem;
    display: block;
    /*padding-right: .5rem;*/
}
.content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-4 {
    order: 1;
    margin-top: 0 !important;
    margin-bottom: -2rem !important;
    border-top: 0 !important;
    display: flex;
    justify-content: end;
    padding-right: 1rem;
    z-index: 50;
}

/*price overview*/
.content-container .content-wrapper .producten-lijst > .waarde {
    /*flex: 0 0 33.3333%;*/
    /*max-width: 33.33333%;*/
    /*position: absolute;*/
    /*right: 0;*/
    /*top:0;*/
    /*padding-left: 3rem;*/
    /*margin-top: 2rem;*/
}

/*provide index*/
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(4) { --index:1;  }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(5) { --index:2; }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(6) { --index:3 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(7) { --index:4 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(8) { --index:5 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(9) { --index:6 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(10) { --index:7 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(11) { --index:8 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(12) { --index:9 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(13) { --index:10 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(14) { --index:11 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(15) { --index:12 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(16) { --index:13 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(17) { --index:14 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(18) { --index:15 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(19) { --index:16 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):nth-of-type(20) { --index:17 }
.content-container .content-wrapper .producten-lijst > div.waarde:not(.combined-product-container):last-of-type { border-bottom: 1px solid; }

/*per index, up the distance from top*/
.content-container .content-wrapper .producten-lijst > div.waarde:nth-of-type(n) { 
    /*margin-top: calc(var(--index) * 30px);*/
}

 /*co2 calculator */
.content-container .content-wrapper .producten-lijst .co2-calculator {
    /*top: 0;*/
    /*flex: 0 0  33.3333%;*/
    /*min-width: 31%;*/
    /*position: absolute;*/
    /*right: 0;*/
    /*margin-top: 22%;*/
}






/* Ensure the container has relative positioning for absolute children */
.content-container .content-wrapper {
    position: relative !important;
}

@media (min-width: 992px) {
/* Better approach: Stack all waarde elements using absolute positioning */
.winkelwagen-page .content-container .content-wrapper .producten-lijst .waarde {
    position: absolute !important;
    right: 20px !important;
    width: 320px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    background: transparent !important;
    z-index: 1000;
}

.content-container .content-wrapper .producten-lijst .waarde:has(.waarde_subtotal) {
    top: 80px;
    background: #ffffff !important;
    border: 1px solid #BCDFF1;
    border-bottom: none;
    border-radius: .5rem .5rem 0 0;
    padding: 1rem !important;
}

.content-container .content-wrapper .producten-lijst > div.waarde:has(.waarde_sendcosts) { 
    top: 130px; 
    padding: 0 1rem !important; 
    background: #ffffff !important;
    border-left: 1px solid #BCDFF1;
    border-right: 1px solid #BCDFF1;
}

.content-container .content-wrapper .producten-lijst > div.waarde:has(.waarde_total_ext_vat) { 
    top: 171px; padding: 0 15px !important; 
    background: #ffffff !important;
    border-left: 1px solid #BCDFF1;
    border-right: 1px solid #BCDFF1;
}

.content-container .content-wrapper .producten-lijst > div.waarde:has(.waarde_vat) { 
    top: 212px; padding: 0 15px !important; 
    background: #ffffff !important;
    border-left: 1px solid #BCDFF1;
    border-right: 1px solid #BCDFF1;
}

.content-container .content-wrapper .producten-lijst > div.waarde.waarde_total_inc_vat { 
    top: 252px; padding: 0 15px !important; 
    background: #ffffff !important;
    border: 1px solid #BCDFF1;
    border-top: none;
    border-radius: 0 0 .5rem .5rem;
}

/* Style the individual price rows */
.content-container .content-wrapper .producten-lijst .waarde-2 {
    background: transparent !important;
    padding: 8px 0 !important;
    margin: 0 !important;
    border-bottom: 1px solid #BCDFF1 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

/* Special styling for total */
.content-container .content-wrapper .producten-lijst .waarde_total_inc_vat .waarde-2 {
    border-top: 2px solid #000 !important;
    border-bottom: none !important;
    padding-top: 12px !important;
    margin-top: 8px !important;
}

.waarde_total_inc_vat .waarde-2 .title,
.waarde_total_inc_vat .waarde-2 .price {
    /*color: #007bff !important;*/
    font-weight: bold !important;
    font-size: 1.1em !important;
}

/* Improve text styling */
.content-container .content-wrapper .producten-lijst > .waarde .title {
    /*font-size: 0.9em;*/
    /*color: #6c757d;*/
}

.content-container .content-wrapper .producten-lijst > .waarde .price {
    font-weight: 600 !important;
    /*color: #212529;*/
}

.content-container .content-wrapper .producten-lijst > .waarde .price.free {
    color: #28a745 !important;
    font-weight: bold !important;
}

/* CO2 calculator positioning */
.co2-calculator {
    position: absolute !important;
    top: 420px !important;
    right: 20px !important;
    width: 320px !important;
    z-index: 1000 !important;
    margin: 0 !important;
}

/* Adjust main content to not overlap with absolute price list */
.content-wrapper {
    position: relative;
    margin-right: 360px;
}
}

/* Responsive design */
@media screen and(max-width: 992px) {
    .waarde {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        width: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
        background: #f8f9fa !important;
    }

    .waarde:first-of-type {
        background: #ffffff !important;
        border: 1px solid #BCDFF1;
        border-radius: 8px;
        margin-bottom: 10px;
    }

    .co2-calculator {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        width: auto !important;
        margin: 20px auto !important;
    }

    .content-wrapper {
        margin-right: 0;
    }

    .waarde-2 {
        border-bottom: 1px solid #dee2e6 !important;
    }
}

@media (max-width: 992px) {
    .waarde {
        width: 100% !important;
    }
    
    .waarde:first-of-type::before {
        font-size: 1em;
    }
}

/* Hide offset classes in fixed mode */
@media (min-width: 992px) {
    .waarde.offset-md-7 {
        margin-left: 0 !important;
    }
}







/*stap 2*/
@media (min-width: 992px) {
    .winkelwagen-page .content-container {
        min-height: 900px !important;
    }
}

.winkelwagen-page-2 .content-container .content-wrapper .producten-lijst > div.waarde .waarde-2 .title {
    text-align: left !important;
}

.winkelwagen-page-2 .content-container .content-wrapper .producten-lijst .waarde.lead {
    /*margin-top: 0 !important;*/
    /*padding-top: 0 !important;*/
}

.winkelwagen-page-2 .content-container .content-wrapper .producten-lijst .waarde {
    position: relative !important;
}

.winkelwagen-page-2 #deliveryBox {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 320px;
    padding: 1rem;
    border: 1px solid #BCDFF1;
    border-radius: .5rem;
}

.winkelwagen-page-2 #takeawayBox {
    display: block;
    position: absolute;
    top: 400px;
    right: 0;
    width: 320px;
    padding: 1rem;
    border: 1px solid #BCDFF1;
    border-radius: .5rem;
}

.winkelwagen-page-2 .addressBox {
    display: block;
    position: absolute;
    top: 300px;
    right: 0;
    width: 320px;
    padding: 1rem;
    border: 1px solid #BCDFF1;
    border-radius: .5rem;
}

.winkelwagen-page-2 .basketLeft h1 {
    display: none;
}

.winkelwagen-page .content-container .content-wrapper .producten-lijst .waarde:nth-of-type(1){
    margin-left: .5rem !important;
}

.winkelwagen-page-2 .waarde.mt-5.pt-5[style*="border-top: none"] {
    display: none !important;
}

.winkelwagen-page-2 .content-container .content-wrapper .producten-lijst 
form:not([name="address"]):not([class*="basketUpload"]){
    width: calc(100% - 420px);
    padding: 1rem;
    border-radius: .5rem;
    border: 1px solid #BCDFF1;
    margin: -4.6rem 0 2rem 0;
    display: flex;
    justify-content: space-between;
}

.winkelwagen-page-2 form .delivery {
    width: auto !important;
    flex:1;
    padding: 1rem !important;
    margin: 0 .5rem 0 0 !important;
    border: 1px solid #BCDFF1;
    border-radius: .5rem;
    background: url('/files/public/fck/1/overheid%20content/Shoppingcart/delivery%20house.png') center 25px no-repeat;
    background-size: 4rem;
    height: 10rem;
    font-size: 0px;
}

.winkelwagen-page-2 form .delivery b {
    width: 100%;
    text-align: center;
    margin-top: 6rem;
    display: block;
    font-size: 1rem;
}

.winkelwagen-page-2 form .deliveryshared {
    width: auto !important;
    flex:1;
    padding: 1rem !important;
    margin: 0 0 0 .5rem !important;
    border: 1px solid #BCDFF1;
    border-radius: .5rem;
    background-image: 
        url('/files/public/fck/1/overheid%20content/Shoppingcart/delivery%20house.png'), 
        url('/files/public/fck/1/overheid%20content/Shoppingcart/delivery%20house.png'), 
        url('/files/public/fck/1/overheid%20content/Shoppingcart/delivery%20house.png') ;
    background-position: 
        20% 25px,
        50% 25px,
        80% 25px;
    background-repeat: no-repeat;
    background-size: 4rem;;
    height: 10rem;
    font-size: 0px;
}

.winkelwagen-page-2 form .deliveryshared b {
    width: 100%;
    text-align: center;
    margin-top: 6rem;
    display: block;
    font-size: 1rem;
}

.winkelwagen-page-2 form  .deliveryInfo2Box.alert.alert-warning {
    font-size: 1rem;
    margin-top: 2rem;
    background:#E9F5FD;
    border-color:#E9F5FD ;
    border-radius: 0.625rem;
    color:#0A2750;
    padding-left: 3rem;
}

.winkelwagen-page-2 form  .deliveryInfo2Box.alert.alert-warning:after {
    content: 'i';
    padding: .2rem .5rem;
    background: #007BC7;
    border-radius: .1rem;
    color: #ffffff !important;
    position: absolute;
    top: 1rem;
    left: 1rem;
    font-size: .6rem;
}

.winkelwagen-page-2 .content-container .content-wrapper .producten-lijst .vorig-verder {
    position: relative;
    margin-top: 0 !important;
    width: calc(100% - 420px);
}

/* stap 3 */
.content-container .content-wrapper .producten-lijst > form .payment_methods, .content-container .content-wrapper .producten-lijst > form .payment-methods {
    display: none;
}

.content-container .content-wrapper .producten-lijst form .producten-lijst .combined-product-container .winkelwagen-product-blok .winkel-blok-1 {
    margin-top: 2.5rem !important;
}

.content-container .content-wrapper .producten-lijst form .producten-lijst .producten-lijst .order-reference {
    flex: 0 0 66.66666667%;
    max-width: 66.66666667%;
    margin: 2rem 0;
    background: #EEF7FC;
    padding: 1rem;
    display: flex;
    align-items: center;
    border-radius: .5rem;
}

.content-container .content-wrapper .producten-lijst form .producten-lijst .producten-lijst .order-reference tbody {
    width: 100%;
}

.content-container .content-wrapper .producten-lijst form .producten-lijst .producten-lijst .order-reference tbody tr {
    width: 100%;
    display: grid;
}

.content-container .content-wrapper .producten-lijst form .producten-lijst .producten-lijst .order-reference #order_reference {
    margin-left: auto;
    border-radius: .5rem;
}

.content-container .content-wrapper .producten-lijst > table {
    width: 100%;
}
.content-container .content-wrapper .producten-lijst > .empty_basket {
    width: 100%;
}
form[name="basket"] .addressBox:not(.col-lg-6) {
    display: none !important;
} 
/*vorig verder*/
@media (min-width: 992px) {
    .winkelwagen-page-1 .content-container .content-wrapper .producten-lijst .vorig-verder, .winkelwagen-page-3 .content-container .content-wrapper .producten-lijst .vorig-verder {
        width: 100%;
        width: 320px;
        margin-right: 1.2rem;
        margin-top: 325px !important;
        top: 0;
        right: 0;
        position: absolute;
    }
}

/* receipt step 3 */
.winkelwagen-page-3 .content-container .content-wrapper .producten-lijst .waarde:has(.waarde_subtotal) {
    top: 220px;
}

.winkelwagen-page-3 .content-container .content-wrapper .producten-lijst > div.waarde:has(.waarde_sendcosts) { 
    top: 271px; 
}

.winkelwagen-page-3 .content-container .content-wrapper .producten-lijst > div.waarde:has(.waarde_total_ext_vat) { 
    top: 312px;
}

.winkelwagen-page-3 .content-container .content-wrapper .producten-lijst > div.waarde:has(.waarde_vat) { 
    top: 353px;
}

.winkelwagen-page-3 .content-container .content-wrapper .producten-lijst > div.waarde.waarde_total_inc_vat { 
    top: 393px;
}

.winkelwagen-page-3 .co2-calculator {
    top: 590px !important;
}

.winkelwagen-page-3 .content-container .content-wrapper .producten-lijst {
    position: static !important;
}

.winkelwagen-page-3 .content-container .content-wrapper .producten-lijst .vorig-verder {
    margin-top: 490px !important;
    margin-right: 1.2rem;
}

.winkelwagen-page-3 .content-wrapper {
    min-height: 800px !important;
}


/* NAV winkelwagen styling */
.winkelwagen-page .content-marge-4.nav.nav-tabs {
    border: none;
    background: none;
    /*display: flex;*/
    /*align-items: center;*/
    /*justify-content: center;*/
    position: relative;
    padding: 2rem 0;
    /*max-width: 600px;*/
    /*margin: 0 auto;*/
}

/* Hide default bootstrap tab styling */
.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop {
    border: none;
    background: none;
    color: #999;
    text-decoration: none;
    position: relative;
    display: flex;
    flex-direction: column;
    /*align-items: start;*/
    margin: 0;
    padding: 0;
    flex: 1;
    font-size: 16px;
    font-weight: 500;
    max-width: 150px;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop:nth-child(2) {
    align-items: center;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop:nth-child(3) {
    align-items: end;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop:hover {
    border: none;
    /*background: none;*/
    color: #999;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop.active {
    background: none;
    border: none;
    color: #28a745;
}

/* Create circular indicators using ::before pseudo-element */
.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop::before {
    content: '';
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: white;
    border: 2px solid #e0e0e0;
    display: block;
    margin-bottom: 10px;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}

/* Active step styling */
.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop.winkelwagen-knop-active::before {
    background: #28a745;
    border-color: #28a745;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop.winkelwagen-knop-active {
    color: #28a745;
    font-weight: 600;
}

/* Completed step styling (will be added via JavaScript) */
.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop.completed {
    color: #28a745;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop.completed::before {
    background: #28a745;
    border-color: #28a745;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop.completed::after {
    content: '✓';
    position: absolute;
    top: 1px;
    left: 5px;
    /*transform: translateX(-50%);*/
    color: white !important;
    font-size: 16px;
    font-family: sans-serif;
    /*font-weight: bold;*/
    z-index: 3;
}

.winkelwagen-page .content-marge-4.nav.nav-tabs .winkelwagen-knop:nth-child(2).completed::after {
    left: 68px;
}

.content-marge-4.nav.nav-tabs .winkelwagen-knop:nth-child(2).completed::after {}


/* Create connecting lines using ::after on the container */
.winkelwagen-page .content-marge-4.nav.nav-tabs::before {
    content: '';
    position: absolute;
    top: 55%;
    left: 0px;
    /*right: 25%;*/
    width: 450px;
    height: 3px;
    background: #e0e0e0;
    transform: translateY(-25px);
    z-index: 1;
}

/* Progress line states - will be controlled by JavaScript */
.winkelwagen-page .content-marge-4.nav.nav-tabs.step-1::before {
    background: linear-gradient(to right, #e0e0e0 100%);
}

.winkelwagen-page .content-marge-4.nav.nav-tabs.step-2::before {
    background: linear-gradient(to right, #28a745 50%, #e0e0e0 50%);
}

.winkelwagen-page .content-marge-4.nav.nav-tabs.step-3::before {
    background: linear-gradient(to right, #28a745 100%);
}

/* Winkelwagen icon styling */
.winkelwagen-icoon {
    position: absolute;
    top: -2rem;
    /*left: 50%;*/
    /*transform: translateX(-50%);*/
    /*text-align: center;*/
}

.winkelwagen-icoon .kleur {
    color: #28a745;
    font-weight: 600;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .content-marge-4.nav.nav-tabs .winkelwagen-knop::before {
        width: 40px;
        height: 40px;
    }
    
    .content-marge-4.nav.nav-tabs .winkelwagen-knop.completed::after {
        top: 12px;
        font-size: 16px;
    }
    
    .content-marge-4.nav.nav-tabs .winkelwagen-knop {
        font-size: 14px;
    }
    
    .content-marge-4.nav.nav-tabs::before {
        transform: translateY(-20px);
        left: 20%;
        right: 20%;
    }
}

.winkelwagen-page .invoice-address {
    border: 1px solid #e2e8f0;
    border-radius: .5rem;
    padding: 1rem;
    margin-top: 2rem;
}


.winkelwagen-page .content-container .content-wrapper .producten-lijst .combined-product-container .winkelwagen-product-blok .addressBox {
    padding: 0 !important;
}


/* uit gezet door henkjan /* 9-4-26

/*for table border styling
.account .content-container .content-wrapper table  {
    border-collapse: separate;
    border-spacing: 0 10px;
    width: 100%;
}

*/

/* general styling */
.account .content-container .content-wrapper table .order-table-row-extended_specification {
    white-space: nowrap;
}

.account .content-container .content-wrapper table tr:first-of-type:has(td[style]) {
    font-weight: bold;
}

.account .content-container .content-wrapper  table tr:first-of-type td:nth-of-type(2) {
    /*color: orange;*/
    display: inline-block;
    border-radius: .2rem;
    /*padding-left: 1rem;*/
    /*padding-right: 1rem;*/
    white-space: nowrap;
}

.account .content-container .content-wrapper  table tr:nth-of-type(11) td, .account .content-container .content-wrapper  table tr:nth-of-type(10) td {
    font-weight: bold;
    padding-left: 1rem !important;
}

.account .content-container .content-wrapper  table tr:nth-of-type(n+12):has(td div img), .account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) {
    border: 1px solid blue;
    border-radius: .5rem;
    
}

/*border styling*/
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td {
    margin-bottom: 1rem !important;
    padding: 1rem  !important;
    border-left:0 !important;
    border-right:0 !important;
    border-top: 1px solid #E2E8F0;
    border-bottom: 1px solid #E2E8F0;
    
}
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:first-child {
    border-left: 1px solid #E2E8F0 !important;
    border-radius: .5rem 0 0 .5rem;
    
}
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:last-child {
    margin-bottom: 1rem !important;
    padding: 1rem  !important;
    border-right: 1px solid #E2E8F0 !important;
    border-radius: 0 .5rem .5rem 0;
}

/* column widths */
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:nth-child(2) {
    width: 5%;
}
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:nth-child(3) {
    width: 90%;
    /*line-height: 2.5;*/
    /*word-spacing: 1rem;*/
    /*white-space: pre;*/
    /*display: flex;*/
    /*flex-wrap: wrap;*/
}
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:nth-child(3) a {
    margin-top: 0;
}
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:nth-child(3) b {
    display: block;
}
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:nth-child(3) br {
  /*  width: 10px;*/
  /*  height: 10px;*/
  /*  display: contents;*/
  /*content: ' ';*/
  /*  padding: 0 3px;*/
  /*  word-spacing: 1rem;*/
    
}
.account .content-container .content-wrapper  table tr:nth-of-type(n+11):has(td div img) td:nth-child(3) br:after {
    /*width: 100%;*/
    content: ', ';
    display: block;
    position: relative;
    width: 10px;
    height: 10px;
}


/*FOOTER*/
.footer-a {
    background: #fff !important;
}












/*  Henkjan picture swap*/

/*.image-swap-container {*/
/*      position: relative;*/
/*      overflow: hidden;*/
/*      display: block;*/
/*    }*/
    
/*.image-swap-container img {*/
/*      width: 100%;*/
/*      display: block;*/
/*      transition: opacity 0.4s ease;*/
/*    }*/
    
/*.image-swap-container .primary-image {*/
/*      position: relative;*/
/*      z-index: 1;*/
/*    }*/
    
/*.image-swap-container .secondary-image {*/
/*      position: absolute;*/
/*      top: 0;*/
/*      left: 0;*/
/*      opacity: 0;*/
/*      z-index: 2;*/
/*    }*/
    
/*.image-swap-container:hover .primary-image {*/
/*      opacity: 0;*/
/*    }*/
    
/*.image-swap-container:hover .secondary-image {*/
/*      opacity: 1;*/
/*}*/
/*   Henkjan picture swap*/
  
/*img.thumbSelector.p-2.h-100 {*/
/*    height: 200px !important;*/
/*    max-width: 100% !important;*/
/*    object-fit: cover;*/
/*    padding: 0 !important;*/
/*    width: 100% !important;*/
/*    max-height: 100% !important;*/
/*}*/

/* .carousel-control-next, .carousel-control-prev, ol.carousel-indicators {*/
/*    display: none;*/
/*}*/
/*.carousel-item {*/
/*padding: 15px;*/
/*}*/
/* .login-container img.mx-auto.my-5.px-0.col-md-5.d-block {*/
/*    max-width: 20rem;*/
/*}*/
/* .logo img {*/
/*    max-height: 50px !important;*/
/*    margin-left: 1rem;*/
/*}*/
/*.shopping-cart a.d-block.font-weight-bold.text-black {*/
/*    margin-top: 8px;*/
/*}*/
/*a.inlog-registratie-kleur.small.text-black {*/
/*    visibility: hidden;*/
/*}*/
/* .shopping-cart:before {*/
/*  content: "f07a" !important; /* This is the Unicode for fa-shopping-cart 
  /*position: absolute;*/
/*  width: 2rem;*/
/*}*/
/*
.sticky-top.border-top.border-bottom.border-opace.bg-white {
    border-top: 0 !important;
}
.dropdown-toggle:after {
    display: inline-block;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
}
.justify-content-between{
    justify-content: normal !important;
}

.banner-image {
    margin: 1rem;
}
.carousel-control-next, .carousel-control-prev {
    z-index: 5000 !important;
    height: 94% !important;

}
cssCopy/* Remove card styling and borders 
.categorie-div.card {
  border: none;
  box-shadow: none;
  cursor: pointer;
}

 Adjust title position - move below image 
.categorie-div .categorie-titel {
  order: 2;
  height: auto !important;
  padding: 8px 0 !important;
  text-align: left;
  background-color: transparent !important;
}

 Style the title text 
.categorie-div .categorie-titel b.card-title {
  font-size: 16px;
  font-weight: 600;
}

 Adjust image container 
.categorie-div .categorie-foto {
  order: 1;
  padding: 0;
}

 Fix image sizing 
.categorie-div .categorie-foto img {
  height: 200px !important;
  max-width: 100% !important;
  object-fit: cover;
  padding: 0 !important;
}

 Style the button 
.categorie-div .categorie-meer-info {
  order: 3;
  text-transform: uppercase;
  font-size: 14px;
  padding: 8px 20px !important;
  margin: 5px 0 !important;
  text-align: center;
  width: auto;
  display: inline-block;
  border-color: #d41e2b;
}


 Rearrange the card layout to match target design 
.categorie-div.card {
  display: flex;
  flex-direction: column;
}
 Remove border from parent container 
.col-12.col-sm-6.col-md-4.col-lg-3.my-2 {
  border: none;
}

 Remove all borders from all elements in the card structure 
.categorie-div-container .col-12 > div,
.categorie-div-container .categorie-div,
.categorie-div-container .categorie-foto a,
.categorie-div-container .categorie-foto {
  border: none !important;
  box-shadow: none !important;
}

 Remove any remaining padding/margin that may be creating space for borders 
.categorie-div-container .col-12 {
  padding: 10px;
}

 Force full-width buttons and proper background 
.categorie-meer-info {
  display: block !important;
  width: 100% !important;
  border-radius: 0 !important;
}

 Ensure image takes full container width 
.categorie-foto img {
  width: 100% !important;
}

header.card-header.d-flex.justify-content-between, .gekozen_product header.card-header {
    background-color: #737373;
    color: white;
}
.custom-radio .custom-control-input:checked~.custom-control-label:after {
     background-image: url(data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23FFF'/%3E%3C/svg%3E); 
    background: none;
}
input.amount_other.input-group-append.btn.btn-outline-primary, btn-green {
    background: #d92231 linear-gradient(180deg, #df4350, #d92231) repeat-x;
    border-color: #d92231;
    color: #fff;
}
  Image hover effect  

.hovereffect {
width:100%;
float:left;
overflow:hidden;
position:relative;
text-align:center;
cursor:default;
}

.hovereffect .overlay {
width:100%;
height:100%;
position:absolute;
overflow:hidden;
top:0;
left:0;
opacity:0;
background-color: rgba(66, 187, 230, 0.24);
-webkit-transition:all .4s ease-in-out;
transition:all .4s ease-in-out
}

.hovereffect img {
display:block;
position:relative;
-webkit-transition:all .4s linear;
transition:all .4s linear;
}

.hovereffect h2 {
text-transform:uppercase;
color:#fff;
text-align:center;
position:relative;
font-size:17px;
background: #00458e;
-webkit-transform:translatey(-100px);
-ms-transform:translatey(-100px);
transform:translatey(-100px);
-webkit-transition:all .2s ease-in-out;
transition:all .2s ease-in-out;
padding:10px;
FONT-WEIGHT: BOLD;
}

.hovereffect a.info {
text-decoration:none;
display:inline-block;
text-transform:uppercase;
color: #ff9800;
border: 2px solid #ff9800;
font-weight: bold;
background-color:#ffffffd1;
opacity:0;
filter:alpha(opacity=0);
-webkit-transition:all .2s ease-in-out;
transition:all .2s ease-in-out;
margin:50px 0 0;
padding:7px 14px;
}

.hovereffect a.info:hover {
box-shadow:0 0 5px #fff;
}

.hovereffect:hover img {
-ms-transform:scale(1.2);
-webkit-transform:scale(1.2);
transform:scale(1.2);
}

.hovereffect:hover .overlay {
opacity:1;
filter:alpha(opacity=100);
}

.hovereffect:hover h2,.hovereffect:hover a.info {
opacity:1;
filter:alpha(opacity=100);
-ms-transform:translatey(0);
-webkit-transform:translatey(0);
transform:translatey(0);
}

.hovereffect:hover a.info {
-webkit-transition-delay:.2s;
transition-delay:.2s;
}

  END Image hover effect  
 
  Begin inlogveld weg halen (lijkt alleen voor chrome te verschijnen) 
 section.card.p-4.my-2.col-12.col-lg-12.border-0 {
    display: none;
}

eind 
body {
    overflow-x: hidden;
}
*/

img.thumbSelector.mx-auto {
  display: block; !important;
  height: 11.5rem !important;
}

.recommended.badge.badge-primary.position-absolute {
  background: green;
}

div.login-content.rounded.p-2.col-md-7.mx-auto.mt-5 div a.vorig-verder-knop.verder-pijltje.btn.btn-primary {
  display: block !important;
  margin: 10px 5px 0 0 !important;
}

input.delivery-header.col-6.font-weight-bold.flatpickr-input {
  max-width: 60%;
}