/* Public IBE styles — themed to match the Next.js marketing site
   (website/app/globals.css): deep forest primary, warm gold accent,
   sage supports, Playfair Display headings + Inter body.
   Token overrides are scoped to .ibe-body so admin components
   (buttons.css, forms.css, cards.css) pick up the website palette
   without touching the admin theme. */

.ibe-body {
	/* Website palette mapped onto the admin token names. */
	--nm-bg:        #f6f4ee;
	--nm-surface:   #ffffff;
	--nm-light:     #ffffff;
	--nm-dark:      #e3e7dd;
	--nm-text:      #26302a;
	--nm-muted:     #68736b;
	--nm-faint:     #9aa395;
	--nm-accent:    #1c3b30;   /* website --color-primary  */
	--nm-accent-2:  #2c5a4a;   /* lighter forest for gradients */
	--nm-navy:      #1c3b30;
	--ibe-accent-gold:      #b0894f;   /* website --color-accent */
	--ibe-accent-gold-soft: #cbb187;
	--ibe-sage:             #8ca892;
	--ibe-sage-soft:        #dbe4d8;
	--ibe-primary-dark:     #12271f;

	--glass-bg:        rgba(255, 255, 255, 0.86);
	--glass-bg-strong: rgba(255, 255, 255, 0.94);
	--glass-border:    rgba(255, 255, 255, 0.6);
	--glass-edge:      rgba(28, 59, 48, 0.08);
	--glass-shadow:    0 30px 60px -30px rgba(18, 39, 31, 0.35);

	background: var(--nm-bg);
	min-height: 100vh;
	color: var(--nm-text);
	font-family: 'Inter', system-ui, sans-serif;
}

.ibe-body h1,
.ibe-body h2,
.ibe-body h3,
.ibe-body h4,
.ibe-body h5,
.ibe-body h6 {
	font-family: 'Playfair Display', Georgia, serif;
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.15;
	color: var(--nm-navy);
}

.ibe-body ::selection {
	background-color: var(--ibe-accent-gold);
	color: #ffffff;
}

/* Header — dark forest bar like the website navbar. */
.ibe-header {
	background: var(--ibe-primary-dark);
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	position: sticky;
	top: 0;
	z-index: 1010;
}

.ibe-brand {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 1.25rem;
	letter-spacing: 0.02em;
	color: #ffffff;
	text-decoration: none;
}

.ibe-brand:hover {
	color: var(--ibe-accent-gold-soft);
}

.ibe-nav a {
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
	font-size: 0.82rem;
	font-weight: 500;
	letter-spacing: 0.04em;
}

.ibe-nav a:hover {
	color: var(--ibe-accent-gold-soft);
}

/* Round gold brand mark — website Navbar's fallback logo. */
.ibe-brand-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 9999px;
	background: var(--ibe-accent-gold);
	color: var(--ibe-primary-dark);
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 1.05rem;
	font-weight: 600;
}

/* Gold "Book Now" pill — website .btn-accent. */
.ibe-btn-accent {
	background-color: var(--ibe-accent-gold);
	color: var(--ibe-primary-dark);
	box-shadow: 0 12px 30px -14px rgba(176, 137, 79, 0.75);
	padding: 0.55rem 1.3rem;
}

.ibe-btn-accent:hover {
	background-color: var(--ibe-accent-gold-soft);
	color: var(--ibe-primary-dark);
}

.ibe-main {
	min-height: calc(100vh - 200px);
}

.ibe-hero {
	padding: 3rem 1rem 2rem;
}

/* Pill buttons — mirror the website .btn treatment. */
.ibe-body .btn {
	border-radius: 9999px;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.ibe-body .btn-primary {
	box-shadow: 0 12px 30px -14px rgba(28, 59, 48, 0.7);
}

/* Cards — website .surface-card: white, hairline border, soft drop. */
.ibe-card {
	background: var(--nm-surface);
	border: 1px solid #e3e7dd;
	border-radius: 1rem;
	box-shadow: 0 20px 45px -30px rgba(28, 59, 48, 0.35);
}

.ibe-quote-card {
	position: sticky;
	top: 90px;
}

.ibe-room-img {
	min-height: 180px;
	background: linear-gradient(135deg, var(--ibe-sage-soft) 0%, var(--ibe-sage) 100%);
	border-radius: 1rem 0 0 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.ibe-img-placeholder {
	font-size: 3.5rem;
	color: rgba(255, 255, 255, 0.85);
}

.ibe-features h6 {
	margin-top: 0.5rem;
	font-weight: 700;
}

.ibe-success-icon {
	display: inline-block;
}

/* Footer — dark forest with the website's sage→gold gradient rule. */
.ibe-footer {
	background: var(--ibe-primary-dark);
	border-top: 0;
	position: relative;
	margin-top: 3rem;
	color: rgba(255, 255, 255, 0.75);
}

.ibe-footer::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: linear-gradient(to right, var(--ibe-sage), var(--ibe-accent-gold), var(--ibe-sage));
}

.ibe-footer .text-muted {
	color: rgba(255, 255, 255, 0.55) !important;
}

.ibe-trust span {
	color: rgba(255, 255, 255, 0.75);
	font-size: 0.9rem;
}

.ibe-trust i {
	color: var(--ibe-accent-gold-soft);
	margin-right: 0.35rem;
}

/* Footer columns — website Footer.tsx structure. */
.ibe-footer-brand {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: 1.5rem;
	color: #ffffff;
	margin-bottom: 0.75rem;
}

.ibe-footer-rule {
	display: inline-block;
	height: 1px;
	width: 2.25rem;
	margin-bottom: 1rem;
	background-color: var(--ibe-sage);
	opacity: 0.55;
}

.ibe-footer-heading {
	font-family: 'Inter', system-ui, sans-serif;
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--ibe-accent-gold-soft);
	margin-bottom: 1rem;
}

.ibe-footer-links li {
	margin-bottom: 0.5rem;
}

.ibe-footer-links a {
	color: rgba(255, 255, 255, 0.75);
	text-decoration: none;
	font-size: 0.875rem;
}

.ibe-footer-links a:hover {
	color: #ffffff;
}

.ibe-footer-bottom {
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	margin-top: 2rem;
	padding-top: 1rem;
	text-align: center;
	color: rgba(255, 255, 255, 0.6);
}

/* Website-themed 404 (errors/404-public.php). */
.ibe-404 {
	padding-top: 4rem !important;
	padding-bottom: 5rem !important;
}

.ibe-404-eyebrow {
	display: inline-flex;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--ibe-accent-gold);
}

.ibe-404-code {
	font-family: 'Playfair Display', Georgia, serif;
	font-size: clamp(6rem, 16vw, 9rem);
	line-height: 1;
	margin: 1rem 0 0.5rem;
	color: var(--ibe-sage);
}

.ibe-404-rule {
	display: inline-block;
	height: 1px;
	width: 4.5rem;
	margin-bottom: 1.25rem;
	background-color: var(--ibe-sage);
	opacity: 0.55;
}

@media (max-width: 576px) {
	.ibe-room-img { border-radius: 1rem 1rem 0 0; }
	.ibe-quote-card { position: static; }
}

/* Guest-count steppers (native-controls.js nm-number) — the search card's
   columns are narrow, so slim the +/- buttons to leave the value readable. */
.ibe-card .nm-number-btn {
	width: 32px;
}
.ibe-card .nm-number-input {
	min-width: 2.5rem;
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}
