/* ==========================================================================
   PBXB64 Help — Unified Skin "PBXB64 Dark" v2
   --------------------------------------------------------------------------
   One stylesheet for every generated help page, all languages.
   Design constraints:
   - Must render correctly inside the Windows HTML Help (CHM) viewer, whose
     engine is legacy IE: NO flexbox/grid/sticky/custom-properties reliance.
     Modern enhancements are layered so they degrade gracefully.
   - High contrast, readable at 100% zoom, printable (print = light theme).
   Palette (keep in sync when theming):
     bg        #181818   panel #101010   raised #252525
     text      #f0f0f0   muted #9aa0a6
     accent    #4ec9b0   accent-hi #5df0d0   link #7ecbff   link-hi #aaddff
     ok        #4CAF50   warn  #ff9800       danger #ff6b6b violet #d4aaff
   ========================================================================== */

/* ----- base ------------------------------------------------------------- */
body {
    font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
    font-size: 11pt;
    line-height: 1.6;
    color: #f0f0f0;
    background: #181818;
    margin: 0;
    padding: 0 32px 24px 32px;
}
@media screen and (min-width: 900px) {
    body { max-width: 1100px; }
}

h1 {
    color: #5df0d0;
    border-bottom: 2px solid #4ec9b0;
    padding-bottom: 10px;
    font-size: 20pt;
    font-weight: 600;
    margin: 18px 0 10px 0;
}
h2 {
    color: #5df0d0;
    margin: 30px 0 8px 0;
    border-bottom: 1px solid #4ec9b0;
    padding-bottom: 5px;
    font-size: 15pt;
    font-weight: 600;
}
h3 { color: #aaddff; margin: 22px 0 6px 0; font-size: 12.5pt; font-weight: 600; }
h4 { color: #d4aaff; margin: 18px 0 4px 0; font-size: 11.5pt; font-weight: 600; }

p  { margin: 10px 0; }
ul, ol { margin: 10px 0; padding-left: 24px; }
li { margin: 5px 0; }
strong, b { color: #ffffff; font-weight: 700; }
em, i { color: #d4d4d4; }
hr { border: 0; height: 1px; background: #3a3a3a; margin: 24px 0; }
dt { color: #9cdcfe; font-weight: 600; margin-top: 10px; }
dd { color: #f0f0f0; margin-left: 24px; margin-bottom: 8px; }

/* ----- links ------------------------------------------------------------ */
a { color: #7ecbff; text-decoration: none; font-weight: 500; }
a:hover { text-decoration: underline; color: #aaddff; }
a:focus { outline: 2px solid #5df0d0; outline-offset: 1px; }

/* ----- code ------------------------------------------------------------- */
code {
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
    background: #2a2a2a;
    padding: 2px 6px;
    border-radius: 4px;
    color: #ffffff;
    font-size: 10pt;
    border: 1px solid #3a3a3a;
}
pre {
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
    background: #101010;
    padding: 14px 16px;
    border-left: 4px solid #4ec9b0;
    border-radius: 0 6px 6px 0;
    overflow-x: auto;
    color: #ffffff;
    font-size: 10pt;
    line-height: 1.45;
    margin: 14px 0;
    white-space: pre;
}
pre code { background: transparent; border: none; padding: 0; }
pre.syntax {
    background: #142a2a;
    border: 1px solid #4ec9b0;
    border-radius: 6px;
}
/* inline syntax token colors (used by the generator, optional) */
.tok-kw  { color: #5df0d0; font-weight: 600; }   /* keywords      */
.tok-str { color: #ffb86c; }                     /* string liter. */
.tok-num { color: #d4aaff; }                     /* numbers       */
.tok-com { color: #6a9955; font-style: italic; } /* comments      */

/* ----- callouts --------------------------------------------------------- */
.note, .warn, .ok, .callout {
    padding: 12px 16px;
    margin: 16px 0;
    border-radius: 0 6px 6px 0;
    border-left: 4px solid #4ec9b0;
    background: #142a2a;
    color: #f0f0f0;
}
.warn, .callout-warning { border-left-color: #ff9800; background: #2a1818; }
.ok,   .callout-tip     { border-left-color: #4CAF50; background: #142414; }
.callout-note           { border-left-color: #aaddff; background: #1a2230; }

/* ----- tables ----------------------------------------------------------- */
table {
    border-collapse: collapse;
    width: 100%;
    margin: 14px 0;
    font-size: 10.5pt;
}
th {
    background: #2d2d2d;
    color: #5df0d0;
    padding: 8px 12px;
    text-align: left;
    border: 1px solid #4a4a4a;
    font-weight: 700;
}
td {
    padding: 6px 12px;
    border: 1px solid #4a4a4a;
    color: #f0f0f0;
    vertical-align: top;
}
tr:nth-child(even) { background: #222222; }
tr:nth-child(odd)  { background: #181818; }

/* ----- status pills ----------------------------------------------------- */
.pill {
    display: inline-block;
    background: #4ec9b0;
    color: #101010;
    padding: 2px 10px;
    border-radius: 12px;
    font-size: 8.5pt;
    margin-right: 5px;
    font-weight: 700;
}
.pill-ok    { background: #4CAF50; color: #ffffff; }
.pill-new   { background: #c97eb8; color: #101010; }
.pill-warn  { background: #6a4a00; color: #ffd700; }
.pill-stub  { background: #4a0000; color: #ff8080; }

/* ----- lists ------------------------------------------------------------ */
ul.tight { margin: 6px 0; padding-left: 18px; }
ul.tight li { margin: 2px 0; font-size: 10pt; }
ul.cols { column-count: 2; column-gap: 32px; }
ul.cols li { break-inside: avoid; }

/* ----- command index cards (chapter landing pages) ---------------------- */
.cmd-grid { margin: 12px 0; }
.cmd-item {
    display: inline-block;             /* inline-block: IE-safe "grid" */
    width: 220px;
    background: #252525;
    border: 1px solid #3a3a3a;
    padding: 5px 10px;
    margin: 0 8px 8px 0;
    border-radius: 4px;
    font-family: 'Consolas', monospace;
    font-size: 9.5pt;
    color: #f0f0f0;
    vertical-align: top;
}
.cmd-item a { color: #f0f0f0; }
.cmd-item a:hover { color: #5df0d0; }

/* ----- page chrome: header / breadcrumb / footer ------------------------ */
.pb-header {
    background: #1e1e1e;
    border-bottom: 1px solid #4ec9b0;
    padding: 8px 16px;
    margin: 0 -32px 16px -32px;
    font-size: 10pt;
    overflow: hidden;                  /* float containment, IE-safe */
}
.pb-breadcrumb { color: #9aa0a6; float: left; }
.pb-breadcrumb a { color: #5df0d0; text-decoration: none; }
.pb-breadcrumb a:hover { text-decoration: underline; }
.pb-brand {
    float: right;
    color: #4ec9b0;
    font-weight: 600;
    font-size: 9pt;
    letter-spacing: 0.5px;
}
.pb-meta { color: #9aa0a6; font-size: 10pt; margin: 6px 0 0 0; }
.pb-meta b { color: #d4d4d4; }

.pb-footer {
    border-top: 1px solid #3a3a3a;
    margin-top: 32px;
    padding: 12px 0;
    font-size: 10pt;
    overflow: hidden;                  /* float containment */
}
.pb-prev, .pb-next {
    color: #5df0d0;
    text-decoration: none;
    padding: 4px 12px;
    border: 1px solid #4ec9b0;
    border-radius: 4px;
}
.pb-prev { float: left; }
.pb-next { float: right; }
.pb-prev:hover, .pb-next:hover { background: #2a3a3a; }
.pb-totop {
    display: block;
    text-align: center;
    color: #9aa0a6;
    text-decoration: none;
    font-size: 9pt;
}
.pb-disabled { color: #555; border-color: #333; }

/* ----- LOGO frontend figures -------------------------------------------- */
.logo-frontend-figure { margin: 16px 0 20px 0; }
.logo-frontend-figure img {
    display: block;
    max-width: 100%;
    height: auto;
    border: 1px solid #3a3a3a;
    border-radius: 6px;
}

/* ----- generated reference diagrams ------------------------------------- */
.pb-diagram {
    margin: 20px 0;
    padding: 14px;
    background: #1e1e1e;
    border: 1px solid #3a3a3a;
    border-radius: 6px;
    text-align: center;
}
.pb-diagram img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    border: 1px solid #4a4a4a;
    border-radius: 4px;
}
.pb-caption {
    margin: 10px 0 0 0;
    font-size: 10pt;
    color: #9aa0a6;
    font-style: italic;
    text-align: center;
}

/* ----- utility ---------------------------------------------------------- */
center, .center { text-align: center; }
.right { text-align: right; }
.muted { color: #9aa0a6; }

/* ----- print: light theme ------------------------------------------------ */
@media print {
    body { background: #ffffff; color: #000000; max-width: none; }
    h1, h2 { color: #00564a; border-color: #00564a; }
    h3 { color: #004d80; }
    h4 { color: #5a2d82; }
    a { color: #004d80; }
    code { background: #f0f0f0; color: #000000; border-color: #cccccc; }
    pre { background: #f5f5f5; color: #000000; border-left-color: #00564a; }
    th { background: #e0e0e0; color: #00564a; border-color: #999999; }
    td { border-color: #999999; color: #000000; }
    tr:nth-child(even), tr:nth-child(odd) { background: #ffffff; }
    .pb-header, .pb-footer { display: none; }
    .note, .warn, .ok, .callout { background: #f5f5f5; color: #000000; }
}
