/* =========================================================================
   书架 — base: tokens, reset, chrome (header/footer), editorial primitives, the shelf.
   Loaded on every page in shelf mode. Wood appears only as shelf lines and hover colour.
   ========================================================================= */

/* =========================================================================
   书架 — editorial product page (trial redesign, gated to specific products)
   Visual system from the 大将·生活 bookstore: warm off-white walls, oak
   shelving, black ceiling, warm light, generous space. Wood appears only
   as shelf lines and hover colour, never as texture.
   ========================================================================= */

:root {
	--wall:   #F4F1EA;
	--paper:  #FBF9F4;
	--beige:  #E8DFD1;
	--oak:    #C2996A;
	--walnut: #6B4A2E;
	--ink:    #1E1B18;
	--muted:  #6E665C;
	--line:   #DED6C8;
	--danger: #8A4B3A;

	--serif: "Noto Serif SC", "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", "PingFang SC", serif;
	--sans:  "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;

	--wrap: 1200px;
	--gutter: 24px;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--wall);
	color: var(--ink);
	font: 400 16px/1.8 var(--sans);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color .15s ease, border-color .15s ease, background-color .15s ease; }
a:hover { color: var(--walnut); }
button, input { font: inherit; color: inherit; }
h1, h2, h3, h4 { font-weight: 500; margin: 0; }
p { margin: 0 0 1em; }
ul { margin: 0; padding: 0; }
:focus-visible { outline: 2px solid var(--oak); outline-offset: 3px; }

.dj-wrap { max-width: var(--wrap); margin: 0 auto; padding-left: var(--gutter); padding-right: var(--gutter); }
.dj-sep { color: var(--muted); }
/* eyebrow: category trail, dates, small labels above a title — every page */
.dj-eyebrow { font-size: 1em; letter-spacing: .16em; color: var(--muted); margin: 0 0 16px; }
.dj-eyebrow a:hover { color: var(--ink); }
.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.dj-skip {
	position: absolute; left: -999px; top: 8px; z-index: 100;
	background: var(--ink); color: var(--paper); padding: 8px 14px; font-size: 14px;
}
.dj-skip:focus { left: 8px; color: var(--paper); }

/* ---------- header ---------- */
.dj-header {
	position: sticky; top: 0; z-index: 30;
	background: rgba(244, 241, 234, .96);
	-webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
	border-bottom: 1px solid var(--line);
}
.admin-bar .dj-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .dj-header { top: 46px; } }

.dj-header__inner {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 32px;
	height: 76px;
	position: relative;
}
.dj-logo img { height: 32px; width: auto; }
.dj-burger { display: none; }

.dj-nav { display: flex; align-items: center; gap: 24px; min-width: 0; }
.dj-nav__menu { min-width: 0; }
.dj-menu { display: flex; gap: 24px; list-style: none; white-space: nowrap; overflow: hidden; }
.dj-menu li { margin: 0; }
.dj-menu a {
	display: inline-block; padding: 6px 0;
	font-size: 14px; letter-spacing: .03em;
	border-bottom: 1px solid transparent;
}
.dj-menu a:hover, .dj-menu .current-menu-item > a { border-bottom-color: var(--oak); color: var(--ink); }

/* search: icon only until focused / opened */
.dj-search { display: flex; align-items: center; margin-left: auto; flex: none; border-bottom: 1px solid transparent; }
.dj-search input[type="search"] {
	width: 0; opacity: 0; border: 0; background: transparent; padding: 6px 0; font-size: 14px;
	-webkit-appearance: none; appearance: none;
	transition: width .2s ease, opacity .2s ease;
}
.dj-search.is-open input[type="search"], .dj-search:focus-within input[type="search"] { width: 170px; opacity: 1; }
.dj-search.is-open, .dj-search:focus-within { border-bottom-color: var(--ink); }
.dj-search input::placeholder { color: var(--muted); }
.dj-search input:focus { outline: none; }
.dj-search input::-webkit-search-cancel-button { -webkit-appearance: none; }
.dj-search button { border: 0; background: none; padding: 6px 2px; cursor: pointer; color: var(--muted); display: flex; }
.dj-search button:hover { color: var(--ink); }

.dj-tools { display: flex; align-items: center; gap: 22px; }
.dj-tool { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--ink); }
.dj-tool svg { flex: none; }
.dj-shelf-cart-count {
	min-width: 20px; height: 20px; padding: 0 6px;
	display: inline-flex; align-items: center; justify-content: center;
	border: 1px solid var(--ink); border-radius: 999px;
	font-size: 12px; line-height: 1; font-variant-numeric: tabular-nums;
}

/* ---------- breadcrumb & notices ---------- */
.dj-crumbs { padding-top: 22px; font-size: 13px; color: var(--muted); }
.dj-crumbs a:hover { color: var(--ink); }
.dj-crumbs__sep { margin: 0 .6em; color: var(--line); }

.dj-notices:empty { display: none; }
.woocommerce-message, .woocommerce-info, .woocommerce-error {
	list-style: none; margin: 18px 0 0; padding: 14px 18px;
	background: var(--paper); border-left: 3px solid var(--oak);
	font-size: 14px; line-height: 1.6;
}
.woocommerce-error { border-left-color: var(--danger); }
.woocommerce-error li { margin: 0; }
.woocommerce-message .button, .woocommerce-info .button {
	float: none; margin-left: 14px; color: var(--ink);
	border-bottom: 1px solid var(--ink); font-size: 13px; letter-spacing: .04em;
}
.woocommerce-store-notice { background: var(--ink); color: var(--paper); text-align: center; padding: 10px; font-size: 14px; margin: 0; }
.woocommerce-store-notice a { color: var(--paper); text-decoration: underline; }

/* ---------- editorial sections ---------- */
.dj-section { border-top: 1px solid var(--line); padding: 84px 0; }
.dj-label {
	display: flex; align-items: center; gap: 16px;
	font: 600 15px/1 var(--serif); letter-spacing: .32em; color: var(--muted);
	margin: 0 0 40px;
}
.dj-label::before { content: ""; width: 28px; height: 1px; background: var(--oak); flex: none; }

.dj-prose { max-width: 38em; font-size: 17px; line-height: 2; color: var(--ink); margin:0 auto;}
.dj-prose p { margin: 0 0 1.5em; }
.dj-prose p:last-child { margin-bottom: 0; }
.dj-prose strong { font-weight: 600; }
.dj-prose .dj-subhead { margin: 2.2em 0 .9em; }      /* bold-only paragraphs, marked server-side */
.dj-prose .dj-subhead strong { font: 600 1.25em/1.6 var(--serif); }
.dj-prose .dj-subhead:first-child { margin-top: 0; }
.dj-prose a { border-bottom: 1px solid var(--oak); }
.dj-prose img { margin: 1.5em 0; }
.dj-prose blockquote { margin: 1.5em 0; padding-left: 1.2em; border-left: 2px solid var(--oak); color: var(--muted); }
.dj-prose--sm { font-size: 15px; line-height: 1.9; color: var(--muted); }

/* author */
.dj-author__grid { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 36px; align-items: start; max-width: 46em; }
.dj-author__avatar img { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; }
.dj-author__name { font: 600 24px/1.4 var(--serif); margin: 0 0 12px; }
.dj-more { margin: 18px 0 0; font-size: 14px; }
.dj-more a { border-bottom: 1px solid var(--ink); padding-bottom: 2px; }
.dj-more a:hover { border-bottom-color: var(--walnut); }
.dj-author .dj-books--sm { margin-top: 56px; }

/* the shelf */
.dj-books {
	list-style: none;
	display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 36px 32px;
}
.dj-books--sm { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.dj-book { margin: 0; min-width: 0; }
.dj-book a { display: block; }
.dj-book__cover {
	margin: 0; height: 260px; padding: 0 10px;
	display: flex; align-items: flex-end; justify-content: center;
	border-bottom: 3px solid var(--oak);          /* each book stands in its own cubby */
	background: linear-gradient(to top, rgba(194, 153, 106, .10), rgba(194, 153, 106, 0) 45%);
}
.dj-books--sm .dj-book__cover { height: 180px; }
.dj-book__cover img {
	max-height: 100%; width: auto; max-width: 100%; height: auto;
	object-fit: contain;
	box-shadow: 0 14px 22px -16px rgba(30, 27, 24, .55);
	transition: transform .2s ease;
}
.dj-book a:hover .dj-book__cover img { transform: translateY(-3px); }
.dj-book__title {
	font: 500 15px/1.55 var(--serif); margin: 16px 0 4px;
	display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.dj-book a:hover .dj-book__title { color: var(--walnut); }
.dj-book__meta { font-size: 13px; color: var(--muted); margin: 0 0 2px; }
.dj-book__price { font: 400 14px/1.5 var(--serif); font-variant-numeric: tabular-nums; margin: 0; }
.dj-book__price del { color: var(--muted); margin-right: 6px; }
.dj-book__price ins { text-decoration: none; }
.dj-book__oos { display: inline-block; margin-left: 8px; font: 400 12px var(--sans); color: var(--muted); letter-spacing: .06em; }

/* ---------- footer ---------- */
.dj-footer { border-top: 1px solid var(--line); margin-top: 24px; padding: 60px 0 36px; font-size: 13px; color: var(--muted); }
.dj-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; align-items: start; }
.dj-footer__brand img { height: 30px; width: auto; margin-bottom: 14px; opacity: .9; }
.dj-footer__brand p { margin: 0; }
.dj-footer__tagline { letter-spacing: .08em; }
.dj-footer__address { font-style: normal; line-height: 1.7; margin: 16px 0 0; }
.dj-footer__hours { line-height: 1.7; margin: 12px 0 0 !important; font-variant-numeric: tabular-nums; }
.dj-footer__social { list-style: none; display: flex; gap: 18px; margin: 18px 0 0; padding: 0; }
.dj-footer__social a { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); }
.dj-footer__social a:hover { color: var(--ink); }
.dj-footer__social svg { flex: none; }
.dj-footer__menu { list-style: none; display: grid; gap: 8px; }
.dj-footer__contact p { margin: 0 0 8px; }
.dj-footer a:hover { color: var(--ink); }
.dj-footer__legal { margin-top: 44px; padding-top: 18px; border-top: 1px solid var(--line); }
.dj-footer__legal p { margin: 0; font-size: 12px; letter-spacing: .04em; }

/* ---------- page slider (Slider Revolution, printed by dj_shelf_page_slider) ---------- */
.dj-page-slider { position: relative; z-index: 1; border-bottom: 1px solid var(--line); background: var(--paper); }
.dj-page-slider .rev_slider_wrapper { margin: 0 auto; }

/* ---------- floating WhatsApp button (script/shelf.js; same artwork and position as the classic site) ---------- */
.dj-float-whatsapp-button {
	position: fixed; bottom: 80px; right: 20px; z-index: 25;
	width: 60px; height: 60px;
	display: flex; align-items: center; justify-content: center;
	background: transparent; cursor: pointer;
}
.dj-float-whatsapp-button img { width: 100%; height: auto; display: block; }
.dj-no-float .dj-float-whatsapp-button { display: none; }
@keyframes dj-fade-in { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 900px) {
	.dj-float-whatsapp-button { bottom: 70px; width: 40px; height: 40px; animation: dj-fade-in .5s ease-in-out; }
}

/* ---------- responsive ---------- */
@media (max-width: 1100px) {	.dj-books { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {	.dj-header__inner { grid-template-columns: auto 1fr auto; gap: 16px; height: 64px; }	.dj-logo { justify-self: center; }	.dj-logo img { height: 28px; }	.dj-burger {
		display: inline-flex; flex-direction: column; justify-content: center; gap: 6px;
		width: 40px; height: 40px; margin-left: -8px; border: 0; background: none; cursor: pointer;
	}	.dj-burger span { display: block; height: 1.5px; width: 22px; background: var(--ink); transition: transform .2s ease; }	.dj-header.is-open .dj-burger span:first-child { transform: translateY(3.75px) rotate(45deg); }	.dj-header.is-open .dj-burger span:last-child { transform: translateY(-3.75px) rotate(-45deg); }	.dj-nav {
		display: none;
		position: absolute; left: 0; right: 0; top: 100%;
		flex-direction: column; align-items: stretch; gap: 0;
		background: var(--paper); border-bottom: 1px solid var(--line);
		padding: 8px var(--gutter) 20px;
	}	.dj-header.is-open .dj-nav { display: flex; }	.dj-menu { flex-direction: column; gap: 0; white-space: normal; overflow: visible; }	.dj-menu a { display: block; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 16px; }	.dj-search { margin: 16px 0 0; border-bottom-color: var(--line); }	.dj-search input[type="search"] { width: 100%; opacity: 1; font-size: 16px; flex: 1; }	.dj-tool__label { display: none; }	.dj-tools { gap: 16px; }
}

@media (max-width: 900px) {
	:root { --gutter: 16px; }	:root { --gutter: 16px; }	.dj-section { padding: 56px 0; }	.dj-label { margin-bottom: 28px; }	.dj-prose { font-size: 16px; line-height: 1.95; }	.dj-footer__grid { grid-template-columns: 1fr; gap: 28px; }
}

@media (max-width: 700px) {	.dj-books, .dj-books--sm {
		display: flex; overflow-x: auto; gap: 20px;
		margin: 0 calc(-1 * var(--gutter)); padding: 0 var(--gutter) 10px;
		scroll-snap-type: x mandatory; scroll-padding-left: var(--gutter);
		-webkit-overflow-scrolling: touch; scrollbar-width: none;
	}	.dj-books::-webkit-scrollbar { display: none; }	.dj-book { flex: 0 0 42%; scroll-snap-align: start; }	.dj-book__cover { height: 210px; }	.dj-books--sm .dj-book__cover { height: 150px; }
}

@media (prefers-reduced-motion: reduce) {	html { scroll-behavior: auto; }	*, *::before, *::after { transition: none !important; }
}

/* ---------- print ---------- */
@media print {	body { background: #fff; color: #000; }	.dj-section { padding: 24px 0; }
}