/*
 * page-menu — "paper" chrome overrides ported from
 * design/prototype/assets/css/menu-paper.css (`.paper .site-header/.site-footer/.dock`,
 * `.paper main`, `.paper ::selection`, `.paper main :focus-visible` rules): the header,
 * footer and mobile dock keep the site's navy chrome over the pale paper page, the
 * selection/focus accents switch to navy so they read against paper, and horizontal
 * overflow from the menu hero's bleeding faint logo is clipped. Only the chrome that the
 * `shareef/menu` block and the paper section style (styles/sections/paper.json) don't
 * already cover lives here. Colours come only from theme.json presets. Logical
 * properties only (RTL-first).
 */

body.page-template-page-menu .site-header,
body.page-template-page-menu .site-footer,
body.page-template-page-menu .dock {
	color: var(--wp--preset--color--white);
}

body.page-template-page-menu .site-footer {
	background: var(--wp--preset--color--seam);
	color: var(--wp--preset--color--ink-2);
}

body.page-template-page-menu main ::selection {
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--white);
}

body.page-template-page-menu main :focus-visible {
	outline-color: var(--wp--preset--color--navy);
}

body.page-template-page-menu main {
	overflow-x: clip;
}

/* Menu hero on paper (menu-paper.css `.paper .menu-hero h1/p`): the default
   light-on-navy ink is unreadable on the pale page. Editor colour picks
   (`has-*-color`, !important) still win. */
body.page-template-page-menu .menu-hero h1 {
	color: var(--wp--preset--color--navy);
}

body.page-template-page-menu .menu-hero p {
	color: var(--wp--preset--color--paper-ink-2);
}

/* The paper section style sets dark ink on everything inside it, including the
   red/navy call panels at the bottom of the menu; give them back the light ink
   they have on the home page. */
body.page-template-page-menu .panel,
body.page-template-page-menu .panel :is(h1, h2, h3, h4, .close-call-cta) {
	color: var(--wp--preset--color--white);
}

body.page-template-page-menu .panel p {
	color: var(--wp--preset--color--ink-2);
}
