/* * FoxTask Redesign - Dunkelmodus (erzeugt am 26.10.2026 aus redesign.css) * Wird NACH redesign.css geladen und gilt nur bei data-theme="dark". * Zum Zuruecksetzen auf den alten Dunkelmodus diese Datei in app/index.html nicht mehr einbinden. */ :root[data-theme="dark"] { --ft-bg: #0c111d; --ft-surface: #161b26; --ft-surface-2: #1f242f; --ft-border: #333741; --ft-border-strong: #414651; --ft-text: #f5f5f6; --ft-text-2: #cecfd2; --ft-text-3: #94969c; --ft-brand: #f26b1d; --ft-primary: #c2410c; --ft-primary-hover: #e05a12; --ft-primary-soft: rgba(242, 107, 29, 0.14); --ft-focus: rgba(242, 107, 29, 0.35); --ft-radius: 8px; --ft-radius-card: 12px; --ft-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); --ft-shadow-pop: 0 12px 32px rgba(0, 0, 0, 0.45); --ft-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --ft-s-new: #84adff; --ft-s-new-bg: rgba(41, 112, 255, 0.16); --ft-s-assigned: #a4a7fd; --ft-s-assigned-bg: rgba(99, 102, 241, 0.16); --ft-s-work: #fdb022; --ft-s-work-bg: rgba(247, 144, 9, 0.16); --ft-s-wait: #bd9cfe; --ft-s-wait-bg: rgba(139, 92, 246, 0.16); --ft-s-review: #67e3f9; --ft-s-review-bg: rgba(6, 174, 212, 0.16); --ft-s-done: #47cd89; --ft-s-done-bg: rgba(23, 178, 106, 0.16); --ft-s-crit: #f97066; --ft-s-crit-bg: rgba(240, 68, 56, 0.16); --ft-s-neutral: #cecfd2; --ft-s-neutral-bg: #1f242f; --font-ui: var(--ft-font); --color-bg: var(--ft-bg); --bg-canvas: var(--ft-bg); --color-sidebar: var(--ft-surface); --bg-sidebar: var(--ft-surface); --bg-sidebar-accent: var(--ft-primary-soft); --color-surface: var(--ft-surface); --color-surface-solid: var(--ft-surface); --color-surface-soft: var(--ft-surface-2); --bg-surface: var(--ft-surface); --bg-muted: #1f242f; --color-border: var(--ft-border); --color-border-strong: var(--ft-border-strong); --border-subtle: var(--ft-border); --color-text: var(--ft-text); --text-primary: var(--ft-text); --color-text-muted: var(--ft-text-3); --text-secondary: var(--ft-text-3); --color-label: var(--ft-text-3); --color-primary: var(--ft-primary); --bg-primary: var(--ft-primary); --bg-primary-hover: var(--ft-primary-hover); --color-accent: var(--ft-brand); --danger: var(--ft-s-crit); --warning: var(--ft-s-work); --success: var(--ft-s-done); --neutral: var(--ft-s-neutral); --shadow-soft: var(--ft-shadow); --shadow-panel: var(--ft-shadow-pop); --radius-card: var(--ft-radius-card); --radius-button: var(--ft-radius); color-scheme: dark; } :root[data-theme="dark"] body { font-family: var(--ft-font) !important; color: var(--ft-text); background: var(--ft-bg) !important; -webkit-font-smoothing: antialiased; font-feature-settings: "cv11", "ss01"; } :root[data-theme="dark"] h1, :root[data-theme="dark"] h2, :root[data-theme="dark"] h3, :root[data-theme="dark"] h4 { color: var(--ft-text); letter-spacing: -0.01em; } :root[data-theme="dark"] .eyebrow, :root[data-theme="dark"] .card-label, :root[data-theme="dark"] .panel-label { text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; font-weight: 500 !important; color: var(--ft-text-3) !important; } :root[data-theme="dark"] .field-label { text-transform: none !important; letter-spacing: 0 !important; font-size: 13px !important; font-weight: 500 !important; color: var(--ft-text-2) !important; } :root[data-theme="dark"] .supporting-copy, :root[data-theme="dark"] .detail-copy { color: var(--ft-text-3); } :root[data-theme="dark"] :focus-visible { outline: 2px solid var(--ft-primary); outline-offset: 2px; } :root[data-theme="dark"] .main-shell { background: var(--ft-bg) !important; } :root[data-theme="dark"] .sidebar { background: var(--ft-surface) !important; border-right: 1px solid var(--ft-border) !important; box-shadow: none !important; padding: 18px 12px !important; gap: 12px !important; color: var(--ft-text); } :root[data-theme="dark"] .sidebar::before, :root[data-theme="dark"] .sidebar::after { display: none !important; } :root[data-theme="dark"] .brand-block { padding: 0 8px 6px !important; margin: 0 !important; min-height: 0 !important; } :root[data-theme="dark"] .fixfox-logo-sidebar { width: 148px !important; max-height: 48px !important; } :root[data-theme="dark"] .nav-list { display: flex !important; flex-direction: column !important; gap: 2px !important; } :root[data-theme="dark"] .nav-group-label { display: block; padding: 14px 10px 6px; font-size: 12px; font-weight: 500; color: #90aadf; } :root[data-theme="dark"] .nav-group-label:first-child { padding-top: 4px; } :root[data-theme="dark"] .sidebar .nav-item { min-height: 36px !important; padding: 0 10px !important; gap: 10px !important; border: 0 !important; border-radius: var(--ft-radius) !important; background: transparent !important; color: var(--ft-text-2) !important; font-size: 14px !important; font-weight: 500 !important; box-shadow: none !important; transform: none !important; text-align: left; width: 100%; } :root[data-theme="dark"] .sidebar .nav-item:hover { background: #1f242f !important; color: var(--ft-text) !important; } :root[data-theme="dark"] .sidebar .nav-item.is-active { background: var(--ft-primary-soft) !important; color: var(--ft-text) !important; font-weight: 600 !important; box-shadow: inset 3px 0 0 var(--ft-brand) !important; } :root[data-theme="dark"] .sidebar .nav-icon { width: 20px !important; height: 20px !important; min-width: 20px !important; display: inline-grid !important; place-items: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: #90aadf !important; font-size: 16px !important; } :root[data-theme="dark"] .sidebar .nav-item.is-active .nav-icon { color: var(--ft-primary) !important; } :root[data-theme="dark"] .sidebar .nav-icon .ui-icon, :root[data-theme="dark"] .bottom-nav .nav-icon .ui-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; } :root[data-theme="dark"] .nav-label { flex: 1; display: flex; align-items: center; gap: 6px; } :root[data-theme="dark"] .nav-caret { display: none !important; } :root[data-theme="dark"] .nav-count { margin-left: auto; min-width: 22px; padding: 1px 8px; border-radius: 999px; background: #1f242f; color: var(--ft-text-2); font-size: 12px; font-weight: 600; font-style: normal; line-height: 18px; text-align: center; } :root[data-theme="dark"] .nav-item.is-active .nav-count { background: #161b26; } :root[data-theme="dark"] .nav-ticket-group { display: flex; flex-direction: column; gap: 2px; background: transparent !important; border: 0 !important; padding: 0 !important; } :root[data-theme="dark"] .nav-submenu { display: none; flex-direction: column; gap: 2px; padding: 2px 0 4px 30px !important; margin: 0 !important; border: 0 !important; background: transparent !important; } :root[data-theme="dark"] .nav-ticket-group.is-active .nav-submenu { display: flex; } :root[data-theme="dark"] .nav-subitem { min-height: 30px !important; padding: 0 10px !important; border-radius: 6px !important; background: transparent !important; color: var(--ft-text-3) !important; font-size: 13px !important; font-weight: 500 !important; text-align: left; border: 0 !important; box-shadow: none !important; } :root[data-theme="dark"] .nav-subitem.is-active { background: #1f242f !important; color: var(--ft-text) !important; font-weight: 600 !important; } :root[data-theme="dark"] .sidebar-panel { margin-top: auto !important; padding: 12px 8px 0 !important; border: 0 !important; border-top: 1px solid var(--ft-border) !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--ft-text); } :root[data-theme="dark"] .sidebar-panel .panel-label { display: none !important; } :root[data-theme="dark"] .sidebar-copy { color: var(--ft-text-3) !important; font-size: 12px !important; } :root[data-theme="dark"] .topbar { background: var(--ft-surface) !important; border: 0 !important; border-bottom: 1px solid var(--ft-border) !important; border-radius: 0 !important; box-shadow: none !important; backdrop-filter: none !important; } :root[data-theme="dark"] .topbar-title .eyebrow { display: none !important; } :root[data-theme="dark"] .topbar-title h2, :root[data-theme="dark"] #view-title { font-size: 22px !important; line-height: 30px !important; font-weight: 600 !important; color: var(--ft-text) !important; margin: 0 !important; } :root[data-theme="dark"] .topbar-profile .profile-avatar { background: rgba(255, 118, 26, 0.16) !important; color: #f2937d !important; border: 0 !important; } :root[data-theme="dark"] .demo-mode-banner { background: #101828 !important; border: 0 !important; border-radius: var(--ft-radius-card) !important; box-shadow: none !important; } :root[data-theme="dark"] .primary-action { min-height: 36px; padding: 0 14px !important; border: 0 !important; border-radius: var(--ft-radius) !important; background: var(--ft-primary) !important; background-image: none !important; color: #ffffff !important; font-size: 14px !important; font-weight: 600 !important; box-shadow: none !important; text-shadow: none !important; transform: none !important; } :root[data-theme="dark"] .primary-action:hover { background: var(--ft-primary-hover) !important; } :root[data-theme="dark"] .secondary-action, :root[data-theme="dark"] .date-picker-action, :root[data-theme="dark"] .theme-toggle { min-height: 36px; padding: 0 12px !important; border: 1px solid var(--ft-border-strong) !important; border-radius: var(--ft-radius) !important; background: var(--ft-surface) !important; background-image: none !important; color: var(--ft-text-2) !important; font-size: 13px !important; font-weight: 500 !important; box-shadow: none !important; transform: none !important; } :root[data-theme="dark"] .secondary-action:hover, :root[data-theme="dark"] .date-picker-action:hover { background: var(--ft-surface-2) !important; color: var(--ft-text) !important; } :root[data-theme="dark"] .danger-action { border-radius: var(--ft-radius) !important; background: var(--ft-surface) !important; border: 1px solid rgba(251, 43, 30, 0.4) !important; color: var(--ft-s-crit) !important; box-shadow: none !important; font-weight: 600 !important; } :root[data-theme="dark"] .link-action { color: var(--ft-primary) !important; font-weight: 500 !important; } :root[data-theme="dark"] .icon-action { border-radius: var(--ft-radius) !important; border: 1px solid var(--ft-border-strong) !important; background: var(--ft-surface) !important; color: var(--ft-text-2) !important; box-shadow: none !important; } :root[data-theme="dark"] .search-input, :root[data-theme="dark"] .select-input, :root[data-theme="dark"] input[type="text"], :root[data-theme="dark"] input[type="email"], :root[data-theme="dark"] input[type="tel"], :root[data-theme="dark"] input[type="search"], :root[data-theme="dark"] input[type="password"], :root[data-theme="dark"] input[type="date"], :root[data-theme="dark"] input[type="time"], :root[data-theme="dark"] input[type="datetime-local"], :root[data-theme="dark"] input[type="number"], :root[data-theme="dark"] select, :root[data-theme="dark"] textarea { border: 1px solid var(--ft-border-strong) !important; border-radius: var(--ft-radius) !important; background: var(--ft-surface) !important; color: var(--ft-text) !important; box-shadow: none !important; font-family: var(--ft-font) !important; font-size: 14px !important; } :root[data-theme="dark"] .search-input:focus, :root[data-theme="dark"] .select-input:focus, :root[data-theme="dark"] input:focus, :root[data-theme="dark"] select:focus, :root[data-theme="dark"] textarea:focus { outline: none !important; border-color: var(--ft-primary) !important; box-shadow: 0 0 0 3px var(--ft-focus) !important; } :root[data-theme="dark"] .surface-card, :root[data-theme="dark"] .dashboard-panel, :root[data-theme="dark"] .detail-card, :root[data-theme="dark"] .settings-panel, :root[data-theme="dark"] .qr-section-card, :root[data-theme="dark"] .object-card, :root[data-theme="dark"] .task-detail-card, :root[data-theme="dark"] .wide-card { background: var(--ft-surface) !important; background-image: none !important; border: 1px solid var(--ft-border) !important; border-radius: var(--ft-radius-card) !important; box-shadow: var(--ft-shadow) !important; backdrop-filter: none !important; } :root[data-theme="dark"] .dashboard-panel-head h3, :root[data-theme="dark"] .section-head h3, :root[data-theme="dark"] .surface-card h3 { font-size: 16px !important; line-height: 24px !important; font-weight: 600 !important; } :root[data-theme="dark"] .modal-card { border: 1px solid var(--ft-border) !important; border-radius: 16px !important; background: var(--ft-surface) !important; box-shadow: var(--ft-shadow-pop) !important; } :root[data-theme="dark"] .dashboard-v2-status-card, :root[data-theme="dark"] .dashboard-kpi-card { background: var(--ft-surface) !important; border: 1px solid var(--ft-border) !important; border-left-width: 1px !important; border-radius: var(--ft-radius-card) !important; box-shadow: var(--ft-shadow) !important; position: relative; } :root[data-theme="dark"] .dashboard-v2-status-card::before { content: ""; position: absolute; top: 18px; right: 16px; width: 8px; height: 8px; border-radius: 50%; background: var(--ft-s-neutral); } :root[data-theme="dark"] .dashboard-v2-status-card.tone-danger::before { background: #d92d20; } :root[data-theme="dark"] .dashboard-v2-status-card.tone-warning::before { background: #dc6803; } :root[data-theme="dark"] .dashboard-v2-status-card.tone-success::before { background: #079455; } :root[data-theme="dark"] .dashboard-v2-status-card.tone-info::before { background: #1d4ed8; } :root[data-theme="dark"] .dashboard-v2-status-card span { text-transform: none !important; letter-spacing: 0 !important; font-size: 13px !important; font-weight: 500 !important; color: var(--ft-text-3) !important; } :root[data-theme="dark"] .dashboard-v2-status-card strong { font-size: 28px !important; font-weight: 600 !important; color: var(--ft-text) !important; font-variant-numeric: tabular-nums; } :root[data-theme="dark"] .status-pill, :root[data-theme="dark"] .priority-chip { border: 0 !important; border-radius: 999px !important; padding: 2px 9px !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: 0 !important; text-transform: none !important; box-shadow: none !important; background: var(--ft-s-neutral-bg) !important; color: var(--ft-s-neutral) !important; } :root[data-theme="dark"] .status-pill.success, :root[data-theme="dark"] .priority-chip.success { background: var(--ft-s-done-bg) !important; color: var(--ft-s-done) !important; } :root[data-theme="dark"] .status-pill.warning, :root[data-theme="dark"] .priority-chip.warning { background: var(--ft-s-work-bg) !important; color: var(--ft-s-work) !important; } :root[data-theme="dark"] .status-pill.danger, :root[data-theme="dark"] .priority-chip.danger, :root[data-theme="dark"] .priority-chip.critical, :root[data-theme="dark"] .priority-chip.high { background: var(--ft-s-crit-bg) !important; color: var(--ft-s-crit) !important; } :root[data-theme="dark"] .status-pill.info, :root[data-theme="dark"] .priority-chip.info, :root[data-theme="dark"] .priority-chip.new { background: var(--ft-s-new-bg) !important; color: var(--ft-s-new) !important; } :root[data-theme="dark"] .filter-chip { border: 1px solid var(--ft-border) !important; border-radius: 999px !important; background: var(--ft-surface) !important; color: var(--ft-text-2) !important; font-size: 13px !important; font-weight: 500 !important; box-shadow: none !important; } :root[data-theme="dark"] .filter-chip.is-active { background: var(--ft-text) !important; border-color: var(--ft-text) !important; color: #ffffff !important; } :root[data-theme="dark"] table { border-collapse: separate; border-spacing: 0; } :root[data-theme="dark"] th { background: var(--ft-surface-2) !important; color: var(--ft-text-3) !important; font-size: 12px !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important; border-bottom: 1px solid var(--ft-border) !important; } :root[data-theme="dark"] td { border-bottom: 1px solid #333741 !important; color: var(--ft-text); } :root[data-theme="dark"] .bottom-nav { background: var(--ft-surface) !important; border-top: 1px solid var(--ft-border) !important; box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.10) !important; } :root[data-theme="dark"] .bottom-nav .nav-item { background: transparent !important; color: var(--ft-text-3) !important; box-shadow: none !important; border: 0 !important; } :root[data-theme="dark"] .bottom-nav .nav-item.is-active { color: var(--ft-primary) !important; background: transparent !important; } :root[data-theme="dark"] .fixfox-logo-sidebar { width: auto !important; height: 52px !important; max-height: 52px !important; max-width: 190px !important; } :root[data-theme="dark"] p.nav-group-label { margin: 0 !important; } :root[data-theme="dark"] .topbar-nav:empty, :root[data-theme="dark"] .topbar-nav:has(> .is-hidden:only-child) { display: none !important; } :root[data-theme="dark"] .global-search-box { width: 300px !important; max-width: 100%; } :root[data-theme="dark"] .global-search-box .search-input { height: 36px !important; padding: 0 12px 0 34px !important; background: #161b26 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 11px center !important; } :root[data-theme="dark"] #reload-button, :root[data-theme="dark"] .page-help-button, :root[data-theme="dark"] .date-picker-action, :root[data-theme="dark"] .theme-toggle { height: 36px !important; min-height: 36px !important; white-space: nowrap; } :root[data-theme="dark"] .theme-toggle .theme-toggle-icon { display: none !important; } :root[data-theme="dark"] .topbar-profile { display: flex !important; align-items: center !important; gap: 8px !important; padding-left: 8px !important; border-left: 1px solid var(--ft-border) !important; background: transparent !important; box-shadow: none !important; } :root[data-theme="dark"] .topbar-profile strong { font-size: 13px !important; font-weight: 600 !important; } :root[data-theme="dark"] .topbar-profile small { font-size: 12px !important; color: var(--ft-text-3) !important; } :root[data-theme="dark"] .profile-avatar { width: 32px !important; height: 32px !important; font-size: 12px !important; } :root[data-theme="dark"] .demo-role-button { min-height: 32px !important; border-radius: 999px !important; border: 1px solid rgba(255, 255, 255, 0.06) !important; background: transparent !important; color: #ffffff !important; font-size: 13px !important; font-weight: 500 !important; box-shadow: none !important; } :root[data-theme="dark"] .demo-role-button.is-active { background: #161b26 !important; color: var(--ft-text) !important; } :root[data-theme="dark"] .demo-signup-link { min-height: 32px !important; display: inline-flex !important; align-items: center !important; } :root[data-theme="dark"] .dashboard-event-group-head, :root[data-theme="dark"] .dashboard-event-group-head * { text-transform: none !important; letter-spacing: 0 !important; } :root[data-theme="dark"] .dashboard-event-group-head { font-size: 13px !important; font-weight: 600 !important; color: var(--ft-text-2) !important; } :root[data-theme="dark"] .dashboard-event-row { background: var(--ft-surface) !important; border: 1px solid var(--ft-border) !important; border-left: 3px solid var(--ft-s-new) !important; border-radius: 10px !important; box-shadow: none !important; } :root[data-theme="dark"] .dashboard-event-type { text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; font-weight: 600 !important; } :root[data-theme="dark"] .dashboard-event-meta, :root[data-theme="dark"] .dashboard-event-meta * { text-transform: none !important; letter-spacing: 0 !important; } :root[data-theme="dark"] .dashboard-empty { border: 1px dashed var(--ft-border) !important; background: transparent !important; color: var(--ft-text-3) !important; font-size: 13px !important; border-radius: 10px !important; box-shadow: none !important; } :root[data-theme="dark"] .fixfox-logo-sidebar { height: auto !important; width: 150px !important; max-height: none !important; } :root[data-theme="dark"] .global-search-box { width: 260px !important; } :root[data-theme="dark"] #reload-button, :root[data-theme="dark"] .page-help-button, :root[data-theme="dark"] .theme-toggle { width: 36px !important; min-width: 36px !important; padding: 0 !important; font-size: 0 !important; display: inline-grid !important; place-items: center !important; position: relative; } :root[data-theme="dark"] .theme-toggle > * { display: none !important; } :root[data-theme="dark"] #reload-button::before, :root[data-theme="dark"] .page-help-button::before, :root[data-theme="dark"] .theme-toggle::before { content: ""; width: 18px; height: 18px; background: var(--ft-text-2); -webkit-mask: var(--ft-icon) center / contain no-repeat; mask: var(--ft-icon) center / contain no-repeat; } :root[data-theme="dark"] #reload-button { --ft-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 11a8 8 0 0 0-14.5-4.5L4 8'/%3E%3Cpath d='M4 4v4h4'/%3E%3Cpath d='M4 13a8 8 0 0 0 14.5 4.5L20 16'/%3E%3Cpath d='M20 20v-4h-4'/%3E%3C/svg%3E"); } :root[data-theme="dark"] .page-help-button { --ft-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M9.5 9.5a2.5 2.5 0 1 1 3.5 2.3c-.6.3-1 .9-1 1.6v.6'/%3E%3Cpath d='M12 17h.01'/%3E%3C/svg%3E"); } :root[data-theme="dark"] .theme-toggle { --ft-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 14.5A8 8 0 1 1 9.5 4a6.5 6.5 0 0 0 10.5 10.5Z'/%3E%3C/svg%3E"); } :root[data-theme="dark"] .date-picker-action { min-width: 0 !important; width: auto !important; } :root[data-theme="dark"] .ticket-status-badge, :root[data-theme="dark"] .dashboard-object-status-badge, :root[data-theme="dark"] .dashboard-status-badge, :root[data-theme="dark"] .resident-answer-badge, :root[data-theme="dark"] .ticket-new-badge { display: inline-flex !important; align-items: center !important; gap: 6px !important; min-height: 22px !important; padding: 0 9px !important; border: 0 !important; border-radius: 999px !important; font-size: 12px !important; font-style: normal !important; font-weight: 500 !important; letter-spacing: 0 !important; text-transform: none !important; box-shadow: none !important; background: var(--ft-s-neutral-bg) !important; color: var(--ft-s-neutral) !important; white-space: nowrap; } :root[data-theme="dark"] .ticket-status-badge::before, :root[data-theme="dark"] .dashboard-object-status-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; } :root[data-theme="dark"] .ticket-status-new, :root[data-theme="dark"] .ticket-new-badge, :root[data-theme="dark"] .dashboard-object-status-badge.tone-info { background: var(--ft-s-new-bg) !important; color: var(--ft-s-new) !important; } :root[data-theme="dark"] .ticket-status-assigned { background: var(--ft-s-assigned-bg) !important; color: var(--ft-s-assigned) !important; } :root[data-theme="dark"] .ticket-status-progress, :root[data-theme="dark"] .dashboard-object-status-badge.tone-warning { background: var(--ft-s-work-bg) !important; color: var(--ft-s-work) !important; } :root[data-theme="dark"] .ticket-status-question, :root[data-theme="dark"] .ticket-status-waiting { background: var(--ft-s-wait-bg) !important; color: var(--ft-s-wait) !important; } :root[data-theme="dark"] .ticket-status-review { background: var(--ft-s-review-bg) !important; color: var(--ft-s-review) !important; } :root[data-theme="dark"] .ticket-status-done, :root[data-theme="dark"] .dashboard-object-status-badge.tone-success { background: var(--ft-s-done-bg) !important; color: var(--ft-s-done) !important; } :root[data-theme="dark"] .dashboard-object-status-badge.tone-danger { background: var(--ft-s-crit-bg) !important; color: var(--ft-s-crit) !important; } :root[data-theme="dark"] .resident-answer-badge { background: var(--ft-s-wait-bg) !important; color: var(--ft-s-wait) !important; } :root[data-theme="dark"] dt, :root[data-theme="dark"] .detail-grid dt, :root[data-theme="dark"] .detail-grid span:first-child { text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; font-weight: 500 !important; color: var(--ft-text-3) !important; } :root[data-theme="dark"] .ticket-message-card { background: var(--ft-surface-2) !important; border: 1px solid var(--ft-border) !important; border-left: 3px solid var(--ft-brand) !important; border-radius: 10px !important; box-shadow: none !important; } :root[data-theme="dark"] .ticket-message-card strong, :root[data-theme="dark"] .ticket-message-card p:not(.field-label) { font-weight: 500 !important; font-size: 15px !important; } @media (min-width: 821px) { :root[data-theme="dark"] .app-shell { grid-template-columns: 248px minmax(0, 1fr) !important; background: var(--ft-bg) !important; } :root[data-theme="dark"] .topbar { display: flex !important; flex-wrap: wrap !important; align-items: center !important; gap: 12px 16px !important; padding: 14px 28px !important; min-height: 0 !important; } :root[data-theme="dark"] .topbar-title { flex: 1 1 220px !important; min-width: 0; } :root[data-theme="dark"] .topbar-actions { display: flex !important; flex-wrap: wrap !important; align-items: center !important; justify-content: flex-end !important; gap: 8px !important; grid-template-columns: none !important; } :root[data-theme="dark"] .topbar-actions { flex: 0 1 auto !important; width: auto !important; max-width: none !important; } :root[data-theme="dark"] .view-section { padding-left: 28px; padding-right: 28px; } :root[data-theme="dark"] .demo-mode-banner { margin: 12px 28px 0 !important; padding: 10px 16px !important; } } :root[data-theme="dark"] .surface-card input, :root[data-theme="dark"] .surface-card select, :root[data-theme="dark"] .surface-card textarea, :root[data-theme="dark"] .detail-stack input, :root[data-theme="dark"] .detail-stack select, :root[data-theme="dark"] .detail-stack textarea { max-width: 100% !important; box-sizing: border-box !important; } :root[data-theme="dark"] .detail-stack { grid-template-columns: minmax(0, 1fr) !important; } :root[data-theme="dark"] .ft-kpi { border: 1px solid var(--ft-border, #333741); background: var(--ft-surface, #161b26); box-shadow: var(--ft-shadow, 0 1px 2px rgba(0, 0, 0, 0.15)); color: var(--ft-text, #90abdf); } :root[data-theme="dark"] .ft-kpi:hover { border-color: var(--ft-border-strong, #414651); } :root[data-theme="dark"] .ft-kpi.is-active { box-shadow: 0 0 0 1px var(--ft-text, rgba(0, 0, 0, 0.60)); } :root[data-theme="dark"] .ft-kpi-label { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-kpi-value.is-critical { color: var(--ft-s-crit, #ee8981); } :root[data-theme="dark"] .ft-kpi-hint { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-card { background: var(--ft-surface, #161b26); border: 1px solid var(--ft-border, #333741); box-shadow: var(--ft-shadow, 0 1px 2px rgba(0, 0, 0, 0.15)); } :root[data-theme="dark"] .ft-card-head { border-bottom: 1px solid var(--ft-border, #333741); } :root[data-theme="dark"] .ft-card-head p { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-seg-group { background: #1f242f; } :root[data-theme="dark"] .ft-seg { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-seg.is-active { background: #161b26; color: var(--ft-text, #90abdf); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); } :root[data-theme="dark"] .ft-work-head { color: var(--ft-text-3, #90b0df); background: var(--ft-surface-2, #1f242f); border-bottom: 1px solid var(--ft-border, #333741); } :root[data-theme="dark"] .ft-work-row { border-bottom: 1px solid #333741; } :root[data-theme="dark"] .ft-work-row:hover { background: var(--ft-surface-2, #1f242f); } :root[data-theme="dark"] .ft-work-main small { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-work-due { color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-work-due.is-late { color: var(--ft-s-crit, #ee8981); } :root[data-theme="dark"] .ft-prio { color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-prio.is-critical { color: var(--ft-s-crit, #ee8981); } :root[data-theme="dark"] .ft-prio-bars i { background: #414651; } :root[data-theme="dark"] .ft-person { color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-avatar { background: #1f242f; color: #90aedf; } :root[data-theme="dark"] .ft-avatar.tone-done { background: rgba(47, 233, 124, 0.16); color: #77f8c2; } :root[data-theme="dark"] .ft-avatar.tone-progress { background: #1f242f; color: #f9a676; } :root[data-theme="dark"] .ft-avatar.tone-critical { background: #1f242f; color: #ee8981; } :root[data-theme="dark"] .ft-assign-button { background: #161b26; color: var(--ft-primary, #f79d79); } :root[data-theme="dark"] .ft-assign-button:hover { background: var(--ft-primary-soft, #1f242f); } :root[data-theme="dark"] .ft-empty { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-team-row { border-bottom: 1px solid #333741; } :root[data-theme="dark"] .ft-team-main small { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-load-bar { background: #1f242f; } :root[data-theme="dark"] .ft-load em { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ticket-status-badge.ticket-status-critical { background: #1f242f !important; color: #ee8981 !important; } :root[data-theme="dark"] .ft-assign-popover { background: #161b26; border: 1px solid #333741; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.40); color: #90abdf; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot { background: transparent !important; background-image: none !important; border: 0 !important; border-right: 1px solid #333741 !important; box-shadow: none !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot:not(.is-disabled) span, :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot:not(.is-disabled) i { opacity: 0; transition: opacity .12s; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot:not(.is-disabled):hover { background: var(--ft-primary-soft) !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot:not(.is-disabled):hover span, :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot:not(.is-disabled):hover i { opacity: 1; color: var(--ft-primary) !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot.is-disabled { background: repeating-linear-gradient(135deg, #1f242f 0 6px, #1f242f 6px 12px) !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-panel-head h3::after { content: ""; } :root[data-theme="dark"] .ft-person.is-absent { color: var(--ft-s-crit, #ee8981); } :root[data-theme="dark"] .ft-absent-tag { background: #1f242f; color: #ee8981; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-corner, :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-employee { position: sticky !important; left: 0 !important; z-index: 6 !important; background: #161b26 !important; box-shadow: 1px 0 0 var(--ft-border) !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-employee strong { color: var(--ft-text) !important; font-weight: 600 !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-employee small { color: var(--ft-text-3) !important; } :root[data-theme="dark"] .unconfirmed-task-panel *, :root[data-theme="dark"] .dashboard-compact-row * { text-transform: none !important; letter-spacing: 0 !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-grid { overflow: visible !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-planner .dashboard-now-line span { display: none !important; } :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot.is-disabled span, :root[data-theme="dark"] #dashboard-v2-calendar-card .dashboard-timeline-free-slot.is-disabled i { display: none !important; } :root[data-theme="dark"] .employee-dashboard-card { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important; } :root[data-theme="dark"] .employee-dashboard-card > .dashboard-panel-head > div:first-child { display: none !important; } :root[data-theme="dark"] .employee-dashboard-card > .dashboard-panel-head { display: block !important; padding: 0 !important; margin: 0 0 14px !important; border: 0 !important; background: transparent !important; } :root[data-theme="dark"] .employee-dashboard-sections { display: flex !important; flex-direction: column !important; gap: 16px !important; background: transparent !important; padding: 0 !important; } :root[data-theme="dark"] .ft-emp-progress { background: #161b26; border: 1px solid var(--ft-border, #333741); } :root[data-theme="dark"] .ft-emp-progress-head span { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-emp-progress-bar { background: #1f242f; } :root[data-theme="dark"] .ft-emp-greeting p { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .employee-current-card.ft-emp-card { background: #161b26 !important; color: var(--ft-text) !important; border: 1px solid var(--ft-border) !important; border-left: 1px solid var(--ft-border) !important; border-radius: 16px !important; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.20) !important; padding: 0 !important; overflow: hidden; } :root[data-theme="dark"] .ft-emp-kicker { color: var(--ft-primary, #f79d79); } :root[data-theme="dark"] .ft-emp-card h3 { color: var(--ft-text, #90abdf) !important; } :root[data-theme="dark"] .ft-emp-place { color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-emp-place span span { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-emp-meta { color: var(--ft-text-3, #90b0df) !important; } :root[data-theme="dark"] .ft-emp-steps li { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-emp-steps li i { background: #333741; } :root[data-theme="dark"] .ft-emp-steps li.is-done { color: #77f8c2; } :root[data-theme="dark"] .ft-emp-steps li.is-current { color: var(--ft-text, #90abdf); } :root[data-theme="dark"] .ft-emp-tool { border: 1px solid var(--ft-border, #333741); background: #161b26; color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-emp-tool:hover { background: var(--ft-surface-2, #1f242f); } :root[data-theme="dark"] .ft-emp-primary { width: 100%; min-height: 52px !important; border-radius: 12px !important; font-size: 16px !important; } :root[data-theme="dark"] .ft-emp-section h4 { color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-emp-row { background: #161b26; border: 1px solid var(--ft-border, #333741); color: var(--ft-text, #90abdf); } :root[data-theme="dark"] .ft-emp-row-main small { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-emp-row.is-done { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-emp-row.is-done .ft-ico { color: #77f8c2; } :root[data-theme="dark"] .employee-dashboard-card, :root[data-theme="dark"] .employee-dashboard-sections, :root[data-theme="dark"] .employee-dashboard-sections > *, :root[data-theme="dark"] .employee-dashboard-summary { min-width: 0 !important; max-width: 100% !important; box-sizing: border-box; } :root[data-theme="dark"] .employee-dashboard-summary { display: block !important; width: 100% !important; padding: 0 !important; background: transparent !important; border: 0 !important; } :root[data-theme="dark"] .employee-dashboard-summary span, :root[data-theme="dark"] .ft-emp-progress span { background: transparent !important; border: 0 !important; padding: 0 !important; box-shadow: none !important; color: var(--ft-text-3) !important; font-weight: 400 !important; min-height: 0 !important; } :root[data-theme="dark"] .ft-emp-progress strong, :root[data-theme="dark"] .ft-emp-place strong, :root[data-theme="dark"] .ft-emp-row-main strong, :root[data-theme="dark"] .ft-emp-row-time, :root[data-theme="dark"] .ft-emp-section h4, :root[data-theme="dark"] .ft-emp-greeting h3 { color: var(--ft-text) !important; } :root[data-theme="dark"] .ft-emp-place span span { color: var(--ft-text-3) !important; font-weight: 400 !important; } :root[data-theme="dark"] .ft-emp-progress-bar i { background: #079455 !important; } @media (min-width: 821px) { :root[data-theme="dark"] #view-tickets .content-grid { gap: 20px !important; align-items: start !important; } :root[data-theme="dark"] #ticket-list { display: flex !important; flex-direction: column !important; gap: 0 !important; margin: 0 -20px -20px !important; border-top: 1px solid var(--ft-border); } :root[data-theme="dark"] #ticket-list .ticket-row { display: block !important; position: relative; margin: 0 !important; padding: 12px 20px !important; border: 0 !important; border-bottom: 1px solid #333741 !important; border-radius: 0 !important; background: #161b26 !important; box-shadow: none !important; transform: none !important; } :root[data-theme="dark"] #ticket-list .ticket-row:hover { background: var(--ft-surface-2) !important; } :root[data-theme="dark"] #ticket-list .ticket-row.is-selected { background: #1f242f !important; box-shadow: inset 3px 0 0 var(--ft-brand) !important; } :root[data-theme="dark"] #ticket-list .ticket-row::before, :root[data-theme="dark"] #ticket-list .ticket-row::after { display: none !important; } :root[data-theme="dark"] #ticket-list .mobile-ticket-card-icon, :root[data-theme="dark"] #ticket-list .mobile-ticket-card-chevron, :root[data-theme="dark"] #ticket-list .supporting-copy, :root[data-theme="dark"] #ticket-list .ticket-new-badge { display: none !important; } :root[data-theme="dark"] #ticket-list .ticket-top { display: flex !important; align-items: flex-start !important; gap: 12px !important; margin: 0 !important; } :root[data-theme="dark"] #ticket-list .ticket-top > div { flex: 1; min-width: 0; } :root[data-theme="dark"] #ticket-list .card-label { font-size: 12px !important; margin: 0 !important; } :root[data-theme="dark"] #ticket-list .ticket-title { margin: 1px 0 0 !important; font-size: 14px !important; font-weight: 600 !important; line-height: 20px !important; color: var(--ft-text) !important; } :root[data-theme="dark"] #ticket-list .ticket-subline { margin: 1px 0 0 !important; font-size: 13px !important; color: var(--ft-text-3) !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } :root[data-theme="dark"] #ticket-list .ticket-meta { display: flex !important; flex-wrap: wrap; align-items: center !important; gap: 10px !important; margin: 8px 0 0 !important; font-size: 13px !important; color: var(--ft-text-3) !important; } :root[data-theme="dark"] #ticket-list .priority-chip { background: transparent !important; padding: 0 !important; color: var(--ft-text-3) !important; font-size: 12px !important; } :root[data-theme="dark"] #ticket-list .priority-chip.warning, :root[data-theme="dark"] #ticket-list .priority-chip.danger { color: var(--ft-s-crit) !important; font-weight: 600 !important; } :root[data-theme="dark"] #view-tickets .detail-card { position: sticky; top: 16px; } } :root[data-theme="dark"] .segmented-tabs { display: flex !important; gap: 20px !important; padding: 0 !important; margin: 4px 0 12px !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--ft-border) !important; border-radius: 0 !important; box-shadow: none !important; } :root[data-theme="dark"] .segmented-tab { flex: 0 0 auto !important; min-height: 40px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--ft-text-3) !important; font-size: 14px !important; font-weight: 500 !important; box-shadow: none !important; border-bottom: 2px solid transparent !important; margin-bottom: -1px !important; } :root[data-theme="dark"] .segmented-tab.is-active { color: var(--ft-text) !important; font-weight: 600 !important; border-bottom-color: var(--ft-text) !important; } :root[data-theme="dark"] .ticket-confirmation-note { background: var(--ft-primary-soft) !important; border: 1px solid rgba(233, 124, 47, 0.4) !important; border-left: 1px solid rgba(233, 124, 47, 0.4) !important; border-radius: 10px !important; box-shadow: none !important; } :root[data-theme="dark"] .ticket-confirmation-note strong { color: var(--ft-text) !important; font-size: 14px !important; font-weight: 600 !important; } :root[data-theme="dark"] .contractor-ticket-card, :root[data-theme="dark"] .detail-card .detail-grid > div, :root[data-theme="dark"] .detail-card dl > div { background: #161b26 !important; border: 1px solid var(--ft-border) !important; border-radius: 10px !important; box-shadow: none !important; } :root[data-theme="dark"] .detail-card dd, :root[data-theme="dark"] .detail-card .detail-grid strong { font-size: 14px !important; font-weight: 500 !important; color: var(--ft-text) !important; } :root[data-theme="dark"] .ticket-message-card .ticket-message-text { font-size: 15px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--ft-text) !important; } :root[data-theme="dark"] .ticket-message-card .field-label::before, :root[data-theme="dark"] .ticket-message-card > .field-label > span:first-child { display: none !important; } :root[data-theme="dark"] .object-color-code { color: var(--ft-text-3, #90b0df); } @media (min-width: 821px) { :root[data-theme="dark"] #object-list, :root[data-theme="dark"] #customer-list { display: flex !important; flex-direction: column !important; gap: 0 !important; margin: 0 -20px -20px !important; border-top: 1px solid var(--ft-border); } :root[data-theme="dark"] #object-list .object-card, :root[data-theme="dark"] #customer-list .object-card { margin: 0 !important; padding: 12px 20px !important; border: 0 !important; border-bottom: 1px solid #333741 !important; border-radius: 0 !important; background: #161b26 !important; box-shadow: none !important; transform: none !important; } :root[data-theme="dark"] #object-list .object-card:hover, :root[data-theme="dark"] #customer-list .object-card:hover { background: var(--ft-surface-2) !important; } :root[data-theme="dark"] #object-list .object-card.is-selected, :root[data-theme="dark"] #customer-list .object-card.is-selected { background: #1f242f !important; box-shadow: inset 3px 0 0 var(--ft-brand) !important; } :root[data-theme="dark"] .object-card-header { margin: 0 !important; gap: 12px !important; } :root[data-theme="dark"] .object-card-header h4 { margin: 1px 0 0 !important; font-size: 14px !important; font-weight: 600 !important; } :root[data-theme="dark"] .object-card .card-label { margin: 0 !important; } :root[data-theme="dark"] .object-card-meta { margin: 2px 0 0 !important; font-size: 13px !important; color: var(--ft-text-3) !important; } :root[data-theme="dark"] #view-objects .detail-card, :root[data-theme="dark"] #view-customers .detail-card { position: sticky; top: 16px; } } :root[data-theme="dark"] .main-shell { align-content: start !important; align-items: start !important; min-width: 0 !important; } :root[data-theme="dark"] .view-section { min-width: 0 !important; box-sizing: border-box !important; } :root[data-theme="dark"] .view-section > * { min-width: 0; max-width: 100%; box-sizing: border-box; } :root[data-theme="dark"] .activity-filter-grid { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; } :root[data-theme="dark"] .activity-filter-grid > * { flex: 1 1 160px !important; min-width: 0 !important; } :root[data-theme="dark"] #calendar-grid.calendar-grid { grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)) !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell { min-width: 0 !important; } :root[data-theme="dark"] .ft-check { color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-count { background: #1f242f; } :root[data-theme="dark"] .ft-backlog-card { border: 1px solid var(--ft-border, #333741); background: #161b26; } :root[data-theme="dark"] .ft-backlog-open strong { color: var(--ft-text, #90abdf); } :root[data-theme="dark"] .ft-backlog-open small { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-backlog-open em { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-backlog-card.tone-critical em { color: #ee8981; } :root[data-theme="dark"] .ft-backlog-plan { border: 1px solid var(--ft-border-strong, #414651); background: #161b26; color: var(--ft-primary, #f79d79); } :root[data-theme="dark"] .ft-week-corner, :root[data-theme="dark"] .ft-week-day { color: var(--ft-text-3, #90b0df); background: var(--ft-surface-2, #1f242f); border-bottom: 1px solid var(--ft-border, #333741); } :root[data-theme="dark"] .ft-week-day { border-left: 1px solid var(--ft-border, #333741); } :root[data-theme="dark"] .ft-week-day.is-today { color: var(--ft-primary, #f79d79); } :root[data-theme="dark"] .ft-week-corner, :root[data-theme="dark"] .ft-week-person { background: #161b26; box-shadow: 1px 0 0 var(--ft-border, rgba(0, 0, 0, 0.60)); } :root[data-theme="dark"] .ft-week-corner { background: var(--ft-surface-2, #1f242f); } :root[data-theme="dark"] .ft-week-person { border-bottom: 1px solid #333741; } :root[data-theme="dark"] .ft-week-person small { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-week-cell { border-left: 1px solid #333741; border-bottom: 1px solid #333741; } :root[data-theme="dark"] .ft-week-cell.is-today { background: #161b26; } :root[data-theme="dark"] .ft-week-cell.is-absent { background: repeating-linear-gradient(135deg, #1f242f 0 6px, #1f242f 6px 12px); } :root[data-theme="dark"] .ft-week-cell.is-drop-target { background: var(--ft-primary-soft, #1f242f); box-shadow: inset 0 0 0 2px var(--ft-primary, rgba(0, 0, 0, 0.60)); } :root[data-theme="dark"] .ft-dispatch.is-dragging .ft-week-cell:not(.is-absent) { background-color: #161b26; } :root[data-theme="dark"] .ft-absence { color: #90b0df; } :root[data-theme="dark"] .ft-job { background: #262b36; color: var(--ft-text, #90abdf); } :root[data-theme="dark"] .ft-job span { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-job.tone-progress { background: #1f242f; } :root[data-theme="dark"] .ft-job.tone-done { background: rgba(47, 233, 124, 0.16); } :root[data-theme="dark"] .ft-job.tone-review { background: #1f242f; } :root[data-theme="dark"] .ft-job.tone-critical { background: #1f242f; } :root[data-theme="dark"] .ft-week-cell:hover .ft-cell-add, :root[data-theme="dark"] .ft-cell-add:focus-visible { color: var(--ft-primary, #f79d79); background: var(--ft-primary-soft, #1f242f); } :root[data-theme="dark"] .ft-cell-load { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-dialog { background: #161b26; box-shadow: 0 24px 48px rgba(0, 0, 0, 0.60); color: #90abdf; } :root[data-theme="dark"] .ft-dialog-sub { color: #90b0df; } :root[data-theme="dark"] .ft-field { color: #90aedf; } :root[data-theme="dark"] .ft-dialog-note { background: #1f242f; color: #f09b7f; } :root[data-theme="dark"] .ft-legend { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-bar-pair { border-bottom: 1px solid var(--ft-border-strong, #414651); } :root[data-theme="dark"] .ft-bar em { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-bar-group small { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-catbar span:first-child { color: var(--ft-text-2, #90aedf); } :root[data-theme="dark"] .ft-catbar-track { background: #1f242f; } :root[data-theme="dark"] .ft-table th { color: var(--ft-text-3, #90b0df); background: var(--ft-surface-2, #1f242f); border-bottom: 1px solid var(--ft-border, #333741); } :root[data-theme="dark"] .ft-table td { border-bottom: 1px solid #333741; } :root[data-theme="dark"] .ft-footnote { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] .ft-object-tabs { background: #161b26 !important; } @media (min-width: 821px) { :root[data-theme="dark"] .settings-shell { display: grid !important; grid-template-columns: 220px minmax(0, 1fr) !important; gap: 0 24px !important; align-items: start !important; } :root[data-theme="dark"] .settings-shell > * { grid-column: 2; min-width: 0; } :root[data-theme="dark"] .settings-shell > .settings-tabs { grid-column: 1; grid-row: 1 / span 40; position: sticky; top: 16px; display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; gap: 2px !important; padding: 0 !important; margin: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; overflow: visible !important; } } :root[data-theme="dark"] .settings-tab { justify-content: flex-start !important; text-align: left !important; min-height: 36px !important; padding: 0 12px !important; border: 1px solid transparent !important; border-radius: 8px !important; background: transparent !important; color: var(--ft-text-2) !important; font-size: 14px !important; font-weight: 500 !important; box-shadow: none !important; white-space: nowrap; } :root[data-theme="dark"] .settings-tab:hover { background: #1f242f !important; } :root[data-theme="dark"] .settings-tab.is-active { background: #161b26 !important; border-color: var(--ft-border) !important; color: var(--ft-text) !important; font-weight: 600 !important; box-shadow: var(--ft-shadow) !important; } :root[data-theme="dark"] .settings-panel { padding: 20px 24px !important; } :root[data-theme="dark"] .settings-form-grid { gap: 14px 16px !important; } @media (max-width: 820px) { :root[data-theme="dark"] .settings-tabs { display: flex !important; overflow-x: auto !important; gap: 4px !important; padding-bottom: 4px !important; } } :root[data-theme="dark"] .settings-shell > .settings-tabs { align-items: stretch !important; justify-content: flex-start !important; } :root[data-theme="dark"] .settings-tab { width: 100% !important; display: flex !important; align-items: center !important; border-bottom-width: 1px !important; } :root[data-theme="dark"] .settings-tab::before, :root[data-theme="dark"] .settings-tab::after { display: none !important; } @media (max-width: 760px) { :root[data-theme="dark"] .bottom-nav { left: 0 !important; right: 0 !important; bottom: 0 !important; border-radius: 0 !important; border: 0 !important; border-top: 1px solid var(--ft-border) !important; min-height: 64px !important; padding: 6px 8px calc(6px + env(safe-area-inset-bottom, 0px)) !important; gap: 2px !important; } :root[data-theme="dark"] .bottom-nav .nav-item { position: relative !important; min-height: 50px !important; padding: 6px 2px !important; gap: 3px !important; font-size: 0.7rem !important; font-weight: 600 !important; } :root[data-theme="dark"] .bottom-nav .nav-icon { width: 24px !important; height: 24px !important; background: transparent !important; } :root[data-theme="dark"] .bottom-nav .nav-icon .ui-icon { width: 22px !important; height: 22px !important; } :root[data-theme="dark"] .bottom-nav .nav-label { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; max-width: 100% !important; } :root[data-theme="dark"] .bottom-nav .nav-item .nav-count { box-shadow: 0 0 0 2px var(--ft-surface, rgba(0, 0, 0, 0.60)) !important; } } :root[data-theme="dark"] .tasks-kpi-card.is-active { border-color: var(--ft-brand) !important; background: #1f242f !important; box-shadow: inset 0 0 0 1px var(--ft-brand) !important; } :root[data-theme="dark"] .task-priority-badge.ft-prio-crit { background: #1f242f !important; color: #ee8981 !important; } :root[data-theme="dark"] .task-priority-badge.ft-prio-high { background: #1f242f !important; color: #f9a676 !important; } :root[data-theme="dark"] .task-priority-badge.ft-prio-mid { background: #1f242f !important; color: #819eee !important; } :root[data-theme="dark"] .task-priority-badge.ft-prio-low { background: #1f242f !important; color: #90b0df !important; } @media (max-width: 760px) { :root[data-theme="dark"][data-theme] .tasks-kpi-card strong { background: #1f242f; } :root[data-theme="dark"] .tasks-kpi-card.is-active { background: var(--ft-text) !important; border-color: var(--ft-text) !important; color: #fff !important; box-shadow: none !important; } :root[data-theme="dark"] .tasks-kpi-card.is-active .task-kpi-short { color: #fff !important; } :root[data-theme="dark"] .tasks-kpi-card.is-active strong { background: rgba(255, 255, 255, 0.06) !important; color: #fff !important; } :root[data-theme="dark"][data-theme] .task-list-row { border-bottom: 1px solid var(--ft-border, #333741) !important; } :root[data-theme="dark"] .task-list-row .task-title-cell small { color: var(--ft-text-3, #90b0df) !important; } :root[data-theme="dark"] .task-list-row .task-priority-cell, :root[data-theme="dark"] .task-list-row .task-object-cell, :root[data-theme="dark"] .task-list-row .task-owner-cell, :root[data-theme="dark"] .task-list-row .task-due-cell { color: var(--ft-text-2, #90aedf) !important; } } :root[data-theme="dark"] .ticket-subline .ft-unassigned { color: var(--ft-crit, #ee8981); } :root[data-theme="dark"][data-theme] #calendar-grid.calendar-grid[data-mode="month"], :root[data-theme="dark"][data-theme] #calendar-grid.calendar-grid[data-mode="week"] { border: 1px solid var(--ft-border, #333741) !important; background: var(--ft-border, #333741) !important; } :root[data-theme="dark"] #calendar-grid[data-mode="month"] .calendar-weekday { background: var(--ft-surface-2, #1f242f); color: var(--ft-text-3, #90b0df); border-bottom: 1px solid var(--ft-border, #333741); } :root[data-theme="dark"] #calendar-grid[data-mode="month"] .calendar-cell, :root[data-theme="dark"] #calendar-grid[data-mode="week"] .calendar-cell { border-right: 1px solid var(--ft-border, #333741) !important; border-bottom: 1px solid var(--ft-border, #333741) !important; background: var(--ft-surface, #161b26) !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell.is-filler { background: var(--ft-surface-2, #1f242f) !important; } :root[data-theme="dark"] #calendar-grid[data-mode="month"] .calendar-cell-head strong { color: var(--ft-text-2, #90aedf) !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell.is-current { background: #1f242f !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell.is-selected-day { box-shadow: inset 0 0 0 2px var(--ft-brand, rgba(0, 0, 0, 0.60)) !important; } :root[data-theme="dark"] #calendar-grid .calendar-day-create { color: var(--ft-text-3, #90aadf) !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell:hover .calendar-day-create, :root[data-theme="dark"] #calendar-grid .calendar-day-create:focus-visible { background: var(--ft-surface-2, #1f242f) !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell-count { color: var(--ft-text-3, #90aadf) !important; } :root[data-theme="dark"] #calendar-grid[data-mode="month"] .calendar-chip, :root[data-theme="dark"] #calendar-grid[data-mode="week"] .calendar-chip { background: var(--ft-surface-2, #1f242f) !important; color: var(--ft-text, #90abdf) !important; } :root[data-theme="dark"] #calendar-grid .calendar-chip.calendar-type-ticket { background: #1f242f !important; } :root[data-theme="dark"] #calendar-grid .calendar-chip.calendar-type-appointment { background: #1f242f !important; } :root[data-theme="dark"] #calendar-grid .calendar-chip.calendar-type-recurring { background: rgba(47, 233, 124, 0.16) !important; } :root[data-theme="dark"] #calendar-grid .calendar-chip.calendar-type-emergency { background: #1f242f !important; } :root[data-theme="dark"] #calendar-grid .calendar-chip-time { color: var(--ft-text-3, #90b0df); } :root[data-theme="dark"] #calendar-grid .calendar-more-button { color: var(--ft-primary, #f79d79) !important; } :root[data-theme="dark"] #view-calendar .calendar-legend-item { color: var(--ft-text-3, #90b0df) !important; } @media (max-width: 760px) { :root[data-theme="dark"][data-theme] #ticket-list .ticket-row { border-bottom: 1px solid var(--ft-border, #333741) !important; } :root[data-theme="dark"][data-theme] #ticket-list .ticket-row.is-selected { background: #1f242f !important; box-shadow: inset 3px 0 0 var(--ft-brand, rgba(0, 0, 0, 0.60)) !important; } :root[data-theme="dark"] #ticket-list .ticket-row > .supporting-copy { color: var(--ft-text-3, #90b0df) !important; } :root[data-theme="dark"] #ticket-list .ticket-meta > span:not(.ticket-status-badge) { color: var(--ft-text-2, #90aedf) !important; } } :root[data-theme="dark"] #view-qr-posters #qr-template-delete { color: var(--ft-s-crit, #ee8981) !important; } :root[data-theme="dark"] #view-qr-posters #qr-template-delete:hover { background: var(--ft-s-crit-bg, #1f242f) !important; } :root[data-theme="dark"] #view-qr-posters .qr-preview-column { background: #262b36 !important; } :root[data-theme="dark"] #view-qr-posters #qr-preview-paper { box-shadow: 0 1px 3px rgba(0, 0, 0, 0.30), 0 12px 32px rgba(0, 0, 0, 0.35) !important; } :root[data-theme="dark"] .employee-detail-tabs > button.is-active, :root[data-theme="dark"] .tasks-tabs > button.is-active, :root[data-theme="dark"] .dashboard-timeline-hour.is-new-day, :root[data-theme="dark"] .dashboard-timeline-hour.is-new-day small, :root[data-theme="dark"] .employee-map-list-assignment > span { color: #f09b7f !important; } :root[data-theme="dark"] .employee-map-list-assignment-dummy, :root[data-theme="dark"] .dashboard-setup-card span { color: #f79d79 !important; } :root[data-theme="dark"] .tasks-tabs > button.is-active { border-color: #c2410c !important; } :root[data-theme="dark"] .tasks-tabs > button:not(.is-active), :root[data-theme="dark"] .employee-absence-info > span, :root[data-theme="dark"] .employee-month-day.is-muted span { color: #90b0df !important; } :root[data-theme="dark"] .employee-month-day span { color: inherit; } :root[data-theme="dark"] .dashboard-event-dismiss { color: #ee8981 !important; } :root[data-theme="dark"] .task-status-badge { color: #f9a676 !important; } :root[data-theme="dark"] .employee-calendar-fab { background: #c2410c !important; color: #fff !important; } :root[data-theme="dark"] .worker-status-label.active, :root[data-theme="dark"] .worker-status-label.online { background: rgba(47, 233, 124, 0.16) !important; color: #77f8c2 !important; border-color: rgba(62, 218, 124, 0.4) !important; } :root[data-theme="dark"] .worker-status-label.away, :root[data-theme="dark"] .worker-status-label.unterwegs { background: #1f242f !important; color: #f9a676 !important; border-color: rgba(253, 193, 27, 0.4) !important; } :root[data-theme="dark"] .worker-status-label.inactive, :root[data-theme="dark"] .worker-status-label.offline { background: #1f242f !important; color: #90aedf !important; border-color: #333741 !important; } :root[data-theme="dark"] .timeline-lead-bell, :root[data-theme="dark"] .dashboard-timeline-lead > strong, :root[data-theme="dark"] .task-confirmation-badge.is-confirmed { background-color: #067647 !important; color: #fff !important; } :root[data-theme="dark"] .employee-calendar-details { background: var(--ft-surface) !important; border: 1px solid var(--ft-border) !important; color: var(--ft-text) !important; } :root[data-theme="dark"] .employee-calendar-item { background: var(--ft-surface-2) !important; border: 1px solid var(--ft-border) !important; color: var(--ft-text) !important; box-shadow: none !important; } :root[data-theme="dark"] .employee-calendar-item .employee-work-main strong { color: var(--ft-text) !important; } :root[data-theme="dark"] .employee-calendar-item .employee-work-main p, :root[data-theme="dark"] .employee-calendar-item .employee-work-main small, :root[data-theme="dark"] .employee-calendar-item .employee-work-meta, :root[data-theme="dark"] .employee-calendar-item .employee-work-meta span { color: var(--ft-text-2) !important; } :root[data-theme="dark"] .employee-calendar-item .employee-work-type { color: var(--ft-text-3) !important; } :root[data-theme="dark"] .employee-month-day.is-today { background: #1f242f !important; color: #f09b7f !important; border: 2px solid #f26b1d !important; box-shadow: none !important; } /* Bestehende Dunkel-Regeln aus redesign.css (Vorrang) */ :root[data-theme="dark"] .nav-group-label { margin: 0; padding: 14px 14px 4px; font-size: 12px; font-weight: 500; color: rgba(255, 255, 255, 0.55); } :root[data-theme="dark"] .nav-count { margin-left: auto; padding: 1px 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.14); color: #ffffff; font-size: 12px; font-weight: 600; } :root[data-theme="dark"] .ft-kpi, :root[data-theme="dark"] .ft-card { background: #0f1d31; border-color: #22324a; color: #e6edf6; box-shadow: none; } :root[data-theme="dark"] .ft-card-head, :root[data-theme="dark"] .ft-work-head { border-color: #22324a; background: transparent; } :root[data-theme="dark"] .ft-work-row, :root[data-theme="dark"] .ft-team-row { border-color: #1b2a40; } :root[data-theme="dark"] .ft-work-row:hover { background: #13243b; } :root[data-theme="dark"] .ft-kpi-label, :root[data-theme="dark"] .ft-kpi-hint, :root[data-theme="dark"] .ft-card-head p, :root[data-theme="dark"] .ft-work-main small, :root[data-theme="dark"] .ft-team-main small, :root[data-theme="dark"] .ft-work-head, :root[data-theme="dark"] .ft-load em { color: #9fb0c5; } :root[data-theme="dark"] .ft-seg-group { background: #13243b; } :root[data-theme="dark"] .ft-seg.is-active { background: #22324a; color: #fff; } :root[data-theme="dark"] .ft-assign-button { background: transparent; } :root[data-theme="dark"] .ft-person, :root[data-theme="dark"] .ft-prio, :root[data-theme="dark"] .ft-work-due { color: #d3dcea; } :root[data-theme="dark"] .ft-load-bar { background: #22324a; } :root[data-theme="dark"] .ft-load-bar i { background: #7d8ea6; } :root[data-theme="dark"] .ft-emp-progress, :root[data-theme="dark"] .ft-emp-card, :root[data-theme="dark"] .ft-emp-row, :root[data-theme="dark"] .ft-emp-tool { background: #0f1d31 !important; border-color: #22324a !important; color: #e6edf6 !important; } :root[data-theme="dark"] .ft-emp-card h3 { color: #fff !important; } :root[data-theme="dark"] .ft-emp-place, :root[data-theme="dark"] .ft-emp-meta, :root[data-theme="dark"] .ft-emp-row-main small, :root[data-theme="dark"] .ft-emp-greeting p { color: #9fb0c5 !important; } :root[data-theme="dark"] .ft-emp-progress-bar, :root[data-theme="dark"] .ft-emp-steps li i { background: #22324a; } :root[data-theme="dark"] .ft-backlog-card, :root[data-theme="dark"] .ft-backlog-plan, :root[data-theme="dark"] .ft-week-person, :root[data-theme="dark"] .ft-week-corner { background: #0f1d31; border-color: #22324a; color: #e6edf6; } :root[data-theme="dark"] .ft-week-day, :root[data-theme="dark"] .ft-table th { background: #13243b; border-color: #22324a; color: #9fb0c5; } :root[data-theme="dark"] .ft-week-cell, :root[data-theme="dark"] .ft-table td { border-color: #1b2a40; } :root[data-theme="dark"] .ft-backlog-open strong, :root[data-theme="dark"] .ft-job strong { color: #e6edf6; } :root[data-theme="dark"] .ft-job { background: #1b2a40; } @media (max-width: 760px) { :root[data-theme="dark"] .bottom-nav .nav-item .nav-count { box-shadow: 0 0 0 2px #111827 !important; } } :root[data-theme="dark"] .task-priority-badge.ft-prio-crit { background: rgba(240,68,56,.16) !important; color: #fda29b !important; } :root[data-theme="dark"] .task-priority-badge.ft-prio-high { background: rgba(247,144,9,.16) !important; color: #fec84b !important; } :root[data-theme="dark"] .task-priority-badge.ft-prio-mid { background: rgba(83,138,255,.16) !important; color: #a4bcfd !important; } :root[data-theme="dark"] .task-priority-badge.ft-prio-low { background: rgba(152,162,179,.16) !important; color: #d0d5dd !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell { background: #111827 !important; } :root[data-theme="dark"] #calendar-grid .calendar-chip { background: #1f2937 !important; color: #f2f4f7 !important; } :root[data-theme="dark"] #calendar-grid.calendar-grid[data-mode] { background: #1f2a3a !important; border-color: #1f2a3a !important; } :root[data-theme="dark"] #calendar-grid .calendar-weekday { background: #0f1b2b !important; color: #98a2b3 !important; border-color: #1f2a3a !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell { border-color: #1f2a3a !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell.is-filler { background: #0b1522 !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell.is-current { background: #1d1a17 !important; } :root[data-theme="dark"] #calendar-grid .calendar-cell-head strong { color: #d0d5dd !important; } :root[data-theme="dark"] #calendar-grid .calendar-chip-time { color: #98a2b3; } :root[data-theme="dark"] .tasks-kpi-card.is-active { background: rgba(242,107,29,.12) !important; border-color: #f26b1d !important; } :root[data-theme="dark"] .employee-map-canvas { background-color: #d9d5ce !important; } :root[data-theme="dark"] #view-qr-posters .qr-editor-tab.is-active { color: #fb9a5b !important; border-bottom-color: #f26b1d !important; } :root[data-theme="dark"] #view-qr-posters .qr-preview-column { background-color: #0b0f17 !important; background-image: radial-gradient(rgba(255,255,255,.05) 1px, transparent 1px) !important; } /* Vereinheitlichung: alte blau-dunkle Flaechen auf neutrale Palette */ :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .surface-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .detail-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-panel, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-kpi, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-backlog-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-week-corner, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-week-person, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-v2-status-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-ticket-row, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-worker-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-form-panel, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .public-service-config, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-contractor-config, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-employee-assignment, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .completion-submit-box, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-timeline-grid, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-timeline-row, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-row, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .contractor-row, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .assignment-option, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .customer-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-table-body, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-section, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-list-row, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-cell, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .tasks-kpi-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .tasks-side-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .settings-panel, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .topbar, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .sidebar, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .bottom-nav, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-timeline-employee, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-timeline-corner, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-emp-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-emp-row, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-emp-progress, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .detail-stack, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-ticket-summary, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .tasks-list-panel, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-table, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .customer-service-option, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-absence-box, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-section-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-editor-column, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-preview-column, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-editor-topbar, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-editor-tabbar, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-sidebar-object-picker, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-note-visibility, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-list-more, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-group-more { background: var(--ft-surface) !important; background-image: none !important; border-color: var(--ft-border) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-seg-group, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-week-day, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-timeline-hour, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-empty, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-stat-kpi, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-stat-summary, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-v2-worker, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-v2-object, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-worker-visit, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .mobile-ticket-card-icon, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-weekday, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-header, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .detail-grid > div, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-detail-grid > div, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-detail-grid > div, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-emp-tool, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .settings-toggle, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .action-badge, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .segmented-tab, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .priority-chip, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-priority-badge:not([class*=ft-prio]), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-ticket-summary-grid > div, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .simple-list > li, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-assignment-summary > span, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-richtext-input, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-preview-meta, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-preview-contact { background: var(--ft-surface-2) !important; background-image: none !important; border-color: var(--ft-border) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) select, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) textarea, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .select-input, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .search-input, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .secondary-action, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .filter-chip, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .icon-action, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .date-picker-action, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .theme-toggle { background-color: var(--ft-surface) !important; background-image: none; border-color: var(--ft-border-strong) !important; color: var(--ft-text) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-legend-item, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .view-section, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .content-grid, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .main-shell, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) #employee-dashboard-card.employee-dashboard-card, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-dashboard-sections { background: transparent !important; background-image: none !important; box-shadow: none !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-row.is-selected, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .object-card.is-selected, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .customer-card.is-selected, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-backlog-card.is-selected { background: var(--ft-primary-soft) !important; box-shadow: inset 3px 0 0 var(--ft-brand) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .filter-chip.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-seg.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .segmented-tab.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .segmented-tab[aria-selected=true], :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-mode.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-detail-tabs > button.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-timeline-frame.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ps-seg button.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ps-segctl button.is-active { background: rgba(242, 107, 29, 0.16) !important; color: #fdba8c !important; border-color: rgba(242, 107, 29, 0.55) !important; box-shadow: none !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .filter-chip:not(.is-active), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-mode:not(.is-active), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .segmented-tab:not(.is-active), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-detail-tabs > button:not(.is-active), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-seg:not(.is-active) { background: transparent !important; color: var(--ft-text-2) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .link-action, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-assign-button, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-emp-kicker, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .nav-item.is-active .nav-label, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .nav-item.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-more-button, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-week-day.is-today, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .feature-more-link, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ps-tpl-group, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .qr-editor-tab.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .tasks-tabs > button.is-active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-map-list-assignment > span { color: #fb923c !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-assign-button { border-color: rgba(251, 146, 60, 0.6) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .tasks-tabs > button:not(.is-active), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-setup-actions > span, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-job > span, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .supporting-copy, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ps-help, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ps-note { color: var(--ft-text-3) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-job > span { color: #cecfd2 !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-cell.is-current .calendar-cell-head strong { color: #ffffff !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-calendar-fab { background: var(--ft-primary) !important; color: #fff !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.active, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.online { background: rgba(23, 178, 106, 0.16) !important; color: #47cd89 !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.away, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.unterwegs { background: rgba(247, 144, 9, 0.16) !important; color: #fdb022 !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.inactive, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.offline { background: #1f242f !important; color: #cecfd2 !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.sick, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .worker-status-label.krank { background: rgba(240, 68, 56, 0.16) !important; color: #f97066 !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .dashboard-setup-card span { background: rgba(242, 107, 29, 0.14) !important; color: #fdba8c !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .employee-detail-tabs { background: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-meta span:not([class*=badge]), :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-meta > span:not([class*=badge]) { background: transparent !important; padding-left: 0 !important; padding-right: 0 !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .calendar-cell.is-current { background: rgba(242, 107, 29, 0.08) !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .primary-action, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .button-primary { background: var(--ft-primary) !important; border-color: var(--ft-primary) !important; color: #fff !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-new, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-new, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-new { color: #84adff !important; background: rgba(41, 112, 255, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-assigned, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-assigned, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-assigned { color: #a4a7fd !important; background: rgba(99, 102, 241, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-progress, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-progress, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-progress { color: #fdb022 !important; background: rgba(247, 144, 9, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-work, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-work, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-work { color: #fdb022 !important; background: rgba(247, 144, 9, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-waiting, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-waiting, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-waiting { color: #bd9cfe !important; background: rgba(139, 92, 246, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-question, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-question, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-question { color: #bd9cfe !important; background: rgba(139, 92, 246, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-review, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-review, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-review { color: #67e3f9 !important; background: rgba(6, 174, 212, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-done, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-done, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-done { color: #47cd89 !important; background: rgba(23, 178, 106, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-critical, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-critical, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-critical { color: #f97066 !important; background: rgba(240, 68, 56, 0.16) !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-handoff, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-handoff, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-handoff { color: #cecfd2 !important; background: #1f242f !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge.ticket-status-closed, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge.task-status-closed, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ft-status.is-closed { color: #cecfd2 !important; background: #1f242f !important; border-color: transparent !important; } :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .ticket-status-badge, :root[data-theme="dark"] body:not(#ft-a):not(#ft-b) .task-status-badge { box-shadow: none !important; }