.pistofit-tracker-wrap { font-family: 'Jost', 'Century Gothic', sans-serif; }
.pistofit-tracker-wrap .pf-page { max-width: 100%; margin: 0 auto; padding: 0; }
/* PISTO-FIT Recompo Tracker — CSS v1.8 */

#pistofit-app {
  --pf-bg:       #f0f2f7;
  --pf-surface:  #ffffff;
  --pf-surface2: #e8ecf4;
  --pf-border:   #d0d6e8;
  --pf-border2:  #b8c0d8;
  --pf-text:     #0d1117;
  --pf-text2:    #2d3550;
  --pf-text3:    #606880;
  --pf-accent:   #009966;
  --pf-accent2:  #0055cc;
  --pf-accent3:  #cc4400;
  --pf-mono:     'Jost', 'Century Gothic', sans-serif;
  --pf-sans:     'Jost', 'Century Gothic', sans-serif;
  --pf-radius:   8px;
  --pf-shadow:   0 1px 5px rgba(0,0,0,0.10);

  font-family: var(--pf-sans);
  font-size: 15px;
  color: var(--pf-text);
  background: var(--pf-bg);
  padding: 24px;
  border-radius: 12px;
  box-sizing: border-box;
  line-height: 1.5;
}

#pistofit-app *, #pistofit-app *::before, #pistofit-app *::after { box-sizing: border-box; }

/* ── HEADER ── */
.pf-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 18px;
  border-bottom: 2px solid var(--pf-border);
  margin-bottom: 16px;
  flex-wrap: wrap;
  gap: 14px;
}

.pf-logo {
  font-family: 'Jost', 'Century Gothic', sans-serif;
  font-size: 10px;
  font-weight: 300;
  color: var(--pf-text3);
  letter-spacing: 0.38em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.pf-logo strong {
  font-weight: 400;
  color: var(--pf-accent);
  letter-spacing: 0.22em;
}
.pf-title {
  font-family: 'Jost', 'Century Gothic', sans-serif;
  font-size: 23px;
  font-weight: 200;
  letter-spacing: 0.20em;
  color: var(--pf-text);
  text-transform: uppercase;
  margin: 0;
  padding: 0;
  border: none;
  line-height: 1.2;
}
.pf-title em {
  font-style: normal;
  font-weight: 400;
  color: var(--pf-accent);
}

/* KPI bar */
.pf-kpi { display: flex; align-items: center; gap: 0; background: #ffffff; border: 1px solid var(--pf-border2); border-radius: 10px; padding: 0; overflow: hidden; box-shadow: var(--pf-shadow); }
.pf-kpi-item { padding: 10px 18px; text-align: center; }
.pf-kpi-sep { width: 1px; height: 40px; background: var(--pf-border); }
.pf-kpi-val { font-family: var(--pf-mono); font-size: 20px; font-weight: 400; color: var(--pf-text); line-height: 1; }
.pf-kpi-label { font-size: 10px; color: var(--pf-text3); text-transform: uppercase; letter-spacing: 0.07em; margin-top: 3px; }
#pfKpiStart .pf-kpi-val { color: var(--pf-accent); }
#pfKpiGoal  .pf-kpi-val { color: var(--pf-accent3); }
#pfKpiDay   .pf-kpi-val { color: var(--pf-accent2); }

/* ── PROGRESS ── */
.pf-progress-wrap { background: #fff; border: 1px solid var(--pf-border2); border-radius: var(--pf-radius); padding: 14px 22px; margin-bottom: 16px; box-shadow: var(--pf-shadow); }
.pf-progress-label { display: flex; justify-content: space-between; margin-bottom: 9px; font-family: var(--pf-mono); font-size: 14px; color: var(--pf-text2); font-weight: 400; }
.pf-progress-label strong { color: var(--pf-accent); font-size: 15px; }
.pf-progress-track { height: 10px; background: var(--pf-border); border-radius: 5px; overflow: hidden; }
.pf-progress-fill { height: 100%; background: linear-gradient(90deg, var(--pf-accent), var(--pf-accent2)); border-radius: 5px; transition: width 0.6s ease; }

/* ── TABS ── */
.pf-tabs { display: flex; gap: 6px; margin-bottom: 16px; }
.pf-tab { font-family: var(--pf-mono); font-size: 12px; font-weight: 400; letter-spacing: 0.06em; text-transform: uppercase; padding: 8px 16px; border: 2px solid var(--pf-border2); background: #fff; color: var(--pf-text2); cursor: pointer; border-radius: 5px; transition: all 0.15s; }
.pf-tab:hover { border-color: var(--pf-accent); color: var(--pf-accent); }
.pf-tab.active { background: var(--pf-accent); color: #fff; border-color: var(--pf-accent); }
.pf-panel { display: none; }
.pf-panel.active { display: block; }

/* ── FORM ── */
.pf-form { background: #fff; border: 1px solid var(--pf-border2); border-radius: var(--pf-radius); padding: 16px 18px; margin-bottom: 14px; box-shadow: var(--pf-shadow); }
.pf-form-title { font-family: var(--pf-mono); font-size: 11px; color: var(--pf-accent); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 12px; font-weight: 400; }
.pf-form-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(135px, 1fr)); gap: 9px; margin-bottom: 12px; }
.pf-fg { display: flex; flex-direction: column; gap: 3px; }
.pf-fg label { font-family: var(--pf-mono); font-size: 9px; color: var(--pf-text3); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 400; }
.pf-fg input, .pf-fg select { background: var(--pf-surface2); border: 1px solid var(--pf-border2); color: var(--pf-text); font-family: var(--pf-mono); font-size: 13px; padding: 7px 9px; border-radius: 4px; outline: none; transition: border-color 0.15s; width: 100%; -webkit-appearance: none; }
.pf-fg input:focus, .pf-fg select:focus { border-color: var(--pf-accent); background: #fff; box-shadow: 0 0 0 3px rgba(0,153,102,0.1); }
.pf-fg input::placeholder { color: var(--pf-text3); }

.pf-btn-add { font-family: var(--pf-mono); font-size: 13px; font-weight: 400; letter-spacing: 0.07em; text-transform: uppercase; padding: 10px 24px; background: var(--pf-accent); color: #fff; border: none; border-radius: 5px; cursor: pointer; transition: all 0.15s; }
.pf-btn-add:hover { background: #007a50; transform: translateY(-1px); }
.pf-btn-add:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
.pf-saving { font-family: var(--pf-mono); font-size: 11px; color: var(--pf-text3); margin-left: 10px; animation: pfPulse 1s ease-in-out infinite; }
@keyframes pfPulse { 0%,100%{opacity:1} 50%{opacity:0.3} }

/* ── TOOLBAR ── */
.pf-toolbar { display: flex; gap: 7px; margin-bottom: 12px; align-items: center; flex-wrap: wrap; }
.pf-filters { display: flex; gap: 5px; align-items: center; }
.pf-filter-label { font-family: var(--pf-mono); font-size: 11px; color: var(--pf-text3); text-transform: uppercase; font-weight: 400; }
.pf-filter { font-family: var(--pf-mono); font-size: 11px; font-weight: 400; padding: 5px 11px; border: 1px solid var(--pf-border2); background: #fff; color: var(--pf-text2); cursor: pointer; border-radius: 4px; transition: all 0.12s; }
.pf-filter:hover, .pf-filter.active { border-color: var(--pf-accent); color: var(--pf-accent); background: #e6fff6; }
.pf-fw { border-color: #00a86e; color: #007a50; }
.pf-fr { border-color: #cc1133; color: #bb0022; }
.pf-fs { border-color: #0055cc; color: #0044aa; }
.pf-btn-sm { font-family: var(--pf-mono); font-size: 11px; font-weight: 400; padding: 6px 11px; border: 1px solid var(--pf-border2); background: #fff; color: var(--pf-text2); cursor: pointer; border-radius: 4px; transition: all 0.12s; }
.pf-btn-sm:hover { border-color: var(--pf-accent2); color: var(--pf-accent2); }
.pf-danger { color: #bb0022 !important; border-color: #eeb0b8 !important; }
.pf-danger:hover { background: #fff0f2 !important; }
.pf-count { font-family: var(--pf-mono); font-size: 11px; color: var(--pf-text3); margin-left: auto; font-weight: 400; }

/* ── TABLE ── */
.pf-table-wrap { overflow-x: auto; border-radius: var(--pf-radius); border: 1px solid var(--pf-border); box-shadow: var(--pf-shadow); -webkit-overflow-scrolling: touch; }

.pf-table { width: 100%; border-collapse: collapse; font-size: 13px; background: #fff; min-width: 900px; table-layout: fixed; }

.pf-table thead tr { background: #e0e5f0; border-bottom: 2px solid var(--pf-border2); }
.pf-table th { font-family: var(--pf-mono); font-size: 10px; letter-spacing: 0.04em; text-transform: uppercase; color: var(--pf-text2); padding: 9px 5px; text-align: center; white-space: nowrap; font-weight: 400; overflow: hidden; }

/* Column widths */
.pf-table th:nth-child(1)  { text-align:left; padding-left:8px; width:62px;  } /* Data */
.pf-table th:nth-child(2)  { width:52px;  } /* Waga */
.pf-table th:nth-child(3)  { width:44px;  } /* Delta */
.pf-table th:nth-child(4)  { width:54px;  } /* G/L */
.pf-table th:nth-child(5)  { width:50px;  } /* od startu */
.pf-table th:nth-child(6)  { width:44px;  } /* Do 80 */
.pf-table th:nth-child(7)  { width:58px;  } /* Po gymie */
.pf-table th:nth-child(8)  { width:48px;  } /* T5d */
.pf-table th:nth-child(9)  { width:112px; } /* Whoosh */
.pf-table th:nth-child(10) { width:36px;  } /* RSW */
.pf-table th:nth-child(11) { width:82px;  } /* Metabolic */
.pf-table th:nth-child(12) { width:90px;  } /* Fat/Lean */
.pf-table th:nth-child(13) { width:100px; } /* Lokalizacja */
.pf-table th:nth-child(14) { width:60px;  } /* Kcal */
.pf-table th:nth-child(15) { width:74px;  } /* Pompki */
.pf-table th:nth-child(16) { width:58px;  } /* Del */

.pf-table tbody tr { border-bottom: 1px solid var(--pf-border); transition: background 0.12s; position: relative; }
.pf-table tbody tr:hover { background: #fff0f0; }
.pf-table tbody tr:nth-child(even) { background: #f7f9ff; }
.pf-table tbody tr:nth-child(even):hover { background: #fff0f0; }
.pf-table tbody tr:last-child { border-bottom: none; }

.pf-table td { padding: 8px 5px; text-align: center; white-space: nowrap; font-family: var(--pf-mono); font-size: 13px; color: var(--pf-text); font-weight: 400; overflow: hidden; text-overflow: ellipsis; }
.pf-table td:first-child { text-align: left; padding-left: 8px; font-size: 12px; color: var(--pf-text2); }

.pf-td-weight { font-size: 15px; font-weight: 400; }
.pf-td-neg { color: #006644; font-weight: 400; }
.pf-td-pos { color: #aa0022; font-weight: 400; }
.pf-td-zero { color: var(--pf-text3); }
.pf-td-from-start { color: var(--pf-accent2); font-weight: 400; }

/* G/L combined column */
.pf-gl-neg { color: #006644; font-weight: 400; font-size: 13px; }
.pf-gl-pos { color: #aa0022; font-weight: 400; font-size: 13px; }

/* RSW badge */
.pf-rsw-badge { display: inline-block; width: 28px; height: 28px; border-radius: 6px; font-family: var(--pf-mono); font-size: 13px; font-weight: 400; line-height: 28px; text-align: center; }
.pf-rsw-W { background: #c0f0dc; color: #005533; border: 1px solid #70d0a8; }
.pf-rsw-R { background: #ffd0d8; color: #880011; border: 1px solid #f090a0; }
.pf-rsw-S { background: #c8deff; color: #003399; border: 1px solid #80aaee; }

/* Fat/lean chips */
.pf-fat-lean { font-size: 12px; padding: 3px 8px; border-radius: 5px; white-space: nowrap; font-weight: 400; }
.pf-fl-fat-down { background: #c0f0dc; color: #005533; border: 1px solid #70d0a8; }
.pf-fl-lean     { background: #c8deff; color: #003399; border: 1px solid #80aaee; }
.pf-fl-fat-up   { background: #ffe0d0; color: #882200; border: 1px solid #f0aa88; }
.pf-fl-neut     { background: #e8ecf4; color: #4a5070; }

/* Location badge */
.pf-loc { font-size: 11px; padding: 2px 7px; border-radius: 4px; font-weight: 400; white-space: nowrap; }
.pf-loc-home { background: #e8f4ff; color: #003388; border: 1px solid #aaccee; }
.pf-loc-gym  { background: #fff0e0; color: #884400; border: 1px solid #ddaa66; }
.pf-loc-away { background: #f0e8ff; color: #440088; border: 1px solid #bb88ee; }

/* Push-ups cell — editable inline */
.pf-pushups-input { font-family: var(--pf-mono); font-size: 13px; font-weight: 400; color: var(--pf-accent2); background: transparent; border: none; width: 44px; text-align: center; cursor: pointer; padding: 2px 0; border-bottom: 1px dashed var(--pf-border2); outline: none; }
.pf-pushups-input:focus { border-bottom: 2px solid var(--pf-accent2); background: #f0f6ff; border-radius: 3px; }
.pf-pushups-input:hover { border-bottom-color: var(--pf-accent2); }

.pf-whoosh-text { font-size: 12px; color: var(--pf-text2); font-weight: 400; max-width: 108px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }

/* Delete cell */
.pf-del-cell { width: 58px; text-align: center; padding: 0 4px !important; }
.pf-btn-del { opacity: 0; pointer-events: none; background: #bb0022; border: none; color: #fff; font-size: 10px; font-family: var(--pf-mono); font-weight: 400; padding: 4px 8px; border-radius: 4px; cursor: pointer; transition: opacity 0.15s; white-space: nowrap; }
.pf-table tbody tr:hover .pf-btn-del { opacity: 1; pointer-events: auto; }
.pf-btn-del:hover { background: #880011; }

/* ── DASHBOARD ── */
.pf-stats-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 10px; margin-bottom: 16px; }
.pf-stat-card { background: #fff; border: 1px solid var(--pf-border2); border-radius: var(--pf-radius); padding: 13px 15px; position: relative; overflow: hidden; box-shadow: var(--pf-shadow); }
.pf-stat-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--pf-accent), transparent); }
.pf-stat-card.a2::before { background: linear-gradient(90deg, var(--pf-accent2), transparent); }
.pf-stat-card.a3::before { background: linear-gradient(90deg, var(--pf-accent3), transparent); }
.pf-stat-card.push::before { background: linear-gradient(90deg, #7700cc, transparent); }
.pf-stat-val { font-family: var(--pf-mono); font-size: 22px; font-weight: 400; color: var(--pf-text); line-height: 1; margin-bottom: 5px; }
.pf-stat-val .pf-unit { font-size: 13px; color: var(--pf-text3); font-weight: 400; margin-left: 2px; }
.pf-stat-label { font-size: 10px; color: var(--pf-text3); text-transform: uppercase; letter-spacing: 0.07em; font-weight: 400; }

/* challenge card */
.pf-challenge-card { background: linear-gradient(135deg, #f0f8ff 0%, #e8f0ff 100%); border: 2px solid #aaccee; }
.pf-challenge-card::before { background: linear-gradient(90deg, #0055cc, #7700cc); }
.pf-challenge-val { font-family: var(--pf-mono); font-size: 36px; font-weight: 400; color: #0055cc; line-height: 1; }
.pf-challenge-sub { font-size: 12px; color: #4a5070; margin-top: 4px; }

/* ── CHARTS ── */
.pf-chart-wrap { background: #fff; border: 1px solid var(--pf-border2); border-radius: var(--pf-radius); padding: 16px; margin-bottom: 14px; box-shadow: var(--pf-shadow); }
.pf-chart-title { font-family: var(--pf-mono); font-size: 11px; color: var(--pf-text2); font-weight: 400; text-transform: uppercase; letter-spacing: 0.08em; margin-bottom: 12px; }
.pf-clickable { cursor: pointer; transition: box-shadow 0.15s; }
.pf-clickable:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.12); }
.pf-clickable:hover .pf-chart-title { color: var(--pf-accent2); }
.pf-expand { font-size: 9px; color: var(--pf-text3); float: right; padding: 1px 5px; border: 1px solid var(--pf-border2); border-radius: 3px; }
.pf-clickable:hover .pf-expand { border-color: var(--pf-accent2); color: var(--pf-accent2); }
.pf-rsw-legend { display: flex; flex-direction: column; gap: 7px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--pf-border); }
.pf-rsw-row { display: flex; align-items: center; gap: 7px; }
.pf-rsw-name { font-size: 11px; color: var(--pf-text); font-weight: 400; }
.pf-rsw-desc { font-size: 10px; color: var(--pf-text3); }

/* ── MODAL ── */
.pf-modal { display: none; position: fixed; inset: 0; background: rgba(10,14,30,0.75); z-index: 99999; align-items: center; justify-content: center; padding: 20px; }
.pf-modal.open { display: flex; }
.pf-modal-inner { background: #ffffff; border: 2px solid var(--pf-border2); border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,0.3); padding: 22px; width: 100%; max-width: 960px; max-height: 90vh; display: flex; flex-direction: column; gap: 14px; animation: pfModalIn 0.2s ease; }
@keyframes pfModalIn { from{transform:scale(0.96);opacity:0} to{transform:scale(1);opacity:1} }
.pf-modal-header { display: flex; align-items: center; justify-content: space-between; }
.pf-modal-title { font-family: var(--pf-mono); font-size: 13px; color: var(--pf-text2); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 400; }
.pf-modal-close { font-size: 18px; color: var(--pf-text3); background: none; border: 1px solid var(--pf-border2); cursor: pointer; padding: 3px 9px; border-radius: 4px; transition: all 0.1s; }
.pf-modal-close:hover { color: #bb0022; background: #ffd0d8; border-color: #f090a0; }
.pf-modal-canvas-wrap { position: relative; flex: 1; min-height: 380px; max-height: 65vh; }

/* ── TOAST ── */
.pf-toast { position: fixed; bottom: 24px; right: 24px; background: var(--pf-accent); color: #fff; font-family: var(--pf-mono); font-size: 13px; font-weight: 400; padding: 11px 18px; border-radius: 6px; transform: translateY(80px); opacity: 0; transition: all 0.25s; z-index: 100000; pointer-events: none; box-shadow: 0 4px 16px rgba(0,153,102,0.4); }
.pf-toast.show { transform: translateY(0); opacity: 1; }

/* ── AUTO-FILL HINT ── */
.pf-fg input[data-manual=""], .pf-fg select[data-manual=""] { border-left: 3px solid var(--pf-accent); }

@media (max-width: 640px) {
  #pistofit-app { padding: 12px; }
  .pf-kpi { flex-wrap: wrap; }
  .pf-form-grid { grid-template-columns: repeat(2,1fr); }
  .pf-stats-grid { grid-template-columns: repeat(2,1fr); }
  .pf-modal-inner { padding: 14px; }
  .pf-modal-canvas-wrap { min-height: 260px; }
}

.pf-pu-cell { display: flex; align-items: center; gap: 3px; justify-content: center; }
.pf-pushups-save { font-size: 12px; font-weight: 400; width: 22px; height: 22px; border-radius: 4px; border: 1px solid #d0d6e8; background: #e8ecf4; color: #606880; cursor: pointer; padding: 0; line-height: 1; transition: all 0.15s; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pf-pushups-save:hover { background: #009966; color: #fff; border-color: #009966; }

.pf-heatmap-wrap{display:flex;flex-direction:column;gap:3px;min-width:600px;}
.pf-heatmap-row{display:flex;align-items:center;gap:3px;}
.pf-heatmap-month{font-family:'Jost','Century Gothic',sans-serif;font-size:9px;color:#9098b0;width:28px;flex-shrink:0;text-transform:uppercase;}
.pf-hm-day{width:18px;height:18px;border-radius:3px;flex-shrink:0;cursor:default;transition:transform 0.1s;}
.pf-hm-day:hover{transform:scale(1.3);z-index:10;}
.pf-hm-empty{background:#e8ecf4;}.pf-hm-W{background:#009966;}.pf-hm-R{background:#cc1133;}.pf-hm-S{background:#0055cc;}.pf-hm-none{background:#e0e4f0;}
.pf-heatmap-legend{display:flex;gap:12px;margin-top:8px;align-items:center;flex-wrap:wrap;}
.pf-hm-leg{display:flex;align-items:center;gap:5px;font-family:'Jost','Century Gothic',sans-serif;font-size:10px;color:#2d3550;}
.pf-hm-dot{width:12px;height:12px;border-radius:2px;}
/* ── FOOTER ── */
.pf-footer{max-width:1440px;margin:0 auto;padding:18px 24px;text-align:center;font-family: 'Jost', 'Century Gothic', sans-serif;font-size:13px;font-weight:400;letter-spacing:0.08em;color:#606880;border-top:2px solid #d0d6e8;margin-top:8px;}
.pf-footer span{color:#009966;}
/* WordPress plugin scoped overrides */
.pistofit-tracker-wrap { display: block; width: 100%; }