/* ================================================================
   ライトテーマ上書き層（創業者決定 2026-08-13/14・docs/43 §5 原則13・単一の正）
   方式: 既存のダーク配色ユーティリティは一切変更せず、html[data-theme="light"] の
   ときだけ同名クラスの色を「明背景×暗文字」へ再定義する。
   省電力モード（data-theme="dark"）= 上書きなし＝従来のダーク配色そのもの。
   対象ページ: mycloud / anpi / account / task / new / inventorylist / upgrade
   （home.html=写真ヒーローのLP系・org/enterprise=BtoB・guest/recovery=元からライトは対象外）。
   ユニバーサルデザイン: 本文系文字色はWCAG AA（4.5:1）以上のslate系へ割当。
   状態色（無事/支援必要/負傷等）は色だけに頼らず文字ラベル併記（各ページの実装規約）。
   モーダル等の暗い背景幕（bg-slate-950/80・/85・/90・/95・bg-black/60）は両テーマ共通＝上書きしない。
   ================================================================ */
html[data-theme="light"] {
  color-scheme: light;
}

/* ---- 面（ページ / フレーム / カード / インセット / 入力） ----
   境目の設計（創業者FB 2026-08-14）: 背景#e6ebf2 → セクション#eef2f6 → カード#fff＋影の
   3段の明度差で、カード（YOUR LEVEL/安否/メニュー等）の輪郭をはっきりさせる */
html[data-theme="light"] body.bg-slate-900 {
  background-color: #e6ebf2;
}
html[data-theme="light"] .bg-slate-900 {
  background-color: #eef2f6;
}
html[data-theme="light"] .bg-slate-950 {
  background-color: #ffffff;
}
html[data-theme="light"] .bg-slate-800,
html[data-theme="light"] .bg-slate-800\/70 {
  background-color: #ffffff;
}
/* カード面（rounded-3xlの主要カードが使う bg-slate-800/70）は白＋淡い影で境目を明確に */
html[data-theme="light"] .bg-slate-800\/70 {
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.05),
    0 4px 14px rgba(15, 23, 42, 0.06);
}
/* グループ切替ドロップダウン: 白背景ページで他要素と混ざらないよう輪郭と影を強調 */
html[data-theme="light"] #scope-menu {
  border: 1px solid #cbd5e1;
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.22);
}
html[data-theme="light"] .bg-slate-800\/90,
html[data-theme="light"] .hover\:bg-slate-800\/90:hover,
html[data-theme="light"] .hover\:bg-slate-800:hover,
html[data-theme="light"] .hover\:bg-slate-900:hover {
  background-color: #f1f5f9;
}
html[data-theme="light"] .bg-slate-900\/30,
html[data-theme="light"] .bg-slate-900\/40,
html[data-theme="light"] .bg-slate-900\/60,
html[data-theme="light"] .bg-slate-900\/70,
html[data-theme="light"] .bg-slate-950\/40 {
  background-color: #f1f5f9;
}
html[data-theme="light"] .bg-slate-950\/50,
html[data-theme="light"] .bg-slate-950\/60 {
  background-color: #ffffff;
}
html[data-theme="light"] .bg-white\/5,
html[data-theme="light"] .hover\:bg-white\/5:hover {
  background-color: #f1f5f9;
}
html[data-theme="light"] .bg-white\/10,
html[data-theme="light"] .bg-white\/15,
html[data-theme="light"] .hover\:bg-white\/10:hover,
html[data-theme="light"] .hover\:bg-white\/15:hover {
  background-color: #e2e8f0;
}
html[data-theme="light"] .hover\:bg-white\/20:hover {
  background-color: #cbd5e1;
}
html[data-theme="light"] .border-white\/5,
html[data-theme="light"] .border-white\/10,
html[data-theme="light"] .border-slate-800 {
  border-color: #e2e8f0;
}
html[data-theme="light"] .border-white\/15,
html[data-theme="light"] .border-white\/20,
html[data-theme="light"] .border-white\/25,
html[data-theme="light"] .border-white {
  border-color: #cbd5e1;
}
html[data-theme="light"] .divide-white\/10 > :not([hidden]) ~ :not([hidden]),
html[data-theme="light"] .divide-white > :not([hidden]) ~ :not([hidden]) {
  border-color: #e2e8f0;
}
html[data-theme="light"] .safe-shadow {
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
}
html[data-theme="light"] .focus\:ring-white\/20:focus {
  --tw-ring-color: rgba(100, 116, 139, 0.5);
}
html[data-theme="light"] .ring-white\/20 {
  --tw-ring-color: rgba(100, 116, 139, 0.4);
}
html[data-theme="light"] .ring-white\/60 {
  --tw-ring-color: rgba(100, 116, 139, 0.6);
}
html[data-theme="light"] .ring-white {
  --tw-ring-color: #94a3b8;
}
html[data-theme="light"] .accent-emerald-400 {
  accent-color: #059669;
}

/* ---- グラデーション（Tailwindの停止色変数を差し替え） ---- */
html[data-theme="light"] .from-orange-500\/15 {
  --tw-gradient-from: #fff7ed var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(255 247 237 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}
html[data-theme="light"] .to-slate-800\/70,
html[data-theme="light"] .to-slate-950 {
  --tw-gradient-to: #ffffff var(--tw-gradient-to-position);
}
html[data-theme="light"] .from-slate-900\/60 {
  --tw-gradient-from: #f1f5f9 var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(241 245 249 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

/* ---- 文字（本文系はWCAG AAを満たす濃度に割当） ----
   .text-white は「単色の濃色背景を同一要素に持つ場合」を除外して黒文字化する
   （赤/緑/オレンジの単色ボタン・ダーク帯・ブランドCTAは両テーマ共通で白文字のまま。
   除外は class 全体トークン一致 [class~=…]＝bg-orange-500/20 等の淡色は除外されない） */
html[data-theme="light"] .text-slate-50,
html[data-theme="light"]
  .text-white:not([class~="bg-red-500"]):not([class~="bg-red-600"]):not(
    [class~="bg-red-700"]
  ):not([class~="bg-green-600"]):not([class~="bg-green-700"]):not(
    [class~="bg-orange-500"]
  ):not([class~="bg-orange-600"]):not([class~="bg-emerald-500"]):not(
    [class~="bg-emerald-600"]
  ):not([class~="bg-indigo-500"]):not([class~="bg-sky-500"]):not(
    [class~="bg-blue-500/80"]
  ):not([class~="bg-slate-800"]):not([class~="bg-slate-900"]):not(
    [class~="bg-slate-900/60"]
  ):not([class~="bg-black"]):not([class~="bg-brand-600"]),
html[data-theme="light"] .hover\:text-white:hover,
html[data-theme="light"] .hover\:text-slate-200:hover,
html[data-theme="light"] .hover\:text-slate-300:hover {
  color: #0f172a;
}
/* 白文字とペアの濃色スレート面は明転させず維持（黒帯・ダークCTA=両テーマ共通のデザイン） */
html[data-theme="light"] .bg-slate-900.text-white {
  background-color: #0f172a;
}
html[data-theme="light"] .bg-slate-800.text-white {
  background-color: #1e293b;
}
html[data-theme="light"] .text-white.hover\:bg-slate-800:hover {
  background-color: #1e293b;
}
html[data-theme="light"] .text-white.hover\:bg-slate-900:hover {
  background-color: #0f172a;
}
html[data-theme="light"] [class~="bg-slate-900/60"].text-white {
  background-color: rgba(15, 23, 42, 0.6);
}
/* 維持したダーク帯の内側では、白系の補助文字を薄めた白のまま保つ（黒帯上の視認性） */
html[data-theme="light"] .bg-slate-900.text-white [class*="text-white/"],
html[data-theme="light"] .bg-slate-800.text-white [class*="text-white/"] {
  color: rgba(255, 255, 255, 0.7);
}
html[data-theme="light"] .text-white\/90,
html[data-theme="light"] .text-slate-100,
html[data-theme="light"] .text-slate-100\/90,
html[data-theme="light"] .text-slate-100\/85 {
  color: #1e293b;
}
html[data-theme="light"] .text-white\/80,
html[data-theme="light"] .text-slate-200,
html[data-theme="light"] .hover\:text-white\/80:hover {
  color: #334155;
}
html[data-theme="light"] .text-white\/70,
html[data-theme="light"] .text-slate-300 {
  color: #475569;
}
html[data-theme="light"] .text-white\/60,
html[data-theme="light"] .text-white\/50,
html[data-theme="light"] .text-slate-400 {
  color: #64748b;
}
html[data-theme="light"] .text-white\/40 {
  color: #6b7280;
}
html[data-theme="light"] .text-white\/30,
html[data-theme="light"] .text-white\/25 {
  color: #9ca3af;
}

/* ---- アクセント（淡色チップ×濃色文字へ反転） ---- */
html[data-theme="light"] .text-emerald-50,
html[data-theme="light"] .text-emerald-100,
html[data-theme="light"] .text-emerald-200,
html[data-theme="light"] .text-emerald-300 {
  color: #047857;
}
/* /90付きは別クラス＝上の一括指定に含まれず登録漏れだった（創業者FB 2026-08-15:
   グループ設定シートの「LINEトークはこのグループを使います」が淡緑のままで見づらい）。
   注意文の本文用に一段濃い緑（emerald-800級・ライト背景でコントラスト約7:1=AAA・色弱でも判読優先） */
html[data-theme="light"] .text-emerald-200\/90 {
  color: #065f46;
}
html[data-theme="light"] .text-orange-50,
html[data-theme="light"] .text-orange-100,
html[data-theme="light"] .text-orange-200,
html[data-theme="light"] .text-orange-200\/80 {
  color: #9a3412;
}
html[data-theme="light"] .text-orange-300 {
  color: #c2410c;
}
html[data-theme="light"] .text-orange-400 {
  color: #ea580c;
}
html[data-theme="light"] .text-red-100,
html[data-theme="light"] .text-red-100\/80,
html[data-theme="light"] .text-red-200,
html[data-theme="light"] .text-red-300 {
  color: #b91c1c;
}
html[data-theme="light"] .text-red-400 {
  color: #dc2626;
}
html[data-theme="light"] .text-indigo-100,
html[data-theme="light"] .text-indigo-200,
html[data-theme="light"] .text-indigo-200\/80 {
  color: #4338ca;
}
html[data-theme="light"] .text-amber-100,
html[data-theme="light"] .text-amber-200,
html[data-theme="light"] .text-amber-200\/90,
html[data-theme="light"] .text-amber-300,
html[data-theme="light"] .text-yellow-200 {
  color: #92400e;
}
html[data-theme="light"] .text-sky-50,
html[data-theme="light"] .text-sky-100,
html[data-theme="light"] .text-sky-300 {
  color: #0369a1;
}
html[data-theme="light"] .text-teal-100,
html[data-theme="light"] .text-teal-200 {
  color: #0f766e;
}
html[data-theme="light"] .text-blue-200 {
  color: #1d4ed8;
}
html[data-theme="light"] .bg-emerald-500\/10,
html[data-theme="light"] .bg-emerald-500\/15 {
  background-color: #ecfdf5;
}
html[data-theme="light"] .bg-emerald-500\/20,
html[data-theme="light"] .bg-emerald-500\/25,
html[data-theme="light"] .bg-emerald-500\/30,
html[data-theme="light"] .bg-green-500\/25,
html[data-theme="light"] .hover\:bg-emerald-500\/20:hover,
html[data-theme="light"] .hover\:bg-emerald-500\/25:hover,
html[data-theme="light"] .hover\:bg-emerald-500\/30:hover {
  background-color: #d1fae5;
}
html[data-theme="light"] .border-emerald-400\/20,
html[data-theme="light"] .border-emerald-400\/25,
html[data-theme="light"] .border-emerald-400\/30,
html[data-theme="light"] .border-emerald-400\/40,
html[data-theme="light"] .border-emerald-300\/40 {
  border-color: #a7f3d0;
}
html[data-theme="light"] .bg-orange-500\/10,
html[data-theme="light"] .bg-orange-500\/15,
html[data-theme="light"] .hover\:bg-orange-500\/15:hover {
  background-color: #fff7ed;
}
html[data-theme="light"] .bg-orange-500\/20,
html[data-theme="light"] .bg-orange-500\/25,
html[data-theme="light"] .bg-orange-500\/30,
html[data-theme="light"] .hover\:bg-orange-500\/20:hover,
html[data-theme="light"] .hover\:bg-orange-500\/25:hover {
  background-color: #ffedd5;
}
html[data-theme="light"] .border-orange-400\/15,
html[data-theme="light"] .border-orange-400\/20,
html[data-theme="light"] .border-orange-400\/25,
html[data-theme="light"] .border-orange-400\/30,
html[data-theme="light"] .border-orange-400\/40,
html[data-theme="light"] .border-orange-400\/60 {
  border-color: #fed7aa;
}
html[data-theme="light"] .bg-red-500\/10,
html[data-theme="light"] .bg-red-500\/15 {
  background-color: #fef2f2;
}
html[data-theme="light"] .bg-red-500\/20,
html[data-theme="light"] .bg-red-500\/25,
html[data-theme="light"] .bg-red-500\/30,
html[data-theme="light"] .hover\:bg-red-500\/20:hover,
html[data-theme="light"] .hover\:bg-red-500\/25:hover {
  background-color: #fee2e2;
}
html[data-theme="light"] .border-red-400\/20,
html[data-theme="light"] .border-red-400\/30,
html[data-theme="light"] .border-red-400\/40 {
  border-color: #fecaca;
}
html[data-theme="light"] .bg-indigo-500\/15,
html[data-theme="light"] .bg-indigo-400\/20 {
  background-color: #eef2ff;
}
html[data-theme="light"] .bg-indigo-500\/20,
html[data-theme="light"] .bg-indigo-500\/25,
html[data-theme="light"] .bg-indigo-500\/30,
html[data-theme="light"] .hover\:bg-indigo-500\/20:hover,
html[data-theme="light"] .hover\:bg-indigo-500\/25:hover,
html[data-theme="light"] .hover\:bg-indigo-500\/30:hover {
  background-color: #e0e7ff;
}
html[data-theme="light"] .border-indigo-400\/20,
html[data-theme="light"] .border-indigo-400\/30 {
  border-color: #c7d2fe;
}
html[data-theme="light"] .bg-amber-500\/10,
html[data-theme="light"] .bg-amber-500\/15,
html[data-theme="light"] .bg-amber-500\/25 {
  background-color: #fffbeb;
}
html[data-theme="light"] .bg-amber-500\/20 {
  background-color: #fef3c7;
}
html[data-theme="light"] .border-amber-400\/20,
html[data-theme="light"] .border-amber-400\/30,
html[data-theme="light"] .border-amber-400\/40 {
  border-color: #fde68a;
}
html[data-theme="light"] .bg-sky-500\/15 {
  background-color: #f0f9ff;
}
html[data-theme="light"] .bg-sky-500\/20,
html[data-theme="light"] .bg-sky-500\/25,
html[data-theme="light"] .bg-sky-500\/30,
html[data-theme="light"] .hover\:bg-sky-500\/30:hover {
  background-color: #e0f2fe;
}
html[data-theme="light"] .border-sky-400\/20,
html[data-theme="light"] .border-sky-400\/30,
html[data-theme="light"] .border-sky-400\/40 {
  border-color: #bae6fd;
}
html[data-theme="light"] .bg-teal-500\/10 {
  background-color: #f0fdfa;
}
html[data-theme="light"] .bg-teal-500\/20 {
  background-color: #ccfbf1;
}
html[data-theme="light"] .border-teal-400\/20,
html[data-theme="light"] .border-teal-400\/30 {
  border-color: #99f6e4;
}
html[data-theme="light"] .bg-blue-500\/15 {
  background-color: #eff6ff;
}
html[data-theme="light"] .border-blue-400\/20 {
  border-color: #bfdbfe;
}

/* ---- チャット吹き出し（mycloudのみで使用・他ページでは無害） ---- */
html[data-theme="light"] .chat-bubble-user {
  background: #e0e7ff;
  border-color: #c7d2fe;
}
html[data-theme="light"] .chat-bubble-ai {
  background: #f1f5f9;
  border-color: #e2e8f0;
}