/* Kanonische letzte Designschicht fuer alle Web-Routen. */

:root {
    --xxx-content-max: 1580px;
    --xxx-panel-deep: #0b1322;
    --xxx-panel-row: #101b2f;
    --xxx-panel-row-alt: #132039;
    --xxx-panel-hover: #182a46;
}

body[data-xxx-route] #view-container {
    color: var(--xxx-muted) !important;
    background: transparent !important;
}

body[data-xxx-route] #view-container > * {
    box-sizing: border-box;
}

#home-dashboard,
#scanner-static-workspace,
#xxx-database-page,
#analytics-primary-shell,
#raid-targets-page,
.wanted-page,
#meteor-workspace,
#drone-center,
#raid-assist-page,
#crew-view-root {
    width: min(100%, var(--xxx-content-max)) !important;
    max-width: var(--xxx-content-max) !important;
    min-width: 0 !important;
    margin-inline: auto !important;
    box-sizing: border-box !important;
}

body[data-xxx-route] #view-container :where(
    .home-intel-card,
    .raid-page-head,
    .raid-filter-card,
    .raid-summary-grid article,
    .raid-desktop-table,
    .raid-mobile-card,
    .wanted-card,
    .wanted-overview-card,
    .wanted-info-card,
    .xxx-panel,
    .xxx-page-title,
    .xxx-alliance-card,
    .xxx-alliance-stat,
    .xxx-profile-tabs,
    .xxx-profile-panel > *,
    .xxx-fleet-panel,
    #db-filter-content,
    #analytics-player-focus,
    #analytics-overall-stats > div,
    #analytics-overall-stats > section,
    #meteor-workspace > section,
    #drone-center > section,
    #raid-assist-page > header
) {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface) !important;
    box-shadow: none !important;
}

body[data-xxx-route] #view-container :where(button,input,select,textarea,[class*="rounded"]):not(.rounded-full):not([class~="rounded-full"]) {
    border-radius: 0 !important;
}

body[data-xxx-route] #view-container input,
body[data-xxx-route] #view-container select,
body[data-xxx-route] #view-container textarea {
    border-color: var(--xxx-line-strong) !important;
    background: var(--xxx-panel-deep) !important;
    color: var(--xxx-text) !important;
}

body[data-xxx-route] #view-container input:focus,
body[data-xxx-route] #view-container select:focus,
body[data-xxx-route] #view-container textarea:focus {
    border-color: var(--xxx-cyan) !important;
    box-shadow: 0 0 0 1px rgba(79,209,197,.38) !important;
}

body[data-xxx-route] #view-container table thead {
    background: #0c1627 !important;
}
body[data-xxx-route] #view-container table tbody tr { background: var(--xxx-panel-row) !important; }
body[data-xxx-route] #view-container table tbody tr:nth-child(even) { background: var(--xxx-panel-row-alt) !important; }
body[data-xxx-route] #view-container table tbody tr:hover { background: var(--xxx-panel-hover) !important; }
body[data-xxx-route] #view-container table td,
body[data-xxx-route] #view-container table th { border-color: var(--xxx-line) !important; }

/* Startseite */
#home-dashboard > header {
    border-bottom: 1px solid var(--xxx-line) !important;
    background: transparent !important;
}
.home-intel-card { background: var(--xxx-surface) !important; }
.home-intel-card > div:first-child { border-bottom-color: var(--xxx-line) !important; }
#home-near-inactive-table,
#home-departed-table { width: 100%; border-collapse: collapse; text-align: left; }
#home-near-inactive-table thead th,
#home-departed-table thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: #0c1627 !important;
    border-bottom: 1px solid var(--xxx-line-strong);
    white-space: nowrap;
}
#home-near-inactive-table td,
#home-near-inactive-table th { padding: 7px 9px; vertical-align: middle; }
#home-inactive-filter-controls { display: flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
#home-inactive-filter-buttons { display: flex; gap: 3px; }
#home-dashboard [data-home-inactive-days],
#home-dashboard [data-home-vacation-days] {
    min-width: 30px;
    min-height: 30px;
    border: 1px solid var(--xxx-line) !important;
    background: var(--xxx-surface-2) !important;
    color: var(--xxx-muted) !important;
}
#home-dashboard [data-home-inactive-days][data-active="1"],
#home-dashboard [data-home-vacation-days][data-active="1"] {
    border-color: var(--xxx-cyan) !important;
    background: rgba(79,209,197,.12) !important;
    color: var(--xxx-cyan-strong) !important;
}
#home-departed-table tbody tr.xxx-departed-new {
    background: rgba(79,209,197,.09) !important;
    box-shadow: inset 3px 0 0 rgba(79,209,197,.75);
}

/* Galaxiekarte: Schwarz bleibt nur innerhalb des eigentlichen Kartenbilds. */
.scanner-sections-strip,
#scanner-map-layout > aside,
#scanner-map-layout > section,
#scanner-sector-dock-panel,
#scanner-mobile-filter-sheet-head,
#scanner-compact-intel-box,
#radar-filters [id^="radar-section-"] {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface) !important;
    box-shadow: none !important;
}
#box-radar,
#box-radar-filters,
#content-radar { background: transparent !important; box-shadow: none !important; }
#box-radar > .drag-handle,
#box-radar-filters > .drag-handle {
    margin-bottom: 8px;
    border: 1px solid var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface) !important;
}
#content-radar > div:first-child { min-height: 560px !important; padding: 0 !important; background: transparent !important; }
#galaxy-map-viewport,
#galaxy-map { background: #000 !important; }
#galaxy-map-viewport { border: 1px solid var(--xxx-line-strong) !important; border-radius: 0 !important; }
#radar-legend {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: rgba(15,22,38,.96) !important;
}
#radar-filter-flyout,
#scanner-filter-profiles-menu,
#map-search-suggestions {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface-2) !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.28) !important;
}
#radar-filters .xxx-filter-open {
    border-color: rgba(79,209,197,.62) !important;
    box-shadow: inset 3px 0 0 var(--xxx-cyan) !important;
}

/* Datenbank */
body[data-xxx-route="database"] #xxx-database-page > div:last-child,
body[data-xxx-route="database"] #db-table-container,
#db-search-suggestions,
#db-profiles-panel,
#db-pf-panel,
#db-group-entfernung {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface) !important;
    box-shadow: none !important;
}
#db-filter-content section { background: var(--xxx-surface-2) !important; }
#db-group-sektoren > label > div {
    border-color: var(--xxx-line) !important;
    border-radius: 0 !important;
    background: var(--xxx-panel-deep) !important;
    color: var(--xxx-muted) !important;
}
#db-group-sektoren > label > input:checked + div {
    border-color: var(--xxx-cyan) !important;
    background: rgba(79,209,197,.12) !important;
    color: var(--xxx-cyan-strong) !important;
    box-shadow: inset 3px 0 0 var(--xxx-cyan) !important;
}
.xxx-db-summary-item {
    border: 1px solid var(--xxx-line) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface-2) !important;
}

/* Analytik: jede Ebene benutzt exakt dieselbe Inhaltsbreite. */
body[data-xxx-route="analytics"] #analytics-primary-shell {
    width: min(100%, var(--xxx-content-max)) !important;
    max-width: var(--xxx-content-max) !important;
}
body[data-xxx-route="analytics"] #analytics-primary-shell > div:first-child,
body[data-xxx-route="analytics"] #analytics-primary-panel-overall,
body[data-xxx-route="analytics"] #analytics-primary-panel-player,
body[data-xxx-route="analytics"] #analytics-player-focus {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-inline: 0 !important;
    box-sizing: border-box !important;
}
body[data-xxx-route="analytics"] #analytics-primary-shell > div:first-child {
    padding: 8px !important;
    border: 1px solid var(--xxx-line-strong) !important;
    background: var(--xxx-surface) !important;
}
#analytics-primary-shell [data-analytics-primary-tab] {
    min-height: 50px !important;
    border: 1px solid var(--xxx-line) !important;
    background: var(--xxx-panel-deep) !important;
    color: var(--xxx-muted) !important;
}
#analytics-primary-shell [data-analytics-primary-tab]:hover {
    border-color: var(--xxx-line-strong) !important;
    background: var(--xxx-surface-2) !important;
    color: var(--xxx-text) !important;
}
#analytics-primary-shell [data-analytics-primary-tab][data-active="1"] {
    border-color: var(--xxx-cyan) !important;
    background: rgba(79,209,197,.11) !important;
    color: var(--xxx-cyan-strong) !important;
    box-shadow: inset 0 -3px 0 var(--xxx-cyan) !important;
}
#analytics-player-focus { overflow: visible !important; }
#analytics-player-focus > header {
    padding: 16px 18px !important;
    border-bottom: 1px solid var(--xxx-line) !important;
    background: var(--xxx-surface-2) !important;
}
#analytics-player-focus-content { width: 100%; min-width: 0; padding: 12px; }
#profile-charts-container,
.xxx-profile-tab-shell,
.xxx-profile-panel { width: 100%; min-width: 0; }
#xxx-profile-search-row {
    display: grid !important;
    grid-template-columns: minmax(260px,520px) !important;
    align-items: end !important;
    gap: 12px !important;
    width: min(100%,520px) !important;
    max-width: 520px !important;
}
#xxx-profile-search-row[data-compare="1"] {
    grid-template-columns: minmax(260px,520px) 46px minmax(260px,520px) !important;
    width: min(100%,1100px) !important;
    max-width: 1100px !important;
}
#xxx-profile-search-row .search-dropdown,
#xxx-profile-search-row .select-item {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface-2) !important;
}
#xxx-profile-search-row .select-item:hover { background: var(--xxx-panel-hover) !important; }
#xxx-profile-versus {
    display: flex;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    justify-self: center;
    border: 1px solid var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface-2) !important;
    color: var(--xxx-cyan-strong) !important;
    font: 900 11px Consolas,monospace;
}
#xxx-profile-versus.hidden,
#search-container-profile-player-b.hidden { display: none !important; }
#xxx-profile-actions > button,
#xxx-profile-actions > #xxx-profile-compare-toggle {
    display: inline-flex !important;
    width: 100% !important;
    min-height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    border-color: var(--xxx-line-strong) !important;
    background: var(--xxx-surface-2) !important;
}
.xxx-profile-tabs {
    display: grid;
    grid-template-columns: repeat(6,minmax(112px,1fr));
    gap: 1px;
    padding: 1px;
    overflow-x: auto;
    border: 1px solid var(--xxx-line-strong) !important;
    background: var(--xxx-line) !important;
}
.xxx-profile-tab {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 0 !important;
    background: var(--xxx-panel-deep) !important;
    color: var(--xxx-dim) !important;
    font-size: 9px;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}
.xxx-profile-tab[data-active="1"] {
    background: rgba(79,209,197,.12) !important;
    color: var(--xxx-cyan-strong) !important;
    box-shadow: inset 0 -3px 0 var(--xxx-cyan) !important;
}
.xxx-profile-panel { display: none; gap: 12px; }
.xxx-profile-panel[data-active="1"] { display: grid; grid-template-columns: minmax(0,1fr); }
.xxx-profile-panel > * { width: 100%; min-width: 0; margin: 0 !important; }
.xxx-alliance-grid { width: 100%; display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 12px; }
.xxx-alliance-card { grid-column: span 4; min-width: 0; padding: 15px; }
.xxx-alliance-card.full { grid-column: 1/-1; }
.xxx-alliance-stat { min-width: 0; padding: 10px; background: var(--xxx-surface-2) !important; }
.xxx-member-row { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--xxx-line); }
.xxx-empty { width: 100%; padding: 38px 16px; border: 1px dashed var(--xxx-line-strong) !important; border-radius: 0 !important; color: var(--xxx-dim); text-align: center; }
#analytics-overall-stats > div:first-child,
#analytics-overall-stats > section { padding: 12px !important; }
#overall-stats-summary > article { background: var(--xxx-surface-2) !important; }
#overall-stats-chart { width: 100%; max-width: 1240px; margin: 0 auto; }
#overall-stats-chart svg { width: 100% !important; height: 28rem !important; max-height: 28rem !important; }
#overall-stats-table { min-width: 1180px !important; }

/* Flottenakte: keine fast schwarzen Inseln innerhalb der Analytik. */
body[data-xxx-route="analytics"] .xxx-fleet-intel,
body[data-xxx-route="analytics"] .xxx-fleet-panel,
body[data-xxx-route="analytics"] .xxx-fleet-observation,
body[data-xxx-route="analytics"] .xxx-fleet-metric,
body[data-xxx-route="analytics"] .xxx-fleet-matrix-shell {
    background: var(--xxx-surface) !important;
}
body[data-xxx-route="analytics"] .xxx-fleet-observation__points,
body[data-xxx-route="analytics"] .xxx-fleet-matrix,
body[data-xxx-route="analytics"] .xxx-fleet-cell,
body[data-xxx-route="analytics"] .xxx-fleet-hour {
    background: var(--xxx-surface-2) !important;
}
body[data-xxx-route="analytics"] .xxx-fleet-cell.has-fleet { background: #124052 !important; }
body[data-xxx-route="analytics"] .xxx-fleet-cell.has-military { background: #4a1b29 !important; }

/* Raid-Ziele, Pranger, Meteoriten, Drohne, Raid Assist und Crew. */
.raid-mode-switch,
.raid-mode-switch button,
.raid-field input,
.raid-field select,
.raid-input-wrap button,
.raid-chip,
.raid-rank,
.raid-score,
.raid-show-more,
.raid-toast,
.wanted-tab,
.wanted-suggestions,
#meteor-workspace button,
#drone-center article,
#drone-center li,
#drone-center button,
#drone-center textarea,
#raid-assist-host > *,
#crew-view-root .xxx-member-card,
#crew-view-root .xxx-member-avatar,
#crew-view-root button,
#crew-view-root input,
#crew-view-root select {
    border-radius: 0 !important;
}
.raid-mode-switch button[data-active="1"],
.wanted-tab[class*="border-amber"] {
    border-color: var(--xxx-cyan) !important;
    background: rgba(79,209,197,.11) !important;
    color: var(--xxx-cyan-strong) !important;
}
#meteor-table-scroll thead,
#meteor-table-scroll th { background: #0c1627 !important; }
#raid-assist-host #global-sentinel-container {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface) !important;
}
#crew-view-root .xxx-member-card { background: var(--xxx-surface-2) !important; }

/* Einheitliches X in Eingabefeldern. */
.xxx-input-clear,
.xxx-field-clear,
.xxx-analytics-clear,
[data-profile-action="clear-player"],
#global-target-clear,
#db-search-clear,
#map-search-clear,
#overall-search-clear {
    border-color: rgba(255,82,104,.55) !important;
    border-radius: 0 !important;
    background: var(--xxx-panel-deep) !important;
    color: #ff5268 !important;
    box-shadow: none !important;
}

/* Modale Ebenen */
#analytics-intel-modal {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483000 !important;
    isolation: isolate !important;
}
#analytics-intel-modal[aria-hidden="true"] { display: none !important; }
#analytics-intel-modal[aria-hidden="false"] { display: flex !important; }
#analytics-intel-modal > [role="dialog"] {
    border-color: var(--xxx-line-strong) !important;
    border-radius: 0 !important;
    background: var(--xxx-surface) !important;
}

@media (min-width: 1280px) {
    #overall-stats-summary { grid-template-columns: repeat(6,minmax(0,1fr)) !important; }
}

@media (max-width: 767px) {
    #analytics-player-focus-content { padding: 8px; }
    #xxx-profile-search-row,
    #xxx-profile-search-row[data-compare="1"] {
        grid-template-columns: 1fr !important;
        width: 100% !important;
        max-width: none !important;
    }
    .xxx-profile-tabs { grid-template-columns: repeat(6,112px); }
    .xxx-alliance-card { grid-column: 1/-1; }
    .xxx-member-row { grid-template-columns: minmax(0,1fr) auto; }
    #xxx-profile-versus { display: none !important; }
    #overall-stats-chart { max-width: none; }
    #overall-stats-chart svg { height: 22rem !important; max-height: 22rem !important; }
}
