/* NAV */
#sp-top-bar { padding-bottom: 0px; }
#sp-top-bar .container-inner { border-bottom: 1px solid rgba(0,0,0,0.1);padding-bottom:6px; }
#sp-top-bar .fas,
#sp-top-bar .far,
#sp-top-bar .fab { color:#D9827E; }
#sp-header { box-shadow:none; }

.sp-megamenu-parent > li > a.btn-cta { background-color:#C44569; line-height:41px;padding:4px 15px 6px 15px;border-radius: 10px;font-size:17px;margin-left: 10px;font-weight: 600;color: #FFF;border:1px solid #D9827E;  }
.sp-megamenu-parent > li > a.btn-cta:hover { background-color:#D9827E;color:#FFF;  }

.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner { padding:0px; }
.sp-megamenu-parent .sp-dropdown li.sp-menu-item { border-bottom: 1px solid #EFEFEF;padding:4px 15px; }
.sp-megamenu-parent .sp-dropdown li.sp-menu-item a { font-size:15px !important; }
body.ltr .offcanvas-menu .offcanvas-inner ul.menu>li ul { display: block; }
body.ltr .offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent>a>.menu-toggler { display: none; }

/* Zet de iframe op schermhoogte; werkt ook goed op mobiel met in/uitklappende adresbalk */
:root {
    --header-h: 80px; /* pas aan naar jouw sticky header hoogte */
}
/* Alleen op de afsprakenpagina, geef de section/wrapper een class, bv. .page-appointments */
#treatwell-frame{
    display:block;
    width:100%;
    border:0;
}

.sppb-testimonial-carousel-rating::before,
.sppb-testimonial-carousel-rating::after {
    font-family: "Font Awesome 6 Free" !important;
}

label.error { color:#C44569;font-size: 12px; }

/* Primary CTA knop */
.sppb-btn-primary, .btn-success {
    background-color: #C44569 !important;
    border-color: #C44569 !important;
    color: #fff !important;
    transition: all 0.2s ease-in-out;
}

/* Hover state */
.sppb-btn-primary:hover,
.sppb-btn-primary:focus {
    background-color: #A83756; /* iets donkerder */
    border-color: #A83756;
    color: #fff;
}

/* Active state (ingedrukt) */
.sppb-btn-primary:active,
.sppb-btn-primary.active {
    background-color: #822D45; /* nog donkerder */
    border-color: #822D45;
    color: #fff;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);
}


@media (max-width: 991px) {
    #sp-header {
        height: 60px !important;
    }
}