/* Dr.MVP V2 legal page (LOS08) - "new shell, same text": restyles the unchanged TermOfService_drmvp.cshtml markup.
   Source: LoggedOut_System_Screens_Preview.html line 8 (.legal-shell/.legal-tabs/.legal-panel), DrMVP_Website_Handoff_20261007_LoggedOut_v1.2.
   Spec: docs/plans/20261007_DrMVP_V2_System_Screens_Spec_DRAFT.md section 5.3.
   Every rule starts with .drmvpv2-legal except the logged-in tablet offset (body:has(...) prefix, same pattern as the body-prefixed rules in drmvpv2-integration.css).
   !important is used only where the legacy markup carries Bootstrap utilities that are themselves !important
   (.flex-column, .p-4/.px-xl-5/.mx-md-4 on the wrapper, .mt-4 on .tab-content, .p-3/.p-sm-5 on .card, .p-lg-4 on .innerPage). Not ported: .legal-source (prototype only). */
.drmvpv2-legal{--navy:#071b4d;--blue:#0b63e5;--yellow:#ffbd1a;--line:#d8e2ef;--soft:#f3f7fc;--muted:#60728e;color:var(--navy);font-family:"Microsoft JhengHei","Noto Sans TC",Arial,sans-serif;line-height:1.65}
.drmvpv2-legal,.drmvpv2-legal *,.drmvpv2-legal *::before,.drmvpv2-legal *::after{box-sizing:border-box}
.drmvpv2-legal.system-main{min-height:640px;background:linear-gradient(150deg,#f6f9fd 0,#fff 48%,#f0f5fc 100%)}
.drmvpv2-legal .legal-shell{max-width:1120px;margin:auto;padding:55px 30px 85px}

/* Legacy dispatcher <style> (TermOfService.cshtml:3-78): pink background, 14pt/16pt body, 18pt/24pt headings -> neutralise. */
.drmvpv2-legal .DocumentBody{background:transparent;color:var(--navy);font-size:16px}
.drmvpv2-legal .DocumentBody>div{padding:0!important;margin:0!important}

/* Tabs = .legal-tabs. top = measured sticky header height 97/93/71px at 1440/1024/390 (Luna 417, cc084cb5a), not the delivered 92/70. */
/* 案 419：下列各斷點的 #termofservice top 只在頁首比它矮時生效；頁首較高（登入後會員頁首）時由 TermOfService.cshtml 的 fitTabsUnderHeader 依實際頁首高度覆寫。 */
.drmvpv2-legal #termofservice{position:sticky;top:97px;z-index:2;display:flex;flex-direction:row!important;flex-wrap:nowrap;gap:9px;margin:0;padding:13px 0;background:#fff;list-style:none}
.drmvpv2-legal #termofservice .nav-item{flex:0 0 auto}
.drmvpv2-legal #termofservice .nav-link{min-height:44px;display:flex;align-items:center;padding:0 18px;border:1px solid #cddaea;border-radius:999px;background:#fff;color:var(--navy);font-size:14px;font-weight:900;white-space:nowrap;text-decoration:none}
.drmvpv2-legal #termofservice .nav-link.active{border-color:var(--blue);background:var(--blue);color:#fff}
.drmvpv2-legal #termofservice .nav-link:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}

/* Panels = .legal-panel */
.drmvpv2-legal .tab-content{margin-top:0!important}
.drmvpv2-legal .tab-pane>.card{padding:34px!important;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 10px 30px rgba(7,27,77,.06)}
.drmvpv2-legal .innerPage{padding:0!important;color:#425777;line-height:1.9}
.drmvpv2-legal .DocumentBody .inner_page_title{margin:0 0 18px;color:var(--navy);font-size:34px;line-height:normal}
.drmvpv2-legal .DocumentBody .sub_title{margin:28px 0 10px;padding:0;color:var(--navy);font-size:21px;line-height:normal}
.drmvpv2-legal .innerPage p{line-height:1.9}
/* Headings: line-height normal = the preview (its body sets no line-height); without it they inherit .innerPage 1.9 via the integration reset.
   .unorder_list / .sub_unorder_list hanging indents are left untouched (clause numbering structure). */

@media(max-width:1439px) and (min-width:768px){
    .drmvpv2-legal #termofservice{top:93px}
}
/* Logged-in tablet header is taller (global-components-v1.0-base.css: .gc-header--logged-in .gc-header__inner{min-height:112px}). */
@media(max-width:1439px) and (min-width:768px){
    body:has(.gc-header--logged-in) .drmvpv2-legal #termofservice{top:113px}
}
@media(max-width:767px){
    .drmvpv2-legal .legal-shell{padding:35px 18px 60px}
    .drmvpv2-legal #termofservice{top:71px;overflow-x:auto}
    .drmvpv2-legal .tab-pane>.card{padding:23px 18px!important}
}