/*
 * Code inside a table cell, made to read like the Code blocks on the rest of
 * the page.
 *
 * Only elements this plugin has promoted are touched (.nv-table-code), so a
 * short inline `int` in a sentence keeps looking like inline code.
 *
 * The colours deliberately match the child theme's own code styling in
 * assets/css/code-syntax.css rather than inventing a second palette, including
 * its dark variant for LearnDash focus mode (.bb-sfwd-aside.bb-dark-theme).
 */

td > code.nv-table-code,
th > code.nv-table-code,
td code.nv-table-code,
th code.nv-table-code {
    display: block;
    /* pre-wrap, not pre: a table cell is narrow, and a long line should wrap
       rather than push the whole table sideways. Leading spaces still render,
       which is what makes the indentation survive. */
    white-space: pre-wrap;
    overflow-x: auto;

    margin: 0;
    padding: 0.75em 0.9em;
    border: 1px solid #ddd;
    border-radius: 4px;
    background-color: #fff;
    color: #393a34;

    font-family: Hack, 'Fira Code', Consolas, Menlo, Monaco, 'Andale Mono',
        'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono',
        'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L',
        'Courier New', Courier, monospace;
    font-size: 0.85em;
    line-height: 1.45;
    text-align: left;
    direction: ltr;

    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}

/* A cell holding code should not be centred or vertically centred: code reads
   from the top left. */
td:has(> code.nv-table-code),
th:has(> code.nv-table-code) {
    vertical-align: top;
    text-align: left;
}

/*
 * The table block defaults to a fixed layout, which divides the width evenly
 * and leaves a code column cramped. Where a table contains promoted code, let
 * the columns size to their content instead, and allow the table itself to
 * scroll on narrow screens rather than overflow the page.
 */
.wp-block-table:has(code.nv-table-code) {
    overflow-x: auto;
}

.wp-block-table:has(code.nv-table-code) table.has-fixed-layout {
    table-layout: auto;
}

/* ---------- LearnDash focus mode, dark ---------- */

.bb-sfwd-aside.bb-dark-theme td > code.nv-table-code,
.bb-sfwd-aside.bb-dark-theme th > code.nv-table-code,
.bb-sfwd-aside.bb-dark-theme td code.nv-table-code,
.bb-sfwd-aside.bb-dark-theme th code.nv-table-code {
    background-color: #282a2c;
    border-color: #282a2c;
    color: #e7e9ec;
}

/* ---------- narrow screens ---------- */

@media (max-width: 600px) {
    td > code.nv-table-code,
    th > code.nv-table-code,
    td code.nv-table-code,
    th code.nv-table-code {
        font-size: 0.8em;
        padding: 0.6em 0.7em;
    }
}
