/* Профиль (/beta/profile) в облике D «Пульт» (слоновая кость + киноварь).

   Что это: правила класса страницы профиля поверх общего слоя беты (mm-beta-d2.css).
   Подключается ТОЛЬКО при отдаче беты Magic Master (site_beta.profile_beta_shell +
   inject_d2_layer(kind="profile")). profile.html и основной /profile не меняются:
   файл входит в сборку Echoteka, поэтому старые переменные страницы (--accent,
   --cta2, --bg, --text…) здесь направлены на токены --ds-* обеих тем. Цвета
   переключаются сами: --ds-* уже различаются по теме (mm-beta-d2.css). */

/* 1. Прежние имена переменных → токены D. Блок идёт ПОСЛЕ profile.html (порядок и
      одинаковая специфичность с его html.theme-light) — поэтому перекрывает их. */
:root,
:is(html.theme-light, html[data-theme="light"]) {
  --bg: var(--ds-bg); --bg2: var(--ds-bg);
  --surface: var(--ds-surface); --surface2: var(--ds-surface-2);
  --border: var(--ds-line);
  --text: var(--ds-text); --text-soft: var(--ds-soft); --text-dim: var(--ds-dim); --text-muted: var(--ds-dim);
  --text-accent: var(--ds-acc); --text-link: var(--ds-acc);
  --accent: var(--ds-acc); --accent2: var(--ds-acc); --cta2: var(--ds-cta);
  --accent-glow: var(--ds-wash);
  --cyan: var(--ds-acc); --green: var(--ds-ok); --amber: var(--ds-warn); --red: var(--ds-bad);
  --status-ok: var(--ds-ok); --status-warn: var(--ds-warn); --status-bad: var(--ds-bad);
  
  --r: 14px; --r-lg: 18px; --r-sm: 10px;
}
:root:not(.theme-light):not([data-theme="light"]) {
  
}

/* 2. Страница: фон, шрифты, без декоративного «пятна» профиля */
.ds-profile .bg { display: none; }
body.ds-profile {
  font-family: 'IBM Plex Sans', system-ui, sans-serif;
  font-size: 16px; line-height: 1.55;
  background: var(--ds-bg); color: var(--ds-text);
}
body.ds-profile .page-title {
  font-family: 'Unbounded', system-ui, sans-serif; font-weight: 600;
  font-size: 1.6rem; letter-spacing: -.02em; color: var(--ds-text);
}
body.ds-profile .page-title-accent { color: var(--ds-acc); }
body.ds-profile .card-title {
  font-family: 'Unbounded', system-ui, sans-serif; font-weight: 500;
  letter-spacing: .06em; color: var(--ds-dim);
}
body.ds-profile .stat-box .n { font-family: 'JetBrains Mono', monospace; color: var(--ds-acc); }
body.ds-profile .mono, body.ds-profile code { font-family: 'JetBrains Mono', monospace; }

/* 3. Верхняя строка: «Выйти» переехала из шапки (site_beta.profile_beta_shell) */
.ds-profile-top { display: flex; justify-content: flex-end; margin-bottom: .6rem; }
.ds-profile-logout {
  display: inline-flex; align-items: center; min-height: 40px; padding: .4rem 1rem;
  border-radius: 10px; font-size: .85rem; font-weight: 600; text-decoration: none;
  background: var(--ds-surface-2); color: var(--ds-text); border: 1px solid var(--ds-line-strong);
  
}
.ds-profile-logout:hover { color: var(--ds-acc); border-color: var(--ds-acc); }

/* 4. Карточки: как у тарифов и инструментов D (тёплая бумага / тёмная панель) */
body.ds-profile .card {
  background: var(--ds-surface); border: 1px solid var(--ds-line);
  border-radius: 18px; 
}
:is(html.theme-light, html[data-theme="light"]) body.ds-profile .card {
  
}
body.ds-profile .stat-box { background: var(--ds-surface-2); border-color: var(--ds-line); }
body.ds-profile .profile-identity {
  background: var(--ds-surface-2); border-color: var(--ds-line-strong);
}
body.ds-profile .profile-identity .pi-label { color: var(--ds-dim); }
body.ds-profile .danger-zone { border-color: color-mix(in srgb, var(--ds-bad) 35%, transparent); }
body.ds-profile .danger-zone .card-title { color: var(--ds-bad); }

/* 5. Кнопки: главное действие — киноварь CTA; второстепенные — клавиши D */
body.ds-profile .btn-primary {
  background: linear-gradient(180deg, #ff6e4b, #ff5a36); color: #170703;
  border: 1px solid #d9542f; 
}
body.ds-profile .btn-primary:hover { opacity: 1; background: linear-gradient(180deg, #ff7a57, #f2461f); }
body.ds-profile .btn-outline {
  background: var(--ds-surface-2); color: var(--ds-text); border-color: var(--ds-line-strong);
}
body.ds-profile .btn-outline:hover { color: var(--ds-acc); border-color: var(--ds-acc); }
body.ds-profile .form-col input,
body.ds-profile input, body.ds-profile select, body.ds-profile textarea {
  background: var(--ds-surface); border-color: var(--ds-line-strong); color: var(--ds-text);
}
body.ds-profile .form-col input:focus,
body.ds-profile input:focus { border-color: var(--ds-acc); }
body.ds-profile input[type="range"], body.ds-profile input[type="checkbox"] { accent-color: var(--ds-cta); }

/* 6. Таблица истории и сообщения */
body.ds-profile .history-table th { color: var(--ds-soft); border-bottom-color: var(--ds-line); }
body.ds-profile .history-table td { border-bottom-color: var(--ds-line); }
body.ds-profile .history-table tr:hover td { background: var(--ds-wash); }
body.ds-profile .toast.ok  { background: color-mix(in srgb, var(--ds-ok) 14%, var(--ds-surface)); border-color: color-mix(in srgb, var(--ds-ok) 40%, transparent); color: var(--ds-ok); }
body.ds-profile .toast.err { background: color-mix(in srgb, var(--ds-bad) 14%, var(--ds-surface)); border-color: color-mix(in srgb, var(--ds-bad) 40%, transparent); color: var(--ds-bad); }
body.ds-profile .toast.inf { background: var(--ds-wash); border-color: var(--ds-acc-line); color: var(--ds-acc); }
body.ds-profile .toast { background-color: var(--ds-surface); color: var(--ds-text);  }

/* Сетка сведений: длинный email не наезжает на соседнюю ячейку («Токены») */
body.ds-profile .info-item { min-width: 0; }
body.ds-profile .info-item .val { overflow-wrap: anywhere; }

/* Блок API-ключей: подложки и цвета заданы инлайном в profile.html (фиолет и мята прежней
   палитры). Перекрываем по значению, без правки разметки. */
body.ds-profile code[style*="108,75,255"] { background: var(--ds-wash) !important; }
body.ds-profile #createKeyForm {
  background: var(--ds-surface-2) !important; border-color: var(--ds-line) !important;
}
body.ds-profile #createKeyForm input { background: var(--ds-surface) !important; color: var(--ds-text) !important; }
body.ds-profile #newKeyResult {
  background: color-mix(in srgb, var(--ds-ok) 10%, transparent) !important;
  border-color: color-mix(in srgb, var(--ds-ok) 35%, transparent) !important;
}
body.ds-profile #newKeyValue { background: var(--ds-lcd) !important; color: var(--ds-text) !important; }

/* Таблица ключей и стемов строится скриптом профиля; на телефоне 5 колонок выталкивали
   страницу на 133 px. Прокрутка — внутри блока, как у истории (#historyWrap). */
body.ds-profile #apiKeysList,
body.ds-profile #stemsWrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Плоский облик: фокус клавиатуры — контур, без теней */
body.ds-profile :focus-visible { outline: 2px solid #ff5a36; outline-offset: 2px; }
