/* SPDX-License-Identifier: GPL-3.0-or-later */
/* Copyright (C) 2026 RMS Ministries */

/* style.css - the look of the whole site (the Parchment theme). Edit this file
   to change colors, type or spacing. The first part is the page structure; the
   second part is the Parchment look. */

/* The scrollbar space is always kept, so pages do not shift sideways when one is
   long enough to need a scrollbar and the next is not. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; overflow-y: scroll; }
body { margin: 0; }
img { max-width: 100%; height: auto; }
pre { overflow-x: auto; }

#site-name, #tagline { margin: 0; }
#nav { list-style: none; margin: 0; padding: 0; }
#nav li { display: inline; }
#nav a { text-decoration: none; }
#nav a.current { font-weight: bold; }

blockquote .cite { text-align: right; font-size: .9em; margin-top: -.4em; }

.entries { list-style: none; margin: 0; padding: 0; }
.entries li { margin: 0 0 1.4em; }
.entries .summary { margin: .2em 0 0; }

/* A printed page keeps the license line but not the menu or the feed link,
   and never shows a verse pop-up. */
@media print {
  #nav, #footer a[href="/feed.xml"] { display: none; }
  body { background: #fff; color: #000; }
  a { color: inherit; text-decoration: none; }
  .ref .v { display: none; }
}

/* parchment - warm cream paper and brown ink, rubric-red headings, a drop
   capital on the first paragraph, a gilt rule beside scripture quotations.
   Dark setting: lamplight on dark paper. System fonts only. */

body {
  background: #f4ecd8;
  color: #3a2e21;
  font-family: "P052", "TeX Gyre Pagella", "URW Palladio L", Palatino, "Palatino Linotype", "Book Antiqua", Georgia, "Times New Roman", serif;
  font-size: 118%;
  line-height: 1.62;
}
#page { max-width: 37em; margin: 0 auto; padding: 1.2em 1.2em 3em; }

#header { text-align: center; margin-bottom: 2.2em; padding: .9em 0 .8em; border-top: 4px double #8a6d3b; border-bottom: 1px solid #8a6d3b; }
#site-name { font-size: 2.15em; font-weight: bold; line-height: 1.15; font-variant: small-caps; letter-spacing: .1em; }
#site-name a { color: #6b1c1c; text-decoration: none; }
#tagline { font-style: italic; color: #6a5638; margin-top: .1em; }
#nav { margin-top: .8em; font-variant: small-caps; letter-spacing: .06em; }
#nav li + li:before { content: "\2766"; color: #8a6d3b; padding: 0 .7em; font-size: .8em; }
#nav a { color: #3a2e21; }

a { color: #6b1c1c; }
a:visited { color: #5a3a3a; }

h1 { font-size: 2.2em; font-weight: bold; line-height: 1.14; letter-spacing: .01em; text-align: center; color: #6b1c1c; margin: .2em 0 .3em; }
h2 { font-size: 1.25em; line-height: 1.3; color: #6b1c1c; font-variant: small-caps; letter-spacing: .04em; margin: 1.9em 0 .5em; }
h3 { font-size: 1.1em; color: #6b1c1c; margin: 1.5em 0 .4em; }
h4 { font-size: 1em; font-style: italic; margin: 1.3em 0 .3em; }
p { margin: 0 0 1em; }
.subtitle { font-style: italic; font-size: 1.1em; text-align: center; color: #6a5638; margin: 0 0 .4em; }
#title { margin-bottom: 2em; }
#title:after { content: ""; display: block; width: 5em; margin: 1.1em auto 0; border-top: 4px double #8a6d3b; }
.meta { color: #6a5638; font-size: .88em; letter-spacing: .08em; text-align: center; margin: 0; }

.article #title + p:first-letter, .article #title + h2 + p:first-letter { float: left; font-size: 3.5em; line-height: .82; padding: .06em .09em 0 0; color: #6b1c1c; font-weight: bold; }

blockquote { margin: 1.3em .5em; padding: .5em 1.1em .1em; border-left: 3px solid #b8923f; background: #ede1c6; background: rgba(184,146,63,.12); font-style: italic; }
blockquote p { margin-bottom: .5em; }
blockquote .cite { font-style: normal; font-variant: small-caps; letter-spacing: .05em; color: #6a5638; }
hr { border: 0; border-top: 4px double #8a6d3b; margin: 2.2em 3em 1em; }
/* Scripture references: the verse is shown under the line on hover, tap or
   keyboard focus. It is placed against the paragraph, not the reference, so
   it is always the width of the text and never runs off a small screen. At
   rest the verse is out of sight but not hidden from screen readers, which
   read it in parentheses after the reference, as a text-only browser shows
   it; it cannot be selected then, so copying a paragraph leaves it out. */
p, li, blockquote { position: relative; }
.ref { text-decoration: none; border-bottom: 1px dotted; }
.ref .v { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; -webkit-user-select: none; user-select: none; }
.ref .v i i { font-style: normal; }   /* supplied words in an italic closing note */
@media screen {
  .ref:hover .v, .ref:focus .v {
    display: block; left: 0; right: 0; z-index: 1; width: auto; height: auto;
    overflow: visible; clip: auto; white-space: normal; -webkit-user-select: text; user-select: text;
    margin-top: .3em; padding: .5em .8em; font-size: .9em;
    font-style: normal; color: #3a2e21; background: #fbf6ea;
    border: 1px solid #8a6d3b; }
}

.entries .date { color: #6a5638; font-size: .88em; margin-left: .5em; }
#footer { margin-top: 3em; font-size: .88em; color: #6a5638; text-align: center; }

@media (max-width: 30em) {
  #site-name { font-size: 1.7em; letter-spacing: .06em; }
  h1 { font-size: 1.9em; }
  #nav li + li:before { padding: 0 .45em; }
}

@media (prefers-color-scheme: dark) {
  body { background: #2a2218; color: #e7dabc; }
  #site-name a, h1, h2, h3, .article #title + p:first-letter, .article #title + h2 + p:first-letter { color: #e39a72; }
  #tagline, .subtitle, .meta, blockquote .cite, .entries .date, #footer { color: #b9a782; }
  #nav a { color: #e7dabc; }
  a { color: #e39a72; }
  a:visited { color: #c99a82; }
  blockquote { background: #3f321f; background: rgba(214,170,80,.12); }
  .ref:hover .v, .ref:focus .v { color: #e7dabc; background: #3f321f; }
}