/* Base styles for the e‑reader application */
body {
  font-family: "Times New Roman", Times, Georgia, serif;
  margin: 0;
  padding: 0;
  background: #ede5cc;
  color: #2c1a06;
}

header {
  background: #1e1005;
  color: #f0ddb8;
  padding: 0.25em 1em;
}

header nav a {
  color: #e8d5b0;
  margin-right: 1em;
  text-decoration: none;
  font-weight: bold;
  font-family: "Times New Roman", Times, Georgia, serif;
  font-size: 1.05em;
  letter-spacing: 0.03em;
}

header nav a:hover {
  color: #d4a843;
  text-decoration: none;
}

/* Nav brand logo chip */
a.nav-brand {
  display: inline-flex;
  align-items: center;
  background: none;
  border-radius: 0;
  padding: 0;
  margin-right: 0.75em;
  vertical-align: middle;
  text-decoration: none !important;
}
a.nav-brand:hover {
  opacity: 0.85;
}
a.nav-brand img {
  height: 44px;
  width: auto;
  display: block;
}

/* Dark / light mode toggle */
#dark-toggle {
  margin-left: 1em;
  background: transparent;
  border: 1px solid rgba(200, 160, 80, 0.4);
  color: #c8b070;
  font-size: 1.1em;
  padding: 0.1em 0.5em;
  border-radius: 6px;
  cursor: pointer;
  font-family: "Times New Roman", Times, Georgia, serif;
  vertical-align: middle;
  line-height: 1.4;
}
#dark-toggle:hover {
  background: rgba(200, 146, 42, 0.15);
  border-color: rgba(200, 146, 42, 0.65);
  color: #d4a843;
}

/* Resume reading nav icon */
.resume-reading-icon {
  height: 30px;
  width: 30px;
  border-radius: 4px;
  object-fit: contain;
  opacity: 0.82;
  transition: opacity 0.2s, transform 0.2s;
  vertical-align: middle;
}
#resume-reading-btn:hover .resume-reading-icon {
  opacity: 1;
  transform: scale(1.1);
}

/* Index hero — full-bleed decorative section */
.index-hero-full {
  margin: -1.5em -1.5em 0 -1.5em;
  padding: 4em 2em 3.5em;
  background: linear-gradient(160deg, #12090a 0%, #271404 35%, #3d2208 65%, #12090a 100%);
  text-align: center;
  color: #f5e6c8;
  min-height: 72vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
}
.index-hero-main-logo {
  max-width: 420px;
  width: 80%;
  display: block;
  margin: 0 auto 1.5em;
  filter: drop-shadow(0 10px 32px rgba(0,0,0,0.6));
}
.index-hero-tagline {
  font-family: Georgia, serif;
  font-size: 1.2em;
  letter-spacing: 0.07em;
  color: #d4a843;
  margin-bottom: 0.8em;
  font-style: italic;
}
.index-hero-divider {
  display: flex;
  align-items: center;
  gap: 0.6em;
  margin: 0.5em auto 1.2em;
  width: 14em;
  color: #9c7220;
}
.index-hero-divider::before,
.index-hero-divider::after {
  content: '';
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, transparent, #9c7220, transparent);
}
.index-hero-ornament {
  font-size: 0.8em;
  color: #c8922a;
}
.index-hero-desc {
  font-family: Georgia, serif;
  font-size: 1em;
  color: #c8b888;
  line-height: 1.8;
  margin-bottom: 2.2em;
  max-width: 34em;
}
.index-hero-actions {
  display: flex;
  gap: 1em;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 2.8em;
}
a.button.index-cta-primary {
  background: #c8922a;
  color: #1a0e04;
  padding: 0.75em 2.2em;
  font-family: Georgia, serif;
  font-size: 1.05em;
  letter-spacing: 0.04em;
  border-radius: 6px;
  font-weight: bold;
}
a.button.index-cta-primary:hover {
  background: #d9a83a;
}
a.button.index-cta-secondary {
  background: transparent;
  color: #e8d8b0;
  border: 1px solid rgba(200,146,42,0.45);
  padding: 0.75em 1.6em;
  font-family: Georgia, serif;
  font-size: 1.05em;
  border-radius: 6px;
}
a.button.index-cta-secondary:hover {
  background: rgba(200,146,42,0.12);
  border-color: rgba(200,146,42,0.7);
}
.index-hero-footer {
  font-family: Georgia, serif;
  font-size: 0.88em;
  color: #7a6038;
  letter-spacing: 0.04em;
}
.index-hero-footer em {
  font-style: italic;
  color: #9c7c44;
}

/* Library hero brand wordmark */
.library-brand-wordmark {
  display: block;
  width: 400px;
  max-width: 100%;
  height: auto;
  margin: 0 auto 0.4em;
}

main, .site-main {
  padding: 1.5em;
  max-width: 800px;
  margin: 0 auto;
  background: #faf6ec;
  box-shadow: 0 0 14px rgba(140, 100, 40, 0.12);
}

.site-main--index {
  max-width: none;
  padding: 0;
  background: none;
  box-shadow: none;
  margin: 0;
}

h1 {
  margin-top: 0;
}

/* Buttons */
a.button,
button {
  display: inline-block;
  padding: 0.5em 1em;
  background: #9e6820;
  color: #fff;
  border: none;
  border-radius: 4px;
  text-decoration: none;
  cursor: pointer;
  font-size: 1em;
  font-family: "Times New Roman", Times, Georgia, serif;
}

a.button:hover,
button:hover {
  background: #7d5018;
}

.danger-button {
  background: #b63d2f;
}

.danger-button:hover {
  background: #912f24;
}

/* Table styles */
table.book-list {
  width: 100%;
  border-collapse: collapse;
  margin-top: 1em;
}

table.book-list th,
table.book-list td {
  border: 1px solid #ddd;
  padding: 0.5em;
  text-align: left;
}

table.book-list th {
  background: #ede0c0;
}

/* Book gallery styles */
.book-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
}

.book-card {
  background: #faf5e8;
  border: 1px solid #d0c098;
  border-radius: 4px;
  padding: 1em;
  box-sizing: border-box;
  width: calc(33% - 1em);
}

.book-card h3 {
  margin-top: 0;
  margin-bottom: 0.5em;
}

.book-card .book-date {
  color: #666;
  font-size: 0.9em;
  margin-top: 0;
  margin-bottom: 0.5em;
}

.book-card a.button {
  margin-right: 0.5em;
}

.library-hero {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 1.5em;
  margin-bottom: 1.5em;
  padding: 1.5em;
  border-radius: 18px;
  background: linear-gradient(135deg, #f0e8d8 0%, #e4dac5 100%);
  border: 1px solid #c8b890;
}

.library-eyebrow {
  margin: 0 0 0.35em;
  font-size: 0.78em;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #7a5c30;
}

.author-shelf-kicker {
  display: none;
}

.library-subtitle {
  max-width: 42em;
  margin: 0.5em 0 0;
  color: #5a3e18;
}

.library-summary-card {
  min-width: 9em;
  padding: 1em 1.1em;
  border-radius: 16px;
  background: rgba(255, 248, 232, 0.9);
  border: 1px solid rgba(200, 178, 120, 0.5);
  text-align: center;
  box-shadow: 0 6px 20px rgba(120, 80, 20, 0.1);
}

.library-summary-value {
  font-size: 2rem;
  font-weight: 700;
  line-height: 1;
}

.library-summary-label {
  margin-top: 0.35em;
  color: #5a3e18;
}

.author-shelf-list {
  display: flex;
  flex-direction: column;
  gap: 1.25em;
}

.author-shelf {
  padding: 1.25em;
  border: 1px solid #d0c098;
  border-radius: 18px;
  background: linear-gradient(180deg, #faf6ec 0%, #f0e8d5 100%);
}

.author-shelf-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1em;
  margin-bottom: 1em;
}

.author-shelf-header h2 {
  margin: 0;
}

.author-shelf-count {
  padding: 0.45em 0.8em;
  border-radius: 999px;
  background: #ece0c0;
  color: #5a3e18;
  font-size: 0.95em;
}

/* ─── Remote book browser ─────────────────────────────────────────── */
.remote-book-list {
  border: 1px solid #d4c8b0;
  border-radius: 6px;
  max-height: 380px;
  overflow-y: auto;
  background: #fffdf8;
  margin: 0.25em 0;
}

.remote-book-row {
  display: flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.35em 0.6em;
  border-bottom: 1px solid #ede7d8;
  font-size: 0.88em;
}
.remote-book-row:last-child { border-bottom: none; }
.remote-book-row:nth-child(even) { background: #faf7f0; }
.remote-book-row:hover { background: #f3ecdf; }

.remote-folder-row { color: #5a3e10; font-style: italic; }

.remote-book-cb { flex-shrink: 0; cursor: pointer; }

.remote-book-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ─── Job progress list ───────────────────────────────────────────── */
.job-item-list {
  display: flex;
  flex-direction: column;
  border: 1px solid #d4c8b0;
  border-radius: 6px;
  overflow: hidden;
  max-height: 360px;
  overflow-y: auto;
}

.job-item-row {
  display: flex;
  align-items: center;
  gap: 0.6em;
  padding: 0.35em 0.6em;
  border-bottom: 1px solid #ede7d8;
  font-size: 0.85em;
  background: #fffdf8;
}
.job-item-row:last-child { border-bottom: none; }
.job-item-queued  { color: #8a8060; }
.job-item-running { color: #2a60a0; background: #f0f4ff; }
.job-item-completed { color: #267a20; background: #f0fff0; }
.job-item-failed  { color: #8a1010; background: #fff0f0; }

.job-status-badge {
  flex-shrink: 0;
  min-width: 1.4em;
  text-align: center;
  font-weight: 600;
}
.job-item-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.job-item-error {
  font-size: 0.8em;
  color: #8a1010;
  margin-left: 0.4em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 240px;
}

/* ─── Paragraph editor ───────────────────────────────────────────── */
.para-editor-summary {
  font-size: 0.9em;
  color: #666;
  margin: 0.5em 0 0.75em;
}

.para-editor-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border: 1px solid #d4c8b0;
  border-radius: 4px;
  overflow: hidden;
}

.para-row {
  display: flex;
  align-items: flex-start;
  gap: 0.6em;
  padding: 0.45em 0.6em;
  border-bottom: 1px solid #ede7d8;
  background: #fffdf8;
  flex-wrap: wrap;
}
.para-row:last-child { border-bottom: none; }
.para-row:nth-child(even) { background: #faf7f0; }

.para-idx-badge {
  flex-shrink: 0;
  display: inline-block;
  min-width: 2.5em;
  text-align: right;
  font-size: 0.72em;
  font-family: monospace;
  color: #999;
  padding-top: 0.25em;
}

.para-text-preview {
  flex: 1 1 0;
  min-width: 0;
  font-size: 0.88em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-top: 0.2em;
  color: #333;
}

.para-edit-input {
  flex: 1 1 100%;
  width: 100%;
  font-size: 0.88em;
  font-family: inherit;
  padding: 0.35em;
  border: 1px solid #b8a880;
  border-radius: 3px;
  resize: vertical;
  box-sizing: border-box;
}

.para-actions {
  display: flex;
  flex-shrink: 0;
  gap: 0.3em;
  align-items: center;
}

.para-action-btn {
  font-size: 0.75em;
  padding: 0.2em 0.55em;
  border: 1px solid #b8a880;
  border-radius: 3px;
  background: #f5efe0;
  color: #4a3a20;
  cursor: pointer;
  white-space: nowrap;
}
.para-action-btn:hover { background: #ebe0c8; }

.para-save-inline-btn {
  background: #d4e8c0;
  border-color: #88b060;
  color: #2c4a10;
}
.para-save-inline-btn:hover { background: #c0dc9a; }

.para-delete-btn {
  background: #f8e0e0;
  border-color: #d09090;
  color: #7a2020;
}
.para-delete-btn:hover { background: #f0c8c8; }

.para-split-btn {
  background: #e0e8f8;
  border-color: #90a8d0;
  color: #1a3060;
}
.para-split-btn:hover { background: #c8d8f0; }

.para-page-divider {
  display: flex;
  align-items: center;
  gap: 0.75em;
  padding: 0.3em 0.6em;
  background: #f0e8d0;
  border-bottom: 1px solid #d4c8b0;
  border-top: 2px solid #c8a95a;
}

.para-page-label {
  font-size: 0.75em;
  font-weight: 700;
  color: #7a5826;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  flex: 1;
}

.para-merge-btn {
  font-size: 0.72em;
  padding: 0.15em 0.5em;
  border: 1px solid #c8a95a;
  border-radius: 3px;
  background: #fdf5e0;
  color: #7a5826;
  cursor: pointer;
}
.para-merge-btn:hover { background: #f5e8c0; }

.para-save-message {
  margin-top: 0.6em;
  font-size: 0.9em;
  min-height: 1.2em;
}
.para-save-message.success { color: #2a6a10; }
.para-save-message.error   { color: #8a1010; }

/* ─── Collection shelf ───────────────────────────────────────────── */
.collection-shelf {
  margin-top: 1em;
}

.collection-shelf-title {
  font-size: 1em;
  font-weight: 600;
  color: #7a5826;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 0.6em 0;
  padding-left: 0.25em;
  border-left: 3px solid #c8a95a;
}

.book-order-badge {
  display: inline-block;
  font-size: 0.75em;
  font-weight: 700;
  color: #fff;
  background: #8a6530;
  border-radius: 999px;
  padding: 0.15em 0.6em;
  letter-spacing: 0.04em;
}

.author-book-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1em;
}

.book-card-rich {
  width: auto;
  border-radius: 16px;
  padding: 1.1em;
  background: #fff9ee;
  box-shadow: 0 4px 16px rgba(100, 70, 20, 0.1);
}

.book-card-topline {
  display: flex;
  justify-content: space-between;
  gap: 1em;
  margin-bottom: 0.7em;
  font-size: 0.82em;
  color: #7a5c30;
}

.book-card-author {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.book-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75em;
  margin: 1em 0;
}

.collection-description {
  margin: 0.8em 0 0;
  color: #5a3e18;
  line-height: 1.5;
}

.book-metric {
  padding: 0.75em 0.8em;
  border-radius: 12px;
  background: #f5edd8;
  border: 1px solid #d8c498;
}

.book-metric-value {
  display: block;
  font-weight: 700;
}

.book-metric-label {
  display: block;
  margin-top: 0.2em;
  font-size: 0.85em;
  color: #7a5c30;
}

.book-actions-primary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6em;
}

.book-actions-toggle {
  margin-top: 0.9em;
  padding-top: 0.9em;
  border-top: 1px solid #e5ebf1;
}

.book-actions-toggle summary {
  cursor: pointer;
  font-weight: 700;
  color: #465260;
}

.book-actions-panel {
  display: flex;
  flex-direction: column;
  gap: 0.8em;
  margin-top: 0.9em;
}

.book-actions-panel form {
  margin: 0;
}

.library-empty-state {
  padding: 2em;
  border: 1px dashed #c8b890;
  border-radius: 18px;
  background: #faf5e8;
  text-align: center;
}

@media (max-width: 600px) {
  .library-hero,
  .author-shelf-header,
  .book-card {
    width: 100%;
  }

  .library-hero,
  .author-shelf-header,
  .book-card-topline {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Form styles */
.form-group {
  margin-bottom: 1em;
}

.inline-checkbox {
  display: flex;
  align-items: center;
  gap: 0.5em;
  margin: 0.5em 0 0.75em;
  font-weight: normal;
}

.inline-checkbox input[type='checkbox'] {
  width: auto;
  margin: 0;
}

.button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75em;
  margin-top: 0.75em;
}

.button-row form {
  margin: 0;
}

.split-overview,
.split-preview-panel {
  margin-bottom: 1.5em;
  padding: 1em;
  border: 1px solid #d8dde3;
  border-radius: 8px;
  background: #f8fafc;
}

.danger-zone {
  margin: 1.5em 0;
  padding: 1em;
  border: 1px solid #f0c6c1;
  border-radius: 8px;
  background: #fff5f4;
}

.split-preview-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.75em;
  margin-top: 0.75em;
}

.split-preview-card {
  border: 1px solid #d8dde3;
  border-radius: 8px;
  background: #ffffff;
  padding: 0.8em;
}

.split-preview-page {
  font-weight: bold;
  margin-bottom: 0.2em;
}

.split-preview-meta {
  color: #667085;
  font-size: 0.9em;
  margin-bottom: 0.5em;
}

.split-preview-text {
  font-size: 0.95em;
  line-height: 1.4;
}

label {
  display: block;
  margin-bottom: 0.3em;
  font-weight: bold;
}

input[type='text'],
input[type='file'] {
  width: 100%;
  padding: 0.4em;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
}

/* Progress area */
#progress {
  margin-top: 1em;
  padding: 0.5em;
  border: 1px solid #ddd;
  background: #fafafa;
  max-height: 300px;
  overflow-y: auto;
  font-family: monospace;
  font-size: 0.9em;
  white-space: pre-wrap;
}

#progress p {
  margin: 0.2em 0;
}

/* Global dark mode styles */
body.dark-mode {
  background: #12090a;
  color: #f0e6c8;
}
body.dark-mode header {
  background: #0e0806;
}
body.dark-mode header nav a {
  color: #e8d5b0;
}
body.dark-mode header nav a:hover {
  color: #d4a843;
}
body.dark-mode main,
body.dark-mode .site-main {
  background: #1a0e05;
  color: #f0e6c8;
  box-shadow: none;
}
body.dark-mode .site-main--index {
  background: none;
}
body.dark-mode a.button,
body.dark-mode button {
  background: #c8922a;
  color: #1a0e04;
}
body.dark-mode a.button:hover,
body.dark-mode button:hover {
  background: #d9a83a;
  color: #1a0e04;
}
body.dark-mode .danger-button {
  background: #9b3a31;
  color: #fff;
}
body.dark-mode .danger-button:hover {
  background: #7d2e27;
}
body.dark-mode table.book-list th {
  background: #2a1a08;
  color: #f0e6c8;
}
body.dark-mode table.book-list td {
  background: #1a0e05;
  color: #e0d0b0;
}
body.dark-mode .book-card {
  background: #1e1208;
  border-color: #3a2810;
  color: #f0e6c8;
}
body.dark-mode .library-hero {
  background: linear-gradient(135deg, #1e140a 0%, #150e06 100%);
  border-color: #3a2810;
}
body.dark-mode .library-subtitle,
body.dark-mode .library-summary-label,
body.dark-mode .collection-description,
body.dark-mode .book-card-topline,
body.dark-mode .book-metric-label,
body.dark-mode .author-shelf-count,
body.dark-mode .book-actions-toggle summary {
  color: #c8b888;
}
body.dark-mode .library-summary-card,
body.dark-mode .author-shelf,
body.dark-mode .book-card-rich,
body.dark-mode .book-metric,
body.dark-mode .library-empty-state {
  background: #1e1208;
  border-color: #3a2810;
  color: #f0e6c8;
}
body.dark-mode .split-overview,
body.dark-mode .split-preview-panel,
body.dark-mode .split-preview-card {
  background: #1e1208;
  border-color: #3a2810;
  color: #f0e6c8;
}
body.dark-mode .danger-zone {
  background: #2a1510;
  border-color: #6b3f3b;
  color: #f0dddd;
}
body.dark-mode .split-preview-meta {
  color: #c8b888;
}
body.dark-mode #progress {
  background: #1e1208;
  color: #e0d0b0;
  border-color: #3a2810;
}
body.dark-mode #dark-toggle {
  color: #d4a843;
  border-color: rgba(200, 146, 42, 0.4);
}
body.dark-mode #dark-toggle:hover {
  background: rgba(200, 146, 42, 0.15);
  border-color: rgba(200, 146, 42, 0.7);
}

/* Bible interlinear toggles */
.bible-english {
  color: #555;
}

body.hide-bible-english .bible-english {
  display: none;
}

.interlinear-word {
  display: inline-block;
  position: relative;
  padding-right: 0.2em;
}

.interlinear-gloss {
  display: none;
  font-size: 0.8em;
  color: #555;
  margin-top: 0.1em;
}

body.show-bible-interlinear .interlinear-gloss {
  display: block;
}

body.dark-mode .bible-english,
body.dark-mode .interlinear-gloss {
  color: #bbb;
}