/* ==========================================================================
   Blog — rovblog ("Journal Pink") skin layer

   Loaded only when settings.active_skin = rovblog, via the css_files.page_map
   entry keyed on the basename "blog-page.css". Every rule is scoped
   body[data-skin="rovblog"] (specificity 0-2-x), which beats the base layer in
   assets/css/blog-page.css without a single !important. The skin's documented
   !important budget is zero — keep it there.

   Two rules that are easy to break and expensive to break:
     - Secular One ships ONE weight (400). Never give --rb-font-display a
       font-weight of 700+; the browser fakes it and Hebrew turns to mush.
     - --rb-accent (#FF3399) is about 3:1 on white. Fine for a filled button,
       not for 13px text. Small text uses --rb-accent-ink (#D6207D).
   ========================================================================== */

/* ---- 1. page shell ----------------------------------------------------- */

body[data-skin="rovblog"] .blog-hero-title,
body[data-skin="rovblog"] .blog-article-title,
body[data-skin="rovblog"] .blog-feature-title,
body[data-skin="rovblog"] .blog-related-title,
body[data-skin="rovblog"] .blog-side-title,
body[data-skin="rovblog"] .blog-card-title,
body[data-skin="rovblog"] .blog-h,
body[data-skin="rovblog"] .blog-rich h2,
body[data-skin="rovblog"] .blog-rich h3,
body[data-skin="rovblog"] .blog-rich h4 {
  font-family: var(--rb-font-display);
  font-weight: 400;
  color: var(--rb-ink);
}

body[data-skin="rovblog"] .blog-hero-sub,
body[data-skin="rovblog"] .blog-card-excerpt,
body[data-skin="rovblog"] .blog-feature-sub,
body[data-skin="rovblog"] .blog-side-text {
  color: var(--rb-muted);
}

body[data-skin="rovblog"] .blog-breadcrumb,
body[data-skin="rovblog"] .blog-card-meta,
body[data-skin="rovblog"] .blog-card-read,
body[data-skin="rovblog"] .blog-article-meta,
body[data-skin="rovblog"] .blog-side-item-date,
body[data-skin="rovblog"] .blog-prevnext-label {
  color: var(--rb-faint);
}
body[data-skin="rovblog"] .blog-breadcrumb a { color: var(--rb-faint); }
body[data-skin="rovblog"] .blog-breadcrumb a:hover { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-breadcrumb [aria-current="page"] { color: var(--rb-ink-2); }

/* ---- 2. toolbar and chips ---------------------------------------------- */

body[data-skin="rovblog"] .blog-search input {
  background: var(--rb-surface);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-r-pill);
  box-shadow: var(--rb-sh-1);
  color: var(--rb-ink);
  font-family: var(--rb-font-body);
}
body[data-skin="rovblog"] .blog-search input::placeholder { color: var(--rb-faint); }
body[data-skin="rovblog"] .blog-search input:focus {
  outline: 2px solid var(--rb-accent);
  outline-offset: 1px;
  box-shadow: var(--rb-sh-search);
}
body[data-skin="rovblog"] .blog-search-icon { color: var(--rb-faint); }

body[data-skin="rovblog"] .blog-sort select {
  background: var(--rb-surface);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-r-pill);
  color: var(--rb-ink-2);
  font-family: var(--rb-font-body);
}

body[data-skin="rovblog"] .blog-chip {
  background: var(--rb-surface);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-r-pill);
  color: var(--rb-ink-2);
  transition: border-color var(--rb-t-fast), color var(--rb-t-fast), background var(--rb-t-fast);
}
body[data-skin="rovblog"] .blog-chip:hover {
  border-color: var(--rb-accent);
  color: var(--rb-accent-ink);
}
body[data-skin="rovblog"] .blog-chip.is-active {
  background: var(--rb-accent);
  border-color: var(--rb-accent);
  color: #FFFFFF;
  box-shadow: var(--rb-sh-accent);
}
/* The category pill on a card is the one small pink label on the page. Tinted
   background, ink-weight text — never #FF3399 at 11px on white. */
body[data-skin="rovblog"] .blog-card-meta .blog-chip,
body[data-skin="rovblog"] .blog-article-cat {
  background: var(--rb-accent-soft);
  border-color: transparent;
  color: var(--rb-accent-ink);
}
body[data-skin="rovblog"] .blog-card-meta .blog-chip:hover,
body[data-skin="rovblog"] .blog-article-cat:hover {
  background: var(--rb-accent);
  color: #FFFFFF;
}

/* ---- 3. cards ---------------------------------------------------------- */

body[data-skin="rovblog"] .blog-card {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-md);
  box-shadow: var(--rb-sh-2);
  transition: box-shadow var(--rb-t-med), transform var(--rb-t-med);
}
body[data-skin="rovblog"] .blog-card:hover {
  box-shadow: var(--rb-sh-3);
  transform: translateY(-2px);
}
body[data-skin="rovblog"] .blog-card-media { background: var(--rb-surface-2); }

body[data-skin="rovblog"] .blog-card-title a { color: var(--rb-ink); }
body[data-skin="rovblog"] .blog-card-title a:hover { color: var(--rb-accent-ink); }

body[data-skin="rovblog"] .blog-card-more { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-card-more:hover { color: var(--rb-accent-hover); }

body[data-skin="rovblog"] .blog-feature {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-lg);
  box-shadow: var(--rb-sh-2);
}
body[data-skin="rovblog"] .blog-feature-scrim { background: var(--rb-scrim); }
body[data-skin="rovblog"] .blog-feature-flag {
  background: var(--rb-accent);
  box-shadow: var(--rb-sh-accent);
  font-family: var(--rb-font-body);
}
body[data-skin="rovblog"] .blog-feature-title a { color: var(--rb-ink); }
body[data-skin="rovblog"] .blog-feature-title a:hover { color: var(--rb-accent-ink); }

/* ---- 4. sidebar -------------------------------------------------------- */

body[data-skin="rovblog"] .blog-side-card {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-md);
  box-shadow: var(--rb-sh-2);
}
body[data-skin="rovblog"] .blog-side-title { border-bottom-color: var(--rb-accent); }
body[data-skin="rovblog"] .blog-side-item-title { color: var(--rb-ink); }
body[data-skin="rovblog"] .blog-side-link:hover .blog-side-item-title { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-side-item-img { border-radius: var(--rb-r-sm); }
body[data-skin="rovblog"] .blog-side-cats li + li { border-top-color: var(--rb-hairline); }
body[data-skin="rovblog"] .blog-side-cats a { color: var(--rb-ink-2); }
body[data-skin="rovblog"] .blog-side-cats a:hover { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-side-cat-count { color: var(--rb-faint); }

/* ---- 4b. newsletter box ------------------------------------------------ */

body[data-skin="rovblog"] .blog-news-form input[type="email"] {
  background: var(--rb-surface-2);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-r-pill);
  color: var(--rb-ink);
  font-family: var(--rb-font-body);
}
body[data-skin="rovblog"] .blog-news-form input[type="email"]::placeholder { color: var(--rb-faint); }
body[data-skin="rovblog"] .blog-news-form input[type="email"]:focus { outline-color: var(--rb-accent); }
body[data-skin="rovblog"] .blog-news-btn {
  border-radius: var(--rb-r-pill);
  background: var(--rb-accent);
  box-shadow: var(--rb-sh-accent);
}
body[data-skin="rovblog"] .blog-news-btn:hover { background: var(--rb-accent-hover); }

/* ---- 5. load more, pager, empty ---------------------------------------- */

body[data-skin="rovblog"] .blog-more {
  background: var(--rb-surface);
  border: 1px solid #C9C7C2;
  border-radius: var(--rb-r-pill);
  color: var(--rb-ink);
  font-family: var(--rb-font-body);
  transition: border-color var(--rb-t-fast), color var(--rb-t-fast);
}
body[data-skin="rovblog"] .blog-more:hover { border-color: var(--rb-accent); color: var(--rb-accent-ink); }

body[data-skin="rovblog"] .blog-pager-link {
  background: var(--rb-surface);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-r-sm);
  color: var(--rb-ink-2);
}
body[data-skin="rovblog"] .blog-pager-link.is-active {
  background: var(--rb-accent);
  border-color: var(--rb-accent);
  color: #FFFFFF;
}

body[data-skin="rovblog"] .blog-empty {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-md);
  box-shadow: var(--rb-sh-2);
}

/* ---- 6. article -------------------------------------------------------- */

body[data-skin="rovblog"] .blog-article-sub { color: var(--rb-muted); }
body[data-skin="rovblog"] .blog-article-author { color: var(--rb-ink-2); }
body[data-skin="rovblog"] .blog-article-body { color: var(--rb-ink-2); }
body[data-skin="rovblog"] .blog-article-hero img {
  border-radius: var(--rb-r-band);
  box-shadow: var(--rb-sh-2);
}
body[data-skin="rovblog"] .blog-article-hero figcaption,
body[data-skin="rovblog"] .blog-fig figcaption,
body[data-skin="rovblog"] .blog-gal figcaption,
body[data-skin="rovblog"] .blog-video figcaption,
body[data-skin="rovblog"] .blog-table-cap { color: var(--rb-faint); }

body[data-skin="rovblog"] .blog-rich a { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-rich a:hover { color: var(--rb-accent-hover); }
body[data-skin="rovblog"] .blog-rich blockquote,
body[data-skin="rovblog"] .blog-quote {
  border-inline-start-color: var(--rb-accent);
  color: var(--rb-muted);
}
body[data-skin="rovblog"] .blog-divider { border-top-color: var(--rb-border); }
body[data-skin="rovblog"] .blog-fig img,
body[data-skin="rovblog"] .blog-video-el,
body[data-skin="rovblog"] .blog-embed { border-radius: var(--rb-r-md); }
body[data-skin="rovblog"] .blog-gal-item { border-radius: var(--rb-r-sm); }

body[data-skin="rovblog"] .blog-table th,
body[data-skin="rovblog"] .blog-table td { border-color: var(--rb-hairline); }
body[data-skin="rovblog"] .blog-table thead th { background: var(--rb-surface-2); color: var(--rb-ink); }
body[data-skin="rovblog"] .blog-table tbody tr:nth-child(even) { background: #FAFAF9; }

body[data-skin="rovblog"] .blog-code { background: var(--rb-footer); color: var(--rb-on-dark); border-radius: var(--rb-r-sm); }

body[data-skin="rovblog"] .blog-callout {
  background: var(--rb-band);
  border-inline-start-color: var(--rb-accent);
  border-radius: var(--rb-r-sm);
}
body[data-skin="rovblog"] .blog-callout-title { color: var(--rb-ink); }
body[data-skin="rovblog"] .blog-callout-text { color: var(--rb-ink-2); }
body[data-skin="rovblog"] .blog-callout--tip { background: #F0FAF4; border-inline-start-color: #059669; }
body[data-skin="rovblog"] .blog-callout--warn { background: #FFF8ED; border-inline-start-color: #D97706; }

/* ---- 7. article footer ------------------------------------------------- */

body[data-skin="rovblog"] .blog-article-foot { border-top-color: var(--rb-hairline); }
body[data-skin="rovblog"] .blog-share-label { color: var(--rb-faint); }
body[data-skin="rovblog"] .blog-share-btn {
  background: var(--rb-surface);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-r-pill);
  color: var(--rb-ink-2);
  font-family: var(--rb-font-body);
  transition: border-color var(--rb-t-fast), color var(--rb-t-fast);
}
body[data-skin="rovblog"] .blog-share-btn:hover { border-color: var(--rb-accent); color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-share-btn.is-done { border-color: #059669; color: #059669; }

body[data-skin="rovblog"] .blog-prevnext-item {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-md);
  box-shadow: var(--rb-sh-1);
  transition: box-shadow var(--rb-t-med), transform var(--rb-t-med);
}
body[data-skin="rovblog"] .blog-prevnext-item:hover { box-shadow: var(--rb-sh-2); transform: translateY(-2px); }
body[data-skin="rovblog"] .blog-prevnext-title { color: var(--rb-ink); }

body[data-skin="rovblog"] .blog-related-link { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-related-link:hover { color: var(--rb-accent-hover); }

/* ---- 7b. comments ------------------------------------------------------ */

body[data-skin="rovblog"] .blog-cm-title { font-family: var(--rb-font-display); font-weight: 400; color: var(--rb-ink); }
body[data-skin="rovblog"] .blog-cm-count { background: var(--rb-surface-2); color: var(--rb-muted); }
body[data-skin="rovblog"] .blog-cm-empty { color: var(--rb-muted); }

body[data-skin="rovblog"] .blog-cm-box {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-md);
  box-shadow: var(--rb-sh-1);
}
body[data-skin="rovblog"] .blog-cm-box--staff { box-shadow: 0 0 0 1px var(--rb-accent), var(--rb-sh-1); }
body[data-skin="rovblog"] .blog-cm-name { color: var(--rb-ink); }
body[data-skin="rovblog"] .blog-cm-badge { background: var(--rb-accent); }
body[data-skin="rovblog"] .blog-cm-date { color: var(--rb-faint); }
body[data-skin="rovblog"] .blog-cm-body { color: var(--rb-ink-2); }
body[data-skin="rovblog"] .blog-cm-reply { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-cm-reply:hover { color: var(--rb-accent-hover); }
body[data-skin="rovblog"] .blog-cm-children { border-inline-start-color: var(--rb-hairline); }

body[data-skin="rovblog"] .blog-cm-form {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-md);
  box-shadow: var(--rb-sh-2);
}
body[data-skin="rovblog"] .blog-cm-field > span { color: var(--rb-muted); }
body[data-skin="rovblog"] .blog-cm-field input,
body[data-skin="rovblog"] .blog-cm-field textarea {
  background: var(--rb-surface);
  border: 1px solid var(--rb-border);
  border-radius: var(--rb-r-sm);
  color: var(--rb-ink);
  font-family: var(--rb-font-body);
}
body[data-skin="rovblog"] .blog-cm-field input:focus,
body[data-skin="rovblog"] .blog-cm-field textarea:focus { outline-color: var(--rb-accent); }
body[data-skin="rovblog"] .blog-cm-replying { background: var(--rb-band); border-radius: var(--rb-r-sm); }
body[data-skin="rovblog"] .blog-cm-cancel { color: var(--rb-accent-ink); }
body[data-skin="rovblog"] .blog-cm-note { color: var(--rb-faint); }
body[data-skin="rovblog"] .blog-cm-captcha img { border-color: var(--rb-border); border-radius: var(--rb-r-sm); }

/* ---- 8. homepage band -------------------------------------------------- */
/* The band lives on index.php between the gallery and the logo card. It reuses
   the .rb-gallery-head header pattern so it reads as one more section of the
   journal, not as a bolted-on module. */

body[data-skin="rovblog"] .rb-blog-band { margin-top: 46px; }

body[data-skin="rovblog"] .rb-blog-grid {
  display: grid;
  grid-template-columns: 1.55fr 1fr;
  gap: 22px;
  align-items: start;
}
body[data-skin="rovblog"] .rb-blog-side {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
body[data-skin="rovblog"] .rb-blog-band .blog-feature { margin-bottom: 0; }
body[data-skin="rovblog"] .rb-blog-band .blog-feature-media { aspect-ratio: 16 / 10; }

@media (max-width: 900px) {
  body[data-skin="rovblog"] .rb-blog-grid { grid-template-columns: 1fr; }
}

/* ---- 8b. homepage search band and skeletons ---------------------------- */

body[data-skin="rovblog"] .rb-blog-hits { margin: 26px 0 30px; }

body[data-skin="rovblog"] .blog-skel {
  background: var(--rb-surface);
  border: 0;
  border-radius: var(--rb-r-md);
  box-shadow: var(--rb-sh-1);
}
body[data-skin="rovblog"] .blog-skel-media,
body[data-skin="rovblog"] .blog-skel-line { background: var(--rb-surface-2); }

/* ---- 9. links the base sheets would otherwise underline ---------------- */
/* index-page.css strips underlines from a named list of link classes. New
   classes are not in that list, so they are declared here. */

body[data-skin="rovblog"] .blog-chip,
body[data-skin="rovblog"] .blog-card-title a,
body[data-skin="rovblog"] .blog-card-more,
body[data-skin="rovblog"] .blog-feature-title a,
body[data-skin="rovblog"] .blog-side-link,
body[data-skin="rovblog"] .blog-side-cats a,
body[data-skin="rovblog"] .blog-related-link,
body[data-skin="rovblog"] .blog-prevnext-item,
body[data-skin="rovblog"] .blog-share-btn,
body[data-skin="rovblog"] .blog-pager-link,
body[data-skin="rovblog"] .blog-breadcrumb a,
body[data-skin="rovblog"] .blog-gal-item,
body[data-skin="rovblog"] .blog-cm-reply,
body[data-skin="rovblog"] .blog-cm-cancel {
  text-decoration: none;
}