/*
 * Blue Workshop Guide routes. Kadence owns global header/footer; every rule
 * here is scoped to the plugin's route body.
 */
.dba-guide-shell {
	--dba-blue: #175CFF;
	--dba-blue-deep: #103CBD;
	--dba-blue-soft: #E8F0FF;
	--dba-ink: #101114;
	--dba-muted: #566277;
	--dba-paper: #FFFFFF;
	--dba-mist: #F5F7FB;
	--dba-rule: #DCE2EB;
	--dba-warning: #A15C00;
	--dba-shell: 1120px;
	--dba-pad: 32px;
	--dba-rail: 280px;
	--dba-gap: 48px;
	--dba-article: 720px;
	--dba-display: Manrope, "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", sans-serif;
	--dba-body: "Noto Sans TC", "PingFang TC", system-ui, "Microsoft JhengHei", sans-serif;
	--dba-mono: Menlo, Consolas, "Noto Sans TC", "PingFang TC", monospace;
	box-sizing: border-box;
	color: var(--dba-ink);
	background: var(--dba-paper);
	font-family: var(--dba-body);
	font-size: 16px;
	line-height: 1.75;
	overflow-wrap: anywhere;
	padding-bottom: 56px;
}
.dba-guide-shell *, .dba-guide-shell *::before, .dba-guide-shell *::after { box-sizing: border-box; }
.dba-guide-shell [hidden] { display: none !important; }
.dba-guide-shell__inner { width: min(100%, var(--dba-shell)); margin-inline: auto; padding-inline: var(--dba-pad); }
.dba-guide-shell :is(h1, h2, h3) { color: var(--dba-ink); font-family: var(--dba-display); }
.dba-guide-shell :is(a, button, input, summary, [tabindex]):focus-visible { outline: 2px solid var(--dba-blue); outline-offset: 3px; box-shadow: 0 0 0 3px rgba(23, 92, 255, .24); }
.dba-guide-shell a { color: var(--dba-blue); text-underline-offset: 2px; }
.dba-guide-shell a:hover { color: var(--dba-blue-deep); }
.dba-guide-shell code { border-radius: 6px; background: var(--dba-mist); padding: 2px 6px; font-family: var(--dba-mono); font-size: .9375rem; overflow-wrap: anywhere; }

/* Guide context and breadcrumbs */
.dba-guide-context { width: 100vw; margin-inline: calc(50% - 50vw); min-height: 48px; background: var(--dba-mist); border-block: 1px solid var(--dba-rule); }
.dba-guide-context .dba-guide-shell__inner { min-height: 46px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: .875rem; color: var(--dba-muted); }
.dba-guide-context strong { color: var(--dba-ink); font-family: var(--dba-display); }
.dba-guide-breadcrumb { padding-top: 24px; }
.dba-guide-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; color: var(--dba-muted); font-size: .875rem; }
.dba-guide-breadcrumb li { display: flex; align-items: center; gap: 8px; }
.dba-guide-breadcrumb li + li::before { content: "/"; color: #AEB2BA; }
.dba-guide-breadcrumb span { color: var(--dba-muted); }

/* Two-column reading layout */
.dba-guide-layout { display: grid; grid-template-columns: var(--dba-rail) minmax(0, 1fr); gap: var(--dba-gap); align-items: start; padding-top: 48px; }
.dba-guide-main { min-width: 0; }
.dba-guide-article, .dba-guide-library__head, .dba-guide-library__finder, .dba-guide-library__list, .dba-guide-library__search-results, .dba-guide-empty, .dba-guide-pagination { max-width: var(--dba-article); }
.dba-guide-rail { position: sticky; top: 104px; max-height: calc(100vh - 132px); overflow-y: auto; overscroll-behavior: contain; padding-right: 8px; }
.dba-guide-rail__heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.dba-guide-rail__title { margin: 0; font-size: .875rem; font-weight: 700; }
.dba-guide-rail__close, .dba-guide-rail__backdrop { display: none; }
.dba-guide-rail__search { display: grid; gap: 8px; }
.dba-guide-search__field { position: relative; }
.dba-guide-input { width: 100%; min-height: 48px; border: 1px solid #7C8798; border-radius: 10px; padding: 10px 14px; color: var(--dba-ink); background: var(--dba-paper); font: inherit; font-size: .9375rem; }
.dba-guide-search__field .dba-guide-input { padding-right: 62px; }
.dba-guide-search__field .dba-guide-input::-webkit-search-cancel-button { appearance: none; }
.dba-guide-search__clear { position: absolute; top: 50%; right: 8px; min-width: 44px; min-height: 36px; border: 0; border-radius: 6px; padding: 4px 8px; transform: translateY(-50%); background: transparent; color: var(--dba-blue-deep); font: inherit; font-size: .8125rem; font-weight: 700; cursor: pointer; }
.dba-guide-search__clear:hover { background: var(--dba-blue-soft); }
.dba-guide-rail__status { margin: 0; color: var(--dba-muted); font-size: .875rem; }
.dba-guide-search__empty { margin: 16px 0 0; color: var(--dba-muted); font-size: .875rem; }
.dba-guide-rail__nav { margin-top: 24px; }
.dba-guide-rail__parent + .dba-guide-rail__parent { margin-top: 24px; }
.dba-guide-rail__group { margin: 0 0 8px; font-size: .875rem; line-height: 1.4; }
.dba-guide-rail__group a { color: var(--dba-ink); text-decoration: none; }
.dba-guide-rail__child + .dba-guide-rail__child { margin-top: 14px; }
.dba-guide-rail__child-link { display: block; min-height: 32px; padding: 4px 10px; border-radius: 6px; color: var(--dba-muted); font-family: var(--dba-display); font-size: .875rem; font-weight: 700; text-decoration: none; }
.dba-guide-rail__child-link:hover, .dba-guide-rail__child-link[aria-current="page"] { color: var(--dba-blue-deep); background: var(--dba-blue-soft); }
.dba-guide-rail__list { margin: 2px 0 0; padding: 0; list-style: none; }
.dba-guide-rail__list a { display: flex; align-items: center; min-height: 38px; padding: 7px 10px; border-radius: 6px; color: var(--dba-muted); font-family: var(--dba-display); font-size: .8125rem; font-weight: 600; line-height: 1.45; text-decoration: none; }
.dba-guide-rail__list a:hover { color: var(--dba-ink); background: var(--dba-mist); }
.dba-guide-rail__list a[aria-current="page"] { color: var(--dba-blue-deep); background: var(--dba-blue-soft); font-weight: 700; }

/* Article head, summary and interaction controls */
.dba-guide-article__head { padding-bottom: 24px; border-bottom: 1px solid var(--dba-rule); }
.dba-guide-article__title { margin: 0; font-size: clamp(1.75rem, 1.1rem + 2.6vw, 2.375rem); font-weight: 720; letter-spacing: -.03em; line-height: 1.2; }
.dba-guide-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin: 24px 0 0; color: var(--dba-muted); font-size: .875rem; }
.dba-guide-meta > div { display: flex; gap: 6px; }
.dba-guide-meta dt { font-weight: 650; }
.dba-guide-meta dd { margin: 0; }
.dba-guide-meta__action { margin-inline-start: auto; }
.dba-guide-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; border: 1px solid transparent; border-radius: 10px; padding: 11px 18px; font-family: var(--dba-display); font-size: .875rem; font-weight: 650; cursor: pointer; transition: color 160ms ease, background-color 160ms ease, border-color 160ms ease; }
.dba-guide-button--secondary { border-color: #7C8798; background: var(--dba-paper); color: var(--dba-ink); }
.dba-guide-button--secondary:hover { border-color: var(--dba-blue); background: var(--dba-mist); }
.dba-guide-button--primary { background: var(--dba-blue); border-color: var(--dba-blue); color: var(--dba-paper); }
.dba-guide-button--primary:hover, .dba-guide-button--primary.is-done { background: var(--dba-blue-deep); border-color: var(--dba-blue-deep); color: var(--dba-paper); }
/* Ticket 00 parity: only code embedded inside the primary action is transparent. */
.dba-guide-button--primary code { padding: 0; background: transparent; color: inherit; }
.dba-guide-answer { margin-top: 24px; padding-left: 20px; border-left: 3px solid var(--dba-blue); }
.dba-guide-answer h2 { margin: 0 0 6px; font-size: .875rem; font-weight: 700; }
.dba-guide-answer p { margin: 0; font-size: 1.0625rem; line-height: 1.75; }
.dba-guide-controls { display: none; }
.dba-guide-disclosure { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; border: 1px solid #7C8798; border-radius: 10px; background: var(--dba-paper); color: var(--dba-ink); font-family: var(--dba-display); font-size: .875rem; font-weight: 650; cursor: pointer; }
.dba-guide-disclosure[aria-expanded="true"] { border-color: var(--dba-blue); background: var(--dba-blue-soft); color: var(--dba-blue-deep); }

/* Table of contents and prose */
.dba-guide-toc { margin-top: 40px; padding: 20px; border-radius: 10px; background: var(--dba-mist); }
.dba-guide-toc h2 { margin: 0 0 8px; font-size: .875rem; font-weight: 700; }
.dba-guide-toc ol { margin: 0; padding: 0; list-style: none; }
.dba-guide-toc li + li { margin-top: 2px; }
.dba-guide-toc a { display: block; min-height: 42px; padding: 9px 10px; border-left: 2px solid transparent; border-radius: 0 6px 6px 0; color: var(--dba-muted); font-size: .875rem; text-decoration: none; }
.dba-guide-toc a:hover { color: var(--dba-ink); background: var(--dba-paper); }
.dba-guide-toc__h3 { padding-left: 16px; }
.dba-guide-prose { margin-top: 40px; }
.dba-guide-prose h2, .dba-guide-section > h2 { margin: 48px 0 16px; font-size: clamp(1.375rem, 1.1rem + 1.1vw, 1.625rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.3; scroll-margin-top: 126px; }
.dba-guide-prose > h2:first-child { margin-top: 0; }
.dba-guide-prose h3 { margin: 32px 0 12px; font-size: 1.125rem; font-weight: 700; line-height: 1.4; scroll-margin-top: 126px; }
.dba-guide-prose :is(p, ul, ol, blockquote, pre) { margin: 16px 0 0; }
.dba-guide-prose ul { padding-left: 1.35em; list-style: disc; }
.dba-guide-prose ol { padding-left: 1.45em; }
.dba-guide-prose li + li { margin-top: 8px; }
.dba-guide-prose ol > li::marker { color: var(--dba-blue-deep); font-family: var(--dba-display); font-weight: 700; }
.dba-guide-prose :is(img, iframe, video) { max-width: 100%; height: auto; }
.dba-guide-prose a { text-decoration-thickness: 1px; }
.dba-guide-content-image { margin: 24px 0 8px; padding: 8px; border: 1px solid var(--dba-rule); border-radius: 10px; background: var(--dba-paper); overflow: hidden; }
.dba-guide-content-image img { display: block; width: 100%; max-width: 100%; height: auto; border-radius: 5px; }
.dba-guide-content-image figcaption { margin: 10px 4px 2px; color: var(--dba-muted); font-size: .8125rem; line-height: 1.5; }

/* Structured sections */
.dba-guide-section > h2 { scroll-margin-top: 126px; }
.dba-guide-callout { margin-top: 16px; padding: 20px; border: 1px solid var(--dba-rule); border-radius: 10px; }
.dba-guide-callout--info { background: var(--dba-blue-soft); }
.dba-guide-callout--warning { background: var(--dba-mist); border-left: 3px solid var(--dba-warning); }
.dba-guide-callout__label { margin: 0 0 8px; color: var(--dba-ink); font-family: var(--dba-display); font-size: .875rem; font-weight: 700; }
.dba-guide-callout--warning .dba-guide-callout__label { color: var(--dba-warning); }
.dba-guide-callout :is(p, ul, ol) { margin: 8px 0 0; }
.dba-guide-callout ul { padding-left: 1.35em; }
.dba-guide-faq { margin-top: 16px; }
.dba-guide-faq__item { border-bottom: 1px solid var(--dba-rule); }
.dba-guide-faq__item:first-child { border-top: 1px solid var(--dba-rule); }
.dba-guide-faq__question { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 54px; padding: 16px 0; color: var(--dba-ink); font-family: var(--dba-display); font-size: 1.125rem; font-weight: 700; cursor: pointer; list-style: none; }
.dba-guide-faq__question::-webkit-details-marker { display: none; }
.dba-guide-faq__question::after { content: "+"; color: var(--dba-muted); font-size: 1.25rem; }
.dba-guide-faq__item[open] .dba-guide-faq__question::after { content: "−"; }
.dba-guide-faq__answer { padding-bottom: 16px; }
.dba-guide-faq__answer p { margin: 0; }
.dba-guide-image-review { display: grid; gap: 4px; margin-top: 16px; padding: 16px 20px; border: 1px solid var(--dba-rule); border-radius: 10px; background: var(--dba-mist); font-size: .875rem; }
.dba-guide-image-review--needs_review { border-left: 3px solid var(--dba-warning); }
.dba-guide-image-review p { margin: 4px 0 0; color: var(--dba-muted); }
.dba-guide-sources { margin: 16px 0 0; padding-left: 1.35em; }
.dba-guide-sources li + li { margin-top: 8px; }
.dba-guide-sources a { display: inline-flex; align-items: center; min-height: 32px; }

/* Tags and selected related articles */
.dba-guide-block { margin-top: 56px; padding-top: 56px; border-top: 1px solid var(--dba-rule); }
.dba-guide-block h2 { margin: 0 0 16px; font-size: clamp(1.375rem, 1.1rem + 1.1vw, 1.625rem); line-height: 1.3; }
.dba-guide-tags { display: flex; flex-wrap: wrap; gap: 14px 8px; margin: 0; padding: 0; list-style: none; }
.dba-guide-tags a { position: relative; display: inline-flex; align-items: center; min-height: 32px; padding: 6px 10px; border-radius: 6px; background: var(--dba-blue-soft); color: var(--dba-ink); font-size: .875rem; font-weight: 650; text-decoration: none; }
.dba-guide-tags a:hover { color: var(--dba-blue-deep); box-shadow: inset 0 0 0 1px var(--dba-blue); background: var(--dba-paper); }
.dba-guide-related { margin: 0; padding: 0; list-style: none; }
.dba-guide-related li + li { border-top: 1px solid var(--dba-rule); }
.dba-guide-related a { display: block; padding: 16px 0; text-decoration: none; }
.dba-guide-related span { display: block; color: var(--dba-blue); font-family: var(--dba-display); font-weight: 650; line-height: 1.5; }
.dba-guide-related a:hover span { color: var(--dba-blue-deep); text-decoration: underline; }
.dba-guide-related small { display: block; margin-top: 4px; color: var(--dba-muted); font-size: .875rem; }

/* Support path */
.dba-guide-support { margin-top: 56px; padding: 24px; border: 1px solid var(--dba-rule); border-radius: 10px; background: var(--dba-blue-soft); }
.dba-guide-support h2 { margin: 0; font-size: clamp(1.375rem, 1.1rem + 1.1vw, 1.625rem); line-height: 1.3; }
.dba-guide-support > p { margin: 8px 0 0; }
.dba-guide-support__ask { margin-top: 24px; }
.dba-guide-support h3 { margin: 0 0 8px; font-size: 1.125rem; }
.dba-guide-support pre { margin: 0 0 16px; padding: 16px; border: 1px solid var(--dba-rule); border-radius: 6px; background: var(--dba-mist); color: var(--dba-ink); font-family: var(--dba-mono); font-size: .9375rem; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.dba-guide-support__task { margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--dba-rule); color: var(--dba-muted); font-size: .875rem; }
.dba-guide-support__task p, .dba-guide-copy-status { margin: 0; }
.dba-guide-copy-status { min-height: 1.5em; margin-top: 8px; color: var(--dba-blue-deep); font-size: .875rem; font-weight: 650; }

/* Library cards use the same reading column and flat separation. */
.dba-guide-library__head { padding-bottom: 24px; border-bottom: 1px solid var(--dba-rule); }
.dba-guide-eyebrow { margin: 0 0 8px; color: var(--dba-blue-deep); font-family: var(--dba-display); font-size: .875rem; font-weight: 700; }
.dba-guide-library__head h1 { margin: 0; font-size: clamp(1.75rem, 1.1rem + 2.6vw, 2.375rem); line-height: 1.2; letter-spacing: -.03em; }
.dba-guide-library__description { margin-top: 16px; color: var(--dba-muted); }
.dba-guide-library__description p { margin: 0; }
.dba-guide-library__finder { margin-top: 24px; padding: 20px; border: 1px solid var(--dba-rule); border-left: 3px solid var(--dba-blue); border-radius: 12px; background: linear-gradient(135deg, var(--dba-paper) 0%, var(--dba-mist) 100%); }
.dba-guide-library__finder-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.dba-guide-library__finder-head h2 { margin: 2px 0 0; font-size: 1.0625rem; line-height: 1.4; }
.dba-guide-library__finder-head > p, .dba-guide-library__finder-kicker { margin: 0; color: var(--dba-muted); font-size: .8125rem; }
.dba-guide-library__finder-kicker { color: var(--dba-blue-deep); font-weight: 700; letter-spacing: .04em; }
.dba-guide-library__finder-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; margin-top: 16px; }
.dba-guide-library__finder-search .dba-guide-button { min-width: 88px; }
.dba-guide-library__quick-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.dba-guide-library__quick-filters a { display: inline-flex; align-items: center; min-height: 36px; border: 1px solid var(--dba-rule); border-radius: 999px; padding: 6px 12px; background: var(--dba-paper); color: var(--dba-muted); font-family: var(--dba-display); font-size: .8125rem; font-weight: 650; line-height: 1.35; text-decoration: none; transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease; }
.dba-guide-library__quick-filters a:hover { border-color: var(--dba-blue); background: var(--dba-blue-soft); color: var(--dba-blue-deep); }
.dba-guide-library__quick-filters a[aria-current="page"] { border-color: var(--dba-blue); background: var(--dba-blue); color: var(--dba-paper); }
.dba-guide-library__search-results { margin-top: 32px; }
.dba-guide-library__search-results > h2 { margin: 0; font-size: clamp(1.375rem, 1.1rem + 1.1vw, 1.625rem); line-height: 1.3; }
.dba-guide-library__search-summary { margin: 8px 0 0; color: var(--dba-muted); font-size: .875rem; }
.dba-guide-library__list { margin: 32px 0 0; padding: 0; list-style: none; }
.dba-guide-library__list li + li { border-top: 1px solid var(--dba-rule); }
.dba-guide-library__list article { padding: 24px 0; }
.dba-guide-library__list p { margin: 0 0 4px; color: var(--dba-muted); font-size: .875rem; }
.dba-guide-library__list :is(h2, h3) { margin: 0; font-size: 1.125rem; line-height: 1.4; }
.dba-guide-library__list :is(h2, h3) a { text-decoration: none; }
.dba-guide-library__list :is(h2, h3) a:hover { text-decoration: underline; }
.dba-guide-library__list :is(h2, h3) + div { margin-top: 8px; color: var(--dba-muted); }
.dba-guide-empty { margin: 32px 0 0; color: var(--dba-muted); }
.dba-guide-pagination { margin-top: 40px; }
.dba-guide-pagination ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.dba-guide-pagination a, .dba-guide-pagination span { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; border: 1px solid var(--dba-rule); border-radius: 6px; padding: 6px 10px; text-decoration: none; }
.dba-guide-pagination .current { border-color: var(--dba-blue); background: var(--dba-blue-soft); color: var(--dba-blue-deep); }

@media (max-width: 1023px) {
	.dba-guide-layout { display: block; padding-top: 32px; }
	.dba-guide-main { max-width: var(--dba-article); margin-inline: auto; }
	.dba-guide-rail { position: static; max-height: none; overflow: visible; margin-bottom: 32px; padding: 0 0 24px; border-bottom: 1px solid var(--dba-rule); }
	.dba-guide-controls { position: sticky; top: 0; z-index: 10; display: flex; gap: 8px; margin: 24px 0 8px; padding: 10px 0; background: var(--dba-paper); }
	.dba-guide-library__finder { display: none; }
	.dba-guide-controls + .dba-guide-toc { margin-top: 16px; }
	.dba-guide-shell[data-dba-enhanced="true"] .dba-guide-rail { position: fixed; inset: 96px 16px auto; z-index: 20; max-height: min(60vh, 480px); overflow-y: auto; margin: 0; padding: 16px; border: 1px solid var(--dba-rule); border-radius: 10px; background: var(--dba-paper); box-shadow: 0 8px 28px rgba(16,17,20,.16); }
	.dba-guide-shell[data-dba-enhanced="true"] .dba-guide-rail__close { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 44px; min-height: 44px; margin: -8px -8px -8px 0; border: 0; border-radius: 8px; background: transparent; color: var(--dba-ink); font-size: 2rem; font-weight: 400; line-height: 1; cursor: pointer; }
	.dba-guide-shell[data-dba-enhanced="true"] .dba-guide-rail__close:hover { background: var(--dba-blue-soft); color: var(--dba-blue-deep); }
	.dba-guide-shell[data-dba-enhanced="true"] .dba-guide-rail__backdrop { position: fixed; inset: 0; z-index: 19; display: block; border: 0; background: rgba(16,17,20,.24); cursor: default; }
	.dba-guide-shell[data-dba-enhanced="true"] .dba-guide-rail[hidden], .dba-guide-shell[data-dba-enhanced="true"] .dba-guide-toc[hidden] { display: none; }
}
@media (max-width: 767px) {
	.dba-guide-shell { --dba-pad: 20px; padding-bottom: 32px; }
	.dba-guide-breadcrumb { padding-top: 16px; }
	.dba-guide-layout { padding-top: 24px; }
	.dba-guide-meta__action { flex-basis: 100%; margin-inline-start: 0; }
	.dba-guide-button--secondary { width: 100%; }
	.dba-guide-callout, .dba-guide-support { padding: 16px; }
	.dba-guide-block { margin-top: 40px; padding-top: 40px; }
}
@media (prefers-reduced-motion: reduce) { .dba-guide-shell *, .dba-guide-shell *::before, .dba-guide-shell *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }
@media print { .dba-guide-context, .dba-guide-breadcrumb, .dba-guide-rail, .dba-guide-controls, .dba-guide-library__finder, .dba-guide-toc, .dba-guide-support { display: none !important; } .dba-guide-layout { display: block; padding: 0; } .dba-guide-article { max-width: none; } }
