/**
 * Kami article typography for IndustCO
 * Based on the Kami document design system — https://kami.tw93.fun
 *
 * Rules applied (white-paper variant: page stays white, warmth kept in
 * cards / quotes / code blocks — the parchment page background is
 * intentionally NOT used):
 *   - Single accent color: ink blue #1B365D, nothing else chromatic
 *   - Warm grays only (yellow-brown undertone, R ≈ G > B)
 *   - Serif carries hierarchy: headings serif 500, no synthetic bold
 *   - Latin body serif, CJK body sans (per Kami rule 4)
 *   - Line-height bands: titles 1.1–1.3, reading 1.55–1.6
 *   - Quote: 3px brand left bar + olive text
 *   - Code: ivory bg + hairline border + 6px radius + mono
 *   - Lists: dash instead of bullet
 *   - Depth: ring / whisper shadows only, no hard drop shadows
 */

:root {
	--kami-brand:        #1B365D;
	--kami-brand-light:  #2D5A8A;
	--kami-ink:          #141413;
	--kami-dark-warm:    #3D3D3A;
	--kami-olive:        #504E49;
	--kami-stone:        #6B6A64;
	--kami-ivory:        #FAF9F5;
	--kami-sand:         #E8E6DC;
	--kami-border:       #E8E6DC;
	--kami-border-soft:  #E5E3D8;
	--kami-tag-tint:     #E4ECF5;
	--kami-tag-tint-lt:  #EEF2F7;

	--kami-serif: Charter, "Bitstream Charter", Georgia, "Songti SC", "Noto Serif SC", "Source Han Serif SC", "Noto Serif CJK SC", serif;
	--kami-sans:  Charter, "Bitstream Charter", Georgia, "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif;
	--kami-mono:  "JetBrains Mono", ui-monospace, "SF Mono", "Fira Code", Consolas, Menlo, monospace;
}

/* ------------------------------------------------------------------ */
/* Article container — flat on the page, no card                      */
/* ------------------------------------------------------------------ */

/* No card around the article: content sits flat on the page, like the
   Kami reference. Depth is reserved for small inner cards (quotes, code,
   author bio). */
.single-post .themestek-common-box-shadow {
	background: transparent;
	box-shadow: none;
}

.single-post .ts-post-featured-outer-wrapper {
	border-radius: 12px;
	overflow: hidden;
}

/* Comfortable reading measure when the post has no sidebar */
.single-post #primary.content-area:not([class*="col-"]) .themestek-common-box-shadow,
.single-post #primary.content-area:not([class*="col-"]) .edit-link-wrapper {
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
}

/* ------------------------------------------------------------------ */
/* Title (rendered in the titlebar on single posts)                   */
/* ------------------------------------------------------------------ */

.single-post .ts-titlebar-main h1 {
	font-family: var(--kami-serif);
	font-weight: 500;
	font-size: clamp(28px, 4vw, 40px);
	line-height: 1.15;
	letter-spacing: -0.3px;
	text-transform: none;
}

/* List views: entry titles in serif 500 */
.blog .entry-title,
.archive .entry-title,
.search .entry-title {
	font-family: var(--kami-serif);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -0.2px;
	text-transform: none;
}

.blog .entry-title a,
.archive .entry-title a,
.search .entry-title a {
	color: var(--kami-ink);
}

.blog .entry-title a:hover,
.archive .entry-title a:hover,
.search .entry-title a:hover {
	color: var(--kami-brand);
}

/* ------------------------------------------------------------------ */
/* Meta line — quiet editorial label, icons in the accent color       */
/* ------------------------------------------------------------------ */

.single-post .ts-featured-meta-wrapper,
.blog .ts-featured-meta-wrapper,
.archive .ts-featured-meta-wrapper,
.search .ts-featured-meta-wrapper {
	color: var(--kami-stone);
	font-family: var(--kami-sans);
}

.single-post .ts-featured-meta-wrapper .ts-meta-line,
.blog .ts-featured-meta-wrapper .ts-meta-line,
.archive .ts-featured-meta-wrapper .ts-meta-line,
.search .ts-featured-meta-wrapper .ts-meta-line {
	font-size: 13px;
	letter-spacing: 0.02em;
	margin-right: 16px;
}

.single-post .ts-featured-meta-wrapper .ts-meta-line i,
.blog .ts-featured-meta-wrapper .ts-meta-line i,
.archive .ts-featured-meta-wrapper .ts-meta-line i,
.search .ts-featured-meta-wrapper .ts-meta-line i {
	color: var(--kami-brand);
}

.single-post .ts-featured-meta-wrapper .ts-meta-line a,
.blog .ts-featured-meta-wrapper .ts-meta-line a,
.archive .ts-featured-meta-wrapper .ts-meta-line a,
.search .ts-featured-meta-wrapper .ts-meta-line a {
	color: var(--kami-stone);
}

.single-post .ts-featured-meta-wrapper .ts-meta-line a:hover,
.blog .ts-featured-meta-wrapper .ts-meta-line a:hover,
.archive .ts-featured-meta-wrapper .ts-meta-line a:hover,
.search .ts-featured-meta-wrapper .ts-meta-line a:hover {
	color: var(--kami-brand);
}

/* ------------------------------------------------------------------ */
/* Body copy — reading band                                           */
/* ------------------------------------------------------------------ */

.single-post .entry-content,
.blog .entry-content,
.archive .entry-content,
.search .entry-content {
	font-family: var(--kami-sans);
	font-size: 17px;
	line-height: 1.6;
	color: var(--kami-dark-warm);
}

.single-post .entry-content p {
	margin-bottom: 20px;
}

.single-post .entry-content ::selection {
	background: var(--kami-brand);
	color: var(--kami-ivory);
}

/* Links: accent color, soft underline */
.single-post .entry-content a:not(.ts-btn) {
	color: var(--kami-brand);
	text-decoration: underline;
	text-decoration-color: rgba(27, 54, 93, 0.35);
	text-underline-offset: 3px;
	transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

.single-post .entry-content a:not(.ts-btn):hover {
	color: var(--kami-brand-light);
	text-decoration-color: var(--kami-brand-light);
}

/* ------------------------------------------------------------------ */
/* Headings inside content — serif 500, size-led, no decoration       */
/* ------------------------------------------------------------------ */

.single-post .entry-content h1,
.single-post .entry-content h2,
.single-post .entry-content h3,
.single-post .entry-content h4,
.single-post .entry-content h5,
.single-post .entry-content h6 {
	font-family: var(--kami-serif);
	font-weight: 500;
	color: var(--kami-ink);
	text-transform: none;
	letter-spacing: -0.2px;
}

.single-post .entry-content h2 {
	font-size: 27px;
	line-height: 1.2;
	margin: 48px 0 16px;
}

.single-post .entry-content h3 {
	font-size: 21px;
	line-height: 1.25;
	margin: 36px 0 12px;
}

.single-post .entry-content h4 {
	font-size: 18px;
	line-height: 1.3;
	margin: 28px 0 10px;
}

.single-post .entry-content h5,
.single-post .entry-content h6 {
	font-size: 16px;
	line-height: 1.3;
	margin: 24px 0 8px;
}

.single-post .entry-content > h2:first-child,
.single-post .entry-content > h3:first-child {
	margin-top: 0;
}

/* Emphasize with color, not bold (Kami: numbers/emphasis in brand) */
.single-post .entry-content strong,
.single-post .entry-content b {
	font-weight: 600;
	color: var(--kami-ink);
}

/* ------------------------------------------------------------------ */
/* Blockquote — 3px brand left bar + olive text                       */
/* ------------------------------------------------------------------ */

.single-post .entry-content blockquote {
	border-left: 3px solid var(--kami-brand);
	background: var(--kami-ivory);
	border-radius: 0 8px 8px 0;
	margin: 32px 0;
	padding: 18px 24px;
	color: var(--kami-olive);
	font-family: var(--kami-serif);
	font-size: 17px;
	line-height: 1.55;
	font-style: normal;
}

.single-post .entry-content blockquote::before,
.single-post .entry-content blockquote::after {
	display: none;
}

.single-post .entry-content blockquote p {
	margin-bottom: 0;
	color: inherit;
}

.single-post .entry-content blockquote p + p {
	margin-top: 12px;
}

.single-post .entry-content blockquote cite {
	display: block;
	margin-top: 10px;
	font-family: var(--kami-sans);
	font-size: 13px;
	font-style: normal;
	color: var(--kami-stone);
}

/* ------------------------------------------------------------------ */
/* Lists — dash instead of bullet, editorial tone                     */
/* ------------------------------------------------------------------ */

.single-post .entry-content > ul,
.single-post .entry-content > ul ul {
	list-style: none;
	margin: 0 0 20px;
	padding-left: 4px;
}

.single-post .entry-content > ul li,
.single-post .entry-content > ul ul li {
	position: relative;
	padding-left: 20px;
	margin-bottom: 8px;
}

.single-post .entry-content > ul li::before,
.single-post .entry-content > ul ul li::before {
	content: "\2013"; /* – */
	position: absolute;
	left: 0;
	color: var(--kami-stone);
}

.single-post .entry-content > ol {
	margin: 0 0 20px;
	padding-left: 24px;
}

.single-post .entry-content > ol li {
	padding-left: 6px;
	margin-bottom: 8px;
}

.single-post .entry-content > ol li::marker {
	color: var(--kami-brand);
	font-family: var(--kami-serif);
	font-weight: 500;
}

/* ------------------------------------------------------------------ */
/* Code — ivory bg + hairline border + 6px radius + mono              */
/* ------------------------------------------------------------------ */

.single-post .entry-content code {
	font-family: var(--kami-mono);
	font-size: 0.85em;
	background: var(--kami-ivory);
	border: 1px solid var(--kami-border-soft);
	border-radius: 4px;
	padding: 1px 6px;
	color: var(--kami-dark-warm);
}

.single-post .entry-content pre {
	background: var(--kami-ivory);
	border: 1px solid var(--kami-border-soft);
	border-radius: 6px;
	padding: 20px 24px;
	margin: 28px 0;
	overflow-x: auto;
	font-family: var(--kami-mono);
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--kami-dark-warm);
}

.single-post .entry-content pre code {
	background: transparent;
	border: none;
	padding: 0;
	font-size: inherit;
}

/* ------------------------------------------------------------------ */
/* Tables — warm hairline borders, serif headers                      */
/* ------------------------------------------------------------------ */

.single-post .entry-content table {
	width: 100%;
	border-collapse: collapse;
	margin: 28px 0;
	font-size: 15px;
	line-height: 1.5;
}

.single-post .entry-content table th {
	font-family: var(--kami-serif);
	font-weight: 500;
	color: var(--kami-ink);
	text-align: left;
	background: var(--kami-ivory);
	border: none;
	border-bottom: 2px solid var(--kami-brand);
	padding: 10px 14px;
}

.single-post .entry-content table td {
	border: none;
	border-bottom: 1px solid var(--kami-border-soft);
	padding: 10px 14px;
	color: var(--kami-dark-warm);
}

/* ------------------------------------------------------------------ */
/* Images, captions, separators                                       */
/* ------------------------------------------------------------------ */

.single-post .entry-content img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
}

.single-post .entry-content .wp-caption {
	max-width: 100%;
}

.single-post .entry-content .wp-caption-text,
.single-post .entry-content figcaption {
	font-family: var(--kami-sans);
	font-size: 13px;
	line-height: 1.45;
	color: var(--kami-stone);
	text-align: center;
	margin-top: 10px;
}

/* Section separator: warm-gray dashed hairline */
.single-post .entry-content hr {
	border: none;
	border-top: 1px dashed #D5D2C6;
	margin: 48px 0;
	background: none;
	height: 0;
}

/* ------------------------------------------------------------------ */
/* Tag & category pills — solid hex tints of ink blue                 */
/* ------------------------------------------------------------------ */

.single-post .ts-post-tag-cat a,
.single-post .entry-content .tags-links a {
	display: inline-block;
	background: var(--kami-tag-tint);
	color: var(--kami-brand);
	font-size: 13px;
	line-height: 1.35;
	border-radius: 4px;
	padding: 3px 10px;
	margin: 0 4px 6px 0;
	text-decoration: none;
	transition: background 0.15s ease;
}

.single-post .ts-post-tag-cat a:hover,
.single-post .entry-content .tags-links a:hover {
	background: #D0DCE9;
	color: var(--kami-brand);
}

/* ------------------------------------------------------------------ */
/* Read-more (list views) — primary button: brand fill + ivory text   */
/* ------------------------------------------------------------------ */

.themestek-blog-classic-footer-readmore a,
.themestek-blogbox-footer-readmore a {
	background: var(--kami-brand);
	color: var(--kami-ivory);
	border: none;
	border-radius: 8px;
	padding: 10px 28px;
	font-weight: 500;
	letter-spacing: 0.02em;
	box-shadow: none;
	transition: background 0.15s ease;
}

.themestek-blog-classic-footer-readmore a:hover,
.themestek-blogbox-footer-readmore a:hover {
	background: var(--kami-brand-light);
	color: var(--kami-ivory);
	border-color: transparent;
}

/* ------------------------------------------------------------------ */
/* Author bio — ivory card, whisper shadow                            */
/* ------------------------------------------------------------------ */

.single-post .author-info {
	background: var(--kami-ivory);
	border: 1px solid var(--kami-border-soft);
	border-radius: 12px;
	padding: 28px;
	margin-top: 48px;
}

.single-post .author-info .author-avatar img {
	border-radius: 50%;
}

.single-post .author-info .author-title {
	font-family: var(--kami-serif);
	font-weight: 500;
	font-size: 18px;
	color: var(--kami-ink);
	text-transform: none;
}

.single-post .author-info .author-bio {
	color: var(--kami-olive);
	font-size: 15px;
	line-height: 1.55;
}

.single-post .author-info .author-link {
	color: var(--kami-brand);
}

/* ------------------------------------------------------------------ */
/* Comments — quiet, same system                                      */
/* ------------------------------------------------------------------ */

.single-post .comments-area .comments-title,
.single-post .comments-area .comment-reply-title {
	font-family: var(--kami-serif);
	font-weight: 500;
	color: var(--kami-ink);
	text-transform: none;
}

.single-post .comments-area .comment-content {
	color: var(--kami-dark-warm);
	line-height: 1.6;
}

.single-post .comments-area .comment-metadata a,
.single-post .comments-area .comment-metadata time {
	color: var(--kami-stone);
	font-size: 13px;
}

.single-post .comments-area .reply a,
.single-post .comments-area .comment-reply-link {
	color: var(--kami-brand);
}

/* ------------------------------------------------------------------ */
/* Sidebar on article pages — same system, sans carries function      */
/* ------------------------------------------------------------------ */

/* Widget titles: serif 500, size-led hierarchy, no decoration */
.single-post .sidebar .widget .widget-title,
.blog .sidebar .widget .widget-title,
.archive .sidebar .widget .widget-title,
.search .sidebar .widget .widget-title {
	font-family: var(--kami-serif);
	font-weight: 500;
	font-size: 19px;
	line-height: 1.25;
	color: var(--kami-ink);
	text-transform: none;
	letter-spacing: -0.1px;
	margin-bottom: 20px;
}

/* Remove the orange decorative bar under widget titles */
.single-post .sidebar .widget .widget-title::after,
.blog .sidebar .widget .widget-title::after,
.archive .sidebar .widget .widget-title::after,
.search .sidebar .widget .widget-title::after {
	display: none;
}

/* Widget links: warm gray, hover ink blue — no orange */
.single-post .sidebar .widget a,
.blog .sidebar .widget a,
.archive .sidebar .widget a,
.search .sidebar .widget a {
	color: var(--kami-olive);
	font-weight: 400;
	transition: color 0.15s ease;
}

.single-post .sidebar .widget a:hover,
.blog .sidebar .widget a:hover,
.archive .sidebar .widget a:hover,
.search .sidebar .widget a:hover {
	color: var(--kami-brand);
}

.single-post .sidebar .widget ul > li,
.blog .sidebar .widget ul > li,
.archive .sidebar .widget ul > li,
.search .sidebar .widget ul > li {
	font-weight: 400;
	border-color: var(--kami-border-soft);
}

/* Post dates in recent-posts widget: caption style */
.single-post .sidebar .widget .post-date,
.blog .sidebar .widget .post-date,
.archive .sidebar .widget .post-date,
.search .sidebar .widget .post-date {
	display: block;
	font-size: 13px;
	color: var(--kami-stone);
	margin-top: 2px;
}

/* Search input: warm hairline border, soft radius, brand focus ring */
.single-post .sidebar .widget_search input[type="search"],
.single-post .sidebar .widget_search input[type="text"],
.blog .sidebar .widget_search input[type="search"],
.blog .sidebar .widget_search input[type="text"],
.archive .sidebar .widget_search input[type="search"],
.archive .sidebar .widget_search input[type="text"],
.search .sidebar .widget_search input[type="search"],
.search .sidebar .widget_search input[type="text"] {
	border: 1px solid var(--kami-border-soft);
	border-radius: 8px;
	background: var(--kami-ivory);
	color: var(--kami-dark-warm);
	transition: border-color 0.15s ease;
}

.single-post .sidebar .widget_search input[type="search"]:focus,
.single-post .sidebar .widget_search input[type="text"]:focus,
.blog .sidebar .widget_search input[type="search"]:focus,
.blog .sidebar .widget_search input[type="text"]:focus,
.archive .sidebar .widget_search input[type="search"]:focus,
.archive .sidebar .widget_search input[type="text"]:focus,
.search .sidebar .widget_search input[type="search"]:focus,
.search .sidebar .widget_search input[type="text"]:focus {
	border-color: var(--kami-brand);
	outline: none;
}

/* ------------------------------------------------------------------ */
/* Prev / next post buttons                                           */
/* ------------------------------------------------------------------ */

.single-post .ts-post-prev-next-buttons {
	border-top: 1px dashed #D5D2C6;
	padding-top: 28px;
	margin-top: 40px;
}

.single-post .ts-post-prev-next-buttons a {
	background: var(--kami-brand) !important;
	color: var(--kami-ivory) !important;
	border-radius: 8px;
	border: none !important;
	box-shadow: none;
}

.single-post .ts-post-prev-next-buttons a:hover {
	background: var(--kami-brand-light) !important;
}
