/*!
 * VSForge Stock Market Widgets Lite — ticker.css
 * License: GPLv2 or later — https://www.gnu.org/licenses/gpl-2.0.html
 */


.smw-ticker-wrap {
	border: 1px solid #ddd;
	padding: 6px 10px;
	background: #f9f9f9;
	font-size: 14px;
	line-height: 1;
}

/* --- Sparkline Card --- */
.smw-ticker-wrap.smw-layout-sparkline {
	border: none;
	background: transparent;
	padding: 0;
	display: flex;
	overflow: visible;
	white-space: normal;
}

.smw-ticker-wrap.smw-layout-sparkline .smw-ticker-item {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 8px;
	margin-right: 0;
	padding: 10px 12px 8px;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
	min-width: 180px;
}

.smw-sparkline {
	flex-basis: 100%;
	height: 40px;
	display: block;
	margin-top: 2px;
	overflow: visible;
}

/* --- Single Card --- */
.smw-ticker-wrap.smw-layout-single {
	border: none;
	background: transparent;
	padding: 0;
	display: flex;
	overflow: visible;
	white-space: normal;
}

.smw-ticker-wrap.smw-layout-single .smw-ticker-item {
	flex-direction: row;
	align-items: center;
	gap: 8px;
	margin-right: 0;
	padding: 10px 12px;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}

/* Card info / values helpers (single, sparkline, grid) */
.smw-ticker-info {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.smw-ticker-info strong {
	display: block;
	font-size: 14px;
	font-weight: 700;
	color: #1d2327;
}

.smw-ticker-info small {
	display: block;
	font-size: 11px;
	color: #888;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.smw-ticker-values {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	white-space: nowrap;
	font-size: 13px;
}

/* --- Horizontal Ticker (default) --- */
.smw-ticker-wrap.smw-layout-horizontal {
	display: flex;
	align-items: center;
	overflow-x: auto;
	white-space: nowrap;
	flex-wrap: nowrap;
	width: 100%;
	max-width: var(--wp--style--global--content-size, 100%);
	margin-left: auto;
	margin-right: auto;
	padding: 6px 0;
}

.smw-ticker-wrap.smw-layout-horizontal .smw-ticker-item strong {
	font-weight: 700;
	color: #1d2327;
}

/* Auto-scroll */
@keyframes smw-ticker-scroll {
	0%   { transform: translateX( 0 ); }
	100% { transform: translateX( -50% ); }
}

.smw-ticker-wrap.smw-layout-horizontal.smw-scroll-auto {
	overflow: hidden;
}

.smw-ticker-wrap.smw-layout-horizontal.smw-scroll-auto .smw-ticker-inner {
	display: inline-flex;
	align-items: center;
	width: max-content;
	animation: smw-ticker-scroll 30s linear infinite;
}

.smw-ticker-wrap.smw-layout-horizontal.smw-scroll-auto .smw-ticker-inner:hover {
	animation-play-state: paused;
}

/* --- Vertical List (financial table) --- */
.smw-ticker-wrap.smw-layout-vertical {
	display: table;
	border-collapse: collapse;
	width: 100%;
	white-space: normal;
	overflow: visible;
}

/* Header row */
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-header {
	display: table-row;
}

.smw-ticker-wrap.smw-layout-vertical .smw-ticker-header > span {
	display: table-cell;
	padding: 8px 16px 8px 0;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	color: #999;
	letter-spacing: 0.05em;
	border-bottom: 2px solid #ddd;
	white-space: nowrap;
}

/* Data rows */
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item {
	display: table-row;
	margin-right: 0;
}

.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item:nth-child(odd) {
	background: #f5f6f7;
}

/* All cells */
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item > .smw-ticker-logo-wrap,
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item > .smw-col-name,
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item > .smw-col-price,
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item > .smw-col-change,
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item > .smw-col-pct {
	display: table-cell;
	padding: 10px 16px 10px 0;
	vertical-align: middle;
	white-space: nowrap;
	border-bottom: 1px solid #eee;
}

.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item:last-child > * {
	border-bottom: none;
}

/* Logo cell */
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-item > .smw-ticker-logo-wrap {
	width: 52px;
	padding-right: 8px;
	text-align: center;
}

/* Logo larger in vertical layout */
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-logo {
	height: 36px !important;
	max-height: 36px;
	max-width: 44px;
}

/* Name cell */
.smw-ticker-wrap.smw-layout-vertical .smw-col-name {
	min-width: 160px;
}

.smw-ticker-wrap.smw-layout-vertical .smw-col-name strong {
	display: block;
	font-size: 15px;
	font-weight: 700;
	color: #1d2327;
}

.smw-ticker-wrap.smw-layout-vertical .smw-col-name small {
	display: block;
	font-size: 12px;
	color: #888;
	font-weight: 400;
	margin-top: 2px;
}

/* Price / change / pct — right-aligned */
.smw-ticker-wrap.smw-layout-vertical .smw-col-price,
.smw-ticker-wrap.smw-layout-vertical .smw-col-change,
.smw-ticker-wrap.smw-layout-vertical .smw-col-pct {
	text-align: right;
	min-width: 80px;
	font-size: 14px;
}

.smw-ticker-wrap.smw-layout-vertical .smw-col-pct {
	padding-right: 0;
	min-width: 90px;
}

/* Also make header logo-wrap take up the same space */
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-header > .smw-ticker-logo-wrap {
	width: 52px;
	padding-right: 8px;
}

.smw-ticker-wrap.smw-layout-vertical .smw-ticker-header > .smw-col-price,
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-header > .smw-col-change,
.smw-ticker-wrap.smw-layout-vertical .smw-ticker-header > .smw-col-pct {
	text-align: right;
}

.smw-ticker-wrap.smw-layout-vertical .smw-ticker-header > .smw-col-pct {
	min-width: 90px;
}

/* --- Card Grid --- */
.smw-ticker-wrap.smw-layout-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 10px;
	white-space: normal;
	overflow: visible;
	border: none;
	background: transparent;
	padding: 0;
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-item {
	display: grid;
	grid-template-columns: 48px 1fr;
	grid-template-areas:
		"logo info"
		"price pct";
	column-gap: 8px;
	row-gap: 6px;
	margin-right: 0;
	padding: 10px 12px;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-logo-wrap {
	grid-area: logo;
	align-self: center;
	width: 48px;
	overflow: hidden;
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-logo {
	max-width: 48px;
	width: auto;
	height: auto !important;
	max-height: 22px;
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-info {
	grid-area: info;
	align-self: center;
	text-align: right;
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-price {
	grid-area: price;
	grid-column: 1 / -1;
	white-space: nowrap;
	font-size: 13px;
	font-weight: 500;
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-pct {
	grid-area: pct;
	grid-column: 1 / -1;
	font-size: 13px;
	text-align: right;
}

/* Grid: no logo — symbol+company text in left column */
.smw-ticker-wrap.smw-layout-grid .smw-ticker-logo-wrap:not(:has(img)) {
	display: flex;
	flex-direction: column;
	gap: 1px;
	align-self: center;
	min-width: 0;
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-logo-wrap strong {
	font-size: 14px;
	font-weight: 700;
	color: #1d2327;
	line-height: 1.2;
}

.smw-ticker-wrap.smw-layout-grid .smw-ticker-logo-wrap small {
	font-size: 11px;
	color: #888;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}


.smw-ticker-wrap.smw-loading {
	color: #888;
	font-style: italic;
}

.smw-ticker-item {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-right: 20px;
}

.smw-ticker-logo-wrap {
	display: inline-flex;
	align-items: center;
}

.smw-ticker-logo-wrap:empty {
	display: none;
}

.smw-ticker-logo {
	height: 18px !important;
	max-height: 18px;
	max-width: 100px;
	width: auto !important;
	object-fit: contain;
	vertical-align: middle;
}

.smw-error {
	color: #cc0000;
}

/* --- Dark Theme --- */
.smw-ticker-wrap.smw-dark {
	background: #1a1a2e;
	border-color: #2d2d4e;
	color: #e0e0e0;
}

/* Horizontal: keep the box dark */
.smw-ticker-wrap.smw-dark.smw-layout-horizontal .smw-ticker-item strong {
	color: #f0f0f0;
}

/* Grid: outer wrapper is transparent — darken the cards */
.smw-ticker-wrap.smw-dark.smw-layout-grid .smw-ticker-item {
	background: #1e1e3a;
	border-color: #2d2d4e;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}

/* Single, Sparkline & Grid: wrapper stays transparent in dark mode */
.smw-ticker-wrap.smw-dark.smw-layout-single,
.smw-ticker-wrap.smw-dark.smw-layout-sparkline,
.smw-ticker-wrap.smw-dark.smw-layout-grid {
	background: transparent;
	border-color: transparent;
}

/* Single & Sparkline: darken the card */
.smw-ticker-wrap.smw-dark.smw-layout-single .smw-ticker-item,
.smw-ticker-wrap.smw-dark.smw-layout-sparkline .smw-ticker-item {
	background: #1e1e3a;
	border-color: #2d2d4e;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}

/* Vertical: stripe rows */
.smw-ticker-wrap.smw-dark.smw-layout-vertical .smw-ticker-header > span {
	color: #666;
	border-bottom-color: #2d2d4e;
}

.smw-ticker-wrap.smw-dark.smw-layout-vertical .smw-ticker-item:nth-child(odd) {
	background: #22223a;
}

.smw-ticker-wrap.smw-dark.smw-layout-vertical .smw-ticker-item > * {
	border-bottom-color: #2d2d4e;
}

.smw-ticker-wrap.smw-dark.smw-layout-vertical .smw-col-name strong,
.smw-ticker-wrap.smw-dark.smw-layout-vertical .smw-col-price {
	color: #f0f0f0;
}

.smw-ticker-wrap.smw-dark.smw-layout-vertical .smw-col-name small {
	color: #999;
}

/* Shared text colours */
.smw-ticker-wrap.smw-dark .smw-ticker-info strong,
.smw-ticker-wrap.smw-dark .smw-ticker-logo-wrap strong {
	color: #f0f0f0;
}

.smw-ticker-wrap.smw-dark .smw-ticker-info small,
.smw-ticker-wrap.smw-dark .smw-ticker-logo-wrap small {
	color: #999;
}

.smw-ticker-wrap.smw-dark .smw-ticker-price {
	color: #e0e0e0;
}