/* ============================================================================
   PAGES/BOOK.CSS — جزئیات کتاب (اپ + عمومی)، نوار دسته‌بندی، زبان محتوا
   ============================================================================
   مالک: books/detail.html · books/detail_public.html (head block) — گام ۸
   پورت از: بخش Book Detail داخل app-shell.css (به‌جز not-found → dazzle §3.16)
            + سهم کتابِ book-detail.css
            + @600 book-detail-actions از mobile.css
   ============================================================================ */


/* ============================================================
Book Detail
============================================================ */
.book-detail-page {
padding: var(--space-3) 0 var(--space-7);
}

.book-detail-grid {
display: grid;
grid-template-columns: minmax(210px, 300px) minmax(0, 1fr);
gap: var(--space-7);
align-items: start;
}

.book-detail-cover {
position: sticky;
top: 95px;
}

.book-detail-cover img {
width: 100%;
aspect-ratio: 2/3;
object-fit: cover;
border-radius: var(--radius-md);
background: rgba(124, 88, 253, 0.06);
box-shadow: 0 16px 35px rgba(124, 88, 253, 0.12);
}

.book-detail-copy .eyebrow {
display: block;
font-size: var(--text-caption);
margin: var(--space-1) 0 var(--space-2);
color: var(--landing-purple);
font-weight: 800;
}

.book-detail-copy h1 {
font-size: clamp(28px, 4vw, 45px);
line-height: 1.25;
color: var(--landing-ink);
margin: 0;
font-weight: 900;
}

.lang-fa .book-detail-copy h1 {
line-height: 1.5;
}

.book-detail-copy h2 {
font-size: var(--text-body);
color: #6a5a8a;
margin: var(--space-3) 0;
font-weight: 600;
}

.book-detail-subtitle {
font-size: var(--text-body);
color: #6a5a8a;
line-height: 1.8;
margin: 0 0 var(--space-5);
}

.book-detail-stats {
border-block: 1px solid rgba(124, 88, 253, 0.10);
padding: var(--space-4) 0;
display: flex;
flex-wrap: wrap;
gap: var(--space-3) var(--space-5);
color: #6a5a8a;
font-size: var(--text-body-sm);
}

.book-detail-stats span {
display: flex;
align-items: center;
gap: var(--space-1);
}

.book-detail-stats small {
color: #9a8bbf;
}

.book-detail-actions {
margin: var(--space-5) 0 var(--space-6);
display: flex;
align-items: center;
flex-wrap: wrap;
gap: var(--space-3);
}

.book-detail-actions button,
.book-detail-actions .book-read-action {
min-width: 150px;
min-height: 44px;
border: 0;
border-radius: var(--radius-md);
padding: var(--space-3) var(--space-4);
background: var(--landing-purple);
color: var(--on-purple);
font-weight: 700;
text-align: center;
font-size: var(--text-body-sm);
transition: all var(--duration-page) var(--ease-standard);
}

.book-detail-actions button {
opacity: 0.46;
cursor: not-allowed;
}

.book-detail-actions .book-read-action {
opacity: 1;
cursor: pointer;
text-decoration: none;
display: inline-flex;
align-items: center;
justify-content: center;
gap: var(--space-2);
}

.book-detail-actions .book-read-action:hover {
background: var(--landing-purple-dark);
transform: translateY(-1px);
box-shadow: 0 6px 20px rgba(124, 88, 253, 0.25);
}

.book-detail-actions > span {
flex-basis: 100%;
font-size: var(--text-caption);
color: #9a8bbf;
}

.book-detail-categories h3 {
font-size: var(--text-body-sm);
margin: 0 0 var(--space-3);
color: var(--landing-ink);
font-weight: 800;
}

.book-detail-categories .category-chip {
cursor: default;
font-size: var(--text-caption);
padding: var(--space-2) var(--space-3);
}

.book-detail-sections {
max-width: 850px;
margin: var(--space-7) auto var(--space-6) 0;
}

.book-detail-sections section {
margin-bottom: var(--space-6);
}

.book-detail-sections h2 {
font-size: var(--text-h4);
color: var(--landing-ink);
margin: 0 0 var(--space-3);
font-weight: 800;
}

.book-detail-sections p {
white-space: pre-line;
color: #4d3d72;
line-height: 2;
margin: 0;
font-size: var(--text-body-sm);
}


@media (max-width: 800px) {
.book-detail-grid {
grid-template-columns: 220px minmax(0, 1fr);
gap: var(--space-6);
}

.book-detail-cover {
position: static;
}

.book-detail-copy h1 {
font-size: 30px;
}
}


@media (max-width: 600px) {
.book-detail-grid {
grid-template-columns: 1fr;
}

.book-detail-cover {
width: min(68vw, 260px);
margin: 0 auto;
}

.book-detail-copy {
text-align: start;
}

.book-detail-copy h1 {
font-size: 27px;
}

.book-detail-actions button {
flex: 1;
}

.book-detail-stats {
gap: var(--space-3) var(--space-4);
}

.book-detail-sections {
margin-top: var(--space-5);
}
}



/* ===== سهم book-detail.css (گام ۸) ===== */


.public-book-main {
width: min(1180px, calc(100% - 48px));
margin: 0 auto;
padding: var(--space-7) 0 var(--space-8);
}

.public-book-main .book-detail-page {
padding-top: 0;
}

.public-book-main .discovery-section {
margin-top: var(--space-7);
}

.category-strip-shell {
position: relative;
display: grid;
grid-template-columns: 44px minmax(0, 1fr) 44px;
gap: var(--space-2);
align-items: center;
}

.category-strip {
min-width: 0;
scroll-snap-type: x proximity;
scroll-behavior: smooth;
}

.category-strip .category-chip {
scroll-snap-align: center;
}

.category-strip-control {
width: 44px;
height: 44px;
border: 1px solid rgba(124, 88, 253, 0.15);
border-radius: 50%;
background: #ffffff;
color: var(--landing-purple);
display: grid;
place-items: center;
font-size: 28px;
line-height: 1;
cursor: pointer;
box-shadow: 0 4px 14px rgba(124, 88, 253, 0.08);
transition: all var(--duration-page) var(--ease-standard);
}

.category-strip-control:hover {
border-color: var(--landing-purple);
background: rgba(124, 88, 253, 0.06);
color: var(--landing-purple-dark);
transform: translateY(-2px);
box-shadow: 0 8px 24px rgba(124, 88, 253, 0.14);
}

.category-strip-control:focus-visible {
outline: var(--focus-ring-width) solid var(--landing-purple);
outline-offset: var(--focus-ring-offset);
}

.category-strip-control span {
display: block;
transform: translateY(-1px);
}

.lang-fa .category-strip-control {
direction: ltr;
}

.reader-content-language-options {
display: flex;
gap: var(--space-1);
padding: var(--space-1);
border-radius: var(--radius-sm);
background: rgba(124, 88, 253, 0.06);
}

.reader-content-language-options a {
min-height: 36px;
min-width: 72px;
padding: var(--space-2) var(--space-3);
border-radius: 6px;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: var(--text-caption);
font-weight: 800;
color: #6a5a8a;
direction: ltr;
text-decoration: none;
transition: all var(--duration-micro) var(--ease-standard);
}

.reader-content-language-options a:hover {
color: var(--landing-purple);
background: rgba(124, 88, 253, 0.08);
}

.reader-content-language-options a.active {
background: #ffffff;
color: var(--landing-purple);
box-shadow: 0 2px 8px rgba(124, 88, 253, 0.10);
}

.reader-content-language-options a:focus-visible {
outline: var(--focus-ring-width) solid var(--landing-purple);
outline-offset: var(--focus-ring-offset);
}


@media (max-width: 760px) {
.public-book-main {
width: min(100% - 28px, 680px);
padding: var(--space-5) 0 var(--space-7);
}
}

@media (max-width: 760px) {
.public-book-main .discovery-section {
margin-top: var(--space-6);
}
}

@media (max-width: 760px) {
.category-strip-shell {
grid-template-columns: minmax(0, 1fr);
}
}

@media (max-width: 760px) {
.category-strip-control {
display: none;
}
}

@media (max-width: 760px) {
.category-strip {
padding-inline: var(--space-1);
}
}

@media (prefers-reduced-motion: reduce) {
.category-strip-control {
transition: none;
}
}


/* ===== @600 از mobile.css ===== */

@media(max-width:600px) {
.book-detail-actions {
display:grid;
grid-template-columns:1fr;
align-items:stretch;
}
}

@media(max-width:600px) {
.book-detail-actions .book-read-action,.book-detail-actions button {
width:100%;
min-width:0;
display:flex;
align-items:center;
justify-content:center;
padding-inline:16px;
}
}

@media(max-width:600px) {
.book-detail-actions>span {
line-height:1.65;
padding-inline:2px;
}
}


/* ============================================================
   Book Rich Text — sanitized HTML from book_translations
   (about_book / about_author / who_should_read)
   ============================================================ */

.book-detail-sections .book-rich-text {
    line-height: 2;
    overflow-wrap: anywhere;
}

.book-rich-text > *:first-child { margin-top: 0; }
.book-rich-text > *:last-child { margin-bottom: 0; }

.book-rich-text p {
    margin: 0 0 var(--space-4);
}

.book-rich-text em,
.book-rich-text i { font-style: italic; }

.book-rich-text strong,
.book-rich-text b { font-weight: 700; }

.book-rich-text u { text-decoration: underline; }

.book-rich-text s { text-decoration: line-through; }

.book-rich-text mark {
    background: rgba(124, 88, 253, 0.18);
    padding: 0 0.2em;
    border-radius: 3px;
}

.book-rich-text a {
    color: var(--landing-purple);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.book-rich-text a:hover {
    color: var(--landing-purple-dark);
}

.book-rich-text ul,
.book-rich-text ol {
    margin: 0 0 var(--space-4);
    padding-inline-start: 1.5em;
}

/* Override the site-wide list reset inside sanitized book metadata. */
.book-rich-text ul { list-style-type: disc; }
.book-rich-text ol { list-style-type: decimal; }

.book-rich-text li { margin: 0.2em 0; }

.book-rich-text blockquote {
    margin: var(--space-3) 0;
    padding-inline-start: var(--space-3);
    border-inline-start: 3px solid rgba(124, 88, 253, 0.3);
    color: #6a5a8a;
}

.book-rich-text code {
    background: rgba(124, 88, 253, 0.08);
    padding: 0.1em 0.35em;
    border-radius: 4px;
    font-size: 0.92em;
    font-family: ui-monospace, "SF Mono", Menlo, monospace;
    direction: ltr;
    unicode-bidi: embed;
}

.book-rich-text pre {
    background: rgba(124, 88, 253, 0.06);
    padding: var(--space-3);
    border-radius: var(--radius-sm);
    overflow-x: auto;
    direction: ltr;
    text-align: start;
}

.book-rich-text hr {
    border: 0;
    border-top: 1px solid rgba(124, 88, 253, 0.15);
    margin: var(--space-4) 0;
}
/* ===== Book favorite — explicit user choice, independent from reader access ===== */
.book-detail-actions .book-favorite-action {
    opacity: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    min-width: 190px;
    background: transparent;
    color: var(--landing-purple);
    border: 1.5px solid color-mix(in srgb, var(--landing-purple) 45%, transparent);
}

.book-detail-actions .book-favorite-action:hover {
    background: color-mix(in srgb, var(--landing-purple) 8%, transparent);
    border-color: var(--landing-purple);
    transform: translateY(-1px);
}

.book-detail-actions .book-favorite-action.is-active {
    background: color-mix(in srgb, var(--landing-purple) 12%, transparent);
    border-color: var(--landing-purple);
    color: var(--landing-purple-dark);
}

.book-detail-actions .book-favorite-action:disabled {
    opacity: .58;
    cursor: wait;
    transform: none;
}

.book-favorite-action .book-favorite-icon {
    fill: transparent;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: fill var(--duration-micro) var(--ease-standard), transform var(--duration-micro) var(--ease-standard);
}

.book-favorite-action.is-active .book-favorite-icon {
    fill: currentColor;
    transform: scale(1.04);
}