/* app/Layout/MainLayout.razor.rz.scp.css */
/* Scoped styles for the shell. The shell's own layout lives in
   wwwroot/css/app.css, because the tab bar and the header are styled together
   with the loading screen in index.html, which has no component to be scoped
   to. Keeping a scoped file here also makes sure the scoped CSS bundle that
   index.html references is generated. */

.app-shell[b-4j454dvk2z] {
    /* Anchors nothing itself; the rules that matter are global. */
    isolation: isolate;
}
/* app/Pages/Actions.razor.rz.scp.css */
/* The withdrawals waiting on a team manager.

   Same row shape as the agenda, with one thing added: the reason the member
   gave. That is somebody's words, so it is set as a quotation rather than as
   another line of the record. */

.requests[b-cpu9xzsyho] {
    list-style: none;
    margin: 0 0 var(--space-5);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.requests li[b-cpu9xzsyho] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-4);
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: var(--surface-raised);
}

.event-head[b-cpu9xzsyho] {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.event-title[b-cpu9xzsyho] {
    font-size: var(--text-lg);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
}

.event-head .chip[b-cpu9xzsyho] {
    margin-left: auto;
}

.event-when[b-cpu9xzsyho] {
    font-weight: 600;
}

blockquote[b-cpu9xzsyho] {
    margin: var(--space-3) 0 0;
    padding: var(--space-3) var(--space-4);
    border-left: 3px solid var(--orange-500);
    border-radius: 0 var(--radius-control) var(--radius-control) 0;
    background: var(--surface-sunken);
}

.field[b-cpu9xzsyho] {
    margin-top: var(--space-4);
    margin-bottom: 0;
}

.row-actions[b-cpu9xzsyho] {
    margin-top: var(--space-4);
}
/* app/Pages/Agenda.razor.rz.scp.css */
/* The member's own agenda.

   The buttons, fields, chips and notices come from the shared design system;
   what is left here is the shape of an event row. That row is the screen: it is
   read standing at the side of a pitch, so the time is the loudest thing on it
   and the two answers are thumb-sized. */

.events[b-tgc85fz8go] {
    list-style: none;
    margin: 0 0 var(--space-5);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.events li[b-tgc85fz8go] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-4);
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: var(--surface-raised);
}

.event-head[b-tgc85fz8go] {
    display: flex;
    align-items: baseline;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.event-title[b-tgc85fz8go] {
    font-size: var(--text-lg);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
}

.event-head .chip[b-tgc85fz8go] {
    margin-left: auto;
}

/* When it starts, in the row's own voice. Tabular figures so a column of times
   lines up down the list. */
.event-when[b-tgc85fz8go] {
    font-weight: 600;
}

.event-where[b-tgc85fz8go] {
    font-size: 0.9375rem;
}

.row-actions[b-tgc85fz8go] {
    margin-top: var(--space-3);
}

/* Telling the team manager why you are not coming. Set apart from the row it
   belongs to, because it is a question being asked rather than a fact. */
.withdraw[b-tgc85fz8go] {
    margin-top: var(--space-3);
    padding: var(--space-4);
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-sunken);
}

.withdraw .field:last-of-type[b-tgc85fz8go] {
    margin-bottom: 0;
}

.withdraw .row-actions[b-tgc85fz8go] {
    margin-top: var(--space-4);
}
/* app/Pages/Planning.razor.rz.scp.css */
/* Planning a training, a match or an activity. The longest screen in the app,
   and the one most likely to be filled in standing up, so it stays a single
   column of questions at every width.

   Buttons, fields, chips, notices and the table come from the shared design
   system; what is here is the grouping between them. */

h2[b-yr9qkcakai] {
    margin-top: var(--space-7);
}

h2:first-of-type[b-yr9qkcakai] {
    margin-top: var(--space-6);
}

/* ------------------------------------------------------------------ form -- */

fieldset.field[b-yr9qkcakai] {
    margin-inline: 0;
    padding: 0;
    border: 0;
}

/* Adding a ground without leaving the form. Set into the form as a panel,
   because it is a detour from the question being answered. */
.new-location[b-yr9qkcakai] {
    margin: 0 0 var(--space-4);
    padding: var(--space-4);
    border: 1px solid var(--line);
    border-radius: var(--radius-control);
    background: var(--surface-sunken);
}

.new-location legend[b-yr9qkcakai] {
    padding: 0;
    font-size: var(--text-sm);
    font-weight: 600;
}

.new-location .field:last-of-type[b-yr9qkcakai] {
    margin-bottom: var(--space-2);
}

.hint[b-yr9qkcakai] {
    margin: 0 0 var(--space-3);
}

.error[b-yr9qkcakai] {
    margin: 0 0 var(--space-3);
    color: var(--bad);
    font-size: var(--text-sm);
}

/* ------------------------------------------------------------ what it is -- */

/* What was just planned, and who is expected. Marked with the accent because
   it is the answer to what the form was for. */
.planned[b-yr9qkcakai] {
    margin: var(--space-5) 0;
    padding: var(--space-4);
    border: 1px solid var(--ok-line);
    border-left: 3px solid var(--ok);
    border-radius: var(--radius-card);
    background: var(--ok-surface);
}

.planned h2[b-yr9qkcakai] {
    margin-top: 0;
    font-size: var(--text-lg);
}

.planned .table[b-yr9qkcakai] {
    margin-top: var(--space-4);
}

/* -------------------------------------------------- already in the diary -- */

.events[b-yr9qkcakai],
.locations[b-yr9qkcakai] {
    list-style: none;
    margin: 0 0 var(--space-5);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.events li[b-yr9qkcakai],
.locations li[b-yr9qkcakai] {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    padding: var(--space-3) var(--space-4);
    border: 1px solid var(--line);
    border-radius: var(--radius-card);
    background: var(--surface-raised);
}

.events li strong[b-yr9qkcakai] {
    font-weight: 600;
}

.events li .muted[b-yr9qkcakai] {
    font-size: 0.9375rem;
}

/* A location is a name and what to do about it, side by side. */
.locations li[b-yr9qkcakai] {
    flex-direction: row;
    align-items: center;
    gap: var(--space-3);
    flex-wrap: wrap;
}

.locations li > span:first-child[b-yr9qkcakai] {
    display: flex;
    flex-direction: column;
    flex: 1 1 12rem;
    min-width: 0;
}

.locations li .muted[b-yr9qkcakai] {
    font-size: var(--text-sm);
}