/* =========================================================================
         file: /mnt/Vancouver/domains/persagen/web/common/wpi.css
  description: Shared Persagen / WPI base stylesheet (readability first)
      created: 2026-Oct-14
      version: v03 [2026-Nov-03]
-------------------------------------------------------------------------------
Versions:
  * v03 [2026-Nov-03] Google Gemini, 2026-Nov-03
    https://gemini.google.com/app/2399902fba663b52
    * Restores explicitly styled Persagen green links (a.persagen, a.persagen_ext).
    * Colors, fonts and sizes live in :root tokens.
    * Internal / Persagen links = green, generic external = blue.
  * v02 [2026-Oct-14] Claude Sonnet 5.5 - draft theme distilled from
    pg-solr-v07.css
  * v01: old!
-------------------------------------------------------------------------------
Comments:
  * lorem
============================================================================ */

/* ----- Tokens ------------------------------------------------------------ */
:root {
  color-scheme: light;
  --font: "Atkinson Hyperlegible Next", "Atkinson Hyperlegible", Arial, Verdana, sans-serif;
  --mono: Inconsolata, "DejaVu Sans Mono", monospace;

  --bg: #f8f9f9;          /* page background */
  --surface: #ffffff;
  --text: #1a1a1a;
  --muted: #595959;
  --rule: #949494;
  --zebra: #edf0f0;
  --th: #cbe6ef;

  --green: #008000;       /* Persagen green */
  --green-hover: #005c00;
  --ext: #0033cc;         /* external links (blue) */
  --ext-hover: #001f7a;

  --measure: 46rem;       /* reading column */
  --fs: 1.2rem;           /* base text size */
}

/* ---- Base -------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; padding: 0 1rem 3rem;
  background: var(--bg); color: var(--text);
  font-family: var(--font); font-size: var(--fs); line-height: 1.6;
}
main, .wrap { max-width: var(--measure); margin-inline: auto; }
p { margin: 1rem 0; }

h1, h2, h3, h4, h5, h6 { font-weight: 700; line-height: 1.3; margin: 1.75rem 0 .5rem; }
h1 { font-size: 1.75rem; margin-top: 0; }
h2 { font-size: 1.5rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.05rem; }
h5, h6 { font-size: .95rem; }

ul, ol { margin: .5rem 0 .5rem 2rem; padding: 0; }
li { margin: .2rem 0; }
hr { border: 0; height: 1px; background: var(--rule); margin: 2rem 0 .75rem; }
hr.green { background: var(--green); }
small, .small { font-size: .9rem; }
.muted { color: var(--muted); }
.sc { font-variant: small-caps; }

/* ---- Links -------------------------------------------------------------- */
/* Default link behavior (Internal / Persagen = Green) */
a, 
a:visited, 
a.persagen, 
a.persagen:visited, 
a.persagen_ext, 
a.persagen_ext:visited { 
  text-decoration: none; 
  color: var(--green); 
}

a:hover, 
a:focus-visible, 
a.persagen:hover, 
a.persagen_ext:hover { 
  color: var(--green-hover); 
  border-bottom: 1px solid var(--green);
}

/* Generic external links (blue) - excludes any link with class .persagen or .persagen_ext */
a[href^="http"]:not([href*="persagen.org"]):not(.persagen):not(.persagen_ext) { 
  color: var(--ext); 
}
a[href^="http"]:not([href*="persagen.org"]):not(.persagen):not(.persagen_ext):visited { 
  color: var(--ext); 
}
a[href^="http"]:not([href*="persagen.org"]):not(.persagen):not(.persagen_ext):hover { 
  color: var(--ext-hover); 
  border-bottom: 1px solid var(--ext-hover);
}

a[href$=".pdf"]::before { 
  content: "PDF\00a0"; 
  font-size: .7em; 
  font-weight: 700; 
  letter-spacing: .03em; 
}

/* ---- Quotes, Code & Pre -------------------------------------------------- */
blockquote { 
  margin: 1rem 0 1rem 1.5rem; 
  padding-left: 1rem; 
  border-left: 3px solid var(--rule); 
  font-size: .95rem; 
  max-width: 40rem; 
}
blockquote p { margin: .5rem 0; }
code, pre, kbd { font-family: var(--mono); }
pre { 
  overflow-x: auto; 
  padding: .75rem 1rem; 
  background: var(--surface); 
  border: 1px solid var(--rule); 
  font-size: .9rem; 
  line-height: 1.4; 
}

/* ---- Tables -------------------------------------------------------------- */
.table-scroll { overflow-x: auto; }
table { border-collapse: collapse; margin: 1rem 0; font-size: .9rem; border: 1px solid var(--rule); background: var(--bg); }
th, td { border: 1px solid var(--rule); padding: .15rem .5rem; text-align: left; vertical-align: top; }
thead th, thead td { background: var(--th); font-weight: 700; }
tbody tr:nth-child(odd) { background: var(--zebra); }
caption { text-align: left; font-weight: 700; padding: .25rem 0; }

/* ---- Details / Summary --------------------------------------------------- */
details { margin: .75rem 0; border: 1px solid var(--rule); padding: .25rem .75rem; background: var(--surface); }
summary { cursor: pointer; font-weight: 700; padding: .25rem 0; }
figure { margin: 1.5rem 0; }
figcaption { font-size: .9rem; color: var(--muted); }
img { max-width: 100%; height: auto; }

/* ---- Print --------------------------------------------------------------- */
@media print {
  body { background: #fff; color: #000; font-size: 11pt; padding: 0; }
  a, a:visited { color: #000; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; }
}

/* ========================================================================= */
/* [end of document] */
/* ========================================================================= */