:root {
    --bg: #09111f;
    --bg-2: #0f1728;
    --panel: rgba(15, 23, 40, .88);
    --panel-2: rgba(22, 33, 57, .92);
    --line: rgba(120, 146, 193, .16);
    --text: #ecf3ff;
    --muted: #94a5c6;
    --accent: #5f8cff;
    --accent-2: #7b5cff;
    --green: #42c07d;
    --orange: #f2b544;
    --red: #e26a6a;
    --shadow: 0 18px 45px rgba(0,0,0,.35);
    --radius: 18px;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    background:
        radial-gradient(circle at top right, rgba(111, 68, 255, .28), transparent 26%),
        radial-gradient(circle at top left, rgba(95, 140, 255, .18), transparent 28%),
        linear-gradient(180deg, #07111c 0%, #0a1320 100%);
    color: var(--text);
    min-height: 100vh;
}
a { color: inherit; text-decoration: none; }

.app-shell { display: flex; min-height: 100vh; }
.sidebar {
    width: 300px;
    background: rgba(5, 10, 19, .82);
    border-right: 1px solid var(--line);
    backdrop-filter: blur(16px);
    padding: 18px 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: sticky;
    top: 0;
    height: 100vh;
}
.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 6px 6px 18px;
}
.brand-mark {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #6ea8ff, #7157ff);
    color: #fff;
    font-weight: 800;
    box-shadow: 0 12px 24px rgba(95, 140, 255, .24);
}
.brand strong { display: block; font-size: 1.15rem; letter-spacing: .04em; }
.brand small { display: block; color: var(--muted); margin-top: 2px; }
.profile-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 10px 18px;
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    margin-bottom: 14px;
}
.profile-avatar {
    position: relative;
    width: 46px;
    height: 46px;
    min-width: 46px;
    max-width: 46px;
    min-height: 46px;
    max-height: 46px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(135deg, #0d1b30, #132847);
    border: 2px solid rgba(95, 140, 255, .45);
    font-weight: 800;
    flex: 0 0 46px;
}
.profile-avatar span,
.profile-avatar img {
    grid-area: 1 / 1;
}
.profile-avatar img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    width: 46px;
    height: 46px;
    max-width: 46px;
    max-height: 46px;
    object-fit: cover;
    border-radius: 50%;
    display: block;
}
.profile-meta strong { display: block; }
.profile-meta small { color: var(--muted); }
.nav-sections { display: grid; gap: 16px; }
.nav-group { display: grid; gap: 6px; }
.nav-label {
    color: #a7b7d8;
    font-size: .77rem;
    font-weight: 700;
    letter-spacing: .09em;
    padding: 0 8px 6px;
}
.nav-label-flex { display:flex; justify-content:space-between; align-items:center; }
.nav-link {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    color: #d4def3;
    border-radius: 12px;
    transition: .18s ease;
}
.nav-link:hover { background: rgba(95, 140, 255, .11); color: #fff; }
.nav-link.active {
    background: linear-gradient(135deg, rgba(91, 136, 255, .95), rgba(84, 118, 255, .78));
    color: #fff;
    box-shadow: 0 10px 26px rgba(95, 140, 255, .18);
}
.nav-icon { width: 20px; text-align: center; }
.admin-box {
    margin-top: 4px;
    padding-top: 2px;
}
.sidebar-footer { padding-top: 18px; border-top: 1px solid var(--line); margin-top: 18px; }
.logout-link { display: block; padding: 12px; border-radius: 12px; color: #dce6fb; }
.logout-link:hover { background: rgba(255,255,255,.06); }

.content {
    flex: 1;
    padding: 24px;
    min-width: 0;
}
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 18px;
    padding: 18px 22px;
    background: linear-gradient(135deg, rgba(53, 68, 121, .95), rgba(78, 42, 109, .92));
    border: 1px solid rgba(167, 138, 255, .16);
    border-radius: 18px;
    box-shadow: var(--shadow);
    margin-bottom: 18px;
}
.page-header h1 { margin: 4px 0 0; font-size: 2rem; }
.eyebrow {
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .78rem;
    color: #c8d7ff;
    font-weight: 700;
}
.page-badge {
    white-space: nowrap;
    padding: 10px 14px;
    background: rgba(8, 14, 26, .25);
    border: 1px solid rgba(255,255,255,.12);
    color: #d6dfff;
    border-radius: 999px;
}

.grid { display: grid; gap: 16px; grid-template-columns: repeat(12, minmax(0,1fr)); }
.grid > * { min-width: 0; }
.two-col { display: grid; grid-template-columns: 1.3fr .9fr; gap: 16px; }
.three-col { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; }
.card {
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 18px;
    box-shadow: var(--shadow);
    backdrop-filter: blur(12px);
}
.hero-card {
    background: linear-gradient(180deg, rgba(14, 23, 38, .94), rgba(10, 18, 30, .9));
}
.metric-card {
    grid-column: span 3;
    min-height: 126px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.metric-card small, .muted { color: var(--muted); }
.metric-card strong { font-size: 2rem; line-height: 1.05; }
.metric-card .trend { color: #dbe5ff; font-size: .95rem; }
.stat-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: 12px;
    background: rgba(95, 140, 255, .14);
    color: #dde7ff;
}
.section-title { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:14px; }
.section-title h2, .card h2 { margin: 0; font-size: 1.25rem; }
.section-title p { margin: 4px 0 0; color: var(--muted); }
.list { display: grid; gap: 10px; }
.list-row {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 12px 0;
    border-bottom: 1px solid rgba(255,255,255,.06);
}
.list-row:last-child { border-bottom: 0; padding-bottom: 0; }

.table-wrap {
    width: 100%;
    overflow: auto;
    border-radius: 16px;
    border: 1px solid var(--line);
    background: rgba(9, 15, 26, .55);
}
table { width: 100%; border-collapse: collapse; min-width: 780px; }
thead th {
    text-align: left;
    font-size: .77rem;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #a6b7d8;
    background: rgba(14, 21, 36, .96);
    padding: 14px 16px;
}
tbody td {
    padding: 15px 16px;
    border-top: 1px solid rgba(255,255,255,.05);
    vertical-align: top;
}
tbody tr:nth-child(even) { background: rgba(255,255,255,.02); }
tbody tr.highlight-row { background: rgba(95, 140, 255, .14); }

.pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    font-size: .84rem;
    background: rgba(255,255,255,.08);
    color: #dbe6ff;
}
.pill.good { background: rgba(66, 192, 125, .16); color: #97f1ba; }
.pill.warn { background: rgba(242, 181, 68, .16); color: #f6d27a; }
.pill.bad { background: rgba(226, 106, 106, .18); color: #ffb0b0; }
.pill.accent { background: rgba(95, 140, 255, .16); color: #bfd1ff; }

.login-shell {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
}
.login-card {
    width: 100%;
    max-width: 460px;
    background: rgba(10, 16, 27, .92);
    border: 1px solid var(--line);
    border-radius: 22px;
    padding: 28px;
    box-shadow: var(--shadow);
}
.login-card h1 { margin: 18px 0 8px; }
.field { display: grid; gap: 8px; margin-top: 16px; }
.field label { color: #dbe6ff; font-size: .95rem; }
.field input, .field textarea, .field select {
    width: 100%;
    background: rgba(255,255,255,.04);
    color: #fff;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    padding: 13px 14px;
    outline: none;
}
.field textarea { min-height: 160px; resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus { border-color: rgba(95, 140, 255, .6); }
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    border: 0;
    border-radius: 12px;
    color: #fff;
    background: linear-gradient(135deg, #5e8cff, #6d5cff);
    cursor: pointer;
    font-weight: 700;
    margin-top: 18px;
}
.btn.secondary { background: rgba(255,255,255,.08); color: #e8f0ff; }
.alert {
    margin-top: 16px;
    padding: 13px 14px;
    border-radius: 12px;
    background: rgba(226, 106, 106, .14);
    border: 1px solid rgba(226, 106, 106, .18);
    color: #ffd1d1;
}
.alert.success {
    background: rgba(66, 192, 125, .14);
    border-color: rgba(66, 192, 125, .16);
    color: #b5f3c8;
}
.tabs { display:flex; flex-wrap:wrap; gap:10px; margin-bottom: 18px; }
.tab {
    padding: 10px 14px;
    border-radius: 12px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.06);
    color: #dce6ff;
}
.tab.active { background: linear-gradient(135deg, #5e8cff, #4d78ed); color: #fff; }
.podium {
    display: grid;
    grid-template-columns: 1fr 1.15fr 1fr;
    gap: 16px;
    align-items: end;
}
.podium-card {
    text-align: center;
    padding: 28px 18px;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.08);
    box-shadow: var(--shadow);
}
.podium-card h3 { margin: 12px 0 6px; font-size: 1.7rem; }
.podium-card small { color: rgba(255,255,255,.82); }
.podium-card .rank { font-size: .95rem; opacity: .88; }
.podium-card.first { background: linear-gradient(135deg, rgba(245, 166, 35, .92), rgba(204, 125, 0, .95)); }
.podium-card.second { background: linear-gradient(135deg, rgba(39, 55, 84, .98), rgba(56, 77, 119, .92)); }
.podium-card.third { background: linear-gradient(135deg, rgba(194, 83, 20, .96), rgba(164, 51, 13, .96)); }
.empty-state { color: var(--muted); padding: 8px 0; }
.inline-form { display:flex; gap:12px; flex-wrap:wrap; align-items:end; }
.inline-form .field { margin-top: 0; min-width: 180px; flex: 1; }
.kpi-grid { display:grid; gap:16px; grid-template-columns: repeat(4, minmax(0,1fr)); margin-bottom:16px; }
.kpi-box { padding:16px; border-radius:16px; background: rgba(255,255,255,.04); border:1px solid var(--line); }
.kpi-box strong { display:block; font-size:1.65rem; margin-top: 6px; }
.note { white-space: pre-wrap; }
.site-footer {
    display:flex;
    justify-content:space-between;
    gap:12px;
    color: var(--muted);
    font-size: .9rem;
    padding: 18px 4px 6px;
}

@media (max-width: 1200px) {
    .metric-card { grid-column: span 6; }
    .kpi-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 980px) {
    .app-shell { display: block; }
    .sidebar { width: 100%; height: auto; position: static; }
    .content { padding: 18px; }
    .two-col, .three-col, .podium { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .page-header { flex-direction: column; align-items: flex-start; }
    .metric-card { grid-column: span 12; }
    .kpi-grid { grid-template-columns: 1fr; }
    .site-footer { flex-direction: column; }
}


/* V3.2 Sidebar: eigener Scrollbereich + einklappbare Gruppen */
.sidebar {
    overflow: hidden;
}
.sidebar-scroll {
    min-height: 0;
    flex: 1 1 auto;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 5px;
    scrollbar-width: thin;
    scrollbar-color: rgba(95, 140, 255, .55) rgba(255,255,255,.035);
}
.sidebar-scroll::-webkit-scrollbar { width: 8px; }
.sidebar-scroll::-webkit-scrollbar-track {
    background: rgba(255,255,255,.025);
    border-radius: 99px;
}
.sidebar-scroll::-webkit-scrollbar-thumb {
    background: rgba(95, 140, 255, .38);
    border-radius: 99px;
}
.sidebar-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(95, 140, 255, .62);
}
.sidebar-footer {
    flex: 0 0 auto;
    background: rgba(5, 10, 19, .94);
}
.nav-toggle {
    appearance: none;
    width: 100%;
    border: 0;
    background: transparent;
    cursor: pointer;
    text-align: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #a7b7d8;
    font-family: inherit;
}
.nav-toggle:hover { color: #dce6ff; }
.nav-chevron {
    display: inline-block;
    transition: transform .2s ease;
    font-size: .9rem;
}
.nav-group.collapsible:not(.open) .nav-chevron { transform: rotate(-90deg); }
.nav-group-body {
    display: grid;
    gap: 6px;
    overflow: hidden;
}
.nav-group.collapsible:not(.open) .nav-group-body {
    display: none;
}
.nav-group.collapsible.open .nav-group-body {
    display: grid;
}

@media (max-width: 980px) {
    .sidebar { overflow: visible; }
    .sidebar-scroll { overflow: visible; padding-right: 0; }
}


.inventory-card {
    background: linear-gradient(180deg, rgba(10, 18, 34, .96), rgba(7, 13, 24, .94));
}
.inventory-layout {
    display: grid;
    grid-template-columns: 130px 1fr;
    gap: 18px;
    align-items: start;
}
.quickslots-panel,
.inventory-main {
    background: rgba(8, 16, 31, .72);
    border: 1px solid rgba(95, 140, 255, .16);
    border-radius: 18px;
    padding: 14px;
}
.inventory-panel-title,
.inventory-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
    padding: 8px 10px;
    border-radius: 12px;
    background: linear-gradient(90deg, rgba(39, 73, 147, .48), rgba(10, 21, 42, .12));
    color: #eaf1ff;
    font-weight: 700;
}
.quickslots-list {
    display: grid;
    gap: 10px;
}
.inventory-grid-slots {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 12px;
}
.quickslot-box,
.inventory-slot {
    position: relative;
    min-height: 118px;
    border-radius: 14px;
    border: 1px solid rgba(71, 116, 214, .34);
    background: radial-gradient(circle at top, rgba(31, 65, 139, .36), rgba(6, 17, 38, .98));
    box-shadow: inset 0 0 0 1px rgba(135, 170, 255, .03);
    padding: 10px;
    overflow: hidden;
}
.quickslot-box {
    min-height: 98px;
}
.inventory-slot.empty,
.quickslot-box.empty {
    opacity: .55;
}
.inventory-slot.occupied,
.quickslot-box.occupied {
    border-color: rgba(103, 150, 255, .6);
    box-shadow: inset 0 0 0 1px rgba(135,170,255,.08), 0 8px 18px rgba(0,0,0,.18);
}
.slot-number {
    position: absolute;
    top: 8px;
    left: 8px;
    min-width: 24px;
    height: 24px;
    padding: 0 6px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.09);
    color: #dce8ff;
    font-size: .78rem;
    font-weight: 700;
}
.item-badge {
    width: 52px;
    height: 52px;
    margin: 18px auto 10px;
    border-radius: 16px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, rgba(109, 92, 255, .92), rgba(95, 140, 255, .92));
    color: #fff;
    font-size: 1rem;
    font-weight: 800;
    letter-spacing: .03em;
    box-shadow: 0 12px 24px rgba(55, 95, 201, .3);
}
.quickslot-box .item-badge {
    width: 42px;
    height: 42px;
    margin-top: 16px;
    margin-bottom: 8px;
    border-radius: 14px;
}
.item-name {
    text-align: center;
    font-size: .88rem;
    font-weight: 700;
    color: #edf3ff;
    line-height: 1.2;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.item-count {
    position: absolute;
    left: 10px;
    bottom: 10px;
    color: #c9d8ff;
    font-size: .82rem;
    font-weight: 700;
}
.item-id {
    position: absolute;
    right: 10px;
    bottom: 10px;
    color: #8ea4d0;
    font-size: .7rem;
    max-width: calc(100% - 56px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
}
.slot-empty-label {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: #7187b1;
    font-size: .9rem;
}
@media (max-width: 1200px) {
    .inventory-grid-slots {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}
@media (max-width: 980px) {
    .inventory-layout {
        grid-template-columns: 1fr;
    }
    .quickslots-list {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}
@media (max-width: 720px) {
    .inventory-grid-slots,
    .quickslots-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}


/* =========================================================
   Visual V – Ingame UI Theme
   Globaler Hintergrund + Panels näher am FiveM-Screenshot
   ========================================================= */

:root {
    --bg: #090e15;
    --bg-2: #0d141d;
    --panel: rgba(13, 20, 30, .92);
    --panel-2: rgba(17, 25, 36, .94);
    --line: rgba(255,255,255,.065);
    --text: #edf2fa;
    --muted: #8e9cb3;
    --accent: #8267ff;
    --accent-2: #9a7cff;
    --green: #67d1a4;
    --orange: #c98a39;
    --red: #ee8f9f;
    --shadow: 0 22px 60px rgba(0,0,0,.34);
    --radius: 14px;
}

html {
    background: #090e15;
}

body {
    background:
        radial-gradient(circle at 92% 100%, rgba(120, 88, 255, .13), transparent 24%),
        radial-gradient(circle at 100% 0%, rgba(35, 65, 103, .09), transparent 26%),
        linear-gradient(180deg, #090e15 0%, #0b1119 48%, #0c131c 100%);
    background-attachment: fixed;
    color: var(--text);
}

/* äußere CP-Sidebar */
.sidebar {
    background:
        linear-gradient(180deg, rgba(6, 11, 18, .97), rgba(7, 12, 20, .98));
    border-right: 1px solid rgba(255,255,255,.055);
    backdrop-filter: blur(14px);
}

/* Hauptinhalt transparent über dem globalen Hintergrund */
.content {
    background:
        radial-gradient(circle at 100% 100%, rgba(124,92,255,.055), transparent 26%);
}

/* Kopfbereich nicht mehr als große blau-violette Fläche */
.page-header {
    background:
        linear-gradient(180deg, rgba(15, 22, 33, .96), rgba(11, 17, 26, .96));
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 14px;
    box-shadow: 0 14px 36px rgba(0,0,0,.24);
}

.page-header::after {
    content: "";
    position: absolute;
    inset: auto 0 0 auto;
    width: 220px;
    height: 110px;
    pointer-events: none;
    background: radial-gradient(circle at bottom right, rgba(123,92,255,.12), transparent 68%);
}

.page-header {
    position: relative;
    overflow: hidden;
}


.page-header h1 {
    color: #f2f5fb;
}

.eyebrow {
    color: #8997ad;
}

.page-badge {
    background: rgba(255,255,255,.025);
    border: 1px solid rgba(255,255,255,.07);
    color: #b6c2d4;
}

/* allgemeine Karten */
.card,
.hero-card,
.kpi-box,
.quickslots-panel,
.inventory-main {
    background:
        radial-gradient(circle at 100% 100%, rgba(123,92,255,.035), transparent 28%),
        linear-gradient(180deg, rgba(16, 24, 35, .93), rgba(12, 18, 28, .95));
    border-color: rgba(255,255,255,.065);
    box-shadow: 0 14px 34px rgba(0,0,0,.22);
    backdrop-filter: blur(8px);
}

/* Tabellen */
.table-wrap {
    background: rgba(10, 16, 25, .90);
    border-color: rgba(255,255,255,.06);
}

thead th {
    background: rgba(15, 22, 32, .98);
    color: #93a1b8;
}

tbody tr:nth-child(even) {
    background: rgba(255,255,255,.012);
}

tbody tr.highlight-row {
    background: rgba(130,103,255,.10);
}

/* Standard-Tabs und Buttons */
.tab {
    background: rgba(255,255,255,.02);
    border-color: rgba(255,255,255,.06);
    color: #bac5d8;
    border-radius: 9px;
}

.tab.active {
    background: rgba(130,103,255,.16);
    border-color: rgba(130,103,255,.27);
    color: #fff;
}

.btn {
    background: linear-gradient(180deg, #8468ff, #6d58dd);
    border-radius: 9px;
}

.btn.secondary {
    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.06);
}

/* Sidebar-Navigation näher am Ingame-Stil */
.nav-link {
    border-radius: 9px;
}

.nav-link:hover {
    background: rgba(255,255,255,.035);
}

.nav-link.active {
    background: rgba(130,103,255,.16);
    border: 1px solid rgba(130,103,255,.22);
    box-shadow: none;
}

.brand-mark {
    background: linear-gradient(135deg, #f4f6ff, #d9e0ff 55%, #8267ff);
    color: #111923;
    box-shadow: 0 10px 24px rgba(0,0,0,.24);
}

.profile-avatar {
    background: linear-gradient(180deg, #111b29, #0c1420);
    border-color: rgba(130,103,255,.30);
    width: 46px;
    height: 46px;
    min-width: 46px;
    max-width: 46px;
    overflow: hidden;
    border-radius: 50%;
}

/* Listen */
.list-row {
    border-color: rgba(255,255,255,.045);
}

/* Formularfelder */
.field input,
.field textarea,
.field select {
    background: rgba(255,255,255,.022);
    border-color: rgba(255,255,255,.065);
    border-radius: 9px;
}

.field input:focus,
.field textarea:focus,
.field select:focus {
    border-color: rgba(130,103,255,.45);
    box-shadow: 0 0 0 3px rgba(130,103,255,.08);
}

/* Login ebenfalls im gleichen Stil */
.login-card {
    background:
        radial-gradient(circle at 100% 100%, rgba(123,92,255,.08), transparent 30%),
        linear-gradient(180deg, rgba(15,22,32,.98), rgba(10,16,25,.98));
    border-color: rgba(255,255,255,.07);
    border-radius: 16px;
}

/* Footer */
.site-footer {
    color: #74849c;
}

/* dezenter globaler violetter Glow unten rechts */
.content::after {
    content: "";
    position: fixed;
    right: 0;
    bottom: 0;
    width: 420px;
    height: 260px;
    pointer-events: none;
    z-index: -1;
    background: radial-gradient(circle at bottom right, rgba(124,92,255,.10), transparent 68%);
}

@media (max-width: 980px) {
    .content::after {
        display: none;
    }
}

/* =========================================================
   Visual V – Theme System
   Auswahl wird clientseitig via localStorage gespeichert.
   ========================================================= */
html{
    --theme-bg:#090e15;
    --theme-bg-2:#0c131c;
    --theme-sidebar:#070c14;
    --theme-panel:#101823;
    --theme-panel-2:#0c121c;
    --theme-accent:#8267ff;
    --theme-accent-2:#a48cff;
    --theme-accent-rgb:130,103,255;
    --theme-text:#edf2fa;
    --theme-muted:#8e9cb3;
    --theme-border:rgba(145,126,255,.12);
}
html[data-theme="blue"]{
    --theme-bg:#06111f;
    --theme-bg-2:#091827;
    --theme-sidebar:#050d18;
    --theme-panel:#0d1b2c;
    --theme-panel-2:#091522;
    --theme-accent:#428cff;
    --theme-accent-2:#74b2ff;
    --theme-accent-rgb:66,140,255;
    --theme-text:#eff6ff;
    --theme-muted:#89a2be;
    --theme-border:rgba(88,155,255,.14);
}
html[data-theme="green"]{
    --theme-bg:#06130f;
    --theme-bg-2:#091a14;
    --theme-sidebar:#050f0c;
    --theme-panel:#0d1d17;
    --theme-panel-2:#091611;
    --theme-accent:#43c98a;
    --theme-accent-2:#72e3ac;
    --theme-accent-rgb:67,201,138;
    --theme-text:#effbf5;
    --theme-muted:#8ba99b;
    --theme-border:rgba(75,207,147,.14);
}
html[data-theme="red"]{
    --theme-bg:#14070b;
    --theme-bg-2:#1c0a10;
    --theme-sidebar:#0f0508;
    --theme-panel:#211016;
    --theme-panel-2:#170b0f;
    --theme-accent:#e4516d;
    --theme-accent-2:#f17a91;
    --theme-accent-rgb:228,81,109;
    --theme-text:#fff1f4;
    --theme-muted:#b19aa0;
    --theme-border:rgba(232,88,115,.15);
}
html[data-theme="orange"]{
    --theme-bg:#140d05;
    --theme-bg-2:#1b1208;
    --theme-sidebar:#0f0a04;
    --theme-panel:#21170d;
    --theme-panel-2:#171006;
    --theme-accent:#e99a3e;
    --theme-accent-2:#ffc06a;
    --theme-accent-rgb:233,154,62;
    --theme-text:#fff7eb;
    --theme-muted:#ad9e86;
    --theme-border:rgba(239,164,75,.15);
}
html[data-theme="cyan"]{
    --theme-bg:#051318;
    --theme-bg-2:#071c22;
    --theme-sidebar:#040f13;
    --theme-panel:#0b2027;
    --theme-panel-2:#07171d;
    --theme-accent:#38c7dc;
    --theme-accent-2:#68e5f4;
    --theme-accent-rgb:56,199,220;
    --theme-text:#effdff;
    --theme-muted:#86aab0;
    --theme-border:rgba(68,208,226,.15);
}
html[data-theme="magenta"]{
    --theme-bg:#130716;
    --theme-bg-2:#1a0a1f;
    --theme-sidebar:#0e0511;
    --theme-panel:#211027;
    --theme-panel-2:#170b1b;
    --theme-accent:#d74ed9;
    --theme-accent-2:#ef79f0;
    --theme-accent-rgb:215,78,217;
    --theme-text:#fff1ff;
    --theme-muted:#ad96b2;
    --theme-border:rgba(220,91,222,.15);
}
html[data-theme="graphite"]{
    --theme-bg:#0a0c0f;
    --theme-bg-2:#11151a;
    --theme-sidebar:#07090c;
    --theme-panel:#151a20;
    --theme-panel-2:#0e1217;
    --theme-accent:#8fa1b7;
    --theme-accent-2:#bdc9d7;
    --theme-accent-rgb:143,161,183;
    --theme-text:#f1f4f7;
    --theme-muted:#8d98a6;
    --theme-border:rgba(168,182,198,.12);
}
html[data-theme="royal"]{
    --theme-bg:#090a19;
    --theme-bg-2:#0d1024;
    --theme-sidebar:#070814;
    --theme-panel:#12162d;
    --theme-panel-2:#0d1020;
    --theme-accent:#6278ff;
    --theme-accent-2:#91a0ff;
    --theme-accent-rgb:98,120,255;
    --theme-text:#f2f4ff;
    --theme-muted:#929bb8;
    --theme-border:rgba(111,131,255,.15);
}

html[data-theme] body{
    color:var(--theme-text)!important;
    background:
        radial-gradient(circle at 92% 100%, rgba(var(--theme-accent-rgb),.11), transparent 24%),
        linear-gradient(180deg,var(--theme-bg) 0%,var(--theme-bg-2) 100%)!important;
}
html[data-theme] .sidebar{
    background:linear-gradient(180deg,var(--theme-sidebar),color-mix(in srgb,var(--theme-sidebar) 92%,#000 8%))!important;
    border-color:var(--theme-border)!important;
}
html[data-theme] .content{
    background:radial-gradient(circle at 100% 100%,rgba(var(--theme-accent-rgb),.045),transparent 26%)!important;
}
html[data-theme] .page-header,
html[data-theme] .card,
html[data-theme] .panel,
html[data-theme] .hero-card,
html[data-theme] .kpi-box,
html[data-theme] .quickslots-panel,
html[data-theme] .inventory-main,
html[data-theme] .table-wrap{
    background:linear-gradient(180deg,var(--theme-panel),var(--theme-panel-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .page-header::after,
html[data-theme] .content::after{
    background:radial-gradient(circle at bottom right,rgba(var(--theme-accent-rgb),.13),transparent 68%)!important;
}
html[data-theme] .nav-link{color:color-mix(in srgb,var(--theme-text) 84%,var(--theme-muted) 16%)!important}
html[data-theme] .nav-link:hover{background:rgba(var(--theme-accent-rgb),.08)!important;color:var(--theme-text)!important}
html[data-theme] .nav-link.active{
    background:rgba(var(--theme-accent-rgb),.16)!important;
    border-color:rgba(var(--theme-accent-rgb),.25)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .eyebrow,
html[data-theme] .muted,
html[data-theme] .profile-meta small,
html[data-theme] .site-footer{color:var(--theme-muted)!important}
html[data-theme] .tab.active,
html[data-theme] .btn:not(.secondary){
    background:rgba(var(--theme-accent-rgb),.18)!important;
    border-color:rgba(var(--theme-accent-rgb),.32)!important;
    color:var(--theme-text)!important;
}
html[data-theme] input:focus,
html[data-theme] select:focus,
html[data-theme] textarea:focus{
    border-color:rgba(var(--theme-accent-rgb),.48)!important;
    box-shadow:0 0 0 3px rgba(var(--theme-accent-rgb),.09)!important;
}
html[data-theme] .profile-avatar{border-color:rgba(var(--theme-accent-rgb),.35)!important}
html[data-theme] .theme-picker{
    background:color-mix(in srgb,var(--theme-panel) 88%,transparent)!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .theme-picker select{
    background:var(--theme-panel-2)!important;
    color:var(--theme-text)!important;
    border-color:var(--theme-border)!important;
}

/* helle Variante benötigt stärkere Text-/Flächenanpassungen */

.theme-picker{
    margin:0 0 10px;
    padding:10px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:10px;
    background:rgba(255,255,255,.018);
}
.theme-picker-label{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin-bottom:7px;
    font-size:.66rem;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
    color:var(--muted);
}
.theme-picker select{
    width:100%;
    padding:8px 9px;
    border-radius:8px;
    border:1px solid rgba(255,255,255,.07);
    background:#0c131d;
    color:#edf2fa;
    outline:none;
    font:inherit;
    font-size:.76rem;
}

/* Kompakte Theme-Auswahl in der Profilkarte */
.profile-card--theme{position:relative;padding-right:52px!important}
.profile-theme-button{
    margin-left:auto;
    width:34px;height:34px;flex:0 0 34px;
    display:grid;place-items:center;
    border-radius:9px;
    border:1px solid rgba(255,255,255,.07);
    background:rgba(255,255,255,.025);
    color:#eef3fb;
    cursor:pointer;
    font-size:.95rem;
    transition:.16s ease;
}
.profile-theme-button:hover,
.profile-theme-button[aria-expanded="true"]{
    background:rgba(var(--theme-accent-rgb,130,103,255),.12);
    border-color:rgba(var(--theme-accent-rgb,130,103,255),.25);
    transform:translateY(-1px);
}
.theme-popover[hidden]{display:none!important}
.theme-popover{
    position:absolute;
    left:8px;right:8px;
    bottom:calc(100% + 8px);
    z-index:50;
    padding:9px;
    border-radius:11px;
    border:1px solid var(--theme-border,rgba(255,255,255,.07));
    background:var(--theme-panel,#101823);
    box-shadow:0 18px 45px rgba(0,0,0,.38);
}
.theme-popover-title{
    padding:2px 4px 7px;
    color:var(--theme-muted,#8d9bb1);
    font-size:.64rem;font-weight:800;
    letter-spacing:.07em;text-transform:uppercase;
}
.theme-choice{
    width:100%;
    display:flex;align-items:center;gap:9px;
    padding:8px 9px;
    border:0;border-radius:8px;
    background:transparent;
    color:var(--theme-text,#eef3fb);
    font:inherit;font-size:.75rem;
    cursor:pointer;text-align:left;
}
.theme-choice:hover{background:rgba(var(--theme-accent-rgb,130,103,255),.08)}
.theme-choice.active{background:rgba(var(--theme-accent-rgb,130,103,255),.14);font-weight:700}
.theme-dot{width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.06)}
.theme-dot--default{background:#8267ff}.theme-dot--blue{background:#428cff}.theme-dot--green{background:#43c98a}.theme-dot--red{background:#e4516d}.theme-dot--orange{background:#e99a3e}.theme-dot--cyan{background:#38c7dc}.theme-dot--magenta{background:#d74ed9}.theme-dot--graphite{background:#8fa1b7}.theme-dot--royal{background:#6278ff}

/* =========================================================
   Visual V – Theme depth overrides
   Färbt auch Innenkarten / Detailboxen mit dem aktiven Theme
   ========================================================= */
html[data-theme] .dashboard-hero:not(.dashboard-hero-modern),
html[data-theme] .dashboard-card,
html[data-theme] .dashboard-stat-card,
html[data-theme] .dashboard-mini-card,
html[data-theme] .dashboard-license,
html[data-theme] .dashboard-skill-card,
html[data-theme] .dashboard-job-card,
html[data-theme] .dashboard-status-mini,
html[data-theme] .dashboard-info-grid .dashboard-info-row,
html[data-theme] .dashboard-datetime,
html[data-theme] .dashboard-empty{
    background:linear-gradient(
        180deg,
        color-mix(in srgb,var(--theme-panel) 92%,var(--theme-accent) 8%),
        color-mix(in srgb,var(--theme-panel-2) 95%,var(--theme-accent) 5%)
    )!important;
    border-color:color-mix(in srgb,var(--theme-border) 70%,var(--theme-accent) 30%)!important;
    color:var(--theme-text)!important;
}

html[data-theme] .dashboard-stat-card,
html[data-theme] .dashboard-mini-card{
    box-shadow:inset 0 0 0 1px rgba(var(--theme-accent-rgb),.025)!important;
}

html[data-theme] .dashboard-stat-icon,
html[data-theme] .dashboard-mini-icon,
html[data-theme] .dashboard-skill-icon,
html[data-theme] .dashboard-job-icon,
html[data-theme] .dashboard-license-icon{
    background:rgba(var(--theme-accent-rgb),.11)!important;
    border-color:rgba(var(--theme-accent-rgb),.18)!important;
    color:var(--theme-accent-2)!important;
}

html[data-theme] .dashboard-stat-card.cash,
html[data-theme] .dashboard-stat-card.bank,
html[data-theme] .dashboard-stat-card.level,
html[data-theme] .dashboard-stat-card.playtime,
html[data-theme] .dashboard-stat-card.assets,
html[data-theme] .dashboard-stat-card.vip,
html[data-theme] .dashboard-mini-card.job,
html[data-theme] .dashboard-mini-card.faction,
html[data-theme] .dashboard-mini-card.family,
html[data-theme] .dashboard-mini-card.vipstatus,
html[data-theme] .dashboard-mini-card.investments,
html[data-theme] .dashboard-mini-card.blackmoney{
    border-color:rgba(var(--theme-accent-rgb),.20)!important;
    background:linear-gradient(
        180deg,
        color-mix(in srgb,var(--theme-panel) 90%,var(--theme-accent) 10%),
        color-mix(in srgb,var(--theme-panel-2) 96%,var(--theme-accent) 4%)
    )!important;
}

html[data-theme] .dashboard-stat-label,
html[data-theme] .dashboard-mini-label,
html[data-theme] .dashboard-section-sub,
html[data-theme] .dashboard-info-label,
html[data-theme] .dashboard-license-state,
html[data-theme] .dashboard-job-name small,
html[data-theme] .dashboard-status-meta,
html[data-theme] .dashboard-skill-value,
html[data-theme] .dashboard-stat-sub,
html[data-theme] .dashboard-mini-sub,
html[data-theme] .dashboard-progress-foot,
html[data-theme] .dashboard-datetime small{
    color:var(--theme-muted)!important;
}

html[data-theme] .dashboard-stat-value,
html[data-theme] .dashboard-mini-value,
html[data-theme] .dashboard-section-title,
html[data-theme] .dashboard-info-value,
html[data-theme] .dashboard-license-name,
html[data-theme] .dashboard-skill-name,
html[data-theme] .dashboard-job-name strong,
html[data-theme] .dashboard-progress-head,
html[data-theme] .dashboard-datetime strong{
    color:var(--theme-text)!important;
}

html[data-theme] .dashboard-progress-track{
    background:rgba(var(--theme-accent-rgb),.10)!important;
}
html[data-theme] .dashboard-progress-track.exp > span,
html[data-theme] .dashboard-skill-card .dashboard-progress-track > span{
    background:linear-gradient(90deg,var(--theme-accent),var(--theme-accent-2))!important;
}

html[data-theme] .dashboard-job-level,
html[data-theme] .dashboard-role-pill{
    background:rgba(var(--theme-accent-rgb),.14)!important;
    color:var(--theme-accent-2)!important;
    border-color:rgba(var(--theme-accent-rgb),.18)!important;
}

html[data-theme] .dashboard-license::before{
    background:var(--theme-accent)!important;
}
html[data-theme] .dashboard-license.ok::before{
    background:color-mix(in srgb,#69d0a8 58%,var(--theme-accent) 42%)!important;
}
html[data-theme] .dashboard-license.no::before{
    background:color-mix(in srgb,#d06f86 58%,var(--theme-accent) 42%)!important;
}

/* Allgemeine Innenflächen auf den anderen Seiten */
html[data-theme] .stat,
html[data-theme] .stat-box,
html[data-theme] .info-box,
html[data-theme] .info-card,
html[data-theme] .metric-card,
html[data-theme] .summary-card,
html[data-theme] .mini-card,
html[data-theme] .list-card,
html[data-theme] .vehicle-row,
html[data-theme] .vehicle-card,
html[data-theme] .house-card,
html[data-theme] .business-card,
html[data-theme] .leaderboard-card,
html[data-theme] .leader-row,
html[data-theme] .market-card,
html[data-theme] .inventory-slot,
html[data-theme] .inventory-card{
    background:linear-gradient(
        180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%)
    )!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
}

html[data-theme] table td,
html[data-theme] table th{
    border-color:color-mix(in srgb,var(--theme-border) 82%,var(--theme-accent) 18%)!important;
}
html[data-theme] tbody tr:hover{
    background:rgba(var(--theme-accent-rgb),.055)!important;
}

/* Light Theme – Innenflächen bleiben wirklich hell */
html[data-theme="light"] .dashboard-hero,
html[data-theme="light"] .dashboard-card,
html[data-theme="light"] .dashboard-stat-card,
html[data-theme="light"] .dashboard-mini-card,
html[data-theme="light"] .dashboard-license,
html[data-theme="light"] .dashboard-skill-card,
html[data-theme="light"] .dashboard-job-card,
html[data-theme="light"] .dashboard-status-mini,
html[data-theme="light"] .dashboard-info-grid .dashboard-info-row,
html[data-theme="light"] .dashboard-datetime{
    box-shadow:0 8px 24px rgba(31,45,66,.055)!important;
}

/* Theme menu – mehr Presets */
.theme-popover{max-height:390px;overflow-y:auto;scrollbar-width:thin}
.theme-choice{min-height:36px}
.theme-choice .theme-dot{flex:0 0 11px}

/* =========================================================
   Visual V – Theme System V4 / Vollständige Variablen-Brücke
   Alle Seiten-spezifischen Farbvariablen folgen dem Theme.
   ========================================================= */
html[data-theme]{
    /* globale Legacy-Variablen */
    --bg:var(--theme-bg)!important;
    --bg-2:var(--theme-bg-2)!important;
    --panel:var(--theme-panel)!important;
    --panel-2:var(--theme-panel-2)!important;
    --line:var(--theme-border)!important;
    --text:var(--theme-text)!important;
    --muted:var(--theme-muted)!important;
    --accent:var(--theme-accent)!important;
    --accent-2:var(--theme-accent-2)!important;
    --purple:var(--theme-accent)!important;
    --soft:color-mix(in srgb,var(--theme-panel) 92%,var(--theme-accent) 8%)!important;
    --border:var(--theme-border)!important;

    /* Dashboard */
    --dash-bg:var(--theme-bg)!important;
    --dash-panel:var(--theme-panel)!important;
    --dash-panel-soft:color-mix(in srgb,var(--theme-panel) 90%,var(--theme-accent) 10%)!important;
    --dash-border:var(--theme-border)!important;
    --dash-border-soft:color-mix(in srgb,var(--theme-border) 70%,transparent 30%)!important;
    --dash-text:var(--theme-text)!important;
    --dash-muted:var(--theme-muted)!important;
    --dash-purple:var(--theme-accent)!important;
    --dash-purple-2:var(--theme-accent-2)!important;
    --dash-blue:var(--theme-accent)!important;
    --dash-cyan:var(--theme-accent-2)!important;

    /* Finanzen */
    --fin-bg:var(--theme-bg)!important;
    --fin-panel:var(--theme-panel)!important;
    --fin-panel-2:var(--theme-panel-2)!important;
    --fin-border:var(--theme-border)!important;
    --fin-border-soft:color-mix(in srgb,var(--theme-border) 72%,transparent 28%)!important;
    --fin-text:var(--theme-text)!important;
    --fin-muted:var(--theme-muted)!important;
    --fin-purple:var(--theme-accent)!important;
    --fin-purple-2:var(--theme-accent-2)!important;

    /* Unternehmen */
    --biz-soft:color-mix(in srgb,var(--theme-panel) 92%,var(--theme-accent) 8%)!important;
    --biz-border:var(--theme-border)!important;
    --biz-text:var(--theme-text)!important;
    --biz-muted:var(--theme-muted)!important;
    --biz-purple:var(--theme-accent)!important;

    /* Bestenliste */
    --lb-soft:color-mix(in srgb,var(--theme-panel) 92%,var(--theme-accent) 8%)!important;
    --lb-border:var(--theme-border)!important;
    --lb-text:var(--theme-text)!important;
    --lb-muted:var(--theme-muted)!important;
    --lb-purple:var(--theme-accent)!important;
}

/* Header und Sidebar komplett themefähig */
html[data-theme] .page-header{
    background:linear-gradient(135deg,
        color-mix(in srgb,var(--theme-panel) 82%,var(--theme-accent) 18%),
        color-mix(in srgb,var(--theme-panel-2) 90%,var(--theme-accent) 10%))!important;
    border-color:rgba(var(--theme-accent-rgb),.20)!important;
}

html[data-theme] .page-badge,
html[data-theme] .profile-card,
html[data-theme] .profile-theme-button,
html[data-theme] .logout-link:hover{
    background:rgba(var(--theme-accent-rgb),.055)!important;
    border-color:rgba(var(--theme-accent-rgb),.14)!important;
}
html[data-theme] .nav-label{color:color-mix(in srgb,var(--theme-text) 70%,var(--theme-muted) 30%)!important}
html[data-theme] .sidebar-footer,
html[data-theme] .profile-card{border-color:var(--theme-border)!important}

/* Allgemeine Inputs / Controls */
html[data-theme] input,
html[data-theme] select,
html[data-theme] textarea,
html[data-theme] .input,
html[data-theme] .search-input,
html[data-theme] .vehicle-search,
html[data-theme] .finance-filter,
html[data-theme] .market-filter{
    background:color-mix(in srgb,var(--theme-panel-2) 92%,var(--theme-accent) 8%)!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] input::placeholder,
html[data-theme] textarea::placeholder{color:color-mix(in srgb,var(--theme-muted) 84%,transparent 16%)!important}

/* Fahrzeuge */
html[data-theme] .vehicle-list-table,
html[data-theme] .vehicle-list-head,
html[data-theme] .vehicle-row,
html[data-theme] .vehicle-row-thumb,
html[data-theme] .vehicle-detail-box,
html[data-theme] .vehicle-modal-panel,
html[data-theme] .vehicle-tab,
html[data-theme] .vehicle-tab-panel,
html[data-theme] .tuning-entry,
html[data-theme] .storage-slot,
html[data-theme] .key-entry,
html[data-theme] .vehicle-empty,
html[data-theme] .vehicle-search-empty{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 74%,var(--theme-accent) 26%)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .vehicle-row:hover,
html[data-theme] .vehicle-tab:hover,
html[data-theme] .vehicle-tab.active{
    background:color-mix(in srgb,var(--theme-panel) 84%,var(--theme-accent) 16%)!important;
    border-color:rgba(var(--theme-accent-rgb),.30)!important;
}
html[data-theme] .vehicle-row-tags span,
html[data-theme] .vehicle-page-tab.active,
html[data-theme] .vehicle-tab.active{
    background:rgba(var(--theme-accent-rgb),.13)!important;
    border-color:rgba(var(--theme-accent-rgb),.23)!important;
    color:var(--theme-accent-2)!important;
}
html[data-theme] .vehicle-row-name strong,
html[data-theme] .vehicle-row-cell strong,
html[data-theme] .vehicle-modal-title{color:var(--theme-text)!important}
html[data-theme] .vehicle-row-title>small,
html[data-theme] .vehicle-row-cell>span:not(.pill),
html[data-theme] .vehicle-row-cell small,
html[data-theme] .vehicle-search-icon,
html[data-theme] .vehicle-click-hint{color:var(--theme-muted)!important}

/* Finanzen */
html[data-theme] .finance-section,
html[data-theme] .finance-mini,
html[data-theme] .finance-log,
html[data-theme] .finance-account-pill,
html[data-theme] .finance-filter,
html[data-theme] .finance-card{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
}
html[data-theme] .finance-type-chip,
html[data-theme] .finance-account-pill.active{
    background:rgba(var(--theme-accent-rgb),.12)!important;
    border-color:rgba(var(--theme-accent-rgb),.22)!important;
    color:var(--theme-accent-2)!important;
}

/* Häuser */
html[data-theme] .house-page-panel,
html[data-theme] .house-card,
html[data-theme] .house-simple-card,
html[data-theme] .house-detail-box,
html[data-theme] .house-stat,
html[data-theme] .house-access-row,
html[data-theme] .house-build-stat,
html[data-theme] .house-build-phase-box,
html[data-theme] .house-build-material-row,
html[data-theme] .house-empty,
html[data-theme] .house-tab-panel{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .house-tab.active,
html[data-theme] .house-tab:hover{
    background:rgba(var(--theme-accent-rgb),.14)!important;
    border-color:rgba(var(--theme-accent-rgb),.25)!important;
    color:var(--theme-text)!important;
}

/* Unternehmen */
html[data-theme] .biz-kpi,
html[data-theme] .biz-section,
html[data-theme] .biz-card-stat,
html[data-theme] .biz-access,
html[data-theme] .biz-storage-row,
html[data-theme] .biz-price-row,
html[data-theme] .biz-empty,
html[data-theme] .biz-tab-panel,
html[data-theme] .business-tab,
html[data-theme] .business-card{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .business-tab.active,
html[data-theme] .biz-modal-tab.active,
html[data-theme] .business-tab:hover{
    background:rgba(var(--theme-accent-rgb),.14)!important;
    border-color:rgba(var(--theme-accent-rgb),.25)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .biz-bar>span{background:linear-gradient(90deg,var(--theme-accent),var(--theme-accent-2))!important}

/* Offices */
html[data-theme] .office-card,
html[data-theme] .office-panel,
html[data-theme] .office-kpi,
html[data-theme] .office-stat-kpi,
html[data-theme] .office-info,
html[data-theme] .office-perm,
html[data-theme] .office-empty{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .office-tab.active,
html[data-theme] .office-tab:hover{
    background:rgba(var(--theme-accent-rgb),.14)!important;
    border-color:rgba(var(--theme-accent-rgb),.25)!important;
    color:var(--theme-text)!important;
}

/* Inventar */
html[data-theme] .inv-panel,
html[data-theme] .inv-slot,
html[data-theme] .inv-storage-pill,
html[data-theme] .inv-storage-grid,
html[data-theme] .inventory-slot,
html[data-theme] .inventory-card{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .inv-tab.active,
html[data-theme] .inv-subtab.active,
html[data-theme] .inv-tab:hover,
html[data-theme] .inv-subtab:hover{
    background:rgba(var(--theme-accent-rgb),.14)!important;
    border-color:rgba(var(--theme-accent-rgb),.25)!important;
    color:var(--theme-text)!important;
}

/* Bestenliste */
html[data-theme] .lb-highlight,
html[data-theme] .lb-category-trigger,
html[data-theme] .lb-category-dropdown,
html[data-theme] .lb-category-dropdown a,
html[data-theme] .leaderboard-card,
html[data-theme] .leader-row{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .lb-category-menu.active .lb-category-trigger,
html[data-theme] .lb-category-trigger:hover,
html[data-theme] .lb-category-dropdown a:hover,
html[data-theme] .lb-category-dropdown a.active{
    background:rgba(var(--theme-accent-rgb),.16)!important;
    border-color:rgba(var(--theme-accent-rgb),.28)!important;
    color:var(--theme-text)!important;
}

/* Markt */
html[data-theme] .market-table,
html[data-theme] .market-item,
html[data-theme] .market-kpi,
html[data-theme] .market-empty,
html[data-theme] .market-card{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .market-tab.active,
html[data-theme] .market-tab:hover,
html[data-theme] .market-badge{
    background:rgba(var(--theme-accent-rgb),.14)!important;
    border-color:rgba(var(--theme-accent-rgb),.25)!important;
    color:var(--theme-text)!important;
}

/* Seltene Fahrzeuge */
html[data-theme] .rare-card,
html[data-theme] .rare-vehicle-card,
html[data-theme] .rare-filter,
html[data-theme] .rare-stat{
    background:linear-gradient(180deg,
        color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%),
        color-mix(in srgb,var(--theme-panel-2) 97%,var(--theme-accent) 3%))!important;
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
    color:var(--theme-text)!important;
}

/* Restliche generische Innenflächen */
html[data-theme] .list-row,
html[data-theme] .stat-chip,
html[data-theme] .empty-state,
html[data-theme] .pill:not(.good):not(.bad):not(.warn),
html[data-theme] .storage-grid,
html[data-theme] .quickslots-panel{
    border-color:color-mix(in srgb,var(--theme-border) 76%,var(--theme-accent) 24%)!important;
}
html[data-theme] .stat-chip,
html[data-theme] .pill:not(.good):not(.bad):not(.warn){
    background:rgba(var(--theme-accent-rgb),.12)!important;
    color:var(--theme-accent-2)!important;
}

/* Texte innerhalb thematisierter Flächen */
html[data-theme] .vehicle-row-title>small,
html[data-theme] .house-sub,
html[data-theme] .office-card-head p,
html[data-theme] .biz-section-head p,
html[data-theme] .market-date,
html[data-theme] .lb-highlight-label,
html[data-theme] .lb-highlight-sub,
html[data-theme] .inv-panel-title small{
    color:var(--theme-muted)!important;
}

/* ======================================================================
   VISUAL-V THEME CORE V5
   Zentrale Design-Tokens + Vollabdeckung aller bestehenden CP-Komponenten.
   Neue Seiten sollen ausschließlich diese Tokens verwenden.
   ====================================================================== */
html[data-theme]{
    --theme-surface:color-mix(in srgb,var(--theme-panel) 94%,var(--theme-accent) 6%);
    --theme-surface-2:color-mix(in srgb,var(--theme-panel-2) 95%,var(--theme-accent) 5%);
    --theme-surface-3:color-mix(in srgb,var(--theme-panel) 86%,var(--theme-accent) 14%);
    --theme-surface-hover:color-mix(in srgb,var(--theme-panel) 80%,var(--theme-accent) 20%);
    --theme-input:color-mix(in srgb,var(--theme-panel-2) 90%,var(--theme-accent) 10%);
    --theme-border-strong:rgba(var(--theme-accent-rgb),.28);
    --theme-border-soft:color-mix(in srgb,var(--theme-border) 80%,transparent 20%);
    --theme-accent-soft:rgba(var(--theme-accent-rgb),.10);
    --theme-accent-soft-2:rgba(var(--theme-accent-rgb),.16);
    --theme-accent-soft-3:rgba(var(--theme-accent-rgb),.23);
    --theme-shadow:0 16px 38px rgba(0,0,0,.24);
    --theme-shadow-strong:0 24px 60px rgba(0,0,0,.40);

    /* Legacy/global aliases */
    --bg:var(--theme-bg);
    --bg-2:var(--theme-bg-2);
    --panel:var(--theme-surface);
    --panel-2:var(--theme-surface-2);
    --line:var(--theme-border);
    --border:var(--theme-border);
    --text:var(--theme-text);
    --muted:var(--theme-muted);
    --accent:var(--theme-accent);
    --accent-2:var(--theme-accent-2);
    --purple:var(--theme-accent);
    --soft:var(--theme-accent-soft);

    /* Dashboard aliases */
    --dash-bg:var(--theme-bg);
    --dash-panel:var(--theme-surface);
    --dash-panel-soft:var(--theme-surface-2);
    --dash-border:var(--theme-border);
    --dash-border-soft:var(--theme-border-soft);
    --dash-text:var(--theme-text);
    --dash-muted:var(--theme-muted);
    --dash-purple:var(--theme-accent);
    --dash-purple-2:var(--theme-accent-2);
    --dash-blue:var(--theme-accent-2);
    --dash-cyan:var(--theme-accent-2);

    /* Finances aliases */
    --fin-bg:var(--theme-bg);
    --fin-panel:var(--theme-surface);
    --fin-panel-2:var(--theme-surface-2);
    --fin-border:var(--theme-border);
    --fin-border-soft:var(--theme-border-soft);
    --fin-text:var(--theme-text);
    --fin-muted:var(--theme-muted);
    --fin-purple:var(--theme-accent);
    --fin-purple-2:var(--theme-accent-2);

    /* Business aliases */
    --biz-border:var(--theme-border);
    --biz-muted:var(--theme-muted);
    --biz-purple:var(--theme-accent);
    --biz-soft:var(--theme-surface-2);
    --biz-text:var(--theme-text);

    /* Leaderboard aliases */
    --lb-border:var(--theme-border);
    --lb-muted:var(--theme-muted);
    --lb-purple:var(--theme-accent);
    --lb-soft:var(--theme-surface-2);
    --lb-text:var(--theme-text);
}

/* Grundgerüst */
html[data-theme] body{
    background:
        radial-gradient(circle at 96% 0%,rgba(var(--theme-accent-rgb),.13),transparent 27%),
        linear-gradient(180deg,var(--theme-bg),var(--theme-bg-2))!important;
    color:var(--theme-text)!important;
}
html[data-theme] .sidebar{background:var(--theme-sidebar)!important;border-color:var(--theme-border)!important}
html[data-theme] .content{color:var(--theme-text)!important}
html[data-theme] .page-header,
html[data-theme] .dashboard-hero{
    background:linear-gradient(135deg,var(--theme-surface),color-mix(in srgb,var(--theme-surface-2) 82%,var(--theme-accent) 18%))!important;
    border-color:var(--theme-border-strong)!important;
    box-shadow:var(--theme-shadow)!important;
}
html[data-theme] .page-header h1,
html[data-theme] .dashboard-hero h2,
html[data-theme] .brand-copy strong,
html[data-theme] .profile-meta strong{color:var(--theme-text)!important}
html[data-theme] .eyebrow,
html[data-theme] .dashboard-eyebrow,
html[data-theme] .brand-copy small,
html[data-theme] .profile-meta small{color:var(--theme-muted)!important}
html[data-theme] .page-badge{background:var(--theme-accent-soft)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}

/* Sidebar vollständig */
html[data-theme] .nav-label{color:color-mix(in srgb,var(--theme-muted) 82%,var(--theme-text) 18%)!important}
html[data-theme] .nav-link{color:color-mix(in srgb,var(--theme-text) 86%,var(--theme-muted) 14%)!important}
html[data-theme] .nav-link:hover{background:var(--theme-accent-soft)!important;color:var(--theme-text)!important}
html[data-theme] .nav-link.active{background:linear-gradient(135deg,var(--theme-accent),var(--theme-accent-2))!important;color:#fff!important;box-shadow:0 10px 26px rgba(var(--theme-accent-rgb),.22)!important}
html[data-theme] .profile-card,
html[data-theme] .sidebar-footer{border-color:var(--theme-border)!important}
html[data-theme] .profile-avatar{background:var(--theme-surface-2)!important;border-color:var(--theme-border-strong)!important}
html[data-theme] .logout-link{color:var(--theme-text)!important}
html[data-theme] .logout-link:hover{background:var(--theme-accent-soft)!important}
html[data-theme] .theme-profile-button{background:var(--theme-accent-soft)!important;border-color:var(--theme-border)!important;color:var(--theme-accent-2)!important}
html[data-theme] .theme-popover{background:var(--theme-surface)!important;border-color:var(--theme-border-strong)!important;box-shadow:var(--theme-shadow-strong)!important}
html[data-theme] .theme-choice{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important;color:var(--theme-text)!important}
html[data-theme] .theme-choice:hover,
html[data-theme] .theme-choice.active{background:var(--theme-surface-hover)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}

/* Globale Standard-Komponenten */
html[data-theme] .card,
html[data-theme] .panel,
html[data-theme] .hero-card,
html[data-theme] .metric-card{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
    box-shadow:var(--theme-shadow)!important;
}
html[data-theme] .list-row{border-color:var(--theme-border-soft)!important}
html[data-theme] .stat-chip{background:var(--theme-accent-soft)!important;border-color:var(--theme-border)!important;color:var(--theme-accent-2)!important}
html[data-theme] .muted,
html[data-theme] .section-title p{color:var(--theme-muted)!important}

/* Controls komplett */
html[data-theme] input:not([type="checkbox"]):not([type="radio"]),
html[data-theme] select,
html[data-theme] textarea,
html[data-theme] .input,
html[data-theme] .search-input,
html[data-theme] .vehicle-search,
html[data-theme] .finance-search,
html[data-theme] .finance-filter,
html[data-theme] .office-finance-search,
html[data-theme] .inv-search,
html[data-theme] .market-search,
html[data-theme] .market-filter,
html[data-theme] .rare-search{
    background:var(--theme-input)!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
    box-shadow:none!important;
}
html[data-theme] input:focus,
html[data-theme] select:focus,
html[data-theme] textarea:focus{
    border-color:var(--theme-border-strong)!important;
    box-shadow:0 0 0 3px rgba(var(--theme-accent-rgb),.10)!important;
    outline:none!important;
}
html[data-theme] input::placeholder,
html[data-theme] textarea::placeholder{color:var(--theme-muted)!important}
html[data-theme] button:not(.good):not(.bad):not(.warn),
html[data-theme] .btn:not(.good):not(.bad):not(.warn){border-color:var(--theme-border)!important}

/* Dashboard - jede Innenfläche */
html[data-theme] .dashboard-card,
html[data-theme] .dashboard-stat-card,
html[data-theme] .dashboard-mini-card,
html[data-theme] .dashboard-info-row,
html[data-theme] .dashboard-status-mini,
html[data-theme] .dashboard-license,
html[data-theme] .dashboard-skill-card,
html[data-theme] .dashboard-job-card,
html[data-theme] .dashboard-datetime{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    box-shadow:none!important;
}
html[data-theme] .dashboard-stat-card:hover,
html[data-theme] .dashboard-mini-card:hover,
html[data-theme] .dashboard-info-row:hover,
html[data-theme] .dashboard-license:hover,
html[data-theme] .dashboard-skill-card:hover,
html[data-theme] .dashboard-job-card:hover{background:var(--theme-surface-3)!important;border-color:var(--theme-border-strong)!important}
html[data-theme] .dashboard-stat-icon,
html[data-theme] .dashboard-mini-icon,
html[data-theme] .dashboard-license-icon,
html[data-theme] .dashboard-skill-icon,
html[data-theme] .dashboard-job-icon,
html[data-theme] .dashboard-role-pill,
html[data-theme] .dashboard-job-level{
    background:var(--theme-accent-soft)!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-accent-2)!important;
}
html[data-theme] .dashboard-stat-label,
html[data-theme] .dashboard-mini-label,
html[data-theme] .dashboard-stat-sub,
html[data-theme] .dashboard-mini-sub,
html[data-theme] .dashboard-info-label,
html[data-theme] .dashboard-section-sub,
html[data-theme] .dashboard-status-meta,
html[data-theme] .dashboard-skill-value,
html[data-theme] .dashboard-job-name small,
html[data-theme] .dashboard-progress-foot{color:var(--theme-muted)!important}
html[data-theme] .dashboard-stat-value,
html[data-theme] .dashboard-mini-value,
html[data-theme] .dashboard-info-value,
html[data-theme] .dashboard-section-title,
html[data-theme] .dashboard-license-name,
html[data-theme] .dashboard-skill-name,
html[data-theme] .dashboard-job-name strong,
html[data-theme] .dashboard-progress-head{color:var(--theme-text)!important}
html[data-theme] .dashboard-progress-track{background:color-mix(in srgb,var(--theme-panel-2) 82%,var(--theme-accent) 18%)!important}
html[data-theme] .dashboard-progress-track.exp span,
html[data-theme] .dashboard-skill-card .dashboard-progress-track span{background:linear-gradient(90deg,var(--theme-accent),var(--theme-accent-2))!important}
html[data-theme] .dashboard-license::before{background:var(--theme-accent)!important}

/* Fahrzeuge - Seite, Tabelle, Modals, Lager, Tuning */
html[data-theme] .vehicle-page-panel,
html[data-theme] .vehicle-list-table,
html[data-theme] .vehicle-list-head,
html[data-theme] .vehicle-row,
html[data-theme] .vehicle-row-thumb,
html[data-theme] .vehicle-detail-box,
html[data-theme] .vehicle-modal-panel,
html[data-theme] .vehicle-modal-header,
html[data-theme] .vehicle-tab,
html[data-theme] .vehicle-tab-panel,
html[data-theme] .tuning-entry,
html[data-theme] .storage-slot,
html[data-theme] .key-entry,
html[data-theme] .vehicle-empty,
html[data-theme] .vehicle-search-empty{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .vehicle-row:hover,
html[data-theme] .vehicle-page-tab:hover,
html[data-theme] .vehicle-page-tab.active,
html[data-theme] .vehicle-tab:hover,
html[data-theme] .vehicle-tab.active,
html[data-theme] .tuning-entry:hover,
html[data-theme] .storage-slot:hover{background:var(--theme-surface-hover)!important;border-color:var(--theme-border-strong)!important}
html[data-theme] .vehicle-page-tab.active,
html[data-theme] .vehicle-tab.active,
html[data-theme] .vehicle-row-tags span,
html[data-theme] .tuning-badge{
    background:var(--theme-accent-soft-2)!important;
    border-color:var(--theme-border-strong)!important;
    color:var(--theme-accent-2)!important;
}
html[data-theme] .vehicle-modal{background:rgba(0,0,0,.68)!important}
html[data-theme] .vehicle-row-name strong,
html[data-theme] .vehicle-row-cell strong,
html[data-theme] .vehicle-modal-title,
html[data-theme] .vehicle-detail-box strong{color:var(--theme-text)!important}
html[data-theme] .vehicle-row-title>small,
html[data-theme] .vehicle-row-cell>span:not(.pill),
html[data-theme] .vehicle-row-cell small,
html[data-theme] .vehicle-search-icon,
html[data-theme] .vehicle-click-hint,
html[data-theme] .vehicle-detail-box small{color:var(--theme-muted)!important}

/* Finanzen */
html[data-theme] .finance-balance-card,
html[data-theme] .finance-section,
html[data-theme] .finance-mini,
html[data-theme] .finance-log,
html[data-theme] .finance-account-pill,
html[data-theme] .finance-card,
html[data-theme] .finance-log-list{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .finance-type-chip,
html[data-theme] .finance-account-pill.active{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-accent-2)!important}
html[data-theme] .finance-section:hover,
html[data-theme] .finance-log:hover{background:var(--theme-surface-3)!important}

/* Häuser vollständig */
html[data-theme] .house-page-panel,
html[data-theme] .house-card,
html[data-theme] .house-simple-card,
html[data-theme] .house-build-card,
html[data-theme] .house-detail-box,
html[data-theme] .house-stat,
html[data-theme] .house-access-row,
html[data-theme] .house-build-stat,
html[data-theme] .house-build-phase-box,
html[data-theme] .house-build-material-row,
html[data-theme] .house-build-logistics-box,
html[data-theme] .house-build-logistics-row,
html[data-theme] .house-storage-slot,
html[data-theme] .house-empty,
html[data-theme] .house-tab-panel,
html[data-theme] .house-modal-panel,
html[data-theme] .house-modal-hero{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .house-page-tab,
html[data-theme] .house-tab{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important;color:var(--theme-muted)!important}
html[data-theme] .house-page-tab.active,
html[data-theme] .house-page-tab:hover,
html[data-theme] .house-tab.active,
html[data-theme] .house-tab:hover{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}
html[data-theme] .house-modal{background:rgba(0,0,0,.68)!important}
html[data-theme] .house-section-label,
html[data-theme] .house-sub{color:var(--theme-muted)!important}

/* Unternehmen vollständig */
html[data-theme] .biz-summary-card,
html[data-theme] .biz-card,
html[data-theme] .biz-kpi,
html[data-theme] .biz-section,
html[data-theme] .biz-card-stat,
html[data-theme] .biz-access,
html[data-theme] .biz-storage-row,
html[data-theme] .biz-price-row,
html[data-theme] .biz-customer-row,
html[data-theme] .biz-employee-row,
html[data-theme] .biz-delivery-row,
html[data-theme] .biz-empty,
html[data-theme] .biz-tab-panel,
html[data-theme] .biz-modal-panel,
html[data-theme] .biz-modal-hero,
html[data-theme] .business-tab,
html[data-theme] .business-card{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .business-tab.active,
html[data-theme] .business-tab:hover,
html[data-theme] .biz-modal-tab.active,
html[data-theme] .biz-modal-tab:hover{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}
html[data-theme] .biz-modal{background:rgba(0,0,0,.68)!important}
html[data-theme] .biz-bar{background:var(--theme-surface-2)!important}
html[data-theme] .biz-bar>span{background:linear-gradient(90deg,var(--theme-accent),var(--theme-accent-2))!important}
html[data-theme] .biz-section-head p,
html[data-theme] .biz-card-head p{color:var(--theme-muted)!important}

/* Offices vollständig */
html[data-theme] .office-card,
html[data-theme] .office-panel,
html[data-theme] .office-kpi,
html[data-theme] .office-stat-kpi,
html[data-theme] .office-info,
html[data-theme] .office-perm,
html[data-theme] .office-row,
html[data-theme] .office-run-row,
html[data-theme] .office-rank-row,
html[data-theme] .office-investment-card,
html[data-theme] .office-vehicle-card,
html[data-theme] .office-upgrade-item,
html[data-theme] .office-finance-table,
html[data-theme] .office-empty{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .office-tab{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important;color:var(--theme-muted)!important}
html[data-theme] .office-tab.active,
html[data-theme] .office-tab:hover{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}
html[data-theme] .office-card-head p,
html[data-theme] .office-eyebrow{color:var(--theme-muted)!important}

/* Inventar vollständig */
html[data-theme] .inv-panel,
html[data-theme] .inv-slot,
html[data-theme] .inv-storage-pill,
html[data-theme] .inv-storage-grid,
html[data-theme] .inventory-slot,
html[data-theme] .inventory-card,
html[data-theme] .empty-slot{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .inv-slot:hover,
html[data-theme] .inventory-slot:hover{background:var(--theme-surface-hover)!important;border-color:var(--theme-border-strong)!important}
html[data-theme] .inv-tab,
html[data-theme] .inv-subtab{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important;color:var(--theme-muted)!important}
html[data-theme] .inv-tab.active,
html[data-theme] .inv-subtab.active,
html[data-theme] .inv-tab:hover,
html[data-theme] .inv-subtab:hover{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}
html[data-theme] .inv-panel-title small{color:var(--theme-muted)!important}

/* Bestenliste vollständig */
html[data-theme] .lb-highlight,
html[data-theme] .lb-category-trigger,
html[data-theme] .lb-category-dropdown,
html[data-theme] .lb-category-dropdown a,
html[data-theme] .lb-category-item,
html[data-theme] .lb-player-card,
html[data-theme] .lb-podium-card,
html[data-theme] .lb-table-card,
html[data-theme] .lb-table-wrap,
html[data-theme] .lb-table,
html[data-theme] .leaderboard-card,
html[data-theme] .leader-row{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .lb-category-menu.active .lb-category-trigger,
html[data-theme] .lb-category-trigger:hover,
html[data-theme] .lb-category-dropdown a:hover,
html[data-theme] .lb-category-dropdown a.active,
html[data-theme] .lb-category-item.active,
html[data-theme] .lb-category-item:hover{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}
html[data-theme] .lb-podium-badge,
html[data-theme] .lb-rank-badge{background:var(--theme-accent-soft)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-accent-2)!important}
html[data-theme] .lb-highlight-label,
html[data-theme] .lb-highlight-sub{color:var(--theme-muted)!important}

/* Markt vollständig */
html[data-theme] .market-table,
html[data-theme] .market-table-wrap,
html[data-theme] .market-group-row,
html[data-theme] .market-item,
html[data-theme] .market-kpi,
html[data-theme] .market-detail-box,
html[data-theme] .market-detail-row,
html[data-theme] .market-detail-table,
html[data-theme] .market-empty,
html[data-theme] .market-card{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .market-group-row:hover,
html[data-theme] .market-item:hover{background:var(--theme-surface-hover)!important;border-color:var(--theme-border-strong)!important}
html[data-theme] .market-tab{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important;color:var(--theme-muted)!important}
html[data-theme] .market-tab.active,
html[data-theme] .market-tab:hover,
html[data-theme] .market-badge{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}
html[data-theme] .market-date{color:var(--theme-muted)!important}

/* Seltene Fahrzeuge vollständig */
html[data-theme] .rare-card,
html[data-theme] .rare-vehicle-card,
html[data-theme] .rare-filter,
html[data-theme] .rare-stat{
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .rare-card:hover,
html[data-theme] .rare-vehicle-card:hover{background:var(--theme-surface-hover)!important;border-color:var(--theme-border-strong)!important}

/* Dialoge, generische Overlays, Tabellen und leere Zustände */
html[data-theme] .empty-state,
html[data-theme] .storage-grid,
html[data-theme] .quickslots-panel,
html[data-theme] table,
html[data-theme] thead,
html[data-theme] tbody,
html[data-theme] tr,
html[data-theme] td,
html[data-theme] th{border-color:var(--theme-border-soft)!important}
html[data-theme] th{color:var(--theme-muted)!important}
html[data-theme] td{color:var(--theme-text)!important}
html[data-theme] tr:hover td{background:rgba(var(--theme-accent-rgb),.045)}

/* Neutrale Badges/Pills ziehen Theme mit. Semantische good/bad/warn bleiben bewusst erhalten. */
html[data-theme] .pill:not(.good):not(.bad):not(.warn),
html[data-theme] .badge:not(.good):not(.bad):not(.warn),
html[data-theme] .chip:not(.good):not(.bad):not(.warn){background:var(--theme-accent-soft)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-accent-2)!important}

/* Akzent-Pseudoelemente und Fortschrittsanzeigen */
html[data-theme] [class*="progress"]>span:not(.good):not(.bad):not(.warn),
html[data-theme] [class*="bar"]>span:not(.good):not(.bad):not(.warn){background:linear-gradient(90deg,var(--theme-accent),var(--theme-accent-2))}
html[data-theme] .dashboard-stat-card::before,
html[data-theme] .dashboard-mini-card::before,
html[data-theme] .office-card::before,
html[data-theme] .biz-card::before{background:var(--theme-accent)!important}

/* Scrollbars */
html[data-theme] *{scrollbar-color:rgba(var(--theme-accent-rgb),.45) var(--theme-panel-2)}
html[data-theme] *::-webkit-scrollbar-track{background:var(--theme-panel-2)}
html[data-theme] *::-webkit-scrollbar-thumb{background:rgba(var(--theme-accent-rgb),.42);border-radius:999px}
html[data-theme] *::-webkit-scrollbar-thumb:hover{background:rgba(var(--theme-accent-rgb),.62)}

/* ======================================================================
   VISUAL-V THEME CORE V6 – STRICT FULL COVERAGE
   Final layer: all structural surfaces use theme tokens.
   Semantic success/warning/error colors intentionally remain semantic.
   ====================================================================== */
html[data-theme="halloween"]{
    --theme-bg:#06060d;
    --theme-bg-2:#0c0910;
    --theme-sidebar:#08070c;
    --theme-panel:#131019;
    --theme-panel-2:#0d0a12;
    --theme-accent:#ff8c2e;
    --theme-accent-2:#ffc06b;
    --theme-accent-rgb:255,140,46;
    --theme-text:#f9f1e8;
    --theme-muted:#b2a295;
    --theme-border:rgba(255,140,46,.18);
}
html[data-theme="halloween"] body{
    background:
        radial-gradient(circle at 100% 0%,rgba(255,140,46,.14),transparent 24%),
        radial-gradient(circle at 0% 100%,rgba(151,82,255,.12),transparent 28%),
        radial-gradient(circle at 50% 14%,rgba(255,190,98,.06),transparent 18%),
        linear-gradient(180deg,#06060d 0%,#0b0910 52%,#140b0d 100%)!important;
}
html[data-theme="halloween"] .sidebar{
    background:
        linear-gradient(180deg,rgba(10,8,13,.98),rgba(8,7,11,.98)),
        url('assets/empty.svg') center bottom/cover no-repeat!important;
    border-color:rgba(255,140,46,.14)!important;
}
html[data-theme="halloween"] .content{
    background:
        radial-gradient(circle at 100% 100%,rgba(255,140,46,.05),transparent 28%),
        radial-gradient(circle at 0% 0%,rgba(156,84,255,.05),transparent 22%)!important;
}
html[data-theme="halloween"] .page-header,
html[data-theme="halloween"] .dashboard-hero,
html[data-theme="halloween"] .lb-head{
    background:
        linear-gradient(135deg,rgba(20,14,21,.96),rgba(29,16,17,.96))!important;
    border-color:rgba(255,140,46,.22)!important;
    box-shadow:0 16px 40px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.02)!important;
}
html[data-theme="halloween"] .nav-link:hover{
    background:rgba(255,140,46,.08)!important;
    color:#fff6eb!important;
}
html[data-theme="halloween"] .nav-link.active{
    background:linear-gradient(135deg,#8f3516,#ca5f1d 55%,#ff9836)!important;
    border-color:rgba(255,140,46,.34)!important;
    color:#fff5ea!important;
    box-shadow:0 10px 24px rgba(255,140,46,.18)!important;
}
html[data-theme="halloween"] :is(.tab.active,.inv-tab.active,.inv-subtab.active,.market-tab.active,.vehicle-tab.active,.house-tab.active,.office-tab.active){
    background:linear-gradient(135deg,rgba(255,140,46,.18),rgba(137,73,190,.14))!important;
    border-color:rgba(255,140,46,.28)!important;
    color:#ffdcb9!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.02)!important;
}
html[data-theme="halloween"] :is(.dashboard-card,.dashboard-stat-card,.dashboard-mini-card,.dashboard-license,.dashboard-skill-card,.dashboard-job-card,.dashboard-status-mini,.dashboard-info-grid .dashboard-info-row,.dashboard-datetime,.dashboard-empty,.vehicle-row,.vehicle-card,.rare-card,.market-card,.office-summary-card,.office-stat-card,.inventory-slot,.slot,.item-slot,.item-card,.table-wrap table tbody tr:hover td){
    background:
        linear-gradient(180deg,rgba(18,14,23,.96),rgba(12,10,16,.96))!important;
    border-color:rgba(255,140,46,.14)!important;
}
html[data-theme="halloween"] :is(.inventory-slot,.slot,.item-slot,.item-card){
    box-shadow:inset 0 1px 0 rgba(255,255,255,.02),0 0 0 1px rgba(255,140,46,.035)!important;
}
html[data-theme="halloween"] :is(.dashboard-job-icon,.dashboard-skill-icon,.dashboard-status-mini-icon,.license-icon,.profile-theme-button){
    background:linear-gradient(135deg,rgba(255,140,46,.16),rgba(132,73,180,.13))!important;
    border-color:rgba(255,140,46,.18)!important;
}
html[data-theme="halloween"] :is(.dashboard-skill-track > span,.dashboard-progress-fill,.progress-fill,.bar-fill){
    box-shadow:0 0 12px rgba(255,140,46,.16)!important;
}
html[data-theme="halloween"] :is(input,select,textarea,.search-input){
    background:rgba(10,8,12,.74)!important;
    border-color:rgba(255,140,46,.14)!important;
    color:var(--theme-text)!important;
}
html[data-theme="halloween"] :is(input:focus,select:focus,textarea:focus,.search-input:focus){
    border-color:rgba(255,140,46,.38)!important;
    box-shadow:0 0 0 3px rgba(255,140,46,.10)!important;
}
html[data-theme="halloween"] .theme-dot--halloween{
    box-shadow:0 0 0 2px rgba(255,140,46,.18),0 0 14px rgba(255,140,46,.22)!important;
}
.theme-dot--halloween{background:linear-gradient(135deg,#612478 0 34%,#121015 34% 60%,#ff8c2e 60% 100%)!important}

/* ======================================================================
   VISUAL-V THEME CORE V8 – FREIE FARBAUSWAHL
   Normale Themes werden aus einer einzigen Benutzerfarbe abgeleitet.
   Spezialthemes (z. B. Halloween) bleiben eigenständig.
   ====================================================================== */
html[data-theme="custom"]{
    --theme-accent:var(--user-accent,#8267ff);
    --theme-accent-2:color-mix(in srgb,var(--user-accent,#8267ff) 68%,#ffffff 32%);
    --theme-bg:color-mix(in srgb,#05080d 93%,var(--user-accent,#8267ff) 7%);
    --theme-bg-2:color-mix(in srgb,#09101a 89%,var(--user-accent,#8267ff) 11%);
    --theme-sidebar:color-mix(in srgb,#05090f 94%,var(--user-accent,#8267ff) 6%);
    --theme-panel:color-mix(in srgb,#101720 88%,var(--user-accent,#8267ff) 12%);
    --theme-panel-2:color-mix(in srgb,#0a1119 91%,var(--user-accent,#8267ff) 9%);
    --theme-text:#eef3fa;
    --theme-muted:color-mix(in srgb,#8290a4 88%,var(--user-accent,#8267ff) 12%);
    --theme-border:color-mix(in srgb,rgba(255,255,255,.07) 58%,var(--user-accent,#8267ff) 42%);
}

.theme-color-card{
    padding:10px;
    margin-bottom:8px;
    border:1px solid var(--theme-border);
    border-radius:10px;
    background:var(--theme-surface-2);
}
.theme-color-head,
.theme-color-value-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:9px;
}
.theme-color-head{
    color:var(--theme-text);
    font-size:.76rem;
    font-weight:700;
}
.theme-color-value-row{margin-top:9px}
.theme-color-picker{
    width:38px!important;
    height:28px!important;
    min-width:38px!important;
    padding:2px!important;
    border:1px solid var(--theme-border-strong)!important;
    border-radius:7px!important;
    background:var(--theme-surface)!important;
    cursor:pointer;
}
.theme-color-picker::-webkit-color-swatch-wrapper{padding:1px}
.theme-color-picker::-webkit-color-swatch{border:0;border-radius:5px}
.theme-color-picker::-moz-color-swatch{border:0;border-radius:5px}
.theme-color-hex{
    width:92px!important;
    min-width:0!important;
    height:30px!important;
    padding:0 8px!important;
    border-radius:7px!important;
    font-size:.72rem!important;
    font-family:ui-monospace,SFMono-Regular,Consolas,monospace!important;
    text-transform:uppercase;
}
.theme-reset-button{
    height:30px;
    padding:0 9px;
    border-radius:7px;
    border:1px solid var(--theme-border)!important;
    background:var(--theme-surface)!important;
    color:var(--theme-muted)!important;
    font-size:.67rem;
    cursor:pointer;
}
.theme-reset-button:hover{
    color:var(--theme-text)!important;
    border-color:var(--theme-border-strong)!important;
    background:var(--theme-surface-hover)!important;
}
.theme-popover-subtitle{
    padding:6px 3px 5px;
    color:var(--theme-muted);
    font-size:.62rem;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
}
.theme-dot--custom{background:var(--user-accent,#8267ff)}
.theme-choice--custom .theme-dot{box-shadow:0 0 0 2px rgba(var(--theme-accent-rgb),.18),0 0 9px rgba(var(--theme-accent-rgb),.28)}


/* ======================================================================
   VISUAL-V THEME CORE V9 – NEUTRALE DARK BASE + FREIE AKZENTFARBE
   Die Benutzerfarbe ist nur Akzent. Normale Flächen bleiben neutral dunkel.
   ====================================================================== */

html[data-theme="custom"]{
    /* neutrale Basis – unabhängig von der gewählten Farbe */
    --theme-bg:#070b11;
    --theme-bg-2:#0a1018;
    --theme-sidebar:#070a10;
    --theme-panel:#10161f;
    --theme-panel-2:#0c121a;
    --theme-text:#eef3fa;
    --theme-muted:#8793a3;

    /* neutrale Flächen */
    --theme-surface:#111821;
    --theme-surface-2:#0d141c;
    --theme-surface-3:#151d27;
    --theme-surface-hover:#18222e;
    --theme-input:#0c131c;

    /* normale Rahmen neutral; Akzent nur gezielt */
    --theme-border:rgba(255,255,255,.075);
    --theme-border-soft:rgba(255,255,255,.055);
    --theme-border-strong:rgba(var(--theme-accent-rgb),.30);

    --theme-accent:var(--user-accent,#8267ff);
    --theme-accent-2:color-mix(in srgb,var(--user-accent,#8267ff) 72%,#fff 28%);
    --theme-accent-soft:rgba(var(--theme-accent-rgb),.08);
    --theme-accent-soft-2:rgba(var(--theme-accent-rgb),.13);
    --theme-accent-soft-3:rgba(var(--theme-accent-rgb),.19);

    --theme-shadow:0 14px 34px rgba(0,0,0,.28);
    --theme-shadow-strong:0 24px 60px rgba(0,0,0,.46);

    /* lokale Aliase ebenfalls neutral halten */
    --panel:var(--theme-surface);
    --panel-2:var(--theme-surface-2);
    --dash-panel:var(--theme-surface);
    --dash-panel-soft:var(--theme-surface-2);
    --fin-panel:var(--theme-surface);
    --fin-panel-2:var(--theme-surface-2);
    --biz-panel:var(--theme-surface);
    --biz-panel-2:var(--theme-surface-2);
    --lb-panel:var(--theme-surface);
    --lb-panel-2:var(--theme-surface-2);
}

html[data-theme="custom"] body{
    background:
        radial-gradient(circle at 86% 3%,rgba(var(--theme-accent-rgb),.025),transparent 28%),
        linear-gradient(180deg,var(--theme-bg),var(--theme-bg-2))!important;
}

/* Grundflächen */
html[data-theme="custom"] :is(
    .sidebar,.sidebar-footer,.profile-card,.logout-link,
    .page-header,.dashboard-hero,
    .card,.panel,.section-card,.stat-card,.kpi-card,.metric-card,
    .dashboard-card,.dashboard-section,.dash-card,.dash-panel,
    .finance-card,.finance-panel,.finance-section,
    .biz-card,.biz-panel,.biz-section,
    .office-card,.office-panel,
    .house-card,.house-panel,
    .vehicle-card,.vehicle-panel,
    .lb-card,.lb-panel,.lb-highlight,
    .rare-card,.rare-body,
    .market-stat,.market-table-wrap,.market-detail-box,
    .inv-frame,.inv-body,.inv-slot,.inv-quick-slot,.inv-shoulder,
    .modal,.modal-content,.vehicle-modal,.biz-modal,.house-modal
){
    background:var(--theme-surface)!important;
    border-color:var(--theme-border)!important;
    box-shadow:var(--theme-shadow)!important;
}

/* Sekundäre Innenflächen */
html[data-theme="custom"] :is(
    .profile-card,.sidebar-footer,
    .stat-item,.info-row,.character-row,.character-field,
    .license-card,.boost-card,.status-card,.progress-card,
    .vehicle-row,.vehicle-detail-box,.vehicle-storage,.vehicle-storage-slot,
    .biz-summary-item,.biz-stat,.biz-storage-card,
    .office-stat,.office-row,
    .house-detail,.house-info,.house-stat,
    .lb-row,.lb-rank-row,.lb-podium-card,
    .market-table tbody td,.market-group-row td,.market-detail-row td,
    .inv-slot,.inv-quick-slot,.inv-shoulder,.inv-hotbar-slot,
    input,select,textarea,.search-input
){
    background:var(--theme-surface-2)!important;
    border-color:var(--theme-border)!important;
}

/* Header-/Leistenflächen bewusst neutral */
html[data-theme="custom"] :is(
    .page-header,.dashboard-hero,
    .inv-head,.inv-panel-title,
    .vehicle-list-head,.vehicle-modal-header,
    .biz-modal-head,.biz-summary,
    .office-card-head,.office-panel-head,
    .finance-card-head,.finance-section-head,
    .house-modal-hero,.house-panel-head,
    .lb-head,
    .market-table thead,.market-table thead tr,.market-table thead th,
    .lb-table thead,.lb-table thead tr,.lb-table thead th,
    table thead th
){
    background:var(--theme-surface-3)!important;
    border-color:var(--theme-border)!important;
    box-shadow:none!important;
}

/* Inventar komplett neutral */
html[data-theme="custom"] .inv-frame{
    background:var(--theme-surface)!important;
}
html[data-theme="custom"] .inv-head{
    background:var(--theme-surface-3)!important;
}
html[data-theme="custom"] .inv-body{
    background:var(--theme-surface)!important;
}
html[data-theme="custom"] :is(.inv-slot,.inv-quick-slot,.inv-hotbar-slot,.inv-shoulder){
    background:var(--theme-surface-2)!important;
    border-color:var(--theme-border)!important;
}
html[data-theme="custom"] :is(.inv-slot:hover,.inv-quick-slot:hover,.inv-hotbar-slot:hover,.inv-shoulder:hover){
    background:var(--theme-surface-hover)!important;
    border-color:rgba(var(--theme-accent-rgb),.24)!important;
}
html[data-theme="custom"] .inv-shoulder.occupied{
    background:var(--theme-surface-2)!important;
}

/* Fahrzeug-/Unternehmens-/Haus-Modals: neutral, aktive Tabs Akzent */
html[data-theme="custom"] :is(.vehicle-modal,.biz-modal,.house-modal,.modal-content){
    background:var(--theme-surface)!important;
}
html[data-theme="custom"] :is(.vehicle-modal-header,.biz-modal-head,.house-modal-hero){
    background:var(--theme-surface-3)!important;
}
html[data-theme="custom"] :is(
    .vehicle-storage-slot,.vehicle-trunk-slot,.vehicle-glove-slot,
    .biz-storage-slot,.house-storage-slot
){
    background:var(--theme-surface-2)!important;
    border-color:var(--theme-border)!important;
}

/* Bestenliste: Header, Podium und Tabelle neutral */
html[data-theme="custom"] .lb-head{
    background:var(--theme-surface-3)!important;
}
html[data-theme="custom"] :is(.lb-highlight,.lb-podium-card,.lb-rank-row,.lb-table tbody tr){
    background:var(--theme-surface-2)!important;
    border-color:var(--theme-border)!important;
}
html[data-theme="custom"] .lb-table tbody tr:hover td{
    background:var(--theme-surface-hover)!important;
}

/* Seltene Fahrzeuge */
html[data-theme="custom"] .rare-card{
    background:var(--theme-surface)!important;
    border-color:var(--theme-border)!important;
}
html[data-theme="custom"] .rare-image{
    background:var(--theme-surface-3)!important;
}
html[data-theme="custom"] .rare-body{
    background:var(--theme-surface-2)!important;
}

/* Marktübersicht */
html[data-theme="custom"] :is(.market-table thead,.market-table thead tr,.market-table thead th){
    background:var(--theme-surface-3)!important;
}
html[data-theme="custom"] :is(.market-table tbody tr,.market-table tbody td,.market-group-row td,.market-detail-row td){
    background:var(--theme-surface-2)!important;
    border-color:var(--theme-border)!important;
}
html[data-theme="custom"] .market-table tbody tr:hover td,
html[data-theme="custom"] .market-group-row:hover td{
    background:var(--theme-surface-hover)!important;
}

/* Dashboard: Karten neutral, Farbe nur als feines Signal */
html[data-theme="custom"] :is(
    .dashboard-card,.dash-card,.kpi-card,.stat-card,
    .character-field,.license-card,.boost-card,.status-card
){
    background:var(--theme-surface)!important;
    border-color:var(--theme-border)!important;
}
html[data-theme="custom"] :is(
    .dashboard-card:hover,.dash-card:hover,.kpi-card:hover,.stat-card:hover,
    .license-card:hover
){
    border-color:rgba(var(--theme-accent-rgb),.20)!important;
    box-shadow:0 12px 28px rgba(0,0,0,.28),0 0 0 1px rgba(var(--theme-accent-rgb),.035)!important;
}

/* Freie Farbe nur bei interaktiven/aktiven Elementen */
html[data-theme="custom"] :is(
    .nav-link.active,
    .tab.active,.inv-tab.active,.inv-subtab.active,.market-tab.active,
    .vehicle-tab.active,.house-tab.active,.office-tab.active,
    .theme-choice.active
){
    background:linear-gradient(135deg,
        color-mix(in srgb,var(--theme-accent) 84%,#fff 0%),
        color-mix(in srgb,var(--theme-accent) 72%,#000 28%))!important;
    border-color:rgba(var(--theme-accent-rgb),.34)!important;
    color:#fff!important;
    box-shadow:0 8px 22px rgba(var(--theme-accent-rgb),.16)!important;
}

html[data-theme="custom"] :is(
    .nav-link:not(.active):hover,
    .tab:not(.active):hover,.inv-tab:not(.active):hover,.inv-subtab:not(.active):hover,
    .market-tab:not(.active):hover,.vehicle-tab:not(.active):hover,
    .house-tab:not(.active):hover,.office-tab:not(.active):hover
){
    background:var(--theme-accent-soft)!important;
    border-color:rgba(var(--theme-accent-rgb),.16)!important;
}

/* Inputs nur beim Fokus farbig */
html[data-theme="custom"] :is(input,select,textarea,.search-input){
    color:var(--theme-text)!important;
    outline:none!important;
}
html[data-theme="custom"] :is(input,select,textarea,.search-input):focus{
    border-color:rgba(var(--theme-accent-rgb),.42)!important;
    box-shadow:0 0 0 3px rgba(var(--theme-accent-rgb),.08)!important;
}

/* Akzentierte Kleinteile */
html[data-theme="custom"] :is(
    .eyebrow,.theme-popover-title,
    .inv-brand-icon,.inv-hotkey,.inv-count
){
    color:var(--theme-accent-2)!important;
}
html[data-theme="custom"] :is(.inv-brand-icon,.inv-hotkey,.inv-count){
    background:var(--theme-accent-soft)!important;
    border-color:rgba(var(--theme-accent-rgb),.18)!important;
}

/* Progress-/Balken-Hintergrund neutral. Vorhandene semantische Füllfarben bleiben bestehen. */
html[data-theme="custom"] :is(.progress,.progress-track,.inv-bar){
    background:#202936!important;
}
html[data-theme="custom"] .inv-bar span{
    background:linear-gradient(90deg,var(--theme-accent),var(--theme-accent-2))!important;
}

/* Sidebar-Footer soll kein farbiger Block sein */
html[data-theme="custom"] .sidebar-footer{
    background:#080d14!important;
    border-color:rgba(255,255,255,.06)!important;
}
html[data-theme="custom"] .profile-card{
    background:#0d131c!important;
    border-color:rgba(255,255,255,.065)!important;
}
html[data-theme="custom"] .logout-link{
    background:#080d14!important;
}
html[data-theme="custom"] .profile-theme-button{
    background:var(--theme-accent-soft)!important;
    border-color:rgba(var(--theme-accent-rgb),.20)!important;
}

/* Nur sehr dezenter Akzent an normalen Flächen */
html[data-theme="custom"] :is(
    .page-header,.dashboard-hero,.inv-frame,.vehicle-modal,.biz-modal,.house-modal,
    .lb-head,.market-table-wrap
){
    box-shadow:var(--theme-shadow),inset 0 1px 0 rgba(255,255,255,.015)!important;
}

/* Scrollbar neutral mit Akzent am Thumb */
html[data-theme="custom"] *{
    scrollbar-color:rgba(var(--theme-accent-rgb),.40) #0b1119;
}
html[data-theme="custom"] *::-webkit-scrollbar-track{
    background:#0b1119!important;
}
html[data-theme="custom"] *::-webkit-scrollbar-thumb{
    background:rgba(var(--theme-accent-rgb),.38)!important;
    border:2px solid #0b1119!important;
}


/* ======================================================================
   VISUAL-V THEME CORE V10 – FULL COLOR DEPTH
   Die Benutzerfarbe beeinflusst das komplette UI abgestuft,
   ohne alle Flächen in denselben Vollton zu tauchen.
   ====================================================================== */

html[data-theme="custom"]{
    /* Gesamthintergrund: sehr dezent eingefärbt */
    --theme-bg:color-mix(in srgb,#05080d 94%,var(--theme-accent) 6%);
    --theme-bg-2:color-mix(in srgb,#08101a 91%,var(--theme-accent) 9%);
    --theme-sidebar:color-mix(in srgb,#060910 92%,var(--theme-accent) 8%);

    /* Flächenhierarchie – jede Ebene mit eigener Farbstärke */
    --theme-panel:color-mix(in srgb,#101720 86%,var(--theme-accent) 14%);
    --theme-panel-2:color-mix(in srgb,#0b121a 90%,var(--theme-accent) 10%);
    --theme-surface:color-mix(in srgb,#111821 84%,var(--theme-accent) 16%);
    --theme-surface-2:color-mix(in srgb,#0d141c 89%,var(--theme-accent) 11%);
    --theme-surface-3:color-mix(in srgb,#151d27 79%,var(--theme-accent) 21%);
    --theme-surface-hover:color-mix(in srgb,#18222e 72%,var(--theme-accent) 28%);
    --theme-input:color-mix(in srgb,#0c131c 87%,var(--theme-accent) 13%);

    /* Rahmen jetzt ebenfalls sichtbar thematisiert */
    --theme-border:rgba(var(--theme-accent-rgb),.16);
    --theme-border-soft:rgba(var(--theme-accent-rgb),.10);
    --theme-border-strong:rgba(var(--theme-accent-rgb),.34);

    --theme-accent-soft:rgba(var(--theme-accent-rgb),.10);
    --theme-accent-soft-2:rgba(var(--theme-accent-rgb),.16);
    --theme-accent-soft-3:rgba(var(--theme-accent-rgb),.23);

    --theme-text:#eef3fa;
    --theme-muted:color-mix(in srgb,#8995a5 88%,var(--theme-accent) 12%);
}

/* Gesamter Seitenhintergrund */
html[data-theme="custom"] body{
    background:
        radial-gradient(circle at 86% 4%,rgba(var(--theme-accent-rgb),.09),transparent 28%),
        radial-gradient(circle at 12% 92%,rgba(var(--theme-accent-rgb),.055),transparent 30%),
        linear-gradient(180deg,var(--theme-bg),var(--theme-bg-2))!important;
}

/* Sidebar deutlich, aber dunkler als Inhalt */
html[data-theme="custom"] .sidebar{
    background:
        linear-gradient(180deg,
            color-mix(in srgb,#060910 91%,var(--theme-accent) 9%),
            color-mix(in srgb,#05080d 95%,var(--theme-accent) 5%))!important;
    border-right-color:rgba(var(--theme-accent-rgb),.12)!important;
}
html[data-theme="custom"] .sidebar-footer{
    background:color-mix(in srgb,#080d14 91%,var(--theme-accent) 9%)!important;
    border-color:rgba(var(--theme-accent-rgb),.12)!important;
}
html[data-theme="custom"] .profile-card{
    background:color-mix(in srgb,#0d131c 86%,var(--theme-accent) 14%)!important;
    border-color:rgba(var(--theme-accent-rgb),.16)!important;
}
html[data-theme="custom"] .logout-link{
    background:color-mix(in srgb,#080d14 93%,var(--theme-accent) 7%)!important;
}

/* Große Seiten-Header bekommen sichtbaren Theme-Charakter */
html[data-theme="custom"] :is(.page-header,.dashboard-hero,.lb-head){
    background:
        linear-gradient(135deg,
            color-mix(in srgb,#151c25 77%,var(--theme-accent) 23%),
            color-mix(in srgb,#0f151d 87%,var(--theme-accent) 13%))!important;
    border-color:rgba(var(--theme-accent-rgb),.22)!important;
}


/* Hauptkarten */
html[data-theme="custom"] :is(
    .dashboard-card,.dash-card,.kpi-card,.stat-card,.metric-card,
    .finance-card,.finance-panel,.finance-section,
    .biz-card,.biz-panel,.biz-section,
    .office-card,.office-panel,
    .house-card,.house-panel,
    .vehicle-card,.vehicle-panel,
    .lb-card,.lb-panel,.lb-highlight,
    .market-stat,.market-table-wrap,.market-detail-box,
    .rare-card,
    .inv-frame,
    .modal,.modal-content,.vehicle-modal,.biz-modal,.house-modal
){
    background:
        linear-gradient(180deg,
            color-mix(in srgb,#121922 83%,var(--theme-accent) 17%),
            color-mix(in srgb,#0d141c 90%,var(--theme-accent) 10%))!important;
    border-color:rgba(var(--theme-accent-rgb),.15)!important;
}

/* Innenkarten: etwas schwächer, damit Hierarchie bleibt */
html[data-theme="custom"] :is(
    .stat-item,.info-row,.character-row,.character-field,
    .license-card,.boost-card,.status-card,.progress-card,
    .vehicle-row,.vehicle-detail-box,.vehicle-storage,
    .biz-summary-item,.biz-stat,.biz-storage-card,
    .office-stat,.office-row,
    .house-detail,.house-info,.house-stat,
    .lb-row,.lb-rank-row,.lb-podium-card,
    .rare-body,
    .market-table tbody td,.market-group-row td,.market-detail-row td,
    .inv-slot,.inv-quick-slot,.inv-hotbar-slot,.inv-shoulder,
    .vehicle-storage-slot,.vehicle-trunk-slot,.vehicle-glove-slot,
    .biz-storage-slot,.house-storage-slot
){
    background:color-mix(in srgb,#0d141c 87%,var(--theme-accent) 13%)!important;
    border-color:rgba(var(--theme-accent-rgb),.13)!important;
}

/* Sekundäre Header/Leisten */
html[data-theme="custom"] :is(
    .inv-head,.inv-panel-title,
    .vehicle-list-head,.vehicle-modal-header,
    .biz-modal-head,.biz-summary,
    .office-card-head,.office-panel-head,
    .finance-card-head,.finance-section-head,
    .house-modal-hero,.house-panel-head,
    .market-table thead,.market-table thead tr,.market-table thead th,
    .lb-table thead,.lb-table thead tr,.lb-table thead th,
    table thead th
){
    background:color-mix(in srgb,#151d27 76%,var(--theme-accent) 24%)!important;
    border-color:rgba(var(--theme-accent-rgb),.18)!important;
}

/* Inventar: Hintergrund, Slots und Schultertier sichtbar thematisieren */
html[data-theme="custom"] .inv-frame{
    background:
        linear-gradient(180deg,
            color-mix(in srgb,#101821 82%,var(--theme-accent) 18%),
            color-mix(in srgb,#0a1118 90%,var(--theme-accent) 10%))!important;
}
html[data-theme="custom"] .inv-body{
    background:color-mix(in srgb,#0a1118 91%,var(--theme-accent) 9%)!important;
}
html[data-theme="custom"] :is(.inv-slot,.inv-quick-slot,.inv-hotbar-slot,.inv-shoulder){
    background:
        linear-gradient(180deg,
            color-mix(in srgb,#101720 84%,var(--theme-accent) 16%),
            color-mix(in srgb,#0b121a 91%,var(--theme-accent) 9%))!important;
    border-color:rgba(var(--theme-accent-rgb),.14)!important;
}
html[data-theme="custom"] :is(.inv-slot:hover,.inv-quick-slot:hover,.inv-hotbar-slot:hover,.inv-shoulder:hover){
    background:color-mix(in srgb,#18222e 67%,var(--theme-accent) 33%)!important;
    border-color:rgba(var(--theme-accent-rgb),.34)!important;
}

/* Modals stärker thematisieren als normale Karten */
html[data-theme="custom"] :is(.vehicle-modal,.biz-modal,.house-modal,.modal-content){
    background:
        linear-gradient(180deg,
            color-mix(in srgb,#121821 80%,var(--theme-accent) 20%),
            color-mix(in srgb,#0b1118 91%,var(--theme-accent) 9%))!important;
    border-color:rgba(var(--theme-accent-rgb),.22)!important;
}
html[data-theme="custom"] :is(.vehicle-modal-header,.biz-modal-head,.house-modal-hero){
    background:color-mix(in srgb,#171e27 72%,var(--theme-accent) 28%)!important;
}

/* Bestenliste */
html[data-theme="custom"] :is(.lb-highlight,.lb-podium-card){
    background:
        linear-gradient(145deg,
            color-mix(in srgb,#151c25 78%,var(--theme-accent) 22%),
            color-mix(in srgb,#0e151d 89%,var(--theme-accent) 11%))!important;
}
html[data-theme="custom"] :is(.lb-rank-row,.lb-table tbody tr){
    background:color-mix(in srgb,#0d141c 88%,var(--theme-accent) 12%)!important;
}
html[data-theme="custom"] .lb-table tbody tr:hover td{
    background:color-mix(in srgb,#18222e 72%,var(--theme-accent) 28%)!important;
}

/* Seltene Fahrzeuge */
html[data-theme="custom"] .rare-image{
    background:
        radial-gradient(circle at 50% 15%,rgba(var(--theme-accent-rgb),.12),transparent 45%),
        color-mix(in srgb,#141b24 79%,var(--theme-accent) 21%)!important;
}
html[data-theme="custom"] .rare-body{
    background:color-mix(in srgb,#0d141c 86%,var(--theme-accent) 14%)!important;
}

/* Marktübersicht */
html[data-theme="custom"] :is(.market-table tbody tr,.market-table tbody td,.market-group-row td,.market-detail-row td){
    background:color-mix(in srgb,#0d141c 88%,var(--theme-accent) 12%)!important;
    border-color:rgba(var(--theme-accent-rgb),.12)!important;
}
html[data-theme="custom"] .market-table tbody tr:hover td,
html[data-theme="custom"] .market-group-row:hover td{
    background:color-mix(in srgb,#18222e 70%,var(--theme-accent) 30%)!important;
}

/* Inputs und Suchfelder leicht eingefärbt */
html[data-theme="custom"] :is(input,select,textarea,.search-input){
    background:color-mix(in srgb,#0c131c 86%,var(--theme-accent) 14%)!important;
    border-color:rgba(var(--theme-accent-rgb),.14)!important;
}
html[data-theme="custom"] :is(input,select,textarea,.search-input):focus{
    background:color-mix(in srgb,#101923 78%,var(--theme-accent) 22%)!important;
    border-color:rgba(var(--theme-accent-rgb),.42)!important;
}

/* Tabs/Navigation: kräftigste Ausprägung */
html[data-theme="custom"] :is(
    .nav-link.active,
    .tab.active,.inv-tab.active,.inv-subtab.active,.market-tab.active,
    .vehicle-tab.active,.house-tab.active,.office-tab.active,
    .theme-choice.active
){
    background:linear-gradient(135deg,
        color-mix(in srgb,var(--theme-accent) 88%,#fff 12%),
        color-mix(in srgb,var(--theme-accent) 78%,#000 22%))!important;
    border-color:rgba(var(--theme-accent-rgb),.44)!important;
    color:#fff!important;
    box-shadow:0 8px 24px rgba(var(--theme-accent-rgb),.22)!important;
}

/* Nicht aktive Tabs dürfen das Theme ebenfalls erkennen lassen */
html[data-theme="custom"] :is(
    .tab,.inv-tab,.inv-subtab,.market-tab,.vehicle-tab,.house-tab,.office-tab
):not(.active){
    background:color-mix(in srgb,#101720 88%,var(--theme-accent) 12%)!important;
    border-color:rgba(var(--theme-accent-rgb),.12)!important;
}

/* Hover */
html[data-theme="custom"] :is(
    .nav-link:not(.active):hover,
    .tab:not(.active):hover,.inv-tab:not(.active):hover,.inv-subtab:not(.active):hover,
    .market-tab:not(.active):hover,.vehicle-tab:not(.active):hover,
    .house-tab:not(.active):hover,.office-tab:not(.active):hover,
    .dashboard-card:hover,.dash-card:hover,.kpi-card:hover,.stat-card:hover,.license-card:hover,
    .rare-card:hover,.vehicle-row:hover
){
    background:color-mix(in srgb,#18222e 70%,var(--theme-accent) 30%)!important;
    border-color:rgba(var(--theme-accent-rgb),.30)!important;
}

/* kleine Akzentflächen */
html[data-theme="custom"] :is(
    .inv-brand-icon,.inv-hotkey,.inv-count,.profile-theme-button,
    .badge,.pill,.chip
){
    background:rgba(var(--theme-accent-rgb),.12)!important;
    border-color:rgba(var(--theme-accent-rgb),.20)!important;
}

/* Scrollbar */
html[data-theme="custom"] *{
    scrollbar-color:rgba(var(--theme-accent-rgb),.48)
        color-mix(in srgb,#0b1119 92%,var(--theme-accent) 8%);
}
html[data-theme="custom"] *::-webkit-scrollbar-track{
    background:color-mix(in srgb,#0b1119 92%,var(--theme-accent) 8%)!important;
}
html[data-theme="custom"] *::-webkit-scrollbar-thumb{
    background:rgba(var(--theme-accent-rgb),.46)!important;
    border:2px solid color-mix(in srgb,#0b1119 92%,var(--theme-accent) 8%)!important;
}


/* ======================================================================
   V10.1 – DASHBOARD STATUSLEISTEN FIX
   Verhindert, dass die globale [class*="progress"]-Regel Text-Spans einfärbt.
   ====================================================================== */

/* Kopf-/Fußtexte dürfen niemals eine Balkenfüllung bekommen */
html[data-theme] .dashboard-progress-head > span,
html[data-theme] .dashboard-progress-head > span *,
html[data-theme] .dashboard-progress-foot > span,
html[data-theme] .dashboard-progress-foot > span *{
    background:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
}

/* Ruhiger dunkler Track */
html[data-theme] .dashboard-progress-track{
    height:8px!important;
    background:color-mix(in srgb,#070b11 82%,var(--theme-accent) 18%)!important;
    border:1px solid rgba(255,255,255,.045)!important;
    border-radius:999px!important;
    overflow:hidden!important;
    box-shadow:inset 0 1px 3px rgba(0,0,0,.38)!important;
}

/* Die eigentliche Füllung */
html[data-theme] .dashboard-progress-track > span{
    display:block!important;
    height:100%!important;
    border-radius:999px!important;
    box-shadow:none!important;
}

/* Statusfarben bleiben semantisch und unabhängig von der gewählten CP-Farbe */
html[data-theme] .dashboard-progress-track.hunger > span{
    background:linear-gradient(90deg,#d98b35,#f0b458)!important;
}
html[data-theme] .dashboard-progress-track.thirst > span{
    background:linear-gradient(90deg,#4388d8,#66b7f5)!important;
}
html[data-theme] .dashboard-progress-track.exp > span{
    background:linear-gradient(
        90deg,
        color-mix(in srgb,var(--theme-accent) 82%,#8b70ff 18%),
        color-mix(in srgb,var(--theme-accent-2) 76%,#b39cff 24%)
    )!important;
}

/* Typografie ebenfalls wieder sauber */
html[data-theme] .dashboard-progress-head{
    color:var(--theme-text)!important;
    font-weight:500!important;
}
html[data-theme] .dashboard-progress-head > span:last-child{
    color:var(--theme-text)!important;
    font-weight:700!important;
}
html[data-theme] .dashboard-progress-foot{
    color:var(--theme-muted)!important;
}
html[data-theme] .dashboard-progress-foot strong{
    color:var(--theme-text)!important;
    background:transparent!important;
}

/* Etwas mehr Luft zwischen den Statuswerten */
html[data-theme] .dashboard-progress-item{
    margin-bottom:15px!important;
}

/* ======================================================================
   HALLOWEEN SHOWCASE V2 – visual treatment matching the approved mockup
   ====================================================================== */
html[data-theme="halloween"]{
    --theme-bg:#07060b;
    --theme-bg-2:#110a12;
    --theme-sidebar:#08060a;
    --theme-panel:#121017;
    --theme-panel-2:#0d0a10;
    --theme-accent:#ff7b1b;
    --theme-accent-2:#ffb35a;
    --theme-accent-rgb:255,123,27;
    --theme-text:#fff5ec;
    --theme-muted:#b8a7a8;
    --theme-border:rgba(255,123,27,.22);
}
html[data-theme="halloween"] body{
    background:
      radial-gradient(circle at 88% 5%,rgba(255,105,16,.12),transparent 21%),
      radial-gradient(circle at 5% 94%,rgba(121,50,155,.13),transparent 24%),
      linear-gradient(180deg,#07060b,#110a12)!important;
}
html[data-theme="halloween"] .sidebar{
    background:
      linear-gradient(rgba(8,6,10,.76),rgba(8,6,10,.92)),
      url('empty.svg') center bottom/cover no-repeat!important;
    border-right:1px solid rgba(255,123,27,.20)!important;
    box-shadow:12px 0 45px rgba(0,0,0,.34)!important;
}
html[data-theme="halloween"] .sidebar::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    background:linear-gradient(90deg,transparent 76%,rgba(255,123,27,.05));
}
html[data-theme="halloween"] .nav-link{position:relative;z-index:1}
html[data-theme="halloween"] .nav-link:hover{
    background:linear-gradient(90deg,rgba(255,123,27,.12),rgba(129,55,167,.06))!important;
    color:#fff!important;
}
html[data-theme="halloween"] .nav-link.active{
    background:linear-gradient(90deg,#a84213,#f06a17 62%,#ff9d35)!important;
    border:1px solid rgba(255,169,71,.44)!important;
    color:#fff!important;
    box-shadow:0 0 24px rgba(255,105,16,.30),inset 0 1px 0 rgba(255,255,255,.12)!important;
}
html[data-theme="halloween"] .profile-card{
    background:linear-gradient(135deg,rgba(39,18,25,.93),rgba(24,12,20,.95))!important;
    border-color:rgba(255,123,27,.26)!important;
}
html[data-theme="halloween"] .profile-avatar{
    border:2px solid rgba(255,123,27,.7)!important;
    box-shadow:0 0 18px rgba(255,123,27,.18)!important;
}
html[data-theme="halloween"] .content{
    background:
      radial-gradient(circle at 100% 0%,rgba(255,123,27,.055),transparent 21%),
      radial-gradient(circle at 0% 100%,rgba(118,57,145,.055),transparent 24%)!important;
}
html[data-theme="halloween"] :is(.page-header,.lb-head){
    background:linear-gradient(135deg,#1b1117,#24110f)!important;
    border-color:rgba(255,123,27,.28)!important;
}

html[data-theme="halloween"] :is(.card,.panel,.dashboard-card,.inventory-main,.table-wrap,.market-table-wrap,.rare-card,.vehicle-modal,.biz-modal,.house-modal,.modal-content){
    border-color:rgba(255,123,27,.14)!important;
}
html[data-theme="halloween"] :is(.dashboard-card,.dashboard-stat-card,.dashboard-mini-card){
    background:
      linear-gradient(145deg,rgba(18,14,22,.97),rgba(10,8,13,.97))!important;
}
html[data-theme="halloween"] :is(.dashboard-stat-card:nth-child(odd),.dashboard-mini-card:nth-child(odd)){
    background:
      radial-gradient(circle at 100% 100%,rgba(255,99,15,.11),transparent 42%),
      linear-gradient(145deg,rgba(25,15,18,.98),rgba(11,9,13,.98))!important;
}
html[data-theme="halloween"] :is(.dashboard-stat-card:nth-child(even),.dashboard-mini-card:nth-child(even)){
    background:
      radial-gradient(circle at 100% 100%,rgba(149,63,201,.11),transparent 42%),
      linear-gradient(145deg,rgba(20,14,24,.98),rgba(11,9,13,.98))!important;
}
html[data-theme="halloween"] :is(.dashboard-info-row,.dashboard-license,.dashboard-skill-card,.dashboard-job-card,.dashboard-status-mini,.vehicle-row,.market-table tbody td,.inv-slot,.inv-quick-slot,.inv-shoulder){
    background:linear-gradient(180deg,rgba(18,15,21,.95),rgba(10,9,13,.95))!important;
    border-color:rgba(255,123,27,.12)!important;
}
html[data-theme="halloween"] :is(.dashboard-tabs,.dashboard-tab-pane){
    background:linear-gradient(180deg,#151018,#0c0a0f)!important;
}
html[data-theme="halloween"] .dashboard-tab.active{
    color:#ffb04e!important;
    background:linear-gradient(180deg,rgba(255,123,27,.23),rgba(255,123,27,.08))!important;
    box-shadow:inset 0 -3px 0 #ff7b1b,0 0 25px rgba(255,123,27,.10)!important;
}
html[data-theme="halloween"] :is(.dashboard-tab:not(.active),.tab:not(.active),.inv-tab:not(.active),.market-tab:not(.active)){
    color:#d5c8ce!important;
}
html[data-theme="halloween"] :is(.dashboard-section-title,.market-name,.lb-head h2){color:#ff9b3d!important}
html[data-theme="halloween"] :is(input,select,textarea,.search-input){
    background:#0d0a10!important;
    border-color:rgba(255,123,27,.18)!important;
}
html[data-theme="halloween"] :is(input,select,textarea,.search-input):focus{
    border-color:rgba(255,123,27,.55)!important;
    box-shadow:0 0 0 3px rgba(255,123,27,.12)!important;
}
html[data-theme="halloween"] *::-webkit-scrollbar-thumb{
    background:linear-gradient(#ff8d2a,#8a3fa2)!important;
    border-color:#100b12!important;
}
html[data-theme="halloween"] .theme-dot--halloween{
    background:linear-gradient(135deg,#7c2e9b 0 35%,#0d0a10 35% 60%,#ff7b1b 60%)!important;
    box-shadow:0 0 0 2px rgba(255,123,27,.22),0 0 12px rgba(255,123,27,.28)!important;
}


/* ======================================================================
   ====================================================================== */
.theme-season-note{
    margin:4px 2px 8px;
    padding:8px 9px;
    border:1px dashed var(--theme-border,rgba(255,255,255,.08));
    border-radius:8px;
    color:var(--theme-muted,#8d9bb1);
    font-size:.68rem;
    line-height:1.35;
}



.theme-global-settings{
    margin:0 0 10px;
    padding:8px 9px 10px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:10px;
    background:rgba(255,255,255,.025);
}
.theme-popover-subtitle--small{
    margin-top:0;
    margin-bottom:7px;
    font-size:.7rem;
}
.theme-toggle-row{
    display:flex;
    align-items:center;
    gap:8px;
    margin:0 0 8px;
    color:var(--theme-text);
    font-size:.76rem;
}
.theme-toggle-row input{
    width:14px;
    height:14px;
    accent-color:rgb(var(--theme-accent-rgb,130,103,255));
}
.theme-save-button{
    width:100%;
    border:1px solid rgba(var(--theme-accent-rgb,130,103,255),.22);
    background:rgba(var(--theme-accent-rgb,130,103,255),.10);
    color:var(--theme-text);
    border-radius:10px;
    padding:9px 10px;
    font:inherit;
    font-size:.78rem;
    cursor:pointer;
    transition:.18s ease;
}
.theme-save-button:hover{
    background:rgba(var(--theme-accent-rgb,130,103,255),.16);
    border-color:rgba(var(--theme-accent-rgb,130,103,255),.32);
}

/* ======================================================================
   Mehr Weihnachtsfarben, mehr Dekoelemente, Schnee/Glow,
   festliche Sidebar- und Stat-Icons.
   ====================================================================== */
    50%{transform:translateY(8px)}
    to{transform:translateY(18px)}
}





.lb-table{
    width:100%!important;
    border-collapse:separate!important;
    border-spacing:0 10px!important;
    background:transparent!important;
}

.lb-table thead,
.lb-table tbody,
.lb-table tr{
    background:transparent!important;
}

.lb-table thead th{
    padding:0 14px 6px!important;
    border:0!important;
    background:transparent!important;
    color:var(--theme-muted,#72839a)!important;
    font-size:.47rem!important;
    font-weight:800!important;
    text-transform:uppercase!important;
    letter-spacing:.08em!important;
}

.lb-table tbody tr{
    transform:none!important;
    filter:none!important;
    box-shadow:none!important;
}

.lb-table tbody td{
    position:relative!important;
    padding:12px 14px!important;
    border-top:1px solid var(--theme-border,rgba(255,255,255,.07))!important;
    border-bottom:1px solid var(--theme-border,rgba(255,255,255,.07))!important;
    background:
        linear-gradient(180deg,
            color-mix(in srgb,var(--theme-surface-2,#131d29) 92%,#fff 8%),
            color-mix(in srgb,var(--theme-surface,#0d141c) 96%,#000 4%)
        )!important;
}

.lb-table tbody td:first-child{
    border-left:1px solid var(--theme-border,rgba(255,255,255,.07))!important;
    border-radius:14px 0 0 14px!important;
}

.lb-table tbody td:last-child{
    border-right:1px solid var(--theme-border,rgba(255,255,255,.07))!important;
    border-radius:0 14px 14px 0!important;
}

.lb-table tbody tr:hover td{
    background:
        linear-gradient(180deg,
            color-mix(in srgb,var(--theme-surface-hover,#1a2431) 94%,#fff 6%),
            color-mix(in srgb,var(--theme-surface-2,#131d29) 94%,#000 6%)
        )!important;
    border-color:var(--theme-border-strong,rgba(255,255,255,.14))!important;
}

.lb-table tbody tr:nth-child(1) td{
    border-color:rgba(229,188,80,.22)!important;
    background:
        linear-gradient(180deg,rgba(36,31,19,.92),rgba(17,20,26,.96))!important;
}
.lb-table tbody tr:nth-child(2) td{
    border-color:rgba(174,188,207,.17)!important;
    background:
        linear-gradient(180deg,rgba(26,30,37,.94),rgba(16,20,28,.97))!important;
}
.lb-table tbody tr:nth-child(3) td{
    border-color:rgba(190,125,79,.18)!important;
    background:
        linear-gradient(180deg,rgba(34,24,22,.94),rgba(17,19,27,.97))!important;
}

.lb-table tbody tr.me td{
    border-top-color:var(--theme-border-strong,rgba(117,110,231,.25))!important;
    border-bottom-color:var(--theme-border-strong,rgba(117,110,231,.25))!important;
    background:
        linear-gradient(180deg,
            color-mix(in srgb,var(--theme-surface-2,#131d29) 80%,var(--theme-accent,#756ee7) 20%),
            color-mix(in srgb,var(--theme-surface,#0d141c) 88%,var(--theme-accent,#756ee7) 12%)
        )!important;
}
.lb-table tbody tr.me td:first-child{
    border-left:3px solid var(--theme-accent,#756ee7)!important;
    padding-left:12px!important;
}

.lb-rank{
    width:84px!important;
    white-space:nowrap!important;
}

.lb-rank-badge{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:44px!important;
    height:34px!important;
    padding:0 9px!important;
    border-radius:10px!important;
    border:1px solid var(--theme-border,rgba(255,255,255,.07))!important;
    background:rgba(255,255,255,.035)!important;
    color:var(--theme-text,#eef4ff)!important;
    font-size:.57rem!important;
    font-weight:800!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.03)!important;
}

.lb-table tbody tr:nth-child(1) .lb-rank-badge{
    background:rgba(229,188,80,.12)!important;
    color:#f1d27a!important;
    border-color:rgba(229,188,80,.24)!important;
}
.lb-table tbody tr:nth-child(2) .lb-rank-badge{
    background:rgba(174,188,207,.10)!important;
    color:#d4dbe6!important;
    border-color:rgba(174,188,207,.18)!important;
}
.lb-table tbody tr:nth-child(3) .lb-rank-badge{
    background:rgba(190,125,79,.10)!important;
    color:#d8a883!important;
    border-color:rgba(190,125,79,.18)!important;
}

.lb-player{
    min-width:240px!important;
}

.lb-player-card{
    display:flex!important;
    align-items:center!important;
    gap:11px!important;
}

.lb-player-avatar{
    border-radius:11px!important;
    border:1px solid var(--theme-border,rgba(255,255,255,.07))!important;
    background:
        radial-gradient(circle at 30% 25%,rgba(255,255,255,.08),transparent 42%),
        linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02))!important;
}

.lb-player strong,
.lb-player-card strong,
.lb-metric,
.lb-table .metric-strong{
    color:var(--theme-text,#f0f5ff)!important;
}

.lb-player small,
.lb-table .sub,
.lb-table .muted{
    color:var(--theme-muted,#8ea0b6)!important;
}

.lb-you{
    margin-left:7px!important;
    padding:2px 6px!important;
    border-radius:999px!important;
    background:rgba(var(--theme-accent-rgb,117,110,231),.14)!important;
    border:1px solid rgba(var(--theme-accent-rgb,117,110,231),.22)!important;
    color:var(--theme-text,#fff)!important;
    font-size:.43rem!important;
    font-weight:800!important;
}

/* Spezielle Feinjustierung für sehr kräftige Themes */
html[data-theme="halloween"] .lb-table tbody tr:nth-child(1) td,
html[data-theme="custom"] .lb-table tbody td{
    box-shadow:0 8px 18px rgba(0,0,0,.12)!important;
}


/* FINAL HOTFIX – Bestenliste ohne halbe Balken / durchgehende Zeilen */
.lb-table{
    border-collapse:separate !important;
    border-spacing:0 8px !important;
}
.lb-table thead,
.lb-table tbody,
.lb-table tr{
    background:transparent !important;
}
.lb-table tbody tr{
    background:
        linear-gradient(90deg,
            color-mix(in srgb,var(--theme-surface-2,#131d29) 96%,#fff 4%) 0%,
            color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%) !important;
}
.lb-table tbody tr:nth-child(1){
    background:
        linear-gradient(90deg,rgba(229,188,80,.10) 0%,rgba(229,188,80,.04) 14%,color-mix(in srgb,var(--theme-surface-2,#131d29) 96%,#fff 4%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%) !important;
}
.lb-table tbody tr:nth-child(2){
    background:
        linear-gradient(90deg,rgba(174,188,207,.08) 0%,rgba(174,188,207,.035) 14%,color-mix(in srgb,var(--theme-surface-2,#131d29) 96%,#fff 4%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%) !important;
}
.lb-table tbody tr:nth-child(3){
    background:
        linear-gradient(90deg,rgba(190,125,79,.08) 0%,rgba(190,125,79,.035) 14%,color-mix(in srgb,var(--theme-surface-2,#131d29) 96%,#fff 4%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%) !important;
}
.lb-table tbody tr.me{
    background:
        linear-gradient(90deg,rgba(var(--theme-accent-rgb,117,110,231),.10) 0%,rgba(var(--theme-accent-rgb,117,110,231),.04) 14%,color-mix(in srgb,var(--theme-surface-2,#131d29) 96%,#fff 4%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%) !important;
}
.lb-table tbody td,
.lb-table tbody tr:nth-child(1) td,
.lb-table tbody tr:nth-child(2) td,
.lb-table tbody tr:nth-child(3) td,
.lb-table tbody tr.me td,
.lb-table tbody tr:hover td{
    background:transparent !important;
    background-image:none !important;
    box-shadow:none !important;
    border-top:1px solid var(--theme-border,rgba(255,255,255,.07)) !important;
    border-bottom:1px solid var(--theme-border,rgba(255,255,255,.07)) !important;
}
.lb-table tbody td:first-child{
    border-left:1px solid var(--theme-border,rgba(255,255,255,.07)) !important;
    border-radius:14px 0 0 14px !important;
}
.lb-table tbody td:last-child{
    border-right:1px solid var(--theme-border,rgba(255,255,255,.07)) !important;
    border-radius:0 14px 14px 0 !important;
}
.lb-table tbody tr.me td:first-child{
    border-left:3px solid var(--theme-accent,#756ee7) !important;
    padding-left:12px !important;
}
.lb-table tbody tr:hover{
    filter:brightness(1.04) !important;
    transform:none !important;
}
.lb-player,
.lb-player-card,
.lb-player-copy,
.lb-player-copy > div,
.lb-player-copy small,
.lb-metric-cell,
.lb-metric-stack,
.lb-vehicle-cell,
.lb-vehicle-info{
    background:transparent !important;
    background-image:none !important;
    border:0 !important;
    box-shadow:none !important;
}
.lb-player-card,
.lb-metric-stack,
.lb-vehicle-cell{
    width:100% !important;
}


/* AUTHORITATIVE LEADERBOARD ROW BACKGROUND FIX */
html[data-theme] body .leaderboard-page .lb-table tbody tr{
    background:linear-gradient(90deg,
        color-mix(in srgb,var(--theme-surface-2,#131d29) 96%,#fff 4%) 0%,
        color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%)!important;
}
html[data-theme] body .leaderboard-page .lb-table tbody tr:nth-child(1){
    background:linear-gradient(90deg,rgba(229,188,80,.10) 0%,rgba(229,188,80,.035) 16%,color-mix(in srgb,var(--theme-surface-2,#131d29) 97%,#fff 3%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%)!important;
}
html[data-theme] body .leaderboard-page .lb-table tbody tr:nth-child(2){
    background:linear-gradient(90deg,rgba(174,188,207,.08) 0%,rgba(174,188,207,.03) 16%,color-mix(in srgb,var(--theme-surface-2,#131d29) 97%,#fff 3%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%)!important;
}
html[data-theme] body .leaderboard-page .lb-table tbody tr:nth-child(3){
    background:linear-gradient(90deg,rgba(190,125,79,.08) 0%,rgba(190,125,79,.03) 16%,color-mix(in srgb,var(--theme-surface-2,#131d29) 97%,#fff 3%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%)!important;
}
html[data-theme] body .leaderboard-page .lb-table tbody tr.me{
    background:linear-gradient(90deg,rgba(var(--theme-accent-rgb,117,110,231),.11) 0%,rgba(var(--theme-accent-rgb,117,110,231),.04) 16%,color-mix(in srgb,var(--theme-surface-2,#131d29) 97%,#fff 3%) 38%,color-mix(in srgb,var(--theme-surface,#0d141c) 98%,#000 2%) 100%)!important;
}
html[data-theme] body .leaderboard-page .lb-table tbody tr > td,
html[data-theme] body .leaderboard-page .lb-table tbody tr > td.lb-player,
html[data-theme] body .leaderboard-page .lb-table tbody tr > td.lb-metric,
html[data-theme] body .leaderboard-page .lb-table tbody tr > td.lb-extra{
    background:transparent!important;
    background-color:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
}
html[data-theme] body .leaderboard-page .lb-table tbody tr:hover > td{
    background:transparent!important;
    background-image:none!important;
}
html[data-theme] body .leaderboard-page .lb-player-card,
html[data-theme] body .leaderboard-page .lb-player-copy,
html[data-theme] body .leaderboard-page .lb-player-copy > div,
html[data-theme] body .leaderboard-page .lb-metric-stack,
html[data-theme] body .leaderboard-page .lb-vehicle-cell,
html[data-theme] body .leaderboard-page .lb-vehicle-info{
    background:transparent!important;
    background-color:transparent!important;
    background-image:none!important;
    box-shadow:none!important;
}

/* FAMILY MODULE THEME */
html[data-theme] .family-page :is(.storage-frame,.storage-head,.storage-slot,.family-vehicle-card,.family-vehicle-modal-box,.family-trunk-item,.family-log-card,.family-log-tools,.overview-card,.overview-stat,.overview-mini){
    border-color:var(--theme-border)!important;
}
html[data-theme] .family-page :is(.storage-frame,.storage-head,.storage-slot,.family-vehicle-card,.family-vehicle-modal-box,.family-trunk-item,.family-log-card,.family-log-tools,.overview-card,.overview-stat,.overview-mini){
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    color:var(--theme-text)!important;
}
html[data-theme] .family-page :is(.storage-search input,.family-log-search input,.family-log-tools input,.family-log-tools select){
    background:var(--theme-input)!important;border-color:var(--theme-border)!important;color:var(--theme-text)!important;
}
html[data-theme] .family-page :is(.storage-brand-icon,.storage-count,.family-chip,.member-rank,.family-log-page-link.active){
    background:var(--theme-accent-soft)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-accent-2)!important;
}
html[data-theme] .family-page :is(.storage-brand strong,.storage-info strong,.family-vehicle-head h3,.family-trunk-title,.overview-card-head strong){color:var(--theme-text)!important}
html[data-theme] .family-page :is(.storage-brand small,.storage-info span,.storage-foot,.family-vehicle-meta,.family-vehicle-openhint,.overview-card-head span){color:var(--theme-muted)!important}

/* ======================================================================
   FAMILY SIDEBAR + LAGER THEME FIX
   ====================================================================== */

.nav-feature-group{
    gap:4px !important;
    margin:0 !important;
}
.nav-feature-group .nav-submenu-toggle{
    position:relative;
    width:100%;
    min-height:42px;
    padding:10px 12px !important;
    border:1px solid transparent !important;
    border-radius:12px !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--theme-muted,#a7b7d8) !important;
}
.nav-feature-group .nav-submenu-toggle:hover{
    background:var(--theme-accent-soft,rgba(var(--theme-accent-rgb,130,103,255),.08)) !important;
    border-color:var(--theme-border,rgba(255,255,255,.07)) !important;
    color:var(--theme-text,#fff) !important;
}
.nav-feature-group.open .nav-submenu-toggle,
.nav-feature-group .nav-submenu-toggle.active{
    background:linear-gradient(90deg,rgba(var(--theme-accent-rgb,130,103,255),.14),rgba(var(--theme-accent-rgb,130,103,255),.045)) !important;
    border-color:rgba(var(--theme-accent-rgb,130,103,255),.20) !important;
    color:var(--theme-text,#fff) !important;
}
.nav-feature-group .nav-submenu-toggle::before{
    content:"";
    position:absolute;
    left:0;
    top:10px;
    bottom:10px;
    width:3px;
    border-radius:99px;
    background:transparent;
}
.nav-feature-group.open .nav-submenu-toggle::before,
.nav-feature-group .nav-submenu-toggle.active::before{
    background:var(--theme-accent,#8267ff);
}
.nav-feature-group .nav-submenu-title{
    flex:1 1 auto;
    min-width:0;
    font-weight:750;
}
.nav-feature-group .nav-chevron{
    margin-left:auto;
    opacity:.68;
    font-size:.76rem;
}
.nav-feature-group .nav-submenu-body{
    position:relative;
    gap:3px !important;
    margin:2px 0 0 18px;
    padding:3px 0 3px 12px;
}
.nav-feature-group .nav-submenu-body::before{
    content:"";
    position:absolute;
    left:0;
    top:4px;
    bottom:4px;
    width:1px;
    background:var(--theme-border,rgba(255,255,255,.08));
}
.nav-feature-group .nav-submenu-link{
    min-height:35px;
    padding:8px 10px !important;
    border-radius:9px !important;
    gap:8px !important;
    font-size:.76rem;
    color:var(--theme-muted,#9aa9ba) !important;
    background:transparent !important;
    box-shadow:none !important;
}
.nav-feature-group .nav-submenu-link .nav-icon{
    width:18px;
    font-size:.78rem;
    opacity:.82;
}
.nav-feature-group .nav-submenu-link:hover{
    background:rgba(var(--theme-accent-rgb,130,103,255),.07) !important;
    color:var(--theme-text,#fff) !important;
}
.nav-feature-group .nav-submenu-link.active{
    background:rgba(var(--theme-accent-rgb,130,103,255),.12) !important;
    color:var(--theme-accent-2,#a99bff) !important;
    box-shadow:inset 2px 0 0 var(--theme-accent,#8267ff) !important;
}

html[data-theme] .family-page .family-storage-item{
    background:
        radial-gradient(circle at 50% 28%,rgba(var(--theme-accent-rgb,130,103,255),.12),rgba(var(--theme-accent-rgb,130,103,255),.035) 34%,transparent 58%),
        linear-gradient(180deg,color-mix(in srgb,var(--theme-surface-2,#131d29) 94%,var(--theme-accent,#8267ff) 6%),var(--theme-surface,#0d141c)) !important;
    border-color:var(--theme-border,rgba(255,255,255,.07)) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025) !important;
}
html[data-theme] .family-page .family-storage-item:hover{
    background:
        radial-gradient(circle at 50% 26%,rgba(var(--theme-accent-rgb,130,103,255),.18),rgba(var(--theme-accent-rgb,130,103,255),.055) 38%,transparent 62%),
        linear-gradient(180deg,color-mix(in srgb,var(--theme-surface-hover,#18222e) 88%,var(--theme-accent,#8267ff) 12%),var(--theme-surface-2,#131d29)) !important;
    border-color:var(--theme-border-strong,rgba(var(--theme-accent-rgb,130,103,255),.28)) !important;
}
html[data-theme] .family-page .family-storage-count{
    background:color-mix(in srgb,var(--theme-surface,#0d141c) 86%,var(--theme-accent,#8267ff) 14%) !important;
    border-color:var(--theme-border-strong,rgba(var(--theme-accent-rgb,130,103,255),.24)) !important;
    color:var(--theme-accent-2,#a99bff) !important;
}
html[data-theme] .family-page .family-storage-fallback{
    background:var(--theme-accent-soft,rgba(var(--theme-accent-rgb,130,103,255),.10)) !important;
    border-color:var(--theme-border-strong,rgba(var(--theme-accent-rgb,130,103,255),.24)) !important;
    color:var(--theme-accent-2,#a99bff) !important;
}
html[data-theme] .family-page .family-storage-item strong{color:var(--theme-text,#eef3fb) !important;}
html[data-theme] .family-page .family-storage-item small{color:var(--theme-muted,#8f9eb7) !important;}
html[data-theme] .family-page .family-storage-item.rarity-common{border-color:rgba(154,170,197,.34) !important;}
html[data-theme] .family-page .family-storage-item.rarity-uncommon{border-color:rgba(99,217,139,.52) !important;}
html[data-theme] .family-page .family-storage-item.rarity-rare{border-color:rgba(105,166,255,.62) !important;}
html[data-theme] .family-page .family-storage-item.rarity-epic{border-color:rgba(196,130,255,.62) !important;}
html[data-theme] .family-page .family-storage-item.rarity-legendary{border-color:rgba(255,209,93,.68) !important;}

/* ======================================================================
   FAMILY SIDEBAR CLEAN V2
   ====================================================================== */
html[data-theme] .nav-feature-group{
    margin:4px 0 8px!important;
    gap:2px!important;
}
html[data-theme] .nav-feature-group > .nav-submenu-toggle{
    min-height:40px!important;
    padding:9px 12px!important;
    border:0!important;
    border-radius:10px!important;
    background:transparent!important;
    box-shadow:none!important;
    color:color-mix(in srgb,var(--theme-text) 86%,var(--theme-muted) 14%)!important;
}
html[data-theme] .nav-feature-group > .nav-submenu-toggle::before{
    display:none!important;
}
html[data-theme] .nav-feature-group > .nav-submenu-toggle:hover{
    background:var(--theme-accent-soft)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .nav-feature-group.open > .nav-submenu-toggle,
html[data-theme] .nav-feature-group > .nav-submenu-toggle.active{
    background:rgba(var(--theme-accent-rgb),.075)!important;
    color:var(--theme-text)!important;
    border:0!important;
    box-shadow:none!important;
}
html[data-theme] .nav-feature-group.open > .nav-submenu-toggle .nav-icon,
html[data-theme] .nav-feature-group > .nav-submenu-toggle.active .nav-icon{
    color:var(--theme-accent-2)!important;
}
html[data-theme] .nav-feature-group .nav-chevron{
    opacity:.50!important;
    font-size:.68rem!important;
}
html[data-theme] .nav-feature-group .nav-submenu-body{
    margin:1px 0 2px 14px!important;
    padding:2px 0 2px 10px!important;
    gap:1px!important;
}
html[data-theme] .nav-feature-group .nav-submenu-body::before{
    left:0!important;
    top:4px!important;
    bottom:4px!important;
    width:1px!important;
    background:rgba(var(--theme-accent-rgb),.18)!important;
}
html[data-theme] .nav-feature-group .nav-submenu-link{
    min-height:32px!important;
    padding:7px 9px!important;
    border-radius:8px!important;
    font-size:.72rem!important;
    background:transparent!important;
    color:var(--theme-muted)!important;
    box-shadow:none!important;
}
html[data-theme] .nav-feature-group .nav-submenu-link .nav-icon{
    width:17px!important;
    opacity:.76!important;
    font-size:.74rem!important;
}
html[data-theme] .nav-feature-group .nav-submenu-link:hover{
    background:rgba(var(--theme-accent-rgb),.06)!important;
    color:var(--theme-text)!important;
}
html[data-theme] .nav-feature-group .nav-submenu-link.active{
    background:rgba(var(--theme-accent-rgb),.11)!important;
    color:var(--theme-accent-2)!important;
    box-shadow:inset 2px 0 0 var(--theme-accent)!important;
}


/* ======================================================================
   FACTION DESIGN INTEGRATION V1
   ====================================================================== */
html[data-theme] .fpage,
html[data-theme] .faction-info-page{
    color:var(--theme-text)!important;
}
html[data-theme] :is(
    .fhero,.fstat,.fcard,.faction-info-card,
    .family-section,.family-stat,.family-vehicle-card,.family-vehicle-modal-box,
    .storage-frame,.storage-slot,.weapon-stock-card,.weapon-stock-section,
    .lstr-card,.lstr-item,.lstr-filter-box,.lstr-shop-section,
    .li-card,.li-panel,.li-modal-card,.li-mini,
    .pd-panel,.pd-member-box,.pd-hero-panel,.pd-filterbar,
    .gw-zone
){
    background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
    box-shadow:var(--theme-shadow)!important;
}
html[data-theme] :is(
    .fcard-head,.faction-info-card-head,.family-section-head,.family-vehicle-head,
    .storage-head,.storage-foot,.lstr-shop-head,.weapon-stock-section-title
){
    background:var(--theme-surface-3)!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] :is(
    .fhero small,.fstat small,.fcard-head span,.fvehicle small,
    .faction-info-description,.faction-members-note,.faction-members-legend,
    .faction-log-source,.faction-log-detail,
    .family-vehicle-meta,.family-trunk-title,
    .storage-info,.storage-count,.storage-no,
    .weapon-stock-time,.weapon-stock-pill,
    .li-muted,.li-hint,.pd-byline,.pd-note,.pd-filter-label
){
    color:var(--theme-muted)!important;
}
html[data-theme] :is(
    .fhero h2,.fstat strong,.fcard-head strong,.ftable td strong,.fvehicle h3,
    .faction-info-name,.faction-member-name,.family-vehicle-body strong,
    .storage-name,.weapon-stock-name,.lstr-card-name,.lstr-card-value,
    .li-card strong,.pd-toolbar-title,.pd-entry-title
){
    color:var(--theme-text)!important;
}
html[data-theme] :is(.fhero small,.faction-rank-pill,.family-chip,.storage-count,.weapon-stock-pill,.pd-tag,.gw-badge){
    color:var(--theme-accent-2)!important;
}
html[data-theme] :is(.ftable,.faction-members-table,.pd-table){
    color:var(--theme-text)!important;
}
html[data-theme] :is(.ftable th,.faction-members-table th,.pd-table th){
    background:var(--theme-surface-3)!important;
    color:var(--theme-muted)!important;
    border-color:var(--theme-border)!important;
}
html[data-theme] :is(.ftable td,.faction-members-table td,.pd-table td){
    background:transparent!important;
    color:var(--theme-text)!important;
    border-color:var(--theme-border-soft)!important;
}
html[data-theme] :is(.ftable tr:hover td,.faction-members-table tr:hover td,.pd-table tr:hover td){
    background:rgba(var(--theme-accent-rgb),.045)!important;
}
html[data-theme] :is(
    .faction-page-btn,.pd-btn,.li-actions a,.li-actions button,
    .lstr-filter-btn,.faction-log-tab,.lstr-tab,.li-tab,.gang-storage-tabs a
){
    border-color:var(--theme-border)!important;
    background:var(--theme-surface-2)!important;
    color:var(--theme-text)!important;
    box-shadow:none!important;
}
html[data-theme] :is(
    .faction-page-btn:hover,.pd-btn:hover,.li-actions a:hover,.li-actions button:hover,
    .lstr-filter-btn:hover,.faction-log-tab:hover,.lstr-tab:hover,.li-tab:hover
){
    border-color:var(--theme-border-strong)!important;
    background:var(--theme-accent-soft-2)!important;
}
html[data-theme] :is(
    .faction-page-btn.active,.pd-btn:not(.pd-btn-secondary):not(.pd-btn-danger),
    .faction-log-tab.active,.lstr-tab.active,.li-tab.active,.gang-storage-tabs .active
){
    background:linear-gradient(135deg,var(--theme-accent),var(--theme-accent-2))!important;
    border-color:transparent!important;
    color:#fff!important;
}
html[data-theme] :is(
    .fpage input,.fpage select,.fpage textarea,
    .faction-info-page input,.faction-info-page select,.faction-info-page textarea,
    .pd-form input,.pd-form select,.pd-form textarea,
    .li-form input,.li-form select,.li-form textarea,
    .faction-log-search,.storage-search
){
    background:var(--theme-input)!important;
    border-color:var(--theme-border)!important;
    color:var(--theme-text)!important;
}
html[data-theme] :is(
    .fpage input,.fpage select,.fpage textarea,
    .faction-info-page input,.faction-info-page select,.faction-info-page textarea,
    .pd-form input,.pd-form select,.pd-form textarea,
    .li-form input,.li-form select,.li-form textarea,
    .faction-log-search,.storage-search
):focus{
    border-color:var(--theme-border-strong)!important;
    box-shadow:0 0 0 3px rgba(var(--theme-accent-rgb),.10)!important;
    outline:none!important;
}
html[data-theme] .storage-slot{
    background:
        radial-gradient(circle at 50% 28%,rgba(var(--theme-accent-rgb),.10),transparent 50%),
        linear-gradient(180deg,var(--theme-surface-2),var(--theme-surface))!important;
    border-color:var(--theme-border)!important;
}
html[data-theme] .storage-slot:hover{
    border-color:var(--theme-border-strong)!important;
    background:
        radial-gradient(circle at 50% 28%,rgba(var(--theme-accent-rgb),.16),transparent 54%),
        linear-gradient(180deg,var(--theme-surface-hover),var(--theme-surface-2))!important;
}
html[data-theme] :is(.family-trunk-item,.weapon-stock-card,.lstr-item){
    background:linear-gradient(180deg,var(--theme-surface-2),var(--theme-surface))!important;
    border-color:var(--theme-border)!important;
}
html[data-theme] :is(.family-trunk-item:hover,.weapon-stock-card:hover,.lstr-item:hover){
    border-color:var(--theme-border-strong)!important;
}
html[data-theme] :is(.fempty,.family-empty,.family-trunk-empty,.lstr-empty,.pd-empty){
    color:var(--theme-muted)!important;
}

/* ======================================================================
   FACTION DESIGN INTEGRATION V2
   Alle Fraktionsmodule folgen jetzt der gewählten CP-Akzentfarbe
   ====================================================================== */
html[data-theme] :is(
    .fhero,.fstat,.fcard,.fvehicle,.faction-info-card,.faction-members-table-wrap,
    .pd-panel,.pd-hero-panel,.pd-member-box,.pd-filter-group,.pd-options,.pd-options-grid label,.pd-table-scroll,
    .li-card,.li-panel,.li-modal-card,.li-mini,.lstr-card,.lstr-item,.lstr-filter-box,.lstr-shop-section,
    .storage-frame,.storage-slot,.weapon-stock-card,.weapon-stock-section,.gw-zone,
    .family-section,.family-stat,.family-vehicle-card,.family-vehicle-modal-box,.family-trunk-item
){
    background:radial-gradient(circle at 100% 0%,rgba(var(--theme-accent-rgb),.045),transparent 34%),linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
    border-color:var(--theme-border)!important;color:var(--theme-text)!important;box-shadow:var(--theme-shadow)!important;
}
html[data-theme] :is(.storage-head,.storage-foot,.fcard-head,.faction-info-card-head,.family-section-head,.family-vehicle-head,.family-vehicle-modal-head,.lstr-shop-head,.weapon-stock-section-title,.pd-toolbar,.pd-member-box-head){
    background:var(--theme-surface-3)!important;border-color:var(--theme-border)!important;color:var(--theme-text)!important;
}
html[data-theme] :is(.fpage input,.fpage select,.fpage textarea,.faction-info-page input,.faction-info-page select,.faction-info-page textarea,.pd-form input,.pd-form select,.pd-form textarea,.pd-entry-form input,.pd-entry-form select,.pd-entry-form textarea,.pd-filter-group input,.pd-filter-group select,.li-form input,.li-form select,.li-form textarea,.li-body input,.li-body select,.li-body textarea,.faction-log-search,.storage-search input){
    background:var(--theme-input)!important;border-color:var(--theme-border)!important;color:var(--theme-text)!important;box-shadow:none!important;
}
html[data-theme] :is(.fpage input,.fpage select,.fpage textarea,.faction-info-page input,.faction-info-page select,.faction-info-page textarea,.pd-form input,.pd-form select,.pd-form textarea,.pd-entry-form input,.pd-entry-form select,.pd-entry-form textarea,.pd-filter-group input,.pd-filter-group select,.li-form input,.li-form select,.li-form textarea,.li-body input,.li-body select,.li-body textarea,.faction-log-search,.storage-search input):focus{
    border-color:var(--theme-border-strong)!important;box-shadow:0 0 0 3px rgba(var(--theme-accent-rgb),.11)!important;outline:none!important;
}
html[data-theme] :is(.pd-form select option,.li-form select option,.li-body select option){background:var(--theme-surface-2)!important;color:var(--theme-text)!important}
html[data-theme] :is(.pd-form input[type="checkbox"],.pd-options input,.pd-options-grid input){accent-color:var(--theme-accent)!important}
html[data-theme] :is(.pd-form label,.li-form label,.li-body label,.faction-members-note,.faction-members-legend,.faction-log-detail,.faction-page-info,.storage-info,.storage-brand small,.storage-foot,.lstr-card-key,.lstr-stock-line,.lstr-state,.lstr-empty,.weapon-stock-time,.weapon-stock-section-title span,.pd-byline,.pd-table-note,.pd-filter-label,.pd-pagination,.li-muted,.li-hint){color:var(--theme-muted)!important}
html[data-theme] :is(.pd-panel h3,.pd-member-name,.pd-toolbar-title,.pd-entry-title,.storage-brand strong,.storage-info strong,.storage-name,.lstr-card-name,.lstr-card-value,.lstr-shop-head strong,.weapon-stock-name,.weapon-stock-section-title,.faction-member-name,.faction-info-name,.family-vehicle-body strong,.family-trunk-title strong){color:var(--theme-text)!important}
html[data-theme] :is(.pd-counter,.pd-tag,.faction-log-source,.faction-rank-pill,.storage-count,.storage-brand-icon,.storage-fallback,.lstr-card-value,.lstr-stock-line strong,.weapon-stock-pill,.weapon-stock-count,.weapon-stock-fallback,.gw-badge,.li-event,.li-price-preview){background:var(--theme-accent-soft)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-accent-2)!important}
html[data-theme] :is(.pd-btn:not(.pd-btn-secondary):not(.pd-btn-danger),.faction-page-btn.active,.faction-log-tab.active,.lstr-filter-btn.active,.lstr-tab.active,.li-tab.active,.gang-storage-tabs a.is-active,.family-chip.active){background:linear-gradient(135deg,var(--theme-accent),var(--theme-accent-2))!important;border-color:transparent!important;color:#fff!important;box-shadow:0 8px 22px rgba(var(--theme-accent-rgb),.18)!important}
html[data-theme] :is(.faction-page-btn,.faction-log-tab,.lstr-filter-btn,.lstr-tab,.li-tab,.li-pages a,.li-pages span,.gang-storage-tabs a,.family-chip,.pd-btn-secondary,.li-mini){background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important;color:var(--theme-muted)!important;box-shadow:none!important}
html[data-theme] :is(.faction-page-btn,.faction-log-tab,.lstr-filter-btn,.lstr-tab,.li-tab,.li-pages a,.gang-storage-tabs a,.family-chip,.pd-btn-secondary,.li-mini):hover{background:var(--theme-accent-soft-2)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-text)!important}
html[data-theme] :is(.gang-storage-tabs,.lstr-tabs,.lstr-main-tabs,.faction-log-tabs,.li-tabs){background:var(--theme-surface)!important;border-color:var(--theme-border)!important;box-shadow:none!important}
html[data-theme] :is(.ftable,.faction-members-table,.pd-table){color:var(--theme-text)!important}
html[data-theme] :is(.ftable thead th,.faction-members-table thead th,.pd-table thead th){background:var(--theme-surface-3)!important;color:var(--theme-muted)!important;border-color:var(--theme-border)!important}
html[data-theme] :is(.ftable tbody tr,.faction-members-table tbody tr,.pd-table tbody tr){background:transparent!important}
html[data-theme] :is(.ftable tbody tr:nth-child(even),.faction-members-table tbody tr:nth-child(even),.pd-table tbody tr:nth-child(even)){background:rgba(var(--theme-accent-rgb),.022)!important}
html[data-theme] :is(.ftable tbody tr:hover,.faction-members-table tbody tr:hover,.pd-table tbody tr:hover){background:rgba(var(--theme-accent-rgb),.065)!important}
html[data-theme] :is(.ftable td,.faction-members-table td,.pd-table td){background:transparent!important;border-color:var(--theme-border-soft)!important;color:var(--theme-text)!important}
html[data-theme] .faction-members-table th:first-child{background:var(--theme-surface-3)!important}
html[data-theme] .faction-members-table td:first-child{background:color-mix(in srgb,var(--theme-surface) 97%,var(--theme-accent) 3%)!important}
html[data-theme] .pd-options{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important}
html[data-theme] .pd-options label{color:var(--theme-text)!important}
html[data-theme] .pd-options label:hover{background:var(--theme-accent-soft)!important}
html[data-theme] .pd-options-grid label{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important}
html[data-theme] .pd-options-grid label:hover{background:var(--theme-accent-soft)!important;border-color:var(--theme-border-strong)!important}
html[data-theme] .storage-frame{background:radial-gradient(circle at 100% 0%,rgba(var(--theme-accent-rgb),.08),transparent 34%),linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important}
html[data-theme] .storage-head{background:color-mix(in srgb,var(--theme-surface-3) 96%,var(--theme-accent) 4%)!important}
html[data-theme] .storage-slot{background:radial-gradient(circle at 50% 18%,rgba(var(--theme-accent-rgb),.12),transparent 48%),linear-gradient(180deg,color-mix(in srgb,var(--theme-surface-2) 95%,var(--theme-accent) 5%),var(--theme-surface))!important;border-color:var(--theme-border)!important}
html[data-theme] .storage-slot:hover{background:radial-gradient(circle at 50% 18%,rgba(var(--theme-accent-rgb),.18),transparent 52%),linear-gradient(180deg,color-mix(in srgb,var(--theme-surface-hover) 90%,var(--theme-accent) 10%),var(--theme-surface-2))!important;border-color:var(--theme-border-strong)!important}
html[data-theme] .storage-no{background:rgba(var(--theme-accent-rgb),.055)!important;color:var(--theme-muted)!important}
html[data-theme] .lstr-item{background:radial-gradient(circle at 50% 20%,rgba(var(--theme-accent-rgb),.08),transparent 50%),linear-gradient(180deg,var(--theme-surface-2),var(--theme-surface))!important}
html[data-theme] .lstr-item:hover{border-color:var(--theme-border-strong)!important}
html[data-theme] .lstr-state{background:var(--theme-surface-2)!important;border-color:var(--theme-border)!important}
html[data-theme] :is(.family-vehicle-card,.family-trunk-item,.faction-vehicle-slot){background:radial-gradient(circle at 100% 0%,rgba(var(--theme-accent-rgb),.055),transparent 34%),linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;border-color:var(--theme-border)!important}
html[data-theme] :is(.family-vehicle-card:hover,.family-trunk-item:hover,.faction-vehicle-slot:hover){border-color:var(--theme-border-strong)!important}
html[data-theme] .family-vehicle-openhint{color:var(--theme-accent-2)!important}
html[data-theme] .weapon-stock-card{background:radial-gradient(circle at 50% 10%,rgba(var(--theme-accent-rgb),.09),transparent 42%),linear-gradient(180deg,var(--theme-surface-2),var(--theme-surface))!important}
html[data-theme] .weapon-stock-card:hover{border-color:var(--theme-border-strong)!important}
html[data-theme] .gw-zone.mine{border-color:var(--theme-border-strong)!important;background:linear-gradient(180deg,color-mix(in srgb,var(--theme-surface-2) 88%,var(--theme-accent) 12%),var(--theme-surface))!important}
html[data-theme] .li-price-preview{background:var(--theme-accent-soft)!important;border-color:var(--theme-border-strong)!important;color:var(--theme-accent-2)!important}
html[data-theme] .li-event{color:var(--theme-accent-2)!important}
html[data-theme] .li-mini:not(.danger){color:var(--theme-text)!important}
html[data-theme] :is(.pd-table-scroll,.faction-members-table-wrap,.ftable-wrap){scrollbar-color:rgba(var(--theme-accent-rgb),.50) rgba(255,255,255,.03)!important}
html[data-theme] :is(.pd-table-scroll,.faction-members-table-wrap,.ftable-wrap)::-webkit-scrollbar-thumb{background:rgba(var(--theme-accent-rgb),.50)!important}

/* ======================================================================
   ADMINBEREICH – CP THEME INTEGRATION
   Alle Adminmodule folgen der aktuell gewählten Akzentfarbe.
   ====================================================================== */
html[data-theme] :is(
  .adm-hero,.adm-card,
  .an-card,.an-panel,
  .ar-head,.ar-panel,
  .cp-rights-intro,.cp-rights-stat,.cp-member,.cp-right,
  .gr-card,
  .il-box,.il-json,
  .logs-hero,.logs-filter-card,.logs-panel,.logs-row,.logs-detail,
  .minutes-side,.minutes-paper,.minutes-list a,.topic-editor,
  .player-list,.player-list-row,.player-summary-card,.player-modal-card,.player-right-note,
  .ticket-list,.ticket-row,.ticket-stat,.ticket-detail,.ticket-modal-card,.ticket-msg,
  .card
){border-color:var(--theme-border)!important}

html[data-theme] :is(
  .adm-hero,.adm-card,
  .an-card,.an-panel,
  .ar-head,.ar-panel,
  .cp-rights-intro,.cp-rights-stat,.cp-member,
  .gr-card,.il-box,
  .logs-hero,.logs-filter-card,.logs-panel,.logs-detail,
  .minutes-side,.minutes-paper,
  .player-list,.player-summary-card,.player-modal-card,
  .ticket-list,.ticket-stat,.ticket-detail,.ticket-modal-card
){
  background:linear-gradient(180deg,var(--theme-surface),var(--theme-surface-2))!important;
  color:var(--theme-text)!important;
}

html[data-theme] :is(
  .adm-card,.cp-right,.gr-opt,.minutes-list a,.topic-editor,
  .player-list-row,.ticket-row,.ticket-msg,.il-json,.logs-stat
){
  background:color-mix(in srgb,var(--theme-surface-2) 96%,var(--theme-accent) 4%)!important;
  border-color:var(--theme-border)!important;
}
html[data-theme] :is(.adm-card:hover,.cp-right:hover,.gr-opt:hover,.minutes-list a:hover,.player-list-row:hover,.ticket-row:hover){
  background:var(--theme-surface-hover)!important;
  border-color:var(--theme-border-strong)!important;
}

html[data-theme] :is(
 .adm-card strong,.adm-hero h2,
 .an-card strong,.an-panel h2,
 .ar-head h2,
 .cp-member-ident strong,.cp-right strong,.cp-rights-stat strong,
 .gr-name strong,.gr-hero h2,
 .il h2,.il-hit strong,
 .logs-hero h2,.logs-filter-head strong,
 .minutes-side-head strong,.minutes-paper-head h2,.minutes-topic-title,
 .player-name,.player-section-title,.player-summary-card strong,
 .ticket-title,.ticket-modal-card strong,.ticket-conversation-head strong
){color:var(--theme-text)!important}

html[data-theme] :is(
 .adm-card span,.adm-hero p,.adm-card-count,
 .an-card span,.an-row span,
 .ar-head p,.ar-meta,.ar-empty,
 .cp-rights-intro p,.cp-right-group-title,.cp-right small,.cp-member-ident small,.cp-form-foot small,.cp-empty,
 .gr-hero p,.gr-name small,
 .il p,.il-hit small,.il-json,
 .logs-hero p,.logs-field label,.logs-filter-head span,.logs-stat span,
 .minutes-paper-head p,.minutes-meta-label,.minutes-list-date,.minutes-empty,
 .player-created,.player-view-only,.player-right-note,
 .ticket-date,.ticket-empty
){color:var(--theme-muted)!important}

html[data-theme] :is(
 .adm-card:hover,.adm-pill.on,
 .ar-tab.on,
 .cp-member.auto-full,.cp-badge.level8,.cp-badge.test,.cp-auto-note,.cp-btn,.cp-right-ico,
 .gr-level8-note,
 .logs-source-tabs a.active,.logs-btn:not(.secondary),
 .minutes-new,.minutes-btn.primary,
 .player-tab-btn.active,.player-open-pill,
 .ticket-open,.ticket-status.open
){
  border-color:var(--theme-border-strong)!important;
  background:var(--theme-accent-soft)!important;
  color:var(--theme-accent-2)!important;
}

html[data-theme] :is(
 .ar-tools button,.il button,.cp-btn:not(.secondary),
 .btn,
 .logs-btn:not(.secondary),
 .player-modal-actions .btn,
 .ticket-action-buttons .btn
){
  background:linear-gradient(135deg,var(--theme-accent),var(--theme-accent-2))!important;
  border-color:transparent!important;
  color:#fff!important;
}

html[data-theme] :is(
 .ar-tab,.cp-btn.secondary,.minutes-btn:not(.primary):not(.danger),
 .player-tab-btn,.logs-source-tabs a
){
  background:var(--theme-surface-2)!important;
  border-color:var(--theme-border)!important;
  color:var(--theme-muted)!important;
}
html[data-theme] :is(.ar-tab,.cp-btn.secondary,.minutes-btn:not(.primary):not(.danger),.player-tab-btn,.logs-source-tabs a):hover{
  background:var(--theme-accent-soft)!important;
  border-color:var(--theme-border-strong)!important;
  color:var(--theme-text)!important;
}

html[data-theme] :is(
 .ar-tools input,
 .il input,
 .gr-level select,.gr-add select,
 .logs-field input,.logs-field select,
 .minutes-field input,.minutes-field textarea,.topic-editor input,.topic-editor textarea,.item-row input[type=text],.item-row select,
 .player-toolbar input,.player-toolbar select,.player-modal input,.player-modal select,.player-modal textarea,
 .ticket-filter input,.ticket-filter select,.ticket-reply textarea
){
  background:var(--theme-input)!important;
  border-color:var(--theme-border)!important;
  color:var(--theme-text)!important;
}
html[data-theme] :is(
 .ar-tools input,.il input,.gr-level select,.gr-add select,
 .logs-field input,.logs-field select,
 .minutes-field input,.minutes-field textarea,.topic-editor input,.topic-editor textarea,.item-row input[type=text],.item-row select,
 .player-toolbar input,.player-toolbar select,.player-modal input,.player-modal select,.player-modal textarea,
 .ticket-filter input,.ticket-filter select,.ticket-reply textarea
):focus{
  outline:none!important;
  border-color:var(--theme-border-strong)!important;
  box-shadow:0 0 0 3px rgba(var(--theme-accent-rgb),.10)!important;
}
html[data-theme] :is(.gr-opt input,.cp-right input){accent-color:var(--theme-accent)!important}

html[data-theme] :is(.ar-table th,.player-list-head,.ticket-head){
  background:var(--theme-surface-3)!important;
  color:var(--theme-muted)!important;
  border-color:var(--theme-border)!important;
}
html[data-theme] :is(.ar-table td,.ar-table th,.ticket-row,.player-list-row){border-color:var(--theme-border)!important}

html[data-theme] .cp-avatar{
  background:linear-gradient(135deg,var(--theme-accent),var(--theme-accent-2))!important;
}
html[data-theme] :is(.logs-kicker,.logs-source-tabs a.active .count,.player-level,.player-badge,.players-count){color:var(--theme-accent-2)!important}
html[data-theme] :is(.player-open-pill,.player-badge,.players-count){border-color:var(--theme-border-strong)!important;background:var(--theme-accent-soft)!important}

/* semantische Statusfarben bleiben bewusst eigenständig */


/* ADMIN FILTER-/SUCHBUTTONS – zentrale Theme-Regel */
html[data-theme] :is(
    .player-toolbar,
    .ticket-filter,
    .logs-filter-grid,
    .sw-search,
    .inv-search-form
) :is(
    button[type="submit"],
    .btn:not(.secondary),
    .logs-btn:not(.secondary),
    .sw-action,
    .inv-search-submit
){
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb,var(--theme-accent,#8367ff) 84%,white 16%),
            var(--theme-accent,#8367ff)
        )!important;
    background-color:var(--theme-accent,#8367ff)!important;
    border-color:color-mix(in srgb,var(--theme-accent,#8367ff) 72%,var(--theme-border,transparent))!important;
    color:var(--theme-accent-text,#fff)!important;
    -webkit-text-fill-color:var(--theme-accent-text,#fff)!important;
    text-shadow:none!important;
    box-shadow:0 7px 16px rgba(var(--theme-accent-rgb,131,103,255),.16)!important;
    opacity:1!important;
}
html[data-theme] :is(
    .player-toolbar,
    .ticket-filter,
    .logs-filter-grid,
    .sw-search,
    .inv-search-form
) :is(
    button[type="submit"],
    .btn:not(.secondary),
    .logs-btn:not(.secondary),
    .sw-action,
    .inv-search-submit
):hover{
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb,var(--theme-accent,#8367ff) 76%,white 24%),
            color-mix(in srgb,var(--theme-accent,#8367ff) 92%,white 8%)
        )!important;
    color:var(--theme-accent-text,#fff)!important;
    -webkit-text-fill-color:var(--theme-accent-text,#fff)!important;
}


/* BESTENLISTE – Hover folgt der aktuellen Theme-Farbe */
html[data-theme] body .leaderboard-page .lb-table tbody tr:hover{
    background:
        linear-gradient(
            90deg,
            rgba(var(--theme-accent-rgb,117,110,231),.18) 0%,
            rgba(var(--theme-accent-rgb,117,110,231),.09) 34%,
            color-mix(in srgb,var(--theme-surface-2,#131d29) 94%,var(--theme-accent,#8367ff) 6%) 68%,
            color-mix(in srgb,var(--theme-surface,#0d141c) 97%,var(--theme-accent,#8367ff) 3%) 100%
        )!important;
}
html[data-theme] body .leaderboard-page .lb-table tbody tr:hover > td{
    background:transparent!important;
    background-color:transparent!important;
    background-image:none!important;
}


/* HAUPT-DASHBOARD – Skyline nur im "Mein Bereich"-Hero */
html[data-theme]:not([data-theme="halloween"]) body .dashboard-hero.dashboard-hero-modern{
    background:
        linear-gradient(90deg,
            rgba(7,12,20,.66) 0%,
            rgba(7,12,20,.47) 31%,
            rgba(7,12,20,.15) 58%,
            rgba(7,12,20,.40) 100%),
        linear-gradient(180deg,
            rgba(var(--theme-accent-rgb,131,103,255),.05),
            rgba(4,8,16,.17)),
        url('dashboard-city-hero.png') center center / cover no-repeat,
        linear-gradient(118deg,
            color-mix(in srgb,#071018 86%,var(--theme-accent,#8367ff) 14%) 0%,
            color-mix(in srgb,#0b1820 82%,var(--theme-accent,#8367ff) 18%) 52%,
            color-mix(in srgb,#07131a 86%,var(--theme-accent,#8367ff) 14%) 100%)!important;
    border-color:rgba(var(--theme-accent-rgb,131,103,255),.24)!important;
}
html[data-theme="custom"] body .dashboard-hero.dashboard-hero-modern{
    background:
        linear-gradient(90deg,
            rgba(7,12,20,.64) 0%,
            rgba(7,12,20,.44) 30%,
            rgba(7,12,20,.12) 57%,
            rgba(7,12,20,.38) 100%),
        linear-gradient(180deg,
            rgba(var(--theme-accent-rgb,131,103,255),.07),
            rgba(4,8,16,.15)),
        url('dashboard-city-hero.png') center center / cover no-repeat,
        linear-gradient(118deg,
            color-mix(in srgb,#071018 84%,var(--theme-accent,#8367ff) 16%) 0%,
            color-mix(in srgb,#0b1820 80%,var(--theme-accent,#8367ff) 20%) 52%,
            color-mix(in srgb,#07131a 84%,var(--theme-accent,#8367ff) 16%) 100%)!important;
}

















.theme-dot--christmas{
    background:linear-gradient(135deg,#b91f31 0 38%,#175f3b 38% 70%,#e4bd5a 70% 100%)!important;
}
















.theme-dot--easter{
    background:linear-gradient(135deg,#c98ae8 0 32%,#71d6b8 32% 64%,#f2d37b 64% 82%,#ef9fc4 82% 100%)!important;
}























html[data-theme="halloween"] .sidebar{
    background:
        linear-gradient(180deg,rgba(10,8,13,.985),rgba(8,7,11,.985)),
        url('assets/empty.svg') center bottom/cover no-repeat!important;
}
html[data-theme="halloween"] body .dashboard-hero.dashboard-hero-modern,
html[data-theme="halloween"] .page-header,
html[data-theme="halloween"] .lb-head{
    background:
        linear-gradient(135deg,rgba(18,10,16,.84),rgba(26,11,14,.70)),
        url('assets/empty.svg') center center/cover no-repeat!important;
    border-color:rgba(255,140,46,.25)!important;
}
html[data-theme="halloween"] :is(.dashboard-card,.dashboard-stat-card,.dashboard-mini-card,.dashboard-status-mini,.dashboard-info-grid .dashboard-info-row,.dashboard-datetime,.dashboard-empty,.vehicle-row,.vehicle-card,.rare-card,.market-card,.office-summary-card,.office-stat-card,.inventory-slot,.slot,.item-slot,.item-card){
    background:linear-gradient(180deg,rgba(19,13,22,.97),rgba(11,9,16,.97))!important;
}
html[data-theme="halloween"] .nav-link.active{box-shadow:0 10px 24px rgba(255,140,46,.20)!important}














html[data-theme="halloween"] .sidebar{background:linear-gradient(180deg,rgba(7,6,11,.97),rgba(8,6,12,.99))!important;border-right:1px solid rgba(255,140,46,.18)!important}
html[data-theme="halloween"] .sidebar::before{background:url('empty.svg') center/cover no-repeat!important}
html[data-theme="halloween"] .sidebar .nav-group a.active{background:linear-gradient(135deg,rgba(255,140,46,.18),rgba(163,92,255,.12))!important;border-color:rgba(255,140,46,.25)!important}








/* =========================================================
   SIDEBAR FULLHEIGHT FIX
   Desktop: volle Viewport-Höhe, Menü scrollt intern,
   Profil/Logout bleiben immer unten sichtbar.
   ========================================================= */
@media (min-width:981px){
    .app-shell{
        min-height:100dvh!important;
        align-items:stretch!important;
    }

    

    

    .sidebar-footer,
    html[data-theme] .sidebar-footer{
        flex:0 0 auto!important;
        margin-top:auto!important;
        position:relative!important;
        bottom:auto!important;
        min-height:0!important;
    }
}



    .sidebar-scroll,
    html[data-theme] .sidebar-scroll{
        height:auto!important;
        max-height:none!important;
        overflow:visible!important;
        flex:none!important;
        padding-right:0!important;
    }

    .sidebar-footer,
    html[data-theme] .sidebar-footer{
        margin-top:18px!important;
    }
}





















    
}














html[data-theme="halloween"] .sidebar-scroll::before{
    background:url('empty.svg') top center / 100% auto no-repeat!important;
}








/* SIDEBAR SCROLL FINAL FIX */
@media (min-width:981px){
    .app-shell{min-height:100dvh!important;align-items:stretch!important;}
    .sidebar,
    html[data-theme] .sidebar,
    html[data-theme="halloween"] .sidebar{
        position:sticky!important;
        top:0!important;
        width:300px!important;
        height:100dvh!important;
        min-height:100dvh!important;
        max-height:100dvh!important;
        box-sizing:border-box!important;
        display:flex!important;
        flex-direction:column!important;
        justify-content:flex-start!important;
        align-self:flex-start!important;
        overflow:hidden!important;
    }
    .sidebar-scroll,
    html[data-theme] .sidebar-scroll,
    html[data-theme="halloween"] .sidebar-scroll{
        display:block!important;
        position:relative!important;
        min-height:0!important;
        height:auto!important;
        max-height:none!important;
        flex:1 1 0%!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
        padding-right:5px!important;
        overscroll-behavior:contain;
        scrollbar-width:thin;
    }
    .sidebar-footer,
    html[data-theme] .sidebar-footer,
    html[data-theme="halloween"] .sidebar-footer{
        position:relative!important;
        flex:0 0 auto!important;
        margin-top:0!important;
        bottom:auto!important;
        z-index:5!important;
    }
}
@media (max-width:980px){
    .sidebar,
    html[data-theme] .sidebar,
    html[data-theme="halloween"] .sidebar{
        position:static!important;
        width:100%!important;
        height:auto!important;
        min-height:0!important;
        max-height:none!important;
        overflow:visible!important;
    }
    .sidebar-scroll,
    html[data-theme] .sidebar-scroll,
    html[data-theme="halloween"] .sidebar-scroll{
        height:auto!important;
        max-height:none!important;
        overflow:visible!important;
        flex:none!important;
        padding-right:0!important;
    }
    .sidebar-footer,
    html[data-theme] .sidebar-footer,
    html[data-theme="halloween"] .sidebar-footer{
        margin-top:18px!important;
    }
}

/* HALLOWEEN SIDEBAR FINAL - matching dashboard mockup */
html[data-theme="halloween"] .sidebar{background:radial-gradient(circle at 100% 12%,rgba(120,48,150,.09),transparent 26%),linear-gradient(180deg,#0a090e 0%,#08070c 100%)!important;border-right:1px solid rgba(255,105,34,.16)!important;box-shadow:14px 0 34px rgba(0,0,0,.22)!important}
html[data-theme="halloween"] .sidebar::before{content:none!important;display:none!important;background:none!important}
html[data-theme="halloween"] .sidebar-scroll{position:relative!important}
html[data-theme="halloween"] .sidebar-scroll::before{content:""!important;display:block!important;position:absolute!important;left:0!important;right:0!important;top:0!important;height:180px!important;pointer-events:none!important;z-index:0!important;background:radial-gradient(circle at 100% 0,rgba(255,101,30,.11),transparent 38%),radial-gradient(circle at 0 18%,rgba(130,60,189,.09),transparent 36%)!important}
html[data-theme="halloween"] .sidebar-scroll>*{position:relative!important;z-index:1!important}
html[data-theme="halloween"] .nav-link{border-color:transparent!important}
html[data-theme="halloween"] .nav-link:hover{background:linear-gradient(90deg,rgba(255,111,38,.08),rgba(133,61,194,.055))!important;color:#f8f0fb!important}
html[data-theme="halloween"] .nav-link.active,html[data-theme="halloween"] .sidebar .nav-group a.active{color:#ff9c4b!important;background:linear-gradient(90deg,rgba(255,103,31,.15),rgba(128,59,190,.13))!important;border:1px solid rgba(255,106,34,.30)!important;box-shadow:0 8px 22px rgba(0,0,0,.22),inset 3px 0 0 #ff7526!important}
html[data-theme="halloween"] .sidebar-footer{background:linear-gradient(180deg,rgba(17,11,22,.98),rgba(8,7,12,.99))!important;border-top:1px solid rgba(255,106,34,.16)!important}
html[data-theme="halloween"] .profile-card{background:linear-gradient(135deg,rgba(64,22,29,.42),rgba(40,17,50,.30))!important;border-color:rgba(255,105,34,.17)!important}
html[data-theme="halloween"] *::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(255,111,38,.58),rgba(136,65,201,.50))!important}

/* =========================================================
   HALLOWEEN 2026 - FINAL THEME MATCHING APPROVED MOCKUP
   ========================================================= */
html[data-theme="halloween"] body{
  background:#08070c!important;
}
html[data-theme="halloween"] .content{
  background:
    radial-gradient(circle at 12% 5%,rgba(116,48,148,.07),transparent 22%),
    radial-gradient(circle at 92% 0,rgba(255,92,26,.055),transparent 24%),
    #09080d!important;
}
html[data-theme="halloween"] .sidebar{
  background:linear-gradient(180deg,#0a090f 0%,#08070c 100%)!important;
  border-right:1px solid rgba(255,105,34,.18)!important;
  box-shadow:12px 0 32px rgba(0,0,0,.26)!important;
}
html[data-theme="halloween"] .sidebar::before{content:none!important;display:none!important}
html[data-theme="halloween"] .sidebar-scroll{position:relative!important}
html[data-theme="halloween"] .sidebar-scroll::before{
  content:""!important;display:block!important;position:absolute!important;left:0!important;right:0!important;top:0!important;height:260px!important;
  background:url('empty.svg') top center/100% auto no-repeat!important;pointer-events:none!important;z-index:0!important;opacity:.9!important;
}
html[data-theme="halloween"] .sidebar-scroll>*{position:relative!important;z-index:1!important}
html[data-theme="halloween"] .nav-link:hover{background:linear-gradient(90deg,rgba(255,111,36,.075),rgba(135,63,194,.055))!important}
html[data-theme="halloween"] .nav-link.active,
html[data-theme="halloween"] .nav-submenu-link.active{
  color:#ff9d4e!important;background:linear-gradient(90deg,rgba(255,100,29,.17),rgba(126,58,185,.14))!important;
  border-color:rgba(255,112,37,.34)!important;box-shadow:inset 3px 0 0 #ff7626,0 8px 22px rgba(0,0,0,.22)!important;
}
html[data-theme="halloween"] .sidebar-footer{
  background:linear-gradient(180deg,rgba(17,10,21,.98),rgba(8,7,12,.995))!important;border-top:1px solid rgba(255,102,30,.19)!important;
}
html[data-theme="halloween"] .profile-card{background:linear-gradient(135deg,rgba(63,21,31,.44),rgba(43,18,54,.34))!important;border-color:rgba(255,107,35,.17)!important}
html[data-theme="halloween"] *::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(255,111,36,.66),rgba(132,63,196,.58))!important}

/* HALLOWEEN REDESIGN V2 SIDEBAR */
html[data-theme="halloween"] .sidebar{
  background:linear-gradient(180deg,#09080d 0%,#07060a 100%)!important;
  border-right:1px solid rgba(255,102,29,.20)!important;
  box-shadow:14px 0 34px rgba(0,0,0,.30)!important;
}
html[data-theme="halloween"] .sidebar-scroll{
  background:
    radial-gradient(circle at 100% 0,rgba(255,102,29,.13),transparent 21%),
    radial-gradient(circle at 0 12%,rgba(117,47,159,.10),transparent 25%)!important;
  background-attachment:local!important;
}
html[data-theme="halloween"] .sidebar-scroll::before{content:none!important;display:none!important;background:none!important}
html[data-theme="halloween"] .nav-section-title{color:#b8aebb!important}
html[data-theme="halloween"] .nav-link:hover{background:linear-gradient(90deg,rgba(255,101,28,.09),rgba(128,49,185,.07))!important;color:#fff5ee!important}
html[data-theme="halloween"] .nav-link.active,
html[data-theme="halloween"] .nav-submenu-link.active{
  color:#ffad5f!important;
  background:linear-gradient(90deg,rgba(255,96,26,.20),rgba(120,48,180,.17))!important;
  border-color:rgba(255,107,30,.42)!important;
  box-shadow:inset 3px 0 0 #ff6e20,0 8px 22px rgba(0,0,0,.24)!important;
}
html[data-theme="halloween"] .sidebar-footer{background:linear-gradient(180deg,rgba(20,10,21,.99),rgba(7,6,10,.995))!important;border-top:1px solid rgba(255,101,28,.20)!important}
html[data-theme="halloween"] .profile-card{background:linear-gradient(135deg,rgba(67,21,31,.52),rgba(43,17,58,.42))!important;border-color:rgba(255,104,29,.22)!important}

/* HALLOWEEN V4 SIDEBAR */
html[data-theme="halloween"] .sidebar{background:url('empty.svg') top center/100% auto no-repeat,linear-gradient(180deg,#09070c,#07060a)!important;border-right:1px solid rgba(255,102,29,.24)!important}
html[data-theme="halloween"] .sidebar::before{content:none!important;display:none!important}
html[data-theme="halloween"] .nav-link.active{background:linear-gradient(90deg,rgba(255,104,29,.18),rgba(139,56,188,.17))!important;border-color:rgba(255,108,30,.44)!important;color:#ff9b47!important;box-shadow:inset 3px 0 0 #ff7425,0 8px 24px rgba(0,0,0,.25)!important}
html[data-theme="halloween"] .nav-link:hover{background:linear-gradient(90deg,rgba(255,106,31,.09),rgba(137,57,185,.07))!important}
html[data-theme="halloween"] .sidebar-footer{background:linear-gradient(180deg,rgba(22,11,25,.98),rgba(8,7,11,.99))!important;border-top:1px solid rgba(255,105,28,.22)!important}
html[data-theme="halloween"] .profile-card{background:linear-gradient(135deg,rgba(66,21,28,.56),rgba(45,18,58,.40))!important;border-color:rgba(255,105,28,.24)!important}
@media(min-width:981px){html[data-theme="halloween"] .sidebar{height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}html[data-theme="halloween"] .sidebar-scroll{flex:1 1 0%!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important}html[data-theme="halloween"] .sidebar-footer{flex:0 0 auto!important}}

/* HALLOWEEN ORANGE/DARK SIDEBAR FINAL */
html[data-theme="halloween"] .sidebar{
    background:
      url('empty.svg') top center/100% auto no-repeat,
      linear-gradient(180deg,#0a0705,#070604)!important;
    border-right-color:rgba(255,104,29,.24)!important;
}
html[data-theme="halloween"] .nav-link.active{
    color:#ff9a43!important;
    background:linear-gradient(90deg,rgba(255,102,29,.19),rgba(89,31,9,.13))!important;
    border-color:rgba(255,108,30,.44)!important;
    box-shadow:inset 3px 0 0 #ff7425,0 8px 24px rgba(0,0,0,.25)!important;
}
html[data-theme="halloween"] .nav-link:hover{
    background:linear-gradient(90deg,rgba(255,106,31,.10),rgba(80,29,8,.06))!important;
}
html[data-theme="halloween"] .sidebar-footer{
    background:linear-gradient(180deg,rgba(25,13,9,.98),rgba(8,7,5,.99))!important;
    border-top-color:rgba(255,105,28,.22)!important;
}
html[data-theme="halloween"] .profile-card{
    background:linear-gradient(135deg,rgba(68,24,12,.54),rgba(35,14,8,.38))!important;
    border-color:rgba(255,105,28,.24)!important;
}
html[data-theme="halloween"] *::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,rgba(255,111,38,.68),rgba(133,49,15,.60))!important;
}

/* HALLOWEEN SIDEBAR CLEAN FINAL */
html[data-theme="halloween"] .sidebar{background:linear-gradient(180deg,rgba(29,14,9,.22),transparent 18%),linear-gradient(180deg,#090806,#070605)!important;border-right:1px solid rgba(255,105,27,.20)!important}
html[data-theme="halloween"] .sidebar::before,html[data-theme="halloween"] .sidebar::after,html[data-theme="halloween"] .sidebar-scroll::before,html[data-theme="halloween"] .sidebar-scroll::after{content:none!important;display:none!important;background:none!important}
html[data-theme="halloween"] .nav-link.active{color:#ff9a47!important;background:linear-gradient(90deg,rgba(255,105,28,.17),rgba(71,30,15,.12))!important;border-color:rgba(255,111,31,.36)!important;box-shadow:inset 3px 0 0 #ff7423!important}
html[data-theme="halloween"] .nav-link:hover{background:linear-gradient(90deg,rgba(255,107,28,.08),rgba(74,31,15,.04))!important}
@media(min-width:981px){html[data-theme="halloween"] .sidebar{height:100dvh!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}html[data-theme="halloween"] .sidebar-scroll{flex:1 1 0%!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important}html[data-theme="halloween"] .sidebar-footer{flex:0 0 auto!important}}

/* ======================================================================
   VISUAL CLEANUP: keine unnoetigen Balken hinter Item-/Fahrzeugnamen
   ====================================================================== */
html[data-theme] .market-item,
html[data-theme] .market-item:hover{
    background:transparent!important;
    border-color:transparent!important;
    box-shadow:none!important;
}

html[data-theme] .family-vehicle-head,
html[data-theme] .family-page .family-vehicle-head,
html[data-theme] .fpage .family-vehicle-head{
    background:transparent!important;
    border-color:transparent!important;
    box-shadow:none!important;
}

/* Fraktionsmitglieder: kein eigener Hintergrund/Balken hinter der Namensspalte */
html[data-theme] .faction-members-table td:first-child,
html[data-theme="halloween"] .faction-members-table td:first-child{
    background:transparent!important;
}


/* Faction 6: plain Bestand text in vehicle/shop stock cards */
html[data-theme] .lstr-plain-stock-value{
    display:inline-block!important;
    width:auto!important;
    max-width:max-content!important;
    background:none!important;
    background-color:transparent!important;
    background-image:none!important;
    border:0!important;
    box-shadow:none!important;
    padding:0!important;
    border-radius:0!important;
    color:var(--theme-text)!important;
}
html[data-theme] .lstr-plain-stock-value::before,
html[data-theme] .lstr-plain-stock-value::after{
    content:none!important;
    display:none!important;
}