@charset "UTF-8";

/* 基本フォント設定 */
body {
    font-family: 'Noto Sans JP', sans-serif;
}

/* -------------------------------------------
   吹き出しパーツ
------------------------------------------- */
.bubble-left { position: relative; }
.bubble-left::after {
    content: ''; position: absolute; left: -8px; top: 12px;
    width: 0; height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid white;
}

.bubble-right { position: relative; }
.bubble-right::after {
    content: ''; position: absolute; right: -8px; top: 12px;
    width: 0; height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 8px solid #fce7f3; /* pink-100 */
}

/* -------------------------------------------
   アニメーション
------------------------------------------- */
.fade-in { animation: fadeIn 0.5s ease-in-out; }
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* -------------------------------------------
   管理画面エディターの調整
------------------------------------------- */
.editor-styles-wrapper {
    background-color: #f8fafc; /* slate-50 */
}

/* タイトル修正（Tailwindリセット対策） */
.editor-post-title__block .wp-block-post-title,
.wp-block-post-title,
h1.wp-block-post-title {
    font-size: 2.5em !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    margin-bottom: 1rem !important;
}

/* ▼▼▼ 追加：カスタムブロック用のエディター調整 ▼▼▼ */
/* ブロックエディター内でTailwindのflexが効きやすくするためのラッパー調整 */
.wp-block-cflp-chat-bubble {
    margin-bottom: 1.5rem; /* 吹き出しごとの間隔 */
}