/**
 * Inspector Controls - Panel Design Classes
 * パネルデザイン変更用のクラス定義
 *
 * クラス命名規則:
 * - zenblocks-panel                    : パネルボディ共通
 * - zenblocks-panel--level-{1|2|3|4}   : ネストレベル
 * - zenblocks-panel--{type}            : タイプ (parent, settings)
 * - zenblocks-panel--has-subpanel      : サブパネルあり
 * - zenblocks-panel--{name}            : 一意の名前
 *
 * - zenblocks-panel-title              : パネルタイトル共通
 * - zenblocks-panel-title--level-{1|2|3|4}
 * - zenblocks-panel-title--{type}
 * - zenblocks-panel-title--{name}
 */

// ==================================
// パネルボディ - 共通
// ==================================
.zenblocks-panel {
	// 共通スタイル（必要に応じて追加）
}

// ==================================
// パネルボディ - レベル別
// ==================================
.zenblocks-panel--level-1 {
	// 第1レベル（親パネル）
}

.zenblocks-panel--level-2 {
	// 第2レベル
}

.zenblocks-panel--level-3 {
	// 第3レベル
}

.zenblocks-panel--level-4 {
	// 第4レベル
}

// ==================================
// パネルボディ - タイプ別
// ==================================
.zenblocks-panel--parent {
	// 親パネル（基本設定、スタイル設定など）
}

.zenblocks-panel--settings {

	&.components-panel__body > .components-panel__body-contents {
		padding: 16px 0;
	}
}

.zenblocks-panel-body {
	padding: 16px 0;

	&__row {
		margin-bottom: 16px;

		&--last {
			margin-bottom: 0;
		}
	}

	&--design-custom,
	&--design-preset {
		// padding-top: 0;
		padding-left: 16px;
		padding-right: 16px;
	}
}

.zenblocks-panel--has-subpanel {
	// サブパネルを持つパネル
}

// ==================================
// パネルボディ - 名前別（一意）
// ==================================

// マイクロコピー設定
.zenblocks-panel--micro-copy-settings {

	.zenblocks-panel--level-2,
	.zenblocks-panel--level-3 {

		&.components-panel__body > .components-panel__body-contents {
			padding: 16px 0;
		}
	}
}

// マイクロコピー - サブパネル
.zenblocks-panel--micro-copy-text {

	.components-base-control {
		padding: 16px 0;
	}
}

.zenblocks-panel--micro-copy-style {

	.components-base-control {
		padding: 16px 0;
	}
}

.zenblocks-panel--micro-copy-border {

	.zenblocks-copy-micro-border-width-setting {
		padding: 16px 0 0;
	}

	.components-base-control {
		padding: 0 0 16px;
	}
}

.zenblocks-panel--micro-copy-color {

	.zenblocks-color-setting {
		padding: 16px 0;
	}
}

.zenblocks-panel--micro-copy-font {
}

.zenblocks-panel--micro-copy-layout {
}

.zenblocks-panel--micro-copy-transform {
}

// 基本設定グループ
.zenblocks-panel--basic {
}

.zenblocks-panel--text-settings {
}

.zenblocks-panel--tag-settings {
}

// 表示設定
.zenblocks-panel--display {
}

// スタイル設定グループ
.zenblocks-panel--style {
}

.zenblocks-panel--styling-border {
}

.zenblocks-panel--styling-radius {
}

.zenblocks-panel--styling-shadow {
}

.zenblocks-panel--styling-opacity {
}

// 背景設定グループ
.zenblocks-panel--background {
}

.zenblocks-panel--background-color {
}

.zenblocks-panel--background-image {
}

.zenblocks-panel--background-pattern {
}

.zenblocks-panel--background-transition {

	&-body {
		padding: 16px 0;
	}
}

// フォント設定グループ
.zenblocks-panel--font {
}

.zenblocks-panel--font-size {
}

.zenblocks-panel--font-weight {
}

.zenblocks-panel--font-line-height {
}

.zenblocks-panel--font-letter-spacing {
}

// アイコン設定グループ
.zenblocks-panel--icon {
}

.zenblocks-panel--icon-select {
}

.zenblocks-panel--icon-size {
}

.zenblocks-panel--icon-position {
}

.zenblocks-panel--icon-frame {
}

.zenblocks-panel--icon-frame-size {
}

.zenblocks-panel--icon-frame-color {
}

.zenblocks-panel--icon-frame-border {
}

.zenblocks-panel--icon-frame-radius {
}

.zenblocks-panel--icon-frame-transition {
}

// サムネイル設定グループ
.zenblocks-panel--thumbnail {
}

// スペーシング設定グループ
.zenblocks-panel--spacing {
}

.zenblocks-panel--spacing-padding {
}

.zenblocks-panel--spacing-margin {
}

// レイアウト設定グループ
.zenblocks-panel--layout {
}

.zenblocks-panel--layout-width {
}

.zenblocks-panel--layout-height {
}

.zenblocks-panel--layout-position {
}

// ==================================
// サイト共通設定パネル
// ==================================
.zenblocks-responsive-settings {
}

.zenblocks-color-settings {
}

.zenblocks-typography-settings {
}

// ==================================
// パネルタイトル - 共通
// ==================================
.zenblocks-panel-title {
	// 共通スタイル（必要に応じて追加）
}

// ==================================
// パネルタイトル - レベル別
// ==================================
.zenblocks-panel-title--level-1 {
	// 第1レベル
}

.zenblocks-panel-title--level-2 {
	// 第2レベル
}

.zenblocks-panel-title--level-3 {
	// 第3レベル
}

.zenblocks-panel-title--level-4 {
	// 第4レベル
}

// ==================================
// パネルタイトル - タイプ別
// ==================================
.zenblocks-panel-title--parent {
	// 親パネルタイトル
}

.zenblocks-panel-title--settings {
	// 設定パネルタイトル
}

// ==================================
// パネルタイトル - 名前別（一意）
// ==================================

// 基本設定グループ
.zenblocks-panel-title--basic {
}

.zenblocks-panel-title--text-settings {
}

.zenblocks-panel-title--tag-settings {
}

// 表示設定
.zenblocks-panel-title--display {
}

// スタイル設定グループ
.zenblocks-panel-title--style {
}

.zenblocks-panel-title--styling-border {
}

.zenblocks-panel-title--styling-radius {
}

.zenblocks-panel-title--styling-shadow {
}

.zenblocks-panel-title--styling-opacity {
}

// 背景設定グループ
.zenblocks-panel-title--background {
}

.zenblocks-panel-title--background-color {
}

.zenblocks-panel-title--background-image {
}

.zenblocks-panel-title--background-pattern {
}

// フォント設定グループ
.zenblocks-panel-title--font {
}

.zenblocks-panel-title--font-size {
}

.zenblocks-panel-title--font-weight {
}

.zenblocks-panel-title--font-line-height {
}

.zenblocks-panel-title--font-letter-spacing {
}

// アイコン設定グループ
.zenblocks-panel-title--icon {
}

.zenblocks-panel-title--icon-select {
}

.zenblocks-panel-title--icon-size {
}

.zenblocks-panel-title--icon-position {
}

.zenblocks-panel-title--icon-frame {
}

.zenblocks-panel-title--icon-frame-size {
}

.zenblocks-panel-title--icon-frame-color {
}

.zenblocks-panel-title--icon-frame-border {
}

.zenblocks-panel-title--icon-frame-radius {
}

.zenblocks-panel-title--icon-frame-transition {
}

// サムネイル設定グループ
.zenblocks-panel-title--thumbnail {
}

// スペーシング設定グループ
.zenblocks-panel-title--spacing {
}

.zenblocks-panel-title--spacing-padding {
}

.zenblocks-panel-title--spacing-margin {
}

// レイアウト設定グループ
.zenblocks-panel-title--layout {
}

.zenblocks-panel-title--layout-width {
}

.zenblocks-panel-title--layout-height {
}

.zenblocks-panel-title--layout-position {
}

// ==================================
// パネルコンテンツ内のパーツ
// ==================================

// ボタン
.zenblocks-panel {

	.components-button {
		// ボタン共通スタイル
	}
}

// レンジコントロール
.zenblocks-panel {

	.components-range-control {
		// レンジコントロール共通スタイル
	}
}

// テキストコントロール
.zenblocks-panel {

	.components-text-control__input {
		// テキスト入力共通スタイル
	}
}

// セレクトコントロール
.zenblocks-panel {

	.components-select-control {
		// セレクト共通スタイル
	}
}

// トグルコントロール
.zenblocks-panel {

	.components-toggle-control {
		// トグル共通スタイル
	}
}

// カラーピッカー
.zenblocks-panel {

	.components-color-picker {
		// カラーピッカー共通スタイル
	}
}