/* ============================================================================
   App-level additions to the design system.

   Kept separate from app.css so that file stays a byte-faithful export of the
   design system and can be replaced wholesale on the next re-export.
   ============================================================================ */

/* The theme makes `.main > h1 ~ form > div` a grid so a label sits above its input.
   A checkbox is the exception — it reads as one row with its text — so the label
   wraps the input and lays itself out inline, matching the design system's own
   checkbox markup. */
.checkbox-row {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

/* Fully collapsible sidebar. The toggle stays on screen either way; the choice is remembered per browser. */
.sidebar-toggle {
    position: fixed;
    top: 8px;
    left: calc(var(--sidebar-width) - 36px);
    z-index: 50;
    width: 28px;
    height: 28px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #35415a;
    border-radius: 4px;
    background: var(--nav);
    color: var(--nav-text);
    font-size: 16px;
    line-height: 1;
    cursor: pointer;
}
.sidebar-toggle:hover { filter: brightness(1.2); }

body.sidebar-collapsed .sidebar { display: none; }
body.sidebar-collapsed .sidebar-toggle { left: 8px; }
body.sidebar-collapsed .main { padding-top: 44px; }

/* Report pages: the report frame runs flush to the sidebar edge, the right edge and the bottom of the window.
   The page is exactly one window tall, so the only scrollbar is the report's own. */
.main--fill {
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    height: 100vh;
    padding: var(--gutter) 0 0;
    overflow: hidden;
}
.main--fill > :not(iframe) { margin-left: var(--gutter); margin-right: var(--gutter); flex: 0 0 auto; }
.main--fill > .report-frame { display: block; flex: 1 1 auto; min-height: 0; width: 100%; border: 0; }
body.sidebar-collapsed .main--fill { padding-top: 44px; }