/* ============================================================================
   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;
}

/* Shown on every admin page while conversion_sync.validate_only is on (Ken, 2026-09-28: "when
   validate is on should have a red bar on every page") -- easy to miss otherwise that nothing
   is actually reaching Google. */
.validate-only-banner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 6px 12px;
    background: var(--danger-bg, #fef2f2);
    border-bottom: 1px solid var(--danger-border, #fecaca);
    color: var(--danger, #b91c1c);
    font-size: 12.5px;
    font-weight: 700;
    text-align: center;
}