/*
 Theme Name: Fatima Salhi Theme
 Theme URI: https://example.com/
 Description: A custom child theme for Fatima Salhi
 Author: Tempo Booking
 Author URI: https://tempo-booking.com/
 Template: hello-elementor
 Version: 1.0.0
 Text Domain: fatima-salhi-theme
*/

.icon-row .elementor-icon-wrapper {
  display: flex !important;
  align-items: center !important;
}

.icon-row .elementor-icon {
  line-height: 1 !important;
}

h1 {
	font-size: clamp(2.5rem, 5vw, 4rem) !important;
	line-height: clamp(1.2, 1.2, 1.6) !important;
}

h2 {
	font-size: clamp(1.5rem, 3vw, 2rem) !important;
	line-height: clamp(1.0, 1.2, 1.4) !important;
}

h3 {
	font-size: clamp(1.2rem, 3vw, 1.3rem) !important;
	line-height: clamp(1.0, 1.2, 1.4) !important;
}

p {
	font-size: clamp(14px, 3vw, 16px) !important;
	line-height: clamp(1.8, 1.6, 2.0) !important;
}

span {
	font-size: clamp(14px, 3vw, 16px) !important;
}

ul, li {
	font-size: clamp(14px, 3vw, 16px) !important;
}

.logo h2 {
	font-size: 1.5rem !important;
}

.designed-by p {
	margin: 0px !important;
	font-size: clamp(12px, 3vw, 14px) !important;
}

.designed-by span {
	color: white !important;
	font-size: clamp(12px, 3vw, 14px) !important;
}

.picture-footer .name p {
	font-size: clamp(12px, 3vw, 16px) !important;
	line-height: clamp(1, 1, 1) !important;
}

.picture-footer .profession p {
	font-size: clamp(10px, 3vw, 14px) !important;
	line-height: clamp(1, 1, 1) !important;
}

.header h2 {
	font-size: clamp(1.25rem, 3vw, 1.5rem) !important;
	line-height: clamp(1.0, 1.2, 1.4) !important;
}

/* Nav menu */

/* Nav menu end */

/* Fix the visible area to 300px high */
.fixed-carousel .elementor-image-carousel-wrapper,
.fixed-carousel .swiper,
.fixed-carousel .swiper-container,
.fixed-carousel .swiper-wrapper {
  height: 360px !important;
}

/* Each slide: fixed height, center content */
.fixed-carousel .swiper-slide {
  height: 360px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  /* no overflow hidden here, so we don't accidentally crop */
  background: #000 !important; /* change to your background color or remove */
}

/* Make sure the WHOLE image fits inside that 300px frame */
.fixed-carousel .swiper-slide img {
  max-width: 100% !important;
  max-height: 100% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;  /* show full image, no cropping */
  display: block !important;
}

.nav-menu .elementskit-navbar-nav-default .elementskit-dropdown {
	left: -115px !important;
}


.fs-footer {
	padding: 60px 0px;
}

.hero-bg-fix {
  background-image: url('/wp-content/uploads/2025/12/Praktijk-foto-6.jpeg') !important;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/* nav menu */

.nav-menu .elementskit-navbar-nav > li > a {
  padding: 0px 0px 0px 15px !important;
}

.nav-menu a {
  font-size: clamp(14px, 3vw, 16px) !important;
}

.nav-menu .elementskit-navbar-nav > li > a .elementskit-submenu-indicator {
  font-size: 14px !important;
}

.nav-menu .elementskit-navbar-nav-default .elementskit-submenu-panel>li:hover>a, .elementskit-navbar-nav-default .elementskit-submenu-panel>li>a:hover {
  background-color: #B19886 !important;
}

.nav-menu ul.elementskit-dropdown.elementskit-submenu-panel {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

body .elementskit-navbar-nav > li > a:active .elementskit-submenu-indicator {
	color: #b19886 !important;
}
body .elementskit-navbar-nav > li > a:hover .elementskit-submenu-indicator {
	color: #b19886 !important;
}
body .elementskit-navbar-nav > li:hover > a .elementskit-submenu-indicator {
	color: #b19886 !important;
}

body .elementskit-navbar-nav > li.current-menu-ancestor > a .elementskit-submenu-indicator {
  color: #b19886 !important;
}

/* nav menu end */

/* hover card diensten */

/* Base styling for the card container */
.hover-card {
  border: 1px solid transparent;              /* invisible by default */
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;                   /* smooth border change */
}

/* Text + icon inside the card */
.hover-card .elementor-heading-title,
.hover-card .elementor-icon-wrapper i,
.hover-card .elementor-icon img {
  transition: color 0.3s ease, fill 0.3s ease;
}

/* HOVER STATE: white background, border and new text/icon color */
.hover-card:hover {
  background-color: #ffffff !important;
  border-color: #B19886 !important;           /* your border color */
}

.hover-card:hover .elementor-heading-title,
.hover-card:hover .elementor-icon-wrapper i,
.hover-card:hover .elementor-icon svg {
  color: #B19886 !important;                  /* adjust if needed */
  fill: #B19886 !important;
}

/* Make sure the card is the positioning context */
.hover-card {
  position: relative;
}

/* Both images share same position (top-right, adjust as needed) */
.hover-card .img-normal,
.hover-card .img-hover {
  position: absolute;
  top: 50%;
  right: 10px;              /* adjust horizontally */
  transform: translateY(-50%);
  transition: opacity 0.3s ease;
}

.hover-card {
	padding: 15px 10px !important;
}

/* Initial state: show normal image, hide hover image */
.hover-card .img-normal {
  opacity: 1;
}

.hover-card .img-hover {
  opacity: 0;
}

/* On hover: swap them */
.hover-card:hover .img-normal {
  opacity: 0;
}

.hover-card:hover .img-hover {
  opacity: 1;
}

/* end hover card diensten */

@media (max-width: 1024px) {
	.nav-menu svg.elementskit-submenu-indicator.ekit-svg-icon.icon-down-arrow1 {
		fill: black;
    	height: 13px;
	}
	
	.fs-footer {
	padding: 60px 0px;
}

}

/* Remove padding from specific UL lists on mobile only */
@media (max-width: 767px) {
  ul.no-padding-list {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
	
		body .fs-footer {
	padding: 20px 0px !important;
}
	
	
.nav-menu .elementskit-navbar-nav > li > a {
	padding: 10px 15px 10px 15px !important;
	}

  /* Optional: keep bullets but move them closer to text */
  ul.no-padding-list {
    list-style-position: inside !important;
  }
  
  /* Nav menu */
	
  .nav-menu {
    fill: #ffffff !important;
    stroke: #ffffff !important;
  }
	
  .nav-menu .elementskit-navbar-nav-default .elementskit-dropdown {
	left: 0px !important;
  }

.nav-menu button.elementskit-menu-close.elementskit-menu-toggler {
	padding: 5px 14px !important;
    width: auto !important;
    height: auto !important;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 10px 20px 0px 0px !important;
	border-radius: 3px !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23ffffff'%20stroke-width='2.5'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cline%20x1='5'%20y1='5'%20x2='19'%20y2='19'/%3E%3Cline%20x1='19'%20y1='5'%20x2='5'%20y2='19'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px 20px;
	padding: 15px !important;
	color: white;
	font-size: 0; /* hides the "X" text */
	line-height: 0;
}

.nav-menu .elementskit-navbar-nav > li > a .elementskit-submenu-indicator {
	width: 42px !important;
    height: 30px !important;
    display: block !important;
	padding: 0px !important;
}

.nav-menu .elementskit-navbar-nav > li > a .elementskit-submenu-indicator path {
	transform-origin: 50% 50% !important;
    transform: scale(0.5) !important;
    margin: 0 auto !important;
}

.nav-menu .elementskit-navbar-nav > li > a:hover {
    background: #E5E7EB !important;
    color: black !important;
}

.nav-menu ul.elementskit-dropdown.elementskit-submenu-panel.elementskit-dropdown-open {
	padding: 0px !important;
}

.nav-menu .elementskit-menu-close:hover {
	color: white !important;
}

.nav-menu button.elementskit-menu-hamburger.elementskit-menu-toggler {
	padding: 0 !important;
    width: auto !important;
    height: auto !important;
    background: transparent;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
}

.nav-menu button.elementskit-menu-hamburger.elementskit-menu-toggler svg {
	transform: scale(1.4);
	transform-origin: center;
}
  /* Nav menu end */
}

.elementor-10 .elementor-element.elementor-element-84144ac .tahefobu-sub-menu .tahefobu-sub-menu-item:hover, .elementor-10 .elementor-element.elementor-element-84144ac .tahefobu-sub-menu .tahefobu-sub-menu-item.tahefobu-active-menu-item {
    background-color: #B19886 !important;
}