/* =======================================================
   BuzzBeaver: Lightning G3 完全対応・修復版CSS (v2)
   ======================================================= */

/* --- 0. 基本リセット --- */
/* フッターのコピーライトなどを消す */
footer .copySection p:nth-child(2) { display: none !important; }

/* --- 1. 背景（ドット柄） --- */
body {
    background-color: #f2f2f2;
    background-image: radial-gradient(#bbbbbb 20%, transparent 20%), radial-gradient(#bbbbbb 20%, transparent 20%);
    background-position: 0 0, 10px 10px;
    background-size: 20px 20px;
}

/* --- 2. ヘッダー（黒×蛍光） --- */
header.siteHeader, .site-header, .l-header {
    background-color: #1a1a1a !important;
    border-bottom: 4px solid #ccff00;
}
/* ロゴ・メニュー文字 */
.siteHeaderLogo, .site-header-logo { color: #ccff00 !important; font-weight: 900; }
.global-nav-list > li > a { color: #fff !important; font-weight: bold; }

/* --- 3. ページタイトル（G3対応・強制適用） --- */
div.page-header, div.archive-header, div.section-header, .l-page-header {/* =======================================================
   BuzzBeaver: Lightning G3 完全対応・修復版CSS
   ======================================================= */

/* --- 0. 基本リセット --- */
/* フッターのコピーライトなどを消す */
footer .copySection p:nth-child(2) { display: none !important; }

/* --- 1. 背景（ドット柄） --- */
body {
    background-color: #f2f2f2;
    background-image: radial-gradient(#bbbbbb 20%, transparent 20%), radial-gradient(#bbbbbb 20%, transparent 20%);
    background-position: 0 0, 10px 10px;
    background-size: 20px 20px;
}

/* --- 2. ヘッダー（黒×蛍光） --- */
header.siteHeader, .site-header {
    background-color: #1a1a1a !important;
    border-bottom: 4px solid #ccff00;
}
/* ロゴ・メニュー文字 */
.siteHeaderLogo, .site-header-logo { color: #ccff00 !important; font-weight: 900; }
.global-nav-list > li > a { color: #fff !important; font-weight: bold; }

/* --- 3. ページタイトル（G3対応・強制適用） --- */
/* G3では .page-header クラスの扱いが変わることがあるため、親要素から指定 */
div.page-header, div.archive-header, div.section-header {
    background-color: #1a1a1a !important;
    background-image: none !important; /* 初期画像を消す */
    border-bottom: none !important;
    padding: 60px 0 !important;
    text-align: center !important;
    box-shadow: 0px 6px 0px #000;
    margin-bottom: 40px !important;
}
/* タイトル文字 */
div.page-header h1, div.archive-header h1, div.section-header h1,
h1.page-header-title, h1.archive-header-title {
    font-family: Impact, "Arial Black", sans-serif !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    text-shadow: 4px 4px 0px #ccff00, 6px 6px 0px #000 !important;
    font-size: 3.2rem !important;
    line-height: 1.2 !important;
    transform: skewX(-10deg) rotate(-3deg) !important;
    display: inline-block !important;
    background: none !important;
    border: none !important;
    padding: 0 10px !important;
    margin: 0 !important;
}
/* スパンタグ対策 */
div.page-header h1 span, div.archive-header h1 span {
    color: #ffffff !important;
    text-shadow: 4px 4px 0px #ccff00, 6px 6px 0px #000 !important;
}

/* --- 4. 記事一覧（★ここが画像復活の肝です） --- */
/* カード全体 */
.vk_post, .media, article.post {
    background: #fff;
    border: 3px solid #1a1a1a !important;
    box-shadow: 6px 6px 0px #1a1a1a !important;
    margin-bottom: 24px !important;
    padding: 20px !important;
    border-radius: 0 !important;
    transition: all 0.1s;
}
.vk_post:hover, .media:hover, article.post:hover {
    box-shadow: 8px 8px 0px #ccff00 !important;
    transform: translate(-3px, -3px);
    background-color: #fffff0;
}

/* ★画像の強制表示エリア */
.vk_post_imgOuter, .media-img {
    border: 2px solid #1a1a1a !important;
    margin-right: 20px !important;
    display: block !important;
    float: left !important; /* 左に寄せる */
    width: 35% !important;  /* 幅を確保 */
    max-width: 200px !important;
}
.vk_post_imgOuter img, .media-img img {
    width: 100% !important;
    height: auto !important;
    vertical-align: bottom;
}
/* テキストエリアの回り込み解除防止 */
.vk_post_body, .media-body {
    display: block !important;
    overflow: hidden; /* 画像の回り込みを適切に処理 */
}

/* カテゴリーラベル */
.vk_post_label, .term-label {
    background: #1a1a1a !important;
    color: #ccff00 !important;
    border: 2px solid #ccff00;
    font-weight: bold;
    border-radius: 0 !important;
    transform: skew(-10deg);
    padding: 2px 8px !important;
    display: inline-block !important;
    margin-bottom: 10px !important;
}

/* 抜粋文（3行カット） */
.vk_post_excerpt, .media-body_excerpt {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    overflow: hidden !important;
    font-size: 13px !important;
    color: #666 !important;
    line-height: 1.6 !important;
    margin-top: 5px !important;
    clear: both; /* 念の為 */
}

/* --- 5. 記事の中身（見出し） --- */
.entry-body h2 {
    background: #1a1a1a;
    color: #ccff00;
    padding: 10px 20px;
    border: none;
    box-shadow: 6px 6px 0px #cccccc;
    transform: skew(-2deg);
    font-weight: 900;
    margin-bottom: 30px;
}
.entry-body h2:before, .entry-body h2:after { display: none; }

.entry-body h3 {
    border-bottom: 3px solid #1a1a1a;
    padding: 10px 0;
    background: transparent;
    position: relative;
    margin-top: 40px;
}
.entry-body h3:before {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 40%; height: 10px;
    background: #ccff00;
    z-index: -1;
    transform: skew(-20deg);
}

/* --- 6. サイドバー＆ウィジェット --- */
.widget, .sidebar .widget_block {
    border: 2px solid #1a1a1a;
    background: #fff;
    box-shadow: 4px 4px 0px #bbbbbb;
    padding: 15px;
    margin-bottom: 20px;
}
/* 検索窓（一体型修正） */
.widget_search .wp-block-search__inside-wrapper {
    display: flex !important;
    gap: 0 !important;
    border: 3px solid #1a1a1a !important;
    box-shadow: 6px 6px 0px #cccccc !important;
}
.widget_search .wp-block-search__input {
    border: none !important;
    background: #fff !important;
    border-radius: 0 !important;
    padding: 10px !important;
    flex-grow: 1;
}
.widget_search .wp-block-search__button {
    background-color: #1a1a1a !important;
    color: #ccff00 !important;
    border: none !important;
    border-left: 3px solid #1a1a1a !important;
    padding: 0 15px !important;
    font-weight: 900;
}

/* --- 7. 前へ・次へ（G3対応版） --- */
.postNextPrev {
    margin-top: 50px !important;
    gap: 20px !important;
    display: flex !important;
    align-items: flex-start !important;
}
.postNextPrev .postNextPrev_link {
    border: 3px solid #1a1a1a !important;
    box-shadow: 6px 6px 0px #1a1a1a !important;
    background: #fff !important;
    padding: 15px !important;
    width: 48% !important;
    min-height: 0 !important;
    height: auto !important;
    text-decoration: none !important;
    display: flex !important;
    flex-direction: column !important;
}
.postNextPrev .postNextPrev_thumb {
    width: 100% !important;
    height: 150px !important;
    object-fit: cover !important;
    margin: 0 0 10px 0 !important;
    display: block !important;
    border: 1px solid #1a1a1a;
}
.postNextPrev .postNextPrev_label {
    background-color: #1a1a1a;
    color: #ccff00;
    font-size: 11px;
    font-weight: 900;
    padding: 2px 6px;
    transform: skew(-10deg);
    align-self: flex-start;
    margin-bottom: 5px;
}
.postNextPrev .postNextPrev_title {
    font-weight: bold;
    font-size: 14px;
    color: #1a1a1a;
    line-height: 1.4;
}

/* --- スマホ調整 --- */
@media screen and (max-width: 480px) {
    div.page-header h1 { font-size: 2.2rem !important; }
    .vk_post_imgOuter, .media-img {
        float: none !important;
        width: 100% !important;
        max-width: none !important;
        margin-right: 0 !important;
        margin-bottom: 10px !important;
    }
    .postNextPrev { flex-direction: column !important; }
    .postNextPrev .postNextPrev_link { width: 100% !important; margin-bottom: 20px !important; }
}

/* ▼▼▼ 検索窓の修正（ここだけ追記） ▼▼▼ */
.widget_search .wp-block-search__inside-wrapper {
    display: flex !important;
    flex-wrap: nowrap !important; /* 折り返しを強制禁止 */
    align-items: stretch !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 入力エリア：横幅いっぱいに伸ばす */
.widget_search .wp-block-search__input {
    flex: 1 1 auto !important;
    width: auto !important;
    margin: 0 !important;
    max-width: none !important;
}

/* 検索ボタン：横幅を固定して絶対に落とさない */
.widget_search .wp-block-search__button {
    flex: 0 0 auto !important;
    width: auto !important;
    margin: 0 !important;
    white-space: nowrap !important; /* 文字折り返し禁止 */
    line-height: 1 !important;
}
    background-color: #1a1a1a !important;
    background-image: none !important;
    border-bottom: none !important;
    padding: 60px 0 !important;
    text-align: center !important;
    box-shadow: 0px 6px 0px #000;
    margin-bottom: 40px !important;
}
/* タイトル文字（スマホ対応フォント追加） */
div.page-header h1, div.archive-header h1, div.section-header h1,
h1.page-header-title, h1.archive-header-title, .l-page-header h1 {
    font-family: Impact, "Arial Black", "Hiragino Kaku Gothic Std", "Hiragino Sans", "Noto Sans JP", sans-serif !important;
    font-weight: 900 !important;
    color: #ffffff !important;
    text-shadow: 4px 4px 0px #ccff00, 6px 6px 0px #000 !important;
    font-size: 3.2rem !important;
    line-height: 1.2 !important;
    transform: skewX(-10deg) rotate(-3deg) !important;
    display: inline-block !important;
    background: none !important;
    border: none !important;
    padding: 0 10px !important;
    margin: 0 !important;
}
div.page-header h1 span, div.archive-header h1 span {
    color: #ffffff !important;
    text-shadow: 4px 4px 0px #ccff00, 6px 6px 0px #000 !important;
}

/* --- 4. 記事一覧（テキスト回り込み型） --- */
/* カード全体 */
.vk_post, .media, article.post {
    display: flow-root !important; /* ★Flex解除：画像の回り込みと高さ保持のために必須 */
    background: #fff;
    border: 3px solid #1a1a1a !important;
    box-shadow: 6px 6px 0px #1a1a1a !important;
    margin-bottom: 24px !important;
    padding: 20px !important;
    border-radius: 0 !important;
    transition: all 0.1s;
}
.vk_post:hover, .media:hover, article.post:hover {
    box-shadow: 8px 8px 0px #ccff00 !important;
    transform: translate(-3px, -3px);
    background-color: #fffff0;
}

/* 画像エリア */
.vk_post_imgOuter, .media-img {
    border: 2px solid #1a1a1a !important;
    margin-right: 20px !important;
    display: block !important;
    float: left !important;
    width: 35% !important;
    max-width: 200px !important;
}
.vk_post_imgOuter img, .media-img img {
    width: 100% !important;
    height: auto !important;
    vertical-align: bottom;
}
/* テキストエリア */
.vk_post_body, .media-body {
    display: block !important;
    overflow: hidden; /* 回り込みの崩れ防止 */
}

/* ラベル */
.vk_post_label, .term-label {
    background: #1a1a1a !important;
    color: #ccff00 !important;
    border: 2px solid #ccff00;
    font-weight: bold;
    border-radius: 0 !important;
    transform: skew(-10deg);
    padding: 2px 8px !important;
    display: inline-block !important;
    margin-bottom: 10px !important;
}

/* 抜粋文 */
.vk_post_excerpt, .media-body_excerpt {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 3 !important;
    overflow: hidden !important;
    font-size: 13px !important;
    color: #666 !important;
    line-height: 1.6 !important;
    margin-top: 5px !important;
    clear: both;
}

/* --- 5. 記事の中身（見出し） --- */
.entry-body h2 {
    background: #1a1a1a;
    color: #ccff00;
    padding: 10px 20px;
    border: none;
    box-shadow: 6px 6px 0px #cccccc;
    transform: skew(-2deg);
    font-weight: 900;
    margin-bottom: 30px;
}
.entry-body h2:before, .entry-body h2:after { display: none; }

.entry-body h3 {
    border-bottom: 3px solid #1a1a1a;
    padding: 10px 0;
    background: transparent;
    position: relative;
    margin-top: 40px;
}
.entry-body h3:before {
    content: '';
    position: absolute;
    bottom: 0; left: 0;
    width: 40%; height: 10px;
    background: #ccff00;
    z-index: -1;
    transform: skew(-20deg);
}

/* --- 6. サイドバー＆ウィジェット（検索窓 修正統合済み） --- */
.widget, .sidebar .widget_block {
    border: 2px solid #1a1a1a;
    background: #fff;
    box-shadow: 4px 4px 0px #bbbbbb;
    padding: 15px;
    margin-bottom: 20px;
}

/* 検索窓の外枠 */
.widget_search .wp-block-search__inside-wrapper {
    display: flex !important;
    flex-wrap: nowrap !important; /* 折り返しを強制禁止 */
    align-items: stretch !important;
    width: 100% !important;
    box-sizing: border-box !important;
    gap: 0 !important;
    border: 3px solid #1a1a1a !important;
    box-shadow: 6px 6px 0px #cccccc !important;
}
/* 入力エリア */
.widget_search .wp-block-search__input {
    border: none !important;
    background: #fff !important;
    border-radius: 0 !important;
    padding: 10px !important;
    flex: 1 1 auto !important; /* 横幅自動調整 */
    width: auto !important;
    margin: 0 !important;
    max-width: none !important;
}
/* 検索ボタン */
.widget_search .wp-block-search__button {
    background-color: #1a1a1a !important;
    color: #ccff00 !important;
    border: none !important;
    border-left: 3px solid #1a1a1a !important;
    padding: 0 15px !important;
    font-weight: 900;
    flex: 0 0 auto !important; /* 幅固定 */
    width: auto !important;
    margin: 0 !important;
    white-space: nowrap !important;
    line-height: 1 !important;
}

/* --- 7. 前へ・次へ --- */
.postNextPrev {
    margin-top: 50px !important;
    gap: 20px !important;
    display: flex !important;
    align-items: flex-start !important;
}
.postNextPrev .postNextPrev_link {
    border: 3px solid #1a1a1a !important;
    box-shadow: 6px 6px 0px #1a1a1a !important;
    background: #fff !important;
    padding: 15px !important;
    width: 48% !important;
    min-height: 0 !important;
    height: auto !important;
    text-decoration: none !important;
    display: flex !important;
    flex-direction: column !important;
}
.postNextPrev .postNextPrev_thumb {
    width: 100% !important;
    height: 150px !important;
    object-fit: cover !important;
    margin: 0 0 10px 0 !important;
    display: block !important;
    border: 1px solid #1a1a1a;
}
.postNextPrev .postNextPrev_label {
    background-color: #1a1a1a;
    color: #ccff00;
    font-size: 11px;
    font-weight: 900;
    padding: 2px 6px;
    transform: skew(-10deg);
    align-self: flex-start;
    margin-bottom: 5px;
}
.postNextPrev .postNextPrev_title {
    font-weight: bold;
    font-size: 14px;
    color: #1a1a1a;
    line-height: 1.4;
}

/* --- スマホ・タブレット調整（767px以下に適用） --- */
@media screen and (max-width: 767px) {
    div.page-header h1, .l-page-header h1 { font-size: 2.2rem !important; }
    
    /* 記事一覧：画像を回り込み解除して上部に配置 */
    .vk_post_imgOuter, .media-img {
        float: none !important;
        width: 100% !important;
        max-width: none !important;
        margin-right: 0 !important;
        margin-bottom: 10px !important;
    }
    
    /* 前へ次へ：縦並び */
    .postNextPrev { flex-direction: column !important; }
    .postNextPrev .postNextPrev_link { width: 100% !important; margin-bottom: 20px !important; }
}
