/* BEGIN custom-styles - generated from custom-styles/*.css, do not edit here directly */
/* --- custom-styles/headers.css --- */
:root {
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
    font-size: 12pt;
}

h1,h2,h3,h4 {
    font-style: normal;
    font-weight: 500;
    color: rgb(23, 43, 77)
}

#title-heading {
    padding-bottom: 0;
    border-bottom: 1px solid #919699;
}

/* --- custom-styles/images.css --- */
/* Caps the height of images embedded in page content (Confluence wraps
   these in <span class="confluence-embedded-file-wrapper ...">, regardless
   of alignment/manual-size modifier classes) so a single large screenshot
   doesn't dominate the page, and hints that clicking opens it full-size
   (see custom-scripts/lightbox.js). Width is left auto so aspect ratio is
   preserved - only height is constrained. */
.confluence-embedded-file-wrapper img {
    max-width: 480px;
    max-height: 320px;
    width: auto;
    height: auto;
    cursor: zoom-in;
}

/* Images inside table cells get a smaller cap - table rows are already
   height-constrained by their neighboring cells, so the same limit used
   for regular paragraph content is usually too tall there. */
table.confluenceTable .confluence-embedded-file-wrapper img {
    max-height: 200px;
    max-width: 200px;
}

.image-lightbox-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.85);
    align-items: center;
    justify-content: center;
    z-index: 9999;
    cursor: zoom-out;
}

.image-lightbox-overlay.open {
    display: flex;
}

.image-lightbox-overlay img {
    max-width: 90vw;
    max-height: 90vh;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.5);
    cursor: zoom-out;
}

/* --- custom-styles/layout.css --- */
img {
    margin: auto;
    border: 1px solid #919699;
    border-radius: 4px;
}

body {
    margin: 0;
    margin-bottom: 320px;
}

.image-center-wrapper {
    display: flex;
    flex-direction: column;
}
#page {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 24px;
}

@media (min-width: 2560px) {
    #page {
        max-width: 1440px;
    }
}

/* --- custom-styles/panels.css --- */
/* Confluence's "info" macro panel and code/preformatted panel macro used
   to get their box styling (border, background, padding) from the base
   stylesheet, which is now fully discarded (see
   scripts/strip-base-stylesheet.py) - without this, these render as plain
   undecorated text, indistinguishable from regular paragraphs. Only the
   "information" (blue) variant of the info macro currently appears in
   this export, but the icon-less base rule covers any other variant
   Confluence might use later too. */
.confluence-information-macro {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 1em 0;
    padding: 10px 12px;
    border-radius: 4px;
    background: #F4F5F7;
    border: 1px solid #C1C7D0;
}

.confluence-information-macro-information {
    background: #DEEBFF;
    border-color: #4C9AFF;
}

/* The icon font this used to render (aui-iconfont-*) was never actually
   loaded even in the original export (no @font-face anywhere) - hiding
   the empty glyph slot is less confusing than a broken-icon-shaped gap. */
.confluence-information-macro-icon {
    display: none;
}

.confluence-information-macro-body p:last-child {
    margin-bottom: 0;
}

.code.panel {
    margin: 1em 0;
    border: 1px solid #C1C7D0;
    border-radius: 4px;
    overflow: hidden;
}

.codeHeader.panelHeader {
    padding: 6px 12px;
    background: #F4F5F7;
    border-bottom: 1px solid #C1C7D0;
    font-weight: 600;
}

.codeContent.panelContent {
    padding: 12px;
    overflow-x: auto;
}

.syntaxhighlighter-pre {
    margin: 0;
    font-family: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 13px;
    white-space: pre;
}

/* --- custom-styles/rui-text-box.css --- */
.rui_text_box {
    padding: 12px 24px;
    border-radius: 4px;
}

.rui_text_box[data-type="info"] {
    color: #3f484a;
    background-color: #e6f7fa;
}
.rui_text_box[data-color="light-blue"] {
    color: #3f484a;
    background-color: #e6f7fa;
}
.rui_text_box[data-color="light-green"] {
    color: #0c2713;
    background-color: #e7f3e7;
}
.rui_text_box[data-type="warning"] {
    color: #6a2a2c;
    background-color: #f5eaec;
}
.rui_text_box > * {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

/* --- custom-styles/rwui-buttons.css --- */
.rwui_button {
    background-color: #71b0e0;
    display: inline-block;
    padding: 0.25rem 1rem;
    border-radius: 4px;
    text-decoration: none;
    color: white;
}

.rwui_button span {
    text-decoration: none;
}

.aui-button {
    background-color: #71b0e0;
    color: white !important;
    display: inline-block;
    padding: 0.25rem 1rem;
    border-radius: 4px;
    text-decoration: none;
}
.rwui_button:hover {
    background-color: #60a6dc !important;
    color: white;
    text-decoration: none;
}
.aui-button:hover {
    background-color: #60a6dc !important;
}

[class^="aura-button"] {
    background-color: #71b0e0;
    color: white !important;
    display: inline-block;
    padding: 0.25rem 1rem;
    border-radius: 4px;
    text-decoration: none;
}

[class^="aura-button"]:hover {
    background-color: #60a6dc !important;
}

/* --- custom-styles/rwui-steps.css --- */
.rwui_steps {
    border: 1px solid #919699;
    padding: 0 24px ;
    border-radius: 4px;
    counter-reset: section;
}
.rwui_item_content {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
}

.rwui_item_content::before {
    flex: 0 0 auto;
    font-size: 14pt;
    margin-right: 14px;
    counter-increment: section;
    content: counter(section) ". ";
}
.rwui_item_content > p:nth-child(n+2) {
    flex: 0 0 100%;
}

.rwui_step:nth-last-child(n+2) {
    border-bottom: 1px solid #919699;
}

/* --- custom-styles/search.css --- */
#site-search {
    position: relative;
    max-width: 400px;
    margin: 0 0 16px 0;
}

#site-search-input {
    width: 100%;
    box-sizing: border-box;
    margin-top: 12px;
    padding: 8px 12px;
    font-size: 14px;
    border: 1px solid #919699;
    border-radius: 4px;
}

#site-search-input:disabled {
    background: #f4f5f7;
    color: #6b778c;
}

#site-search-results {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1000;
    margin-top: 4px;
    max-height: 640px;
    overflow-y: auto;
    background: #ffffff;
    border: 1px solid #919699;
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

#site-search-results.open {
    display: block;
}

.site-search-result {
    display: block;
    padding: 8px 12px;
    text-decoration: none;
    color: #172b4d;
    border-bottom: 1px solid #f4f5f7;
}

.site-search-result:last-child {
    border-bottom: none;
}

.site-search-result:hover {
    background: #f4f5f7;
}

.site-search-result-snippet {
    margin-top: 2px;
    font-size: 12px;
    color: #172b4d;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.site-search-result-snippet mark {
    background: transparent;
    font-weight: bold;
    color: inherit;
}

/* --- custom-styles/sidebar-layout.css --- */
/* Populated by custom-scripts/sidebar-layout.js above the 2000px viewport
   breakpoint - stays hidden and empty below it, where #site-search,
   #breadcrumb-section, .toc-macro and .toc-list stay in their normal
   inline position at the top of the page. */
#page-sidebar {
    position: fixed;
    top: 24px;
    left: 24px;
    width: 16%;
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    overflow-x: visible;
    z-index: 100;
}

#page-sidebar:empty {
    display: none;
}

#page-sidebar > * {
    margin-bottom: 16px;
}

/* --- custom-styles/tables.css --- */
/* Custom table styling for exported Confluence pages.
   The exported styles/site.css has no layout rules for tables at all (only
   heading text-color rules), and the "highlight-#xxxxxx" cell classes used
   for colored header/emphasis cells don't correspond to any real CSS rule
   in the export, so authored cell shading was silently invisible. This
   restores both, using the data-highlight-colour attribute (whose value is
   the actual color) rather than guessing Confluence's internal palette. */

html {
    color-scheme: light;
}

.table-wrap {
    overflow-x:visible;
    max-width: 100%;
    margin: 1em 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

table.confluenceTable {
    border-collapse: collapse;
    border: 1px solid var(--ds-border, #C1C7D0);
}

table.confluenceTable th.confluenceTh,
table.confluenceTable td.confluenceTd {
    border: 1px solid var(--ds-border, #C1C7D0);
    padding: 8px 12px;
    text-align: left;
    vertical-align: top;
}

table.confluenceTable th.confluenceTh {
    background: var(--ds-background-neutral, #F4F5F7);
    font-weight: 600;
}

[data-highlight-colour="#b3d4ff"] { background-color: #b3d4ff; }
[data-highlight-colour="#deebff"] { background-color: #deebff; }
[data-highlight-colour="#e6fcff"] { background-color: #e6fcff; }
[data-highlight-colour="#f4f5f7"] { background-color: #f4f5f7; }
[data-highlight-colour="#fff0b3"] { background-color: #fff0b3; }
[data-highlight-colour="grey"]    { background-color: #ebecf0; }

/* --- custom-styles/toc-macro.css --- */
.toc-macro {
    font-size: 12pt;
}

a {
	
    color: #3b73af;
    text-decoration: none;
}
a:hover {
    color: #3b73af;
    text-decoration: underline;
}



.toc-item a {
    text-decoration: none;
    color: #3b73af;
}

.toc-item a:hover {
    text-decoration: underline;
    color: #3b73af;
}

.toc-macro a {
    text-decoration: none;
    color: #3b73af !important;
}
.toc-macro a:hover {
    text-decoration: underline;
    color: #3b73af;
}

.toc-list:first-child,
#breadcrumbs:first-child {
    padding-left: 0;
    margin-top: 32px;
}

.toc-list,
#breadcrumbs {
    padding-left: 16px;
    list-style-type: none;
}
/* END custom-styles */