/* =============================================
   TWA «Лист тренера» v2 — Стили
   ============================================= */

:root {
  --bg:     var(--tg-theme-bg-color,           #0f0f1a);
  --bg2:    var(--tg-theme-secondary-bg-color,  #1a1a2e);
  --text:   var(--tg-theme-text-color,          #eaeaea);
  --hint:   var(--tg-theme-hint-color,          #888);
  --btn:    var(--tg-theme-button-color,         #7c3aed);
  --accent: #7c3aed;
  --accent2:#5b21b6;
  --success:#10b981;
  --danger: #ef4444;
  --warn:   #f59e0b;
  --card:   rgba(255,255,255,0.05);
  --border: rgba(255,255,255,0.08);
  --r:      14px;
  --rs:     8px;
  --nav-h:  64px;
  --hdr-h:  58px;
}

*{box-sizing:border-box;margin:0;padding:0;}

body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:var(--bg);color:var(--text);
  min-height:100dvh;overflow-x:hidden;
  -webkit-tap-highlight-color:transparent;
}

#app{min-height:100dvh;}

/* ── TYPOGRAPHY ── */
h1{font-size:24px;font-weight:700;margin-bottom:8px;}
h2{font-size:20px;font-weight:600;margin-bottom:6px;}
h3{font-size:17px;font-weight:600;}
h4{font-size:14px;font-weight:600;margin-bottom:8px;color:var(--hint);}
p{line-height:1.5;}
.hint{color:var(--hint);font-size:13px;line-height:1.5;}
.required{color:var(--danger);}

/* ── LAYOUT ── */
.screen-pad{padding:32px 20px 20px;max-width:480px;margin:0 auto;}
.center-screen{display:flex;flex-direction:column;align-items:center;
  justify-content:center;min-height:60vh;gap:16px;text-align:center;}
.center-col{display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px 20px;}
.tab-pad{padding:16px 16px 8px;max-width:480px;margin:0 auto;}
.tab-content{overflow-y:auto;padding-top:var(--hdr-h);padding-bottom:var(--nav-h);min-height:100dvh;}

/* ── HEADER ── */
.app-header{
  position:fixed;top:0;left:0;right:0;height:var(--hdr-h);
  background:var(--bg2);border-bottom:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;z-index:100;
}
.app-title{font-size:16px;font-weight:700;}
.app-sub{font-size:12px;color:var(--hint);}
.duty-badge{font-size:11px;padding:4px 10px;border-radius:20px;font-weight:600;}
.duty-badge.active{background:rgba(16,185,129,.15);color:var(--success);animation:pulse 2s infinite;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.6}}

/* ── BOTTOM NAV ── */
.bottom-nav{
  position:fixed;bottom:0;left:0;right:0;height:var(--nav-h);
  background:var(--bg2);border-top:1px solid var(--border);
  display:flex;z-index:100;padding-bottom:env(safe-area-inset-bottom);
}
.nav-btn{
  flex:1;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:2px;background:none;border:none;
  color:var(--hint);font-size:10px;cursor:pointer;padding:8px 0;transition:color .2s;
}
.nav-btn span{font-size:18px;}
.nav-btn.active{color:var(--accent);}

/* ── FORMS ── */
.form-group{margin-bottom:16px;}
.form-group label{display:block;font-size:13px;color:var(--hint);margin-bottom:6px;font-weight:500;}
input,select,textarea{
  width:100%;background:var(--card);border:1px solid var(--border);border-radius:var(--rs);
  color:var(--text);padding:12px 14px;font-size:15px;outline:none;
  transition:border-color .2s;font-family:inherit;
}
input:focus,select:focus,textarea:focus{border-color:var(--accent);}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%23888' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;}
select option{background:#1a1a2e;}

/* ── BUTTONS ── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  padding:10px 18px;border-radius:var(--rs);border:none;
  font-size:14px;font-weight:600;cursor:pointer;
  transition:opacity .2s,transform .1s;font-family:inherit;
}
.btn:active{transform:scale(.97);}
.btn-primary{background:var(--accent);color:#fff;}
.btn-danger{background:rgba(239,68,68,.12);color:var(--danger);border:1px solid rgba(239,68,68,.25);}
.btn-warn{background:rgba(245,158,11,.12);color:var(--warn);border:1px solid rgba(245,158,11,.25);}
.btn-sm{padding:6px 12px;font-size:12px;}
.btn-full{width:100%;margin-top:8px;padding:14px;font-size:16px;}
.btn-close{background:none;border:none;color:var(--hint);font-size:18px;cursor:pointer;padding:4px 8px;}

/* ── SPINNER ── */
.spinner{width:36px;height:36px;border:3px solid var(--border);border-top-color:var(--accent);
  border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}

.logo{font-size:56px;margin-bottom:8px;}

/* ── PIN ── */
.pin-dots{display:flex;gap:14px;margin:20px 0;}
.pin-dots span{width:18px;height:18px;border-radius:50%;border:2px solid var(--border);transition:.15s;}
.pin-dots span.filled{background:var(--accent);border-color:var(--accent);}
.pin-pad{display:grid;grid-template-columns:repeat(3,72px);gap:12px;}
.pin-key{width:72px;height:72px;border-radius:50%;background:var(--card);border:1px solid var(--border);
  font-size:22px;font-weight:500;color:var(--text);cursor:pointer;transition:.15s;}
.pin-key:active{background:var(--accent);color:#fff;}
.pin-key-empty{background:transparent;border:none;cursor:default;}

/* ── SECTION HEADER ── */
.section-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.month-nav{display:flex;align-items:center;gap:8px;font-size:13px;}
.month-nav button{background:var(--card);border:1px solid var(--border);border-radius:6px;
  color:var(--text);padding:4px 10px;cursor:pointer;font-size:16px;}

/* ── CATEGORY PICKER ── */
.cat-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.cat-btn{background:var(--card);border:1px solid var(--border);border-radius:var(--rs);
  color:var(--hint);padding:10px 8px;font-size:13px;font-weight:600;cursor:pointer;
  text-align:center;line-height:1.4;transition:.2s;}
.cat-btn small{display:block;font-weight:400;color:var(--hint);}
.cat-btn.active{border-color:var(--accent);background:rgba(124,58,237,.15);color:var(--text);}

/* ── SUMMARY CARDS ── */
.summary-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px;}
.summary-card{background:var(--card);border:1px solid var(--border);border-radius:var(--rs);padding:12px 8px;text-align:center;}
.summary-card.accent{background:rgba(124,58,237,.1);border-color:rgba(124,58,237,.3);}
.s-val{font-size:18px;font-weight:700;}
.s-lbl{font-size:11px;color:var(--hint);margin-top:2px;}

/* ── BRANCH BLOCK ── */
.branch-block{background:var(--card);border:1px solid var(--border);border-radius:var(--rs);
  padding:12px 14px;margin-bottom:10px;}
.branch-title{font-size:14px;font-weight:600;margin-bottom:8px;}
.branch-stats{display:flex;gap:12px;font-size:13px;color:var(--hint);flex-wrap:wrap;}
.branch-sum{font-size:15px;font-weight:700;margin-top:8px;color:var(--accent);}

/* ── HISTORY ITEMS ── */
.history-item{background:var(--card);border:1px solid var(--border);border-radius:var(--rs);
  padding:10px 12px;margin-bottom:8px;}
.hi-main{display:flex;align-items:center;gap:8px;margin-bottom:4px;flex-wrap:wrap;}
.hi-client{font-weight:600;font-size:14px;}
.hi-sub{font-size:12px;color:var(--hint);}
.hi-cat{font-size:11px;padding:2px 8px;border-radius:20px;font-weight:700;}
.cat-1{background:rgba(16,185,129,.15);color:#10b981;}
.cat-2{background:rgba(124,58,237,.15);color:#a78bfa;}
.cat-3{background:rgba(245,158,11,.15);color:#f59e0b;}

/* Долг / оплачено badges */
.debt-badge{font-size:11px;padding:2px 8px;border-radius:20px;font-weight:700;
  background:rgba(239,68,68,.15);color:var(--danger);}
.paid-badge{font-size:11px;padding:2px 8px;border-radius:20px;font-weight:700;
  background:rgba(16,185,129,.15);color:var(--success);}

/* ── DEBT TOGGLE ── */
.debt-toggle{margin-bottom:16px;}
.toggle-row{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;}
.toggle-row input{display:none;}
.toggle-track{position:relative;width:44px;height:24px;border-radius:12px;
  background:var(--border);flex-shrink:0;transition:.2s;}
.toggle-thumb{position:absolute;top:2px;left:2px;width:20px;height:20px;
  border-radius:50%;background:#fff;transition:.2s;}
.toggle-row input:checked ~ .toggle-track{background:var(--accent);}
.toggle-row input:checked ~ .toggle-track .toggle-thumb{left:22px;}

/* ── DUTY ── */
.duty-active-card{background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.2);
  border-radius:var(--r);padding:24px;text-align:center;width:100%;}
.duty-idle-card{background:var(--card);border:1px solid var(--border);border-radius:var(--r);
  padding:24px;text-align:center;width:100%;color:var(--hint);}
.duty-icon{font-size:48px;margin-bottom:8px;}
.duty-branch{font-size:18px;font-weight:600;margin-bottom:4px;}
.duty-timer{font-size:36px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--success);margin:8px 0;}
.duty-start{font-size:12px;color:var(--hint);}

/* ── TODAY TAB ── */
.today-card{background:var(--card);border:1px solid var(--border);border-radius:var(--rs);
  padding:12px;margin-bottom:10px;}
.today-card-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.today-time{font-size:12px;color:var(--hint);white-space:nowrap;font-variant-numeric:tabular-nums;}
.today-label{font-weight:600;font-size:14px;flex:1;}
.today-sub{font-size:12px;color:var(--hint);margin-top:4px;}
.today-actions{display:flex;gap:8px;margin-top:10px;}
.warn-text{color:var(--warn);}

.confirmed-card{border-color:rgba(16,185,129,.3);background:rgba(16,185,129,.05);}
.cancelled-card{border-color:rgba(239,68,68,.2);background:rgba(239,68,68,.04);opacity:.7;}
.pending-card{border-color:rgba(245,158,11,.25);}
.duty-card{border-color:rgba(100,100,100,.25);background:rgba(100,100,100,.06);}

.status-badge{font-size:11px;padding:2px 8px;border-radius:20px;font-weight:700;white-space:nowrap;}
.status-badge.confirmed{background:rgba(16,185,129,.15);color:var(--success);}
.status-badge.cancelled{background:rgba(239,68,68,.15);color:var(--danger);}
.status-badge.pending{background:rgba(245,158,11,.15);color:var(--warn);}

.pending-badge{background:rgba(239,68,68,.15);color:var(--danger);
  font-size:12px;padding:4px 10px;border-radius:20px;font-weight:700;}

.empty-state{text-align:center;padding:40px 20px;font-size:32px;color:var(--hint);}
.empty-state p{margin-top:8px;font-size:15px;}

/* ── РАСПИСАНИЕ: ТАБЛИЦА ── */
.schedule-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -4px;}
.sched-table{border-collapse:collapse;width:max-content;min-width:100%;}
.sched-table th{
  background:var(--bg2);padding:8px 6px;font-size:12px;font-weight:600;
  color:var(--hint);text-align:center;position:sticky;top:0;z-index:2;
  border-bottom:1px solid var(--border);white-space:nowrap;
}
.sched-time-col{width:44px;}
.sched-time{font-size:11px;color:var(--hint);padding:4px 6px;text-align:right;
  white-space:nowrap;font-variant-numeric:tabular-nums;vertical-align:top;}
.sched-cell{padding:2px 3px;min-width:42px;vertical-align:top;}
.sched-table tr{border-bottom:1px solid rgba(255,255,255,.03);}

.slot-pill{
  font-size:10px;font-weight:600;padding:3px 5px;border-radius:4px;
  margin-bottom:2px;cursor:pointer;text-align:center;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:58px;
}
.slot-pill:active{opacity:.7;}

.legend{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;}
.legend-item{font-size:11px;padding:3px 10px;border-radius:20px;font-weight:600;}

/* ── ADMIN TABLE ── */
.admin-table-wrap{overflow-x:auto;border-radius:var(--rs);border:1px solid var(--border);}
.admin-table{width:100%;border-collapse:collapse;font-size:13px;}
.admin-table th{background:var(--bg2);padding:10px 10px;text-align:left;
  font-weight:600;color:var(--hint);font-size:12px;white-space:nowrap;}
.admin-table td{padding:10px 10px;border-top:1px solid var(--border);white-space:nowrap;}
.admin-table tbody tr.clickable{cursor:pointer;}
.admin-table tbody tr.clickable:hover td{background:var(--card);}
.admin-table tfoot td{background:var(--bg2);}
.total-cell{font-weight:700;color:var(--accent);}

/* ── STAFF CARDS ── */
.staff-card{display:flex;align-items:center;justify-content:space-between;
  background:var(--card);border:1px solid var(--border);border-radius:var(--rs);
  padding:12px 14px;margin-bottom:10px;gap:12px;}
.staff-info{flex:1;min-width:0;}
.staff-fio{font-weight:600;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.staff-meta{font-size:12px;color:var(--hint);margin-top:2px;}
.staff-actions{display:flex;gap:6px;flex-shrink:0;}

/* ── MODAL ── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);
  display:flex;align-items:flex-end;justify-content:center;z-index:200;animation:fadeIn .2s;}
.modal{background:var(--bg2);border-radius:var(--r) var(--r) 0 0;padding:20px;
  width:100%;max-width:480px;max-height:90dvh;overflow-y:auto;animation:slideUp .25s;}
.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;}
@keyframes fadeIn{from{opacity:0}}
@keyframes slideUp{from{transform:translateY(60px);opacity:0}}

/* ── TOAST ── */
.toast{
  position:fixed;bottom:calc(var(--nav-h) + 12px);left:50%;
  transform:translateX(-50%) translateY(20px);
  background:#333;color:#fff;padding:10px 18px;border-radius:20px;
  font-size:13px;font-weight:500;z-index:300;
  opacity:0;transition:.25s;white-space:nowrap;max-width:90vw;text-align:center;
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast-success{background:var(--success);}
.toast-error{background:var(--danger);}
.toast-info{background:#374151;}

/* ── ДОПОЛНЕНИЯ К style.css v3 ── */
/* Вставить в конец существующего style.css */

/* Кнопка-иконка в хедере */
.btn-icon{background:none;border:none;font-size:20px;cursor:pointer;padding:4px;line-height:1;}

/* Предупреждение об абонементе */
.warn-banner{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.3);
  border-radius:var(--rs);padding:10px 14px;font-size:13px;color:var(--warn);margin-bottom:12px;}

/* Badges */
.drop-badge{font-size:11px;padding:2px 8px;border-radius:20px;font-weight:700;
  background:rgba(59,130,246,.15);color:#60a5fa;}

/* Duty в расписании — блок */
.slot-duty-block{border-radius:0;margin-bottom:0;font-size:10px;text-align:center;}

/* Форма премии/штрафа */
.adj-form{background:var(--card);border:1px solid var(--border);border-radius:var(--rs);
  padding:14px;margin:16px 0;}
.adj-form h4{margin-bottom:10px;}

/* Контроль */
.control-section{background:var(--card);border:1px solid var(--border);
  border-radius:var(--rs);padding:14px;margin-bottom:12px;}
.control-title{font-size:14px;font-weight:700;margin-bottom:10px;}
.control-title.danger{color:var(--danger);}
.control-title.warn{color:var(--warn);}
.control-title.hint-title{color:var(--hint);}
.control-item{padding:8px 0;border-bottom:1px solid var(--border);}
.control-item:last-child{border-bottom:none;}
.ci-main{font-size:13px;font-weight:500;}
.ci-sub{font-size:12px;color:var(--hint);margin-top:2px;}

/* ── Добавить в конец style.css ── */

/* ── КЛИЕНТЫ: список в вкладке Списание ── */
.client-row {
  display:flex;align-items:center;gap:10px;
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--rs);padding:10px 14px;margin-bottom:8px;cursor:pointer;
}
.client-row:active { background:rgba(124,58,237,.1); }
.cr-name { font-weight:600;font-size:14px;flex:1; }
.cr-meta { font-size:12px;color:var(--hint); }
.cr-arrow { color:var(--hint);font-size:18px;flex-shrink:0; }

/* ── ПРОФИЛЬ КЛИЕНТА ── */
.client-header {
  display:flex;align-items:center;gap:14px;
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r);padding:16px;margin-bottom:16px;
}
.client-avatar {
  width:52px;height:52px;border-radius:50%;background:var(--accent);
  display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:700;color:#fff;flex-shrink:0;
}
.client-name { font-size:17px;font-weight:700;margin-bottom:4px; }
.client-meta { font-size:12px;color:var(--hint); }

/* ── АБОНЕМЕНТ ── */
.sub-card {
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r);padding:14px;margin-bottom:12px;
}
.active-sub { border-color:rgba(124,58,237,.3);background:rgba(124,58,237,.05); }
.past-sub   { cursor:pointer; }
.past-sub:active { background:rgba(255,255,255,.07); }
.new-sub-card { text-align:center;padding:20px; }
.sub-card-header {
  display:flex;justify-content:space-between;align-items:center;
  font-size:14px;font-weight:600;margin-bottom:10px;
}

/* ── ЦЕЛИ ── */
.goals-section { margin-top:8px; }
.goals-header { display:flex;justify-content:space-between;align-items:center;margin-bottom:8px; }
.goals-title { font-size:14px;font-weight:600; }
.goal-item {
  display:flex;justify-content:space-between;align-items:flex-start;
  background:rgba(124,58,237,.08);border-left:3px solid var(--accent);
  border-radius:4px;padding:8px 10px;margin-bottom:6px;font-size:13px;gap:8px;
}

/* ── КОНСПЕКТЫ ── */
.session-item {
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--rs);padding:10px 12px;margin-bottom:8px;
}
.overdue-session { border-color:rgba(239,68,68,.35);background:rgba(239,68,68,.04); }
.si-header { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px; }
.si-num  { font-weight:700;font-size:13px;color:var(--hint); }
.si-date { font-size:13px; }
.si-cat  { font-size:11px;padding:2px 7px;border-radius:20px;font-weight:700; }
.note-block { background:rgba(16,185,129,.07);border-radius:6px;padding:8px 10px;font-size:13px; }
.note-label { color:var(--text);line-height:1.4; }
.note-next  { color:var(--hint);margin-top:4px;font-size:12px; }
.overdue-badge { font-size:11px;color:var(--danger);font-weight:700; }

/* Блок просроченного конспекта в вкладке Списание */
.overdue-block {
  background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);
  border-radius:var(--rs);padding:12px 14px;font-size:13px;
  color:var(--danger);margin-bottom:12px;
}

/* ── СОБЫТИЯ ── */
.event-card {
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--r);padding:14px;margin-bottom:12px;
}
.event-blocking { border-color:rgba(239,68,68,.3);background:rgba(239,68,68,.04); }
.event-type-badge {
  font-size:12px;font-weight:600;color:var(--hint);margin-bottom:6px;
}
.event-title { font-size:16px;font-weight:700;margin-bottom:6px; }
.event-meta { font-size:13px;color:var(--hint);margin-bottom:3px; }
.event-desc { font-size:13px;margin:8px 0;line-height:1.5; }
.event-block-warn {
  font-size:12px;color:var(--danger);font-weight:600;
  margin:6px 0;padding:4px 8px;background:rgba(239,68,68,.1);border-radius:6px;
}
.event-footer {
  display:flex;justify-content:space-between;align-items:center;
  margin-top:10px;padding-top:10px;border-top:1px solid var(--border);
}

/* ── NAV OVERFLOW (для 6 вкладок) ── */
.bottom-nav { overflow-x:auto;-webkit-overflow-scrolling:touch; }
.nav-btn { min-width:52px;flex-shrink:0; }