/* DDDP会議表示プログラム スタイルシート */
/* 仕様書準拠：グローバルステート駆動アーキテクチャ対応 */

body {
    font-family: Arial, sans-serif;
    font-size: 12pt;
    color: #000000;
    padding: 0px;
    margin: 0px;
    max-width: 1000px;
    min-width: 350px;
    background-color: white;
}

/* 全体コンテナ */
#root {
    width: 100%;
    margin: 0px;
    padding: 0px;
}

/* タイトル画面（2行6列グリッド）*/
.title-screen {
    display: grid;
    grid-template-columns: auto auto auto auto auto auto;
    grid-template-rows: auto auto;
    width: 100%;
    margin: 0px;
    padding: 2px;
    border: 1px solid black;
    font-size: 12pt;
}

.title-cell {
    border: 1px solid black;
    padding: 2px;
    text-align: center;
    word-wrap: break-word;
    min-width: 50px;
}

/* メニュー画面共通スタイル */
.menu-container {
    display: flex;
    margin: 0px;
    padding: 2px;
    font-size: 12pt;
}

/* お気に入りメニューボタン */
.favorite-button {
    padding: 1px;
    border: 1px solid black;
    margin: 2px;
    width: 25px;
    font-size: 12pt;
    background-color: white;
    text-align: left;
}

.favorite-button.home {
    background-color: mediumseagreen;
}

.favorite-button.github {
    background-color: mediumseagreen;
}

.favorite-button.archive {
    background-color: orangered;
}

.favorite-button.mode-active {
    background-color: khaki;
}

.favorite-button.disabled {
    background-color: gray;
}

/* お気に入りボタン7,8,9に二重線の枠 */
.favorite-button:nth-child(10),
.favorite-button:nth-child(11), 
.favorite-button:nth-child(12) {
    border-style: double;
    border-width: 4px;
}

/* メニュー画面2 スタイル */
.menu-text {
    margin: 2px;
    padding: 1px;
    font-size: 12pt;
    color: #000000;
    text-align: right;
    display: inline-block;
}

.menu-text:nth-child(1) {
    width: 70px; /* 'Source:' */
}

.menu-text:nth-child(3) {
    width: 120px; /* 'Archive Year:' */
}

.src-select {
    width: 100px;
    margin: 2px;
    font-size: 12pt;
    color: #000000;
    padding: 1px;
    border: 1px solid black;
    text-align: left;
}

.year-select {
    width: 100px;
    margin: 2px;
    font-size: 12pt;
    color: #000000;
    padding: 1px;
    border: 1px solid black;
    text-align: left;
}

.database-button {
    width: 120px;
    margin: 2px;
    padding: 1px;
    border: 1px solid black;
    font-size: 12pt;
    color: #000000;
    text-align: center;
    background-color: white;
    cursor: pointer;
}

.database-button.active {
    background-color: khaki;
}

/* ファイルメニューボタン */
.file-button {
    padding: 1px;
    border: 1px solid black;
    margin: 2px;
    width: 15%;
    font-size: 12pt;
    text-align: left;
}

.file-button.active {
    background-color: khaki;
}

.link-button {
    background-color: silver;
}

/* データ表示画面テーブル */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 0px;
    padding: 0px;
    font-size: 12pt;
}

td, th {
    border: 1px solid black;
    text-align: left;
    min-width: 15px;
    padding: 2px;
    white-space: pre-wrap;
    vertical-align: top;
}

/* データ表示画面セルボタン */
.cell-button {
    width: 100%;
    display: block;
    background-color: lightblue;
    border: none;
    padding: 0px;
    margin: 0px;
    text-align: left;
    font-size: 12pt;
}

.cell-button:hover {
    background-color: lightblue;
}

/* 特定のコラム幅設定 */
td[data-column="ReferenceName"] {
    width: 100px;
}

td[data-column="Date"] {
    width: 150px;
}

/* データ表示エリア */
.data-display {
    height: 1200px;
    overflow-y: auto;
    margin: 0px;
    padding: 0px;
}

/* コードブロック */
td code {
    white-space: pre-wrap;
    font-family: monospace;
    background-color: #f5f5f5;
    padding: 1px;
}

/* fi.csv用画像表示 */
.fi-image-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

.fi-image {
    width: 100px;
    height: 70px;
    flex-shrink: 0;
    object-fit: cover;
    border: 1px solid #ccc;
}

.fi-filename {
    font-size: 12pt;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
}

/* エラー表示 */
.error-message {
    color: red;
    font-weight: bold;
}

/* ハイライト表示 */
.highlight {
    background-color: yellow;
}

/* page="p3"のfa.csvファイル専用スタイル */
table.p3-fa-csv {
    border: 2px solid black;
}

/* page="p3"のfa.csvファイルでは基本罫線をオフ */
table.p3-fa-csv td, 
table.p3-fa-csv th {
    border: none;
}

.p3-header-row td {
    border: 1px solid black;
}

.p3-content-row {
    border-top: 2px solid black;
}

table.p3-fa-csv .p3-column7 {
    border-left: 2px solid black;
    border-right: 2px solid black;
}

/* 非表示クラス */
.hidden {
    display: none;
}

/* レスポンシブ対応 */
@media (max-width: 600px) {
    .title-screen {
        font-size: 10pt;
    }
    
    .file-button {
        width: 20%;
    }
    
    .favorite-button {
        width: 20px;
    }
}