/*
Theme Name: Lightning Child Theme (Custom)
Template: lightning
Description: Lightningテーマのカスタム小テーマです。
Author: あなたの名前
Version: 1.0.0
*/

/* 親テーマのスタイルを読み込むための記述 */
/* functions.php で読み込んでいるため、@import は不要です */


/* =========================================
   カスタム配色
   メインカラー: #315A97 (濃い青)
   サブカラー: #449A8D (青緑)
   メイン文字色: #252F52 (濃い紺色)
   ========================================= */

/* --- 基本設定 --- */
body {
    background-color: #F8F8F8; /* 全体の背景色: やや明るいグレー */
    color: #252F52;             /* 基本のテキスト色: 新しい濃い紺色 */
}

/* --- リンク --- */
a {
    color: #315A97; /* 通常のリンク色 (新しいメインカラー) */
    text-decoration: none; /* 下線をなくす */
}

a:hover,
a:focus {
    color: #449A8D; /* ホバー時のリンク色 (新しいサブカラー) */
    text-decoration: underline; /* ホバー時に下線を表示 */
}

/* --- ボタン --- */
/* プライマリーボタン (主要なアクションボタン) */
.btn-primary,
.wp-block-button__link { /* Gutenbergのボタンブロックも含む */
    background-color: #315A97; /* 背景色 (新しいメインカラー) */
    border-color: #315A97;     /* 枠線の色 */
    color: #FFFFFF !important; /* 文字色を白に（強制） */
    transition: background-color 0.3s ease, border-color 0.3s ease; /* ホバーアニメーション */
}

.btn-primary:hover,
.wp-block-button__link:hover {
    background-color: #449A8D; /* ホバー時の背景色 (新しいサブカラー) */
    border-color: #449A8D;     /* ホバー時の枠線の色 */
}


/* --- 見出し --- */
/* 一般的な見出しの色（基本の文字色を使用） */
h1, h2, h3, h4, h5, h6 {
    color: #252F52; /* 新しいメインの文字色 */
}

/* 特定の見出しを強調したい場合 (例: ページタイトルなど) */
.entry-title { /* 投稿・固定ページのタイトル */
    color: #315A97; /* 新しいメインカラー */
}


/* --- ヘッダー・フッターの調整 --- */

/* 投稿・固定ページヘッダーの調整 */
/* ブラウザの開発者ツールで正しいセレクタを確認してください。
   もし .entry-header で適用されない場合、.page-header や .post-header などをお試しください。 */
.entry-header { /* 投稿ページのヘッダー部分 */
    background-color: #315A97; /* メインカラーの濃い青に設定 */
    color: #FFFFFF;            /* 文字色を白に */
    padding: 20px;              /* 必要に応じてパディングを追加 */
}

.entry-header .entry-title { /* ヘッダー内のタイトル */
    color: #FFFFFF; /* タイトル文字色も白に設定 */
}

/* もし投稿メタ情報（日付、著者など）がある場合 */
.entry-header .entry-meta {
    color: #DDDDDD; /* 少し薄めの白にして、タイトルと区別をつける */
}

/* フッターのカスタム配色 */
.site-footer {
    background-color: #555555; /* フッター背景を少し濃いめのグレーに */
    color: #FFFFFF; /* フッターの文字色は白に */
}

.site-footer a {
    color: #FFFFFF !important; /* フッター内のリンク色を強制的に白に変更 */
}

.site-footer a:hover {
    color: #FFFFFF !important; /* ホバー時のリンク色も強制的に白に変更 */
}


/* --- その他、必要に応じて調整する要素 --- */

/* 例: フォームの入力欄の枠線 */
input[type="text"],
input[type="email"],
input[type="password"],
textarea {
    border-color: #CCCCCC; /* やや薄めのグレー */
    border-radius: 4px; /* 角を少し丸くする */
    padding: 8px;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus {
    border-color: #315A97; /* フォーカス時に新しいメインカラー */
    box-shadow: 0 0 5px rgba(49, 90, 151, 0.5); /* メインカラーの影 */
    outline: none; /* デフォルトのアウトラインを消す */
}

/* WordPress標準のブロックエディタ（Gutenberg）の調整 */
.has-main-color-background-color { /* カスタムカラーパレットで設定した場合の背景色 */
    background-color: #315A97;
    color: #FFFFFF; /* 背景が濃い場合は文字色を白に */
}
.has-accent-color-background-color {
    background-color: #449A8D;
    color: #FFFFFF;
}
.has-text-color-color {
    color: #252F52;
}
.has-main-color-color {
    color: #315A97;
}
.has-accent-color-color {
    color: #449A8D;
}

/* ============================
   固定ページタイトルのみのカスタムカラー
=============================== */
body.page .entry-header {
    background-color: #E6E6E6 !important;
    color: #315A97 !important;
    padding: 20px !important;
}

body.page .entry-header .entry-title {
    color: #315A97 !important;
}

body.page .entry-header .entry-meta {
    color: #666666 !important;
}
