/* clinic/services-menu — grouped service menu.
   One markup, two contexts:
   - mobile (≤1199px): vertical nested accordion inside the nav overlay
   - desktop (≥1200px): click-to-open dropdown mega-menu (clusters forced open) */

/* --- shared --- */
.svc-menu { position: relative; }
.svc-menu summary { list-style: none; cursor: pointer; }
.svc-menu summary::-webkit-details-marker { display: none; }
.svc-menu summary::marker { content: ""; }
.svc-menu__summary { display: flex; align-items: center; gap: 6px; }
.svc-menu__chevron { flex-shrink: 0; transition: transform .2s ease; }
.svc-menu[open] > .svc-menu__summary .svc-menu__chevron { transform: rotate(180deg); }
.svc-menu__clusters,
.svc-menu__links,
.svc-menu__conds { list-style: none; margin: 0; padding: 0; }
.svc-menu__all { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.svc-menu__all-arrow { transition: transform .15s ease; }

/* --- conditions axis (shared) --- */
.svc-menu__conds a { display: flex; align-items: center; justify-content: space-between; gap: 10px; text-decoration: none; }
.svc-menu__cond-label { min-width: 0; }
.svc-menu__tag { flex-shrink: 0; font-family: var(--wp--preset--font-family--body, Lato, sans-serif); font-weight: 700; letter-spacing: .5px; text-transform: uppercase; color: #8c8577; }
.svc-menu__cond-sep { display: flex; align-items: center; gap: 8px; }
.svc-menu__cond-sep span { flex-shrink: 0; font-family: var(--wp--preset--font-family--body, Lato, sans-serif); font-weight: 700; letter-spacing: .8px; text-transform: uppercase; color: #8c8577; white-space: nowrap; }
.svc-menu__cond-sep::after { content: ""; flex: 1; height: 1px; background: var(--wp--preset--color--border, #ece9df); }
.svc-menu__cond-consult a { display: flex; align-items: center; gap: 6px; text-decoration: none; color: var(--wp--preset--color--primary, #8c7332); }
.svc-menu__cond-consult .svc-arrow { transition: transform .15s ease; }
.svc-menu__cond-consult a:hover .svc-arrow { transform: translateX(3px); }

/* --- desktop: dropdown mega-menu --- */
@media (min-width: 1200px) {
	.svc-menu__summary {
		font-family: var(--wp--preset--font-family--heading, Ubuntu, sans-serif);
		font-size: 14px; font-weight: 500; letter-spacing: .35px;
		color: var(--wp--preset--color--nav, #57534a);
		white-space: nowrap;
	}
	.svc-menu[open] > .svc-menu__summary,
	.svc-menu__summary:hover { color: var(--wp--preset--color--primary, #bca443); }

	.svc-menu__panel {
		position: absolute; top: calc(100% + 14px); left: 0; z-index: 60;
		width: max-content; max-width: 860px;
		background: #fff; border: 1px solid rgba(0, 0, 0, .04); border-radius: 16px;
		padding: 22px 24px;
		box-shadow: 0 4px 20px rgba(0, 0, 0, .08), 0 1px 3px rgba(0, 0, 0, .04);
	}
	/* two axes side by side: treatments | conditions */
	.svc-menu__cols--split { display: flex; align-items: stretch; gap: 28px; }
	.svc-menu__col--conditions {
		flex: 0 0 auto; min-width: 264px; max-width: 320px;
		padding-left: 28px; border-left: 1px solid var(--wp--preset--color--border, #ece9df);
	}
	.svc-menu__col-head {
		margin: 0 0 12px; padding-top: 2px;
		display: flex; flex-direction: column; gap: 2px;
		font-family: var(--wp--preset--font-family--heading, Ubuntu, sans-serif);
		font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
		color: var(--wp--preset--color--primary, #8c7332);
	}
	.svc-menu__col-head span {
		font-family: var(--wp--preset--font-family--body, Lato, sans-serif);
		font-size: 11px; font-weight: 400; text-transform: none; letter-spacing: 0;
		color: #8c8577;
	}
	.svc-menu__clusters {
		display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr));
		gap: 4px 36px;
	}
	.svc-menu__conds a {
		padding: 5px 0;
		font-family: var(--wp--preset--font-family--body, Lato, sans-serif);
		font-size: 13.5px; font-weight: 500;
		color: var(--wp--preset--color--body, #3c4043);
		transition: color .15s ease;
	}
	.svc-menu__conds a:hover { color: var(--wp--preset--color--primary, #bca443); }
	.svc-menu__tag { font-size: 9.5px; }
	.svc-menu__cond-sep { margin: 10px 0 4px; }
	.svc-menu__cond-sep span { font-size: 9.5px; }
	.svc-menu__cond-consult a {
		padding: 7px 0 2px;
		font-family: var(--wp--preset--font-family--heading, Ubuntu, sans-serif);
		font-size: 13px; font-weight: 700;
	}
	/* cluster summary becomes a non-interactive column heading */
	.svc-menu__group-summary {
		font-family: var(--wp--preset--font-family--heading, Ubuntu, sans-serif);
		font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
		color: var(--wp--preset--color--primary, #8c7332);
		padding: 4px 0 6px; pointer-events: none;
	}
	.svc-menu__group-summary .svc-menu__chevron--sm { display: none; }
	/* links always visible regardless of the inner <details> open state — cover
	   both hiding models: legacy `display:none` on children and the modern
	   `::details-content { content-visibility:hidden }` used by recent engines. */
	.svc-menu__group > .svc-menu__links { display: block !important; margin-bottom: 10px; }
	.svc-menu__group::details-content { content-visibility: visible; }
	.svc-menu__links a {
		display: block; padding: 5px 0;
		font-family: var(--wp--preset--font-family--body, Lato, sans-serif);
		font-size: 13.5px; font-weight: 500; text-decoration: none;
		color: var(--wp--preset--color--body, #3c4043);
		transition: color .15s ease;
	}
	.svc-menu__links a:hover { color: var(--wp--preset--color--primary, #bca443); }
	.svc-menu__all {
		margin-top: 10px; padding-top: 14px;
		border-top: 1px solid var(--wp--preset--color--border, #ece9df);
		font-family: var(--wp--preset--font-family--heading, Ubuntu, sans-serif);
		font-size: 13px; font-weight: 700;
		color: var(--wp--preset--color--primary, #8c7332);
	}
	.svc-menu__all:hover .svc-menu__all-arrow { transform: translateX(3px); }
}

/* --- mobile: overlay accordion --- */
@media (max-width: 1199px) {
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu {
		width: 100%;
		border-bottom: 1px solid var(--wp--preset--color--border, #ece9df);
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__summary {
		font-family: var(--wp--preset--font-family--heading, 'Ubuntu', sans-serif);
		font-size: 17px; font-weight: 600;
		color: var(--wp--preset--color--heading, #262626);
		padding: 14px 0; justify-content: space-between;
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu[open] > .svc-menu__summary,
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__summary:hover {
		color: var(--wp--preset--color--primary, #bca443);
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__chevron {
		width: 14px; height: 14px; color: #94a3b8;
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__panel { padding-bottom: 8px; }

	/* cluster sub-accordion */
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__group-summary {
		display: flex; align-items: center; justify-content: space-between;
		font-family: var(--wp--preset--font-family--heading, 'Ubuntu', sans-serif);
		font-size: 15px; font-weight: 500;
		color: var(--wp--preset--color--nav, #57534a);
		padding: 12px 0 12px 16px;
		border-top: 1px solid rgba(0, 0, 0, .06);
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__group[open] > .svc-menu__group-summary {
		color: var(--wp--preset--color--primary, #bca443);
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__chevron--sm { color: #94a3b8; }
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__group[open] > .svc-menu__group-summary .svc-menu__chevron--sm {
		transform: rotate(180deg);
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__links a {
		display: block;
		font-family: var(--wp--preset--font-family--body, 'Lato', sans-serif);
		font-size: 14px; font-weight: 400; color: #78869b;
		padding: 10px 0 10px 32px; text-decoration: none;
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__links a:hover {
		color: var(--wp--preset--color--primary, #bca443);
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__all {
		display: flex; padding: 14px 0 14px 16px;
		border-top: 1px solid rgba(0, 0, 0, .06);
		font-family: var(--wp--preset--font-family--heading, 'Ubuntu', sans-serif);
		font-size: 15px; font-weight: 600;
		color: var(--wp--preset--color--primary, #8c7332);
	}

	/* conditions axis — stacked as a section under the clusters */
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__col--treatments .svc-menu__col-head { display: none; }
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__col--conditions {
		border-top: 1px solid rgba(0, 0, 0, .06); margin-top: 4px;
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__col-head {
		display: flex; flex-direction: column; gap: 2px; padding: 14px 0 6px 16px;
		font-family: var(--wp--preset--font-family--heading, 'Ubuntu', sans-serif);
		font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
		color: var(--wp--preset--color--primary, #8c7332);
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__col-head span {
		font-family: var(--wp--preset--font-family--body, 'Lato', sans-serif);
		font-size: 12px; font-weight: 400; text-transform: none; letter-spacing: 0; color: #78869b;
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__conds a {
		padding: 10px 0 10px 16px;
		font-family: var(--wp--preset--font-family--body, 'Lato', sans-serif);
		font-size: 14px; font-weight: 400; color: #78869b;
	}
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__conds a:hover { color: var(--wp--preset--color--primary, #bca443); }
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__tag { font-size: 9.5px; color: #94a3b8; }
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__cond-sep { margin: 4px 0; padding: 8px 0 2px 16px; }
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__cond-sep span { font-size: 9.5px; color: #94a3b8; }
	.wp-block-navigation__responsive-container.is-menu-open .svc-menu__cond-consult a {
		padding: 12px 0 12px 16px;
		font-family: var(--wp--preset--font-family--heading, 'Ubuntu', sans-serif);
		font-size: 14px; font-weight: 600;
	}
}
