/* =========================================================================
   @ibgib/web-gib — VCS Component Stylesheet
   Shared Shadow DOM styles and CSS custom properties for Branching/VCS UI components.
   Provides theming for file status (untracked, modified, deleted, staged),
   badges, diff previews, and commit timeline nodes.
   ========================================================================= */

:host, :root {
    /* ── VCS Status Palette (aligned with VSCode and ibGib theme) ── */
    --vcs-clr-untracked: #73c991;       /* Green for new / untracked files */
    --vcs-clr-untracked-bg: rgba(115, 201, 145, 0.12);
    --vcs-clr-untracked-border: rgba(115, 201, 145, 0.3);

    --vcs-clr-added: #78f87e;           /* Bright green for staged / added files */
    --vcs-clr-added-bg: rgba(120, 248, 126, 0.12);
    --vcs-clr-added-border: rgba(120, 248, 126, 0.3);

    --vcs-clr-modified: #e2c08d;        /* Yellow / amber for modified files */
    --vcs-clr-modified-bg: rgba(226, 192, 141, 0.12);
    --vcs-clr-modified-border: rgba(226, 192, 141, 0.3);

    --vcs-clr-deleted: #ff5b5b;         /* Red for deleted files */
    --vcs-clr-deleted-bg: rgba(255, 91, 91, 0.12);
    --vcs-clr-deleted-border: rgba(255, 91, 91, 0.3);

    --vcs-clr-conflict: #f85149;        /* Orange-red for merge conflicts */
    --vcs-clr-conflict-bg: rgba(248, 81, 73, 0.12);
    --vcs-clr-conflict-border: rgba(248, 81, 73, 0.3);

    --vcs-clr-ignored: #6e7681;         /* Muted gray for ignored items */

    /* ── Badge & Indicator Metrics ── */
    --vcs-badge-font-size: 0.65rem;
    --vcs-badge-radius: 3px;
    --vcs-badge-font-weight: 700;
}

/* ── Status Text Classes ── */
.vcs-untracked, .vcs-item-untracked {
    color: var(--vcs-clr-untracked) !important;
}

.vcs-added, .vcs-item-added {
    color: var(--vcs-clr-added) !important;
}

.vcs-modified, .vcs-item-modified {
    color: var(--vcs-clr-modified) !important;
}

.vcs-deleted, .vcs-item-deleted {
    color: var(--vcs-clr-deleted) !important;
    text-decoration: line-through;
}

.vcs-ignored, .vcs-item-ignored {
    color: var(--vcs-clr-ignored) !important;
}

/* ── Status Badges (e.g. U, M, A, D) ── */
.vcs-status-badge {
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Monaco, Consolas, monospace;
    font-size: var(--vcs-badge-font-size);
    font-weight: var(--vcs-badge-font-weight);
    padding: 1px 4px;
    border-radius: var(--vcs-badge-radius);
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    flex-shrink: 0;
    text-transform: uppercase;
}

.vcs-status-badge.untracked, .vcs-status-badge.u {
    color: var(--vcs-clr-untracked);
    background: var(--vcs-clr-untracked-bg);
    border: 1px solid var(--vcs-clr-untracked-border);
}

.vcs-status-badge.added, .vcs-status-badge.a {
    color: var(--vcs-clr-added);
    background: var(--vcs-clr-added-bg);
    border: 1px solid var(--vcs-clr-added-border);
}

.vcs-status-badge.modified, .vcs-status-badge.m {
    color: var(--vcs-clr-modified);
    background: var(--vcs-clr-modified-bg);
    border: 1px solid var(--vcs-clr-modified-border);
}

.vcs-status-badge.deleted, .vcs-status-badge.d {
    color: var(--vcs-clr-deleted);
    background: var(--vcs-clr-deleted-bg);
    border: 1px solid var(--vcs-clr-deleted-border);
}

.vcs-status-badge.conflict, .vcs-status-badge.c {
    color: var(--vcs-clr-conflict);
    background: var(--vcs-clr-conflict-bg);
    border: 1px solid var(--vcs-clr-conflict-border);
}