/* Frankie's Library theme for Request Desk (the Shelfmark app, written against v1.6.2; renamed 2026-11-11). Loaded after Shelfmark's own stylesheet.
   Shelfmark is built on colour variables, so this mostly redefines them: warm paper in light mode,
   deep teal "after hours" in dark mode, matching the guides and books.wulfe.org.
   Green stays green: the guides tell people to tap the green magnifier and the green Get button. */
@font-face{font-family:"Fraunces";font-style:normal;font-weight:300 700;font-display:swap;src:url(/guide/theme/fraunces-normal.woff2) format("woff2")}
@font-face{font-family:"Fraunces";font-style:italic;font-weight:300 700;font-display:swap;src:url(/guide/theme/fraunces-italic.woff2) format("woff2")}

:root{
  --fl-display:"Fraunces",Georgia,"Times New Roman",serif;
  --background-color:#FAF4E8; --card-background:#FFFDF7; --input-background:#FFFDF7; --border-color:#E4DAC5;
  --text-color:#16302E; --heading-color:#16302E; --primary-color:#0B4F54; --primary-dark:#0A3A3E;
  --hover-surface:#16302E0d; --hover-action:#16302E14; --hover-row:#16302E12; --scrollbar-thumb:#16302E26; --scrollbar-thumb-hover:#16302E40;
  /* neutral greys, warmed toward the paper; the two darkest are the logo's teal ink */
  --color-gray-50:oklch(98% .012 85); --color-gray-100:oklch(96% .015 85); --color-gray-200:oklch(92% .02 85); --color-gray-300:oklch(86.5% .022 85);
  --color-gray-400:oklch(70% .022 95); --color-gray-500:oklch(55% .022 120); --color-gray-600:oklch(45% .025 170); --color-gray-700:oklch(37% .03 185);
  --color-gray-800:oklch(30% .035 190); --color-gray-900:oklch(27% .04 190);
  --color-zinc-100:oklch(96% .015 85); --color-zinc-200:oklch(92% .02 85); --color-zinc-300:oklch(86.5% .022 85); --color-zinc-400:oklch(70% .022 95);
  --color-zinc-500:oklch(55% .022 120); --color-zinc-600:oklch(45% .025 170); --color-zinc-700:oklch(37% .03 185); --color-zinc-800:oklch(30% .035 190); --color-zinc-900:oklch(27% .04 190);
  --color-neutral-800:oklch(30% .035 190); --color-slate-200:oklch(92% .02 85); --color-slate-700:oklch(37% .03 185);
  /* Shelfmark's blue (Sign In, focus rings, links) becomes the library's teal */
  --color-sky-500:#DFA02C; --color-sky-600:#0E6268; --color-sky-700:#0B4F54; --color-sky-800:#0A3A3E; --color-sky-900:#0B4F54;
}
[data-theme=dark]{
  --background-color:#0C1F21; --card-background:#132C2C; --input-background:#173434; --border-color:#27423F;
  --text-color:#F6ECD9; --heading-color:#F6ECD9; --primary-color:#2B8580; --primary-dark:#24706C;
  --hover-surface:#F6ECD90d; --hover-action:#F6ECD91f; --hover-row:#F6ECD914; --scrollbar-thumb:#F6ECD926; --scrollbar-thumb-hover:#F6ECD940;
  --color-gray-50:oklch(97% .02 88); --color-gray-100:oklch(94.5% .03 88); --color-gray-200:oklch(90% .03 88); --color-gray-300:oklch(84% .028 95);
  --color-gray-400:oklch(76% .03 165); --color-gray-500:oklch(62% .03 180); --color-gray-600:oklch(46% .035 190); --color-gray-700:oklch(36% .04 195);
  --color-gray-800:oklch(28% .04 197); --color-gray-900:oklch(22% .035 200);
  --color-zinc-100:oklch(94.5% .03 88); --color-zinc-200:oklch(90% .03 88); --color-zinc-300:oklch(84% .028 95); --color-zinc-400:oklch(76% .03 165);
  --color-zinc-500:oklch(62% .03 180); --color-zinc-600:oklch(46% .035 190); --color-zinc-700:oklch(36% .04 195); --color-zinc-800:oklch(28% .04 197); --color-zinc-900:oklch(22% .035 200);
  --color-neutral-800:oklch(28% .04 197); --color-slate-200:oklch(90% .03 88); --color-slate-700:oklch(36% .04 195);
  --color-sky-200:#C9EAE3; --color-sky-300:#8ED0C5; --color-sky-400:#8ED0C5; --color-sky-500:#F0BC5E; --color-sky-600:#2B8580; --color-sky-700:#2B8580; --color-sky-800:#339A93; --color-sky-900:#2B8580;
}
/* theme-init.js paints a grey page before the app loads; use the theme's ground instead */
html[data-theme], html[data-theme] body, html[data-theme] #root{background:var(--background-color);color:var(--text-color)}

/* The logo's serif for the name and for book titles */
h1, h2, h3{font-family:var(--fl-display);font-variation-settings:"SOFT" 100;letter-spacing:-.01em}
#search-section h1{font-weight:600}

/* Request Desk's flat bell in place of Shelfmark's round logo (same file in light and dark mode) */
img[src$="logo.png"]{content:url(/guide/theme/rd/flat-bell.png);border-radius:22%}
#search-section img[src$="logo.png"]{width:44px !important;height:44px !important}
/* Sign-in: the flat full Request Desk logo as the top panel of the card, edge to edge */
.shadow-2xl img[src$="logo.png"]{content:url(/guide/theme/rd/flat-full.webp);width:calc(100% + 50px) !important;max-width:none !important;height:auto !important;margin:-25px -25px 0 !important;border-radius:8px 8px 0 0}

/* Result cards sit on the page like index cards */
article.book-card{border:1px solid var(--border-color)}

/* Sign-in: the shelf of spines along the bottom, as on books.wulfe.org */
#root > div:has(form#login-form){background-image:url(/guide/theme/shelf-light.svg);background-repeat:repeat-x;background-position:center bottom;background-size:auto 134px;padding-bottom:158px}
[data-theme=dark] #root > div:has(form#login-form){background-image:url(/guide/theme/shelf.svg)}
