/* RUESS Hub 2.70.3 - einheitlich HELLES Erscheinungsbild + optionaler Dunkelmodus (Schalter je Nutzer).
   Wird als letzte Stylesheet-Datei geladen und ueberschreibt nur Farben; keine Aenderung an Struktur oder Verhalten. */

/* ---- Sidebar: hell statt dunkles Anthrazit ------------------------------------------------------------------------------------------- */
.app-sidebar { background: #ffffff !important; border-color: #e3e8df !important; border-right-color: #e3e8df !important; }
.app-sidebar .sidebar-brand-copy strong { color: #263033; }
.app-sidebar .sidebar-brand-copy span { color: #6b7773; }
.app-sidebar #currentUser { color: #263033 !important; }
.app-sidebar #currentRole { color: #52605a !important; }
.app-sidebar #currentUserEmail { color: #7a8580 !important; }
.app-sidebar .sidebar-profile-button { background: #f6f8f3 !important; border-color: #e3e8df !important; color: #263033 !important; }
.app-sidebar .sidebar-profile-button:hover { background: #eef3e6 !important; }
.app-sidebar .profile-avatar { background: #e8ede7 !important; color: #34413b !important; box-shadow: inset 0 0 0 1px #d7dfd7 !important; }
.app-sidebar .sidebar-nav-heading { color: #8a948c !important; }
.app-sidebar .sidebar-nav button,
.app-sidebar .sidebar-nav button:not(.secondary):not(.danger):not(.modal-close):not(.sidebar-toggle) { color: #38433d !important; }
.app-sidebar .sidebar-nav button:hover,
.app-sidebar .sidebar-nav button:not(.secondary):not(.danger):not(.modal-close):not(.sidebar-toggle):hover { background: #f1f5ea !important; color: #1f2a24 !important; }
.app-sidebar .sidebar-nav button.active,
.app-sidebar .sidebar-nav button.active:not(.secondary):not(.danger):not(.modal-close):not(.sidebar-toggle) { background: #a2bf13 !important; color: #ffffff !important; box-shadow: none !important; }
/* Icons: die Zeichnung ist dunkel (#323a3b) - auf hellem Grund unveraendert, im aktiven Punkt weiss */
.sidebar-nav button::before { filter: none; }
.sidebar-nav button:hover::before { filter: none; }
.sidebar-nav button.active::before { filter: brightness(0) invert(1); }
.app-sidebar .sidebar-nav .sidebar-subnav button { color: #4a554f !important; }
.app-sidebar .sidebar-nav .sidebar-subnav button:hover { background: #f1f5ea !important; color: #1f2a24 !important; }
.app-sidebar .sidebar-nav .sidebar-subnav button.active,
.app-sidebar .sidebar-nav .sidebar-subnav button.active:not(.secondary):not(.danger):not(.modal-close):not(.sidebar-toggle) { background: #f5f8ec !important; color: #293027 !important; box-shadow: inset 2px 0 0 #a2bf13 !important; }
.app-sidebar .sidebar-nav .sidebar-subnav button.active::after { background: #a2bf13 !important; }
.app-sidebar .sidebar-subnav { border-left-color: #dfe5db !important; }
.app-sidebar .sidebar-footer-nav { background: transparent !important; border-top-color: #e3e8df !important; }
.app-sidebar .sidebar-nav #logoutNav { background: #fdf0ef !important; color: #b2362f !important; border: 1px solid #f1c9c6 !important; }
.app-sidebar #logoutNav::before { filter: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23b2362f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='m16 17 5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E") !important; }
.app-sidebar .sidebar-logo { background: transparent; box-shadow: none; padding: 0; width: 92px; }
@media (max-width: 1180px) { .app-sidebar .sidebar-logo { width: 82px; padding: 0; } }

/* Menue-Kopf: Ueberschrift und Knopf "Alles auf / alles zu" in einer Zeile */
.sidebar-nav-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 6px 0 2px; }
.sidebar-nav-head .sidebar-nav-heading { margin: 0; flex: 1 1 auto; }
.sidebar-module-nav > .sidebar-nav-head:first-child { margin-top: 0; }
.app-sidebar .sidebar-nav button.sidebar-nav-all,
.app-sidebar .sidebar-nav button.sidebar-nav-all:not(.secondary):not(.danger):not(.modal-close):not(.sidebar-toggle) { width: auto !important; min-height: 0 !important; margin: 0 8px 0 0 !important; padding: 3px 9px !important; border: 1px solid #dfe5db !important; border-radius: 999px !important; background: #f6f8f3 !important; color: #52605a !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.3 !important; white-space: nowrap !important; flex: 0 0 auto; }
.app-sidebar .sidebar-nav button.sidebar-nav-all::before, .app-sidebar .sidebar-nav button.sidebar-nav-all::after { display: none !important; }
.app-sidebar .sidebar-nav button.sidebar-nav-all:hover { background: #eef3e6 !important; color: #1f2a24 !important; }

/* Dunkelmodus-Schalter im Menue */
.sidebar-nav #themeToggleNav::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23323a3b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z'/%3E%3C/svg%3E"); }

/* ---- aktive Reiter/Auswahl: hell mit gruenem Akzent statt dunkel ---------------------------------------------------------------------- */
:is(#knowledgeView, #knowledgeArticleModal, #knowledgeEditorModal) .kb-tab.active { background: #eef5d9 !important; color: #2b3a10 !important; border-color: #a2bf13 !important; }
:is(#knowledgeView, #knowledgeArticleModal, #knowledgeEditorModal) .kb-tab.active small { background: rgba(162, 191, 19, .28) !important; color: #2b3a10 !important; }
:is(#ideasView, #ideaDrawer) .ip-view.active { background: #eef5d9 !important; color: #2b3a10 !important; border-color: #a2bf13 !important; }
.sales-segment-tabs button.active { background: #eef5d9 !important; color: #2b3a10 !important; border-color: #a2bf13 !important; }
.fleet-tabs button.active { background: #eef5d9 !important; color: #2b3a10 !important; border-color: #a2bf13 !important; }
.fleet-range-pill.active { background: #eef5d9 !important; color: #2b3a10 !important; border-color: #a2bf13 !important; }
#fleetView .fleet-week-tone.active { background: #eef5d9; color: #2b3a10; border-color: #a2bf13; }
#fleetView .fleet-week-tone.active small { color: #52605a; }
#fleetView .fleet-week-tone.active strong { background: rgba(162, 191, 19, .28); color: #2b3a10; }
.ticket-detail-tabs button.active { background: #eef5d9 !important; color: #2b3a10 !important; border-color: #a2bf13 !important; }
.ticket-detail-tabs button.active span { background: rgba(162, 191, 19, .28) !important; color: #2b3a10 !important; }
.counter-tabs button.active { background: #eef5d9 !important; color: #2b3a10 !important; border-color: #a2bf13 !important; }
.fleet-week-table thead th, .fleet-week-table thead th:first-child { background: #eef2e8 !important; color: #263021 !important; }
#tourListsView .tourlists-stop-nr, #tourListsCustomersModal .tourlists-stop-nr { background: #eef5d9; color: #25311f; border: 1px solid #a2bf13; }

/* ---- Dunkelmodus (Schalter je Nutzer, Standard = hell) ------------------------------------------------------------------------------ */
html[data-theme="dark"] { filter: invert(.92) hue-rotate(180deg); background: #ffffff; }
html[data-theme="dark"] img,
html[data-theme="dark"] video,
html[data-theme="dark"] canvas,
html[data-theme="dark"] iframe,
html[data-theme="dark"] .leaflet-container,
html[data-theme="dark"] .profile-avatar img { filter: invert(.92) hue-rotate(180deg); }
html[data-theme="dark"] .leaflet-container img { filter: none; }
/* Weiches Dunkel (kein reines Schwarz): invert(.92) macht weiss zu #141414 und schwarz zu #ebebeb */

/* ---- Kompakter Seitenkopf (2.70.3): Titel, Datum und Knoepfe in einer Zeile; keine Untertitel, keine doppelte Ueberschrift ---------------------------- */
.app-page-hero { align-items: center; gap: 12px 16px; padding-top: 10px; padding-bottom: 10px; }
.app-page-hero .analysis-eyebrow,
.app-page-hero #appViewSubtitle { display: none; }
.app-page-hero h2 { margin: 0; }
.app-page-hero #appViewActions { display: flex; flex: 1 1 auto; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 10px; min-width: 0; }
.app-page-hero #appViewActions[aria-hidden="true"] { display: none; }
.app-view-actions-group { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px 10px; min-width: 0; }
.app-view-actions-group[hidden] { display: none !important; }
.app-view-actions-group > * { margin: 0; }
#fleetView .fleet-header,
#salesView .sales-heading,
#analyticsView .analysis-header,
#tikosImportView .tikos-import-header-card { display: none !important; }
#usersView .users-management-header-card { padding: 0; border: 0; background: transparent; box-shadow: none; min-height: 0; }
#usersView .users-management-header-card .users-management-header { display: none; }
#knowledgeView .kb-hero-text { display: none; }

#counterView .counter-module-header > div:first-child { display: none; }
#counterView .counter-module-header { justify-content: flex-end; min-height: 0; padding: 0; }

/* ---- Ladeanzeige (2.70.3, busy.js) --------------------------------------------------------------------------------------------------------------- */
.busy-indicator { position: fixed; top: 0; left: 0; right: 0; z-index: 10050; pointer-events: none; }
.busy-indicator[hidden] { display: none; }
.busy-bar { display: block; height: 3px; background: linear-gradient(90deg, transparent, #a2bf13, transparent); background-size: 40% 100%; background-repeat: no-repeat; animation: busy-slide 1.1s linear infinite; }
.busy-chip { position: fixed; bottom: 18px; right: 18px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 1px solid #dfe5db; border-radius: 999px; background: #ffffff; color: #38433d; font-size: 12px; font-weight: 700; box-shadow: 0 4px 14px rgba(38, 48, 51, .12); }
.busy-spinner { width: 12px; height: 12px; border: 2px solid #dfe5db; border-top-color: #a2bf13; border-radius: 50%; animation: busy-spin .8s linear infinite; }
body.is-busy { cursor: progress; }
button.is-busy, button[aria-busy="true"] { opacity: .65; cursor: progress !important; pointer-events: none; position: relative; }
button.is-busy::after { content: ""; display: inline-block; width: 11px; height: 11px; margin-left: 8px; vertical-align: -1px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: busy-spin .8s linear infinite; }
@keyframes busy-slide { from { background-position: -40% 0; } to { background-position: 140% 0; } }
@keyframes busy-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .busy-bar, .busy-spinner, button.is-busy::after { animation-duration: 3s; } }

/* ---- Screenshots per Strg+V (2.70.3, screenshot-paste.js) --------------------------------------------------------------------------------------- */
.shot-strip { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 0; }
.shot-strip[hidden] { display: none; }
.shot-thumb { position: relative; display: flex; flex-direction: column; gap: 3px; max-width: 150px; margin: 0; padding: 6px; border: 1px solid #dfe5db; border-radius: 10px; background: #f9fbf6; }
.shot-thumb img { display: block; width: 100%; max-height: 90px; object-fit: contain; border-radius: 6px; background: #ffffff; }
.shot-thumb figcaption { font-size: 10.5px; line-height: 1.25; color: #52605a; word-break: break-all; }
.shot-thumb .shot-remove { position: absolute; top: 3px; right: 3px; width: 20px; height: 20px; min-height: 0; margin: 0; padding: 0; border: 1px solid #dfe5db; border-radius: 50%; background: #ffffff; color: #52605a; font-size: 13px; line-height: 1; cursor: pointer; }
.shot-inline { display: block; max-width: min(100%, 560px); margin: 8px 0; }
.shot-inline img { display: block; max-width: 100%; height: auto; border: 1px solid #dfe5db; border-radius: 8px; background: #ffffff; cursor: zoom-in; }
.shot-inline-loading, .shot-inline-missing { display: inline-block; padding: 4px 8px; border-radius: 6px; background: #f3f5f1; color: #6b7773; font-size: 12px; }