/*
 * Feet & Life header/footer: the few details Elementor (free) can't set from the panel.
 * Layout, text, colours and menus are in Templates → CMSMasters Header / Footer.
 */

/* Links inside text blocks inherit the block colour (top strip, footer) */
.fl-strip a { color: inherit; font-weight: 600; text-decoration: none; }
.fl-strip a:hover { text-decoration: underline; }
.fl-foot-links a { color: inherit; text-decoration: none; }
.fl-foot-links a:hover { color: #fff; text-decoration: underline; }
.fl-foot-links p { margin: 0 0 8px; }

/* ® as a small superscript */
.fl-header sup, .fl-footer sup, .fl-cta-band sup { font-size: .6em; line-height: 0; }

/* Brand lockup on small phones (≤400px; Elementor's smallest breakpoint is 760px) */
.fl-brand { min-width: 0; }
.fl-brand-text { min-width: 0; }
@media (max-width: 400px) {
	.fl-logo img { width: 86px !important; }
	.fl-brand-text .elementor-widget:first-child .elementor-heading-title { font-size: 1.2rem !important; }
	.fl-brand-text .elementor-widget:nth-child(2) .elementor-heading-title { font-size: .76rem !important; }
}

/* "Book your appointment" band: diagonal top edge + lighter diagonal stripe */
.fl-cta-band { clip-path: polygon(0 18%, 100% 0, 100% 100%, 0 100%); }
.fl-cta-band::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(170deg, transparent 0 22%, rgba(1, 142, 222, .55) 22% 30%, transparent 30%);
}
.fl-cta-band > .e-con-inner { position: relative; }
.fl-phone-box { user-select: all; }
@media (max-width: 600px) { .fl-cta-band { clip-path: polygon(0 8%, 100% 0, 100% 100%, 0 100%); } }

/* Footer badges: white disc behind transparent logos */
.fl-badge img { background: #fff; object-fit: contain; aspect-ratio: 1; }

/* "Menu" dropdown (≤1240px): full header width under the header, like the prototype */
.fl-header .fl-menu-toggle { position: static; }
.fl-header .fl-menu-toggle nav.elementor-widget-cmsmasters-nav-menu__dropdown {
	left: 0 !important; right: 0 !important; top: 100% !important;
	width: auto !important; min-width: 0 !important; margin-top: 0 !important; z-index: 50;
	box-shadow: 0 12px 24px rgba(2, 85, 163, .08);
}

/* Main menu dropdowns (desktop): hover opens (theme); "Foot Care" / "Therapy & Wellness" toggle on click,
   Enter or Space (inc/menu.php adds .fl-open / .fl-closed); Esc closes */
.fl-main-nav li.menu-item-has-children.fl-open > ul.sub-menu { visibility: visible !important; opacity: 1 !important; }
.fl-main-nav li.menu-item-has-children.fl-closed > ul.sub-menu { visibility: hidden !important; opacity: 0 !important; }
.fl-main-nav li.menu-item-has-children > a[href="#"], .fl-menu-toggle li.menu-item-has-children > a[href="#"] { cursor: pointer; }
/* Parent item highlighted (sky on the light blue pill) while on one of its child pages */
.fl-main-nav li.current-menu-ancestor > a, .fl-main-nav li.current-menu-parent > a,
.fl-menu-toggle li.current-menu-ancestor > a, .fl-menu-toggle li.current-menu-parent > a {
	color: var(--e-global-color-primary) !important; background-color: var(--e-global-color-alternate) !important;
}
/* Mobile/tablet Menu: child pages indented under their section */
.fl-menu-toggle ul.sub-menu { margin: 4px 0 6px 16px !important; padding-left: 10px !important; border-left: 2px solid var(--e-global-color-border); }
.fl-menu-toggle .elementor-widget-cmsmasters-nav-menu__arrow { padding: 6px 10px; margin: -6px -6px -6px 2px; cursor: pointer; }

/* External links in the main menu: small ↗ (screen-reader text added in inc/menu.php) */
.fl-main-nav .fl-ext, .fl-menu-toggle .fl-ext { font-size: .7em; opacity: .75; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Dropdown links on one line: desktop panels grow to fit the longest link (min 260px) */
.fl-main-nav li.menu-item-has-children > ul.sub-menu { width: max-content !important; min-width: 260px; max-width: calc(100vw - 32px); }
.fl-main-nav li.menu-item-has-children > ul.sub-menu a,
.fl-main-nav li.menu-item-has-children > ul.sub-menu [class*="__item-text"],
.fl-menu-toggle ul.sub-menu a,
.fl-menu-toggle ul.sub-menu [class*="__item-text"] { white-space: nowrap; }
/* Phones: slimmer indent and slightly smaller dropdown links so the longest one fits */
@media (max-width: 760px) {
	.fl-menu-toggle ul.sub-menu { margin-left: 10px !important; padding-left: 8px !important; }
	.fl-menu-toggle ul.sub-menu a { font-size: 14px !important; padding-left: 10px !important; padding-right: 6px !important; }
}
@media (max-width: 370px) {
	.fl-menu-toggle ul.sub-menu a { font-size: 13px !important; }
}
