/* Today (TodayView.swift) and Settings (SettingsView.swift). */

/* A card another module fills in when it has loaded: no box of its own, so no gap while empty. */
.today-slot { display: contents; }

/* SampleSwimsCard. */
.sample-title { gap: 6px; }
.sample-title svg { width: 20px; height: 20px; }
.today-button { align-self: flex-start; min-height: 34px; font-size: 15px; padding: 0 14px; }
.today-note:empty { display: none; }
.card .demo-note { margin: 0; }

/* ThisWeekCard. */
.week-total { gap: var(--xs); flex-wrap: wrap; }
.week-total .hero.title { font-weight: 700; }
.week-bar { height: 4px; border-radius: 2px; background: var(--fill); overflow: hidden; }
.week-bar span { display: block; height: 100%; border-radius: 2px; background: var(--aqua); }
.week-bar span.reached { background: var(--positive); }
.week-dots { display: flex; }
.week-day { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.week-dot { width: 12px; height: 12px; border-radius: 50%; background: color-mix(in srgb, var(--secondary) 25%, transparent); }
.week-dot.swum { background: var(--aqua); }

/* RecentSwims: SwimRow without its strip, a hairline under each. */
.recent-row { display: flex; align-items: center; gap: var(--m); width: 100%; text-align: left; }
.recent-row.excluded { opacity: 0.45; }
.recent-row .body.medium { font-size: 17px; }
.recent-swims .divider { border: 0; border-top: 0.5px solid var(--separator); margin: 0; width: 100%; }
.see-all { align-self: flex-start; color: var(--aqua); min-height: 28px; }

/* Settings: iOS 26's Form, headers in sentence case, taller rows. */
.settings { --destructive: #ff3b30; padding-top: var(--xs); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .settings { --destructive: #ff453a; } }
:root[data-theme="dark"] .settings { --destructive: #ff453a; }
.settings .list-header.form { text-transform: none; font-size: 17px; line-height: 22px; font-weight: 600; padding-bottom: 10px; }
.settings .list-row { min-height: 52px; }
.settings .list-section:first-child { margin-top: var(--s); }
.settings > .demo-note { margin: var(--s) 0 0; }
.settings-icon svg { width: 22px; height: 22px; }
.settings .destructive { color: var(--destructive); }
.settings-delete { width: 100%; text-align: center; font-size: 17px; }
.settings-delete[disabled] { opacity: 0.4; cursor: default; }
.settings-input { flex: 1; min-width: 0; border: 0; background: none; font: inherit; font-size: 17px; color: var(--label); outline: none; padding: 0; }
.settings-input::placeholder { color: var(--tertiary); }
.pool-unit { width: 100px; flex: none; }

/* A pool row: swipe left to show Delete, as a List's .onDelete. */
.swipe-row { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; position: relative; }
.swipe-row::-webkit-scrollbar { display: none; }
.swipe-content { flex: 0 0 100%; scroll-snap-align: start; }
.swipe-delete { flex: 0 0 88px; scroll-snap-align: end; background: var(--destructive); color: #fff; font-size: 17px; }
.swipe-row + .swipe-row::before, .swipe-row + .list-row::before { content: ""; position: absolute; top: 0; left: var(--l); right: 0;
  border-top: 0.5px solid var(--separator); z-index: 1; }

/* The delete confirmation: its question is too long for a sheet's bar, so it heads the sheet instead. */
.sheet:has(.delete-confirm) .navbar .inline-title { visibility: hidden; }
.confirm-title { text-align: center; padding: 0 var(--l); }