/* lazysite engine chrome - SM352.
 *
 * These rules were inline <style> blocks in the engine's own output: the
 * fallback page chrome and the SM098 multi-step form progressive-enhancement
 * rules. They are here because a Content-Security-Policy worth setting cannot
 * coexist with the engine inlining style on every page - t/lint/56 holds the
 * inventory, and this file is the first two entries leaving it.
 *
 * BUNDLED rather than split per feature, deliberately. Two files was the
 * operator's call, and it is the right one: a rule that only matters on a page
 * with a multi-step form costs nothing to carry, while a second request costs
 * a round trip on every page that has one.
 *
 * Cached hard and busted by ?v=<version> - the same convention every other
 * shipped asset uses.
 */

/* --- fallback page chrome ------------------------------------------------
 * Used when no layout is bound. A site with a real layout gets its theme's
 * stylesheet instead and never loads these rules for anything but the bar. */
body { font-family: system-ui, sans-serif; max-width: 800px;
       margin: 2rem auto; padding: 0 1rem; color: #333; }
.site-bar { display: flex; align-items: center; gap: 0.75rem;
            padding: 0.5rem 0; font-size: 0.85rem; flex-wrap: wrap; }
.site-bar a { color: #0066cc; text-decoration: none; font-weight: 600; }
.site-bar a:hover { text-decoration: underline; }
.site-bar .edit-btn { font-size: 0.8rem; padding: 0.15rem 0.5rem;
       border: 1px solid #ccc; border-radius: 3px; background: #f9f9f9;
       color: #555; text-decoration: none; cursor: pointer; font-weight: 400; }
.site-bar .edit-btn:hover { background: #eee; color: #333; }
.site-bar form { display: flex; gap: 0.3rem; }
.site-bar input[type="search"] { padding: 0.2rem 0.4rem; font-size: 0.8rem;
       border: 1px solid #ccc; border-radius: 3px; width: 140px; }
.site-bar button { padding: 0.2rem 0.5rem; font-size: 0.8rem; cursor: pointer; }
hr.site-rule { border: none; border-top: 1px solid #eee; margin: 0 0 1.5rem; }
.nav-link { margin-right: 1rem; color: #0066cc; text-decoration: none; }
.nav-link:hover { text-decoration: underline; }
.nav-child { margin-right: 0.75rem; font-size: 0.85rem; }
.nav-link[aria-current="page"] { font-weight: 600; }
.nav-group {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #888;
    padding: 0.5rem 0 0.2rem;
    margin-right: 0.75rem;
    display: inline-block;
}
h1 { border-bottom: 1px solid #eee; padding-bottom: 0.5rem; }
pre { background: #f5f5f5; padding: 1rem; overflow-x: auto; }
code { background: #f5f5f5; padding: 0.2em 0.4em; }
footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid #eee;
         font-size: 0.85rem; color: #888; }
a { color: #0066cc; }

/* --- SM098 multi-step forms ----------------------------------------------
 * Progressive enhancement: WITHOUT the JS-added `lsf-js` class every step
 * shows and the nav is hidden, so a visitor with no JavaScript gets one long
 * usable form rather than a dead one. That is why these rules are not in the
 * script that needs them. */
.lazysite-form[data-multistep] .lsf-nav{display:none}
.lazysite-form.lsf-js[data-multistep] .lsf-step:not(.lsf-active){display:none}
.lazysite-form.lsf-js[data-multistep] .lsf-nav{display:flex;gap:.5rem;margin-top:1rem}
.lazysite-form[data-multistep] .lsf-progress{font-size:.9em;opacity:.75;margin-bottom:.75rem}