/**
 * New Bloggers Theme — Crypto news UI (dark-first, Web3 aesthetic).
 *
 * @package New_Bloggers_Theme
 */

/* Crypto design tokens — light defaults on :root */
:root {
	--nbt-crypto-dark-bg: #070b14;
	--nbt-crypto-neon: var(--cst-color-accent, #f7931a);
	--nbt-crypto-gradient: linear-gradient(135deg, var(--cst-color-accent) 0%, #7c4dff 100%);
}

:root,
.nbt-crypto-theme {
	--nbt-crypto-bg: #f6f8fc;
	--nbt-crypto-surface: #ffffff;
	--nbt-crypto-surface-2: #eef3fb;
	--nbt-crypto-text: #000000;
	--nbt-crypto-muted: #5f6f86;
	--nbt-crypto-border: rgba(15, 23, 42, 0.12);
	--nbt-crypto-glow: 0 4px 14px rgba(15, 23, 42, 0.06);
	--nbt-crypto-up: #15803d;
	--nbt-crypto-down: #dc2626;
}

/* Light mode — html class is the toggle source of truth */
html.nbt-light,
html.nbt-light .nbt-crypto-theme,
.nbt-crypto-light {
	color-scheme: light;
	--nbt-crypto-bg: #f6f8fc;
	--nbt-crypto-surface: #ffffff;
	--nbt-crypto-surface-2: #eef3fb;
	--nbt-crypto-text: #000000;
	--nbt-crypto-muted: #5f6f86;
	--nbt-crypto-border: rgba(15, 23, 42, 0.12);
	--nbt-crypto-glow: 0 4px 14px rgba(15, 23, 42, 0.06);
	--nbt-crypto-up: #15803d;
	--nbt-crypto-down: #dc2626;
	--cst-color-bg: var(--nbt-crypto-bg);
	--cst-color-surface: var(--nbt-crypto-surface);
	--cst-color-text: var(--nbt-crypto-text);
	--cst-color-muted: var(--nbt-crypto-muted);
	--cst-color-header: #ffffff;
	--cst-color-header-text: #000000;
	--cst-color-header-link-hover: var(--cst-color-accent);
	--cst-color-border: var(--nbt-crypto-border);
}

/* Dark mode */
html.nbt-dark,
html.nbt-dark .nbt-crypto-theme,
.nbt-crypto-dark {
	color-scheme: dark;
	--nbt-crypto-bg: var(--nbt-crypto-dark-bg, #070b14);
	--nbt-crypto-surface: #0f1624;
	--nbt-crypto-surface-2: #151f32;
	--nbt-crypto-text: #ffffff;
	--nbt-crypto-muted: #8b9cb8;
	--nbt-crypto-border: rgba(255, 255, 255, 0.08);
	--nbt-crypto-glow: 0 6px 18px rgba(0, 0, 0, 0.22);
	--nbt-crypto-up: #00e676;
	--nbt-crypto-down: #ff5252;
	--cst-color-bg: var(--nbt-crypto-bg);
	--cst-color-surface: var(--nbt-crypto-surface);
	--cst-color-text: var(--nbt-crypto-text);
	--cst-color-muted: var(--nbt-crypto-muted);
	--cst-color-header: #05080f;
	--cst-color-header-text: #ffffff;
	--cst-color-header-link-hover: var(--cst-color-accent);
	--cst-color-border: var(--nbt-crypto-border);
	--cst-font-body: "Segoe UI", system-ui, sans-serif;
	--cst-font-heading: "Segoe UI", system-ui, sans-serif;
}

.nbt-crypto-light body,
html.nbt-light body {
	background: var(--nbt-crypto-bg);
	color: var(--nbt-crypto-text);
}

html.nbt-light .cst-header,
html.nbt-light .cst-header .cst-menu a,
html.nbt-light .cst-header .cst-site-title a {
	color: var(--cst-color-header-text);
}

html.nbt-light .cst-header .cst-menu a:hover,
html.nbt-light .cst-header .cst-menu a:focus-visible,
html.nbt-light .cst-header .cst-menu .current-menu-item > a,
html.nbt-light .cst-header .cst-site-title a:hover {
	color: var(--cst-color-header-link-hover, var(--cst-color-accent));
}

html.nbt-light .cst-nav-toggle {
	border-color: var(--nbt-crypto-border);
}

.nbt-crypto-light .cst-header,
html.nbt-light .cst-header {
	background: rgba(255, 255, 255, 0.94);
	border-bottom: 1px solid var(--nbt-crypto-border);
	box-shadow: 0 2px 10px rgba(15, 23, 42, 0.05);
	backdrop-filter: blur(12px);
}

.nbt-crypto-light .cst-card,
.nbt-crypto-light .cst-sidebar,
html.nbt-light .cst-card,
html.nbt-light .cst-sidebar .widget {
	background: var(--nbt-crypto-surface);
	border: 1px solid var(--nbt-crypto-border);
	box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
}

.nbt-crypto-dark body,
html.nbt-dark body {
	background: var(--nbt-crypto-bg);
	color: var(--nbt-crypto-text);
}

.nbt-crypto-dark .cst-header,
html.nbt-dark .cst-header {
	background: rgba(5, 8, 15, 0.92);
	border-bottom: 1px solid var(--nbt-crypto-border);
	backdrop-filter: blur(12px);
}

.nbt-crypto-dark .cst-card,
.nbt-crypto-dark .cst-sidebar,
html.nbt-dark .cst-card,
html.nbt-dark .cst-sidebar .widget {
	background: var(--nbt-crypto-surface);
	border: 1px solid var(--nbt-crypto-border);
	box-shadow: var(--nbt-crypto-glow);
}

/* Ticker */
.nbt-crypto-ticker {
	display: flex;
	align-items: stretch;
	background: linear-gradient(90deg, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.88));
	border-block: 1px solid var(--nbt-crypto-border);
	overflow: hidden;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.nbt-crypto-ticker__label {
	flex: 0 0 auto;
	padding: 0.7rem 1rem;
	background: var(--nbt-crypto-gradient);
	color: #fff;
	font-size: 0.72rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	display: flex;
	align-items: center;
}

.nbt-crypto-ticker__track {
	flex: 1;
	overflow: hidden;
	min-width: 0;
}

.nbt-crypto-ticker__inner {
	display: flex;
	gap: 2rem;
	padding: 0.7rem 1rem;
	animation: nbt-ticker-scroll var(--nbt-ticker-speed, 36s) linear infinite;
	white-space: nowrap;
}

.nbt-crypto-ticker:hover .nbt-crypto-ticker__inner {
	animation-play-state: paused;
}

@keyframes nbt-ticker-scroll {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

.nbt-crypto-ticker__item {
	display: inline-flex;
	align-items: center;
	gap: 0.55rem;
	font-size: 0.86rem;
	color: #f8fafc;
}

.nbt-crypto-ticker__symbol {
	font-weight: 800;
	color: var(--nbt-crypto-neon, #f7931a);
}

.nbt-crypto-ticker__name {
	color: rgba(248, 250, 252, 0.72);
	font-size: 0.78rem;
}

.nbt-crypto-ticker__price {
	font-weight: 700;
}

.nbt-crypto-ticker__change {
	font-weight: 700;
	font-size: 0.8rem;
}

.nbt-crypto-ticker__change--up { color: var(--nbt-crypto-up); }
.nbt-crypto-ticker__change--down { color: var(--nbt-crypto-down); }

.nbt-crypto-ticker__empty {
	margin: 0;
	padding: 0.85rem 1rem;
	color: rgba(248, 250, 252, 0.78);
	font-size: 0.85rem;
}

.nbt-sidebar-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.nbt-sidebar-list--numbered {
	padding-left: 1.1rem;
}

.nbt-sidebar-list a {
	color: inherit;
	text-decoration: none;
}

.nbt-sidebar-list a:hover {
	color: var(--cst-color-accent);
}

.nbt-sidebar-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}

.nbt-sidebar-tag {
	display: inline-flex;
	padding: 0.3rem 0.65rem;
	border: 1px solid var(--cst-color-border);
	border-radius: 999px;
	font-size: 0.78rem;
	text-decoration: none;
	color: inherit;
}

.nbt-sidebar-tag:hover {
	border-color: var(--cst-color-accent);
	color: var(--cst-color-accent);
}

.nbt-sidebar-newsletter {
	display: grid;
	gap: 0.65rem;
}

.nbt-sidebar-newsletter input[type="email"] {
	width: 100%;
	padding: 0.65rem 0.75rem;
	border: 1px solid var(--cst-color-border);
	border-radius: var(--cst-radius);
}

/* Sections */
.nbt-crypto-section {
	margin-block: 2.5rem;
	padding: 1.75rem;
	border: 1px solid var(--nbt-crypto-border);
	border-radius: 12px;
	background: color-mix(in srgb, var(--nbt-crypto-surface) 90%, transparent);
}

.nbt-crypto-section__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1rem;
}

.nbt-crypto-section__eyebrow {
	display: block;
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--nbt-crypto-neon);
	margin-bottom: 0.25rem;
}

.nbt-crypto-section__title {
	margin: 0;
	font-size: 1.35rem;
	background: var(--nbt-crypto-gradient);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.nbt-crypto-section__more {
	font-size: 0.85rem;
	color: var(--nbt-crypto-neon);
	text-decoration: none;
}

/* Market cards */
.nbt-market-movers__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
}

.nbt-market-card {
	padding: 1rem;
	border-radius: 10px;
	background: var(--nbt-crypto-surface-2);
	border: 1px solid var(--nbt-crypto-border);
	transition: transform 0.2s, box-shadow 0.2s;
}

.nbt-market-card:hover {
	transform: translateY(-2px);
	box-shadow: var(--nbt-crypto-glow);
}

.nbt-market-card__top {
	display: flex;
	justify-content: space-between;
	margin-bottom: 0.35rem;
}

.nbt-market-card__symbol {
	font-weight: 800;
	color: var(--nbt-crypto-neon);
}

.nbt-market-card__change--up { color: var(--nbt-crypto-up); }
.nbt-market-card__change--down { color: var(--nbt-crypto-down); }

.nbt-market-card__name {
	margin: 0 0 0.25rem;
	font-size: 1rem;
}

.nbt-market-card__price {
	margin: 0;
	font-size: 1.25rem;
	font-weight: 700;
}

.nbt-market-card__cap {
	margin: 0.35rem 0 0;
	font-size: 0.75rem;
	color: var(--nbt-crypto-muted);
}

/* Crypto post cards */
.nbt-crypto-posts--grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1rem;
}

.nbt-crypto-posts--featured,
.nbt-crypto-posts--split {
	display: grid;
	grid-template-columns: 1.25fr repeat(2, minmax(0, 0.85fr));
	gap: 1rem;
	align-items: stretch;
}

.nbt-crypto-posts--featured .nbt-crypto-card:first-child {
	grid-row: span 2;
}

.nbt-crypto-posts--featured .nbt-crypto-card:first-child .nbt-crypto-card__image,
.nbt-crypto-posts--featured .nbt-crypto-card:first-child .nbt-crypto-card__image--placeholder {
	aspect-ratio: 16 / 13;
}

.nbt-crypto-posts--featured .nbt-crypto-card:first-child .nbt-crypto-card__title {
	font-size: 1.35rem;
}

.nbt-crypto-posts--compact {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.75rem;
}

.nbt-crypto-posts--compact .nbt-crypto-card__link {
	display: grid;
	grid-template-columns: 104px 1fr;
	align-items: stretch;
}

.nbt-crypto-posts--compact .nbt-crypto-card__image,
.nbt-crypto-posts--compact .nbt-crypto-card__image--placeholder {
	height: 100%;
	min-height: 112px;
	aspect-ratio: auto;
}

.nbt-crypto-card {
	border-radius: 10px;
	overflow: hidden;
	background: var(--nbt-crypto-surface-2);
	border: 1px solid var(--nbt-crypto-border);
	height: 100%;
}

.nbt-crypto-card__link {
	display: grid;
	height: 100%;
	color: inherit;
	text-decoration: none;
}

.nbt-crypto-card__image {
	display: block;
	width: 100%;
	aspect-ratio: 16/10;
	object-fit: cover;
}

.nbt-crypto-card__image--placeholder {
	display: block;
	width: 100%;
	aspect-ratio: 16/10;
	background: var(--nbt-crypto-gradient);
	opacity: 0.35;
}

.nbt-crypto-card__body {
	padding: 1.25rem;
	min-width: 0;
}

.nbt-crypto-card__title {
	margin: 0.5rem 0 0;
	font-size: 0.95rem;
	line-height: 1.35;
}

/* Featured analysis */
.nbt-analysis-feature {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: 1.5rem;
	align-items: center;
}

.nbt-analysis-feature__title {
	font-size: 1.5rem;
	margin: 0.5rem 0;
}

.nbt-analysis-feature__title a {
	color: inherit;
	text-decoration: none;
}

.nbt-analysis-feature__excerpt {
	color: var(--nbt-crypto-muted);
}

.nbt-analysis-feature__media img {
	width: 100%;
	border-radius: 10px;
	border: 1px solid var(--nbt-crypto-border);
}

/* Newsletter */
.nbt-crypto-newsletter__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.5rem;
	border-radius: 12px;
	background: var(--nbt-crypto-gradient);
	color: #fff;
}

.nbt-crypto-newsletter__title {
	margin: 0 0 0.35rem;
	color: #fff;
}

.nbt-crypto-newsletter__form {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
}

.nbt-crypto-newsletter__form input {
	padding: 0.65rem 1rem;
	border: none;
	border-radius: 8px;
	min-width: 220px;
	font: inherit;
}

/* Exchange table */
.nbt-exchange-compare__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.9rem;
}

.nbt-exchange-compare__table th,
.nbt-exchange-compare__table td {
	padding: 0.75rem;
	border-bottom: 1px solid var(--nbt-crypto-border);
	text-align: left;
}

.nbt-exchange-rating {
	color: var(--nbt-crypto-neon);
	font-weight: 700;
}

/* Buttons */
.nbt-button--neon {
	display: inline-block;
	padding: 0.6rem 1.2rem;
	border-radius: 8px;
	background: var(--nbt-crypto-gradient);
	color: #fff !important;
	text-decoration: none;
	font-weight: 600;
	border: none;
	cursor: pointer;
}

/* Coin widget */
.nbt-coin-widget__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nbt-coin-widget__item {
	display: grid;
	grid-template-columns: 3rem 1fr auto;
	gap: 0.5rem;
	padding: 0.5rem 0;
	border-bottom: 1px solid var(--nbt-crypto-border);
}

.nbt-coin-widget__symbol { font-weight: 700; color: var(--nbt-crypto-neon); }
.nbt-coin-widget__change--up { color: var(--nbt-crypto-up); }
.nbt-coin-widget__change--down { color: var(--nbt-crypto-down); }
.nbt-coin-widget__note { font-size: 0.7rem; color: var(--nbt-crypto-muted); }

/* Risk disclaimer */
.nbt-risk-disclaimer {
	padding: 1rem 0;
	background: transparent;
	border-top: 0;
}

.nbt-risk-disclaimer__inner {
	padding: 1rem 1.25rem;
	background: #fff1f2;
	border: 1px solid rgba(220, 38, 38, 0.22);
	border-radius: 8px;
}

.nbt-crypto-dark .nbt-risk-disclaimer__inner,
html.nbt-dark .nbt-risk-disclaimer__inner {
	background: #1a0f0f;
	border-color: rgba(255, 82, 82, 0.25);
}

.nbt-risk-disclaimer__label {
	display: block;
	color: #ff8a80;
	margin-bottom: 0.35rem;
	font-size: 0.8rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

.nbt-risk-disclaimer p {
	margin: 0;
	font-size: 0.78rem;
	color: #7f1d1d;
	line-height: 1.5;
}

.nbt-crypto-dark .nbt-risk-disclaimer p,
html.nbt-dark .nbt-risk-disclaimer p {
	color: #c9b8b8;
}

/* Analyst author box */
.nbt-crypto-theme .cst-author-box {
	border: 1px solid var(--nbt-crypto-border);
	background: var(--nbt-crypto-surface-2);
	border-radius: 12px;
	padding: 1.25rem;
}

.nbt-crypto-theme .cst-author-box__role {
	margin: 0 0 0.25rem;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--nbt-crypto-neon);
}

.nbt-crypto-theme .cst-author-box__name::before {
	content: none;
}

/* Breaking bar crypto */
.nbt-crypto-theme .cst-breaking-bar {
	background: var(--nbt-crypto-gradient);
}

.nbt-crypto-theme .cst-breaking-bar__label {
	background: rgba(0, 0, 0, 0.35);
}

/* Hero crypto overlay */
.nbt-crypto-theme .cst-featured-hero__main {
	border: 1px solid var(--nbt-crypto-border);
	box-shadow: var(--nbt-crypto-glow);
}

@media (max-width: 960px) {
	.nbt-market-movers__grid,
	.nbt-crypto-posts--grid,
	.nbt-crypto-posts--featured,
	.nbt-crypto-posts--split,
	.nbt-crypto-posts--compact {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.nbt-crypto-posts--featured .nbt-crypto-card:first-child {
		grid-row: auto;
	}
	.nbt-analysis-feature {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 768px) {
	.nbt-crypto-ticker__track {
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}

	.nbt-crypto-ticker__track::-webkit-scrollbar {
		display: none;
	}

	.nbt-crypto-ticker__inner {
		animation: none;
		width: max-content;
	}
}

@media (max-width: 640px) {
	.nbt-market-movers__grid,
	.nbt-crypto-posts--grid,
	.nbt-crypto-posts--featured,
	.nbt-crypto-posts--split,
	.nbt-crypto-posts--compact {
		grid-template-columns: 1fr;
	}
	.nbt-crypto-posts--compact .nbt-crypto-card__link {
		grid-template-columns: 1fr;
	}
	.nbt-crypto-ticker__label { display: none; }
}