/*
Theme Name: Kaben Mental
Template: hello-elementor
Description: Thème enfant Hello Elementor pour Development Kaben Mental.
Version: 1.0.0
Text Domain: kaben
*/

/* ---------- Header (Hello dynamic header) ---------- */
.site-header.dynamic-header {
	position: sticky; top: 0; z-index: 50;
	background: rgba(246, 243, 236, 0.94);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
	border-bottom: 1px solid #E2DCCF;
	padding-block: 14px;
}
.admin-bar .site-header.dynamic-header { top: 32px; }
.site-header .site-navigation ul.menu li a { padding: 4px 0; margin-inline: 13px; border-bottom: 2px solid transparent; }
.site-header .site-navigation ul.menu li.current-menu-item > a { color: var(--e-global-color-primary); border-bottom-color: var(--e-global-color-primary); }
.site-header .site-navigation ul.menu li a:hover { color: var(--e-global-color-primary); }
.site-header .site-navigation ul.menu li.menu-cta { display: none; }
.site-header .site-navigation-dropdown ul.menu li a { font-size: 18px; padding: 14px 24px; }
.site-header .site-navigation-dropdown ul.menu li.menu-cta a { margin: 16px 24px 8px; text-align: center; border-radius: 999px; background: var(--e-global-color-primary); color: #fff; font-weight: 600; }
.site-header .site-navigation-dropdown ul.menu li.menu-cta a:hover { background: #004A33; }

/* ---------- Shared helpers used in Elementor ---------- */
.km-lift .elementor-button { transition: background-color .2s, transform .2s; }
.km-lift .elementor-button:hover { transform: translateY(-1px); }
.km-card { transition: transform .2s, box-shadow .2s; }
a.km-card:hover, .km-card-link:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(20, 40, 31, .08); }
.km-pills ul { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 0; padding: 0; }
.km-pills li { border: 1px solid #D6CFC0; border-radius: 999px; padding: 6px 16px; font-size: 15px; line-height: 1.6; }
.km-pills-dark li { border-color: #33493F; color: #fff; }
.km-pills-soft li { border: 0; background: #F6F3EC; padding: 8px 18px; }
.km-steps ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 22px; counter-reset: km; }
.km-steps li { display: flex; gap: 16px; align-items: flex-start; counter-increment: km; }
.km-steps li::before { content: counter(km); flex: 0 0 44px; height: 44px; border-radius: 50%; background: #E1EAE3; color: #006848; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.km-steps li strong { display: block; font-size: 19px; color: #14281F; }
.km-ticks ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.km-ticks li { position: relative; padding-inline-start: 26px; }
.km-ticks li::before { content: ""; position: absolute; inset-inline-start: 0; top: .75em; width: 12px; height: 2px; background: #C2A46E; }
.km-num { width: 44px; height: 44px; border-radius: 50%; display: flex !important; align-items: center; justify-content: center; }

/* ---------- Forms (Fluent Forms) ---------- */
.fluentform .ff-el-input--label label { font-weight: 600; color: #14281F; }
.fluentform .ff-el-form-control { border: 1px solid #D6CFC0; border-radius: 12px; padding: 12px 14px; background: #fff; font-family: inherit; }
.fluentform .ff-el-form-control:focus { border-color: #006848; box-shadow: 0 0 0 3px rgba(0, 104, 72, .15); }
.fluentform .ff-btn-submit { background: #006848 !important; color: #fff !important; border: 0 !important; border-radius: 999px !important; padding: 15px 32px !important; font-weight: 600; font-family: inherit; }
.fluentform .ff-btn-submit:hover { background: #004A33 !important; }
.km-order .fluentform .ff-btn-submit { background: #C27A5A !important; }
.km-order .fluentform .ff-btn-submit:hover { background: #A8613F !important; }
.fluentform .ff-el-form-check-label { display: inline-flex; gap: 8px; align-items: center; }
.ff-message-success { border: 0 !important; border-radius: 18px; background: #E1EAE3 !important; color: #14281F; padding: 20px 22px !important; }

/* Latin text (phone, email) stays left-to-right inside Arabic */
.km-ltr { direction: ltr; unicode-bidi: isolate; display: inline-block; }

/* Card helpers */
.km-card-more { margin-top: auto !important; }
.km-num { height: 44px; display: flex !important; align-items: center; justify-content: center; }
.km-num .elementor-heading-title { line-height: 1; }
.km-quote .elementor-heading-title::before, .km-quote .elementor-heading-title::after { content: none; }

/* ---------- Language switcher ---------- */
.kaben-lang { display: inline-flex; align-items: center; gap: 4px; border: 1px solid #E2DCCF; border-radius: 999px; padding: 3px; background: #fff; }
.kaben-lang__link { padding: 4px 12px !important; margin: 0 !important; border: 0 !important; border-radius: 999px; font-size: 14px; font-weight: 600; line-height: 1.6; color: #14281F; text-decoration: none; }
.kaben-lang__link.is-current { background: #006848; color: #fff !important; }
.kaben-lang__link:not(.is-current):hover { color: #006848; }
.site-header .site-navigation ul.menu li.menu-lang { display: flex; align-items: center; margin-inline-start: 8px; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang { padding: 14px 24px; }
.kaben-lang--footer { background: transparent; border-color: #33493F; }
.kaben-lang--footer .kaben-lang__link { color: #CFDAD4; }
.kaben-lang--footer .kaben-lang__link.is-current { background: #D9C59A; color: #14281F !important; }

/* Mobile header */
.site-header .site-navigation-toggle { background: #fff; border: 1px solid #E2DCCF; border-radius: 14px; }
@media (max-width: 767px) {
	.site-header.dynamic-header { padding-block: 10px; }
	.site-header .site-branding .site-logo img { width: 64px !important; max-width: 64px !important; }
}

/* Mobile dropdown menu */
.site-header .site-navigation-dropdown ul.menu li a { background: #F6F3EC; color: #14281F; border-bottom: 1px solid #E2DCCF; }
.site-header .site-navigation-dropdown ul.menu li.current-menu-item > a { background: #E1EAE3; color: #006848; font-weight: 600; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang { background: #F6F3EC; text-align: center; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang .kaben-lang { display: inline-flex; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang .kaben-lang__link { display: inline-block; width: auto; padding: 6px 18px !important; border-bottom: 0 !important; background: transparent; font-size: 15px; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang .kaben-lang__link.is-current { background: #006848; color: #fff; }
.site-header .site-navigation-dropdown ul.menu li.menu-cta { background: #F6F3EC; }
.site-header .site-navigation-dropdown ul.menu li.menu-cta a { border-bottom: 0; }

/* Align to the reading start (right in Arabic, left in French) */
.km-start .elementor-icon-wrapper, .km-start .elementor-button-wrapper, .elementor-widget-image.km-start { text-align: start !important; }

/* ================= v3 design components ================= */
.km-eb .elementor-heading-title { display: flex; align-items: center; gap: 12px; letter-spacing: .5px; }
.km-eb .elementor-heading-title::before { content: ""; width: 28px; height: 1px; background: #C2A46E; flex: none; }
.km-eb-center .elementor-heading-title { justify-content: center; }

/* Framed photos (offset gold outline) */
.km-frame { position: relative; padding: 0 18px 18px 0; }
.km-frame::before { content: ""; position: absolute; top: 18px; right: 0; bottom: 0; left: 18px; border: 1px solid #C2A46E; border-radius: 260px 260px 24px 24px; pointer-events: none; }
.km-frame img { position: relative; width: 100%; object-fit: cover; border-radius: 260px 260px 24px 24px; }
.km-frame-rect::before, .km-frame-rect img { border-radius: 24px; }
.km-frame-arch2::before, .km-frame-arch2 img { border-radius: 200px 200px 24px 24px; }
.km-frame-dark::before { border-color: #5C7466; }

/* Numbered rows */
.km-row { transition: background-color .2s; }
a.km-row:hover { background: rgba(194, 164, 110, .08); }
a.km-row:hover .km-row-go .elementor-heading-title { transform: translateX(-4px); }
.km-row-go .elementor-heading-title { transition: transform .2s; }
.km-row-num { flex: none !important; }

/* Sticky side heading */
@media (min-width: 1025px) { .km-sticky { position: sticky !important; top: 120px; align-self: flex-start; } }

/* Quote mark */
.km-qmark .elementor-heading-title { font-family: Georgia, serif; line-height: 1; }

/* Steps: circle + line */
.km-step-head { display: flex; align-items: center; gap: 14px; }
.km-step-head span { width: 52px; height: 52px; flex: none; border-radius: 50%; border: 1px solid #C2A46E; display: flex; align-items: center; justify-content: center; font-family: 'Noto Kufi Arabic', sans-serif; font-weight: 700; font-size: 18px; color: #7E5F2E; }
.km-step-head i { flex: 1; height: 1px; background: #E2DCCF; }
.km-dark .km-step-head span { border-color: #D9C59A; color: #D9C59A; }
.km-dark .km-step-head i { background: #2A4237; }

/* Dots list */
.km-dots ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
.km-dots li { display: flex; gap: 12px; align-items: baseline; }
.km-dots li::before { content: ""; width: 6px; height: 6px; flex: none; border-radius: 50%; background: #D9C59A; transform: translateY(-3px); }
.km-dot .elementor-heading-title { display: flex; align-items: center; gap: 12px; }
.km-dot .elementor-heading-title::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #C2A46E; flex: none; }

/* Pills (v3) */
.km-pills ul { gap: 8px; }
.km-pills li { font-size: 14px; padding: 6px 14px; border: 1px solid #E2DCCF; background: #FBFAF6; color: #3D4A44; }
.km-pills-dark li { border-color: #33493F; background: transparent; color: #CFDAD4; }
.km-pill-mint .elementor-heading-title { display: inline-block; font-size: 14px; font-weight: 600; padding: 6px 14px; border-radius: 999px; background: #E1EAE3; color: #006848; }
.km-badge .elementor-heading-title { display: inline-block; padding: 6px 16px; border-radius: 999px; background: #F7E6E0; letter-spacing: 2px; }

/* Kids colour dots */
.km-kdot { width: 56px; height: 56px; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; margin: 0 auto; }
.km-kdot i { width: 16px; height: 16px; border-radius: 50%; display: block; }

/* Outline button */
.km-outline .elementor-button { border: 1px solid currentColor; }

/* Book image shadow */
.km-shadow img { box-shadow: 0 24px 60px -24px rgba(20, 40, 31, .35); }

/* Header: show the booking button on desktop (v3) */
@media (min-width: 1025px) {
	.site-header .site-navigation ul.menu li.menu-cta { display: flex; align-items: center; margin-inline-start: 10px; }
	.site-header .site-navigation ul.menu li.menu-cta a { margin: 0 !important; padding: 10px 20px !important; border: 0 !important; border-radius: 999px; background: #006848; color: #fff !important; font-weight: 600; font-size: 15px; }
	.site-header .site-navigation ul.menu li.menu-cta a:hover { background: #004A33; }
}

/* Forms (v3): soft inputs, pill radios */
.fluentform .ff-el-form-control { background: #FBFAF6; border-color: #E2DCCF; padding: 14px 16px; }
.fluentform .ff-el-form-check { display: inline-flex; margin-inline-end: 12px; }
.fluentform .ff-el-form-check-label { padding: 12px 18px; border: 1px solid #E2DCCF; border-radius: 12px; background: #FBFAF6; cursor: pointer; }
.km-order .fluentform .ff-el-form-check-label { border-color: #006848; background: #F2F7F4; border-radius: 14px; }

/* Footer (v3) */
.kaben-footer a { transition: color .2s; }
.kaben-footer a:hover { color: #FFFFFF !important; }
.km-row-body, .km-grow { flex: 1 1 0 !important; width: auto !important; min-width: 0; }
.km-row-go { flex: none !important; }
@media (max-width: 767px) { .km-row { flex-wrap: wrap !important; } .km-row-go { width: 100%; padding-inline-start: 88px; } }
.km-rule { border-top: 1px solid #C2A46E; border-bottom: 1px solid #C2A46E; }
.km-rule-top { border-top: 1px solid #E2DCCF; }
.km-back .elementor-button { border: 1px solid #E2DCCF; padding: 10px 20px !important; font-size: 15px; }
.km-auto { width: auto !important; flex: 0 1 auto !important; max-width: 100%; }

/* ---------- French: Latin letters look larger than Arabic at the same size ---------- */
html[lang^="fr"] body { font-size-adjust: 0.46; }
html[lang^="fr"] .elementor-heading-title { letter-spacing: -0.01em; }

/* Header menu: tighter on narrower desktops (long French labels) */
@media (min-width: 1025px) and (max-width: 1280px) {
	.site-header .site-navigation ul.menu li a { margin-inline: 9px; font-size: 15px; }
	.site-header .site-navigation ul.menu li.menu-cta a { padding: 9px 16px !important; font-size: 14px; }
}

/* ---------- Language switcher v2: flag + code dropdown ---------- */
.kaben-lang { position: relative; display: inline-block; border: 0; padding: 0; background: none; }
.kaben-lang summary { list-style: none; display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border: 1px solid #E2DCCF; border-radius: 999px; background: #fff; cursor: pointer; font-size: 14px; font-weight: 600; line-height: 1; color: #14281F; user-select: none; }
.kaben-lang summary::-webkit-details-marker { display: none; }
.kaben-lang summary:hover, .kaben-lang[open] summary { border-color: #006848; }
.kaben-lang summary:focus-visible { outline: 2px solid #006848; outline-offset: 2px; }
.kaben-flag { width: 22px; height: 15px; border-radius: 3px; flex: none; display: block; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }
.kaben-lang__caret { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s; }
.kaben-lang[open] .kaben-lang__caret { transform: translateY(2px) rotate(-135deg); }
.kaben-lang__menu { position: absolute; top: calc(100% + 8px); inset-inline-end: 0; z-index: 60; min-width: 170px; margin: 0; padding: 6px; list-style: none; background: #fff; border: 1px solid #E2DCCF; border-radius: 14px; box-shadow: 0 14px 34px rgba(20,40,31,.14); }
.kaben-lang__menu li { margin: 0; padding: 0; }
.site-header .site-navigation .kaben-lang__menu a, .kaben-lang__option { display: flex !important; align-items: center; gap: 10px; margin: 0 !important; padding: 9px 10px !important; border: 0 !important; border-radius: 10px; font-size: 15px; font-weight: 500; color: #14281F !important; text-decoration: none; background: none; }
.kaben-lang__option:hover { background: #F6F3EC; }
.kaben-lang__option.is-current { background: #E1EAE3; color: #006848 !important; font-weight: 600; }
.kaben-lang__option .kaben-lang__code { font-weight: 700; min-width: 22px; }
.kaben-lang__option .kaben-lang__name { color: #5E6B64; font-size: 14px; }
.kaben-lang__option.is-current .kaben-lang__name { color: #006848; }
/* Hide the Hello submenu styling side effects */
.site-header .site-navigation ul.menu li.menu-lang ul.kaben-lang__menu { display: block; flex-direction: column; }
/* In the mobile dropdown menu */
.site-header .site-navigation-dropdown ul.menu li.menu-lang { text-align: center; padding: 16px 24px; }
.site-header .site-navigation-dropdown .kaben-lang__menu { inset-inline-end: auto; inset-inline-start: 50%; transform: translateX(50%); }
html:not([dir="rtl"]) .site-header .site-navigation-dropdown .kaben-lang__menu { transform: translateX(-50%); }
/* Footer: dark variant, opens upward */
.kaben-lang--footer summary { background: transparent; border-color: #33493F; color: #CFDAD4; }
.kaben-lang--footer summary:hover, .kaben-lang--footer[open] summary { border-color: #D9C59A; }
.kaben-lang--footer .kaben-lang__menu { top: auto; bottom: calc(100% + 8px); }
/* Anchor the dropdown to the switcher's outer edge (beats Hello's submenu rules) */
.site-header .site-navigation ul.menu li.menu-lang ul.kaben-lang__menu,
.kaben-lang .kaben-lang__menu { right: auto; left: 0; width: max-content; min-width: 170px; visibility: visible; opacity: 1; }
html:not([dir="rtl"]) .site-header .site-navigation ul.menu li.menu-lang ul.kaben-lang__menu,
html:not([dir="rtl"]) .kaben-lang .kaben-lang__menu { left: auto; right: 0; }
.site-header .site-navigation ul.menu li.menu-lang ul.kaben-lang__menu li { width: 100%; }
/* Mobile menu: options shown inline under the switcher (the panel clips popups) */
.site-header .site-navigation-dropdown ul.menu { background: #F6F3EC; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang__menu { position: static; transform: none !important; margin: 10px auto 0; box-shadow: none; left: auto; right: auto; }
/* Mobile menu: both languages side by side (no nested dropdown) */
.site-header .site-navigation-dropdown .kaben-lang { display: block; }
.site-header .site-navigation-dropdown .kaben-lang summary { display: none; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang__menu { display: flex !important; justify-content: center; gap: 10px; position: static; width: auto; min-width: 0; margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang__menu li { width: auto; border: 0; background: none; }
.site-header .site-navigation-dropdown .kaben-lang__option { padding: 8px 16px !important; border: 1px solid #E2DCCF !important; border-radius: 999px !important; background: #fff; }
.site-header .site-navigation-dropdown .kaben-lang__option.is-current { border-color: #006848 !important; background: #E1EAE3; }
.site-header .site-navigation-dropdown .kaben-lang__name { display: none; }
/* Desktop shows the dropdown; the mobile menu shows two buttons */
.site-header .site-navigation .kaben-lang-inline { display: none; }
.site-header .site-navigation-dropdown .kaben-lang { display: none !important; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang-inline { display: flex; justify-content: center; gap: 10px; position: static; margin: 0; padding: 0; list-style: none; background: none; border: 0; box-shadow: none; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang-inline li { width: auto; border: 0; background: none; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang .kaben-lang__option { padding: 8px 16px !important; border: 1px solid #E2DCCF !important; border-radius: 999px; background: #fff; font-size: 15px; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang .kaben-lang__option.is-current { border-color: #006848 !important; background: #E1EAE3; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang .kaben-lang__name { display: none; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang-inline { max-height: none !important; height: auto !important; overflow: visible !important; visibility: visible !important; opacity: 1 !important; transform: none !important; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang-inline li { display: block !important; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang ul.kaben-lang-inline li { max-height: none !important; transform: none !important; }
.site-header .site-navigation-dropdown ul.menu li.menu-lang { height: auto !important; max-height: none !important; transform: none !important; padding: 12px 24px 24px !important; border-bottom: 1px solid #E2DCCF; }
.site-header .site-navigation-dropdown { box-shadow: 0 18px 30px rgba(20, 40, 31, .12); }
/* Desktop: never show the mobile language list (Hello opens any submenu on hover) */
.site-header .site-navigation ul.menu li.menu-lang > ul.kaben-lang-inline,
.site-header .site-navigation ul.menu li.menu-lang:hover > ul.kaben-lang-inline { display: none !important; }
