/* ============================================================
   Blog — Event PRO dark editorial skin.
   Loads AFTER party.css + pro.css: party.css keeps the bl-* layout
   bones; pro.css (body.pr) darkens the shared chrome (topbar/nav/
   footer); this sheet re-inks the article content itself.
============================================================ */

body.ep.pr { background: #0E0714; color: rgba(251, 248, 251, .88); }

/* breadcrumbs */
.bl-crumbs { color: rgba(251, 248, 251, .45); }
.bl-crumbs a { color: var(--pr-gold, #FF8FC5); }

/* headings + meta */
.bl-h1, .bl-wrap h2, .bl-wrap h3 { font-family: 'Noto Serif TC', 'Fraunces', serif; color: var(--pr-paper, #FBF8FB); }
.bl-h1 { letter-spacing: .01em; text-wrap: balance; }
.bl-wrap h2 { border-left: 4px solid var(--pr-teal, #E85FAE); padding-left: 12px; }
.bl-meta { color: rgba(251, 248, 251, .45); }

/* 直接回答 answer box */
.bl-intro {
  background: rgba(232, 95, 174, .09);
  border-left: 4px solid var(--pr-teal, #E85FAE);
  color: rgba(251, 248, 251, .9);
}
.bl-intro b { color: var(--pr-gold, #FF8FC5); }

/* tables */
.bl-table { border-color: var(--pr-line-dark, rgba(251,248,251,.16)); }
.bl-table thead th { background: var(--pr-teal-deep, #A82E7E); color: #fff; }
.bl-table td, .bl-table th { border-color: rgba(251, 248, 251, .12); }
.bl-table tbody tr:nth-child(even) { background: rgba(251, 248, 251, .035); }
.bl-table tbody td { color: rgba(251, 248, 251, .82); }

/* flow steps / stats / faq cards */
.bl-flow__step,
.bl-stat,
.bl-faq__item {
  background: rgba(251, 248, 251, .04);
  border-color: rgba(251, 248, 251, .14);
  color: rgba(251, 248, 251, .85);
}
.bl-stat b { color: var(--pr-gold, #FF8FC5); }
.bl-stat span { color: rgba(251, 248, 251, .55); }
.bl-flow__step b, .bl-faq__item b, .bl-faq__item summary { color: var(--pr-paper, #FBF8FB); }
.bl-faq__item summary { cursor: pointer; }

/* inline links inside the article */
.bl-wrap a { color: var(--pr-gold, #FF8FC5); }
.bl-wrap a:hover { color: var(--pr-teal, #E85FAE); }

/* CTA block */
.bl-cta {
  background: linear-gradient(135deg, rgba(168, 46, 126, .28), rgba(232, 95, 174, .12));
  border: 1px solid rgba(232, 95, 174, .35);
  color: var(--pr-paper, #FBF8FB);
}
.bl-cta__btn { background: var(--pr-teal, #E85FAE); color: #fff; border: 0; }
.bl-cta__btn:hover { background: var(--pr-teal-deep, #A82E7E); }
.bl-cta__btn--line { background: transparent; border: 1px solid rgba(251, 248, 251, .4); color: var(--pr-paper, #FBF8FB); }
.bl-cta__btn--line:hover { border-color: var(--pr-gold, #FF8FC5); color: var(--pr-gold, #FF8FC5); }

.bl-back { color: rgba(251, 248, 251, .55); }
.bl-back:hover { color: var(--pr-gold, #FF8FC5); }
.bl-back a { color: var(--pr-gold, #FF8FC5); }

/* ---- re-ink party.css's light-theme text for the dark skin ----------------
   party.css sets .bl-wrap p { color:#2c3633 } etc. (dark ink for the old light
   theme). Several of those selectors out-rank the container overrides above
   (.bl-wrap p beats .bl-intro on specificity), so every text node party.css
   inks dark is re-inked here explicitly. */
.bl-wrap p { color: rgba(251, 248, 251, .82); }
.bl-wrap p.bl-intro { color: rgba(251, 248, 251, .92); }
.bl-sub { color: rgba(251, 248, 251, .62); }
.bl-flow__step { border-color: rgba(232, 95, 174, .38); }
.bl-flow__step b { color: var(--pr-gold, #FF8FC5); }
.bl-flow__step span { color: rgba(251, 248, 251, .78); }
.bl-flow__step + .bl-flow__step::before { color: var(--pr-teal, #E85FAE); }
.bl-faq__item p { color: rgba(251, 248, 251, .78); }
.bl-table tbody td { border-color: rgba(251, 248, 251, .12); }
.bl-cta p { color: rgba(251, 248, 251, .85); }

/* index cards — party.css inks these for white cards */
.bl-card:hover { box-shadow: 0 12px 28px rgba(0, 0, 0, .5); }
.bl-card__date { color: rgba(251, 248, 251, .45); }
.bl-card__title { color: var(--pr-paper, #FBF8FB); }
.bl-card__desc { color: rgba(251, 248, 251, .62); }
.bl-card__more { color: var(--pr-gold, #FF8FC5); }

/* blog INDEX cards (listing page) */
.bl-card, .bl-list article {
  background: rgba(251, 248, 251, .04);
  border-color: rgba(251, 248, 251, .14);
}
.bl-card h2 a, .bl-card h3 a { color: var(--pr-paper, #FBF8FB); }
.bl-card p { color: rgba(251, 248, 251, .6); }
