/* =========================
   Shared button styling
========================= */

.tool-actions button,
.tool-actions .import-label,
.trash-item-actions button,
.chapter-body-actions button,
.chapter-mini-btn {
  padding: var(--space-4) var(--space-7);
  border: none;
  border-radius: var(--radius-pill);
  background: var(--bg-glass);
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
  transition:
    background var(--transition-fast),
    color var(--transition-fast),
    transform var(--transition-fast);
}

.tool-actions button:hover,
.tool-actions .import-label:hover,
.trash-item-actions button:hover,
.chapter-body-actions button:hover,
.chapter-mini-btn:hover {
  background: var(--bg-glass-strong);
  color: var(--text-primary);
}

.helper-text {
  margin: var(--space-6) 0 0;
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-preview);
  opacity: 0.7;
}

.empty-note,
.search-empty,
.custom-word-empty,
.trash-empty {
  padding: var(--space-6) 0;
  color: var(--text-secondary);
}

/* =========================
   Main editor
========================= */

.main-editor-card {
  width: 100%;
  margin-top: var(--space-0);
  padding: var(--space-0);
  background: transparent;
}

.main-editor {
  min-height: 50vh;
  padding: var(--space-10);
  background: var(--bg-main);
  color: var(--text-secondary);
  outline: none;
  line-height: var(--line-height-editor);
  white-space: pre-wrap;
  word-break: break-word;
  -webkit-user-select: text;
  user-select: text;
  caret-color: var(--text-primary);
	font-family: var(--font-write);
}

.main-editor:empty::before {
  content: attr(data-placeholder);
  color: var(--text-muted);
  opacity: 0.5;
  pointer-events: none;
}

.main-editor::selection,
.main-editor *::selection {
  background: var(--selection-bg);
}

.main-editor-actions {
  display: flex;
  justify-content: flex-end;
  padding: var(--space-7) var(--space-3) 0;
  background: transparent;
}

.main-editor-actions button {
  padding: var(--space-4) var(--space-7);
  border: none;
  border-radius: var(--radius-pill);
  background: var(--bg-glass);
  color: var(--text-secondary);
}

.main-editor-actions button:hover {
  background: var(--bg-glass-strong);
  color: var(--text-primary);
}

/* =========================
   Legacy editor pieces
========================= */

.chapter-field {
  margin-bottom: var(--space-6);
}

.chapter-label {
  display: block;
  margin-bottom: var(--space-2);
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
  opacity: 0.75;
}

.chapter-title-input,
.chapter-goal-input,
#searchInput,
#replaceInput,
#customWordInput,
#currentChapterGoal,
#totalBookGoal,
#authorNameInput,
#bookTitleInput {
  width: 100%;
  padding: var(--space-5) var(--space-6);
  border: none;
  border-radius: var(--radius-pill);
  background: var(--bg-glass-strong);
  color: var(--text-primary);
  outline: none;
}

.chapter-title-input::placeholder,
.chapter-goal-input::placeholder,
#searchInput::placeholder,
#replaceInput::placeholder,
#customWordInput::placeholder,
#currentChapterGoal::placeholder,
#totalBookGoal::placeholder,
#authorNameInput::placeholder,
#bookTitleInput::placeholder {
  color: var(--text-muted);
}

.chapter-editor {
  min-height: 220px;
  padding: var(--space-6);
  background: var(--editor-bg-light);
  color: var(--editor-text-light);
  outline: none;
  line-height: var(--line-height-editor);
  white-space: pre-wrap;
  word-break: break-word;
  -webkit-user-select: text;
  user-select: text;
  caret-color: var(--editor-caret-light);
}

.chapter-editor:empty::before {
  content: attr(data-placeholder);
  color: var(--editor-placeholder-light);
}

.chapter-editor::selection,
.chapter-editor *::selection {
  background: var(--selection-bg);
}

.style-summary {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-4);
}

.style-stat {
  padding: var(--space-6);
  border-radius: var(--radius-lg);
  background: var(--bg-main);
}

.style-sentence-results {
  margin-top: var(--space-6);
  display: grid;
  gap: var(--space-4);
}

.style-sentence-row {
  padding: var(--space-6);
  border-radius: var(--radius-lg);
  background: var(--bg-search-card);
}

.style-sentence-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
  color: var(--text-muted);
  font-size: var(--font-size-xs);
}

.style-sentence-text {
  color: var(--text-secondary);
  line-height: var(--line-height-preview);
}

.style-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: var(--radius-pill);
  background: var(--bg-glass-strong);
  color: var(--text-primary);
}

.style-flag {
  background: transparent;
  color: inherit;
  padding: 0;
  border-radius: 0;
}

.style-flag-adverb {
  background: rgba(255, 196, 0, 0.22);
  color: inherit;
  border-radius: 3px;
  padding: 0 1px;
}

.style-sentence-row.is-hard {
  background: rgba(255, 196, 0, 0.08);
}

.style-sentence-row.is-very-hard {
  background: rgba(255, 120, 80, 0.12);
}

.style-sentence-row.is-passive .style-sentence-text {
  opacity: 0.95;
}

.style-feedback {
  margin-top: var(--space-3);
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.style-feedback-line {
  font-size: var(--font-size-xs);
  color: var(--text-muted);
  line-height: 1.4;
}

.style-feedback-global {
  margin-bottom: var(--space-4);
  padding: var(--space-4);
  border-radius: var(--radius-md);
  background: var(--bg-glass);
}

.drawer-footer-info {
  margin-top: 16px;
  padding: 0 0 18px;
}

.drawer-footer-inner {
  border-top: 1px solid var(--border-soft);
  padding-top: 14px;
  opacity: 0.9;
}

.drawer-footer-title {
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.drawer-footer-meta {
  font-size: 0.78rem;
  opacity: 0.7;
  margin-bottom: 8px;
}

.drawer-footer-info {
  margin-top: 16px;
  padding: 0 0 18px;
}

.drawer-footer-text {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  opacity: 0.75;
}

.drawer-footer-backup {
  margin-top: 8px;
  font-size: 0.75rem;
  opacity: 0.6;
}

* {
  transition:
    background 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease;
}