/* Read-only booking cards and quiet group activity notices (SSOT 6/11/13/18). */
.talk-room .talk-message[data-booking-notice='true'] {
	--sonub-notice-ink: var(--wa-color-brand-on-quiet);
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-self: flex-start;
	flex: none;
	box-sizing: border-box;
	inline-size: min(100%, 26rem);
	max-inline-size: 100%;
	gap: 0;
	padding: 0;
	border: 1px solid var(--wa-color-surface-border);
	border-radius: var(--wa-border-radius-l);
	background: var(--wa-color-surface-raised);
	box-shadow: none;
	overflow: hidden;
}
.talk-room .talk-message[data-booking-notice='true']:has([data-state='paid'], [data-state='trial']) {
	--sonub-notice-ink: var(--wa-color-success-on-quiet);
}
.talk-room .talk-message[data-booking-notice='true']:has([data-state='cancelled']) {
	--sonub-notice-ink: var(--wa-color-danger-on-quiet);
}
.talk-room .talk-message[data-booking-notice='true']:has([data-state='attention']) {
	--sonub-notice-ink: var(--wa-color-warning-on-quiet);
}
.talk-room .talk-booking-notice { --sonub-notice-icon-size: 2rem; grid-column: 1 / -1; min-inline-size: 0; padding: var(--wa-space-s); }
.talk-room .talk-notice-heading {
	display: grid;
	grid-template-columns: var(--sonub-notice-icon-size) minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--wa-space-xs);
}
.talk-room .talk-notice-icon {
	display: grid;
	place-items: center;
	inline-size: var(--sonub-notice-icon-size);
	block-size: var(--sonub-notice-icon-size);
	font-size: var(--wa-font-size-m);
	color: var(--sonub-notice-ink);
}
.talk-room .talk-notice-reference { color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-xs); text-align: end; }
.talk-room .talk-notice-title { min-inline-size: 0; margin: 0; color: var(--sonub-notice-ink); font-size: var(--wa-font-size-s); font-weight: var(--wa-font-weight-semibold); line-height: 1.4; }
.talk-room .talk-notice-description { margin: var(--wa-space-xs) 0 0; margin-inline-start: calc(var(--sonub-notice-icon-size) + var(--wa-space-xs)); font-size: var(--wa-font-size-xs); line-height: 1.5; }
.talk-room .talk-notice-people {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wa-space-xs) var(--wa-space-m);
	margin: var(--wa-space-s) 0;
}
.talk-room .talk-notice-person { display: grid; grid-template-columns: var(--sonub-notice-icon-size) minmax(0, 1fr); flex: 1 1 9rem; align-items: center; gap: var(--wa-space-xs); min-inline-size: 0; }
.talk-room .talk-notice-person > div { display: grid; justify-items: start; min-inline-size: 0; }
.talk-room .talk-notice-avatar { flex: none; inline-size: var(--sonub-notice-icon-size); block-size: var(--sonub-notice-icon-size); font-size: var(--wa-font-size-m); }
.talk-room .talk-notice-role { display: block; color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-xs); line-height: 1.3; }
.talk-room .talk-notice-name { display: block; min-inline-size: 0; max-inline-size: 100%; font-size: var(--wa-font-size-s); font-weight: var(--wa-font-weight-semibold); line-height: 1.4; overflow-wrap: anywhere; }
.talk-room .talk-notice-schedule { display: grid; grid-template-columns: var(--sonub-notice-icon-size) minmax(0, 1fr); align-items: start; gap: var(--wa-space-xs); }
.talk-room .talk-notice-schedule > i { display: grid; place-items: center; inline-size: var(--sonub-notice-icon-size); block-size: calc(var(--wa-font-size-s) * 1.5); color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-m); }
.talk-room .talk-notice-schedule > div { display: flex; align-items: baseline; flex-wrap: wrap; column-gap: var(--wa-space-xs); min-inline-size: 0; line-height: 1.5; }
.talk-room .talk-notice-date { font-size: var(--wa-font-size-s); font-weight: var(--wa-font-weight-semibold); }
.talk-room .talk-notice-time { margin: 0; font-size: var(--wa-font-size-s); }
.talk-room .talk-notice-time > time { font-size: inherit; }
.talk-room .talk-notice-details { display: flex; flex-wrap: wrap; gap: var(--wa-space-xs); flex-basis: 100%; margin: 0; color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-xs); }
.talk-room .talk-notice-timezone { overflow-wrap: anywhere; }
.talk-room .talk-message[data-booking-notice='true'] > .talk-link {
	display: flex;
	justify-self: stretch;
	align-items: center;
	justify-content: space-between;
	gap: var(--wa-space-s);
	min-block-size: 2.5rem;
	margin: 0;
	padding: var(--wa-space-xs) var(--wa-space-s);
	border: 0;
	border-block-start: 1px solid var(--wa-color-surface-border);
	border-radius: 0;
	background: var(--wa-color-surface-lowered);
	color: var(--wa-color-brand-on-quiet);
	font-size: var(--wa-font-size-xs);
	font-weight: var(--wa-font-weight-semibold);
	text-decoration: none;
}
.talk-room .talk-message[data-booking-notice='true'] > .talk-link > span { min-inline-size: 0; overflow-wrap: anywhere; }
.talk-room .talk-message[data-booking-notice='true'] > .talk-link > span > i { display: none; }
.talk-room .talk-message[data-booking-notice='true'] > .talk-link:hover { background: var(--wa-color-brand-fill-quiet); }
.talk-room .talk-message[data-booking-notice='true'] > .talk-link:focus-visible { outline-offset: -3px; }
.talk-room .talk-message[data-booking-notice='true'] > .talk-meta { align-items: center; justify-content: flex-end; margin: 0; padding: var(--wa-space-xs) var(--wa-space-s); border-block-start: 1px solid var(--wa-color-surface-border); background: var(--wa-color-surface-lowered); line-height: 1.4; }
.talk-room .talk-message[data-booking-notice='true'] > .talk-meta > time { font-size: var(--wa-font-size-xs); line-height: 1.4; color: var(--wa-color-text-quiet); }
.talk-room .talk-message[data-system-message='true'] {
	position: relative;
	align-self: flex-start;
	box-sizing: border-box;
	min-inline-size: 0;
	max-inline-size: min(32rem, calc(100% - 2.5rem));
	margin-block-start: calc(var(--wa-font-size-xs) * 1.4 + var(--wa-space-xs));
	gap: var(--wa-space-3xs);
	border: 1px dashed var(--wa-color-neutral-border-normal);
	border-radius: var(--wa-border-radius-l);
	border-start-start-radius: var(--wa-border-radius-s);
	background: var(--wa-color-surface-lowered);
	color: var(--wa-color-text-normal);
	box-shadow: none;
	text-align: start;
	overflow: visible;
}
.talk-room .talk-message[data-system-message='true']:not([data-booking-notice]) { padding: var(--wa-space-xs) var(--wa-space-s); }
.talk-room .talk-notice-author { position: absolute; inset-block-end: calc(100% + var(--wa-space-2xs)); inset-inline-start: 0; display: flex; align-items: center; gap: var(--wa-space-2xs); padding: 0; color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-xs); font-weight: var(--wa-font-weight-semibold); line-height: 1.4; white-space: nowrap; }
.talk-room .talk-message[data-system-message='true'][data-booking-notice='true'] > .talk-link { border-end-start-radius: var(--wa-border-radius-l); }
.talk-room .talk-message[data-system-message='true'][data-booking-notice='true'] > .talk-meta { border-end-end-radius: var(--wa-border-radius-l); }
.talk-room .talk-message[data-system-message='true'][data-booking-notice='true'] { gap: 0; }
.talk-room .talk-message[data-system-message='true'] .talk-text { font-size: var(--wa-font-size-m); line-height: 1.5; }
.talk-room .talk-message[data-system-message='true']:not([data-booking-notice]) > .talk-meta { display: flex; justify-content: flex-end; padding: 0; font-size: var(--wa-font-size-xs); line-height: 1.3; }
.talk-room .talk-message[data-system-message='true'] > .talk-meta > time { font-size: var(--wa-font-size-xs); }
