/* ============================================================
   ブロックエディター用スタイル(フロント側)
   - functions.php の add_theme_support( 'editor-color-palette' ) で
     登録したカラーパレットに対応するクラス
   - コアの「ボタン」ブロックをテーマの .btn と同じ見た目にする
   ※ エディター内プレビューは assets/css/editor.css と対で管理すること
   ============================================================ */

/* ---------- カラーパレット ---------- */
.has-primary-color { color: var(--c-primary); }
.has-primary-background-color { background-color: var(--c-primary); }
.has-navy-color { color: var(--c-navy); }
.has-navy-background-color { background-color: var(--c-navy); }
.has-red-color { color: var(--c-red); }
.has-red-background-color { background-color: var(--c-red); }
.has-white-color { color: #fff; }
.has-white-background-color { background-color: #fff; }

/* ---------- ボタンブロック(core/button) ---------- */
.wp-block-buttons { margin: 2.4em 0; }
.wp-block-buttons.is-content-justification-center { justify-content: center; }

.wp-block-button__link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  min-height: 56px;
  padding: 14px 32px;
  border: 0;
  border-radius: var(--r-btn);
  font-family: var(--ff);
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .04em;
  line-height: 1.6;
  text-decoration: none;
  transition: transform .15s, opacity .2s, background .2s;
}
.wp-block-button__link:hover,
.wp-block-button__link:focus {
  transform: translateY(-1px);
  opacity: 1;
  text-decoration: none;
}

/* 色未指定時はプライマリーカラーをデフォルトに */
.wp-block-button__link:not([class*="has-"][class*="background-color"]) {
  background: var(--c-primary);
  color: #fff;
}

/* アウトライン(枠線)スタイル */
.wp-block-button.is-style-outline .wp-block-button__link {
  background: #fff;
  border: 1px solid #cfcfcf;
  color: var(--c-text);
}
.wp-block-button.is-style-outline .wp-block-button__link.has-primary-color {
  border-color: var(--c-primary);
}