/* Get Result – спільна база вигляду для my/index.html і admin/index.html.
   Перенесено дослівно (прохід В2, 10.08) – без жодної зміни вигляду, лише вивід
   дубльованого коду в одне місце. Специфіка кожного кабінету лишається у своєму
   файлі, тут тільки те, що було побайтово однаковим в обох.
   Підключається через <link rel="stylesheet" href="/styles.css"> ПЕРЕД локальним
   <style> кожного файлу – порядок каскаду («хто останній – той і переміг»)
   лишається таким самим, як був, коли обидва блоки лежали в одному <style>. */

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

/* --- Токени тем: спільна частина. Кожен кабінет може дописати свої власні
   змінні в такому самому селекторі :root / html[data-theme=...] у своєму
   локальному <style> – CSS-змінні з різними іменами просто складаються,
   конфлікту нема. --- */
:root {
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --accent: #1D9E75;
  --warn: #D8442F;
  --amber: #BA7517;
  --re: #4E6274;
  --wknd: #B24A3A;
  --cheat: #C1621B;
  --report: #6D5FCE;  /* 17.08: значок дня звіту в календарі, погоджено з Сергієм через прев'ю (варіант C) */
  --radius: 12px;
  --video-blue-light: rgba(47,111,237,.16);
  /* 10.08: єдина логіка значка дня в календарі – вигляд лише тут, логіка окремо (pcalMarkClass) */
  --pcal-mark-color: var(--accent);
  --pcal-mark-outline-color: var(--re);
  --pcal-mark-outline-width: 1.5px;
  --pcal-mark-dot-size: 6px;
  --pcal-mark-size: 8px;
  /* В2 частина 2, п.3: точка «попереду тренування» і заливка «записано» були одного зеленого –
     зливались на дрібному розмірі. Розведено кольором за узгодженням із Сергієм (прев'ю показано
     заздалегідь) – точка отримала синій (video-blue вже є в системі, у клітинці календаря з
     іконкою відео не перетинається, ніде поруч не зустрічається). Заливка «записано» лишилась
     зеленою (--pcal-mark-color), контур «пропущено» лишився --re – обидва без змін. */
  --pcal-mark-ahead-color: var(--video-blue);
}
html[data-theme="light"] {
  --bg: #EEEBE4;
  --bg-card: #FFFFFF;
  --text: #1A1A18;
  --text-2: #6E6B63;
  /* 10.08 (В2 частина 2, п.1): був #9C988E – контраст ~2.4:1 на --bg, нечитабельно (текст під
     датами, «Пн Вт Ср», підписи полів тощо). Правка кольору тут одразу читається скрізь, де
     використовується --text-3, а не по одному рядку. Піднято до контрасту з --text-2 (~4.5:1
     на --bg / ~5.3:1 на --bg-card) – порогу WCAG AA для дрібного тексту. Темна тема не займана. */
  --text-3: #6E6B63;
  --accent-d: #0F6E56;
  --accent-light: #E1F5EE;
  --warn-light: #FBEAE6;
  --cheat-light: #FBE7D3;
  --border: #E4E0D6;
  --video-blue: #2F6FED;
  --video-blue-d: #1B4FC4;
  --comp: #BA7517;  /* ЗАДАЧА (01.09): корона дня змагань у календарі */
}
html[data-theme="dark"] {
  --bg: #14120f;
  --bg-card: #1e1c17;
  --text: #EEEAE2;
  --text-2: #A39D92;
  --text-3: #726C62;
  --accent-d: #5FD9AC;
  --accent-light: rgba(29,158,117,.18);
  --warn-light: rgba(216,68,47,.2);
  --cheat-light: rgba(193,98,27,.2);
  --border: #332F27;
  --video-blue: #6FA0FF;
  --video-blue-d: #9DC0FF;
  --comp: #E0A94A;  /* світліше золото для темного фону */
}

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

.theme-toggle-btn:hover { border-color: var(--accent); color: var(--accent); }
.theme-toggle-btn svg { width: 14px; height: 14px; }

/* --- Календар плану (клітинка/сітка/значки дня) – 1-в-1 в обох кабінетах --- */
.pcal-caption { font-size: 12px; font-weight: 600; color: var(--text-2); text-align: center; margin-bottom: 6px; }
/* Стрілки гортання місяців у календарі кабінету клієнтки (ЗАДАЧА 31.08) – як у панелі тренера.
   Панель має власні .corr-month-nav, тут окремий клас лише для кабінету. */
.pcal-caption-nav { display: flex; justify-content: center; align-items: center; gap: 16px; }
.pcal-nav { cursor: pointer; color: var(--text-3); font-weight: 600; font-size: 15px; line-height: 1; padding: 4px 6px; user-select: none; }
.pcal-nav:hover { color: var(--accent); }
.pcal-nav.disabled { opacity: .3; cursor: default; pointer-events: none; }
.pcal-head { display: grid; grid-template-columns: repeat(7,1fr); gap: 4px; font-size: 11px; color: var(--text-3); text-align: center; margin-bottom: 4px; }
.pcal-head .wknd-h { color: var(--wknd); font-weight: 700; }
.pcal-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 4px; }
.pcal-cell { position: relative; height: 38px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; border: 1px solid var(--border); border-radius: 6px; font-size: 12px; cursor: pointer; background: var(--bg-card); user-select: none; }
.pcal-cell:hover { border-color: var(--accent); }
.pcal-cell.today { border-color: var(--text); }
.pcal-cell.selected { background: var(--accent-light); border-color: var(--accent); }
.pcal-outside { border-color: transparent; cursor: default; background: transparent; }
/* 17.08 («Календар: місяць цілком»): день ВСЕРЕДИНІ місяця, якому ще не призначено план (не
   плутати з .pcal-outside – та клітинка за межами місяця взагалі, без дати). У перегляді –
   непроклікувана (обробник кліку явно її виключає поруч із .pcal-outside), в корекції – звичайна
   клітинка вибору дня (базовий .pcal-cell лишає курсор і hover), просто без жодних позначок. */
.pcal-empty { color: var(--text-3); }
#corr-view-calendar .pcal-cell.pcal-empty { cursor: default; }
#corr-view-calendar .pcal-cell.pcal-empty:hover { border-color: var(--border); }
.pcal-dot { width: 8px; height: 8px; border-radius: 50%; box-sizing: content-box; }
.pcal-dot-training { background: var(--accent); }
/* 10.08: єдина логіка значка дня (задача «Обозначения дня в календаре»). Три стани, канал один –
   значок під датою; жирність цифри знята зовсім, колір цифри лишився тільки за читмілом. */
.pcal-num-cheat { color: var(--cheat); }
.pcal-mark { border-radius: 50%; box-sizing: content-box; }
.pcal-mark-dot { width: var(--pcal-mark-dot-size); height: var(--pcal-mark-dot-size); background: var(--pcal-mark-ahead-color); } /* тренування є, питати «зроблено/ні» ще рано */
.pcal-mark-closed { width: var(--pcal-mark-size); height: var(--pcal-mark-size); background: var(--pcal-mark-color); } /* день закритий – ваги записані (або кардіо-день у минулому) */
.pcal-mark-outline { width: var(--pcal-mark-size); height: var(--pcal-mark-size); background: transparent; border: var(--pcal-mark-outline-width) solid var(--pcal-mark-outline-color); } /* день минув, записів нема – єдиний сигнал «тут дірка», лише в минулому */

/* ЗАДАЧА (17.08, «Режим переїжджає в день»): значок дня звіту (plan_days.is_report_day) – камера
   в кутку клітинки, окремий канал від .pcal-mark/.pcal-dot (ті про тренування, цей про звіт),
   можуть бути в одній клітинці одночасно. Прев'ю (світла/темна тема, 3 варіанти) погоджено з
   Сергієм – обраний варіант C. Живе в обох календарях (Перегляд + Корекція) і в кабінеті клієнтки. */
.pcal-report-icon { position: absolute; top: 3px; right: 3px; width: 11px; height: 11px; color: var(--report); }
.pcal-report-icon svg { width: 100%; height: 100%; display: block; }

/* ЗАДАЧА (31.08): значок дня кардіо – лінія пульсу в лівому верхньому куті клітинки. Ставиться
   за наявністю кардіо-вправи в дні (dayHasCardio / isDayCardio), НЕ за day_type (тип cardio в
   базі мертвий). Окремий канал від .pcal-report-icon (той у правому куті) – можуть бути в одній
   клітинці одночасно. Колір --wknd, у календарі більше ніде не зустрічається. Прев'ю (лінія
   пульсу, кути заокруглені) погоджено з Сергієм. Живе в обох календарях панелі і в кабінеті. */
.pcal-cardio-icon { position: absolute; top: 3px; left: 3px; width: 13px; height: 13px; color: var(--wknd); }
.pcal-cardio-icon svg { width: 100%; height: 100%; display: block; }

/* ЗАДАЧА (01.09): день змагань (client.target_date) – маленька корона над цифрою, по центру.
   Обрано з прев'ю (варіант A). Вільна зона над числом, з кардіо (лівий кут) і камерою (правий)
   не перетинається. Живе в обох календарях панелі (Перегляд + Корекція) і в кабінеті клієнтки. */
.pcal-comp-crown { position: absolute; top: 3px; left: 50%; transform: translateX(-50%); width: 13px; height: 9px; color: var(--comp); }
.pcal-comp-crown svg { width: 100%; height: 100%; display: block; }

.pcal-detail { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.pcal-detail-type { font-size: 13px; color: var(--text); font-weight: 600; margin-bottom: 10px; }

/* --- Список вправ дня / суперсет – 1-в-1 в обох кабінетах --- */
.plan-ex-item { padding: 10px 0; border-bottom: 1px solid var(--border); }
.plan-ex-item:last-child { border-bottom: none; }
.plan-ex-name { font-size: 13px; font-weight: 600; cursor: pointer; }
.plan-ex-video-icon:hover { background: var(--video-blue-light); color: var(--video-blue-d); }
.plan-ex-video-icon svg { width: 18px; height: 18px; }
.plan-ex-params { display: flex; gap: 12px; flex-wrap: wrap; font-size: 12px; color: var(--text-3); margin: 4px 0 2px; }
.plan-ex-params b { color: var(--accent); font-weight: 600; }
.plan-ex-notes { font-size: 12px; color: var(--text-3); margin-top: 2px; }
.plan-ex-video { position: relative; width: 100%; padding-top: 56.25%; margin-top: 8px; border-radius: 8px; overflow: hidden; background: #000; }
.plan-ex-video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
/* суперсет у перегляді плану – спільна рамка + зелена смуга зліва */
.plan-superset { position: relative; border: 1px solid var(--accent); border-left: 3px solid var(--accent); border-radius: 8px; padding: 8px 10px 4px; margin: 8px 0; }
.plan-superset-hdr { font-size: 10px; font-weight: 700; color: var(--accent); text-transform: uppercase; letter-spacing: .2px; margin-bottom: 2px; }
.plan-superset .plan-ex-item { border-bottom: none; padding: 4px 0; }
.plan-superset-link { font-size: 11px; color: var(--accent); margin: -2px 0 4px; }
.plan-superset-rest { margin-top: 2px; padding-top: 4px; border-top: 1px dashed var(--border); }

/* --- Показники (Apple Watch) – 1-в-1 в обох кабінетах --- */
.wear-row { display: flex; flex-wrap: wrap; gap: 10px 18px; }
.wear-item { font-size: 12px; color: var(--text-2); min-width: 70px; }
.wear-item b { display: block; font-size: 16px; color: var(--text); font-weight: 700; }
.wear-flags { margin-top: 10px; display: flex; flex-direction: column; gap: 6px; }
.wear-flag { font-size: 12px; padding: 7px 10px; border-radius: 8px; background: var(--warn-light); color: var(--warn); }
.wear-flag.ok { background: var(--accent-light); color: var(--accent-d); }
.wear-flag.info { background: var(--bg); color: var(--text-2); border: 1px solid var(--border); }
.wear-date { font-size: 12px; color: var(--text-3); margin-bottom: 8px; }

/* 10.08: відкат помаранчевого «Кардіо» (рішення Сергія) – кардіо звичайний тренувальний день,
   нічим не виділяється, помаранчевий лишається тільки за читмілом. Клас-обгортку лишено (потрібна
   для схлопування «Кардіо Кардіо» в cardioLabelHTML/colorCardioLabel), сам вигляд нейтральний. */
.cardio-tag { color: inherit; font-weight: inherit; }