/* Feature-Steuerung: Versteckt deaktivierte Feature-Elemente */
.feature-hidden { display: none !important; }

/* ============================================
   GLOBAL GLASS OVERRIDE — Automatically convert white inline-style cards to Glass
   Targets cards inside content tabs that use inline background: white/#fff
   Skips date-pickers, popovers, dropdowns (z-index > 999 or position absolute on small els)
   WICHTIG: greift NUR im Light Mode — body:not(.dark-mode) verhindert Konflikt mit Dark-Mode-Overrides
   ============================================ */
body:not(.dark-mode) .tab-content [style*="background: white"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body:not(.dark-mode) .tab-content [style*="background:white"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body:not(.dark-mode) .tab-content [style*="background: #fff"]:not([style*="background: #fff3"]):not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body:not(.dark-mode) .tab-content [style*="background:#fff"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body:not(.dark-mode) .tab-content [style*="background: #ffffff"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]) {
  background: linear-gradient(170deg, rgba(255,255,255,0.42) 0%, rgba(255,255,255,0.28) 100%) !important;
  backdrop-filter: blur(40px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(150%) !important;
  border: 1.5px solid rgba(255,255,255,0.7) !important;
  border-radius: 18px !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.05),
    0 10px 36px rgba(0,0,0,0.12),
    0 3px 12px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.4) !important;
}

/* DARK MODE Equivalent — same selectors, dark glass gradient */
body.dark-mode .tab-content [style*="background: white"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body.dark-mode .tab-content [style*="background:white"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body.dark-mode .tab-content [style*="background: #fff"]:not([style*="background: #fff3"]):not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body.dark-mode .tab-content [style*="background:#fff"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]),
body.dark-mode .tab-content [style*="background: #ffffff"]:not([id*="custom-range"]):not([style*="position: absolute"]):not([onmouseover]):not([onmouseenter]):not([onclick]):not([style*="cursor: pointer"]) {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  backdrop-filter: blur(30px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(160%) !important;
  border: 1.5px solid rgba(255,255,255,0.10) !important;
  border-radius: 18px !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.03),
    0 10px 36px rgba(0,0,0,0.5),
    0 3px 12px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
  color: #E5E5EA !important;
}

/* Inner Daily-Callbacks-Container (background: #f9f9f9) */
body.dark-mode [style*="background:#f9f9f9"],
body.dark-mode [style*="background: #f9f9f9"] {
  background: rgba(255,255,255,0.03) !important;
  border-color: rgba(255,255,255,0.08) !important;
}

:root {
  --primary-color: #af1000;
  --primary-hover: #d91507;
  --secondary-color: #2196f3;
  --background: #F2F1F6;
  --card-background: #ffffff;
  --text-primary: #1C1C1E;
  --text-secondary: #8E8E93;
  --border-color: #e0e0e0;
  --success-color: #2e7d32;
  --warning-color: #af1000;
  --danger-color: #af1000;
  --shadow: 0 2px 4px rgba(0,0,0,0.04);
  --shadow-hover: 0 4px 20px rgba(0,0,0,0.08);
  /* LavaHome glass tokens */
  --glass-bg: linear-gradient(170deg, rgba(255,255,255,0.32) 0%, rgba(255,255,255,0.2) 100%);
  --glass-border: 1.5px solid rgba(255,255,255,0.4);
  --glass-shadow: 0 4px 20px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.8);
  --glass-blur: blur(40px) saturate(150%);
  --radius-card: 20px;
  --radius-button: 10px;
  --ease-ios: cubic-bezier(0.4, 0, 0.2, 1);
}

/* === DARK MODE (LavaHome-Apple-Premium, body.dark-mode class) === */
/* Body = sehr dunkles LavaLoft-Rot · Cards = LavaHome-Blau-Grau-Glass für premium contrast */
body.dark-mode {
  --background: #260808;
  --card-background: rgba(40,40,55,0.5);
  --text-primary: #E5E5EA;
  --text-secondary: #AEAEB2;
  --border-color: rgba(255,255,255,0.1);
  --shadow: 0 2px 4px rgba(0,0,0,0.4);
  --shadow-hover: 0 4px 20px rgba(0,0,0,0.5);
  --glass-bg: linear-gradient(170deg, rgba(40,40,55,0.5) 0%, rgba(30,30,45,0.35) 50%, rgba(40,40,55,0.4) 100%);
  --glass-border: 1.5px solid rgba(255,255,255,0.1);
  --glass-shadow: 0 4px 20px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.08);
  color: #E5E5EA !important;
  background: #260808 !important;
}

/* Topbar */
/* Top-Bar (LavaSuite Header) — Apple Premium Dark Glass mit rotem Akzent */
body.dark-mode .console-header {
  background: linear-gradient(170deg, rgba(44,44,46,0.72) 0%, rgba(31,31,34,0.62) 100%) !important;
  backdrop-filter: blur(40px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(180%) !important;
  border: 1px solid rgba(255,60,28,0.25) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 16px 48px -14px rgba(255,60,28,0.22),
    0 6px 18px rgba(0,0,0,0.35),
    0 2px 6px rgba(0,0,0,0.20),
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -1px 0 rgba(0,0,0,0.20) !important;
}
body.dark-mode .console-nav {
  background: linear-gradient(170deg, rgba(44,44,46,0.72) 0%, rgba(31,31,34,0.62) 100%) !important;
  backdrop-filter: blur(40px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(180%) !important;
  border: 1px solid rgba(255,60,28,0.25) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 20px 60px -10px rgba(255,60,28,0.18),
    0 8px 24px -8px rgba(0,0,0,0.45),
    0 2px 8px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.2) !important;
}
body.dark-mode .console-header * { color: #E5E5EA; }
body.dark-mode .topbar-customer-name { color: #E5E5EA; }
/* Trennstrich zwischen LavaSuite und Unternehmens-Name — schwarz auf dunkel unsichtbar → weiß */
body.dark-mode .topbar-divider-pill {
  background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.28) 25%, rgba(255,255,255,0.28) 75%, rgba(255,255,255,0) 100%) !important;
}
body.dark-mode .topbar-divider {
  background: linear-gradient(180deg, rgba(255,255,255,0.03) 0%, rgba(255,255,255,0.32) 30%, rgba(255,255,255,0.32) 70%, rgba(255,255,255,0.03) 100%) !important;
}
body.dark-mode .topbar-logo-placeholder { background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.12); color: #6e6e75; }
/* Gear-Button — gleiches Glass-Design wie Quartal-Pill (Topbar-Sneakpeek) */
body.dark-mode .settings-gear-btn {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  box-shadow: 0 0 0 0.5px rgba(255,255,255,0.02), inset 0 1px 0 rgba(255,255,255,0.05) !important;
}
body.dark-mode .settings-gear-btn:hover {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.18) !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
body.dark-mode .settings-gear-btn.active {
  background: rgba(175,16,0,0.18) !important;
  border-color: rgba(175,16,0,0.32) !important;
}

/* Nav */
body.dark-mode .nav-tab { color: #AEAEB2; }
body.dark-mode .nav-tab:hover { color: #ff7a63; background: rgba(255,60,28,0.10) !important; }
body.dark-mode .nav-tab.active { color: #ff7a63; }
body.dark-mode .nav-pill {
  background: rgba(255,60,28,0.18) !important;
  border-color: rgba(255,60,28,0.40) !important;
  box-shadow: 0 2px 8px rgba(255,60,28,0.25), inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

/* Cards / Sections — Premium Apple Glass: subtilere Transparenz für Inner-Cards */
body.dark-mode .stat-card,
body.dark-mode .perf-card,
body.dark-mode .ae-summary-tile,
body.dark-mode .config-section,
body.dark-mode .analytics-section,
body.dark-mode .deal-card,
body.dark-mode .ampel-card,
body.dark-mode .feature-card,
body.dark-mode .info-box,
body.dark-mode .step-card,
body.dark-mode .outcome-card,
body.dark-mode .view-card,
body.dark-mode .callout,
body.dark-mode .ps-tier,
body.dark-mode .ps-cyc-card {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  backdrop-filter: blur(30px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(160%) !important;
  color: #E5E5EA !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.06) !important;
}

/* Top-level page wrapper / main */
body.dark-mode main,
body.dark-mode .console-content,
body.dark-mode .console-main { background: transparent !important; }

/* Tab-Content (äußerster Container pro Tab) — Apple-Premium-Glass mit Transparenz */
body.dark-mode .tab-content {
  background: linear-gradient(170deg, rgba(44,44,46,0.55) 0%, rgba(31,31,34,0.45) 100%) !important;
  backdrop-filter: blur(40px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(170%) !important;
  border-color: rgba(255,255,255,0.10) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.04),
    0 12px 40px rgba(0,0,0,0.5),
    0 4px 16px rgba(0,0,0,0.3),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

/* Section / heading text */
body.dark-mode h1, body.dark-mode h2, body.dark-mode h3, body.dark-mode h4 { color: #E5E5EA !important; }
body.dark-mode .config-section h2,
body.dark-mode .config-section-eyebrow { color: #E5E5EA; }
body.dark-mode .config-section-eyebrow { color: #AEAEB2 !important; }
body.dark-mode label { color: #E5E5EA; }
body.dark-mode .content-header-sub,
body.dark-mode .form-hint { color: #AEAEB2 !important; }

/* Form inputs */
body.dark-mode .form-input,
body.dark-mode input[type="text"],
body.dark-mode input[type="email"],
body.dark-mode input[type="number"],
body.dark-mode input[type="date"],
body.dark-mode input[type="password"],
body.dark-mode select,
body.dark-mode textarea {
  background: rgba(255,255,255,0.04) !important;
  color: #E5E5EA !important;
  border-color: rgba(255,255,255,0.12) !important;
}
body.dark-mode .form-input::placeholder,
body.dark-mode input::placeholder,
body.dark-mode textarea::placeholder { color: rgba(255,255,255,0.32) !important; }

/* Buttons */
body.dark-mode .secondary-btn { background: rgba(255,255,255,0.04) !important; border-color: rgba(255,255,255,0.12) !important; color: #E5E5EA !important; }
body.dark-mode .secondary-btn:hover { background: rgba(255,255,255,0.08) !important; }

/* Settings dropdown */
/* Settings-Dropdown — Apple Premium Dark Glass mit rotem Akzent (matching Topbar) */
body.dark-mode .settings-dropdown-menu {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  backdrop-filter: blur(40px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(180%) !important;
  border: 1px solid rgba(255,60,28,0.25) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 20px 60px -10px rgba(255,60,28,0.18),
    0 8px 24px -8px rgba(0,0,0,0.45),
    0 2px 8px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.2) !important;
}
body.dark-mode .settings-dropdown-item {
  color: #E5E5EA !important;
  border-radius: 10px;
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}
body.dark-mode .settings-dropdown-item:hover {
  background: rgba(255,60,28,0.15) !important;
  color: #ff7a63 !important;
}
body.dark-mode .settings-dropdown-item:hover svg { color: #ff7a63 !important; }
body.dark-mode .settings-logout-item:hover {
  background: rgba(255,69,58,0.18) !important;
  color: #FF453A !important;
}
body.dark-mode .settings-logout-item:hover svg { color: #FF453A !important; }
body.dark-mode .settings-account-info {
  background: rgba(255,255,255,0.05) !important;
  border-radius: 10px;
}
body.dark-mode .settings-account-avatar {
  background: linear-gradient(135deg, rgba(255,60,28,0.18) 0%, rgba(255,60,28,0.10) 100%) !important;
  color: #ff7a63 !important;
  border: 1px solid rgba(255,60,28,0.30) !important;
}
body.dark-mode .settings-divider {
  background: rgba(255,255,255,0.08) !important;
}
body.dark-mode .settings-account-label { color: #AEAEB2 !important; }
body.dark-mode .settings-account-email { color: #E5E5EA !important; }

/* Glass elements (frosted) — LavaHome style */
body.dark-mode [data-glass] {
  background: linear-gradient(170deg, rgba(40,40,55,0.5) 0%, rgba(30,30,45,0.35) 50%, rgba(40,40,55,0.4) 100%) !important;
  border-color: rgba(255,255,255,0.1) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

/* Modals */
body.dark-mode .modal-content,
body.dark-mode .cd-modal { background: #1e1e25 !important; color: #E5E5EA; border-color: rgba(255,255,255,0.08) !important; }
body.dark-mode .cd-title { color: #E5E5EA; }
body.dark-mode .cd-eyebrow { color: #AEAEB2; }
body.dark-mode .cd-close-btn { color: #E5E5EA; }
body.dark-mode .modal { background: rgba(0,0,0,0.7); }

/* Tables */
body.dark-mode table { color: #E5E5EA; }
body.dark-mode th { color: #AEAEB2 !important; border-bottom-color: rgba(255,255,255,0.1) !important; background: rgba(255,255,255,0.02) !important; }
body.dark-mode td { border-bottom-color: rgba(255,255,255,0.06) !important; color: #E5E5EA; }
body.dark-mode tr:hover td { background: rgba(255,255,255,0.03) !important; }

/* Inline-style overrides — covers many hard-coded white/light backgrounds */
body.dark-mode [style*="background:#fff"]:not([data-glass]),
body.dark-mode [style*="background: #fff"]:not([data-glass]),
body.dark-mode [style*="background:#ffffff"]:not([data-glass]),
body.dark-mode [style*="background: #ffffff"]:not([data-glass]),
body.dark-mode [style*="background:white"]:not([data-glass]),
body.dark-mode [style*="background: white"]:not([data-glass]) { background: #1e1e25 !important; }

/* Premium content header — Apple-Premium-Glass mit Transparenz + Backdrop-Blur
   + ROTER GLOW-Effekt (Box-Shadow rot-getintet) wie bei .ps-header-card im Pipeline Scanner */
body.dark-mode .content-header,
body.dark-mode .content-header-premium {
  background: linear-gradient(170deg, rgba(44,44,46,0.72) 0%, rgba(31,31,34,0.62) 100%) !important;
  backdrop-filter: blur(40px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(180%) !important;
  border-color: rgba(255,60,28,0.25) !important;
  box-shadow:
    0 1px 2px rgba(0,0,0,0.4),
    0 14px 36px -14px rgba(255,60,28,0.25),
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -1px 0 rgba(0,0,0,0.2) !important;
}
/* Schwarz-Rot-Gradient-Linie oben im Dark Mode — Turn von Schwarz zu Rot in der Mitte */
body.dark-mode .content-header-premium::before {
  opacity: 1 !important;
  height: 5px !important;
  background: linear-gradient(90deg, #000000 0%, #000000 20%, #8B0000 40%, #af1000 60%, #d91507 80%, #ff3c1c 100%) !important;
  box-shadow: 0 0 12px rgba(217,21,7,0.4);
}
/* Roter Radial-Glow rechts oben (wie auf Pipeline Scanner) — voll sichtbar */
body.dark-mode .content-header-premium::after {
  opacity: 1 !important;
  background: radial-gradient(circle at center, rgba(255,60,28,0.10) 0%, transparent 70%) !important;
}

/* Eyebrow-Label in Headers — heller im Dark Mode für Lesbarkeit */
body.dark-mode .content-header-eyebrow,
body.dark-mode .config-section-eyebrow,
body.dark-mode .cd-eyebrow,
body.dark-mode .section-tag { color: #ff7a6a !important; }

/* Perf-Card-Eyebrows — heller im Dark Mode (Rückblick/Ausblick blau, klar lesbar) */
body.dark-mode .perf-card-eyebrow-past { color: #5B9DFF !important; }
body.dark-mode .perf-card-eyebrow-future { color: #60AFFF !important; }

/* Page-Title Accent ("Analytics", "Callbacks" etc.) — solide statt Gradient-Text (sharper im Dark Mode) */
body.dark-mode .page-title-accent {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #ff3c1c !important;
  color: #ff3c1c !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Pipeline Scanner header card */
body.dark-mode .ps-header-card {
  background: linear-gradient(170deg, #2c2c2e 0%, #1f1f22 100%) !important;
  border-color: rgba(175,16,0,0.30) !important;
  box-shadow:
    0 1px 2px rgba(0,0,0,0.4),
    0 14px 36px -14px rgba(175,16,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
body.dark-mode .ps-header-btn {
  background: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(175,16,0,0.08) 100%) !important;
  border-color: rgba(175,16,0,0.30) !important;
  color: #ff7a6a !important;
}
body.dark-mode .ps-header-btn-connected {
  background: linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(21,128,61,0.10) 100%) !important;
  border-color: rgba(21,128,61,0.32) !important;
  color: #66bb6a !important;
}

/* Catch any element with inline-style white gradient (common pattern) */
body.dark-mode [style*="linear-gradient(135deg, #ffffff"],
body.dark-mode [style*="linear-gradient(135deg,#ffffff"],
body.dark-mode [style*="linear-gradient(170deg, #ffffff"],
body.dark-mode [style*="linear-gradient(170deg,#ffffff"],
body.dark-mode [style*="linear-gradient(135deg, #fff "],
body.dark-mode [style*="linear-gradient(135deg,#fff "] {
  background: linear-gradient(170deg, rgba(40,40,55,0.6) 0%, rgba(30,30,45,0.45) 100%) !important;
}

/* Any white-ish gradient with 255,255,255 in inline style */
body.dark-mode [style*="rgba(255,255,255,0.85)"],
body.dark-mode [style*="rgba(255, 255, 255, 0.85)"],
body.dark-mode [style*="rgba(255,255,255,0.7)"],
body.dark-mode [style*="rgba(255, 255, 255, 0.7)"] {
  background-color: rgba(40,40,55,0.5) !important;
}

/* Borders #ddd, #e5e5e5, etc. */
body.dark-mode [style*="border:1px solid #ddd"],
body.dark-mode [style*="border: 1px solid #ddd"],
body.dark-mode [style*="border-color:#ddd"],
body.dark-mode [style*="border-color: #ddd"],
body.dark-mode [style*="border:1px solid #e5e5e5"],
body.dark-mode [style*="border: 1px solid #e5e5e5"] {
  border-color: rgba(255,255,255,0.12) !important;
}

/* Period-Select-Premium — Dark Mode mit sichtbarem Hintergrund + Chevron-Icon */
body.dark-mode .period-select-premium {
  color: #E5E5EA !important;
  border-color: rgba(255,255,255,0.14) !important;
  background-color: rgba(255,255,255,0.08) !important;
  background-image:
    url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ff7a6a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"),
    linear-gradient(170deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%) !important;
  background-repeat: no-repeat, no-repeat !important;
  background-position: right 12px center, 0 0 !important;
  background-size: 12px 12px, auto !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.06) !important;
}
body.dark-mode .period-select-premium:hover {
  background-color: rgba(255,255,255,0.12) !important;
  border-color: rgba(255,255,255,0.22) !important;
}
body.dark-mode .period-select-premium option { background: #2a2a2e; color: #E5E5EA; }

/* Period-Range-Picker (Datepicker mit Von/Bis) */
body.dark-mode .period-range-picker {
  background: linear-gradient(170deg, rgba(44,44,46,0.95) 0%, rgba(31,31,34,0.92) 100%) !important;
  color: #E5E5EA !important;
  border-color: rgba(255,255,255,0.12) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.06) !important;
}
body.dark-mode .period-range-input {
  background: rgba(255,255,255,0.06) !important;
  color: #E5E5EA !important;
  border-color: rgba(255,255,255,0.14) !important;
}

/* Nav dropdown items / sub-tabs */
/* Nav-Dropdown — Apple/LavaHome blue-gray glass + helle Items */
body.dark-mode .nav-dropdown-menu {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  backdrop-filter: blur(40px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(180%) !important;
  border: 1px solid rgba(255,60,28,0.25) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 20px 60px -10px rgba(255,60,28,0.18),
    0 8px 24px -8px rgba(0,0,0,0.45),
    0 2px 8px rgba(0,0,0,0.25),
    inset 0 1px 0 rgba(255,255,255,0.08),
    inset 0 -1px 0 rgba(0,0,0,0.2) !important;
}
body.dark-mode .nav-dropdown-item { color: #AEAEB2 !important; }
body.dark-mode .nav-dropdown-item:hover,
body.dark-mode .nav-dropdown-item.active {
  color: #ff7a63 !important;
  background: rgba(255,60,28,0.15) !important;
}
body.dark-mode .nav-dropdown-link { color: #AEAEB2 !important; }
body.dark-mode .nav-dropdown-link:hover {
  color: #ff7a63 !important;
  background: rgba(255,60,28,0.15) !important;
}

/* Tag pills (like "PIPELINE", "ANALYTICS" etc.) — fade text accordingly */
body.dark-mode [style*="color:#AEAEB2"],
body.dark-mode [style*="color: #AEAEB2"] { color: #AEAEB2 !important; }

/* "Live" pill etc. with white bg */
body.dark-mode .live-indicator { background: rgba(255,255,255,0.06) !important; color: #66bb6a; }

/* === Comprehensive component overrides for Dark Mode === */

/* Modals — LavaHome Pattern (95% opacity, blue-gray glass) */
body.dark-mode .modal,
body.dark-mode .cd-modal-wrap { background: rgba(0,0,0,0.75) !important; }
body.dark-mode .modal-content,
body.dark-mode .cd-modal,
body.dark-mode .dc-modal {
  background: linear-gradient(170deg, rgba(40,40,55,0.95) 0%, rgba(30,30,45,0.92) 50%, rgba(40,40,55,0.95) 100%) !important;
  color: #E5E5EA !important;
  border-color: rgba(255,255,255,0.15) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.6), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
body.dark-mode .modal-header,
body.dark-mode .modal-footer,
body.dark-mode .modal-body,
body.dark-mode .cd-header,
body.dark-mode .cd-body,
body.dark-mode .cd-footer { background: transparent !important; color: #E5E5EA !important; border-color: rgba(255,255,255,0.08) !important; }
body.dark-mode .modal-close-btn,
body.dark-mode .cd-close-btn { color: #E5E5EA !important; background: rgba(255,255,255,0.04) !important; }
body.dark-mode .modal-close-btn:hover,
body.dark-mode .cd-close-btn:hover { background: rgba(255,255,255,0.08) !important; }

/* Toasts */
/* Toast Notifications — Apple Premium Dark Glass */
body.dark-mode .toast {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  backdrop-filter: blur(40px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(180%) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #E5E5EA !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 12px 32px rgba(0,0,0,0.55),
    0 4px 12px rgba(0,0,0,0.30),
    inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
body.dark-mode .toast-title { color: #E5E5EA !important; }
body.dark-mode .toast-message { color: #AEAEB2 !important; }
body.dark-mode .toast-close {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #AEAEB2 !important;
}
body.dark-mode .toast-close:hover {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.30) !important;
  color: #ff7a63 !important;
}

/* Tooltips */
body.dark-mode [role="tooltip"],
body.dark-mode .tooltip,
body.dark-mode .section-info-btn:focus::after,
body.dark-mode [data-tooltip]:hover::after { background: #1f1414 !important; color: #E5E5EA !important; border-color: rgba(255,255,255,0.12) !important; }

/* Dropdowns / Date pickers / Range pickers */
body.dark-mode .period-range-picker,
body.dark-mode [id*="custom-range"]:not(.period-range-picker) {
  background: #1f1414 !important;
  border-color: rgba(255,255,255,0.12) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.55) !important;
  color: #E5E5EA !important;
}
body.dark-mode .period-range-title,
body.dark-mode .period-range-field label { color: #AEAEB2 !important; }
body.dark-mode .period-range-input { background: rgba(255,255,255,0.04) !important; color: #E5E5EA !important; border-color: rgba(255,255,255,0.12) !important; }
body.dark-mode .period-range-btn-secondary { background: rgba(255,255,255,0.04) !important; color: #E5E5EA !important; border-color: rgba(255,255,255,0.12) !important; }

/* ============================================
   Pipeline Quality — Dark Mode (Apple Premium Glass parity with SDR/BDR + AE)
   ============================================ */

/* === Soll vs. Ist (Benchmarks) — komplette Dark-Mode-Adaption === */
body.dark-mode .pq-soll-card {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  backdrop-filter: blur(30px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
  color: #E5E5EA !important;
}
body.dark-mode .pq-soll-eyebrow {
  color: #ff7a63 !important;
  background: rgba(255,60,28,0.14) !important;
  border-color: rgba(255,60,28,0.30) !important;
}
body.dark-mode .pq-soll-title { color: #E5E5EA !important; }
body.dark-mode .pq-soll-subtitle { color: #AEAEB2 !important; }
body.dark-mode .pq-soll-loading { color: #AEAEB2 !important; }
body.dark-mode .pq-soll-spinner {
  border-color: rgba(255,60,28,0.20) !important;
  border-top-color: #ff3c1c !important;
}
body.dark-mode .pq-soll-section-label { color: #E5E5EA !important; }
body.dark-mode .pq-soll-section-hint { color: #AEAEB2 !important; }
body.dark-mode .pq-soll-tile,
body.dark-mode .pq-soll-stage-row {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: none !important;
}
body.dark-mode .pq-soll-tile:hover {
  background: rgba(255,255,255,0.07) !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.25) !important;
}
body.dark-mode .pq-soll-tile-label,
body.dark-mode .pq-soll-cell-tier,
body.dark-mode .pq-soll-tile-unit,
body.dark-mode .pq-soll-cell-unit,
body.dark-mode .pq-soll-tile-actual-hint { color: #AEAEB2 !important; }
body.dark-mode .pq-soll-tile-actual,
body.dark-mode .pq-soll-cell-actual,
body.dark-mode .pq-soll-stage-name { color: #E5E5EA !important; }
body.dark-mode .pq-soll-tile-actual-empty,
body.dark-mode .pq-soll-cell-actual-empty { color: #6E6E73 !important; }
body.dark-mode .pq-soll-cell-hint { color: #6E6E73 !important; }
body.dark-mode .pq-soll-stage-cell {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
}

/* Click-to-Edit Target Trigger (ZIEL setzen Buttons) */
body.dark-mode .pq-soll-target-trigger {
  background: rgba(255,60,28,0.08) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #ff7a63 !important;
}
body.dark-mode .pq-soll-target-trigger:hover {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.65) !important;
  box-shadow: 0 2px 8px rgba(255,60,28,0.20) !important;
}
body.dark-mode .pq-soll-target-value { color: #E5E5EA !important; }
body.dark-mode .pq-soll-target-value.is-empty { color: #ff7a63 !important; }
body.dark-mode .pq-soll-target-unit { color: #AEAEB2 !important; }
body.dark-mode .pq-soll-target-editor {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,60,28,0.50) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.18) !important;
}

/* === Compare-Button (Vergleichen) === */
body.dark-mode .perf-compare-btn {
  background: rgba(255,60,28,0.10) !important;
  border-color: rgba(255,60,28,0.35) !important;
  color: #ff7a63 !important;
}
body.dark-mode .perf-compare-btn:hover {
  background: rgba(255,60,28,0.18) !important;
  border-color: rgba(255,60,28,0.55) !important;
  box-shadow: 0 4px 12px rgba(255,60,28,0.20) !important;
}
body.dark-mode .perf-compare-btn.active {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important;
  border-color: rgba(255,60,28,0.65) !important;
  color: #fff !important;
}

/* === Compare-Popover (Frosted Glass Dropdown) === */
body.dark-mode .perf-compare-popover {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  border-color: rgba(255,255,255,0.12) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 16px 48px rgba(0,0,0,0.55),
    0 4px 16px rgba(0,0,0,0.35) !important;
}
body.dark-mode .perf-compare-popover h4 { color: #E5E5EA !important; }
body.dark-mode .perf-compare-popover-sub { color: #AEAEB2 !important; }
body.dark-mode .perf-compare-popover-sub strong { color: #ff7a63 !important; }
body.dark-mode .perf-compare-section-label { color: #AEAEB2 !important; }
body.dark-mode .perf-compare-chip {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}
body.dark-mode .perf-compare-chip:hover {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #ff7a63 !important;
}
body.dark-mode .perf-compare-chip.current {
  background: rgba(255,255,255,0.20) !important;
  border-color: rgba(255,255,255,0.30) !important;
  color: #fff !important;
}
body.dark-mode .perf-compare-toggle {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
}
body.dark-mode .perf-compare-toggle button { color: #AEAEB2 !important; }
body.dark-mode .perf-compare-toggle button:hover { color: #E5E5EA !important; }
body.dark-mode .perf-compare-toggle button.active {
  background: rgba(255,255,255,0.14) !important;
  color: #ff7a63 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}
body.dark-mode .perf-compare-range {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}

/* === Risk Deal Items (Deals at Risk Liste) === */
body.dark-mode #perf-risk-list > div,
body.dark-mode #perf-risk-list > a {
  background: rgba(255,255,255,0.04) !important;
}
body.dark-mode #perf-risk-list [style*="background: #fafafa"],
body.dark-mode #perf-risk-list [style*="background:#fafafa"],
body.dark-mode #perf-risk-list [style*="rgb(250, 250, 250)"],
body.dark-mode #perf-risk-list [style*="rgb(250,250,250)"] {
  background: rgba(255,255,255,0.04) !important;
}
body.dark-mode #perf-risk-list [style*="background: #f0f0f0"],
body.dark-mode #perf-risk-list [style*="background:#f0f0f0"],
body.dark-mode #perf-risk-list [style*="rgb(240, 240, 240)"],
body.dark-mode #perf-risk-list [style*="rgb(240,240,240)"] {
  background: rgba(255,255,255,0.07) !important;
}
body.dark-mode #perf-risk-list [style*="color: #1a1a1a"],
body.dark-mode #perf-risk-list [style*="color:#1a1a1a"] {
  color: #E5E5EA !important;
}
body.dark-mode #perf-risk-list [style*="color: #888"],
body.dark-mode #perf-risk-list [style*="color:#888"] {
  color: #AEAEB2 !important;
}
body.dark-mode #perf-risk-list [style*="color: #af1000"],
body.dark-mode #perf-risk-list [style*="color:#af1000"] {
  color: #FF453A !important;
}
body.dark-mode #perf-risk-list [style*="background: #af100015"],
body.dark-mode #perf-risk-list [style*="background:#af100015"] {
  background: rgba(255,69,58,0.20) !important;
}

/* === Risk-Count Badge ("19" next to "Deals at Risk") === */
body.dark-mode #perf-risk-count {
  background: rgba(255,69,58,0.20) !important;
  color: #FF453A !important;
}

/* === Globale Red-Text-Aufhellung im Pipeline-Quality Block ===
   JS setzt häufig .style.color = '#af1000' direkt — Browser re-serialisiert zu
   rgb(175, 16, 0); deshalb müssen wir BEIDE Formen matchen. */
body.dark-mode #analytics-sub-performance [style*="color: #af1000"],
body.dark-mode #analytics-sub-performance [style*="color:#af1000"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(175, 16, 0)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(175,16,0)"] {
  color: #FF453A !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #d91507"],
body.dark-mode #analytics-sub-performance [style*="color:#d91507"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(217, 21, 7)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(217,21,7)"] {
  color: #FF453A !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #ff9800"],
body.dark-mode #analytics-sub-performance [style*="color:#ff9800"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(255, 152, 0)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(255,152,0)"] {
  color: #FFB060 !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #4caf50"],
body.dark-mode #analytics-sub-performance [style*="color:#4caf50"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(76, 175, 80)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(76,175,80)"] {
  color: #6EE7A2 !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #1976d2"],
body.dark-mode #analytics-sub-performance [style*="color:#1976d2"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(25, 118, 210)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(25,118,210)"] {
  color: #60AFFF !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #1a1a1a"],
body.dark-mode #analytics-sub-performance [style*="color:#1a1a1a"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(26, 26, 26)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(26,26,26)"] {
  color: #E5E5EA !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #5B2D5B"],
body.dark-mode #analytics-sub-performance [style*="color:#5B2D5B"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(91, 45, 91)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(91,45,91)"] {
  color: #E08CFF !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #e65100"],
body.dark-mode #analytics-sub-performance [style*="color:#e65100"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(230, 81, 0)"],
body.dark-mode #analytics-sub-performance [style*="color: rgb(230,81,0)"] {
  color: #FFB060 !important;
}

/* Progress bars — direkt per ID adressiert (Substring-Match auf "#af1000" würde
   sonst auch "#af100015" treffen → translucente Badges würden solid). */
body.dark-mode #perf-health-red-bar,
body.dark-mode #perf-pipeline-red-bar {
  background: #FF453A !important;
}

/* === Inline Monats-Vergleichs-Bar (white bar "April: 27.5% Win Rate · ...")
   und Forecast-Snapshot nodata-Bar — alle inline #f8f8f8 background === */
body.dark-mode #perf-winloss-prev,
body.dark-mode #perf-newdeals-prev,
body.dark-mode #perf-accuracy-nodata,
body.dark-mode #analytics-sub-performance [style*="background: #f8f8f8"],
body.dark-mode #analytics-sub-performance [style*="background:#f8f8f8"],
body.dark-mode #analytics-sub-performance [style*="rgb(248, 248, 248)"],
body.dark-mode #analytics-sub-performance [style*="rgb(248,248,248)"],
body.dark-mode #analytics-sub-performance [style*="background: rgba(255,255,255,0.7)"],
body.dark-mode #analytics-sub-performance [style*="background:rgba(255,255,255,0.7)"],
body.dark-mode #analytics-sub-performance [style*="background: rgba(248,248,252,0.7)"],
body.dark-mode #analytics-sub-performance [style*="background:rgba(248,248,252,0.7)"] {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #AEAEB2 !important;
}
body.dark-mode #perf-winloss-prev strong,
body.dark-mode #perf-newdeals-prev strong {
  color: #E5E5EA !important;
}

/* === Soll vs. Ist Empty-State (Stage-Verweildauer "Nicht genug abgeschlossene...") === */
body.dark-mode .pq-soll-empty {
  background: rgba(255,255,255,0.04) !important;
  border: 1px dashed rgba(255,255,255,0.12) !important;
  color: #AEAEB2 !important;
}

/* === PDF Report Button (Header) === */
body.dark-mode .header-action-btn {
  background: rgba(255,60,28,0.10) !important;
  border-color: rgba(255,60,28,0.35) !important;
  color: #FF453A !important;
  box-shadow: none !important;
}
body.dark-mode .header-action-btn:hover {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important;
  border-color: rgba(255,60,28,0.65) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(255,60,28,0.30) !important;
}

/* === Monat-Badges (Win/Loss, Neue Deals, Deal Slip Rate) — inline #f5f5f5 / #f0f0f0 === */
body.dark-mode #perf-winloss-month-badge,
body.dark-mode #perf-newdeals-month-badge,
body.dark-mode #perf-sliprate-month-badge {
  background: rgba(255,255,255,0.08) !important;
  color: #E5E5EA !important;
}

/* === Andere helle Reds aus dem Light-Mode-Spektrum auch heller machen === */
body.dark-mode #analytics-sub-performance [style*="color: #d91507"],
body.dark-mode #analytics-sub-performance [style*="color:#d91507"] {
  color: #FF453A !important;
}
body.dark-mode #analytics-sub-performance [style*="color: #c41818"],
body.dark-mode #analytics-sub-performance [style*="color:#c41818"] {
  color: #FF453A !important;
}



/* Block-Container (5 Blöcke) — Apple Dark Glass mit erhaltenem Top-Akzent */
body.dark-mode .pq-block {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  backdrop-filter: blur(30px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.06) !important;
  color: #E5E5EA;
}

/* Block-Hero Border-Bottom in dark mode */
body.dark-mode .pq-block-hero {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

/* Block-Title hell für dark mode */
body.dark-mode .pq-block-title {
  color: #E5E5EA !important;
}

/* Block-Eyebrow Farbvarianten — heller/saturierter für dark mode */
body.dark-mode .pq-block-1 .pq-block-eyebrow { color: #5B9DFF !important; }
body.dark-mode .pq-block-2 .pq-block-eyebrow { color: #60AFFF !important; }
body.dark-mode .pq-block-3 .pq-block-eyebrow { color: #FFCE5C !important; }
body.dark-mode .pq-block-4 .pq-block-eyebrow { color: #E08CFF !important; }
body.dark-mode .pq-block-5 .pq-block-eyebrow { color: #6EE7A2 !important; }

/* Top-Akzent-Linie entfernt — block-spezifische Farben raus auf User-Wunsch */

/* Perf-Block-Nav (Tab-Leiste oben) — Apple Dark Glass */
body.dark-mode .perf-block-nav {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}
body.dark-mode .perf-nav-btn {
  color: rgba(255,255,255,0.55) !important;
  background: transparent !important;
}
body.dark-mode .perf-nav-btn:hover {
  background: rgba(255,60,28,0.10) !important;
  color: #ff7a63 !important;
}
body.dark-mode .perf-nav-btn.active {
  background: rgba(255,255,255,0.10) !important;
  color: #ff7a63 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,0.3), 0 0 0 1px rgba(255,255,255,0.10) !important;
}

/* ============================================
   CS Analytics — Dark Mode (Apple Premium Glass, Coming-Soon Placeholder)
   ============================================ */
body.dark-mode #analytics-sub-cs > div:not(.content-header-premium) {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  backdrop-filter: blur(30px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 20px !important;
  box-shadow: none !important;
  color: #E5E5EA !important;
}
body.dark-mode #analytics-sub-cs h2 {
  color: #E5E5EA !important;
  font-weight: 800 !important;
  letter-spacing: -0.5px !important;
}
body.dark-mode #analytics-sub-cs p {
  color: #AEAEB2 !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
}

/* ============================================
   Dezenter roter Border um die GROSSEN Container — Light + Dark
   Identischer Look wie "Bereit für deinen Pipeline-Check" Card im Scanner.
   Gilt für:
   - AE Analytics: Daily Demos + Health Section
   - SDR/BDR Analytics: Performance (sdr_past) + Prognose (sdr_future)
   - Pipeline Quality: alle 5 .pq-block Container
   ============================================ */
#ae-health-section,
#ae-demos-section,
#analytics-sub-sdr-bdr [data-feature="sdr_daily"],
#analytics-sub-sdr-bdr [data-feature="sdr_past"],
#analytics-sub-sdr-bdr [data-feature="sdr_future"],
.pq-block,
#tab-members .table-container,
#tab-callbacks .table-container:not(.logs-frame-table),
#tab-meetings .table-container:not(.logs-frame-table),
#tab-deals .table-container:not(.logs-frame-table) {
  border: 1px solid rgba(175,16,0,0.22) !important;
  box-shadow: 0 4px 16px rgba(175,16,0,0.08) !important;
}
body.dark-mode #ae-health-section,
body.dark-mode #ae-demos-section,
body.dark-mode #analytics-sub-sdr-bdr [data-feature="sdr_daily"],
body.dark-mode #analytics-sub-sdr-bdr [data-feature="sdr_past"],
body.dark-mode #analytics-sub-sdr-bdr [data-feature="sdr_future"],
body.dark-mode .pq-block,
body.dark-mode #tab-members .table-container,
body.dark-mode #tab-callbacks .table-container:not(.logs-frame-table),
body.dark-mode #tab-meetings .table-container:not(.logs-frame-table),
body.dark-mode #tab-deals .table-container:not(.logs-frame-table) {
  border-color: rgba(255,60,28,0.30) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
}

/* ============================================
   Members / Callbacks / Meetings / Deals — Dark Mode
   (Tables, Filters, Custom Range Picker, Action Buttons)
   ============================================ */

/* Table-Container (Outer Wrap mit Glas-Effekt) */
body.dark-mode .table-container {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  backdrop-filter: blur(30px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(160%) !important;
}

/* Table Header */
body.dark-mode .data-table thead {
  background: rgba(255,255,255,0.04) !important;
}
body.dark-mode .data-table th {
  color: #AEAEB2 !important;
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
}
body.dark-mode .data-table td {
  color: #E5E5EA !important;
  border-top: 1px solid rgba(255,255,255,0.06) !important;
}
body.dark-mode .data-table tbody tr:hover {
  background: rgba(255,60,28,0.06) !important;
}

/* Filter-Selects: SOLIDER dunkler Background sichtbar dark mode */
html body.dark-mode select.filter-select,
html body.dark-mode #tab-callbacks .filter-select,
html body.dark-mode #tab-meetings .filter-select,
html body.dark-mode #tab-deals .filter-select,
html body.dark-mode #tab-members .filter-select,
html body.dark-mode #tab-logs .filter-select,
body.dark-mode .filter-select {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background-color: #2c2c30 !important;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ff3c1c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 12px 12px !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: 12px !important;
  color: #E5E5EA !important;
  color-scheme: dark;
  box-shadow: none !important;
  outline: none !important;
  padding-right: 32px !important;
}
html body.dark-mode input.search-input,
html body.dark-mode #tab-callbacks .search-input,
html body.dark-mode #tab-meetings .search-input,
html body.dark-mode #tab-deals .search-input,
html body.dark-mode #tab-members .search-input,
body.dark-mode .search-input {
  background-color: #2c2c30 !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: 12px !important;
  color: #E5E5EA !important;
  box-shadow: none !important;
  outline: none !important;
}

/* === Custom Combobox (.sc-*) — ersetzt das native <select> nach Daten-Load === */
body.dark-mode .sc-btn {
  background: #2c2c30 !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  color: #E5E5EA !important;
  box-shadow: none !important;
}
body.dark-mode .sc-btn:hover {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.35) !important;
}
body.dark-mode .sc-btn.is-open {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
}
body.dark-mode .sc-btn-chevron { color: #ff3c1c !important; }
body.dark-mode .sc-btn.is-open .sc-btn-chevron { color: #ff453a !important; }

/* Dropdown-Popup (portaled to body via JS) */
body.dark-mode .sc-dropdown {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 16px 48px rgba(0,0,0,0.55),
    0 4px 16px rgba(0,0,0,0.35) !important;
}

/* Search-Wrap im Dropdown */
body.dark-mode .sc-search-wrap {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
}
body.dark-mode .sc-search-wrap:focus-within {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.40) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
}
body.dark-mode .sc-search-wrap svg { color: #AEAEB2 !important; }
body.dark-mode .sc-search { color: #E5E5EA !important; }
body.dark-mode .sc-search::placeholder { color: #8E8E93 !important; }

/* List + Items */
body.dark-mode .sc-item { color: #E5E5EA !important; }
body.dark-mode .sc-item:hover {
  background: rgba(255,60,28,0.15) !important;
  color: #ff7a63 !important;
}
body.dark-mode .sc-item.is-active {
  background: rgba(255,60,28,0.22) !important;
  color: #ff8a73 !important;
}
body.dark-mode .sc-check { color: #ff7a63 !important; }
body.dark-mode .sc-empty { color: #6E6E73 !important; }

/* Scrollbar */
body.dark-mode .sc-list { scrollbar-color: rgba(255,255,255,0.18) transparent; }
body.dark-mode .sc-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.18) !important; }
body.dark-mode .sc-list::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.30) !important; }

/* ============================================
   Konfigurations-Seite — komplette Dark-Mode-Adaption
   ============================================ */

/* Subsection (Feld-Zuordnungen Header) */
body.dark-mode .config-subsection-head h3 { color: #E5E5EA !important; }
body.dark-mode .config-subsection-head p { color: #AEAEB2 !important; }

/* Separator-Linie */
body.dark-mode .config-separator { border-top-color: rgba(255,255,255,0.10) !important; }

/* CRM Verbinden Cards (HubSpot + Salesforce) */
body.dark-mode .config-crm-card {
  background: linear-gradient(170deg, rgba(255,255,255,0.05) 0%, rgba(255,255,255,0.03) 100%) !important;
  border: 1.5px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.05) !important;
}
body.dark-mode .config-crm-card:hover {
  background: rgba(255,255,255,0.08) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.40), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}
body.dark-mode .config-crm-name { color: #E5E5EA !important; }
body.dark-mode .config-crm-desc { color: #AEAEB2 !important; }
body.dark-mode .config-crm-card-hubspot .config-crm-cta {
  color: #ff9d7a !important;
  background: rgba(255,122,89,0.15) !important;
  border-color: rgba(255,122,89,0.30) !important;
}
body.dark-mode .config-crm-card-salesforce .config-crm-cta {
  color: #5cc5ff !important;
  background: rgba(0,161,224,0.15) !important;
  border-color: rgba(0,161,224,0.30) !important;
}

/* CRM Connected State */
body.dark-mode .config-crm-connected {
  background: rgba(255,255,255,0.05) !important;
  border: 1.5px solid rgba(255,255,255,0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05) !important;
}
body.dark-mode .config-crm-connected-icon {
  background: rgba(255,255,255,0.08) !important;
}
body.dark-mode .config-crm-connected-name { color: #E5E5EA !important; }
body.dark-mode .config-crm-connected-email { color: #AEAEB2 !important; }
body.dark-mode .config-crm-connected-hint { color: #8E8E93 !important; }
body.dark-mode .config-crm-disconnect-btn {
  background: rgba(255,69,58,0.12) !important;
  border-color: rgba(255,69,58,0.35) !important;
  color: #FF8073 !important;
}
body.dark-mode .config-crm-disconnect-btn:hover {
  background: rgba(255,69,58,0.20) !important;
  border-color: rgba(255,69,58,0.55) !important;
  color: #FF453A !important;
}

/* Deal-Kategorien Grid */
body.dark-mode .deal-category-config {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.dark-mode .config-deal-currency { color: #AEAEB2 !important; }

/* Logo-Preview */
body.dark-mode .logo-preview {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.12) !important;
}
body.dark-mode .logo-preview-placeholder { color: #AEAEB2 !important; }
body.dark-mode .form-hint { color: #AEAEB2 !important; }

/* Form-Group label */
body.dark-mode .form-group label { color: #E5E5EA !important; }

/* form-input — bestehende Regel verstärken für select.form-input */
body.dark-mode select.form-input {
  color-scheme: dark;
}
body.dark-mode select.form-input option {
  background: #1c1c1e !important;
  color: #E5E5EA !important;
}

/* ============================================
   LavaCall Spalten — Column-Items (Konfig-Seite)
   ============================================ */
body.dark-mode .column-item {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.dark-mode .column-item .form-input {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #E5E5EA !important;
}
body.dark-mode .column-item .form-input:focus {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
}
body.dark-mode .column-item .drag-handle { color: #AEAEB2 !important; }
/* ID-Untertext "callbackDate (Basis-Spalte - fest vorgegeben)" gedimmt */
body.dark-mode .column-item > div:last-child { color: #AEAEB2 !important; }
/* "System-Spalte" Label */
body.dark-mode .column-item span[style*="color: var(--text-secondary)"] {
  color: #AEAEB2 !important;
}

/* ============================================
   Logs Dashboard Pagination
   ============================================ */
body.dark-mode .lg-page-btn {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  box-shadow: none !important;
}
body.dark-mode .lg-page-btn:hover:not(:disabled) {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #FF453A !important;
}
body.dark-mode .lg-page-btn:disabled {
  background: rgba(255,255,255,0.03) !important;
  color: #6E6E73 !important;
  border-color: rgba(255,255,255,0.06) !important;
}
body.dark-mode .lg-page-info { color: #AEAEB2 !important; }

/* ============================================
   Logs-Frame — Filter + Tabelle in einem geteilten roten Rahmen
   ============================================ */
.logs-frame {
  border: 1px solid rgba(175,16,0,0.22);
  border-radius: 18px;
  overflow: hidden;
  margin-bottom: 18px;
  box-shadow: 0 4px 16px rgba(175,16,0,0.08);
}
.logs-frame-filters {
  margin-bottom: 0 !important;
  padding: 14px 18px;
  border-bottom: 1px solid rgba(175,16,0,0.18);
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(255,255,255,0.6) 100%);
}
.logs-frame-table,
#tab-callbacks .logs-frame-table,
#tab-meetings .logs-frame-table,
#tab-deals .logs-frame-table {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
}

/* Dark Mode */
body.dark-mode .logs-frame {
  border-color: rgba(255,60,28,0.30) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
}
body.dark-mode .logs-frame-filters {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  border-bottom-color: rgba(255,60,28,0.20) !important;
}
body.dark-mode .logs-frame-table {
  border: none !important;
  box-shadow: none !important;
}

/* ============================================
   Log Details Modal Content (#log-detail-content)
   ============================================ */

/* Outer Container (.lg-log-content) — war hell-glas Gradient */
body.dark-mode .lg-log-content {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
  color: #E5E5EA !important;
}
body.dark-mode .lg-log-content strong { color: #E5E5EA !important; }

/* Top Hero-Card (Zeitstempel/Benutzer/Aktion/Quelle) — light gradient → dark glass */
body.dark-mode #log-detail-content [style*="linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%)"],
body.dark-mode #log-detail-content [style*="linear-gradient(135deg,#f8f9fa 0%,#ffffff 100%)"] {
  background: linear-gradient(170deg, rgba(44,44,46,0.55) 0%, rgba(31,31,34,0.45) 100%) !important;
  border-left: 4px solid #FF453A !important;
}

/* Details + Background-Karten in der Detail-Section (mehrere Hex-Varianten) */
body.dark-mode #log-detail-content [style*="background: #fafafa"],
body.dark-mode #log-detail-content [style*="background:#fafafa"],
body.dark-mode #log-detail-content [style*="background: #ffffff"],
body.dark-mode #log-detail-content [style*="background:#ffffff"] {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.10) !important;
}

/* Borders zwischen Zeilen / Unter-Karten */
body.dark-mode #log-detail-content [style*="border: 1px solid #e0e0e0"],
body.dark-mode #log-detail-content [style*="border:1px solid #e0e0e0"],
body.dark-mode #log-detail-content [style*="border: 1px solid #e8e8e8"],
body.dark-mode #log-detail-content [style*="border:1px solid #e8e8e8"] {
  border-color: rgba(255,255,255,0.10) !important;
}
body.dark-mode #log-detail-content [style*="border-bottom: 1px solid #f0f0f0"],
body.dark-mode #log-detail-content [style*="border-bottom:1px solid #f0f0f0"] {
  border-bottom-color: rgba(255,255,255,0.08) !important;
}
body.dark-mode #log-detail-content [style*="border-top: 2px solid #e0e0e0"],
body.dark-mode #log-detail-content [style*="border-top:2px solid #e0e0e0"] {
  border-top-color: rgba(255,255,255,0.10) !important;
}

/* Text-Farben — Werte/Labels innerhalb des Logs */
body.dark-mode #log-detail-content [style*="color: #212121"],
body.dark-mode #log-detail-content [style*="color:#212121"] {
  color: #E5E5EA !important;
}
body.dark-mode #log-detail-content [style*="color: #424242"],
body.dark-mode #log-detail-content [style*="color:#424242"] {
  color: #C7C7CC !important;
}
body.dark-mode #log-detail-content [style*="color: #666"],
body.dark-mode #log-detail-content [style*="color:#666"] {
  color: #AEAEB2 !important;
}
body.dark-mode #log-detail-content [style*="color: #888"],
body.dark-mode #log-detail-content [style*="color:#888"] {
  color: #AEAEB2 !important;
}
body.dark-mode #log-detail-content [style*="color: #999"],
body.dark-mode #log-detail-content [style*="color:#999"] {
  color: #8E8E93 !important;
}
body.dark-mode #log-detail-content [style*="color: #af1000"],
body.dark-mode #log-detail-content [style*="color:#af1000"] {
  color: #FF453A !important;
}
body.dark-mode #tab-callbacks .search-input,
body.dark-mode #tab-meetings .search-input,
body.dark-mode #tab-deals .search-input,
body.dark-mode #tab-members .search-input,
body.dark-mode .search-input {
  -webkit-appearance: none !important;
  appearance: none !important;
  background-color: #2c2c30 !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  border-radius: 12px !important;
  color: #E5E5EA !important;
  color-scheme: dark;
  box-shadow: none !important;
  outline: none !important;
}
body.dark-mode .filter-select:hover,
body.dark-mode .search-input:hover {
  border-color: rgba(255,60,28,0.35) !important;
}
body.dark-mode .filter-select:focus,
body.dark-mode .filter-select:focus-visible,
body.dark-mode .search-input:focus,
body.dark-mode .search-input:focus-visible {
  background-color: rgba(50,50,55,0.95) !important;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
  outline: none !important;
}
body.dark-mode .search-input::placeholder { color: #6E6E73 !important; }
/* Native <option> Liste im Dark Mode auch dunkel */
body.dark-mode .filter-select option {
  background: #1c1c1e !important;
  color: #E5E5EA !important;
}

/* Custom Range Picker (Callbacks + Meetings, inline position: absolute) */
body.dark-mode #callback-custom-range,
body.dark-mode #meeting-custom-range,
body.dark-mode #deal-custom-range {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  backdrop-filter: blur(40px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(170%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 14px 36px rgba(0,0,0,0.55) !important;
  color: #E5E5EA !important;
}
body.dark-mode #callback-custom-range > div:first-child,
body.dark-mode #meeting-custom-range > div:first-child,
body.dark-mode #deal-custom-range > div:first-child {
  color: #E5E5EA !important;
}
body.dark-mode #callback-custom-range label,
body.dark-mode #meeting-custom-range label,
body.dark-mode #deal-custom-range label {
  color: #AEAEB2 !important;
}
body.dark-mode #callback-custom-range input[type="date"],
body.dark-mode #meeting-custom-range input[type="date"],
body.dark-mode #deal-custom-range input[type="date"] {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  color-scheme: dark;
}
body.dark-mode #callback-custom-range input[type="date"]::-webkit-calendar-picker-indicator,
body.dark-mode #meeting-custom-range input[type="date"]::-webkit-calendar-picker-indicator,
body.dark-mode #deal-custom-range input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(38%) sepia(96%) saturate(6500%) hue-rotate(355deg) brightness(105%) contrast(105%);
  cursor: pointer;
}
body.dark-mode #callback-custom-range button[onclick^="cancel"],
body.dark-mode #meeting-custom-range button[onclick^="cancel"],
body.dark-mode #deal-custom-range button[onclick^="cancel"] {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}

/* Team Info Bar in Members (inline background: #f8f9fa) */
body.dark-mode #tab-members [style*="background: #f8f9fa"],
body.dark-mode #tab-members [style*="background:#f8f9fa"] {
  background: rgba(255,255,255,0.04) !important;
  color: #AEAEB2 !important;
}
body.dark-mode #tab-members [style*="background: #f8f9fa"] strong,
body.dark-mode #tab-members [style*="background:#f8f9fa"] strong {
  color: #E5E5EA !important;
}

/* Action Buttons in Table Rows */
body.dark-mode .action-btn {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}
body.dark-mode .action-btn:hover {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #FF453A !important;
}
body.dark-mode .action-btn.danger:hover {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #FF453A !important;
}
body.dark-mode .action-btn-small {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}
body.dark-mode .action-btn-small:hover {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important;
  border-color: rgba(255,60,28,0.65) !important;
  color: #fff !important;
}

/* Clear-Selection Button (im Dark Mode dunkles Glas statt halb-weiß) */
body.dark-mode .clear-selection-btn {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  box-shadow: none !important;
}
body.dark-mode .clear-selection-btn:hover {
  background: rgba(255,60,28,0.12) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #FF453A !important;
}

/* Status-Badges für Dark Mode (helller getintet) */
body.dark-mode .status-badge.active {
  background: rgba(48,209,88,0.14) !important;
  color: #6EE7A2 !important;
  border-color: rgba(48,209,88,0.28) !important;
}
body.dark-mode .status-badge.pending {
  background: rgba(255,214,10,0.14) !important;
  color: #F5D77A !important;
  border-color: rgba(255,214,10,0.28) !important;
}
body.dark-mode .status-badge.inactive {
  background: rgba(255,69,58,0.14) !important;
  color: #FF8073 !important;
  border-color: rgba(255,69,58,0.28) !important;
}

/* Member-Dropdown in Tabellen-Zelle */
body.dark-mode .member-dropdown {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  color-scheme: dark;
}

/* ============================================
   Detail-Modals (Callback / Meeting / Deal / Member) — komplette Dark-Mode-Adaption
   .cd-* + .mm-* Klassen
   ============================================ */

/* Modal-Wrapper / Backdrop — angenehmer blur statt 75% schwarz */
body.dark-mode .cd-modal-wrap {
  background: rgba(15,15,18,0.55) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

/* Modal-Container — Apple Dark Glass */
body.dark-mode .cd-modal {
  background: linear-gradient(170deg, rgba(44,44,46,0.95) 0%, rgba(31,31,34,0.92) 100%) !important;
  border: 1px solid rgba(255,60,28,0.30) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 32px 80px rgba(0,0,0,0.65),
    0 12px 24px rgba(0,0,0,0.45) !important;
  color: #E5E5EA !important;
}

/* Header */
body.dark-mode .cd-header {
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
}
body.dark-mode .cd-eyebrow { color: #FF453A !important; }
body.dark-mode .cd-title { color: #E5E5EA !important; }
body.dark-mode .cd-close-btn {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #AEAEB2 !important;
}
body.dark-mode .cd-close-btn:hover {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #FF453A !important;
}

/* Body */
body.dark-mode .cd-body { color: #E5E5EA !important; }

/* Hero-Cards (Datum / Zuständig / Status) */
body.dark-mode .cd-hero-card {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.06) !important;
}
body.dark-mode .cd-hero-icon {
  background: rgba(255,60,28,0.18) !important;
  color: #FF453A !important;
}
body.dark-mode .cd-hero-label { color: #AEAEB2 !important; }
body.dark-mode .cd-hero-value { color: #E5E5EA !important; }

/* Status Chips */
body.dark-mode .cd-status-ok {
  color: #6EE7A2 !important;
  background: rgba(48,209,88,0.14) !important;
  border-color: rgba(48,209,88,0.28) !important;
}
body.dark-mode .cd-status-warn {
  color: #FFCE5C !important;
  background: rgba(255,159,10,0.16) !important;
  border-color: rgba(255,159,10,0.30) !important;
}
body.dark-mode .cd-status-bad {
  color: #FF8073 !important;
  background: rgba(255,69,58,0.16) !important;
  border-color: rgba(255,69,58,0.30) !important;
}
body.dark-mode .cd-status-info {
  color: #60AFFF !important;
  background: rgba(10,132,255,0.16) !important;
  border-color: rgba(10,132,255,0.30) !important;
}
body.dark-mode .cd-status-neutral {
  color: #AEAEB2 !important;
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
}
body.dark-mode .cd-status-dot {
  box-shadow: 0 0 0 2px rgba(255,255,255,0.10) !important;
}

/* Section-Blocks */
body.dark-mode .cd-section {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.dark-mode .cd-section-warn {
  background: rgba(255,159,10,0.08) !important;
  border-color: rgba(255,159,10,0.30) !important;
}
body.dark-mode .cd-section-label { color: #AEAEB2 !important; }

/* Rows */
body.dark-mode .cd-row { border-top: 1px solid rgba(255,255,255,0.06) !important; }
body.dark-mode .cd-row-icon {
  background: rgba(255,60,28,0.16) !important;
  color: #FF453A !important;
}
body.dark-mode .cd-row-icon-warn {
  background: rgba(255,159,10,0.18) !important;
  color: #FFCE5C !important;
}
body.dark-mode .cd-row-key { color: #AEAEB2 !important; }
body.dark-mode .cd-row-val { color: #E5E5EA !important; }
body.dark-mode .cd-row-val-strong { color: #FF453A !important; }

/* Category-Select (im Modal) */
body.dark-mode .cd-category-select {
  background-color: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  color-scheme: dark;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23ff3c1c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") !important;
}
body.dark-mode .cd-category-select:hover {
  border-color: rgba(255,60,28,0.35) !important;
}
body.dark-mode .cd-category-select:focus {
  background-color: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
}

/* Footer */
body.dark-mode .cd-footer {
  border-top: 1px solid rgba(255,255,255,0.10) !important;
}

/* === Member-Modal-Specific (mm-*) === */
body.dark-mode .mm-modal-info { color: #AEAEB2 !important; }
body.dark-mode .mm-form-label { color: #AEAEB2 !important; }
body.dark-mode .mm-form-input {
  background: rgba(40,40,45,0.85) !important;
  background-color: rgba(40,40,45,0.85) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #E5E5EA !important;
  box-shadow: none !important;
  outline: none !important;
  color-scheme: dark;
  -webkit-appearance: none !important;
  appearance: none !important;
}
body.dark-mode .mm-form-input:hover { border-color: rgba(255,60,28,0.35) !important; }
body.dark-mode .mm-form-input:focus,
body.dark-mode .mm-form-input:focus-visible {
  background-color: rgba(50,50,55,0.95) !important;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
  outline: none !important;
}
body.dark-mode select.mm-form-input {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23ff3c1c' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 10px 10px !important;
}
body.dark-mode select.mm-form-input option {
  background: #1c1c1e !important;
  color: #E5E5EA !important;
}

/* === Cancel-Button im Modal (Abbrechen) === */
body.dark-mode .dc-cancel-btn {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #E5E5EA !important;
  box-shadow: none !important;
}
body.dark-mode .dc-cancel-btn:hover {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #FF453A !important;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important;
}
body.dark-mode .mm-error {
  background: rgba(255,69,58,0.14) !important;
  border-color: rgba(255,69,58,0.30) !important;
  color: #FF8073 !important;
}

body.dark-mode .mm-role-row { border-top: 1px solid rgba(255,255,255,0.06) !important; }
body.dark-mode .mm-role-desc { color: #AEAEB2 !important; }

body.dark-mode .mm-checkbox-row {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
  color: #E5E5EA !important;
}
body.dark-mode .mm-checkbox-row:hover { background: rgba(255,255,255,0.07) !important; }
body.dark-mode .mm-checkbox-row em { color: #AEAEB2 !important; }

/* === Log-Dashboard Cells === */
body.dark-mode .lg-empty-cell { color: #AEAEB2 !important; }
body.dark-mode .lg-cell-timestamp { color: #AEAEB2 !important; }
body.dark-mode .lg-cell-user { color: #E5E5EA !important; }
body.dark-mode .lg-cell-details { color: #C7C7CC !important; }
body.dark-mode .lg-source-pill {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #C7C7CC !important;
}
body.dark-mode .lg-pagination {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.dark-mode .lg-pagination-count { color: #AEAEB2 !important; }

/* ============================================
   FEHLENDE DARK MODE — sweep aller verbleibenden Elemente
   ============================================ */

/* --- Generic .error-message (form validation, inline errors) --- */
body.dark-mode .error-message {
  background: rgba(255,69,58,0.14) !important;
  color: #FF8073 !important;
  border: 1px solid rgba(255,69,58,0.30) !important;
}

/* --- CSV Import Modal --- */
body.dark-mode .csv-info-pill {
  background: rgba(10,132,255,0.12) !important;
  border-color: rgba(10,132,255,0.30) !important;
  color: #60AFFF !important;
}
body.dark-mode .csv-section-hint { color: #AEAEB2 !important; }
body.dark-mode .csv-preview-wrap {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04) !important;
}
body.dark-mode .csv-preview-table { color: #E5E5EA !important; }
body.dark-mode .csv-preview-table thead {
  background: rgba(255,255,255,0.04) !important;
}
body.dark-mode .csv-preview-table th {
  color: #AEAEB2 !important;
  border-bottom-color: rgba(255,255,255,0.10) !important;
}
body.dark-mode .csv-preview-table td {
  border-top-color: rgba(255,255,255,0.06) !important;
}
body.dark-mode .csv-preview-table tbody tr:hover {
  background: rgba(255,60,28,0.06) !important;
}
body.dark-mode .csv-tip {
  background: rgba(255,159,10,0.14) !important;
  border-color: rgba(255,159,10,0.30) !important;
  color: #FFCE5C !important;
}
body.dark-mode .csv-row-count { color: #AEAEB2 !important; }

/* --- PDF Export Modal --- */
body.dark-mode .pdf-period-hint { color: #AEAEB2 !important; }
body.dark-mode .pdf-period-value { color: #E5E5EA !important; }
body.dark-mode .pdf-checkbox-list label {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: #E5E5EA !important;
}
body.dark-mode .pdf-checkbox-list label:hover {
  background: rgba(255,60,28,0.10) !important;
  border-color: rgba(255,60,28,0.30) !important;
}
body.dark-mode .pdf-soon-pill {
  background: rgba(255,60,28,0.14) !important;
  border-color: rgba(255,60,28,0.30) !important;
  color: #FF453A !important;
}

/* --- Invite Step Indicator (Mitglied einladen Modal) --- */
body.dark-mode .invite-step-dot {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  color: #AEAEB2 !important;
}
body.dark-mode .invite-step-dot.active {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important;
  border-color: rgba(255,60,28,0.55) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(255,60,28,0.30) !important;
}
body.dark-mode .invite-step-dot.completed {
  background: rgba(48,209,88,0.18) !important;
  border-color: rgba(48,209,88,0.40) !important;
  color: #6EE7A2 !important;
}
body.dark-mode .invite-step-dot.completed .invite-step-number { color: #6EE7A2 !important; }
body.dark-mode .invite-step-number { color: #AEAEB2 !important; }
body.dark-mode .invite-step-line { background: rgba(255,255,255,0.10) !important; }
body.dark-mode .invite-step-line.active {
  background: linear-gradient(90deg, rgba(255,60,28,0.45) 0%, rgba(48,209,88,0.45) 100%) !important;
}
body.dark-mode .invite-step-label { color: #AEAEB2 !important; }
body.dark-mode .invite-step-dot.active ~ .invite-step-label { color: #E5E5EA !important; }
body.dark-mode .invite-hint { color: #AEAEB2 !important; }
body.dark-mode .invite-summary {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: #E5E5EA !important;
}
body.dark-mode .invite-summary strong { color: #E5E5EA !important; }

/* --- Delete Confirmation Modal (.dc-*) --- */
body.dark-mode .dc-counter {
  background: linear-gradient(170deg, rgba(255,69,58,0.10) 0%, rgba(255,69,58,0.06) 100%) !important;
  border: 1.5px solid rgba(255,69,58,0.30) !important;
  box-shadow:
    0 4px 14px rgba(255,69,58,0.15),
    inset 0 1px 0 rgba(255,255,255,0.06) !important;
}
body.dark-mode .dc-counter-num {
  background: linear-gradient(135deg, #FF8073 0%, #FF453A 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
body.dark-mode .dc-counter-label { color: #AEAEB2 !important; }
body.dark-mode .dc-warn {
  background: linear-gradient(170deg, rgba(255,159,10,0.10) 0%, rgba(255,159,10,0.05) 100%) !important;
  border: 1.5px solid rgba(255,159,10,0.30) !important;
  box-shadow:
    0 4px 14px rgba(255,159,10,0.12),
    inset 0 1px 0 rgba(255,255,255,0.06) !important;
}
body.dark-mode .dc-warn-icon {
  background: rgba(255,159,10,0.20) !important;
  color: #FFCE5C !important;
}
body.dark-mode .dc-warn-title { color: #E5E5EA !important; }
body.dark-mode .dc-warn-text { color: #AEAEB2 !important; }

/* ============================================
   AE Analytics — Dark Mode (Apple Premium Glass parity with SDR/BDR)
   ============================================ */

/* AE Period Filter <select> — dark glass + native popup dark + RED custom chevron */
body.dark-mode #ae-period-filter {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  background: rgba(255,255,255,0.06) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ff3c1c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") no-repeat right 10px center / 12px 12px !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  color-scheme: dark;
  padding-right: 30px !important;
}
body.dark-mode #ae-period-filter:hover {
  border-color: rgba(255,60,28,0.35) !important;
}
body.dark-mode #ae-period-filter:focus {
  outline: none;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
}

/* AE Custom Range Picker (#ae-custom-range, position: absolute → excluded from glass override) */
body.dark-mode #ae-custom-range {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  backdrop-filter: blur(40px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(170%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 14px 36px rgba(0,0,0,0.55),
    0 4px 14px rgba(0,0,0,0.35) !important;
  color: #E5E5EA !important;
}
body.dark-mode #ae-custom-range > div:first-child { color: #E5E5EA !important; }
body.dark-mode #ae-custom-range label { color: #AEAEB2 !important; }
body.dark-mode #ae-custom-range input[type="date"] {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  color-scheme: dark;
}
body.dark-mode #ae-custom-range input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(38%) sepia(96%) saturate(6500%) hue-rotate(355deg) brightness(105%) contrast(105%);
  cursor: pointer;
}
body.dark-mode #ae-custom-range button[onclick*="cancelAECustomRange"] {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}

/* AE Member Filter Button + Dropdown — Apple Dark Glass */
body.dark-mode #ae-member-filter-btn {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}
body.dark-mode #ae-member-filter-btn:hover {
  border-color: rgba(255,60,28,0.35) !important;
}
body.dark-mode #ae-member-filter-btn svg path { stroke: #ff3c1c !important; }

body.dark-mode #ae-member-dropdown {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  backdrop-filter: blur(40px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(170%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 14px 36px rgba(0,0,0,0.55),
    0 4px 14px rgba(0,0,0,0.35) !important;
  color: #E5E5EA !important;
}
body.dark-mode #ae-member-search {
  background: rgba(255,255,255,0.06) !important;
  color: #E5E5EA !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
}
body.dark-mode #ae-member-search::placeholder { color: #8E8E93 !important; }
body.dark-mode #ae-member-list > div {
  color: #E5E5EA !important;
}
body.dark-mode #ae-member-list > div:hover {
  background: rgba(255,60,28,0.15) !important;
  color: #ff7a63 !important;
}

/* AE Health eyebrows — brighter for dark backgrounds */
body.dark-mode .ae-health-eyebrow-red { color: #ff7a63 !important; }
body.dark-mode .ae-health-eyebrow-yellow { color: #FFCE5C !important; }
body.dark-mode .ae-health-eyebrow-green { color: #6EE7A2 !important; }

/* AE Summary tiles — labels + values for dark backgrounds */
body.dark-mode .ae-summary-label { color: #AEAEB2 !important; }
body.dark-mode .ae-summary-value { color: #E5E5EA !important; }

/* AE Bars Wrapper — direct ID override (inline #f9f9f9 + border #e0e0e0 didn't catch via attribute selector) */
body.dark-mode #ae-bars-wrapper {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}

/* AE Demo bars — text + track + hover for dark mode
   CSS !important beats the inline rgba(0,0,0,0.04) hover set by onmouseenter handlers */
body.dark-mode #ae-demo-bars > div:hover {
  background: rgba(255,255,255,0.06) !important;
}
body.dark-mode #ae-demo-bars > div > div:first-child {
  color: #E5E5EA !important;
}
body.dark-mode #ae-demo-bars > div > div:nth-child(2) {
  background: rgba(255,255,255,0.08) !important;
}
body.dark-mode #ae-demo-bars > div > div:last-child {
  color: #AEAEB2 !important;
}

/* AE Bars Wrapper scrollbar */
body.dark-mode #ae-bars-wrapper::-webkit-scrollbar { width: 8px; }
body.dark-mode #ae-bars-wrapper::-webkit-scrollbar-track { background: transparent; }
body.dark-mode #ae-bars-wrapper::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.12); border-radius: 4px; }
body.dark-mode #ae-bars-wrapper::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.20); }

/* Ampel-cards (Risk Detail) */
body.dark-mode .ampel-content { background: rgba(255,255,255,0.03) !important; }
body.dark-mode .ampel-content-yellow { background: rgba(234,179,8,0.10) !important; }
body.dark-mode .ampel-content-red { background: rgba(196,30,30,0.12) !important; }
body.dark-mode .ampel-desc { color: #D1D1D6 !important; }
body.dark-mode .ampel-status { color: #E5E5EA !important; }

/* Pipeline Scanner tiers */
body.dark-mode .ps-tier { background: linear-gradient(170deg, rgba(40,25,25,0.6) 0%, rgba(30,15,15,0.45) 100%) !important; border-color: rgba(255,255,255,0.08) !important; }
body.dark-mode .ps-tier-1 { background: linear-gradient(170deg, rgba(60,30,30,0.6) 0%, rgba(40,20,20,0.45) 100%) !important; }
body.dark-mode .ps-tier-2 { background: linear-gradient(170deg, rgba(70,20,20,0.6) 0%, rgba(50,10,10,0.45) 100%) !important; }
body.dark-mode .ps-tier-3 { background: linear-gradient(170deg, rgba(20,40,25,0.5) 0%, rgba(15,30,20,0.35) 100%) !important; }

/* ============================================
   Pipeline Scanner — Dark Mode (Komplettpaket)
   ============================================ */

/* Header */
body.dark-mode .ps-header-title { color: #E5E5EA !important; }
body.dark-mode .ps-header-title-accent {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #FF453A !important;
  color: #FF453A !important;
}
body.dark-mode .ps-header-sub { color: #AEAEB2 !important; }
body.dark-mode .ps-header-pill {
  background: rgba(255,60,28,0.14) !important;
  border-color: rgba(255,60,28,0.30) !important;
  color: #FF453A !important;
}

/* Tier-Cards Inline-Texte (ps-bignum, ps-sub, ps-rightlabel, ps-bigsum) */
body.dark-mode #tab-pipeline-scanner [style*="color: #0f172a"],
body.dark-mode #tab-pipeline-scanner [style*="color:#0f172a"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(15, 23, 42)"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(15,23,42)"] {
  color: #E5E5EA !important;
}
body.dark-mode #tab-pipeline-scanner [style*="color: #475569"],
body.dark-mode #tab-pipeline-scanner [style*="color:#475569"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(71, 85, 105)"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(71,85,105)"] {
  color: #AEAEB2 !important;
}
body.dark-mode #tab-pipeline-scanner [style*="color: #64748b"],
body.dark-mode #tab-pipeline-scanner [style*="color:#64748b"] {
  color: #8E8E93 !important;
}
body.dark-mode #tab-pipeline-scanner [style*="color: #af1000"],
body.dark-mode #tab-pipeline-scanner [style*="color:#af1000"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(175, 16, 0)"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(175,16,0)"] {
  color: #FF453A !important;
}
body.dark-mode #tab-pipeline-scanner [style*="color: #7c0e00"],
body.dark-mode #tab-pipeline-scanner [style*="color:#7c0e00"] {
  color: #FF453A !important;
}
body.dark-mode #tab-pipeline-scanner [style*="color: #15803d"],
body.dark-mode #tab-pipeline-scanner [style*="color:#15803d"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(21, 128, 61)"],
body.dark-mode #tab-pipeline-scanner [style*="color: rgb(21,128,61)"] {
  color: #6EE7A2 !important;
}
body.dark-mode #tab-pipeline-scanner [style*="color: #0f5a2a"],
body.dark-mode #tab-pipeline-scanner [style*="color:#0f5a2a"] {
  color: #6EE7A2 !important;
}
body.dark-mode #tab-pipeline-scanner [style*="color: #334155"],
body.dark-mode #tab-pipeline-scanner [style*="color:#334155"] {
  color: #C7C7CC !important;
}

/* Solution-Headline + Tagline + Lead */
body.dark-mode .ps-solution-headline { color: #E5E5EA !important; }
body.dark-mode .ps-solution-tagline { color: #AEAEB2 !important; }
body.dark-mode .ps-solution-tagline span { color: #FF453A !important; }
body.dark-mode .ps-solution-lead { color: #AEAEB2 !important; }
body.dark-mode .ps-solution-accent {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #FF453A !important;
  color: #FF453A !important;
}

/* Cycle (Kreislauf-Diagramm) */
body.dark-mode .ps-cycle-header { color: #FF453A !important; }
body.dark-mode .ps-cyc-center-label { color: #ffffff !important; }  /* LAVA LOOP weiß */
body.dark-mode .ps-cyc-label { color: #FF453A !important; }
body.dark-mode .ps-cyc-card-final .ps-cyc-label { color: #6EE7A2 !important; }
body.dark-mode .ps-cyc-value { color: #FF453A !important; }
body.dark-mode .ps-cyc-card-final .ps-cyc-value { color: #6EE7A2 !important; }
body.dark-mode .ps-cyc-sub { color: #AEAEB2 !important; }
body.dark-mode .ps-cycle-loop { color: #6EE7A2 !important; }  /* Loop-Hinweis grün (positiv) */

/* Orbit-Ring + Pfeile in GRÜN (positiver Kreislauf-Flow) */
body.dark-mode .ps-cyc-orbit { border-color: rgba(110,231,162,0.45) !important; }
body.dark-mode .ps-cyc-arcs path[stroke="rgba(175,16,0,0.32)"] {
  stroke: rgba(110,231,162,0.65) !important;
}
body.dark-mode #pscArrow path {
  stroke: rgba(110,231,162,0.90) !important;
}

/* Pfeile + Animation ZWISCHEN den Tier-Boxen (Alle offenen → Kritisch → Gesund) */
body.dark-mode .ps-gap::before {
  background: linear-gradient(180deg, rgba(110,231,162,0.40) 0%, rgba(110,231,162,0.08) 100%) !important;
}
body.dark-mode .ps-gap::after {
  background: linear-gradient(180deg, transparent 0%, rgba(110,231,162,0.95) 50%, transparent 100%) !important;
}
body.dark-mode .ps-gap-arrow {
  border-top-color: rgba(110,231,162,0.75) !important;
}

/* CTA-Button im Tier (Klick öffnet Top 5...) */
body.dark-mode .ps-cta {
  color: inherit !important;
}

/* Trust-Section (am Anfang wenn nicht verbunden) */
body.dark-mode .ps-trust-hero {
  background: linear-gradient(170deg, rgba(44,44,46,0.42) 0%, rgba(31,31,34,0.32) 100%) !important;
  border-color: rgba(255,60,28,0.25) !important;
}
body.dark-mode .ps-trust-pill {
  background: rgba(255,60,28,0.14) !important;
  color: #FF453A !important;
}
body.dark-mode .ps-trust-title { color: #E5E5EA !important; }
body.dark-mode .ps-trust-lead { color: #AEAEB2 !important; }
body.dark-mode .ps-trust-badge {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}
body.dark-mode .ps-trust-badge svg { color: #6EE7A2 !important; }

/* Facts (Mini-Karten) */
body.dark-mode .ps-fact {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
body.dark-mode .ps-fact-title { color: #E5E5EA !important; }
body.dark-mode .ps-fact-text { color: #AEAEB2 !important; }
body.dark-mode .ps-fact-icon-yes { color: #6EE7A2 !important; }
body.dark-mode .ps-fact-icon-no { color: #FF453A !important; }

/* Pills (Alle offenen / Kritisch / Gesund) */
body.dark-mode .ps-pill-1 {
  background: rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}
body.dark-mode .ps-pill-2 {
  background: rgba(255,60,28,0.18) !important;
  color: #FF453A !important;
}
body.dark-mode .ps-pill-3 {
  background: rgba(48,209,88,0.18) !important;
  color: #6EE7A2 !important;
}

/* Cyc-Center (das runde "LavaLoft" Logo in der Mitte) */
body.dark-mode .ps-cyc-center {
  background: linear-gradient(135deg, #2a1818 0%, #1a0a08 100%) !important;
  border-color: rgba(255,60,28,0.40) !important;
}

/* PDF Button + CRM-Verbinden Button im Header (ps-header-btn schon vorhanden, hier sub-elemente) */
body.dark-mode .ps-header-btn:hover {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important;
  border-color: rgba(255,60,28,0.65) !important;
  color: #fff !important;
}
body.dark-mode .ps-header-btn-connected:hover {
  background: linear-gradient(135deg, #15803d 0%, #1e8e47 100%) !important;
  border-color: rgba(110,231,162,0.65) !important;
  color: #fff !important;
}

/* === Consent + Connect-Cards (CRM-Verbinden Modal "ps-crm-modal") === */
body.dark-mode .ps-consent {
  background: rgba(255,255,255,0.04) !important;
  border-color: rgba(255,255,255,0.10) !important;
}
body.dark-mode .ps-consent-row + .ps-consent-row {
  border-top: 1px dashed rgba(255,255,255,0.10) !important;
}
body.dark-mode .ps-consent-text { color: #C7C7CC !important; }
body.dark-mode .ps-consent-text strong { color: #E5E5EA !important; }
body.dark-mode .ps-consent-req { color: #FF453A !important; }

body.dark-mode .ps-connect-card {
  background: rgba(255,255,255,0.05) !important;
  border: 2px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}
body.dark-mode .ps-connect-card:hover {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,60,28,0.40) !important;
}
/* HubSpot/Salesforce Titel (inline color #111827) im Connect-Card */
body.dark-mode #ps-crm-modal [style*="color: #111827"],
body.dark-mode #ps-crm-modal [style*="color:#111827"] {
  color: #E5E5EA !important;
}
body.dark-mode #ps-crm-modal [style*="color: #888"],
body.dark-mode #ps-crm-modal [style*="color:#888"] {
  color: #AEAEB2 !important;
}
body.dark-mode #ps-crm-modal [style*="color: #0f172a"],
body.dark-mode #ps-crm-modal [style*="color:#0f172a"] {
  color: #E5E5EA !important;
}
body.dark-mode #ps-crm-modal [style*="color: #af1000"],
body.dark-mode #ps-crm-modal [style*="color:#af1000"] {
  color: #FF453A !important;
}

/* Pre-Connect Empty-State ("Bereit für deinen Pipeline-Check") — inline pink gradient + light text */
body.dark-mode #pipeline-scanner-content [style*="linear-gradient(135deg, #fff5f0"],
body.dark-mode #pipeline-scanner-content [style*="linear-gradient(135deg,#fff5f0"] {
  background: linear-gradient(170deg, rgba(44,44,46,0.55) 0%, rgba(31,31,34,0.45) 100%) !important;
  border-color: rgba(255,60,28,0.30) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3) !important;
}
body.dark-mode #pipeline-scanner-content [style*="color: #111827"],
body.dark-mode #pipeline-scanner-content [style*="color:#111827"] {
  color: #E5E5EA !important;
}
body.dark-mode #pipeline-scanner-content [style*="color: #6b7280"],
body.dark-mode #pipeline-scanner-content [style*="color:#6b7280"] {
  color: #AEAEB2 !important;
}
body.dark-mode #pipeline-scanner-content [style*="color: #af1000"],
body.dark-mode #pipeline-scanner-content [style*="color:#af1000"],
body.dark-mode #pipeline-scanner-content [style*="color: rgb(175, 16, 0)"] {
  color: #FF453A !important;
}
/* "CRM jetzt verbinden →" Button — inline background:#af1000 — stays as solid red Button,
   nur leicht heller damit's mit der neuen #FF453A Palette harmoniert */
body.dark-mode #pipeline-scanner-content button[style*="background: #af1000"],
body.dark-mode #pipeline-scanner-content button[style*="background:#af1000"],
body.dark-mode #pipeline-scanner-content button[style*="background: rgb(175, 16, 0)"] {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px rgba(255,60,28,0.30) !important;
}

/* Pipeline Scanner solution callout */
body.dark-mode .ps-solution { background: linear-gradient(135deg, #1f1414 0%, #2a1818 100%) !important; border-color: rgba(175,16,0,0.25) !important; }
body.dark-mode .ps-cycle { background: linear-gradient(135deg, rgba(20,20,22,0.55) 0%, rgba(28,28,30,0.45) 100%) !important; border-color: rgba(255,255,255,0.08) !important; }
/* Cards in cycle: neutral dark glass instead of red-on-red — bricht den monochromen Rot-Ton */
body.dark-mode .ps-cyc-card { background: rgba(28,28,30,0.85) !important; border-color: rgba(255,255,255,0.12) !important; }
body.dark-mode .ps-cyc-card-final { background: rgba(20,40,25,0.65) !important; border-color: rgba(21,128,61,0.40) !important; }
body.dark-mode .ps-cyc-center { background: linear-gradient(135deg, #2a1818 0%, #1a0a08 100%) !important; border-color: rgba(255,60,28,0.40) !important; }

/* Velocity / chart containers */
body.dark-mode .velocity-result { background: rgba(255,255,255,0.04) !important; color: #E5E5EA !important; }

/* Member rows / list items (mm-form-input separat unten gehandhabt) */
body.dark-mode .deal-row { background: rgba(255,255,255,0.04) !important; color: #E5E5EA !important; border-color: rgba(255,255,255,0.08) !important; }
body.dark-mode .deal-row:hover { background: rgba(255,255,255,0.06) !important; }

/* Loading & Auth screens — werden BEWUSST NICHT vom Dark Mode beeinflusst.
   Behalten immer ihr originales LavaLoft-Branding (rot/schwarz Gradient). */
body.dark-mode .loading-screen,
body.dark-mode .auth-screen {
  background: linear-gradient(135deg, #000000 0%, #0a0508 30%, #5a0a02 65%, #af1000 100%) !important;
  color: #ffffff !important;
}
body.dark-mode .loading-screen *,
body.dark-mode .auth-screen *,
body.dark-mode .loading-content *,
body.dark-mode .auth-content * {
  /* Unset dark-mode color overrides — keep original auth/loading styling */
  color: inherit !important;
}
body.dark-mode .loading-content p,
body.dark-mode .auth-content p { color: rgba(255,255,255,0.7) !important; }
body.dark-mode .auth-content h2 { color: #fff !important; }
body.dark-mode .auth-content .form-input { background: rgba(255,255,255,0.1) !important; color: #fff !important; border-color: rgba(255,255,255,0.2) !important; }
body.dark-mode .auth-content .form-input::placeholder { color: rgba(255,255,255,0.45) !important; }
body.dark-mode .auth-content .primary-btn { background: linear-gradient(135deg,#af1000 0%, #d91507 100%) !important; color: #fff !important; }

/* Card hover states */
body.dark-mode .ps-clickable:hover,
body.dark-mode .perf-card:hover,
body.dark-mode .deal-card:hover { border-color: rgba(255,255,255,0.16) !important; box-shadow: 0 8px 28px rgba(0,0,0,0.4) !important; }

/* Progress bars */
body.dark-mode .progress-bar-track,
body.dark-mode [class*="progress-track"] { background: rgba(255,255,255,0.06) !important; }

/* Common gradient patterns in inline styles (white-base) */
body.dark-mode [style*="linear-gradient(to right,#fafafa"],
body.dark-mode [style*="linear-gradient(to right, #fafafa"],
body.dark-mode [style*="linear-gradient(to bottom,#fafafa"],
body.dark-mode [style*="linear-gradient(to bottom, #fafafa"] { background: linear-gradient(to right, rgba(40,25,25,0.4), rgba(30,15,15,0.4)) !important; }

/* Status pills (success/warning/danger) — keep accent colors */
body.dark-mode .badge-success,
body.dark-mode [style*="background:#e8f5e9"],
body.dark-mode [style*="background: #e8f5e9"] { background: rgba(102,187,106,0.12) !important; color: #66bb6a !important; }
body.dark-mode .badge-warning,
body.dark-mode [style*="background:#fff3e0"],
body.dark-mode [style*="background: #fff3e0"] { background: rgba(255,167,38,0.12) !important; color: #ffa726 !important; }
body.dark-mode .badge-danger,
body.dark-mode [style*="background:#ffebee"],
body.dark-mode [style*="background: #ffebee"] { background: rgba(239,83,80,0.12) !important; color: #ef5350 !important; }
body.dark-mode [style*="background:#e3f2fd"],
body.dark-mode [style*="background: #e3f2fd"] { background: rgba(66,165,245,0.12) !important; color: #42a5f5 !important; }

/* Topbar Sneakpeek (Q-Revenue) */
body.dark-mode .topbar-sneakpeek { background: rgba(255,255,255,0.04) !important; border-color: rgba(255,255,255,0.08) !important; }
body.dark-mode .topbar-sneakpeek * { color: #E5E5EA; }

/* CRM Integration cards */
body.dark-mode #crm-integration-config-section,
body.dark-mode .config-loading,
body.dark-mode #crm-not-connected,
body.dark-mode #crm-connected { color: #E5E5EA; }
body.dark-mode .config-hint { color: #AEAEB2 !important; }
body.dark-mode .config-spinner { border-top-color: #af1000 !important; border-color: rgba(255,255,255,0.1); }

/* Hover row highlight in tables (more subtle) */
body.dark-mode tr:hover td,
body.dark-mode tbody tr:hover { background: rgba(255,255,255,0.04) !important; }

/* Scrollbars — Apple style dark */
body.dark-mode ::-webkit-scrollbar { width: 10px; height: 10px; }
body.dark-mode ::-webkit-scrollbar-track { background: rgba(255,255,255,0.03); }
body.dark-mode ::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.15); border-radius: 5px; border: 2px solid transparent; background-clip: content-box; }
body.dark-mode ::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,0.25); background-clip: content-box; }
body.dark-mode { scrollbar-color: rgba(255,255,255,0.15) rgba(255,255,255,0.03); }

/* Sneak-peek (Quartal-Pillen oben in Topbar) - LavaHome-style glass */
body.dark-mode .topbar-sneakpeek {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.1) !important;
}

/* Select-Options dark backend */
body.dark-mode select option { background: #2a2a35; color: #E5E5EA; }

/* Glass-effect for any [data-glass] (uses LavaHome blue-gray) */
body.dark-mode [data-glass] {
  background: linear-gradient(170deg, rgba(40,40,55,0.5) 0%, rgba(30,30,45,0.35) 50%, rgba(40,40,55,0.4) 100%) !important;
  border-color: rgba(255,255,255,0.1) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.2), inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

/* Box-shadows mit hellem rgba(0,0,0,0.X) — verstärken bei Dark Mode */
body.dark-mode [style*="box-shadow:0 1px 3px rgba(0,0,0,0.1)"] { box-shadow: 0 1px 3px rgba(0,0,0,0.4) !important; }
body.dark-mode [style*="box-shadow: 0 1px 3px rgba(0,0,0,0.1)"] { box-shadow: 0 1px 3px rgba(0,0,0,0.4) !important; }
body.dark-mode [style*="box-shadow:0 2px 8px rgba(0,0,0,0.1)"] { box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; }
body.dark-mode [style*="box-shadow: 0 2px 8px rgba(0,0,0,0.1)"] { box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; }

/* Generic light-grays seen in admin: #f8f8fa, #ebebeb, #ddd, etc. */
body.dark-mode [style*="background:#f8f8fa"],
body.dark-mode [style*="background: #f8f8fa"],
body.dark-mode [style*="background:#f3f3f3"],
body.dark-mode [style*="background: #f3f3f3"],
body.dark-mode [style*="background:#ebebeb"],
body.dark-mode [style*="background: #ebebeb"],
body.dark-mode [style*="background:#e0e0e0"],
body.dark-mode [style*="background: #e0e0e0"] { background: rgba(255,255,255,0.06) !important; }

/* Dark gray text variants */
body.dark-mode [style*="color:#475569"],
body.dark-mode [style*="color: #475569"],
body.dark-mode [style*="color:#64748b"],
body.dark-mode [style*="color: #64748b"],
body.dark-mode [style*="color:#5e5e63"],
body.dark-mode [style*="color: #5e5e63"] { color: #D1D1D6 !important; }

/* Pill-style backgrounds with very low opacity black/white — flip */
body.dark-mode [style*="background:rgba(0,0,0,0.04)"],
body.dark-mode [style*="background: rgba(0,0,0,0.04)"],
body.dark-mode [style*="background:rgba(0,0,0,0.05)"],
body.dark-mode [style*="background: rgba(0,0,0,0.05)"],
body.dark-mode [style*="background:rgba(0,0,0,0.06)"],
body.dark-mode [style*="background: rgba(0,0,0,0.06)"] { background: rgba(255,255,255,0.06) !important; }
body.dark-mode [style*="background:rgba(0,0,0,0.08)"],
body.dark-mode [style*="background: rgba(0,0,0,0.08)"],
body.dark-mode [style*="background:rgba(0,0,0,0.10)"],
body.dark-mode [style*="background: rgba(0,0,0,0.10)"] { background: rgba(255,255,255,0.10) !important; }

/* Border with light gray */
body.dark-mode [style*="border:1px solid rgba(0,0,0,0.1)"],
body.dark-mode [style*="border: 1px solid rgba(0,0,0,0.1)"] { border-color: rgba(255,255,255,0.12) !important; }
body.dark-mode [style*="border-top:1px solid rgba(0,0,0,0.06)"],
body.dark-mode [style*="border-top: 1px solid rgba(0,0,0,0.06)"],
body.dark-mode [style*="border-bottom:1px solid rgba(0,0,0,0.06)"],
body.dark-mode [style*="border-bottom: 1px solid rgba(0,0,0,0.06)"] { border-color: rgba(255,255,255,0.08) !important; }

body.dark-mode [style*="background:#fafafa"],
body.dark-mode [style*="background: #fafafa"],
body.dark-mode [style*="background:#f9f9f9"],
body.dark-mode [style*="background: #f9f9f9"],
body.dark-mode [style*="background:#f5f5f5"],
body.dark-mode [style*="background: #f5f5f5"],
body.dark-mode [style*="background:#f4f4f6"],
body.dark-mode [style*="background: #f4f4f6"] { background: rgba(255,255,255,0.04) !important; }

body.dark-mode [style*="color:#1C1C1E"],
body.dark-mode [style*="color: #1C1C1E"],
body.dark-mode [style*="color:#1a1a1a"],
body.dark-mode [style*="color: #1a1a1a"],
body.dark-mode [style*="color:#212121"],
body.dark-mode [style*="color: #212121"] { color: #E5E5EA !important; }

body.dark-mode [style*="color:#000"],
body.dark-mode [style*="color: #000"] { color: #E5E5EA !important; }

body.dark-mode [style*="color:#8E8E93"],
body.dark-mode [style*="color: #8E8E93"],
body.dark-mode [style*="color:#888"],
body.dark-mode [style*="color: #888"],
body.dark-mode [style*="color:#757575"],
body.dark-mode [style*="color: #757575"],
body.dark-mode [style*="color:#666"],
body.dark-mode [style*="color: #666"],
body.dark-mode [style*="color:#6E6E73"],
body.dark-mode [style*="color: #6E6E73"] { color: #AEAEB2 !important; }

body.dark-mode [style*="color:#333"],
body.dark-mode [style*="color: #333"],
body.dark-mode [style*="color:#424242"],
body.dark-mode [style*="color: #424242"],
body.dark-mode [style*="color:#3C3C43"],
body.dark-mode [style*="color: #3C3C43"] { color: #D1D1D6 !important; }

body.dark-mode [style*="border:1px solid #e0e0e0"],
body.dark-mode [style*="border: 1px solid #e0e0e0"],
body.dark-mode [style*="border:1px solid #eee"],
body.dark-mode [style*="border: 1px solid #eee"],
body.dark-mode [style*="border-top:1px solid #f0f0f0"],
body.dark-mode [style*="border-bottom:1px solid #f0f0f0"] { border-color: rgba(255,255,255,0.08) !important; }

/* Skip dark inversion for elements that should keep light styling (e.g., light-theme overrides) */
body.dark-mode .light-theme,
body.dark-mode .keep-light { color: initial; background: initial; }

/* === Erscheinungsbild Toggle === */
.theme-toggle-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 4px 0; }
.theme-toggle-text { flex: 1; min-width: 0; }
.theme-toggle-title { font-size: 15px; font-weight: 700; color: var(--text-primary); margin-bottom: 4px; }
.theme-toggle-desc { font-size: 13px; color: var(--text-secondary); line-height: 1.5; }
.theme-pill-toggle { width: 52px; height: 30px; border-radius: 999px; background: rgba(0,0,0,0.12); border: none; position: relative; cursor: pointer; padding: 0; transition: background 0.25s var(--ease-ios); flex-shrink: 0; }
.theme-pill-thumb { position: absolute; top: 3px; left: 3px; width: 24px; height: 24px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,0.25), 0 1px 1px rgba(0,0,0,0.15); transition: left 0.25s var(--ease-ios); }
body.dark-mode .theme-pill-toggle { background: #af1000; }
body.dark-mode .theme-pill-thumb { left: 25px; background: #fff; }

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  min-height: 100vh;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', system-ui, sans-serif;
  background:
    radial-gradient(circle 1200px at 0% 0%, rgba(196,30,30,0.09), transparent),
    radial-gradient(circle 1200px at 100% 100%, rgba(217,21,7,0.09), transparent),
    #ffffff;
  background-attachment: fixed;
  color: #1C1C1E;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern" 1, "liga" 1;
  letter-spacing: -0.01em;
}

/* === Loading & Auth Screens — Black→Red Apple Premium === */
.loading-screen,
.auth-screen {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  position: relative;
  background: linear-gradient(135deg, #000000 0%, #0a0508 30%, #5a0a02 65%, #af1000 100%);
  overflow: hidden;
}
.loading-screen::before,
.auth-screen::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 78% 38%, rgba(217,21,7,0.30) 0%, transparent 60%),
    radial-gradient(ellipse 40% 70% at 12% 78%, rgba(0,0,0,0.45) 0%, transparent 55%),
    radial-gradient(ellipse 50% 50% at 50% 0%, rgba(255,255,255,0.04) 0%, transparent 60%);
  pointer-events: none;
}

.loading-content,
.auth-content {
  position: relative;
  z-index: 1;
  text-align: center;
  background: linear-gradient(170deg, rgba(255,255,255,0.14) 0%, rgba(255,255,255,0.06) 100%);
  backdrop-filter: blur(60px) saturate(180%);
  -webkit-backdrop-filter: blur(60px) saturate(180%);
  padding: 56px 48px;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,0.22);
  box-shadow:
    0 0 0 0.5px rgba(0,0,0,0.10),
    0 30px 80px rgba(0,0,0,0.50),
    0 12px 32px rgba(0,0,0,0.30),
    inset 0 1px 0 rgba(255,255,255,0.30),
    inset 0 -1px 0 rgba(255,255,255,0.08);
  min-width: 420px;
  color: rgba(255,255,255,0.95);
  animation: authCardIn 0.6s cubic-bezier(0.34, 1.2, 0.64, 1);
}
@keyframes authCardIn {
  from { opacity: 0; transform: translateY(20px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.logo {
  font-size: 48px;
  font-weight: 800;
  margin-bottom: 22px;
}
.logo .lavasuite-wordmark .topbar-brand-text-lava { color: #ffffff !important; }
.logo .lavasuite-wordmark .topbar-brand-text-suite { /* gold gradient already applied */ }

.loading-spinner {
  width: 48px;
  height: 48px;
  border: 3px solid rgba(255,255,255,0.14);
  border-top-color: rgba(255,255,255,0.95);
  border-radius: 50%;
  animation: spin 0.9s linear infinite;
  margin: 22px auto;
  box-shadow: 0 0 24px rgba(217,21,7,0.30);
}

@keyframes spin {
  to { transform: rotate(360deg); }
}

.loading-content p {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  color: rgba(255,255,255,0.75);
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0.2px;
  margin: 0;
}

.auth-content h2 {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.6px;
  margin: 6px 0 10px;
  color: #ffffff;
}

.auth-content p {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  color: rgba(255,255,255,0.72);
  font-size: 13.5px;
  font-weight: 500;
  margin-bottom: 12px;
  letter-spacing: -0.05px;
  line-height: 1.5;
}

.access-hint {
  font-size: 12.5px !important;
  font-style: normal;
  color: rgba(255,255,255,0.55) !important;
  margin-top: 6px;
}

/* Login form inputs on dark glass */
.auth-content .form-input {
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.20);
  color: #ffffff;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.10);
}
.auth-content .form-input::placeholder { color: rgba(255,255,255,0.45); }
.auth-content .form-input:hover { border-color: rgba(255,255,255,0.32); background: rgba(255,255,255,0.14); }
.auth-content .form-input:focus {
  outline: none;
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.55);
  box-shadow: 0 0 0 3px rgba(255,255,255,0.12), inset 0 1px 2px rgba(0,0,0,0.10);
}
#login-error {
  color: #ffb3aa !important;
  font-size: 12.5px;
  font-weight: 600;
  background: rgba(196,30,58,0.18);
  border: 1px solid rgba(255,180,170,0.30);
  padding: 9px 12px;
  border-radius: 10px;
  margin-bottom: 16px;
}
.auth-content #logout-btn {
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.22);
  color: #ffffff;
  margin-top: 18px;
}
.auth-content #logout-btn:hover {
  background: rgba(255,255,255,0.18);
  border-color: rgba(255,255,255,0.35);
  color: #ffffff;
}

/* Buttons — Apple Glass Style */
.primary-btn,
.secondary-btn {
  padding: 11px 22px;
  border: 1px solid transparent;
  border-radius: 12px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.primary-btn {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: white;
  border-color: rgba(175,16,0,0.5);
  box-shadow: 0 4px 14px rgba(175,16,0,0.25), inset 0 1px 0 rgba(255,255,255,0.2);
}

.primary-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(175,16,0,0.32), inset 0 1px 0 rgba(255,255,255,0.25);
}

.primary-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(175,16,0,0.2), inset 0 1px 0 rgba(255,255,255,0.15);
}

.secondary-btn {
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  color: #1C1C1E;
  border-color: rgba(0,0,0,0.08);
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.4);
}

.secondary-btn:hover {
  background: rgba(255,255,255,0.85);
  border-color: rgba(0,0,0,0.14);
  color: #af1000;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.4);
}

.delete-selected-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: white;
  border: 1px solid rgba(175,16,0,0.55);
  border-radius: 12px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 3px 10px rgba(175,16,0,0.28), inset 0 1px 0 rgba(255,255,255,0.18);
  animation: slideIn 0.25s cubic-bezier(0.34, 1.2, 0.64, 1);
}

.delete-selected-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 5px 16px rgba(175,16,0,0.36), inset 0 1px 0 rgba(255,255,255,0.22);
}

.delete-selected-btn:active {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(175,16,0,0.22), inset 0 1px 0 rgba(255,255,255,0.15);
}

.delete-selected-btn svg {
  flex-shrink: 0;
  opacity: 0.95;
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.clear-selection-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  background: rgba(255,255,255,0.65);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  backdrop-filter: blur(20px) saturate(150%);
  color: #1C1C1E;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.5);
  animation: slideIn 0.25s cubic-bezier(0.34, 1.2, 0.64, 1);
}

.clear-selection-btn:hover {
  background: rgba(255,255,255,0.92);
  border-color: rgba(0,0,0,0.14);
  color: #af1000;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.5);
}

.clear-selection-btn:active {
  transform: translateY(0);
}

.clear-selection-btn svg {
  flex-shrink: 0;
  opacity: 0.7;
}
.clear-selection-btn:hover svg {
  opacity: 1;
}

.logout-btn {
  padding: 8px 16px;
  background: transparent;
  border: 1px solid var(--border-color);
  border-radius: 6px;
  color: var(--text-secondary);
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.logout-btn:hover {
  background: var(--danger-color);
  color: white;
  border-color: var(--danger-color);
}

/* ============================================
   APPLE-GLASSY HEADER (LavaHome-Style, Light Mode)
   ============================================ */

/* Header — B2B Best-Practice Layout: SaaS-Brand | Divider | Customer | Settings */
.console-header {
  position: relative;
  width: fit-content;
  margin: 24px auto 28px;
  padding: 20px 52px 20px 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 64px;
  border-radius: 28px;
  overflow: visible;
  background: linear-gradient(170deg, rgba(255,255,255,0.4) 0%, rgba(255,255,255,0.28) 100%);
  backdrop-filter: blur(40px) saturate(150%);
  -webkit-backdrop-filter: blur(40px) saturate(150%);
  border: 1.5px solid rgba(175,16,0,0.22);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.04),
    0 16px 48px -12px rgba(175,16,0,0.20),
    0 6px 18px rgba(175,16,0,0.08),
    0 2px 6px rgba(0,0,0,0.04),
    inset 0 1.5px 0 rgba(255,255,255,0.95),
    inset 0 -1px 0 rgba(0,0,0,0.04);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  z-index: 100;
}

.header-left,
.header-right {
  display: flex;
  align-items: center;
  gap: 22px;
}

/* === SECTION 1: SaaS BRAND (LavaSuite logo + wordmark) === */
.topbar-brand {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}

.topbar-brand-flame {
  width: 38px;
  height: 42px;
  object-fit: contain;
  filter: drop-shadow(1px 2px 3px rgba(0,0,0,0.2));
}

.topbar-brand-wordmark {
  position: relative;
  display: inline-flex;
  align-items: flex-start;
  line-height: 1;
  gap: 4px;
}

.topbar-brand-text {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -1.4px;
  line-height: 1;
  display: inline-block;
  white-space: nowrap;
}

.topbar-brand-text-lava {
  color: #1C1C1E;
  text-shadow: 0 1px 1px rgba(255,255,255,0.5);
}

.topbar-brand-text-suite {
  background: linear-gradient(135deg, #8B6914 0%, #B8952E 25%, #D4AF37 45%, #E8C547 55%, #D4AF37 75%, #8B6914 100%);
  background-size: 180% 180%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  filter: drop-shadow(0 1px 1px rgba(184,149,46,0.25));
  animation: brandGoldShimmer 8s ease-in-out infinite;
}

/* Reusable LavaSuite Wordmark — used on loading/login/no-access screens */
.lavasuite-wordmark {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-weight: 800;
  line-height: 1;
  display: inline-block;
  white-space: nowrap;
}
.lavasuite-wordmark-xl { font-size: 44px; letter-spacing: -1.8px; }
.lavasuite-wordmark-l  { font-size: 38px; letter-spacing: -1.5px; }
.lavasuite-wordmark-m  { font-size: 30px; letter-spacing: -1.2px; }

@keyframes brandGoldShimmer {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* === DESIGN ELEMENT: Minimal thin black divider (Apple-premium) === */
.topbar-divider-pill {
  display: inline-block;
  width: 1px;
  height: 40px;
  background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.14) 25%, rgba(0,0,0,0.14) 75%, rgba(0,0,0,0) 100%);
  flex-shrink: 0;
}

/* Keep legacy divider class working (used elsewhere) */
.topbar-divider {
  width: 2px;
  height: 38px;
  background: linear-gradient(180deg, rgba(0,0,0,0.03) 0%, rgba(0,0,0,0.22) 30%, rgba(0,0,0,0.22) 70%, rgba(0,0,0,0.03) 100%);
  border-radius: 2px;
  flex-shrink: 0;
}

/* === SECTION 2: CUSTOMER (Company logo + name + role) === */
.topbar-customer {
  display: flex;
  align-items: center;
  gap: 32px;
  flex-shrink: 0;
}

.topbar-company-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 38px;
  max-width: 120px;
  padding: 0;
  margin-right: 4px;
  flex-shrink: 0;
}

.topbar-company-logo img {
  width: auto;
  height: 38px;
  max-width: 120px;
  max-height: 38px;
  object-fit: contain;
  display: block;
}

.topbar-logo-placeholder {
  width: 80px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.035);
  border: 1.5px dashed rgba(0,0,0,0.14);
  border-radius: 6px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 9.5px;
  font-weight: 700;
  color: #A0A0A5;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  user-select: none;
}

.topbar-customer-info {
  display: flex;
  align-items: center;
  gap: 26px;
}

.topbar-customer-name {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.6px;
  color: #1C1C1E;
  white-space: nowrap;
  /* X-Verschiebung über inline-style auf #team-name-header (highest specificity, no cache issues) */
}

.topbar-customer-name:empty {
  display: none;
}

/* === SECTION 3: STOCK-PORTFOLIO STYLE SNEAK-PEEK (single line) === */
.topbar-sneakpeek {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-radius: 12px;
  background: linear-gradient(170deg, rgba(255,255,255,0.55) 0%, rgba(245,247,252,0.42) 100%);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
  border: 1px solid rgba(255,255,255,0.55);
  box-shadow:
    0 0 0 0.5px rgba(0,0,0,0.04),
    0 2px 8px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.4);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}

.sneakpeek-q {
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 1.2px;
  color: #af1000;
  text-transform: uppercase;
  padding: 3px 7px;
  background: rgba(175,16,0,0.08);
  border: 1px solid rgba(175,16,0,0.18);
  border-radius: 6px;
}

.sneakpeek-revenue {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.3px;
  color: #1C1C1E;
}

.sneakpeek-sep {
  font-size: 13px;
  font-weight: 500;
  color: #C7C7CC;
}

.sneakpeek-target {
  font-size: 13px;
  font-weight: 600;
  color: #8E8E93;
}

.sneakpeek-delta {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px 7px 3px 5px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: -0.1px;
  margin-left: 2px;
}

.sneakpeek-delta-up {
  background: rgba(46,125,50,0.10);
  color: #1e7d22;
  border: 1px solid rgba(46,125,50,0.18);
}

.sneakpeek-delta-down {
  background: rgba(175,16,0,0.10);
  color: #af1000;
  border: 1px solid rgba(175,16,0,0.22);
}

.sneakpeek-delta-neutral {
  background: rgba(142,142,147,0.10);
  color: #8E8E93;
  border: 1px solid rgba(142,142,147,0.22);
}

.sneakpeek-arrow {
  width: 11px;
  height: 11px;
  flex-shrink: 0;
}

.console-header .logo {
  font-size: 24px;
  margin: 0;
}

.team-info {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-left: 16px;
  position: relative;
}

.team-info::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8%;
  bottom: 8%;
  width: 1px;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.12) 50%, transparent 100%);
}

.team-info span:first-child {
  font-weight: 700;
  font-size: 14px;
  color: #1C1C1E;
  letter-spacing: -0.2px;
}

/* Role-Badge — Gold Premium Style (LavaHome SDR pattern), positioned top-right of brand */
.role-badge {
  position: relative;
  top: -2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #B8952E, #D4AF37, #F0D68A, #D4AF37);
  background-size: 200% 200%;
  animation: goldShimmer 3s ease infinite;
  color: #1C1C1E;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-weight: 800;
  font-size: 10px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(212,175,55,0.35);
  line-height: 1.2;
  white-space: nowrap;
  z-index: 2;
  flex-shrink: 0;
}

@keyframes goldShimmer {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

.role-badge:empty {
  display: none;
}

/* Settings Gear Button + Dropdown — Light Glass */
.settings-dropdown {
  position: relative;
}

.settings-gear-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 10px;
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(0,0,0,0.06);
  color: #1C1C1E;
  cursor: pointer;
  transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1), color 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 1px 3px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.4);
}

.settings-gear-btn svg {
  width: 17px;
  height: 17px;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.settings-gear-btn:hover {
  background: rgba(255,255,255,0.85);
  border-color: rgba(0,0,0,0.12);
  box-shadow: 0 4px 14px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,1);
}

.settings-gear-btn:hover svg {
  transform: rotate(45deg);
}

.settings-gear-btn.active {
  background: rgba(175,16,0,0.08);
  border-color: rgba(175,16,0,0.18);
  color: #af1000;
}

.settings-gear-btn.active svg {
  transform: rotate(45deg);
}

.settings-dropdown-menu {
  position: fixed;
  min-width: 280px;
  width: max-content;
  background: linear-gradient(170deg, rgba(255,255,255,0.55) 0%, rgba(252,250,255,0.42) 100%);
  backdrop-filter: blur(60px) saturate(200%);
  -webkit-backdrop-filter: blur(60px) saturate(200%);
  border: 1.5px solid rgba(175,16,0,0.22);
  border-radius: 18px;
  box-shadow:
    0 0 0 0.5px rgba(0,0,0,0.04),
    0 20px 60px -10px rgba(175,16,0,0.20),
    0 8px 24px -8px rgba(175,16,0,0.08),
    0 2px 8px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.72),
    inset 0 -1px 0 rgba(255,255,255,0.25);
  padding: 6px;
  z-index: 1500;
  overflow: visible;
  /* Premium Apple-style entrance/exit (matching nav-dropdown) */
  visibility: hidden;
  opacity: 0;
  transform: translateY(-8px) scale(0.94);
  transform-origin: top right;
  transition:
    opacity 0.26s cubic-bezier(0.32, 0.72, 0, 1),
    transform 0.32s cubic-bezier(0.34, 1.2, 0.64, 1),
    visibility 0s linear 0.32s;
  pointer-events: none;
}

.settings-dropdown-menu.is-portaled-open {
  visibility: visible;
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
  transition:
    opacity 0.26s cubic-bezier(0.32, 0.72, 0, 1),
    transform 0.34s cubic-bezier(0.34, 1.2, 0.64, 1),
    visibility 0s linear 0s;
}

/* Invisible bridge between dropdown and gear button — prevents hover loss */
.settings-dropdown-menu::before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  height: 14px;
  background: transparent;
}

/* Account info section (top of dropdown) */
.settings-account-info {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 12px 14px 11px;
  border-radius: 10px;
}

.settings-account-avatar {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  border: 1px solid rgba(175,16,0,0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  box-shadow: 0 3px 8px rgba(175,16,0,0.25), inset 0 1px 0 rgba(255,255,255,0.20);
}

.settings-account-text {
  flex: 1;
  min-width: 0;
}

.settings-account-label {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 800;
  color: #8E8E93;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.settings-account-email {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.settings-divider {
  height: 1px;
  background: rgba(0,0,0,0.06);
  margin: 4px 6px;
}

.settings-dropdown-item {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  padding: 11px 14px;
  background: transparent;
  border: none;
  border-radius: 10px;
  text-align: left;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: background 0.18s cubic-bezier(0.4, 0, 0.2, 1), color 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.settings-dropdown-item + .settings-dropdown-item {
  margin-top: 4px;
}

.settings-dropdown-item svg {
  color: #8E8E93;
  flex-shrink: 0;
  transition: color 0.18s ease;
}

.settings-dropdown-item:hover {
  background: rgba(175,16,0,0.06);
  color: #af1000;
}

.settings-dropdown-item:hover svg {
  color: #af1000;
}

.settings-dropdown-item.active {
  background: rgba(175,16,0,0.10);
  color: #af1000;
  font-weight: 700;
}

.settings-dropdown-item.active svg {
  color: #af1000;
}

/* Logout item — iOS red on light glass */
.settings-logout-item {
  color: #c41e3a;
}

.settings-logout-item svg {
  color: #c41e3a;
}

.settings-logout-item:hover {
  background: rgba(196,30,58,0.10);
  color: #c41e3a;
}

.settings-logout-item:hover svg {
  color: #c41e3a;
}

/* Hide the standalone logout-btn class (no longer used in header) */
.logout-btn {
  display: none;
}

/* Navigation Tabs — Floating Dark Glass Pill at Bottom Center (more transparent, more frosted) */
.console-nav {
  position: fixed;
  bottom: 22px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 999;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  border-radius: 22px;
  background: linear-gradient(170deg, rgba(255,255,255,0.55) 0%, rgba(252,250,255,0.42) 100%);
  backdrop-filter: blur(60px) saturate(200%);
  -webkit-backdrop-filter: blur(60px) saturate(200%);
  border: 1.5px solid rgba(175,16,0,0.22);
  box-shadow:
    0 0 0 0.5px rgba(0,0,0,0.04),
    0 20px 60px -10px rgba(175,16,0,0.20),
    0 8px 24px -8px rgba(175,16,0,0.10),
    0 2px 8px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.72),
    inset 0 -1px 0 rgba(255,255,255,0.25);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
}

.nav-tab {
  padding: 11px 18px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 14px;
  color: #6e6e73;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.32, 0.72, 0, 1);
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.nav-tab .nav-icon {
  flex-shrink: 0;
  opacity: 0.6;
  transform: scale(1);
  transform-origin: center;
  transition:
    opacity 0.3s cubic-bezier(0.32, 0.72, 0, 1),
    transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.nav-tab .nav-label {
  font-family: inherit;
  font-size: 13.5px;
  font-weight: inherit;
  letter-spacing: -0.1px;
  line-height: 1;
  display: inline-block;
  transition: font-weight 0.3s ease, color 0.3s ease;
}

.nav-tab .nav-chevron {
  flex-shrink: 0;
  opacity: 0.55;
  margin-left: -2px;
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1), opacity 0.3s cubic-bezier(0.32, 0.72, 0, 1);
}

.nav-tab:hover .nav-icon {
  opacity: 0.95;
}

.nav-tab:hover .nav-chevron {
  opacity: 0.85;
  transform: translateY(1px);
}

.nav-tab.active .nav-icon {
  opacity: 1;
  transform: scale(1.18);
}

.nav-tab.active .nav-chevron {
  opacity: 1;
}

.nav-tab.active .nav-label {
  font-weight: 800;
}

.nav-tab:hover {
  color: #af1000;
  background: rgba(175,16,0,0.06);
}

.nav-tab.active {
  color: #af1000;
  font-weight: 700;
  background: transparent; /* pill provides background */
}

.nav-tab.active:hover {
  background: transparent; /* don't double-paint */
}

/* Sliding pill indicator (LavaHome-style) — sized to match buttons exactly via JS */
.nav-pill {
  position: absolute;
  top: 0;
  left: 0;
  height: 0;
  width: 0;
  border-radius: 14px;
  background: rgba(175,16,0,0.10);
  border: 1px solid rgba(175,16,0,0.18);
  box-shadow: 0 2px 8px rgba(175,16,0,0.12), inset 0 1px 0 rgba(255,255,255,0.6);
  transition:
    transform 0.4s cubic-bezier(0.32, 0.72, 0, 1),
    width 0.4s cubic-bezier(0.32, 0.72, 0, 1),
    height 0.4s cubic-bezier(0.32, 0.72, 0, 1),
    opacity 0.2s ease;
  pointer-events: none;
  z-index: 0;
  opacity: 0;
}

.nav-pill.nav-pill-ready {
  opacity: 1;
}

/* Nav-tab content must sit above pill */
.nav-tab {
  position: relative;
  z-index: 1;
}

/* Add bottom padding to main content so the floating navbar doesn't cover anything */
.console-content {
  padding-bottom: 130px !important;
}

/* Navigation Dropdown — opens UPWARD because navbar is at bottom */
.nav-dropdown {
  position: relative;
}

.nav-dropdown-menu {
  position: fixed;
  min-width: 200px;
  width: max-content;
  background: linear-gradient(170deg, rgba(255,255,255,0.55) 0%, rgba(252,250,255,0.42) 100%);
  backdrop-filter: blur(60px) saturate(200%);
  -webkit-backdrop-filter: blur(60px) saturate(200%);
  border: 1.5px solid rgba(175,16,0,0.22);
  border-radius: 18px;
  box-shadow:
    0 0 0 0.5px rgba(0,0,0,0.04),
    0 20px 60px -10px rgba(175,16,0,0.20),
    0 8px 24px -8px rgba(175,16,0,0.08),
    0 2px 8px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.72),
    inset 0 -1px 0 rgba(255,255,255,0.25);
  padding: 6px;
  z-index: 1500;
  overflow: visible;
  /* Premium Apple-style entrance/exit */
  visibility: hidden;
  opacity: 0;
  transform: translateY(8px) scale(0.94);
  transform-origin: bottom center;
  transition:
    opacity 0.26s cubic-bezier(0.32, 0.72, 0, 1),
    transform 0.32s cubic-bezier(0.34, 1.2, 0.64, 1),
    visibility 0s linear 0.32s;
  pointer-events: none;
}

.nav-dropdown-menu.is-portaled-open {
  visibility: visible;
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
  transition:
    opacity 0.26s cubic-bezier(0.32, 0.72, 0, 1),
    transform 0.34s cubic-bezier(0.34, 1.2, 0.64, 1),
    visibility 0s linear 0s;
}

/* Invisible bridge between dropdown and parent button — prevents hover loss */
.nav-dropdown-menu::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 14px;
  background: transparent;
}

/* Hover trigger removed — replaced by JS portal logic (see initNavDropdownPortals) */

.nav-dropdown-item {
  display: block;
  width: 100%;
  padding: 11px 14px;
  background: transparent;
  border: none;
  border-radius: 10px;
  text-align: left;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: background 0.18s cubic-bezier(0.4, 0, 0.2, 1), color 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.nav-dropdown-item + .nav-dropdown-item {
  margin-top: 4px;
}

.nav-dropdown-item:hover {
  background: rgba(175,16,0,0.06);
  color: #af1000;
}

.nav-dropdown-item.active {
  background: rgba(175,16,0,0.10);
  color: #af1000;
  font-weight: 700;
}

.nav-dropdown-item.active:hover {
  background: rgba(175,16,0,0.14);
}

/* Main Content */
.console-content {
  padding: 0 50px;
  max-width: none;
  margin: 0;
}

/* Tab content acts as ONE big glass block wrapping header + content */
.tab-content {
  display: none;
  position: relative;
  padding: 36px 40px;
  margin-bottom: 24px;
  border-radius: 24px;
  background: linear-gradient(170deg, rgba(255,255,255,0.32) 0%, rgba(255,255,255,0.22) 100%);
  backdrop-filter: blur(30px) saturate(140%);
  -webkit-backdrop-filter: blur(30px) saturate(140%);
  border: 1.5px solid rgba(255,255,255,0.65);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.05),
    0 12px 40px rgba(0,0,0,0.10),
    0 4px 16px rgba(0,0,0,0.05),
    inset 0 1px 0 rgba(255,255,255,0.4);
}

.tab-content.active {
  display: block;
}

.content-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 28px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

/* === Premium Apple-style Page Header (Pipeline-Scanner-style card) === */
.content-header-premium {
  position: relative;
  padding: 28px 36px;
  background: linear-gradient(135deg, #ffffff 0%, #fdf7f3 100%);
  border: 1px solid rgba(175,16,0,0.18);
  border-radius: 20px;
  box-shadow:
    0 1px 2px rgba(15,23,42,0.04),
    0 16px 40px -12px rgba(175,16,0,0.22),
    0 4px 12px rgba(175,16,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.4);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 28px;
  overflow: hidden;
}

.content-header-premium::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #000000 0%, #af1000 50%, #d91507 100%);
}

.content-header-premium::after {
  content: '';
  position: absolute;
  top: -40%;
  right: -10%;
  width: 420px;
  height: 420px;
  border-radius: 50%;
  background: radial-gradient(circle at center, rgba(175,16,0,0.10) 0%, transparent 70%);
  pointer-events: none;
}

.content-header-left {
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
  position: relative;
  z-index: 1;
}

.content-header-right {
  position: relative;
  z-index: 1;
}

.content-header-eyebrow {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: #5a0a02;
  margin-bottom: -2px;
}

.content-header-premium h1 {
  margin: 0;
  font-size: 34px;
  font-weight: 800;
  letter-spacing: -1px;
  line-height: 1.05;
  color: #0f172a;
}

.page-title-accent {
  background: linear-gradient(90deg, #af1000 0%, #d91507 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.content-header-sub {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13.5px;
  font-weight: 500;
  color: #8E8E93;
  letter-spacing: -0.15px;
  line-height: 1.5;
  margin-top: 2px;
  max-width: 720px;
}

.content-header-right {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-shrink: 0;
  padding-top: 4px;
  position: relative;
  z-index: 1;
}

/* ============================================
   Premium Searchable Combobox (typeahead + max-10 visible)
   ============================================ */
.premium-combobox {
  position: relative;
  display: inline-block;
  min-width: 160px;
}

.premium-combobox-search {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.1px;
  color: #1C1C1E;
  padding: 9px 32px 9px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(248,248,252,0.75) 100%);
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.4);
  width: 100%;
  cursor: text;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.premium-combobox-search::placeholder {
  color: #8E8E93;
  font-weight: 500;
}

.premium-combobox-search:hover {
  border-color: rgba(175,16,0,0.25);
}

.premium-combobox-search:focus {
  outline: none;
  background: rgba(255,255,255,0.95);
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.10), inset 0 1px 0 rgba(255,255,255,0.4);
}

.premium-combobox-chevron {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #af1000;
  pointer-events: none;
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.premium-combobox.is-open .premium-combobox-chevron {
  transform: translateY(-50%) rotate(180deg);
}

.premium-combobox-list {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 1100;
  max-height: 360px; /* ~10 items at 36px */
  overflow-y: auto;
  background: linear-gradient(170deg, rgba(255,255,255,0.95) 0%, rgba(250,250,254,0.92) 100%);
  backdrop-filter: blur(40px) saturate(150%);
  -webkit-backdrop-filter: blur(40px) saturate(150%);
  border: 1.5px solid rgba(255,255,255,0.6);
  border-radius: 12px;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.06),
    0 14px 36px rgba(0,0,0,0.14),
    0 4px 14px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.4);
  padding: 5px;
}

.premium-combobox.is-open .premium-combobox-list {
  display: block;
  animation: comboboxIn 0.22s cubic-bezier(0.32, 0.72, 0, 1);
}

@keyframes comboboxIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.premium-combobox-option {
  padding: 9px 12px;
  border-radius: 8px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #1C1C1E;
  cursor: pointer;
  letter-spacing: -0.1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: background 0.12s cubic-bezier(0.4, 0, 0.2, 1);
}

.premium-combobox-option:hover,
.premium-combobox-option.is-highlighted {
  background: rgba(175,16,0,0.08);
  color: #af1000;
}

.premium-combobox-option.is-selected {
  background: rgba(175,16,0,0.12);
  color: #af1000;
}

.premium-combobox-empty {
  padding: 14px 12px;
  text-align: center;
  font-size: 12px;
  color: #C7C7CC;
  font-style: italic;
}

/* Scrollbar styling */
.premium-combobox-list::-webkit-scrollbar { width: 6px; }
.premium-combobox-list::-webkit-scrollbar-track { background: transparent; }
.premium-combobox-list::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.12); border-radius: 3px; }
.premium-combobox-list::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.22); }

/* ============================================
   Performance Callbacks Modal — Apple Premium
   ============================================ */
.perf-modal {
  max-width: 1280px !important;
  width: 92vw !important;
  height: 88vh !important;
  max-height: 88vh !important;
  background: linear-gradient(170deg, rgba(255,255,255,0.97) 0%, rgba(248,248,252,0.94) 100%) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

.perf-modal-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 22px 28px 18px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  flex-shrink: 0;
}

.perf-modal-header-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.perf-modal-eyebrow {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #1E40AF;
}

.perf-modal-title {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.7px;
  color: #1C1C1E;
}

/* KPI Banner — Black-Red premium gradient */
.perf-modal-kpi {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  padding: 22px 28px 24px;
  background: linear-gradient(135deg, #000000 0%, #0a0508 30%, #5a0a02 65%, #af1000 100%);
  position: relative;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.perf-modal-kpi::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 80% 50%, rgba(217,21,7,0.25) 0%, transparent 60%),
    radial-gradient(ellipse 40% 80% at 0% 50%, rgba(0,0,0,0.3) 0%, transparent 50%);
  pointer-events: none;
}

.perf-kpi-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  position: relative;
  z-index: 1;
}

.perf-kpi-tile:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0;
  top: 14%;
  bottom: 14%;
  width: 2px;
  border-radius: 2px;
  background: linear-gradient(180deg, transparent 0%, rgba(255,255,255,0.28) 50%, transparent 100%);
}

.perf-kpi-value {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -1.3px;
  color: #ffffff;
  line-height: 1;
  margin-bottom: 7px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
  font-variant-numeric: tabular-nums;
}

.perf-kpi-value-rate {
  color: #30D158;
  text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

.perf-kpi-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}

/* Filters bar */
.perf-modal-filters {
  display: flex;
  gap: 10px;
  padding: 18px 28px;
  flex-wrap: wrap;
  align-items: flex-end;
  background: rgba(255,255,255,0.7);
  border-bottom: 1px solid rgba(0,0,0,0.06);
  flex-shrink: 0;
}

.perf-filter-group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.perf-filter-group-search {
  flex: 1;
  min-width: 200px;
}

.perf-filter-group label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #8E8E93;
}

.perf-modal-filters .period-select-premium {
  min-width: 130px;
}

.perf-date-input,
.perf-search-input {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.1px;
  padding: 9px 14px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.75);
  color: #1C1C1E;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.perf-search-input {
  width: 100%;
}

.perf-date-input:focus,
.perf-search-input:focus {
  outline: none;
  background: rgba(255,255,255,0.98);
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.10);
}

/* Table */
.perf-modal-tablewrap {
  flex: 1;
  overflow: auto;
  padding: 0 28px 28px;
}

.perf-modal-table {
  width: 100%;
  border-collapse: collapse;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}

.perf-modal-table thead {
  position: sticky;
  top: 0;
  z-index: 2;
}

.perf-modal-table th {
  padding: 14px 14px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #8E8E93;
  text-align: left;
  background: linear-gradient(180deg, rgba(255,255,255,0.95) 0%, rgba(248,248,252,0.9) 100%);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(0,0,0,0.10);
  white-space: nowrap;
}

.perf-modal-table tbody tr {
  border-bottom: 1px solid rgba(0,0,0,0.05);
  transition: background 0.15s cubic-bezier(0.4, 0, 0.2, 1);
}

.perf-modal-table tbody tr:hover {
  background: rgba(175,16,0,0.03);
}

.perf-modal-table td {
  padding: 13px 14px;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  vertical-align: middle;
}

.perf-modal-table td.perf-cell-strong {
  font-weight: 700;
}

.perf-modal-table td.perf-cell-muted {
  color: #8E8E93;
}

.perf-modal-table td.perf-cell-truncate {
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Status pills inside table */
.perf-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 10px 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3px;
  border: 1px solid transparent;
  white-space: nowrap;
}

.perf-status-pill::before {
  content: '';
  width: 6px;
  height: 6px;
  border-radius: 50%;
}

.perf-status-pill-completed { background: rgba(46,125,50,0.10); color: #1e5e22; border-color: rgba(46,125,50,0.20); }
.perf-status-pill-completed::before { background: #2e7d32; }

.perf-status-pill-open { background: rgba(234,179,8,0.12); color: #b67800; border-color: rgba(234,179,8,0.22); }
.perf-status-pill-open::before { background: #d49600; }

.perf-outcome-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3px;
  border: 1px solid transparent;
  white-space: nowrap;
}

.perf-outcome-meeting { background: rgba(46,125,50,0.10); color: #1e5e22; border-color: rgba(46,125,50,0.20); }
.perf-outcome-follow_up { background: rgba(234,179,8,0.14); color: #b67800; border-color: rgba(234,179,8,0.24); }
.perf-outcome-no_interest { background: rgba(175,16,0,0.10); color: #af1000; border-color: rgba(175,16,0,0.20); }
.perf-outcome-empty { color: #C7C7CC; font-weight: 500; }

.perf-empty-row td {
  padding: 60px 24px !important;
  text-align: center;
  color: #C7C7CC;
  font-size: 13px;
  font-weight: 500;
}

/* ============================================
   Perf Modal — Dark Mode (Apple Premium Glass)
   ============================================ */
body.dark-mode .perf-modal {
  background: linear-gradient(170deg, rgba(44,44,46,0.65) 0%, rgba(31,31,34,0.55) 100%) !important;
  backdrop-filter: blur(40px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(170%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,0.55) !important;
}

body.dark-mode .perf-modal-header {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

body.dark-mode .perf-modal-eyebrow {
  color: #60AFFF !important;
}

body.dark-mode .perf-modal-title {
  color: #E5E5EA !important;
}

/* KPI Banner: keep the original black→red premium gradient in dark mode
   (intentionally NO override — the light-mode gradient applies as-is) */

/* Filters bar */
body.dark-mode .perf-modal-filters {
  background: rgba(28,28,30,0.55) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

body.dark-mode .perf-filter-group label {
  color: #AEAEB2 !important;
}

body.dark-mode .perf-date-input,
body.dark-mode .perf-search-input {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
}

/* Switch the native date picker popup to the dark OS variant
   and recolor the calendar indicator icon red */
body.dark-mode .perf-date-input {
  color-scheme: dark;
}

body.dark-mode .perf-date-input::-webkit-calendar-picker-indicator {
  /* invert(35%) sepia(95%) saturate(7000%) hue-rotate(0deg) → red ~#ff3c1c */
  filter: invert(38%) sepia(96%) saturate(6500%) hue-rotate(355deg) brightness(105%) contrast(105%);
  cursor: pointer;
  opacity: 0.95;
}

body.dark-mode .perf-date-input::-webkit-calendar-picker-indicator:hover {
  opacity: 1;
}

body.dark-mode .perf-date-input:focus,
body.dark-mode .perf-search-input:focus {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
}

body.dark-mode .perf-search-input::placeholder,
body.dark-mode .perf-date-input::placeholder {
  color: #8E8E93 !important;
}

/* Mitglied combobox (premium-combobox) in dark mode */
body.dark-mode .perf-modal-filters .premium-combobox-search {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #E5E5EA !important;
  box-shadow: none !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-search::placeholder {
  color: #8E8E93 !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-search:hover {
  border-color: rgba(255,60,28,0.35) !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-search:focus {
  background: rgba(255,255,255,0.10) !important;
  border-color: rgba(255,60,28,0.45) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.15) !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-chevron {
  color: #ff3c1c !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-list {
  background: linear-gradient(170deg, rgba(44,44,46,0.92) 0%, rgba(31,31,34,0.88) 100%) !important;
  backdrop-filter: blur(40px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(170%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.4),
    0 14px 36px rgba(0,0,0,0.55),
    0 4px 14px rgba(0,0,0,0.35) !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-option {
  color: #E5E5EA !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-option:hover,
body.dark-mode .perf-modal-filters .premium-combobox-option.is-highlighted {
  background: rgba(255,60,28,0.15) !important;
  color: #ff7a63 !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-option.is-selected {
  background: rgba(255,60,28,0.22) !important;
  color: #ff8a73 !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-empty {
  color: #6E6E73 !important;
}

body.dark-mode .perf-modal-filters .premium-combobox-list::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.15) !important;
}
body.dark-mode .perf-modal-filters .premium-combobox-list::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,0.25) !important;
}

/* Table area */
body.dark-mode .perf-modal-tablewrap {
  background: transparent !important;
}

body.dark-mode .perf-modal-table th {
  background: linear-gradient(180deg, rgba(28,28,30,0.92) 0%, rgba(22,22,25,0.88) 100%) !important;
  color: #AEAEB2 !important;
  border-bottom: 1px solid rgba(255,255,255,0.10) !important;
}

body.dark-mode .perf-modal-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

body.dark-mode .perf-modal-table tbody tr:hover {
  background: rgba(255,60,28,0.07) !important;
}

body.dark-mode .perf-modal-table td {
  color: #E5E5EA !important;
}

body.dark-mode .perf-modal-table td.perf-cell-muted {
  color: #8E8E93 !important;
}

/* Status / Outcome pills — re-tint for dark backgrounds */
body.dark-mode .perf-status-pill-completed {
  background: rgba(48,209,88,0.14) !important;
  color: #6EE7A2 !important;
  border-color: rgba(48,209,88,0.28) !important;
}
body.dark-mode .perf-status-pill-completed::before { background: #30D158 !important; }

body.dark-mode .perf-status-pill-open {
  background: rgba(255,214,10,0.14) !important;
  color: #F5D77A !important;
  border-color: rgba(255,214,10,0.28) !important;
}
body.dark-mode .perf-status-pill-open::before { background: #FFD60A !important; }

body.dark-mode .perf-outcome-meeting {
  background: rgba(48,209,88,0.14) !important;
  color: #6EE7A2 !important;
  border-color: rgba(48,209,88,0.28) !important;
}
body.dark-mode .perf-outcome-follow_up {
  background: rgba(255,214,10,0.14) !important;
  color: #F5D77A !important;
  border-color: rgba(255,214,10,0.28) !important;
}
body.dark-mode .perf-outcome-no_interest {
  background: rgba(255,69,58,0.14) !important;
  color: #FF8073 !important;
  border-color: rgba(255,69,58,0.28) !important;
}
body.dark-mode .perf-outcome-empty {
  color: #6E6E73 !important;
}

body.dark-mode .perf-empty-row td {
  color: #6E6E73 !important;
}

/* ============================================
   Section Info Button — premium "i" tooltip
   ============================================ */
.section-info-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(0,0,0,0.05);
  color: #8E8E93;
  cursor: help;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  vertical-align: middle;
  outline: none;
}

.section-info-btn:hover,
.section-info-btn:focus {
  background: rgba(175,16,0,0.10);
  color: #af1000;
  transform: scale(1.08);
}

.section-info-btn::before,
.section-info-btn::after {
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.22s cubic-bezier(0.4, 0, 0.2, 1), transform 0.22s cubic-bezier(0.34, 1.2, 0.64, 1);
  z-index: 2000;
}

/* Tooltip body */
.section-info-btn::before {
  content: attr(data-tooltip);
  position: absolute;
  bottom: calc(100% + 10px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  padding: 10px 14px;
  background: linear-gradient(170deg, rgba(28,28,30,0.96) 0%, rgba(40,40,45,0.92) 100%);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.92);
  border-radius: 10px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: -0.1px;
  line-height: 1.5;
  width: 280px;
  white-space: normal;
  word-wrap: break-word;
  text-align: center;
  box-shadow: 0 8px 24px rgba(0,0,0,0.22), inset 0 1px 0 rgba(255,255,255,0.1);
}

/* Tooltip arrow */
.section-info-btn::after {
  content: '';
  position: absolute;
  bottom: calc(100% + 4px);
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 6px solid rgba(28,28,30,0.96);
}

.section-info-btn:hover::before,
.section-info-btn:hover::after,
.section-info-btn:focus::before,
.section-info-btn:focus::after {
  opacity: 1;
}

.section-info-btn:hover::before,
.section-info-btn:focus::before {
  transform: translateX(-50%) translateY(0);
}

/* ============================================
   Performance Cards (Vergangenheit / Zukunft) — Apple Premium
   ============================================ */
.perf-card {
  padding: 24px 26px 28px;
  border-radius: 20px;
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(248,248,252,0.7) 100%);
  backdrop-filter: blur(30px) saturate(150%);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  border: 1.5px solid rgba(255,255,255,0.65);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.05),
    0 8px 28px rgba(0,0,0,0.06),
    0 2px 8px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.4);
  position: relative;
}

.perf-card::before {
  content: '';
  position: absolute;
  top: -2px;
  left: 12px;
  right: 12px;
  height: 3px;
  border-radius: 3px;
}

.perf-card-past::before {
  background: linear-gradient(90deg, transparent 0%, rgba(30,64,175,0.45) 30%, rgba(29,78,216,0.55) 50%, rgba(30,64,175,0.45) 70%, transparent 100%);
}

.perf-card-future::before {
  background: linear-gradient(90deg, transparent 0%, rgba(10,132,255,0.45) 30%, rgba(52,120,246,0.55) 50%, rgba(10,132,255,0.45) 70%, transparent 100%);
}

.perf-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 16px;
  gap: 16px;
}

.perf-card-title-wrap {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.perf-card-eyebrow {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-transform: uppercase;
}

.perf-card-eyebrow-past { color: #1E40AF; }
.perf-card-eyebrow-future { color: #0A84FF; }

.perf-card-title {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.5px;
  color: #1C1C1E;
}

.perf-circle-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px 0 8px;
  cursor: pointer;
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
}

.perf-circle-wrap:hover {
  transform: scale(1.03);
}

.perf-circle {
  position: relative;
  width: 200px;
  height: 200px;
  filter: drop-shadow(0 6px 18px rgba(0,0,0,0.06));
}

.perf-circle-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  pointer-events: none;
}

.perf-circle-count {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 48px;
  font-weight: 800;
  letter-spacing: -2px;
  color: #1C1C1E;
  line-height: 1;
  margin-bottom: 4px;
  font-variant-numeric: tabular-nums;
}

.perf-circle-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: #8E8E93;
}

/* Period range picker — right-anchored variant for Performance cards */
.period-range-picker-right {
  left: auto !important;
  right: 0;
}

/* === AE Analytics: Pipeline Summary + Health Cards === */
.ae-pipeline-summary {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 22px;
}

.ae-summary-tile {
  padding: 20px 24px;
  border-radius: 16px;
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(248,248,252,0.7) 100%);
  border: 1.5px solid rgba(255,255,255,0.65);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.05),
    0 4px 16px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.4);
  text-align: center;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  transition: transform 0.32s cubic-bezier(0.34, 1.2, 0.64, 1), box-shadow 0.32s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.32s ease;
  cursor: default;
}

.ae-summary-tile:hover {
  transform: translateY(-3px);
  border-color: rgba(255,255,255,0.95);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.06),
    0 12px 28px rgba(0,0,0,0.08),
    0 4px 10px rgba(0,0,0,0.05),
    inset 0 1px 0 rgba(255,255,255,1);
}

.ae-summary-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: #8E8E93;
  margin-bottom: 8px;
}

.ae-summary-value {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -1px;
  color: #1C1C1E;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.ae-health-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.ae-health-card {
  cursor: pointer;
}

.ae-health-card .perf-circle {
  width: 220px;
  height: 220px;
}

.ae-health-card .perf-circle canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
}

.ae-health-card-red::before {
  background: linear-gradient(90deg, transparent 0%, rgba(175,16,0,0.45) 30%, rgba(217,21,7,0.55) 50%, rgba(175,16,0,0.45) 70%, transparent 100%);
}

.ae-health-card-yellow::before {
  background: linear-gradient(90deg, transparent 0%, rgba(199,119,0,0.45) 30%, rgba(234,179,8,0.55) 50%, rgba(199,119,0,0.45) 70%, transparent 100%);
}

.ae-health-card-green::before {
  background: linear-gradient(90deg, transparent 0%, rgba(30,125,34,0.45) 30%, rgba(46,160,52,0.55) 50%, rgba(30,125,34,0.45) 70%, transparent 100%);
}

.ae-health-eyebrow-red { color: #af1000; }
.ae-health-eyebrow-yellow { color: #c77700; }
.ae-health-eyebrow-green { color: #1e7d22; }

.ae-health-amount {
  text-align: center;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.3px;
  font-variant-numeric: tabular-nums;
  margin-top: 4px;
}

/* === Prognose metric tiles (Verlust / Gewinn / Potenzial) === */
.prog-metric-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 16px;
}

.prog-metric-tile {
  position: relative;
  padding: 18px 18px 16px;
  border-radius: 16px;
  text-align: center;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-variant-numeric: tabular-nums;
  overflow: hidden;
  transition: transform 0.32s cubic-bezier(0.34, 1.2, 0.64, 1), box-shadow 0.32s cubic-bezier(0.4, 0, 0.2, 1);
}

.prog-metric-tile:hover {
  transform: translateY(-3px);
}

.prog-metric-tile-loss:hover {
  box-shadow: 0 12px 28px rgba(175,30,30,0.34), 0 4px 10px rgba(175,30,30,0.18), inset 0 1px 0 rgba(255,255,255,0.25);
}

.prog-metric-tile-gain:hover {
  box-shadow: 0 12px 28px rgba(46,125,50,0.34), 0 4px 10px rgba(46,125,50,0.18), inset 0 1px 0 rgba(255,255,255,0.25);
}

.prog-metric-tile-potential:hover {
  box-shadow: 0 14px 32px rgba(10,132,255,0.36), 0 5px 12px rgba(10,132,255,0.20), inset 0 1px 0 rgba(255,255,255,0.25);
}

.prog-metric-tile::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.16) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,0.10) 100%);
  pointer-events: none;
  border-radius: inherit;
}

.prog-metric-tile > * {
  position: relative;
  z-index: 1;
}

.prog-metric-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.75);
  margin-bottom: 8px;
}

.prog-metric-value {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.8px;
  color: #fff;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0,0,0,0.18);
}

.prog-metric-meta {
  font-size: 11px;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  margin-top: 8px;
  letter-spacing: 0.2px;
}

.prog-metric-tile-loss {
  background: linear-gradient(135deg, #d83a3a 0%, #af1e1e 100%);
  border: 1px solid rgba(175,30,30,0.4);
  box-shadow: 0 4px 14px rgba(175,30,30,0.22), inset 0 1px 0 rgba(255,255,255,0.18);
}

.prog-metric-tile-gain {
  background: linear-gradient(135deg, #43a047 0%, #2e7d32 100%);
  border: 1px solid rgba(46,125,50,0.4);
  box-shadow: 0 4px 14px rgba(46,125,50,0.22), inset 0 1px 0 rgba(255,255,255,0.18);
}

.prog-metric-tile-potential {
  background: linear-gradient(135deg, #0A84FF 0%, #0050d6 100%);
  border: 1px solid rgba(10,132,255,0.4);
  box-shadow: 0 4px 14px rgba(10,132,255,0.25), inset 0 1px 0 rgba(255,255,255,0.18);
  margin-bottom: 14px;
}

.prog-metric-tile-large {
  padding: 24px 22px 22px;
}

.prog-metric-tile-large .prog-metric-value {
  font-size: 38px;
  letter-spacing: -1.2px;
}

/* === Netto Ergebnis card === */
.prog-net-card {
  padding: 18px 22px;
  border-radius: 14px;
  text-align: center;
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(248,248,252,0.75) 100%);
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  border: 1.5px solid rgba(255,255,255,0.7);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.05), 0 2px 8px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.4);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-variant-numeric: tabular-nums;
  transition: transform 0.32s cubic-bezier(0.34, 1.2, 0.64, 1), box-shadow 0.32s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.32s ease;
}

.prog-net-card:hover {
  transform: translateY(-3px);
  border-color: rgba(255,255,255,0.95);
  box-shadow: 0 0 0 1px rgba(0,0,0,0.06), 0 12px 28px rgba(0,0,0,0.08), 0 4px 10px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,1);
}

.prog-net-label {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: #8E8E93;
  margin-bottom: 7px;
}

.prog-net-value {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -1.1px;
  color: #1C1C1E;
  line-height: 1;
}

.prog-net-value.is-positive { color: #1e7d22; }
.prog-net-value.is-negative { color: #af1000; }

/* === Info card (Prognose) === */
.prog-info-card {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 16px;
  border-radius: 12px;
  background: rgba(10,132,255,0.08);
  border: 1px solid rgba(10,132,255,0.18);
  color: #1C1C1E;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: -0.1px;
  line-height: 1.5;
}

.prog-info-card svg {
  color: #0A84FF;
  flex-shrink: 0;
}

.prog-info-card strong {
  font-weight: 700;
  color: #1C1C1E;
}

/* ============================================
   Prognose Section — Dark Mode (Apple Glass)
   ============================================ */

/* Verlust / Gewinn / Potenzial tiles: deeper, less white-bleed for dark */
body.dark-mode .prog-metric-tile-loss {
  background: linear-gradient(135deg, #c2302f 0%, #8a1313 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 6px 18px rgba(175,30,30,0.30), inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

body.dark-mode .prog-metric-tile-gain {
  background: linear-gradient(135deg, #3a8d3e 0%, #1f5e23 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 6px 18px rgba(46,125,50,0.30), inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

body.dark-mode .prog-metric-tile-potential {
  background: linear-gradient(135deg, #0A84FF 0%, #003db0 100%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 6px 18px rgba(10,132,255,0.32), inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

body.dark-mode .prog-metric-tile::before {
  background: linear-gradient(180deg, rgba(255,255,255,0.08) 0%, rgba(255,255,255,0) 50%, rgba(0,0,0,0.20) 100%) !important;
}

body.dark-mode .prog-metric-label {
  color: rgba(255,255,255,0.80) !important;
}

body.dark-mode .prog-metric-value {
  color: #FFFFFF !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important;
}

body.dark-mode .prog-metric-meta {
  color: rgba(255,255,255,0.75) !important;
}

/* Netto Ergebnis card — Apple Dark Glass */
body.dark-mode .prog-net-card {
  background: linear-gradient(170deg, rgba(44,44,46,0.55) 0%, rgba(31,31,34,0.45) 100%) !important;
  backdrop-filter: blur(30px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(160%) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.3), 0 4px 14px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.06) !important;
}

body.dark-mode .prog-net-card:hover {
  border-color: rgba(255,255,255,0.18) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.35), 0 12px 28px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.10) !important;
}

body.dark-mode .prog-net-label {
  color: #AEAEB2 !important;
}

body.dark-mode .prog-net-value {
  color: #E5E5EA !important;
}

body.dark-mode .prog-net-value.is-positive { color: #30D158 !important; }
body.dark-mode .prog-net-value.is-negative { color: #FF6B5A !important; }

/* Info card "Prognostizierter Umsatz basierend auf allen geplanten Callbacks" */
body.dark-mode .prog-info-card {
  background: rgba(10,132,255,0.15) !important;
  border: 1px solid rgba(10,132,255,0.35) !important;
  color: #E5E5EA !important;
}

body.dark-mode .prog-info-card svg {
  color: #60AFFF !important;
}

body.dark-mode .prog-info-card strong {
  color: #FFFFFF !important;
}

/* ============================================
   Premium Apple-style Period Selector
   ============================================ */
.period-select-wrap {
  display: inline-block;
}

.period-select-premium {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.1px;
  color: #1C1C1E;
  padding: 9px 36px 9px 14px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(248,248,252,0.75) 100%);
  background-image:
    url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23af1000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"),
    linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(248,248,252,0.75) 100%);
  background-repeat: no-repeat;
  background-position: right 12px center, 0 0;
  background-size: 12px 12px, auto;
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  box-shadow: 0 1px 3px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.4);
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  min-width: 170px;
}

.period-select-premium:hover {
  background: linear-gradient(170deg, rgba(255,255,255,1) 0%, rgba(250,250,254,0.95) 100%);
  background-image:
    url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23af1000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"),
    linear-gradient(170deg, rgba(255,255,255,1) 0%, rgba(250,250,254,0.95) 100%);
  background-repeat: no-repeat;
  background-position: right 12px center, 0 0;
  border-color: rgba(175,16,0,0.25);
  box-shadow: 0 4px 14px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,1);
  transform: translateY(-1px);
}

.period-select-premium:focus {
  outline: none;
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.12), inset 0 1px 0 rgba(255,255,255,0.4);
}

/* Custom date range picker */
.period-range-picker {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 280px;
  padding: 18px;
  border-radius: 16px;
  background: linear-gradient(170deg, rgba(255,255,255,0.92) 0%, rgba(248,248,252,0.86) 100%);
  backdrop-filter: blur(40px) saturate(150%);
  -webkit-backdrop-filter: blur(40px) saturate(150%);
  border: 1.5px solid rgba(255,255,255,0.6);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.06),
    0 12px 40px rgba(0,0,0,0.14),
    0 4px 14px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.4);
  z-index: 1000;
}

.period-range-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.2px;
  color: #1C1C1E;
  margin-bottom: 14px;
}

.period-range-fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.period-range-field label {
  display: block;
  margin-bottom: 6px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #8E8E93;
}

.period-range-input {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid rgba(0,0,0,0.10);
  border-radius: 10px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: -0.1px;
  color: #1C1C1E;
  background: rgba(255,255,255,0.75);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.period-range-input:focus {
  outline: none;
  background: rgba(255,255,255,0.98);
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.10);
}

.period-range-actions {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}

.period-range-btn {
  flex: 1;
  padding: 10px 16px;
  border-radius: 10px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: -0.1px;
  cursor: pointer;
  border: 1px solid transparent;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.period-range-btn-primary {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: #fff;
  border-color: rgba(175,16,0,0.5);
  box-shadow: 0 3px 10px rgba(175,16,0,0.25), inset 0 1px 0 rgba(255,255,255,0.2);
}

.period-range-btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(175,16,0,0.32), inset 0 1px 0 rgba(255,255,255,0.25);
}

.period-range-btn-secondary {
  background: rgba(255,255,255,0.7);
  color: #1C1C1E;
  border-color: rgba(0,0,0,0.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.4);
}

.period-range-btn-secondary:hover {
  background: rgba(255,255,255,0.95);
  border-color: rgba(0,0,0,0.15);
}

/* ============================================
   Member Performance Modal — Apple Premium
   ============================================ */
.mp-modal {
  background: linear-gradient(170deg, rgba(255,255,255,0.95) 0%, rgba(248,248,252,0.9) 100%) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  height: 85vh !important;
  max-height: 85vh !important;
  display: flex !important;
  flex-direction: column !important;
}

.mp-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 28px 20px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.mp-header-left {
  display: flex;
  align-items: center;
  gap: 14px;
}

.mp-avatar {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.5px;
  box-shadow: 0 4px 12px rgba(175,16,0,0.28), inset 0 1px 0 rgba(255,255,255,0.25);
}

.mp-eyebrow {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: #af1000;
  margin-bottom: 2px;
}

.mp-title {
  margin: 0;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.6px;
  color: #1C1C1E;
}

.mp-close-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.06);
  color: #8E8E93;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.mp-close-btn:hover {
  background: rgba(175,16,0,0.08);
  border-color: rgba(175,16,0,0.18);
  color: #af1000;
  transform: rotate(90deg);
}

/* Stats Banner — Black-Red Premium Gradient */
.mp-stats {
  display: flex;
  align-items: stretch;
  gap: 0;
  padding: 22px 24px 24px;
  background: linear-gradient(135deg, #000000 0%, #0a0508 30%, #5a0a02 65%, #af1000 100%);
  position: relative;
  flex-shrink: 0;
}

.mp-stats::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 80% 50%, rgba(217,21,7,0.25) 0%, transparent 60%),
    radial-gradient(ellipse 40% 80% at 0% 50%, rgba(0,0,0,0.3) 0%, transparent 50%);
  pointer-events: none;
}

.mp-stat-tile {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6px 14px;
  position: relative;
  z-index: 1;
}

.mp-stat-tile:not(:last-child)::after {
  content: '';
  position: absolute;
  right: 0;
  top: 14%;
  bottom: 14%;
  width: 2px;
  border-radius: 2px;
  background: linear-gradient(180deg, transparent 0%, rgba(255,255,255,0.28) 50%, transparent 100%);
}

.mp-stat-value {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -1.3px;
  color: #ffffff;
  line-height: 1;
  margin-bottom: 7px;
  text-shadow: 0 1px 2px rgba(0,0,0,0.3);
}

.mp-stat-value-pct {
  color: #30D158;
  text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

.mp-stat-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.3px;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}

/* Two columns layout — fills remaining modal space */
.mp-grid {
  display: grid;
  grid-template-columns: 1fr 1px 1fr;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

.mp-column {
  padding: 22px 24px;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.mp-column-header {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}

.mp-column-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  color: #fff;
  flex-shrink: 0;
}

.mp-column-icon-completed {
  background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
  box-shadow: 0 2px 6px rgba(46,125,50,0.32);
}

.mp-column-icon-open {
  background: linear-gradient(135deg, #c77700 0%, #ef6c00 100%);
  box-shadow: 0 2px 6px rgba(199,119,0,0.32);
}

.mp-column-icon-failed {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  box-shadow: 0 2px 6px rgba(175,16,0,0.32);
}

.mp-column-title {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -0.25px;
  color: #1C1C1E;
  flex: 1;
}

.mp-column-count {
  font-size: 12px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  font-variant-numeric: tabular-nums;
  border: 1px solid transparent;
}

.mp-column-completed .mp-column-count {
  color: #1e5e22;
  background: rgba(46,125,50,0.14);
  border-color: rgba(46,125,50,0.22);
}

.mp-column-open .mp-column-count {
  color: #c77700;
  background: rgba(234,179,8,0.16);
  border-color: rgba(234,179,8,0.26);
}

.mp-column-failed .mp-column-count {
  color: #af1000;
  background: rgba(175,16,0,0.12);
  border-color: rgba(175,16,0,0.22);
}

/* Red toggle in "Nicht stattgefunden" column */
.mp-column-failed .mp-item-toggle {
  background: rgba(175,16,0,0.10);
  border: 1px solid rgba(175,16,0,0.22);
  color: #af1000;
}

.mp-column-failed .mp-item-toggle:hover {
  background: rgba(175,16,0,0.18);
  border-color: rgba(175,16,0,0.34);
}

.mp-column-failed .mp-item-toggle.expanded {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: #fff;
  border-color: rgba(175,16,0,0.5);
  box-shadow: 0 2px 6px rgba(175,16,0,0.3);
}

.mp-divider-v {
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.10) 12%, rgba(0,0,0,0.10) 88%, transparent 100%);
}

.mp-list {
  flex: 1;
  overflow-y: auto;
  margin: 0 -8px;
  padding: 0 8px;
  min-height: 0;
}

/* Apple-style callback item */
.mp-item {
  padding: 12px 14px;
  margin-bottom: 6px;
  border-radius: 12px;
  background: rgba(255,255,255,0.6);
  border: 1px solid rgba(0,0,0,0.05);
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.mp-item:hover {
  background: rgba(255,255,255,0.95);
  border-color: rgba(0,0,0,0.1);
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.mp-item-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.mp-item-main {
  flex: 1;
  min-width: 0;
}

.mp-item-company {
  font-size: 14px;
  font-weight: 700;
  color: #1C1C1E;
  letter-spacing: -0.2px;
  margin-bottom: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mp-item-meta {
  font-size: 11.5px;
  color: #8E8E93;
  font-weight: 500;
  letter-spacing: -0.1px;
}

.mp-item-meta-dot {
  display: inline-block;
  margin: 0 5px;
  opacity: 0.5;
}

.mp-item-toggle {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  flex-shrink: 0;
}

.mp-item-toggle svg {
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mp-item-toggle.expanded svg {
  transform: rotate(180deg);
}

/* Green toggle in Erledigt column */
.mp-column-completed .mp-item-toggle {
  background: rgba(46,125,50,0.12);
  border: 1px solid rgba(46,125,50,0.24);
  color: #1e5e22;
}

.mp-column-completed .mp-item-toggle:hover {
  background: rgba(46,125,50,0.20);
  border-color: rgba(46,125,50,0.35);
}

.mp-column-completed .mp-item-toggle.expanded {
  background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%);
  color: #fff;
  border-color: rgba(46,125,50,0.5);
  box-shadow: 0 2px 6px rgba(46,125,50,0.3);
}

/* Orange toggle in Offen column */
.mp-column-open .mp-item-toggle {
  background: rgba(234,179,8,0.14);
  border: 1px solid rgba(234,179,8,0.26);
  color: #c77700;
}

.mp-column-open .mp-item-toggle:hover {
  background: rgba(234,179,8,0.22);
  border-color: rgba(234,179,8,0.4);
}

.mp-column-open .mp-item-toggle.expanded {
  background: linear-gradient(135deg, #c77700 0%, #ef6c00 100%);
  color: #fff;
  border-color: rgba(199,119,0,0.5);
  box-shadow: 0 2px 6px rgba(199,119,0,0.3);
}

.mp-item-details {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(0,0,0,0.06);
  display: none;
}

.mp-item-details.expanded {
  display: block;
  animation: mpItemExpand 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes mpItemExpand {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.mp-detail-row {
  font-size: 12px;
  color: #5e5e63;
  line-height: 1.55;
  padding: 4px 0;
}

.mp-detail-row strong {
  color: #1C1C1E;
  font-weight: 600;
  margin-right: 6px;
}

.mp-outcome {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 4px 10px;
  border-radius: 8px;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.3px;
}

.mp-outcome-meeting { background: rgba(46,125,50,0.10); color: #1e5e22; border: 1px solid rgba(46,125,50,0.18); }
.mp-outcome-follow_up { background: rgba(234,179,8,0.12); color: #c77700; border: 1px solid rgba(234,179,8,0.22); }
.mp-outcome-no_interest { background: rgba(175,16,0,0.10); color: #af1000; border: 1px solid rgba(175,16,0,0.20); }

.mp-empty {
  text-align: center;
  padding: 40px 20px;
  color: #C7C7CC;
  font-size: 13px;
  font-weight: 500;
}

/* ============================================
   AE Member-Performance Modal — Dark Mode
   (Black-Red stats banner stays identical to light mode — like perf-modal-kpi)
   ============================================ */
body.dark-mode .mp-modal {
  background: linear-gradient(170deg, rgba(44,44,46,0.65) 0%, rgba(31,31,34,0.55) 100%) !important;
  backdrop-filter: blur(40px) saturate(170%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(170%) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,0.55) !important;
}

body.dark-mode .mp-header {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

body.dark-mode .mp-eyebrow {
  color: #ff7a63 !important;
}

body.dark-mode .mp-title {
  color: #E5E5EA !important;
}

body.dark-mode .mp-close-btn {
  background: rgba(255,255,255,0.06) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  color: #AEAEB2 !important;
}
body.dark-mode .mp-close-btn:hover {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.35) !important;
  color: #ff7a63 !important;
}

/* mp-stats keeps original black→red gradient — intentionally NO override */

body.dark-mode .mp-column-header {
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}

body.dark-mode .mp-column-title {
  color: #E5E5EA !important;
}

body.dark-mode .mp-divider-v {
  background: linear-gradient(180deg, transparent 0%, rgba(255,255,255,0.10) 12%, rgba(255,255,255,0.10) 88%, transparent 100%) !important;
}

/* Item cards */
body.dark-mode .mp-item {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}
body.dark-mode .mp-item:hover {
  background: rgba(255,255,255,0.07) !important;
  border-color: rgba(255,255,255,0.14) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3) !important;
}

body.dark-mode .mp-item-company { color: #E5E5EA !important; }
body.dark-mode .mp-item-meta { color: #8E8E93 !important; }
body.dark-mode .mp-detail-row { color: #AEAEB2 !important; }
body.dark-mode .mp-detail-row strong { color: #E5E5EA !important; }
body.dark-mode .mp-item-details { border-top: 1px solid rgba(255,255,255,0.08) !important; }

/* Column count pills — re-tint for dark backgrounds */
body.dark-mode .mp-column-completed .mp-column-count {
  background: rgba(48,209,88,0.16) !important;
  color: #6EE7A2 !important;
  border-color: rgba(48,209,88,0.30) !important;
}
body.dark-mode .mp-column-open .mp-column-count {
  background: rgba(255,214,10,0.16) !important;
  color: #F5D77A !important;
  border-color: rgba(255,214,10,0.30) !important;
}
body.dark-mode .mp-column-failed .mp-column-count {
  background: rgba(255,69,58,0.18) !important;
  color: #FF8073 !important;
  border-color: rgba(255,69,58,0.32) !important;
}

/* Outcome pills */
body.dark-mode .mp-outcome-meeting {
  background: rgba(48,209,88,0.14) !important;
  color: #6EE7A2 !important;
  border-color: rgba(48,209,88,0.28) !important;
}
body.dark-mode .mp-outcome-follow_up {
  background: rgba(255,214,10,0.14) !important;
  color: #F5D77A !important;
  border-color: rgba(255,214,10,0.28) !important;
}
body.dark-mode .mp-outcome-no_interest {
  background: rgba(255,69,58,0.14) !important;
  color: #FF8073 !important;
  border-color: rgba(255,69,58,0.28) !important;
}

body.dark-mode .mp-empty { color: #6E6E73 !important; }

/* Inline-styled inner panels (rendered by JS in renderMeetingItem):
   - Dynamic colored info boxes (#f0faf0 / #fef0f0 / #f0f4ff) — re-tint backgrounds for dark
   - Bordered list separators (border-bottom: 1px solid #e0e0e0) — already covered by generic rule
   - Detail-button "Details" with #f5f5f5 background — already covered by generic rule */
body.dark-mode .mp-list [style*="background: #f0faf0"],
body.dark-mode .mp-list [style*="background:#f0faf0"] {
  background: rgba(48,209,88,0.10) !important;
}
body.dark-mode .mp-list [style*="background: #fef0f0"],
body.dark-mode .mp-list [style*="background:#fef0f0"] {
  background: rgba(255,69,58,0.10) !important;
}
body.dark-mode .mp-list [style*="background: #f0f4ff"],
body.dark-mode .mp-list [style*="background:#f0f4ff"] {
  background: rgba(10,132,255,0.10) !important;
}
body.dark-mode .mp-list [style*="background: #fff3e0"],
body.dark-mode .mp-list [style*="background:#fff3e0"] {
  background: rgba(255,159,10,0.12) !important;
}
body.dark-mode .mp-list [style*="background: #e8f5e9"],
body.dark-mode .mp-list [style*="background:#e8f5e9"] {
  background: rgba(48,209,88,0.14) !important;
}
body.dark-mode .mp-list [style*="background: #e3f2fd"],
body.dark-mode .mp-list [style*="background:#e3f2fd"] {
  background: rgba(10,132,255,0.14) !important;
}
body.dark-mode .mp-list [style*="background: #ffebee"],
body.dark-mode .mp-list [style*="background:#ffebee"] {
  background: rgba(255,69,58,0.14) !important;
}

/* Inline #555 / #333 text on dark = unreadable → lift to dark-mode tints */
body.dark-mode .mp-list [style*="color: #555"],
body.dark-mode .mp-list [style*="color:#555"] {
  color: #C7C7CC !important;
}
body.dark-mode .mp-list [style*="color: #333"],
body.dark-mode .mp-list [style*="color:#333"] {
  color: #E5E5EA !important;
}
body.dark-mode .mp-list [style*="color: #1a1a1a"],
body.dark-mode .mp-list [style*="color:#1a1a1a"] {
  color: #E5E5EA !important;
}

body.dark-mode .mp-list [style*="border-bottom: 1px solid #e0e0e0"],
body.dark-mode .mp-list [style*="border-bottom:1px solid #e0e0e0"],
body.dark-mode .mp-list [style*="border-bottom: 1px solid rgb(224, 224, 224)"],
body.dark-mode .mp-list [style*="border-top: 1px solid #e8e8e8"],
body.dark-mode .mp-list [style*="border-top:1px solid #e8e8e8"],
body.dark-mode .mp-list [style*="border-top: 1px solid rgb(232, 232, 232)"] {
  border-color: rgba(255,255,255,0.08) !important;
}

/* AE Details-Section (was beim Details-Klick aufklappt) — transparent + dezenter
   Trennstrich oben. Spiegelt das Health-Deal-Modal Verhalten. */
body.dark-mode .mp-list > div > div[id^="ae-"][style*="padding-top: 14px"] {
  background: transparent !important;
  border-top: 1px solid rgba(255,255,255,0.10) !important;
}

/* Colored inline headings inside expanded detail boxes — lift to brighter shades
   so they're readable on translucent dark tints (e.g. "Kein Next Step" rot auf rot) */
body.dark-mode .mp-list [style*="color: #af1000"],
body.dark-mode .mp-list [style*="color:#af1000"] {
  color: #FF8073 !important;
}
body.dark-mode .mp-list [style*="color: #2e7d32"],
body.dark-mode .mp-list [style*="color:#2e7d32"] {
  color: #6EE7A2 !important;
}
body.dark-mode .mp-list [style*="color: #1565c0"],
body.dark-mode .mp-list [style*="color:#1565c0"] {
  color: #60AFFF !important;
}
body.dark-mode .mp-list [style*="color: #e65100"],
body.dark-mode .mp-list [style*="color:#e65100"] {
  color: #FFB060 !important;
}
body.dark-mode .mp-list [style*="color: #4caf50"],
body.dark-mode .mp-list [style*="color:#4caf50"] {
  color: #6EE7A2 !important;
}
body.dark-mode .mp-list [style*="color: #ff9800"],
body.dark-mode .mp-list [style*="color:#ff9800"] {
  color: #FFB060 !important;
}
body.dark-mode .mp-list [style*="color: #757575"],
body.dark-mode .mp-list [style*="color:#757575"] {
  color: #AEAEB2 !important;
}

/* "Details" / "Schließen" toggle button — inline #f5f5f5 (rest), #e8e8e8 (hover via JS)
   JS sets .style.background which the browser re-serializes from hex to rgb(R, G, B). */
body.dark-mode .mp-list [style*="background: #f5f5f5"],
body.dark-mode .mp-list [style*="background:#f5f5f5"],
body.dark-mode .mp-list [style*="rgb(245, 245, 245)"],
body.dark-mode .mp-list [style*="rgb(245,245,245)"],
body.dark-mode .mp-list [style*="background: #e8e8e8"],
body.dark-mode .mp-list [style*="background:#e8e8e8"],
body.dark-mode .mp-list [style*="rgb(232, 232, 232)"],
body.dark-mode .mp-list [style*="rgb(232,232,232)"],
body.dark-mode .mp-list button[onclick^="toggleAEMeetingDetails"] {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.14) !important;
  color: #E5E5EA !important;
}
body.dark-mode .mp-list button[onclick^="toggleAEMeetingDetails"]:hover {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(255,255,255,0.22) !important;
}

/* Inner inline "Brief" body containers with translucent white bg (ct.body/fu.body) */
body.dark-mode .mp-list [style*="background: rgba(255,255,255,0.6)"],
body.dark-mode .mp-list [style*="background:rgba(255,255,255,0.6)"] {
  background: rgba(255,255,255,0.05) !important;
  color: #C7C7CC !important;
}

/* === Goal Hero-Edit (Apple Premium Inline Editor) === */
.goal-hero {
  position: relative;
  min-height: 90px;
}

.goal-hero-display {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  padding: 8px 14px 8px 14px;
  border-radius: 12px;
  border: 1.5px dashed rgba(175,16,0,0.28);
  background: rgba(175,16,0,0.03);
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.goal-hero-display:hover {
  background: rgba(175,16,0,0.08);
  border-color: rgba(175,16,0,0.5);
  border-style: solid;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(175,16,0,0.12);
}

.goal-hero-value {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -1px;
  color: #1C1C1E;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.goal-hero-value.is-empty {
  color: #af1000;
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -0.2px;
}

.goal-hero-edit-icon {
  width: 14px;
  height: 14px;
  color: #af1000;
  opacity: 0.65;
  transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1), transform 0.2s ease;
  flex-shrink: 0;
}

.goal-hero-display:hover .goal-hero-edit-icon {
  opacity: 1;
  transform: rotate(-12deg);
}

.goal-hero-editor {
  display: none;
  flex-direction: column;
  gap: 10px;
  animation: goalEditorIn 0.28s cubic-bezier(0.34, 1.2, 0.64, 1);
}

.goal-hero.is-editing .goal-hero-display { display: none; }
.goal-hero.is-editing .goal-hero-editor { display: flex; }

@keyframes goalEditorIn {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}

.goal-hero-input-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 14px;
  border-radius: 12px;
  background: rgba(255,255,255,0.95);
  border: 1.5px solid rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.12);
}

.goal-hero-input {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.8px;
  color: #1C1C1E;
  font-variant-numeric: tabular-nums;
  padding: 0;
}

.goal-hero-input::placeholder {
  color: #C7C7CC;
  font-weight: 600;
}

.goal-hero-currency {
  font-size: 18px;
  font-weight: 700;
  color: #8E8E93;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
}

.goal-hero-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.goal-hero-preset {
  padding: 5px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.85);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  color: #1C1C1E;
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  letter-spacing: 0.1px;
}

.goal-hero-preset:hover {
  background: rgba(175,16,0,0.08);
  border-color: rgba(175,16,0,0.25);
  color: #af1000;
}

.goal-hero-preset.is-active {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  border-color: rgba(175,16,0,0.5);
  color: #fff;
  box-shadow: 0 2px 8px rgba(175,16,0,0.22);
}

.goal-hero-hint {
  font-size: 10px;
  font-weight: 600;
  color: #8E8E93;
  letter-spacing: 0.3px;
  margin-top: -2px;
}

.goal-hero-hint kbd {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 4px;
  background: rgba(0,0,0,0.06);
  font-size: 9.5px;
  font-weight: 700;
  color: #5e5e63;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', monospace;
  margin: 0 2px;
}

/* Save confirmation animation */
.goal-hero.is-just-saved .goal-hero-value {
  animation: goalSaveBounce 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

@keyframes goalSaveBounce {
  0% { transform: scale(1); color: #1C1C1E; }
  40% { transform: scale(1.08); color: #1e7d22; }
  100% { transform: scale(1); color: #1C1C1E; }
}

/* ============================================
   Goal Hero (Monatsziel / Quartalsziel) — Dark Mode
   ============================================ */
body.dark-mode .goal-hero-display {
  background: rgba(255,60,28,0.08) !important;
  border-color: rgba(255,60,28,0.40) !important;
}
body.dark-mode .goal-hero-display:hover {
  background: rgba(255,60,28,0.15) !important;
  border-color: rgba(255,60,28,0.65) !important;
  box-shadow: 0 4px 12px rgba(255,60,28,0.20) !important;
}
body.dark-mode .goal-hero-value {
  color: #E5E5EA !important;
}
body.dark-mode .goal-hero-value.is-empty {
  color: #ff7a63 !important;
}
body.dark-mode .goal-hero-edit-icon {
  color: #ff3c1c !important;
}
body.dark-mode .goal-hero-input-wrap {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,60,28,0.50) !important;
  box-shadow: 0 0 0 3px rgba(255,60,28,0.18) !important;
}
body.dark-mode .goal-hero-input {
  color: #E5E5EA !important;
  background: transparent !important;
}
body.dark-mode .goal-hero-input::placeholder {
  color: #6E6E73 !important;
}
body.dark-mode .goal-hero-currency {
  color: #AEAEB2 !important;
}
body.dark-mode .goal-hero-preset {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.12) !important;
  color: #E5E5EA !important;
}
body.dark-mode .goal-hero-preset:hover {
  background: rgba(255,60,28,0.18) !important;
  border-color: rgba(255,60,28,0.40) !important;
  color: #ff7a63 !important;
}
body.dark-mode .goal-hero-preset.is-active {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important;
  border-color: rgba(255,60,28,0.60) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(255,60,28,0.30) !important;
}
body.dark-mode .goal-hero-hint {
  color: #8E8E93 !important;
}
body.dark-mode .goal-hero-hint kbd {
  background: rgba(255,255,255,0.08) !important;
  color: #E5E5EA !important;
}

/* === Callback Details Modal (Apple Premium) === */
.cd-modal-wrap {
  background: rgba(15,15,18,0.4) !important;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}
.cd-modal {
  max-width: 780px !important;
  width: 94vw;
  max-height: 88vh !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  background: linear-gradient(170deg, rgba(255,255,255,0.96) 0%, rgba(248,248,252,0.92) 100%) !important;
  border: 1px solid rgba(255,255,255,0.7);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.05),
    0 32px 80px rgba(0,0,0,0.24),
    0 12px 24px rgba(0,0,0,0.10),
    inset 0 1px 0 rgba(255,255,255,0.4);
  animation: cdModalIn 0.3s cubic-bezier(0.34, 1.2, 0.64, 1);
}
@keyframes cdModalIn {
  from { opacity: 0; transform: scale(0.96) translateY(8px); }
  to   { opacity: 1; transform: scale(1) translateY(0); }
}

/* Header */
.cd-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px 18px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  flex-shrink: 0;
}
.cd-header-left {
  display: flex;
  align-items: center;
  gap: 14px;
}
.cd-avatar {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(175,16,0,0.28), inset 0 1px 0 rgba(255,255,255,0.25);
  flex-shrink: 0;
}
.cd-eyebrow {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: #af1000;
  margin-bottom: 2px;
}
.cd-title {
  margin: 0;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.6px;
  color: #1C1C1E;
  line-height: 1.1;
}
.cd-close-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.06);
  color: #8E8E93;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}
.cd-close-btn:hover {
  background: rgba(175,16,0,0.08);
  border-color: rgba(175,16,0,0.18);
  color: #af1000;
  transform: rotate(90deg);
}

/* Body */
.cd-body {
  padding: 22px 24px 24px;
  overflow-y: auto;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

/* Hero: 3 Glass-Cards (Datum, Zuständig, Status) */
.cd-hero {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
}
.cd-hero-card {
  padding: 14px 14px 13px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.92) 0%, rgba(250,247,253,0.8) 100%);
  border: 1.5px solid rgba(0,0,0,0.12);
  box-shadow:
    0 4px 14px rgba(0,0,0,0.08),
    0 2px 4px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.65);
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
.cd-hero-icon {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: rgba(175,16,0,0.1);
  color: #af1000;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
}
.cd-hero-label {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: #8E8E93;
}
.cd-hero-value {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.3px;
  color: #1C1C1E;
  line-height: 1.25;
  white-space: nowrap;
  overflow: visible;
  font-variant-numeric: tabular-nums;
}
.cd-hero-card-status .cd-status-slot { font-weight: 700; }

/* Status Chip */
.cd-status-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px 3px 8px;
  border-radius: 999px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1px;
  border: 1px solid transparent;
  white-space: nowrap;
}
.cd-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.55);
  flex-shrink: 0;
}
.cd-status-ok   { color: #1e7d22; background: rgba(52,199,89,0.12); border-color: rgba(52,199,89,0.22); }
.cd-status-warn { color: #b35900; background: rgba(255,159,10,0.14); border-color: rgba(255,159,10,0.24); }
.cd-status-bad  { color: #c41e3a; background: rgba(255,69,58,0.13); border-color: rgba(255,69,58,0.22); }
.cd-status-info { color: #0a5dd1; background: rgba(10,132,255,0.13); border-color: rgba(10,132,255,0.22); }
.cd-status-neutral { color: #6e6e73; background: rgba(142,142,147,0.12); border-color: rgba(0,0,0,0.06); }

/* Section blocks */
.cd-section {
  padding: 14px 16px 4px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(250,250,253,0.7) 100%);
  border: 1.5px solid rgba(0,0,0,0.12);
  box-shadow:
    0 4px 14px rgba(0,0,0,0.08),
    0 2px 4px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.55);
}
.cd-section-warn {
  background: linear-gradient(170deg, rgba(255,250,245,0.92) 0%, rgba(255,245,238,0.75) 100%);
  border-color: rgba(255,159,10,0.42);
  box-shadow:
    0 4px 14px rgba(255,159,10,0.12),
    0 2px 4px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.55);
}
.cd-section-label {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: #8E8E93;
  margin-bottom: 8px;
  padding: 0 2px;
}

/* Row */
.cd-row {
  display: grid;
  grid-template-columns: 22px 130px 1fr;
  align-items: center;
  gap: 10px;
  padding: 11px 4px;
  border-top: 1px solid rgba(0,0,0,0.04);
}
.cd-row:first-of-type { border-top: none; padding-top: 6px; }
.cd-row-block {
  align-items: start;
}
.cd-row-block .cd-row-icon { margin-top: 1px; }
.cd-row-icon {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: rgba(175,16,0,0.08);
  color: #af1000;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.cd-row-icon-warn {
  background: rgba(255,159,10,0.14);
  color: #b35900;
}
.cd-row-key {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #6e6e73;
  letter-spacing: -0.1px;
}
.cd-row-val {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  min-width: 0;
  word-break: break-word;
}
.cd-row-val-multiline {
  font-weight: 500;
  line-height: 1.5;
  white-space: pre-wrap;
}
.cd-row-val-strong {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.4px;
  color: #af1000;
  font-variant-numeric: tabular-nums;
}
.cd-row-control { padding: 9px 4px; }

/* Premium category select */
.cd-category-select {
  padding: 7px 32px 7px 12px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  background-color: rgba(255,255,255,0.85);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238E8E93' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px 10px;
  min-width: 160px;
}
.cd-category-select:hover {
  border-color: rgba(0,0,0,0.14);
  background-color: rgba(255,255,255,0.95);
}
.cd-category-select:focus {
  outline: none;
  background-color: #fff;
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.1);
}

/* Footer */
.cd-footer {
  padding: 14px 24px 18px;
  border-top: 1px solid rgba(0,0,0,0.06);
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  flex-shrink: 0;
}
.cd-footer-btn {
  padding: 9px 24px;
  border-radius: 12px;
  border: 1px solid rgba(175,16,0,0.5);
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.1px;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(175,16,0,0.28), inset 0 1px 0 rgba(255,255,255,0.18);
  transition: all 0.22s cubic-bezier(0.4,0,0.2,1);
}
.cd-footer-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 5px 16px rgba(175,16,0,0.36), inset 0 1px 0 rgba(255,255,255,0.22);
}

@media (max-width: 540px) {
  .cd-hero { grid-template-columns: 1fr; }
  .cd-row { grid-template-columns: 22px 1fr; }
  .cd-row .cd-row-val { grid-column: 1 / -1; padding-left: 32px; }
}

/* === Member Modals (Form Inputs in cd-* shell) === */
.mm-modal { max-width: 520px !important; }
.mm-modal-info {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #6e6e73;
  letter-spacing: -0.1px;
  line-height: 1.45;
  margin: 0 4px 4px;
}
.mm-form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.mm-form-label {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: #8E8E93;
  padding: 0 4px;
}
.mm-form-input {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  background: rgba(255,255,255,0.85);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.03);
  box-sizing: border-box;
}
.mm-form-input:hover { border-color: rgba(0,0,0,0.14); }
.mm-form-input:focus {
  outline: none;
  background: #fff;
  border-color: rgba(175,16,0,0.42);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.10), inset 0 1px 2px rgba(0,0,0,0.03);
}
select.mm-form-input {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238E8E93' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 10px 10px;
  padding-right: 36px;
  cursor: pointer;
}
.mm-error {
  padding: 10px 14px;
  border-radius: 10px;
  background: rgba(196,30,58,0.08);
  border: 1px solid rgba(196,30,58,0.22);
  color: #c41e3a;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.1px;
}

/* Role-Help-Rows in cd-section warning variant */
.mm-role-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 4px;
  border-top: 1px solid rgba(0,0,0,0.04);
}
.mm-role-row:first-of-type { border-top: none; padding-top: 2px; }
.mm-role-desc {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #6e6e73;
  letter-spacing: -0.1px;
  line-height: 1.4;
  flex: 1;
  min-width: 0;
}

/* Premium Checkbox Row */
.mm-checkbox-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-radius: 12px;
  background: rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.05);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  cursor: pointer;
  user-select: none;
  transition: background 0.15s ease;
}
.mm-checkbox-row:hover { background: rgba(0,0,0,0.05); }
.mm-checkbox-row em { font-style: normal; color: #8E8E93; font-weight: 500; }
.mm-checkbox {
  width: 17px;
  height: 17px;
  accent-color: #af1000;
  cursor: pointer;
  flex-shrink: 0;
}

/* === Logs Dashboard (table cells + pagination) === */
.lg-empty-cell {
  text-align: center;
  padding: 50px 20px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #8E8E93;
  letter-spacing: -0.05px;
}
.lg-cell-timestamp {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #6e6e73;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.05px;
}
.lg-cell-user {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 13px;
  font-weight: 700;
  color: #1C1C1E;
  letter-spacing: -0.1px;
}
.lg-cell-details {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  color: #3C3C43;
  letter-spacing: -0.05px;
}
.lg-cell-details .action-btn-small {
  margin-left: 8px;
  padding: 4px 10px;
  font-size: 11px;
}
.lg-cell-source { text-align: center; }
.lg-source-pill {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: rgba(0,0,0,0.05);
  border: 1px solid rgba(0,0,0,0.06);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  color: #3C3C43;
  letter-spacing: 0.15px;
}

.lg-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 18px;
  padding: 13px 18px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.78) 0%, rgba(250,250,253,0.6) 100%);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  backdrop-filter: blur(30px) saturate(150%);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 2px 10px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.5);
}
.lg-pagination-count {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #6e6e73;
  letter-spacing: -0.05px;
}
.lg-pagination-count > span {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 800;
  color: #af1000;
  margin-right: 4px;
  font-variant-numeric: tabular-nums;
}
.lg-pagination-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}
.lg-page-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 7px 13px;
  border-radius: 10px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.7);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #1C1C1E;
  letter-spacing: -0.05px;
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.lg-page-btn:hover:not(:disabled) {
  background: rgba(175,16,0,0.06);
  border-color: rgba(175,16,0,0.25);
  color: #af1000;
  transform: translateY(-1px);
}
.lg-page-btn:disabled {
  opacity: 0.42;
  cursor: not-allowed;
}
.lg-page-info {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 800;
  color: #1C1C1E;
  letter-spacing: -0.05px;
  padding: 0 12px;
  font-variant-numeric: tabular-nums;
}

/* Log Details content area */
.lg-log-content {
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(250,250,253,0.65) 100%);
  border: 1px solid rgba(0,0,0,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  color: #1C1C1E;
  line-height: 1.55;
  letter-spacing: -0.05px;
  max-height: 60vh;
  overflow-y: auto;
}
.lg-log-content strong { color: #1C1C1E; font-weight: 700; }

/* === PDF Export Modal === */
.pdf-period-display {
  padding: 8px 4px 4px;
}
.pdf-period-value {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.4px;
  color: #af1000;
  margin-bottom: 6px;
}
.pdf-period-hint {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #8E8E93;
  line-height: 1.45;
  letter-spacing: -0.05px;
}
.pdf-checkbox-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.pdf-disabled-row {
  opacity: 0.5;
  pointer-events: none;
  position: relative;
}
.pdf-soon-pill {
  margin-left: auto;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: #af1000;
  background: rgba(175,16,0,0.10);
  border: 1px solid rgba(175,16,0,0.20);
  padding: 3px 8px;
  border-radius: 999px;
  flex-shrink: 0;
}

/* === CSV Import Modal === */
.csv-modal {
  max-width: 1200px !important;
  width: 96vw;
  max-height: 92vh !important;
}
.csv-body {
  gap: 14px;
}
.csv-info-pill {
  padding: 12px 16px;
  border-radius: 12px;
  background: linear-gradient(170deg, rgba(232,243,255,0.85) 0%, rgba(220,236,255,0.65) 100%);
  border: 1.5px solid rgba(10,132,255,0.22);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #0a5dd1;
  letter-spacing: -0.1px;
  line-height: 1.45;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.csv-info-pill:empty { display: none; }
.csv-section-hint {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  color: #8E8E93;
  letter-spacing: -0.05px;
  margin: -4px 2px 12px;
}
.csv-mapping-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin: 0 -2px;
}
.csv-preview-wrap {
  border-radius: 12px;
  border: 1.5px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.85);
  overflow: auto;
  max-height: 360px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.csv-preview-table {
  width: 100%;
  border-collapse: collapse;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  color: #1C1C1E;
  letter-spacing: -0.1px;
}
.csv-preview-table thead {
  background: rgba(0,0,0,0.04);
  position: sticky;
  top: 0;
  z-index: 1;
}
.csv-preview-table th {
  padding: 10px 12px;
  text-align: left;
  font-weight: 800;
  color: #8E8E93;
  font-size: 10.5px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.csv-preview-table td {
  padding: 9px 12px;
  border-top: 1px solid rgba(0,0,0,0.04);
  font-weight: 500;
}
.csv-preview-table tbody tr:hover { background: rgba(175,16,0,0.04); }
.csv-tip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 11px;
  border-radius: 10px;
  background: rgba(255,159,10,0.12);
  border: 1px solid rgba(255,159,10,0.22);
  color: #b35900;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: -0.05px;
  margin-top: 10px;
}
.csv-footer {
  justify-content: space-between;
  align-items: center;
}
.csv-row-count {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: #8E8E93;
  letter-spacing: -0.05px;
  margin-right: auto;
}
.csv-footer-actions {
  display: flex;
  gap: 10px;
}

/* === Delete Confirmation Modal (Apple Premium, danger theme) === */
.dc-modal { max-width: 480px !important; }
.dc-avatar {
  background: linear-gradient(135deg, #c41e3a 0%, #e53e3e 100%) !important;
  box-shadow: 0 4px 12px rgba(196,30,58,0.32), inset 0 1px 0 rgba(255,255,255,0.25) !important;
}
.dc-eyebrow { color: #c41e3a !important; }

.dc-body {
  gap: 14px;
}

.dc-counter {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 22px 16px 20px;
  border-radius: 16px;
  background: linear-gradient(170deg, rgba(255,245,247,0.92) 0%, rgba(255,238,240,0.78) 100%);
  border: 1.5px solid rgba(196,30,58,0.22);
  box-shadow:
    0 4px 14px rgba(196,30,58,0.10),
    0 2px 4px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.55);
}
.dc-counter-num {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 56px;
  font-weight: 800;
  letter-spacing: -2px;
  line-height: 1;
  color: #c41e3a;
  font-variant-numeric: tabular-nums;
  background: linear-gradient(135deg, #c41e3a 0%, #e53e3e 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.dc-counter-label {
  margin-top: 6px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: 0.2px;
  color: #6e6e73;
}

.dc-warn {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,250,245,0.92) 0%, rgba(255,245,238,0.75) 100%);
  border: 1.5px solid rgba(255,159,10,0.30);
  box-shadow:
    0 4px 14px rgba(255,159,10,0.10),
    0 2px 4px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.55);
}
.dc-warn-icon {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: rgba(255,159,10,0.16);
  color: #b35900;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.dc-warn-body { flex: 1; min-width: 0; }
.dc-warn-title {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.2px;
  color: #1C1C1E;
  margin-bottom: 3px;
}
.dc-warn-text {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  color: #6e6e73;
  line-height: 1.45;
}

/* Footer Buttons */
.dc-footer {
  justify-content: space-between;
  gap: 10px;
}
.dc-cancel-btn {
  padding: 9px 20px;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.85);
  color: #1C1C1E;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4,0,0.2,1);
  box-shadow: 0 1px 2px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.5);
}
.dc-cancel-btn:hover {
  background: #fff;
  border-color: rgba(0,0,0,0.18);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.5);
}
.dc-confirm-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 20px;
  border-radius: 12px;
  border: 1px solid rgba(196,30,58,0.55);
  background: linear-gradient(135deg, #c41e3a 0%, #e53e3e 100%);
  color: #fff;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -0.1px;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(196,30,58,0.30), inset 0 1px 0 rgba(255,255,255,0.18);
  transition: all 0.22s cubic-bezier(0.4,0,0.2,1);
}
.dc-confirm-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(196,30,58,0.40), inset 0 1px 0 rgba(255,255,255,0.22);
}
.dc-confirm-btn:active { transform: translateY(0); }

/* === Searchable Combobox (Premium typeahead, max 10 visible + scroll) === */
.sc-wrap {
  position: relative;
  display: inline-block;
  min-width: 160px;
}
.sc-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px 9px 14px;
  min-width: 170px;
  width: 100%;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,0.08);
  background: rgba(255,255,255,0.7);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.03);
  text-align: left;
}
.sc-btn:hover {
  border-color: rgba(0,0,0,0.14);
  background: rgba(255,255,255,0.92);
}
.sc-btn.is-open {
  background: rgba(255,255,255,0.98);
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.1), inset 0 1px 2px rgba(0,0,0,0.03);
}
.sc-btn-label {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.sc-btn-chevron {
  flex-shrink: 0;
  color: #8E8E93;
  transition: transform 0.22s cubic-bezier(0.4,0,0.2,1);
}
.sc-btn.is-open .sc-btn-chevron { transform: rotate(180deg); color: #af1000; }

/* Variant for table rows (Zuständig column) — compact */
.data-table .sc-wrap { min-width: 0; }
.data-table .sc-btn {
  padding: 7px 10px 7px 12px;
  min-width: 140px;
  font-size: 12.5px;
  border-radius: 10px;
}

/* === Dropdown (portaled to body, position: fixed) === */
.sc-dropdown {
  width: max-content;
  max-width: 360px;
  padding: 8px;
  border-radius: 16px;
  background: linear-gradient(170deg, rgba(255,255,255,0.92) 0%, rgba(252,250,255,0.86) 100%);
  border: 1.5px solid rgba(255,255,255,0.7);
  -webkit-backdrop-filter: blur(40px) saturate(180%);
  backdrop-filter: blur(40px) saturate(180%);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.06),
    0 16px 48px rgba(0,0,0,0.14),
    0 4px 16px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.5);
  animation: scDropdownIn 0.22s cubic-bezier(0.34,1.2,0.64,1);
}
@keyframes scDropdownIn {
  from { opacity: 0; transform: translateY(-6px) scale(.97); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

.sc-search-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  margin-bottom: 6px;
  border-radius: 10px;
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.05);
  transition: all 0.18s ease;
}
.sc-search-wrap:focus-within {
  background: rgba(255,255,255,0.95);
  border-color: rgba(175,16,0,0.32);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.08);
}
.sc-search-wrap svg { color: #8E8E93; flex-shrink: 0; }
.sc-search {
  flex: 1;
  border: none;
  outline: none;
  background: transparent;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  padding: 0;
}
.sc-search::placeholder { color: #8E8E93; font-weight: 500; }

.sc-list {
  max-height: 320px; /* ~10 items at ~32px each */
  overflow-y: auto;
  padding: 2px;
  scrollbar-width: thin;
  scrollbar-color: rgba(0,0,0,0.18) transparent;
}
.sc-list::-webkit-scrollbar { width: 6px; }
.sc-list::-webkit-scrollbar-track { background: transparent; }
.sc-list::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.18); border-radius: 3px; }
.sc-list::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.3); }

.sc-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: background 0.12s ease;
  user-select: none;
}
.sc-item:hover {
  background: rgba(175,16,0,0.06);
  color: #af1000;
}
.sc-item.is-active {
  background: rgba(175,16,0,0.10);
  color: #af1000;
  font-weight: 700;
}
.sc-item-label {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.sc-check {
  flex-shrink: 0;
  color: #af1000;
}
.sc-empty {
  padding: 18px 12px;
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: #8E8E93;
}

/* === Click-to-Activate Scroll Wrapper === */
.scroll-on-click {
  position: relative;
  transition: box-shadow 0.2s cubic-bezier(0.4,0,0.2,1), border-color 0.2s ease;
}
.scroll-on-click::after {
  content: 'Zum Scrollen klicken';
  position: absolute;
  top: 8px;
  right: 12px;
  z-index: 5;
  padding: 4px 10px;
  border-radius: 999px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  color: #af1000;
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(175,16,0,0.18);
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  letter-spacing: 0.2px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.scroll-on-click:hover::after { opacity: 1; }
.scroll-on-click.is-scroll-active::after {
  content: '✓ Aktiv';
  color: #1e7d22;
  border-color: rgba(30,125,34,0.22);
  background: rgba(232,247,232,0.95);
  opacity: 1;
}
.scroll-on-click.is-scroll-active {
  box-shadow:
    inset 0 0 0 1.5px rgba(175,16,0,0.28),
    0 0 0 3px rgba(175,16,0,0.08);
  border-radius: 12px;
}

/* === Soll vs. Ist (Apple Premium Inline Benchmark Editor) === */
.pq-soll-card {
  position: relative;
  padding: 28px 30px 24px;
  margin-bottom: 24px;
  border-radius: 20px;
  background: linear-gradient(170deg, rgba(255,255,255,0.78) 0%, rgba(252,250,255,0.62) 100%);
  border: 1.5px solid rgba(255,255,255,0.6);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.04),
    0 8px 28px rgba(0,0,0,0.05),
    inset 0 1px 0 rgba(255,255,255,0.4);
  overflow: hidden;
}

.pq-soll-header {
  margin-bottom: 22px;
}

.pq-soll-eyebrow {
  display: inline-block;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: #af1000;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(175,16,0,0.08);
  border: 1px solid rgba(175,16,0,0.18);
  margin-bottom: 10px;
}

.pq-soll-title {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.6px;
  color: #1C1C1E;
  margin: 0 0 6px 0;
  line-height: 1.15;
}

.pq-soll-subtitle {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  color: #6e6e73;
  letter-spacing: 0;
  line-height: 1.45;
}

.pq-soll-loading {
  text-align: center;
  padding: 50px 0;
  color: #8E8E93;
}
.pq-soll-spinner {
  display: inline-block;
  width: 22px;
  height: 22px;
  border: 2.5px solid rgba(175,16,0,0.15);
  border-top-color: #af1000;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}
.pq-soll-loading-text {
  margin-top: 10px;
  font-size: 13px;
  font-weight: 500;
}

.pq-soll-section {
  margin-bottom: 26px;
}
.pq-soll-section-last { margin-bottom: 0; }

.pq-soll-section-head {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-bottom: 14px;
}
.pq-soll-section-label {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.2px;
  color: #1C1C1E;
}
.pq-soll-section-hint {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  color: #8E8E93;
  letter-spacing: 0;
}

/* --- Sales Cycle Tiles --- */
.pq-soll-tiles {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.pq-soll-tile {
  position: relative;
  padding: 16px 18px 14px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.92) 0%, rgba(250,250,253,0.85) 100%);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow:
    0 1px 2px rgba(0,0,0,0.03),
    inset 0 1px 0 rgba(255,255,255,0.6);
  transition: transform 0.18s cubic-bezier(0.4,0,0.2,1), box-shadow 0.18s cubic-bezier(0.4,0,0.2,1);
}
.pq-soll-tile:hover {
  transform: translateY(-1px);
  box-shadow:
    0 4px 12px rgba(0,0,0,0.05),
    inset 0 1px 0 rgba(255,255,255,0.7);
}
.pq-soll-tile::before {
  content: '';
  position: absolute;
  top: 0; left: 14px; right: 14px;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: rgba(142,142,147,0.25);
  transition: background 0.25s ease;
}
.pq-soll-tile[data-status="ok"]::before  { background: #34c759; }
.pq-soll-tile[data-status="warn"]::before { background: #ff9f0a; }
.pq-soll-tile[data-status="bad"]::before  { background: #ff453a; }

.pq-soll-tile-label {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.6px;
  color: #8E8E93;
  margin-bottom: 8px;
}
.pq-soll-tile-actual {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -1.1px;
  color: #1C1C1E;
  font-variant-numeric: tabular-nums;
  line-height: 1;
  display: flex;
  align-items: baseline;
  gap: 2px;
}
.pq-soll-tile-unit {
  font-size: 14px;
  font-weight: 700;
  color: #8E8E93;
  margin-left: 2px;
}
.pq-soll-tile-actual-empty { color: #C7C7CC; }
.pq-soll-tile-actual-hint {
  margin-top: 4px;
  font-size: 11px;
  font-weight: 500;
  color: #8E8E93;
}

.pq-soll-target-row {
  margin-top: 12px;
  display: flex;
  align-items: center;
  min-height: 32px;
}

/* --- Stage Rows --- */
.pq-soll-stage-wrap {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pq-soll-stage-row {
  display: grid;
  grid-template-columns: 180px 1fr;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.78) 0%, rgba(250,250,253,0.6) 100%);
  border: 1px solid rgba(0,0,0,0.05);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.pq-soll-stage-name {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  color: #1C1C1E;
  letter-spacing: -0.1px;
}
.pq-soll-stage-cells {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
}
.pq-soll-stage-cell {
  position: relative;
  padding: 12px 14px 10px;
  border-radius: 11px;
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(0,0,0,0.05);
  transition: background 0.18s ease, border-color 0.18s ease;
}
.pq-soll-stage-cell::before {
  content: '';
  position: absolute;
  top: 0; left: 10px; right: 10px;
  height: 2px;
  border-radius: 0 0 2px 2px;
  background: rgba(142,142,147,0.2);
}
.pq-soll-stage-cell[data-status="ok"]::before  { background: #34c759; }
.pq-soll-stage-cell[data-status="warn"]::before { background: #ff9f0a; }
.pq-soll-stage-cell[data-status="bad"]::before  { background: #ff453a; }

.pq-soll-cell-tier {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #8E8E93;
  margin-bottom: 4px;
}
.pq-soll-cell-actual {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.6px;
  color: #1C1C1E;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
  display: flex;
  align-items: baseline;
  gap: 1px;
}
.pq-soll-cell-unit {
  font-size: 11px;
  font-weight: 700;
  color: #8E8E93;
  margin-left: 1px;
}
.pq-soll-cell-actual-empty { color: #C7C7CC; }
.pq-soll-cell-hint {
  font-size: 9.5px;
  font-weight: 600;
  color: #C7C7CC;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  margin-top: 1px;
}

.pq-soll-target-row-compact {
  margin-top: 8px;
  min-height: 28px;
}

/* --- Click-to-Edit Target Trigger --- */
.pq-soll-target-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px 5px 11px;
  border-radius: 10px;
  background: rgba(175,16,0,0.04);
  border: 1.2px dashed rgba(175,16,0,0.25);
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  color: #af1000;
  user-select: none;
}
.pq-soll-target-trigger:hover {
  background: rgba(175,16,0,0.09);
  border-style: solid;
  border-color: rgba(175,16,0,0.45);
  transform: translateY(-1px);
  box-shadow: 0 2px 8px rgba(175,16,0,0.12);
}
.pq-soll-target-label {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  opacity: 0.75;
}
.pq-soll-target-value {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.3px;
  color: #1C1C1E;
  font-variant-numeric: tabular-nums;
  display: inline-flex;
  align-items: baseline;
  gap: 1px;
}
.pq-soll-target-value.is-empty {
  font-size: 12px;
  font-weight: 700;
  color: #af1000;
  letter-spacing: 0.1px;
  text-transform: none;
}
.pq-soll-target-unit {
  font-size: 10px;
  font-weight: 700;
  color: #8E8E93;
  margin-left: 1px;
}
.pq-soll-edit-icon {
  flex-shrink: 0;
  opacity: 0.6;
  transition: opacity 0.18s ease, transform 0.18s ease;
}
.pq-soll-target-trigger:hover .pq-soll-edit-icon {
  opacity: 1;
  transform: rotate(-12deg);
}

.pq-soll-target-trigger-compact {
  padding: 4px 8px 4px 9px;
  border-radius: 8px;
  gap: 5px;
}
.pq-soll-target-trigger-compact .pq-soll-target-label { font-size: 9.5px; letter-spacing: 0.4px; }
.pq-soll-target-trigger-compact .pq-soll-target-value { font-size: 13px; }
.pq-soll-target-trigger-compact .pq-soll-target-value.is-empty { font-size: 10.5px; }

/* Save bounce micro-animation */
.pq-soll-target-trigger.is-just-saved .pq-soll-target-value {
  animation: sollSaveBounce 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes sollSaveBounce {
  0% { transform: scale(1); color: #1C1C1E; }
  40% { transform: scale(1.15); color: #1e7d22; }
  100% { transform: scale(1); color: #1C1C1E; }
}

/* --- Inline Editor (input form) --- */
.pq-soll-target-editor {
  display: none;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 10px;
  background: rgba(255,255,255,0.98);
  border: 1.5px solid rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.12);
  animation: sollEditorIn 0.22s cubic-bezier(0.34,1.2,0.64,1);
}
.pq-soll-target-row.is-editing .pq-soll-target-trigger { display: none; }
.pq-soll-target-row.is-editing .pq-soll-target-editor { display: inline-flex; }

@keyframes sollEditorIn {
  from { opacity: 0; transform: translateY(-3px); }
  to   { opacity: 1; transform: translateY(0); }
}
.pq-soll-target-input {
  width: 50px;
  border: none;
  outline: none;
  background: transparent;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.4px;
  color: #1C1C1E;
  font-variant-numeric: tabular-nums;
  padding: 2px 0;
  text-align: center;
}
.pq-soll-target-input::placeholder { color: #C7C7CC; font-weight: 600; }
.pq-soll-target-unit-editor {
  font-size: 11px;
  font-weight: 700;
  color: #8E8E93;
  letter-spacing: 0.2px;
}

/* --- Close Date Mini-Meta (chips under % value) --- */
.pq-soll-cd-meta {
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.pq-soll-cd-meta-clean {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  color: #34c759;
  letter-spacing: 0.2px;
  padding: 4px 0;
}
.pq-soll-cd-chip {
  display: inline-flex;
  align-items: center;
  padding: 3px 9px;
  border-radius: 999px;
  background: rgba(0,0,0,0.05);
  border: 1px solid rgba(0,0,0,0.05);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  color: #3C3C43;
  letter-spacing: 0.2px;
  font-variant-numeric: tabular-nums;
}

/* --- Info / Close Date card --- */
.pq-soll-info {
  display: flex;
  gap: 12px;
  padding: 16px 18px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.88) 0%, rgba(255,245,240,0.6) 100%);
  border: 1px solid rgba(175,16,0,0.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.pq-soll-info-icon {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: rgba(175,16,0,0.12);
  color: #af1000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pq-soll-info-title {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-size: 13px;
  font-weight: 800;
  color: #af1000;
  letter-spacing: 0.1px;
  margin-bottom: 4px;
}
.pq-soll-info-text {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  color: #475569;
  line-height: 1.5;
}
.pq-soll-info-text strong { font-weight: 700; color: #1C1C1E; }

.pq-soll-empty {
  text-align: center;
  padding: 28px 20px;
  font-size: 12.5px;
  font-weight: 500;
  color: #8E8E93;
  background: rgba(255,255,255,0.5);
  border-radius: 12px;
  border: 1px dashed rgba(0,0,0,0.08);
}

@media (max-width: 760px) {
  .pq-soll-stage-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }
}

/* === Pipeline Quality Premium Blocks === */
.pq-block {
  margin-bottom: 28px;
  padding: 28px 30px 26px;
  border-radius: 22px;
  background: linear-gradient(170deg, rgba(255,255,255,0.72) 0%, rgba(250,247,253,0.55) 100%);
  border: 1.5px solid rgba(255,255,255,0.65);
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.05),
    0 8px 28px rgba(0,0,0,0.06),
    0 2px 8px rgba(0,0,0,0.04),
    inset 0 1px 0 rgba(255,255,255,0.4);
  scroll-margin-top: 100px;
  position: relative;
}

.pq-block::before { display: none !important; }

.pq-block-hero {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

.pq-block-eyebrow {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1.6px;
  text-transform: uppercase;
}

.pq-block-1 .pq-block-eyebrow { color: #1E40AF; }
.pq-block-2 .pq-block-eyebrow { color: #0A84FF; }
.pq-block-3 .pq-block-eyebrow { color: #c77700; }
.pq-block-4 .pq-block-eyebrow { color: #5B2D5B; }
.pq-block-5 .pq-block-eyebrow { color: #2e7d32; }

.pq-block-title {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.5px;
  color: #1C1C1E;
}

/* === Health Deal Modal — Apple Premium sort bar + list === */
.hd-sort-bar {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 28px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  background: rgba(255,255,255,0.7);
  flex-shrink: 0;
}

.hd-sort-label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #8E8E93;
}

.hd-list {
  flex: 1;
  overflow-y: auto;
  padding: 18px 28px 28px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* Each existing deal-card inside the list gets premium glass treatment (light mode only) */
body:not(.dark-mode) .hd-list > div {
  background: rgba(255,255,255,0.78) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  border-radius: 14px !important;
  margin-bottom: 0 !important;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.03) !important;
}

body:not(.dark-mode) .hd-list > div:hover {
  background: rgba(255,255,255,0.96) !important;
  border-color: rgba(0,0,0,0.10) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,0.06), 0 2px 6px rgba(0,0,0,0.04) !important;
  transform: translateY(-1px);
}

/* Dark mode — Outer Deal-Item Container: EINHEITLICHER subtiler Glas-Hintergrund
   über die GANZE Deal-Box (Header + Details). So sieht aufgeklappt und collapsed
   gleich aus. */
body.dark-mode .hd-list > div {
  background: rgba(255,255,255,0.035) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 14px !important;
  margin-bottom: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  color: #E5E5EA;
}
body.dark-mode .hd-list > div:hover {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.16) !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Details-Section erbt vom Outer-Container — nur Trennstrich oben dezent */
body.dark-mode .hd-list > div > div[id^="deal-details-"] {
  background: transparent !important;
  border-top: 1px solid rgba(255,255,255,0.10) !important;
}

/* Dark mode — sort bar */
body.dark-mode .hd-sort-bar {
  background: rgba(28,28,30,0.55) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
body.dark-mode .hd-sort-label { color: #AEAEB2 !important; }

/* Inline-styled content inside deal items (badges, text, colored sections) — mirror .mp-list rules */
body.dark-mode .hd-list strong { color: #E5E5EA !important; }
body.dark-mode .hd-list [style*="color: #555"],
body.dark-mode .hd-list [style*="color:#555"] { color: #C7C7CC !important; }
body.dark-mode .hd-list [style*="color: #777"],
body.dark-mode .hd-list [style*="color:#777"] { color: #AEAEB2 !important; }
body.dark-mode .hd-list [style*="color: #666"],
body.dark-mode .hd-list [style*="color:#666"],
body.dark-mode .hd-list [style*="color: #666666"],
body.dark-mode .hd-list [style*="color:#666666"] { color: #AEAEB2 !important; }
body.dark-mode .hd-list [style*="color: #333"],
body.dark-mode .hd-list [style*="color:#333"],
body.dark-mode .hd-list [style*="color: #1a1a1a"],
body.dark-mode .hd-list [style*="color:#1a1a1a"] { color: #E5E5EA !important; }

/* Colored inline headings — brighter on dark */
body.dark-mode .hd-list [style*="color: #af1000"],
body.dark-mode .hd-list [style*="color:#af1000"] { color: #FF8073 !important; }
body.dark-mode .hd-list [style*="color: #2e7d32"],
body.dark-mode .hd-list [style*="color:#2e7d32"] { color: #6EE7A2 !important; }
body.dark-mode .hd-list [style*="color: #1565c0"],
body.dark-mode .hd-list [style*="color:#1565c0"] { color: #60AFFF !important; }
body.dark-mode .hd-list [style*="color: #e65100"],
body.dark-mode .hd-list [style*="color:#e65100"],
body.dark-mode .hd-list [style*="color: #e68a00"],
body.dark-mode .hd-list [style*="color:#e68a00"],
body.dark-mode .hd-list [style*="color: #ff9800"],
body.dark-mode .hd-list [style*="color:#ff9800"] { color: #FFB060 !important; }
body.dark-mode .hd-list [style*="color: #c77700"],
body.dark-mode .hd-list [style*="color:#c77700"] { color: #FFCE5C !important; }
body.dark-mode .hd-list [style*="color: #c62828"],
body.dark-mode .hd-list [style*="color:#c62828"] { color: #FF6B5A !important; }

/* Colored inline backgrounds (badges + info boxes) — re-tint for dark backgrounds */
body.dark-mode .hd-list [style*="background: #f0f0f0"],
body.dark-mode .hd-list [style*="background:#f0f0f0"] {
  background: rgba(255,255,255,0.08) !important;
}
body.dark-mode .hd-list [style*="background: #f5f5f5"],
body.dark-mode .hd-list [style*="background:#f5f5f5"],
body.dark-mode .hd-list [style*="rgb(245, 245, 245)"],
body.dark-mode .hd-list [style*="rgb(245,245,245)"],
body.dark-mode .hd-list [style*="background: #e8e8e8"],
body.dark-mode .hd-list [style*="background:#e8e8e8"],
body.dark-mode .hd-list [style*="rgb(232, 232, 232)"],
body.dark-mode .hd-list [style*="rgb(232,232,232)"] {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.14) !important;
  color: #E5E5EA !important;
}
/* Generic toggle-button hover override in hd-list (catches any button with hover-set bg) */
body.dark-mode .hd-list button[onmouseover*="background"]:hover {
  background: rgba(255,255,255,0.14) !important;
  border-color: rgba(255,255,255,0.22) !important;
  color: #E5E5EA !important;
}
body.dark-mode .hd-list [style*="background: #e8f5e9"],
body.dark-mode .hd-list [style*="background:#e8f5e9"] {
  background: rgba(48,209,88,0.14) !important;
}
body.dark-mode .hd-list [style*="background: #e3f2fd"],
body.dark-mode .hd-list [style*="background:#e3f2fd"] {
  background: rgba(10,132,255,0.14) !important;
}
body.dark-mode .hd-list [style*="background: #ffebee"],
body.dark-mode .hd-list [style*="background:#ffebee"] {
  background: rgba(255,69,58,0.14) !important;
}
body.dark-mode .hd-list [style*="background: #fff3e0"],
body.dark-mode .hd-list [style*="background:#fff3e0"] {
  background: rgba(255,159,10,0.14) !important;
}
body.dark-mode .hd-list [style*="background: #f0faf0"],
body.dark-mode .hd-list [style*="background:#f0faf0"] {
  background: rgba(48,209,88,0.10) !important;
}
body.dark-mode .hd-list [style*="background: #fef0f0"],
body.dark-mode .hd-list [style*="background:#fef0f0"] {
  background: rgba(255,69,58,0.10) !important;
}
body.dark-mode .hd-list [style*="background: #f0f4ff"],
body.dark-mode .hd-list [style*="background:#f0f4ff"] {
  background: rgba(10,132,255,0.10) !important;
}
body.dark-mode .hd-list [style*="background: rgba(255,255,255,0.6)"],
body.dark-mode .hd-list [style*="background:rgba(255,255,255,0.6)"] {
  background: rgba(255,255,255,0.05) !important;
}

/* Inline `linear-gradient(..., #ffffff 100%)` cards (Einschätzung, Stage-Hinweis,
   Health-Analyse, Close Date Verlauf …) — SOLIDER dunkler Hintergrund (kein
   Gradient, keine Transparenz, kein Box-Shadow → garantiert kein gradient-
   oder shadow-Effekt der einen grauen Rechteck-Schein erzeugt) */
/* Innere Cards — DEUTLICH heller als der Outer-Deal-BG (0.035), damit sie als
   distinct Glas-Inseln auf dem einheitlichen Deal-BG schweben */
body.dark-mode .hd-list [style*="#ffffff 100%)"],
body.dark-mode .hd-list [style*="#ffffff 100%) "],
body.dark-mode .hd-list [style*="#fff 100%)"],
body.dark-mode .hd-list [style*="rgb(255, 255, 255) 100%)"],
body.dark-mode .hd-list [style*="rgb(255,255,255) 100%)"] {
  background: rgba(255,255,255,0.10) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,0.14) !important;
  box-shadow: none !important;
}

/* "#2c3e50" (dark slate text in inner cards) — invisible on dark, lift to light */
body.dark-mode .hd-list [style*="color: #2c3e50"],
body.dark-mode .hd-list [style*="color:#2c3e50"] {
  color: #E5E5EA !important;
}
body.dark-mode .hd-list [style*="color: #8e44ad"],
body.dark-mode .hd-list [style*="color:#8e44ad"] {
  color: #E08CFF !important;
}
body.dark-mode .hd-list [style*="color: #2980b9"],
body.dark-mode .hd-list [style*="color:#2980b9"] {
  color: #6EBFFF !important;
}
body.dark-mode .hd-list [style*="color: #888"],
body.dark-mode .hd-list [style*="color:#888"] {
  color: #8E8E93 !important;
}

/* Re-tint inline rgba badges that wrap categories (purple/blue ".1" tints) */
body.dark-mode .hd-list [style*="background: rgba(142,68,173,0.1)"],
body.dark-mode .hd-list [style*="background:rgba(142,68,173,0.1)"] {
  background: rgba(224,140,255,0.30) !important;
  color: #F5C8FF !important;
}
body.dark-mode .hd-list [style*="background: rgba(41,128,185,0.1)"],
body.dark-mode .hd-list [style*="background:rgba(41,128,185,0.1)"] {
  background: rgba(110,191,255,0.28) !important;
  color: #B8DCFF !important;
}

/* SVG icons inside Stage-Hinweis / Health-Analyse circles — also need to be lighter */
body.dark-mode .hd-list svg[stroke="#8e44ad"] { stroke: #E08CFF !important; }
body.dark-mode .hd-list svg[stroke="#2980b9"] { stroke: #6EBFFF !important; }
body.dark-mode .hd-list svg[stroke="#af1000"] { stroke: #FF8073 !important; }
body.dark-mode .hd-list svg[stroke="#2e7d32"] { stroke: #6EE7A2 !important; }
body.dark-mode .hd-list svg[stroke="#e65100"] { stroke: #FFB060 !important; }
body.dark-mode .hd-list svg[stroke="#c62828"] { stroke: #FF6B5A !important; }
body.dark-mode .hd-list svg[stroke="#546e7a"] { stroke: #B0BEC5 !important; }

/* "Unter/Über Ø Deal-Dauer" card uses #546e7a slate-gray — unreadable on dark glass */
body.dark-mode .hd-list [style*="color: #546e7a"],
body.dark-mode .hd-list [style*="color:#546e7a"] {
  color: #CFD8DC !important;
}
body.dark-mode .hd-list [style*="background: rgba(84,110,122,0.12)"],
body.dark-mode .hd-list [style*="background:rgba(84,110,122,0.12)"] {
  background: rgba(176,190,197,0.25) !important;
  color: #ECEFF1 !important;
}

body.dark-mode .hd-list [style*="border-bottom: 1px solid #e0e0e0"],
body.dark-mode .hd-list [style*="border-bottom:1px solid #e0e0e0"],
body.dark-mode .hd-list [style*="border-bottom: 1px solid rgb(224, 224, 224)"],
body.dark-mode .hd-list [style*="border-top: 1px solid #e8e8e8"],
body.dark-mode .hd-list [style*="border-top:1px solid #e8e8e8"],
body.dark-mode .hd-list [style*="border-top: 1px solid rgb(232, 232, 232)"] {
  border-color: rgba(255,255,255,0.08) !important;
}

/* Trennstrich auf Health-Deal Details-Section beibehalten — User mag ihn,
   nur die Hex→rgb()-Re-Serialisierung von #e8e8e8 zuverlässig dimmen
   (sonst bleibt der bright-gray-Balken auf dunklem Hintergrund) */
body.dark-mode .hd-list > div > div[id^="deal-details-"] {
  border-top: 1px solid rgba(255,255,255,0.08) !important;
}

/* === AE Member dropdown — robust hover/active override
   When JS sets `element.style.background = '#xxxxxx'`, the browser re-serializes
   the value to `rgb(R, G, B)`, so we need both hex AND rgb() selectors. === */
body.dark-mode #ae-member-list > div[onclick] {
  color: #E5E5EA !important;
}
/* Hover state (JS sets #f5f5f5 inline → rgb(245, 245, 245)) */
body.dark-mode #ae-member-list > div[onclick]:hover,
body.dark-mode #ae-member-list > div[style*="background: #f5f5f5"],
body.dark-mode #ae-member-list > div[style*="background:#f5f5f5"],
body.dark-mode #ae-member-list > div[style*="rgb(245, 245, 245)"],
body.dark-mode #ae-member-list > div[style*="rgb(245,245,245)"] {
  background: rgba(255,60,28,0.18) !important;
  color: #ff7a63 !important;
}
/* Active state (initial: #f0f4ff; after JS: rgb(240, 244, 255)) */
body.dark-mode #ae-member-list > div[style*="background: #f0f4ff"],
body.dark-mode #ae-member-list > div[style*="background:#f0f4ff"],
body.dark-mode #ae-member-list > div[style*="rgb(240, 244, 255)"],
body.dark-mode #ae-member-list > div[style*="rgb(240,244,255)"] {
  background: rgba(255,60,28,0.22) !important;
  color: #ff7a63 !important;
}

/* Adaptive avatar tint based on category */
.health-deal-avatar-red { background: linear-gradient(135deg, #af1000 0%, #d91507 100%) !important; }
.health-deal-avatar-yellow { background: linear-gradient(135deg, #c77700 0%, #ef6c00 100%) !important; }
.health-deal-avatar-green { background: linear-gradient(135deg, #2e7d32 0%, #43a047 100%) !important; }

/* === AE Meeting items inside performance modal — give each its own frame === */
body:not(.dark-mode) #ae-completed-list > div,
body:not(.dark-mode) #ae-failed-list > div {
  background: rgba(255,255,255,0.7) !important;
  border: 1px solid rgba(0,0,0,0.06) !important;
  border-radius: 12px !important;
  margin-bottom: 8px !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

body:not(.dark-mode) #ae-completed-list > div:hover,
body:not(.dark-mode) #ae-failed-list > div:hover {
  background: rgba(255,255,255,0.95) !important;
  border-color: rgba(0,0,0,0.10) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important;
}

/* Dark-mode equivalent — Apple Dark Glass items — einheitlicher subtiler Glas-BG
   über die GANZE Meeting-Box (Header + Details), genauso wie Health-Deal-Modal.
   (`.mp-empty` excluded — empty state behält keinen Card-Frame) */
body.dark-mode #ae-completed-list > div:not(.mp-empty),
body.dark-mode #ae-failed-list > div:not(.mp-empty) {
  background: rgba(255,255,255,0.035) !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  border-radius: 14px !important;
  margin-bottom: 8px !important;
  box-shadow: none !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
body.dark-mode #ae-completed-list > div:not(.mp-empty):hover,
body.dark-mode #ae-failed-list > div:not(.mp-empty):hover {
  background: rgba(255,255,255,0.05) !important;
  border-color: rgba(255,255,255,0.16) !important;
  box-shadow: none !important;
}
body.dark-mode #ae-completed-list > div.mp-empty,
body.dark-mode #ae-failed-list > div.mp-empty {
  background: transparent !important;
  border: 1px dashed rgba(255,255,255,0.10) !important;
  border-radius: 12px !important;
  color: #6E6E73 !important;
}

body.dark-mode #ae-completed-list > div:hover,
body.dark-mode #ae-failed-list > div:hover {
  background: rgba(255,255,255,0.08) !important;
  border-color: rgba(255,255,255,0.14) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important;
}

/* Bright/readable text inside meeting items (titles + label rows + strong) */
body.dark-mode #ae-completed-list > div,
body.dark-mode #ae-failed-list > div {
  color: #E5E5EA;
}
body.dark-mode #ae-completed-list > div > div:first-child,
body.dark-mode #ae-failed-list > div > div:first-child {
  /* Title row ("Meeting", color: #1a1a1a inline) */
  color: #E5E5EA !important;
}
body.dark-mode #ae-completed-list strong,
body.dark-mode #ae-failed-list strong {
  color: #E5E5EA !important;
}
/* Generic dim-text override (any inline color: #555 row inside the lists) */
body.dark-mode #ae-completed-list [style*="color: #555"],
body.dark-mode #ae-completed-list [style*="color:#555"],
body.dark-mode #ae-failed-list [style*="color: #555"],
body.dark-mode #ae-failed-list [style*="color:#555"] {
  color: #C7C7CC !important;
}

/* Premium header action button (PDF Export etc.) */
.header-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  border-radius: 11px;
  border: 1px solid rgba(175,16,0,0.22);
  background: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(253,247,243,0.88) 100%);
  color: #af1000;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 1px 3px rgba(175,16,0,0.08), inset 0 1px 0 rgba(255,255,255,0.4);
  white-space: nowrap;
}

.header-action-btn:hover {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: #fff;
  border-color: rgba(175,16,0,0.5);
  box-shadow: 0 4px 14px rgba(175,16,0,0.28), inset 0 1px 0 rgba(255,255,255,0.2);
  transform: translateY(-1px);
}

/* Live indicator pill (premium status badge) */
.live-indicator {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 6px 12px 6px 11px;
  border-radius: 999px;
  background: rgba(46,125,50,0.10);
  border: 1px solid rgba(46,125,50,0.22);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.4px;
  color: #1e5e22;
  text-transform: uppercase;
}

.live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #2e7d32;
  box-shadow: 0 0 0 0 rgba(46,125,50,0.6);
  animation: liveDotPulse 2.2s ease-in-out infinite;
}

@keyframes liveDotPulse {
  0% { box-shadow: 0 0 0 0 rgba(46,125,50,0.55); }
  70% { box-shadow: 0 0 0 8px rgba(46,125,50,0); }
  100% { box-shadow: 0 0 0 0 rgba(46,125,50,0); }
}

.content-header h1 {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -0.8px;
  color: #1C1C1E;
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

/* Premium gold square button before page title (Analytics pages) */
.page-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: linear-gradient(135deg, #B8952E, #D4AF37, #F0D68A, #D4AF37);
  background-size: 200% 200%;
  animation: goldShimmer 6s ease-in-out infinite;
  color: #ffffff;
  border: 1px solid rgba(140,100,20,0.45);
  box-shadow:
    0 2px 8px rgba(212,175,55,0.32),
    0 1px 2px rgba(140,100,20,0.18),
    inset 0 1px 0 rgba(255,255,255,0.5);
  flex-shrink: 0;
}

.page-title-icon svg {
  display: block;
  filter: drop-shadow(0 1px 1px rgba(140,100,20,0.4));
}

/* Stats Cards */
.stats-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 20px;
  margin-bottom: 32px;
}

.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-bottom: 32px;
}

.stat-card {
  background: linear-gradient(170deg, rgba(255,255,255,0.7) 0%, rgba(245,245,250,0.55) 100%);
  backdrop-filter: blur(30px) saturate(150%);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  padding: 1.5vw;
  border-radius: 18px;
  border: 1.5px solid rgba(255,255,255,0.5);
  box-shadow: 0 4px 20px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.4);
  text-align: center;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.stat-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.4);
  border-color: rgba(255,255,255,0.7);
}

.stat-card.large {
  padding: 2vw;
}

.stat-value {
  font-size: clamp(24px, 2.8vw, 36px);
  font-weight: 800;
  letter-spacing: -1.2px;
  color: #af1000;
  margin-bottom: 8px;
}

.stat-label {
  font-size: clamp(11px, 1vw, 14px);
  color: #8E8E93;
  font-weight: 600;
  letter-spacing: 0.2px;
}

/* Filters */
.filters-row {
  display: flex;
  gap: 16px;
  margin-bottom: 24px;
}

.filter-select,
.search-input {
  padding: 10px 14px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 500;
  background: rgba(255,255,255,0.7);
  color: #1C1C1E;
  letter-spacing: -0.1px;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.03);
}

.filter-select:hover,
.search-input:hover {
  border-color: rgba(0,0,0,0.14);
}

.filter-select:focus,
.search-input:focus {
  outline: none;
  background: rgba(255,255,255,0.95);
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.1), inset 0 1px 2px rgba(0,0,0,0.03);
}

.search-input {
  flex: 1;
}

/* Tables */
.table-container {
  background: linear-gradient(170deg, rgba(255,255,255,0.7) 0%, rgba(245,245,250,0.55) 100%);
  backdrop-filter: blur(30px) saturate(150%);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  border-radius: 18px;
  border: 1.5px solid rgba(255,255,255,0.5);
  box-shadow: 0 4px 20px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.4);
  overflow: hidden;
}

.data-table {
  width: 100%;
  border-collapse: collapse;
}

.data-table thead {
  background: rgba(0,0,0,0.025);
}

.data-table th {
  padding: 14px 16px;
  text-align: left;
  font-weight: 700;
  color: #8E8E93;
  font-size: 11px;
  letter-spacing: 0.6px;
  text-transform: uppercase;
}

.data-table td {
  padding: 14px 16px;
  border-top: 1px solid rgba(0,0,0,0.05);
  color: #1C1C1E;
  font-size: 13.5px;
  letter-spacing: -0.1px;
}

.data-table tbody tr {
  transition: background-color 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}

.data-table tbody tr:hover {
  background: rgba(175,16,0,0.04);
}

.status-badge {
  padding: 4px 11px;
  border-radius: 10px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  border: 1px solid transparent;
}

.status-badge.active {
  background: rgba(46,125,50,0.12);
  color: #2e7d32;
  border-color: rgba(46,125,50,0.18);
}

.status-badge.pending {
  background: rgba(234,179,8,0.14);
  color: #ca8a04;
  border-color: rgba(234,179,8,0.2);
}

.status-badge.inactive {
  background: rgba(175,16,0,0.1);
  color: #af1000;
  border-color: rgba(175,16,0,0.18);
}

.action-btn {
  padding: 6px 12px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 8px;
  background: rgba(255,255,255,0.7);
  color: #1C1C1E;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  margin-right: 4px;
}

.action-btn:hover {
  background: rgba(255,255,255,0.95);
  border-color: rgba(175,16,0,0.3);
  color: #af1000;
}

.action-btn.danger:hover {
  background: rgba(175,16,0,0.08);
  border-color: rgba(175,16,0,0.3);
  color: #af1000;
}

.action-btn-small {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 12px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  background: rgba(255,255,255,0.7);
  color: #1C1C1E;
  font-family: inherit;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
  margin-right: 8px;
}

.action-btn-small svg {
  width: 16px;
  height: 16px;
  opacity: 0.7;
  transition: opacity 0.2s;
}

.action-btn-small:hover {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  border-color: rgba(175,16,0,0.55);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 3px 10px rgba(175,16,0,0.28), inset 0 1px 0 rgba(255,255,255,0.18);
}

.action-btn-small:hover svg {
  opacity: 1;
}

.action-btn-small.danger:hover {
  background: linear-gradient(135deg, #c41e3a 0%, #e53e3e 100%);
  border-color: rgba(196,30,58,0.55);
  color: #fff;
  box-shadow: 0 3px 10px rgba(196,30,58,0.30), inset 0 1px 0 rgba(255,255,255,0.18);
}

/* === Member Dropdown (Zuständig column) === */
.member-dropdown {
  padding: 7px 30px 7px 12px;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  background: rgba(255,255,255,0.7);
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 600;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.03);
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%238E8E93' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px 10px;
}
.member-dropdown:hover {
  border-color: rgba(0,0,0,0.14);
  background-color: rgba(255,255,255,0.92);
}
.member-dropdown:focus {
  outline: none;
  background-color: rgba(255,255,255,0.98);
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.1), inset 0 1px 2px rgba(0,0,0,0.03);
}

.action-btn-small:active {
  transform: translateY(0);
}

/* Configuration Sections — Apple Glass Cards */
.config-section {
  background: linear-gradient(170deg, rgba(255,255,255,0.7) 0%, rgba(245,245,250,0.55) 100%);
  backdrop-filter: blur(30px) saturate(150%);
  -webkit-backdrop-filter: blur(30px) saturate(150%);
  padding: 26px 28px;
  border-radius: 20px;
  border: 1.5px solid rgba(255,255,255,0.5);
  box-shadow: 0 4px 20px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.4);
  margin-bottom: 20px;
}

.config-section h2 {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.4px;
  margin: 0;
  color: #1C1C1E;
  line-height: 1.2;
}

.config-hint {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  color: #8E8E93;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.1px;
  margin: 0 0 18px;
  line-height: 1.55;
}

/* Section Header: Icon + Eyebrow + Title */
.config-section-head {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-bottom: 18px;
}
.config-section-icon {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  border: 1px solid rgba(175,16,0,0.55);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 3px 10px rgba(175,16,0,0.28), inset 0 1px 0 rgba(255,255,255,0.18);
}
.config-section-eyebrow {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  color: #af1000;
  margin-bottom: 2px;
}

/* Subsection (within config-section) */
.config-subsection-head {
  padding-top: 18px;
  margin-bottom: 14px;
}
.config-subsection-head h3 {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -0.3px;
  color: #1C1C1E;
  margin: 0 0 4px;
}
.config-subsection-head p {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  color: #8E8E93;
  margin: 0;
  line-height: 1.5;
  letter-spacing: -0.05px;
}

.config-separator {
  border-top: 1px solid rgba(0,0,0,0.08);
  margin: 24px 0 4px;
}

.config-action-row {
  display: flex;
  gap: 10px;
  margin-top: 4px;
  flex-wrap: wrap;
}

/* Loading state */
.config-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 30px 20px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: #8E8E93;
}
.config-spinner {
  width: 18px;
  height: 18px;
  border: 2px solid rgba(175,16,0,0.15);
  border-top-color: #af1000;
  border-radius: 50%;
  animation: spin 0.8s linear infinite;
}

/* Team Logo Upload */
.logo-upload-wrap {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.logo-preview {
  width: 120px;
  height: 80px;
  border: 1.5px dashed rgba(0,0,0,0.15);
  border-radius: 10px;
  background: rgba(0,0,0,0.02);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: border-color 0.2s;
}
.logo-preview:hover {
  border-color: rgba(0,0,0,0.25);
}
.logo-preview img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}
.logo-preview-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #B0B0B5;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 600;
}
.logo-upload-actions {
  display: flex;
  gap: 8px;
}
.logo-upload-actions .secondary-btn {
  padding: 7px 14px;
  font-size: 13px;
}

/* Coming Soon Pill */
.config-soon-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  border-radius: 10px;
  background: rgba(0,0,0,0.04);
  border: 1px dashed rgba(0,0,0,0.12);
  color: #8E8E93;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: -0.05px;
}

/* CRM Provider Cards */
.config-crm-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
.config-crm-card {
  padding: 24px 20px;
  border-radius: 16px;
  text-align: center;
  cursor: pointer;
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(250,250,253,0.65) 100%);
  border: 1.5px solid rgba(0,0,0,0.08);
  box-shadow: 0 2px 8px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.5);
  transition: all 0.22s cubic-bezier(0.4,0,0.2,1);
}
.config-crm-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(0,0,0,0.08), inset 0 1px 0 rgba(255,255,255,0.6);
}
.config-crm-card-hubspot:hover { border-color: rgba(255,122,89,0.55); }
.config-crm-card-salesforce:hover { border-color: rgba(0,161,224,0.55); }
.config-crm-logo {
  width: 44px;
  height: 44px;
  margin: 0 auto 12px;
  display: block;
  object-fit: contain;
}
.config-crm-name {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: #1C1C1E;
  letter-spacing: -0.3px;
  margin-bottom: 4px;
}
.config-crm-desc {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #8E8E93;
  margin-bottom: 14px;
  letter-spacing: -0.05px;
}
.config-crm-cta {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 6px 14px;
  border-radius: 999px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.05px;
  transition: all 0.18s ease;
}
.config-crm-card-hubspot .config-crm-cta { color: #d9663f; background: rgba(255,122,89,0.10); border: 1px solid rgba(255,122,89,0.22); }
.config-crm-card-salesforce .config-crm-cta { color: #007fb3; background: rgba(0,161,224,0.10); border: 1px solid rgba(0,161,224,0.22); }
.config-crm-card:hover .config-crm-cta { transform: translateX(2px); }

/* CRM Connected State */
.config-crm-connected {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(250,250,253,0.65) 100%);
  border: 1.5px solid rgba(0,0,0,0.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.config-crm-connected-left {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
  flex: 1;
}
.config-crm-connected-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(0,0,0,0.04);
}
.config-crm-connected-icon img { width: 24px; height: 24px; object-fit: contain; }
.config-crm-connected-meta { min-width: 0; flex: 1; }
.config-crm-connected-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 2px;
}
.config-crm-connected-name {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 800;
  font-size: 15px;
  color: #1C1C1E;
  letter-spacing: -0.3px;
}
.config-crm-connected-email {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  color: #6e6e73;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: -0.05px;
}
.config-crm-connected-hint {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  color: #8E8E93;
  font-size: 11px;
  font-weight: 500;
  margin-top: 2px;
  letter-spacing: 0.05px;
}
.config-crm-disconnect-btn {
  display: inline-flex;
  align-items: center;
  padding: 8px 14px;
  border-radius: 10px;
  border: 1px solid rgba(196,30,58,0.30);
  background: rgba(196,30,58,0.06);
  color: #c41e3a;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  letter-spacing: -0.05px;
  cursor: pointer;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  flex-shrink: 0;
}
.config-crm-disconnect-btn:hover {
  background: rgba(196,30,58,0.12);
  border-color: rgba(196,30,58,0.45);
  transform: translateY(-1px);
}

/* Deal-Kategorien Grid */
.config-deal-grid {
  display: grid;
  gap: 14px;
  max-width: 600px;
}
.deal-category-config {
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(170deg, rgba(255,255,255,0.7) 0%, rgba(250,250,253,0.5) 100%);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.config-deal-label {
  display: block;
  margin-bottom: 10px;
}
.config-deal-input-wrap {
  position: relative;
}
.config-deal-input-wrap .form-input {
  padding-right: 36px;
}
.config-deal-currency {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 13px;
  font-weight: 800;
  color: #8E8E93;
  pointer-events: none;
}

.form-group {
  margin-bottom: 18px;
}

.form-group label {
  display: block;
  margin-bottom: 7px;
  font-weight: 600;
  color: #1C1C1E;
  font-size: 12.5px;
  letter-spacing: 0.1px;
}

.form-input {
  width: 100%;
  padding: 11px 14px;
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 500;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.03);
}

.form-input:hover {
  border-color: rgba(0,0,0,0.14);
}

.form-input:focus {
  outline: none;
  background: rgba(255,255,255,0.95);
  border-color: rgba(175,16,0,0.4);
  box-shadow: 0 0 0 3px rgba(175,16,0,0.1), inset 0 1px 2px rgba(0,0,0,0.03);
}

/* Modal — Apple Glass */
.modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(12px) saturate(120%);
  -webkit-backdrop-filter: blur(12px) saturate(120%);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 1000;
}

.modal-content {
  background: linear-gradient(170deg, rgba(255,255,255,0.92) 0%, rgba(248,248,252,0.86) 100%);
  backdrop-filter: blur(40px) saturate(150%);
  -webkit-backdrop-filter: blur(40px) saturate(150%);
  border: 1.5px solid rgba(255,255,255,0.6);
  border-radius: 22px;
  box-shadow: 0 24px 60px rgba(0,0,0,0.18), 0 8px 20px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,0.4);
  min-width: 500px;
  max-width: 90%;
  max-height: 90vh;
  overflow: auto;
}

.modal-header {
  padding: 22px 26px 18px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal-header h2 {
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -0.4px;
  color: #1C1C1E;
}

.modal-close {
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.06);
  font-size: 22px;
  color: #8E8E93;
  cursor: pointer;
  padding: 0;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  transition: all 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.modal-close:hover {
  background: rgba(175,16,0,0.08);
  color: #af1000;
  border-color: rgba(175,16,0,0.18);
  transform: rotate(90deg);
}

.modal-body {
  padding: 22px 26px;
}

.modal-footer {
  padding: 18px 26px 22px;
  border-top: 1px solid rgba(0,0,0,0.06);
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

/* Confirm Delete Modal - Special Styling */
#confirm-delete-modal .modal-content {
  animation: slideInDown 0.3s ease-out;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}

#confirm-delete-modal .modal-overlay {
  background: rgba(0, 0, 0, 0.6);
  backdrop-filter: blur(4px);
}

#confirm-delete-modal .modal-header {
  background: linear-gradient(135deg, var(--primary-color), var(--primary-hover));
  color: white;
  border-bottom: none;
  padding: 20px 24px;
}

#confirm-delete-modal .modal-header h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
}

#confirm-delete-modal .modal-body {
  padding: 32px 24px;
  background: white;
}

#confirm-delete-modal .modal-body p {
  line-height: 1.6;
}

#confirm-delete-modal .modal-footer {
  background: #fafafa;
  border-top: 1px solid var(--border-color);
}

#confirm-delete-modal .danger-btn {
  background: linear-gradient(135deg, var(--primary-color), var(--primary-hover));
  color: white;
  padding: 12px 24px;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  box-shadow: 0 4px 12px rgba(175, 16, 0, 0.3);
}

#confirm-delete-modal .danger-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(175, 16, 0, 0.4);
}

#confirm-delete-modal .danger-btn:active {
  transform: translateY(0);
}

#confirm-delete-modal .secondary-btn {
  background: white;
  color: var(--text-primary);
  border: 1px solid var(--border-color);
}

#confirm-delete-modal .secondary-btn:hover {
  background: var(--background);
}

@keyframes slideInDown {
  from {
    opacity: 0;
    transform: translateY(-50px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.error-message {
  padding: 12px;
  background: #ffebee;
  color: var(--danger-color);
  border-radius: 8px;
  font-size: 14px;
  margin-top: 16px;
}

/* Analytics */
.analytics-section {
  background: white;
  padding: 24px;
  border-radius: 12px;
  box-shadow: var(--shadow);
  margin-bottom: 24px;
  width: calc(100vw - 100px);
  margin-left: 0;
  margin-right: 0;
  transform-origin: top left;
  transform: scale(clamp(0.5, 100vw / 1800, 1));
  transition: transform 0.2s ease;
}

.analytics-section h2 {
  font-size: 20px;
  margin-bottom: 20px;
  color: var(--text-primary);
}

.chart-container {
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  color: var(--text-secondary);
}

/* Responsive */
@media (max-width: 768px) {
  .console-header {
    flex-direction: column;
    gap: 16px;
    padding: 16px;
  }

  .console-nav {
    overflow-x: auto;
    padding: 0 16px;
  }

  .console-content {
    padding: 16px;
  }

  .filters-row {
    flex-direction: column;
  }

  .stats-row {
    grid-template-columns: 1fr;
  }

  .modal-content {
    min-width: auto;
    width: 95%;
  }
}

/* Toast Notifications */
#toast-container {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 10000;
  pointer-events: none;
}

.toast {
  position: relative;
  background: linear-gradient(170deg, rgba(255,255,255,0.92) 0%, rgba(252,250,255,0.86) 100%);
  -webkit-backdrop-filter: blur(40px) saturate(180%);
  backdrop-filter: blur(40px) saturate(180%);
  border: 1.5px solid rgba(0,0,0,0.08);
  border-radius: 16px;
  box-shadow:
    0 0 0 1px rgba(0,0,0,0.04),
    0 12px 32px rgba(0,0,0,0.16),
    0 4px 12px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.55);
  padding: 14px 16px 14px 18px;
  margin-bottom: 12px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 320px;
  max-width: 420px;
  pointer-events: auto;
  animation: toastSlideIn 0.3s cubic-bezier(0.34, 1.2, 0.64, 1);
  overflow: hidden;
}
.toast::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(180deg, #34c759 0%, #2ea44f 100%);
  border-radius: 16px 0 0 16px;
}
@keyframes toastSlideIn {
  from { opacity: 0; transform: translateX(20px) scale(0.96); }
  to   { opacity: 1; transform: translateX(0) scale(1); }
}

.toast.toast-success::before { background: linear-gradient(180deg, #34c759 0%, #2ea44f 100%); }
.toast.toast-error::before   { background: linear-gradient(180deg, #ff453a 0%, #c41e3a 100%); }
.toast.toast-info::before    { background: linear-gradient(180deg, #0a84ff 0%, #0066d6 100%); }
.toast.toast-warning::before { background: linear-gradient(180deg, #ff9f0a 0%, #b35900 100%); }

.toast-icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 17px;
  font-weight: 800;
  color: #fff;
}
.toast.toast-success .toast-icon { background: linear-gradient(135deg, #34c759 0%, #2ea44f 100%); box-shadow: 0 2px 6px rgba(52,199,89,0.30); }
.toast.toast-error   .toast-icon { background: linear-gradient(135deg, #ff453a 0%, #c41e3a 100%); box-shadow: 0 2px 6px rgba(196,30,58,0.30); }
.toast.toast-info    .toast-icon { background: linear-gradient(135deg, #0a84ff 0%, #0066d6 100%); box-shadow: 0 2px 6px rgba(10,132,255,0.30); }
.toast.toast-warning .toast-icon { background: linear-gradient(135deg, #ff9f0a 0%, #b35900 100%); box-shadow: 0 2px 6px rgba(255,159,10,0.30); }

.toast-content {
  flex: 1;
  min-width: 0;
}

.toast-title {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'SF Pro Display', sans-serif;
  font-weight: 800;
  font-size: 13.5px;
  letter-spacing: -0.2px;
  color: #1C1C1E;
  margin-bottom: 3px;
  line-height: 1.2;
}

.toast-message {
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  font-weight: 500;
  color: #6e6e73;
  line-height: 1.4;
  letter-spacing: -0.1px;
}

.toast-close {
  background: rgba(0,0,0,0.04);
  border: 1px solid rgba(0,0,0,0.05);
  color: #8E8E93;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
  width: 26px;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  transition: all 0.18s cubic-bezier(0.4,0,0.2,1);
  flex-shrink: 0;
}

.toast-close:hover {
  background: rgba(0,0,0,0.10);
  color: #1C1C1E;
  border-color: rgba(0,0,0,0.10);
}

.toast.toast-hiding {
  animation: slideOutRight 0.3s ease-out forwards;
}

@keyframes slideInRight {
  from {
    transform: translateX(400px);
    opacity: 0;
  }
  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slideOutRight {
  from {
    transform: translateX(0);
    opacity: 1;
  }
  to {
    transform: translateX(400px);
    opacity: 0;
  }
}

/* CSV Import Table - Excel Style */
#csv-preview-table {
  border: 1px solid #d0d0d0;
}

#csv-preview-table thead th {
  background: linear-gradient(180deg, #f8f8f8 0%, #efefef 100%);
  border: 1px solid #d0d0d0;
  padding: 10px 12px;
  text-align: left;
  font-weight: 600;
  font-size: 13px;
  color: #333;
  position: sticky;
  top: 0;
  z-index: 10;
}

#csv-preview-table tbody td {
  border: 1px solid #e0e0e0;
  padding: 8px 12px;
  background: white;
  cursor: text;
  transition: background 0.2s;
  min-width: 120px;
}

#csv-preview-table tbody td:hover {
  background: #f5f9ff;
}

#csv-preview-table tbody td:focus {
  background: #fff;
  outline: 2px solid #2196f3;
  outline-offset: -2px;
}

#csv-preview-table tbody tr:nth-child(even) td {
  background: #fafafa;
}

#csv-preview-table tbody tr:nth-child(even) td:hover {
  background: #f5f9ff;
}

/* Editable cell */
#csv-preview-table tbody td[contenteditable="true"] {
  position: relative;
}

#csv-preview-table tbody td[contenteditable="true"]:before {
  content: '✎';
  position: absolute;
  right: 4px;
  top: 4px;
  font-size: 10px;
  color: #999;
  opacity: 0;
  transition: opacity 0.2s;
}

#csv-preview-table tbody td[contenteditable="true"]:hover:before {
  opacity: 1;
}

/* Health tooltip */
.health-tooltip {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: #333;
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.4;
  padding: 8px 12px;
  border-radius: 6px;
  white-space: nowrap;
  pointer-events: none;
  transition: opacity 0.15s, visibility 0.15s;
  z-index: 10;
}

.health-tooltip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #333;
}

.health-tooltip-wrap:hover .health-tooltip {
  visibility: visible;
  opacity: 1;
}

/* PDF Export Modal */
.pdf-checkbox-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.pdf-checkbox-list label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--text-primary);
  cursor: pointer;
  padding: 6px 8px;
  border-radius: 6px;
  transition: background 0.15s;
}
.pdf-checkbox-list label:hover {
  background: rgba(91, 45, 91, 0.04);
}
.pdf-checkbox-list input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #5B2D5B;
  flex-shrink: 0;
}

/* ── Invite Wizard Step Indicator ── */
.invite-step-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 8px;
}
.invite-step-dot {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(0,0,0,0.06);
  border: 1px solid rgba(0,0,0,0.05);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s cubic-bezier(0.4,0,0.2,1);
  flex-shrink: 0;
}
.invite-step-dot.active {
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  border-color: rgba(175,16,0,0.55);
  box-shadow: 0 3px 10px rgba(175,16,0,0.30), inset 0 1px 0 rgba(255,255,255,0.18);
}
.invite-step-dot.active .invite-step-number {
  color: #fff;
}
.invite-step-dot.completed {
  background: linear-gradient(135deg, #34c759 0%, #2ea44f 100%);
  border-color: rgba(52,199,89,0.55);
  box-shadow: 0 2px 6px rgba(52,199,89,0.25);
}
.invite-step-dot.completed .invite-step-number {
  color: #fff;
}
.invite-step-number {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 12.5px;
  font-weight: 800;
  color: #8E8E93;
  line-height: 1;
  letter-spacing: -0.2px;
}
.invite-step-line {
  width: 38px;
  height: 2px;
  background: rgba(0,0,0,0.08);
  border-radius: 1px;
  transition: background 0.3s ease;
}
.invite-step-line.active {
  background: linear-gradient(90deg, #34c759 0%, #2ea44f 100%);
}
.invite-step-label {
  text-align: center;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  color: #8E8E93;
  margin: 10px 0 18px;
}
.invite-step {
  animation: inviteStepIn 0.25s ease;
}
@keyframes inviteStepIn {
  from { opacity: 0; transform: translateX(12px); }
  to { opacity: 1; transform: translateX(0); }
}
.invite-hint {
  font-size: 12px;
  color: var(--text-secondary, #888);
  line-height: 1.5;
  margin-top: 4px;
}
.invite-summary {
  background: linear-gradient(170deg, rgba(255,255,255,0.85) 0%, rgba(250,250,253,0.65) 100%);
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 16px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.6;
  color: #1C1C1E;
  letter-spacing: -0.1px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.5);
}
.invite-summary strong {
  color: #1C1C1E;
  font-weight: 700;
}
.invite-email-toggle {
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255,255,255,0.7);
}
.invite-email-toggle-header {
  padding: 11px 14px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Inter', sans-serif;
  font-size: 12.5px;
  color: #af1000;
  cursor: pointer;
  font-weight: 700;
  letter-spacing: -0.1px;
  user-select: none;
  transition: background 0.15s ease;
}
.invite-email-toggle-header:hover {
  background: rgba(175,16,0,0.04);
}
.invite-email-toggle-body {
  padding: 0 14px 14px;
}
.primary-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
/* CRM Owner Matching in Invite Wizard */
#invite-crm-owner-section {
  animation: inviteStepIn 0.25s ease;
}
#invite-crm-owner-hint {
  font-size: 11px;
  color: #888;
  margin-top: 4px;
  line-height: 1.4;
}

/* ============================================
   Stage-Verweildauer Toggle (Premium LavaSuite Design)
   ============================================ */
.pq-stages-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 13px 18px;
  border-radius: 14px;
  background: linear-gradient(170deg, rgba(255,255,255,0.92) 0%, rgba(250,250,253,0.78) 100%);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow:
    0 1px 2px rgba(0,0,0,0.03),
    inset 0 1px 0 rgba(255,255,255,0.6);
  cursor: pointer;
  user-select: none;
  margin-bottom: 12px;
  transition: transform 0.18s cubic-bezier(0.4,0,0.2,1),
              box-shadow 0.18s cubic-bezier(0.4,0,0.2,1),
              border-color 0.18s cubic-bezier(0.4,0,0.2,1);
}
.pq-stages-toggle:hover {
  transform: translateY(-1px);
  border-color: rgba(175,16,0,0.18);
  box-shadow:
    0 4px 14px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.7);
}
.pq-stages-toggle-left {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}
.pq-stages-toggle-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 26px;
  height: 26px;
  padding: 0 9px;
  border-radius: 8px;
  background: linear-gradient(135deg, #af1000 0%, #d91507 100%);
  color: #ffffff;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: -0.1px;
  box-shadow: 0 1px 3px rgba(175,16,0,0.25);
}
.pq-stages-toggle-label {
  font-size: 13.5px;
  font-weight: 700;
  color: #1C1C1E;
  letter-spacing: -0.1px;
}
.pq-stages-toggle-hint {
  font-size: 12px;
  font-weight: 500;
  color: #8E8E93;
  letter-spacing: -0.05px;
}
.pq-stages-toggle-chevron {
  width: 18px;
  height: 18px;
  color: #8E8E93;
  transition: transform 0.22s cubic-bezier(0.4,0,0.2,1), color 0.18s ease;
  flex-shrink: 0;
}
.pq-stages-toggle:hover .pq-stages-toggle-chevron {
  color: #af1000;
}
.pq-stages-toggle.is-open .pq-stages-toggle-chevron {
  transform: rotate(180deg);
}
.pq-stages-body {
  display: none;
  animation: pqStagesIn 0.28s cubic-bezier(0.4,0,0.2,1);
}
.pq-stages-body.is-open {
  display: block;
}
@keyframes pqStagesIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Tester-Hinweis Banner (nur in Discovery sichtbar) */
.pq-tester-hint {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  margin-bottom: 12px;
  border-radius: 12px;
  background: linear-gradient(170deg, rgba(59,130,246,0.06) 0%, rgba(59,130,246,0.03) 100%);
  border: 1px solid rgba(59,130,246,0.22);
  color: #4B5563;
  font-size: 12.5px;
  line-height: 1.5;
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
}
.pq-tester-hint-icon {
  width: 16px;
  height: 16px;
  color: #3B82F6;
  flex-shrink: 0;
  margin-top: 1px;
}
.pq-tester-hint strong {
  color: #1E40AF;
  font-weight: 700;
}

/* === DARK MODE === */
body.dark-mode .pq-stages-toggle {
  background: linear-gradient(170deg, rgba(44,44,46,0.55) 0%, rgba(31,31,34,0.42) 100%);
  border-color: rgba(255,255,255,0.08);
  box-shadow:
    0 1px 2px rgba(0,0,0,0.4),
    inset 0 1px 0 rgba(255,255,255,0.06);
}
body.dark-mode .pq-stages-toggle:hover {
  border-color: rgba(255,60,28,0.35);
  box-shadow:
    0 4px 16px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,255,255,0.08);
}
body.dark-mode .pq-stages-toggle-label {
  color: #E5E5EA;
}
body.dark-mode .pq-stages-toggle-hint {
  color: #AEAEB2;
}
body.dark-mode .pq-stages-toggle-chevron {
  color: #AEAEB2;
}
body.dark-mode .pq-stages-toggle:hover .pq-stages-toggle-chevron {
  color: #ff5e3a;
}
body.dark-mode .pq-tester-hint {
  background: linear-gradient(170deg, rgba(59,130,246,0.10) 0%, rgba(59,130,246,0.05) 100%);
  border-color: rgba(96,165,250,0.30);
  color: #CBD5E1;
}
body.dark-mode .pq-tester-hint strong {
  color: #93C5FD;
}

/* Sprach-Pill (DE/EN) — Light Glass, sitzt links vom Zahnrad in header-right.
   Material und Höhe matched zu .settings-gear-btn damit beide visuell als Gruppe wirken.
   Aktiver Button bekommt mehr Weißton + subtilen Shadow für eingedrückten Effekt. */
.lang-pill {
  display: inline-flex; align-items: center; gap: 2px;
  padding: 3px;
  border-radius: 10px;
  background: rgba(255,255,255,0.55);
  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 1px 3px rgba(0,0,0,0.05), inset 0 1px 0 rgba(255,255,255,0.4);
  transition: background 0.28s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  height: 32px;
}
.lang-pill:hover { background: rgba(255,255,255,0.78); border-color: rgba(0,0,0,0.10); }
.lang-pill-btn {
  background: transparent; border: none; cursor: pointer;
  padding: 4px 10px;
  border-radius: 7px;
  font-family: inherit; font-size: 11px; font-weight: 800; letter-spacing: 0.5px;
  color: rgba(28,28,30,0.45);
  transition: all 0.18s cubic-bezier(0.4, 0, 0.2, 1);
}
.lang-pill-btn:hover { color: rgba(28,28,30,0.80); }
.lang-pill-btn:focus { outline: none; }
.lang-pill-btn.is-active {
  background: #ffffff;
  color: #1C1C1E;
  box-shadow: 0 1px 3px rgba(0,0,0,0.10), inset 0 1px 0 rgba(255,255,255,0.85);
}

body.dark-mode .lang-pill {
  background: rgba(255,255,255,0.06);
  border-color: rgba(255,255,255,0.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}
body.dark-mode .lang-pill:hover {
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.18);
}
body.dark-mode .lang-pill-btn { color: rgba(255,255,255,0.55); }
body.dark-mode .lang-pill-btn:hover { color: rgba(255,255,255,0.90); }
body.dark-mode .lang-pill-btn.is-active {
  background: rgba(255,255,255,0.18);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.22), 0 1px 3px rgba(0,0,0,0.20);
}