/* GeoCity — Visit Amsterdam design system */

/*
 * Color switcher variables (defaults — overridden via Site Settings → Colors).
 * Semantic tokens:
 *   --geocity-color-primary       Brand / logo / trust bar
 *   --geocity-color-button        CTAs, social, footer bar
 *   --geocity-color-button-hover  Button hover state
 *   --geocity-color-accent        Links, nav hover, focus
 *   --geocity-color-accent-hover  Accent hover state
 *   --geocity-color-header-bg     Header background
 *   --geocity-color-footer-bg     Footer main background
 *   --geocity-color-footer-bar-bg Footer bottom bar
 */
:root {
	--geocity-color-primary: #e30613;
	--geocity-color-primary-rgb: 227, 6, 19;
	--geocity-color-button: #e30613;
	--geocity-color-button-rgb: 227, 6, 19;
	--geocity-color-button-hover: #c00510;
	--geocity-color-accent: #e30613;
	--geocity-color-accent-rgb: 227, 6, 19;
	--geocity-color-accent-hover: #c00510;
	--geocity-color-header-bg: #ffffff;
	--geocity-color-footer-bg: #f3f3f3;
	--geocity-color-footer-bar-bg: #e30613;
	--geocity-color-text: #1a1a1a;
	--geocity-color-text-muted: #6b6b6b;
	--geocity-color-border: #d9d9d9;
	--geocity-color-surface: #ffffff;
	--geocity-color-on-primary: #ffffff;
	--geocity-red: var(--geocity-color-primary);
	--geocity-black: var(--geocity-color-text);
	--geocity-muted: var(--geocity-color-text-muted);
	--geocity-border: var(--geocity-color-border);
	--geocity-light: var(--geocity-color-footer-bg);
	--geocity-white: var(--geocity-color-surface);
	--geocity-font-serif: var(--wp--preset--font-family--playfair);
	--geocity-font-sans: var(--wp--preset--font-family--inter);
	--geocity-header-height: auto;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	overflow-x: clip;
	font-family: var(--geocity-font-sans);
	font-size: 1rem;
	line-height: 1.6;
	color: var(--geocity-black);
	background: var(--geocity-white);
}

a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: var(--geocity-color-accent-hover);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

/* ——— Buttons (shared CTA styles — use geocity-btn + modifier on <a> or <button>) ——— */
.geocity-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	margin: 0;
	border: 1.5px solid transparent;
	font-family: inherit;
	font-size: 0.95rem;
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition:
		color 0.2s ease,
		background-color 0.2s ease,
		border-color 0.2s ease;
}

.geocity-btn:focus {
	outline: none;
}

.geocity-btn:focus-visible {
	outline: 2px solid var(--geocity-color-accent, #e30613);
	outline-offset: 2px;
}

/* Filled rectangular CTA (split content, FAQ sidebar, etc.) */
.geocity-btn--primary {
	padding: 0.65rem 1.35rem;
	color: var(--geocity-color-on-primary, #fff);
	background: var(--geocity-color-button, #e30613);
	border-color: var(--geocity-color-button, #e30613);
	border-radius: 6px;
}

.geocity-btn--primary:hover,
.geocity-btn--primary:focus-visible {
	color: var(--geocity-color-on-primary, #fff);
	background: var(--geocity-color-button-hover, #c00510);
	border-color: var(--geocity-color-button-hover, #c00510);
}

/* Filled pill CTA (media banner, button group primary) */
.geocity-btn--pill {
	padding: 0.65rem 1.35rem;
	color: var(--geocity-color-on-primary, #fff);
	background: var(--geocity-color-button, #e30613);
	border-color: var(--geocity-color-button, #e30613);
	border-radius: 999px;
}

.geocity-btn--pill:hover,
.geocity-btn--pill:focus-visible {
	color: var(--geocity-color-on-primary, #fff);
	background: var(--geocity-color-button-hover, #c00510);
	border-color: var(--geocity-color-button-hover, #c00510);
}

/* Large pill for hero banners */
.geocity-btn--pill-lg {
	padding: 0.85rem 2rem;
	font-size: 1rem;
}

/* Outline pill (button group secondary) */
.geocity-btn--outline {
	color: var(--geocity-color-primary, #e30613);
	background: transparent;
	border-color: var(--geocity-color-primary, #e30613);
}

.geocity-btn--outline:hover,
.geocity-btn--outline:focus-visible {
	color: var(--geocity-color-on-primary, #fff);
	background: var(--geocity-color-button-hover, #c00510);
	border-color: var(--geocity-color-button-hover, #c00510);
}

/* Layout helpers */
.geocity-btn--align-start {
	align-self: flex-start;
}

.geocity-btn--mt-auto {
	margin-top: auto;
}

/* Full-bleed GeoCity sections (front end only; editor uses width: 100% in editor.css) */
.geocity-must-sees.alignfull,
.geocity-home .geocity-must-sees,
.geocity-content .alignfull,
.geocity-home .alignfull,
.is-layout-constrained > .geocity-must-sees,
.is-layout-constrained > [class*="geocity-"].alignfull {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	box-sizing: border-box;
}

/* ——— Content area ——— */
.geocity-content {
	padding-block: 0;
}

/* No global max-width on post content — blocks use .geocity-container when needed */
.geocity-content .wp-block-post-content,
.geocity-home .wp-block-post-content {
	max-width: none;
	margin: 0;
	padding: 0;
}

.geocity-home {
	padding: 0;
	margin: 0;
}