﻿/**
 * Proof Pane Component
 * 
 * Styles for the proof editor container and related elements.
 * Dependencies: variables.css
 */

/* === Proof Pane Container === */
.proof-pane {
  background: var(--background);
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-xl);
  min-width: 0;
  overflow-x: hidden; /* Prevent overflow into right column - scrolling happens in .proof */
}

/* === Results Pane Container === */
.results-pane {
  background: var(--background);
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-xl);
}

.results-pane--success {
  border-color: var(--success-color);
  background: var(--success-background);
}

.results-pane--error {
  border-color: var(--error-color);
  background: var(--error-background);
}

.proof {
  background: transparent;
  border: none;
  border-radius: 0;
  overflow-x: auto; /* Scroll horizontally when proof lines are wider than container */
  overflow-y: visible;
  width: 100%;
  padding-bottom: var(--proof-padding-bottom);
}

/* === Results Display === */
.help {
  color: var(--text-color-muted);
  font-size: var(--font-size-md);
  margin: var(--help-margin);
}

.results {
  margin: 0;
  padding: 0;
  color: var(--ink);
  font-size: var(--font-size-xl);
  display: none;
}

.results--show {
  display: block;
}

/* === Editor Actions === */
.editor-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--spacing-md);
  margin-top: var(--editor-actions-margin-top);
}
