/*
Theme Name: Amihan
Author: dmarkdevin
Description: An airy island block theme for Amihan Cove Resort, a fictional barefoot resort in El Nido, Palawan. White and sand with deep-lagoon text and one lagoon accent; the home page follows one island day from sunrise to dinner. Self-hosted Gilda Display and Mulish. Pair with the Amihan Core plugin for rooms and the booking form.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.2
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: amihan
Tags: full-site-editing, block-patterns, block-styles, one-column, wide-blocks, custom-colors, custom-menu, editor-style, translation-ready
*/

/* Only what theme.json cannot express. Mobile first. */

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid var(--wp--preset--color--accent); outline-offset: 3px; border-radius: 4px; }
.skip-link.screen-reader-text:focus { background: var(--wp--preset--color--ink); color: #fff; }
img { height: auto; }
.wp-site-blocks > main, .wp-site-blocks > footer { margin-block-start: 0; }

/* Header: white bar, hairline. */
.am-header { position: sticky; top: 0; z-index: 50; background: var(--wp--preset--color--base); border-bottom: 1px solid var(--wp--preset--color--line); }
.admin-bar .am-header { top: var(--wp-admin--admin-bar--height, 0); }
.am-header .wp-block-site-logo { flex-shrink: 0; }
.am-header .wp-block-site-logo img { display: block; }
.am-header .wp-block-button__link, .am-header .wp-block-site-title { white-space: nowrap; }
.wp-block-navigation .wp-block-navigation-item__content { padding-block: .2rem; border-bottom: 2px solid transparent; }
.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content { border-bottom-color: var(--wp--preset--color--accent); }
.wp-block-navigation__responsive-container.is-menu-open { padding: var(--wp--preset--spacing--50); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--display); font-size: 2.25rem; }
@media (max-width: 781px) { .am-hide-mobile { display: none !important; } .am-header .wp-block-button__link { padding: .6rem 1rem !important; font-size: .875rem; } }
@media (max-width: 479px) { .am-header .wp-block-site-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); } }
@media (min-width: 600px) and (max-width: 1023px) {
	.am-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
	.am-header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) { display: none; }
}

/* Buttons: pill; outline variants for light sections and photos. */
.wp-block-button.is-style-outline > .wp-block-button__link { border: 1.5px solid currentColor; background: transparent; color: var(--wp--preset--color--ink); padding: calc(.9rem - 1.5px) calc(1.75rem - 1.5px); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--ink); color: #fff; border-color: var(--wp--preset--color--ink); }
.am-on-photo .wp-block-button.is-style-outline > .wp-block-button__link { color: #fff; }
.am-on-photo .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--ink); }

/* Hero: centred over the cove photo with a soft wash. */
.am-hero .wp-block-cover__background { background: linear-gradient(0deg, rgba(20,54,58,.75) 0%, rgba(20,54,58,.25) 55%, rgba(20,54,58,.15) 100%) !important; opacity: 1 !important; }

/* Rounded photos and ratios. */
.am-photo img { border-radius: var(--wp--custom--radius-image); width: 100%; object-fit: cover; }
.am-ratio-tall img { aspect-ratio: 4 / 5; }
.am-ratio-wide img { aspect-ratio: 3 / 2; }

/* A day at Amihan: four moments in time order, so the times are real labels. */
.am-day .wp-block-column { position: relative; }
.am-day__time { font-weight: 700; color: var(--wp--preset--color--accent); margin-top: 1rem !important; }
.am-day h3 { margin-top: .25rem !important; }

/* Getting here: numbered because it is a real sequence. */
.am-steps { list-style: none; counter-reset: am-step; padding: 0; margin: 0; display: grid; gap: 1.25rem; }
.am-steps li { counter-increment: am-step; position: relative; padding-left: 3.25rem; }
.am-steps li::before { content: counter(am-step); position: absolute; left: 0; top: 0; width: 2.2rem; height: 2.2rem; border-radius: 50%; display: grid; place-items: center; background: var(--wp--preset--color--accent); color: #fff; font-weight: 800; }
.am-steps strong { display: block; font-size: 1.0625rem; }

/* Post cards. */
.wp-block-post-featured-image { overflow: hidden; border-radius: var(--wp--custom--radius-image); }

/* Forms (Fluent Forms). */
.fluentform .ff-el-input--label label { font-weight: 700; font-size: .9375rem; color: var(--wp--preset--color--ink); }
.fluentform .ff-el-form-control { border: 1px solid var(--wp--preset--color--line); border-radius: 14px; background: #fff; font: inherit; padding: .75rem .95rem; color: var(--wp--preset--color--ink); }
.fluentform .ff-el-form-control:focus { border-color: var(--wp--preset--color--accent); box-shadow: 0 0 0 3px rgba(14,110,115,.15); }
.fluentform .ff-el-is-required.asterisk-right label::after { color: var(--wp--preset--color--accent); }
.fluentform .ff-btn-submit { background-color: var(--wp--preset--color--accent) !important; color: #fff !important; border-radius: 999px !important; padding: .9rem 1.75rem !important; font: 700 .9375rem/1.2 var(--wp--preset--font-family--body) !important; }
.fluentform .ff-btn-submit:hover { background-color: var(--wp--preset--color--ink) !important; opacity: 1 !important; }

/* Footer: deep lagoon. */
.am-footer a { color: inherit; }
.am-footer h2, .am-footer h3 { color: var(--wp--preset--color--soft); }
.am-footer__small { color: var(--wp--preset--color--soft); }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}