/* The evening routine (js/evening.js): the "Log today" dialog and today's goals in the banner.
   Only the tokens of style.css (both themes are set there). The dialog itself is .entry-dialog. */
@media (min-width: 641px) { .entry-dialog.evening-dialog { width: min(560px, calc(100vw - 32px)); } }

/* Step 1 · 2 · 3: the current one in the accent colour. */
.ev-steps { display: flex; flex-wrap: wrap; gap: var(--s1) var(--s4); margin: 0 0 var(--s4); padding: 0; list-style: none; font-size: var(--fs-sm); color: var(--text-muted); }
.ev-steps li { display: inline-flex; align-items: center; gap: var(--s2); }
.ev-step-n { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--border); font-size: var(--fs-xs); font-weight: 600; }
.ev-steps [aria-current="step"] { color: var(--text); font-weight: 600; }
.ev-steps [aria-current="step"] .ev-step-n { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }

.ev-anchors { margin: 0 0 var(--s2); }
.ev-q { margin: 0 0 var(--s3); padding: 0; font-size: var(--fs-base); font-weight: 650; color: var(--text); }
.ev-sec { margin: 0 0 var(--s4); padding: 0; border: 0; min-width: 0; }
.ev-sec > legend { padding: 0; }
.ev-form { display: flex; flex-direction: column; gap: var(--s3); }
.ev-form .form-actions, .evening-dialog > .form-actions { margin-top: var(--s4); }

/* What was done today: three big choices, and what is logged already. */
.ev-choices { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s2); }
.ev-choices button { min-height: 56px; font-size: var(--fs-base); font-weight: 600; }
.ev-logged { margin: 0 0 var(--s3); padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: var(--s2); }
.ev-logged .chip { background: var(--ok-bg); }
.ev-why { margin: 0; flex-basis: 100%; }

/* The 1-4 ratings: radio chips (style.css .fb-chip), one row per area. */
.ev-rate { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); margin: 0; padding: 0; border: 0; min-width: 0; }
.ev-rate legend { float: left; width: 96px; padding: 0; font-size: var(--fs-md); font-weight: 600; }
.ev-rate .fb-chip { min-width: 48px; min-height: 44px; justify-content: center; }
.evening-dialog textarea { width: 100%; }

/* Tomorrow: three short lines and the ideas. */
.ev-tomorrow { display: flex; flex-direction: column; gap: var(--s2); }
.ev-tomorrow input { width: 100%; min-height: 44px; }
.ev-ideas .hint { margin: 0 0 var(--s2); }
.ev-ideas .chip-row { margin: 0; padding: 0; list-style: none; }
.ev-idea { min-height: 36px; background: var(--card-bg); color: var(--text); cursor: pointer; text-align: left; font: inherit; font-size: var(--fs-sm); border-style: dashed; }
.ev-idea:hover { border-color: var(--clay); }
.ev-idea:focus-visible { outline: 2px solid var(--clay); outline-offset: 2px; }

/* Today's goals, in the dialog: tap to tick. */
.ev-goals { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--s1); }
.ev-goal { display: flex; align-items: center; gap: var(--s2); min-height: 40px; cursor: pointer; }
.ev-goal input { width: 20px; height: 20px; margin: 0; accent-color: var(--accent); flex: none; }
.ev-goal input:checked + span { text-decoration: line-through; color: var(--text-muted); }

@media (max-width: 640px) {
  .ev-choices button { min-height: 64px; padding: 0 var(--s2); }
  .ev-rate legend { width: 100%; float: none; margin-bottom: var(--s1); }
}

/* "Log today" / "Plan tomorrow" in the header, beside the theme button and Account (app.js
   updateRoutineButton), on every tab and at every width (Lucas, 2026-10-20: it went missing in a narrow window,
   where + Log used to carry it alone; + Log keeps it as its first choice too). The header's row has room for it
   (style.css .topbar). */
.routine-btn {
  min-height: var(--tap); padding: 0 var(--s4); border: 1px solid var(--on-bar-line); border-radius: var(--radius-pill);
  background: var(--on-bar-fill); color: var(--on-bar-strong); font: inherit; font-size: var(--fs-md); font-weight: 650; cursor: pointer;
}
.routine-btn:hover { border-color: var(--on-bar-text); background: var(--on-bar-line); }
.routine-btn:focus-visible { outline: 2px solid var(--on-bar-strong); outline-offset: 2px; }

/* The routine's short training form (training.js openNew slim): no date, ratings, notes or Day part. */
.entry-dialog.ev-slim .ev-full { display: none; }

/* Step 1 with today logged: Edit today's entry first. Step 3: what today has, with Edit today. */
.ev-edit-today { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2) var(--s3); margin: 0 0 var(--s3); }
.ev-edit-today .hint { margin: 0; flex: 1 1 220px; }
.ev-today-done { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); margin: 0 0 var(--s4); }
.ev-today-done .section-label { margin: 0; flex-basis: 100%; }
.ev-today-done .ev-logged { margin: 0; }
.ev-today-done .link-btn { min-height: 32px; padding: var(--s1) var(--s2); }
.ev-full-group { display: contents; } /* the ratings and the notes: one .ev-full wrapper, still grid items */

/* A day goal picked from one of the player's goals names it. */
.ev-goal-link { color: var(--text-muted); font-size: var(--fs-xs); white-space: nowrap; }

/* The ratings of a new entry as tap chips (entryDialog.js addRatingChips; round 4, #3): the number input
   holds the value and shows only in an edit; the chips only in an add dialog (.rate-chips-on). */
.rate-chips { display: flex; flex-wrap: wrap; gap: var(--s1); }
.rate-chips .fb-chip { min-width: 44px; min-height: 44px; justify-content: center; }
.entry-dialog:not(.rate-chips-on) .rate-chips, .entry-dialog.rate-chips-on .rate-input { display: none; }
/* On a phone the three would wrap 2 + 2: one rating per line, its name beside the chips (as the routine). */
@media (max-width: 640px) {
  .entry-dialog.rate-chips-on .form-row-3:has(.rate-chips) { grid-template-columns: 1fr; }
  .entry-dialog.rate-chips-on .field:has(> .rate-chips) { flex-direction: row; flex-wrap: wrap; align-items: center; gap: var(--s2); }
  .entry-dialog.rate-chips-on .field:has(> .rate-chips) > label { width: 64px; }
}

/* A new match after the tournament week: the last place as a one-tap chip (matches.js usePlaceIdea). */
.place-idea { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s2); margin: 0 0 var(--s3); font-size: var(--fs-sm); color: var(--text-muted); }
.place-idea[hidden] { display: none; }

/* The routine's off-tab host (app.js boardFor; round 4, B24): a board mounted out of sight, only so its
   add or edit dialog (top layer, not clipped) can open over the tab on screen. */
#entry-host { position: fixed; top: 0; left: 0; width: 0; height: 0; overflow: hidden; visibility: hidden; }
#entry-host dialog { visibility: visible; } /* the rest of the board stays hidden, also from screen readers */