/* Estilos específicos do módulo de fisiologia (cardio, sono, recuperação e treino). Complementam web/css/app.css. */

/* ---------- Indicadores clicáveis ---------- */
a.kpi { display: block; color: inherit; text-decoration: none !important; transition: border-color .15s, transform .15s var(--ease); }
a.kpi:hover { border-color: var(--border-2); transform: translateY(-1px); }

/* ---------- Recuperação / prontidão ---------- */
.pc-ready { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.pc-ready .ring-wrap { flex: none; }
.pc-rec-title { font-size: 16px; letter-spacing: -0.015em; line-height: 1.3; }
.pc-answer { font-size: 19px; letter-spacing: -0.02em; line-height: 1.3; }
.pc-reasons { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pc-reasons li { display: flex; gap: 6px; align-items: flex-start; font-size: 13px; color: var(--text-2); }
.pc-reasons li .icon { color: var(--accent); flex: none; margin-top: 2px; }
.pc-vendor { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-radius: var(--r-sm); background: var(--surface); border: 1px solid var(--border); }
.pc-vendor strong { font-size: 18px; }
.pc-vendor p { flex-basis: 100%; margin: 0; }
.pc-missing { border-radius: var(--r-sm); border: 1px dashed var(--border-2); padding: 10px 12px; }
.pc-missing .strong { display: flex; align-items: center; gap: 6px; }
.pc-missing .strong .icon { color: var(--warning); }
.pc-missing ul { margin: 0; padding-left: 18px; font-size: 12.5px; color: var(--text-2); display: flex; flex-direction: column; gap: 3px; }
.pc-signals { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.pc-signals li { display: flex; gap: 8px; align-items: flex-start; font-size: 13px; color: var(--text-2); padding: 9px 11px; border-radius: var(--r-sm); background: var(--surface); }
.pc-signals li .icon { flex: none; margin-top: 1px; color: var(--accent); }
.pc-signals li.attention { background: var(--warning-soft); }
.pc-signals li.attention .icon { color: var(--warning); }

/* ---------- Sono ---------- */
.sl-night { display: flex; gap: 20px; flex-wrap: wrap; align-items: flex-end; }
.sl-night-main { flex: 1; min-width: 240px; }
.sl-clock { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.sl-clock > div:not(.sl-clock-line) { display: flex; flex-direction: column; gap: 2px; }
.sl-clock strong { font-size: 17px; letter-spacing: -0.01em; }
.sl-clock-line { flex: 0 1 80px; height: 2px; border-radius: 1px; background: linear-gradient(90deg, var(--s7), var(--s4)); opacity: .7; }
.sl-recs, .tr-recs { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.sl-rec { padding: 12px 14px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--border); }
.sl-rec h4 { font-size: 13.5px; margin-bottom: 4px; letter-spacing: -0.01em; }
.sl-rec .icon { display: inline-block; vertical-align: -2px; }

/* ---------- Cardiovascular ---------- */
.cd-cats { display: flex; flex-direction: column; gap: 4px; }
.cd-cat { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 10px; font-size: 13px; color: var(--text-3); border: 1px solid transparent; }
.cd-cat.current { background: var(--surface-2); border-color: var(--border-2); color: var(--text); font-weight: 600; }
.cd-protocol { margin: 0; padding: 10px 14px 12px 30px; font-size: 12.5px; color: var(--text-2); display: flex; flex-direction: column; gap: 5px; }
.cd-bp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cd-bp-grid fieldset { border: 1px solid var(--border); border-radius: var(--r); padding: 10px 14px 14px; margin: 0; min-width: 0; }
.cd-bp-grid legend { font-size: 12.5px; font-weight: 600; color: var(--text-2); padding: 0 6px; }
.cd-bp-grid .form-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- Treinamento ---------- */
.tr-table td { vertical-align: middle; }
.tr-click { cursor: pointer; }
.tr-click:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.list-item.tr-click { border-radius: 10px; padding-left: 8px; padding-right: 8px; transition: background .12s; }
.list-item.tr-click:hover { background: var(--surface); }
.tr-sport-icon { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: var(--surface-2); color: var(--text-3); flex: none; }
.tr-mini { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.tr-swatch { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.tr-plan { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.tr-plan-day { padding: 10px 12px; border-radius: var(--r-sm); background: var(--surface); border: 1px solid var(--border); }
.tr-plan-head { display: flex; gap: 6px; align-items: baseline; font-size: 13px; margin-bottom: 6px; flex-wrap: wrap; }
.tr-plan-head span { color: var(--text-3); }
.tr-plan-day ul { margin: 0; padding-left: 16px; font-size: 12.5px; color: var(--text-2); display: flex; flex-direction: column; gap: 3px; }
.tr-set-row { display: grid; grid-template-columns: minmax(0, 2.4fr) repeat(4, minmax(0, 1fr)) 38px; gap: 6px; align-items: center; margin-bottom: 6px; }
.tr-set-row .input { height: 36px; padding: 0 10px; }
.tr-day-edit { padding: 12px 14px; border-radius: var(--r); border: 1px solid var(--border); background: var(--surface); margin-bottom: 10px; }

@media (max-width: 720px) {
  .pc-ready { flex-direction: column; align-items: stretch; }
  .pc-ready .ring-wrap { align-self: center; }
  .cd-bp-grid { grid-template-columns: 1fr; }
  .cd-bp-grid .form-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tr-set-row { grid-template-columns: repeat(4, minmax(0, 1fr)) 38px; }
  .tr-set-row input[name="exercise"] { grid-column: 1 / -1; }
  .sl-clock-line { display: none; }
}
.tr-cycles td:first-child, .tr-cycles th:first-child { white-space: nowrap; }
