/*
 * AutoNews Publisher: Security Roundup posts (1.4.2.4).
 * Loaded only on single posts made by the Security Roundup. Sizes are in px because some
 * sites set a 10px root font size. Fonts are inherited from the theme.
 */

.autonews-rr {
	/* Body size from the blog post standard: 17px, 16px on phones (1.4.2.14). */
	font-size: 17px;
	--autonews-rr-accent: #355f76;
	--autonews-rr-ink: #353f47;
	--autonews-rr-text: #595a5c;
	--autonews-rr-rule: #e2e0d7;
	--autonews-rr-soft: #f7f8f4;
}

.autonews-rr h2[id],
.autonews-rr h3[id] {
	scroll-margin-top: 96px;
}

.autonews-rr-label {
	margin: 0 0 8px;
	color: var(--autonews-rr-accent);
	/* Sizes on p and td elements are important (1.4.2.10): zox-news sets #mvp-content-main p to 17.6px. */
	font-size: 13px !important;
	font-weight: 700;
	letter-spacing: 0.06em;
	line-height: 1.4;
	text-transform: uppercase;
}

/* Short answer */
.autonews-rr-answer {
	margin: 0 0 28px;
	padding: 20px 24px;
	background: var(--autonews-rr-soft);
	border: 1px solid var(--autonews-rr-rule);
	border-left: 4px solid var(--autonews-rr-accent);
	border-radius: 8px;
	color: var(--autonews-rr-ink);
}

.autonews-rr-answer p {
	margin: 0 0 8px;
}

.autonews-rr-answer p:last-child {
	margin-bottom: 0;
}

/* Every link in the post uses the accent, whatever the theme's link color (1.4.2.5: the
   wpguynews theme links in chartreuse, 1.5:1 on white). Colors in this file that must win
   are marked important: themes style post text with ID selectors (1.4.2.7: zox-news uses
   #mvp-content-main p and #mvp-content-main p a, both black), which no class rule can beat. */
.autonews-rr a,
.autonews-rr a:visited {
	color: var(--autonews-rr-accent) !important;
	text-decoration: underline;
}

.autonews-rr a:hover,
.autonews-rr a:focus {
	color: var(--autonews-rr-ink) !important;
}

/* Contents list */
.autonews-rr-toc {
	margin: 0 0 32px;
	padding: 18px 24px;
	border: 1px solid var(--autonews-rr-rule);
	border-radius: 8px;
}

.autonews-rr-toc ol {
	margin: 0;
	padding-left: 22px;
}

.autonews-rr-toc li {
	margin: 0 0 6px;
}

.autonews-rr-toc li:last-child {
	margin-bottom: 0;
}

/* Summary table: a scroll box that never widens the page */
.autonews-rr-table-wrap {
	width: 0;
	min-width: 100%;
	margin: 0 0 12px;
	overflow-x: auto;
}

.autonews-rr-table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	border: 1px solid var(--autonews-rr-rule);
	font-size: 15px;
	line-height: 1.5;
}

.autonews-rr-table td {
	font-size: 15px !important;
}

/* px padding marked important (1.4.2.8): zox-news sets "#mvp-content-main td { padding: 5px 1.5% }",
   and Chrome leaves percentage padding out when it sizes table columns, so the Severity
   text ran into the padding and touched the Fixed in column. */
.autonews-rr-table th,
.autonews-rr-table td {
	padding: 10px 14px !important;
	border: 0;
	border-bottom: 1px solid var(--autonews-rr-rule);
	text-align: left;
	vertical-align: top;
}

.autonews-rr-table thead th {
	background: var(--autonews-rr-ink);
	color: #ffffff;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.autonews-rr-table tbody tr:nth-child(even) {
	background: var(--autonews-rr-soft);
}

.autonews-rr-table td:first-child a {
	font-weight: 600;
}

.autonews-rr-table td:nth-child(2) {
	white-space: nowrap;
}

.autonews-rr-table th:nth-child(3),
.autonews-rr-table td:nth-child(3) {
	min-width: 110px;
}

.autonews-rr-note,
.autonews-rr-copy {
	color: var(--autonews-rr-text);
	font-size: 14px !important;
	line-height: 1.6;
}

.autonews-rr-note {
	margin: 0 0 32px;
}

/* Issue separators (1.4.2.15, JW: break up the list). A Light Gray rule and space above every
   issue after the first. CSS only, so drafts saved before this change get it too. */
.autonews-rr h3[id^="issue-"] {
	margin-top: 36px !important;
	padding-top: 28px !important;
	border-top: 1px solid #aeb0b2;
}

.autonews-rr h3#issue-1 {
	margin-top: 24px !important;
	padding-top: 0 !important;
	border-top: 0;
}

/* Steps and lists */
.autonews-rr-steps li,
.autonews-rr-list li,
.autonews-rr-sources li {
	margin: 0 0 8px;
}

/* FAQ */
.autonews-rr-faq {
	margin: 0 0 32px;
}

.autonews-rr-faq details {
	margin: 0 0 10px;
	background: #ffffff;
	border: 1px solid var(--autonews-rr-rule);
	border-radius: 8px;
}

.autonews-rr-faq summary {
	position: relative;
	padding: 14px 48px 14px 18px;
	color: var(--autonews-rr-ink);
	cursor: pointer;
	font-weight: 700;
	line-height: 1.4;
	list-style: none;
}

.autonews-rr-faq summary::-webkit-details-marker {
	display: none;
}

.autonews-rr-faq summary::after {
	content: "+";
	position: absolute;
	top: 50%;
	right: 18px;
	transform: translateY(-50%);
	color: var(--autonews-rr-accent);
	font-size: 22px;
	font-weight: 700;
	line-height: 1;
}

.autonews-rr-faq details[open] summary::after {
	content: "-";
}

.autonews-rr-faq summary:focus-visible {
	outline: 2px solid var(--autonews-rr-accent);
	outline-offset: 2px;
}

.autonews-rr-faq details p {
	margin: 0;
	padding: 0 18px 16px;
	color: var(--autonews-rr-text);
}

/* Closing call to action (1.4.2.6). Chartreuse only on the dark box, per the brand guide. */
.autonews-rr-final {
	margin: 40px 0 32px;
	padding: 32px 28px;
	background: var(--autonews-rr-accent);
	border-radius: 12px;
	color: #ffffff;
}

.autonews-rr .autonews-rr-final h2,
.autonews-rr .autonews-rr-final p {
	color: #ffffff !important;
}

.autonews-rr .autonews-rr-final h2 {
	margin-top: 0;
}

.autonews-rr .autonews-rr-final .autonews-rr-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	margin: 20px 0 0;
}

.autonews-rr .autonews-rr-final a:not(.autonews-rr-btn) {
	color: #cfdd2d !important;
}

.autonews-rr a.autonews-rr-btn,
.autonews-rr a.autonews-rr-btn:visited {
	display: inline-block;
	padding: 13px 22px;
	background: #cfdd2d;
	border: 0;
	border-radius: 6px;
	color: #353f47 !important;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.3;
	text-decoration: none;
	text-transform: uppercase;
	transition: background 0.15s, box-shadow 0.15s;
}

.autonews-rr a.autonews-rr-btn:hover,
.autonews-rr a.autonews-rr-btn:focus {
	background: #b9c528;
	box-shadow: 0 4px 18px rgba(207, 221, 45, 0.35);
	color: #353f47 !important;
}

.autonews-rr a.autonews-rr-btn-out,
.autonews-rr a.autonews-rr-btn-out:visited {
	padding: 11px 20px;
	background: transparent;
	border: 2px solid #ffffff;
	color: #ffffff !important;
}

.autonews-rr a.autonews-rr-btn-out:hover,
.autonews-rr a.autonews-rr-btn-out:focus {
	background: rgba(255, 255, 255, 0.12);
	box-shadow: none;
	color: #ffffff !important;
}

.autonews-rr a.autonews-rr-btn:focus-visible {
	outline: 2px solid #ffffff;
	outline-offset: 2px;
}

/* Author bio */
.autonews-rr-bio {
	display: flex;
	gap: 20px;
	align-items: flex-start;
	margin: 0 0 32px;
	padding: 22px 24px;
	background: var(--autonews-rr-soft);
	border: 1px solid var(--autonews-rr-rule);
	border-radius: 12px;
}

.autonews-rr-bio-photo {
	flex: 0 0 96px;
	margin: 0;
}

.autonews-rr-bio-photo img {
	display: block;
	width: 96px;
	height: 96px;
	background: var(--autonews-rr-accent);
	border-radius: 50%;
	object-fit: cover;
	object-position: top;
}

.autonews-rr-bio p {
	margin: 0 0 10px;
	font-size: 15px !important;
}

.autonews-rr-bio p:last-child {
	margin-bottom: 0;
}

/* Keep reading */
.autonews-rr-related ul {
	padding-left: 20px;
}

.autonews-rr-related li {
	margin: 0 0 8px;
}

/* Data license notices (1.4.2.9): required in every copy, so shown in full, small, at the very end */
.autonews-rr-license {
	margin: 32px 0 0;
	padding: 14px 0 0;
	border-top: 1px solid var(--autonews-rr-rule);
}

.autonews-rr-license .autonews-rr-copy {
	margin: 0 0 10px;
	/* 12px (1.4.2.11, JW: smaller): the floor, since the blog standard bans 9-10px text. */
	font-size: 12px !important;
	line-height: 1.5;
}

@media (prefers-reduced-motion: reduce) {
	.autonews-rr a.autonews-rr-btn {
		transition: none;
	}
}

/* Phones: the table becomes one card per row */
@media (max-width: 640px) {
	.autonews-rr {
		font-size: 16px;
	}

	.autonews-rr-final {
		padding: 26px 20px;
	}

	.autonews-rr-bio {
		flex-direction: column;
	}

	.autonews-rr-answer,
	.autonews-rr-toc {
		padding: 16px 18px;
	}

	.autonews-rr-table,
	.autonews-rr-table tbody,
	.autonews-rr-table tr,
	.autonews-rr-table td {
		display: block;
		box-sizing: border-box;
		width: 100%;
	}

	.autonews-rr-table td:nth-child(2) {
		white-space: normal;
	}

	.autonews-rr-table {
		border: 0;
	}

	.autonews-rr-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.autonews-rr-table tr,
	.autonews-rr-table tbody tr:nth-child(n) {
		margin: 0 0 12px;
		padding: 10px 14px;
		background: #ffffff;
		border: 1px solid var(--autonews-rr-rule);
		border-radius: 8px;
	}

	.autonews-rr-table td {
		padding: 4px 0 !important;
		border: 0;
	}

	.autonews-rr-table th:nth-child(3),
	.autonews-rr-table td:nth-child(3) {
		min-width: 0;
	}

	.autonews-rr-table td[data-label]::before {
		content: attr(data-label) ": ";
		color: var(--autonews-rr-ink);
		font-weight: 700;
	}
}

.autonews-rr-license .autonews-rr-label {
	font-size: 12px !important;
}
