/* 115.09.29 電子郵件事由與例稿（甲1 選後展開）：聯繫頁電子郵件卡（.ecs）。搭配 email-reason.js。（講座頁、調查頁之複製列 .ec-inline 已隨改版移除，見 contact-cta.css）
   色彩沿用官網：墨 #213e50、次文 #536775、金 #957737、深藍 #243e4b＋#f1dfb3；深色 #172a35 底、#dae3e7 字、#d8bf80 金。 */
[data-ec-js][hidden],[data-ec-nojs][hidden],.ecs [hidden]{display:none!important}
.ecs{margin:0 0 4px}
.ecs button.mini-link{background-color:transparent;font-family:inherit;cursor:pointer}
.ecs fieldset{border:0;margin:0;padding:0;min-width:0}
.ecs legend{padding:0;margin:0 0 12px;font-size:15px;font-weight:600;color:#213e50;letter-spacing:.02em}
.ecs legend span{display:block;font-weight:400;font-size:14px;color:#536775;letter-spacing:0}
.ec-opt{position:relative;cursor:pointer;color:#213e50;scroll-margin-top:115px}
.ec-opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ec-opt:focus-within{outline:2px solid #957737;outline-offset:4px}
.ec-opt:not(:focus-within){outline:0}
.ecs .ec-hint{margin:12px 0 0;font-size:14px;line-height:1.8;color:#536775;border-left:2px solid transparent;padding-left:0;transition:border-color .3s,padding .3s}
.ecs .ec-hint.is-alert{border-left-color:#957737;padding-left:10px;color:#213e50}
.ec-status{display:block;min-height:1.6em;font-size:14px;line-height:1.7;color:#536775;margin:8px 0 0}
.ec-copies{display:flex;flex-wrap:wrap;gap:8px 10px;margin:12px 0 0}
.ec-copies .mini-link{min-height:44px}
/* 信箋 */
.ec-paper{border:1px solid #ddd3b8;border-top:3px double #ae9457;background:#fffdf8;padding:14px 18px 16px}
.ec-paper dl{margin:0 0 10px;padding:0 0 10px;border-bottom:1px solid #e7dfc9;font-size:14px;line-height:1.7}
.ec-paper dl div{display:grid;grid-template-columns:4.2em minmax(0,1fr);gap:8px}
.ec-paper dt{color:#536775}.ec-paper dd{margin:0;color:#213e50;overflow-wrap:anywhere}
.ec-paper pre{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-family:var(--sans);font-size:14px;line-height:1.85;color:#213e50}
.ecs .ec-reset{margin:12px 0 0}
/* 事由卡片 */
.ecs .ec-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.ecs .ec-opt{display:flex;flex-direction:column;gap:6px;min-width:0;padding:16px 46px 16px 18px;border:1px solid #9c8450;background:#fbfaf6;transition:background-color .3s,border-color .3s,color .3s}
.ecs .ec-opt:hover{border-color:#957737;background:#f3eee2}
.ec-en{font-family:var(--sans);font-size:12px;letter-spacing:.08em;color:#6f6245;text-transform:uppercase}
.ecs .ec-opt strong{font-family:var(--serif);font-size:19px;font-weight:500;line-height:1.5}
.ec-desc{font-size:14px;line-height:1.8;color:#46596a}
.ec-seal{position:absolute;top:16px;right:16px;width:20px;height:20px;border:1px solid #957737}
.ec-seal::after{content:"";position:absolute;left:6px;top:2px;width:5px;height:10px;border:solid transparent;border-width:0 2px 2px 0;transform:rotate(45deg)}
.ecs .ec-opt.is-checked{background:#243e4b;border-color:#a58b51;color:#f1dfb3}
.ecs .ec-opt.is-checked .ec-en{color:#d8bf80}.ecs .ec-opt.is-checked .ec-desc{color:#dfe6e8}
.ecs .ec-opt.is-checked .ec-seal{background:#d8bf80;border-color:#d8bf80}.ecs .ec-opt.is-checked .ec-seal::after{border-color:#243e4b}
.ec-expand{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s ease}
.ec-expand>div{overflow:hidden;min-height:0}
.ecs[data-state=ready] .ec-expand{grid-template-rows:1fr}
.ecs .ec-paper{margin:18px 0 4px}
.ecs .ec-paper .ec-copies{border-top:1px solid #e7dfc9;padding-top:12px}
.ecs .contact-channel-actions{margin-top:18px}

/* 深色 */
html[data-theme=dark] .ecs legend,html[data-theme=dark] .ecs .ec-hint.is-alert{color:#dae3e7}
html[data-theme=dark] .ecs legend span,html[data-theme=dark] .ecs .ec-hint,html[data-theme=dark] .ec-status,html[data-theme=dark] .ec-paper dt{color:#bac7cb}
html[data-theme=dark] .ec-opt{color:#dae3e7}
html[data-theme=dark] .ec-opt:focus-within{outline-color:#d8bf80}
html[data-theme=dark] .ec-opt:not(:focus-within){outline:0}
html[data-theme=dark] .ecs .ec-hint.is-alert{border-left-color:#d8bf80}
html[data-theme=dark] .ec-paper{background:#142631;border-color:#3b5160;border-top-color:#c8b47f}
html[data-theme=dark] .ec-paper dl,html[data-theme=dark] .ecs .ec-paper .ec-copies{border-color:#2f4452}
html[data-theme=dark] .ec-paper dd,html[data-theme=dark] .ec-paper pre{color:#dae3e7}
html[data-theme=dark] .ecs .ec-opt{background:#1b3240;border-color:#a58b51}
html[data-theme=dark] .ec-en{color:#c8b47f}html[data-theme=dark] .ec-desc{color:#bac7cb}
html[data-theme=dark] .ecs .ec-opt:hover{background:#213a49}
html[data-theme=dark] .ecs .ec-opt.is-checked{background:#243e4b;border-color:#d8bf80;color:#f1dfb3;box-shadow:inset 0 0 0 1px #d8bf80}
html[data-theme=dark] .ecs .ec-opt.is-checked .ec-en{color:#d8bf80}html[data-theme=dark] .ecs .ec-opt.is-checked .ec-desc{color:#dfe6e8}
html[data-theme=dark] .ec-seal{border-color:#c8b47f}
html[data-theme=dark] .ecs .ec-opt.is-checked .ec-seal{background:#d8bf80;border-color:#d8bf80}html[data-theme=dark] .ecs .ec-opt.is-checked .ec-seal::after{border-color:#243e4b}

@media(max-width:760px){
  .ecs .ec-cards{grid-template-columns:1fr}
  .ec-paper{padding-left:14px;padding-right:14px}
}
@media(prefers-reduced-motion:reduce){.ec-expand,.ec-opt,.ec-hint{transition:none}}

/* 115.09.30 第二小批（律師裁示）：761～1000 寬聯繫頁為左右兩欄，事由卡片區僅約 325～427px，兩張並排每張 156～208px 過擠；
   此區間比照 760 以下改單欄上下排，1001 以上維持並排 */
@media(min-width:761px) and (max-width:1000px){.ecs .ec-cards{grid-template-columns:1fr}}
