/**
 * 三张主列表的响应式布局与固定列规则。
 * 本文件只允许改变尺寸、滚动、sticky 与断点；不得在此限制记录数、隐藏业务字段
 * 或改变状态/数据流。基础字号继承 index.html，不能靠缩小正文解决表格宽度。
 */
.content:has(>:is(#appointments,#leads,#policies).active){padding:18px 24px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
:is(#appointments,#leads,#policies).panel.active{display:flex;flex-direction:column;flex:1;min-height:0;min-width:0}
:is(#appointments,#leads,#policies)>.intro{flex:none;align-items:center;gap:12px;margin-bottom:8px}
:is(#appointments,#leads,#policies)>.intro .btn{flex:none;margin-top:0}
:is(#appointments,#leads,#policies)>.intro h1{font-size:25px}
:is(#appointments,#leads,#policies)>.intro p{margin-top:4px}
:is(#appointments,#leads,#policies)>.notice{flex:none;padding:6px 10px;max-height:12dvh;overflow:auto}
:is(#appointments,#leads,#policies)>.card{flex:0 1 auto;min-height:0;min-width:0;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;margin-top:8px!important}
:is(#appointments,#leads,#policies)>.card>.card-head{flex:none;padding:10px 16px 8px}
:is(#appointments,#leads,#policies)>.card>.toolbar{flex:none;padding:0 16px 10px;min-width:0;max-height:30dvh;overflow:auto}
:is(#appointments,#leads,#policies) .lead-filter-row{width:100%;min-width:0;display:flex;flex-wrap:wrap;gap:8px}
:is(#appointments,#leads,#policies) .lead-filter-row>select{flex:1 1 130px;min-width:0;max-width:220px;width:130px;padding:9px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}
:is(#appointments,#leads,#policies) .lead-filter-row>.search{flex:2 1 220px;min-width:0;max-width:350px;margin-bottom:0}
#appointments .appointment-filter-group{min-width:0}
:is(#appointments,#leads,#policies)>.card>.table-wrap{height:auto!important;max-height:none!important;min-height:0;flex:0 1 auto;overflow:auto;scrollbar-gutter:stable;overscroll-behavior:contain}
:is(#leads,#policies)>.card>.table-wrap :is(tr,td){height:auto!important}
:is(#appointments,#leads,#policies)>.card>.table-wrap :is(th,td){padding:clamp(7px,0.65vw,10px) clamp(8px,0.8vw,12px);white-space:normal;overflow-wrap:anywhere;vertical-align:middle;line-height:1.5}
:is(#appointments,#leads,#policies)>.card>.table-wrap td{font-size:14px}
/* 三张工作台列表表头与预约／新单／保单列表使用同一文字规格。 */
:is(#appointments,#leads,#policies,#special-discounts,#value-added-services,#admin-fee-intake)>.card>.table-wrap th{font-size:14px;color:#334b4b;font-weight:700;opacity:1}
:is(#appointments,#leads,#policies)>.card>.table-wrap .small{font-size:12px}
/* Stretch the product column only: pinned column widths/offsets must stay aligned. */
#appointments .appointment-day-card .appointment-v2-table{width:100%}
#appointments .appointment-col-product{width:auto}
/* 新單可選擇可見欄；固定前兩欄與操作欄寬度，超出容器時由 table-wrap 橫向捲動。 */
#leads .lead-table{--lead-client-width:130px;width:100%;min-width:720px;table-layout:fixed;border-collapse:separate;border-spacing:0}
#leads .lead-table :is(th,td):nth-child(1){width:var(--lead-client-width);position:sticky;left:0;z-index:3;background:#fff}
#leads .lead-table :is(th,td):nth-child(2){width:125px;position:sticky;left:var(--lead-client-width);z-index:3;background:#fff;box-shadow:5px 0 8px #163d3d12}
#leads .lead-table .lead-cell-actions{width:146px;min-width:146px}
#leads .policy-filter-row>#refresh-new-business{margin-left:auto}
#policies .policy-table{width:100%;min-width:720px;border-collapse:separate;border-spacing:0}
#policies .policy-table .policy-col-product,#policies .policy-table :is(th,td):nth-child(6){width:auto}
#policies .policy-table .policy-col-actions{width:146px}
#policies .policy-table :is(.policy-col-policy-date,.policy-col-next-due,.policy-col-cooling){width:125px}
#policies .policy-table .policy-col-dda{width:105px}
#policies .policy-table :is(.policy-col-premium-increase,.policy-col-sum-increase){width:115px}
:is(#leads,#policies) .business-representative-cell .mini-avatar{flex:none}
:is(#leads,#policies) .business-representative-cell{display:grid;gap:5px}
:is(#leads,#policies) .business-representative-person{display:flex;align-items:center;gap:7px;min-width:0}
:is(#leads,#policies) .business-representative-name{min-width:0;white-space:normal;overflow-wrap:anywhere;line-height:1.35}
#special-discounts .special-discount-table{min-width:1760px;table-layout:fixed}
#special-discounts .special-discount-table :is(th,td){padding-inline:12px;vertical-align:middle}
#special-discounts .special-discount-table :is(th,td):nth-child(1){width:130px;position:sticky;left:0;z-index:3;background:#fff}
#special-discounts .special-discount-table th:nth-child(1){z-index:4;background:#f8faf9}
#special-discounts .special-discount-table :is(th,td):nth-child(5),#special-discounts .special-discount-table :is(th,td):nth-child(6),#special-discounts .special-discount-table :is(th,td):nth-child(12){width:190px}
#special-discounts .special-discount-table .special-discount-note{white-space:normal;overflow-wrap:anywhere;line-height:1.4}
#special-discounts .special-discount-table :is(th,td):last-child{width:80px;position:sticky;right:0;z-index:3;background:#fff}
#special-discounts .special-discount-table th:last-child{z-index:4;background:#f8faf9}
#special-discounts .special-discount-table tr:hover :is(td:first-child,td:last-child){background:#fbfdfc}
/* 表頭保持清晰，但系統目錄的操作欄不沿用三張主列表的寬欄配置。 */
.content .table-wrap table thead th,#drawer .table-wrap table thead th{font-size:13px;color:#334b4b;font-weight:700;opacity:1;letter-spacing:0}
:is(#numbering,#number-catalog) .table :is(th,td){padding-inline:12px}
:is(#numbering,#number-catalog) .table :is(th,td):last-child{width:1%;white-space:nowrap}
:is(#numbering,#number-catalog) .row-actions{display:inline-flex;flex-wrap:wrap;align-items:center;width:max-content;max-width:220px;gap:4px}
:is(#numbering,#number-catalog) .row-actions button{width:auto;min-width:0;padding:5px 6px;white-space:nowrap;border-radius:5px}
:is(#leads,#policies) .table :is(th,td):last-child:not([colspan]){position:sticky;right:0;z-index:3;background:#fff;box-shadow:-5px 0 8px #163d3d12}
:is(#leads,#policies) .table thead th{top:0;position:sticky;z-index:4;background:#f8faf9}
:is(#leads,#policies) .table thead :is(th:first-child,th:last-child){z-index:8;background:#f8faf9}
#leads .lead-table thead th:nth-child(2){z-index:8;background:#f8faf9}
#leads .lead-table tbody tr:hover :is(td:nth-child(1),td:nth-child(2)){background:#fbfdfc}
#policies .table thead th:nth-child(2){z-index:7;background:#f8faf9}
:is(#leads,#policies) .table thead th:last-child:not([colspan]){z-index:9;background:#f8faf9}
/* 第一行保留編輯／查看，第二行放下一個直接操作與省略號；列寬與表格寬度同步縮減。 */
:is(#appointments,#leads,#policies) .row-actions-compact{display:grid!important;grid-template-columns:minmax(0,1fr) 28px;align-items:center;justify-items:start;width:100%;min-width:0!important;gap:3px 4px!important}
:is(#appointments,#leads,#policies) .row-actions-compact>button:first-child{grid-column:1/-1;grid-row:1}
:is(#appointments,#leads,#policies) .row-actions-compact>button:nth-child(2){grid-column:1;grid-row:2}
:is(#appointments,#leads,#policies) .row-actions-compact>button:nth-child(3){grid-column:2;grid-row:2}
:is(#appointments,#leads,#policies) .row-actions-compact button{width:auto;max-width:100%;min-width:0;min-height:27px;padding:4px 5px;white-space:nowrap;font-size:12px;line-height:1.2;border:1px solid #e1eeea;border-radius:5px;text-align:center}
:is(#appointments,#leads,#policies) .row-actions-compact button[aria-haspopup="menu"]{width:28px;min-width:28px;padding:0;font-size:18px;font-weight:700;line-height:1}
.gb-row-action-menu{position:fixed;z-index:10050;min-width:132px;display:grid;gap:2px;padding:5px;border:1px solid #d8e6e0;border-radius:8px;background:#fff;box-shadow:0 8px 24px #143b2b24}
.gb-row-action-menu button{width:100%;padding:8px 12px;border:0;border-radius:5px;background:#fff;color:var(--teal);font:inherit;text-align:left;white-space:nowrap;cursor:pointer}
.gb-row-action-menu button:hover,.gb-row-action-menu button:focus-visible{background:#edf6f2;outline:none}
[data-v24-filters]{display:none}
.v24-day-pan{display:inline-flex;gap:3px}
.v24-day-pan button{width:28px;height:28px;border:1px solid #cedfd8;border-radius:5px;background:#fff;color:var(--teal);font-size:16px}

/* One scrolling page; header, section navigation and save controls stay in view. */
#drawer.lead-wizard{height:100dvh;max-height:100dvh;display:flex;flex-direction:column;overflow:hidden;width:min(900px,96vw);padding:0}
#drawer.lead-wizard>.drawer-head{flex:none;margin:0;padding:14px 20px;border-bottom:1px solid var(--line)}
#drawer.lead-wizard>#drawer-body{flex:1;min-height:0;overflow:hidden}
#drawer.lead-wizard .lead-wizard-body{height:100%;min-height:0;grid-template-columns:180px minmax(0,1fr);overflow:hidden}
#drawer.lead-wizard .wizard-nav{padding:18px 12px;min-height:0;overflow:auto}
#drawer.lead-wizard .wizard-nav h2{font-size:17px;margin-bottom:15px}
#drawer.lead-wizard .wizard-content{padding:0;min-width:0;min-height:0;overflow:hidden}
#drawer.lead-wizard #lead-wizard-form{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#drawer.lead-wizard .template-badge{flex:none;margin:14px 28px 0}
#drawer.lead-wizard .wizard-page{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:22px 28px 28px;scroll-padding:22px}
#drawer.lead-wizard .wizard-desc{margin-bottom:24px}
#drawer.lead-wizard .wizard-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px}
#drawer.lead-wizard .case-product-pair{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px}
#drawer.lead-wizard .case-product-pair>.field{min-width:0;display:grid;align-content:start;gap:9px}
#drawer.lead-wizard .wizard-fields>.field{min-width:0;align-content:start;gap:9px}
#drawer.lead-wizard .v22-status-fields [data-activation-dates]{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 28px}
#drawer.lead-wizard .field :is(input,select,textarea){width:100%;min-width:0;box-sizing:border-box}
/* 受益人表按内容撑开并在容器内横向滚动，证件号和下拉选项完整可见。 */
#drawer.lead-wizard #beneficiary-table-field .table-wrap{max-width:100%;overflow-x:auto}
#drawer.lead-wizard .case-beneficiary-table{width:max-content;min-width:1320px;table-layout:auto}
#drawer.lead-wizard .case-beneficiary-table :is(th,td){padding:10px 12px;white-space:nowrap;overflow:visible}
#drawer.lead-wizard .case-beneficiary-table :is(input,select){width:100%;min-height:42px;box-sizing:border-box}
#drawer.lead-wizard .case-beneficiary-table td input:not([type=number]){field-sizing:content;width:auto;min-width:100%;max-width:none}
#drawer.lead-wizard .case-beneficiary-table :is(th,td):nth-child(1){width:96px;min-width:96px;max-width:96px}
#drawer.lead-wizard .case-beneficiary-table :is(th,td):nth-child(2){min-width:150px}
#drawer.lead-wizard .case-beneficiary-table :is(th,td):nth-child(3){min-width:190px}
#drawer.lead-wizard .case-beneficiary-table :is(th,td):nth-child(4){width:95px;min-width:95px;max-width:95px}
#drawer.lead-wizard .case-beneficiary-table :is(th,td):nth-child(5){width:108px;min-width:108px;max-width:108px}
#drawer.lead-wizard .case-beneficiary-table :is(th,td):nth-child(6){width:145px;min-width:145px;max-width:145px}
#drawer.lead-wizard .case-beneficiary-table :is(th,td):nth-child(7){min-width:245px}
#drawer.lead-wizard .case-beneficiary-table td:nth-child(7) input{font-variant-numeric:tabular-nums}
#drawer.lead-wizard .wizard-footer{flex:none;align-items:center;gap:8px;margin:0;padding:12px 20px;background:#fff;box-shadow:0 -4px 12px #153a320a}
#drawer.lead-wizard #wizard-progress{margin-right:auto;white-space:nowrap}
#drawer.lead-wizard #wizard-save{display:inline-flex!important}
#drawer.lead-wizard #wizard-save.hidden{display:none!important}
#drawer.lead-wizard #lead-wizard-form[data-case-last-page="false"] #wizard-save{display:none!important}
#drawer.lead-wizard .appointment-inline-heading{grid-column:1/-1;margin:10px 0 0;color:#234b59;font-size:15px}
/* Section navigation always remains the left vertical rail (the approved layout). */
#drawer.lead-wizard .wizard-nav{display:block;border-right:1px solid var(--line);border-bottom:0}
#drawer.lead-wizard .wizard-step{width:100%;min-width:0;text-align:left;white-space:normal}

/* Appointment title/close remain fixed; only the body scrolls. */
#drawer.appointment-v2-drawer{height:100dvh;max-height:100dvh;display:flex;flex-direction:column;overflow:hidden;padding:0}
#drawer.appointment-v2-drawer>.drawer-head{flex:none;margin:0;padding:14px 20px;border-bottom:1px solid var(--line)}
#drawer.appointment-v2-drawer>#drawer-body{flex:1;min-height:0;overflow:auto;padding:20px}
#drawer.appointment-v2-drawer:has(#appointment-status-turn-form)>#drawer-body{overflow:hidden;padding:0}
#appointment-status-turn-form{height:100%;min-height:0;margin:0;display:flex;flex-direction:column;overflow:hidden}
#appointment-status-turn-form .appointment-status-turn-scroll{flex:1;min-height:0;overflow:auto;padding:20px;scrollbar-gutter:stable;overscroll-behavior:contain}
#appointment-status-turn-form .appointment-status-edit>.appointment-v2-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px}
#appointment-status-turn-form .appointment-status-edit .field{min-width:0}
#appointment-status-turn-form .appointment-status-edit .field :is(input,select,textarea){width:100%;min-width:0;box-sizing:border-box}
#appointment-status-turn-form .appointment-status-hint{grid-column:1/-1;margin:0;color:#486262;font-size:13px;line-height:1.55}
#appointment-status-turn-form .appointment-original-review{margin-top:18px}
#appointment-status-turn-form>.form-footer{flex:none;margin:0;padding:12px 20px;border-top:1px solid var(--line);background:#fff;box-shadow:0 -4px 12px #153a320a}
#appointment-form-v2 [data-intake-beneficiary-table][hidden],#appointment-form-v2 [data-appointment-prepay][hidden],#appointment-status-turn-form [data-status-prepay][hidden],#lead-wizard-form [data-case-prepay][hidden]{display:none!important}
#appointment-status-turn-form [data-status-signing-only][hidden]{display:none!important}
#lead-wizard-form [data-case-addon-detail][hidden]{display:none!important}
@media(max-width:700px){#appointment-status-turn-form .appointment-status-edit>.appointment-v2-grid{grid-template-columns:1fr;gap:14px}}
#drawer:is(.business-status-drawer,.business-activity-drawer){width:min(900px,96vw);height:100dvh;max-height:100dvh;display:flex;flex-direction:column;overflow:hidden;padding:0}
#drawer:is(.business-status-drawer,.business-activity-drawer)>.drawer-head{flex:none;margin:0;padding:14px 20px;border-bottom:1px solid var(--line)}
#drawer:is(.business-status-drawer,.business-activity-drawer)>#drawer-body{flex:1;min-height:0;overflow:auto;padding:20px;scrollbar-gutter:stable;overscroll-behavior:contain}
.v26-searchable-select{width:100%;min-width:0;box-sizing:border-box}
@media(max-width:1100px),(max-height:750px){
 .main:has(:is(#appointments,#leads,#policies).active)>.topbar{height:54px;flex-basis:54px;padding:0 20px}
 .content:has(>:is(#appointments,#leads,#policies).active){padding:12px 16px}
 :is(#appointments,#leads,#policies)>.intro .eyebrow{display:none}
 :is(#appointments,#leads,#policies)>.intro h1{font-size:23px}
 [data-v24-filters]{display:inline-flex;padding:7px 10px}
 :is(#appointments,#leads,#policies)>.card:not(.v24-filters-open)>.toolbar{display:none}
}
@media(max-width:700px){
 #drawer.lead-wizard,#drawer.business-status-drawer,#drawer.business-activity-drawer{width:100vw}
 #drawer.lead-wizard .wizard-fields,#drawer.lead-wizard .case-product-pair,#drawer.lead-wizard .v22-status-fields [data-activation-dates]{grid-template-columns:1fr}
}
@media(max-width:600px){
 .main:has(:is(#appointments,#leads,#policies).active)>.topbar{padding-inline:10px}
 .main:has(:is(#appointments,#leads,#policies).active)>.topbar .top-actions{gap:8px}
 .main:has(:is(#appointments,#leads,#policies).active)>.topbar .bell,
 .main:has(:is(#appointments,#leads,#policies).active)>.topbar .user-session>.small{display:none}
 .main:has(:is(#appointments,#leads,#policies).active)>.topbar .crumb{white-space:nowrap}
 .content:has(>:is(#appointments,#leads,#policies).active){padding:10px 8px}
 :is(#appointments,#leads,#policies)>.intro{display:flex}
 :is(#appointments,#leads,#policies)>.intro h1{font-size:20px}
 :is(#appointments,#leads,#policies)>.intro p{display:none}
 :is(#appointments,#leads,#policies)>.intro .btn{padding:9px 10px;font-size:12px}
 :is(#appointments,#leads,#policies)>.card>.card-head{padding:9px 10px}
 #appointments>.card>.appointment-days-viewport{padding:6px;overflow-x:hidden}
 #appointments .appointment-day-card{min-width:0}
 .appointment-day-heading{flex-wrap:wrap;gap:6px}
 .appointment-note-editor{grid-template-columns:minmax(0,1fr)}
 .appointment-note-buttons{margin-top:5px}
 /* At phone widths, keep time/customer and actions reachable without covering the whole table. */
 #appointments .appointment-day-card .appointment-day-scroll .appointment-v2-table :is(th,td):is(:nth-child(2),:nth-child(11)){position:static;box-shadow:none}
 #policies .policy-table :is(th,td):nth-child(2){position:static;box-shadow:none}
 :is(#leads,#policies) .table :is(th,td):last-child:not([colspan]){right:0}
 #drawer.lead-wizard .lead-wizard-body{grid-template-columns:132px minmax(0,1fr)}
 #drawer.lead-wizard .wizard-nav{padding:14px 8px}
 #drawer.lead-wizard .wizard-nav h2{font-size:15px}
 #drawer.lead-wizard .wizard-step{padding:9px 6px;gap:6px}
 #drawer.lead-wizard .wizard-step .step-no{width:22px;height:22px}
 #drawer.lead-wizard .wizard-page{padding:12px}
 #drawer.lead-wizard .template-badge{margin:8px 12px 0}
 #drawer.lead-wizard .wizard-footer{padding:10px 12px;gap:6px}
 #drawer.lead-wizard .wizard-footer .btn{padding:9px 10px;font-size:12px}
}
@media(max-width:480px){
 #drawer.lead-wizard .lead-wizard-body{grid-template-columns:112px minmax(0,1fr)}
 #drawer.lead-wizard .wizard-nav h2{font-size:13px}
 #drawer.lead-wizard .wizard-step{font-size:12px}
 #drawer.lead-wizard .wizard-step .step-no{display:none}
 #drawer.lead-wizard .wizard-fields,#drawer.lead-wizard .case-product-pair,#drawer.lead-wizard .v22-status-fields [data-activation-dates]{grid-template-columns:1fr}
}