/* Shared credential controls for sign-in, registration and account settings. */
.password-control { position:relative;width:100%;min-width:0; }
.password-control input { box-sizing:border-box; width:100%;min-width:0;min-height:50px;padding:12px 76px 12px 14px;border:1px solid #b9cfd7;border-radius:10px;background:#fff;color:#173d52;font:inherit;font-size:16px; }
.password-control input:focus { outline:2px solid #04788c;outline-offset:2px; }
.password-reveal { margin:0; position:absolute;right:5px;top:5px;bottom:5px;min-width:58px;border:0;border-radius:7px;padding:0 9px;background:transparent;color:#006d81;font:inherit;font-size:13px;font-weight:600;cursor:pointer; }
.password-reveal:hover { background:#e9f6f8; }
.password-settings { max-width:560px;padding:24px;border:1px solid #c2e2e9;border-radius:16px;background:#fff; }
.password-settings summary { cursor:pointer;font-weight:700;margin-bottom:18px; }
.password-settings .field { max-width:none !important;margin-bottom:18px; }
.password-settings label { display:block;margin-bottom:8px;font-weight:600;font-size:14px; }
.timing-editor { padding:22px;background:#eff9fb;border:1px solid #bedee6;border-radius:14px;margin:24px 0; }
.timing-editor .field input,.timing-editor .field select { width:100%;min-height:46px; }
.timing-editor h3 { margin-top:0; }

/* Dashboard forms share a compact tab workspace, with no horizontal swipe required. */
.swimmer-page main.band { padding-top:24px; }
.swimmer-tabs { display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:6px;border:1px solid #c5e0e6;background:#e4f2f5;border-radius:14px;margin:20px 0 24px; }
.swimmer-tabs button { min-width:0;min-height:46px;padding:10px 8px;border:0;border-radius:10px;font:inherit;font-size:14px;font-weight:600;line-height:1.35;background:transparent;color:#315c70;cursor:pointer; }
.swimmer-tabs button[aria-selected="true"] { color:#fff;background:#067b90;box-shadow:0 3px 8px #006b821c; }
.swimmer-tabs button:hover:not([aria-selected="true"]) { background:#d4e9ef; }
.swimmer-tab-panel[hidden] { display:none !important; }
.swimmer-tab-panel>.panel,.swimmer-tab-panel>form.panel { margin-top:0; }
.swimmer-tab-panel .field input,.swimmer-tab-panel .field select,.swimmer-tab-panel .field textarea { border-radius:10px; }
#view-account .password-settings { max-width:none; }
#view-overview>.actions { margin-top:0;margin-bottom:20px; }
.record-summary { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 24px; }
.record-summary>div { padding:16px;border:1px solid #c4e3e9;border-radius:12px;background:#f2fbfd; }
.record-summary strong { display:block;font-size:26px;line-height:1.2;color:#075d74; }
.record-summary span { font-size:13px;color:#567586; }
.record-section { margin-top:20px;border-top:1px solid #d7e7ec;padding-top:18px; }
.record-section>summary { cursor:pointer;font-weight:700;color:#16495e; }
@media(max-width:620px){
 .swimmer-tabs { grid-template-columns:repeat(3,minmax(0,1fr));gap:5px; }
 .swimmer-tabs button { font-size:12px;min-height:46px; }
 .record-summary { gap:6px; }.record-summary>div { padding:12px 8px; }.record-summary span { font-size:11px; }
 .password-settings { padding:18px; }
}
@media print { .swimmer-tabs,#view-race,#view-measurements,#view-training,#view-account { display:none !important; } #view-overview[hidden] { display:block !important; } }

/* Profile and club forms, including inputs without an explicit HTML type. */
#view-account .field input:not([type=checkbox]):not([type=radio]),#view-account .field select,#view-account .field textarea,.roster-filter select { box-sizing:border-box;width:100%;min-height:49px;padding:12px 14px;border:1px solid #b8ced7;border-radius:10px;background:#fff;color:#193e51;font:inherit;font-size:16px; }
#view-account .password-control input { padding-right:76px !important; }
#view-account .field input:focus,#view-account .field select:focus,#view-account .field textarea:focus { outline:2px solid #05788b;outline-offset:2px; }
#view-account .field label,.roster-filter label { display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:#254c60; }
#view-account .field { margin-bottom:20px; }
#view-account .panel>summary { padding:2px 0;font-size:17px;cursor:pointer;font-weight:700; }
.profile-form { margin-top:22px;max-width:800px; }
.form-intro { font-size:14px;line-height:1.6;color:#5a7583;margin:12px 0 24px; }
.profile-group { padding:0;margin:0 0 26px;border:0;min-width:0; }
.profile-group legend { display:block;width:100%;padding:0 0 12px;border-bottom:1px solid #dbe9ed;margin:0 0 20px;color:#276477;font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase; }
.profile-grid { display:grid;grid-template-columns:1fr 1fr;gap:18px; }
.profile-form small,.roster-filter small { display:block;color:#607b88;font-size:12px;line-height:1.5;margin-top:8px; }
.profile-form .optional { font-weight:400;color:#67808b; }
.profile-save { display:flex;align-items:center;flex-wrap:wrap;gap:16px;border-top:1px solid #dbe9ed;padding-top:20px; }
.profile-save p { margin:0;color:#075f70; }
#saved-recovery-code { width:100%;font-family:monospace;font-size:16px;padding:14px;border:1px solid #b8ced7;border-radius:10px; }
#recovery-result[hidden],#reset-form[hidden],#reset-done[hidden] { display:none !important; }
@media(max-width:620px){.profile-grid{grid-template-columns:1fr;gap:0}.profile-save .btn{width:100%}}

/* ---------- one header ----------
   Brand, menu, and who you are. Nothing else lives up here. */

.site-head .who { display:flex;align-items:center;gap:10px;margin:0; }
.who-box { display:flex;flex-direction:column;line-height:1.2;text-align:right; }
.who-name { font-weight:700;font-size:13px;color:#0d2740; }
.who-role { font-size:11px;color:#5d7484; }
.who-out {
  border:1px solid #c5d5de;background:#fff;color:#315c70;
  border-radius:8px;padding:6px 10px;font:inherit;font-size:12px;font-weight:600;
  cursor:pointer;min-height:34px;
}
.who-out:hover { background:#eef5f8; }
.site-nav .nav-dash { font-weight:700; }

/* ---------- breadcrumb ----------
   Where you are inside the dashboard. This replaces the second menu that
   used to appear after signing in. */

.crumbs-bar { border-bottom:1px solid #dce6ec;background:#f7fafc; }
.crumbs {
  display:flex;flex-wrap:wrap;align-items:center;gap:6px;
  padding:10px 0;font-size:13px;color:#5d7484;
}
.crumbs a { color:#0d6c80;text-decoration:none; }
.crumbs a:hover { text-decoration:underline; }
.crumbs [aria-current="page"] { color:#0d2740;font-weight:600; }
.crumbs__sep { color:#9fb3bf; }

/* ---------- dashboard shell ----------
   A working screen, not a landing page: no hero, straight into the work. */

.dash-head { padding:22px 0 6px; }
.dash-head h1 { font-size:clamp(1.4rem,3.6vw,1.9rem);margin:0 0 2px;letter-spacing:-0.02em; }
.dash-head .sub { margin:0;font-size:13px;color:#5d7484; }

.dash-stats {
  display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:10px;margin:18px 0 22px;
}
.dash-stat {
  border:1px solid #dce6ec;border-radius:12px;padding:12px 14px;background:#fff;
}
.dash-stat b {
  display:block;font-family:var(--f-display,inherit);font-weight:700;
  font-size:1.5rem;line-height:1.1;font-variant-numeric:tabular-nums;color:#0d2740;
}
.dash-stat span { font-size:12px;color:#5d7484; }
.dash-stat.is-alert { border-color:#f0a500;background:#fffaf0; }
.dash-stat.is-alert b { color:#8a5d00; }

/* search and filter sit on one line instead of stacking into two panels */
.dash-tools {
  display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;
  margin:0 0 18px;
}
.dash-tools .field { margin:0;flex:1 1 220px;min-width:0; }
.dash-tools .field small { display:block;margin-top:4px;font-size:11px;color:#5d7484; }

/* ---------- mobile: tabs on one line ----------
   Five tabs in a three-column grid wrapped onto two rows and pushed the
   content down the page. A single scrolling strip keeps the header one
   line tall and still reaches every tab. */

@media (max-width:640px) {
  .swimmer-tabs {
    display:flex;grid-template-columns:none;
    overflow-x:auto;scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
    gap:6px;padding:6px;margin:14px 0 18px;
  }
  .swimmer-tabs::-webkit-scrollbar { display:none; }
  .swimmer-tabs { scrollbar-width:none; }
  .swimmer-tabs button {
    flex:0 0 auto;scroll-snap-align:start;
    padding:10px 14px;font-size:13px;white-space:nowrap;
  }
  .site-head .who { gap:8px; }
  .who-box { text-align:left; }
  .dash-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* ---------- header on a phone ----------
   Five menu items wrapping onto two lines pushed the page down and read as
   a list rather than a menu. One line, scrolled sideways, is how every app
   on the same phone does it — and nothing wraps mid-label. */

.site-head .wrap {
  display:flex;align-items:center;gap:10px 14px;flex-wrap:wrap;
}
.site-head .brand { flex:0 0 auto; }
.site-head .who { margin-left:auto;flex:0 0 auto; }

.site-nav {
  display:flex;align-items:center;gap:4px;
  flex:1 1 100%;order:3;
  overflow-x:auto;scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  margin:0;padding:2px 0;
}
.site-nav::-webkit-scrollbar { display:none; }
.site-nav a {
  flex:0 0 auto;white-space:nowrap;          /* no more two-line labels */
  padding:8px 12px;border-radius:9px;
  font-size:14px;font-weight:600;line-height:1.2;
  color:#315c70;text-decoration:none;
}
.site-nav a:hover { background:#eef5f8; }
.site-nav a[aria-current="page"] { background:#067b90;color:#fff; }

@media (min-width:860px) {
  .site-nav { flex:0 1 auto;order:2;overflow:visible; }
  .site-head .who { order:3; }
}

@media (max-width:520px) {
  .site-head .brand { font-size:17px; }
  .who-name { max-width:11ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .site-nav a { padding:7px 10px;font-size:13px; }
}

/* ---------- meet detail ----------
   A time on its own is half a record. The round, the placing and the splits
   are what turn it into one — shown small, so the time is still the thing
   you read first. */

.tag-min {
  display:inline-block;margin-left:6px;padding:1px 6px;
  border:1px solid #cfdde4;border-radius:4px;background:#f4f9fb;
  font-size:10px;font-weight:700;letter-spacing:.04em;color:#456b7c;
  vertical-align:1px;white-space:nowrap;
}

.splits { display:block;margin-top:3px;font-size:11px;color:#5d7484;white-space:nowrap; }
.split { display:inline-block;margin-left:6px;font-variant-numeric:tabular-nums; }
.split:first-child { margin-left:0; }
.split i { font-style:normal;color:#8aa2b0;margin-left:3px; }

/* The personal-best moment. One line, said in seconds. */
.is-pb {
  color:#0b6b50 !important;font-weight:700;
  background:#e8f7f0;border-left:3px solid #0b6b50;
  padding:8px 10px;border-radius:0 8px 8px 0;
}
