/* ============================================================
   LEFT SIDEBAR — History & TOC
   ============================================================ */

#left-sidebar {
    --sb-pad: 6px;
    width: var(--sidebar-w);
    min-width: 180px;
    background: var(--chrome-gradient);
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    position: relative;
}

/* sidebar collapse btn — removed, auto-hide on resize instead */

.sidebar-title {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--t3);
}

.sidebar-action-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px; height: 30px;
    border-radius: var(--radius-sm);
    border: none;
    background: none;
    color: var(--t3);
    cursor: pointer;
    transition: background var(--dur), color var(--dur);
}
.sidebar-action-btn:hover { background: var(--chrome-hover); color: var(--t2); }

/* ---- Table of Contents ---- */
#toc-section {
    overflow-y: auto;
    flex-shrink: 0;
    height: 50%;
    min-height: 60px;
}

#toc-doc-name {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 10px calc(var(--sb-pad) - 2px) 6px calc(var(--sb-pad) + 6px);
    flex-shrink: 0;
    position: relative;
}

#toc-doc-label {
    font: 600 14px var(--sans);
    color: var(--t1);
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1;
    min-width: 0;
    transition: color var(--dur);
}
#toc-doc-label:hover { color: var(--accent); }

.toc-menu-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px; height: 28px;
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    background: none;
    color: var(--t3);
    cursor: pointer;
    flex-shrink: 0;
    transition: background var(--dur), color var(--dur), border-color var(--dur);
}
.toc-menu-btn:hover { background: var(--chrome-hover); color: var(--t1); border-color: var(--chrome-border); }

#toc-list {
    padding: 0 var(--sb-pad) 10px;
}

.toc-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    font-size: 12px;
    color: var(--t2);
    border-radius: var(--radius-sm);
    cursor: pointer;
    transition: background var(--dur), color var(--dur);
    overflow: hidden;
    min-width: 0;
}
.toc-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
.toc-item:hover { background: var(--chrome-hover); }
.toc-item.active { background: var(--accent-dim); }
.toc-item.level-1 { color: var(--accent); }
.toc-item.level-1:hover { color: var(--accent); }
.toc-item.level-2 { padding-left: 20px; font-size: var(--fs-xs); color: var(--t2); }
.toc-item.level-2:hover { color: var(--t1); }
.toc-item.level-3 { padding-left: 32px; font-size: 11px; color: var(--t2); }
.toc-item.level-3:hover { color: var(--t1); }

.toc-num {
    font-size: 10px;
    color: var(--t3);
    flex-shrink: 0;
    font-variant-numeric: tabular-nums;
    min-width: 14px;
}
.toc-item.level-1 .toc-num { color: var(--accent); opacity: 0.8; }
.toc-item.level-2 .toc-num { color: var(--t2); }
.toc-item.level-3 .toc-num { color: var(--t2); }

/* ---- Revision list ---- */
#revision-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px var(--sb-pad) 8px calc(var(--sb-pad) + 6px);
}

#revision-list {
    flex: 1;
    overflow-y: auto;
    padding: 0 var(--sb-pad) 12px;
}

/* -- Filter bar (matches doc-search-bar style) -- */
.rev-filter-bar {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 6px 10px 8px;
    position: sticky;
    top: 0;
    background: var(--chrome-bg);
    z-index: var(--z-sticky);
    border-bottom: 1px solid var(--chrome-border-subtle);
    margin-bottom: 4px;
}
.rev-filter-row {
    display: flex;
    align-items: center;
    gap: 4px;
}
.rev-filter-input {
    flex: 1;
    background: var(--chrome-bg2);
    border: 1px solid var(--chrome-border);
    border-radius: var(--radius-sm);
    color: var(--t1);
    font: 12px var(--sans);
    padding: 4px 8px;
    outline: none;
    min-width: 0;
    transition: border-color var(--dur);
}
.rev-filter-input:focus { border-color: var(--accent-border); }
.rev-filter-input::placeholder { color: var(--t3); }
.rev-filter-clear {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px; height: 22px;
    border-radius: var(--radius-sm);
    border: none;
    background: none;
    color: var(--t3);
    cursor: pointer;
    font: 600 11px var(--sans);
    flex-shrink: 0;
    transition: background var(--dur), color var(--dur);
}
.rev-filter-clear:hover { background: var(--chrome-hover); color: var(--t1); }

/* -- Date group headers (sticky inside scroll) -- */
.rev-date-header {
    position: sticky;
    top: 0;
    background: var(--chrome-bg);
    font: 600 10px var(--sans);
    color: var(--t3);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 6px 4px 3px;
    z-index: 1;
}

/* -- "Current version" always-on entry -- */
.rev-current {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: var(--radius);
    cursor: pointer;
    transition: background var(--dur);
    margin-bottom: 2px;
}
.rev-current:hover { background: var(--chrome-hover); }
.rev-current.active { background: var(--accent-dim); }
.rev-current-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    background: var(--accent);
    flex-shrink: 0;
    margin-left: 3px;
}
.rev-current.active .rev-current-dot { box-shadow: 0 0 0 3px var(--accent-dim); }
.rev-current-label {
    font: 500 12px var(--sans);
    color: var(--t2);
    flex: 1;
}
.rev-current.active .rev-current-label { color: var(--t1); }

/* -- Revision entries -- */
.rev-item {
    display: flex;
    flex-direction: column;
    padding: 8px 10px;
    border-radius: var(--radius);
    cursor: pointer;
    transition: background var(--dur) var(--ease);
}
.rev-item:hover { background: var(--chrome-hover); }
.rev-item.active { background: var(--accent-dim); }

.rev-row {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}
.rev-icon {
    margin-top: 5px;
    flex-shrink: 0;
    width: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    color: var(--t3);
}
.rev-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    display: inline-block;
}
.rev-dot.type-user  { background: var(--accent-hover); }
.rev-dot.type-agent { background: var(--accent); }
.rev-dot.type-auto  { background: var(--t3); }

.rev-info { flex: 1; min-width: 0; }
.rev-label {
    font: 12px/1.4 var(--sans);
    color: var(--t2);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.rev-item.active .rev-label { color: var(--t1); }
.rev-item.type-user .rev-label { color: var(--accent); }
.rev-meta { font-size: 10px; color: var(--t3); margin-top: 1px; }

/* -- Revision group children (nested under Current / user saves) -- */
.rev-group-children {
    padding-left: 6px;
    border-left: 1px solid var(--chrome-border-subtle);
    margin-left: 16px;
}
.rev-group-children.collapsed { display: none; }
.rev-group-toggle {
    background: none; border: none; color: var(--t3); cursor: pointer;
    font-size: 14px; padding: 0 4px; flex-shrink: 0;
    transition: color var(--dur);
}
.rev-group-toggle:hover { color: var(--t1); }
/* -- User save header -- */
.rev-user-save {
    display: flex;
    flex-direction: column;
    padding: 7px 10px;
    border-radius: var(--radius);
    cursor: pointer;
    transition: background var(--dur) var(--ease);
    margin-top: 4px;
}
.rev-user-save:hover { background: var(--chrome-hover); }
.rev-user-save.active { background: var(--accent-dim); }
.rev-user-save .rev-icon { font-size: 13px; color: var(--accent-text); }
/* legacy compat */
.rev-auto-group-body {
    padding-left: 6px;
    border-left: 1px solid var(--chrome-border-subtle);
    margin-left: 16px;
}

/* ---- Sidebar rail (collapsed state) ---- */
#sidebar-rail, #chat-rail {
    width: 36px;
    background: var(--chrome-gradient);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
#sidebar-rail { }
#chat-rail    { }

.rail-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px; height: 26px;
    border-radius: var(--radius-sm);
    border: none;
    background: none;
    color: var(--t3);
    cursor: pointer;
    transition: background var(--dur), color var(--dur);
}
.rail-btn:hover { background: var(--chrome-hover); color: var(--t2); }

/* ---- Vertical resize handle (TOC ↔ Checkpoints) ---- */
.sidebar-v-resize {
    height: 1px;
    cursor: row-resize;
    background: var(--panel-border);
    transition: background var(--dur);
    flex-shrink: 0;
    position: relative;
    margin-right: -4px;
}
.sidebar-v-resize::after {
    content: '';
    position: absolute;
    inset: -5px 0;
}
.sidebar-v-resize:hover, .sidebar-v-resize.dragging { background: var(--accent); }
