/* =====================================================================
   DENTIOS - ベーススタイル & デザイントークン
   ===================================================================== */
:root {
  /* ブランドカラー */
  --clinic:        #2563EB;  /* クリニック側: ブルー */
  --clinic-dark:   #1D4ED8;
  --clinic-light:  #EFF6FF;
  --lab:           #16A34A;  /* 技工所側: グリーン */
  --lab-dark:      #15803D;
  --lab-light:     #F0FDF4;
  --account:       #D97706;  /* アカウント管理: オレンジ */
  --account-dark:  #B45309;
  --account-light: #FFFBEB;

  /* ステータスバッジ */
  --badge-blue:    #2563EB;
  --badge-orange:  #F97316;
  --badge-green:   #16A34A;
  --badge-gray:    #6B7280;

  /* 歯式図 */
  --tooth-abutment: #3B82F6; /* 支台歯=青 */
  --tooth-pontic:   #F97316; /* ポンティック=オレンジ */
  --tooth-hemi:     #EAB308; /* ヘミセクション=黄 */
  --tooth-denture:  #EF4444; /* 義歯=赤 */

  /* グレースケール */
  --bg:        #F8FAFC;
  --surface:   #FFFFFF;
  --border:    #E2E8F0;
  --text:      #1E293B;
  --text-soft: #64748B;
  --text-mute: #94A3B8;

  --radius:    10px;
  --radius-sm: 6px;
  --shadow:    0 1px 3px rgba(15, 23, 42, .08), 0 1px 2px rgba(15, 23, 42, .04);
  --shadow-lg: 0 10px 25px rgba(15, 23, 42, .12);
  --sidebar-w: 200px;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP",
               "Yu Gothic", Meiryo, system-ui, -apple-system, sans-serif;
  color: var(--text);
  background: var(--bg);
  font-size: 14px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--clinic); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4 { margin: 0 0 .5em; font-weight: 700; }

/* ---- ステータスバッジ ---- */
.badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  color: #fff;
}
.badge--blue   { background: var(--badge-blue); }
.badge--orange { background: var(--badge-orange); }
.badge--green  { background: var(--badge-green); }
.badge--gray   { background: var(--badge-gray); }
.badge--red    { background: #EF4444; }

/* ステータス別バッジ（仕様準拠の配色） */
.badge--draft         { background: #9CA3AF; }
.badge--quote         { background: #6B7280; }
.badge--confirming    { background: #F59E0B; }
.badge--confirmed     { background: #6366F1; }
.badge--manufacturing { background: #10B981; }
.badge--inspecting    { background: #14B8A6; }
.badge--packing       { background: #3B82F6; }
.badge--shipped       { background: #059669; }
.badge--delivered     { background: #047857; }

/* 必須バッジ（仕様: #EF4444・白・rounded・text-xs・px-1） */
.badge-required {
  display: inline-block;
  background: #EF4444;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  border-radius: 4px;
  padding: 1px 5px;
  margin-left: 4px;
  vertical-align: middle;
}

/* ---- ボタン ---- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, box-shadow .15s;
  text-decoration: none;
}
.btn--primary { background: var(--clinic); color: #fff; }
.btn--primary:hover { background: var(--clinic-dark); text-decoration: none; }
.btn--lab { background: var(--lab); color: #fff; }
.btn--lab:hover { background: var(--lab-dark); }
.btn--account { background: var(--account); color: #fff; }
.btn--account:hover { background: var(--account-dark); }
.btn--ghost { background: #fff; border-color: var(--border); color: var(--text); }
.btn--ghost:hover { background: var(--bg); text-decoration: none; }

/* ---- テーブル ---- */
.table { width: 100%; border-collapse: collapse; background: var(--surface); }
.table th, .table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  font-size: 13px;
}
.table th { background: var(--bg); color: var(--text-soft); font-weight: 600; white-space: nowrap; }
.table tbody tr:hover { background: var(--clinic-light); }