/* Soup Store branding for the client. Loaded after the upstream styles (see soupstore/brand.mjs). */
.header {
	background: linear-gradient(180deg, #6a9285 0%, #5c8477 100%);
}
.dark .header {
	background: linear-gradient(180deg, #3f5f55 0%, #34503f 100%);
}
.header .logo {
	margin: 3px 0 0 6px;
}
/* Upstream's 144px fits its logo at a 2px margin; ours ends at 152px (6 + 146), plus a gap.
   (Narrow windows use .minitabbar, which upstream resets to 0.) */
.tabbar.maintabbar {
	margin-left: 162px;
}
/* Keep the name and buttons in the top bar readable on green */
.userbar .username,
.userbar .usernametext {
	text-shadow: 0 0 3px #fff, 0 0 3px #fff;
}
.dark .userbar .username,
.dark .userbar .usernametext {
	text-shadow: 0 0 3px #000, 0 0 3px #000;
}
/* News */
.news-embed h3 {
	background: #5c8477;
	color: #fff;
}
.news-embed .newsentry.unread h4::after {
	content: "new";
	margin-left: 6px;
	padding: 0 5px;
	border-radius: 4px;
	background: #8eb9a4;
	color: #1b2a25;
	font-size: 8pt;
	vertical-align: middle;
}
.mainmenufooter a {
	color: inherit;
}
/* Teambuilder Import/Export: room for the "Import from Champions" row */
.teamedit.soupstore-teamedit {
	top: 56px;
}
/* Teambuilder type matchups (src/soupstore-matchups.ts), styled like the set cards */
.ss-matchups {
	box-sizing: border-box;
	width: 631px; /* .setchart: 626px + padding + border */
}
.ss-team-matchups {
	margin: 4px 0 12px 7px; /* lines up with .teamchart */
}
.ss-matchups-toggle {
	background: none;
	border: 0;
	padding: 3px 2px 1px;
	font-size: 8pt;
	font-weight: bold;
	color: #555555;
	cursor: pointer;
}
.ss-mega {
	font-size: 8pt;
	color: #555555;
}
.ss-team-matchups > .ss-matchups-toggle {
	font-size: 10pt;
}
.ss-matchups-toggle:hover {
	color: #000000;
	text-decoration: underline;
}
.ss-matchups-body {
	display: none;
	border: 1px solid #999999;
	background: #DAE5F0;
	border-radius: 5px;
	padding: 3px 6px 4px;
	box-shadow: inset 1px 1px 0 rgba(255,255,255,.6);
}
.ss-open > .ss-matchups-body {
	display: block;
}
/* Card strips: defense and offense side by side */
.ss-matchups.ss-open:not(.ss-team-matchups) > .ss-matchups-body {
	display: flex;
	gap: 10px;
}
.ss-mcol {
	flex: 1 1 0;
	min-width: 0;
}
.ss-mcol h4 {
	margin: 0 0 2px;
	font-size: 8pt;
	color: #333333;
}
.ss-mrow {
	display: flex;
	align-items: flex-start;
	min-height: 18px;
	padding: 1px 0;
}
.ss-mrow label {
	flex: none;
	width: 105px;
	line-height: 16px;
	font-size: 8pt;
	font-weight: bold;
	color: #555555;
}
.ss-icons {
	flex: 1 1 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 3px;
}
.ss-mrow em {
	font-size: 8pt;
	color: #777777;
}
.ss-type {
	display: inline-flex;
	align-items: center;
	line-height: 14px;
	cursor: help;
}
.ss-type small {
	margin: 0 2px 0 1px;
	font-size: 7pt;
	font-weight: bold;
}
/* Changed by an ability, item, Mega or special move: see the tooltip */
.ss-adjusted img {
	outline: 1px dotted #333333;
	outline-offset: 1px;
}
.ss-summary {
	width: 100%;
	border-collapse: collapse;
	font-size: 9pt;
	text-align: center;
}
.ss-summary th {
	padding: 2px 4px;
	font-size: 8pt;
	color: #555555;
	border-bottom: 1px solid #999999;
}
.ss-summary td {
	padding: 1px 4px;
	border-top: 1px solid rgba(0,0,0,.08);
}
/* Separate the defense and offense halves */
.ss-summary tr:first-child th:nth-child(3),
.ss-summary tr:nth-child(2) th:nth-child(5),
.ss-summary td:nth-child(6) {
	border-left: 1px solid #999999;
}
.ss-summary .ss-typecell {
	width: 40px;
	line-height: 14px;
}
.ss-count[title] {
	cursor: help;
	text-decoration: underline dotted;
}
.ss-zero {
	color: #999999;
}
.ss-delta {
	width: 40px;
	font-weight: bold;
}
.ss-bad1 { background: rgba(220,50,50,.15); }
.ss-bad2 { background: rgba(220,50,50,.3); }
.ss-bad3 { background: rgba(220,50,50,.45); }
.ss-good1 { background: rgba(40,160,70,.15); }
.ss-good2 { background: rgba(40,160,70,.3); }
.ss-good3 { background: rgba(40,160,70,.45); }
.ss-legend {
	margin: 4px 0 0;
	font-size: 8pt;
	color: #555555;
}
.ss-legend span {
	padding: 0 3px;
	border-radius: 3px;
}
.dark .ss-matchups-toggle,
.dark .ss-mega,
.dark .ss-mrow label,
.dark .ss-summary th,
.dark .ss-legend {
	color: #BBBBBB;
}
.dark .ss-matchups-toggle:hover,
.dark .ss-mcol h4 {
	color: #FFFFFF;
}
.dark .ss-matchups-body {
	background: #5A6570;
	box-shadow: none;
}
.dark .ss-mrow em,
.dark .ss-zero {
	color: #999999;
}
.dark .ss-adjusted img {
	outline-color: #DDDDDD;
}
.dark .ss-summary td {
	border-top-color: rgba(255,255,255,.08);
}
.dark .ss-bad1 { background: rgba(255,90,90,.2); }
.dark .ss-bad2 { background: rgba(255,90,90,.35); }
.dark .ss-bad3 { background: rgba(255,90,90,.5); }
.dark .ss-good1 { background: rgba(80,200,110,.2); }
.dark .ss-good2 { background: rgba(80,200,110,.35); }
.dark .ss-good3 { background: rgba(80,200,110,.5); }