/*
 * UR-CMS 共用品牌樣式（單一來源）。
 * 前台行銷頁、後台管理、會員專區與登入後上手頁都載入這支，
 * 之後要改品牌配色或共用元件外觀，只需要改這一個檔案。
 * 各頁面仍可在自己的 <style> 追加該頁專屬樣式（導覽列漸層、Hero、方案卡等）。
 */
:root {
    --brand: #1f4e79;        /* 沉穩深藍：專業、可信賴 */
    --brand-dark: #163a5c;
    --brand-2: #2e9e8f;      /* 都更「新生」的青綠點綴 */
    --ink: #1f2733;
    --muted: #5b6875;
    --bg-soft: #f5f8fc;
    --line: #e4eaf1;
}

/* 共用卡片 */
.card { border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 2px 10px rgba(31,78,121,.05); }
.card-header { background: #fff; border-bottom: 1px solid var(--line); font-weight: 700; color: var(--ink); }

/* 品牌按鈕 */
.btn-primary { background: var(--brand); border-color: var(--brand); }
.btn-primary:hover, .btn-primary:focus { background: var(--brand-dark); border-color: var(--brand-dark); }
.btn-success { background: var(--brand-2); border-color: var(--brand-2); }
.btn-success:hover, .btn-success:focus { background: #268374; border-color: #268374; }
.btn-brand { background: var(--brand); border-color: var(--brand); color: #fff; font-weight: 700; }
.btn-brand:hover, .btn-brand:focus { background: var(--brand-dark); border-color: var(--brand-dark); color: #fff; }
.btn-outline-brand { border-color: var(--brand); color: var(--brand); font-weight: 700; }
.btn-outline-brand:hover, .btn-outline-brand:focus { background: var(--brand); color: #fff; }

/* 統計磚：後台儀表板等處的數字卡片。白底、頂部品牌色細條、深色可讀文字。 */
.stat-tile { display: flex; flex-direction: column; height: 100%; border-top: 3px solid var(--line); transition: box-shadow .15s, transform .15s; }
.stat-tile:hover { box-shadow: 0 .5rem 1.1rem rgba(31,78,121,.12); transform: translateY(-2px); }
.stat-tile .stat-top { display: flex; align-items: flex-start; justify-content: space-between; gap: .5rem; padding: 1rem 1.15rem .8rem; }
.stat-tile .stat-num { font-size: 2rem; font-weight: 800; line-height: 1.05; color: var(--ink); }
.stat-tile .stat-label { color: var(--muted); font-weight: 600; font-size: .95rem; }
.stat-tile .stat-sub { font-size: .78rem; color: var(--muted); margin-top: .2rem; }
.stat-tile .stat-ico { font-size: 1.9rem; line-height: 1; }
.stat-tile .stat-foot { margin-top: auto; padding: .55rem 1.15rem; border-top: 1px solid var(--line); }
.stat-tile .stat-foot a { color: var(--brand); font-weight: 600; font-size: .85rem; text-decoration: none; }
.stat-tile .stat-foot a:hover { text-decoration: underline; }
.stat-tile.tone-brand { border-top-color: var(--brand); }      .stat-tile.tone-brand .stat-ico { color: var(--brand); }
.stat-tile.tone-green { border-top-color: var(--brand-2); }    .stat-tile.tone-green .stat-ico { color: var(--brand-2); }
.stat-tile.tone-amber { border-top-color: #c9862b; }           .stat-tile.tone-amber .stat-ico { color: #c9862b; }
.stat-tile.tone-info  { border-top-color: #2b7fb3; }           .stat-tile.tone-info  .stat-ico { color: #2b7fb3; }

/* 後台列表的深色表頭統一為品牌深藍（取代 Bootstrap 預設近黑），與導覽列一致 */
.table-dark { --bs-table-bg: var(--brand-dark); --bs-table-border-color: #274a6b; }
