/**
 * Keirin Event Suite - Theme Override
 * Version: 1.8.1
 * DESCRIPTION: Applies dark theme to race/tt info pages.
 */

/* =================================================================
 * 1. Base Plugin Wrapper
 * ================================================================= */

body #kes-plugin-wrapper {
    background-color: #121212; /* Enforce dark background */
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
    font-size: 16px;
    line-height: 1.6;
}

/* =================================================================
 * 1.5. Common Navigation (NEW)
 * ================================================================= */
.kes-common-nav {
    background: rgba(255,255,255,0.05);
    border-bottom: 1px solid rgba(255,255,255,0.1);
    margin-bottom: 20px;
}
.kes-common-nav__list {
    display: flex;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0;
}
.kes-common-nav__link {
    display: block;
    padding: 14px 20px;
    color: #adb5bd;
    text-decoration: none;
    font-weight: 600;
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease;
}
.kes-common-nav__link:hover {
    color: #fff;
    background: rgba(255,255,255,0.05);
}
.kes-common-nav__link.is-active {
    color: #fff;
    border-bottom-color: #00aaff;
}

/* =================================================================
 * 2. Content Styling (Race/TT Info) - DARK THEME
 * ================================================================= */

/* The wrapper for a block of race/tt content, now with glass-morphism */
.kes-content-container,
.kes-race-program-container,
.kes-tt-results-container,
[id^="kes-race-program-container-"],
[id^="kes-tt-results-container-"] {
    background: var(--kes-glass-bg, rgba(22, 22, 22, 0.75));
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--kes-glass-border, rgba(255, 255, 255, 0.1));
    color: #e0e0e0;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.kes-race-day-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.kes-day-tab-btn {
    background-color: rgba(255, 255, 255, 0.1);
    color: #e0e0e0;
    border: 1px solid rgba(255, 255, 255, 0.2);
    padding: 8px 16px;
    border-radius: 20px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.kes-day-tab-btn:hover { 
    background-color: rgba(255, 255, 255, 0.2);
    color: #fff;
}

.kes-day-tab-btn.is-active {
    background-color: #00aaff;
    color: #fff;
    border-color: #00aaff;
}

.kes-race-selector-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 20px;
}

.kes-race-btn {
    background-color: transparent;
    color: #e0e0e0;
    border: 1px solid rgba(255, 255, 255, 0.3);
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 0.8rem;
    cursor: pointer;
    transition: all 0.3s ease;
}

.kes-race-btn:hover {
    background-color: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.5);
}

.kes-race-btn.is-active {
    background-color: rgba(255, 255, 255, 0.2);
    color: #fff;
    font-weight: bold;
}

.kes-race-header {
    text-align: center;
    margin-bottom: 20px;
}

.kes-race-title {
    font-size: 1.3rem;
    font-weight: 700;
    color: #fff;
    margin: 0 0 5px 0;
}

.kes-race-number { color: #00aaff; }
.kes-race-time { color: #adb5bd; font-size: 0.9rem; }

.kes-race-wrapper {
    margin-bottom: 24px;
}

@media screen and (min-width: 992px) {
    .kes-race-body {
        display: grid;
        grid-template-columns: 1fr 1fr; /* 2カラム */
        grid-template-areas:
            'entry entry'
            'video video'
            'result payout';
        gap: 16px;
    }

    .kes-race-section-card.section-video {
        justify-self: center; /* カード自体を中央寄せ */
        width: 66.6667%;      /* 全体の約3分の2幅 */
        max-width: none;
    }
}

.kes-race-section-card {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 16px;
}

.kes-race-section-card.section-entry {
    grid-area: entry;
    justify-self: center; /* カード自体を中央寄せ */
    width: 66.6667%;      /* 全体の約3分の2幅 */
    max-width: none;
}
.kes-race-section-card.section-result { grid-area: result; }
.kes-race-section-card.section-payout { grid-area: payout; }
.kes-race-section-card.section-video {
    grid-area: video;
}

.kes-race-section-card h2 {
    font-size: 1.0rem;
    color: #e0e0e0;
    margin-top: 0;
    margin-bottom: 15px;
    padding-bottom: 8px;
    border-bottom: 2px solid #00aaff;
    display: inline-block;
}

/* =================================================================
 * 3. Table Styles - DARK THEME
 * ================================================================= */

.kes-race-table,
.kes-payout-table,
.kes-tt-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.kes-race-table th, .kes-race-table td,
.kes-payout-table th, .kes-payout-table td,
.kes-tt-table th, .kes-tt-table td {
    padding: 8px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    font-size: 0.85rem;
    text-align: left;
    vertical-align: middle;
    word-break: normal;
    overflow-wrap: anywhere;
    color: #e0e0e0;
}

/* 出走表: 車番列を狭く・折返しなしに */
.kes-entry-table th:first-child,
.kes-entry-table td:first-child {
    width: 3.5rem;
    text-align: center;
    white-space: nowrap;
}

/* 結果テーブルの列幅をパーセンテージで柔軟に調整 */
.kes-result-table th:nth-child(1), .kes-result-table td:nth-child(1) { width: 10%; text-align: center; } /* 着順 */
.kes-result-table th:nth-child(2), .kes-result-table td:nth-child(2) { width: 10%; text-align: center; } /* 車番 */
.kes-result-table th:nth-child(3), .kes-result-table td:nth-child(3) { width: 40%; }                      /* 選手名 */
.kes-result-table th:nth-child(4), .kes-result-table td:nth-child(4) { width: 15%; text-align: center; } /* 上がり */
.kes-result-table th:nth-child(5), .kes-result-table td:nth-child(5) { width: 25%; white-space: nowrap; } /* 着差 */

/* 既存のスタイルを維持・調整 */
.kes-result-table th:first-child,
.kes-result-table td:first-child,
.kes-result-table th:nth-child(2),
.kes-result-table td:nth-child(2) {
    white-space: nowrap;
}
.kes-result-table td:nth-child(5) {
    font-size: 0.8rem; /* PC表示ではフォントサイズを少し戻す */
}

/* 払戻金: 数字系は折返し防止 */
.kes-payout-table td {
    white-space: nowrap;
}

.kes-race-table th {
    background: none;
    color: #adb5bd;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.kes-rider-num {
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    border-radius: 50%;
    color: #fff;
    font-weight: bold;
    font-size: 0.75rem;
    box-sizing: border-box;
}
.kes-rider-num.color-1 { background-color: #ffffff; color: #000; border: 1px solid #ccc; }
.kes-rider-num.color-2 { background-color: #000000; }
.kes-rider-num.color-3 { background-color: #ff0000; }
.kes-rider-num.color-4 { background-color: #0000ff; }
.kes-rider-num.color-5 { background-color: #ffc107; color: #000; border: 1px solid #999; }
.kes-rider-num.color-6 { background-color: #008000; }

.kes-race-narabi {
    background: rgba(0,0,0,0.2);
    border: 1px solid rgba(255,255,255,0.1);
    color: #e0e0e0;
    padding: 12px;
    border-radius: 8px;
    margin-bottom: 15px;
}

/* =================================================================
 * 4. Light Card Style Overrides
 * ================================================================= */

/* レース情報カードの背景を白に変更し、それに伴う文字色等を調整 */
.kes-race-section-card {
    background: #ffffff;
    border: 1px solid #e9ecef;
    box-shadow: 0 2px 4px rgba(0,0,0,0.04);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* カード内の見出し(h2)の文字色を暗くする */
.kes-race-section-card h2 {
    color: #343a40;
    border-bottom-color: #00aaff; /* Accent color for consistency */
}

/* カード内のテーブルの文字色と罫線を調整 */
.kes-race-section-card .kes-race-table th,
.kes-race-section-card .kes-race-table td,
.kes-race-section-card .kes-payout-table th,
.kes-race-section-card .kes-payout-table td,
.kes-race-section-card .kes-tt-table th,
.kes-race-section-card .kes-tt-table td {
    color: #212529;
    border-bottom: 1px solid #dee2e6;
}

.kes-race-section-card .kes-race-table th {
    color: #6c757d;
    border-top: 1px solid #dee2e6;
}

/* 払戻金テーブルの文字色を再調整 */
.kes-race-section-card .kes-payout-table th {
    color: #212529;
}
.kes-race-section-card .kes-payout-table td:last-child {
    color: #c0392b; /* 払戻金は目立つように赤系 */
    font-weight: bold;
}

/* =================================================================
 * 5. TT Results Width and Style Adjustment
 * ================================================================= */

.kes-tt-results-container {
    width: 66.6667%;
    margin-left: auto;
    margin-right: auto;
    /* Remove the dark frame to let the inner white card show through */
    background: transparent;
    border: none;
    padding: 0;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* TTテーブルにリッチなデザインを適用 */
.kes-tt-results-container .kes-tt-table th {
    background-color: #f8f9fa; /* ヘッダー背景色 */
}

.kes-tt-results-container .kes-tt-table tbody tr:nth-of-type(odd) {
    background-color: rgba(0,0,0,0.02); /* 奇数行に背景色 */
}

.kes-tt-results-container .kes-tt-table tbody tr:hover {
    background-color: rgba(0,0,0,0.06); /* ホバーエフェクト */
}

/* =================================================================
 * 6. Start Order (Narabi) Style Adjustment
 * ================================================================= */

/* 出走表カード内のスタート順のスタイルを調整 */
.kes-race-section-card .kes-race-narabi {
    background-color: #f8f9fa; /* Light gray background */
    border: 1px solid #dee2e6;
    color: #495057; /* Darker text color */
}

.kes-race-section-card .kes-race-narabi strong {
    color: #212529; /* Even darker for the label */
    font-weight: 600;
}

/* =================================================================
 * 7. Sidebar Racer List Style Adjustment (Modern/Light-Glass)
 * ================================================================= */

/* サイドバーの選手一覧をモダンなライト・グラスモーフィズムデザインに */
.kes-sidebar .kes-racer-list {
    background: rgba(255, 255, 255, 0.8); /* 半透明の白 */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    border-radius: 16px; /* from dark-theme.css, ensure it's here */
}

/* タイトルの文字色 */
.kes-sidebar .kes-racer-list .kes-section-title {
    color: #343a40;
    border-bottom-color: rgba(0,0,0,0.1);
}

/* リストアイテムのホバー色 */
.kes-sidebar .kes-racer-list .kes-racer-item:hover {
    background-color: rgba(0, 0, 0, 0.04);
}

/* 番号の文字色 */
.kes-sidebar .kes-racer-list .kes-racer-number {
    color: #6c757d;
}

/* 選手名の文字色 */
.kes-sidebar .kes-racer-list .kes-racer-name {
    color: #212529;
}

/* 詳細(府県)の文字色 */
.kes-sidebar .kes-racer-list .kes-racer-details {
    color: #495057;
}