/* Studio Gantt 0.6.0: Ergänzungen nach Basis-CSS und vorhandener gantt.css.
   Die vorhandene gantt.css bleibt beim Update als eigene Anpassungsdatei erhalten. */

/* Sichtbare Raute verwendet dieselbe gespeicherte Farbwahl wie Aufgaben. */
#gantt-app .diamond::before {
    background: var(--milestone-color, #689683);
}

/* Ganze Leistungsphasen im Backend verschieben. */
#gantt-app .row.group .left { gap: 8px; }
#gantt-app .phase-heading { flex: 1; min-width: 0; }
#gantt-app .phase-controls { display: flex; gap: 4px; flex-shrink: 0; }
#gantt-app .phase-move {
    width: 25px;
    height: 28px;
    padding: 0;
    border: 1px solid #cfdbcf;
    border-radius: 5px;
    background: #fff;
    color: var(--ink);
    cursor: pointer;
}
#gantt-app .phase-move:disabled { opacity: .3; cursor: default; }

/* Dunkle Darstellung gilt ausschließlich innerhalb der Komponente. */
#gantt-app[data-theme="dark"] {
    color-scheme: dark;
    --ink: #e5ece8;
    --muted: #a7b6ad;
    --line: #3a4942;
    --dark-panel: #202c26;
    --dark-soft: #29382f;
    --dark-input: #17231d;
    background: #19241e;
    border-color: var(--line);
}

/* Grundflächen und fixierte Bereiche. */
#gantt-app[data-theme="dark"] .top,
#gantt-app[data-theme="dark"] .tools,
#gantt-app[data-theme="dark"] .board,
#gantt-app[data-theme="dark"] .heading,
#gantt-app[data-theme="dark"] .left,
#gantt-app[data-theme="dark"] .axis,
#gantt-app[data-theme="dark"] .message,
#gantt-app[data-theme="dark"] dialog {
    background: var(--dark-panel);
    color: var(--ink);
}
#gantt-app[data-theme="dark"] .row.group .left,
#gantt-app[data-theme="dark"] .row.group .track,
#gantt-app[data-theme="dark"] .project-tools,
#gantt-app[data-theme="dark"] .project-field,
#gantt-app[data-theme="dark"] .horizontal-navigation,
#gantt-app[data-theme="dark"] .vertical-navigation,
#gantt-app[data-theme="dark"] .badge {
    background: var(--dark-soft);
    color: var(--ink);
    border-color: var(--line);
}

/* Steuerelemente und Eingabefelder. */
#gantt-app[data-theme="dark"] .btn,
#gantt-app[data-theme="dark"] select,
#gantt-app[data-theme="dark"] .fields input,
#gantt-app[data-theme="dark"] .fields textarea,
#gantt-app[data-theme="dark"] .scroll-button,
#gantt-app[data-theme="dark"] .phase-move,
#gantt-app[data-theme="dark"] .rowItemsButton {
    background: var(--dark-input);
    color: var(--ink);
    border-color: #52675a;
}
#gantt-app[data-theme="dark"] .primary {
    background: #386950;
    color: #fff;
    border-color: #689c7f;
}
#gantt-app[data-theme="dark"] .danger,
#gantt-app[data-theme="dark"] .message { color: #f2a696; }
#gantt-app[data-theme="dark"] .eyebrow,
#gantt-app[data-theme="dark"] dialog p { color: #b4c4b9; }
#gantt-app[data-theme="dark"] .bar { color: #fff; }
#gantt-app[data-theme="dark"] .tick { border-color: var(--line); }
#gantt-app[data-theme="dark"] .tick.minor { color: var(--muted); }

/* Kalender-Hintergrund bleibt im dunklen Modus erkennbar. */
#gantt-app[data-theme="dark"] .grid { border-left-color: #34443a; }
#gantt-app[data-theme="dark"] .weekend { background: #ffffff08; }
#gantt-app[data-theme="dark"] .holiday { background: #e8bb4b30; }
#gantt-app[data-theme="dark"] .today { border-left-color: #ff9a81; }
#gantt-app[data-theme="dark"] .legend { background: #e8bb4b80; }
#gantt-app[data-theme="dark"] input[type="range"] { accent-color: #91b49d; }
#gantt-app[data-theme="dark"] .drag-tooltip {
    background: #e2eee6;
    color: #18251c;
}
#gantt-app[data-theme="dark"] dialog::backdrop { background: #050c08a0; }