/* style.css の内容 */

/* サイト全体で使用する色（CSS変数）を定義 */
:root {
    /* 1. アクションカラー (ボタン、リンク) */
    --color-primary: #007bff;     /* メインアクション色 */
    --color-secondary: #0056b3;  /* ホバー色/強調色 */
    
    /* 2. 背景と文字の色 */
    --color-background-main: #f4f7f6; /* bodyの背景色 */
    --color-background-container: #ffffff; /* コンテナ（フォーム）の背景色 */
    --color-text-main: #333;      /* メインの文字色 */
    --color-text-secondary: #555; /* ラベルやサブテキストの色 */

    /* 3. ボーダーとシャドウの色 */
    --color-border-main: #ccc;     /* 標準の入力欄ボーダー色 */
    --color-shadow: rgba(0,0,0,0.1); /* コンテナのシャドウ色 */

    /* 4. ステータス色 */
    --color-status-success-bg: #d4edda; /* 成功メッセージの背景色 */
    --color-status-success-text: #155724; /* 成功メッセージの文字色 */
    --color-status-info-bg: #fff3cd;    /* 情報/警告メッセージの背景色 */
    --color-status-info-text: #856404; /* 情報/警告メッセージの文字色 */
    --color-status-fail-bg: #f8d7da; /* 失敗メッセージの背景色 (未定義なら追加) */
    --color-status-fail-text: #721c24; /* 失敗メッセージの文字色 (未定義なら追加) */
}

/* 共通の基本スタイル */
body { 
    font-family: sans-serif; 
    background-color: var(--color-background-main); 
    margin: 0; 
}

/* フォームの共通要素に適用 */
.container { 
    background-color: var(--color-background-container); 
    box-shadow: 0 4px 8px var(--color-shadow); /* シャドウに適用 */
}
h2 { 
    color: var(--color-primary); 
    border-left-color: var(--color-primary); 
} 
.card h3 { 
    color: var(--color-primary); 
    border-bottom-color:var(--color-primary); 
} 

/* フォーム部品の罫線に適用 */
input[type="file"], input[type="text"], input[type="password"], input[type="number"], input[type="datetime-local"] {
    border: 1px solid var(--color-border-main); /* 罫線に適用 */
    color: var(--color-text-main);
}

/* ボタンに適用 */
button {
    background-color: var(--color-primary); /* ボタンの色に適用 */
    color: white; 
}
button:hover { 
    background-color: var(--color-secondary); /* ホバー色に適用 */
}
.download-button, .password-form button { 
    background-color: var(--color-primary); /* ボタンの色に適用 */
    color: white; 
}
    .download-button:hover, .password-form button:hover { 
    background-color: var(--color-secondary); /* ホバー色に適用 */
}
    .user-form button { 
    background-color: var(--color-primary); /* ボタンの色に適用 */
    color: white; 
}

/* メッセージに適用 */
.success-message { 
    background-color: var(--color-status-success-bg); 
    color: var(--color-status-success-text); 
    border: 1px solid var(--color-status-success-bg); 
}
.storage-info { 
    background-color: var(--color-status-info-bg); 
    color: var(--color-status-info-text); 
    border: 1px solid var(--color-status-info-bg); 
}


/* ... admin/index.php のテーブル罫線など、必要な要素をここに追加 ... */	