/**
 * Book Review ("Shelf Life") niche pack — custom CSS.
 *
 * Most of the prototype's component classes ARE already covered by the
 * compiled theme stylesheet as-is: .btn-primary, .button-7, .input-default,
 * .hover-up, .footer-menu and the cat-* palette all correctly reference the
 * CSS custom properties this pack relies on. Two are NOT, despite an
 * earlier version of this comment claiming otherwise: .card and .pill were
 * never actually defined anywhere in the shared theme (verified via grep -
 * only `.card-img-wrap`, unrelated, exists) - every review card on every
 * page silently had zero border-radius/shadow/hover-lift, and every
 * category badge silently had zero padding/rounding, rendering as a bare
 * inline-colored strip instead of a pill. Defined for real below, ported
 * from the prototype's own @apply lists. Scoped to the pack's body class
 * so it can never leak into other site styles. Enqueued only when the
 * book-review style is active (inc/functions/assets.php).
 */

/* .card - prototype: rounded-3xl bg-neutral-0 ring-1 ring-black/5
   shadow-[0_1px_2px_rgba(21,22,24,.04)] transition duration-300
   hover:shadow-[0_24px_60px_-24px_rgba(21,22,24,.28)] hover:-translate-y-1 */
.site-style-book-review .card {
  border-radius: 1.5rem;
  background: var(--color-neutral-0);
  box-shadow: 0 0 0 1px rgba(21, 22, 24, .05), 0 1px 2px rgba(21, 22, 24, .04);
  transition: box-shadow .3s ease, transform .3s ease;
}
.dark .site-style-book-review .card {
  background: var(--color-neutral-dark-0);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 1px 2px rgba(21, 22, 24, .04);
}
.site-style-book-review .card:hover {
  transform: translateY(-.25rem);
  box-shadow: 0 0 0 1px rgba(21, 22, 24, .05), 0 24px 60px -24px rgba(21, 22, 24, .28);
}
.dark .site-style-book-review .card:hover {
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .1), 0 24px 60px -24px rgba(21, 22, 24, .28);
}
@media (prefers-reduced-motion: reduce) {
  .site-style-book-review .card { transition: none; }
  .site-style-book-review .card:hover { transform: none; }
}

/* .pill - prototype: inline-flex items-center gap-1.5 rounded-full px-3
   py-1 text-[11px] font-bold uppercase tracking-[.12em] */
.site-style-book-review .pill {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
  border-radius: 9999px;
  padding: .3rem .8rem;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: .12em;
  white-space: nowrap;
}

/* The shared theme's .btn-primary and .button-7 (main.css) have no
   explicit `display` at all (their @apply lists never included
   inline-flex, unlike the prototype's own copies), so both fall back to
   the browser default for their tag - `display: inline` for the <a> case.
   Vertical margin has no effect on inline boxes and `w-full` has no
   effect either, so the pack's "Subscribe" buttons (icon + text, meant to
   fill their container) collapse and misalign. Same bug class Finance,
   Fun Facts and Lifehacks each needed this exact fix for. */
.site-style-book-review .btn-primary,
.site-style-book-review .button-7 { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; }

/* The shared theme's .footer-menu bakes in `py-2` (0.5rem top+bottom),
   which reads fine in a wide multi-column nav but leaves noticeably large
   gaps between the two-or-three short links in this pack's narrow footer
   columns (Newsletter / RSS, etc.). Tightened for this pack's footer only. */
.site-style-book-review footer .footer-menu { padding-top: .3rem; padding-bottom: .3rem; }

/* Animated underline links */
.site-style-book-review .u-underline {
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0% 2px;
  background-position: 0 100%;
  background-repeat: no-repeat;
  transition: background-size .3s ease;
}
.site-style-book-review .u-underline:hover { background-size: 100% 2px; }

/* Eyebrow labels */
.site-style-book-review .eyebrow {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .22em;
  color: var(--color-neutral-700);
}
.dark .site-style-book-review .eyebrow,
.site-style-book-review .dark\:text-neutral-dark-700 .eyebrow { color: var(--color-neutral-dark-700); }
.site-style-book-review .eyebrow.mb-3 { margin-bottom: .75rem; }
.site-style-book-review .eyebrow.mb-4 { margin-bottom: 1rem; }
.site-style-book-review .eyebrow.mb-7 { margin-bottom: 1.75rem; }

/* Ghost button */
.site-style-book-review .btn-ghost {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: 9999px;
  padding: .625rem 1.25rem;
  font-size: 14px;
  font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .15);
  transition: all .3s ease;
  cursor: pointer;
}
.site-style-book-review .btn-ghost:hover {
  background: var(--color-neutral-950);
  color: var(--color-neutral-0);
}
.dark .site-style-book-review .btn-ghost { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2); }
.dark .site-style-book-review .btn-ghost:hover {
  background: var(--color-neutral-dark-950);
  color: var(--color-neutral-dark-0);
}

/* Section rhythm */
.site-style-book-review .section-pad { padding-top: 4rem; padding-bottom: 4rem; }
@media (min-width: 640px)  { .site-style-book-review .section-pad { padding-top: 5rem; padding-bottom: 5rem; } }
@media (min-width: 1024px) { .site-style-book-review .section-pad { padding-top: 7rem; padding-bottom: 7rem; } }

/* Dotted texture backdrop */
.site-style-book-review .dots {
  background-image: radial-gradient(currentColor 1px, transparent 1px);
  background-size: 22px 22px;
}

/* Excerpt clamping in search results */
.site-style-book-review .line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Readable drop-cap body on single reviews */
.site-style-book-review .shelf-prose > p:first-of-type::first-letter {
  float: left;
  font-size: 3.6em;
  font-weight: 800;
  line-height: .85;
  padding-right: .12em;
  padding-top: .06em;
  color: var(--color-secondary-light-950);
}
.dark .site-style-book-review .shelf-prose > p:first-of-type::first-letter {
  color: var(--color-secondary-dark-950);
}
.site-style-book-review .shelf-prose p { margin-bottom: 1.25rem; }
.site-style-book-review .shelf-prose h2,
.site-style-book-review .shelf-prose h3 { font-weight: 700; margin: 2rem 0 .75rem; }
.site-style-book-review .shelf-prose blockquote {
  border-left: 4px solid var(--color-primary-light-950);
  padding-left: 1.25rem;
  font-style: italic;
  color: var(--color-neutral-700);
  margin: 1.5rem 0;
}
.dark .site-style-book-review .shelf-prose blockquote {
  border-left-color: var(--color-primary-dark-950);
  color: var(--color-neutral-dark-700);
}
.site-style-book-review .shelf-prose a { text-decoration: underline; text-underline-offset: 2px; }
.site-style-book-review .shelf-prose ul,
.site-style-book-review .shelf-prose ol { margin: 0 0 1.25rem 1.25rem; }
.site-style-book-review .shelf-prose ul { list-style: disc; }
.site-style-book-review .shelf-prose ol { list-style: decimal; }

/* ==================================================================
   COMMENTS - default WordPress comment_form()/wp_list_comments() markup
   carries no pack-specific classes, so it was never styled for any niche
   pack (falls back to WP core's bare output or an active comments
   plugin's own default look). The prototype's own comment mockup
   (single-post.html) reuses .input-default/.input-label/.btn-primary
   directly - already styled correctly by the shared theme - so only the
   surrounding WP-core structure (comment list, author/meta, reply links)
   needs first-time styling here, in the same yellow/pill language.
   ================================================================== */
.site-style-book-review .comment-reply-title,
.site-style-book-review #reply-title { font-size: 1.5rem; font-weight: 800; letter-spacing: -.02em; color: var(--color-neutral-950); margin: 0 0 .5rem; }
.dark .site-style-book-review .comment-reply-title,
.dark .site-style-book-review #reply-title { color: var(--color-neutral-dark-950); }
.site-style-book-review .comment-notes,
.site-style-book-review .logged-in-as { font-size: .875rem; color: var(--color-neutral-700); margin: 0 0 1.25rem; }
.dark .site-style-book-review .comment-notes,
.dark .site-style-book-review .logged-in-as { color: var(--color-neutral-dark-700); }
.site-style-book-review .comment-notes a,
.site-style-book-review .logged-in-as a { color: var(--color-secondary-light-950); text-decoration: underline; text-underline-offset: 2px; }
.dark .site-style-book-review .comment-notes a,
.dark .site-style-book-review .logged-in-as a { color: var(--color-secondary-dark-950); }

.site-style-book-review .comment-form-comment,
.site-style-book-review .comment-form-author,
.site-style-book-review .comment-form-email,
.site-style-book-review .comment-form-url { display: flex; flex-direction: column; gap: .4rem; margin: 0 0 1rem; }
.site-style-book-review .comment-form label { font-size: 1rem; font-weight: 700; color: var(--color-neutral-950); }
.dark .site-style-book-review .comment-form label { color: var(--color-neutral-dark-950); }
.site-style-book-review #comment,
.site-style-book-review .comment-form input[type="text"],
.site-style-book-review .comment-form input[type="email"],
.site-style-book-review .comment-form input[type="url"] {
  width: 100%; padding: .75rem 1rem; border-radius: .75rem; border: 0; outline: none;
  background: var(--color-neutral-0); color: var(--color-neutral-950); font: inherit;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1);
}
.dark .site-style-book-review #comment,
.dark .site-style-book-review .comment-form input[type="text"],
.dark .site-style-book-review .comment-form input[type="email"],
.dark .site-style-book-review .comment-form input[type="url"] {
  background: var(--color-neutral-dark-0); color: var(--color-neutral-dark-950);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .15);
}
.site-style-book-review #comment:focus,
.site-style-book-review .comment-form input:focus { box-shadow: 0 0 0 2px var(--color-primary-light-950); }
.dark .site-style-book-review #comment:focus,
.dark .site-style-book-review .comment-form input:focus { box-shadow: 0 0 0 2px var(--color-primary-dark-950); }

.site-style-book-review .comment-form-cookies-consent { display: flex; align-items: center; gap: .5rem; margin: 0 0 1.25rem; font-size: .875rem; color: var(--color-neutral-700); }
.dark .site-style-book-review .comment-form-cookies-consent { color: var(--color-neutral-dark-700); }

.site-style-book-review .form-submit { margin: 0; }
.site-style-book-review .form-submit #submit,
.site-style-book-review input#submit[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem; cursor: pointer;
  border-radius: 9999px; padding: .75rem 1.5rem; font-size: .875rem; font-weight: 600; font-family: inherit;
  border: 0; background: var(--color-primary-light-950); color: var(--color-neutral-950); transition: all .3s;
}
.dark .site-style-book-review .form-submit #submit,
.dark .site-style-book-review input#submit[type="submit"] { background: var(--color-primary-dark-950); color: var(--color-neutral-dark-950); }
.site-style-book-review .form-submit #submit:hover,
.site-style-book-review input#submit[type="submit"]:hover { opacity: .9; }

.site-style-book-review .commentlist { list-style: none; margin: 0 0 2rem; padding: 0; display: flex; flex-direction: column; }
.site-style-book-review .commentlist .children { list-style: none; margin: 1.5rem 0 0; padding: 0 0 0 2.5rem; display: flex; flex-direction: column; gap: 1.5rem; }
.site-style-book-review .commentlist > li.comment { padding: 1.5rem 0; border-top: 1px solid var(--color-neutral-300); }
.dark .site-style-book-review .commentlist > li.comment { border-top-color: var(--color-neutral-dark-300); }
.site-style-book-review .commentlist > li.comment:first-child { border-top: 0; padding-top: 0; }
.site-style-book-review .comment-body { display: flex; flex-direction: column; gap: .5rem; }
.site-style-book-review .comment-author.vcard { display: flex; align-items: center; gap: .75rem; }
.site-style-book-review .comment-author .avatar { width: 2.5rem; height: 2.5rem; border-radius: 9999px; flex-shrink: 0; }
.site-style-book-review .comment-author .fn { font-weight: 700; font-style: normal; color: var(--color-neutral-950); }
.dark .site-style-book-review .comment-author .fn { color: var(--color-neutral-dark-950); }
.site-style-book-review .comment-author .says { display: none; }
.site-style-book-review .comment-metadata { font-size: .8125rem; color: var(--color-neutral-700); }
.dark .site-style-book-review .comment-metadata { color: var(--color-neutral-dark-700); }
.site-style-book-review .comment-metadata a { color: inherit; text-decoration: none; }
.site-style-book-review .comment-content { font-size: .9375rem; line-height: 1.6; color: var(--color-neutral-950); }
.dark .site-style-book-review .comment-content { color: var(--color-neutral-dark-950); }
.site-style-book-review .comment-content p { margin: 0 0 .75rem; }
.site-style-book-review .comment-content p:last-child { margin-bottom: 0; }
.site-style-book-review .reply { margin-top: .25rem; }
.site-style-book-review .comment-reply-link {
  display: inline-flex; align-items: center; font-size: .8125rem; font-weight: 700;
  color: var(--color-secondary-light-950); text-decoration: none;
}
.dark .site-style-book-review .comment-reply-link { color: var(--color-secondary-dark-950); }
.site-style-book-review .comment-reply-link:hover { text-decoration: underline; text-underline-offset: 2px; }
.site-style-book-review .no-comments { font-size: .9375rem; color: var(--color-neutral-700); }
.dark .site-style-book-review .no-comments { color: var(--color-neutral-dark-700); }
.site-style-book-review .comment-awaiting-moderation { font-size: .8125rem; font-style: italic; color: var(--color-warning); }
