/* ===============================
   ステータスバッジ共通スタイル
   =============================== */

/* ===============================
   予約ステータスの統一カラーテーマ
   決済待ち：青 (#2196F3)
   鑑定待ち：薄紫 (#9C27B0 / #E1BEE7)
   鑑定済み：緑 (#4CAF50)
   未鑑定：灰 (#9E9E9E)
   キャンセル待ち：橙 (#FF9800)
   キャンセル済み：赤 (#F44336)
   =============================== */

/* 予約ステータスバッジ（顧客・占い師共通） */
.reservation-status {
  padding: 0.4rem 1rem;
  border-radius: 20px;
  font-size: 0.85rem;
  font-weight: 600;
}

/* 決済待ち (pending_payment) - 青 */
.reservation-status.status-pending-payment {
  background: #E3F2FD;
  color: #1976D2;
}

/* 旧pending - 後方互換性のため（決済待ちと同じ青） */
.reservation-status.status-pending {
  background: #E3F2FD;
  color: #1976D2;
}

/* 鑑定待ち (confirmed) - 薄紫 */
.reservation-status.status-confirmed {
  background: #F3E5F5;
  color: #7B1FA2;
}

/* 鑑定済み (completed) - 緑 */
.reservation-status.status-completed {
  background: #E8F5E9;
  color: #388E3C;
}

/* 未鑑定 (no_show) - 灰 */
.reservation-status.status-no-show {
  background: #F5F5F5;
  color: #616161;
}

/* キャンセル待ち (cancel_requested) - 橙 */
.reservation-status.status-cancel-requested {
  background: #FFF3E0;
  color: #F57C00;
}

/* キャンセル済み (cancelled) - 赤 */
.reservation-status.status-cancelled {
  background: #FFEBEE;
  color: #D32F2F;
}

/* 汎用ステータスバッジ */
.status-badge {
  display: inline-block;
  padding: 0.5rem 1.5rem;
  border-radius: 20px;
  font-size: 0.9rem;
  font-weight: 600;
  white-space: nowrap;
}

/* 占い師の待機状態バッジ */
.status-badge.online {
  background: linear-gradient(135deg, #66BB6A, var(--success));
  color: white;
}

.status-badge.offline {
  background: var(--greige);
  color: var(--text-dark);
}

/* 予約の簡易ステータスバッジ（占い師側の予約リスト用） */
/* 鑑定待ち - 薄紫 */
.status-badge.confirmed {
  background: #9C27B0;
  color: white;
  padding: 0.25rem 0.75rem;
  border-radius: 12px;
  font-size: 0.8rem;
}

/* 決済待ち（旧pending）- 青 */
.status-badge.pending {
  background: #2196F3;
  color: white;
  padding: 0.25rem 0.75rem;
  border-radius: 12px;
  font-size: 0.8rem;
}