/* ============================================================
   litlink boost! — client / ops 面: legacy トークン互換層
   client/index.html・ops/index.html 専用（creator には読み込ませない）。
   tokens.css・ds-tokens.css・boost.css・boost-b2b-light.css より後に読み込む。

   役割: client/ops は DS 2.3 の Violet パレット（data-palette="violet"）で表示する。
   画面の各所が参照する legacy トークン（--violet 等）を、ここで DS の意味トークン
   （--tu-theme-* / --tu-color-*）へ寄せる。ここでプリミティブを新規に決めない。
   参照先は tokens.css / ds-tokens.css。

   html[data-palette="violet"] で指定するのは、client の LP（#llb-lp）と本文の <style> が
   :root に --violet・--v2-brand を置き直しており、:root と同じ詳細度では後勝ちで負けるため。
   LP 自体の配色はこの切替の対象外で、LP の <style> が #llb-lp の中だけ元の値を持ち直す。
   ============================================================ */

html[data-palette="violet"] {
  /* CEO 決定による DS 2.3 の例外: ops / client のキーカラーは #6464FD（主操作の面は検算で調整した #5F5FFD）。
     Violet の theme トークンをここで上書きする（値は ds-tokens.css の --tu-primitive-boost-key-*）（このファイルは creator に読ませない）。
     キーカラーの面に載る文字・アイコンは白抜き（text-on-action）。 */
  --tu-theme-action: var(--tu-primitive-boost-key);
  --tu-theme-hover: var(--tu-primitive-boost-key-hover);
  --tu-theme-pressed: var(--tu-primitive-boost-key-pressed);
  --tu-theme-soft: var(--tu-primitive-boost-key-soft);
  --tu-theme-deep: var(--tu-primitive-boost-key-deep);
  --tu-theme-link: var(--tu-primitive-boost-key-link);
  --tu-color-text-on-action: var(--tu-primitive-neutral-0);
  /* 押せない主ボタン（値は boost-b2b-light.css の --tu-primitive-boost-key-disabled-*） */
  --tu-color-action-disabled: var(--tu-primitive-boost-key-disabled-surface);
  --tu-color-text-on-action-disabled: var(--tu-primitive-boost-key-disabled-text);
  /* 文字・枠・フォーカスとして使われる箇所が多いため、白地で読める深い同系色（theme link）に寄せる。
     面として使われる箇所も白文字とのコントラストが 4.5:1 を超える（#5555FD で 5.12:1）。 */
  --violet: var(--tu-theme-link);
  --violet-dim: var(--tu-theme-link);
  --violet-bright: var(--tu-theme-link);
  --violet-glow: color-mix(in srgb, var(--tu-theme-action) 16%, transparent);
  --violet-trace: var(--tu-theme-soft);
  --cl-accent: var(--tu-theme-link);
  --v2-brand: var(--tu-theme-link);
  --v2-brand-hover: var(--tu-theme-link);
  --v2-brand-50: var(--tu-theme-soft);
  --border-focus: var(--tu-color-border-focus);
  --cr-violet: var(--violet);
  --grad-cheer: none;
  --fs-title: 18px;
  --fs-body: 14px;
  --fs-ui: 14px;
  --fs-caption: 14px;
}

/* ============================================================
   状態の色（ops / client 共通）
   DS 2.3 は緑・黄・赤の信号機配色を使わない。成功・待機・注意は文言とアイコンで伝え、
   色は濃いインク（text-primary）か補助の灰色にする。赤系はエラーと破壊操作だけで、
   DS のフューシャ（feedback-error-*）を使う。tokens.css / boost.css の旧値（#22c55e 等）は
   creator 用のまま残し、ここで ops / client の参照先だけを差し替える。
   ============================================================ */
html[data-palette="violet"] {
  --success: var(--tu-color-text-primary);
  --warning: var(--tu-color-text-primary);
  --danger: var(--tu-color-feedback-error-text);
  --info: var(--tu-color-text-secondary);
  --color-success: var(--tu-color-text-primary);
  --color-success-bg: var(--tu-color-bg-muted);
  --color-warning: var(--tu-color-text-primary);
  --color-warning-bg: var(--tu-color-bg-muted);
  --color-info: var(--tu-color-text-secondary);
  --color-info-bg: var(--tu-color-bg-subtle);
  --color-danger: var(--tu-color-feedback-error-text);
  --color-danger-bg: var(--tu-color-feedback-error-bg);
  --gauge-near: var(--tu-color-text-primary);
  --gauge-full: var(--tu-color-feedback-error-text);
}

/* ============================================================
   余白の役割トークン（ops / client 共通）
   値は DS 2.3 の --tu-space-* / --tu-size-* を参照する。幅で切り替えるのは
   ページ左右余白・節の間・カード内側・操作の最低高さで、関連要素どうしの距離（stack-xs/sm）は固定。
   - page-x: 左右余白。1440 以上 48 / 1280〜1439 40 / 769〜1279 32 / 768 以下 20 / 360 以下 16
   - section-gap（大きな節の間）は group-gap（内容群の間）の 2 倍を保つ（近接の原則）
   - control-h: 密な表・ツールバーの操作は 36、タッチ幅（768 以下）は 44
   ============================================================ */
html[data-palette="violet"] {
  --b2b-page-x: var(--tu-space-48);
  --b2b-page-top: var(--tu-space-32);
  --b2b-page-bottom: var(--tu-space-64);
  --b2b-page-max: 90rem;
  --b2b-section-gap: var(--tu-space-48);
  --b2b-group-gap: var(--tu-space-24);
  --b2b-card-pad: var(--tu-space-24);
  --b2b-card-pad-compact: var(--tu-space-16);
  --b2b-modal-pad: var(--tu-space-32);
  --b2b-control-gap: var(--tu-space-12);
  --b2b-chip-gap: var(--tu-space-8);
  --b2b-control-h: calc(var(--tu-space-32) + var(--tu-space-4));
  --b2b-row-h: var(--tu-size-control);
  --b2b-cell-y: var(--tu-space-12);
  --b2b-cell-x: var(--tu-space-16);
  --b2b-stack-xs: var(--tu-space-4);
  --b2b-stack-sm: var(--tu-space-8);
  --b2b-stack-md: var(--tu-space-16);
  --b2b-stack-lg: var(--tu-space-24);
  --b2b-lh-body: 1.6;
  --b2b-lh-heading: 1.3;
}
@media (max-width: 1439px) {
  html[data-palette="violet"] { --b2b-page-x: var(--tu-space-40); }
}
@media (max-width: 1279px) {
  html[data-palette="violet"] {
    --b2b-page-x: var(--tu-space-32);
    --b2b-page-top: var(--tu-space-24);
  }
}
@media (max-width: 768px) {
  html[data-palette="violet"] {
    --b2b-page-x: var(--tu-space-20);
    --b2b-page-top: var(--tu-space-20);
    --b2b-page-bottom: var(--tu-space-48);
    --b2b-section-gap: var(--tu-space-32);
    --b2b-group-gap: var(--tu-space-16);
    --b2b-card-pad: var(--tu-space-16);
    --b2b-modal-pad: var(--tu-space-20);
    --b2b-control-gap: var(--tu-space-8);
    --b2b-control-h: var(--tu-size-hit);
    --b2b-row-h: var(--tu-size-hit);
    --b2b-cell-x: var(--tu-space-12);
  }
}
@media (max-width: 360px) {
  html[data-palette="violet"] { --b2b-page-x: var(--tu-space-16); }
}