/* Dark Mode CSS für FuturegamerS Website */

:root {
  /* Light Mode Variablen (Default) */
  --bg-primary: #ffffff;
  --bg-secondary: #f8f9fa;
  --bg-tertiary: #e9ecef;
  --text-primary: #212529;
  --text-secondary: #6c757d;
  --text-muted: #868e96;
  --border-color: #dee2e6;
  --shadow-color: rgba(0, 0, 0, 0.1);
  --link-color: #007bff;
  --link-hover-color: #0056b3;
}

/* Dark Mode Variablen */
[data-theme="dark"] {
  --bg-primary: #1a1a1a;
  --bg-secondary: #2d2d2d;
  --bg-tertiary: #3d3d3d;
  --text-primary: #ffffff;
  --text-secondary: #b0b0b0;
  --text-muted: #888888;
  --border-color: #404040;
  --shadow-color: rgba(255, 255, 255, 0.1);
  --link-color: #2185d0;
  --link-hover-color: #1678c2;
}

/* Dark Mode Styles für Body */
[data-theme="dark"] body {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

/* Dark Mode für Fomantic UI Komponenten */
[data-theme="dark"] .ui.menu:not(.inverted) {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.menu:not(.inverted) .item {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.menu:not(.inverted) .item:hover {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.menu:not(.inverted) .active.item {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

/* Inverted Menu - besseres Dark Mode Design */
[data-theme="dark"] .ui.inverted.menu {
  background-color: #2d3136 !important;
  border-bottom: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .ui.inverted.menu .item {
  color: rgba(255,255,255,.95) !important;
}

[data-theme="dark"] .ui.inverted.menu .item:hover {
  background-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,1) !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown.item:hover {
  background-color: rgba(255,255,255,.12) !important;
}

[data-theme="dark"] .ui.inverted.menu .active.item {
  background-color: rgba(255,255,255,.15) !important;
  color: rgba(255,255,255,1) !important;
}

/* Dropdown-Menüs in der Navigation */
[data-theme="dark"] .ui.inverted.menu .dropdown .menu {
  background-color: #36393f !important;
  border: 1px solid #42464d !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown .menu .item {
  color: rgba(255,255,255,.95) !important;
  border-bottom: 1px solid #42464d !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown .menu .item:hover {
  background-color: #42464d !important;
  color: rgba(255,255,255,1) !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown .menu .header {
  color: #ffffff !important;
  background-color: #4a4d57 !important;
  border-bottom: 1px solid #42464d !important;
  font-weight: 600 !important;
  padding: 0.5em 1em !important;
  text-transform: uppercase !important;
  font-size: 0.78571429em !important;
  letter-spacing: 0.1em !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown .menu .header:hover {
  color: #ffffff !important;
  background-color: #5a5d67 !important;
}

/* Nested dropdown headers */
[data-theme="dark"] .ui.inverted.menu .dropdown .menu .dropdown .menu .header {
  color: #ffffff !important;
  background-color: #4a4d57 !important;
  border-bottom: 1px solid #42464d !important;
  font-weight: 600 !important;
  padding: 0.78571429em 1.14285714em !important;
  text-transform: uppercase !important;
  font-size: 0.78571429em !important;
  letter-spacing: 0.1em !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown .menu .dropdown .menu .header:hover {
  color: #ffffff !important;
  background-color: #5a5d67 !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown .menu .divider {
  background-color: #42464d !important;
}

/* Navigation Icons */
[data-theme="dark"] .ui.inverted.menu .item .icon {
  color: rgba(255,255,255,.8) !important;
}

[data-theme="dark"] .ui.inverted.menu .item:hover .icon {
  color: rgba(255,255,255,1) !important;
}

/* Navigation Header Link - only for main logo, not dropdown headers */
[data-theme="dark"] .ui.inverted.menu > .ui.container > .header.item {
  color: rgba(255,255,255,1) !important;
  font-weight: bold;
  margin: 0 !important;
  padding: 1rem !important;
}

[data-theme="dark"] .ui.inverted.menu > .ui.container > .header.item:hover {
  background-color: rgba(255,255,255,.1) !important;
}

/* Navigation Menu Items - einheitliche Farbe */
[data-theme="dark"] .ui.inverted.menu .item {
  color: rgba(255,255,255,.95) !important;
  background-color: transparent !important;
}

[data-theme="dark"] .ui.inverted.menu .item:not(.dropdown):hover {
  background-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,1) !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown.item {
  color: rgba(255,255,255,.95) !important;
  background-color: transparent !important;
}

[data-theme="dark"] .ui.inverted.menu .dropdown.item:hover {
  background-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,1) !important;
}

[data-theme="dark"] .ui.inverted.menu .active.item {
  background-color: rgba(255,255,255,.15) !important;
  color: rgba(255,255,255,1) !important;
}

/* Dark Mode für Cards */
[data-theme="dark"] .ui.card,
[data-theme="dark"] .ui.cards > .card {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.card > .content > .header,
[data-theme="dark"] .ui.cards > .card > .content > .header {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.card .meta,
[data-theme="dark"] .ui.cards > .card .meta {
  color: var(--text-secondary) !important;
}

/* Dark Mode für Segmente */
[data-theme="dark"] .ui.segment {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.segments .segment {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Dark Mode für Header */
[data-theme="dark"] .ui.header {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.header .sub.header {
  color: var(--text-secondary) !important;
}

/* Dark Mode für Tabellen */
[data-theme="dark"] .ui.table {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.table thead th {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.table tbody tr {
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.table tbody tr td {
  border-color: var(--border-color) !important;
}

/* Dark Mode für Buttons */
[data-theme="dark"] .ui.button {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.button:hover {
  background-color: var(--bg-secondary) !important;
}

/* Farbige Buttons behalten ihre Farben, nur dunkler */
[data-theme="dark"] .ui.primary.button {
  background-color: #1e3a5f !important;
  color: #ffffff !important;
  border-color: #2980b9 !important;
}

[data-theme="dark"] .ui.primary.button:hover {
  background-color: #2c5aa0 !important;
}

[data-theme="dark"] .ui.green.button {
  background-color: #1e4d1e !important;
  color: #ffffff !important;
  border-color: #27ae60 !important;
}

[data-theme="dark"] .ui.green.button:hover {
  background-color: #2d7d2d !important;
}

[data-theme="dark"] .ui.red.button {
  background-color: #4d1e1e !important;
  color: #ffffff !important;
  border-color: #e74c3c !important;
}

[data-theme="dark"] .ui.red.button:hover {
  background-color: #7d2d2d !important;
}

[data-theme="dark"] .ui.blue.button {
  background-color: #1e3a5f !important;
  color: #ffffff !important;
  border-color: #3498db !important;
}

[data-theme="dark"] .ui.blue.button:hover {
  background-color: #2c5aa0 !important;
}

[data-theme="dark"] .ui.orange.button {
  background-color: #5f3a1e !important;
  color: #ffffff !important;
  border-color: #e67e22 !important;
}

[data-theme="dark"] .ui.orange.button:hover {
  background-color: #8b5a2c !important;
}

[data-theme="dark"] .ui.yellow.button {
  background-color: #5f5f1e !important;
  color: #000000 !important;
  border-color: #f1c40f !important;
}

[data-theme="dark"] .ui.yellow.button:hover {
  background-color: #8b8b2c !important;
}

[data-theme="dark"] .ui.purple.button {
  background-color: #3a1e5f !important;
  color: #ffffff !important;
  border-color: #9b59b6 !important;
}

[data-theme="dark"] .ui.purple.button:hover {
  background-color: #5a2c8b !important;
}

/* Dark Mode für Forms */
[data-theme="dark"] .ui.form .field > label {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.input > input,
[data-theme="dark"] .ui.form textarea,
[data-theme="dark"] .ui.form select {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.input > input:focus,
[data-theme="dark"] .ui.form textarea:focus,
[data-theme="dark"] .ui.form select:focus {
  border-color: var(--link-color) !important;
  background-color: var(--bg-secondary) !important;
}

[data-theme="dark"] .ui.input > input::placeholder,
[data-theme="dark"] .ui.form textarea::placeholder {
  color: var(--text-muted) !important;
}

/* Checkbox und Radio Buttons */
[data-theme="dark"] .ui.checkbox label {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.checkbox input:focus ~ label {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.checkbox .box,
[data-theme="dark"] .ui.checkbox label:before {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.checkbox input:checked ~ .box:after,
[data-theme="dark"] .ui.checkbox input:checked ~ label:after {
  color: var(--text-primary) !important;
}

/* Form Field Errors */
[data-theme="dark"] .ui.form .field.error > label {
  color: #ff6b6b !important;
}

[data-theme="dark"] .ui.form .field.error .ui.input > input {
  background-color: #4a1a1a !important;
  border-color: #ff6b6b !important;
  color: var(--text-primary) !important;
}

/* Dark Mode für Messages */
[data-theme="dark"] .ui.message {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.info.message {
  background-color: #1a4a66 !important;
  color: #e6f3ff !important;
}

[data-theme="dark"] .ui.success.message {
  background-color: #1a4a1a !important;
  color: #e6ffe6 !important;
}

[data-theme="dark"] .ui.warning.message {
  background-color: #4a3d1a !important;
  color: #fff3e6 !important;
}

[data-theme="dark"] .ui.error.message {
  background-color: #4a1a1a !important;
  color: #ffe6e6 !important;
}

/* Dark Mode für Dropdown */
[data-theme="dark"] .ui.dropdown {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.dropdown .menu {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  box-shadow: 0 2px 8px rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .ui.dropdown .menu > .item {
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.dropdown .menu > .item:hover {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.dropdown .menu > .active.item {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.dropdown .menu > .header {
  color: var(--text-secondary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.dropdown .menu .divider {
  border-color: var(--border-color) !important;
}

/* Dropdown Text und Icons */
[data-theme="dark"] .ui.dropdown .text {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.dropdown .dropdown.icon {
  color: var(--text-secondary) !important;
}

/* Dark Mode für Progress Bars */
[data-theme="dark"] .ui.progress {
  background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .ui.progress .bar {
  background-color: var(--link-color) !important;
}

/* Dark Mode für Labels */
[data-theme="dark"] .ui.label {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

/* Dark Mode für Lists */
[data-theme="dark"] .ui.list .item {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.list .item .header {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.list .item .description {
  color: var(--text-secondary) !important;
}

/* Dark Mode für Accordion */
[data-theme="dark"] .ui.accordion .title {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.accordion .content {
  color: var(--text-primary) !important;
}

/* Dark Mode für Tabs */
[data-theme="dark"] .ui.tabular.menu {
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.tabular.menu .item {
  color: var(--text-secondary) !important;
  border-color: transparent !important;
}

[data-theme="dark"] .ui.tabular.menu .active.item {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
  border-bottom-color: var(--bg-primary) !important;
}

/* Dark Mode für Footer - General fallback */
[data-theme="dark"] footer {
  background-color: #1b1c1d !important;
  color: rgba(255,255,255,.9) !important;
  border-color: var(--border-color) !important;
}

/* Dark Mode für Links - Keep them blue */
[data-theme="dark"] a {
  color: var(--link-color) !important;
}

[data-theme="dark"] a:hover {
  color: var(--link-hover-color) !important;
}

/* Dark Mode für Icons - default color only for non-colored icons */
[data-theme="dark"] i.icon:not(.yellow):not(.gold):not(.orange):not(.silver):not(.bronze):not(.brown):not(.green):not(.red):not(.blue):not(.purple):not(.pink):not(.teal):not(.violet):not(.black):not(.grey):not(.trophy):not(.diamond) {
  color: var(--text-secondary) !important;
}

/* Navigation and menu icons should remain neutral */
[data-theme="dark"] .ui.menu i.icon:not(.yellow):not(.gold):not(.orange):not(.silver):not(.bronze):not(.brown):not(.green):not(.red):not(.blue):not(.purple):not(.pink):not(.teal):not(.violet):not(.black):not(.grey):not(.trophy):not(.diamond) {
  color: rgba(255,255,255,.8) !important;
}

/* Preserve colored icon colors - specific rules with highest priority */
[data-theme="dark"] i.icon.yellow,
[data-theme="dark"] i.icon.gold,
[data-theme="dark"] .ui.segment i.icon.yellow,
[data-theme="dark"] .ui.segment i.icon.gold,
[data-theme="dark"] .ui.container i.icon.yellow,
[data-theme="dark"] .ui.container i.icon.gold,
[data-theme="dark"] .hauptcontent i.icon.yellow,
[data-theme="dark"] .hauptcontent i.icon.gold {
  color: #f1c40f !important;
}

[data-theme="dark"] i.icon.orange,
[data-theme="dark"] .ui.segment i.icon.orange,
[data-theme="dark"] .ui.container i.icon.orange,
[data-theme="dark"] .hauptcontent i.icon.orange {
  color: #e67e22 !important;
}

[data-theme="dark"] i.icon.silver,
[data-theme="dark"] .ui.segment i.icon.silver,
[data-theme="dark"] .ui.container i.icon.silver,
[data-theme="dark"] .hauptcontent i.icon.silver {
  color: #c0c0c0 !important;
}

[data-theme="dark"] i.icon.grey,
[data-theme="dark"] .ui.segment i.icon.grey,
[data-theme="dark"] .ui.container i.icon.grey,
[data-theme="dark"] .hauptcontent i.icon.grey {
  color: #767676 !important;
}

[data-theme="dark"] i.icon.bronze,
[data-theme="dark"] .ui.segment i.icon.bronze,
[data-theme="dark"] .ui.container i.icon.bronze,
[data-theme="dark"] .hauptcontent i.icon.bronze {
  color: #cd7f32 !important;
}

[data-theme="dark"] i.icon.brown,
[data-theme="dark"] .ui.segment i.icon.brown,
[data-theme="dark"] .ui.container i.icon.brown,
[data-theme="dark"] .hauptcontent i.icon.brown {
  color: #8b4513 !important;
}

[data-theme="dark"] i.icon.green,
[data-theme="dark"] .ui.segment i.icon.green,
[data-theme="dark"] .ui.container i.icon.green,
[data-theme="dark"] .hauptcontent i.icon.green {
  color: #27ae60 !important;
}

[data-theme="dark"] i.icon.red,
[data-theme="dark"] .ui.segment i.icon.red,
[data-theme="dark"] .ui.container i.icon.red,
[data-theme="dark"] .hauptcontent i.icon.red {
  color: #e74c3c !important;
}

[data-theme="dark"] i.icon.blue,
[data-theme="dark"] .ui.segment i.icon.blue,
[data-theme="dark"] .ui.container i.icon.blue,
[data-theme="dark"] .hauptcontent i.icon.blue {
  color: #3498db !important;
}

[data-theme="dark"] i.icon.purple,
[data-theme="dark"] .ui.segment i.icon.purple,
[data-theme="dark"] .ui.container i.icon.purple,
[data-theme="dark"] .hauptcontent i.icon.purple {
  color: #9b59b6 !important;
}

[data-theme="dark"] i.icon.pink,
[data-theme="dark"] .ui.segment i.icon.pink,
[data-theme="dark"] .ui.container i.icon.pink,
[data-theme="dark"] .hauptcontent i.icon.pink {
  color: #e91e63 !important;
}

[data-theme="dark"] i.icon.teal,
[data-theme="dark"] .ui.segment i.icon.teal,
[data-theme="dark"] .ui.container i.icon.teal,
[data-theme="dark"] .hauptcontent i.icon.teal {
  color: #00b5ad !important;
}

[data-theme="dark"] i.icon.violet,
[data-theme="dark"] .ui.segment i.icon.violet,
[data-theme="dark"] .ui.container i.icon.violet,
[data-theme="dark"] .hauptcontent i.icon.violet {
  color: #6435c9 !important;
}

[data-theme="dark"] i.icon.black,
[data-theme="dark"] .ui.segment i.icon.black,
[data-theme="dark"] .ui.container i.icon.black,
[data-theme="dark"] .hauptcontent i.icon.black {
  color: var(--text-secondary) !important;
}


/* Dark Mode für Statistiken */
[data-theme="dark"] .ui.statistic > .value {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.statistic > .label {
  color: var(--text-secondary) !important;
}

/* Dark Mode für Modals */
[data-theme="dark"] .ui.modal {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.modal > .header {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.modal > .content {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

/* Dark Mode Toggle Button Styles */
.theme-toggle {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 1000;
  background-color: var(--bg-secondary);
  border: 1px solid var(--border-color);
  border-radius: 25px;
  padding: 8px 16px;
  cursor: pointer;
  transition: all 0.3s ease;
  font-size: 14px;
  color: var(--text-primary);
}

.theme-toggle:hover {
  background-color: var(--bg-tertiary);
  transform: translateY(-2px);
  box-shadow: 0 4px 8px var(--shadow-color);
}

.theme-toggle i {
  margin-right: 8px;
}

/* Smooth transitions für Theme-Wechsel */
* {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}

/* Layout Structure - Hauptcontent and Footer positioning */
[data-theme="dark"] .hauptcontent {
  background-color: var(--bg-primary) !important;
}

[data-theme="dark"] .footer {
  background-color: transparent !important;
  clear: both !important;
}

[data-theme="dark"] .ui.inverted.footer.segment {
  background-color: #393939 !important;
  color: rgba(255,255,255,.9) !important;
}

[data-theme="dark"] .ui.inverted.footer.segment h4 {
  color: rgba(255,255,255,.9) !important;
}

/* Footer links should stay light colored, not blue - higher specificity */
[data-theme="dark"] footer.ui.inverted.footer.segment a,
[data-theme="dark"] .ui.inverted.footer.segment a {
  color: rgba(255,255,255,.7) !important;
}

[data-theme="dark"] footer.ui.inverted.footer.segment a:hover,
[data-theme="dark"] .ui.inverted.footer.segment a:hover {
  color: rgba(255,255,255,.9) !important;
}

[data-theme="dark"] .header#pageHeader {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
}

/* Spezifische Fixes für problematische Elemente */
[data-theme="dark"] .ui.header.block {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.pointing.secondary.menu {
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.pointing.secondary.menu .item {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .ui.pointing.secondary.menu .active.item {
  color: var(--text-primary) !important;
  border-color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.pointing.secondary.menu .item:hover {
  color: var(--text-primary) !important;
}

/* Labels und Badges - Standard nur für neutrale Labels */
[data-theme="dark"] .ui.label:not(.teal):not(.blue):not(.green):not(.red):not(.orange):not(.yellow):not(.purple):not(.pink):not(.violet):not(.steam):not(.battle):not(.riot):not(.tank):not(.damage):not(.support):not(.grey):not(.brown) {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.label.horizontal:not(.teal):not(.blue):not(.green):not(.red):not(.orange):not(.yellow):not(.purple):not(.pink):not(.violet):not(.steam):not(.battle):not(.riot):not(.tank):not(.damage):not(.support):not(.grey):not(.brown) {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

/* Verschiedene Label-Farben für Dark Mode - sehr spezifisch */
[data-theme="dark"] .ui.green.label {
  background-color: #27ae60 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.blue.label {
  background-color: #2980b9 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.red.label {
  background-color: #e74c3c !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.orange.label {
  background-color: #e67e22 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.yellow.label {
  background-color: #f1c40f !important;
  color: #000000 !important;
}

[data-theme="dark"] .ui.purple.label {
  background-color: #9b59b6 !important;
  color: #ffffff !important;
}

/* Images und Icons mit hellem Hintergrund */
[data-theme="dark"] img {
  opacity: 0.9;
}

[data-theme="dark"] .ts-image {
  opacity: 0.8;
  filter: brightness(1.2);
}

/* Rank Container Styles */
[data-theme="dark"] .rank-container {
  background-color: var(--bg-secondary) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .rank-container.highlighted {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--text-secondary) !important;
}

[data-theme="dark"] .rank-container .title,
[data-theme="dark"] .rank-container .tier {
  color: var(--text-primary) !important;
}

/* Progress Labels */
[data-theme="dark"] .progress-label {
  color: var(--text-primary) !important;
}

[data-theme="dark"] hr {
  border-color: var(--border-color) !important;
}

/* Light Mode Overrides (für bessere Kompatibilität) */
[data-theme="light"] body {
  background-color: #ffffff !important;
  color: #212529 !important;
}

[data-theme="light"] .hauptcontent {
  background-color: #ffffff !important;
}

[data-theme="light"] .footer {
  background-color: transparent !important;
  clear: both !important;
}

[data-theme="light"] .ui.segment {
  background-color: #ffffff !important;
  color: #212529 !important;
  border-color: #dee2e6 !important;
}

[data-theme="light"] .ui.card,
[data-theme="light"] .ui.cards > .card {
  background-color: #ffffff !important;
  color: #212529 !important;
  border-color: #dee2e6 !important;
}

[data-theme="light"] .ui.header {
  color: #212529 !important;
}

[data-theme="light"] .ui.table {
  background-color: #ffffff !important;
  color: #212529 !important;
  border-color: #dee2e6 !important;
}

[data-theme="light"] .ui.message {
  background-color: #f8f9fa !important;
  color: #212529 !important;
}

/* Footer should stay inverted (dark) in both themes */
[data-theme="light"] .ui.inverted.footer.segment {
  background-color: #1b1c1d !important;
  color: rgba(255,255,255,.9) !important;
}

[data-theme="light"] .ui.inverted.footer.segment h4 {
  color: rgba(255,255,255,.9) !important;
}

[data-theme="light"] .ui.inverted.footer.segment a {
  color: rgba(255,255,255,.7) !important;
}

[data-theme="light"] .ui.inverted.footer.segment a:hover {
  color: rgba(255,255,255,.9) !important;
}

/* Light Mode Theme Toggle Position für bessere Sichtbarkeit */
[data-theme="light"] .theme-toggle {
  background-color: #f8f9fa;
  border-color: #dee2e6;
  color: #212529;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* ICON COLOR FIXES - HIGHEST PRIORITY RULES */
/* Global icon color fix - ensure neutral color by default */
[data-theme="dark"] i.icon {
  color: var(--text-secondary) !important;
}

/* Slick Carousel arrows fix for servergroups page */
[data-theme="dark"] .slick-next:before,
[data-theme="dark"] .slick-prev:before {
  color: var(--text-primary) !important;
}

/* Fix thead width on servergroups page to ensure full background coverage */
[data-theme="dark"] .groups-carousel-slide .ui.table thead {
  width: 100% !important;
}


/* Exception for navigation icons */
[data-theme="dark"] .ui.inverted.menu i.icon {
  color: rgba(255,255,255,.8) !important;
}
[data-theme="dark"] .ui.inverted.menu .item:hover i.icon {
  color: rgba(255,255,255,1) !important;
}

/* Force correct colors for all colored icons - MAXIMUM SPECIFICITY */
[data-theme="dark"] i.icon.yellow { color: #f1c40f !important; }
[data-theme="dark"] i.icon.gold { color: #f1c40f !important; }
[data-theme="dark"] i.icon.orange { color: #e67e22 !important; }
[data-theme="dark"] i.icon.red { color: #e74c3c !important; }
[data-theme="dark"] i.icon.green { color: #27ae60 !important; }
[data-theme="dark"] i.icon.blue { color: #3498db !important; }
[data-theme="dark"] i.icon.purple { color: #9b59b6 !important; }
[data-theme="dark"] i.icon.pink { color: #e91e63 !important; }
[data-theme="dark"] i.icon.teal { color: #00b5ad !important; }
[data-theme="dark"] i.icon.violet { color: #6435c9 !important; }
[data-theme="dark"] i.icon.silver { color: #c0c0c0 !important; }
[data-theme="dark"] i.icon.bronze { color: #cd7f32 !important; }
[data-theme="dark"] i.icon.brown { color: #8b4513 !important; }
[data-theme="dark"] i.icon.grey { color: #767676 !important; }
[data-theme="dark"] i.icon.black { color: var(--text-secondary) !important; }

/* Trophy icons with specific colors - highest priority */
[data-theme="dark"] i.trophy.icon.yellow { color: #f1c40f !important; }
[data-theme="dark"] i.trophy.icon.grey { color: #767676 !important; }
[data-theme="dark"] i.trophy.icon.brown { color: #8b4513 !important; }
[data-theme="dark"] i.large.trophy.icon.yellow { color: #f1c40f !important; }
[data-theme="dark"] i.large.trophy.icon.grey { color: #767676 !important; }
[data-theme="dark"] i.large.trophy.icon.brown { color: #8b4513 !important; }

/* Diamond icon specific color */
[data-theme="dark"] i.icon.diamond,
[data-theme="dark"] i.diamond.icon {
  color: #24c3ac !important;
}

/* Modern Statistics Section Styling */
/* Statistics section specific styling for better presentation */
.statistics-section {
  border-radius: 12px !important;
  padding: 2rem !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1) !important;
  transition: all 0.3s ease !important;
  margin: 0 auto !important;
  max-width: 1200px !important;
  width: 100% !important;
}

/* Center the entire statistics container */
.ui.container:has(.statistics-section) {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

/* Fomantic UI statistics styling improvements */
.statistics-section .ui.statistics {
  margin: 2rem 0 !important;
  justify-content: center !important;
}

.statistics-section .ui.statistics .statistic {
  margin: 0 1rem 1rem 1rem !important;
}

.statistics-section:hover {
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15) !important;
  transform: translateY(-2px) !important;
}

/* Statistics styling - centered layout */
.ui.statistic > .value {
  font-size: 2rem !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
}

.ui.statistic > .value i.icon {
  font-size: 1.5rem !important;
  opacity: 0.8 !important;
}

.ui.statistic > .label {
  font-size: 1rem !important;
  font-weight: 500 !important;
  margin-top: 0.5rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  text-align: center !important;
}

/* Center statistics within their containers */
.ui.statistic {
  text-align: center !important;
  margin: 0 auto !important;
}

.ui.mini.statistics {
  justify-content: center !important;
}

.ui.mini.statistics.centered {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

/* Grid centering improvements */
.ui.centered.grid > .column {
  text-align: center !important;
}

.statistics-section .ui.grid {
  justify-content: center !important;
}

.ui.mini.statistics .statistic > .value {
  font-size: 1.5rem !important;
}

.ui.mini.statistics .statistic > .label {
  font-size: 0.9rem !important;
}

/* Dark mode statistics styling */
[data-theme="dark"] .statistics-section {
  background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 4px 20px rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .statistics-section:hover {
  box-shadow: 0 8px 30px rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .ui.statistic > .value {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.statistic > .label {
  color: var(--text-secondary) !important;
}

/* Light mode statistics styling */
[data-theme="light"] .statistics-section {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%) !important;
  border: 1px solid #e9ecef !important;
}

[data-theme="light"] .ui.statistic > .value {
  color: #212529 !important;
}

[data-theme="light"] .ui.statistic > .label {
  color: #6c757d !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .statistics-section {
    padding: 1rem !important;
  }
  
  .ui.statistic > .value {
    font-size: 1.5rem !important;
  }
  
  .ui.statistic > .value i.icon {
    font-size: 1.2rem !important;
  }
  
  .ui.mini.statistics .statistic > .value {
    font-size: 1.2rem !important;
  }
}

/* Animation for statistics values */
.ui.statistic > .value {
  animation: fadeInUp 0.6s ease-out forwards;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Overwatch Statistics Page Styling */
/* Hero stats cards */
.hero-stats-card {
  border-radius: 12px !important;
  padding: 1.5rem !important;
  transition: all 0.3s ease !important;
  border: 1px solid transparent !important;
}

.hero-stats-card:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
}

.overwatch-stats-section {
  border-radius: 12px !important;
  padding: 2rem !important;
  margin: 2rem 0 !important;
}

.overwatch-stats-section .ui.statistic > .value {
  font-size: 2.2rem !important;
  font-weight: 700 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
}

.overwatch-stats-section .ui.mini.statistics .statistic > .value {
  font-size: 1.6rem !important;
}

/* Dark mode styling for Overwatch stats */
[data-theme="dark"] .overwatch-stats-section {
  background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 4px 20px rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .hero-stats-card {
  background: linear-gradient(135deg, var(--bg-tertiary) 0%, rgba(255, 255, 255, 0.03) 100%) !important;
  border: 1px solid var(--border-color) !important;
  box-shadow: 0 4px 15px rgba(255, 255, 255, 0.02) !important;
}

[data-theme="dark"] .hero-stats-card:hover {
  box-shadow: 0 8px 25px rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .overwatch-stats-section .ui.statistic > .value {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .overwatch-stats-section .ui.statistic > .label {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .overwatch-stats-section .ui.warning.message {
  background-color: rgba(255, 193, 7, 0.1) !important;
  border: 1px solid rgba(255, 193, 7, 0.3) !important;
  color: #fff3cd !important;
}

/* Light mode styling for Overwatch stats */
[data-theme="light"] .overwatch-stats-section {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%) !important;
  border: 1px solid #e9ecef !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
}

[data-theme="light"] .hero-stats-card {
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%) !important;
  border: 1px solid #dee2e6 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
}

[data-theme="light"] .hero-stats-card:hover {
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.12) !important;
  border-color: #adb5bd !important;
}

[data-theme="light"] .overwatch-stats-section .ui.statistic > .value {
  color: #212529 !important;
}

[data-theme="light"] .overwatch-stats-section .ui.statistic > .label {
  color: #6c757d !important;
}

/* Role-specific icon colors */
.overwatch-stats-section .heart.icon {
  color: #e91e63 !important; /* Support - Pink */
}

.overwatch-stats-section .crosshairs.icon {
  color: #f44336 !important; /* Damage - Red */
}

.overwatch-stats-section .shield.alternate.icon {
  color: #2196f3 !important; /* Tank - Blue */
}

/* Responsive adjustments for Overwatch stats */
@media (max-width: 768px) {
  .overwatch-stats-section {
    padding: 1rem !important;
    margin: 1rem 0 !important;
  }
  
  .hero-stats-card {
    padding: 1rem !important;
  }
  
  .overwatch-stats-section .ui.statistic > .value {
    font-size: 1.8rem !important;
  }
  
  .overwatch-stats-section .ui.mini.statistics .statistic > .value {
    font-size: 1.3rem !important;
  }
}

/* Animation for Overwatch statistics */
.overwatch-stats-section .ui.statistic {
  animation: fadeInUp 0.8s ease-out forwards;
}

.hero-stats-card {
  animation: fadeInUp 1s ease-out forwards;
}

/* Zusätzliche spezifische Fixes */
/* Comments und Content Bereiche */
[data-theme="dark"] .ui.comments .comment .content .author {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.comments .comment .content .text {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.comments .comment .content .metadata {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .ui.comments .comment .actions a {
  color: var(--link-color) !important;
}

/* Breadcrumb */
[data-theme="dark"] .ui.breadcrumb {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .ui.breadcrumb a {
  color: #2980b9 !important;
}

[data-theme="dark"] .ui.breadcrumb .divider {
  color: var(--text-muted) !important;
}

/* Loader und Loading States */
[data-theme="dark"] .ui.loader:before {
  border-color: rgba(255,255,255,.1) !important;
}

[data-theme="dark"] .ui.loader:after {
  border-color: var(--text-primary) transparent transparent !important;
}

/* Dimmer */
[data-theme="dark"] .ui.dimmer {
  background-color: rgba(0, 0, 0, 0.85) !important;
}

/* Popup */
[data-theme="dark"] .ui.popup {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
  box-shadow: 0 2px 8px rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .ui.popup:before {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Sidebar */
[data-theme="dark"] .ui.sidebar {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

/* Search Results */
[data-theme="dark"] .ui.search > .results {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.search > .results .result {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.search > .results .result:hover {
  background-color: var(--bg-tertiary) !important;
}

/* Selection Controls */
[data-theme="dark"] .ui.selection.dropdown {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.selection.dropdown .dropdown.icon {
  color: var(--text-secondary) !important;
}

/* Steps */
[data-theme="dark"] .ui.steps .step {
  background-color: var(--bg-secondary) !important;
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .ui.steps .step.active {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.steps .step .title {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.steps .step .description {
  color: var(--text-secondary) !important;
}

/* Rating */
[data-theme="dark"] .ui.rating .icon {
  color: var(--text-muted) !important;
}

[data-theme="dark"] .ui.rating .active.icon {
  color: #ffb400 !important;
}

/* Feed */
[data-theme="dark"] .ui.feed > .event {
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.feed > .event .content {
  color: var(--text-primary) !important;
}

/* Items */
[data-theme="dark"] .ui.items > .item {
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.items > .item .content .header {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.items > .item .content .description {
  color: var(--text-secondary) !important;
}

/* Menu weiterer Fixes */
[data-theme="dark"] .ui.menu .ui.button {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

/* Sticky Elements */
[data-theme="dark"] .ui.sticky {
  background-color: var(--bg-primary) !important;
}

/* Reveal */
[data-theme="dark"] .ui.reveal > .hidden.content {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
}

/* Grid Fixes */
[data-theme="dark"] .ui.grid > .row {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.grid > .column:not(.row) {
  color: var(--text-primary) !important;
}

/* Spezifische Website-Elemente */
[data-theme="dark"] .achievement-component {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

/* Startseiten-Segmente Fixes */
[data-theme="dark"] .ui.segment.green {
  background-color: #1e4d1e !important;
  border-color: #27ae60 !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.segment.blue {
  background-color: #1e3a5f !important;
  border-color: #2980b9 !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.segment.grey {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* Startseiten-Button Fixes - höhere Spezifität */
[data-theme="dark"] .ui.container.grid .ui.segment.green .ui.button.green {
  background-color: #27ae60 !important;
  color: #ffffff !important;
  border: none !important;
}

[data-theme="dark"] .ui.container.grid .ui.segment.green .ui.button.green:hover {
  background-color: #2ecc71 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.container.grid .ui.segment.blue .ui.button.blue {
  background-color: #2980b9 !important;
  color: #ffffff !important;
  border: none !important;
}

[data-theme="dark"] .ui.container.grid .ui.segment.blue .ui.button.blue:hover {
  background-color: #3498db !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.container.grid .ui.segment.grey .ui.button.basic {
  background-color: transparent !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .ui.container.grid .ui.segment.grey .ui.button.basic:hover {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

/* Errungenschaftsseite Header Fixes - sehr spezifisch */
[data-theme="dark"] .achievement-component .header,
[data-theme="dark"] .achievement-component .title,
[data-theme="dark"] .achievement-component h1,
[data-theme="dark"] .achievement-component h2,
[data-theme="dark"] .achievement-component h3,
[data-theme="dark"] .achievement-component h4,
[data-theme="dark"] .achievement-component .ui.header,
[data-theme="dark"] .achievement-component .content .header {
  color: #ffffff !important;
  text-shadow: none !important;
}

[data-theme="dark"] .achievement-component .description,
[data-theme="dark"] .achievement-component .content .description {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .achievement-component.completed {
  background-color: #1e4d1e !important;
  border-color: #27ae60 !important;
}

[data-theme="dark"] .achievement-component.completed .header,
[data-theme="dark"] .achievement-component.completed .title {
  color: #ffffff !important;
}

[data-theme="dark"] .achievement-component.locked {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--text-muted) !important;
  opacity: 0.6;
}

[data-theme="dark"] .achievement-component.locked .header,
[data-theme="dark"] .achievement-component.locked .title {
  color: #ffffff !important;
}

/* Alle Texte in Achievement-Komponenten */
[data-theme="dark"] .achievement-component *:not(a) {
  color: #ffffff !important;
}

[data-theme="dark"] .achievement-component .description *:not(a) {
  color: var(--text-secondary) !important;
}

/* Modal Button Fixes */
[data-theme="dark"] .ui.modal .actions .ui.button.black {
  background-color: #2d2d2d !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.modal .actions .ui.button.green {
  background-color: #27ae60 !important;
  color: #ffffff !important;
}

/* Account-Seite spezifische Button-Fixes */
[data-theme="dark"] .ui.container .ui.button.teal {
  background-color: #16a085 !important;
  color: #ffffff !important;
  border: none !important;
}

[data-theme="dark"] .ui.container .ui.button.teal:hover {
  background-color: #1abc9c !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.container .ui.button.pink {
  background-color: #c44569 !important;
  color: #ffffff !important;
  border: none !important;
}

[data-theme="dark"] .ui.container .ui.button.pink:hover {
  background-color: #e84393 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.container .ui.button.violet {
  background-color: #6c5ce7 !important;
  color: #ffffff !important;
  border: none !important;
}

[data-theme="dark"] .ui.container .ui.button.violet:hover {
  background-color: #a29bfe !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.container .ui.button.orange {
  background-color: #e67e22 !important;
  color: #ffffff !important;
  border: none !important;
}

[data-theme="dark"] .ui.container .ui.button.orange:hover {
  background-color: #f39c12 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.container .ui.button.tiny {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .ui.container .ui.button.tiny:hover {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
}

/* Animated Buttons */
[data-theme="dark"] .ui.animated.button.orange {
  background-color: #e67e22 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.animated.button.orange:hover {
  background-color: #f39c12 !important;
}

[data-theme="dark"] .ui.animated.button.orange .visible.content,
[data-theme="dark"] .ui.animated.button.orange .hidden.content {
  color: #ffffff !important;
}

/* Inverted Segments auf Account-Seite */
[data-theme="dark"] .ui.segment.blue.inverted {
  background-color: #1e3a5f !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.segment.green {
  background-color: #1e4d1e !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.segment.red {
  background-color: #4d1e1e !important;
  color: #ffffff !important;
}

/* Zusätzliche farbige Label-Farben */
[data-theme="dark"] .ui.teal.label {
  background-color: #16a085 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.pink.label {
  background-color: #e84393 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.violet.label {
  background-color: #6c5ce7 !important;
  color: #ffffff !important;
}

/* 2. Errungenschafts-Header richtig anpassen */
[data-theme="dark"] .ui.attached.segment {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.top.attached.header {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-bottom-color: var(--border-color) !important;
}

/* 3 & 4. Form-Felder in Channel und Musicbot Bereichen */
[data-theme="dark"] .ui.form .fields .field input,
[data-theme="dark"] .ui.form .field input,
[data-theme="dark"] .ui.form input {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.form .fields .field input:focus,
[data-theme="dark"] .ui.form .field input:focus,
[data-theme="dark"] .ui.form input:focus {
  background-color: var(--bg-secondary) !important;
  border-color: var(--link-color) !important;
}

[data-theme="dark"] .ui.form .fields .field select,
[data-theme="dark"] .ui.form .field select,
[data-theme="dark"] .ui.form select {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .ui.form textarea {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

/* 5. Integrationsseite spezifische Labels */
[data-theme="dark"] .ui.label.steam {
  background-color: #1b2838 !important;
  color: #66c0f4 !important;
}

[data-theme="dark"] .ui.label.battle {
  background-color: #0f1419 !important;
  color: #f99e1a !important;
}

[data-theme="dark"] .ui.label.riot {
  background-color: #0a0e13 !important;
  color: #c89b3c !important;
}

/* 6. Overwatch Role Icons */
[data-theme="dark"] .overwatch-role.tank {
  color: #f99e1a !important;
  background-color: rgba(249, 158, 26, 0.2) !important;
}

[data-theme="dark"] .overwatch-role.damage {
  color: #f44336 !important;
  background-color: rgba(244, 67, 54, 0.2) !important;
}

[data-theme="dark"] .overwatch-role.support {
  color: #4caf50 !important;
  background-color: rgba(76, 175, 80, 0.2) !important;
}

/* Role-spezifische Icons und Badges */
[data-theme="dark"] .role-tank,
[data-theme="dark"] .ui.label.tank {
  background-color: #664d03 !important;
  color: #fff3cd !important;
}

[data-theme="dark"] .role-damage,
[data-theme="dark"] .ui.label.damage {
  background-color: #721c24 !important;
  color: #f8d7da !important;
}

[data-theme="dark"] .role-support,
[data-theme="dark"] .ui.label.support {
  background-color: #0f5132 !important;
  color: #d1e7dd !important;
}

/* Sub-Channel spezifische Styles */
[data-theme="dark"] .sub-channel-field,
[data-theme="dark"] .channel-settings .ui.input,
[data-theme="dark"] .channel-management .ui.input {
  background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .sub-channel-field input,
[data-theme="dark"] .channel-settings .ui.input input,
[data-theme="dark"] .channel-management .ui.input input {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

/* Musicbot Blackmarket spezifische Felder */
[data-theme="dark"] .musicbot-form .ui.input,
[data-theme="dark"] .blackmarket-form .ui.input {
  background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .musicbot-form .ui.input input,
[data-theme="dark"] .blackmarket-form .ui.input input {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

/* Globale Text-Fixes für spezifische Elemente mit schwarzem Text */
[data-theme="dark"] body,
[data-theme="dark"] html {
  color: var(--text-primary) !important;
}

/* Alle Text-Container Elemente */
[data-theme="dark"] .content,
[data-theme="dark"] .text,
[data-theme="dark"] .description,
[data-theme="dark"] .header:not(.ui),
[data-theme="dark"] .title {
  color: var(--text-primary) !important;
}

/* Spezifische Überschreibungen für Elemente, die andere Farben benötigen */
[data-theme="dark"] .ui.green.label,
[data-theme="dark"] .ui.green.button {
  color: #90ee90 !important;
}

[data-theme="dark"] .ui.blue.label,
[data-theme="dark"] .ui.blue.button {
  color: #87ceeb !important;
}

[data-theme="dark"] .ui.red.label,
[data-theme="dark"] .ui.red.button {
  color: #ffb3b3 !important;
}

[data-theme="dark"] .ui.orange.label,
[data-theme="dark"] .ui.orange.button {
  color: #ffd4a3 !important;
}

[data-theme="dark"] .ui.yellow.label,
[data-theme="dark"] .ui.yellow.button {
  color: #ffff99 !important;
}

[data-theme="dark"] .ui.purple.label,
[data-theme="dark"] .ui.purple.button {
  color: #dda0dd !important;
}

/* Links bleiben in der originalen blauen Farbe */
[data-theme="dark"] a,
[data-theme="dark"] .ui.link {
  color: #2980b9 !important;
}

[data-theme="dark"] a:hover,
[data-theme="dark"] .ui.link:hover {
  color: #3498db !important;
}

/* Sekundäre Texte */
[data-theme="dark"] .ui.header .sub.header,
[data-theme="dark"] .sub.header,
[data-theme="dark"] .meta,
[data-theme="dark"] .description {
  color: var(--text-secondary) !important;
}

/* Gedämpfte Texte */
[data-theme="dark"] .ui.disabled,
[data-theme="dark"] .disabled {
  color: var(--text-muted) !important;
}

/* Alle Paragraphen und Textelemente */
[data-theme="dark"] p,
[data-theme="dark"] span,
[data-theme="dark"] div:not(.ui),
[data-theme="dark"] td,
[data-theme="dark"] th,
[data-theme="dark"] li,
[data-theme="dark"] strong,
[data-theme="dark"] b,
[data-theme="dark"] em,
[data-theme="dark"] i {
  color: var(--text-primary) !important;
}

/* UI-Komponenten Text-Fixes */
[data-theme="dark"] .ui.card .content,
[data-theme="dark"] .ui.segment,
[data-theme="dark"] .ui.message,
[data-theme="dark"] .ui.table {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.card .content *:not(a):not(i),
[data-theme="dark"] .ui.segment *:not(a):not(i),
[data-theme="dark"] .ui.message *:not(.icon):not(a):not(i),
[data-theme="dark"] .ui.table *:not(a):not(i) {
  color: inherit !important;
}

/* Tabs und Navigation Text */
[data-theme="dark"] .ui.tabular.menu .item,
[data-theme="dark"] .ui.secondary.menu .item {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .ui.tabular.menu .active.item,
[data-theme="dark"] .ui.secondary.menu .active.item {
  color: var(--text-primary) !important;
}

/* Form-Elemente Text */
[data-theme="dark"] .ui.form .field label,
[data-theme="dark"] .ui.form label {
  color: var(--text-primary) !important;
}

/* Button Text Fixes - überschreibt globale Regeln */
[data-theme="dark"] .ui.button:not(.green):not(.blue):not(.red):not(.orange):not(.purple):not(.primary) {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.primary.button,
[data-theme="dark"] .ui.blue.button,
[data-theme="dark"] .ui.green.button,
[data-theme="dark"] .ui.red.button,
[data-theme="dark"] .ui.orange.button,
[data-theme="dark"] .ui.purple.button {
  color: #ffffff !important;
}

[data-theme="dark"] .ui.yellow.button {
  color: #000000 !important;
}

/* Dropdown und Select Text */
[data-theme="dark"] .ui.dropdown .text,
[data-theme="dark"] .ui.dropdown .menu .item {
  color: var(--text-primary) !important;
}

/* Statistiken und Werte */
[data-theme="dark"] .ui.statistic .value,
[data-theme="dark"] .ui.statistics .statistic .value {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.statistic .label,
[data-theme="dark"] .ui.statistics .statistic .label {
  color: var(--text-secondary) !important;
}

/* Breadcrumb Text Fix */
[data-theme="dark"] .ui.breadcrumb .section {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .ui.breadcrumb a.section {
  color: #2980b9 !important;
}

/* Zusätzliche Text-Fixes für hartnäckige schwarze Texte */
[data-theme="dark"] .ui.grid .column,
[data-theme="dark"] .ui.grid .row,
[data-theme="dark"] .column,
[data-theme="dark"] .row {
  color: var(--text-primary) !important;
}

/* Specific fixes für Text in verschiedenen Containern */
[data-theme="dark"] .ui.container,
[data-theme="dark"] .ui.container *:not(.icon):not(.ui.button):not(.ui.label):not(a) {
  color: var(--text-primary) !important;
}

/* Tab Content */
[data-theme="dark"] .ui.tab {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.tab *:not(a) {
  color: inherit !important;
}

/* Overwatch Stats spezifische Fixes */
[data-theme="dark"] .hero-stats-container,
[data-theme="dark"] .hero-stats-container *:not(a) {
  color: var(--text-primary) !important;
}

/* Profile Content - ausgenommen Buttons und Labels */
[data-theme="dark"] .hauptcontent {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .hauptcontent *:not(.ui.button):not(.ui.label):not(.icon):not(a) {
  color: var(--text-primary) !important;
}

/* Ausnahmen für Elemente die andere Farben brauchen */
[data-theme="dark"] .hauptcontent a {
  color: #2980b9 !important;
}

[data-theme="dark"] .hauptcontent a:hover {
  color: #3498db !important;
}

[data-theme="dark"] .hauptcontent .icon {
  color: var(--text-secondary) !important;
}

/* Neutrale Labels im Hauptcontent */
[data-theme="dark"] .hauptcontent .ui.label:not(.teal):not(.blue):not(.green):not(.red):not(.orange):not(.yellow):not(.purple):not(.pink):not(.violet):not(.steam):not(.battle):not(.riot):not(.tank):not(.damage):not(.support):not(.grey):not(.brown) {
  background-color: var(--bg-tertiary) !important;
  color: var(--text-primary) !important;
}

/* Weitere spezifische Text-Fixes */
[data-theme="dark"] .ui.header:not(.inverted) {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.segment:not(.inverted) {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .ui.segment:not(.inverted) *:not(a):not(i) {
  color: inherit !important;
}

/* List Items */
[data-theme="dark"] .ui.list .item,
[data-theme="dark"] .ui.list .item .content {
  color: var(--text-primary) !important;
}

/* SEHR SPEZIFISCHE LABEL-REGELN - HÖCHSTE PRIORITÄT */
[data-theme="dark"] .ui.teal.label,
[data-theme="dark"] .hauptcontent .ui.teal.label,
[data-theme="dark"] .ui.container .ui.teal.label {
  background-color: #16a085 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.blue.label,
[data-theme="dark"] .hauptcontent .ui.blue.label,
[data-theme="dark"] .ui.container .ui.blue.label {
  background-color: #2980b9 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.green.label,
[data-theme="dark"] .hauptcontent .ui.green.label,
[data-theme="dark"] .ui.container .ui.green.label {
  background-color: #27ae60 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.red.label,
[data-theme="dark"] .hauptcontent .ui.red.label,
[data-theme="dark"] .ui.container .ui.red.label {
  background-color: #e74c3c !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.orange.label,
[data-theme="dark"] .hauptcontent .ui.orange.label,
[data-theme="dark"] .ui.container .ui.orange.label {
  background-color: #e67e22 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.yellow.label,
[data-theme="dark"] .hauptcontent .ui.yellow.label,
[data-theme="dark"] .ui.container .ui.yellow.label {
  background-color: #f1c40f !important;
  color: #000000 !important;
}

[data-theme="dark"] .ui.purple.label,
[data-theme="dark"] .hauptcontent .ui.purple.label,
[data-theme="dark"] .ui.container .ui.purple.label {
  background-color: #9b59b6 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.pink.label,
[data-theme="dark"] .hauptcontent .ui.pink.label,
[data-theme="dark"] .ui.container .ui.pink.label {
  background-color: #e84393 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.violet.label,
[data-theme="dark"] .hauptcontent .ui.violet.label,
[data-theme="dark"] .ui.container .ui.violet.label {
  background-color: #6c5ce7 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.grey.label,
[data-theme="dark"] .hauptcontent .ui.grey.label,
[data-theme="dark"] .ui.container .ui.grey.label {
  background-color: #767676 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .ui.brown.label,
[data-theme="dark"] .hauptcontent .ui.brown.label,
[data-theme="dark"] .ui.container .ui.brown.label {
  background-color: #8b4513 !important;
  color: #ffffff !important;
}

/* Dark Mode für Hero Carousel - Overwatch Stats Page */
[data-theme="dark"] .hero-card {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .hero-card h3,
[data-theme="dark"] .hero-card h4 {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .hero-card .sub.header {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .hero-card table,
[data-theme="dark"] .hero-card table td,
[data-theme="dark"] .hero-card table strong {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .carousel-nav button,
[data-theme="dark"] .hero-nav-button {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .carousel-nav button:hover:not(:disabled),
[data-theme="dark"] .hero-nav-button:hover:not(.active) {
  background-color: #4a4a4a !important;
  border-color: #5a5a5a !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .hero-nav-button.active {
  background-color: #2185d0 !important;
  color: white !important;
  border-color: #2185d0 !important;
}

[data-theme="dark"] .carousel-nav button:disabled {
  opacity: 0.4 !important;
  background-color: var(--bg-secondary) !important;
  color: var(--text-muted) !important;
}