/* =====================================================================
   v2-app.css — the new design for the pages people WORK in.

   v2.css is the foundation every page stands on, and the platform home and
   the event page add showcase layers of their own. The console, the results
   boards, the registered list, the entry form, the QR poster and the
   competitions and club lists share this layer instead: toolbars whose
   search box and buttons line up at 48px, the status colours the
   foundation's outline badge and button would otherwise wash out, and the
   theme.css tokens the foundation does not map.

   Screen only. Every one of these pages prints — start lists, referee
   sheets, boards, posters — and a printed sheet is theme.css's, unchanged.
   ===================================================================== */
@media screen{
/* the theme.css tokens v2.css leaves alone, drawn from the same neutrals */
body.v2-site{--line-strong:color-mix(in srgb,var(--v2-ink) 24%,var(--v2-card));--chip-bg:color-mix(in srgb,var(--v2-ink) 6%,var(--v2-card));--hover-bg:color-mix(in srgb,var(--v2-ink) 5%,var(--v2-card));--glass:color-mix(in srgb,var(--v2-card) 94%,transparent);--focus-border:var(--v2-accent-ink);--radius-lg:4px;--radius-sm:3px;--radius-pill:4px}

/* ---- toolbars: one line, one height --------------------------------------
   A search box beside the buttons that act on its results reads as one
   control only if they share an edge. 48px is the height the touch targets
   were set at, and tests/redesign_check.js holds every toolbar to it. */
.v2-site .toolbar{gap:18px}
.v2-site .toolbar-filters{padding-top:16px;border-top:1px solid var(--v2-line)}
.v2-site .toolbar-main,.v2-site .toolbar-actions,.v2-site .plat-tools{align-items:center;gap:12px}
.v2-site :is(.toolbar,.plat-toolbar) :is(input[type="search"],.btn,.pick-btn){min-height:48px;padding-top:12px;padding-bottom:12px;line-height:22px;box-sizing:border-box}
.v2-site .toolbar .search-box{margin-bottom:0}
/* the magnifier sits inside the box (theme.css .search-box::before); the
   foundation's field padding would put the placeholder under it */
.v2-site .search-box input{padding-left:40px}
.v2-site .toolbar .viewtoggle{min-height:48px;align-items:stretch;border-radius:3px}
.v2-site .toolbar .viewtoggle button{min-width:44px}

/* ---- where the colour IS the message --------------------------------------
   The foundation draws every .btn as an outline and every .badge as a quiet
   tag, which is right for a plain action and a plain label and wrong for the
   ones whose colour says something: confirm, delete, paid, rejected. */
.v2-site .btn-ok{background:var(--ok);border-color:var(--ok);color:#04240f}
.v2-site .btn-danger{background:var(--err-bg);border-color:var(--err-line);color:var(--err)}
.v2-site .btn-danger:hover{background:var(--err);border-color:var(--err);color:#fff}
.v2-site .btn.copied{background:var(--ok-bg);border-color:var(--ok-line);color:var(--ok)}
.v2-site .btn-block{width:100%}
.v2-site .badge.st-pending,.v2-site .badge-due{background:var(--warn-bg);color:var(--warn);border-color:var(--warn-line)}
.v2-site .badge.st-confirmed,.v2-site .badge-paid{background:var(--ok-bg);color:var(--ok);border-color:var(--ok-line)}
.v2-site .badge.st-rejected{background:var(--err-bg);color:var(--err);border-color:var(--err-line)}
.v2-site .badge-muted{background:var(--chip-bg);color:var(--v2-muted)}
.v2-site .badge-live{background:color-mix(in srgb,var(--live) 13%,transparent);color:var(--live);border-color:color-mix(in srgb,var(--live) 38%,transparent)}
.v2-site .card-danger{border-color:var(--err-line)}

/* ---- the design's corners on theme.css's furniture ------------------------ */
/* One size of filter chip on every page. The console's were 41px of 15px type
   and the public pages' 35px of 12px, for the same switch; now both are the
   console's, and the pickers that stand among them in a filter row (how many,
   what order) take the same height, so the row is one line of one height. */
.v2-site .chip{border-radius:2px;min-height:40px;padding:8px 16px;font-size:var(--fs-md);font-weight:700;line-height:22px}
.v2-site .toolbar .toolbar-filters .pick-btn{min-height:40px;padding-top:8px;padding-bottom:8px;line-height:22px}
.v2-site .seg{border-radius:3px}
.v2-site .seg button{border-radius:2px}
.v2-site .subtabs{border-radius:3px}
.v2-site .subtab{border-radius:2px}
.v2-site .board{border-radius:4px;box-shadow:none}
.v2-site .tablewrap{box-shadow:none}
.v2-site table{font-variant-numeric:tabular-nums}
}