/*
 * DaazMarkets PRO — Market Tabs
 * Tabbed version of the compact market bar.
 * Depends on market-bar.css (tile classes: .daaz-mbar-*, .daaz-mbar-up, .daaz-mbar-down).
 */

/* ── Outer wrapper ────────────────────────────────────────────────────────── */
.daaz-mtabs-wrap {
	font-family: var(--gmp-font, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif);
	background: transparent;
	border-radius: 0;
	overflow: visible;
}

/* ── Tab nav bar ──────────────────────────────────────────────────────────── */
.daaz-mtabs-nav {
	display: flex;
	overflow-x: auto;
	scrollbar-width: none;
	background: transparent;
	border-bottom: 2px solid #e5e7eb; /* gray-200 */
	padding: 0;
	margin-bottom: 0;
}
.daaz-mtabs-nav::-webkit-scrollbar {
	display: none;
}

/* ── Tab button ───────────────────────────────────────────────────────────── */
.daaz-mtabs-tab {
	flex-shrink: 0;
	padding: 10px 16px;
	background: none;
	border: none;
	border-bottom: 2px solid transparent;
	margin-bottom: -2px; /* overlap the nav border-bottom */
	color: #9ca3af; /* gray-400 */
	font-size: 0.72rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	cursor: pointer;
	white-space: nowrap;
	line-height: 1;
	transition: color 0.15s ease, border-color 0.15s ease;
}
.daaz-mtabs-tab:hover,
.daaz-mtabs-tab:focus-visible {
	color: #374151; /* gray-700 */
	outline: none;
}
.daaz-mtabs-tab.is-active {
	color: #111827; /* gray-900 */
	border-bottom-color: #059669; /* emerald — matches tile up color */
}

/* ── Tab panels ───────────────────────────────────────────────────────────── */
.daaz-mtabs-panel {
	display: none;
}
.daaz-mtabs-panel.is-active {
	display: block;
}

/* Scroll wrapper inside each panel */
.daaz-mtabs-scroll {
	scrollbar-width: thin;
	scrollbar-color: #d1d5db transparent;
	cursor: grab;
}
.daaz-mtabs-scroll:active {
	cursor: grabbing;
}
.daaz-mtabs-scroll::-webkit-scrollbar {
	height: 4px;
}
.daaz-mtabs-scroll::-webkit-scrollbar-track {
	background: transparent;
}
.daaz-mtabs-scroll::-webkit-scrollbar-thumb {
	background: #d1d5db;
	border-radius: 3px;
}
.daaz-mtabs-scroll::-webkit-scrollbar-thumb:hover {
	background: #9ca3af;
}

/* ── Motion ───────────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	.daaz-mtabs-tab {
		transition: none;
	}
}