/* --------------------------------------------------
   Welcome Notes shared UI
-------------------------------------------------- */

.wn-page {
	min-height: 100vh;
	padding: 40px 16px;
	box-sizing: border-box;
	background: var(--wn-bg);
}

.wn-page-center {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}

.wn-note,
.wn-form-wrap,
.wn-dashboard-card,
.wn-disabled-box {
	background: var(--wn-card-bg);
	border: 1px solid var(--wn-border);
	border-radius: 24px;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

.wn-note,
.wn-form-wrap,
.wn-disabled-box {
	max-width: 860px;
	margin: 0 auto;
	padding: 32px 24px;
}

.wn-disabled-box {
	max-width: 620px;
	text-align: center;
}

.wn-topbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-bottom: 18px;
}

.wn-badge,
.wn-status-badge,
.wn-type-badge {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	padding: 8px 12px;
	border-radius: 999px;
}

.wn-badge,
.wn-type-badge {
	background: var(--wn-badge-bg);
	color: var(--wn-badge-text);
}

.wn-status-badge {
	background: var(--wn-status-bg, #f3f4f6);
	color: var(--wn-status-text, #6b7280);
}

.wn-title {
	margin: 0 0 14px;
	font-size: 34px;
	line-height: 1.15;
	color: var(--wn-title);
}

.wn-intro,
.wn-muted {
	color: var(--wn-text);
	line-height: 1.7;
}

.wn-intro {
	font-size: 17px;
	margin-bottom: 28px;
}

.wn-section {
	margin-top: 24px;
	padding-top: 24px;
	border-top: 1px solid var(--wn-border-soft);
}

.wn-section h2 {
	margin: 0 0 16px;
	font-size: 20px;
	color: var(--wn-title);
}

.wn-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

.wn-card {
	background: var(--wn-soft-bg);
	border: 1px solid var(--wn-border-soft);
	border-radius: 16px;
	padding: 16px;
}

.wn-card-title {
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--wn-badge-text);
	margin-bottom: 8px;
}

.wn-card-value {
	font-size: 16px;
	line-height: 1.6;
	color: var(--wn-title);
	word-break: break-word;
}

.wn-card-value a {
	color: var(--wn-title);
	text-decoration: none;
}

.wn-card-value a:hover {
	text-decoration: underline;
}

.wn-rules {
	background: var(--wn-soft-bg);
	border: 1px solid var(--wn-border-soft);
	border-radius: 16px;
	padding: 18px;
	line-height: 1.7;
	color: var(--wn-title);
}

.wn-empty {
	color: #9ca3af;
	font-style: italic;
}

.wn-dashboard {
	max-width: 960px;
	margin: 40px auto;
	padding: 24px;
}

.wn-dashboard-actions {
	margin: 20px 0 28px;
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
}

.wn-dashboard-list {
	display: grid;
	gap: 16px;
}

.wn-dashboard-card {
	padding: 18px;
	background: var(--wn-card-bg);
}

.wn-dashboard-meta {
	font-size: 14px;
	color: var(--wn-text);
	margin-bottom: 14px;
}

.wn-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.wn-btn {
	display: inline-block;
	padding: 10px 14px;
	border-radius: 10px;
	text-decoration: none;
	border: 1px solid var(--wn-border);
	background: var(--wn-soft-bg);
	color: var(--wn-title);
}

.wn-btn-primary {
	display: inline-block;
	padding: 12px 18px;
	background: #1f2937;
	color: #fff;
	border-radius: 12px;
	text-decoration: none;
}

.wn-btn-danger {
	border: 1px solid #f3caca;
	background: #fff5f5;
	color: #b42318;
}

.wn-alert-success {
	margin: 16px 0 20px;
	padding: 14px 16px;
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	border-radius: 12px;
	color: #166534;
}

.wn-login-wrap {
	max-width: 480px;
	margin: 40px auto;
	padding: 24px;
	background: #fff;
	border: 1px solid #eee;
	border-radius: 18px;
}

.wn-disabled-box h1 {
	margin: 0 0 12px;
	font-size: 30px;
	color: var(--wn-title);
}

.wn-disabled-box p {
	margin: 0;
	font-size: 16px;
	line-height: 1.7;
	color: var(--wn-text);
}

/* -----------------------------------------
   Status colors
----------------------------------------- */

.wn-status-active {
	--wn-status-bg: #ecfdf3;
	--wn-status-text: #027a48;
}

.wn-status-disabled {
	--wn-status-bg: #fff1f3;
	--wn-status-text: #c01048;
}

.wn-status-unknown {
	--wn-status-bg: #f3f4f6;
	--wn-status-text: #6b7280;
}

/* -----------------------------------------
   Theme colors per post type
----------------------------------------- */

.wn-theme-default {
	--wn-bg: #f7f7f7;
	--wn-card-bg: #ffffff;
	--wn-soft-bg: #f9fafb;
	--wn-border: #e5e7eb;
	--wn-border-soft: #eeeeee;
	--wn-badge-bg: #f3f4f6;
	--wn-badge-text: #6b7280;
	--wn-title: #111827;
	--wn-text: #6b7280;
}

.wn-theme-accommodation {
	--wn-bg: #f5f1e8;
	--wn-card-bg: #fffdf8;
	--wn-soft-bg: #faf6ee;
	--wn-border: #efe7d8;
	--wn-border-soft: #eee4d1;
	--wn-badge-bg: #f3ead8;
	--wn-badge-text: #8b7355;
	--wn-title: #1f2937;
	--wn-text: #4b5563;
}

.wn-theme-experience {
	--wn-bg: #f5f1e8;
	--wn-card-bg: #fffdf8;
	--wn-soft-bg: #faf6ee;
	--wn-border: #efe7d8;
	--wn-border-soft: #eee4d1;
	--wn-badge-bg: #f3ead8;
	--wn-badge-text: #8b7355;
	--wn-title: #1f2937;
	--wn-text: #4b5563;
}

.wn-theme-meeting {
	--wn-bg: #f5f1e8;
	--wn-card-bg: #fffdf8;
	--wn-soft-bg: #faf6ee;
	--wn-border: #efe7d8;
	--wn-border-soft: #eee4d1;
	--wn-badge-bg: #f3ead8;
	--wn-badge-text: #8b7355;
	--wn-title: #1f2937;
	--wn-text: #4b5563;
}

@media (max-width: 680px) {
	.wn-note,
	.wn-form-wrap {
		padding: 24px 18px;
		border-radius: 18px;
	}

	.wn-title {
		font-size: 28px;
	}

	.wn-grid {
		grid-template-columns: 1fr;
	}
}


/* -----------------------------------------
   ACF frontend form styling
----------------------------------------- */

.wn-form-wrap form {
	margin-top: 8px;
}

.wn-form-wrap .acf-fields {
	border: 0;
	background: transparent;
}

.wn-form-wrap .acf-field {
	padding: 0 0 20px;
	border-top: 0;
}

.wn-form-wrap .acf-label label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 700;
	color: var(--wn-title);
}

.wn-form-wrap .acf-input input[type="text"],
.wn-form-wrap .acf-input input[type="email"],
.wn-form-wrap .acf-input input[type="url"],
.wn-form-wrap .acf-input input[type="number"],
.wn-form-wrap .acf-input input[type="password"],
.wn-form-wrap .acf-input input[type="date"],
.wn-form-wrap .acf-input input[type="time"],
.wn-form-wrap .acf-input textarea,
.wn-form-wrap .acf-input select {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--wn-border);
	border-radius: 14px;
	background: var(--wn-soft-bg);
	color: var(--wn-title);
	box-sizing: border-box;
	font-size: 15px;
	line-height: 1.5;
	box-shadow: none;
}

.wn-form-wrap .acf-input textarea {
	min-height: 140px;
	resize: vertical;
}

.wn-form-wrap .acf-input input:focus,
.wn-form-wrap .acf-input textarea:focus,
.wn-form-wrap .acf-input select:focus {
	outline: none;
	border-color: var(--wn-badge-text);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wn-badge-bg) 70%, white 30%);
}

.wn-form-wrap .acf-input input::placeholder,
.wn-form-wrap .acf-input textarea::placeholder {
	color: #9ca3af;
}

.wn-form-wrap .acf-input .acf-checkbox-list,
.wn-form-wrap .acf-input .acf-radio-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.wn-form-wrap .acf-input .acf-checkbox-list li,
.wn-form-wrap .acf-input .acf-radio-list li {
	margin: 0 0 10px;
}

.wn-form-wrap .acf-notice.-success,
.wn-form-wrap .acf-notice.-error {
	margin: 0 0 20px;
	border-radius: 14px;
	border: 1px solid var(--wn-border);
	box-shadow: none;
}

.wn-form-wrap .acf-notice.-success {
	background: #f0fdf4;
	border-color: #bbf7d0;
	color: #166534;
}

.wn-form-wrap .acf-notice.-error {
	background: #fff5f5;
	border-color: #fecaca;
	color: #b42318;
}

.wn-form-wrap .acf-form-submit {
	padding-top: 8px;
}

.wn-form-wrap .acf-button,
.wn-form-wrap input[type="submit"].acf-button,
.wn-form-wrap .acf-form-submit input[type="submit"] {
	appearance: none;
	border: 0;
	border-radius: 14px;
	background: var(--wn-title);
	color: #fff;
	padding: 14px 20px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-shadow: none;
	transition: transform 0.12s ease, opacity 0.12s ease;
}

.wn-form-wrap .acf-button:hover,
.wn-form-wrap input[type="submit"].acf-button:hover,
.wn-form-wrap .acf-form-submit input[type="submit"]:hover {
	opacity: 0.95;
	transform: translateY(-1px);
}

.wn-form-wrap .acf-button:focus,
.wn-form-wrap input[type="submit"].acf-button:focus,
.wn-form-wrap .acf-form-submit input[type="submit"]:focus {
	outline: none;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wn-badge-bg) 70%, white 30%);
}

.wn-form-wrap .description,
.wn-form-wrap .acf-input .acf-description {
	font-size: 13px;
	line-height: 1.5;
	color: var(--wn-text);
	margin-top: 6px;
}

.wn-form-wrap .acf-error-message {
	border-radius: 12px;
	border: 1px solid #fecaca;
	background: #fff5f5;
	color: #b42318;
	padding: 10px 12px;
}


/* -----------------------------------------
   Auth pages
----------------------------------------- */

.wn-auth-box {
	max-width: 560px;
}

.wn-alert-error {
	margin: 18px 0;
	padding: 14px 16px;
	border: 1px solid #fecaca;
	border-radius: 10px;
	background: #fef2f2;
	color: #991b1b;
	font-weight: 600;
}

.wn-register-form p {
	margin: 0 0 18px;
}

.wn-register-form label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 700;
	color: var(--wn-title);
}

.wn-register-form input[type="text"],
.wn-register-form input[type="email"],
.wn-register-form input[type="password"] {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--wn-border);
	border-radius: 14px;
	background: var(--wn-soft-bg);
	color: var(--wn-title);
	box-sizing: border-box;
	font-size: 15px;
	line-height: 1.5;
	box-shadow: none;
}

.wn-register-form input:focus {
	outline: none;
	border-color: var(--wn-badge-text);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wn-badge-bg) 70%, white 30%);
}

.wn-login-form-block #loginform p {
	margin: 0 0 18px;
}

.wn-login-form-block #loginform label {
	display: block;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 700;
	color: var(--wn-title);
}

.wn-login-form-block #loginform input[type="text"],
.wn-login-form-block #loginform input[type="password"] {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--wn-border);
	border-radius: 14px;
	background: var(--wn-soft-bg);
	color: var(--wn-title);
	box-sizing: border-box;
	font-size: 15px;
	line-height: 1.5;
	box-shadow: none;
}

.wn-login-form-block #loginform input[type="text"]:focus,
.wn-login-form-block #loginform input[type="password"]:focus {
	outline: none;
	border-color: var(--wn-badge-text);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--wn-badge-bg) 70%, white 30%);
}

.wn-login-form-block #loginform .login-submit input[type="submit"] {
	appearance: none;
	border: 0;
	border-radius: 14px;
	background: var(--wn-title);
	color: #fff;
	padding: 14px 20px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-shadow: none;
	transition: transform 0.12s ease, opacity 0.12s ease;
}

.wn-login-form-block #loginform .login-submit input[type="submit"]:hover {
	opacity: 0.95;
	transform: translateY(-1px);
}



/* Show/hide Login and Logout based on user state */
.wn-menu-logout {
	display: none !important;
}

.logged-in .wn-menu-login {
	display: none !important;
}

.logged-in .wn-menu-logout {
	display: list-item !important;
}

/* Fix Share Link button font size */
.wn-share-note-button {
	font-size: inherit;
	font-family: inherit;
	line-height: inherit;
}

/* =========================================================
   Sticky website header/navigation
   ========================================================= */

/*
 * Remove the theme's extra space above and below the header.
 * The header remains sticky while scrolling.
 */
header.wp-block-template-part {
	position: sticky;
	top: 0;
	z-index: 9999;
	margin: 0 !important;
	padding: 0 !important;
	background: #fffdf8;
	box-shadow: 0 2px 12px rgba(31, 41, 55, 0.08);
}

/*
 * Remove block-gap margins that can create an empty strip
 * above the visible navigation row.
 */
header.wp-block-template-part,
header.wp-block-template-part > *,
header.wp-block-template-part .wp-block-group {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

/*
 * Give the visible header row equal spacing at the top and bottom.
 */
header.wp-block-template-part > .wp-block-group,
header.wp-block-template-part .wp-block-group.alignwide,
header.wp-block-template-part .wp-block-group.alignfull {
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}

/*
 * Remove accidental empty spacer blocks inside the header.
 */
header.wp-block-template-part .wp-block-spacer:empty {
	display: none !important;
}

/* Leave space for the WordPress admin bar. */
.admin-bar header.wp-block-template-part {
	top: 32px;
}

@media screen and (max-width: 782px) {
	.admin-bar header.wp-block-template-part {
		top: 46px;
	}

	header.wp-block-template-part > .wp-block-group,
	header.wp-block-template-part .wp-block-group.alignwide,
	header.wp-block-template-part .wp-block-group.alignfull {
		padding-top: 5px !important;
		padding-bottom: 5px !important;
	}
}

/* Remove the default 45px top/bottom padding from the site wrapper */
.wp-site-blocks {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* =========================================================
   Footer styling to match the header
   ========================================================= */

footer.wp-block-template-part {
	margin: 0 !important;
	padding: 0 !important;
	background: #fffdf8;
	border-top: 1px solid #efe7d8;
	box-shadow: 0 -2px 12px rgba(31, 41, 55, 0.06);
}

footer.wp-block-template-part,
footer.wp-block-template-part > *,
footer.wp-block-template-part .wp-block-group {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

footer.wp-block-template-part > .wp-block-group,
footer.wp-block-template-part .wp-block-group.alignwide,
footer.wp-block-template-part .wp-block-group.alignfull {
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}

footer.wp-block-template-part .wp-block-spacer:empty {
	display: none !important;
}

@media screen and (max-width: 680px) {
	footer.wp-block-template-part > .wp-block-group,
	footer.wp-block-template-part .wp-block-group.alignwide,
	footer.wp-block-template-part .wp-block-group.alignfull {
		padding-top: 5px !important;
		padding-bottom: 5px !important;
	}
}

/* =========================================================
   Host template: fixed footer on all Host pages
   ========================================================= */

/*
 * The outer Group in the Host template must use:
 * wn-host-layout
 *
 * The middle content Group must use:
 * wn-host-main
 */
.wn-host-layout {
	min-height: 100vh;
	min-height: 100dvh;
	width: 100%;
	margin: 0 !important;
	padding: 0 0 90px !important;
	box-sizing: border-box;
}

/* Main Host content */
.wn-host-main {
	width: 100%;
}

/*
 * Keep the Host footer permanently visible at the bottom
 * of the browser, including on long pages.
 *
 * WordPress may render the Footer template part as a
 * <footer> or another template-part wrapper.
 */
.wn-host-layout > footer.wp-block-template-part,
.wn-host-layout > .wp-block-template-part:last-child,
.wn-host-layout footer.wp-block-template-part {
	position: fixed !important;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9998;
	width: 100%;
	margin: 0 !important;
	background: #fffdf8;
	border-top: 1px solid #efe7d8;
	box-shadow: 0 -2px 12px rgba(31, 41, 55, 0.08);
}

/* Prevent the footer's inner blocks from adding unwanted margins. */
.wn-host-layout > .wp-block-template-part:last-child,
.wn-host-layout > .wp-block-template-part:last-child > *,
.wn-host-layout footer.wp-block-template-part,
.wn-host-layout footer.wp-block-template-part > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}

/*
 * Reserve extra space on mobile because the footer may wrap
 * onto more than one line.
 */
@media screen and (max-width: 680px) {
	.wn-host-layout {
		padding-bottom: 120px !important;
	}
}

/* Protected-note "View note" button */
button.wn-btn-primary,
input.wn-btn-primary {
	font-family: inherit !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
}