/* ============================================================
   kanban.css — v0.9.5 Projekt-Kanban-View
   ============================================================ */

.kanban-board {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding: 4px 2px 8px 2px;
    min-height: 340px;
    background: repeating-linear-gradient(45deg, #d8d8d8 0px, #d8d8d8 4px, #c8c8c8 4px, #c8c8c8 8px);
    border: 1px inset #808080;
}

.kanban-col {
    flex: 0 0 190px;
    display: flex;
    flex-direction: column;
    background: #e4e4e4;
    border: 1px solid #808080;
    border-top: 2px solid;      /* colored per stage */
    max-height: 560px;
}

.kanban-col-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 6px;
    background: linear-gradient(#f5f5f5, #c8c8c8);
    border-bottom: 1px solid #808080;
    font-size: 11px;
    font-weight: bold;
}

.kanban-col-head .count {
    display: inline-block;
    min-width: 18px;
    text-align: center;
    padding: 1px 5px;
    background: #fff;
    border: 1px solid #808080;
    font-size: 10px;
    color: #333;
}

.kanban-col-body {
    flex: 1 1 auto;
    overflow-y: auto;
    /* v0.9.4.57: mehr Abstand zwischen Karten — vorher zu gequetscht */
    padding: 6px;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.kanban-col-empty {
    font-size: 10px;
    color: #888;
    text-align: center;
    padding: 12px 4px;
    font-style: italic;
}

/* Stage-Farben (top border) */
.kanban-col[data-stage="pitch"]   { border-top-color: #888;    }
.kanban-col[data-stage="sprint1"] { border-top-color: #2b6ed8; }
.kanban-col[data-stage="sprint2"] { border-top-color: #9c5bd5; }
.kanban-col[data-stage="final"]   { border-top-color: #d6a01e; }
.kanban-col[data-stage="invoice"] { border-top-color: #2aa84a; }

/* ---- Karten ---- */
.kanban-card {
    background: #fff;
    border: 1px solid #707070;
    border-left: 4px solid #888;
    /* v0.9.4.57: mehr Padding + Abstand — vorher zu gequetscht */
    padding: 7px 9px;
    font-size: 10px;
    position: relative;
    cursor: pointer;
    box-shadow: 1px 1px 0 #888;
    transition: transform 0.1s;
    line-height: 1.35;
}

.kanban-card:hover {
    transform: translateY(-1px);
    box-shadow: 1px 2px 0 #888;
    background: #fffef0;
}

.kanban-card.tier-common    { border-left-color: #555;    }
.kanban-card.tier-rare      { border-left-color: #0055aa; }
.kanban-card.tier-epic      { border-left-color: #8000a0; }
.kanban-card.tier-legendary { border-left-color: #a08000; }

.kanban-card.blocked {
    background: #fde0e0;
}

.kanban-card.overdue {
    background: #fff4d6;
}

.kanban-card-title {
    font-weight: bold;
    font-size: 11px;
    color: #222;
    line-height: 1.25;
    margin-bottom: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.kanban-card-client {
    font-size: 9px;
    color: #666;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 6px;
}

.kanban-card-bars {
    display: flex;
    gap: 3px;
    margin: 6px 0;
}

.kanban-card-bar {
    flex: 1;
    height: 7px;
    background: #e8e8e8;
    border: 1px solid #a0a0a0;
    position: relative;
    overflow: hidden;
}

.kanban-card-bar-fill {
    position: absolute; top:0; left:0;
    height: 100%;
    transition: width 0.3s;
}

.kanban-card-bar[data-cat="dev"]            .kanban-card-bar-fill { background: #2b6ed8; }
.kanban-card-bar[data-cat="design"]         .kanban-card-bar-fill { background: #2aa84a; }
.kanban-card-bar[data-cat="marketing"]      .kanban-card-bar-fill { background: #d63c3c; }
.kanban-card-bar[data-cat="marketing-live"] .kanban-card-bar-fill { background: #e69ac0; }

.kanban-card-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 9px;
    color: #444;
    margin-top: 5px;
    gap: 6px;
}

.kanban-card-q {
    font-weight: bold;
    padding: 0 3px;
    border: 1px solid currentColor;
    border-radius: 2px;
    background: #fff;
}

.kanban-card-deadline.ok     { color: #0a6b0a; }
.kanban-card-deadline.warn   { color: #b37a00; }
.kanban-card-deadline.late   { color: #a00;    font-weight: bold; }

.kanban-card-lock {
    position: absolute; top: 2px; right: 3px;
    font-size: 10px;
    color: #a00;
}

/* Completed-Mini-Stack */
.kanban-card-mini {
    background: #eef6ee;
    border: 1px solid #8bb18b;
    /* v0.9.4.57: mehr Padding + Line-Height fuer Lesbarkeit */
    padding: 5px 7px;
    margin-bottom: 4px;
    font-size: 10px;
    line-height: 1.35;
    color: #335;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 3px;
}

.kanban-card-mini .pay { color: #0a6b0a; font-weight: bold; font-family: monospace; }

/* v0.9.4.56: Marketing-Kampagnen-Mini-Karten. Subtiler rosa Hintergrund, passt zum
   Magenta/Pink des laufenden project-items in der Liste (#fff0f7). */
.kanban-card-marketing {
    background: #fff0f7;
    border-color: #d8a5c5;
}
.kanban-card-marketing .kanban-card-bar {
    flex: 1 0 100%;
    height: 5px;
    margin-top: 2px;
}

/* Tab-Bar (Legacy/Kanban-Switch) */
.projects-view-tabs {
    display: flex;
    gap: 2px;
    border-bottom: 1px solid var(--win-dark, #808080);
    margin-bottom: 6px;
}
.projects-view-tabs button {
    padding: 3px 10px;
    font-size: 11px;
}
.projects-view-tabs button.active {
    background: #fff !important;
    font-weight: bold;
}

/* Legende unter dem Board */
.kanban-legend {
    font-size: 9px;
    color: #555;
    margin-top: 4px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.kanban-legend span { display: inline-flex; align-items: center; gap: 3px; }
.kanban-legend .sw {
    width: 10px; height: 10px; display: inline-block;
    border: 1px solid #808080;
}

/* ============================================================
   v0.9.5.25 — Health-Hinweise auf Kanban-Karten (parallel zur Liste).
   slow / stalled / overdue / Sub-Phase-Badge / Spalten-Flags.
   ============================================================ */

/* --- Stalled (nicht abwickelbar) --- */
.kanban-card.stalled {
    border-color: #b33;
    background: repeating-linear-gradient(
        135deg,
        #fde0e0 0 8px,
        #fbd0d0 8px 16px
    );
    box-shadow: 1px 1px 0 #a33;
}
.kanban-card.stalled:hover {
    background: repeating-linear-gradient(
        135deg,
        #fdd0d0 0 8px,
        #fbb8b8 8px 16px
    );
}

/* --- Slow (zu langsam) --- */
.kanban-card.slow {
    border-color: #c8a23c;
    background: repeating-linear-gradient(
        135deg,
        #fff6d8 0 8px,
        #fbe8b0 8px 16px
    );
    box-shadow: 1px 1px 0 #b88920;
}
.kanban-card.slow:hover {
    background: repeating-linear-gradient(
        135deg,
        #fff0c0 0 8px,
        #fbd888 8px 16px
    );
}

/* --- Overdue behält bisherige Priorität (Karte ohne stalled/slow),
       kombiniert aber mit denen, indem sie den Rand verstärkt.       --- */
.kanban-card.overdue {
    border-top: 2px solid #a00;
}
.kanban-card.stalled.overdue,
.kanban-card.slow.overdue {
    border-top: 2px solid #a00;
}

/* Health-Badge oben rechts */
.kanban-card-health {
    position: absolute;
    top: 2px; right: 3px;
    font-size: 9px;
    padding: 1px 4px;
    border: 1px solid currentColor;
    background: #fff;
    font-weight: bold;
    line-height: 1.1;
    border-radius: 2px;
    pointer-events: auto;
    cursor: help;
}
.kanban-card-health.stalled { color: #a00; }
.kanban-card-health.slow    { color: #8a6000; }

/* Sub-Phase-Badge unten (innerhalb der Karte) */
.kanban-card-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 5px;
}
.kanban-card-phase {
    font-size: 9px;
    color: #555;
    padding: 0 5px;
    border: 1px solid #c0c0c0;
    background: #f6f6f6;
    border-radius: 2px;
    line-height: 1.35;
}

/* Spalten-Kopf-Flags (Anzahl stalled/slow neben dem Titel) */
.kanban-col-head {
    display: flex;
    align-items: center;
    gap: 4px;
}
.kanban-col-flags {
    display: inline-flex;
    gap: 3px;
    margin-left: 2px;
}
.kanban-col-flag {
    font-size: 9px;
    padding: 0 4px;
    border: 1px solid currentColor;
    background: #fff;
    border-radius: 2px;
    font-weight: bold;
    cursor: help;
}
.kanban-col-flag.stalled { color: #a00; }
.kanban-col-flag.slow    { color: #8a6000; }

/* Legende: Swatches für stalled/slow */
.kanban-legend .sw.sw-stalled {
    background: repeating-linear-gradient(
        135deg,
        #fde0e0 0 4px,
        #fbb8b8 4px 8px
    );
    border-color: #b33;
}
.kanban-legend .sw.sw-slow {
    background: repeating-linear-gradient(
        135deg,
        #fff6d8 0 4px,
        #fbd888 4px 8px
    );
    border-color: #c8a23c;
}