/* Article layout; loaded after Prism to keep its syntax engine and restyle its output. */
.article-hero { padding-top: 30px; }
.article-breadcrumbs { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; font-size: 13px; }
.article-breadcrumbs a { text-decoration: none; }
.article-category-links { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.article-category-links a { text-decoration: none; }
.article-category-links a:hover { text-decoration: underline; }
.article-reading-column { min-width: 0; max-width: 900px; }
.article-layout.has-article-sidebar { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 44px; align-items: start; }
.article-lead { font-size: 18px; line-height: 1.8; background: #f4faf8; border-left: 4px solid #00a066; padding: 22px 26px; margin-bottom: 34px; border-radius: 0 5px 5px 0; overflow-wrap: anywhere; }
.article-lead > :last-child { margin-bottom: 0; }
.article-content { width: 100%; min-width: 0; max-width: none; }
.article-content > :first-child { margin-top: 0; }
.article-content :is(h2,h3,h4) { scroll-margin-top: 12px; }
.article-sidebar { position: sticky; top: calc(var(--itkb-header-height) + 26px); max-height: calc(100dvh - var(--itkb-header-height) - 48px); overflow-y: auto; padding: 0 6px 6px 26px; border-left: 1px solid var(--itkb-border); min-width: 0; }
.article-sidebar .page-toc-heading, .itkb-site .article-resource-section h2 { font-size: 19px; font-weight: 700; line-height: 1.4; margin: 0 0 16px; }
.article-sidebar .page-toc ul { margin-top: 12px; }
.article-toc + .article-resources { border-top: 1px solid var(--itkb-border); margin-top: 28px; padding-top: 26px; }
.article-resource-section + .article-resource-section { margin-top: 28px; }
.article-resource-section ul { list-style: none; padding: 0; margin: 0; }
.article-resource-section li { padding: 11px 0; border-bottom: 1px solid var(--itkb-border); overflow-wrap: anywhere; }
.article-resource-section li:first-child { padding-top: 0; }
.article-resource-section a { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; text-decoration: none; line-height: 1.6; }
.article-resource-section a:hover { text-decoration: underline; }
.article-resource-section a span:first-child { min-width: 0; }
.article-resource-section small { display: block; font-size: 12px; margin-top: 5px; }
.article-back { margin: 36px 0 0; font-size: 14px; }
.article-back a { text-decoration: none; }
.article-content .captionImage, .article-content figure { max-width: 100%; margin: 24px 0; }
.article-content .caption { color: var(--itkb-text); font-size: 13px; line-height: 1.6; margin-top: 8px; }
.article-content table { border-collapse: collapse; margin: 24px 0; font-size: 15px; }
.article-content th { color: var(--itkb-ink); background: #f0f6fc; }
.article-content :is(td,th) { padding: 10px 12px; border: 1px solid var(--itkb-border); }
.article-content :not(pre) > code { background: #edf3f8; color: #143f69; border-radius: 3px; padding: 2px 5px; }
/* Prism toolbars stay outside the scrollable pre, so the copy control is always reachable. */
.KnowledgeOne .article-content div.code-toolbar { display: flex; flex-direction: column; min-width: 0; max-width: 100%; margin: 24px 0; background: #10243c; border: 1px solid #213e5c; border-radius: 5px; overflow: hidden; }
.KnowledgeOne .article-content div.code-toolbar > .toolbar { position: static; order: -1; opacity: 1; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 9px 14px; background: #1b3857; border-bottom: 1px solid #2c4a69; transition: none; }
.KnowledgeOne .article-content .toolbar-item:first-child { margin-right: auto; min-width: 0; }
.KnowledgeOne .article-content div.code-toolbar > .toolbar > .toolbar-item > :is(a,button,span) { display: block; font: inherit; font-size: 12px; color: #f0f6ff; background: transparent; box-shadow: none; border: 0; border-radius: 3px; line-height: 1.5; padding: 3px 5px; overflow-wrap: anywhere; }
.KnowledgeOne .article-content div.code-toolbar > .toolbar > .toolbar-item > :is(button,a) { cursor: pointer; border: 1px solid #56728e; }
.KnowledgeOne .article-content div.code-toolbar > .toolbar > .toolbar-item > :is(button,a):hover { background: #2a4a6a; color: #fff; }
.KnowledgeOne .article-content :is(pre[class*="language-"],code[class*="language-"]) { color: #edf4ff; text-shadow: none; background: #10243c; font-family: Consolas, "Liberation Mono", Menlo, monospace; font-size: 14px; line-height: 1.7; white-space: pre; overflow-wrap: normal; word-break: normal; }
.KnowledgeOne .article-content pre[class*="language-"] { width: 100%; max-width: 100%; min-width: 0; padding: 18px 20px; margin: 0; overflow-x: auto; }
.KnowledgeOne .article-content pre.line-numbers { padding-left: 3.8em; }
.KnowledgeOne .article-content pre > code { display: block; padding: 0; }
.KnowledgeOne .article-content .line-numbers-rows { border-color: #36506c; }
.KnowledgeOne .article-content .line-numbers-rows > span::before { color: #9bacc0; }
.KnowledgeOne .article-content .token:is(.comment,.prolog,.doctype,.cdata) { color: #a7b8ca; }
.KnowledgeOne .article-content .token.punctuation { color: #dbe9f7; }
.KnowledgeOne .article-content .token:is(.property,.tag,.constant,.symbol,.deleted,.boolean,.number) { color: #ffb7b9; }
.KnowledgeOne .article-content .token:is(.selector,.attr-name,.string,.char,.builtin,.inserted) { color: #9be3ab; }
.KnowledgeOne .article-content .token:is(.operator,.entity,.url) { color: #d8e8f7; background: transparent; }
.KnowledgeOne .article-content .token:is(.atrule,.attr-value,.keyword) { color: #77d6fa; }
.KnowledgeOne .article-content .token:is(.function,.class-name) { color: #f7d695; }
.KnowledgeOne .article-content .token:is(.regex,.important,.variable) { color: #f2d285; }
.KnowledgeOne .article-content .toolbar-item button[data-copy-state="copy-success"] { color: #b1f3ca; }
.KnowledgeOne .article-content .toolbar-item button[data-copy-state="copy-error"] { color: #ffcece; }
.KnowledgeOne .article-content .code-toolbar :focus-visible { outline: 2px solid #a9d8ff; outline-offset: 1px; }
@media (max-width: 991px) and (min-width: 768px) {
 .article-layout.has-article-sidebar { grid-template-columns: minmax(0, 1fr) 220px; gap: 28px; }
 .article-sidebar { padding-left: 20px; }
}
@media (max-width: 767px) {
 .article-breadcrumbs { margin-bottom: 14px; }
 .article-hero { padding-top: 24px; }
 .article-layout.has-article-sidebar, .article-layout { display: flex; flex-direction: column; gap: 0; }
 .article-reading-column, .article-sidebar { display: contents; }
 .article-lead { order: 1; padding: 18px 20px; font-size: 17px; margin-bottom: 26px; width: 100%; }
 .article-toc { order: 2; width: 100%; border: 1px solid var(--itkb-border); background: #f6faff; border-radius: 5px; padding: 16px 18px; margin-bottom: 28px; }
 .article-content { order: 3; }
 .article-resources, .article-toc + .article-resources { order: 4; width: 100%; border-top: 1px solid var(--itkb-border); margin-top: 30px; padding-top: 26px; }
 .article-content h2 { font-size: 25px; }
 .KnowledgeOne .article-content :is(pre[class*="language-"],code[class*="language-"]) { font-size: 13px; }
}