/* Dreambedden mobiel menu */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');

/* ===============================
   BASIS
================================ */
#mobile-header-canvas,
#mobile-header-canvas *::before,
#mobile-header-canvas *::after {
    box-sizing: border-box !important;
}

#mobile-header-canvas,
#mobile-header-canvas a,
#mobile-header-canvas span,
#mobile-header-canvas div,
#mobile-header-canvas li,
#mobile-header-canvas button,
#mobile-header-canvas h3,
#mobile-header-canvas ul,
#mobile-header-canvas nav,
#mobile-header-canvas p {
    font-family: 'Montserrat', sans-serif !important;
}

/* ===============================
   FONT AWESOME SUPPORT
================================ */
#mobile-header-canvas i,
#mobile-header-canvas span[class*="fa"] {
    font-style: normal !important;
    text-rendering: auto !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    line-height: 1 !important;
}

#mobile-header-canvas .fa,
#mobile-header-canvas .fas,
#mobile-header-canvas .fa-solid {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 7 Free", "FontAwesome" !important;
    font-weight: 900 !important;
}

#mobile-header-canvas .far,
#mobile-header-canvas .fa-regular {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "Font Awesome 7 Free", "FontAwesome" !important;
    font-weight: 400 !important;
}

#mobile-header-canvas .fab,
#mobile-header-canvas .fa-brands {
    font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands", "Font Awesome 7 Brands" !important;
    font-weight: 400 !important;
}

/* ===============================
   CELIK TOGGLES UIT
================================ */
#mobile-header-canvas .toggle-submenu,
#mobile-header-canvas .menu-arrow,
#mobile-header-canvas .submenu-arrow,
#mobile-header-canvas .menu-item > .toggle-icon {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}

/* ===============================
   FULLSCREEN WRAPPER
================================ */
#mobile-header-canvas.dreambedden-mobile-canvas {
    position: fixed !important;
    inset: 0 !important;
    background: #fff !important;
    z-index: 99999 !important;
}

#mobile-header-canvas.dreambedden-mobile-canvas,
#mobile-header-canvas.dreambedden-mobile-canvas .offcanvas-content,
#mobile-header-canvas.dreambedden-mobile-canvas .mobile-header-screen-inner {
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
}

#mobile-header-canvas .offcanvas-content {
    height: 100dvh !important;
    min-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: #fff !important;
}

#mobile-header-canvas .dreambedden-mobile-menu-wrap {
    height: 100dvh !important;
    min-height: 100dvh !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    background: #fff !important;
}

/* ===============================
   HEADER VAST
================================ */
#mobile-header-canvas .dreambedden-mobile-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 22px !important;
    min-height: 56px !important;
    border-bottom: 1px solid #e7e7e7 !important;
    background: #fff !important;
    flex: 0 0 auto !important;
}

#mobile-header-canvas .dreambedden-mobile-header h3 {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    line-height: 1 !important;
    color: #111 !important;
}

#mobile-header-canvas .celik-close-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    line-height: 1 !important;
    min-height: 0 !important;
    height: auto !important;
    cursor: pointer !important;
}

#mobile-header-canvas .celik-close-btn .button-title {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    line-height: 1 !important;
    color: #111 !important;
}

#mobile-header-canvas .celik-close-btn svg,
#mobile-header-canvas .celik-close-btn i {
    width: 14px !important;
    height: 14px !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ===============================
   SCROLLBAAR MENU GEBIED
================================ */
#mobile-header-canvas .dreambedden-mobile-panels {
    position: relative !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: #fff !important;
}

#mobile-header-canvas .dreambedden-panel {
    position: absolute !important;
    inset: 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    background: #fff !important;
    transform: translateX(100%) !important;
    transition: transform .28s ease !important;
    padding: 0 !important;
    margin: 0 !important;
}

#mobile-header-canvas .dreambedden-panel.is-active {
    transform: translateX(0) !important;
    pointer-events: auto !important;
}

#mobile-header-canvas .dreambedden-panel:not(.is-active) {
    pointer-events: none !important;
}

#mobile-header-canvas .dreambedden-panel-root {
    transform: translateX(0) !important;
}

/* ===============================
   MENU RESET
================================ */
#mobile-header-canvas .dreambedden-mobile-nav,
#mobile-header-canvas .dreambedden-mobile-nav ul,
#mobile-header-canvas .dreambedden-mobile-nav li,
#mobile-header-canvas .dreambedden-submenu-list,
#mobile-header-canvas .dreambedden-submenu-list li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    background: transparent !important;
}

#mobile-header-canvas .dreambedden-mobile-nav > ul,
#mobile-header-canvas .dreambedden-submenu-list {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mobile-header-canvas .dreambedden-mobile-nav > ul > li,
#mobile-header-canvas .dreambedden-submenu-list > li {
    position: relative !important;
    display: block !important;
    min-height: 0 !important;
    height: auto !important;
    border-bottom: 1px solid #efefef !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mobile-header-canvas .dreambedden-mobile-nav > ul > li::before,
#mobile-header-canvas .dreambedden-mobile-nav > ul > li::after,
#mobile-header-canvas .dreambedden-submenu-list > li::before,
#mobile-header-canvas .dreambedden-submenu-list > li::after {
    display: none !important;
    content: none !important;
}

/* ===============================
   MENU LINKS COMPACT
================================ */
#mobile-header-canvas .dreambedden-mobile-nav > ul > li > a[href]:not(.toggle-submenu),
#mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu) {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 50px !important;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 48px 0 20px !important;
    border: 0 !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    color: #111 !important;
    text-decoration: none !important;
    background: transparent !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    box-shadow: none !important;
}

#mobile-header-canvas .dreambedden-mobile-nav > ul > li > a[href]:not(.toggle-submenu):hover,
#mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu):hover {
    background: #fcfcfc !important;
    color: #000 !important;
}

#mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu) {
    min-height: 46px !important;
    height: 46px !important;
    font-size: 14px !important;
}

/* ===============================
   MENU ICONEN
================================ */
#mobile-header-canvas .dreambedden-mobile-nav > ul > li > a[href]:not(.toggle-submenu) i,
#mobile-header-canvas .dreambedden-mobile-nav > ul > li > a[href]:not(.toggle-submenu) span[class*="fa"],
#mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu) i,
#mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu) span[class*="fa"] {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 15px !important;
    line-height: 1 !important;
    width: 18px !important;
    min-width: 18px !important;
    text-align: center !important;
    color: inherit !important;
    vertical-align: middle !important;
    flex: 0 0 18px !important;
}

/* ===============================
   SUBMENU PIJL
================================ */
#mobile-header-canvas .dreambedden-arrow {
    position: absolute !important;
    top: 50% !important;
    right: 12px !important;
    transform: translateY(-50%) !important;
    width: 20px !important;
    height: 20px !important;
    min-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    font-size: 0 !important;
    line-height: 1 !important;
}

#mobile-header-canvas .dreambedden-arrow::before {
    content: "›" !important;
    display: block !important;
    font-family: Arial, sans-serif !important;
    font-size: 22px !important;
    line-height: 1 !important;
    color: #b9b9b9 !important;
    margin: -1px 0 0 0 !important;
}

/* ===============================
   SUBMENU HEADER
================================ */
#mobile-header-canvas .dreambedden-submenu-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 5 !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 16px 22px !important;
    border-bottom: 1px solid #e7e7e7 !important;
    background: #fff !important;
}

#mobile-header-canvas .dreambedden-back-btn {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    color: #111 !important;
    cursor: pointer !important;
}

#mobile-header-canvas .dreambedden-submenu-title {
    margin: 0 !important;
    padding: 0 !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    color: #111 !important;
}

/* ===============================
   FOOTER VAST ONDERAAN
================================ */
#mobile-header-canvas .mobile-header-bottom {
    flex: 0 0 auto !important;
    display: block !important;
    margin: 0 !important;
    padding: 12px 20px 18px !important;
    border-top: 1px solid #e7e7e7 !important;
    background: #fff !important;
    position: relative !important;
    z-index: 5 !important;
}

#mobile-header-canvas .mobile-header-bottom .social-links {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    margin: 0 !important;
    padding: 0 !important;
}

#mobile-header-canvas .mobile-header-bottom .social-links a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    text-decoration: none !important;
    color: #111 !important;
    line-height: 1 !important;
}

#mobile-header-canvas .mobile-header-bottom .social-links i,
#mobile-header-canvas .mobile-header-bottom .social-links svg {
    font-size: 18px !important;
    width: 18px !important;
    height: 18px !important;
}

/* ===============================
   MOBIEL FIJNAFSTEMMING
================================ */
@media (max-width: 767px) {
    #mobile-header-canvas .dreambedden-mobile-header {
        padding: 15px 20px !important;
        min-height: 54px !important;
    }

    #mobile-header-canvas .dreambedden-mobile-nav > ul > li > a[href]:not(.toggle-submenu) {
        min-height: 48px !important;
        height: 48px !important;
        padding: 0 46px 0 18px !important;
        font-size: 14px !important;
    }

    #mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu) {
        min-height: 44px !important;
        height: 44px !important;
        padding: 0 46px 0 18px !important;
        font-size: 13px !important;
    }

    #mobile-header-canvas .dreambedden-mobile-nav > ul > li > a[href]:not(.toggle-submenu) i,
    #mobile-header-canvas .dreambedden-mobile-nav > ul > li > a[href]:not(.toggle-submenu) span[class*="fa"],
    #mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu) i,
    #mobile-header-canvas .dreambedden-submenu-list > li > a[href]:not(.toggle-submenu) span[class*="fa"] {
        font-size: 14px !important;
        width: 16px !important;
        min-width: 16px !important;
        flex: 0 0 16px !important;
    }

    #mobile-header-canvas .dreambedden-arrow {
        right: 12px !important;
        width: 20px !important;
        height: 20px !important;
        min-height: 20px !important;
    }

    #mobile-header-canvas .dreambedden-arrow::before {
        font-size: 22px !important;
    }

    #mobile-header-canvas .mobile-header-bottom {
        padding: 12px 18px 16px !important;
    }
}


#mobile-header-canvas {
    --dreambedden-bottom-links-h: 110px;
}

/* Scrollbaar middenstuk opnieuw berekenen */
#mobile-header-canvas .dreambedden-mobile-panels {
    height: calc(
        var(--dreambedden-viewport-h)
        - var(--dreambedden-header-h)
        - var(--dreambedden-bottom-links-h)
        - var(--dreambedden-footer-h)
    ) !important;
    min-height: calc(
        var(--dreambedden-viewport-h)
        - var(--dreambedden-header-h)
        - var(--dreambedden-bottom-links-h)
        - var(--dreambedden-footer-h)
    ) !important;
    max-height: calc(
        var(--dreambedden-viewport-h)
        - var(--dreambedden-header-h)
        - var(--dreambedden-bottom-links-h)
        - var(--dreambedden-footer-h)
    ) !important;
}

/* Vaste links boven footer */
#mobile-header-canvas .dreambedden-bottom-links {
    flex: 0 0 auto !important;
    background: #fff !important;
    border-top: 1px solid #e7e7e7 !important;
}

#mobile-header-canvas .dreambedden-bottom-link {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 48px !important;
    padding: 0 20px !important;
    border-bottom: 1px solid #efefef !important;
    color: #111 !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    background: #fff !important;
}

#mobile-header-canvas .dreambedden-bottom-link:last-child {
    border-bottom: 0 !important;
}

#mobile-header-canvas .dreambedden-bottom-link i {
    width: 16px !important;
    min-width: 16px !important;
    font-size: 14px !important;
    text-align: center !important;
    color: inherit !important;
}

#mobile-header-canvas .dreambedden-bottom-link span {
    color: inherit !important;
}

@media (max-width: 767px) {
    #mobile-header-canvas .dreambedden-bottom-link {
        min-height: 46px !important;
        padding: 0 18px !important;
        font-size: 13px !important;
    }

    #mobile-header-canvas .dreambedden-bottom-link i {
        width: 15px !important;
        min-width: 15px !important;
        font-size: 13px !important;
    }
}


.itk-korting-box{
    background:#f3f3f3;
    border:1px solid #e3e3e3;
    border-radius:10px;
    padding:14px 16px;
    margin:15px 0;
    display:flex;
    align-items:flex-start;
    gap:12px;
}

.itk-korting-icon{
    font-size:20px;
    color:#d62828;
    margin-top:2px;
}

.itk-korting-text strong{
    display:block;
    font-size:15px;
    font-weight:700;
    color:#111;
}

.itk-korting-text span{
    font-size:14px;
    color:#555;
}