/* SNS連携の削除操作まわりの共通スタイル。
   onboarding.html（連携済み行の「削除」テキストリンク）と
   dashboard.html（SNS連携状況アイコンの常時表示の削除バッジ）の両方から読み込む。
   js/sns-connections.js が生成する確認モーダルもここで見た目を定義する。
   削除操作は警告色（赤）ではなくスレート系の落ち着いた色で表現し、
   メール未認証バナー等の警告表示と意味が混同されないようにする
   （モーダル内の最終確認ボタンのみ、破壊的操作の最終確認として赤を維持）。 */

.platform-delete-link {
  padding: 0;
  border: none;
  background: none;
  font-size: 0.75rem;
  font-weight: 700;
  color: #64748b;
  text-decoration: underline;
  cursor: pointer;
}
.platform-delete-link:hover { color: #475569; }
.platform-delete-link:disabled { opacity: 0.6; cursor: default; text-decoration: none; }

.sns-icon-wrap {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
}
.sns-icon-delete {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}
.sns-icon-wrap .sns-icon-delete svg {
  width: 100%;
  height: 100%;
  fill: #94a3b8;
}
.sns-icon-delete:hover svg,
.sns-icon-delete:focus svg {
  fill: #64748b;
}

/* ---------- 連携解除 確認モーダル ---------- */
.modal-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(10, 21, 48, 0.6);
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  z-index: 1000;
}
.modal-overlay.open { display: flex; }
.modal-box {
  background: #ffffff;
  color: #0f172a;
  max-width: 420px;
  width: 100%;
  border-radius: 16px;
  padding: 1.8rem 1.6rem;
  box-shadow: 0 24px 56px rgba(10, 21, 48, 0.32);
  box-sizing: border-box;
}
.modal-box h2 { margin: 0 0 0.8rem; font-size: 1.05rem; color: #0f172a; }
.modal-box p { margin: 0; font-size: 0.88rem; color: #0f172a; line-height: 1.7; }
.modal-actions { margin-top: 1.4rem; display: flex; justify-content: flex-end; gap: 0.6rem; }
.modal-btn {
  padding: 0.55rem 1.2rem;
  border-radius: 6px;
  font-size: 0.85rem;
  font-weight: 700;
  cursor: pointer;
  border: 1px solid transparent;
}
.modal-btn:disabled { cursor: default; opacity: 0.6; }
.modal-btn-outline {
  background: transparent;
  color: #475569;
  border-color: #e2e8f0;
}
.modal-btn-outline:hover { background: #f1f5f9; }
.modal-btn-danger {
  background: #dc2626;
  color: #ffffff;
  border-color: #dc2626;
}
.modal-btn-danger:hover { background: #b91c1c; }
.modal-error {
  display: none;
  margin-top: 1rem;
  padding: 0.6rem 0.8rem;
  border-radius: 8px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-size: 0.8rem;
}
.modal-error.is-visible { display: block; }