/* index.css — пользовательские стили для Weightloss Forecaster */

/* Плавная прокрутка страницы */
html {
  scroll-behavior: smooth;
}

/* Accent‑color для нативных элементов (ползунок) */
input[type="range"] {
  accent-color: #2563eb; /* blue-600 */
}

/* Таблицы в тёмной теме */
@media (prefers-color-scheme: dark) {
  table thead tr {
    background-color: #1f2937; /* gray-800 */
    color: #f3f4f6;            /* gray-100 */
  }
  table td,
  table th {
    border-color: #374151;     /* gray-700 */
  }
}

/* ========== 🚀 Toggle switch (Турбо‑режим) ========== */
/* Структура:
<label class="toggle">
  <input type="checkbox" class="toggle-input" x-model="turbo">
  <span class="toggle-bg"></span>
  <span class="toggle-thumb"></span>
</label> */

.toggle { position:relative; display:inline-block; width:40px; height:24px; vertical-align:middle; }
.toggle-input { appearance:none; -webkit-appearance:none; opacity:0; width:0; height:0; position:absolute; }
.toggle-bg { position:absolute; inset:0; background:#d1d5db; border-radius:9999px; transition:background 0.2s; }
.toggle-thumb { position:absolute; top:2px; left:2px; width:20px; height:20px; background:#ffffff; border-radius:9999px; transition:transform 0.2s; box-shadow:0 1px 2px rgba(0,0,0,0.2); }
.toggle-input:checked ~ .toggle-bg { background:#22c55e; }
.toggle-input:checked ~ .toggle-thumb { transform:translateX(16px); }