/* Shared default appearance for Studio-native form drafts (canvas and frontend). */
.al-native-form{display:flex;flex-direction:column;gap:12px;width:100%;max-width:100%;font-family:inherit;color:inherit}
.al-native-form .al-native-form-heading{display:block;margin:0 0 4px;font-size:20px;font-weight:600;line-height:1.35;font-family:inherit;color:inherit}
.al-native-form .al-native-form-field{display:flex;flex-direction:column;align-items:stretch;gap:6px;min-width:0;margin:0}
.al-native-form .al-native-form-field>label{display:block;margin:0;font-size:14px;font-weight:500;line-height:1.4;font-family:inherit;color:inherit}
.al-native-form .al-native-form-field>label span{color:#c03950}
.al-native-form .al-native-form-field>input:not([type=checkbox]),.al-native-form .al-native-form-field>textarea,.al-native-form .al-native-form-field>select{box-sizing:border-box;display:block;width:100%;max-width:100%;min-width:0;min-height:42px;padding:10px 12px;margin:0;background:#fff;color:#202631;border:1px solid #aeb8c5;border-radius:6px;box-shadow:none;font-size:15px;font-weight:400;line-height:1.5;font-family:inherit;opacity:1;-webkit-text-fill-color:#202631}
.al-native-form .al-native-form-field>textarea{min-height:120px;resize:vertical}
.al-native-form .al-native-form-field>input[type=checkbox]{width:18px;height:18px;min-height:18px;margin:4px 0 0;opacity:1;accent-color:var(--al-color-brand,#5b35ad)}
.al-native-form .al-native-form-submit{display:block;margin:4px 0 0}
.al-native-form .al-native-form-submit>button{display:inline-block;box-sizing:border-box;width:auto;min-height:42px;margin:0;padding:10px 22px;border:1px solid transparent;border-radius:6px;background:var(--al-color-brand,#5b35ad);color:#fff;font-size:15px;font-weight:600;line-height:1.45;font-family:inherit;box-shadow:none;opacity:1;-webkit-text-fill-color:#fff;cursor:not-allowed}
.al-native-form .al-native-form-note{margin:0;padding:10px 12px;border-left:3px solid #b88d36;background:#fff8e9;color:#5e4725;font-size:13px;font-weight:400;line-height:1.5;font-family:inherit;opacity:1}

/* Native form fields are usable for entry testing; submission remains unavailable. */
.al-native-form .al-native-form-field>input:not(:disabled),.al-native-form .al-native-form-field>textarea:not(:disabled),.al-native-form .al-native-form-field>select:not(:disabled){cursor:text}
.al-native-form .al-native-form-field>select:not(:disabled),.al-native-form .al-native-form-field>input[type=checkbox]:not(:disabled){cursor:pointer}

.al-native-form .al-native-form-hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.al-native-form .al-native-form-submit>button{cursor:pointer}
.al-native-form .al-native-form-submit>button:disabled{opacity:.55;cursor:wait}
.al-native-form .al-native-form-feedback:not([hidden]){display:block;padding:12px;border-radius:6px;background:#eef8f0;color:#17592b;border:1px solid #b4dfbf}
.al-native-form .al-native-form-feedback[data-error="1"]{background:#fff1f1;color:#8a2020;border-color:#e6b4b4}

/* Scoped submit state: never inherit a full-page spinner or hide status messages. */
.al-native-form .al-native-form-submit>button{pointer-events:auto;cursor:pointer;position:relative}
.al-native-form .al-native-form-submit>button[aria-busy="true"]{cursor:progress;opacity:.75}
.al-native-form .al-native-form-submit>button:not([aria-busy="true"])::before,.al-native-form .al-native-form-submit>button:not([aria-busy="true"])::after{animation:none}
.al-native-form .al-native-form-feedback[hidden]{display:none!important}

/* Additional native form controls */
.al-native-form .al-native-radio{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:400;margin:4px 0}
.al-native-form .al-native-radio input{width:18px;height:18px;accent-color:var(--al-color-brand,#5b35ad);flex:none}
.al-native-form .al-native-form-field>input[type=file]{height:auto;min-height:42px}

/* Conditional visibility must override display rules set on form fields. */
.al-native-form .al-native-form-field[hidden]{display:none!important;}

/* Native multistep navigation — isolated from one-page form styling. */
.al-native-form [data-al-form-step][hidden],.al-native-form .al-native-form-submit[hidden],.al-native-form .al-native-form-step-nav button[hidden]{display:none!important}
.al-native-form .al-native-form-progress{font-size:14px;font-weight:600;padding:9px 0;margin:8px 0 18px;border-bottom:2px solid currentColor}
.al-native-form .al-native-form-progress[hidden]{display:none!important}
.al-native-form .al-native-form-step-nav{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:16px}
.al-native-form .al-native-form-step-nav button{background:var(--al-color-brand,#121725);color:#fff;border:0;padding:11px 22px;border-radius:6px;cursor:pointer}
.al-native-form .al-native-form-step-nav button:focus-visible{outline:3px solid #527df9;outline-offset:3px}

/* Multi-step labelled progress, preserving the Studio brand colour and accessible text. */
.al-native-form .al-native-form-progress-track{display:block;width:100%;height:6px;overflow:hidden;border-radius:999px;background:#dce1e9;margin-top:10px}
.al-native-form .al-native-form-progress-fill{display:block;height:100%;border-radius:999px;background:var(--al-color-brand,#121725);transition:width .18s ease}
@media(prefers-reduced-motion:reduce){.al-native-form .al-native-form-progress-fill{transition:none}}

/* v1.0.296: shared native Form Design overrides. Each custom property is scoped to its form. */
.al-native-form{gap:var(--al-form-gap,12px)}
.al-native-form .al-native-form-field>label{font-size:var(--al-form-label-size,14px);color:var(--al-form-label-color,inherit)}
.al-native-form .al-native-form-field>input:not([type=checkbox]):not([type=radio]),
.al-native-form .al-native-form-field>select,
.al-native-form .al-native-form-field>textarea{font-size:var(--al-form-input-size,15px);padding:var(--al-form-input-padding,10px) var(--al-form-input-padding,12px);border-radius:var(--al-form-input-radius,6px);border-width:var(--al-form-input-border-width,1px);border-color:var(--al-form-input-border,#aeb8c5);background:var(--al-form-input-bg,#fff);color:var(--al-form-input-color,#202631);-webkit-text-fill-color:var(--al-form-input-color,#202631)}
.al-native-form .al-native-form-field>input:focus-visible,
.al-native-form .al-native-form-field>select:focus-visible,
.al-native-form .al-native-form-field>textarea:focus-visible,
.al-native-form .al-native-form-submit>button:focus-visible,
.al-native-form .al-native-form-step-nav button:focus-visible{outline:2px solid var(--al-form-focus,#527df9);outline-offset:2px}
.al-native-form .al-native-form-submit>button{font-size:var(--al-form-button-size,15px);border-radius:var(--al-form-button-radius,6px);padding:var(--al-form-button-padding,10px) var(--al-form-button-padding,22px);background:var(--al-form-button-bg,var(--al-color-brand,#5b35ad));color:var(--al-form-button-color,#fff);-webkit-text-fill-color:var(--al-form-button-color,#fff)}
.al-native-form .al-native-form-submit>button:hover:not(:disabled){background:var(--al-form-button-hover-bg,var(--al-form-button-bg,var(--al-color-brand,#5b35ad)));color:var(--al-form-button-hover-color,var(--al-form-button-color,#fff));-webkit-text-fill-color:var(--al-form-button-hover-color,var(--al-form-button-color,#fff))}
.al-native-form .al-native-form-feedback:not([hidden]){background:var(--al-form-success-bg,#eef8f0);color:var(--al-form-success-color,#17592b)}
.al-native-form .al-native-form-feedback[data-error="1"]{background:var(--al-form-error-bg,#fff1f1);color:var(--al-form-error-color,#8a2020)}
.al-native-form .al-native-form-progress-fill{background:var(--al-form-button-bg,var(--al-color-brand,#121725))}
.al-native-form .al-native-form-progress-track{height:var(--al-form-progress-height,6px)}
.al-native-form .al-native-form-step-nav button{background:var(--al-form-button-bg,var(--al-color-brand,#121725));color:var(--al-form-button-color,#fff);border-radius:var(--al-form-button-radius,6px)}

/* v1.0.301: responsive form grid. Existing forms remain single-column. */
.al-native-form{display:grid;grid-template-columns:repeat(var(--al-form-cols-desktop,1),minmax(0,1fr));column-gap:var(--al-form-column-gap,12px);row-gap:var(--al-form-row-gap,var(--al-form-gap,12px));align-items:start}
.al-native-form>.al-native-form-field{grid-column:span min(var(--al-form-span-desktop,1),var(--al-form-cols-desktop,1));min-width:0}
.al-native-form>.al-native-form-heading,.al-native-form>.al-native-form-feedback,.al-native-form>.al-native-form-progress,.al-native-form>.al-native-form-note,.al-native-form>.al-native-form-step-nav,.al-native-form>.al-native-form-submit,.al-native-form>.al-native-form-hp,.al-native-form>input[type=hidden],.al-native-form>.al-native-recaptcha{grid-column:1/-1}
@media(max-width:1023px){.al-native-form{grid-template-columns:repeat(var(--al-form-cols-tablet,1),minmax(0,1fr))}.al-native-form>.al-native-form-field{grid-column:span min(var(--al-form-span-tablet,1),var(--al-form-cols-tablet,1))}}
@media(max-width:767px){.al-native-form{grid-template-columns:repeat(var(--al-form-cols-mobile,1),minmax(0,1fr))}.al-native-form>.al-native-form-field{grid-column:span min(var(--al-form-span-mobile,1),var(--al-form-cols-mobile,1))}}

/* v1.0.313: Keep canvas and frontend global form-button styles driven by the
   same editable global presets. Do not override with fixed palette colours. */
.al-native-form .al-native-form-submit>button.al-form-global-button{
 min-height:44px;-webkit-text-fill-color:currentColor;
 transition:background-color .15s ease,color .15s ease,border-color .15s ease;
}