/* Light mode uses the warm brown brand palette for interface text.
   Keep this stylesheet last so legacy purple component rules cannot win. */
#root .app-shell[data-theme="light"],
#root .app-shell.shelf-visual-light {
  --accent: #5a3418;
  --home-accent: #5a3418;
  --violet: #5a3418;
  --blue: #5a3418;
  color: #5a3418 !important;
}

#root .app-shell:is([data-theme="light"], .shelf-visual-light)
  :where(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    span,
    small,
    strong,
    label,
    legend,
    summary,
    a,
    button,
    select,
    option,
    input,
    textarea
  ) {
  color: #5a3418 !important;
}

#root .app-shell:is([data-theme="light"], .shelf-visual-light)
  :where(input, textarea)::placeholder {
  color: #79502f !important;
  opacity: 1;
}

#root .app-shell:is([data-theme="light"], .shelf-visual-light) svg {
  color: #5a3418 !important;
  stroke: currentColor;
}

/* The pagination bar is intentionally dark in every theme. Keep its count
   legible instead of allowing the broad light-theme brown rule above to win. */
#root .app-shell .library-load-more > span {
  color: #fff6e8 !important;
  -webkit-text-fill-color: #fff6e8 !important;
}

/* Book lettering keeps the existing dark-mode gold on dark leather spines. */
#root .app-shell:is([data-theme="light"], .shelf-visual-light) .book-spine,
#root .app-shell:is([data-theme="light"], .shelf-visual-light) .book-spine :is(span, small, strong, .book-title, .book-author, .spine-title, .spine-author) {
  color: var(--spine-ink) !important;
}

/* Every book uses the same existing dark-mode lettering colour. */
#root .app-shell .book-spine,
#root .app-shell .book-spine * {
  --spine-ink: #f3d18a !important;
  color: #f3d18a !important;
  -webkit-text-fill-color: #f3d18a !important;
}