/**
 * Edit Lab 共通スタイルシート
 * 全ページで共有するスタイルを一元管理（DRY原則）
 * 
 * 含まれるスタイル:
 * - fade-in-section: スクロール連動のフェードインアニメーション
 * - ::selection: テキスト選択時のハイライト色
 * - scroll-behavior: アンカーリンクのスムーススクロール
 * - input-error: フォームバリデーションエラー表示（contact/order）
 * - group-error: ラジオ/チェックボックスグループのエラー表示（order）
 * - ラジオボタン選択時の内側表示用CSSハック（order）
 */

/* フェードイン用ユーティリティクラス（IntersectionObserverと連動） */
.fade-in-section {
  opacity: 0;
  transform: translateY(3rem);
  transition: opacity 1s cubic-bezier(0, 0, 0.2, 1), transform 1s cubic-bezier(0, 0, 0.2, 1);
}

.fade-in-section.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* テキスト選択時のハイライト色（ブランドカラー準拠） */
::selection {
  background-color: #fed7aa; /* orange-200 */
  color: #7c2d12; /* orange-900 */
}

/* アンカーリンク・scrollIntoView のスムーススクロール */
html {
  scroll-behavior: smooth;
}

/* フォームバリデーション：入力エラー時の枠線・背景色（contact/order） */
.input-error {
  border-color: #ef4444 !important; /* red-500 */
  background-color: #fef2f2 !important; /* red-50 */
}

/* カード型ラジオ/チェックボックスのエラー表示用（order） */
.group-error .peer-checked\:border-orange-500 {
  border-color: #ef4444 !important;
  background-color: #fef2f2 !important;
}

/* ラジオボタン選択時：内側の丸（dot）を表示するCSSハック（order） */
input[type="radio"]:checked + div .rounded-full > div {
  opacity: 1;
}

/* 電話番号リンク：PCではクリック不可（スマホのみtel:発信可能） */
@media (min-width: 768px) {
  a[href^="tel:"] {
    pointer-events: none;
    cursor: default;
  }
}

/* Cloudflare Turnstile：中央配置・レイアウト安定（order/notes） */
.cf-turnstile {
  margin-left: auto;
  margin-right: auto;
}

/* Cloudflare Turnstile：中央配置・レイアウト安定（order/notes） */
.order-notes .cf-turnstile {
  display: inline-block;
  margin: 0 auto;
}

/* Cloudflare Turnstile：中央配置・ボタンとの余白確保（order/notes） */
.order-notes-turnstile {
  display: flex;
  justify-content: center;
  margin-bottom: 2.5rem;
}

/* Cloudflare Turnstile：中央配置・ボタンとの余白確保（order/notes） */
.order-notes-turnstile .cf-turnstile {
  margin-left: auto;
  margin-right: auto;
}

/* Cloudflare Turnstile：中央配置・レイアウト安定（order/notes） */
.order-notes-turnstile {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-bottom: 2.5rem;
}
.order-notes-turnstile .cf-turnstile {
  margin-left: auto;
  margin-right: auto;
}

/* Cloudflare Turnstile：中央配置・レイアウト安定（order/notes） */
.cf-turnstile {
  margin-left: auto;
  margin-right: auto;
}

/* Cloudflare Turnstile：中央配置とボタンとの間隔を安定させる（order/notes） */
.cf-turnstile {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}

/* Cloudflare Turnstile：中央配置・ボタンとの余白確保（order/notes） */
.cf-turnstile {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}