[data-form-surface]{--apf-label-min:9ch;--apf-row-gap:calc(1rem * var(--apf-density,1));align-content:flex-start;gap:var(--apf-row-gap);color:var(--color-text);background-color:var(--color-surface);border:var(--apf-border-width,1px) solid var(--color-border);border-radius:var(--apf-radius-card,.5rem);font-family:var(--apf-font-body);font-size:var(--apf-font-size,14px);font-weight:var(--apf-font-body-weight,400);box-shadow:var(--apf-shadow-card,0 0 0 0 transparent);--apf-transition:calc(var(--apf-motion-duration,150) * 1ms) var(--apf-motion-easing,ease);flex-wrap:wrap;padding:1rem;display:flex;container:form-surface/inline-size}[data-form-surface][data-border-card=none]{border-width:0}[data-form-surface][data-border-card=sheen]{--apf-fill:var(--color-surface);background-image:linear-gradient(var(--apf-fill), var(--apf-fill)), linear-gradient(to bottom, var(--apf-color-sheen,#ffffff4d), transparent);box-shadow:var(--apf-shadow-card,0 0 0 0 transparent), inset 0 1px 0 color-mix(in srgb, var(--apf-color-sheen,#ffffff4d) 45%, transparent);background-origin:border-box;background-clip:padding-box,border-box;border:1px solid #0000}[data-form-surface][data-border-card=sheen][data-background=glass]{--apf-fill:color-mix(in srgb, var(--color-surface) 55%, transparent)}[data-form-stage]{box-sizing:border-box;background-image:radial-gradient(ellipse 70% 55% at 50% 22%, var(--apf-color-glow,transparent), transparent 100%);background-repeat:no-repeat;padding:1.5rem}[data-form-stage][data-background=solid]{background-color:var(--apf-color-background,transparent)}[data-form-stage][data-background=gradient]{background-image:radial-gradient(ellipse 70% 55% at 50% 22%, var(--apf-color-glow,transparent), transparent 100%), linear-gradient(calc(var(--apf-background-angle,135) * 1deg), var(--apf-background-from,transparent), var(--apf-background-to,transparent))}[data-form-stage][data-background=transparent][data-glow=none]{padding:0}[data-form-surface][data-background=transparent]{background-color:#0000}[data-form-surface][data-background=glass]{background-color:color-mix(in srgb, var(--color-surface) 55%, transparent);-webkit-backdrop-filter:blur(var(--apf-background-blur,16px)) saturate(1.4);backdrop-filter:blur(var(--apf-background-blur,16px)) saturate(1.4)}.apf-block{flex-basis:var(--apf-block-basis,100%);border-radius:.5rem;container:form-field/inline-size}[data-form-surface] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){--apf-control-fill:var(--color-surface-elevated);background-color:var(--apf-control-fill);border:var(--apf-border-width,1px) solid var(--color-border);border-radius:var(--apf-radius-control,.5rem);box-shadow:var(--apf-shadow-control,0 0 0 0 transparent);color:inherit;padding-block:calc(.5rem * var(--apf-density,1));transition:border-color var(--apf-transition,.15s), box-shadow var(--apf-transition,.15s), background-color var(--apf-transition,.15s);font-family:inherit}[data-form-surface] :is(input:not([type=checkbox]):not([type=radio]),textarea){padding-inline:calc(.75rem * var(--apf-density,1))}[data-form-surface] select{padding-left:calc(.75rem * var(--apf-density,1))}[data-form-surface] :is(input,select,textarea)::placeholder{color:var(--color-text-muted);opacity:1}[data-form-surface] :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus,[data-motion-demo=focus] [data-form-surface] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){border-color:var(--apf-color-focus-ring,var(--color-primary));box-shadow:var(--apf-shadow-control,0 0 0 0 transparent), 0 0 0 3px color-mix(in srgb, var(--apf-color-focus-ring,var(--color-primary)) 25%, transparent);outline:none}[data-form-surface] button:focus-visible{outline:2px solid var(--apf-color-focus-ring,var(--color-primary));outline-offset:2px}[data-form-surface][data-input-style=line] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){border-width:0 0 var(--apf-border-width,1px) 0;box-shadow:none;background-color:#0000;border-radius:0;padding-left:0;padding-right:0}[data-form-surface][data-input-style=line] select{padding-right:2.5rem}[data-form-surface][data-input-style=line] :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus,[data-motion-demo=focus] [data-form-surface][data-input-style=line] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){box-shadow:0 1px 0 0 var(--apf-color-focus-ring,var(--color-primary))}[data-form-surface][data-input-style=filled] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){--apf-control-fill:var(--color-surface-raised);border-color:#0000}[data-form-surface][data-input-style=filled] :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus,[data-motion-demo=focus] [data-form-surface][data-input-style=filled] :is(input:not([type=checkbox]):not([type=radio]),select,textarea){--apf-control-fill:var(--color-surface-elevated);border-color:var(--apf-color-focus-ring,var(--color-primary))}[data-form-surface][data-border-control=none]:not([data-input-style=line]) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){padding-block:calc(.5rem * var(--apf-density,1) + var(--apf-border-width,1px));border:0}[data-form-surface][data-border-control=none]:not([data-input-style=line]) :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus,[data-motion-demo=focus] [data-form-surface][data-border-control=none]:not([data-input-style=line]) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){box-shadow:var(--apf-shadow-control,0 0 0 0 transparent), 0 0 0 2px var(--apf-color-focus-ring,var(--color-primary))}[data-form-surface][data-border-control=sheen]:not([data-input-style=line]) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){background-image:linear-gradient(var(--apf-control-fill), var(--apf-control-fill)), linear-gradient(to bottom, var(--apf-color-sheen,#ffffff4d), transparent);box-shadow:var(--apf-shadow-control,0 0 0 0 transparent), inset 0 1px 0 color-mix(in srgb, var(--apf-color-sheen,#ffffff4d) 40%, transparent);background-origin:border-box;background-clip:padding-box,border-box;border:1px solid #0000}[data-form-surface][data-border-control=sheen]:not([data-input-style=line]) :is(input:not([type=checkbox]):not([type=radio]),select,textarea):focus,[data-motion-demo=focus] [data-form-surface][data-border-control=sheen]:not([data-input-style=line]) :is(input:not([type=checkbox]):not([type=radio]),select,textarea){border-color:var(--apf-color-focus-ring,var(--color-primary));box-shadow:var(--apf-shadow-control,0 0 0 0 transparent), 0 0 0 3px color-mix(in srgb, var(--apf-color-focus-ring,var(--color-primary)) 25%, transparent)}[data-form-surface][data-border-control=sheen]:not([data-input-style=line]) select:not([type=checkbox]):not([type=radio]){background-image:var(--apf-select-chevron), linear-gradient(var(--apf-control-fill), var(--apf-control-fill)), linear-gradient(to bottom, var(--apf-color-sheen,#ffffff4d), transparent);background-position:right .75rem center,0 0,0 0;background-repeat:no-repeat;background-size:1rem,auto,auto;background-origin:padding-box,border-box,border-box;background-clip:padding-box,padding-box,border-box}[data-form-surface] :where(.text-sm){font-size:1em}[data-form-surface] :where(.text-xs){font-size:.85em}[data-form-surface] :is(label,.font-medium){font-weight:var(--apf-font-label-weight,500)}[data-form-surface] :is(h1,h2,h3,h4,h5,h6){font-family:var(--apf-font-heading);font-weight:var(--apf-font-heading-weight,600);font-size:calc(var(--apf-font-size,14px) * var(--apf-font-heading-scale,1.25))}[data-form-surface] button[type=submit]{--apf-button-fill:var(--color-primary);background-color:var(--apf-button-fill);color:var(--apf-color-on-accent,#fff);border-radius:var(--apf-radius-button,.5rem);box-shadow:var(--apf-shadow-button,0 0 0 0 transparent);border:var(--apf-border-width,1px) solid var(--apf-button-fill);padding-block:calc(.625rem * var(--apf-density,1) - var(--apf-border-width,1px));transition:background-color var(--apf-transition,.15s), box-shadow var(--apf-transition,.15s), transform var(--apf-transition,.15s);font-family:inherit}[data-form-surface] button[type=submit]:hover:not(:disabled),[data-motion-demo=hover] [data-form-surface] button[type=submit]{--apf-button-fill:var(--color-primary-dark);box-shadow:var(--apf-shadow-button-hover,0 0 0 0 transparent);transform:translateY(calc(-1 * var(--apf-motion-hover-lift,0px)))}[data-form-surface][data-border-button=none] button[type=submit]{padding-block:calc(.625rem * var(--apf-density,1));border:0}[data-form-surface][data-border-button=sheen] button[type=submit]{padding-block:calc(.625rem * var(--apf-density,1) - 1px);background-image:linear-gradient(var(--apf-button-fill), var(--apf-button-fill)), linear-gradient(to bottom, var(--apf-color-sheen,#ffffff4d), transparent);box-shadow:var(--apf-shadow-button,0 0 0 0 transparent), inset 0 1px 0 color-mix(in srgb, var(--apf-color-sheen,#ffffff4d) 45%, transparent);background-origin:border-box;background-clip:padding-box,border-box;border:1px solid #0000}[data-form-surface][data-border-button=sheen] button[type=submit]:hover:not(:disabled),[data-motion-demo=hover] [data-form-surface][data-border-button=sheen] button[type=submit]{box-shadow:var(--apf-shadow-button-hover,0 0 0 0 transparent), inset 0 1px 0 color-mix(in srgb, var(--apf-color-sheen,#ffffff4d) 45%, transparent)}@keyframes apf-enter-fade{0%{opacity:0}}@keyframes apf-enter-rise{0%{opacity:0;transform:translateY(16px)}}@keyframes apf-enter-scale{0%{opacity:0;transform:scale(.96)}}[data-form-stage]:is([data-entrance=fade],[data-entrance=rise],[data-entrance=scale])>[data-form-surface]{animation-duration:calc(var(--apf-motion-duration,150) * 3ms);animation-timing-function:var(--apf-motion-easing,ease);animation-fill-mode:backwards}[data-form-stage][data-entrance=fade]>[data-form-surface]{animation-name:apf-enter-fade}[data-form-stage][data-entrance=rise]>[data-form-surface]{animation-name:apf-enter-rise}[data-form-stage][data-entrance=scale]>[data-form-surface]{animation-name:apf-enter-scale}@media (prefers-reduced-motion:reduce){[data-form-surface]{--apf-motion-duration:0!important;--apf-motion-hover-lift:0px!important}[data-form-stage]>[data-form-surface]{animation:none!important}}[data-form-surface][data-label-alignment=left] div:has(>label){grid-template-columns:minmax(min(var(--apf-label-min), 50%), var(--apf-label-width,30%)) minmax(0, 1fr);align-items:start;column-gap:12px;display:grid}@container form-surface (width<=480px){[data-form-surface] .apf-block{flex-basis:100%}[data-form-surface][data-label-alignment=left] div:has(>label){display:block}[data-form-surface][data-label-alignment=left] div:has(>label)>label{margin-bottom:.25rem;padding-top:0}}@container form-field (width<=180px){[data-form-surface][data-label-alignment=left] div:has(>label){display:block}[data-form-surface][data-label-alignment=left] div:has(>label)>label{margin-bottom:.25rem;padding-top:0}}[data-form-surface][data-label-alignment=left] div:has(>label)>label{padding-top:calc(.5rem * var(--apf-density,1));grid-area:1/1;margin-bottom:0;line-height:1.25rem}[data-form-surface][data-label-alignment=left] div:has(>label>input[type=checkbox]){display:flex}[data-form-surface][data-label-alignment=left] div:has(>label)>:not(label){grid-column:2}[data-form-surface] :is(label,span,p,legend,h1,h2,h3,h4,h5,h6,li,strong,em,a):not([role=alert]){color:inherit}[data-form-surface] :is(div,section,fieldset,h1,h2,h3,h4,h5,h6,hr){border-color:var(--color-border)}[data-form-surface] :is([role=radio],[role=checkbox]){background-color:var(--color-surface-elevated);border-color:var(--color-border);border-radius:var(--apf-radius-control,.5rem);color:inherit}[data-form-surface] :is([role=radio],[role=checkbox])[aria-checked=true]{border-color:var(--color-primary);background-color:var(--color-primary-light)}[data-form-surface] [role=group]>label:has(>input[type=checkbox]){background-color:var(--color-surface-elevated);border-color:var(--color-border);border-radius:var(--apf-radius-control,.5rem);color:inherit}[data-form-surface] [role=group]>label:has(>input[type=checkbox]:checked){border-color:var(--color-primary);background-color:var(--color-primary-light)}[data-form-surface] input[type=checkbox]{background-color:var(--color-surface-elevated);border-color:var(--color-border);box-shadow:none;padding:0}[data-form-surface] input[type=checkbox]:checked{background-color:var(--color-primary);border-color:var(--color-primary)}
