/*
Theme Name: AMS Daytona
Theme URI: https://www.amsdaytona.com
Author: Edgeset Solutions
Author URI: https://edgesetsolutions.com
Description: Block theme for AMS Daytona. Everything on the site — header, footer,
             hero, page and post layouts — is built from blocks and editable in
             Appearance > Editor. Carries the design across from the previous Divi
             build with no page builder and no required plugins.
Version: 2.0.0
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: amsdaytona
Tags: full-site-editing, block-patterns, template-editing, custom-menu, featured-images, block-styles, wide-blocks, accessibility-ready, style-variations
*/

/* --------------------------------------------------------------------------
   theme.json supplies the palette, type scale, spacing and element styles.
   Everything below is the handful of things theme.json cannot express.
   -------------------------------------------------------------------------- */

:root {
	--ams-accent: #c39d63;
	--ams-accent-dark: #ab8850;
	--ams-ink: #333333;
	--ams-muted: #bfbfbf;
	--ams-line: #e6e6e6;
	--ams-dark: #1f1f1f;
	--ams-header-h: 80px;
}

html { scroll-behavior: smooth; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

:focus-visible {
	outline: 2px solid #2ea3f2;
	outline-offset: 2px;
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */

/*
 * The header part is marked sticky from the Site Editor (Position > Sticky).
 * These rules only make the admin bar and the dark variant behave.
 */
.wp-site-blocks > .ams-header {
	position: sticky;
	top: 0;
	z-index: 100;
}

.admin-bar .wp-site-blocks > .ams-header { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > .ams-header { top: 46px; }
}

.ams-header { box-shadow: 0 1px 0 0 rgba(0, 0, 0, .1); }

/*
 * Transparent variant that floats over a hero. The selector has to be at least as
 * specific as the sticky rule above, or it loses to it.
 */
.wp-site-blocks > .ams-header--over,
.ams-header--over {
	position: absolute;
	inset: 0 0 auto;
	z-index: 100;
	background: transparent;
	box-shadow: none;
}

.admin-bar .wp-site-blocks > .ams-header--over { top: 32px; }

@media (max-width: 782px) {
	.admin-bar .wp-site-blocks > .ams-header--over { top: 46px; }
}

.ams-header--over .wp-block-site-title a,
.ams-header--over .wp-block-navigation a { color: #fff; }

.ams-header .wp-block-site-logo img { height: 43px; width: auto; }

/*
 * The header carries a logo and the site name. Core renders nothing at all for the
 * logo block when no logo is set, so this shows the name as a fallback and gets out
 * of the way as soon as a logo exists — no empty header, no doubled-up branding.
 */
.ams-header .wp-block-site-logo ~ .wp-block-site-title { display: none; }

/* The whole-site wrapper is the positioning context for the floating header. */
.wp-site-blocks { position: relative; }

/* --------------------------------------------------------------------------
   Navigation
   -------------------------------------------------------------------------- */

.wp-block-navigation .wp-block-navigation-item__content:hover,
.wp-block-navigation .wp-block-navigation-item__content:focus { opacity: .7; }

.wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	color: var(--ams-ink);
}

.ams-header--over .wp-block-navigation .current-menu-item > .wp-block-navigation-item__content {
	color: var(--ams-accent);
}

/* Submenu chrome */
.wp-block-navigation .wp-block-navigation__submenu-container {
	border: 0;
	box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
	padding-block: 8px;
}

.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	padding: 8px 20px;
}

/* Mobile overlay */
.wp-block-navigation__responsive-container.is-menu-open {
	padding: 30px;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 20px;
	text-transform: none;
	letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   Cover / hero
   -------------------------------------------------------------------------- */

/*
 * Core's "Fixed background" uses background-attachment: fixed, which sizes the
 * photo to the viewport and re-crops it — the old Divi build sized its parallax
 * layer to the section instead. We keep the section-relative crop and produce the
 * motion with a transform from site.js, so the framing matches the old site and it
 * also works on iOS, where fixed backgrounds are ignored.
 */
.wp-block-cover.has-parallax,
.wp-block-cover-image.has-parallax {
	overflow: hidden;
}

.wp-block-cover.has-parallax .wp-block-cover__image-background,
.wp-block-cover-image.has-parallax .wp-block-cover__image-background {
	background-attachment: scroll !important;
	top: -12%;
	height: 124%;
	will-change: transform;
}

.wp-block-cover h1 { margin-bottom: .35em; }

/* Keeps the hero headline breaking where the old build broke it. */
.ams-hero-title { max-width: 780px; margin-inline: auto; }

/* --------------------------------------------------------------------------
   Page title band
   -------------------------------------------------------------------------- */

.ams-title-band { border-bottom: 1px solid var(--ams-line); }

.ams-title-band .wp-block-post-title { margin: 0; }

/* --------------------------------------------------------------------------
   Block styles registered in functions.php
   -------------------------------------------------------------------------- */

/* Group: Card */
.wp-block-group.is-style-ams-card {
	background: #fff;
	border: 1px solid var(--ams-line);
	padding: 34px;
	height: 100%;
	transition: box-shadow .3s ease, transform .3s ease;
}

.wp-block-group.is-style-ams-card:hover {
	box-shadow: 0 2px 4px rgba(0, 0, 0, .06), 0 22px 50px rgba(0, 0, 0, .09);
	transform: translateY(-3px);
}

/* Group: Rule above — the small gold keyline the old build used above sections */
.wp-block-group.is-style-ams-ruled > *:first-child { position: relative; }

.wp-block-group.is-style-ams-ruled::before {
	content: "";
	display: block;
	width: 54px;
	height: 3px;
	background: var(--ams-accent);
	margin-bottom: 28px;
}

/* Column: Card (same treatment, applied to a column) */
.wp-block-column.is-style-ams-card {
	background: #fff;
	border: 1px solid var(--ams-line);
	padding: 34px;
}

/* Image: Framed */
.wp-block-image.is-style-ams-framed img {
	border: 1px solid var(--ams-line);
	padding: 10px;
	background: #fff;
}

/* Separator: Gold short rule */
.wp-block-separator.is-style-ams-rule {
	border: 0;
	height: 3px;
	width: 54px;
	max-width: 54px;
	margin-inline: 0;
	background: var(--ams-accent);
	opacity: 1;
}

.wp-block-separator.is-style-ams-rule.aligncenter { margin-inline: auto; }

/* Button: Outline (light) — the hero's secondary action */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	border-color: currentColor;
}

.wp-block-button.is-style-ams-ghost > .wp-block-button__link {
	background: transparent;
	border-color: #fff;
	color: #fff;
}

.wp-block-button.is-style-ams-ghost > .wp-block-button__link:hover,
.wp-block-button.is-style-ams-ghost > .wp-block-button__link:focus {
	background: #fff;
	border-color: #fff;
	color: var(--ams-ink);
}

/* Heading: Eyebrow — usable on any heading level, not just H3 */
.wp-block-heading.is-style-ams-eyebrow {
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--ams-muted);
}

/* Paragraph: Lede */
.wp-block-paragraph.is-style-ams-lede {
	font-size: 19px;
	line-height: 1.7;
}

/* --------------------------------------------------------------------------
   Details / accordion — replaces Divi's toggle module
   -------------------------------------------------------------------------- */

.wp-block-details {
	border: 1px solid var(--ams-line);
	margin-bottom: 10px;
}

.wp-block-details summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 16px 20px;
	font-weight: 700;
	color: var(--ams-ink);
	cursor: pointer;
	list-style: none;
}

.wp-block-details summary::-webkit-details-marker { display: none; }

.wp-block-details summary::after {
	content: "+";
	flex: none;
	font-size: 20px;
	font-weight: 500;
	color: var(--ams-accent);
	line-height: 1;
}

.wp-block-details[open] summary::after { content: "\2013"; }

.wp-block-details > *:not(summary) { margin: 0 20px 16px; }
.wp-block-details > summary + * { margin-top: 4px; }

/* --------------------------------------------------------------------------
   Split template — sticky title column
   -------------------------------------------------------------------------- */

.ams-split__aside {
	position: sticky;
	top: calc(var(--ams-header-h) + 40px);
	align-self: start;
}

.admin-bar .ams-split__aside { top: calc(var(--ams-header-h) + 72px); }

@media (max-width: 781px) {
	.ams-split__aside { position: static; }
}

/* --------------------------------------------------------------------------
   Long-read reading progress
   -------------------------------------------------------------------------- */

.ams-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 100%;
	transform: scaleX(0);
	transform-origin: 0 50%;
	background: var(--ams-accent);
	z-index: 200;
	pointer-events: none;
}

.admin-bar .ams-progress { top: 32px; }

@media (prefers-reduced-motion: reduce) { .ams-progress { display: none; } }

/* --------------------------------------------------------------------------
   Account form (the Sign in block)
   -------------------------------------------------------------------------- */

.ams-account { max-width: 420px; }
.ams-account.has-text-align-center { margin-inline: auto; }

.ams-account label {
	display: block;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: var(--ams-ink);
	margin-bottom: 6px;
}

.ams-account input[type="text"],
.ams-account input[type="password"],
.ams-account input[type="email"] {
	width: 100%;
	padding: 11px 14px;
	margin-bottom: 20px;
	font: inherit;
	font-size: 15px;
	border: 1px solid rgba(0, 0, 0, .15);
	border-radius: 0;
	background: #fff;
	color: var(--ams-ink);
}

.ams-account input:focus {
	outline: 2px solid #2ea3f2;
	outline-offset: 0;
	border-color: transparent;
}

.ams-account .login-remember { margin-bottom: 20px; }
.ams-account .login-remember label { display: inline; font-weight: 500; }

.ams-account .button,
.ams-account button[type="submit"],
.ams-account input[type="submit"] {
	display: inline-block;
	font-family: Montserrat, Helvetica, Arial, sans-serif;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.7;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 4px 15px;
	border: 2px solid var(--ams-accent);
	background: var(--ams-accent);
	color: #fff;
	cursor: pointer;
}

.ams-account .button:hover,
.ams-account button[type="submit"]:hover,
.ams-account input[type="submit"]:hover {
	background: var(--ams-accent-dark);
	border-color: var(--ams-accent-dark);
}

.ams-account__links {
	margin-top: 24px;
	font-size: 15px;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
}

.ams-notice {
	padding: 14px 18px;
	margin-bottom: 24px;
	border-left: 3px solid var(--ams-accent);
	background: rgba(195, 157, 99, .08);
	color: var(--ams-ink);
	font-size: 15px;
}

.ams-notice--error { border-left-color: #d63638; background: rgba(214, 54, 56, .06); }

/* Editor placeholder for the account block */
.ams-account-placeholder {
	border: 1px dashed var(--ams-line);
	padding: 28px;
	text-align: center;
	color: var(--ams-muted);
	font-size: 15px;
}

/* --------------------------------------------------------------------------
   Search form
   -------------------------------------------------------------------------- */

.wp-block-search__input {
	border: 1px solid rgba(0, 0, 0, .15);
	border-radius: 0;
	padding: 10px 14px;
	font-size: 15px;
}

.wp-block-search__button {
	border-radius: 0;
	border: 2px solid var(--ams-accent);
	background: var(--ams-accent);
	color: #fff;
	font-size: 14px;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 6px 18px;
}

/* --------------------------------------------------------------------------
   Post list
   -------------------------------------------------------------------------- */

.wp-block-post-template .wp-block-post-title a:hover { color: #2ea3f2; }

.wp-block-query-pagination {
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 14px;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */

.ams-footer a { color: var(--ams-muted); }
.ams-footer a:hover { color: #fff; }
.ams-footer .wp-block-heading { color: #fff; }

.ams-footer__bottom { background: rgba(0, 0, 0, .32); }

/* Page lists read as navigation here, not as prose lists. */
.ams-footer .wp-block-page-list,
.ams-split__aside .wp-block-page-list {
	list-style: none;
	padding-left: 0;
	margin-left: 0;
}

.ams-footer .wp-block-page-list li,
.ams-split__aside .wp-block-page-list li { margin-bottom: 6px; }

/* --------------------------------------------------------------------------
   Skip link
   -------------------------------------------------------------------------- */

.skip-link.screen-reader-text:focus {
	background: #fff;
	color: var(--ams-ink);
	padding: 12px 20px;
	font-family: "Open Sans", Arial, sans-serif;
	font-size: 14px;
	z-index: 1000;
}

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */

@media print {
	.ams-header, .ams-footer, .ams-progress { display: none !important; }
	body { color: #000; font-size: 12pt; }
}