/* AI Split Panel — Claude palette */

.ai-split-panel {
    width: var(--ai-panel-width); min-width: var(--ai-panel-min-w);
    display: flex; flex-direction: column;
    background: var(--claude-bg-panel); border-left: 1px solid var(--claude-border);
}
.ai-split-panel.hidden { display: none; }

.ai-split-header {
    display: flex; justify-content: space-between; align-items: center;
    padding: var(--space-8) var(--space-12); border-bottom: 1px solid var(--claude-border);
    background: var(--claude-bg-surface); position: relative;
}

.ai-panel-title {
    display: flex; align-items: center; gap: var(--space-8);
    font-size: var(--font-size-md); font-weight: var(--font-weight-medium);
    color: var(--claude-text-primary);
}
.ai-panel-title i { color: var(--claude-terracotta); }
.ai-panel-actions { display: flex; align-items: center; gap: var(--space-12); }
.ai-panel-actions .btn { color: var(--claude-text-muted); }
.ai-panel-actions .btn:hover { color: var(--claude-text-primary); background: var(--claude-bg-hover); }

.ai-panel-content {
    display: flex; flex-direction: column; flex: 1;
    min-height: 0; overflow: hidden;
}

/* Mobile: AI panel becomes fullscreen overlay instead of side-by-side split */
@media (max-width: 768px) {
    .ai-split-panel {
        position: absolute;
        inset: 0;
        width: 100%;
        min-width: 0;
        z-index: 50;
        border-left: none;
    }
}