/**

 * Kashiwazaki SEO Poll Front-end Styles

 *

 * @package KashiwazakiPoll

 * @version 1.0.9

 */



/* front.css: アンケートのフロント表示用スタイル */



/* コンテナ */

.kashiwazaki-poll-block { border: 1px solid #ccc; padding: 1em; margin: 1em 0; background: #fafafa; position: relative; }



/* 見出し */

.kashiwazaki-poll-block h2, .kashiwazaki-poll-block h3 { margin-top: 0; margin-bottom: 0.8em; color: #333; line-height: 1.4; }



/* ▼▼▼ 「集計データを見る」ボタン用ラッパー ▼▼▼ */

.kashiwazaki-poll-view-result-trigger-area {

    margin-bottom: 1em; /* 結果コンテナとの間に少しマージン */

    /* 必要に応じて text-align など追加 */

}



/* プレビューグラフ用コンテナ */

.kashiwazaki-poll-preview-container { height: 100px; overflow: hidden; opacity: 0.5; margin-bottom: 1em; /* 投票フォームとの間にマージン */ margin-top: 1em; position: relative; transition: opacity 0.3s ease-in-out; display: none; }

.kashiwazaki-poll-preview-container .kashiwazaki-poll-chart-container { width: 100%; height: 200px; max-width: 200px; margin: 0 auto; position: relative; top: -15px; }

.kashiwazaki-poll-preview-container .kashiwazaki-poll-chart-container canvas { }



/* フル表示のグラフコンテナ (結果表示用) */

.kashiwazaki-poll-result-container { margin-top: 0; /* 上のマージン削除 (ボタンラッパーが持つ) */ display: none; min-height: 50px; }

/* フル表示のChart.jsラッパーコンテナ */

.kashiwazaki-poll-result-container .kashiwazaki-poll-chart-container {

    max-width: 450px;

    height: 600px; /* 十分な高さを確保 */

    margin: 1em auto;

    clear: both;

    position: relative;

}

@media (max-width: 768px) {

    .kashiwazaki-poll-result-container .kashiwazaki-poll-chart-container {

        max-width: 90%;

        height: 550px;

    }

}

@media (max-width: 480px) {

    .kashiwazaki-poll-result-container .kashiwazaki-poll-chart-container {

        max-width: 95%;

        height: 520px;

    }

}

.kashiwazaki-poll-result-container .kashiwazaki-poll-chart-container canvas { }





/* 投票フォーム */

.kashiwazaki-poll-form { margin-top: 1em; /* プレビューや結果ボタンとの間にマージン */ }

.kashiwazaki-poll-form div { margin-bottom: 0.5em; line-height: 1.5; }

.kashiwazaki-poll-form label { cursor: pointer; display: inline-flex; align-items: center; }

.kashiwazaki-poll-form input[type="checkbox"], .kashiwazaki-poll-form input[type="radio"] { margin-right: 0.5em; }

.kashiwazaki-poll-form-disabled label { cursor: default; opacity: 0.7; color: #555; }

.kashiwazaki-poll-form-disabled input[type="checkbox"], .kashiwazaki-poll-form-disabled input[type="radio"] { cursor: default; opacity: 0.7; }





/* 投票するボタン */

.kashiwazaki-poll-submit {

    display: inline-block;

    margin-top: 0.5em;

    /* margin-right は不要に */

    margin-bottom: 10px;

    padding: 0.5em 1.2em;

    cursor: pointer;

    border: 1px solid #0073aa;

    background-color: #0085ba; /* プライマリボタンの色 */

    color: #fff !important;

    text-decoration: none;

    border-radius: 3px;

    transition: background-color 0.1s ease-in-out;

    vertical-align: middle;

    line-height: 1.5;

}

.kashiwazaki-poll-submit:hover {

    background-color: #0073aa;

    color: #fff !important;

}

.kashiwazaki-poll-submit:disabled {

    background-color: #cccccc;

    border-color: #aaaaaa;

    cursor: not-allowed;

    opacity: 0.7;

}



/* 集計データを見るボタン (リンク風、位置変更に伴いマージン調整の可能性あり) */

.kashiwazaki-poll-view-result {

    display: inline-block;

    /* margin-top はラッパーが担当 */

    /* margin-bottom はラッパーが担当 */

    padding: 0.3em 0; /* 上下のpadding少し調整 */

    cursor: pointer;

    border: none; /* ボーダーなし */

    background-color: transparent; /* 背景透明 */

    color: #0073aa !important; /* リンク色 */

    text-decoration: underline; /* 下線 */

    border-radius: 0;

    transition: color 0.1s ease-in-out;

    vertical-align: middle;

    line-height: 1.5;

    font-size: 0.9em;

}

.kashiwazaki-poll-view-result:hover {

    color: #005177 !important; /* ホバー時の色 */

    text-decoration: none;

}



/* その他のボタン (変更なし) */

.kashiwazaki-poll-download-btn {

    display: inline-block;

    padding: 4px 10px;

    font-size: 0.85em;

    background-color: #5cb85c;

    color: #ffffff !important;

    border: 1px solid #4cae4c;

    text-decoration: none;

    border-radius: 3px;

    cursor: pointer;

    margin-right: 10px;

    margin-bottom: 10px;

    vertical-align: middle;

    line-height: 1.5;

}

.kashiwazaki-poll-download-btn:hover {

    background-color: #449d44;

    color: #ffffff !important;

}

.kashiwazaki-poll-back-to-vote {

    display: inline-block;

    padding: 4px 10px;

    font-size: 0.85em;

    cursor: pointer;

    border: 1px solid #c9302c;

    background-color: #d9534f;

    color: #ffffff !important;

    text-decoration: none;

    border-radius: 3px;

    margin-bottom: 10px;

    vertical-align: middle;

    line-height: 1.5;

}

.kashiwazaki-poll-back-to-vote:hover {

    background-color: #c9302c;

    color: #ffffff !important;

}





/* 投票済みメッセージ */

.voted-msg { font-weight: bold; color: #4CAF50; background-color: #e8f5e9; border: 1px solid #c8e6c9; padding: 0.8em 1em; margin: 1em 0 0.5em 0; border-radius: 3px; }



/* 合計票数 */

.poll-total { text-align: center; margin-top: 1em; font-size: 0.9em; color: #555; clear: both; padding-top: 10px; }



/* 結果コンテナ内の回り込み解除 */

.kashiwazaki-poll-result-container::after { content: ""; display: table; clear: both; }