/* === 設計變數（供 map.css / style.css 的 var() 引用） === */
:root {
    --green: #2E9E5B;
    --green-darker: #2E7D32;
    --green-light: #E3F3E8;
    --red: #FF6B5B;
    --red-dark: #E85A4B;
    --coral: #FF6E63;
    --banner-red: #FE6E63;
    --cream: #FFE7BB;
    --bg-cream: #FFF8EF;
    --text-dark: #2B2B2B;
    --text-muted: #6B6B6B;
    --section-bar: #2E7D32;
    --radius-sm: 8px;
    --radius-md: 14px;
    --radius-lg: 18px;
    --radius-xl: 28px;
    --radius-pill: 999px;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.10);
    --shadow-lg: 0 10px 28px rgba(0, 0, 0, 0.14);
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes fadeOnly {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* 頭部橫幅圖（head.png）置滿寬度 */
.nav-img,
.navs-img {
    display: block;
    width: 100%;
}

/* 單位詳情資訊列 */
.detail-info {
    margin-bottom: 8px;
}

.detail-row {
    padding: 14px 4px;
    border-bottom: 1px solid #F0E4D2;
    font-size: 1.05rem;
    line-height: 1.8;
    color: var(--text-dark);
    word-break: break-word;
}

.detail-row:last-child {
    border-bottom: none;
}

.detail-row a {
    color: var(--green-darker);
    text-decoration: underline;
}

html,
body {
	height: 100%;
}

body {
	font-family: "Open Sans", "Roboto", "Microsoft JhengHei UI", "Microsoft JhengHei", Helvetica, Arial, sans-serif;
	font-weight: 400;
	overflow-x: hidden;
	overflow-y: auto;
}

/* 隱藏滾動軸但保留頁面上下滑動（PC 版手機模擬框內的行動版頁面適用；行動裝置本無滾動軸，無影響） */
html,
body {
	scrollbar-width: none;
	-ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.wrapper {
	position: relative;
}

.wrapper:before,
.wrapper:after {
	content: " ";
	display: table;
}

.wrapper:after {
	clear: both;
}

.content-wrapper,
.main-footer {
	-webkit-transition: -webkit-transform 0.3s ease-in-out, margin 0.3s ease-in-out;
	-moz-transition: -moz-transform 0.3s ease-in-out, margin 0.3s ease-in-out;
	-o-transition: -o-transform 0.3s ease-in-out, margin 0.3s ease-in-out;
	transition: transform 0.3s ease-in-out, margin 0.3s ease-in-out;
	z-index: 820;
}

.content {
    padding: 15px;
    margin-right: auto;
    margin-left: auto;
}

/*----------Btn Style start-------------*/
.btn {
	border-radius: 3px;
	-webkit-box-shadow: none;
	box-shadow: none;
	border: 1px solid transparent;
}
.btn:active {
	-webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	-moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
	box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}
.btn:focus {
	outline: none;
}
.btn-seagreen {
    background-color: #2B8F5D;
    border-color: #2B8F5D;
}
.btn-seagreen:hover,
.btn-seagreen:active,
.btn-seagreen.hover {
    background-color: #2B8F5D;
}
.btn-moccasin {
    background-color: #FFE7BB;
    border-color: #FFE7BB;
}
.btn-moccasin:hover,
.btn-moccasin:active,
.btn-moccasin.hover {
    background-color: #FFE7BB;
}

/*----------Basic Style start-------------*/
.ft12{font-size: 0.6rem !important;}
.ft14{font-size: 0.7rem !important;}
.ft16{font-size: 0.8rem !important;}
.ft18{font-size: 0.9rem !important;}
.ft20{font-size: 1rem !important;}
.ft22{font-size: 1.1rem !important;}
.ft24{font-size: 1.2rem !important;}
.ft26{font-size: 1.3rem !important;}
.ft28{font-size: 1.4rem !important;}
.ft30{font-size: 1.5rem !important;}
.ft32{font-size: 1.6rem !important;}
.ft34{font-size: 1.7rem !important;}
.ft36{font-size: 1.8rem !important;}
.ft38{font-size: 1.9rem !important;}
.ft40{font-size: 2rem !important;}
.ft42{font-size: 2.1rem !important;}

/* =========================================================
   長者友善無障礙層（字體放大 / 點擊區加大 / 排版留白）
   - 正文基準 18px，行高 1.75，提升閱讀舒適度
   - 標題、按鈕、可點擊區域同步放大，避免小字與誤觸
   ========================================================= */
html {
    font-size: 18px;            /* 全局基準；所有 rem 類別隨之放大 */
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    font-size: 1rem;            /* 18px */
    line-height: 1.75;
    letter-spacing: 0.01em;
    color: var(--text-dark);
}

/* 標題層級放大（清晰分層，避免與正文混淆） */
h1, .h1 { font-size: 1.78rem; line-height: 1.3; }
h2, .h2 { font-size: 1.55rem; line-height: 1.3; }
h3, .h3 { font-size: 1.35rem; line-height: 1.35; }
h4, .h4 { font-size: 1.2rem;  line-height: 1.4; }
h5, .h5, .card-title { font-size: 1.12rem; line-height: 1.4; font-weight: 700; }
h6, .h6 { font-size: 1rem; }

/* 通用文字元素基準（確保未繼承的小字也跟隨放大） */
p, li, label, td, th, .input-group-text, .form-control-plaintext {
    font-size: 1rem;
    line-height: 1.7;
}

/* 字級工具類改為絕對 px，語意清晰便於控管（常用 ≥18px） */
.ft12{font-size:12px !important;}
.ft14{font-size:14px !important;}
.ft16{font-size:16px !important;}
.ft18{font-size:18px !important;}
.ft20{font-size:20px !important;}
.ft22{font-size:22px !important;}
.ft24{font-size:24px !important;}
.ft26{font-size:26px !important;}
.ft28{font-size:28px !important;}
.ft30{font-size:30px !important;}
.ft32{font-size:32px !important;}
.ft34{font-size:34px !important;}
.ft36{font-size:36px !important;}
.ft38{font-size:38px !important;}
.ft40{font-size:40px !important;}
.ft42{font-size:42px !important;}

/* 通用按鈕：加大點擊區並置中文字 */
.btn {
    min-height: 50px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.08rem;
    line-height: 1.4;
    padding: .7rem 1.1rem;
}

/* 連結點擊回饋更明顯 */
a {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.08);
}