/* بانک مشتریان — دکمه‌ی بیضی (پیل) برای نمایش نام کاربر یا دعوت به ورود، در هدر و حساب کاربری. */

a.ddcb-pill,
button.ddcb-pill {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 34px;
	margin: 0;
	padding-inline-start: 3px;
	padding-inline-end: 16px;
	font: inherit;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	color: #fff;
	white-space: nowrap;
	background: linear-gradient(135deg, #783942, #5C2C35);
	border: 0;
	border-radius: 9999px;
	box-shadow: none;
	cursor: pointer;
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
a.ddcb-pill:hover,
a.ddcb-pill:focus-visible,
button.ddcb-pill:hover,
button.ddcb-pill:focus-visible {
	color: #fff;
	background: linear-gradient(135deg, #8E4B58, #6B323B);
	transform: translateY(-1px);
	box-shadow: 0 6px 16px rgba(120, 57, 66, .35);
}
a.ddcb-pill:active,
button.ddcb-pill:active { transform: translateY(0); }

.ddcb-pill__avatar {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .2);
	font-size: 12px;
	font-weight: 700;
}
.ddcb-pill__avatar svg { width: 15px; height: 15px; stroke: #fff; }
.ddcb-pill__label {
	overflow: hidden;
	max-width: 130px;
	text-overflow: ellipsis;
}

/* Shown on hover/focus of the pill — e.g. the header's "my account" button revealing the wallet balance. */
.ddcb-pill__tip {
	position: absolute;
	top: calc(100% + 10px);
	inset-inline-end: 0;
	z-index: 20;
	min-width: 190px;
	padding: 10px 14px;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.6;
	color: #fff;
	white-space: normal;
	background: linear-gradient(135deg, #39242D, #0f1620);
	border: 1px solid rgba(255, 255, 255, .08);
	border-radius: 10px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, .35);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-4px);
	transition: opacity .18s ease, transform .18s ease, visibility .18s;
	pointer-events: none;
}
.ddcb-pill__tip::before {
	content: "";
	position: absolute;
	bottom: 100%;
	inset-inline-end: 18px;
	border: 6px solid transparent;
	border-bottom-color: #39242D;
}
a.ddcb-pill:hover .ddcb-pill__tip,
a.ddcb-pill:focus .ddcb-pill__tip,
a.ddcb-pill:focus-within .ddcb-pill__tip {
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
}