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

html, body {
  min-height: 100%;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background: #090b12;
  color: #e8eaf0;
  -webkit-font-smoothing: antialiased;
}

button, input, select, textarea { font: inherit; cursor: pointer; }
input, select, textarea { cursor: text; }
textarea { resize: vertical; }

.app {
  max-width: 412px;
  margin: 0 auto;
  min-height: 100vh;
  background: #0e0f14;
  padding: 10px 10px 80px;
}

/* ══════════════════════════════════════════════════
   TOPBAR
══════════════════════════════════════════════════ */
.topbar { padding-bottom: 8px; }

.sb {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #161820;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 14px;
  padding: 8px 12px;
  height: 44px;
}
.sb-logo {
  width: 26px; height: 26px;
  border-radius: 8px;
  overflow: hidden;
  background: linear-gradient(135deg,#7c5dfa,#4f3bc8);
  flex-shrink: 0;
}
.sb-logo img { width: 100%; height: 100%; object-fit: cover; }
.sb-title { flex: 1; font-size: 13px; font-weight: 600; color: #e8eaf0; }
.sb-right  { font-size: 11px; color: #7c82a0; }

/* ══════════════════════════════════════════════════
   SCREENS
══════════════════════════════════════════════════ */
.screen { display: none; overflow: hidden; }
.screen.active { display: block; overflow: visible; position: relative; z-index: 1; }
[hidden],
[data-block-hidden="1"],
.block-hidden {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}
[data-block-hidden="1"] > *,
.block-hidden > * { display: none !important; }

/* ══════════════════════════════════════════════════
   DATEBAR
══════════════════════════════════════════════════ */
.datebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #161820;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  padding: 6px 8px;
  margin-bottom: 8px;
}
.datebar strong {
  font-size: 12px;
  font-weight: 500;
  color: #e8eaf0;
  cursor: pointer;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.datebar strong:focus-visible {
  outline: 2px solid #7c5dfa;
  outline-offset: 4px;
  border-radius: 8px;
}
.date-picker {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
.date-btn {
  width: 28px; height: 28px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.1);
  background: #1e2030;
  color: #7c82a0;
  display: grid; place-items: center;
}
.date-btn svg {
  width: 14px; height: 14px;
  stroke: #7c82a0; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

/* ══════════════════════════════════════════════════
   HERO CARD
══════════════════════════════════════════════════ */
.hero-card {
  background: #161a28;
  border: 1px solid rgba(124,93,250,.25);
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.hero-lbl { font-size: 10px; color: #7c82a0; margin-bottom: 2px; }
.hero-cal  { font-size: 42px; font-weight: 700; line-height: 1; color: #e8eaf0; letter-spacing: -.02em; }
.hero-sub  { font-size: 11px; color: #7c82a0; margin-top: 2px; }

/* ── Ring ── */
.ring {
  position: relative;
  width: 68px; height: 68px;
  flex-shrink: 0;
}
.ring svg { width: 68px; height: 68px; transform: rotate(-90deg); display: block; }
.ring-track { fill: none; stroke: #2a2d40; stroke-width: 5; }
.ring-fill  {
  fill: none;
  stroke: #7c5dfa;
  stroke-width: 5;
  stroke-linecap: round;
  stroke-dasharray: 138.23;
  stroke-dashoffset: 138.23;
  transition: stroke-dashoffset .4s ease;
}
.ring-center {
  position: absolute; inset: 0;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  text-align: center;
}
.ring-center b    { font-size: 13px; font-weight: 700; line-height: 1; color: #e8eaf0; }
.ring-center span { font-size: 9px; color: #7c82a0; margin-top: 2px; line-height: 1; }

/* ══════════════════════════════════════════════════
   MACROS ROW
══════════════════════════════════════════════════ */
.macros-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  margin-bottom: 8px;
}
.mac {
  background: #161820;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  padding: 8px 8px 7px;
  text-align: center;
}
.mac-name { font-size: 9px; color: #7c82a0; }
.mac-val  { font-size: 11px; font-weight: 600; color: #e8eaf0; margin-top: 3px; line-height: 1.1; }
.mac-val i { font-style: normal; }
.mac-bar  {
  height: 3px; border-radius: 2px;
  background: #2a2d40; margin-top: 5px; overflow: hidden;
}
.mac-bar i {
  display: block; height: 100%; border-radius: 2px; width: 0;
  transition: width .3s ease;
}
.bar-p { background: linear-gradient(90deg, #43e97b, #38f9d7); }  /* белок — зелёный */
.bar-f { background: linear-gradient(90deg, #ffca6a, #f5a623); }  /* жиры — оранжевый */
.bar-c { background: linear-gradient(90deg, #ff6eb4, #e040fb); } /* углеводы — розовый */
.bar-fiber  { background: linear-gradient(90deg, #16a34a, #15803d); } /* клетчатка — тёмно-зелёный */
.bar-sugar  { background: linear-gradient(90deg, #e2e8f0, #94a3b8); } /* сахар — белый/серебристый */
.bar-sodium { background: linear-gradient(90deg, #c4b5fd, #8b5cf6); } /* натрий — светло-фиолетовый */

.diary-warnings {
  display: grid;
  gap: 6px;
  margin-bottom: 8px;
}
.diary-warning,
.diary-ok {
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 11px;
  line-height: 1.35;
}
.diary-warning {
  background: rgba(245,166,35,.1);
  border: 1px solid rgba(245,166,35,.25);
  color: #ffd48a;
}
.diary-ok {
  background: rgba(67,233,123,.09);
  border: 1px solid rgba(67,233,123,.22);
  color: #9ff2bf;
}
.weekly-summary { margin-bottom: 8px; }
.week-card {
  background: #161820;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 10px;
}
.week-card > b {
  display: block;
  font-size: 12px;
  color: #e8eaf0;
  margin-bottom: 8px;
}
.week-card p {
  font-size: 11px;
  color: #7c82a0;
  line-height: 1.45;
}
.week-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.week-stats span {
  min-width: 0;
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  padding: 7px 5px;
  text-align: center;
}
.week-stats strong {
  display: block;
  color: #e8eaf0;
  font-size: 13px;
  line-height: 1.1;
}
.week-stats small {
  display: block;
  margin-top: 3px;
  color: #7c82a0;
  font-size: 9px;
  line-height: 1.15;
}

/* ══════════════════════════════════════════════════
   WATER CARD
══════════════════════════════════════════════════ */
.water-card {
  background: #161820;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 8px;
}
.water-head { display: flex; align-items: center; justify-content: space-between; }
.water-lbl  { font-size: 9px; color: #7c82a0; }
.water-val  { font-size: 13px; font-weight: 600; color: #e8eaf0; margin-top: 1px; }
.water-icon {
  width: 28px; height: 28px;
  background: #1a2233;
  border: 1px solid rgba(77,184,255,.3);
  border-radius: 8px;
  display: grid; place-items: center;
  font-size: 14px;
}
.wbar-wrap {
  height: 4px; border-radius: 2px; background: #2a2d40;
  margin: 8px 0 8px; overflow: hidden;
}
.wbar-fill {
  height: 100%; border-radius: 2px; width: 0;
  background: linear-gradient(90deg, #7fd5ff, #4db8ff);
  transition: width .3s ease;
}
.wbtns {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 5px;
  margin-bottom: 8px;
}
.wbtn {
  height: 26px;
  background: #1e2030;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 6px;
  color: #a0a4be;
  font-size: 10px;
  font-weight: 600;
}
.water-manual {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 6px;
}
.water-manual input {
  height: 32px; padding: 0 10px;
  font-size: 12px;
}
.water-manual .btn-secondary { height: 32px; font-size: 11px; }

/* ══════════════════════════════════════════════════
   ACTION ROW (+ Добавить / иконки)
══════════════════════════════════════════════════ */
.action-row {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 6px;
  margin-bottom: 8px;
}
.btn-add { border-radius: 10px; }
.btn-icon {
  width: 36px; height: 36px;
  background: #1e2030;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  display: grid; place-items: center;
}
.btn-icon svg {
  width: 16px; height: 16px;
  stroke: #7c82a0; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

/* ══════════════════════════════════════════════════
   SECTION TITLE
══════════════════════════════════════════════════ */
.section-title {
  font-size: 10px;
  font-weight: 700;
  color: #7c82a0;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin: 4px 0 6px;
}

/* ══════════════════════════════════════════════════
   MEAL LIST
══════════════════════════════════════════════════ */
.meal-list { display: grid; gap: 6px; }

.meal-group {
  background: #161820;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 10px;
}
.meal-group-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 6px;
}
.meal-group-name {
  font-size: 13px;
  font-weight: 700;
  color: #e8eaf0;
}
.meal-group-time { font-size: 11px; color: #7c82a0; margin-left: 4px; font-weight: 400; }
.meal-group-kcal { font-size: 11px; color: #7c5dfa; font-weight: 600; }
.meal-icon-badge { display:inline-flex; align-items:center; flex-shrink:0; opacity:0.85; }

.meal-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  padding: 5px 0;
  border-top: 1px solid rgba(255,255,255,.05);
  cursor: pointer;
}
.meal-item:first-of-type { border-top: 0; }
.meal-item:active { opacity: .7; }

.meal-item-left  { min-width: 0; flex: 1; }
.meal-item-name  { font-size: 12px; font-weight: 600; color: #e8eaf0; }
.meal-item-meta  { font-size: 11px; color: #7c82a0; margin-left: 3px; }
/* Переносим если не помещается — имя жирное, мета следом */
.meal-item-inline { display: block; word-break: break-word; line-height: 1.4; }
.meal-item-kcal  { font-size: 12px; font-weight: 600; color: #e8eaf0; white-space: nowrap; flex-shrink: 0; text-align: right; padding-top: 1px; }
.meal-item-hint  { font-size: 9px; color: #555d70; margin-top: 1px; display: block; }
.meal-empty {
  font-size: 11px;
  color: #7c82a0;
  line-height: 1.4;
  padding: 4px 0;
}

.del-btn {
  width: 28px; height: 28px; flex-shrink: 0;
  background: rgba(255,100,130,.1);
  border: 1px solid rgba(255,100,130,.2);
  border-radius: 8px;
  color: #ff6482;
  font-size: 16px;
  display: grid; place-items: center;
}

/* ══════════════════════════════════════════════════
   ШАБЛОНЫ (дневник, свёрнуто)
══════════════════════════════════════════════════ */
.templates-card {
  background: #161820;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 10px;
  margin-top: 8px;
}
.templates-title { font-size: 11px; font-weight: 600; color: #e8eaf0; margin-bottom: 6px; }
.templates-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.templates-actions .btn-secondary { padding: 0 8px; font-size: 11px; }
.template-list  { display: grid; gap: 6px; }
.template-item  {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  background: #1b1e2b; border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px; padding: 8px;
}
.template-item b { font-size: 12px; }
.template-item p { font-size: 10px; color: #7c82a0; margin-top: 2px; }
.template-actions { display: flex; gap: 6px; }

/* ══════════════════════════════════════════════════
   BUTTONS
══════════════════════════════════════════════════ */
.btn-primary, .btn-secondary, .btn-danger, .btn-link, .file-label {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 36px; border-radius: 10px; padding: 0 14px;
  font-size: 12px; font-weight: 600; border: 0; text-decoration: none;
  cursor: pointer;
}
.btn-primary  { background: #7c5dfa; color: #fff; }
.btn-secondary, .file-label { background: #1e2030; color: #a0a4be; border: 1px solid rgba(255,255,255,.1); }
.btn-danger   { background: #3a1020; color: #ff6482; border: 1px solid rgba(255,100,130,.25); }
.btn-link     { background: #1e2030; color: #a0a4be; border: 1px solid rgba(255,255,255,.1); }
.w100 { width: 100%; }

.file-label input[type="file"] { display: none; }

.back-btn {
  width: 32px; height: 32px;
  background: #1e2030;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  display: grid; place-items: center;
  flex-shrink: 0;
}
.back-btn svg {
  width: 14px; height: 14px;
  stroke: #a0a4be; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}

/* ══════════════════════════════════════════════════
   SCREEN HEADERS
══════════════════════════════════════════════════ */
.screen-header {
  display: flex; align-items: center; gap: 10px;
  padding: 4px 0 10px;
  font-size: 15px; font-weight: 600; color: #e8eaf0;
}
.screen-title-stack {
  display: grid;
  gap: 2px;
}
.screen-title {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
}
.screen-header-simple {
  padding: 4px 0 10px;
}
.screen-header-simple > span:first-child { font-size: 18px; font-weight: 700; display: block; }
.header-sub { font-size: 11px; color: #7c82a0; margin-top: 2px; display: block; }

/* ══════════════════════════════════════════════════
   CARDS (общие)
══════════════════════════════════════════════════ */
.card {
  background: #161820;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
  padding: 10px;
  margin-bottom: 8px;
}
.card-title {
  font-size: 12px; font-weight: 700;
  color: #e8eaf0; margin-bottom: 8px;
}
.form-card { display: grid; gap: 8px; }

/* ══════════════════════════════════════════════════
   ФОРМА / ПОЛЯ
══════════════════════════════════════════════════ */
.field {
  display: grid; gap: 5px;
  font-size: 10px; color: #7c82a0;
}
.field-label-row {
  display: inline-flex; align-items: center; gap: 4px;
}
.help-btn {
  width: 18px; height: 18px;
  border-radius: 50%;
  border: 1px solid rgba(124,93,250,.5);
  background: rgba(124,93,250,.1);
  color: #a899f5;
  font-size: 9px; font-weight: 700;
  display: inline-grid; place-items: center;
}

input, select, textarea {
  width: 100%;
  background: #1e2030;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  color: #e8eaf0;
  padding: 8px 10px;
  font-size: 12px;
  outline: none;
}
input:focus, select:focus, textarea:focus {
  border-color: rgba(124,93,250,.6);
}

.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.row3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }

.preview-box {
  background: #1e2030;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: 10px;
  font-size: 12px; color: #e8eaf0;
}

.check-label {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: #c8cad8; cursor: pointer;
}
.check-label input { width: auto; accent-color: #7c5dfa; }

.manual-block {
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  padding: 10px;
  display: grid; gap: 8px;
}

.hint-text { font-size: 10px; color: #7c82a0; line-height: 1.4; }

.quality-box {
  background: #181b28;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: 8px;
}
.quality-title {
  font-size: 10px;
  color: #8f96bd;
  margin-bottom: 6px;
}
.quality-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.quality-pill,
.quality-tag {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  line-height: 1.2;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: #c7cff7;
}
.quality-pill.good { color: #4ef0a0; border-color: rgba(78,240,160,.42); background: rgba(78,240,160,.1); }
.quality-pill.info { color: #65c7ff; border-color: rgba(101,199,255,.38); background: rgba(101,199,255,.1); }
.quality-pill.warn { color: #ffbf5f; border-color: rgba(255,191,95,.42); background: rgba(255,191,95,.1); }
.quality-pill.neutral { color: #c7cff7; }

/* ══════════════════════════════════════════════════
   QUICK ACTIONS (экран добавления)
══════════════════════════════════════════════════ */
.quick-actions {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 8px; margin-bottom: 8px;
}
.quick-btn {
  background: #161820;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: 10px 6px;
  display: flex; flex-direction: column;
  align-items: center; gap: 4px;
  font-size: 11px; font-weight: 600; color: #e8eaf0;
}
.quick-btn small { font-size: 9px; color: #7c82a0; font-weight: 400; }
.quick-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: grid; place-items: center; margin-bottom: 2px;
}
.quick-icon svg {
  width: 16px; height: 16px;
  fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.qi-photo  { background: rgba(77,184,255,.15);  } .qi-photo  svg { stroke: #4db8ff; }
.qi-search { background: rgba(124,93,250,.15);  } .qi-search svg { stroke: #7c5dfa; }
.qi-manual { background: rgba(76,175,80,.15);   } .qi-manual svg { stroke: #4caf50; }

/* поиск */
.search-input {
  width: 100%; margin-bottom: 8px;
}
/* Компактный режим поиска — только строка + кнопка, без категорий */
#foodSearchCard.compact-search #searchExtras { display: none !important; }
/* Обёртка для поиска */
.search-compact-wrap { position: relative; }
.category-filter {
  display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px;
}
.category-chip {
  min-height: 28px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  background: #1e2030;
  color: #a0a4be;
  font-size: 10px;
  font-weight: 600;
  padding: 0 9px;
}
.category-chip.active {
  border-color: rgba(124,93,250,.7);
  background: rgba(124,93,250,.18);
  color: #e8eaf0;
}
.food-sort-control {
  display: grid;
  gap: 4px;
  margin: 0 0 8px;
  color: #8ea0d6;
  font-size: 10px;
}
.food-sort-control select {
  min-height: 34px;
  padding: 0 10px;
}
.hydration-box {
  display: grid;
  gap: 8px;
  margin: 10px 0;
  padding: 10px;
  border: 1px solid rgba(77,184,255,.24);
  border-radius: 10px;
  background: rgba(77,184,255,.08);
}
.hydration-box[hidden] { display: none; }
.hydration-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #dce8ff;
  font-size: 12px;
  font-weight: 700;
}
.hydration-toggle input {
  width: auto;
  min-height: 0;
}
.hydration-rate {
  margin: 0;
}
#searchResults { display: flex; flex-direction: column; gap: 4px; }
#searchResults .search-result {
  display: flex;
  width: 100%;
  border-radius: 10px;
}
#searchResults .search-result-main { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-section-label {
  flex-basis: 100%;
  font-size: 10px;
  font-weight: 700;
  color: #7c82a0;
  text-transform: uppercase;
  margin-bottom: 1px;
}
.similar-label {
  color: #c8bdff;
  margin-top: 2px;
}
.chip {
  background: #1e2030;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px; color: #a0a4be; cursor: pointer;
}
.chip:hover { border-color: rgba(124,93,250,.5); }
.chip.favorite { border-color: rgba(124,93,250,.5); color: #a899f5; background: rgba(124,93,250,.1); }
.chip.result-toggle {
  border-color: rgba(124,93,250,.55);
  background: rgba(124,93,250,.16);
  color: #e8eaf0;
  font-weight: 700;
}
.chip-meta { font-size: 9px; color: #7c82a0; margin-left: 3px; }
.search-result {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  overflow: hidden;
  background: #1e2030;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 999px;
}
.search-result:hover { border-color: rgba(124,93,250,.5); }
.search-result-main {
  min-width: 0;
  border: 0;
  background: transparent;
  color: #a0a4be;
  font-size: 11px;
  padding: 5px 5px 5px 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.search-quality {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 3px;
}
.search-result-fav {
  width: 28px;
  align-self: stretch;
  border: 0;
  border-left: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  color: #7c82a0;
  font-size: 15px;
  line-height: 1;
}
.search-result-fav.on {
  color: #ff6482;
  background: rgba(255,100,130,.12);
}
.favorite-result {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  overflow: hidden;
  background: rgba(124,93,250,.1);
  border: 1px solid rgba(124,93,250,.5);
  border-radius: 999px;
}
.favorite-result-main {
  min-width: 0;
  border: 0;
  background: transparent;
  color: #c8bdff;
  font-size: 11px;
  padding: 5px 4px 5px 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.favorite-result-remove {
  width: 26px;
  align-self: stretch;
  border: 0;
  border-left: 1px solid rgba(124,93,250,.28);
  background: rgba(255,100,130,.12);
  color: #ff8aa0;
  font-size: 13px;
  line-height: 1;
}
.quick-food-card { display: grid; gap: 10px; }

/* Сеточный вид "Быстро добавить" — 2 колонки */
#recentFoods.grid-view {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
#recentFoods.grid-view .chip {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  border-radius: 10px;
  padding: 8px 10px;
  font-size: 12px;
  font-weight: 600;
  white-space: normal;
  text-align: left;
  min-height: 44px;
  gap: 1px;
}
/* Строка «157 ккал · Б12.7 · Ж11.5 · У0.7» — всё инлайн */
#recentFoods.grid-view .chip-info-row { display: block; margin-top: 2px; line-height: 1.4; }
#recentFoods.grid-view .chip-meta  { font-size: 10px; font-weight: 400; color: var(--color-text-secondary); }
#recentFoods.grid-view .chip-macro { font-size: 10px; font-weight: 400; color: var(--c-muted,#7c82a0); }
/* В режиме списка — скрываем macro */
#recentFoods:not(.grid-view) .chip-info-row { display: inline; }
#recentFoods:not(.grid-view) .chip-macro { display: none; }
#recentFoods:not(.grid-view) .chip-name::after { content: ' '; }
.quick-food-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.quick-food-head .card-title { margin-bottom: 0; }
.quick-food-block { display: grid; gap: 6px; }
.quick-food-label {
  font-size: 10px; font-weight: 600; color: #7c82a0; text-transform: uppercase;
}
.collapse-card {
  padding: 0;
  overflow: hidden;
}
.collapse-summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 12px;
  color: #e8eaf0;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}
.collapse-summary::-webkit-details-marker { display: none; }
.collapse-summary::after {
  content: '+';
  width: 24px;
  height: 24px;
  border-radius: 8px;
  display: grid;
  place-items: center;
  background: rgba(124,93,250,.16);
  color: #a899f5;
  font-size: 16px;
  line-height: 1;
}
.collapse-card[open] .collapse-summary {
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.collapse-card[open] .collapse-summary::after { content: '−'; }

/* Иконки-кнопки в форме добавления продукта */
.form-icon-btn {
  min-width: 42px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.form-icon-btn:hover svg { stroke: #a78bfa; }

.recipe-summary-nav { cursor: default; }
.recipe-summary-nav::-webkit-details-marker { display: none; }
.recipe-nav-btn {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  border: none;
  background: rgba(124,93,250,.16);
  color: #a899f5;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  display: none; /* скрыт по умолчанию */
  place-items: center;
  margin-left: auto;
  padding: 0;
  flex-shrink: 0;
  transition: background 0.15s, transform 0.1s;
}
/* показываем + (перейти в рецепты) только когда секция раскрыта */
#addRecipesSection[open] .recipe-nav-btn { display: grid; }
.recipe-nav-btn:hover { background: rgba(124,93,250,.28); }
.recipe-nav-btn:active { transform: scale(0.92); }
[data-theme="light"] .recipe-nav-btn {
  background: rgba(124,93,250,.14);
  color: #5842d4;
}
.collapse-body {
  padding: 10px 12px 12px;
}
.weight-presets {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 6px;
}
.portion-presets {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.weight-preset {
  min-height: 32px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  background: #1e2030;
  color: #a0a4be;
  font-size: 11px;
  font-weight: 600;
}
.portion-preset {
  min-height: 30px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  background: #1a1d2b;
  color: #a0a4be;
  font-size: 10px;
  font-weight: 600;
}
.weight-preset.active {
  border-color: rgba(124,93,250,.7);
  background: rgba(124,93,250,.18);
  color: #e8eaf0;
}
.portion-preset.active {
  border-color: rgba(77,184,255,.65);
  background: rgba(77,184,255,.14);
  color: #e8eaf0;
}

/* ══════════════════════════════════════════════════
   DRAFT LIST (текущий набор)
══════════════════════════════════════════════════ */
.draft-list { display: grid; gap: 6px; }
.draft-row {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px; padding: 8px;
}
.draft-row b { font-size: 12px; display: block; }
.draft-row p { font-size: 10px; color: #7c82a0; margin-top: 2px; }
.draft-actions { display: flex; gap: 6px; flex-shrink: 0; }
.draft-actions .btn-secondary { min-height: 28px; padding: 0 8px; font-size: 10px; border-radius: 7px; }

/* ══════════════════════════════════════════════════
   КАСТОМНЫЕ ПРОДУКТЫ
══════════════════════════════════════════════════ */
.custom-products { display: grid; gap: 6px; }
.custom-product-row {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  background: #1b1e2b; border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px; padding: 8px; cursor: pointer;
}
.custom-product-row b  { font-size: 12px; }
.custom-product-row p  { font-size: 10px; color: #7c82a0; margin-top: 2px; }
.custom-actions { display: flex; gap: 6px; }
.custom-actions .btn-secondary { min-height: 28px; padding: 0 8px; font-size: 10px; border-radius: 7px; }

/* ══════════════════════════════════════════════════
   AI ЭКРАН
══════════════════════════════════════════════════ */
.ai-hero-card {
  background: #161a28;
  border: 1px solid rgba(124,93,250,.25);
  border-radius: 14px;
  padding: 14px;
  text-align: center;
  margin-bottom: 8px;
}
.ai-hero-icon {
  width: 40px; height: 40px;
  background: #7c5dfa;
  border-radius: 12px;
  display: grid; place-items: center;
  margin: 0 auto 8px;
}
.ai-hero-icon svg {
  width: 22px; height: 22px;
  stroke: #fff; fill: none; stroke-width: 2; stroke-linecap: round;
}
.ai-hero-card h3 { font-size: 14px; font-weight: 700; margin-bottom: 4px; }
.ai-hero-card p  { font-size: 11px; color: #7c82a0; line-height: 1.4; }

.ai-methods {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 6px; margin-bottom: 8px;
}
.ai-method {
  background: #161820;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px; padding: 10px 8px;
  display: flex; flex-direction: column; align-items: center; gap: 4px;
}
.ai-method.am-active {
  background: #1a1830;
  border-color: rgba(124,93,250,.4);
}
.am-icon {
  width: 32px; height: 32px;
  border-radius: 8px;
  display: grid; place-items: center; margin-bottom: 2px;
}
.am-icon svg {
  width: 16px; height: 16px;
  fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
}
.ai-blue   { background: rgba(77,184,255,.15);  } .ai-blue   svg { stroke: #4db8ff; }
.ai-purple { background: rgba(124,93,250,.15);  } .ai-purple svg { stroke: #7c5dfa; }
.ai-orange { background: rgba(245,166,35,.15);  } .ai-orange svg { stroke: #f5a623; }
.ai-green  { background: rgba(76,175,80,.15);   } .ai-green  svg { stroke: #4caf50; }
.am-title  { font-size: 11px; font-weight: 600; color: #e8eaf0; }
.am-sub    { font-size: 9px; color: #7c82a0; }

.chatgpt-panel {
  background: #1a1830;
  border: 1px solid rgba(124,93,250,.3);
  border-radius: 10px; padding: 10px;
}
.ai-example-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0;
}
.ai-example {
  min-height: 28px;
  border: 1px solid rgba(124,93,250,.35);
  border-radius: 999px;
  background: rgba(124,93,250,.12);
  color: #cfc6ff;
  padding: 0 10px;
  font-size: 10px;
  font-weight: 700;
}
.ai-review-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 6px;
  margin-top: 8px;
}
.ai-match-note {
  margin-top: -2px;
  font-size: 10px;
  font-weight: 700;
}
.ai-match-note.ok { color: #40e58b; }
.ai-match-note.warn { color: #ffbf5b; }
.btn-link {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 36px; border-radius: 10px; padding: 0 14px;
  font-size: 12px; font-weight: 600;
}

.photo-preview {
  width: 100%; border-radius: 10px;
  max-height: 220px; object-fit: cover;
}

.found-list { display: grid; gap: 8px; margin-top: 6px; }
.found-item {
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px; padding: 8px;
  display: grid; gap: 6px;
}

/* ══════════════════════════════════════════════════
   ПРОФИЛЬ — ВЕС
══════════════════════════════════════════════════ */
.weight-chart {
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px; padding: 8px;
  min-height: 140px; margin: 6px 0;
}
.weight-chart svg { width: 100%; display: block; }
.weight-chart polyline { stroke: #7c5dfa; stroke-width: 3; fill: none; }
.weight-chart circle  { fill: #7c5dfa; }
.weight-chart .grid   { stroke: #2a2d40; }
.weight-chart text    { fill: #7c82a0; font-size: 10px; }

.history-list { display: grid; gap: 6px; margin-top: 8px; }
.history-row {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  background: #1b1e2b; border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px; padding: 8px;
}
.history-row b   { font-size: 13px; }
.history-row span{ font-size: 10px; color: #7c82a0; }
.mini-actions    { display: flex; gap: 6px; }
.mini-actions .btn-secondary { min-height: 28px; padding: 0 8px; font-size: 10px; border-radius: 7px; }

.progress-summary {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 6px;
}
.progress-summary > div {
  background: #161820; border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px; padding: 8px; text-align: center;
}
.progress-summary b { font-size: 14px; display: block; margin-top: 4px; }
.progress-summary span { font-size: 9px; color: #7c82a0; }
.progress-summary small { font-size: 9px; color: #7c82a0; display: block; }
.good      { color: #43e97b; }
.warn      { color: #f5a623; }
.weight-bad { color: #ff7675; }

/* ══════════════════════════════════════════════════
   СТАТИСТИКА
══════════════════════════════════════════════════ */
.stat-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 8px;
}
.stat-grid > div {
  background: #1b1e2b; border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px; padding: 10px;
}
.stat-grid b { font-size: 18px; display: block; margin-top: 4px; }
.stat-grid span { font-size: 10px; color: #7c82a0; }

.day-row {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid #1e2133;
}
.day-row b { font-size: 12px; }
.day-row p { font-size: 10px; color: #7c82a0; margin-top: 1px; }
.mini-bar  {
  width: 60px; height: 4px; border-radius: 2px;
  background: #2a2d40; overflow: hidden; flex-shrink: 0;
}
.mini-bar i {
  display: block; height: 100%; border-radius: 2px;
  background: #7c5dfa;
}

.info-card { }
.info-card h3 { font-size: 13px; margin-bottom: 6px; }
.info-card p  { font-size: 12px; color: #c0c4d6; line-height: 1.5; margin-bottom: 6px; }
.info-card b  { color: #e8eaf0; }
.analytics-controls label { font-size: 11px; color: #7c82a0; display: grid; gap: 5px; }

/* ══════════════════════════════════════════════════
   ABOUT / SETTINGS MISC
══════════════════════════════════════════════════ */
.about-box { padding: 10px; }
.about-box p { font-size: 11px; color: #7c82a0; line-height: 1.5; }
.shop-card {
  display: grid;
  gap: 10px;
  border-color: rgba(124,93,250,.28);
  background: linear-gradient(135deg, rgba(124,93,250,.12), rgba(30,32,48,.96) 46%, rgba(20,22,32,.98));
}
.shop-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.shop-card-head .card-title { margin-bottom: 3px; }
.shop-card-head img {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  object-fit: cover;
  flex-shrink: 0;
  background: #11131d;
  border: 1px solid rgba(255,255,255,.12);
}
.period-summary {
  display: grid;
  gap: 6px;
}
.period-summary p {
  font-size: 12px;
  color: #c0c4d6;
  line-height: 1.45;
}
.action-list,
.goal-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.action-list span,
.goal-chip-list span {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  background: #202338;
  border: 1px solid rgba(124,93,250,.32);
  color: #d9dcff;
  font-size: 11px;
  line-height: 1.25;
}
.best-day {
  display: grid;
  gap: 5px;
  padding: 8px 0;
  border-bottom: 1px solid #1e2133;
}
.best-day:last-child { border-bottom: 0; padding-bottom: 0; }
.best-day b { font-size: 13px; color: #fff; }
.best-day p {
  margin: -2px 0 0;
  font-size: 11px;
  color: #7c82a0;
}

.metric-chart-grid {
  display: grid;
  gap: 8px;
}
.metric-chart {
  display: grid;
  gap: 7px;
  padding: 9px;
  border-radius: 10px;
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.08);
}
.metric-chart-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
.metric-chart-head b {
  font-size: 12px;
  color: #fff;
}
.metric-chart-head span {
  font-size: 10px;
  color: #9a9fc5;
  text-align: right;
}
.metric-bars {
  height: 74px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  align-items: end;
  gap: 3px;
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,.06);
}
.metric-bars span {
  display: block;
  min-height: 3px;
  border-radius: 4px 4px 2px 2px;
  background: #35394f;
}
.metric-bars span.hit { box-shadow: 0 0 0 1px rgba(67,233,123,.25) inset; }
.chart-cal span { background: linear-gradient(180deg,#8b6cff,#5a43cf); }
.chart-protein span { background: linear-gradient(180deg,#43e97b,#18a981); }
.chart-water span { background: linear-gradient(180deg,#58c8ff,#3178ff); }
.week-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.week-compare > div {
  padding: 9px;
  border-radius: 10px;
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.08);
}
.week-compare b {
  display: block;
  font-size: 13px;
  color: #fff;
}
.week-compare span {
  font-size: 10px;
  color: #7c82a0;
}
.compare-list {
  display: grid;
  gap: 6px;
}
.compare-list > div {
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 8px;
  align-items: center;
  min-height: 30px;
  padding: 6px 8px;
  border-radius: 8px;
  background: #1b1e2b;
}
.compare-list span {
  font-size: 11px;
  color: #c0c4d6;
}
.compare-list b {
  font-size: 12px;
  color: #fff;
  white-space: nowrap;
}
.compare-list em {
  font-style: normal;
  font-size: 10px;
  color: #7c82a0;
  white-space: nowrap;
}
.trend-list {
  display: grid;
  gap: 6px;
}
.trend-list span {
  display: block;
  padding: 8px 9px;
  border-radius: 10px;
  background: #202338;
  border: 1px solid rgba(124,93,250,.26);
  color: #d9dcff;
  font-size: 12px;
  line-height: 1.35;
}
.target-explain {
  margin-top: 8px;
  display: grid;
  gap: 5px;
  padding: 10px;
  border-radius: 10px;
  background: #1b1e2b;
  border: 1px solid rgba(124,93,250,.22);
}
.target-explain b {
  font-size: 12px;
  color: #fff;
}
.target-explain p {
  margin: 0;
  font-size: 11px;
  line-height: 1.4;
  color: #c0c4d6;
}
.stat-toggle-wrap {
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
}
.stat-toggle-btn {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(124,93,250,.34);
  background: #202338;
  color: #d9dcff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.stat-toggle-btn::after {
  content: "+";
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: rgba(124,93,250,.18);
  color: #fff;
  flex-shrink: 0;
}
.stat-toggle-btn.open::after {
  content: "−";
}
.stat-panel[hidden] {
  display: none;
}
.status-banner {
  position: fixed;
  left: 50%;
  bottom: 78px;
  transform: translateX(-50%);
  width: min(412px, calc(100vw - 20px));
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: #202338;
  border: 1px solid rgba(124,93,250,.42);
  color: #e8eaf0;
  font-size: 12px;
  line-height: 1.35;
  box-shadow: 0 14px 32px rgba(0,0,0,.35);
  z-index: 140;
}
.status-banner[hidden] {
  display: none;
}
.status-banner button {
  min-height: 30px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 0;
  background: #7c5dfa;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  flex-shrink: 0;
}
.engagement-card {
  display: grid;
  gap: 8px;
  margin-bottom: 10px;
}
.habit-hints {
  display: grid;
  gap: 6px;
}
.habit-hint {
  padding: 8px 10px;
  border-radius: 10px;
  background: #1b1e2b;
  border: 1px solid rgba(124,93,250,.24);
  color: #cfd3ff;
  font-size: 12px;
  line-height: 1.35;
}
.achievement-summary {
  margin-bottom: 8px;
}
.achievement-head {
  display: grid;
  gap: 4px;
}
.achievement-head b {
  font-size: 20px;
  color: #fff;
}
.achievement-head span,
.achievement-head p {
  color: #9a9fc5;
  font-size: 12px;
  line-height: 1.35;
}
.achievement-grid {
  display: grid;
  gap: 8px;
}
.achievement-card {
  display: grid;
  grid-template-columns: 54px 1fr auto;
  gap: 10px;
  align-items: center;
  padding: 11px;
  border-radius: 12px;
  background: #171a25;
  border: 1px solid rgba(255,255,255,.08);
}
.achievement-card.done {
  border-color: rgba(67,233,123,.35);
  background: linear-gradient(135deg, rgba(67,233,123,.12), #171a25 42%);
}
.achievement-card.starter {
  border-color: rgba(67,233,123,.34);
  background: linear-gradient(135deg, rgba(67,233,123,.08), #171a25 44%);
}
.achievement-card.easy {
  border-color: rgba(88,200,255,.34);
  background: linear-gradient(135deg, rgba(88,200,255,.08), #171a25 44%);
}
.achievement-card.medium {
  border-color: rgba(124,93,250,.36);
  background: linear-gradient(135deg, rgba(124,93,250,.1), #171a25 44%);
}
.achievement-card.hard {
  border-color: rgba(245,166,35,.36);
  background: linear-gradient(135deg, rgba(245,166,35,.1), #171a25 44%);
}
.achievement-card.brutal {
  border-color: rgba(255,110,180,.34);
  background: linear-gradient(135deg, rgba(255,110,180,.1), #171a25 44%);
}
.achievement-card.armageddon {
  border-color: rgba(255,83,83,.42);
  background: linear-gradient(135deg, rgba(255,83,83,.13), rgba(124,93,250,.08) 45%, #171a25);
}
.ach-emblem {
  width: 52px;
  height: 52px;
  display: flex;
  flex-direction: column;
  gap: 0;
  place-items: center;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.32), rgba(124,93,250,.22) 42%, #202338 72%);
  border: 1px solid rgba(124,93,250,.32);
  color: #fff;
  font-size: 24px;
  font-weight: 800;
  box-shadow: inset 0 0 18px rgba(255,255,255,.05), 0 8px 18px rgba(0,0,0,.24);
}
.ach-icon-main {
  display: block;
  line-height: 1;
}
.ach-icon-sub {
  display: block;
  margin-top: 2px;
  padding: 1px 4px;
  border-radius: 999px;
  background: rgba(0,0,0,.28);
  color: #fff;
  font-size: 9px;
  line-height: 1.1;
  font-weight: 900;
  letter-spacing: 0;
}
.achievement-card.done .ach-emblem {
  border-color: rgba(67,233,123,.5);
}
.achievement-card.starter .ach-emblem {
  border-color: rgba(67,233,123,.55);
}
.achievement-card.easy .ach-emblem {
  border-color: rgba(88,200,255,.55);
}
.achievement-card.medium .ach-emblem {
  border-color: rgba(124,93,250,.62);
}
.achievement-card.hard .ach-emblem {
  border-color: rgba(245,166,35,.62);
}
.achievement-card.brutal .ach-emblem {
  border-color: rgba(255,110,180,.55);
}
.achievement-card.armageddon .ach-emblem {
  border-color: rgba(255,83,83,.65);
}
.achievement-card.icon-water .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.38), rgba(88,200,255,.32) 42%, #143150 74%); }
.achievement-card.icon-protein .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(67,233,123,.32) 42%, #173823 74%); }
.achievement-card.icon-streak .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(255,110,180,.28) 42%, #3a1635 74%); }
.achievement-card.icon-diary .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(124,93,250,.32) 42%, #242045 74%); }
.achievement-card.icon-calorie .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(245,166,35,.34) 42%, #3a2915 74%); }
.achievement-card.icon-balanced .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(88,200,255,.28) 42%, #20334a 74%); }
.achievement-card.icon-weight .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(255,83,83,.28) 42%, #421c22 74%); }
.achievement-card.icon-food .ach-emblem,
.achievement-card.icon-meal .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(245,166,35,.28) 42%, #332615 74%); }
.achievement-card.icon-template .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(88,200,255,.3) 42%, #142e45 74%); }
.achievement-card.icon-favorite .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(255,110,180,.34) 42%, #3c1b35 74%); }
.achievement-card.icon-custom .ach-emblem { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.34), rgba(124,93,250,.32) 42%, #221b42 74%); }
.ach-body {
  min-width: 0;
}
.ach-progress {
  min-width: 46px;
  min-height: 32px;
  display: grid;
  place-items: center;
  align-self: start;
  padding: 5px 7px;
  border-radius: 10px;
  background: #202338;
  border: 1px solid rgba(124,93,250,.32);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}
.achievement-card.done .ach-progress {
  background: #173823;
  border-color: rgba(67,233,123,.5);
  color: #43e97b;
}
.achievement-card.armageddon .ach-progress {
  border-color: rgba(255,83,83,.65);
  color: #ff7675;
}
.achievement-card b {
  display: block;
  color: #fff;
  font-size: 13px;
}
.achievement-card p {
  margin: 2px 0 7px;
  color: #9a9fc5;
  font-size: 11px;
  line-height: 1.35;
}
.ach-track {
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: #2a2d3e;
}
.ach-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg,#7c5dfa,#43e97b);
}
.achievement-card.starter .ach-track i { background: linear-gradient(90deg,#43e97b,#38f9d7); }
.achievement-card.easy .ach-track i { background: linear-gradient(90deg,#58c8ff,#38f9d7); }
.achievement-card.medium .ach-track i { background: linear-gradient(90deg,#7c5dfa,#58c8ff); }
.achievement-card.hard .ach-track i { background: linear-gradient(90deg,#f5a623,#ffca6a); }
.achievement-card.brutal .ach-track i { background: linear-gradient(90deg,#ff6eb4,#e040fb); }
.achievement-card.armageddon .ach-track i { background: linear-gradient(90deg,#ff5353,#f5a623); }

/* ══════════════════════════════════════════════════
   BOTTOM NAV
══════════════════════════════════════════════════ */
.bottom-nav {
  position: fixed;
  left: 50%; transform: translateX(-50%);
  bottom: 8px;
  width: min(412px, calc(100vw - 16px));
  display: grid; grid-template-columns: repeat(5, 1fr);
  gap: 2px;
  background: #161820;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 16px;
  padding: 6px 4px;
  z-index: 200;
  isolation: isolate;
  pointer-events: all;
  touch-action: manipulation;
}
.bn-btn {
  border: 0; background: transparent;
  border-radius: 10px; padding: 5px 2px;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 3px; min-height: 44px;
  pointer-events: all;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(124,93,250,.2);
}
.bn-icon {
  width: 24px; height: 24px;
  border-radius: 7px;
  display: grid; place-items: center;
  flex-shrink: 0;
}
.bn-icon svg {
  width: 15px; height: 15px;
  stroke: #7c82a0; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.bn-lbl { font-size: 8px; color: #7c82a0; line-height: 1; white-space: nowrap; }

.bn-btn.on .bn-icon { background: #7c5dfa; }
.bn-btn.on .bn-icon svg { stroke: #fff; }
.bn-btn.on .bn-lbl  { color: #a899f5; font-weight: 600; }

/* ══════════════════════════════════════════════════
   УМНЫЙ ПОИСК / AI БЛОКИ
══════════════════════════════════════════════════ */
.smart-block {
  background: linear-gradient(135deg, rgba(76,175,80,.08), rgba(124,93,250,.08));
  border-color: rgba(76,175,80,.3);
}
.smart-block-head { margin-bottom: 8px; }
.smart-badge {
  display: inline-block;
  background: rgba(76,175,80,.15);
  border: 1px solid rgba(76,175,80,.4);
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 9px; font-weight: 700;
  color: #4caf50; margin-bottom: 4px;
}
.btn-chatgpt {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 36px; border-radius: 10px; padding: 0 14px;
  font-size: 12px; font-weight: 700; border: 0; cursor: pointer;
  background: linear-gradient(135deg, #10a37f, #1a7f64);
  color: #fff;
}
.btn-chatgpt:disabled { opacity: .6; cursor: default; }

.interface-mode-box {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(124,93,250,.22);
  border-radius: 10px;
  background: rgba(124,93,250,.08);
}
.interface-mode-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.interface-mode-head b {
  display: block;
  font-size: 13px;
  color: #e8eaf0;
}
.interface-mode-head span {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  color: #a899f5;
  font-weight: 700;
}
.interface-mode-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.interface-mode-btn {
  min-height: 34px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 9px;
  background: #1b1e2b;
  color: #a0a4be;
  font-weight: 700;
}
.interface-mode-btn.active {
  border-color: rgba(124,93,250,.7);
  background: rgba(124,93,250,.24);
  color: #fff;
}
.cloud-sync-box {
  padding: 10px 12px 12px;
  display: grid;
  gap: 8px;
}
.cloud-auth-panel {
  display: grid;
  gap: 8px;
}
.cloud-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}
.cloud-user-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px;
  border: 1px solid rgba(124,93,250,.2);
  border-radius: 9px;
  background: rgba(124,93,250,.08);
}
.cloud-user-row b {
  display: block;
  max-width: 210px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #e8eaf0;
}
.cloud-user-row .btn-secondary {
  flex: 0 0 auto;
  min-height: 32px;
  padding: 0 12px;
}
.cloud-admin-link {
  min-height: 36px;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cloud-admin-link[hidden] {
  display: none !important;
}
.voice-listening {
  box-shadow: 0 0 0 3px rgba(255,100,130,.16);
}

.or-divider {
  display: flex; align-items: center; gap: 8px;
  color: #7c82a0; font-size: 11px; margin: 8px 0;
}
.or-divider::before, .or-divider::after {
  content: ''; flex: 1; height: 1px; background: #2a2d3e;
}

/* found list show/hide actions */
#found:not(:empty) ~ #foundActions { display: block !important; }

/* ══════════════════════════════════════════════════
   LEGACY / JS-RENDERED CLASSES
   (renderMeals, renderProductCard, etc. use these)
══════════════════════════════════════════════════ */
/* secondary / del used by old JS render functions */
.secondary {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 32px; border-radius: 8px; padding: 0 10px;
  font-size: 11px; font-weight: 600;
  background: #1e2030; color: #a0a4be;
  border: 1px solid rgba(255,255,255,.1); cursor: pointer;
}
.del {
  width: 28px; height: 28px; border-radius: 8px; border: 0;
  background: rgba(255,100,130,.1); color: #ff6482;
  font-size: 18px; display: grid; place-items: center; cursor: pointer;
}
.muted { color: #7c82a0; font-size: 10px; }
.small { font-size: 10px; }
/* grid aliases for drawFound() */
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.grid3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
/* rec item in AI found list */
.rec { background: #1b1e2b; border: 1px solid rgba(255,255,255,.08); border-radius:10px; padding:8px; display:grid; gap:6px; }
.food-edit { grid-template-columns: 1fr; }
/* draft & template action buttons */
.mini-actions { display: flex; gap: 6px; }
.mini-actions .secondary { min-height: 28px; padding: 0 8px; font-size: 10px; border-radius: 7px; }
/* weight row */
.weight-row { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  background: #1b1e2b; border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px; padding: 8px; }
.weight-row b    { font-size: 13px; }
.weight-row span { font-size: 10px; color: #7c82a0; }
.weight-row em   { font-style: normal; }

/* ══════════════════════════════════════════════════
   TOAST
══════════════════════════════════════════════════ */
#toast {
  position: fixed; left: 50%; bottom: 72px;
  transform: translateX(-50%) translateY(12px);
  background: #7c5dfa; color: #fff;
  border-radius: 999px; padding: 8px 16px;
  font-size: 12px; font-weight: 600;
  opacity: 0; pointer-events: none;
  transition: .2s; white-space: nowrap;
  z-index: 200;
}
#toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* ══════════════════════════════════════════════════
   FEATURE 1: Quick + button per meal group
══════════════════════════════════════════════════ */
.meal-head-right { display: flex; align-items: center; gap: 8px; }
.meal-add-btn {
  width: 26px; height: 26px; border-radius: 50%; border: 0;
  background: #7c5dfa; color: #fff; font-size: 18px; line-height: 1;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; font-weight: 300;
}
.meal-add-btn:active { background: #6a4de0; }

/* ══════════════════════════════════════════════════
   FEATURE 2: Barcode scanner overlay
══════════════════════════════════════════════════ */
/* ══ Reminder list ══ */
#reminderList { display: flex; flex-direction: column; gap: 8px; margin: 0 16px; }
.reminder-row {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; margin: 0;
}
.field-inline {
  background: #1e2030; border: 1.5px solid rgba(255,255,255,.1);
  border-radius: 8px; padding: 8px 10px; color: #e8eaf0;
  font-size: 14px; font-family: inherit; outline: none;
}
.field-inline:focus { border-color: #7c5dfa; }
.field-inline option,
.rem-type-select option {
  background: #1e2030;
  color: #e8eaf0;
}
.field-inline option:checked,
.rem-type-select option:checked {
  background: #7c5dfa;
  color: #fff;
}
.rem-type-select.field-inline { flex: 1; min-width: 0; cursor: pointer; }
.rem-time-input.field-inline { width: 90px; flex-shrink: 0; text-align: center; }
.rem-delete-btn {
  flex-shrink: 0; width: 32px; height: 32px;
  background: rgba(239,68,68,.15); border: none; border-radius: 8px;
  color: #ef4444; font-size: 18px; line-height: 1; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.rem-delete-btn:hover { background: rgba(239,68,68,.3); }

.barcode-input-row {
  display: flex; gap: 8px; align-items: center;
}
.barcode-field {
  flex: 1; background: var(--surface); border: 1.5px solid var(--border);
  border-radius: 10px; padding: 10px 14px; color: var(--text);
  font-size: 15px; font-family: inherit; outline: none;
}
.barcode-field:focus { border-color: var(--accent); }
.barcode-input-row .btn-primary { flex-shrink: 0; padding: 10px 18px; }

.scan-overlay {
  position: fixed; inset: 0; background: #000; z-index: 1000;
  display: flex; flex-direction: column;
}
.scan-overlay[hidden] { display: none; }
.scan-header {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; background: rgba(0,0,0,.6); color: #fff;
}
.scan-header span { font-size: 16px; font-weight: 600; }
#scanVideo { width: 100%; flex: 1; object-fit: cover; }
.scan-frame {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 240px; height: 120px; border: 2px solid #7c5dfa; border-radius: 8px;
  pointer-events: none;
  box-shadow: 0 0 0 9999px rgba(0,0,0,.5);
}

/* ══════════════════════════════════════════════════
   FEATURE 3: Copy meal modal
══════════════════════════════════════════════════ */
.modal-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,.7); z-index: 500;
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.modal-overlay[hidden] { display: none; }
.modal-box {
  background: #1a1d2e; border-radius: 16px; padding: 20px;
  width: 100%; max-width: 380px; max-height: 80vh; overflow-y: auto;
}
.modal-title { font-size: 16px; font-weight: 700; color: #fff; margin-bottom: 14px; }
.copy-preview { max-height: 140px; overflow-y: auto; margin-top: 8px; }
.copy-item { font-size: 12px; color: #9a9fc5; padding: 1px 0; }
.btn-link-sm { background: none; border: 0; color: #7c5dfa; font-size: 12px; cursor: pointer; padding: 4px 0; }

/* ══════════════════════════════════════════════════
   FEATURE 4: Macro day bars in analytics
══════════════════════════════════════════════════ */
.day-row-label { min-width: 70px; display: flex; flex-direction: column; gap: 2px; }
.day-row-label b { font-size: 13px; color: #fff; }
.day-kcal-badge { font-size: 10px; color: #7c82a0; }
.macro-day-bars { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.mdb-row { display: flex; align-items: center; gap: 4px; }
.mdb-row > span:first-child { font-size: 10px; color: #7c82a0; width: 10px; flex-shrink: 0; }
.mdb-track { flex: 1; height: 6px; background: #2a2d3e; border-radius: 3px; overflow: hidden; }
.mdb-val { font-size: 10px; color: #9a9fc5; width: 30px; text-align: right; flex-shrink: 0; }
.mdb-p { display: block; height: 100%; background: linear-gradient(90deg,#43e97b,#38f9d7); border-radius: 3px; transition: width .3s; }
.mdb-f { display: block; height: 100%; background: linear-gradient(90deg,#ffca6a,#f5a623); border-radius: 3px; transition: width .3s; }
.mdb-c { display: block; height: 100%; background: linear-gradient(90deg,#ff6eb4,#e040fb); border-radius: 3px; transition: width .3s; }
.mdb-fiber { display: block; height: 100%; background: linear-gradient(90deg,#6ee7b7,#059669); border-radius: 3px; transition: width .3s; }

/* ══════════════════════════════════════════════════
   FEATURE 5: Mini macro bars per meal group
══════════════════════════════════════════════════ */
.meal-macro-bars { display: flex; gap: 6px; padding: 6px 0 2px; }
.mmb-item { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.mmb-item span { font-size: 10px; color: #7c82a0; }
.mmb-track { height: 4px; background: #2a2d3e; border-radius: 2px; overflow: hidden; }

/* ══════════════════════════════════════════════════
   FEATURE 6: Weight stepper in smart parser
══════════════════════════════════════════════════ */
.weight-stepper { display: flex; align-items: center; gap: 4px; }
.step-btn {
  width: 28px; height: 28px; border-radius: 8px;
  background: #2a2d3e; border: 1px solid #3a3d55;
  color: #fff; font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; line-height: 1; font-weight: 300;
}
.step-btn:active { background: #7c5dfa; }
.step-input { flex: 1; min-width: 0; }

/* Accessibility: app text size */
:root { --fs-bump: 2px; --fs-big-bump: 4px; }
:root[data-font-size="1"], body[data-font-size="1"] { --fs-bump: 0px; --fs-big-bump: 0px; }
:root[data-font-size="2"], body[data-font-size="2"] { --fs-bump: 1px; --fs-big-bump: 2px; }
:root[data-font-size="3"], body[data-font-size="3"] { --fs-bump: 2px; --fs-big-bump: 4px; }
:root[data-font-size="4"], body[data-font-size="4"] { --fs-bump: 4px; --fs-big-bump: 8px; }

.font-size-setting {
  display: grid;
  gap: 10px;
  margin: 10px 0 12px;
  padding: 10px;
  border: 1px solid rgba(124,93,250,.25);
  border-radius: 12px;
  background: rgba(124,93,250,.08);
}
.font-size-preview {
  min-height: 72px;
  border-radius: 10px;
  background: #161820;
  border: 1px solid rgba(255,255,255,.08);
  display: grid;
  place-items: center;
  text-align: center;
  padding: 10px;
  color: #e8eaf0;
}
.font-size-preview span { font-size: calc(13px + var(--fs-bump)) !important; line-height: 1.35; }
.font-size-preview b { display: block; font-size: calc(16px + var(--fs-big-bump)) !important; margin-top: 4px; }
.font-size-slider {
  display: grid;
  grid-template-columns: 24px 1fr 34px;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
}
.font-size-slider input {
  width: 100%;
  padding: 0;
  min-height: 34px;
  cursor: pointer;
  accent-color: #7c5dfa;
  touch-action: pan-x;
}
.font-size-a { color: #e8eaf0; font-weight: 800; line-height: 1; }
.font-size-a.small { font-size: 18px; }
.font-size-a.big { font-size: 32px; text-align: right; }
.font-size-levels {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}
.font-size-levels button {
  min-height: 32px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 9px;
  background: #1e2030;
  color: #a0a4be;
  font-weight: 800;
  touch-action: manipulation;
}
.font-size-levels button.active {
  border-color: rgba(124,93,250,.75);
  background: rgba(124,93,250,.25);
  color: #fff;
}

.app :is(button, input, select, textarea) { font-size: calc(12px + var(--fs-bump)) !important; }
.app .sb-title { font-size: calc(13px + var(--fs-bump)) !important; }
.app .sb-right,
.app .hero-sub,
.app .week-card p,
.app .meal-item-meta,
.app .hint-text,
.app .muted,
.app .small,
.app .copy-item { font-size: calc(11px + var(--fs-bump)) !important; line-height: 1.45; }
.app .hero-lbl,
.app .mac-name,
.app .water-lbl,
.app .field,
.app .chip-meta,
.app .search-section-label,
.app .quick-food-label,
.app .day-kcal-badge,
.app .mdb-row > span:first-child,
.app .mdb-val,
.app .mmb-item span,
.app .bn-lbl { font-size: calc(10px + var(--fs-bump)) !important; line-height: 1.35; }
.app .datebar strong,
.app .card-title,
.app .week-card > b,
.app .meal-group-name,
.app .meal-item-name,
.app .form-title,
.app .collapse-summary,
.app .screen-header,
.app .screen-header-simple > span:first-child { font-size: calc(13px + var(--fs-bump)) !important; line-height: 1.25; }
.app .hero-cal { font-size: calc(42px + var(--fs-big-bump)) !important; }
.app .water-val,
.app .mac-val,
.app .ring-center b,
.app .meal-group-kcal,
.app .meal-item-kcal,
.app .preview-box,
.app .day-row-label b { font-size: calc(13px + var(--fs-bump)) !important; }
.app .chip,
.app .search-result-main,
.app .favorite-result-main,
.app .favorite-result-remove,
.app .category-chip,
.app .btn-link-sm { font-size: calc(11px + var(--fs-bump)) !important; }
.app .btn-primary,
.app .btn-secondary,
.app .btn-danger,
.app .file-label { font-size: calc(12px + var(--fs-bump)) !important; }

/* ══════════════════════════════════════════════════
   v84: ОНБОРДИНГ + КАСТОМНЫЙ ДИАЛОГ + ШРИФТЫ
══════════════════════════════════════════════════ */

/* Онбординг */
.ob-step-dot {
  height: 4px;
  border-radius: 2px;
  background: #2a2d40;
  flex: 1;
  transition: background .3s;
}
.ob-step-dot.active {
  background: #7c5dfa;
}

/* Кастомный диалог — анимация появления */
#confirmOverlay .modal-box,
#onboardOverlay .modal-box {
  animation: slideUp .22s ease;
}
@keyframes slideUp {
  from { transform: translateY(24px); opacity: 0; }
  to   { transform: translateY(0);    opacity: 1; }
}

/* Шрифты — динамически применяются через data-font */
[data-font="Inter"]    { font-family: Inter, system-ui, -apple-system, sans-serif !important; }
[data-font="Manrope"]  { font-family: Manrope, system-ui, sans-serif !important; }
[data-font="Nunito"]   { font-family: Nunito, system-ui, sans-serif !important; }
[data-font="DM Sans"]  { font-family: 'DM Sans', system-ui, sans-serif !important; }

/* Активная кнопка шрифта */
[data-font-name].active-font {
  border-color: rgba(124,93,250,.7) !important;
  background: rgba(124,93,250,.22) !important;
  color: #e8eaf0 !important;
}

/* Умный поиск — результаты в блоке */
#smartSearchResults .search-result { max-width: 100%; }

/* ══════════════════════════════════════════════════
   v85: ЖИРНОСТЬ ШРИФТА + AI-MATCH INFO
══════════════════════════════════════════════════ */

:root {
  --fw-base: 600;
  --fw-bold: 800;
}

/* Применяем переменную жирности к ключевым элементам */
.app .meal-item-name,
.app .meal-group-name,
.app .card-title,
.app .screen-title,
.app .hero-cal,
.app .water-val,
.app .mac-val { font-weight: var(--fw-bold) !important; }

.app .btn-primary,
.app .btn-secondary,
.app .category-chip,
.app .chip { font-weight: var(--fw-base) !important; }

/* AI match note - info state */
.ai-match-note.info {
  color: #4db8ff;
}

/* Кнопки настроек - отступы */
.app #settings .card.form-card > button,
.app #settings .card.form-card > .btn-primary,
.app #settings .card.form-card > .btn-secondary,
.app #settings .card.form-card > .btn-danger,
.app #settings .card.form-card > .file-label {
  margin-bottom: 0;
}

/* ══════════════════════════════════════════════════
   v86: ФИКСЫ ТЕКСТА И КНОПОК
══════════════════════════════════════════════════ */

/* Поиск: перенос текста при большом шрифте */
.search-result,
.search-result-main,
.chip {
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: break-word;
  text-overflow: unset !important;
  overflow: visible !important;
}
.search-result {
  max-width: 100%;
  height: auto !important;
  align-items: flex-start !important;
}
.search-result-main {
  white-space: normal !important;
  height: auto;
  padding: 6px 4px 6px 10px;
  line-height: 1.4;
}

/* Данные card - gap between buttons */
.card.form-card[style*="gap:8px"] > button,
.card.form-card[style*="gap:8px"] > label {
  margin-top: 0;
}

/* ══════════════════════════════════════════════════
   v87: СВЕТЛАЯ ТЕМА
══════════════════════════════════════════════════ */
[data-theme="light"] body,
body[data-theme="light"] {
  background: #f0f2f7;
  color: #1a1c24;
}
[data-theme="light"] .app { background: #f5f7fc; }
[data-theme="light"] .sb,
[data-theme="light"] .card,
[data-theme="light"] .week-card,
[data-theme="light"] .meal-group,
[data-theme="light"] .water-card,
[data-theme="light"] .hero-card,
[data-theme="light"] .history-row,
[data-theme="light"] .draft-row,
[data-theme="light"] .custom-product-row,
[data-theme="light"] .found-item,
[data-theme="light"] .achievement-card,
[data-theme="light"] .rec,
[data-theme="light"] .template-item,
[data-theme="light"] .weight-row,
[data-theme="light"] .chatgpt-panel {
  background: #fff;
  border-color: rgba(0,0,0,.1);
}
[data-theme="light"] .smart-block { background: rgba(76,175,80,.06); }
[data-theme="light"] .bottom-nav { background: #fff; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .hero-cal,
[data-theme="light"] .meal-group-name,
[data-theme="light"] .meal-item-name,
[data-theme="light"] .card-title,
[data-theme="light"] .screen-title,
[data-theme="light"] .screen-header,
[data-theme="light"] .datebar strong,
[data-theme="light"] b { color: #1a1c24; }
[data-theme="light"] .hero-sub,
[data-theme="light"] .hero-lbl,
[data-theme="light"] .mac-name,
[data-theme="light"] .water-lbl,
[data-theme="light"] .meal-item-meta,
[data-theme="light"] .hint-text,
[data-theme="light"] .muted,
[data-theme="light"] .section-title,
[data-theme="light"] .bn-lbl,
[data-theme="light"] .bn-icon svg { color: #5c6178; stroke: #5c6178; }
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea { background: #f0f2f7; border-color: rgba(0,0,0,.15); color: #1a1c24; }
[data-theme="light"] input:focus, [data-theme="light"] select:focus { border-color: #7c5dfa; }
[data-theme="light"] .btn-secondary,
[data-theme="light"] .file-label,
[data-theme="light"] .date-btn,
[data-theme="light"] .btn-icon,
[data-theme="light"] .back-btn,
[data-theme="light"] .category-chip,
[data-theme="light"] .chip,
[data-theme="light"] .wbtn,
[data-theme="light"] .weight-preset,
[data-theme="light"] .portion-preset { background: #edf0f7; border-color: rgba(0,0,0,.1); color: #3a3d52; }
[data-theme="light"] .datebar,
[data-theme="light"] .weight-chart { background: #fff; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .mac { background: #f0f2f7; border-color: rgba(0,0,0,.07); }
[data-theme="light"] .mac-bar,
[data-theme="light"] .wbar-wrap { background: #dde0e8; }
[data-theme="light"] .ring-track { stroke: #dde0e8; }
[data-theme="light"] .meal-item { border-color: rgba(0,0,0,.06); }
[data-theme="light"] .habit-hint { background: #fff; border-color: rgba(124,93,250,.2); color: #3a3d52; }
[data-theme="light"] .stat-grid > div,
[data-theme="light"] .day-row,
[data-theme="light"] .progress-summary > div,
[data-theme="light"] .metric-chart { background: #f0f2f7; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .collapse-summary { color: #1a1c24; }
[data-theme="light"] .collapse-summary::after { background: rgba(124,93,250,.14); color: #7c5dfa; }
[data-theme="light"] .modal-box { background: #fff; color: #1a1c24; }
[data-theme="light"] #toast { background: #1a1c24; color: #fff; }
[data-theme="light"] .status-banner { background: #fff; }

/* ══════════════════════════════════════════════════
   v87: СВАЙП ВЛЕВО — визуальный hint
══════════════════════════════════════════════════ */
.meal-item {
  position: relative;
  overflow: hidden;
  transition: transform .2s ease;
}
.meal-item::after {
  content: '×';
  position: absolute;
  right: 0; top: 0; bottom: 0;
  width: 72px;
  background: rgba(255,100,130,.85);
  color: #fff;
  font-size: 22px;
  font-weight: 300;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s;
}
.meal-item[style*="translateX(-"] .del-btn { opacity: 0; }

/* ══════════════════════════════════════════════════
   v87: ТРЕНИРОВКА КНОПКА АКТИВНА
══════════════════════════════════════════════════ */
#workoutBtn { transition: all .2s; }

/* ══════════════════════════════════════════════════
   v88: СВАЙП — реальная кнопка удаления
══════════════════════════════════════════════════ */
.meal-item {
  overflow: hidden;
  position: relative;
  transition: transform .25s ease;
}
/* Remove old pseudo-element approach */
.meal-item::after { display: none !important; }

.swipe-del-btn {
  position: absolute;
  right: 0; top: 0; bottom: 0;
  width: 80px;
  background: #ff4757;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  border: none;
  cursor: pointer;
  transform: translateX(80px);
  transition: transform .25s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.meal-item.swiped .swipe-del-btn { transform: translateX(0); }
.meal-item.swiped { transform: translateX(-80px); }

/* ══════════════════════════════════════════════════
   v88: АДАПТИВНОЕ КОЛЬЦО — цвет
══════════════════════════════════════════════════ */
.ring-fill { transition: stroke-dashoffset .4s ease, stroke .3s ease; }

/* ══════════════════════════════════════════════════
   v88: СВЕТЛАЯ ТЕМА — текст fix
══════════════════════════════════════════════════ */
[data-theme="light"] .ring-center b { color: #1a1c24; }
[data-theme="light"] .ring-track { stroke: #e0e3ec; }
[data-theme="light"] .achievement-card b,
[data-theme="light"] .achievement-card p { color: #1a1c24; }
[data-theme="light"] .achievement-card p { color: #555d78; }
[data-theme="light"] .ach-emblem { background: radial-gradient(circle, rgba(124,93,250,.25), rgba(200,205,230,.6)); }
[data-theme="light"] .quality-pill { color: #3a3d52; }
[data-theme="light"] .quality-pill.good { color: #1a7a48; }
[data-theme="light"] .quality-pill.warn { color: #7a4e00; }
[data-theme="light"] .quality-pill.info { color: #1557a0; }
[data-theme="light"] .ai-match-note.ok   { color: #1a7a48; }
[data-theme="light"] .ai-match-note.warn { color: #7a4e00; }
[data-theme="light"] .ai-match-note.info { color: #1557a0; }
[data-theme="light"] .preview-box { background: #e8eaf5; color: #1a1c24; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .search-result-main { color: #3a3d52; }
[data-theme="light"] .search-result { background: #edf0f7; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .favorite-result { background: rgba(124,93,250,.12); }
[data-theme="light"] .favorite-result-main { color: #4a3da0; }
[data-theme="light"] .smart-badge { color: #1a7a48; border-color: rgba(76,175,80,.4); background: rgba(76,175,80,.1); }
[data-theme="light"] .btn-primary { background: #7c5dfa; color: #fff; }
[data-theme="light"] .del-btn,
[data-theme="light"] .del { background: rgba(220,50,80,.1); color: #c0203a; border-color: rgba(220,50,80,.2); }
[data-theme="light"] .shop-card { background: linear-gradient(135deg, rgba(124,93,250,.08), #fff 60%); }
[data-theme="light"] .week-stats span,
[data-theme="light"] .best-day,
[data-theme="light"] .period-summary p { color: #3a3d52; }
[data-theme="light"] .week-stats strong { color: #1a1c24; }
[data-theme="light"] .action-list span,
[data-theme="light"] .goal-chip-list span { background: #e8eaf5; border-color: rgba(124,93,250,.2); color: #4a3da0; }
[data-theme="light"] .collapse-card { background: #fff; }
[data-theme="light"] .status-banner { background: #fff; border-color: rgba(124,93,250,.3); color: #1a1c24; }

/* ══════════════════════════════════════════════════
   v89: СВЕТЛАЯ ТЕМА — полный фикс
══════════════════════════════════════════════════ */
[data-theme="light"] { color-scheme: light; }
[data-theme="light"] body { background: #f0f2f7; color: #1a1c24; }
[data-theme="light"] .app { background: #f5f7fc; }
[data-theme="light"] input, [data-theme="light"] select, [data-theme="light"] textarea {
  background: #edf0f8; border-color: rgba(0,0,0,.15); color: #1a1c24;
}
[data-theme="light"] input::placeholder, [data-theme="light"] textarea::placeholder { color: #8890aa; }
[data-theme="light"] .topbar, [data-theme="light"] .sb { background: #fff; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .topbar-title, [data-theme="light"] .sb b { color: #1a1c24; }
[data-theme="light"] .topbar-sub { color: #5c6178; }
[data-theme="light"] .card, [data-theme="light"] .form-card,
[data-theme="light"] .card.form-card, [data-theme="light"] .meal-group,
[data-theme="light"] .water-card, [data-theme="light"] .hero-card,
[data-theme="light"] .found-item, [data-theme="light"] .history-row,
[data-theme="light"] .template-item, [data-theme="light"] .draft-row,
[data-theme="light"] .custom-product-row, [data-theme="light"] .smart-block,
[data-theme="light"] .week-card, [data-theme="light"] .achievement-card,
[data-theme="light"] .shop-card, [data-theme="light"] .modal-box,
[data-theme="light"] .collapse-card { background: #fff; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .card-title { color: #1a1c24; }
[data-theme="light"] .section-title { color: #6b7494; }
[data-theme="light"] .hint-text, [data-theme="light"] .muted,
[data-theme="light"] .small { color: #6b7494; }
[data-theme="light"] .hero-cal { color: #1a1c24; }
[data-theme="light"] .hero-sub, [data-theme="light"] .hero-lbl { color: #6b7494; }
[data-theme="light"] .mac { background: #edf0f8; border-color: rgba(0,0,0,.07); }
[data-theme="light"] .mac-name { color: #6b7494; }
[data-theme="light"] .mac-val, [data-theme="light"] .mac-val b { color: #1a1c24; }
[data-theme="light"] .mac-bar, [data-theme="light"] .wbar-wrap { background: #d8dce8; }
[data-theme="light"] .ring-track { stroke: #d8dce8; }
[data-theme="light"] .ring-center b { color: #1a1c24; }
[data-theme="light"] .interface-mode-box { background: rgba(124,93,250,.08); border-color: rgba(124,93,250,.22); }
[data-theme="light"] .interface-mode-head b { color: #1a1c24; }
[data-theme="light"] .interface-mode-btn { background: #edf0f8; border-color: rgba(0,0,0,.1); color: #3a3d52; }
[data-theme="light"] .interface-mode-btn.active { background: rgba(124,93,250,.16); border-color: rgba(124,93,250,.5); color: #5842d4; }
[data-theme="light"] .cloud-user-row { background: rgba(124,93,250,.07); border-color: rgba(124,93,250,.2); }
[data-theme="light"] .cloud-user-row b { color: #1a1c24; }
[data-theme="light"] .meal-group { background: #fff; }
[data-theme="light"] .meal-group-head { border-color: rgba(0,0,0,.07); }
[data-theme="light"] .meal-group-name { color: #1a1c24; }
[data-theme="light"] .meal-item { border-color: rgba(0,0,0,.06); background: #fff; }
[data-theme="light"] .meal-item:hover { background: #f8f9fc; }
[data-theme="light"] .meal-item-name { color: #1a1c24; }
[data-theme="light"] .meal-item-meta { color: #6b7494; }
[data-theme="light"] .meal-item-kcal { color: #3a3d52; }
[data-theme="light"] .bottom-nav { background: #fff; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .bn-icon svg { stroke: #7a80a0; }
[data-theme="light"] .bn-lbl { color: #7a80a0; }
[data-theme="light"] .bn-item.on .bn-icon { background: #7c5dfa; }
[data-theme="light"] .bn-item.on .bn-icon svg { stroke: #fff; }
[data-theme="light"] .bn-item.on .bn-lbl { color: #7c5dfa; }
[data-theme="light"] .btn-secondary, [data-theme="light"] .file-label,
[data-theme="light"] .chip, [data-theme="light"] .category-chip,
[data-theme="light"] .wbtn, [data-theme="light"] .weight-preset,
[data-theme="light"] .portion-preset, [data-theme="light"] .back-btn,
[data-theme="light"] .date-btn { background: #edf0f8; border-color: rgba(0,0,0,.1); color: #3a3d52; }
[data-theme="light"] .btn-secondary:hover { border-color: rgba(124,93,250,.4); }
[data-theme="light"] .chip.active, [data-theme="light"] .category-chip.active {
  background: rgba(124,93,250,.15); border-color: rgba(124,93,250,.5); color: #5842d4;
}
[data-theme="light"] .datebar { background: transparent; }
[data-theme="light"] .datebar strong, [data-theme="light"] .datebar-label { color: #1a1c24; }
[data-theme="light"] .water-card { background: #fff; }
[data-theme="light"] .water-lbl, [data-theme="light"] .water-val { color: #1a1c24; }
[data-theme="light"] .wbar-fill { }
[data-theme="light"] .search-result { background: #edf0f8; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .search-result-main { color: #1a1c24; }
[data-theme="light"] .search-result:hover { background: #e3e7f5; }
[data-theme="light"] .preview-box { background: #edf0f8; color: #1a1c24; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .del-btn { background: rgba(200,40,60,.1); color: #c02838; border-color: rgba(200,40,60,.2); }
[data-theme="light"] .collapse-summary { color: #1a1c24; }
[data-theme="light"] .collapse-summary::after { background: rgba(124,93,250,.12); color: #5842d4; }
[data-theme="light"] .stat-grid > div { background: #edf0f8; border-color: rgba(0,0,0,.07); }
[data-theme="light"] .day-row { border-color: rgba(0,0,0,.06); }
[data-theme="light"] .weight-chart { background: #fff; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .history-row b { color: #1a1c24; }
[data-theme="light"] .history-row span { color: #6b7494; }
[data-theme="light"] #toast { background: #1a1c24; color: #fff; }
[data-theme="light"] .status-banner { background: rgba(124,93,250,.12); border-color: rgba(124,93,250,.3); color: #3a3d52; }
[data-theme="light"] .smart-badge { background: rgba(74,222,128,.15); color: #1a7040; border-color: rgba(74,222,128,.35); }
[data-theme="light"] .font-size-preview { background: #edf0f8; color: #1a1c24; }
[data-theme="light"] .font-size-levels button { background: #edf0f8; border-color: rgba(0,0,0,.1); color: #3a3d52; }

/* ══════════════════════════════════════════════════
   v89: СВАЙП — ккал не перекрывается
══════════════════════════════════════════════════ */
.meal-item-inner { position: relative; z-index: 1; }
.swipe-del-btn { z-index: 0; }
/* Ensure kcal stays visible when swiped */
.meal-item.swiped .meal-item-kcal { opacity: 0; transition: opacity .2s; }
.meal-item-kcal { transition: opacity .2s; }

/* AI section card-titles in collapses */
.collapse-card .card-title { margin-bottom: 0; }

/* ══════════════════════════════════════════════════
   v90: UI FIXES — LIGHT THEME + GENERAL
══════════════════════════════════════════════════ */

/* 1. Topbar title visible in LIGHT theme */
[data-theme="light"] .sb-title { color: #1a1c24 !important; }
[data-theme="light"] .sb { background: #ffffff !important; border-color: rgba(0,0,0,.1) !important; }
[data-theme="light"] .sb-right { color: #6b7494 !important; }

/* 2. Water icon - softer background, not black */
.water-icon {
  background: rgba(34,211,238,.12) !important;
  border-color: rgba(34,211,238,.3) !important;
}
[data-theme="light"] .water-icon {
  background: rgba(34,211,238,.15) !important;
  border-color: rgba(34,211,238,.4) !important;
}

/* 3. Muted/placeholder text - darker for readability */
.hint-text, .muted, .small { color: #9096b0 !important; }
input::placeholder, textarea::placeholder { color: #7a80a0 !important; }
.field label { color: #b0b4c8 !important; }
.water-lbl { color: #9096b0 !important; }
[data-theme="light"] .hint-text, [data-theme="light"] .muted,
[data-theme="light"] .small { color: #5a6080 !important; }
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder { color: #7080a0 !important; }
[data-theme="light"] .field label { color: #5a6080 !important; }
[data-theme="light"] .water-lbl { color: #5a6080 !important; }

/* 4. Week cards - readable in light theme */
[data-theme="light"] .week-card {
  background: #fff !important;
  border-color: rgba(0,0,0,.1) !important;
}
[data-theme="light"] .week-card > b { color: #1a1c24 !important; }
[data-theme="light"] .week-card p { color: #5a6080 !important; }
[data-theme="light"] .week-stats span {
  background: #f0f3fa !important;
  border-color: rgba(0,0,0,.08) !important;
}
[data-theme="light"] .week-stats strong { color: #1a1c24 !important; }
[data-theme="light"] .week-stats small { color: #5a6080 !important; }

/* 5. Draft набор - gap between total and button */
#mealDraftTotal { margin-bottom: 8px !important; }
.draft-total-row { margin-bottom: 8px; }

/* 6. AI example chips - darker text, more readable */
.ai-example {
  color: #b0a8ff !important;
  border-color: rgba(124,93,250,.45) !important;
  background: rgba(124,93,250,.16) !important;
}
[data-theme="light"] .ai-example {
  color: #4a35cc !important;
  border-color: rgba(124,93,250,.4) !important;
  background: rgba(124,93,250,.1) !important;
}

/* 7. Smart parse textarea + button gap */
#smartParseText { margin-bottom: 8px !important; }
.smart-block label { margin-bottom: 8px !important; }
.smart-block label + button, .smart-block textarea + button { margin-top: 8px; }

/* 9. Analytics comparison section - fix dark cards on light theme */
[data-theme="light"] .stat-grid > div,
[data-theme="light"] .metric-chart,
[data-theme="light"] .day-row,
[data-theme="light"] .period-summary,
[data-theme="light"] .compare-block,
[data-theme="light"] .week-compare > div,
[data-theme="light"] .best-day-row,
[data-theme="light"] .week-col { background: #f0f3fa !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .stat-grid b,
[data-theme="light"] .stat-grid strong { color: #1a1c24 !important; }
[data-theme="light"] .stat-grid small,
[data-theme="light"] .stat-grid span { color: #5a6080 !important; }

/* 10. Settings - lighter background for cards in light theme */
[data-theme="light"] .card.form-card,
[data-theme="light"] .card {
  background: #ffffff !important;
  border-color: rgba(0,0,0,.1) !important;
}
[data-theme="light"] .collapse-card {
  background: #ffffff !important;
  border-color: rgba(0,0,0,.1) !important;
}
/* The Настройки приложения sub-collapse should look different */
[data-theme="light"] details > .collapse-body {
  background: #f8f9fd;
}
[data-theme="light"] .font-size-levels button,
[data-theme="light"] [data-weight-level] {
  background: #f0f3fa !important;
  border-color: rgba(0,0,0,.1) !important;
  color: #3a3d52 !important;
}
[data-theme="light"] .font-size-preview {
  background: #f0f3fa !important;
  color: #1a1c24 !important;
}
[data-theme="light"] .font-size-preview b { color: #1a1c24 !important; }

/* Smart badge in AI - cleaner */
.smart-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(74,222,128,.3);
  background: rgba(74,222,128,.1);
  color: #4ade80;
}

/* Fix collapse summary visible text in light */
[data-theme="light"] .collapse-summary { color: #1a1c24 !important; }


/* ══════════════════════════════════════════════════
   v92: LIGHT THEME DEEP FIX
══════════════════════════════════════════════════ */

/* 1. Diary history blocks */
.diary-hist-block {
  margin-bottom: 8px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.07);
  background: #161820;
  overflow: hidden;
}
.diary-hist-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px 6px;
  cursor: pointer;
}
.diary-hist-head b { font-size: 12px; color: #e8eaf0; }
.diary-hist-head span { font-size: 10px; color: #7c82a0; }
.diary-hist-list { padding: 0 10px 8px; }
.diary-hist-row {
  font-size: 11px;
  color: #9196ad;
  padding: 2px 0;
  border-top: 1px solid rgba(255,255,255,.04);
}

[data-theme="light"] .diary-hist-block {
  background: #f4f6fb !important;
  border-color: rgba(0,0,0,.09) !important;
}
[data-theme="light"] .diary-hist-head b { color: #1a1c24 !important; }
[data-theme="light"] .diary-hist-head span { color: #5a6080 !important; }
[data-theme="light"] .diary-hist-row { color: #5a6080 !important; border-color: rgba(0,0,0,.06) !important; }

/* 2. Analytics collapses — buttons Historie веса, Графики etc */
[data-theme="light"] .collapse-card {
  background: #ffffff !important;
  border-color: rgba(0,0,0,.1) !important;
}
[data-theme="light"] .collapse-summary { color: #1a1c24 !important; }
[data-theme="light"] .collapse-body { background: #fff; }

/* 3. Week compare rows */
[data-theme="light"] .compare-list > div {
  background: #f0f3fa !important;
  border-color: rgba(0,0,0,.07) !important;
}
[data-theme="light"] .compare-list span { color: #3a3d52 !important; }
[data-theme="light"] .compare-list b { color: #1a1c24 !important; }
[data-theme="light"] .compare-list em { color: #5a6080 !important; }
[data-theme="light"] .week-compare > div {
  background: #f0f3fa !important;
  border-color: rgba(0,0,0,.07) !important;
}
[data-theme="light"] .week-compare b { color: #1a1c24 !important; }
[data-theme="light"] .week-compare span { color: #5a6080 !important; }
[data-theme="light"] .best-day { border-color: rgba(0,0,0,.07) !important; }
[data-theme="light"] .best-day b { color: #1a1c24 !important; }
[data-theme="light"] .best-day p { color: #5a6080 !important; }
[data-theme="light"] .day-row { border-color: rgba(0,0,0,.06) !important; }
[data-theme="light"] .day-row-label b { color: #1a1c24 !important; }
[data-theme="light"] .trend-list span {
  background: #f0f3fa !important;
  border-color: rgba(0,0,0,.08) !important;
  color: #3a3d52 !important;
}
[data-theme="light"] .metric-chart-grid .metric-chart {
  background: #f0f3fa !important;
  border-color: rgba(0,0,0,.07) !important;
}

/* 4. Font size A letters — darker in light theme */
[data-theme="light"] .font-size-a { color: #3a3d52 !important; }
[data-theme="light"] .font-size-slider { background: #e8ebf4 !important; }
[data-theme="light"] .font-size-slider input[type=range] { accent-color: #7c5dfa; }

/* Extra: stat-grid, period cards */
[data-theme="light"] .stat-card,
[data-theme="light"] .stat-period-block { background: #f0f3fa !important; border-color: rgba(0,0,0,.07) !important; }
[data-theme="light"] .stat-card b,
[data-theme="light"] .stat-card strong { color: #1a1c24 !important; }
[data-theme="light"] .stat-card small,
[data-theme="light"] .stat-card p { color: #5a6080 !important; }

/* Buttons in light: ensure not dark */
[data-theme="light"] .btn-secondary,
[data-theme="light"] .file-label {
  background: #edf0f8 !important;
  border-color: rgba(0,0,0,.1) !important;
  color: #3a3d52 !important;
}
[data-theme="light"] .btn-danger {
  background: rgba(200,40,60,.08) !important;
  border-color: rgba(200,40,60,.2) !important;
  color: #b02030 !important;
}

/* ══════════════════════════════════════════════════
   v93: STAT TOGGLE BUTTONS + CONFIRM LABEL + MISC
══════════════════════════════════════════════════ */

/* 1. Analytics toggle buttons — light theme */
[data-theme="light"] .stat-toggle-btn {
  background: #ffffff !important;
  border-color: rgba(124,93,250,.25) !important;
  color: #1a1c24 !important;
}
[data-theme="light"] .stat-toggle-btn::after {
  background: rgba(124,93,250,.12) !important;
  color: #7c5dfa !important;
}

/* 2. Confirm delete label — darker */
.check-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #c0c4d6;
  font-weight: 500;
  padding: 4px 2px;
}
[data-theme="light"] .check-label { color: #3a3d52 !important; }

/* 3. Font-size-a — always theme-aware */
.font-size-a { color: #e8eaf0; font-weight: 800; line-height: 1; }
[data-theme="light"] .font-size-a { color: #3a3d52 !important; }

/* 4. stat-period quick action chips */
[data-theme="light"] .quick-action,
[data-theme="light"] .action-chip {
  background: #edf0f8 !important;
  border-color: rgba(0,0,0,.1) !important;
  color: #3a3d52 !important;
}

/* 5. stat cards overall (catches remaining dark ones) */
[data-theme="light"] .period-summary,
[data-theme="light"] .period-summary h3 { color: #1a1c24 !important; }
[data-theme="light"] .period-summary p { color: #5a6080 !important; }
[data-theme="light"] .card.period-summary { background: #fff !important; border-color: rgba(0,0,0,.1) !important; }

/* History веса weight-row */
[data-theme="light"] .weight-log-row,
[data-theme="light"] .weight-entry { background: #f4f6fb !important; border-color: rgba(0,0,0,.07) !important; }
[data-theme="light"] .weight-log-row b { color: #1a1c24 !important; }
[data-theme="light"] .weight-log-row span { color: #5a6080 !important; }

/* ══════════════════════════════════════════════════
   v94: ТРЕНИРОВКИ
══════════════════════════════════════════════════ */
.workout-day-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 14px;
  margin-bottom: 8px;
  background: var(--card-bg, #161820);
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 12px;
}
.workout-day-status { font-size: 13px; font-weight: 600; color: #e8eaf0; }

.workout-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.workout-row:last-child { border-bottom: 0; }
.workout-row-info { flex: 1; min-width: 0; }
.workout-row-info b { display: block; font-size: 13px; font-weight: 700; color: #e8eaf0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.workout-row-info span { font-size: 10px; color: #7c82a0; margin-top: 1px; }
.workout-row-kcal { font-size: 13px; font-weight: 700; color: #7c5dfa; flex-shrink: 0; }

/* Таблица подходов в форме силовых */
.sets-table { width: 100%; border-collapse: collapse; }
.sets-table th { font-size: 11px; color: var(--c-muted, #7c82a0); font-weight: 600; text-align: left; padding: 0 6px 4px; }
.sets-table th:first-child { width: 48px; }
.sets-table td { padding: 3px 4px; }
.sets-table input[type="number"] {
  width: 100%;
  min-height: 32px;
  padding: 0 6px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.12);
  background: var(--c-card2, #1e2030);
  color: inherit;
  font-size: 13px;
  text-align: center;
}
.sets-table .set-num {
  font-size: 12px;
  color: var(--c-muted, #7c82a0);
  text-align: center;
  font-weight: 600;
}

.workout-stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 4px;
}
.workout-stat {
  background: #1b1e2b;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  padding: 10px 8px;
  text-align: center;
}
.workout-stat-val { font-size: 20px; font-weight: 800; color: #e8eaf0; line-height: 1.1; }
.workout-stat-lbl { font-size: 9px; color: #7c82a0; margin-top: 3px; text-transform: uppercase; letter-spacing: .04em; }

/* Bottom nav 6 items */
.bottom-nav { grid-template-columns: repeat(6, 1fr); }
.bn-icon svg { width: 14px; height: 14px; }
.bn-lbl { font-size: 8px; }

/* Light theme workout */
[data-theme="light"] .workout-day-banner { background: #fff; border-color: rgba(0,0,0,.1); }
[data-theme="light"] .workout-day-status { color: #1a1c24; }
[data-theme="light"] .workout-row { border-color: rgba(0,0,0,.06); }
[data-theme="light"] .workout-row-info b { color: #1a1c24; }
[data-theme="light"] .workout-row-info span { color: #5a6080; }
[data-theme="light"] .workout-stat { background: #f0f3fa; border-color: rgba(0,0,0,.07); }
[data-theme="light"] .workout-stat-val { color: #1a1c24; }
[data-theme="light"] .workout-stat-lbl { color: #5a6080; }

/* ══════════════════════════════════════════════════
   v98: SMART SUGGESTIONS + WORKOUT BADGE + DRAG
══════════════════════════════════════════════════ */

/* Workout burned badge */
.workout-burned-badge {
  font-size: 11px;
  font-weight: 600;
  color: #4ade80;
  margin-top: 3px;
  display: block;
}

/* Smart macro suggestions */
.smart-suggestions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 8px 0 2px;
}
.smart-suggest-label {
  font-size: 10px;
  color: #7c82a0;
  font-weight: 600;
  white-space: nowrap;
}
.smart-suggest-chip {
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid;
  background: transparent;
  cursor: pointer;
  transition: all .15s;
  white-space: nowrap;
}
.smart-suggest-chip:hover { opacity: .8; }

/* Drag & drop */
.meal-item[draggable="true"] { cursor: grab; }
.meal-item[draggable="true"]:active { cursor: grabbing; }
.meal-item.drag-ghost { opacity: .4; }
.meal-item.drag-over {
  border-top: 2px solid #7c5dfa !important;
  margin-top: -1px;
}

/* chip-section-label */
.chip-section-label {
  font-size: 10px;
  font-weight: 700;
  color: #7c82a0;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 4px 0 2px;
  width: 100%;
}

/* Light theme */
[data-theme="light"] .workout-burned-badge { color: #1a7040; }
[data-theme="light"] .smart-suggest-label { color: #5a6080; }

/* ══════════════════════════════════════════════════
   v99: QUICK ADD POPOVER + ENTRY DETAIL
══════════════════════════════════════════════════ */

/* Quick add popover */
.quick-add-popover {
  position: fixed;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
  width: min(380px, calc(100vw - 24px));
  background: #1a1d2e;
  border: 1px solid rgba(124,93,250,.35);
  border-radius: 16px;
  padding: 14px;
  z-index: 300;
  box-shadow: 0 20px 60px rgba(0,0,0,.6);
  animation: slideUpPop .18s ease;
}
@keyframes slideUpPop { from { opacity:0; transform:translateX(-50%) translateY(16px); } to { opacity:1; transform:translateX(-50%) translateY(0); } }

.qap-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.qap-name { font-size:14px; font-weight:700; color:#e8eaf0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:280px; }
.qap-close { width:24px; height:24px; border-radius:6px; background:rgba(255,255,255,.1); border:0; color:#e8eaf0; font-size:16px; cursor:pointer; flex-shrink:0; }

.qap-presets { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px; }
.qap-preset {
  padding:5px 10px; border-radius:8px; font-size:11px; font-weight:700;
  border:1px solid rgba(255,255,255,.12); background:#1b1e2b; color:#9196ad;
  cursor:pointer; transition:all .12s;
}
.qap-preset.active, .qap-preset:hover { border-color:rgba(124,93,250,.6); background:rgba(124,93,250,.18); color:#c0b8ff; }

.qap-row { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.qap-input { flex:1; min-height:38px; border-radius:9px; }
.qap-kcal { font-size:13px; font-weight:700; color:#7c5dfa; min-width:70px; text-align:right; }

.qap-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }

/* Entry detail */
.entry-detail-modal .modal-box { max-width:360px; }
.entry-detail-grid { display:grid; gap:6px; }
.entry-detail-row {
  display:grid; grid-template-columns:1fr auto 60px;
  align-items:center; gap:8px;
  padding:7px 0; border-bottom:1px solid rgba(255,255,255,.06);
  font-size:13px;
}
.entry-detail-row span:first-child { color:#9196ad; }
.entry-detail-row b { color:#e8eaf0; text-align:right; }
.entry-pct { font-size:10px; color:#7c5dfa; text-align:right; }

/* Light theme */
[data-theme="light"] .quick-add-popover { background:#fff; border-color:rgba(124,93,250,.25); }
[data-theme="light"] .qap-name { color:#1a1c24; }
[data-theme="light"] .qap-close { background:rgba(0,0,0,.08); color:#3a3d52; }
[data-theme="light"] .qap-preset { background:#f0f3fa; border-color:rgba(0,0,0,.1); color:#5a6080; }
[data-theme="light"] .qap-preset.active { background:rgba(124,93,250,.12); border-color:rgba(124,93,250,.4); color:#5842d4; }
[data-theme="light"] .entry-detail-row span:first-child { color:#5a6080; }
[data-theme="light"] .entry-detail-row b { color:#1a1c24; }
[data-theme="light"] .entry-detail-row { border-color:rgba(0,0,0,.07); }

/* ══════════════════════════════════════════════════
   v100: WORKOUT CHART + DAY BADGE + MACRO COLORS
══════════════════════════════════════════════════ */

/* Workout chart bar color - orange/red like burn */
.chart-workout .metric-bar,
.metric-bars.chart-workout span {
  background: linear-gradient(to top, #f5a623, #ff6b35) !important;
}
.metric-bars.chart-workout span.hit {
  background: linear-gradient(to top, #ff6b35, #f5a623) !important;
}

/* Day row workout badge */
.day-workout-badge {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 10px;
  font-weight: 600;
  color: #4ade80;
  background: rgba(74,222,128,.1);
  border: 1px solid rgba(74,222,128,.25);
  border-radius: 6px;
  padding: 1px 6px;
  margin-top: 2px;
}
.day-row-label { display:flex; flex-direction:column; gap:2px; }

/* Smart suggestion chips - protein green, fat orange, carbs purple */
.smart-suggest-chip[style*="#43e97b"] { background: rgba(67,233,123,.08) !important; }
.smart-suggest-chip[style*="#e040fb"] { background: rgba(224,64,251,.08) !important; }
.smart-suggest-chip[style*="#f5a623"] { background: rgba(245,166,35,.08) !important; }
.smart-suggest-chip[style*="#7c5dfa"] { background: rgba(124,93,250,.08) !important; }
.smart-suggest-chip[style*="#ff6482"] { background: rgba(255,100,130,.08) !important; }

/* Light theme */
[data-theme="light"] .day-workout-badge { color: #1a7040; background: rgba(74,222,128,.1); border-color: rgba(74,222,128,.3); }

/* ══════════════════════════════════════════════════
   v101: DRAG & DROP БЛОКОВ ДНЕВНИКА
══════════════════════════════════════════════════ */

/* Layout bar */
.diary-layout-bar {
  display: flex;
  justify-content: flex-end;
  padding: 4px 0 0;
}
.diary-edit-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  color: #7c82a0;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 8px;
  padding: 5px 10px;
  cursor: pointer;
  transition: all .15s;
}
.diary-edit-btn:hover { color: #a899f5; border-color: rgba(124,93,250,.4); }
.diary-edit-btn.active {
  color: #4ade80;
  border-color: rgba(74,222,128,.4);
  background: rgba(74,222,128,.08);
}

/* Diary blocks */
.diary-block {
  transition: transform .15s ease, opacity .15s ease;
  border-radius: 12px;
}
.diary-block + .diary-block { margin-top: 0; }

/* Edit mode */
.diary-edit-mode .diary-block {
  border: 1.5px dashed rgba(124,93,250,.35) !important;
  border-radius: 12px;
  margin-bottom: 4px;
  cursor: grab;
}
.diary-edit-mode .diary-block:hover {
  border-color: rgba(124,93,250,.7) !important;
}

/* Drag handle */
.block-drag-handle {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  background: rgba(124,93,250,.1);
  border-radius: 10px 10px 0 0;
  cursor: grab;
  font-size: 11px;
  font-weight: 700;
  color: #a899f5;
  margin-bottom: 0;
  user-select: none;
  -webkit-user-select: none;
}
.block-drag-handle svg { stroke: #a899f5; flex-shrink: 0; }
.block-drag-handle:active { cursor: grabbing; }

/* Drag states */
.block-dragging {
  opacity: .5;
  transform: scale(.98);
}
.block-drag-target {
  border-color: rgba(124,93,250,.9) !important;
  background: rgba(124,93,250,.06);
}
.block-drag-target::before {
  content: '';
  display: block;
  height: 3px;
  background: #7c5dfa;
  border-radius: 2px;
  margin-bottom: 4px;
}

/* Light theme */
[data-theme="light"] .diary-edit-btn { background: #f0f3fa; border-color: rgba(0,0,0,.1); color: #5a6080; }
[data-theme="light"] .diary-edit-btn.active { background: rgba(74,222,128,.1); border-color: rgba(74,222,128,.4); color: #1a7040; }
[data-theme="light"] .diary-edit-mode .diary-block { border-color: rgba(124,93,250,.3) !important; }
[data-theme="light"] .block-drag-handle { background: rgba(124,93,250,.08); color: #5842d4; }
[data-theme="light"] .block-drag-handle svg { stroke: #5842d4; }

/* ══════════════════════════════════════════════════
   v102: УНИВЕРСАЛЬНЫЙ МЕНЕДЖЕР БЛОКОВ
══════════════════════════════════════════════════ */

/* Layout icon button (all screens) */
.screen-layout-bar {
  display: flex;
  justify-content: flex-end;
  padding: 2px 0 4px;
}
.layout-icon-btn {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; transition: all .15s;
  color: #7c82a0;
}
.layout-icon-btn svg { stroke: currentColor; }
.layout-icon-btn:hover { background: rgba(124,93,250,.12); border-color: rgba(124,93,250,.4); color: #a899f5; }
.layout-icon-btn.active { background: rgba(74,222,128,.12); border-color: rgba(74,222,128,.4); color: #4ade80; }

/* Diary layout bar spacing */
.diary-layout-bar { display: none; } /* replaced by screen-layout-bar */

/* Edit mode */
.screen-edit-mode [data-diary-block],
.screen-edit-mode [data-screen-block],
#diary.screen-edit-mode [data-diary-block] {
  border: 1.5px dashed rgba(124,93,250,.4) !important;
  border-radius: 12px;
  margin-bottom: 4px;
}

/* Drag handle */
.block-drag-handle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px;
  background: rgba(124,93,250,.1);
  border-radius: 10px 10px 0 0;
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
.block-drag-handle:active { cursor: grabbing; }
.bdh-left {
  display: flex;
  align-items: center;
  gap: 6px;
  cursor: grab;
  flex: 1;
  min-width: 0;
}
.bdh-left:active,
.bdh-name:active { cursor: grabbing; }
.bdh-grip { stroke: #a899f5; flex-shrink: 0; }
.bdh-name { font-size: 11px; font-weight: 700; color: #a899f5; cursor: grab; }
.bdh-required { font-size: 10px; color: #7c82a0; }

/* Toggle switch */
.bdh-toggle {
  display: flex;
  align-items: center;
  cursor: pointer;
  flex-shrink: 0;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  line-height: 1;
}
.bdh-cb { display: none; }
.bdh-switch {
  width: 34px; height: 18px;
  background: rgba(255,255,255,.15);
  border-radius: 9px;
  position: relative;
  transition: background .2s;
}
.bdh-switch::after {
  content: '';
  position: absolute;
  top: 2px; left: 2px;
  width: 14px; height: 14px;
  border-radius: 50%;
  background: #fff;
  transition: transform .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.3);
}
.bdh-cb:checked + .bdh-switch,
.bdh-toggle[aria-pressed="true"] .bdh-switch { background: #7c5dfa; }
.bdh-cb:checked + .bdh-switch::after,
.bdh-toggle[aria-pressed="true"] .bdh-switch::after { transform: translateX(16px); }

/* Drag states */
.block-dragging { opacity: .45; }
.block-drag-target { outline: 2px solid #7c5dfa; outline-offset: 2px; border-radius: 12px; }

/* Light theme */
[data-theme="light"] .layout-icon-btn { background: #edf0f8; border-color: rgba(0,0,0,.1); color: #5a6080; }
[data-theme="light"] .layout-icon-btn.active { background: rgba(74,222,128,.1); border-color: rgba(74,222,128,.35); color: #1a7040; }
[data-theme="light"] .block-drag-handle { background: rgba(124,93,250,.08); }
[data-theme="light"] .bdh-name { color: #5842d4; }
[data-theme="light"] .bdh-grip { stroke: #5842d4; }
[data-theme="light"] .screen-edit-mode [data-diary-block],
[data-theme="light"] .screen-edit-mode [data-screen-block] { border-color: rgba(124,93,250,.3) !important; }

/* ══════════════════════════════════════════════════
   v104: КНОПКА «ПО УМОЛЧАНИЮ» + ANALYTICS BLOCKS
══════════════════════════════════════════════════ */
.block-reset-btn {
  font-size: 11px;
  font-weight: 600;
  color: #7c82a0;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 7px;
  padding: 4px 10px;
  cursor: pointer;
  transition: all .15s;
  margin-right: 6px;
}
.block-reset-btn:hover {
  color: #ff6482;
  border-color: rgba(255,100,130,.4);
  background: rgba(255,100,130,.08);
}
[data-theme="light"] .block-reset-btn { background: #edf0f8; border-color: rgba(0,0,0,.1); color: #5a6080; }
[data-theme="light"] .block-reset-btn:hover { color: #b02030; border-color: rgba(200,40,60,.3); background: rgba(200,40,60,.06); }

/* Analytics dynamic blocks */
[data-screen-block^="stat-"] { border-radius: 0; }

/* ══════════════════════════════════════════════════
   v105: SCREEN TITLE BAR — заголовок + кнопка
══════════════════════════════════════════════════ */
.screen-title-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0 4px;
  margin-bottom: 2px;
}
.screen-title-label {
  font-size: 18px;
  font-weight: 700;
  color: #e8eaf0;
  flex: 1;
}
/* Override old layout bar styles when combined with title */
.screen-title-bar.screen-layout-bar { padding: 6px 0 4px; }

[data-theme="light"] .screen-title-label { color: #1a1c24; }

/* ══════════════════════════════════════════════════
   v106: RESET BUTTON — inline with icon btn
══════════════════════════════════════════════════ */
/* Reset btn is inserted before layout icon btn, so they sit right next to each other */
.block-reset-btn {
  margin-right: 4px; /* small gap between reset btn and icon btn */
}
/* Ensure title bar right side is flex */
.screen-title-bar { gap: 8px; }

/* ══════════════════════════════════════════════════
   v109: Скрытие стрелок у числовых инпутов на мобиле
══════════════════════════════════════════════════ */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] { -moz-appearance: textfield; }

/* ══════════════════════════════════════════════════
   v109: Skip navigation — доступность (скринридеры)
══════════════════════════════════════════════════ */
.skip-nav {
  position: absolute;
  top: -100px;
  left: 0;
  background: var(--c-accent, #7c5dfa);
  color: #fff;
  padding: 8px 16px;
  border-radius: 0 0 8px 0;
  font-size: 14px;
  font-weight: 600;
  z-index: 9999;
  transition: top .15s;
  text-decoration: none;
}
.skip-nav:focus { top: 0; }

/* ══════════════════════════════════════════════════
   v109: Pull-to-refresh индикатор
══════════════════════════════════════════════════ */
.ptr-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 0;
  overflow: hidden;
  transition: height .2s;
  color: var(--c-muted, #7c82a0);
  font-size: 13px;
  gap: 8px;
  pointer-events: none; /* не перехватываем клики */
  position: relative;
  z-index: 0; /* не перекрываем навигацию */
}
.ptr-indicator.visible { height: 44px; }
.ptr-spinner {
  width: 18px; height: 18px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: ptr-spin .7s linear infinite;
  flex-shrink: 0;
}
@keyframes ptr-spin { to { transform: rotate(360deg); } }

/* ══════════════════════════════════════════════════
   v109: Food Score карточка
══════════════════════════════════════════════════ */
.food-score-ring {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 0 6px;
}
.food-score-svg { flex-shrink: 0; }
.food-score-details { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.food-score-row { display: flex; justify-content: space-between; font-size: 12px; }
.food-score-label { color: var(--c-muted, #7c82a0); }
.food-score-val { font-weight: 600; }

/* ══════════════════════════════════════════════════
   v109: Замеры тела
══════════════════════════════════════════════════ */
.measurements-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}
.measurement-card {
  background: var(--c-card2, #1e2030);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.measurement-label { font-size: 11px; color: var(--c-muted, #7c82a0); }
.measurement-val { font-size: 18px; font-weight: 700; }
.measurement-delta { font-size: 11px; }
.measurement-delta.pos { color: #1D9E75; }
.measurement-delta.neg { color: #ff4757; }

/* ══════════════════════════════════════════════════
   v111: «Ещё» попап меню
══════════════════════════════════════════════════ */
/* Nav grid: 5 columns */
.bottom-nav { grid-template-columns: repeat(5, 1fr) !important; }

.more-menu-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 8px;
  background: rgba(255,255,255,.04);
  border: 0.5px solid rgba(255,255,255,.08);
  border-radius: 12px;
  cursor: pointer;
  color: #c0c4de;
  font-size: 12px;
  font-weight: 500;
  transition: background .12s;
}
.more-menu-item:hover,
.more-menu-item:active { background: rgba(124,93,250,.18); color: #a899f5; }
.more-menu-item svg { stroke: currentColor; }

[data-theme="light"] .more-menu-item {
  background: rgba(0,0,0,.04);
  border-color: rgba(0,0,0,.08);
  color: #3a3d52;
}
[data-theme="light"] #moreMenuPopup { background: #fff; border-color: rgba(124,93,250,.25); }

/* ══════════════════════════════════════════════════
   v113: stat-collapse — прогноз и TDEE в стиле остальной аналитики
══════════════════════════════════════════════════ */
.stat-collapse {
  margin-bottom: 8px;
  border-radius: 10px;
  overflow: hidden;
}
.stat-collapse-summary {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(124,93,250,.34);
  background: #202338;
  color: #d9dcff;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  list-style: none;
}
.stat-collapse-summary::-webkit-details-marker { display: none; }
.stat-collapse-summary::after {
  content: "+";
  width: 22px; height: 22px;
  display: grid; place-items: center;
  border-radius: 8px;
  background: rgba(124,93,250,.18);
  color: #fff;
  flex-shrink: 0;
}
.stat-collapse[open] .stat-collapse-summary::after { content: "−"; }
.stat-collapse[open] .stat-collapse-summary {
  border-radius: 10px 10px 0 0;
  border-bottom-color: rgba(124,93,250,.2);
}
.stat-collapse-body {
  background: #161820;
  border: 1px solid rgba(124,93,250,.2);
  border-top: none;
  border-radius: 0 0 10px 10px;
  padding: 0;
}
.stat-collapse-body > * { margin-bottom: 0 !important; border-radius: 0 !important; }
[data-theme="light"] .stat-collapse-summary {
  background: #f0efff;
  border-color: rgba(124,93,250,.3);
  color: #3a3060;
}
[data-theme="light"] .stat-collapse-body { background: #fff; border-color: rgba(124,93,250,.15); }

/* ══════════════════════════════════════════════════
   v115: Рецепты в стиле Мои продукты
══════════════════════════════════════════════════ */
.custom-product-info { flex: 1; min-width: 0; }
.custom-product-name { font-size: 12px; font-weight: 700; color: var(--c-text, #e8eaf0); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.custom-product-meta { font-size: 10px; color: #7c82a0; margin-top: 2px; white-space: normal; line-height: 1.4; }
#recipesList .custom-product-row { margin-bottom: 6px; }
[data-theme="light"] .custom-product-name { color: #1a1c24; }
[data-theme="light"] .custom-product-meta { color: #6b6f87; }

/* ══════════════════════════════════════════════════
   v118: Фиксы светлой темы
══════════════════════════════════════════════════ */

/* 3. Ещё попап — светлая тема: белый текст → тёмный */
[data-theme="light"] #moreMenuPopup {
  background: #fff;
  border-color: rgba(124,93,250,.3);
  box-shadow: 0 8px 32px rgba(0,0,0,.15);
}
[data-theme="light"] .more-menu-item {
  background: #f4f3ff;
  border-color: rgba(124,93,250,.2);
  color: #2d2d4a;
}
[data-theme="light"] .more-menu-item:hover,
[data-theme="light"] .more-menu-item:active {
  background: rgba(124,93,250,.12);
  color: #5842d4;
}

/* 4. Тип дня / refeedWrap — светлая тема */
[data-theme="light"] #refeedWrap {
  color: #3a3d52;
}
[data-theme="light"] #refeedSelect {
  background: #fff;
  border-color: rgba(0,0,0,.15);
  color: #1a1c24;
}
[data-theme="light"] #refeedBadge {
  color: #5842d4;
}

/* 5. Серый фон у информационных плашек (preview-box, target-explain) в светлой теме */
[data-theme="light"] .preview-box,
[data-theme="light"] #profileRes {
  background: #f0f0f5;
  border: 1px solid rgba(0,0,0,.08);
  color: #1a1c24;
}
[data-theme="light"] .target-explain {
  background: #f0f0f5;
  border-radius: 8px;
  padding: 8px 10px;
  color: #3a3d52;
}
[data-theme="light"] #plannerWeekSummary {
  background: #f4f3ff;
  border: 1px solid rgba(124,93,250,.15);
}

/* 6. Кнопка Изм. (secondary) — светлая тема */
[data-theme="light"] .secondary {
  background: #f0f0f5;
  color: #2d2d4a;
  border-color: rgba(0,0,0,.12);
}
[data-theme="light"] .secondary:hover {
  background: #e8e8f0;
}
[data-theme="light"] .custom-actions .secondary,
[data-theme="light"] .mini-actions .secondary {
  background: #ebebf5;
  color: #3a3d52;
  border-color: rgba(0,0,0,.1);
}

/* 7. Продукты с лайком в умном поиске — светлая тема */
[data-theme="light"] .chip-fav,
[data-theme="light"] .fav-chip,
[data-theme="light"] [data-fav="1"] .chip,
[data-theme="light"] .food-chip.fav {
  background: rgba(124,93,250,.12);
  border-color: rgba(124,93,250,.35);
  color: #5842d4;
}
/* Избранное чипы в светлой теме */
[data-theme="light"] .chips-row .chip.active,
[data-theme="light"] #favQuick .chip {
  background: #f0eeff;
  border-color: rgba(124,93,250,.4);
  color: #5842d4;
}
[data-theme="light"] #favQuick .chip .chip-del {
  color: #7c5dfa;
}

/* Custom product row light theme fix */
[data-theme="light"] .custom-product-row {
  background: #f7f7fb;
  border-color: rgba(0,0,0,.08);
}
[data-theme="light"] .weight-row {
  background: #f7f7fb;
  border-color: rgba(0,0,0,.08);
}

/* stat-collapse light theme */
[data-theme="light"] .stat-collapse-summary {
  background: #f0eeff;
  border-color: rgba(124,93,250,.3);
  color: #2d2060;
}
[data-theme="light"] .stat-collapse-body {
  background: #fafafa;
  border-color: rgba(124,93,250,.15);
}

/* Info card light theme */
[data-theme="light"] .info-card {
  background: #f7f7fb;
  color: #1a1c24;
}

/* Muted text contrast in light theme */
[data-theme="light"] .muted,
[data-theme="light"] .hint-text {
  color: #6b6f87;
}
[data-theme="light"] .small {
  color: #6b6f87;
}

/* More menu popup icon colors in light theme already use currentColor */
[data-theme="light"] .more-menu-item svg {
  stroke: currentColor;
}


/* ══════════════════════════════════════════════════
   v119: Критические фиксы светлой темы (с !important для перебития специфичности)
══════════════════════════════════════════════════ */

/* 1. Тип дня — select элемент */
[data-theme="light"] #refeedSelect {
  background: #fff !important;
  color: #1a1c24 !important;
  border-color: rgba(0,0,0,.2) !important;
}
[data-theme="light"] #refeedWrap span {
  color: #3a3d52 !important;
}

/* 3. Ещё попап — серый фон кнопок, светлый текст */
[data-theme="light"] #moreMenuPopup {
  background: #f5f5f7 !important;
  border: 1px solid rgba(0,0,0,.1) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,.12) !important;
}
[data-theme="light"] .more-menu-item {
  background: #eeeef3 !important;
  color: #1a1c24 !important;
  border-color: rgba(0,0,0,.08) !important;
}
[data-theme="light"] .more-menu-item:hover,
[data-theme="light"] .more-menu-item:active {
  background: #e2e1f0 !important;
  color: #3824b4 !important;
}
[data-theme="light"] .more-menu-item span {
  color: inherit !important;
}
[data-theme="light"] .more-menu-item svg {
  stroke: currentColor !important;
}

/* 4. Замеры тела — карточки показателей */
[data-theme="light"] .measurement-card {
  background: #eeeef3 !important;
  color: #1a1c24 !important;
}
[data-theme="light"] .measurement-label {
  color: #5c6180 !important;
}
[data-theme="light"] .measurement-val {
  color: #1a1c24 !important;
}
[data-theme="light"] .measurements-grid .card,
[data-theme="light"] #measurements .card {
  background: #f5f5f7 !important;
}

/* Также фикс для custom-product-row и weight-row */
[data-theme="light"] .custom-product-row {
  background: #eeeef3 !important;
  border-color: rgba(0,0,0,.07) !important;
  color: #1a1c24 !important;
}
[data-theme="light"] .weight-row {
  background: #eeeef3 !important;
  border-color: rgba(0,0,0,.07) !important;
}

/* stat-collapse в светлой теме */
[data-theme="light"] .stat-collapse-summary {
  background: #eeeef8 !important;
  border-color: rgba(88,66,212,.25) !important;
  color: #2d1f8c !important;
}
[data-theme="light"] .stat-collapse-body {
  background: #f9f9fc !important;
  border-color: rgba(88,66,212,.12) !important;
}

/* Вся карточка замеров и её контент */
[data-theme="light"] #measCurrentGrid,
[data-theme="light"] #measHistoryList {
  color: #1a1c24 !important;
}
[data-theme="light"] #measHistoryList b {
  color: #1a1c24 !important;
}

/* Rec card (AI экран) */
[data-theme="light"] .rec {
  background: #eeeef3 !important;
  border-color: rgba(0,0,0,.08) !important;
}


/* ══════════════════════════════════════════════════
   v120: CSS фиксы
══════════════════════════════════════════════════ */

/* 1. Info card — текст читаемый в светлой теме */
[data-theme="light"] .info-card,
[data-theme="light"] #infoBody {
  background: #f7f7fb !important;
  color: #1a1c24 !important;
}
[data-theme="light"] .info-card h3,
[data-theme="light"] #infoBody h3 {
  color: #1a1c24 !important;
}
[data-theme="light"] .info-card p,
[data-theme="light"] #infoBody p {
  color: #3a3d52 !important;
}
[data-theme="light"] .info-card .muted,
[data-theme="light"] #infoBody .muted {
  color: #5c6180 !important;
}

/* 2. Избранные продукты в умном поиске — фиолетовый фон */
/* food-chip с сердечком (лайкнутые) */
.food-chip[data-fav="1"],
.food-chip.is-fav {
  background: rgba(124,93,250,.18) !important;
  border-color: rgba(124,93,250,.5) !important;
  color: #c4b8ff !important;
}
[data-theme="light"] .food-chip[data-fav="1"],
[data-theme="light"] .food-chip.is-fav {
  background: rgba(124,93,250,.12) !important;
  border-color: rgba(124,93,250,.4) !important;
  color: #5842d4 !important;
}
/* Кнопка ♡ у лайкнутых */
.food-chip[data-fav="1"] .chip-fav-btn,
.food-chip.is-fav .chip-fav-btn {
  color: #a080ff !important;
}

/* 4. Дни с записями — отступ от краёв карточки */
.day-row {
  padding: 8px 10px !important;
}
/* Первый и последний row */
.day-row:first-child { padding-top: 10px !important; }
.day-row:last-child  { padding-bottom: 10px !important; border-bottom: none !important; }

/* 5. Кнопка + у рецептов когда раздел открыт */
#addRecipesSection[open] .add-recipe-shortcut { display: inline-flex !important; align-items: center; }
#addRecipesSection:not([open]) .add-recipe-shortcut { display: none !important; }
.add-recipe-shortcut {
  background: none !important;
  border: none !important;
  cursor: pointer;
  color: #7c5dfa;
  font-size: 20px;
  font-weight: 400;
  padding: 0 2px;
  line-height: 1;
  margin-left: auto;
  flex-shrink: 0;
}
[data-theme="light"] .add-recipe-shortcut { color: #5842d4; }

/* mdb-val и mdb-row spacing fix */
.mdb-row { padding: 0 2px; }
.mdb-val { min-width: 36px !important; }


/* ══════════════════════════════════════════════════
   v120b: Лайкнутые продукты в поиске — фиолетовый фон
══════════════════════════════════════════════════ */
/* Когда search-result содержит fav.on — подсвечиваем всю плашку как чип «Избранное»:
   фиолетовый фон/рамка/текст + розовое сердечко на розовом фоне (как .favorite-result-remove). */
.search-result:has(.search-result-fav.on) {
  background: rgba(124,93,250,.1) !important;
  border-color: rgba(124,93,250,.5) !important;
}
.search-result:has(.search-result-fav.on) .search-result-main {
  color: #c8bdff !important;
}
.search-result-fav.on {
  color: #ff8aa0 !important;
  background: rgba(255,100,130,.12) !important;
  border-left-color: rgba(124,93,250,.28) !important;
}

[data-theme="light"] .search-result:has(.search-result-fav.on) {
  background: rgba(124,93,250,.1) !important;
  border-color: rgba(124,93,250,.4) !important;
}
[data-theme="light"] .search-result:has(.search-result-fav.on) .search-result-main {
  color: #4830b4 !important;
}
[data-theme="light"] .search-result-fav.on {
  color: #e0476a !important;
  background: rgba(255,100,130,.12) !important;
  border-left-color: rgba(124,93,250,.28) !important;
}


/* ============================================
   Замеры тела: интерактивная фигура
   ============================================ */
.meas-body-card { background:#0a0c18; border:0.5px solid rgba(94,234,212,.15); }
.meas-body-header { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.meas-body-hint { color:#7c82a0; font-size:11px; margin-top:2px; }
.meas-body-hint span { color:#5eead4; font-weight:500; }
.meas-body-hint.active span { color:#ff7eb9; }

.meas-body-wrap {
  display:grid;
  grid-template-columns: 78px 1fr 78px;
  gap:4px;
  align-items:start;
  min-height: 420px;
}
.meas-leaders { display:flex; flex-direction:column; padding-top:18px; }
.meas-leaders-right { text-align:right; }

.meas-leader {
  font-size:11px;
  cursor:pointer;
  padding:5px 0;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
}
.meas-leader-name {
  display:flex;
  align-items:center;
  gap:5px;
  font-weight:500;
  font-size:12px;
  line-height:1.1;
}
.meas-leaders-right .meas-leader-name { justify-content:flex-end; }
.meas-leader-dot {
  width:7px; height:7px; border-radius:50%;
  background:#a855f7;
  box-shadow:0 0 6px rgba(168,85,247,.7);
  flex-shrink:0;
}
.meas-leader.done .meas-leader-dot {
  background:#5eead4;
  box-shadow:0 0 6px rgba(94,234,212,.8);
}
.meas-leader.active .meas-leader-dot {
  background:#ff7eb9;
  box-shadow:0 0 10px rgba(255,126,185,.9);
}
.meas-leader-text { color:#c8bdff; }
.meas-leader.done .meas-leader-text { color:#5eead4; }
.meas-leader.active .meas-leader-text { color:#ff7eb9; }
.meas-leader-sub {
  color:#7c82a0;
  font-size:10px;
  padding-left:12px;
  margin-top:1px;
}
.meas-leaders-right .meas-leader-sub {
  padding-left:0;
  padding-right:12px;
}

.meas-body-figure {
  position:relative;
  min-height: 420px;
}
.meas-body-figure img {
  width:100%;
  height:auto;
  display:block;
  max-height: 460px;
  object-fit:contain;
}
.meas-body-overlay {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
.meas-zone {
  fill: transparent;
  cursor: pointer;
  transition: fill .25s;
  pointer-events: all;
}
.meas-zone:hover { fill: rgba(168,85,247,.13); }
.meas-zone.done {
  fill: url(#measDoneHL);
  filter: url(#measGlow);
  opacity: .55;
}
.meas-zone.active {
  fill: url(#measActiveHL);
  filter: url(#measGlow);
  opacity: .85;
}
.meas-zone.active.done { opacity: .85; }

.meas-legend {
  display:flex;
  gap:14px;
  margin-top:8px;
  font-size:10px;
  color:#7c82a0;
  padding-left:4px;
}
.meas-legend .meas-dot {
  display:inline-block;
  width:8px; height:8px;
  border-radius:50%;
  vertical-align:middle;
  margin-right:4px;
}
.meas-dot-active { background:#ff7eb9; box-shadow:0 0 6px rgba(255,126,185,.6); }
.meas-dot-done { background:#5eead4; box-shadow:0 0 6px rgba(94,234,212,.6); }

[data-theme="light"] .meas-body-card { background:#0a0c18; border-color:rgba(94,234,212,.2); }
[data-theme="light"] .meas-body-hint span { color:#0d9488; }
[data-theme="light"] .meas-leader-text { color:#6b4eff; }
[data-theme="light"] .meas-leader.done .meas-leader-text { color:#0d9488; }
.chips-row { display: flex; flex-wrap: wrap; gap: 6px; }

/* Стрелка у блока Клетчатка/Сахар/Натрий */
#extraNutrientsToggle[open] .extra-nut-arrow { transform: rotate(90deg) !important; }
#extraNutrientsToggle:not([open]) .extra-nut-arrow { transform: rotate(0deg) !important; }
