/* ===========================
   layouts - 全站共用樣式
   =========================== */

/* 頁面基礎佈局，使 footer 自動貼底 */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8f9fa;
    margin: 0;
}

/* 頂部導覽列 */
.site-header {
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    padding: 15px 0;
    margin-bottom: 30px;
    border-bottom: 1px solid #eee;
}

/* 導覽列內部排版 */
.header-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* 網站 Logo 樣式 */
.site-logo {
    font-size: 1.5em;
    font-weight: 700;
    color: #333;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 8px;
}

.site-logo:hover {
    text-decoration: none;
    color: #0056b3;
}

/* Logo 連結鍵盤聚焦指示 (WCAG 2.4.7 Focus Visible) */
.site-logo:focus-visible {
    outline: 2px solid #1e293b;
    outline-offset: 2px;
    border-radius: 4px;
}

/* 頁尾區塊 */
.site-footer {
    background-color: #343a40;
    color: #adb5bd;
    padding: 40px 0;
    margin-top: auto;
}

/* 主要內容區域，撐滿剩餘空間 */
.main-wrapper {
    flex: 1;
    width: 100%;
}

/* 頁尾連結樣式，確保對比度與聚焦可見 (WCAG 1.4.3 / 2.4.7) */
.site-footer a {
    color: #dee2e6; /* 淺灰白文字，與 #343a40 背景對比度約 9.5:1 */
    text-decoration: underline;
}

.site-footer a:hover {
    color: #fff;
}

.site-footer a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
    border-radius: 2px;
}

/* ===========================
   Cookie 同意橫幅
   =========================== */

/* 橫幅固定於頁面底部，確保使用者進入頁面時能立即看見 */
.cookie-consent {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #1e293b;
    color: #e2e8f0;
    padding: 20px 0;
    z-index: 9999;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.15);
}

/* 內部排版：左側文字、右側按鈕 */
.cookie-consent-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

/* 說明文字區塊佔據剩餘空間 */
.cookie-consent-text {
    flex: 1;
}

/* 標題文字樣式 */
.cookie-consent-title {
    font-size: 1.05em;
    font-weight: 700;
    margin-bottom: 6px;
    color: #fff;
}

/* Cookie 圖示與標題文字間距 */
.cookie-consent-title i {
    margin-right: 6px;
    color: #fbbf24;
}

/* 說明段落文字樣式 */
.cookie-consent-desc {
    font-size: 0.875em;
    line-height: 1.6;
    margin-bottom: 0;
    color: #cbd5e1;
}

/* 隱私權政策連結樣式，確保對比度符合 WCAG 1.4.3 */
.cookie-consent-desc a {
    color: #93c5fd;
    text-decoration: underline;
}

.cookie-consent-desc a:hover {
    color: #bfdbfe;
}

/* 隱私權政策連結鍵盤聚焦指示 (WCAG 2.4.7) */
.cookie-consent-desc a:focus-visible {
    outline: 2px solid #93c5fd;
    outline-offset: 2px;
    border-radius: 2px;
}

/* 按鈕容器，兩顆按鈕並排 */
.cookie-consent-actions {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

/* 按鈕共用樣式 */
.cookie-consent-btn {
    white-space: nowrap;
    font-size: 0.875em;
    padding: 8px 20px;
    border-radius: 6px;
}

/* 「僅接受必要」按鈕邊框色彩 */
.cookie-consent-btn.btn-outline-secondary {
    border-color: #94a3b8;
    color: #e2e8f0;
}

.cookie-consent-btn.btn-outline-secondary:hover {
    background-color: #334155;
    border-color: #cbd5e1;
    color: #fff;
}

/* 按鈕鍵盤聚焦指示 (WCAG 2.4.7) */
.cookie-consent-btn:focus-visible {
    outline: 2px solid #93c5fd;
    outline-offset: 2px;
}

/* 小螢幕裝置：改為垂直堆疊排列 */
@media (max-width: 768px) {
    .cookie-consent-inner {
        flex-direction: column;
        text-align: center;
    }

    .cookie-consent-actions {
        width: 100%;
        flex-direction: column;
    }

    .cookie-consent-btn {
        width: 100%;
    }
}

/* Windows 高對比模式支援 - 全站共用元件 */
@media (forced-colors: active) {
    .site-logo:focus-visible {
        outline-color: Highlight;
    }

    /* 高對比模式下 Cookie 橫幅按鈕邊框可見 */
    .cookie-consent-btn:focus-visible {
        outline-color: Highlight;
    }
}

.adsbygoogle {
    display:block;
    text-align:center;
}