/**
 * AutoMag Pro — News Magazine Layout
 */

/* ── News Archive ── */
.news-archive {
	padding-block: var(--space-8);
}

.news-archive__header {
	margin-block-end: var(--space-10);
	text-align: center;
}

.news-archive__title {
	font-size: clamp(var(--font-size-3xl), 5vw, var(--font-size-5xl));
	margin-block-end: var(--space-3);
}

.news-archive__desc {
	font-size: var(--font-size-lg);
	color: var(--color-text-muted);
	max-width: 600px;
	margin-inline: auto;
}

/* Category Filter */
.news-categories {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-2);
	margin-block-end: var(--space-10);
	padding: var(--space-2);
	background: var(--color-surface-muted);
	border-radius: var(--radius-full);
	max-width: fit-content;
	margin-inline: auto;
}

.news-categories__link {
	display: inline-flex;
	padding: var(--space-2) var(--space-5);
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-medium);
	color: var(--color-text-muted);
	text-decoration: none;
	border-radius: var(--radius-full);
	transition: all var(--transition-fast);
}

.news-categories__link:hover,
.news-categories__link.is-active {
	background: var(--color-bg-elevated);
	color: var(--color-text);
	box-shadow: var(--shadow-sm);
}

.news-categories__link.is-active {
	color: var(--color-accent);
}

/* Magazine Grid */
.news-magazine {
	display: grid;
	gap: var(--space-6);
}

.news-magazine__hero {
	grid-column: 1 / -1;
}

@media (min-width: 1024px) {
	.news-magazine {
		grid-template-columns: repeat(12, 1fr);
	}

	.news-magazine__hero {
		grid-column: span 8;
		grid-row: span 2;
	}

	.news-magazine__sidebar {
		grid-column: span 4;
		display: flex;
		flex-direction: column;
		gap: var(--space-6);
	}

	.news-magazine__grid {
		grid-column: span 8;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--space-6);
	}
}

/* News Card Variants */
.news-card {
	position: relative;
}

.news-card--hero {
	min-height: 480px;
}

.news-card--hero .news-card__media {
	position: absolute;
	inset: 0;
	aspect-ratio: auto;
}

.news-card--hero .news-card__media::after {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, transparent 60%);
}

.news-card--hero .news-card__body {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: var(--space-8);
	color: var(--color-white);
	z-index: 1;
}

.news-card--hero .news-card__title {
	font-size: clamp(var(--font-size-xl), 3vw, var(--font-size-3xl));
	color: var(--color-white);
}

.news-card--hero .news-card__title a {
	color: inherit;
}

.news-card--hero .news-card__excerpt {
	color: rgba(255, 255, 255, 0.8);
	font-size: var(--font-size-base);
}

.news-card--compact {
	flex-direction: row;
	align-items: center;
}

.news-card--compact .news-card__media {
	width: 100px;
	flex-shrink: 0;
	aspect-ratio: 1;
	border-radius: var(--radius-md);
}

.news-card--compact .news-card__body {
	padding: var(--space-4);
}

.news-card--compact .news-card__title {
	font-size: var(--font-size-base);
}

.news-card__excerpt {
	font-size: var(--font-size-sm);
	color: var(--color-text-muted);
	line-height: var(--line-height-relaxed);
	margin-block-start: var(--space-2);
}

.news-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-block-start: auto;
	padding-block-start: var(--space-3);
}

.news-card__author {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--font-size-xs);
	color: var(--color-text-muted);
}

.news-card__author img {
	width: 24px;
	height: 24px;
	border-radius: var(--radius-full);
	object-fit: cover;
}

.news-card__read-time {
	font-size: var(--font-size-xs);
	color: var(--color-text-muted);
}

/* ── Single News Article ── */
.single-news .site-main {
	padding-block: var(--space-6);
}

.news-single {
	max-width: var(--container-narrow);
	margin-inline: auto;
}

.news-single__header {
	text-align: center;
	margin-block-end: var(--space-10);
}

.news-single__category {
	display: inline-flex;
	margin-block-end: var(--space-4);
}

.news-single__title {
	font-size: clamp(var(--font-size-2xl), 4vw, var(--font-size-4xl));
	line-height: var(--line-height-tight);
	margin-block-end: var(--space-6);
}

.news-single__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: var(--space-4);
	font-size: var(--font-size-sm);
	color: var(--color-text-muted);
}

.news-single__author {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.news-single__author img {
	width: 40px;
	height: 40px;
	border-radius: var(--radius-full);
	object-fit: cover;
}

.news-single__featured-image {
	margin-block: var(--space-8);
	border-radius: var(--radius-xl);
	overflow: hidden;
}

.news-single__featured-image img {
	width: 100%;
	height: auto;
}

.news-single__featured-caption {
	font-size: var(--font-size-sm);
	color: var(--color-text-muted);
	text-align: center;
	padding-block-start: var(--space-3);
}

/* Article Content */
.news-single__content {
	font-size: var(--font-size-lg);
	line-height: var(--line-height-relaxed);
}

.news-single__content > * + * {
	margin-block-start: 1.5em;
}

.news-single__content h2 {
	font-size: var(--font-size-2xl);
	margin-block: 2em 0.75em;
}

.news-single__content h3 {
	font-size: var(--font-size-xl);
	margin-block: 1.5em 0.5em;
}

.news-single__content blockquote {
	margin-inline: 0;
	padding: var(--space-6) var(--space-8);
	border-inline-start: 4px solid var(--color-accent);
	background: var(--color-surface-muted);
	border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
	font-style: italic;
	font-size: var(--font-size-xl);
	color: var(--color-text);
}

.news-single__content figure {
	margin-block: var(--space-8);
}

.news-single__content figcaption {
	font-size: var(--font-size-sm);
	color: var(--color-text-muted);
	text-align: center;
	margin-block-start: var(--space-3);
}

.news-single__content img {
	border-radius: var(--radius-lg);
}

.news-single__content a {
	color: var(--color-accent);
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Table of Contents */
.news-toc {
	background: var(--color-surface-muted);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	padding: var(--space-6);
	margin-block: var(--space-8);
}

.news-toc__title {
	font-size: var(--font-size-base);
	font-weight: var(--font-weight-semibold);
	margin-block: 0 var(--space-4);
}

.news-toc__list {
	list-style: none;
	padding: 0;
	margin: 0;
	counter-reset: toc;
}

.news-toc__list li {
	counter-increment: toc;
}

.news-toc__list a {
	display: flex;
	align-items: baseline;
	gap: var(--space-3);
	padding: var(--space-2) 0;
	font-size: var(--font-size-sm);
	color: var(--color-text-muted);
	text-decoration: none;
	border-bottom: 1px solid var(--color-border);
	transition: color var(--transition-fast);
}

.news-toc__list a::before {
	content: counter(toc, decimal-leading-zero);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-semibold);
	color: var(--color-accent);
	min-width: 1.5em;
}

.news-toc__list a:hover,
.news-toc__list a.is-active {
	color: var(--color-accent);
}

.news-toc__list li:last-child a {
	border-bottom: none;
}

/* Tags */
.news-tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	margin-block: var(--space-8);
	padding-block-start: var(--space-8);
	border-top: 1px solid var(--color-border);
}

.news-tags__label {
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-semibold);
	color: var(--color-text-muted);
	margin-inline-end: var(--space-2);
}

.news-tag {
	display: inline-flex;
	padding: var(--space-2) var(--space-4);
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-medium);
	background: var(--color-surface-muted);
	border-radius: var(--radius-full);
	color: var(--color-text);
	text-decoration: none;
	transition: all var(--transition-fast);
}

.news-tag:hover {
	background: var(--color-accent);
	color: var(--color-white);
}

/* Share Bar */
.news-share-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-4);
	padding: var(--space-5) var(--space-6);
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	margin-block: var(--space-8);
	position: sticky;
	top: calc(var(--header-height) + var(--space-4));
	z-index: 10;
}

.news-share-bar__label {
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-semibold);
}

.news-share-bar__buttons {
	display: flex;
	gap: var(--space-2);
}

/* Author Box */
.news-author-box {
	display: flex;
	gap: var(--space-6);
	padding: var(--space-8);
	background: var(--color-surface-muted);
	border-radius: var(--radius-xl);
	margin-block: var(--space-10);
}

.news-author-box__avatar {
	flex-shrink: 0;
	width: 80px;
	height: 80px;
	border-radius: var(--radius-full);
	object-fit: cover;
}

.news-author-box__name {
	font-size: var(--font-size-lg);
	font-weight: var(--font-weight-semibold);
	margin-block-end: var(--space-2);
}

.news-author-box__bio {
	font-size: var(--font-size-sm);
	color: var(--color-text-muted);
	line-height: var(--line-height-relaxed);
}

/* Related Articles */
.news-related {
	margin-block-start: var(--space-16);
	padding-block-start: var(--space-8);
	border-top: 1px solid var(--color-border);
}

.news-related__title {
	font-size: var(--font-size-2xl);
	margin-block-end: var(--space-8);
}

/* Infinite Scroll */
.news-load-more {
	text-align: center;
	padding-block: var(--space-10);
}

.news-load-more__btn {
	min-width: 200px;
}

.news-load-more__btn.is-loading {
	pointer-events: none;
}

.news-infinite-sentinel {
	height: 1px;
	visibility: hidden;
}

/* Breaking News Banner */
.breaking-news {
	display: flex;
	align-items: center;
	gap: var(--space-4);
	padding: var(--space-3) var(--space-6);
	background: var(--color-accent);
	color: var(--color-white);
	font-size: var(--font-size-sm);
	overflow: hidden;
}

.breaking-news__label {
	flex-shrink: 0;
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
	letter-spacing: var(--letter-spacing-wider);
	padding: var(--space-1) var(--space-3);
	background: rgba(0, 0, 0, 0.2);
	border-radius: var(--radius-xs);
}

.breaking-news__ticker {
	flex: 1;
	overflow: hidden;
	white-space: nowrap;
}

.breaking-news__ticker-inner {
	display: inline-block;
	animation: ticker 30s linear infinite;
}

.breaking-news__ticker a {
	color: var(--color-white);
	text-decoration: none;
	margin-inline-end: var(--space-8);
}

.breaking-news__ticker a:hover {
	text-decoration: underline;
}

@keyframes ticker {
	0% { transform: translateX(0); }
	100% { transform: translateX(-50%); }
}

/* News Sidebar Widgets */
.news-sidebar-widget {
	background: var(--color-bg-elevated);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-xl);
	padding: var(--space-6);
	margin-block-end: var(--space-6);
}

.news-sidebar-widget__title {
	font-size: var(--font-size-base);
	font-weight: var(--font-weight-semibold);
	margin-block: 0 var(--space-5);
	padding-block-end: var(--space-3);
	border-bottom: 1px solid var(--color-border);
}

.news-popular-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.news-popular-list li {
	display: flex;
	gap: var(--space-3);
	padding-block: var(--space-3);
	border-bottom: 1px solid var(--color-border);
}

.news-popular-list li:last-child {
	border-bottom: none;
}

.news-popular-list__rank {
	flex-shrink: 0;
	width: 24px;
	font-size: var(--font-size-lg);
	font-weight: var(--font-weight-bold);
	color: var(--color-accent);
}

.news-popular-list__title {
	font-size: var(--font-size-sm);
	font-weight: var(--font-weight-medium);
	line-height: var(--line-height-snug);
}

.news-popular-list__title a {
	color: var(--color-text);
	text-decoration: none;
}

.news-popular-list__title a:hover {
	color: var(--color-accent);
}

/* Print styles for news */
@media print {
	.news-share-bar,
	.news-toc,
	.news-related,
	.news-load-more,
	.breaking-news {
		display: none;
	}

	.news-single__content {
		font-size: 12pt;
	}
}
