/* Hope UI look for Honest Prayer (owner's choice, 2026-10-13: the app and
   /prayer get the same clean, bright look as the interactive guides).
   Loaded AFTER prayer.css on prayer.html and in the Android app; it only
   re-colours and re-sets type, so prayer.css keeps the layout. Tokens match
   hope-guides.css (--hg-*): #f5f6fa ground, white cards, ink #232d42, Hope
   blue #3a57e8, 16px radius, Plus Jakarta Sans. Delete the <link> to revert. */

@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('/assets/fonts/plusjakartasans-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url('/assets/fonts/plusjakartasans-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ---- Tokens ---- */
.prayer-shell {
  --pr-ink: #232d42;
  --pr-ink-soft: #4b5563;
  --pr-ink-faint: #5b6472;
  --pr-line: #e3e7f0;
  --pr-surface: #ffffff;
  --pr-surface-2: #f1f4fb;
  --pr-bg-a: #f5f6fa;
  --pr-bg-b: #f5f6fa;
  --pr-accent: #3a57e8;
  --pr-accent-deep: #2c44c4;
  --pr-accent-soft: #e8edfd;
  --pr-grad: linear-gradient(135deg, #6f86f2, #3a57e8);
  --pr-radius: 16px;
  --pr-radius-sm: 12px;
  --pr-shadow: 0 14px 34px -18px rgba(35, 52, 120, 0.35);
  --pr-shadow-sm: 0 6px 18px -12px rgba(35, 52, 120, 0.3);
  --pr-font: 'Plus Jakarta Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;
  font-family: var(--pr-font);
  font-size: 1rem;
  line-height: 1.6;
  background: var(--pr-bg-a);
}

/* Every label, title and control uses the one Hope face (prayer.css set
   Cinzel / Marcellus / Cormorant per element). Icons are SVG, unaffected. */
.prayer-shell,
.prayer-shell *:not(svg):not(path),
.pr-sheet, .pr-sheet *:not(svg):not(path),
.pr-mini, .pr-mini *:not(svg):not(path) { font-family: var(--pr-font) !important; }

/* Per-content accents, re-toned to Hope hues (dawn = Hope blue). */
.prayer-shell [data-accent="dawn"], .prayer-shell[data-accent="dawn"],
.prayer-shell [data-accent="indigo"], .prayer-shell[data-accent="indigo"] {
  --pr-accent: #3a57e8; --pr-accent-deep: #2c44c4; --pr-accent-soft: #e8edfd;
  --pr-grad: linear-gradient(135deg, #6f86f2, #3a57e8);
}
.prayer-shell [data-accent="olive"], .prayer-shell[data-accent="olive"] {
  --pr-accent: #1f9d6b; --pr-accent-deep: #13704c; --pr-accent-soft: #e2f5ec;
  --pr-grad: linear-gradient(135deg, #5cc79b, #1f9d6b);
}
.prayer-shell [data-accent="dusk"], .prayer-shell[data-accent="dusk"] {
  --pr-accent: #7a5af5; --pr-accent-deep: #5a3fd0; --pr-accent-soft: #efeafe;
  --pr-grad: linear-gradient(135deg, #a28cf8, #7a5af5);
}
.prayer-shell [data-accent="night"], .prayer-shell[data-accent="night"] {
  --pr-accent: #3a57e8; --pr-accent-deep: #1f2a5c; --pr-accent-soft: #e8edfd;
  --pr-grad: linear-gradient(135deg, #3a57e8, #1f2a5c);
}

/* ---- Type scale (Jakarta reads larger than Cormorant, so sizes come down) ---- */
.pr-eyebrow, .pr-now-eyebrow, .pr-card-cat, .pr-daily-part, .pr-reader-block h4,
.pr-sheet-eyebrow, .pr-req-l, .pr-scripture-ref {
  font-weight: 700; letter-spacing: 0.08em; font-size: 0.72rem;
}
.pr-h1 { font-weight: 800; letter-spacing: -0.02em; font-size: clamp(1.7rem, 1.3rem + 2vw, 2.6rem); }
.pr-h2 { font-weight: 700; letter-spacing: -0.01em; font-size: clamp(1.2rem, 1.05rem + 0.8vw, 1.5rem); }
.pr-h3, .pr-card-title, .pr-daily-title, .pr-now-title, .pr-topic b, .pr-day-info b,
.pr-mini-text b, .pr-request-cta b { font-weight: 700; letter-spacing: -0.01em; }
.pr-card-title { font-size: 1.08rem; line-height: 1.3; }
.pr-daily-title, .pr-now-title { font-size: 1.05rem; }
.pr-topic b, .pr-day-info b { font-size: 0.98rem; }
.pr-lead { font-size: 1.05rem; }
.pr-card-sub, .pr-day-info span, .pr-daily-ref { font-size: 0.92rem; font-style: normal; }
.pr-card-meta, .pr-detail-meta, .pr-seek-times { letter-spacing: 0; font-size: 0.82rem; }
.pr-btn, .pr-chip-btn, .pr-sheet-back, .pr-section-link, .pr-back, .pr-now-cta, .pr-lock {
  font-weight: 600; letter-spacing: 0.01em; text-transform: none; font-size: 0.9rem;
}
.pr-tab { text-transform: none; font-weight: 600; font-size: 0.68rem; letter-spacing: 0; }
.pr-tab.is-active { color: var(--pr-accent); }
.pr-subnav a { text-transform: none; font-weight: 600; letter-spacing: 0; font-size: 0.88rem; }
.pr-subnav a.is-active { background: var(--pr-accent); }

/* Reading: comfortable and calm. */
.pr-scripture { font-style: normal; font-weight: 500; font-size: 1.18rem; line-height: 1.65; color: var(--pr-ink); }
.pr-reader-block p, .prayer-shell .pr-article-body { font-size: 1.05rem; line-height: 1.75; }
.pr-prayer-block p { font-style: normal; }
.prayer-shell .pr-article-body h2 { font-size: 1.25rem; font-weight: 700; color: var(--pr-ink); }
.prayer-shell .pr-article-body h3 { font-size: 1.08rem; font-weight: 700; color: var(--pr-ink); }
.prayer-shell .pr-article-body blockquote { font-style: normal; border-left-color: var(--pr-accent); background: var(--pr-surface-2); border-radius: 0 12px 12px 0; padding: 0.7rem 1rem; }
.pr-input { font-size: 1rem; }

/* ---- Surfaces ---- */
.pr-card, .pr-daily, .pr-topic, .pr-day-row, .pr-now, .pr-prayer-block, .pr-transcript, .pr-search { border-color: var(--pr-line); }
.pr-now { border-left-width: 1px; }
.pr-prayer-block { border-left: 4px solid var(--pr-accent); }
.pr-streak { background: var(--pr-surface); border-color: var(--pr-line); }
.pr-streak-flame { color: #fff; }
.pr-btn-primary { background: var(--pr-accent); }
.pr-btn-primary:hover { background: var(--pr-accent-deep); }
.pr-btn-ghost { background: var(--pr-surface); }
.pr-play-btn { background: var(--pr-accent); }
.pr-chip-btn { background: var(--pr-surface); }
.pr-chip-btn.is-on { background: var(--pr-accent); border-color: var(--pr-accent); }
.pr-tabbar { background: rgba(255, 255, 255, 0.96); }
.pr-request-cta { background: linear-gradient(135deg, var(--pr-accent-soft), var(--pr-surface)); }
.pr-hero-home .pr-eyebrow { color: #c9d4ff; }
.pr-hero-home {
  background:
    linear-gradient(180deg, rgba(20, 28, 60, 0.35) 0%, rgba(20, 28, 60, 0.78) 100%),
    url("/assets/prayer-hero.jpg") center 28% / cover no-repeat,
    #1f2a5c;
}
.pr-card-badge { letter-spacing: 0.04em; font-weight: 700; }
.pr-sheet {
  background:
    radial-gradient(900px 500px at 50% -10%, var(--pr-accent-soft, #e8edfd), transparent 60%),
    var(--pr-bg-a, #f5f6fa);
}

/* ---- Sleep: Hope's calm night palette (dark navy, soft blue light) ---- */
.prayer-shell.pr-sleep {
  --pr-ink: #eef1fb; --pr-ink-soft: #c3cbe6; --pr-ink-faint: #b3bce0;
  --pr-line: rgba(160, 178, 255, 0.2); --pr-surface: rgba(38, 48, 88, 0.62);
  --pr-surface-2: rgba(30, 38, 72, 0.7); --pr-accent: #a9b8ff; --pr-accent-deep: #dfe5ff;
  --pr-accent-soft: rgba(120, 140, 255, 0.18);
  background:
    radial-gradient(1000px 600px at 20% -10%, rgba(90, 110, 230, 0.32), transparent 60%),
    linear-gradient(180deg, #141a33, #1a2142);
}
.prayer-shell.pr-sleep .pr-btn-primary,
.prayer-shell.pr-sleep .pr-play-btn { background: #a9b8ff; color: #141a33; }
.prayer-shell.pr-sleep .pr-mini,
.prayer-shell.pr-sleep .pr-sheet {
  --pr-ink: #232d42; --pr-ink-soft: #4b5563; --pr-ink-faint: #5b6472;
  --pr-accent: #3a57e8; --pr-accent-deep: #2c44c4; --pr-accent-soft: #e8edfd;
  --pr-surface: #ffffff; --pr-surface-2: #f1f4fb; --pr-line: #e3e7f0;
}

/* Sleep: the tab bar joins the night palette (it stayed white, so its light
   labels were hard to read). */
.prayer-shell.pr-sleep .pr-tabbar { background: rgba(20, 26, 51, 0.96); border-top-color: rgba(160, 178, 255, 0.2); }
.prayer-shell.pr-sleep .pr-tab { color: #b3bce0; }
.prayer-shell.pr-sleep .pr-tab.is-active { color: #ffffff; }

/* "Testers wanted" card on the /prayer home (website only). */
.pr-testers { background: var(--pr-surface); border: 1px solid var(--pr-line); border-left: 4px solid var(--pr-accent); border-radius: var(--pr-radius); padding: 1.1rem 1.25rem; box-shadow: var(--pr-shadow-sm); }
.pr-testers b { display: block; font-size: 1.1rem; color: var(--pr-ink); margin: 0.15rem 0 0.35rem; }
.pr-testers > span { color: var(--pr-ink-soft); }
.pr-testers ol { list-style: decimal; margin: 0.8rem 0 0; padding-left: 1.3rem; color: var(--pr-ink-soft); display: grid; gap: 0.45rem; }
.pr-testers a { color: var(--pr-accent); font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }