@import url("../js/vendor/dialog-polyfill-0.5.6.css");
/* Shared component contracts. Page structure remains in each site's stylesheet. */
/* 不支持 :has 的旧浏览器由共享 UI 只补样式类，不复制或重建输入控件。 */
label.hp-choice-label{display:flex;align-items:center;gap:8px;min-height:var(--target);cursor:pointer}
label.hp-required-label>span:first-of-type:not(.required-mark)::after{content:' *';color:var(--danger)}
.hp-invalid-choice{background:var(--danger-soft);border-radius:var(--radius)}
.hp-dialog-fallback+.backdrop{background:rgba(39,39,35,.42)}
html{font-size:var(--base);background:var(--paper)}
body{font-family:var(--font);font-size:1rem;line-height:1.7;color:var(--ink);background:var(--paper);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box} [hidden]{display:none!important}
button,input,select,textarea{font-family:inherit;letter-spacing:normal}
h1,h2,h3,h4{font-weight:600;line-height:1.5;letter-spacing:normal;color:var(--ink)}
h1,.wizard-title,.flow-title{font-size:1.625rem}h2{font-size:1.3rem}h3,.form-section-title{font-size:1.16rem}
p,dd,.reference-code{overflow-wrap:anywhere}
/* PDPA与租购合同共用阅读提示；间距不依赖通用段落默认值。 */
.agreement-read-hint{margin:0 0 8px;font-size:.875rem;line-height:1.65;color:var(--muted)}a{color:var(--accent)}
button,a,input,select,textarea,summary{scroll-margin-block:110px}
:where(button,a,input,select,textarea,summary,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:4px}
:where(button,.btn){min-width:var(--target);min-height:var(--target);max-width:100%;padding:11px 18px;border-radius:var(--radius);font-size:1rem;line-height:1.6;white-space:normal;box-shadow:none;cursor:pointer}
:where(.btn-primary,button[type=submit]){min-height:var(--control-height)}
:where(button:disabled,.btn:disabled){opacity:.55;cursor:default}
/* 维护屏障三站复用员工端按钮规格，避免继承各页面的默认按钮外观。 */
#hp-runtime-state .runtime-retry{border:1px solid var(--accent);border-radius:var(--radius);background:var(--accent);color:var(--on-accent);padding:9px 15px;min-height:44px;line-height:1.45;font-size:1rem;font-weight:600}
:where(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){min-height:var(--control-height);font-size:1rem;line-height:1.7;max-width:100%;min-width:0;border:1px solid var(--input-line);border-radius:var(--radius);background:var(--paper);color:var(--ink);padding:10px 12px}
:where(input[readonly],input:disabled,select:disabled){background:var(--wash);color:var(--muted);opacity:1}
input[type=checkbox],input[type=radio]{accent-color:var(--accent);width:20px;height:20px;flex:0 0 auto}
label:has(>input[type=checkbox]),label:has(>input[type=radio]){display:flex;align-items:center;gap:8px;min-height:var(--target);cursor:pointer}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
:where(label,.form-label,.field-label,.hint,.muted,.form-section-hint,.wizard-subtitle){font-size:.875rem}
:where(.confirmation-field,.checkbox-row,.check-row,.consent-row){min-height:var(--target);line-height:1.7}
:where(.error,.form-error,.order-local-error){color:var(--danger)}
:where(.warning){color:var(--warning);background:var(--warning-soft)}
:where(.success){color:var(--success)}
.promiso-wordmark{display:block;width:120px;min-width:96px;height:auto;max-width:100%}
.promiso-brand{display:inline-flex;align-items:center;padding:12px 0;flex-shrink:0}
.promiso-icon{width:22px;height:22px;display:inline-block;vertical-align:middle;flex-shrink:0}
.promiso-icon svg{display:block;width:100%;height:100%;stroke-width:1.7}
summary{cursor:pointer;min-height:var(--target);padding-block:10px;list-style:none}
summary::marker{content:""}summary::-webkit-details-marker{display:none}
/* 原生折叠统一可见方向；flex布局同样保留标记。 */
details>summary::before{content:"";display:inline-block;width:0;height:0;border-block:5px solid transparent;border-inline-start:7px solid currentColor;margin-inline-end:9px;vertical-align:middle;flex-shrink:0;transform-origin:3px 5px}
details[open]>summary::before{transform:rotate(90deg)}
dialog{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:24px;width:min(720px,calc(100% - 32px));max-width:calc(100% - 32px);max-height:88vh;max-height:88dvh;overflow:auto;box-shadow:0 24px 80px rgba(39,39,35,.15);box-shadow:0 24px 80px color-mix(in srgb,var(--ink) 15%,transparent)}
dialog::backdrop{background:rgba(39,39,35,.42);background:color-mix(in srgb,var(--ink) 42%,transparent)}
.device-camera{position:fixed; inset:0; box-sizing:border-box; width:100%; height:100vh;height:100dvh; max-width:100%; max-height:none; margin:0; border:0; border-radius:0; padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom)); color:var(--paper); background:var(--ink); overflow:auto; overscroll-behavior:contain}
.device-camera[open]{display:flex; flex-direction:column; gap:10px}.device-camera::backdrop{background:var(--ink)}
.device-camera h2,.device-camera p{color:inherit;margin:0; flex:none; min-width:0; max-width:100%; overflow-wrap:anywhere}.device-camera-viewport{flex:1; min-width:0; min-height:120px; position:relative}
.device-camera video,.device-camera img{position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain}
.device-camera [hidden]{display:none!important}.device-camera-actions{display:flex; gap:10px; justify-content:center; flex-wrap:wrap; flex:none}
.device-camera-header,.device-camera-footer{display:flex;flex-direction:column;gap:10px;min-width:0;flex:none}
/* 仅身份证采用沉浸取景；完整画面contain，不把屏幕裁切误当作实际拍摄范围。 */
.device-camera-immersive[open]{display:grid;grid-template-rows:auto minmax(120px,1fr) auto;padding:0;gap:0}
.device-camera-immersive .device-camera-viewport{grid-area:1/1/4/2;min-height:0}
.device-camera-immersive.device-camera-preview .device-camera-viewport{grid-area:2/1}
.device-camera-immersive .device-camera-header{grid-area:1/1;z-index:1;padding:max(8px,env(safe-area-inset-top)) 12px 8px;background:rgba(39,39,35,.88);background:color-mix(in srgb,var(--ink) 88%,transparent)}
.device-camera-immersive .device-camera-footer{grid-area:3/1;z-index:1;padding:8px 12px max(8px,env(safe-area-inset-bottom));background:rgba(39,39,35,.88);background:color-mix(in srgb,var(--ink) 88%,transparent)}
.device-camera-immersive .device-camera-header h2{font-size:1rem}
.device-camera-immersive .device-camera-header [data-page-language]{margin:0}
@media(orientation:landscape){.device-camera-immersive .device-camera-header{flex-direction:row;align-items:center;justify-content:space-between}.device-camera-immersive .device-camera-footer{flex-direction:row;align-items:center;justify-content:space-between}.device-camera-immersive .device-camera-footer p{flex:1}.device-camera-immersive .device-camera-actions{flex-wrap:nowrap}}
.device-camera button{min-height:48px; padding:10px 24px; cursor:pointer; border:1px solid var(--wash); border-radius:var(--radius); background:var(--paper); color:var(--accent)}
.promiso-error-summary{padding:16px;border-left:2px solid var(--danger);background:var(--danger-soft);margin:16px 0;color:var(--danger)}
.promiso-error-summary p{margin:0 0 8px}.promiso-error-summary a{display:block;padding:8px 0;color:var(--danger)}
.promiso-field-error{font-size:.875rem;line-height:1.7;color:var(--danger);margin:6px 0}
[aria-invalid=true]{border-color:var(--danger)}
.promiso-support{border-top:1px solid var(--line);padding:20px 0;margin-top:var(--gap);font-size:.875rem}
.promiso-support p{margin:0 0 8px}.promiso-support a{display:inline-flex;align-items:center;min-height:44px}
.promiso-skip{position:fixed;top:8px;left:8px;z-index:10001;transform:translateY(-180%);padding:10px 18px;background:var(--paper);border:2px solid var(--accent)}
.promiso-skip:focus{transform:none}
@media(min-width:560px){[data-site=customer] h1,[data-site=customer] .wizard-title{font-size:1.75rem}}
@media(max-width:600px){.form-row,.form-grid{grid-template-columns:minmax(0,1fr)}.intake-profile-values{grid-template-columns:minmax(0,1fr)}.intake-profile-values dd{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.promiso-file{position:relative;display:flex;align-items:center;gap:12px;min-height:var(--control-height);padding:8px 12px;border:1px solid var(--input-line);border-radius:var(--radius);background:var(--paper);max-width:100%;min-width:0}
.promiso-file input[type=file]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.promiso-file-action{color:var(--accent);font-weight:600;flex-shrink:0}.promiso-file-name{font-size:.875rem;color:var(--muted);overflow-wrap:anywhere;min-width:0}
.promiso-file:focus-within{outline:2px solid var(--accent);outline-offset:4px}

/* 必填随原生required联动；显式已有标记的标签不重复生成。 */
label:not(:has(.required-mark,.pdpa-required-mark)):has(>input:required:not(:disabled),>select:required:not(:disabled),>textarea:required:not(:disabled))>span:first-of-type:not(.required-mark)::after{content:' *';color:var(--danger)}
@media(max-width:600px){[data-site] input:not([type=checkbox]):not([type=radio]):not([type=hidden]),[data-site] select,[data-site] textarea{font-size:1rem;min-width:0}fieldset{min-width:0}}

/* 错误既有文字又有状态，适用于输入、选择、上传和确认项。 */
input[aria-invalid=true],select[aria-invalid=true],textarea[aria-invalid=true],.photo-slot-box[aria-invalid=true]{border:1px solid var(--danger);background:var(--danger-soft);background:color-mix(in srgb,var(--danger) 7%,var(--paper));outline-color:var(--danger)}label:has(>input[type=checkbox][aria-invalid=true]){background:var(--danger-soft);background:color-mix(in srgb,var(--danger) 7%,var(--paper));border-radius:var(--radius)}

/* 非原生折叠按钮沿用同一三角，与导航菜单无关。 */
.disclosure-trigger::before{content:"";display:inline-block;border-block:5px solid transparent;border-inline-start:7px solid currentColor;margin-inline-end:9px;transform-origin:3px 5px}
.disclosure-trigger[aria-expanded="true"]::before{transform:rotate(90deg)}

/* 各环节完成反馈，沿用标准间距与可触控按钮。 */
.completion-panel{padding:24px 0;display:flex;flex-direction:column;align-items:flex-start;gap:16px}.completion-panel h2,.completion-panel p{margin:0}.completion-panel>*{min-width:0;max-width:100%;overflow-wrap:anywhere}.completion-panel h2{font-size:1.375rem}.completion-actions{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:16px}.completion-actions p{margin:0}.completion-records{margin-top:16px}.completion-records>summary{cursor:pointer;padding:12px 0;min-height:44px;box-sizing:border-box}

/* 完成反馈：图标居中，正文左对齐；标题仅供辅助技术，不重复视觉正文。 */
.completion-title{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.completion-panel{align-items:stretch;text-align:start}.completion-panel>img{align-self:center}
.completion-actions{align-items:stretch;width:100%;box-sizing:border-box}.completion-actions>.btn{width:100%;max-width:none;justify-content:center;text-align:center}
.completion-panel>.completion-actions{margin-top:0}

/* 专属进件码为按需阅读/下载弹窗；入口与门店语言切换同高同排。 */
.shop-qr-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;flex:0 0 auto;padding:2px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)}
.shop-qr-button img{display:block;width:100%;height:100%;object-fit:contain}
body[data-site=merchant] #language-slot{align-items:center;gap:8px}
.shop-qr-dialog{box-sizing:border-box;width:min(440px,calc(100vw - 24px));max-height:90vh;max-height:90dvh;overflow:auto;padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);color:var(--ink)}
.shop-qr-dialog::backdrop{background:rgb(0 0 0 / 35%)}
.shop-qr-dialog h2{font-size:1.15rem;margin:0 0 12px}
.shop-qr-image{display:block;width:100%;height:auto}
.shop-qr-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.shop-qr-dialog .shop-qr-actions :is(button,a){box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;width:auto;min-height:44px;height:auto;margin:0;padding:10px 14px;font-size:.875rem;line-height:22px;border:1px solid var(--line);border-radius:var(--radius);text-decoration:none}
.shop-qr-dialog .shop-qr-actions .btn-primary{background:var(--accent);color:var(--paper);border-color:var(--accent)}
.shop-qr-entry-error{font-size:.8rem;max-width:15rem;overflow-wrap:anywhere}