/*
Theme Name: ダイスde短歌 テーマ
Author: ikeda
Version: 0.3 (Zen Kaku & アイコン復活版)
*/

@import url('https://fonts.googleapis.com/css2?family=Zen+Kaku+Gothic+New:wght@400;500;700;900&display=swap');

/* =========================================
   🌟 カラー変数同期 🌟
   ========================================= */
:root {
  --mein-midori: #45A69F;
  --haikei-gray: #F8FAFC;
  --urui-black: #334155;
  --hutuu-black: #0F172A;
  --akusent-kiiro: #F4E3AB;
  --koi-pink: #C52969;
  --usui-pink: #EFC3D5;
  --nanka-ao: #439EBA;
  --torima-white: #ffffff;
  --pan-kuro: #64748B;
  --usui-midori: #F0FDFA;
  --waku-hai: #E2E8F0;
}

/* --- 🌟 カラーパレットとの精密同期設定 --- */

/* メイン緑 (meinmidori) */
.has-meinmidori-background-color { background-color: var(--mein-midori) !important; }
.has-meinmidori-color            { color: var(--mein-midori) !important; }
.has-meinmidori-border-color     { border-color: var(--mein-midori) !important; }

/* 背景灰色 (haikeigray) */
.has-haikeigray-background-color { background-color: var(--haikei-gray) !important; }
.has-haikeigray-color            { color: var(--haikei-gray) !important; }

/* 薄い黒 (uruiblack) */
.has-uruiblack-background-color  { background-color: var(--urui-black) !important; }
.has-uruiblack-color             { color: var(--urui-black) !important; }

/* 標準黒 (hutuublack) */
.has-hutuublack-background-color { background-color: var(--hutuu-black) !important; }
.has-hutuublack-color            { color: var(--hutuu-black) !important; }

/* アクセント黄色 (akusentkiiro) */
.has-akusentkiiro-background-color { background-color: var(--akusent-kiiro) !important; }
.has-akusentkiiro-color            { color: var(--akusent-kiiro) !important; }
.has-akusentkiiro-border-color     { border-color: var(--akusent-kiiro) !important; }

/* 濃いピンク (koipink) */
.has-koipink-background-color     { background-color: var(--koi-pink) !important; }
.has-koipink-color                { color: var(--koi-pink) !important; }

/* 薄いピンク (usuipink) */
.has-usuipink-background-color    { background-color: var(--usui-pink) !important; }
.has-usuipink-color               { color: var(--usui-pink) !important; }

/* なんか青 (nankaao) */
.has-nankaao-background-color     { background-color: var(--nanka-ao) !important; }
.has-nankaao-color                { color: var(--nanka-ao) !important; }

/* とりま白 (torimawhite) */
.has-torimawhite-background-color { background-color: var(--torima-white) !important; }
.has-torimawhite-color            { color: var(--torima-white) !important; }

/* パン用黒 (pankuro) */
.has-pankuro-background-color { background-color: var(--pan-kuro) !important; }
.has-pankuro-color            { color: var(--pan-kuro) !important; }

/* 薄い緑 (usuimidori) */
.has-usuimidori-background-color { background-color: var(--usui-midori) !important; }
.has-usuimidori-color            { color: var(--usui-midori) !important; }

/* 枠専用灰色 (wakuhai) */
.has-wakuhai-background-color { background-color: var(--waku-hai) !important; }
.has-wakuhai-color            { color: var(--waku-hai) !important; }

/* =========================================
   🌟 フォント支配 (Zen Kaku Gothic New) 🌟
   ========================================= */
body, .editor-styles-wrapper {
    margin: 0; padding: 0;
    font-family: 'Zen Kaku Gothic New', sans-serif !important;
}

/* ⚠️ アスタリスク (*) を排除し、テキスト要素だけを狙い撃ち！ */
.wp-block-kadence-advancedheading,
.wp-block-kadence-advancedbtn,
.wp-block-advanced-text {
    font-family: 'Zen Kaku Gothic New', sans-serif !important;
}

/* タイトル用フォント（ここはsans-serifを維持） */
.daitaitoru { font-family: sans-serif !important; }

/* =========================================
   Dice de Tanka - 独自スタイル (Tailwind風など)
   ========================================= */
:root {
  --c-white: #ffffff;
  --c-teal-50: #f0fdfa;
  --c-teal-100: #ccfbf1;
  --c-teal-600: #0d9488;
  --c-teal-700: #0f766e;
  --c-teal-800: #115e59;
  --c-slate-50: #f8fafc;
  --c-slate-100: #f1f5f9;
  --c-slate-200: #e2e8f0;
  --c-slate-500: #64748b;
  --c-slate-600: #475569;
  --c-slate-700: #334155;
  --c-slate-800: #1e293b;
  --c-slate-900: #0f172a;
  --c-amber-200: #fde68a;
  --c-amber-300: #fcd34d;
  --c-fuchsia-500: #d946ef;
}

.max-w-6xl { max-width: 1152px; }
.mx-auto { margin-left: auto; margin-right: auto; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.p-4 { padding: 1rem; }
.p-5 { padding: 1.25rem; }
.p-6 { padding: 1.5rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-4 { margin-top: 1rem; }
.mb-4 { margin-bottom: 1rem; }

.grid { display: grid; }
.flex { display: flex; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.gap-2 { gap: 0.5rem; }
.gap-4 { gap: 1rem; }
.gap-12 { gap: 3rem; }

@media (min-width: 768px) {
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .md\:text-4xl { font-size: 2.25rem; }
}

.bg-white { background-color: var(--c-white); }
.bg-teal-50 { background-color: var(--c-teal-50); }
.bg-teal-700 { background-color: var(--c-teal-700); }
.bg-amber-300 { background-color: var(--c-amber-300); }
.text-slate-500 { color: var(--c-slate-500); }
.text-slate-700 { color: var(--c-slate-700); }
.text-teal-700 { color: var(--c-teal-700); }
.text-slate-900 { color: var(--c-slate-900); }

.rounded-full { border-radius: 9999px; }
.rounded-2xl { border-radius: 1rem; }
.border { border-width: 1px; }
.border-teal-100 { border-color: var(--c-teal-100); }
.shadow-sm { box-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05); }

.w-fit { width: fit-content !important; display: inline-block !important; }

/* =========================================
   右側カードエリア
   ========================================= */
.kadence-card-wrapper { position: relative; padding: 20px; display: flex; justify-content: center; align-items: center; }
.kadence-card-wrapper::before { content: ""; position: absolute; top: 0; left: 0; width: 100px; height: 100px; background-color: #ccfbf1; border-radius: 22px; z-index: 0; }
.kadence-card-wrapper::after { content: ""; position: absolute; bottom: -10px; right: -15px; width: 90px; height: 90px; background-color: #fae8ff; border-radius: 22px; z-index: 0; }
.main-white-card { position: relative; z-index: 1; width: 100%; overflow: hidden; }
.inner-gray-box { background-color: #f8fafc; border-radius: 20px; padding: 24px; height: 100%; }
.border-pink-400 { border: 2px solid #f472b6 !important; }
.border-purple-400 { border: 2px solid #a78bfa !important; }
.step-list { text-align: left !important; padding-left: 12px !important; margin: 0 !important; }
.step-list li { margin-bottom: 5px; }
.temp-header-fix { overflow: visible !important; z-index: 9999 !important; position: relative !important; }
.temp-header-fix .kadence-mobile-menu-container { position: fixed !important; top: 0 !important; left: 0 !important; height: 100vh !important; }

/* =========================================
   入力画面：CF7装飾
   ========================================= */
.cf7-custom-form { font-family: sans-serif; }
.cf7-label { font-size: 14px; font-weight: bold; color: var(--hutuu-black); display: flex !important; align-items: center; gap: 8px; margin-bottom: 8px; }
.cf7-req { background-color: var(--usui-pink); color: var(--koi-pink); border: 1px solid var(--koi-pink); padding: 2px 6px; border-radius: 4px; font-size: 10px; line-height: 1; }
.cf7-input, .cf7-textarea { width: 100%; border-radius: 12px; border: 1px solid var(--waku-hai); background-color: var(--torima-white); padding: 12px 16px; font-size: 14px; color: var(--hutuu-black); box-sizing: border-box; }
.cf7-row { display: flex !important; flex-wrap: wrap !important; gap: 20px !important; margin-bottom: 20px !important; }
.cf7-col { flex: 1 1 200px !important; }

.cf7-custom-form .wpcf7-radio { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 12px !important; }
@media (max-width: 768px) { .cf7-custom-form .wpcf7-radio { grid-template-columns: 1fr !important; } }
.cf7-custom-form .wpcf7-radio .wpcf7-list-item { margin: 0 !important; }
.cf7-custom-form .wpcf7-radio label { display: flex !important; align-items: center !important; gap: 12px !important; padding: 10px 20px !important; border: 1px solid var(--waku-hai) !important; border-radius: 12px !important; background-color: var(--torima-white) !important; cursor: pointer; height: 100% !important; box-sizing: border-box; font-size: 14px;}
.cf7-custom-form .wpcf7-radio label:has(input:checked) { border-color: var(--mein-midori) !important; background-color: var(--usui-midori) !important; }
.cf7-custom-form .wpcf7-radio input { opacity: 0 !important; position: absolute !important; width: 0 !important; height: 0 !important; pointer-events: none !important; }
.cf7-custom-form .wpcf7-radio label::before { content: "" !important; display: block !important; width: 20px; height: 20px; border: 1px solid var(--waku-hai); border-radius: 50%; background-color: var(--torima-white); flex-shrink: 0; box-shadow: inset 0 0 0 3px var(--torima-white); }
.cf7-custom-form .wpcf7-radio label:has(input:checked)::before { border: 2px solid var(--mein-midori) !important; background-color: var(--mein-midori) !important; }

.cf7-consent-area { background-color: #f8fafc; border: 1px solid var(--waku-hai); border-radius: 12px; padding: 16px; margin-bottom: 24px; font-size: 14px; color: var(--hutuu-black); }
.cf7-consent-area label { display: flex !important; align-items: flex-start !important; gap: 10px !important; cursor: pointer !important; }
.cf7-consent-area label::before { display: none !important; }
.cf7-consent-area input[type="checkbox"] { margin-top: 4px !important; display: inline-block !important; }

.cf7-bottom-action { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 10px; }
.cf7-submit-btn { background-color: var(--mein-midori); color: #fff; border: none; padding: 12px 32px; border-radius: 999px; font-weight: bold; font-size: 14px; cursor: pointer; }

.cf7-custom-form p { margin: 0 !important; padding: 0 !important; }
.cf7-custom-form br { display: none !important; }

/* =========================================
   確認画面パッチ
   ========================================= */
form:has(+ #wpcf7cpcnf) .cf7-bottom-action { display: none !important; }

#wpcf7cpcnf table { width: 100% !important; border-collapse: collapse !important; border: none !important; margin-bottom: 10px !important; }
#wpcf7cpcnf tr { border-bottom: 1px solid var(--waku-hai) !important; }
#wpcf7cpcnf th { width: 35% !important; padding: 8px 15px !important; text-align: left !important; font-size: 14px; color: var(--urui-black) !important; font-weight: bold !important; border: none !important; }
#wpcf7cpcnf td { width: 65% !important; padding: 8px 15px !important; text-align: left !important; font-size: 16px; color: var(--mein-midori) !important; font-weight: bold !important; border: none !important; }

#wpcf7cpcnf .wpcf7-radio input { opacity: 1 !important; position: static !important; width: auto !important; height: auto !important; margin-right: 8px !important; display: inline-block !important; pointer-events: auto !important; }
#wpcf7cpcnf .wpcf7-list-item label { border: none !important; background: transparent !important; padding: 0 !important; color: var(--mein-midori) !important; cursor: default !important; font-weight: bold !important; }
#wpcf7cpcnf .wpcf7-list-item label::before { display: none !important; }
#wpcf7cpcnf .cf7-req { display: none !important; }

.wpcf7cp-btns { display: flex !important; justify-content: center !important; gap: 20px !important; margin: 0 !important; padding: 10px 0 20px 0 !important; }
.wpcf7cp-btns button { min-width: 180px !important; padding: 12px 40px !important; border-radius: 999px !important; font-weight: bold !important; font-size: 16px !important; cursor: pointer !important; }
button.wpcf7cp-cfm-edit-btn { background-color: var(--torima-white) !important; color: var(--urui-black) !important; border: 1px solid var(--waku-hai) !important; }
button.wpcf7cp-cfm-submit-btn { background-color: var(--mein-midori) !important; color: var(--torima-white) !important; border: none !important; }

/* =========================================
   その他の装飾
   ========================================= */
.iconyoko { transform: rotate(90deg); }

.newsgurid .wp-block-post-title { margin: 0; }
