/**
 * Mobile (off-canvas) navigation.
 *
 * The header uses the ElementsKit nav menu widget, which switches to its
 * off-canvas panel below the widget breakpoint (1024px on this site).
 * The rules below take over the panel styling from the Elementor widget
 * settings, which produced white text on a white panel on hover / focus /
 * current item and a semi transparent background that showed the page
 * behind the menu.
 *
 * Everything is scoped to the responsive state of the widget, so the desktop
 * menu is untouched.
 */

/* Parent-page link injected by mobile-menu.js — mobile only. */
.tesfed-parent-link {
	display: none;
}

@media (max-width: 1024px) {

	.ekit_menu_responsive_tablet {
		--tesfed-menu-accent: #e31837;
		--tesfed-menu-text: #14161a;
		--tesfed-menu-text-soft: #454b54;
		--tesfed-menu-line: rgba(0, 0, 0, 0.07);
		--tesfed-menu-hover: rgba(227, 24, 55, 0.07);
	}

	/* --- Panel --------------------------------------------------------- */

	.ekit_menu_responsive_tablet .elementskit-menu-container.elementskit-menu-offcanvas-elements {
		width: 340px !important;
		max-width: 86vw !important;
		height: 100% !important;
		background: #fff !important;
		box-shadow: 0 0 60px rgba(0, 0, 0, 0.28) !important;
		border-radius: 0 !important;
		padding: 0 0 calc(24px + env(safe-area-inset-bottom)) !important;
		z-index: 99999 !important;
		overscroll-behavior: contain;
		-webkit-overflow-scrolling: touch;
		transition: left 0.4s cubic-bezier(0.22, 0.61, 0.24, 1) !important;
	}

	.ekit_menu_responsive_tablet .elementskit-menu-overlay {
		background-color: rgba(10, 12, 16, 0.55) !important;
		-webkit-backdrop-filter: blur(2px);
		backdrop-filter: blur(2px);
		z-index: 99998 !important;
	}

	/* Page must not scroll behind the open panel. */
	body.tesfed-menu-open {
		overflow: hidden !important;
	}

	/* --- Panel header (close button row) ------------------------------- */

	.ekit_menu_responsive_tablet .elementskit-nav-identity-panel {
		display: flex !important;
		align-items: center;
		justify-content: flex-end;
		min-height: 64px;
		padding: 11px 14px !important;
		border-bottom: 1px solid var(--tesfed-menu-line);
	}

	.ekit_menu_responsive_tablet button.elementskit-menu-close {
		float: none !important;
		width: 42px !important;
		height: 42px !important;
		margin: 0 !important;
		padding: 0 !important;
		display: flex !important;
		align-items: center;
		justify-content: center;
		background-color: #111 !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 12px !important;
		font-size: 0 !important;
		line-height: 0 !important;
	}

	.ekit_menu_responsive_tablet button.elementskit-menu-close::before {
		content: "\00d7";
		font-family: Arial, Helvetica, sans-serif;
		font-size: 26px;
		font-weight: 400;
		line-height: 1;
	}

	.ekit_menu_responsive_tablet button.elementskit-menu-close:hover,
	.ekit_menu_responsive_tablet button.elementskit-menu-close:focus {
		background-color: var(--tesfed-menu-accent) !important;
		color: #fff !important;
	}

	/* --- Menu rows ----------------------------------------------------- */

	.ekit_menu_responsive_tablet .elementskit-navbar-nav {
		width: 100% !important;
		padding: 6px 0 20px !important;
	}

	.ekit_menu_responsive_tablet .elementskit-navbar-nav li {
		width: 100% !important;
	}

	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li + li {
		border-top: 1px solid var(--tesfed-menu-line);
	}

	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li > a,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li > a {
		display: flex !important;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
		box-sizing: border-box;
		width: 100%;
		height: auto !important;
		min-height: 52px;
		padding: 11px 18px !important;
		font-size: 16px !important;
		font-weight: 600 !important;
		line-height: 1.35 !important;
		color: var(--tesfed-menu-text) !important;
		background-color: transparent !important;
		text-decoration: none;
		transition: background-color 0.2s ease, color 0.2s ease;
		-webkit-tap-highlight-color: rgba(227, 24, 55, 0.12);
	}

	/* Hover / focus / touch — never white on white. */
	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li > a:hover,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li > a:focus,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li > a:active,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li:hover > a,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li > a:hover,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li > a:focus,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li > a:active,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li:hover > a {
		color: var(--tesfed-menu-accent) !important;
		background-color: var(--tesfed-menu-hover) !important;
	}

	/* Current page. */
	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li.current-menu-item > a,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li.current-menu-ancestor > a,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li.current-menu-item > a,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li.current-menu-ancestor > a,
	.ekit_menu_responsive_tablet .elementskit-navbar-nav li.tesfed-submenu-open > a {
		color: var(--tesfed-menu-accent) !important;
	}

	.ekit_menu_responsive_tablet .elementskit-navbar-nav > li.current-menu-item > a {
		box-shadow: inset 3px 0 0 var(--tesfed-menu-accent);
	}

	/* --- Sub menus ----------------------------------------------------- */

	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel {
		background-color: #f6f7f9 !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: inset 3px 0 0 rgba(227, 24, 55, 0.35) !important;
		min-width: 0 !important;
		padding: 4px 0 !important;
		margin: 0 !important;
	}

	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li > a {
		min-height: 44px;
		padding: 9px 18px 9px 32px !important;
		font-size: 15px !important;
		font-weight: 500 !important;
		color: var(--tesfed-menu-text-soft) !important;
	}

	.ekit_menu_responsive_tablet .elementskit-navbar-nav .elementskit-submenu-panel > li + li {
		border-top: 1px solid rgba(0, 0, 0, 0.05);
	}

	/* Third level (e.g. Federasyon > Bilgi Bankası). */
	.ekit_menu_responsive_tablet .elementskit-submenu-panel .elementskit-submenu-panel {
		background-color: #eef0f3 !important;
		box-shadow: inset 3px 0 0 rgba(0, 0, 0, 0.12) !important;
	}

	.ekit_menu_responsive_tablet .elementskit-submenu-panel .elementskit-submenu-panel > li > a {
		padding-left: 46px !important;
		font-size: 14px !important;
	}

	/* Link to the parent's own page, injected by mobile-menu.js. */
	.ekit_menu_responsive_tablet .tesfed-parent-link {
		display: block;
	}

	/* --- Dropdown indicator -------------------------------------------- */

	.ekit_menu_responsive_tablet .elementskit-dropdown-has > a .elementskit-submenu-indicator {
		flex: 0 0 auto;
		display: flex !important;
		align-items: center;
		justify-content: center;
		width: 34px;
		height: 34px;
		margin: 0 0 0 auto !important;
		padding: 0 !important;
		font-size: 12px !important;
		color: currentColor !important;
		fill: currentColor !important;
		background-color: rgba(0, 0, 0, 0.05);
		border-radius: 50%;
		transition: transform 0.25s ease, background-color 0.2s ease;
	}

	.ekit_menu_responsive_tablet li.tesfed-submenu-open > a .elementskit-submenu-indicator {
		transform: rotate(180deg);
		background-color: rgba(227, 24, 55, 0.12);
	}
}