/* =============================================================================
   IMC Gen — フロントエンドスタイル
   モバイルファースト / iOS タッチ操作最適化
   ============================================================================= */

/* --- カスタムプロパティ ------------------------------------------------------- */
:root {
	--imc-primary:      #007AFF;
	--imc-primary-dark: #0066FF;
	--imc-success:      #34C759; /* iOS Green   */
	--imc-error:        #FF3B30; /* iOS Red     */
	--imc-warning:      #FF9500; /* iOS Orange  */
	--imc-info:         #5AC8FA; /* iOS Cyan    */
	--imc-bg:           #F2F2F7; /* iOS Light   */
	--imc-surface:      #FFFFFF;
	--imc-border:       #D1D1D6;
	--imc-text:         #1C1C1E;
	--imc-text-muted:   #8E8E93;
	--imc-radius:       14px;
	--imc-radius-sm:    10px;
	--imc-shadow:       0 2px 16px rgba(0, 0, 0, 0.08);
	--imc-touch-min:    44px;   /* iOS HIG 最小タッチターゲット */
}

/* --- ラッパー ----------------------------------------------------------------- */
.imc-gen-wrapper {
	max-width: 640px;
	margin: 0 auto;
	font-family: -apple-system, BlinkMacSystemFont, 'Hiragino Sans', 'Helvetica Neue', sans-serif;
	color: var(--imc-text);
	-webkit-text-size-adjust: 100%;
}

/* --- 共通見出し -------------------------------------------------------------- */
.wp-block-post-title {
	text-align: center;
	padding-bottom: 0.7em;
}

/* --- ユーティリティ ----------------------------------------------------------- */
.is-hidden {
	display: none !important;
}

/* --- アラート / バッジ -------------------------------------------------------- */
.imc-gen-alert {
	border-radius: var(--imc-radius-sm);
	padding: 12px 16px;
	font-size: 14px;
	line-height: 1.5;
	margin-bottom: 20px;
}

.imc-gen-alert--success {
	background: #F0FFF4;
	border-left: 4px solid var(--imc-success);
	color: #1A6B3C;
}

.imc-gen-alert--error {
	background: #FFF2F1;
	border-left: 4px solid var(--imc-error);
	color: #C0392B;
}

.imc-gen-alert--info {
	background: #EAF4FF;
	border-left: 4px solid var(--imc-info);
	color: #2980B9;
}

.imc-gen-trial-badge {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #FFF3E0;
	border: 1px solid #FFB74D;
	border-radius: var(--imc-radius-sm);
	padding: 10px 14px;
	font-size: 14px;
	font-weight: 600;
	color: #E65100;
	margin-bottom: 20px;
}

/* --- カード ------------------------------------------------------------------- */
.imc-gen-form-card,
.imc-gen-download-card,
.imc-gen-pricing-card,
.imc-gen-legal-card {
	background: var(--imc-surface);
	border-radius: var(--imc-radius);
	box-shadow: var(--imc-shadow);
	padding: 24px 36px;
	margin-bottom: 24px;
}

.imc-gen-form-card__title,
.imc-gen-download-card__title,
.imc-gen-pricing-card__title {
	font-size: 20px;
	font-weight: 700;
	margin: 0 0 16px;
	letter-spacing: -0.3px;
}

/* --- フォーム ----------------------------------------------------------------- */
.imc-gen-form {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.imc-gen-fieldset {
	border: 1px solid var(--imc-border);
	border-radius: var(--imc-radius-sm);
	padding: 16px;
	margin: 0 0 16px;
}

.imc-gen-fieldset__legend {
	font-size: 13px;
	font-weight: 600;
	color: var(--imc-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.5px;
	padding: 0 6px;
}

.imc-gen-field {
	margin-bottom: 16px;
}

.imc-gen-field:last-child {
	margin-bottom: 0;
}

.imc-gen-field--row {
	display: flex;
	gap: 12px;
}

.imc-gen-field__col {
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}

.imc-gen-label {
	display: block;
	font-size: 14px;
	font-weight: 400;
	margin-bottom: 6px;
	color: var(--imc-text);
}

.imc-gen-label--checkbox {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: var(--imc-touch-min);
	cursor: pointer;
}

#imc-gen-auth-check-result {
	font-size: 14px;
	margin-top: 6px;
}

.imc-gen-required {
	color: var(--imc-error);
	margin-left: 3px;
}

.imc-gen-input,
.imc-gen-select {
	width: 100%;
	height: var(--imc-touch-min);
	padding: 0 14px;
	border: 1.5px solid var(--imc-border);
	border-radius: var(--imc-radius-sm);
	font-size: 16px; /* iOS では 16px 未満でズームが発生するため固定 */
	color: var(--imc-text);
	background: var(--imc-surface);
	-webkit-appearance: none;
	appearance: none;
	transition: border-color 0.15s ease;
	box-sizing: border-box;
}

.imc-gen-input:focus,
.imc-gen-select:focus {
	outline: none;
	border-color: var(--imc-primary);
	box-shadow: 0 0 0 3px rgba(0, 78, 151, 0.15);
}

.imc-gen-select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238E8E93' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 14px center;
	padding-right: 36px;
}

.imc-gen-checkbox {
	width: 20px;
	height: 20px;
	border: 1.5px solid var(--imc-border);
	border-radius: 6px;
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	flex-shrink: 0;
	position: relative;
	background: var(--imc-surface);
}

.imc-gen-checkbox:checked {
	background: var(--imc-primary);
	border-color: var(--imc-primary);
}

.imc-gen-checkbox:checked::after {
	content: '';
	position: absolute;
	left: 5px;
	top: 2px;
	width: 6px;
	height: 10px;
	border: 2px solid #fff;
	border-top: none;
	border-left: none;
	transform: rotate(45deg);
}

.imc-gen-hint {
	font-size: 12px;
	color: var(--imc-text-muted);
	margin: 6px 0 0;
	line-height: 1.5;
}

/* --- ボタン ------------------------------------------------------------------- */
.imc-gen-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: var(--imc-touch-min);
	padding: 0 24px;
	border-radius: var(--imc-radius-sm);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -0.2px;
	text-decoration: none;
	cursor: pointer;
	border: none;
	transition: opacity 0.15s ease, transform 0.1s ease;
	-webkit-tap-highlight-color: transparent;
}

.imc-gen-btn:active {
	transform: scale(0.97);
	opacity: 0.85;
}

.imc-gen-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
	transform: none;
}

.imc-gen-btn--primary {
	background: var(--imc-primary);
	color: #fff;
}

.imc-gen-btn--primary:hover {
	background: var(--imc-primary-dark);
	color: #fff;
	text-decoration: none;
}

.imc-gen-btn--secondary {
	background: var(--imc-bg);
	color: var(--imc-primary);
	border: 1.5px solid var(--imc-border);
}

.imc-gen-btn--large {
	min-height: 54px;
	font-size: 18px;
	border-radius: var(--imc-radius);
}

.imc-gen-btn--sm {
	min-height: 36px;
	padding: 0 14px;
	font-size: 14px;
}

.imc-gen-btn--full {
	width: 90%;
}

.imc-gen-btn--download {
	background: var(--imc-success);
	width: 100%;
	gap: 8px;
}

.imc-gen-btn--download::before {
	content: '↓';
	font-size: 20px;
	font-weight: 700;
}

.imc-gen-submit {
	margin-top: 8px;
	text-align: center;
}

/* --- 自動遷移案内テキスト ----------------------------------------------------- */
.imc-gen-redirect-notice {
	font-size: 13px;
	color: var(--imc-text-muted);
	margin: 12px 0 0;
}

/* --- ダウンロードカード ------------------------------------------------------- */
.imc-gen-download-card__header {
	text-align: center;
	margin-bottom: 28px;
}

.imc-gen-success-icon {
	font-size: 48px;
	display: block;
	margin-bottom: 12px;
}

.imc-gen-download-card__subtitle {
	color: var(--imc-text-muted);
	font-size: 14px;
	margin: 6px 0 0;
}

.imc-gen-download-action {
	margin-bottom: 28px;
}

.imc-gen-expires-info {
	text-align: center;
	font-size: 13px;
	color: var(--imc-text-muted);
	margin: 10px 0 0;
}

.imc-gen-result {
	animation: imc-fade-in 0.3s ease;
}

@keyframes imc-fade-in {
	from { opacity: 0; transform: translateY(8px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* --- QRコード ----------------------------------------------------------------- */
.imc-gen-qr-section,
.imc-gen-shorturl-section,
.imc-gen-steps-section {
	margin-bottom: 24px;
	padding-top: 20px;
	border-top: 1px solid var(--imc-border);
}

.imc-gen-section-title {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 8px;
}

.imc-gen-section-desc {
	font-size: 13px;
	color: var(--imc-text-muted);
	margin: 0 0 16px;
}

.imc-gen-qr-container {
	display: flex;
	justify-content: center;
	padding: 16px;
	background: var(--imc-bg);
	border-radius: var(--imc-radius-sm);
}

/* --- 短縮URL ------------------------------------------------------------------ */
.imc-gen-shorturl-row {
	display: flex;
	align-items: center;
	gap: 10px;
	background: var(--imc-bg);
	border-radius: var(--imc-radius-sm);
	padding: 10px 14px;
}

.imc-gen-shorturl-text {
	flex: 1;
	font-size: 14px;
	font-family: 'SFMono-Regular', 'Menlo', monospace;
	color: var(--imc-primary);
	word-break: break-all;
	overflow: hidden;
}

/* --- 手順リスト --------------------------------------------------------------- */
.imc-gen-steps {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: imc-step;
}

.imc-gen-steps__item {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 12px 0;
	font-size: 14px;
	line-height: 1.5;
	border-bottom: 1px solid var(--imc-bg);
	counter-increment: imc-step;
}

.imc-gen-steps__item:last-child {
	border-bottom: none;
}

.imc-gen-steps__item::before {
	content: counter(imc-step);
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 28px;
	height: 28px;
	background: var(--imc-primary);
	color: #fff;
	border-radius: 50%;
	font-size: 13px;
	font-weight: 700;
	flex-shrink: 0;
}

/* --- 料金プランカード --------------------------------------------------------- */
.imc-gen-pricing-card__desc {
	color: var(--imc-text-muted);
	font-size: 14px;
	margin: 0 0 20px;
}

.imc-gen-plan {
	background: var(--imc-bg);
	border-radius: var(--imc-radius);
	padding: 20px;
	margin-bottom: 16px;
	text-align: center;
}

.imc-gen-plan__name {
	font-size: 15px;
	font-weight: 600;
	color: var(--imc-text-muted);
	margin-bottom: 12px;
}

.imc-gen-plan__price {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 2px;
	margin-bottom: 20px;
}

.imc-gen-plan__currency {
	font-size: 22px;
	font-weight: 700;
}

.imc-gen-plan__amount {
	font-size: 48px;
	font-weight: 800;
	letter-spacing: -2px;
	line-height: 1;
}

.imc-gen-plan__interval {
	font-size: 16px;
	color: var(--imc-text-muted);
}

.imc-gen-plan__features {
	list-style: none;
	margin: 0 0 24px;
	padding: 0;
	text-align: left;
	font-size: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.imc-gen-pricing-note {
	font-size: 12px;
	color: var(--imc-text-muted);
	text-align: center;
	margin: 8px 0 0;
}

/* --- CTA -------------------------------------------------------------------- */
.imc-gen-cta {
	text-align: center;
	padding: 32px 16px;
	background: var(--imc-surface);
	border-radius: var(--imc-radius);
	box-shadow: var(--imc-shadow);
}

.imc-gen-cta__message {
	font-size: 15px;
	margin: 0 0 20px;
	color: var(--imc-text-muted);
}

/* --- ダウンロードボタン群 ----------------------------------------------------- */
.imc-gen-download-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 16px;
}

.imc-gen-download-actions .imc-gen-btn {
	flex: 1 1 auto;
	min-width: 140px;
	font-size: 15px;
}

/* --- 手順サブタイトル --------------------------------------------------------- */
.imc-gen-steps-subtitle {
	font-size: 14px;
	font-weight: 600;
	margin: 20px 0 6px;
	color: var(--imc-text);
	line-height: 1.4;
}

.imc-gen-steps-subtitle:first-of-type {
	margin-top: 8px;
}

/* --- 認証カード (register / login) ------------------------------------------ */
.imc-gen-auth-card {
	background: var(--imc-surface);
	border-radius: var(--imc-radius);
	box-shadow: var(--imc-shadow);
	padding: 32px 24px;
	max-width: 400px;
	margin: 0 auto 24px;
}

.imc-gen-auth-card__header {
	text-align: center;
	margin-bottom: 24px;
}

.imc-gen-auth-card__title {
	font-size: 22px;
	font-weight: 700;
	margin: 0 0 20px;
	letter-spacing: -0.3px;
}

.imc-gen-auth-card__subtitle {
	font-size: 13px;
	color: var(--imc-text-muted);
	margin: 0;
}

/* --- 区切り線（または） ------------------------------------------------------- */
.imc-gen-auth-divider {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 24px 0 12px;
	color: var(--imc-text-muted);
	font-size: 13px;
}

.imc-gen-auth-divider::before,
.imc-gen-auth-divider::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--imc-border);
}

.imc-gen-divider {
	margin-top: 24px;
}

/* --- 認証フォームフィールド -------------------------------------------------- */
.imc-gen-auth-field {
	display: flex;
	flex-direction: column;
	margin-bottom: 16px;
}

.imc-gen-auth-card form .imc-gen-submit {
	margin-top: 24px;
}

/* --- 認証フォームのフッターリンク --------------------------------------------- */
.imc-gen-auth-link {
	text-align: center;
	font-size: 14px;
	color: var(--imc-text-muted);
	margin: 20px 0 0;
}

.imc-gen-auth-link a {
	color: var(--imc-primary);
	text-decoration: none;
}

.imc-gen-auth-link a:hover {
	text-decoration: underline;
}

/* --- 法的ページ（特商法・使用許諾） ------------------------------------------ */
.imc-gen-legal {
	font-size: 0.67em;
}

.imc-gen-legal h2 {
	font-size: 1.2em;
	margin-top: 1.5em;
	margin-bottom: 0.5em;
	color: #333;
}

.imc-gen-legal h2.imc-gen-legal-section-title {
	font-size: 1.6em;
	text-align: center;
	margin-bottom: 1.5em;
}

.imc-gen-legal p {
	color: #444;
	line-height: 1.7;
	margin: 0 0 12px;
}

.imc-gen-legal ul {
	padding-left: 20px;
	margin: 6px 0 12px;
}

.imc-gen-legal ul li {
	margin-bottom: 4px;
	color: #444;
	line-height: 1.7;
}

.imc-gen-legal hr {
	border: none;
	border-top: 1px solid #e5e7eb;
	margin: 1.5em 0;
}

.imc-gen-legal h3 {
	font-size: 1.2em;
	font-weight: 400;
	margin-top: 1.2em;
	margin-bottom: 0.3em;
	color: #333;
}

.imc-gen-legal-updated {
	text-align: right;
	font-size: 0.9em;
	color: #888;
	margin-top: 16px;
}

/* --- レスポンシブ（タブレット以上） ------------------------------------------- */
@media (min-width: 480px) {
	.imc-gen-wrapper {
		padding-left: 24px;
		padding-right: 24px;
	}

	.imc-gen-form-card,
	.imc-gen-download-card,
	.imc-gen-pricing-card {
		padding: 32px 28px;
	}

	.imc-gen-fieldset {
		padding: 20px;
	}

	.imc-gen-auth-card {
		padding: 40px 36px;
	}
}

/* --- Contact Form 7 ---------------------------------------------------------- */
.imc-gen-cf7-wrap {
	max-width: 600px;
	margin: 0 auto;
}

.imc-gen-cf7-card {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	padding: 2em;
}

.imc-gen-cf7-field {
	margin-bottom: 1.2em;
}

.imc-gen-cf7-field span.wpcf7-form-control-wrap {
	display: block;
	margin-bottom: 0;
}

.imc-gen-cf7-field span {
	line-height: 1;
}

.imc-gen-cf7-field label {
	font-size: 0.7em;
	font-weight: 400;
	color: #333;
	margin-bottom: 0.2em;
}

.imc-gen-cf7-required {
	color: #dc2626;
	margin-left: 2px;
}

.imc-gen-cf7-field input[type="text"],
.imc-gen-cf7-field input[type="email"],
.imc-gen-cf7-field textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #d1d5db;
	border-radius: 6px;
	font-size: 0.7em;
	color: #333;
	box-sizing: border-box;
	transition: border-color 0.2s;
}

.imc-gen-cf7-field input[type="text"]:focus,
.imc-gen-cf7-field input[type="email"]:focus,
.imc-gen-cf7-field textarea:focus {
	outline: none;
	border-color: #007AFF;
	box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.1);
}

.imc-gen-cf7-field textarea {
	min-height: 150px;
	resize: vertical;
}

.imc-gen-cf7-submit {
	text-align: center;
	margin-top: 1.5em;
}

.imc-gen-cf7-submit input[type="submit"] {
	background-color: #007AFF;
	color: #fff;
	border: none;
	border-radius: 6px;
	padding: 12px 40px;
	font-size: 1em;
	cursor: pointer;
	transition: background-color 0.2s;
}

.imc-gen-cf7-submit input[type="submit"]:hover {
	background-color: var(--imc-primary-dark);
}

/* CF7の必須マーク(*)をラベルと同じ行に表示 */
.imc-gen-cf7-field label {
	display: inline;
}

.imc-gen-cf7-field .required {
	color: #dc2626;
	margin-left: 2px;
	font-size: 0.9em;
}

/* 入力欄はブロック表示に戻す */
.imc-gen-cf7-field span.wpcf7-form-control-wrap {
	display: block;
	margin-top: 0.3em;
}

/* CF7のラベル後のbrを非表示にして間隔を詰める */
.imc-gen-cf7-field br {
	display: none;
}

/* CF7のpタグの余白を調整 */
.imc-gen-cf7-field p {
	margin: 0;
}

/* --- NextendSocialLogin ボタン ----------------------------------------------- */
div.nsl-container[data-align="center"] {
	text-align: center !important;
	margin-bottom: 20px !important;
}

div.nsl-container[data-align="left"] {
	text-align: center !important;
	margin-bottom: 20px !important;
}


