/* =============================================================================
   LEADS Kinetic Curator — APEX Theme Override
   =============================================================================
   Überschreibt das APEX Universal Theme mit dem Kinetic Curator Design System.

   Einbindung in APEX:
     Shared Components > User Interface Attributes > CSS > File URLs:
     #APP_IMAGES#APEX/leado-kinetic.css
   ============================================================================= */

   @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@600;700;800&family=Manrope:wght@400;500;600;700&display=swap');

   /* ── Design Tokens als CSS Variables ──────────────────────────────────────── */
   
   :root {
    --ld-brand: #4546e7;
    --ld-brand-dark: #7848a7;
     --ld-brand-light: #eef0ff;
     --ld-brand-rgb: 69, 70, 231;
   
     --ld-hell-violett: #CC99FF;
     --ld-dunkel-violett: #d8d8ff;
     --ld-secondary-container: #f0dbff;
     --ld-hell-blau: #6DB6E5;
     --ld-hell-tuerkis: #99FFCC;
     --ld-dunkel-tuerkis: #b1f1e8;
     --ld-rosa: #ffede9;
     --ld-hell-grau: #f2f6f9;
     --ld-dunkel-grau: #dfe8ee;
   
    --ld-surface: #f6fafd;
    --ld-surf-low: #eff4f8;
    --ld-surf-high: #dae4ea;
   
     --ld-on-surface: #2a3438;
     --ld-on-surface-var: #576165;
     --ld-outline-var: #aab3b9;
   
     --ld-success: #34D399;
     --ld-success-bg: #94fac7;
     --ld-warning: #F59E0B;
     --ld-warning-bg: #fff3d0;
     --ld-danger: #f76a80;
     --ld-danger-bg: #ffe0e5;
   
   --ld-ring:       0 0 0 1px rgba(69, 70, 231, 0.10);
   --ld-ring-sm:    0 0 0 1px rgba(69, 70, 231, 0.07);
   --ld-shadow:     0px 8px 28px rgba(69, 70, 231, 0.12), var(--ld-ring);
   --ld-shadow-sm:  0px 3px 14px rgba(69, 70, 231, 0.09), var(--ld-ring-sm);
    --ld-radius: 16px;
    --ld-radius-lg: 20px;
    --ld-radius-btn: 24px;
    --ld-grad: linear-gradient(135deg, #4546e7, #7848a7);
    /* design.js GRAD_SOFT / SHADOW_BTN_SOFT — hellere Pill-Aktionen */
    --ld-grad-soft: linear-gradient(135deg, #8b63f1, #b48dff);
    --ld-grad-soft-hover: linear-gradient(135deg, #7650e6, #a67dff);
    --ld-shadow-btn-soft: 0 3px 12px rgba(139, 99, 241, 0.28);
   }
   
  /* ── Global Reset & Base ──────────────────────────────────────────────────── */

  /* Verhindert weissen Browser-Flash beim Seitenwechsel */
  html {
    background: #f6fafd !important;
  }

  body {
    font-family: 'Manrope', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
    background: var(--ld-surface) !important;
    color: var(--ld-on-surface) !important;
  }

  /* ── Page Transition ─────────────────────────────────────────────────────── */

  @keyframes ld-page-fadein {
    from {
      opacity: 0;
      transform: translateY(5px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .t-Body-main {
    animation: ld-page-fadein 0.18s ease forwards;
  }

  /* Fade-out Zustand kurz vor Navigation (via JS gesetzt) */
  .ld-page-leaving .t-Body-main {
    opacity: 0;
    transform: translateY(-3px);
    transition: opacity 0.1s ease, transform 0.1s ease;
    pointer-events: none;
  }
   
   /* ══════════════════════════════════════════════════════════════════════════
      Lead Engine Sidebar — #ld-sidebar (injiziert direkt in document.body)
      Kein Konflikt mit APEX's widget.treeView.js oder leftSideCol()
      ══════════════════════════════════════════════════════════════════════════ */

  /* ── Sidebar Container ───────────────────────────────────────────────────── */

  #ld-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    width: 240px;
    height: 100vh;
    z-index: 9999;
    background: #ffffff;
    display: flex;
    flex-direction: column;
    box-shadow: 4px 0 20px rgba(75, 77, 237, 0.08);
    transition: width 0.22s ease;
    overflow: hidden;
    font-family: 'Manrope', sans-serif;
  }

  /* ── Logo / Branding ─────────────────────────────────────────────────────── */

  .ldsb-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 20px 16px 16px;
    background: linear-gradient(135deg, var(--ld-brand), var(--ld-hell-violett));
    flex-shrink: 0;
    position: relative;
  }

  .ldsb-logo-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #ffffff;
    font-size: 14px;
  }

  .ldsb-logo-text {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-size: 16px;
    font-weight: 800;
    color: #ffffff;
    letter-spacing: -0.3px;
    white-space: nowrap;
    flex: 1;
  }

  .ldsb-toggle {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 10px;
    flex-shrink: 0;
    transition: background 0.15s ease;
  }

  .ldsb-toggle:hover {
    background: rgba(255, 255, 255, 0.35);
  }

  /* ── Nav Container ───────────────────────────────────────────────────────── */

  .ldsb-nav {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0;
  }

  /* ── Section Labels ──────────────────────────────────────────────────────── */

  .ldsb-section {
    pointer-events: none;
    user-select: none;
    margin-top: 6px;
  }

  .ldsb-section-label {
    display: block;
    font-size: 10px;
    font-weight: 800;
    color: var(--ld-brand);
    letter-spacing: 1.8px;
    text-transform: uppercase;
    padding: 14px 18px 5px;
    opacity: 0.65;
  }

  /* ── Nav Items: native <a> Tags — Browser-Navigation ohne JS-Overhead ────── */

  .ldsb-item {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: calc(100% - 16px) !important;
    margin: 2px 8px !important;
    padding: 10px 14px !important;
    border-radius: 12px !important;
    color: var(--ld-on-surface-var) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: background 0.15s ease, color 0.15s ease !important;
    background: transparent !important;
    min-height: 40px !important;
    box-sizing: border-box !important;
  }

  .ldsb-item:hover {
    background: var(--ld-surf-low) !important;
    color: var(--ld-on-surface) !important;
    text-decoration: none !important;
  }

  .ldsb-item:hover .ldsb-icon {
    color: var(--ld-brand) !important;
    opacity: 1 !important;
  }

  .ldsb-item--active {
    background: var(--ld-grad) !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    box-shadow: 0 3px 10px rgba(75, 77, 237, 0.18) !important;
  }

  .ldsb-item--active .ldsb-icon,
  .ldsb-item--active .ldsb-label {
    color: #ffffff !important;
    opacity: 1 !important;
  }

  .ldsb-item--active:hover {
    background: var(--ld-grad) !important;
    color: #ffffff !important;
  }

  /* Unterpunkt unter z. B. AI Agents (Page 8 → Segmente Page 15); Tiefe per Einzug, kein Border */
  .ldsb-item--nested {
    margin-left: 22px !important;
    width: calc(100% - 16px - 22px) !important;
    padding-left: 8px !important;
    font-size: 12.5px !important;
  }

  .ldsb-item--nested .ldsb-label {
    font-weight: 500 !important;
  }

  /* ── Icon + Label ────────────────────────────────────────────────────────── */

  .ldsb-icon {
    width: 18px !important;
    min-width: 18px !important;
    font-size: 13px !important;
    text-align: center !important;
    color: var(--ld-on-surface-var) !important;
    opacity: 0.7 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
  }

  .ldsb-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
  }

  /* ── Spacer ──────────────────────────────────────────────────────────────── */

  .ldsb-spacer {
    flex: 0 0 auto;
    min-height: 8px;
  }

  /* ── Admin Panel ─────────────────────────────────────────────────────────── */

  .ldsb-admin {
    flex-shrink: 0;
    padding: 0 10px 14px;
    box-shadow: 0 -1px 0 rgba(69, 70, 231, 0.08);
  }

  .ldsb-admin-profile {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 8px 8px;
  }

  .ldsb-admin-avatar {
    width: 32px;
    height: 32px;
    min-width: 32px;
    border-radius: 8px;
    background: var(--ld-grad);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-weight: 700;
    font-size: 12px;
    flex-shrink: 0;
  }

  .ldsb-admin-info {
    overflow: hidden;
    flex: 1;
  }

  .ldsb-admin-name {
    font-size: 11px;
    font-weight: 600;
    color: var(--ld-on-surface);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ldsb-admin-role {
    font-size: 10px;
    color: var(--ld-on-surface-var);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ldsb-logout {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 9px 14px;
    border-radius: 24px;
    border: none;
    background: rgba(220, 38, 38, 0.08);
    color: #dc2626 !important;
    font-family: 'Manrope', sans-serif;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
    text-decoration: none !important;
    box-sizing: border-box;
  }

  /* Globales .ldsb-label { flex:1 } würde „Abmelden“ strecken und das Icon nach links drücken */
  .ldsb-logout .ldsb-label {
    flex: 0 1 auto !important;
  }

  .ldsb-logout .ldsb-icon {
    color: #dc2626 !important;
    opacity: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    margin-left: 2px;
  }

  .ldsb-logout:hover {
    background: rgba(220, 38, 38, 0.15) !important;
    text-decoration: none !important;
    color: #dc2626 !important;
  }

  .ldsb-logout:hover .ldsb-icon {
    color: #b91c1c !important;
  }

  /* ── Impersonation Banner ─────────────────────────────────────────────────── */

  .ldsb-impersonate {
    flex-shrink: 0;
    padding: 12px 12px 10px;
    background: linear-gradient(135deg, rgba(75, 77, 237, 0.08), rgba(204, 153, 255, 0.08));
  }

  .ldsb-imp-header {
    display: flex;
    align-items: center;
    gap: 7px;
    margin-bottom: 8px;
  }

  .ldsb-imp-icon {
    font-size: 11px;
    color: var(--ld-brand);
    opacity: 0.8;
  }

  .ldsb-imp-title {
    font-size: 10px;
    font-weight: 800;
    color: var(--ld-brand);
    letter-spacing: 0.8px;
    text-transform: uppercase;
  }

  .ldsb-imp-select {
    width: 100%;
    padding: 8px 10px;
    border-radius: 12px;
    border: none;
    background: #ffffff;
    color: var(--ld-on-surface);
    font-family: 'Manrope', sans-serif;
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(75, 77, 237, 0.10);
    cursor: pointer;
    appearance: auto;
    margin-bottom: 8px;
    box-sizing: border-box;
  }

  .ldsb-imp-select:hover {
    box-shadow: 0 2px 12px rgba(75, 77, 237, 0.18);
  }

  .ldsb-imp-select:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(75, 77, 237, 0.3), 0 2px 8px rgba(75, 77, 237, 0.12);
  }

  .ldsb-imp-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--ld-on-surface);
    padding: 2px 0 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .ldsb-imp-back {
    display: flex !important;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 7px 12px;
    border-radius: 20px;
    background: var(--ld-grad-soft);
    box-shadow: var(--ld-shadow-btn-soft);
    color: #ffffff !important;
    font-family: 'Manrope', sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none !important;
    cursor: pointer;
    transition: background 0.15s ease, box-shadow 0.15s ease;
    white-space: nowrap;
    box-sizing: border-box;
    justify-content: center;
  }

  .ldsb-imp-back:hover {
    background: var(--ld-grad-soft-hover) !important;
    box-shadow: 0 4px 14px rgba(118, 80, 230, 0.35) !important;
    text-decoration: none !important;
    color: #ffffff !important;
  }

  .ldsb-imp-back .fa {
    font-size: 10px;
    flex-shrink: 0;
  }

  /* ── Collapsed State ─────────────────────────────────────────────────────── */

  .ld-nav-collapsed #ld-sidebar {
    width: 64px;
  }

  .ld-nav-collapsed .ldsb-logo-text,
  .ld-nav-collapsed .ldsb-section-label,
  .ld-nav-collapsed .ldsb-label,
  .ld-nav-collapsed .ldsb-admin-info,
  .ld-nav-collapsed .ldsb-logout .ldsb-label {
    display: none !important;
  }

  .ld-nav-collapsed .ldsb-imp-title,
  .ld-nav-collapsed .ldsb-imp-select,
  .ld-nav-collapsed .ldsb-imp-name {
    display: none !important;
  }

  .ld-nav-collapsed .ldsb-impersonate {
    padding: 8px 6px;
    text-align: center;
  }

  .ld-nav-collapsed .ldsb-imp-header {
    justify-content: center;
  }

  .ld-nav-collapsed .ldsb-imp-back {
    width: 36px;
    height: 36px;
    padding: 0;
    border-radius: 50%;
    justify-content: center;
    margin: 4px auto 0;
  }

  .ld-nav-collapsed .ldsb-imp-back .ldsb-label {
    display: none !important;
  }

  .ld-nav-collapsed .ldsb-logo {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 14px 8px 10px;
    gap: 6px;
  }

  .ld-nav-collapsed .ldsb-logo-icon {
    margin: 0;
  }

  .ld-nav-collapsed .ldsb-toggle {
    position: static;
    transform: rotate(180deg);
    width: 22px;
    height: 22px;
    font-size: 9px;
    background: rgba(255, 255, 255, 0.25);
  }

  .ld-nav-collapsed .ldsb-item {
    justify-content: center !important;
    padding: 10px 0 !important;
    margin: 2px 6px !important;
    gap: 0 !important;
    width: calc(100% - 12px) !important;
  }

  .ld-nav-collapsed .ldsb-item--nested {
    margin-left: 6px !important;
    width: calc(100% - 12px) !important;
    padding-left: 0 !important;
  }

  .ld-nav-collapsed .ldsb-icon {
    margin: 0 !important;
    font-size: 16px !important;
    opacity: 0.8 !important;
  }

  .ld-nav-collapsed .ldsb-admin-profile {
    justify-content: center;
    padding: 8px 0;
  }

  .ld-nav-collapsed .ldsb-logout {
    width: 36px;
    height: 36px;
    margin: 0 auto;
    padding: 0;
    border-radius: 50%;
    font-size: 14px;
  }

  /* ── APEX nav + Layout komplett überschreiben ──────────────────────────── */

  /* Hohe Spezifität: APEX 18 hat Regeln wie body.js-rightExpanded #t_Body_actions
     die einfache ID-Selektoren überschreiben. Deshalb body-Präfix + Fallbacks. */
  #t_Body_nav,
  body #t_Body_nav,
  body.js-navExpanded #t_Body_nav,
  body.t-PageBody--showLeft #t_Body_nav,
  .t-Body-nav,
  .t-TreeNav,
  #t_TreeNav,
  .t-Body-side,
  body #t_Body_side,
  #t_Body_side,
  .t-Body-actions,
  body #t_Body_actions,
  body.js-rightExpanded #t_Body_actions,
  body.t-PageBody--showRight #t_Body_actions,
  #t_Body_actions {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
    pointer-events: none !important;
  }

  body:not(.t-PageBody--login) .t-Body > *:not(.t-Body-main):not(.t-Body-inlineDialogs):not(script) {
    display: none !important;
    width: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
  }

  body:not(.t-PageBody--login) .t-Body,
  body.t-PageBody:not(.t-PageBody--login) .t-Body,
  body.t-PageBody--leftNav:not(.t-PageBody--login) .t-Body,
  body.apex-side-nav:not(.t-PageBody--login) .t-Body,
  #t_PageBody:not(.t-PageBody--login) .t-Body,
  .t-PageBody--leftNav:not(.t-PageBody--login) .t-Body {
    display: block !important;
    flex-direction: unset !important;
    flex-wrap: unset !important;
    gap: 0 !important;
    column-gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
  }

  /* APEX 18 erzeugt ein ::before Pseudo-Element auf .t-Body als
     Hintergrund-Panel für die Navigation (via body.apex-side-nav).
     Das ist der "Balken" neben unserer Sidebar — komplett entfernen. */
  body:not(.t-PageBody--login) .t-Body::before,
  body:not(.t-PageBody--login) .t-Body::after,
  .apex-side-nav:not(.t-PageBody--login) .t-Body::before,
  .apex-side-nav:not(.t-PageBody--login) .t-Body::after,
  body.apex-side-nav:not(.t-PageBody--login) .t-Body::before,
  body.apex-side-nav:not(.t-PageBody--login) .t-Body::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
  }

  body:not(.t-PageBody--login) .t-Body .t-Body-main,
  body.t-PageBody:not(.t-PageBody--login) .t-Body .t-Body-main,
  body.t-PageBody--leftNav:not(.t-PageBody--login) .t-Body .t-Body-main,
  body.t-PageBody--leftNav:not(.t-PageBody--login) .t-Body-main,
  .t-PageBody--leftNav:not(.t-PageBody--login) .t-Body-main {
    display: block !important;
    grid-template-columns: none !important;
    grid-template-rows: none !important;
    margin-left: 240px !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    width: auto !important;
    float: none !important;
    left: 0 !important;
    position: relative !important;
    flex: unset !important;
  }

  .ld-nav-collapsed .t-Body-main,
  body.ld-nav-collapsed .t-Body .t-Body-main,
  body.ld-nav-collapsed.t-PageBody--leftNav .t-Body-main {
    margin-left: 64px !important;
  }

  /* APEX Right Side Column — überall komplett entfernen (auch innerhalb t-Body-main) */
  .t-Body-main .t-Body-actions,
  .t-Body-main #t_Body_actions,
  .t-Body-main .t-Body-side,
  .t-Body-main #t_Body_side,
  body.js-rightExpanded .t-Body-main .t-Body-actions,
  body.js-rightExpanded .t-Body-main #t_Body_actions {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
    pointer-events: none !important;
  }

   /* ── APEX Navigation Override ─────────────────────────────────────────────── */
   
   .t-Body-nav,
   .t-TreeNav {
     display: none !important;
   }
   
   /* Navigation Links -- Default */
   .t-TreeNav .a-TreeView-node .a-TreeView-content .a-TreeView-label {
     font-family: 'Manrope', sans-serif !important;
     font-weight: 500 !important;
     color: var(--ld-on-surface-var) !important;
     font-size: 13px !important;
   }
   
   /* APEX TreeView Row -- Reset Default Backgrounds */
   #t_TreeNav .a-TreeView-row {
     background: transparent !important;
   }
   
   #t_TreeNav .a-TreeView-content {
     background: transparent !important;
   }
   
   /* -- Hover: APEX default schwarze Farbe überschreiben -- */
   #t_TreeNav .a-TreeView-row:hover,
   #t_TreeNav .a-TreeView-content:hover .a-TreeView-row,
   .t-TreeNav .a-TreeView-node .a-TreeView-content .a-TreeView-row:hover,
   .t-TreeNav .a-TreeView-node .a-TreeView-content:hover .a-TreeView-row {
     background: var(--ld-surf-low) !important;
     border-radius: 12px !important;
   }
   
   #t_TreeNav .a-TreeView-row:hover .a-TreeView-label,
   #t_TreeNav .a-TreeView-content:hover .a-TreeView-label,
   .t-TreeNav .a-TreeView-node .a-TreeView-row:hover .a-TreeView-label,
   .t-TreeNav .a-TreeView-node .a-TreeView-content:hover .a-TreeView-label {
     color: var(--ld-on-surface) !important;
   }
   
   /* -- Active/Selected: Gradient, kein weisser Hintergrund -- */
   #t_TreeNav .a-TreeView-node.is-selected > .a-TreeView-content,
   #t_TreeNav .a-TreeView-node.is-current > .a-TreeView-content,
   .t-TreeNav .a-TreeView-node.is-selected > .a-TreeView-content,
   .t-TreeNav .a-TreeView-node.is-current > .a-TreeView-content {
     background: var(--ld-grad) !important;
     border-radius: 12px !important;
     box-shadow: 0 3px 10px rgba(75, 77, 237, 0.16) !important;
   }
   
   #t_TreeNav .a-TreeView-node.is-selected > .a-TreeView-content .a-TreeView-row,
   #t_TreeNav .a-TreeView-node.is-current > .a-TreeView-content .a-TreeView-row,
   .t-TreeNav .a-TreeView-node.is-selected > .a-TreeView-content .a-TreeView-row,
   .t-TreeNav .a-TreeView-node.is-current > .a-TreeView-content .a-TreeView-row {
     background: transparent !important;
     box-shadow: none !important;
   }
   
   #t_TreeNav .a-TreeView-node.is-selected > .a-TreeView-content .a-TreeView-row:hover,
   #t_TreeNav .a-TreeView-node.is-current > .a-TreeView-content .a-TreeView-row:hover {
     background: rgba(255, 255, 255, 0.12) !important;
   }
   
   #t_TreeNav .a-TreeView-node.is-selected .a-TreeView-label,
   #t_TreeNav .a-TreeView-node.is-current .a-TreeView-label,
   .t-TreeNav .a-TreeView-node.is-selected .a-TreeView-label,
   .t-TreeNav .a-TreeView-node.is-current .a-TreeView-label {
     color: #ffffff !important;
     font-weight: 600 !important;
   }
   
  #t_TreeNav .a-TreeView-node.is-selected .ld-nav-icon,
  #t_TreeNav .a-TreeView-node.is-current .ld-nav-icon {
    color: #ffffff !important;
    opacity: 1 !important;
  }

  /* Bug-3 Fix: li statt .a-TreeView-node — robuster gegen APEX-interne Klassenmanipulation */
  #t_TreeNav li.is-current .ld-nav-icon,
  #t_TreeNav li.is-selected .ld-nav-icon {
    color: #ffffff !important;
    opacity: 1 !important;
  }
   
   /* -- Focused State: kein schwarzer Outline -- */
   #t_TreeNav .a-TreeView-content.is-focused .a-TreeView-row,
   #t_TreeNav .a-TreeView-content:focus .a-TreeView-row {
     outline: none !important;
     box-shadow: none !important;
   }
   
   #t_TreeNav .a-TreeView-content.is-focused .a-TreeView-label,
   #t_TreeNav .a-TreeView-content:focus .a-TreeView-label {
     color: var(--ld-on-surface-var) !important;
   }
   
   #t_TreeNav .a-TreeView-node.is-selected .a-TreeView-content.is-focused .a-TreeView-label,
   #t_TreeNav .a-TreeView-node.is-current .a-TreeView-content.is-focused .a-TreeView-label {
     color: #ffffff !important;
   }
   
   /* ── Header Badges (Rolle + Mandant, injiziert von nav.js) ────────────────── */
   
   .ld-header-badges {
     display: flex;
     align-items: center;
     gap: 6px;
     margin-right: 8px;
   }
   
   .ld-header-badge {
     padding: 4px 12px;
     border-radius: 16px;
     font-size: 11px;
     font-weight: 600;
     font-family: 'Manrope', sans-serif;
     white-space: nowrap;
     background: var(--ld-surf-low);
     color: var(--ld-on-surface-var);
   }
   
   .ld-header-badge--mandant {
     background: var(--ld-dunkel-violett);
     color: var(--ld-brand);
   }
   
   .ld-header-badge--role[data-role="admin"] {
     background: var(--ld-rosa);
     color: var(--ld-danger);
   }
   
   .ld-header-badge--role[data-role="mandant"] {
     background: var(--ld-surf-low);
     color: var(--ld-on-surface-var);
   }
   
  /* ══════════════════════════════════════════════════════════════════════════
     Login-Seite — Kinetic Curator Design
     ══════════════════════════════════════════════════════════════════════════ */

  /* Sidebar und Nav auf Login-Seite deaktivieren */
  .t-PageBody--login #ld-sidebar,
  body.t-PageBody--login #ld-sidebar {
    display: none !important;
  }

  .t-PageBody--login .t-Body-main,
  .t-PageBody--login.t-PageBody--leftNav .t-Body-main {
    margin-left: 0 !important;
  }

  .t-PageBody--login .t-Header {
    display: none !important;
  }

  .t-PageBody--login #t_Body_nav {
    display: none !important;
  }

  /* Ganzseitiger Gradient-Hintergrund */
  body.t-PageBody--login {
    background: linear-gradient(145deg, #f6fafd 0%, #eef0ff 35%, #f0dbff 70%, #f6fafd 100%) !important;
    min-height: 100vh;
  }

  /* Dekorative Kreise im Hintergrund */
  body.t-PageBody--login::before {
    content: "";
    position: fixed;
    top: -180px;
    right: -120px;
    width: 500px;
    height: 500px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(69, 70, 231, 0.07) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
  }

  body.t-PageBody--login::after {
    content: "";
    position: fixed;
    bottom: -200px;
    left: -100px;
    width: 600px;
    height: 600px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(120, 72, 167, 0.06) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
  }

  /* Gesamte Kette zentrieren: body > #wwvFlowForm > t-Body > t-Body-wrap > t-Body-col > t-Login-container */
  body.t-PageBody--login {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
  }

  body.t-PageBody--login #wwvFlowForm {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
  }

  body.t-PageBody--login .t-Body {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100vh !important;
    padding: 0 !important;
    background: transparent !important;
    margin: 0 !important;
  }

  body.t-PageBody--login .t-Body-wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 100% !important;
    padding: 24px !important;
    box-sizing: border-box !important;
  }

  body.t-PageBody--login .t-Body-col,
  body.t-PageBody--login .t-Body-col--main {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.t-PageBody--login .t-Body-main,
  body.t-PageBody--login .t-Body-content,
  body.t-PageBody--login .t-Body-contentInner {
    display: contents !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Login-Region: äusserer Container transparent + zentriert, nur innere Karte sichtbar */
  .t-PageBody--login .t-Login-container {
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    position: relative;
    z-index: 1;
  }

  .t-PageBody--login .t-Login-region {
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 auto !important;
    background: rgba(255, 255, 255, 0.82) !important;
    backdrop-filter: blur(24px) saturate(1.6) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.6) !important;
    border-radius: 24px !important;
    border: none !important;
    box-shadow:
      0 8px 40px rgba(69, 70, 231, 0.10),
      0 2px 12px rgba(0, 0, 0, 0.04),
      0 0 0 1px rgba(69, 70, 231, 0.06) !important;
    padding: 44px 40px 36px !important;
    position: relative;
    z-index: 1;
    animation: ld-login-appear 0.4s ease forwards;
  }

  @keyframes ld-login-appear {
    from { opacity: 0; transform: translateY(16px) scale(0.97); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
  }

  /* Logo / Titel */
  .t-PageBody--login .t-Login-header {
    text-align: center !important;
    margin-bottom: 32px !important;
    padding: 0 !important;
  }

  .t-PageBody--login .t-Login-logo {
    margin-bottom: 16px !important;
  }

  .t-PageBody--login .t-Login-logo .t-Icon,
  .t-PageBody--login .t-Login-logo .app-icon {
    width: 56px !important;
    height: 56px !important;
    border-radius: 16px !important;
    background: var(--ld-grad) !important;
    color: #ffffff !important;
    font-size: 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: 0 6px 20px rgba(69, 70, 231, 0.25) !important;
    border: none !important;
  }

  .t-PageBody--login .t-Login-title {
    font-family: 'Plus Jakarta Sans', 'Manrope', sans-serif !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    color: var(--ld-on-surface) !important;
    letter-spacing: -0.5px !important;
    margin: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
  }

  .t-PageBody--login .t-Login-title::before {
    content: "Lead Engine";
    font-family: 'Plus Jakarta Sans', 'Manrope', sans-serif !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    color: var(--ld-on-surface) !important;
    letter-spacing: -0.5px !important;
    line-height: 1.2 !important;
  }

  .t-PageBody--login .t-Login-title::after {
    content: "";
    display: block;
    width: 40px;
    height: 3px;
    border-radius: 3px;
    background: var(--ld-grad);
    margin: 12px auto 0;
  }

  /* Form Body */
  .t-PageBody--login .t-Login-body {
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Labels */
  .t-PageBody--login .t-Login-body .t-Form-label,
  .t-PageBody--login .t-Login-body label {
    font-family: 'Manrope', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--ld-on-surface-var) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    margin-bottom: 6px !important;
  }

  /* Input-Felder — Inset-Ring statt äußerem Spread: UT-Wrapper (overflow:hidden) schneiden
     äußere box-shadow sonst ab → nur „Eckenbögen“ sichtbar */
  .t-PageBody--login .t-Login-body .apex-item-text,
  .t-PageBody--login .t-Login-body input[type="text"],
  .t-PageBody--login .t-Login-body input[type="password"] {
    width: 100% !important;
    padding: 13px 16px !important;
    border: none !important;
    border-radius: 14px !important;
    background: var(--ld-surf-low) !important;
    color: var(--ld-on-surface) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    box-shadow:
      inset 0 0 0 1.5px rgba(69, 70, 231, 0.12),
      0 1px 3px rgba(0, 0, 0, 0.04) !important;
    transition: box-shadow 0.2s ease, background 0.2s ease !important;
    box-sizing: border-box !important;
  }

  .t-PageBody--login .t-Login-body .apex-item-text:hover,
  .t-PageBody--login .t-Login-body input[type="text"]:hover,
  .t-PageBody--login .t-Login-body input[type="password"]:hover {
    background: var(--ld-hell-grau) !important;
    box-shadow:
      inset 0 0 0 1.5px rgba(69, 70, 231, 0.22),
      0 2px 8px rgba(0, 0, 0, 0.06) !important;
  }

  .t-PageBody--login .t-Login-body .apex-item-text:focus,
  .t-PageBody--login .t-Login-body input[type="text"]:focus,
  .t-PageBody--login .t-Login-body input[type="password"]:focus {
    /* Grau statt Weiss: bleibt von der gläsernen Karte unterscheidbar */
    background: var(--ld-dunkel-grau) !important;
    box-shadow:
      inset 0 0 0 2px rgba(69, 70, 231, 0.55),
      0 4px 16px rgba(69, 70, 231, 0.12) !important;
    outline: none !important;
  }

  /* Fieldset/Item-Wrapper spacing */
  .t-PageBody--login .t-Login-body .t-Form-fieldContainer {
    margin-bottom: 16px !important;
    padding: 0 !important;
  }

  .t-PageBody--login .t-Login-body .t-Form-inputContainer,
  .t-PageBody--login .t-Login-body .apex-item-group,
  .t-PageBody--login .t-Login-body .apex-item-group--text,
  .t-PageBody--login .t-Login-body .apex-item-group--password {
    padding: 0 !important;
    overflow: visible !important;
  }

  /* Fehlermeldung + Benachrichtigungen auf Login-Seite sichtbar halten */
  .t-PageBody--login .t-Body-alert,
  .t-PageBody--login .t-Alert,
  .t-PageBody--login .t-Alert--page,
  .t-PageBody--login .t-Login-message,
  .t-PageBody--login .t-Alert--warning,
  .t-PageBody--login .t-Alert--danger,
  .t-PageBody--login .t-Notification,
  .t-PageBody--login #t_Alert_Notification,
  .t-PageBody--login #t_Alert_Success {
    display: block !important;
    visibility: visible !important;
    border-radius: 12px !important;
    border: none !important;
    background: var(--ld-danger-bg) !important;
    color: var(--ld-danger) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 10px 16px !important;
    margin-bottom: 16px !important;
    box-shadow: none !important;
    position: relative !important;
    width: 100% !important;
    max-width: 420px !important;
    z-index: 5 !important;
  }

  .t-PageBody--login .t-Alert .t-Alert-body {
    padding: 0 !important;
  }

  /* Sign In Button */
  .t-PageBody--login .t-Login-buttons .t-Button,
  .t-PageBody--login .t-Login-buttons .t-Button--hot,
  .t-PageBody--login .t-Button--login {
    width: 100% !important;
    padding: 14px 24px !important;
    border-radius: 28px !important;
    border: none !important;
    background: var(--ld-grad) !important;
    color: #ffffff !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2px !important;
    cursor: pointer !important;
    box-shadow: 0 4px 16px rgba(69, 70, 231, 0.25) !important;
    transition: all 0.2s ease !important;
    margin-top: 8px !important;
  }

  .t-PageBody--login .t-Login-buttons .t-Button:hover,
  .t-PageBody--login .t-Button--login:hover {
    box-shadow: 0 6px 24px rgba(69, 70, 231, 0.35) !important;
    transform: translateY(-1px) !important;
  }

  .t-PageBody--login .t-Login-buttons .t-Button:active,
  .t-PageBody--login .t-Button--login:active {
    transform: translateY(0) !important;
    box-shadow: 0 2px 8px rgba(69, 70, 231, 0.2) !important;
  }

  /* "Remember me" Checkbox */
  .t-PageBody--login .t-Login-body .checkbox_group,
  .t-PageBody--login .t-Login-body .t-Form-fieldContainer--checkbox {
    margin-top: 4px !important;
    margin-bottom: 4px !important;
  }

  .t-PageBody--login .t-Login-body .checkbox_group label,
  .t-PageBody--login .t-Login-body .t-Form-fieldContainer--checkbox label {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--ld-on-surface-var) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
  }

  .t-PageBody--login .t-Login-body input[type="checkbox"] {
    accent-color: var(--ld-brand) !important;
  }

  /* Footer / Links */
  .t-PageBody--login .t-Login-footer {
    text-align: center !important;
    margin-top: 20px !important;
    padding: 0 !important;
  }

  .t-PageBody--login .t-Login-footer a {
    color: var(--ld-brand) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    transition: color 0.15s !important;
  }

  .t-PageBody--login .t-Login-footer a:hover {
    color: var(--ld-brand-dark) !important;
  }

  /* APEX Item-Icons auf Login-Seite komplett ausblenden (stören UX) */
  .t-PageBody--login .t-Login-body .apex-item-icon,
  .t-PageBody--login .t-Login-body .apex-item-action,
  .t-PageBody--login .t-Login-body .a-Button--passwordToggle,
  .t-PageBody--login .t-Login-body .password-toggle-btn,
  .t-PageBody--login .t-Login-body .apex-item-action-button,
  .t-PageBody--login .t-Login-body .a-Button.a-Button--noUI,
  .t-PageBody--login .t-Login-body .apex-item-group--password .a-Button,
  .t-PageBody--login .t-Login-body button.a-Button,
  .t-PageBody--login .t-Login-body .apex-item-group button {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    pointer-events: none !important;
  }

  /* APEX t-Form überschreiben */
  .t-PageBody--login .t-Form--large .t-Form-inputContainer {
    padding: 0 !important;
  }

  /* APEX-Region-Wrapper auf Login-Seite: alles transparent */
  .t-PageBody--login .t-Region,
  .t-PageBody--login .t-Region--noBorder,
  .t-PageBody--login .t-Login-container .t-Region,
  .t-PageBody--login .t-Body-contentInner > .t-Region {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .t-PageBody--login .t-Region-body,
  .t-PageBody--login .t-Region-header {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
  }

  /* Developer Toolbar anpassen */
  .t-PageBody--login #apexDevToolbar {
    z-index: 10 !important;
  }

  /* Responsive Login */
  @media (max-width: 480px) {
    .t-PageBody--login .t-Login-container,
    .t-PageBody--login .t-Login-region {
      padding: 32px 24px 28px !important;
      margin: 16px !important;
      border-radius: 20px !important;
    }
  }

  /* ── APEX Header + Body-Layout ───────────────────────────────────────────── */

  body:not(.t-PageBody--login) #wwvFlowForm {
    padding: 0 !important;
    margin: 0 !important;
  }

  .t-Header {
    display: none !important;
  }

  .t-Body {
    padding-top: 0 !important;
  }

  .t-Body-main {
    top: 0 !important;
  }
   
   /* APEX Breadcrumb, Hero, Title-Bar Regionen komplett ausblenden
      (unsere Seiten rendern eigene Titel via JS) */
   .t-BreadcrumbRegion,
   .t-Breadcrumb,
   .t-Breadcrumb-title,
   .t-Body-title,
   .t-Body-info,
   .t-HeroRegion,
   .t-Hero,
   .t-Hero-wrap,
   .t-BreadcrumbRegion--useBreadcrumbTitle,
   .t-ContentBlock--title,
   .t-Alert--page,
   .t-Body-content-inner > .t-Region:first-child:not(:has(.ld2-page-container)) {
     display: none !important;
   }
   
   /* ── Content Body ─────────────────────────────────────────────────────────── */
   
   body:not(.t-PageBody--login) .t-Body-content {
     background: var(--ld-surface) !important;
     padding: 20px 24px !important;
     margin: 0 !important;
   }
   
   body:not(.t-PageBody--login) .t-Body-contentInner {
     max-width: none !important;
     padding: 0 !important;
     margin: 0 !important;
   }
   
   /* ── APEX Region Overrides (No-Line Rule) ─────────────────────────────────── */
   
   /* Entferne alle Region-Borders */
   .t-Region,
   .t-Region--noBorder {
     border: none !important;
     box-shadow: var(--ld-shadow-sm) !important;
     border-radius: var(--ld-radius-lg) !important;
     background: #ffffff !important;
     overflow: hidden !important;
   }

   /* JS-gerenderte Regionen: overflow erlauben damit Inhalte nicht abgeschnitten werden */
   .t-Region:has(.ld2-page-container) {
     overflow: visible !important;
     box-shadow: none !important;
     background: transparent !important;
     border: none !important;
     border-radius: 0 !important;
     outline: none !important;
   }
   .t-Region:has(.ld2-page-container) > .t-Region-body {
     padding: 0 !important;
   }
   .t-Region:has(.ld2-page-container) > .t-Region-header {
     display: none !important;
   }

   /* Fallback ohne :has() — APEX "Blank with Attributes" Region-Templates */
   .t-Region--blank,
   .t-Region--noBorder,
   .t-Region--removeHeader--noBorder,
   .t-Region--blank.t-Region--noPadding {
     overflow: visible !important;
     box-shadow: none !important;
     background: transparent !important;
     border: none !important;
     border-radius: 0 !important;
     outline: none !important;
   }
   .t-Region--blank > .t-Region-body,
   .t-Region--noBorder > .t-Region-body {
     padding: 0 !important;
   }
   
   .t-Region-header {
     border-bottom: none !important;
     padding: 16px 20px !important;
   }
   
   .t-Region-headerItems--title .t-Region-title {
     font-family: 'Manrope', sans-serif !important;
     font-weight: 700 !important;
     font-size: 14px !important;
     color: var(--ld-on-surface) !important;
   }
   
   .t-Region-body {
     padding: 0 20px 20px !important;
   }
   
   /* ── Buttons (Gradient CTAs) ──────────────────────────────────────────────── */
   
   .t-Button--hot,
   .t-Button.t-Button--primary {
     background: var(--ld-grad) !important;
     border: none !important;
     border-radius: var(--ld-radius-btn) !important;
     box-shadow: 0 2px 8px rgba(75, 77, 237, 0.18) !important;
     font-weight: 600 !important;
     transition: all 0.15s !important;
   }
   
   .t-Button--hot:hover {
     box-shadow: 0 4px 14px rgba(75, 77, 237, 0.28) !important;
     transform: translateY(-1px) !important;
   }
   
   .t-Button {
     border-radius: var(--ld-radius-btn) !important;
     font-weight: 600 !important;
     font-family: 'Manrope', sans-serif !important;
   }
   
   /* ── Interactive Report / Grid Overrides ───────────────────────────────────── */
   
   /* Remove grid lines → use alternating row backgrounds */
   .a-IRR-table td,
   .a-IRR-table th,
   .a-GV-table td,
   .a-GV-table th {
     border: none !important;
   }
   
   .a-IRR-table tr:nth-child(even),
   .a-GV-table tr:nth-child(even) {
     background: var(--ld-surf-low) !important;
   }
   
   .a-IRR-table tr:hover,
   .a-GV-table tr:hover {
     background: var(--ld-brand-light) !important;
   }
   
   .a-IRR-table th,
   .a-GV-table th {
     background: var(--ld-surf-low) !important;
     font-weight: 600 !important;
     color: var(--ld-on-surface-var) !important;
     text-transform: uppercase !important;
     font-size: 10px !important;
     letter-spacing: 0.8px !important;
   }
   
   /* ── Form Items ───────────────────────────────────────────────────────────── */
   
   .apex-item-text,
   .apex-item-select,
   .apex-item-textarea {
     border: none !important;
     background: var(--ld-surf-low) !important;
     /* Sichtbarer Ring statt border — hält die No-Line Rule ein */
     box-shadow: 0 0 0 1.5px rgba(75, 77, 237, 0.13), 0 1px 4px rgba(0,0,0,0.05) !important;
     border-radius: 12px !important;
     padding: 10px 14px !important;
     font-family: 'Manrope', sans-serif !important;
     color: var(--ld-on-surface) !important;
     transition: all 0.15s !important;
   }
   
   .apex-item-text:hover,
   .apex-item-select:hover,
   .apex-item-textarea:hover {
     box-shadow: 0 0 0 1.5px rgba(75, 77, 237, 0.22), 0 2px 6px rgba(0,0,0,0.07) !important;
   }

   .apex-item-text:focus,
   .apex-item-select:focus,
   .apex-item-textarea:focus {
     background: #ffffff !important;
     box-shadow: 0 0 0 2.5px rgba(75, 77, 237, 0.28), 0 2px 8px rgba(75,77,237,0.10) !important;
     outline: none !important;
   }
   
   /* ── Pulse Animation für StatusDots ───────────────────────────────────────── */
   
   @keyframes ld2-pulse {
     0%, 100% { opacity: 1; }
     50% { opacity: 0.4; }
   }
   
   /* ── Custom Scrollbar ─────────────────────────────────────────────────────── */
   
   *::-webkit-scrollbar { width: 6px; }
   *::-webkit-scrollbar-thumb { background: var(--ld-outline-var); border-radius: 3px; }
   *::-webkit-scrollbar-track { background: transparent; }
   
   /* ── JS-gerenderte Container ──────────────────────────────────────────────── */
   
   /* Vertikaler Rhythmus — synchron mit LeadsDesign.PAGE_* (design.js) */
   :root {
     --ld-page-gap: 16px;
     --ld-page-gap-compact: 12px;
   }

   /* Container-Div für JS-gerenderte Seiteninhalte */
   .ld2-page-container {
     display: flex;
     flex-direction: column;
     gap: var(--ld-page-gap);
     padding: 8px 0;
     box-sizing: border-box;
   }

   /* Engerer vertikaler Rhythmus (z. B. Admin Dashboard); SectionTitle + Inhalt bleiben konsistent über Flex-gap. */
   .ld2-page-container.ld2-page-container--compact {
     gap: var(--ld-page-gap-compact);
   }

   .ld2-page-container > * {
     min-width: 0;
   }

   /* PageHeader: Titel und „+ Neuer …“-Button vertikal zentriert (Theme kann sonst flex überschreiben) */
   .ld2-page-container .ld2-page-header {
     align-items: center !important;
   }

   /* System Logs: Filter → Tabs → „X von Y“ → Tabelle; Abstand per .lda-logs-main gap, keine doppelten Margins */
   .ld2-page-container .lda-logs-main #lda_logs_filter {
     margin-bottom: 0 !important;
   }
   .ld2-page-container .lda-logs-main > .ld2-tabbar {
     margin-bottom: 0 !important;
   }

   /* AI Agents: Filter + Agent-Zeile gebündelt; kein doppelter Abstand durch FilterCard-margin */
   .ld2-page-container .lda-agents-top #lda_agents_filter {
     margin-bottom: 0 !important;
   }
   
   .ld2-page-container .ld2-card {
     transition: box-shadow 0.15s, transform 0.15s;
   }
   
   .ld2-page-container .ld2-card:hover {
     box-shadow: var(--ld-shadow);
     transform: translateY(-1px);
   }

   /* ── Button Hover (alle Buttons im Page-Container) ───────────────── */
   .ld2-page-container button[type="button"]:not(:disabled) {
     transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
   }
   .ld2-page-container button[type="button"]:not(:disabled):hover {
     transform: translateY(-1px);
     filter: brightness(1.05);
   }
   .ld2-page-container button[type="button"]:not(:disabled):active {
     transform: translateY(0px);
     filter: brightness(0.97);
   }

   /* JS-gerenderte Textareas (z.B. E-Mail-Editor in Review) */
   .ld2-page-container textarea,
   .ld2-page-container input[type="text"],
   .ld2-page-container select {
     box-shadow: 0 0 0 1.5px rgba(75, 77, 237, 0.13), 0 1px 4px rgba(0,0,0,0.05) !important;
     border: none !important;
     transition: box-shadow 0.15s !important;
   }

   .ld2-page-container textarea:hover,
   .ld2-page-container input[type="text"]:hover,
   .ld2-page-container select:hover {
     box-shadow: 0 0 0 1.5px rgba(75, 77, 237, 0.22), 0 2px 6px rgba(0,0,0,0.07) !important;
   }

   .ld2-page-container textarea:focus,
   .ld2-page-container input[type="text"]:focus,
   .ld2-page-container select:focus {
     box-shadow: 0 0 0 2.5px rgba(75, 77, 237, 0.28) !important;
     outline: none !important;
   }
   
   /* KPI Grid Standard */
   .ld2-kpi-grid {
     display: grid;
     gap: 16px;
   }
   
   .ld2-kpi-grid--4 { grid-template-columns: repeat(4, 1fr); }
   .ld2-kpi-grid--5 { grid-template-columns: repeat(5, 1fr); }
   .ld2-kpi-grid--3 { grid-template-columns: repeat(3, 1fr); }

   /* Lead-Journey: klickbare Stufen (Review / Dispatch) */
   .ld2-journey-stage--clickable:hover {
     opacity: 0.9;
   }
   .ld2-journey-stage--clickable:active {
     transform: scale(0.98);
   }

   /* KPI-Zeile ein-/ausklappbar (Mandanten- + Admin-Seiten, initKpiToggle) */
   .ld2-page-title-row {
     display: flex;
     align-items: center;
     justify-content: flex-start;
     gap: 10px;
     margin-bottom: 14px;
     width: 100%;
     box-sizing: border-box;
     min-width: 0;
   }
   /* Review Queue (P3) + Dispatch Center (P4): gleiche Abstände KPI → Stepper → Filterzeile */
   .ld2-queue-sync-stack > .ld2-kpi-section {
     margin-bottom: 0 !important;
   }
   .ld2-step-row {
     display: flex;
     align-items: center;
     justify-content: center;
     gap: 0;
     margin-top: 12px;
     margin-bottom: 24px;
   }
   /* Mandant-Seiten: Container volle Content-Breite, damit KPI-Gruppe rechts bündig sitzt */
   #ld2_dashboard,
   #ld2_review,
   #ld3_dispatch,
   #ld4_campaigns,
   #ld5_leads {
     width: 100%;
     max-width: 100%;
     box-sizing: border-box;
   }
   /* Erstes Kind = Titelzeile (PageHeader oder Custom-Header): flexibel, nicht volle Breite erzwingen */
   .ld2-page-title-row > *:first-child {
     flex: 1 1 0;
     min-width: 0;
   }
   /* PageHeader setzt inline width:100% — sonst kein Platz für KPI-Toggle rechts */
   .ld2-page-title-row > .ld2-page-header {
     width: auto !important;
     max-width: 100%;
   }
   /* KPIs-Button + Mini-Pills: immer am rechten Rand der Titelzeile */
   .ld-kpi-header-actions {
     display: flex;
     align-items: center;
     gap: 10px;
     margin-left: auto !important;
     flex: 0 0 auto;
   }
   .ld-kpi-pills {
     display: flex;
     gap: 6px;
     align-items: center;
   }
   .ld-kpi-pills--hidden {
     display: none;
   }
   .ld-kpi-pill {
     font-size: 11px;
     padding: 3px 9px;
     border-radius: 10px;
     background: var(--ld-hell-grau);
     border: 0.5px solid var(--ld-dunkel-grau);
     color: var(--ld-on-surface-var);
     white-space: nowrap;
   }
   .ld-kpi-pill--green {
     background: #e1f5ee;
     color: #0f6e56;
     border-color: #9fe1cb;
   }
   .ld-kpi-pill--blue {
     background: #e6f1fb;
     color: #185fa5;
     border-color: #b5d4f4;
   }
   .ld-kpi-pill--amber {
     background: #faeeda;
     color: #854f0b;
     border-color: #ef9f27;
   }
   .ld-kpi-toggle-btn {
     display: flex;
     align-items: center;
     gap: 5px;
     padding: 5px 11px;
     font-size: 12px;
     font-weight: 500;
     color: var(--ld-on-surface-var);
     background: var(--ld-surface);
     border: 0.5px solid var(--ld-dunkel-grau);
     border-radius: 8px;
     cursor: pointer;
     white-space: nowrap;
   }
   .ld-kpi-toggle-btn svg {
     transition: transform 0.25s;
   }
   .ld-kpi-toggle-btn--open svg {
     transform: rotate(180deg);
   }
   .ld2-kpi-section {
     overflow: hidden;
     max-height: 300px;
     opacity: 1;
     margin-bottom: 14px;
     transition: max-height 0.3s ease, opacity 0.25s, margin 0.25s;
   }
   .ld2-kpi-section--collapsed {
     max-height: 0;
     opacity: 0;
     margin-bottom: 0;
   }
   /* Kampagnen-Hub: KPI-Kacheln + Pipeline über alle K. + 7-Tage-Aktivität in einem einklappbaren Block */
   .ld2-kpi-section.ld2-kpi-section--campaigns-stack:not(.ld2-kpi-section--collapsed) {
     max-height: none;
   }
   /* Einzelkampagne: nur Kennzahl-Grid dieser Kampagne (einklappbar) */
  .ld2-kpi-section.ld2-kpi-section--campaign-detail:not(.ld2-kpi-section--collapsed) {
    max-height: none;
  }
  /* Admin Dashboard: KPI-Zeilen + Pipeline-Donuts in einem Block — >300px Höhe; sonst abschneiden */
  .ld2-kpi-section.ld2-kpi-section--admin-dashboard:not(.ld2-kpi-section--collapsed) {
    max-height: none;
  }
  
  /* ── Modal Dialog Override ────────────────────────────────────────────────── */
   
   .ui-dialog {
     border: none !important;
     border-radius: var(--ld-radius-lg) !important;
     box-shadow: 0 24px 64px rgba(0, 0, 0, 0.15) !important;
     overflow: hidden !important;
   }
   
   .ui-dialog .ui-dialog-titlebar {
     background: #ffffff !important;
     border-bottom: none !important;
     font-family: 'Manrope', sans-serif !important;
   }
   
   /* ── Responsive ───────────────────────────────────────────────────────────── */
   
   @media (max-width: 1024px) {
     .ld2-kpi-grid--5 { grid-template-columns: repeat(3, 1fr); }
     .ld2-kpi-grid--4 { grid-template-columns: repeat(2, 1fr); }
   }
   
   @media (max-width: 640px) {
     .ld2-kpi-grid--5,
     .ld2-kpi-grid--4,
     .ld2-kpi-grid--3 { grid-template-columns: 1fr; }
   }
   
   /* ============================================================================
      LEADS Navigation System (Top + Side + NavBar)
      ============================================================================
      Erzwingt konsistenten Look fuer beide APEX-Navigationsmodi:
      - Left Navigation (Tree)
      - Top Navigation (MenuBar)
      - Right Navigation Bar (User / Sign Out)
      ========================================================================== */
   
   /* ── Top Navigation (Desktop Navigation Menu) ────────────────────────────── */
   .t-Header-nav {
     background: #ffffff !important;
     border-bottom: none !important;
     box-shadow: 0 1px 12px rgba(75, 77, 237, 0.06) !important;
   }
   
   .t-Header-nav .a-MenuBar {
     background: transparent !important;
     border: none !important;
     box-shadow: none !important;
   }
   
   .t-Header-nav .a-MenuBar-item {
     background: transparent !important;
     border: none !important;
   }
   
   .t-Header-nav .a-MenuBar-label {
     font-family: "Manrope", sans-serif !important;
     font-size: 13px !important;
     font-weight: 600 !important;
     color: var(--ld-on-surface-var) !important;
     border-radius: 999px !important;
     padding: 6px 12px !important;
   }
   
   .t-Header-nav .a-MenuBar-item:hover .a-MenuBar-label {
     color: var(--ld-brand) !important;
     background: var(--ld-surf-low) !important;
   }
   
   .t-Header-nav .a-MenuBar-item.is-current .a-MenuBar-label,
   .t-Header-nav .a-MenuBar-item.is-active .a-MenuBar-label {
     color: #ffffff !important;
     background: var(--ld-grad) !important;
     box-shadow: 0 4px 12px rgba(75, 77, 237, 0.24) !important;
   }
   
   /* Top-Nav Dropdowns */
   .t-Header-nav .a-Menu,
   .t-Header-nav .a-Menu-content {
     border: none !important;
     border-radius: 12px !important;
     box-shadow: 0 12px 28px rgba(75, 77, 237, 0.12) !important;
   }
   
   .t-Header-nav .a-Menu .a-Menu-label {
     font-family: "Manrope", sans-serif !important;
     font-size: 12px !important;
     color: var(--ld-on-surface) !important;
   }
   
   /* ── Right Navigation Bar (User menu) ───────────────────────────────────── */
   .t-Header-navBar,
   .t-NavigationBar {
     background: transparent !important;
     border: none !important;
   }
   
   .t-NavigationBar-item a,
   .t-NavigationBar-item button,
   .t-NavigationBar .a-Button,
   .t-NavigationBar .t-Button {
     border: none !important;
     border-radius: 999px !important;
     background: var(--ld-surf-low) !important;
     color: var(--ld-on-surface) !important;
     font-family: "Manrope", sans-serif !important;
     font-weight: 600 !important;
   }
   
   .t-NavigationBar-item a:hover,
   .t-NavigationBar-item button:hover,
   .t-NavigationBar .a-Button:hover,
   .t-NavigationBar .t-Button:hover {
     background: var(--ld-brand-light) !important;
     color: var(--ld-brand) !important;
   }
   
   /* ── Loading Animations ───────────────────────────────────────────────── */

   @keyframes ld2-skeleton {
     0%, 100% { opacity: 0.6; }
     50% { opacity: 0.3; }
   }

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

   /* ── Universal Clickable Hover ───────────────────────────────────────
      Alle klickbaren Karten/Elemente bekommen einen einheitlichen
      translateY + Shadow-Effekt. Klasse: ld-clickable                   */

   .ld-clickable,
   .ldr-lead-card,
   .ldl-lead-card,
   .ldc-campaign-card,
   .ldc-campaign-new,
   .ld2-kpi-card,
   .ld3-kpi-instantly,
   .ldc-segment-card,
   .lda-mandant-card {
     transition: transform 0.18s ease, box-shadow 0.18s ease !important;
   }

   .ld-clickable:hover,
   .ldr-lead-card:hover,
   .ldl-lead-card:hover,
   .ldc-campaign-card:hover,
   .ldc-campaign-new:hover,
   .ld2-kpi-card:hover,
   .ldc-segment-card:hover,
   .lda-mandant-card:hover {
     transform: translateY(-2px);
     box-shadow: var(--ld-shadow) !important;
   }

   /* Dispatch: klickbare Instantly-KPI (Konfiguration) — eigener Schatten + Fokus-Ring wenn Panel offen */
   .ld3-kpi-instantly {
     box-shadow: var(--ld-shadow-sm) !important;
   }
   .ld3-kpi-instantly:hover {
     transform: translateY(-2px);
     box-shadow: var(--ld-shadow) !important;
   }
   .ld3-kpi-instantly--open {
     box-shadow: 0px 3px 14px rgba(69, 70, 231, 0.12), 0 0 0 2px rgba(69, 70, 231, 0.28) !important;
   }
   .ld3-kpi-instantly--open:hover {
     transform: translateY(-2px);
     box-shadow: var(--ld-shadow), 0 0 0 2px rgba(69, 70, 231, 0.28) !important;
   }

   .ldl-row:hover {
     background: var(--ld-surf-low) !important;
   }

   .ldr-row:hover {
     background: var(--ld-surf-low) !important;
   }

   /* Pipeline-Donuts: Hover koppelt Ringsegment ↔ Legende */
   .ld-donut-wrap .ld-donut-leg {
     transition: opacity 0.16s ease, box-shadow 0.16s ease;
     border-radius: 8px;
     padding: 3px 6px;
     margin: -3px -6px;
     cursor: default;
   }
   .ld-donut-wrap .ld-donut-leg[data-donut-leg] {
     cursor: pointer;
   }
   .ld-donut-leg--dim {
     opacity: 0.38;
   }
   .ld-donut-leg--hi {
     opacity: 1;
     box-shadow: var(--ld-shadow-sm);
   }
   .ld-donut-arc {
     transition: opacity 0.16s ease, filter 0.16s ease;
     cursor: pointer;
   }
   .ld-donut-arc--dim {
     opacity: 0.38;
   }
   .ld-donut-arc--hi {
     opacity: 1;
     filter: drop-shadow(0 0 5px rgba(69, 70, 231, 0.45));
   }

   /* ── KPI Grid Responsive (Dashboard + Kampagnen) ─────────────────── */

   @media (max-width: 1100px) {
     #ldc-overview-kpis,
     #lda-overview-kpis {
       grid-template-columns: repeat(3, 1fr) !important;
     }
   }

   @media (max-width: 900px) {
     #ld2-zone-kpis > div,
     #ldc-overview-kpis,
     #ld5-overview-kpis,
     #lda-overview-kpis {
       grid-template-columns: repeat(2, 1fr) !important;
     }
   }

   @media (max-width: 640px) {
     #ld2-zone-kpis > div,
     #ldc-overview-kpis,
     #ld5-overview-kpis,
     #lda-overview-kpis {
       grid-template-columns: 1fr !important;
     }
   }

   /* ── Lead-Detail: einklappbare Blöcke (<details>) ───────────────────────── */

   .ld2-collapsible summary {
     list-style: none;
   }
   .ld2-collapsible summary::-webkit-details-marker {
     display: none;
   }
   .ld2-collapsible summary::marker {
     content: "";
   }
   .ld2-collapsible .ld2-collapsible-chevron {
     transition: transform 0.2s ease;
     display: inline-block;
     font-size: 11px;
     line-height: 1;
     color: var(--ld-outline, #aab3b9);
     flex-shrink: 0;
   }
   /* Geschlossen: Pfeil nach rechts; offen: nach unten */
   .ld2-collapsible[open] > summary .ld2-collapsible-chevron {
     transform: rotate(90deg);
   }
   .ld2-collapsible:not([open]) > summary .ld2-collapsible-chevron {
     transform: rotate(0deg);
   }
   .ld2-collapsible--nested {
     margin-top: 8px;
   }
   .ld2-collapsible--nested > summary {
     padding: 10px 12px !important;
   }

   /* ── Modal Animation ─────────────────────────────────────────────────── */
   @keyframes ld2-modal-in {
     from { opacity: 0; transform: scale(0.96) translateY(8px); }
     to   { opacity: 1; transform: scale(1) translateY(0); }
   }

   /* ── Shared Table Row Hover ────────────────────────────────────────── */
   .ld2-table-row:hover {
     filter: brightness(0.97);
   }

   /* ── Clickable Row / Accordion Hover ────────────────────────────── */
   .ld-clickable-row {
     transition: background 0.15s ease, transform 0.12s ease;
   }
   .ld-clickable-row:hover {
     background: var(--ld-surf-low) !important;
   }

   /* ── FilterBar responsive ─────────────────────────────────────────── */
   @media (max-width: 640px) {
     .ld2-filterbar { flex-direction: column; align-items: stretch; }
     .ld2-filterbar > * { width: 100% !important; min-width: 0 !important; }
   }

   /* ── Lead Card Grid (Kachel-Ansicht) ────────────────────────────────── */
   .ld5-lead-card {
     transition: transform 0.18s ease, box-shadow 0.18s ease !important;
   }
   .ld5-lead-card:hover {
     box-shadow: 0px 8px 28px rgba(69,70,231,0.15), 0 0 0 1px rgba(69,70,231,0.12) !important;
     transform: translateY(-3px);
   }

   /* Detail Grid responsive */
   @media (max-width: 860px) {
     .ld5-detail-grid {
       grid-template-columns: 1fr !important;
     }
   }

   /* E-Mail-Sequenzen (3 Karten): volle Content-Breite, gleichmäßige Spalten */
   .ld-email-sequence-wrap {
     width: 100%;
     max-width: none;
     margin-left: 0;
     margin-right: 0;
     box-sizing: border-box;
   }

   .ld-email-sequence-grid {
     display: grid;
     gap: 20px;
     width: 100%;
     min-width: 0;
     margin-bottom: var(--ld-page-gap, 16px);
     align-items: stretch;
   }

   .ld-email-sequence-grid--3 {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }

   .ld-email-sequence-grid--2 {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }

   .ld-email-sequence-grid--1 {
     grid-template-columns: minmax(0, 1fr);
   }

   @media (max-width: 1200px) {
     .ld-email-sequence-grid--3 {
       grid-template-columns: repeat(2, minmax(0, 1fr));
     }
   }

   @media (max-width: 720px) {
     .ld-email-sequence-grid--3,
     .ld-email-sequence-grid--2 {
       grid-template-columns: minmax(0, 1fr);
     }
   }

   .ld-email-card {
     min-width: 0;
     min-height: 0;
   }

   /* Config Form Grid responsive */
   @media (max-width: 640px) {
     .ld-config-grid {
       grid-template-columns: 1fr !important;
     }
   }

   /* ── Dispatch Center: Instantly KPI — Puls am Live-Statuspunkt ───────────── */
   @keyframes ld3-instantly-pulse {
     0% { transform: scale(0.85); opacity: 0.55; }
     70% { transform: scale(1.35); opacity: 0; }
     100% { opacity: 0; }
   }
   .ld3-instantly-live-ring {
     position: absolute;
     inset: 0;
     border-radius: 50%;
     box-shadow: 0 0 0 0 var(--ld-success-bg);
     animation: ld3-instantly-pulse 2.2s ease-out infinite;
     pointer-events: none;
   }

   /* ============================================================================
      FINAL HARD OVERRIDES (APEX 18/UT states)
      ============================================================================
      Diese Regeln adressieren explizit UT-Klassen, die je nach Template/Version
      unterschiedliche Prioritaet haben. */