.kursuebersicht-header-container {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.kursuebersicht-header-content {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
}

.kursuebersicht-icon {
	flex-shrink: 0;
	margin-right: 2px;
}

.kursuebersicht-icon img {
	width: 46px;
	height: 46px;
	border-radius: 12px;
}

.kursuebersicht-nav {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: 0;
}

.detail-line {
	color: #727093;
	font-size: 11px;
	font-weight: 400;
}

.kursuebersicht-nav .nav-item,
.kursuebersicht-nav h2.nav-item {
	cursor: pointer;
	margin-right: 18px;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 16px !important;
	color: #6C678C !important;
	flex: 0 0 auto !important;
	padding: 0;
	background: none;
	border: none;
	transition: color 0.2s ease;
	position: relative;
	margin-bottom: 0;
	margin-top: 0;
}

.kursuebersicht-nav .nav-item:hover,
.kursuebersicht-nav h2.nav-item:hover {
	color: #8a87b0 !important;
}

.kursuebersicht-nav .nav-item.active,
.kursuebersicht-nav h2.nav-item.active {
	color: #fff !important;
}

.kursuebersicht-nav .nav-item.active::after,
.kursuebersicht-nav h2.nav-item.active::after {
	content: '';
	position: absolute;
	bottom: -4px;
	left: 0;
	right: 0;
	height: 2px;
	background-color: #63ffda;
}

.kursuebersicht-content {
	width: 100%;
}

/* Volle Breite für Kursübersicht (kein schmaler zentrierter Streifen) – ab Tablet/Breakpoint wo stock-page-container zentriert wird (1280px) */
@media (max-width: 1280px) {
	main.page-content {
		padding-left: 0 !important;
		padding-right: 0 !important;
		max-width: 100% !important;
	}

	.page-content-wrapper {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#startpage-v2-container,
	#startpage-v2-container .stock-page-container,
	#startpage-v2-container .stock-page-main-container,
	#startpage-v2-container .kursuebersicht-content {
		width: 100% !important;
		max-width: 100% !important;
		box-sizing: border-box;
	}

	/* Parent hat align-items: center → Hauptbereich mit stretch auf volle Breite ziehen */
	#startpage-v2-container .stock-page-container {
		align-items: stretch;
	}

	#startpage-v2-container .stock-page-main-container {
		align-self: stretch;
		padding-left: 12px;
		padding-right: 12px;
	}

	.kursuebersicht-block--kurslisten .card__wrapper {
		padding-left: 12px;
		padding-right: 12px;
	}
}

/* Zwei-Spalten-Layout: Blöcke stapeln sich in jeder Spalte mit natürlicher Höhe (keine starre Row-Optik) */
.kursuebersicht-columns {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.kursuebersicht-column {
	display: flex;
	flex-direction: column;
	gap: 24px;
	min-width: 0;
}

.kursuebersicht-column .kursuebersicht-container {
	flex: 0 0 auto;
}

/* Community-Aktien: ausgegrauter „Hinzufügen“-Button wenn keine Watchlist ausgewählt */
.kursuebersicht-community-wrapper .add-wl-button button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.kursuebersicht-community-wrapper .community-stocks {
	padding: 0 24px 24px 24px;

}

.community-stocks h3,
h2.kursuebersicht-block__headline {
	margin-top: 21px;
	font-size: 18px !important;
	line-height: 22px;
	margin-bottom: 10px;
}

/* Beliebte Community Aktien – Listen-Layout nach Figma (18316-114838) */
.community-aktien-list-figma__subtitle {
	font-size: 12px;
	font-weight: 500;
	line-height: 16px;
	color: #8582a1;
	margin-bottom: 12px;
}

.community-aktien-list-figma__list {
	padding: 0;
	margin: 0;
}

.community-aktien-list-figma__row {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.community-aktien-list-figma__row:last-child {
	border-bottom: none;
}

.community-aktien-list-figma__icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.07);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.community-aktien-list-figma__logo {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.community-aktien-list-figma__body {
	flex: 1;
	min-width: 0;
	cursor: pointer;
	text-decoration: none;
	color: inherit;
}

.community-aktien-list-figma__body:hover {
	text-decoration: none;
	color: inherit;
}

.community-aktien-list-figma__name {
	font-size: 13px;
	font-weight: 800;
	line-height: 1.2;
	color: #fff;
	margin-bottom: 2px;
}

.community-aktien-list-figma__price {
	font-size: 10px;
	font-weight: 500;
	line-height: 10px;
	color: #8a87b0;
}

.community-aktien-list-figma__change--pos {
	color: #34c759;
}

.community-aktien-list-figma__change--neg {
	color: #f34f4f;
}

.community-aktien-list-figma__action {
	flex-shrink: 0;
}

.community-aktien-list-figma__btn {
	font-size: 10px;
	font-weight: 700;
	line-height: 17px;
	color: #63ffda;
	background: transparent;
	border: 1px solid #63ffda;
	border-radius: 7px;
	padding: 6px 12px;
	cursor: pointer;
	transition: opacity 0.2s;
}

.community-aktien-list-figma__btn:hover:not(:disabled) {
	background: rgba(99, 255, 218, 0.15);
}

.community-aktien-list-figma__btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	border-color: rgba(99, 255, 218, 0.4);
	color: rgba(99, 255, 218, 0.7);
}

.community-aktien-list-figma__footer {
	font-size: 12px;
	color: #8582a1;
	padding-top: 8px;
	margin-top: 4px;
	border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.kursuebersicht-container {
	min-height: 120px;
}

.kursuebersicht-container .stock-feed-banner-img {
	margin-right: 0;
}

/* Blöcke: Card-ähnlich mit Headline, Hintergrund, Rundung */
.kursuebersicht-block {
	border-radius: 15px;
	overflow: hidden;
	height: 100%;
}

.kursuebersicht-block .card__wrapper {
	padding: 0 24px 24px 24px;
}

.kursuebersicht-block__headline {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
	margin-bottom: 12px;
	color: inherit;
}

.mod-skin-dark:not(.mod-skin-light) .kursuebersicht-block__headline {
	color: #fff;
}

.kursuebersicht-block .text-muted {
	font-size: 13px;
}

/* Deine Watchlisten: horizontale Tabs + Positionsliste */
.kursuebersicht-watchlisten-content {
	padding: 0 24px 24px 24px;
}

.kursuebersicht-block--watchlisten .kursuebersicht-block__headline {
	margin-left: 24px;
}

.kursuebersicht-watchlisten-nav {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px 18px;
	margin-bottom: 16px;
	margin-top: 4px;
}

.kursuebersicht-watchlisten-nav__item {
	cursor: pointer;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 16px !important;
	color: #6C678C !important;
	padding: 0;
	background: none;
	border: none;
	transition: color 0.2s ease;
	position: relative;
}

.kursuebersicht-watchlisten-nav__item:hover {
	color: #8a87b0 !important;
}

.kursuebersicht-watchlisten-nav__item.active {
	color: #fff !important;
}

.kursuebersicht-watchlisten-nav__item.active::after {
	content: '';
	position: absolute;
	bottom: -4px;
	left: 0;
	right: 0;
	height: 2px;
	background-color: #63ffda;
}

.kursuebersicht-watchlisten-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.kursuebersicht-watchlisten-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	text-decoration: none;
	color: inherit;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.kursuebersicht-watchlisten-item:last-child {
	border-bottom: none;
}

.kursuebersicht-watchlisten-item__img {
	flex-shrink: 0;
}

.kursuebersicht-watchlisten-item__img .last-stock-search-item-image {
	width: 40px;
	height: 40px;
	object-fit: contain;
	border-radius: 12px;
}

.kursuebersicht-watchlisten-item__name {
	flex: 1;
	min-width: 0;
	font-size: 14px;
	line-height: 1.3;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.kursuebersicht-watchlisten-item__price {
	font-size: 12px;
	opacity: 0.85;
}

.kursuebersicht-watchlisten-item__chart {
	flex-shrink: 0;
	min-width: 40px;
}

.kursuebersicht-watchlisten-item__percent {
	flex-shrink: 0;
	text-align: right;
	font-size: 12px;
}

.kursuebersicht-watchlisten-item__percent-1 {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 4px;
	font-weight: 700;
}

.kursuebersicht-watchlisten-item__percent-abs {
	font-size: 11px;
	opacity: 0.85;
	margin-top: 2px;
}

.kursuebersicht-watchlisten-more {
	display: inline-flex;
	align-items: center;
	margin-top: 12px;
	font-size: 13px;
	color: #63ffda;
	text-decoration: none;
}

.kursuebersicht-watchlisten-more:hover {
	color: #8cfff0;
	text-decoration: underline;
}

@media (min-width: 1024px) {
	.kursuebersicht-columns {
		flex-direction: row;
		align-items: flex-start;
		gap: 24px;
	}

	.kursuebersicht-column {
		flex: 1 1 0;
		min-width: 0;
	}

}

.content-section {
	width: 100%;
}

.content-section.active {
	display: block;
}

/* Full Heatmap: same card as .daily-content on /daily; height set by JS (100vh minus #stock-head) */
.content-section[data-section="full-heatmap"] {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.content-section[data-section="full-heatmap"] .daily-content--heatmap {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	padding: 12px 12px 12px 0;
}

.content-section[data-section="full-heatmap"] .daily-content-container.full-heatmap-iframe-container {
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	border-radius: 12px;
	background: rgba(46, 43, 80, 0.6);
}

.content-section[data-section="full-heatmap"] .full-heatmap-iframe-container {
	width: 100%;
	height: 100%;
}

#full-heatmap-iframe {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 0;
}

/* Watchlisten: same card and height behaviour as Full Heatmap */
.content-section[data-section="watchlisten"] {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.content-section[data-section="watchlisten"] .daily-content--watchlist {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.content-section[data-section="watchlisten"] .daily-content-container.watchlist-iframe-container {
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	border-radius: 12px;
	background: rgba(46, 43, 80, 0.6);
}

.content-section[data-section="watchlisten"] .watchlist-iframe-container {
	width: 100%;
	height: 100%;
}

#watchlist-iframe {
	display: block;
	width: 100%;
	height: 100%;
	min-height: 0;
}

@media (min-width: 1280px) {
	#stock-feed-container {
		position: sticky;
		top: 120px;
		height: calc(100vh - 154px);
	}
}

@media (max-width: 1079.89px) {
	.stock-top-line {
		margin-bottom: 0;
	}

	.kursuebersicht-icon img {
		width: 46px;
		height: 46px;
	}

	.kursuebersicht-nav {
		width: 100%;
		overflow-x: auto;
		margin-top: 16px;
	}
}

@media (max-width:576px) {
	#stock-head .kursuebersicht-icon img {
		width: 46px;
		height: 46px;
	}

	.kursuebersicht-nav {
		padding-left: 0px;
		margin-bottom: 0;
	}
}

/* Vue-Ladezustand: Platzhalter bis App fertig gemountet ist */
.kursuebersicht-vue-loading {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 280px;
	padding: 2rem;
}

.kursuebersicht-vue-loading__inner {
	text-align: center;
}

.kursuebersicht-vue-loading__spinner {
	width: 2.5rem;
	height: 2.5rem;
}

/* News Aggregator */
.kursuebersicht-news-aggregator {
	padding: 0;
}

.kursuebersicht-news-aggregator__head {
	margin-bottom: 14px;
	margin-top: 32px;
	width: 100%;
}

.kursuebersicht-news-aggregator__banner {
	position: relative;
	display: flex;
	align-items: center;
	overflow: visible;
	background-color: #333055;
	border-radius: 16px;
	height: 77px;
	padding: 0;
	min-width: 0;
}

.kursuebersicht-news-aggregator__banner-image {
	position: absolute;
	left: 10px;
	bottom: 0;
	width: 114px;
	height: 95px;
	object-fit: cover;
}

.kursuebersicht-news-aggregator__banner-text {
	margin-left: 136px;
	padding-right: 8px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.kursuebersicht-news-aggregator__banner-eyebrow {
	font-style: italic;
	font-size: 18px;
	font-weight: 900;
	line-height: 22px;
	color: #ffffff;
}

.kursuebersicht-news-aggregator__banner-title {
	font-size: 18px;
	font-weight: 900;
	line-height: 22px;
	color: #FF83A8;
	text-transform: uppercase;
	margin-top: -2px;
}

.kursuebersicht-news-aggregator__banner-subtitle {
	font-size: 10px;
	color: rgba(255, 255, 255, 0.8);
	margin-top: 2px;
	font-style: italic;
}

.kursuebersicht-news-aggregator__toggles {
	display: flex;
	flex-direction: row;
	gap: 10px;
	margin-bottom: 16px;
	width: 100%;
}

.kursuebersicht-news-aggregator__toggle {
	flex: 1 1 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 40px;
	border-radius: 10px;
	border: 0;
	background: rgba(51, 48, 85, 0.4);
	color: #ffffff;
	font-size: 12px;
	font-weight: 700;
	opacity: 0.7;
	cursor: pointer;
	padding: 0 12px;
}

.kursuebersicht-news-aggregator__toggle--active {
	background: rgba(51, 48, 85, 0.9);
	border: 1px solid #63FFDA;
	opacity: 1;
}

.kursuebersicht-news-aggregator__toggle-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
}

.kursuebersicht-news-aggregator__toggle-label {
	white-space: nowrap;
}

.kursuebersicht-news-aggregator__toggle-label-accent {
	color: #FF94BB;
}

.kursuebersicht-news-aggregator__brain-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	margin-bottom: 6px;
}

.kursuebersicht-news-aggregator__brain-text {
	font-size: 12px;
	font-weight: 500;
	color: #ABA9C9;
	line-height: 19px;
	flex-shrink: 1;
}

.kursuebersicht-news-aggregator__brain-strong {
	font-weight: 700;
	color: #FFFFFF;
}

.kursuebersicht-news-aggregator__brain-edit {
	padding: 0;
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	border-radius: 5px;
	border: 0;
	background-color: rgba(33, 31, 63, 1);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: rgba(113, 111, 146, 1);
	cursor: pointer;
}

.kursuebersicht-news-aggregator__brain-title {
	font-size: 14px;
	font-weight: 700;
	margin-top: 19px;
	margin-bottom: 16px;
}

.kursuebersicht-news-aggregator__loading {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 80px;
}

.kursuebersicht-news-aggregator__list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.kursuebersicht-news-aggregator__source {
	display: none;
}

.kursuebersicht-news-aggregator__item {
	padding: 8px 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.06);
	cursor: pointer;
	border-radius: 8px;
	background: linear-gradient(135deg, rgb(38, 36, 68) 6%, rgb(79, 77, 115) 63%, rgb(40, 38, 71) 97%, rgb(40, 38, 71) 100%);
}


.kursuebersicht-news-aggregator__item:hover {
	opacity: 0.8;
}


.kursuebersicht-news-aggregator__item--active,
.kursuebersicht-news-aggregator__item:hover {

	margin: 0 0px;
	padding: 8px 12px;
	border-radius: 8px;
}

.kursuebersicht-news-aggregator__item--active {
	box-shadow: 0 0 0 1.5px var(--accent-primary);
}

.kursuebersicht-news-aggregator__item-inner {
	display: flex;
	flex-direction: row;
	gap: 12px;
}

.kursuebersicht-news-aggregator__item-left {
	width: 56px;
	margin-right: 8px;
	align-items: center;
	justify-content: flex-start;
	display: flex;
	flex-direction: column;
}

.kursuebersicht-news-aggregator__logo {
	width: 48px;
	height: 63px;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background-color: rgba(48, 45, 81, 0.6);
}

.kursuebersicht-news-aggregator__logo-img {
	width: 30px;
	height: 30px;
	border-radius: 4px;
	object-fit: contain;
}

.kursuebersicht-news-aggregator__logo-fallback {
	font-size: 14px;
	font-weight: 700;
	color: #ffffff;
}

.kursuebersicht-news-aggregator__item-right {
	flex: 1 1 auto;
}

.kursuebersicht-news-aggregator__item:first-child {
	border-top: none;
}

.kursuebersicht-news-aggregator__meta {
	display: flex;
	justify-content: flex-start;
	font-size: 10px;
	color: #ABA9C9;
	margin-bottom: 4px;
	gap: 8px;
}

.kursuebersicht-news-aggregator__instrument {
	font-weight: 700;
	font-style: italic;
	flex-shrink: 1;
}

.kursuebersicht-news-aggregator__headline {
	font-size: 13px;
	font-weight: 600;
	line-height: 18px;
	color: #ffffff;
}

.kursuebersicht-news-aggregator__body {
	font-size: 12px;
	font-weight: 400;
	line-height: 18px;
	color: #ABA9C9;
	margin-top: 2px;
	margin-bottom: 0;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.kursuebersicht-news-aggregator__earnings {
	display: flex;
	align-items: center;
	margin-top: 8px;
	padding: 8px;
	border-radius: 6px;
	background-color: rgba(33, 31, 63, 1);
}

.kursuebersicht-news-aggregator__earnings-icon {
	margin-right: 8px;
	color: #ffffff;
	font-size: 14px;
}

.kursuebersicht-news-aggregator__earnings-text {
	font-size: 12px;
	font-weight: 600;
	color: #ffffff;
}

.kursuebersicht-news-aggregator__price-row {
	display: flex;
	align-items: center;
	margin-bottom: 4px;
	gap: 4px;
}

.kursuebersicht-news-aggregator__market-indicator {
	width: 5px;
	height: 5px;
	margin-top: 1px;
	border-radius: 50%;
	background-color: #616163;
}

.kursuebersicht-news-aggregator__market-indicator--open {
	background-color: #63FFDA;
}

.kursuebersicht-news-aggregator__market-indicator--closed {
	background-color: #F34F4F;
}

.kursuebersicht-news-aggregator__price {
	color: #BBBDE4;
	font-size: 10px;
	font-weight: 700;
	font-style: italic;
}

.kursuebersicht-news-aggregator__perf {
	font-size: 10px;
	font-weight: 700;
	font-style: italic;
}

.kursuebersicht-news-aggregator__perf--pos {
	color: #63FFDA;
}

.kursuebersicht-news-aggregator__perf--neg {
	color: #F34F4F;
}

.kursuebersicht-news-aggregator__empty {
	font-size: 11px;
	margin-top: 4px;
}

/* Indizes Block */
.kursuebersicht-indizes {
	padding: 0;
}

.kursuebersicht-indizes__head {
	margin-bottom: 10px;
}

.kursuebersicht-indizes__tabs {
	display: flex;
	flex-direction: row;
	gap: 8px;
	margin-bottom: 12px;
	overflow-x: auto;
	justify-content: flex-start;
	gap: 24px;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.kursuebersicht-indizes__tabs::-webkit-scrollbar {
	display: none;
}

.kursuebersicht-indizes__tab {
	border: 0;
	border-radius: 12px;
	background-color: transparent;
	color: #6C678C;
	font-size: 13px;
	font-weight: 700;
	padding: 6px 0;
	white-space: nowrap;
	cursor: pointer;
}

.kursuebersicht-indizes__tab--active {
	background-color: #63FFDA;
	color: #050213;
	padding: 6px 16px;
}


.kursuebersicht-indizes__body {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.kursuebersicht-indizes__row {
	display: flex;
	flex-direction: column;
	gap: 0px;
	margin-bottom: 8px;
	position: absolute;
	z-index: 9999;
}

.kursuebersicht-indizes__price-block,
.kursuebersicht-indizes__perf-block {
	flex: 1 1 0;
}

.kursuebersicht-indizes__label {
	font-size: 11px;
	font-weight: 500;
	color: #ABA9C9;
	margin-bottom: 2px;
}

.kursuebersicht-indizes__price {
	font-size: 18px;
	font-weight: 800;
	color: #FFFFFF;
}

.kursuebersicht-indizes__perf {
	font-size: 13px;
	font-weight: 700;
}

.kursuebersicht-indizes__perf--pos {
	color: #63FFDA;
}

.kursuebersicht-indizes__perf--neg {
	color: #F34F4F;
}

.kursuebersicht-indizes__chart {
	width: 100%;
	height: 220px;
	min-height: 210px;
	position: relative;
	overflow: hidden;
}

.kursuebersicht-indizes__chart .chart,
#Minichart_Index {
	min-height: 210px;
	width: 100%;
	margin-top: 16px;
}

.kursuebersicht-indizes__chart::after {
	content: "";
	position: absolute;
	right: 6px;
	bottom: 8px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #63FFDA;
	opacity: 0;
	transform: scale(0.8);
}

.kursuebersicht-indizes__chart--pulse::after {
	opacity: 1;
	animation: kursuebersicht-indizes-pulse 0.6s ease-out;
}

@keyframes kursuebersicht-indizes-pulse {
	0% {
		opacity: 0;
		transform: scale(0.6);
	}

	40% {
		opacity: 1;
		transform: scale(1.2);
	}

	100% {
		opacity: 0;
		transform: scale(1.6);
	}
}

.kursuebersicht-indizes__empty {
	font-size: 11px;
}

.kursuebersicht-indizes__ranges {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 8px;
}

.kursuebersicht-indizes__range {
	border: 0;
	background-color: transparent;
	color: #6C678C;
	font-size: 11px;
	font-weight: 600;
	padding: 4px 6px;
	cursor: pointer;
}

.kursuebersicht-indizes__range--active {
	color: #FFFFFF;
}

.kursuebersicht-topflop__body {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.kursuebersicht-topflop__body {
	width: 100%;
}

.kursuebersicht-topflop__tabs {
	display: flex;
	flex-direction: row;
	gap: 8px;
	overflow-x: auto;
	margin-bottom: 6px;
	width: 100%;
	justify-content: space-between;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.kursuebersicht-topflop__tabs::-webkit-scrollbar {
	display: none;
}

.kursuebersicht-topflop__tab {
	border: 0;
	border-radius: 12px;
	background-color: transparent;
	color: #6C678C;
	font-size: 13px;
	font-weight: 700;
	padding: 6px 0px;
	white-space: nowrap;
	cursor: pointer;
}

.kursuebersicht-topflop__tab--active {
	background-color: #63FFDA;
	color: #050213;
	padding: 8px 10px;
}

.kursuebersicht-topflop__section-title {
	font-size: 11px;
	font-weight: 500;
	color: #6C678C;
	margin-bottom: 8px;
	text-transform: uppercase;
}

.kursuebersicht-topflop__list {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* Kurslisten: Content-Section per JS begrenzt; Kopf + Tabs nicht schrumpfen, nur Liste scrollt */
.content-section[data-section="kurslisten"] {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.content-section[data-section="kurslisten"] #kursuebersicht-kurslisten {
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}

.content-section[data-section="kurslisten"] .kursuebersicht-block--kurslisten,
.content-section[data-section="kurslisten"] .kursuebersicht-topflop {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;
	overflow: hidden;
}

.content-section[data-section="kurslisten"] .kursuebersicht-topflop__head {
	flex-shrink: 0;
}

.content-section[data-section="kurslisten"] .kursuebersicht-topflop__body {
	flex: 1 1 auto;
	min-height: 0;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.content-section[data-section="kurslisten"] .kursuebersicht-topflop__tabs {
	flex-shrink: 0;
}

.content-section[data-section="kurslisten"] .kursuebersicht-kurslisten__section {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	max-height: var(--kurslisten-max-height, 50vh);
	box-sizing: border-box;
}

.kursuebersicht-topflop__item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	cursor: pointer;
}

.kursuebersicht-topflop__item-left {
	display: flex;
	align-items: center;
	gap: 0;
	min-width: 0;
}

.kursuebersicht-topflop__rank,
.kursuebersicht-topflop__logo-wrap {
	width: 42px;
	height: 42px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	
}

.kursuebersicht-topflop__rank {
	border-radius: 15px 15px 15px 15px;
	background: #262540;
	font-size: 12px;
	line-height: 16px;
	font-weight: 700;
	color: #fff;
	position: relative;
	z-index: 1;
	border: 2px solid #161431;
}

.kursuebersicht-topflop__logo-wrap {
	border-radius: 15px 15px 15px 15px;
	background: #262540;
	margin-left: -10px;
	position: relative;
	z-index: 2;
	border: 2px solid #161431;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 4px;
}

.kursuebersicht-topflop__logo {
	width: 40px;
	height: 40px;
	object-fit: cover;
}

.kursuebersicht-topflop__logo-fallback {
	font-size: 14px;
	font-weight: 700;
	color: #fff;
}

.kursuebersicht-topflop__meta {
	display: flex;
	flex-direction: column;
	min-width: 0;
	margin-left: 10px;
}

.kursuebersicht-topflop__name {
	font-size: 13px;
	font-weight: 700;
	color: #fff;
	line-height: 18px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.kursuebersicht-topflop__subline {
	font-size: 11px;
	color: #ABA9C9;
	line-height: 1.2;
	white-space: nowrap;
}

.kursuebersicht-topflop__abs--pos {
	color: #63FFDA;
}

.kursuebersicht-topflop__abs--neg {
	color: #F34F4F;
}

.kursuebersicht-topflop__pill {
	min-width: 64px;
	text-align: center;
	border-radius: 10px;
	padding: 8px 10px;
	font-size: 10px;
	font-weight: 700;
	flex: 0 0 auto;
}

.kursuebersicht-topflop__pill--pos {
	color: #63FFDA;
	background: rgba(42, 102, 145, 0.30);
}

.kursuebersicht-topflop__pill--neg {
	color: #F34F4F;
	background: rgba(124, 44, 88, 0.30);
}

.kursuebersicht-topflop__empty {
	color: #ABA9C9;
	font-size: 12px;
}

/* Kurslisten-Tabelle (reine Vue-Sortierung, kein DataTables) */
.kursuebersicht-kurslisten__table-wrap {
	width: 100%;
	min-width: 100%;
	overflow-x: auto;
	display: block;
}

.kursuebersicht-kurslisten-table {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	min-width: 100%;
}

/* Tabellenzeilen/-zellen erzwingen (kursuebersicht-topflop__item hat display:flex und bricht sonst die Spaltenbreite) */
.kursuebersicht-kurslisten-table tbody tr {
	display: table-row;
	width: 100%;
}

.kursuebersicht-kurslisten-table tbody td {
	display: table-cell;
}

.kursuebersicht-kurslisten-table thead th {
	text-align: left;
	padding: 10px 10px;
	font-size: 11px;
	font-weight: 700;
	color: #ABA9C9;
	background: #161431;
	border-top: 1px solid #262540;
	border-bottom: 1px solid #262540;
	box-sizing: border-box;
	white-space: nowrap;
}

.kursuebersicht-kurslisten-table thead th.kursuebersicht-kurslisten-table__th-rank {
	width: 52px;
	text-align: center;
}

.kursuebersicht-kurslisten-table thead th.kursuebersicht-kurslisten-table__th-perf,
.kursuebersicht-kurslisten-table thead th.kursuebersicht-kurslisten-table__th-abs {
	text-align: right;
}

.kursuebersicht-kurslisten-table thead th.kursuebersicht-kurslisten-table__th--sortable {
	cursor: pointer;
	user-select: none;
}

.kursuebersicht-kurslisten-table thead th.kursuebersicht-kurslisten-table__th--sortable:hover {
	color: #fff;
}

.kursuebersicht-kurslisten-table__sort {
	margin-left: 4px;
	opacity: 0.9;
}

.kursuebersicht-kurslisten-table tbody td {
	padding: 10px 10px;
	vertical-align: middle;
	border-bottom: 1px solid #262540;
	box-sizing: border-box;
}

.kursuebersicht-kurslisten-table tbody td:first-child,
.kursuebersicht-kurslisten-table__rank-cell {
	text-align: center;
	vertical-align: middle;
}

/* Rank-Badge in der Tabelle: gleiche Größe wie Logo (42×42), nicht die ganze Zelle */
.kursuebersicht-kurslisten-table__rank-cell .kursuebersicht-topflop__rank {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	min-width: 42px;
	min-height: 42px;
	max-height: 42px;
	box-sizing: border-box;
}

.kursuebersicht-kurslisten-table tbody tr:hover {
	background: rgba(38, 37, 64, 0.5);
}

.kursuebersicht-kurslisten-table tbody tr {
	cursor: pointer;
}

.kursuebersicht-kurslisten-table tbody tr:last-child td {
	border-bottom: 1px solid #262540;
}

.kursuebersicht-kurslisten-table__name-cell {
	display: flex;
	align-items: center;
	gap: 0;
}

.kursuebersicht-kurslisten-table__name .kursuebersicht-topflop__meta {
	display: none;
}

.kursuebersicht-kurslisten-table__name {
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
}

.kursuebersicht-kurslisten-table__kurs {
	white-space: nowrap;
}

.kursuebersicht-kurslisten-table__abs,
.kursuebersicht-kurslisten-table__perf {
	text-align: right;
	white-space: nowrap;
}

/* Mobile: nur Bild, Name, Kurs und Heute (Performance) sichtbar */
.kursuebersicht-kurslisten-table__th-label-mobile {
	display: none;
}

@media (max-width: 768px) {
	.kursuebersicht-kurslisten-table {
		table-layout: fixed;
		width: 100% !important;
	}

	.kursuebersicht-kurslisten-table col.kursuebersicht-kurslisten-col--rank,
	.kursuebersicht-kurslisten-table col.kursuebersicht-kurslisten-col--abs {
		display: none;
		width: 0 !important;
	}

	.kursuebersicht-kurslisten-table col.kursuebersicht-kurslisten-col--name {
		width: auto !important;
	}

	.kursuebersicht-kurslisten-table col.kursuebersicht-kurslisten-col--kurs,
	.kursuebersicht-kurslisten-table col.kursuebersicht-kurslisten-col--perf {
		width: 78px !important;
	}

	.kursuebersicht-kurslisten-table__th-rank,
	.kursuebersicht-kurslisten-table__rank-cell,
	.kursuebersicht-kurslisten-table__th-abs,
	.kursuebersicht-kurslisten-table tbody td.kursuebersicht-kurslisten-table__abs {
		display: none !important;
	}

	.kursuebersicht-kurslisten-table__th-label-desktop {
		display: none;
	}

	.kursuebersicht-kurslisten-table__th-label-mobile {
		display: inline;
	}

	.kursuebersicht-kurslisten-table thead th,
	.kursuebersicht-kurslisten-table tbody td {
		padding: 8px 6px;
		font-size: 12px;
	}

	.kursuebersicht-kurslisten-table thead th {
		font-size: 11px;
	}

	.kursuebersicht-kurslisten-table__name {
		min-width: 0;
		width: 100%;
		overflow: hidden;
	}

	.kursuebersicht-kurslisten-table__th-name {
		width: 100%;
	}

	.kursuebersicht-kurslisten-table__name-cell {
		width: 100%;
		min-width: 0;
	}

	.kursuebersicht-kurslisten-table__name .kursuebersicht-topflop__name {
		display: block;
		min-width: 0;
		max-width: 100%;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.kursuebersicht-kurslisten-table__kurs {
		min-width: 0;
		width: 78px;
	}

	.kursuebersicht-kurslisten-table__perf {
		min-width: 0;
		width: 78px;
	}

	.kursuebersicht-kurslisten-table__perf .kursuebersicht-topflop__pill {
		min-width: 58px;
		padding: 7px 8px;
	}

	.kursuebersicht-indizes__tabs,
	.kursuebersicht-topflop__tabs {
		gap: 16px;
	}
}

.kursuebersicht-news-aggregator__more-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 8px;
	font-size: 12px;
	font-weight: 600;
	color: #63FFDA;
	text-decoration: none;
	cursor: pointer;
}

.kursuebersicht-news-aggregator__more-link::after {
	content: '\f107';
	font-family: "Font Awesome 6 Sharp";
	font-weight: 900;
	font-size: 11px;
}

.kursuebersicht-news-aggregator__time {
	color: #FFF;
	font-size: 8px;
	font-weight: 700;
	line-height: 16px;
}

@media (min-width: 1024px) {

	.kursuebersicht-topflop__tabs {
		justify-content: flex-start;
		gap: 24px;
	}
}