/* KanbanBoard – Spalten und Cards */

.oo-kanban-board {
    display: flex;
    flex-direction: row;
    gap: var(--oo-space-4);
    align-items: flex-start;
    overflow-x: auto;
    padding-bottom: var(--oo-space-2);
}

/* Spalte */
.oo-kanban-column {
    display: flex;
    flex-direction: column;
    min-width: 260px;
    max-width: 320px;
    flex: 0 0 280px;
    background-color: var(--oo-color-surface);
    border: var(--oo-border-width) solid var(--oo-color-border);
    border-radius: var(--oo-border-radius);
    /* Kein overflow: hidden – sonst schnitte die Spalte aufklappende Elemente im Kopf ab, etwa ein ContextMenu.
       Die Rundung oben hält der Kopf selbst, Karten brechen lange Wörter um. */
}

.oo-kanban-column--no-drop {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Spalten-Header */
.oo-kanban-column__header {
    padding: var(--oo-space-3) var(--oo-space-3) var(--oo-space-2);
    border-bottom: var(--oo-border-width) solid var(--oo-color-border);
    background-color: var(--oo-surface-2);
    /* Innenradius der Spalte (Außenradius minus Rahmen), damit der Hintergrund bündig in der Rundung liegt */
    border-radius: calc(var(--oo-border-radius) - var(--oo-border-width)) calc(var(--oo-border-radius) - var(--oo-border-width)) 0 0;
}

.oo-kanban-column__title {
    font-weight: 600;
    font-size: var(--oo-font-size-sm);
    color: var(--oo-color-text-subtle);
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Spalten-Body */
.oo-kanban-column__body {
    display: flex;
    flex-direction: column;
    gap: var(--oo-space-2);
    padding: var(--oo-space-2);
    min-height: 80px;
    flex: 1;
}

/* Card */
.oo-kanban-card {
    background-color: var(--oo-color-background);
    border: var(--oo-border-width) solid var(--oo-color-border);
    border-radius: var(--oo-border-radius);
    padding: var(--oo-space-3);
    overflow-wrap: anywhere;
    cursor: default;
    user-select: none;
    transition: opacity 0.15s ease, box-shadow 0.15s ease;
}

.oo-kanban-card:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border-color: var(--oo-primary);
}

.oo-kanban-card--dragging {
    opacity: 0.35;
}

/* Drop-Indikator */
.oo-kanban-placeholder {
    height: 2px;
    background-color: var(--oo-primary, #4f46e5);
    border-radius: 1px;
    pointer-events: none;
    flex-shrink: 0;
    margin: 0;
}

/* Drag-Handle (optional, per CSS-Klasse in der Card) */
.oo-kanban-handle {
    cursor: grab;
    touch-action: none;
    flex-shrink: 0;
    color: var(--oo-color-text-subtle);
}

.oo-kanban-handle:active {
    cursor: grabbing;
}

/* Swimlanes (KanbanSwimlane): Zeilen untereinander, je Zeile eine Reihe von Spalten */
.oo-kanban-board:has(> .oo-kanban-swimlane) {
    flex-direction: column;
    align-items: stretch;
    gap: var(--oo-space-3);
}

.oo-kanban-swimlane {
    display: flex;
    flex-direction: column;
    gap: var(--oo-space-2);
    /* So breit wie alle Spalten, damit die Zeilen gemeinsam waagrecht scrollen */
    min-width: max-content;
    padding-top: var(--oo-space-2);
    border-top: var(--oo-border-width) solid var(--oo-color-border);
}

.oo-kanban-swimlane__header {
    display: flex;
    align-items: center;
    gap: var(--oo-space-2);
    /* Bleibt beim waagrechten Scrollen links stehen */
    position: sticky;
    left: 0;
    align-self: flex-start;
    max-width: 100%;
}

.oo-kanban-swimlane__title {
    font-weight: 600;
    font-size: var(--oo-font-size-sm);
}

.oo-kanban-swimlane__columns {
    display: flex;
    flex-direction: row;
    gap: var(--oo-space-4);
    align-items: flex-start;
}