/**
 * Mobile drawer navigation — category icons, chevrons, and polish.
 */

/* Category icons: use SVG img (mask fallback in mu-plugin breaks on some icons). */
.mobile-nav li.cardiii-cat-item > a .wd-nav-img {
	display: inline-block !important;
	width: 22px !important;
	height: 22px !important;
	max-height: 22px !important;
	margin-inline-end: 10px !important;
	flex: 0 0 22px;
	object-fit: contain;
	object-position: center;
}

.mobile-nav li.cardiii-cat-item > a::before {
	display: none !important;
	content: none !important;
}

/* Chevron opener — CSS fallback when icon font glyph fails. */
.mobile-nav .wd-nav-opener::after {
	content: "" !important;
	display: block;
	width: 7px;
	height: 7px;
	margin: auto;
	border: 0 solid currentColor;
	border-inline-end-width: 2px;
	border-block-end-width: 2px;
	transform: rotate(-45deg);
	font-family: unset !important;
	font-size: 0 !important;
	line-height: 0 !important;
	transition: transform 0.2s ease, color 0.2s ease;
}

.mobile-nav .wd-nav-opener.wd-active::after {
	transform: rotate(45deg);
}

.mobile-nav .wd-drilldown-back .wd-nav-opener::after {
	transform: rotate(135deg);
}

/* Tabs */
.mobile-nav .wd-nav-mob-tab {
	--nav-bg: rgba(9, 171, 193, 0.07);
	--nav-bg-active: #fff;
	--nav-color: #64748b;
	--nav-color-hover: #078a9b;
	border-bottom: 1px solid rgba(9, 171, 193, 0.14);
}

.mobile-nav .wd-nav-mob-tab > li > a {
	padding: 14px 12px;
	font-weight: 700;
	font-size: 0.72rem;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.mobile-nav .wd-nav-mob-tab > li.wd-active > a {
	color: var(--c-primary-dark, #078a9b);
	background: var(--nav-bg-active);
}

.mobile-nav .wd-nav-mob-tab.wd-style-underline .nav-link-text::after {
	height: 3px;
	border-radius: 3px 3px 0 0;
	background: var(--c-primary, #09abc1);
}

.mobile-nav .mobile-tab-title > a:focus {
	outline: none;
}

.mobile-nav .mobile-tab-title > a:focus-visible {
	outline: 2px solid rgba(9, 171, 193, 0.45);
	outline-offset: -2px;
}

/* Menu rows */
.mobile-nav .wd-nav-mobile > li > a,
.mobile-nav .wd-nav-mobile > li > ul li > a {
	padding: 14px 20px;
	min-height: 54px;
	font-size: 0.95rem;
	font-weight: 600;
	color: #334155;
	transition: background 0.2s ease, color 0.2s ease;
}

.mobile-nav .wd-nav-mobile > li > a:hover,
.mobile-nav .wd-nav-mobile > li > ul li > a:hover {
	background: rgba(9, 171, 193, 0.06);
	color: var(--c-primary-dark, #078a9b);
}

.mobile-nav .wd-nav-mobile > li > a .nav-link-text {
	line-height: 1.35;
}

.mobile-nav .wd-nav-opener {
	color: #94a3b8;
	border-color: rgba(9, 171, 193, 0.12) !important;
}

.mobile-nav .wd-drilldown-back a {
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--c-primary-dark, #078a9b);
}