/* Download Beacon */
/* dmzx/linkbbcode - 2026 duotone-split restyle */

.extra-box {
	display: flex;
	align-items: stretch;
	border-radius: 12px;
	text-decoration: none !important;
	border: 1px solid rgba(0, 0, 0, 0.08);
	max-width: 320px;
	margin: 8px 0;
	font-family: inherit;
	box-shadow: none;
}

.extra-box .eb-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 16px;
	flex-shrink: 0;
	color: #ffffff;
	border-radius: 11px 0 0 11px;
}

.extra-box .eb-icon svg {
	width: 20px;
	height: 20px;
	display: block;
}

.extra-box .eb-body {
	padding: 10px 14px;
	min-width: 0;
	background: #ffffff;
	border-radius: 0 11px 11px 0;
}

.extra-box .eb-title {
	display: block;
	font-size: 14px;
	font-weight: bold;
	color: #1a1a1a !important;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-decoration: none !important;
	text-shadow: none !important;
}

.extra-box .eb-meta {
	display: block;
	font-size: 12px;
	color: #6b6b6b !important;
	margin: 2px 0 0;
	text-shadow: none !important;
}

/* Colour variants - flat solid fills, no gradients */
.extra-box.orange .eb-icon { background: #e07b1f; }
.extra-box.blue .eb-icon { background: #3f6aa8; }
.extra-box.light-blue .eb-icon { background: #2f93c9; }
.extra-box.dirty-blue .eb-icon { background: #6f7c8f; }
.extra-box.purple .eb-icon { background: #7457c2; }
.extra-box.green .eb-icon { background: #5c9142; }

/* Posting-editor colour-picker dropdown previews - same flat colours */
.extra-boxs {
	display: inline-block;
	padding: 1px 6px;
	border-radius: 4px;
	color: #ffffff !important;
}

.extra-boxs.orange { background-color: #e07b1f; }
.extra-boxs.blue { background-color: #3f6aa8; }
.extra-boxs.light-blue { background-color: #2f93c9; }
.extra-boxs.dirty-blue { background-color: #6f7c8f; }
.extra-boxs.purple { background-color: #7457c2; }
.extra-boxs.green { background-color: #5c9142; }