/* Source checkout appearance: stripe theme, 14px Manrope, 10px radius,
   11px 15px padding, 16px row spacing. Applied only to hosted-field adapter. */
.native-hosted-style{font-family:Manrope,sans-serif;font-size:14px;color:#1f2323}
.native-address-fields{display:flex;flex-direction:column;gap:0}.native-address-fields>.native-field-row{margin-bottom:16px}
.native-field-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10.5px}
.native-hosted-style label{min-width:0}
.native-hosted-style label>span,.native-phone-field>label{display:block;font-size:13.02px;margin-bottom:3.5px;line-height:14.973px}
.native-hosted-style input,.native-hosted-style label>div:has(select){height:40.1px;border:1px solid #e6e6e6;border-radius:10px;box-shadow:0 1px 1px rgba(0,0,0,.03),0 3px 6px rgba(0,0,0,.02);background:#fff;color:#1f2323}
.native-hosted-style input{padding:11px 15px;line-height:16.1px;font-family:inherit;font-size:14px;min-width:0}
.native-hosted-style select{font-family:inherit;font-size:14px}
.native-hosted-style input::placeholder{color:#737575;opacity:1}
.native-hosted-style input:focus,.native-hosted-style label>div:has(select:focus),.native-phone-control:focus-within{border-color:#1f2323;outline:none;box-shadow:0 0 0 1px #1f2323}
.native-hosted-style input[aria-invalid=true],.native-hosted-style input.border-red{border-color:#f85858;color:#f85858}
.native-hosted-style input:disabled{background:#fafafa;color:#30313d}
.native-phone-control{position:relative;display:flex;align-items:center;height:40.1px;border:1px solid #e6e6e6;border-radius:10px;box-shadow:0 1px 1px rgba(0,0,0,.03),0 3px 6px rgba(0,0,0,.02)}
.native-phone-country{position:relative;flex:0 0 auto;padding-left:15px}.native-phone-country select{position:absolute;z-index:2;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.native-phone-prefix{display:flex;align-items:center;white-space:nowrap;line-height:16.1px}.native-phone-dial{padding:0 7px}.native-phone-prefix svg{flex:none}
.native-phone-prefix img{width:16px;height:16px;object-fit:contain;flex:none}
.native-phone-control input{width:100%;min-width:0;border:0;box-shadow:none;padding-left:16px;height:38.1px;background:transparent}
.native-phone-control input:focus{box-shadow:none}
.native-phone-control:has(input[aria-invalid=true]){border-color:#f85858}
.native-field-error{font-size:13px;color:#f85858}
.native-contact input{width:100%}

/* M11: captured hosted errors; source components keep ownership of DOM. */
.native-hosted-style [role=alert]{font-size:13.02px;line-height:14.973px;margin-top:7px;color:#f85858}
.native-hosted-style label>div:has(select[aria-invalid=true]){border-color:#f85858}

/* M15: observed hosted fields: 3-character manual expansion, 350ms height transition. */
.native-address-expansion{display:grid;grid-template-rows:0fr;transition:grid-template-rows .35s}
.native-address-expansion.is-expanded{grid-template-rows:1fr}
.native-address-clip{min-height:0;overflow:hidden}
.native-address-more{display:flex;flex-direction:column;gap:16px;padding-top:16px}
.native-address-expansion:not(.is-expanded){visibility:hidden}
.native-address-more>.native-field-error{margin-top:-9px}
.native-hosted-style input{transition:background .15s,border .15s,box-shadow .15s,color .15s}

/* M16 source phone focus ring, flag, dial spacing and chevron. */
.native-phone-control{transition:border .15s,box-shadow .15s}
.native-phone-control:focus-within{border-color:#1f2323;outline:none;box-shadow:0 1px 1px rgba(0,0,0,.03),0 3px 6px rgba(0,0,0,.02),0 0 0 3px rgba(31,35,35,.25),0 1px 1px rgba(0,0,0,.08)}
.native-phone-control input:focus{border:0;outline:none;box-shadow:none}
.native-phone-control:has(input[aria-invalid=true]){border-color:#f85858}

/* M17 autofill: keep the source field shell and arrow above the native fill paint. */
.native-hosted-style label>div:has(select){isolation:isolate}
.native-hosted-style label>div>select{border-radius:inherit;padding-left:15px;padding-right:29px}
.native-hosted-style label>div:has(select)>div:has(img){z-index:21;pointer-events:none}

/* M18: source shipping frame CSS captured in source-initial.json. */
.native-phone-country{position:static}
.native-phone-country select{appearance:none;-webkit-appearance:none;border:0;border-radius:10px;padding:11px 15px;z-index:auto;color:#1f2323;font:inherit;box-sizing:border-box}
.native-phone-control input{position:relative}
.native-hosted-style input:not([name=phone]):-webkit-autofill,.native-hosted-style select:-webkit-autofill{-webkit-text-fill-color:#1f2323;box-shadow:0 1px 1px rgba(0,0,0,.03),0 3px 6px rgba(0,0,0,.02),0 0 0 100px white inset!important;transition:none!important}
.native-hosted-style input:not([name=phone]):-webkit-autofill:focus,.native-hosted-style select:-webkit-autofill:focus{box-shadow:0 1px 1px rgba(0,0,0,.03),0 3px 6px rgba(0,0,0,.02),0 0 0 3px rgba(31,35,35,.25),0 1px 1px rgba(0,0,0,.08),0 0 0 100px white inset!important}
.native-phone-control input:-webkit-autofill,.native-phone-control input:-webkit-autofill:focus,.native-phone-control input:-webkit-autofill:hover{-webkit-text-fill-color:#1f2323!important;transition:background-color 50000s,box-shadow 50000s,filter 50000s!important}

/* M19: State white surface also applies while Chrome previews a saved address.
   Do not depend on :autofill; preserve native select and address autocomplete. */
.native-hosted-style select[name="state"]{box-shadow:0 0 0 100px #fff inset!important}