.b-task-board-base {
    --b-task-board-background                  : #fff;

    --b-task-board-column-gap                  : 0;
    --b-task-board-column-background           : var(--b-neutral-100);
    --b-task-board-column-header-background    : var(--b-neutral-100);
    --b-task-board-column-header-padding       : 1em;
    --b-task-board-column-separator-border     : 1px solid var(--border-color);
    --b-task-board-column-header-border-top    : 1px solid var(--border-color);
    --b-task-board-column-header-border-bottom : 1px solid var(--border-color);

    --b-task-board-card-border-top-radius      : 0;
    --b-task-board-card-border-bottom-radius   : 0;

    /* App specific vars */
    --border-color                             : var(--b-neutral-85);
    --details-color                            : #aaa;

    .b-colorize {
        --b-task-board-card-border-top : 3px solid var(--b-primary);
    }

    .done {
        opacity : 0.4;
    }
}

.b-task-board-card-header i {
    color : var(--b-primary);
}

.details {
    display               : grid;
    grid-template-columns : 6em 1fr;
    align-items           : center;
    color                 : var(--b-task-board-card-body-color);

    label {
        color : var(--details-color);
    }

    div {
        i {
            margin-inline-start : .5em;
        }
    }
}
