/*
Theme Name: LorenzNotes V1
Theme URI: https://lorenznotes.jp
Author: Lorenz Notes
Description: LorenzNotes V1 Theme
Version: 1.0.0
*/

/* 読み込まれているか確認用（反映されたら消してください） */
body {
    background: #f0f0f0; 
}

/* =========================================
   LorenzNotes Color Overrides (Strong Version)
   ========================================= */

/* 優先順位を上げるため、セレクタを羅列しています */
:root, [data-bs-theme="light"], body {
    /* 1. メインカラー（信頼のネイビー） */
    --si-primary: #1B3C73 !important;
    
    /* 2. 透明度計算用RGB値 (27, 60, 115) */
    --si-primary-rgb: 27, 60, 115 !important;

    /* 3. リンクのホバー色 */
    --si-link-hover-color: #2b5294 !important;
    
    /* 4. bodyの文字色（ダークグレー） */
    --si-body-color: #4a4a4a !important;
}

/* プライマリーボタンの文字色を白に強制 */
.btn-primary {
    --si-btn-color: #ffffff !important;
    --si-btn-hover-color: #ffffff !important;
    --si-btn-active-color: #ffffff !important;
    
    /* 背景色も念のため直接指定 */
    background-color: #1B3C73 !important;
    border-color: #1B3C73 !important;
}

/* アウトラインボタンの調整 */
.btn-outline-primary {
    --si-btn-color: #1B3C73 !important;
    --si-btn-border-color: #1B3C73 !important;
    --si-btn-hover-bg: #1B3C73 !important;
    --si-btn-hover-border-color: #1B3C73 !important;
    color: #1B3C73 !important;
    border-color: #1B3C73 !important;
}

/* 紫のチェックマーク（text-primary）を強制的にネイビーにする */
.text-primary {
    color: #1B3C73 !important;
}

/* リンクボタン（Read moreなど）もネイビーに統一 */
.btn-link {
    color: #1B3C73 !important;
}

/* ホバーした時（マウスを乗せた時）は少し明るいネイビーに */
.btn-link:hover {
    color: #2b5294 !important;
}

/* =========================================
   タブ切り替え（Nav Tabs）のプロ化
   ========================================= */

/* =========================================
   タブ切り替えの改善（見やすくする）
   ========================================= */

/* 1. タブ全体の背景（座布団）を作る */
.nav-tabs {
    border-bottom: none !important; /* 既存の下線を消す */
    background-color: #e9ebf0 !important; /* 濃いめのグレー背景を敷く */
    padding: 6px !important;
    border-radius: 8px !important;
    gap: 8px; /* ボタン同士に隙間を空ける */
    display: flex;
    flex-wrap: wrap; 
}

.nav-tabs .nav-item {
    margin-bottom: 0 !important; /* 余計なマージン削除 */
}

/* 2. タブ単体（未選択）のデザイン */
.nav-tabs .nav-link {
    border: none !important; /* 枠線を消す */
    border-radius: 6px !important; /* 角を少し丸く */
    margin-bottom: 0 !important;
    color: #64748b !important; /* 文字は落ち着いたグレー */
    font-weight: 600 !important;
    padding: 10px 24px !important; /* 広めにクリックしやすく */
    background-color: transparent !important;
    transition: all 0.2s ease;
}

/* 3. ホバーした時 */
.nav-tabs .nav-link:hover {
    color: #1B3C73 !important;
    background-color: rgba(255, 255, 255, 0.5) !important; /* うっすら白く */
}

/* 4. 選択中（ここを劇的に変える） */
.nav-tabs .nav-link.active {
    background-color: #ffffff !important; /* 背景を「真っ白」にして浮き立たせる */
    color: #1B3C73 !important; /* 文字は「濃紺」 */
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important; /* 影をつけて立体感を出す（紫の影もここで消えます） */
    font-weight: 700 !important;
    border-bottom: none !important; /* 下線を消す */
}

/* 5. アイコンの色 */
.nav-tabs .nav-link i {
    font-size: 1.1em;
    vertical-align: middle;
    margin-bottom: 2px;
    opacity: 0.7;
}

.nav-tabs .nav-link.active i {
    color: #1B3C73 !important;
    opacity: 1 !important;
}