@import "theme";

.revision-card
{
	flex-direction: column;
	width: 360px;
	padding: 20px 22px;
	border-radius: 18px;
	background-color: $surface-deep;
	border: 2px solid rgba( 42, 31, 48, 0.06 );
	box-shadow:
		0px 6px 0px rgba( 0, 0, 0, 0.06 ),
		0px 18px 36px $shadow-soft;
}

.rev-header
{
	flex-direction: row;
	align-items: center;
	gap: 12px;
	margin-bottom: 14px;
}

.rev-pill
{
	font-family: $display-font;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	color: $text-on-yellow;
	background-color: $accent-yellow;
	padding: 5px 12px;
	border-radius: 12px;
	box-shadow: 0px 2px 0px rgba( 0, 0, 0, 0.1 );
}

.rev-age
{
	font-family: $display-font;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: $text-muted;
}

.rev-notes
{
	flex-direction: column;
	gap: 8px;
}

.rev-note
{
	flex-direction: row;
	align-items: flex-start;
	gap: 8px;
}

.rev-bullet
{
	font-family: $display-font;
	font-size: 15px;
	font-weight: 800;
	min-width: 12px;
}

.rev-bullet.added
{
	color: $accent-green;
}

.rev-bullet.improved
{
	color: $accent-blue;
}

.rev-bullet.fixed
{
	color: $accent-cyan;
}

.rev-bullet.removed
{
	color: $accent-red;
}

.rev-text
{
	font-family: $display-font;
	font-size: 14px;
	font-weight: 500;
	color: $text-default;
}

.rev-empty
{
	font-family: $display-font;
	font-size: 13px;
	font-weight: 600;
	color: $text-muted;
}