/* =========================================================================
   Slice D2, piece C: Me, Clubs, Club, Household, Signing in and Notifications on a desktop (decision 135).
   Loaded with the desktop media query (see shell.css), so nothing here reaches a phone and none of it repeats that query.
   The page types, cards, tiles, tables and forms come from shell.css; this file only fits the Me area's screens to them.
   Plain body text for everything private: children's details, balances, tables (never a themed face).
   ========================================================================= */

/* ---- A row of buttons at the foot of a page (Me's Sign out and Delete): the phone stacks them full width. ---- */
.club-actions.club-desk-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.club-desk-row .club-btn--block { width: auto; display: inline-flex; }

/* ---- Buttons in a card, an aside or a split column keep their own width and sit at the start of it. ---- */
.club-card .club-btn--block, .club-split__main .club-btn--block, .club-app--read .club-actions .club-btn--block { width: auto; display: inline-flex; }
.club-card .club-btn, .club-split__main .club-stack > .club-btn, .club-aside > .club-btn, .club-app--read .club-actions .club-btn { justify-self: start; }
.club-aside .club-actioncard .club-btn--block { justify-self: stretch; width: 100%; }

/* ---- Hall passes: the section's label is the heading, so the card's own overline is left out. The balance stays plain body text. ---- */
.club-cols .club-balance-card > .t-overline { display: none; }

/* ---- Tables: the cell that holds a title and a line under it wraps; buttons in a cell sit side by side. ---- */
.club-table td.club-wrap { white-space: normal; }
.club-table td > .club-btn + .club-btn { margin-left: var(--space-2); }
.club-table .club-label { display: inline-flex; }

/* ---- Forms in two columns (the child form, the home form): the note and the one primary make the foot. ---- */
.club-form-d { gap: var(--space-5); }
.club-form-d > .club-cols { gap: var(--space-5) var(--space-6); }
.club-form-foot .club-btn--block { width: auto; display: inline-flex; }

/* ---- Delete the household: the form holds both columns, so the head sits above them with room to breathe. ---- */
form.club-stack > .club-split { margin-top: var(--space-3); }

/* ---- Notifications: the drawn examples sit in the aside under their caption. ---- */
.club-aside > .t-caption { margin: 0; }