/* LiMo Tools — app styles layered on top of MudBlazor. */

/* Roboto, shipped with the app rather than fetched.
 *
 * It is the theme's default because it is the only option we may legally ship, so the only one
 * guaranteed to render on every machine. Aptos and Segoe UI Variable Text are selectable but cannot
 * be bundled: the Aptos EULA grants no distribution rights, and Segoe ships with Windows.
 *
 * SIL Open Font License 1.1, text in roboto-OFL.txt beside these files. Roboto was Apache 2.0 for
 * years and Google relicensed it, so a stale reference to Apache is wrong rather than merely old.
 *
 * This is NOT a return to the Google Fonts link PR 110 removed. Nothing is fetched from a third
 * party at runtime, so there is no external dependency, no CDN and no request leaving the browser.
 *
 * The variable font, so 100 to 900 comes from one file. That matters rather than being tidy: the
 * theme sets headings at weight 600, and Roboto's static family has 400, 500 and 700 but no 600, so
 * static files would leave every heading substituted. That is the exact defect found on Aptos.
 *
 * Latin and latin-ext only. Google's other subsets, Cyrillic, Greek, Vietnamese, math and symbols,
 * are another 200KB for characters this app does not display. Anything outside these ranges falls
 * through to the next font in the stack rather than failing.
 */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('fonts/roboto-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308,
        U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
        U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url('fonts/roboto-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
        U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

h1:focus {
    outline: none;
}

/* Monospace surfaces used by the command builders. */
.limo-mono, .limo-code {
    font-family: 'Consolas', 'Courier New', monospace;
}

.limo-code {
    background: #0f172a;
    color: #e2e8f0;
    border-radius: 8px;
    padding: 14px;
    font-size: 12.5px;
    line-height: 1.55;
    white-space: pre-wrap;
    word-break: break-word;
    overflow-x: auto;
}

.limo-code-sm {
    font-size: 12px;
    padding: 11px;
}

.limo-url {
    color: #7dd3fc;
}

.limo-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    padding: 2px 7px;
    border-radius: 5px;
    color: #fff;
    vertical-align: middle;
}

.limo-badge-post { background: #0ea5e9; }
.limo-badge-get  { background: #16a34a; }
.limo-badge-sms  { background: #7c3aed; }

code {
    background: rgba(125, 211, 252, .15);
    padding: 1px 5px;
    border-radius: 4px;
    font-size: .85em;
}

.blazor-error-boundary {
    background: #b32121;
    padding: 1rem 1rem 1rem 1rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }


/*
 * Printing one element. limoInterop.printElement marks the body and the element, and these rules hide everything
 * that is not inside the marked element. The report keeps its tables and headings; the navigation, the loader,
 * the tab row and the picker do not reach the paper.
 */
@media print {
    body.printing-one * {
        visibility: hidden;
    }

    body.printing-one .print-target,
    body.printing-one .print-target * {
        visibility: visible;
    }

    body.printing-one .print-target {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        margin: 0;
        padding: 0;
        border: 0;
        box-shadow: none;
    }

    /* A table split across a page break loses its heading, so keep each one whole where it fits. */
    body.printing-one .print-target table {
        page-break-inside: auto;
    }

    body.printing-one .print-target tr {
        page-break-inside: avoid;
    }
}

/* The report picker on Modem Config's Status tab and the matching card on the KoCos Configuration tab.

   A wrapping flex row put every tick where the previous one happened to end, so nothing lined up down the page
   and a list of eighteen options read as a jumble. A grid of equal columns fixes the left edges, and auto-fill
   means the column count follows the width rather than being set per breakpoint.

   14rem is measured, not guessed: the longest label, "Meter table with last reading", renders at 177px in the
   MudBlazor body face, plus 32px for the box and a little room. Anything narrower wraps that label onto a second
   line and undoes the tidying. */
.limo-pick-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
    column-gap: 1rem;
    align-items: center;
}