/* 읽지 않은 채팅 배지(SSOT 11·13절) — x-ui.talk-badge · 채팅 목록의 방별 수. 상단 도구 버튼과 같은 틀, 수는 빨간 알약.
   관리자에는 --shell-bar-* 가 없어 Web Awesome 토큰으로 대신한다 */
.talk-badge {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	inline-size: 42px;
	block-size: 42px;
	border: 1px solid var(--shell-bar-tool-line, var(--wa-color-surface-border));
	border-radius: 0.85rem;
	background: var(--shell-bar-tool-bg, var(--wa-color-surface-raised));
	color: var(--shell-bar-ink, var(--wa-color-text-normal));
	text-decoration: none;
	--webmovie-burst: var(--wa-color-danger-fill-loud), var(--wa-color-brand-fill-loud);
}
.talk-badge:hover { background: var(--shell-bar-hover, var(--wa-color-brand-fill-quiet)); border-color: var(--shell-bar-active-line, var(--wa-color-brand-fill-loud)); }
.talk-badge:focus-visible { outline: 2px solid var(--shell-bar-focus, var(--wa-color-focus)); outline-offset: 2px; }
.talk-unread {
	min-inline-size: 1.25rem;
	padding-inline: 0.3rem;
	border-radius: var(--wa-border-radius-pill);
	background: var(--wa-color-danger-fill-loud);
	color: var(--wa-color-danger-on-loud);
	font-size: calc(0.7rem * var(--wa-font-size-scale, 1));
	font-weight: 700;
	line-height: 1.25rem;
	text-align: center;
}
.talk-badge .talk-unread {
	position: absolute;
	inset-block-start: calc(-1 * var(--wa-space-2xs));
	inset-inline-end: calc(-1 * var(--wa-space-2xs));
	box-sizing: border-box;
	border: 2px solid var(--shell-bar-bg, var(--wa-color-surface-raised));
}
/* 드롭다운 항목 안의 수 */
.toolbar-dropdown .talk-unread { margin-inline-start: var(--wa-space-xs); }
/* webmovie 키트의 stamp 는 span 을 inline-block 으로 만들어 hidden 을 이긴다 — 수가 없으면 숨긴 채로 둔다 */
.booking-chat-unread[hidden] { display: none; }
@media (max-width: 599px) {
	.talk-badge { inline-size: 34px; block-size: 34px; border-radius: 0.7rem; }
}