/* MCHP Tech-FAQ widget — derived from support/faq-style.css, class-scoped. 2026-07-17 */
.mchp-faq{display:flex;gap:25px;align-items:flex-start;width:100%}
.mchp-faq-nav{flex:0 0 280px;background:#f8f9fa;padding:20px;border:1px solid #dee2e6;border-radius:8px;box-sizing:border-box}
.mchp-faq-navhead{margin:0 0 12px;padding-bottom:10px;border-bottom:2px solid #ccc;font-size:1.15rem;color:#333}
.mchp-faq-tree{list-style:disc;margin:0;padding-left:20px}
.mchp-faq-tree ul{list-style:circle;padding-left:15px;margin:6px 0 10px}
.mchp-faq-tree li{margin:4px 0}
.mchp-faq-tree .faq-cat{background:none;border:0;padding:2px 0;cursor:pointer;font:inherit;line-height:1.5;text-align:left;color:#007cba}
.mchp-faq-tree .faq-cat.faq-top{font-weight:bold;color:#004a59}
.mchp-faq-tree .faq-cat:hover{text-decoration:underline}
.mchp-faq-tree .faq-cat.is-current{text-decoration:underline}

.mchp-faq-main{flex:1;min-width:0}
.faq-panel{display:none}
.faq-panel.is-active{display:block}
.faq-panel-title{font-size:1.3rem;color:#004a59;border-bottom:2px solid #004a59;padding-bottom:8px;margin:0 0 16px;font-weight:bold}

/* 上方兄弟分類橫向切換列（沿用舊版 linknav） */
.faq-switch{background:#f4f7fa;border-left:4px solid #005A9C;border-radius:6px;padding:8px 14px;margin:0 0 16px;font-size:14px;line-height:2}
.faq-switch .faq-switch-link{background:none;border:0;cursor:pointer;color:#005A9C;padding:2px 8px;font:inherit}
.faq-switch .faq-switch-link:hover{text-decoration:underline}
.faq-switch .faq-switch-link.is-here{font-weight:bold;color:#004a59;text-decoration:none;cursor:default}
.faq-switch .faq-switch-link + .faq-switch-link{border-left:1px solid #cfd8e0}
.faq-expand-all{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:#005A9C;color:#fff;border:0;border-radius:20px;cursor:pointer;font-size:14px;margin-bottom:16px}
.faq-expand-all:hover{background:#55a0f0}
.faq-empty{color:#888;padding:10px 0}

.faq-acc{margin:0;padding:0}
.faq-acc dt.question{border:1px solid #e0e0e0;background:#fbfbfb;border-radius:6px;margin-bottom:12px;transition:all .25s}
.faq-acc dt.question:hover{background:#f0f4f8;border-color:#b0d4ff}
.mchp-faq .faq-acc dt.question>a{display:block;padding:15px 40px 15px 20px;color:#333;font-weight:600;font-size:15px;text-decoration:none;position:relative;cursor:pointer}
.faq-acc dt.question>a::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:20px;color:#888}
.faq-acc dt.question.active{border-color:#005A9C;background:#e6f0fa}
.faq-acc dt.question.active>a::after{content:"\2212";color:#005A9C}
.faq-acc dd.answer{display:none;padding:20px;margin:-8px 0 12px;background:#fffffa;border:1px solid #e0e0e0;border-top:none;border-radius:0 0 6px 6px;font-size:15px;color:#333;line-height:1.85}
.faq-acc dd.answer.open{display:block}
/* 答案內文字不要被主題的淡灰 p{color:--mut} 蓋淡（訴求：文字太細/太淡） */
.mchp-faq .faq-acc dd.answer,
.mchp-faq .faq-acc dd.answer p,
.mchp-faq .faq-acc dd.answer li,
.mchp-faq .faq-acc dd.answer td,
.mchp-faq .faq-acc dd.answer span{color:#333;font-size:15px;font-weight:400}
.faq-acc dd.answer img{max-width:100%;height:auto;margin-top:12px;border:1px solid #ddd;border-radius:4px;padding:4px;background:#fff;display:block}
.mchp-faq .faq-acc dd.answer a{color:#005A9C;text-decoration:none;font-weight:500}
.mchp-faq .faq-acc dd.answer a:hover{text-decoration:underline}
.faq-acc dd.answer table{border-collapse:collapse;width:100%;margin:12px 0;font-size:.95em;display:block;overflow-x:auto}
.faq-acc dd.answer th,.faq-acc dd.answer td{border:1px solid #d9dde3;padding:.5rem .7rem;text-align:left;vertical-align:top}
.faq-acc dd.answer th{background:#f4f6f8;font-weight:600}

@media(max-width:820px){
  .mchp-faq{flex-direction:column}
  .mchp-faq-nav{flex:1 1 auto;width:100%}
}