/* ═══════════════════════════════════════════════════════════
   LievoEngine — Layout minimal: stile specifico
   Versione: 14-05-2026 (S1)

   Co-locato a private/layouts/minimal.php. Esposto via HTTP a
   /assets/layouts/minimal.css.

   Per pagine semplici: wizard, setup, errori, 404/500, on-boarding.
   Header opzionale + main centrato (max-width via --lv-minimal-max-w) + footer opzionale.

   Tutto namespacato `.lv-minimal__*`.
   ═══════════════════════════════════════════════════════════ */


/* ─── Body wrapper ─────────────────────────────────────── */

.lv-minimal {
    background-color: var(--lv-c-bg);
    color: var(--lv-c-fg);
    min-height: 100dvh;
}

.lv-minimal__shell {
    display: flex;
    flex-direction: column;
    min-height: 100dvh;
}


/* ─── Header ───────────────────────────────────────────── */

.lv-minimal__header {
    border-bottom: var(--lv-b-width) solid var(--lv-c-border);
    background-color: var(--lv-c-surface-alt);
    padding: var(--lv-s-3) var(--lv-s-6);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: calc(var(--lv-s-3) + env(safe-area-inset-top));
}

.lv-minimal__brand {
    display: flex;
    align-items: center;
    gap: var(--lv-s-2);
}

.lv-minimal__logo-mark {
    width: 28px;
    height: 28px;
    background-color: var(--lv-c-accent);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--lv-ff-display);
    font-weight: var(--lv-fw-bold);
    font-size: var(--lv-fs-xs);
    border-radius: var(--lv-b-radius-0);
}

.lv-minimal__logo-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.lv-minimal__logo-name {
    font-size: var(--lv-fs-sm);
    font-weight: var(--lv-fw-bold);
    color: var(--lv-c-fg);
}

.lv-minimal__logo-sub {
    font-size: var(--lv-fs-xs);
    color: var(--lv-c-fg-faint);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}


/* ─── Theme toggle ─────────────────────────────────────── */

.lv-minimal__theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: none;
    border: var(--lv-b-width) solid var(--lv-c-border);
    color: var(--lv-c-fg-muted);
    cursor: pointer;
    border-radius: var(--lv-b-radius-0);
    transition: background-color var(--lv-d-fast), color var(--lv-d-fast);
}
.lv-minimal__theme-toggle:hover {
    background-color: var(--lv-c-accent-soft);
    color: var(--lv-c-fg);
}


/* ─── Main centered ────────────────────────────────────── */

.lv-minimal__main {
    max-width: var(--lv-minimal-max-w, 860px);
    width: 100%;
    margin: 0 auto;
    padding: var(--lv-s-8) var(--lv-s-4);
    flex: 1;
    min-height: 0;
}


/* ─── Flash messages ───────────────────────────────────── */

.lv-minimal__flashes {
    display: flex;
    flex-direction: column;
    gap: var(--lv-s-2);
    margin-bottom: var(--lv-s-4);
}


/* ─── Footer ───────────────────────────────────────────── */

.lv-minimal__footer {
    border-top: var(--lv-b-width) solid var(--lv-c-border);
    background-color: var(--lv-c-surface-alt);
    padding: var(--lv-s-3) var(--lv-s-6);
    text-align: center;
    font-size: var(--lv-fs-xs);
    color: var(--lv-c-fg-faint);
    padding-bottom: calc(var(--lv-s-3) + env(safe-area-inset-bottom));
}