/* Bordered "logbox" wrapper for collapsible long log / command output
 * rollups.
 *
 * Pattern (in rST):
 *
 *     .. only:: html
 *
 *        .. raw:: html
 *
 *           <div class="logbox"><details>
 *           <summary>VEK385 OSPI+UFS boot log</summary>
 *
 *        .. literalinclude:: downloads/Vek385_RevB_OSPI+UFS_HW_boot.log
 *           :language: console
 *
 *        .. raw:: html
 *
 *           </details></div>
 *
 *     :download:`Download Vek385_RevB_OSPI+UFS_HW_boot.log
 *     <downloads/Vek385_RevB_OSPI+UFS_HW_boot.log>`
 *
 * The ``:download:`` paragraph that immediately follows the rollup is
 * relocated into the summary row at page load by ``logbox.js``, so
 * each rollup renders as a single bordered box with the title on the
 * left of the summary row and a compact ``Download`` link on the
 * right.  Rollups that have no sibling ``:download:`` paragraph
 * (e.g. inline command output) just render without the right-hand
 * link.
 */

.rst-content .logbox {
    border: 1px solid #1f2937;
    border-radius: 6px;
    background: #111827;
    margin: 0 0 24px 0;
    overflow: hidden;
}

/* Pull the rollup tight against the lead-in paragraph immediately
 * above it.  rtd-theme paragraphs carry 24px bottom margin, which
 * leaves an obvious gap between the lead-in sentence ("Booting
 * VEK385 using OSPI + UFS boot mode:") and the box.  Collapse that
 * gap to a small visual breath so the two read as one unit. */
.rst-content p + .logbox {
    margin-top: -16px;
}

.rst-content .logbox > details {
    margin: 0;
}

.rst-content .logbox > details > summary {
    cursor: pointer;
    padding: 8px 12px;
    font-weight: 600;
    color: #f9fafb;
    list-style: none;
    background: #1f2937;
    /* Use flex so the inserted ``.dl`` span (see logbox.js) can sit
       at the right edge of the summary row. */
    display: flex;
    align-items: center;
}

.rst-content .logbox > details[open] > summary {
    border-bottom: 1px solid #374151;
}

.rst-content .logbox > details > summary::-webkit-details-marker {
    display: none;
}

.rst-content .logbox > details > summary::before {
    content: "\25B8";
    display: inline-block;
    width: 1em;
    color: #67e8f9;
}

.rst-content .logbox > details[open] > summary::before {
    content: "\25BE";
    color: #67e8f9;
}

/* The summary's literal text is just the title (e.g. ``VEK385
 * OSPI+UFS boot log``).  The "click to expand" / "click to roll up"
 * hint is appended by CSS so it can switch based on open state.
 *
 * The title text is wrapped in a ``<span class="label">`` either by
 * the rST source (when the author cares about the markup) or by
 * ``logbox.js`` at page load (when the rST simply contains plain
 * text inside ``<summary>``).  Either way the hint is appended
 * after the label. */
.rst-content .logbox > details > summary > .label {
    flex: 1;
    color: #f9fafb;
}

.rst-content .logbox > details > summary > .label::after {
    content: " (click to expand)";
    font-weight: 400;
    color: #9ca3af;
}

.rst-content .logbox > details[open] > summary > .label::after {
    content: " (click to roll up)";
}

/* The download link relocated into the summary row by logbox.js.
 * Renders as a compact, lighter-weight, right-aligned affordance. */
.rst-content .logbox > details > summary > .dl {
    flex: 0 0 auto;
    margin-left: 16px;
}

.rst-content .logbox > details > summary > .dl a {
    color: #67e8f9;
    text-decoration: none;
    font-size: 1.3em;
    line-height: 1;
    padding: 2px 6px;
    border-radius: 4px;
}

.rst-content .logbox > details > summary > .dl a:hover {
    background: #374151;
    color: #a5f3fc;
    text-decoration: none;
}

/* Body of the rollup (the literalinclude / inline content).
 *
 * Sphinx wraps a literalinclude in
 *   <div class="highlight-console notranslate">
 *     <div class="highlight"><pre>...</pre></div>
 *   </div>
 * inside the <details>.  The browser's default <pre> margin would
 * leave gaps inside the bordered logbox; tighten them.  We also
 * cap the visible height with overflow scrolling so a very long
 * expanded log doesn't blow out the page. */
.rst-content .logbox > details > div.highlight-console,
.rst-content .logbox > details > div.highlight-none,
.rst-content .logbox > details > div.highlight-text,
.rst-content .logbox > details > div[class^="highlight-"] {
    margin: 0;
    max-height: 60vh;
    overflow: auto;
    background: #111827;
}
.rst-content .logbox > details > div[class^="highlight-"] > .highlight,
.rst-content .logbox > details > div[class^="highlight-"] > .highlight pre {
    margin: 0;
    border-radius: 0;
    background: #111827;
    color: #e5e7eb;
}

/* Re-tint Pygments token spans so the highlighter (which is set up
 * for a light background elsewhere on the page) stays readable on
 * the slate body of the logbox.  Only the tokens that the log /
 * console lexers actually emit need overriding -- enumerated by
 * scanning the built HTML inside every .logbox <pre>. */
.rst-content .logbox > details pre .go,        /* Generic.Output    */
.rst-content .logbox > details pre .w,         /* Whitespace        */
.rst-content .logbox > details pre .p {        /* Punctuation       */
    color: #e5e7eb;
}
.rst-content .logbox > details pre .gp {       /* Generic.Prompt    */
    color: #67e8f9;
    font-weight: 600;
}
.rst-content .logbox > details pre .gh {       /* Generic.Heading   */
    color: #a7f3d0;
    font-weight: 600;
}
.rst-content .logbox > details pre .gr {       /* Generic.Error     */
    color: #fca5a5;
}
.rst-content .logbox > details pre .nt {       /* Name.Tag (zephyr "I:") */
    color: #67e8f9;
}
.rst-content .logbox > details pre .cp {       /* Comment.Preproc (zephyr "D:") */
    color: #fbbf24;
}
.rst-content .logbox > details pre .c1 {       /* Comment.Single    */
    color: #94a3b8;
    font-style: italic;
}
.rst-content .logbox > details pre .k,
.rst-content .logbox > details pre .kp {       /* Keyword           */
    color: #c4b5fd;
}
.rst-content .logbox > details pre .nb,
.rst-content .logbox > details pre .nv {       /* Name.Builtin / Variable */
    color: #fcd34d;
}
.rst-content .logbox > details pre .s,
.rst-content .logbox > details pre .s2,
.rst-content .logbox > details pre .se {       /* String / String.Escape */
    color: #bef264;
}
.rst-content .logbox > details pre .m,
.rst-content .logbox > details pre .mh,        /* Number / Number.Hex */
.rst-content .logbox > details pre .o {        /* Operator          */
    color: #f0abfc;
}

/* Screen-reader-only label used for the download icon's accessible
 * text (the visible glyph alone is not announced).  Mirrors the
 * Bootstrap utility class of the same name. */
.rst-content .logbox .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}