/* ---------- To-do module (#627, #778): the styles moved out of the Inbox page ----------
     These rules moved verbatim from `src/inbox/app.html` into this file (#778). They are the
     To-dos module's own stage, dialog, due-picker and context-column styles; the shared canvas
     `.pl-*`, `.dlg`, `.mod`, `.mh`, `.seg` and `.ctxcol` rules stay in the shell. The module
     stylesheet loads before the inline <style>, so the inline shell rules still win. */
  /* The To-dos module frame (#571): its own stage pane in the shell's second track, shown in place
     of the Mail list pane on the To-dos surface. The `.mod` fills it (position:absolute;inset:0 from
     the canvas), the `.mh` header holds the title, count, List/Board switch and the New To-do action,
     and the views paint into `#todoBody`. All sizing and colour come from the linked canvas sheets. */
  #todoStage{grid-column:2;grid-row:1;position:relative;min-width:0;min-height:0;overflow:hidden;background:var(--canvas)}
  #todoStage[hidden]{display:none}
  #todoBody{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}
  /* The loading skeleton's status cell is a pill-shaped shimmer bar. The radius reads the shared
     pill token, not a one-off literal, so a theme change moves it with every other pill (design
     standards, Tokens and themes; #582). */
  .sk-pill{width:96px;height:24px;border-radius:var(--r-pill)}
  /* The dialog's assignee control sits left in the field, not stretched across it (#526). */
  #todo-assignee-seg{align-self:flex-start}

  /* The To-dos dialog is the canvas `.dlg` frame (#571), styled by the linked helm.css. The dialog
     hides on `[hidden]` (the canvas `.dlg{display:flex}` would otherwise beat the UA rule); the scrim
     hides on `[hidden]` through the UA rule, since the canvas `.dlg-scrim` sets no display. The
     `<form>` is a real flex-column box, not `display:contents`: some WebKit builds drop a contents
     form from the accessibility tree and from native submit, so the form stays a real box with the
     body and footer bands inside it. The form fills the height below the header, the body scrolls and
     the footer pins, so an open picker never pushes the footer off the dialog (the dialog's own
     max-height holds it on the stage) (round 1 review, #582). */
  #todoDialog[hidden]{display:none}
  #todo-form{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;overflow:hidden}
  #todoDialog .dlg-h{flex:none}
  #todoDialog .dlg-f{flex:none}
  #todoDialog .dlg-b{flex:1 1 auto;min-height:0}
  /* The due picker's Hour and Minute are a two-up row (`.pl-ptime`, plan.css). The app-wide
     `.f + .f` top margin must not push Minute below Hour, so scope it off here. This holds whatever
     order this change and the Calendar spacing-scope change (#580) land in (round 1 review, #582). */
  .pl-ptime > .f + .f{margin-top:0}

  /* The To-dos context column hides the shared Mail rail when the To-dos surface takes the
     context-column track; `#ctxTodos` carries its own hidden attribute otherwise (#526, adr/0063).
     The shared `.ctxcol` track rules stay in the shell. */
  .shell2.ctx-todos .rail{display:none}