/*
Theme Name: shitate
Theme URI: https://shitate.weblley.co.jp/
Author: weblley inc
Author URI: https://weblley.co.jp/
Description: shitate is a clean, versatile block theme for corporate and business websites. Built for the Site Editor with a flexible theme.json, accessible patterns, and fast, dependency-free output.
Requires at least: 7.0
Tested up to: 7.1
Requires PHP: 7.2
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: shitate
Tags: blog, portfolio, block-patterns, full-site-editing, block-styles, style-variations, wide-blocks, editor-style, custom-colors, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

shitate WordPress Theme, (C) 2026 weblley inc.
shitate is distributed under the terms of the GNU GPL.
*/

/*
 * Mobile menu: the overlay's close button sits exactly where the hamburger
 * is, whatever the header's height. assets/js/navigation-toggle.js records
 * the hamburger's viewport position as --shitate-nav-toggle-* on the
 * navigation block when the menu opens (and on resize).
 *
 * Two overlays exist in core:
 * 1. The default overlay (no .disable-default-overlay): core renders its own
 *    close button. The overlay is position: fixed at the viewport origin and
 *    core animates it in with a transform, so the button is positioned
 *    absolutely against the overlay (not fixed against the viewport): it
 *    rides along with the fade-in and lands on the hamburger. The overlay
 *    gets padding-top so the menu starts below the button.
 * 2. The custom Navigation Overlay template part (WP 7.1+, marked with
 *    .disable-default-overlay): the site owner designs the overlay and
 *    places the Close block themselves, so the theme leaves the layout alone
 *    and only nudges that Close block onto the hamburger with a translate
 *    (--shitate-nav-close-dx/dy, measured by the same script). A transform
 *    does not affect layout, so the owner's spacing is preserved.
 * The fallbacks mirror core's default overlay padding for the no-JS case.
 * The extra .wp-block-navigation ancestor outranks core's inline block CSS.
 */
.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) .wp-block-navigation__responsive-dialog,
.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) .wp-block-navigation__responsive-close {
	position: static;
}

.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) .wp-block-navigation__responsive-container-close {
	position: absolute;
	top: var(--shitate-nav-toggle-top, 1rem);
	right: var(--shitate-nav-toggle-right, 1rem);
	margin: 0;
	padding: 0;
}

/* Default overlay: start the menu content below the close button. */
.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	padding-top: calc(var(--shitate-nav-toggle-top, 1rem) + var(--shitate-nav-toggle-size, 1.5rem) + var(--st-space-m, 1rem));
}

/* Custom overlay template part: move its Close block onto the hamburger. */
.wp-block-navigation .wp-block-navigation__responsive-container.disable-default-overlay.is-menu-open .wp-block-navigation-overlay-close {
	translate: var(--shitate-nav-close-dx, 0px) var(--shitate-nav-close-dy, 0px);
}

/*
 * Interaction: everything with a hover state eases with the same
 * --st-transition (tokens.css, 0.2s). Zero specificity, so a block's own
 * transition or the owner's CSS wins; reduced-motion users get none (see
 * assets/css/reset/reset.css).
 */
:where(a, button, summary, .wp-element-button, .wp-block-button__link, input[type="submit"], input[type="button"], input[type="reset"]) {
	transition: var(--st-transition, 0.2s);
}