/*
Theme Name: Cruisez
Description: Full Site Editing theme for the Cruisez sailing directory and editorial pages.
Version: 1.0.6
Requires at least: 6.9
Requires PHP: 8.0
Text Domain: cruisez
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

.cruisez-shell {
	--cruisez-wash: var(--wp--preset--color--surface-soft);
	--cruisez-border: var(--wp--preset--color--border);
	--cruisez-ink: var(--wp--preset--color--text);
	--cruisez-teal: var(--wp--preset--color--accent);
	--cruisez-muted: var(--wp--preset--color--muted);
	box-sizing: border-box;
	width: min(100% - clamp(2rem, 7vw, 6rem), 1180px);
	margin-inline: auto;
}

.cruisez-main { margin-block: 1.6rem 3rem; }
.cruisez-header, .cruisez-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem 2rem;
}
.cruisez-header { min-height: 76px; border-bottom: 1px solid var(--cruisez-border); }
.cruisez-footer { border-top: 1px solid var(--cruisez-border); padding-block: 1.2rem; }
.cruisez-header > *, .cruisez-footer > *, .cruisez-fact > * { margin-block: 0; }
.cruisez-brand { flex: 0 0 auto; }
.cruisez-brand .wp-block-site-logo { margin: 0; }
.cruisez-brand .wp-block-site-title { font-size: 1.55rem; margin: 0; font-weight: 750; }
.cruisez-brand:has(.wp-block-site-logo img) .wp-block-site-title { display: none; }
.cruisez-nav { color: var(--cruisez-ink); font-size: 0.94rem; font-weight: 650; }
.cruisez-nav a { color: inherit; }
.cruisez-nav a:hover, .cruisez-nav .current-menu-item > a { color: var(--cruisez-teal); text-decoration: underline; }
.cruisez-nav .wp-block-navigation__responsive-container.is-menu-open { padding: 1.25rem; }
.cruisez-shell :focus-visible { outline: 2px solid var(--cruisez-teal); outline-offset: 4px; }

.cruisez-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 0;
	overflow: hidden;
	border-radius: 0.85rem;
	background: var(--cruisez-wash);
}
.cruisez-hero-copy { margin: 0; padding: clamp(1.25rem, 4vw, 2.65rem); }
.cruisez-hero-copy h1 { margin-block: 0.35em; }
.cruisez-hero-copy p:not(:first-child) { max-width: 63ch; }
.cruisez-hero-media { margin: 0; min-width: 0; }
.cruisez-hero-media:not(:has(img, video, iframe)) { display: none; }
.cruisez-hero:not(:has(.cruisez-hero-media :is(img, video, iframe))) { grid-template-columns: 1fr; }
.cruisez-hero-media .wp-block-image { height: 100%; margin: 0; }
.cruisez-hero-media .wp-block-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cruisez-hero-media .wp-block-image:has(figcaption) { display: grid; grid-template-rows: minmax(0, 1fr) auto; }
.cruisez-hero-media figcaption { padding-inline: 1rem; }
.cruisez-quick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.75rem; }
.cruisez-quick .wp-block-button__link {
	display: block; width: 100%; border: 1px solid var(--cruisez-border);
	background: #fff; color: var(--cruisez-ink); text-align: left; padding: 0.65rem 0.9rem;
}
.cruisez-quick .wp-block-button__link::after { content: '→' / ''; float: right; color: var(--cruisez-teal); }
.cruisez-quick .wp-block-button__link:hover { border-color: var(--cruisez-teal); }
.cruisez-search { width: min(100%, 40rem); }
.cruisez-page-search { margin-inline: auto; }
.cruisez-search :is(input[type=search], input[type=text]) {
	box-sizing: border-box; border: 1px solid var(--cruisez-border); border-radius: 0.45rem;
	min-width: 0; padding: 0.6rem 0.8rem; font: inherit;
}
.cruisez-search :is(button, input[type=submit]) {
	border: 1px solid var(--cruisez-teal); border-radius: 0.45rem; background: var(--cruisez-teal);
	color: #fff; padding: 0.6rem 0.9rem; font: inherit; cursor: pointer;
}
.cruisez-ad {
	border: 1px solid var(--cruisez-border); border-radius: 0.55rem;
	padding: 0.85rem 1rem; background: #f5f8f9;
}
.cruisez-ad > p { margin-block: 0.25em; }

.cruisez-main .wp-block-post-template.is-layout-grid { gap: 0.85rem; }
.cruisez-main .wp-block-post-template :is(.type-cruisedetails, .type-flycruises) > .wp-block-group {
	box-sizing: border-box; height: 100%; padding: 0.9rem 1rem !important;
	border: 1px solid var(--cruisez-border) !important; border-radius: 0.65rem !important;
	box-shadow: none; background: #fff;
}
.cruisez-main .wp-block-post-template .wp-block-post-title {
	font-size: 1.08rem;
	font-weight: 700;
	line-height: 1.35;
}
.cruisez-main .wp-block-post-template .wp-block-post-title a { text-decoration: none; }
.cruisez-main .wp-block-post-template .wp-block-post-title a:hover { text-decoration: underline; }
.cruisez-main .wp-block-post-template .wp-block-post-excerpt { color: var(--cruisez-muted); }
.cruisez-main .wp-block-post-template .wp-block-post-terms { font-size: 0.86rem; }
.cruisez-main .wp-block-post-template .cruisez-duration { font-weight: 600; }
.cruisez-editorial .wp-block-rank-math-toc-block { border-radius: 0.65rem; }
.cruisez-editorial .wp-block-rank-math-toc-block a { color: inherit; }

.cruisez-cruise-mast { padding: clamp(1.1rem, 4vw, 2.25rem); border-radius: 0.85rem; background: var(--cruisez-wash); }
.cruisez-cruise-mast .wp-block-post-title { max-width: 35ch; margin-block: 0.35em 0; overflow-wrap: anywhere; }
.cruisez-eyebrow { color: var(--cruisez-teal); text-transform: uppercase; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.11em; }
.cruisez-cruise-layout.wp-block-columns { align-items: flex-start !important; gap: clamp(1rem, 3vw, 2.5rem); }
.cruisez-cruise-layout > .wp-block-column:first-child { flex: 2 1 0; }
.cruisez-cruise-layout > .wp-block-column:last-child { flex: 1 1 0; }
.cruisez-itinerary > p:first-child { padding: 0.85rem 1rem; background: var(--cruisez-wash); border-inline-start: 4px solid var(--cruisez-teal); border-radius: 0.4rem; }
.cruisez-itinerary > p:first-child, .cruisez-facts, .cruisez-facts > :first-child { margin-block-start: 0; }
.cruisez-itinerary li + li { border-top: 1px solid var(--cruisez-border); }
.cruisez-itinerary li { padding-block: 0.45rem; }
.cruisez-facts { border: 1px solid var(--cruisez-border); border-radius: 0.7rem; overflow: hidden; }
.cruisez-facts .cruisez-ship-image, .cruisez-facts .cruisez-ship-image img { display: block; width: 100%; margin: 0; }
.cruisez-facts .cruisez-ship-image img { aspect-ratio: 16 / 9; object-fit: cover; }
.cruisez-facts .wp-element-caption { padding-inline: 0.9rem; }
.cruisez-fact { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.18em 0.35em; padding: 0.52rem 0.9rem; margin: 0; font-size: 0.9rem; }
.cruisez-fact + .cruisez-fact { border-top: 1px solid var(--cruisez-border); }
.cruisez-fact-label { margin-inline-end: auto; padding-inline-end: 0.6rem; color: var(--cruisez-muted); }
.cruisez-fact .wp-block-post-terms { font-weight: 650; }
.cruisez-summary, .cruisez-note, .cruisez-related, .cruisez-result {
	border: 1px solid var(--cruisez-border); border-radius: 0.65rem; padding: 0.85rem 1rem;
}
.cruisez-note { color: var(--cruisez-muted); font-size: 0.9rem; background: #f5f8f9; }

@media (max-width: 900px) {
	.cruisez-main .wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 781px) {
	.cruisez-hero, .cruisez-quick, .cruisez-main .wp-block-post-template.is-layout-grid { grid-template-columns: minmax(0, 1fr); }
	.cruisez-hero-media img { max-height: 20rem; }
	.cruisez-cruise-layout.wp-block-columns { align-items: stretch !important; }

	.cruisez-main .wp-block-post-template :is(.type-cruisedetails, .type-flycruises) .wp-block-post-excerpt {
		font-size: calc(1em + 1px);
	}
	/* WordPress applies its font-size preset classes with !important. */
	.cruisez-main .wp-block-post-template :is(.type-cruisedetails, .type-flycruises) .wp-block-post-excerpt.has-small-font-size {
		font-size: calc(var(--wp--preset--font-size--small) + 1px) !important;
	}
	.cruisez-cruise :is(.cruisez-itinerary, .cruisez-summary) {
		font-size: calc(1em + 1px);
	}
}
@media (min-width: 600px) and (max-width: 980px) {
	.cruisez-header .cruisez-nav .wp-block-navigation__responsive-container-open { display: flex; }
	.cruisez-header .cruisez-nav .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
}

.editor-styles-wrapper .cruisez-hero-media,
.editor-styles-wrapper .cruisez-hero-media:not(:has(img, video, iframe)) {
	display: block;
	min-height: 4rem;
	outline: 1px dashed var(--cruisez-border);
	outline-offset: -0.4rem;
}