/* BIBLE PAGE - reuses tokens and header/footer styles from style.css */

.bible-head{
  position:relative; overflow:hidden; isolation:isolate;
  min-height:clamp(320px, 34vw, 400px);
  display:flex; align-items:center;
  padding:48px 0;
}
.bible-head-bg{
  position:absolute; inset:0; z-index:-2;
  width:100%; height:100%; object-fit:cover; object-position:50% 78%;
}
.bible-head::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(90deg, var(--wine-deep) 0%, rgb(0 31 56 / 0.92) 34%, rgb(0 31 56 / 0.42) 64%, rgb(0 31 56 / 0.08) 100%),
    linear-gradient(0deg, rgb(0 20 35 / 0.35), transparent 55%);
}
.bible-head-inner{ max-width:600px; }
.bible-head .eyebrow{ color:var(--gold-soft); }
.bible-head h1{ font-size:clamp(2rem, 3.6vw, 2.8rem); margin:14px 0 12px; color:#ffffff; }
.bible-head p{ color:rgb(255 255 255 / 0.78); font-size:16px; max-width:52ch; margin-bottom:28px; }
.bible-head .bible-tabs{ background:rgb(255 255 255 / 0.1); border:1px solid rgb(255 255 255 / 0.24); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.bible-head .bible-tab{ color:rgb(255 255 255 / 0.76); }
.bible-head .bible-tab.active{ background:var(--gold); color:var(--wine-deep); }

@media (max-width: 900px){
  .bible-head{ min-height:360px; padding:40px 0; }
  .bible-head::before{
    background:
      linear-gradient(0deg, var(--wine-deep) 10%, rgb(0 31 56 / 0.6) 55%, rgb(0 31 56 / 0.2) 100%);
  }
}

.bible-tabs{ display:inline-flex; gap:4px; background:var(--paper); border:1px solid var(--line); border-radius:999px; padding:4px; }
.bible-tab{
  font-size:13.5px; font-weight:600; padding:10px 20px; border-radius:999px; color:var(--ink-soft);
  transition:background .18s ease, color .18s ease;
}
.bible-tab.active{ background:var(--wine); color:#ffffff; }

.bible-body{ padding:48px 0 96px; }
.bible-grid{ display:grid; grid-template-columns: 0.85fr 1.15fr; gap:40px; align-items:start; }
.bible-panel[hidden]{ display:none; }

/* PLAN 365 */
.plan-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px; }
.plan-nav{ display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.plan-arrow{
  width:38px; height:38px; border-radius:50%; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:var(--ink); flex-shrink:0;
  transition:border-color .18s ease, color .18s ease;
}
.plan-arrow:hover{ border-color:var(--wine); color:var(--wine); }
.plan-day{ display:flex; align-items:baseline; gap:8px; }
.plan-day-label{ font-size:13px; color:var(--ink-soft); }
.plan-day strong{ font-family:'Boska', serif; font-size:2.2rem; color:var(--wine); }
[data-theme="dark"] .plan-day strong{ color:var(--gold-soft); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .plan-day strong{ color:var(--gold-soft); } }
.plan-day-total{ font-size:13px; color:var(--ink-soft); }
.plan-today{
  width:100%; font-size:13px; font-weight:600; color:var(--wine); border:1px solid var(--line);
  border-radius:var(--radius); padding:10px; margin-bottom:22px; transition:border-color .18s ease;
}
[data-theme="dark"] .plan-today{ color:var(--gold-soft); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .plan-today{ color:var(--gold-soft); } }
.plan-today:hover{ border-color:var(--wine); }
.plan-readings{ display:flex; flex-direction:column; gap:10px; }
.reading-chip{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:14px 16px; border-radius:var(--radius); border:1px solid var(--line);
  background:var(--cream); font-size:14.5px; font-weight:600; text-align:left; color:var(--ink);
  transition:border-color .18s ease, background .18s ease;
}
.reading-chip:hover{ border-color:var(--wine); }
.reading-chip.active{ border-color:var(--wine); background:var(--wine); color:#ffffff; }
.reading-chip i{ font-size:16px; opacity:.7; }

/* FREE READ */
.free-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--radius-lg); padding:28px; display:flex; flex-direction:column; gap:18px; }
.free-row{ display:flex; flex-direction:column; gap:8px; }
.free-row label{ font-size:13px; font-weight:600; color:var(--ink-soft); }
.free-row select{
  font-family:'General Sans', sans-serif; font-size:15px; padding:12px 14px;
  border-radius:var(--radius); border:1px solid var(--line); background:var(--cream); color:var(--ink);
}
.free-row select:disabled{ opacity:.5; }
#free-read-btn{ justify-content:center; }
#free-read-btn:disabled{ opacity:.5; pointer-events:none; }

/* READING AREA */
.reading-area{
  background:var(--cream); border:1px solid var(--line); border-radius:var(--radius-lg);
  padding:40px clamp(24px, 4vw, 56px); min-height:420px;
}
.reading-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:16px; height:100%; min-height:340px; text-align:center; color:var(--ink-soft); }
.reading-empty i{ font-size:40px; opacity:.4; }
.reading-empty p{ max-width:38ch; font-size:14.5px; }

.reading-chapter{ margin-bottom:36px; }
.reading-chapter:last-child{ margin-bottom:0; }
.reading-chapter h2{ font-size:1.5rem; margin-bottom:20px; color:var(--wine); }
[data-theme="dark"] .reading-chapter h2{ color:var(--gold-soft); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .reading-chapter h2{ color:var(--gold-soft); } }
.reading-verse{ font-size:17px; line-height:1.75; max-width:66ch; margin-bottom:14px; }
.reading-verse .vnum{ font-size:12px; font-weight:700; color:var(--wine); vertical-align:super; margin-right:4px; }
[data-theme="dark"] .reading-verse .vnum{ color:var(--gold-soft); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .reading-verse .vnum{ color:var(--gold-soft); } }
.reading-source{ margin-top:32px; font-size:12.5px; color:var(--ink-soft); }

.reading-error{ display:flex; flex-direction:column; align-items:center; gap:14px; text-align:center; padding:60px 0; color:var(--ink-soft); }
.reading-error i{ font-size:32px; color:#c0392b; }
.reading-error button{ font-size:13.5px; font-weight:600; color:var(--wine); border:1px solid var(--line); border-radius:var(--radius); padding:9px 18px; }
[data-theme="dark"] .reading-error button{ color:var(--gold-soft); }
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]) .reading-error button{ color:var(--gold-soft); } }

.skeleton-line{ height:44px; border-radius:var(--radius); background:var(--line); animation:skeleton-pulse 1.4s ease-in-out infinite; }
.skeleton-line.short{ width:70%; }
@media (prefers-reduced-motion: no-preference){
  @keyframes skeleton-pulse{ 0%,100%{ opacity:.5; } 50%{ opacity:1; } }
}
@media (prefers-reduced-motion: reduce){ .skeleton-line{ opacity:.7; } }

@media (max-width: 900px){
  .bible-grid{ grid-template-columns:1fr; }
  .bible-head{ padding:40px 0 32px; }
  .bible-body{ padding:32px 0 80px; }
}
