/*
 * AH Community Panel: space mock (deep navy app with rooms, pinned posts, rules) beside the
 * rituals, the two tiers and the waiting-list box (#waitlist). The mock stays in view on desktop.
 */
.ah-cp {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
	gap: 40px;
	align-items: start;
	font-family: var(--ah-f-body);
	font-size: 17px;
	line-height: 1.75;
	color: var(--ah-ink);
}
.ah-cp.ah-cp--single { grid-template-columns: minmax(0, 1fr); }
.ah-cp .ah-cp__side { display: grid; gap: 22px; min-width: 0; }

/* ---------- the space mock ---------- */
.ah-cp .ah-cp__app {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	min-height: 400px;
	overflow: hidden;
	border: 1px solid var(--ah-line-navy);
	border-radius: 14px;
	background: var(--ah-deep);
	color: var(--ah-on-navy);
	box-shadow: 0 40px 80px -50px rgba(9, 18, 42, .8);
}
.ah-cp.ah-cp--sticky .ah-cp__app { position: sticky; top: 110px; }
.admin-bar .ah-cp.ah-cp--sticky .ah-cp__app { top: 142px; }
.ah-cp .ah-cp__rooms { display: grid; gap: 4px; align-content: start; padding: 16px 10px; border-inline-end: 1px solid var(--ah-line-navy); background: rgba(255, 255, 255, .03); }
.ah-cp .ah-cp__ttl {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 4px 8px 10px;
	font-family: var(--ah-f-display);
	font-weight: 800;
	font-size: .92rem;
	line-height: 1.4;
	color: var(--ah-gold-hi);
}
.ah-cp .ah-cp__list { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.ah-cp .ah-cp__room {
	display: flex;
	gap: 6px;
	margin: 0;
	padding: 6px 8px;
	border-radius: 6px;
	font-size: .86rem;
	line-height: 1.5;
	color: var(--ah-on-navy-muted);
	overflow-wrap: anywhere;
}
.ah-cp .ah-cp__room::before { content: "#"; flex: none; color: var(--ah-gold); }
.ah-cp .ah-cp__room.is-on { background: rgba(232, 201, 136, .12); color: var(--ah-on-navy); }
.ah-cp .ah-cp__feed { display: grid; gap: 14px; align-content: start; min-width: 0; padding: 20px; }
.ah-cp .ah-cp__pin {
	display: grid;
	gap: 8px;
	padding: 16px;
	border: 1px solid var(--ah-line-navy);
	border-radius: 10px;
	background: rgba(255, 255, 255, .03);
	transition: border-color .3s, background-color .3s;
}
.ah-cp .ah-cp__pin:hover { border-color: rgba(232, 201, 136, .4); background: rgba(255, 255, 255, .05); }
.ah-cp .ah-cp__lb { font-family: var(--ah-f-mono); font-size: .68rem; letter-spacing: .2em; line-height: 1.5; color: var(--ah-gold-hi); }
.ah-cp .ah-cp__pt { font-family: var(--ah-f-display); font-weight: 700; font-size: 1.08rem; line-height: 1.5; color: var(--ah-on-navy); }
.ah-cp .ah-cp__px { font-size: .86rem; line-height: 1.7; color: var(--ah-on-navy-muted); }
.ah-cp .ah-cp__rules { display: grid; gap: 4px; padding-inline-start: 12px; border-inline-start: 2px solid var(--ah-gold); font-size: .86rem; line-height: 1.7; color: var(--ah-on-navy-muted); }
.ah-cp .ah-cp__rules b { color: var(--ah-on-navy); }
.ah-cp .ah-cp__rules ul { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; }
.ah-cp .ah-cp__rules li { margin: 0; }
.ah-motion .ah-cp .ah-rv .ah-cp__feed .ah-fade { transition-delay: calc(.3s + var(--k, 0) * 120ms); }

/* ---------- rituals ---------- */
.ah-cp .ah-cp__rituals { display: grid; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--ah-ink); }
.ah-cp .ah-cp__rituals li { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 14px; margin: 0; padding: 16px 0; border-bottom: 1px solid var(--ah-line); }
.ah-cp .ah-cp__when { padding-top: 3px; font-family: var(--ah-f-mono); font-size: .76rem; line-height: 1.6; color: var(--ah-ink-gold); }
.ah-cp .ah-cp__rituals b { display: block; line-height: 1.6; }
.ah-cp .ah-cp__rituals li span:not(.ah-cp__when) { display: block; font-size: .9rem; line-height: 1.7; color: var(--ah-muted); }
.ah-motion .ah-cp .ah-cp__rituals.ah-rv .ah-fade { transition-delay: calc(.1s + var(--k, 0) * 90ms); }

/* ---------- tiers ---------- */
.ah-cp .ah-cp__tiers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ah-cp .ah-cp__tier { display: grid; gap: 8px; align-content: start; padding: 18px; border: 1px solid var(--ah-line); border-radius: 10px; background: var(--ah-paper); color: var(--ah-ink); }
.ah-cp .ah-cp__tier--pro { border-color: var(--ah-navy); background: var(--ah-navy); color: var(--ah-on-navy); }
.ah-cp .ah-cp__tn { line-height: 1.6; }
.ah-cp .ah-cp__tp { justify-self: start; font-family: var(--ah-f-mono); font-size: 1em; line-height: 1.5; direction: ltr; unicode-bidi: isolate; color: var(--ah-ink-gold); }
.ah-cp .ah-cp__tier--pro .ah-cp__tp { color: var(--ah-gold-hi); }
.ah-cp .ah-cp__tx { font-size: .86rem; line-height: 1.7; color: var(--ah-muted); }
.ah-cp .ah-cp__tier--pro .ah-cp__tx { color: var(--ah-on-navy-muted); }
.ah-cp a.ah-cp__tl { margin-top: 4px; }
.ah-cp .ah-cp__tl .ah-btn__arr { flex: none; width: 1em; height: 1em; transition: translate .35s var(--ah-ease); }
[dir="rtl"] .ah-cp .ah-cp__tl .ah-btn__arr { scale: -1 1; }
.ah-cp a.ah-cp__tl:hover .ah-btn__arr { translate: calc(var(--ah-dir) * 4px) 0; }

/* ---------- waiting list ---------- */
.ah-cp .ah-cp__wait {
	display: grid;
	gap: 12px;
	padding: 22px;
	border: 1px solid var(--ah-line);
	border-radius: 10px;
	background: var(--ah-paper);
	color: var(--ah-ink);
	scroll-margin-top: 110px;
}
.ah-cp .ah-cp__wait:target { border-color: var(--ah-ink-gold); box-shadow: 0 0 0 4px rgba(197, 165, 114, .18); }
.ah-cp .ah-cp__note { font-size: 1.15rem; color: var(--ah-ink-gold); }
.ah-cp .ah-cp__wt { font-family: var(--ah-f-display); font-weight: 700; font-size: 1.2rem; line-height: 1.5; }
.ah-cp .ah-cp__wx { margin: 0; font-size: .9rem; line-height: 1.7; color: var(--ah-muted); }
.ah-cp .ah-cp__form .ah-lf { flex-wrap: wrap; }
.ah-cp .ah-cp__form .ah-lf .ah-lf__email.ah-lf__email { flex: 1 1 200px; padding: 12px 14px; background: var(--ah-ivory); color: var(--ah-ink); border-color: var(--ah-line); }
[dir="rtl"] .ah-cp .ah-cp__form .ah-lf .ah-lf__email.ah-lf__email { text-align: right; }
.ah-cp .ah-cp__form .ah-lf .ah-lf__email:focus-visible { outline: 2px solid var(--ah-gold); outline-offset: 2px; }
.ah-cp .ah-cp__form .ah-btn:focus-visible { outline: 2px solid var(--ah-gold); outline-offset: 3px; }
.ah-cp .ah-cp__form .ah-lf__msg { margin: 0; font-size: .8rem; line-height: 1.6; }

/* on a navy section (the cards keep their own colours) */
.ah-cp.ah-on-dark { color: var(--ah-on-navy); }
.ah-cp.ah-on-dark .ah-cp__rituals { border-top-color: var(--ah-gold-hi); }
.ah-cp.ah-on-dark .ah-cp__rituals li { border-bottom-color: var(--ah-line-navy); }
.ah-cp.ah-on-dark .ah-cp__when { color: var(--ah-gold-hi); }
.ah-cp.ah-on-dark .ah-cp__rituals li span:not(.ah-cp__when) { color: var(--ah-on-navy-muted); }
.ah-cp.ah-on-dark .ah-cp__wait .ah-lf__msg { color: var(--ah-ink-gold); }
.ah-cp.ah-on-dark .ah-cp__wait .ah-lf__msg[data-state="bad"],
.ah-cp.ah-on-dark .ah-cp__wait .ah-lf__msg[data-state="error"] { color: var(--ah-red); }
.ah-cp.ah-on-dark .ah-cp__wait .ah-hand { color: var(--ah-ink-gold); }
.ah-cp.ah-on-dark .ah-cp__tier:not(.ah-cp__tier--pro) .ah-cp__tn { color: var(--ah-ink); }

@media (max-width: 1024px) {
	.ah-cp { grid-template-columns: minmax(0, 1fr); }
	.ah-cp.ah-cp--sticky .ah-cp__app { position: static; }
}
@media (max-width: 767px) {
	.ah-cp { gap: 28px; font-size: 16.5px; }
	.ah-cp .ah-cp__app { grid-template-columns: minmax(0, 1fr); min-height: 0; }
	.ah-cp .ah-cp__rooms { display: flex; flex-wrap: wrap; border-inline-end: 0; border-bottom: 1px solid var(--ah-line-navy); }
	.ah-cp .ah-cp__ttl { width: 100%; }
	.ah-cp .ah-cp__list { display: flex; flex-wrap: wrap; gap: 4px; }
	.ah-cp .ah-cp__feed { padding: 16px; }
	.ah-cp .ah-cp__rituals li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
	.ah-cp .ah-cp__tiers { grid-template-columns: minmax(0, 1fr); }
	.ah-cp .ah-cp__wait { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
	.ah-cp .ah-cp__pin, .ah-cp .ah-cp__tl .ah-btn__arr { transition: none; }
}
