/*
Theme Name: GeneratePress
Theme URI: https://generatepress.com
Author: Tom Usborne
Author URI: https://generatepress.com/about
Description: GeneratePress is a lightweight WordPress theme built with a focus on speed and usability.
Version: 3.6.1
Actual CSS can be found in /assets/css/ folder.
*/

/* ==========================================================================
   ▼▼▼ 1. サイト全体のダークモード設定 ▼▼▼
   ========================================================================== */

/* 全体の背景と基本文字色 */
body, #page, .site-content {
    background-color: #121212 !important; /* 高級感のある黒 */
    color: #d1d1d1 !important;           /* 柔らかい白 */
}

/* 記事・ウィジェットの枠（カード部分） */
.inside-article, 
.sidebar .widget, 
.comments-area, 
.no-results, 
.paging-navigation,
.custom-404-content,
.custom-404-extra {
    background-color: #1e1e1e !important;
    color: #d1d1d1 !important;
    border: 1px solid #2c2c2c !important;
    border-radius: 8px;
}

/* ヘッダー、ナビゲーション、フッター */
.site-header, 
.main-navigation, 
.site-footer,
.footer-widgets {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #2c2c2c !important;
}

/* 1. 見出しの文字（リンクじゃない部分）は白にする */
h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important;
}

/* 2. 記事タイトルやサイトタイトルのリンクは白のままにする（通常ここが青だと変なので） */
.entry-title a,
.main-title a {
    color: #ffffff !important;
}

/* 3. 見出し（h2など）の中にあるリンクだけは「青色」にする */
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    color: #4da3ff !important; /* 下で設定しているリンク色と同じにする */
    text-decoration: underline; /* リンクだとわかるように下線をつける（お好みで） */
}

/* 4. マウスを乗せたときの色 */
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {
    color: #80bfff !important;
}

/* 境界線やライン */
hr, .entry-content hr {
    border-top: 1px solid #333 !important;
    background-color: transparent !important;
}

.custom-404-extra div, 
.my-related-posts li {
    border-bottom: 1px dashed #333 !important;
}

/* ==========================================================================
   ▼▼▼ 2. ヘッダー・モバイル表示の調整 ▼▼▼
   ========================================================================== */

@media (max-width: 768px) {
    /* ヘッダーの中身を強制的に「縦並び」にする */
    .site-header .inside-header {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
        justify-content: center !important;
    }
    /* ロゴとタイトルの枠リセット */
    .site-branding,
    .site-branding-container {
        float: none !important;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin: 0;
    }
    /* ロゴ画像設定 */
    .site-logo {
        float: none !important;
        margin-right: 0 !important;
        margin-bottom: 10px;
        display: block;
    }
    .site-logo img {
        max-width: 100%;
        height: auto;
        margin: 0 auto;
    }
    /* タイトル文字設定 */
    .main-title {
        float: none !important;
        width: 100%;
        font-size: 20px !important;
        line-height: 1.3;
        white-space: normal;
        margin: 0;
    }
    /* キャッチフレーズ */
    .site-description {
        float: none !important;
        text-align: center;
        margin-top: 5px;
    }
}

/* ヘッダー右端のレイアウト調整 */
.inside-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}