/* AP Form 999 self-contained roles. Copyright (c) 2026 APPRIDE. GPL-2.0-or-later. */
.appride-contact-preview.appride-contact{font-family:var(--appride-font,system-ui,sans-serif);line-height:1.6;--appride-ink:#202020;--appride-paper:#fff;--appride-soft:#e3f8fc}
.appride-contact-preview [hidden]{display:none!important}
.appride-contact-preview .appride-contact-field{margin:0 0 21px;padding:0;border:0;min-width:0}
.appride-contact-preview .appride-contact-field :is(label,legend){display:block;margin:0 0 8px;font-size:14px;font-weight:500}
.appride-contact-preview .appride-contact-required{margin-left:7px;font-size:14px;font-weight:400}
.appride-contact-preview .appride-contact-field :is(input:not([type=checkbox]):not([type=radio]),select,textarea){box-sizing:border-box;width:100%;max-width:100%;min-height:48px;border:1px solid #39c7eb;border-radius:0;background:#fff;color:#202020;padding:12px;font:inherit;font-size:16px;font-weight:400;line-height:1.6}
.appride-contact-preview .appride-contact-field textarea{min-height:150px;resize:vertical}
.appride-contact-preview .appride-contact-check input{appearance:auto;width:20px;min-height:20px;margin:1px 0 0;padding:0;flex:0 0 auto}
.appride-contact-preview .appride-contact-check span{font-size:14px;line-height:1.65}
.appride-contact-preview .appride-contact-hint{margin:7px 0 16px;color:#202020;font-size:14px;line-height:1.65}
.appride-contact-preview .appride-contact-error{margin:7px 0;color:#b00018;font-size:14px;line-height:1.5}
.appride-contact-preview .appride-contact-field.is-error :is(input,select,textarea){border-color:#b00018}
.appride-contact-preview [data-apform-button]{box-sizing:border-box;display:inline-block;min-height:52px;padding:12px;font-size:14px;font-weight:500;line-height:1.6;text-align:center}
.appride-contact-preview button[data-apform-button]{width:100%}
.appride-contact-preview .appride-ui-actions{display:flex;flex-wrap:wrap;gap:12px;margin-block:12px}
.appride-contact-preview .appride-contact-confirmation h2{margin:0 0 15px;font-size:21px;line-height:1.5;font-weight:500}
.appride-contact-preview .appride-contact-confirmation dl{margin:20px 0}
.appride-contact-preview .appride-contact-confirmation dt{padding:13px 0 6px;border-top:1px solid;font-size:13px;font-weight:500}
.appride-contact-preview .appride-contact-confirmation dd{margin:0;padding:0 0 15px;font-size:14px;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere}
.appride-contact-preview .appride-ui-link{color:#202020;text-decoration:underline;text-underline-offset:.2em}

.appride-contact-preview {max-width:100%;min-width:0;overflow-wrap:anywhere}
.appride-contact-preview .appride-ui-input {box-sizing:border-box;max-width:100%}
.appride-contact-preview .appride-ui-actions {align-items:stretch}
.appride-contact-preview .appride-ui-actions .appride-ui-button {flex:1 1 15em;white-space:normal;width:auto}
.appride-contact-preview .appride-ui-button:disabled {cursor:wait;opacity:.65}
.appride-contact-preview .appride-role-heading {color:#202020}

/* Equal, non-interactive chevrons. Form settings supply the colors. */
.appride-contact-preview.appride-contact .appride-contact-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;list-style:none;padding:0;margin:28px 0 36px;background:transparent;isolation:isolate}
.appride-contact-preview.appride-contact .appride-contact-steps li{box-sizing:border-box;position:relative;margin:0;padding:14px 16px;text-align:center;font-size:clamp(14px,2.7vw,16px);line-height:1.5;min-width:0;border:0;white-space:nowrap;list-style:none}
.appride-contact-preview.appride-contact .appride-contact-steps li:not(:first-child){clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%,14px 50%);padding-left:24px}
.appride-contact-preview.appride-contact .appride-contact-steps li:first-child{clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%)}
.appride-contact-preview.appride-contact .appride-contact-steps li:last-child{clip-path:polygon(0 0,100% 0,100% 100%,0 100%,14px 50%)}
.appride-contact-preview.appride-contact .appride-contact-steps [aria-current=step]{font-weight:600}
.appride-contact-preview [data-contact-feedback]:focus,.appride-contact-preview [data-contact-result]:focus {outline:3px solid #202020;outline-offset:3px}
/* The embedded form inherits its page container; avoid applying main-page gutters twice. */
.appride-contact-preview.appride-contact {width:100%;max-width:100%;padding-bottom:0}

.appride-contact-preview fieldset.appride-contact-field {min-width:0;border:0;padding:0;margin-inline:0}
.appride-contact-preview .appride-contact-check {display:flex;align-items:flex-start;gap:.65em;margin-block:.7em}
.appride-contact-preview .appride-contact-check input {flex:0 0 auto;margin-top:.3em}
/* Template 02 is opt-in markup on newly created forms; saved forms keep their layout. */
.appride-contact-preview .apform-layout-inline .appride-contact-field{display:grid;grid-template-columns:150px minmax(0,1fr);column-gap:28px;align-items:start;margin:0 0 28px}
.appride-contact-preview .apform-layout-inline .appride-ui-label{padding-top:10px;font-weight:400}
.appride-contact-preview .apform-layout-inline .appride-contact-required{display:none}
.appride-contact-preview .apform-layout-inline .appride-contact-field:has([required])>.appride-ui-label .appride-contact-required{display:table;margin:5px 0 0;padding:1px 14px;background:#e90010;color:#fff;border-radius:8px;font-size:13px}
.appride-contact-preview .apform-layout-inline .appride-contact-field :is(input:not([type=checkbox]):not([type=radio]),textarea,select){border:1px solid #39c7eb;background:#fff;margin-top:0}
.appride-contact-preview .apform-layout-inline textarea.appride-ui-input{min-height:190px}
.appride-contact-preview .apform-layout-inline .appride-contact-error,.appride-contact-preview .apform-layout-inline .appride-contact-hint{grid-column:2}
@media(max-width:600px){.appride-contact-preview .apform-layout-inline .appride-contact-field{grid-template-columns:1fr;gap:8px}.appride-contact-preview .apform-layout-inline .appride-contact-error,.appride-contact-preview .apform-layout-inline .appride-contact-hint{grid-column:1}}

.appride-contact-preview .apform-layout-inline .appride-contact-field :is(input,select){min-height:46px}
.appride-contact-preview.appride-contact .apform-layout-inline>button.appride-ui-button{display:block;max-width:205px;margin:36px auto 0;background:#e3f8fc;color:#202020;border:1px solid #39c7eb;border-radius:7px}

/* Address remains one movable part; controls use the enclosing form's existing design. */
.appride-contact-preview .apform-address{min-width:0;width:100%;grid-column:2}
.appride-contact-preview .apform-address-label{display:block;font-size:.875em;margin:0 0 5px}
.appride-contact-preview .apform-address input{display:block;width:100%;margin-bottom:12px!important}
.appride-contact-preview .apform-address [data-address-status]{font-size:.875em;margin:8px 0}
.appride-contact-preview .apform-layout-inline .appride-ui-label:has(+.apform-address [required]) .appride-contact-required{display:table;margin:5px 0 0;padding:1px 14px;background:#e90010;color:#fff;border-radius:8px;font-size:13px}
@media(max-width:600px){.appride-contact-preview .apform-address{grid-column:1}}

/* Postal code only: keep the other two address rows full width, including standalone preview. */
.appride-contact-preview .apform-address input[data-address-zip]{box-sizing:border-box;width:160px!important;max-width:100%;margin-inline:0;justify-self:start}
/* Inline-form standard applies in both input and confirmation; explicit per-button settings still win. */
.appride-contact-preview.appride-contact button.apform-standard-button{background-color:#e3f8fc;border-color:#39c7eb}

/* AP Form surfaces are local to this form instance, including standalone previews. */
.appride-contact-preview.appride-contact{color:#202020;background:#fff;--appride-key:#39c7eb;--appride-line:#39c7eb;--appride-sub:#202020}
.appride-contact-preview.appride-contact .appride-contact-steps{color:var(--apform-steps-text);background:var(--apform-steps-background)}
.appride-contact-preview.appride-contact .appride-contact-steps li{color:var(--apform-steps-text);background:var(--apform-steps-background);border-color:var(--apform-steps-border)}
.appride-contact-preview.appride-contact .appride-contact-steps [aria-current=step]{color:var(--apform-steps-active-text);background:var(--apform-steps-active-background);border-color:var(--apform-steps-active-border)}
.appride-contact-preview.appride-contact .appride-contact-confirmation{color:var(--apform-confirm-text);background:var(--apform-confirm-background);border:1px solid var(--apform-confirm-border);padding:24px}
.appride-contact-preview.appride-contact .appride-contact-confirmation :is(h2,.appride-role-heading){color:var(--apform-confirm-heading);border-color:var(--apform-confirm-line)}
.appride-contact-preview.appride-contact .appride-contact-confirmation :is(p,dt,dd){color:var(--apform-confirm-text)}
.appride-contact-preview.appride-contact .appride-contact-confirmation :is(dl,dt,dd){border-color:var(--apform-confirm-line)}
.appride-contact-preview.appride-contact .appride-contact-confirmation dd{background:transparent;border-bottom:1px solid var(--apform-confirm-line);padding-bottom:12px}
.appride-contact-preview.appride-contact .apform-completion{color:var(--apform-complete-text);background:var(--apform-complete-background);border:1px solid var(--apform-complete-border);padding:24px}
.appride-contact-preview.appride-contact .apform-completion :is(h2,.appride-role-heading){color:var(--apform-complete-heading);border-color:var(--apform-complete-line);border-bottom:1px solid var(--apform-complete-line);padding-bottom:12px}
.appride-contact-preview.appride-contact .apform-completion p{color:var(--apform-complete-text)}
.appride-contact-preview.appride-contact .apform-complete-actions{margin-top:32px;display:flow-root}
.appride-contact-preview.appride-contact .apform-complete-actions form{margin:0}
.appride-contact-preview.appride-contact .appride-contact-notice{color:#202020;background:#e3f8fc;border:1px solid #39c7eb;padding:12px}
.appride-contact-preview.appride-contact :is(button,a)[data-apform-button]{color:var(--apform-action-color,#202020);background:var(--apform-action-background,#e3f8fc);border:1px solid var(--apform-action-border,#39c7eb);border-radius:var(--apform-action-radius,7px);font:inherit;cursor:pointer;text-decoration:none}
.appride-contact-preview.appride-contact [data-apform-button=confirm]{--apform-action-color:var(--apform-confirm-button-color);--apform-action-background:var(--apform-confirm-button-background);--apform-action-border:var(--apform-confirm-button-border)}
.appride-contact-preview.appride-contact [data-apform-button=back]{--apform-action-color:var(--apform-back-button-color);--apform-action-background:var(--apform-back-button-background);--apform-action-border:var(--apform-back-button-border)}
.appride-contact-preview.appride-contact [data-apform-button=send]{--apform-action-color:var(--apform-send-button-color);--apform-action-background:var(--apform-send-button-background);--apform-action-border:var(--apform-send-button-border)}
.appride-contact-preview.appride-contact [data-apform-button=reset]{--apform-action-color:var(--apform-reset-button-color);--apform-action-background:var(--apform-reset-button-background);--apform-action-border:var(--apform-reset-button-border)}
.appride-contact-preview.appride-contact :is(button,a)[data-apform-button]:is(:hover,:focus,:visited){color:var(--apform-action-color,#202020);background:var(--apform-action-background,#e3f8fc);border-color:var(--apform-action-border,#39c7eb)}
.appride-contact-preview.appride-contact :is(input,textarea,select,button,a,[data-contact-feedback],[data-contact-result]):focus-visible{outline:3px solid #202020;outline-offset:3px}

/* Dedicated one-column consent layout, independent of normal label/control grids. */
.appride-contact-preview.appride-contact .apform-layout-inline>:is(h2,h3,h4,h5,h6):has(+.apform-consent-field){text-align:center;margin-top:36px}
.appride-contact-preview.appride-contact .apform-layout-inline .apform-consent-field{display:flex;flex-direction:column;align-items:center;gap:0;text-align:center;margin:0 0 32px;width:100%}
.appride-contact-preview.appride-contact .apform-consent-field>.appride-ui-label{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;padding:0;margin:0 0 10px;width:auto}
.appride-contact-preview.appride-contact .apform-consent-field:has([required])>.appride-ui-label .appride-contact-required{display:inline-block;margin:0}
.appride-contact-preview.appride-contact .apform-consent-field>.appride-contact-hint{margin:0 0 12px}
.appride-contact-preview.appride-contact .apform-consent-field>.appride-contact-check{display:flex;align-items:flex-start;justify-content:center;gap:10px;width:fit-content;max-width:100%;margin:0;font-weight:400;text-align:left;cursor:pointer}
.appride-contact-preview.appride-contact .apform-consent-field>.appride-contact-check input{display:block;box-sizing:border-box;appearance:auto;width:20px;height:20px;min-height:20px;margin:2px 0 0;flex:0 0 20px;accent-color:var(--apform-control-focus,#202020)}
.appride-contact-preview.appride-contact .apform-consent-field>.appride-contact-check span{display:block;min-width:0;line-height:1.65;font-size:14px}
.appride-contact-preview.appride-contact .appride-contact-field :is(input:not([type=checkbox]):not([type=radio]),textarea,select){border-color:var(--apform-control-border,#39c7eb)}
.appride-contact-preview.appride-contact .appride-contact-field.is-error :is(input,textarea,select){border-color:#b00018}
.appride-contact-preview.appride-contact .appride-contact-notice{border-color:var(--apform-decoration-border,#39c7eb)}
.appride-contact-preview.appride-contact :is(input,textarea,select,button,a):focus-visible{outline:3px solid var(--apform-control-focus,#202020);outline-offset:3px}
.appride-contact-preview.appride-contact :is(input,textarea,select,button):focus{border-color:var(--apform-control-focus,#202020)}
/* Keep cut-out chevrons visible between equal inactive colors. */
.appride-contact-preview.appride-contact .appride-contact-steps{background:transparent}
.appride-contact-preview.appride-contact .apform-layout-inline>button.appride-ui-button{border-color:var(--apform-confirm-button-border,#39c7eb)}
.appride-contact-preview.appride-contact :is(input,textarea,select,button,a,[data-contact-feedback],[data-contact-result]):focus-visible{outline:3px solid var(--apform-control-focus,#202020);outline-offset:3px}

/* Border-colored outer chevron + inset fill keeps white standard stages visible. */
.appride-contact-preview.appride-contact .appride-contact-steps li{z-index:0;background:var(--apform-steps-border,#39c7eb)}
.appride-contact-preview.appride-contact .appride-contact-steps li::before{content:"";position:absolute;inset:1px;z-index:-1;background:var(--apform-steps-background,#fff);clip-path:inherit;pointer-events:none}
.appride-contact-preview.appride-contact .appride-contact-steps li[aria-current=step]{background:var(--apform-steps-active-border,#39c7eb)}
.appride-contact-preview.appride-contact .appride-contact-steps li[aria-current=step]::before{background:var(--apform-steps-active-background,#e3f8fc)}
.appride-contact-preview.appride-contact .apform-layout-inline>button.appride-ui-button[data-apform-button]{color:var(--apform-action-color,#202020);background:var(--apform-action-background,#e3f8fc);border-color:var(--apform-action-border,#39c7eb)}

/* Reply method shares field typography and colors; only its active contact is submitted. */
.appride-contact-preview .apform-reply-body{min-width:0}
.appride-contact-preview .apform-reply-choices{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center}
.appride-contact-preview .apform-reply-choices .appride-contact-check{display:inline-flex;align-items:center;gap:8px;margin:0;min-height:44px}
.appride-contact-preview .apform-reply-panel{height:0;opacity:0;overflow:hidden;visibility:hidden;transition:height .22s ease,opacity .22s ease,visibility .22s}
.appride-contact-preview .apform-reply-panel.is-open{height:auto;opacity:1;visibility:visible}
.appride-contact-preview .apform-reply-inner{padding-top:14px;padding-bottom:3px}
.appride-contact-preview .apform-reply-panel.is-error input{border-color:#b00018}
.appride-contact-preview .apform-reply-body .appride-contact-error{margin:7px 0 0}
@media(prefers-reduced-motion:reduce){.appride-contact-preview .apform-reply-panel{transition:none}}

.appride-contact-preview .apform-reply > .appride-ui-label{font-size:14px;font-weight:500;margin-bottom:8px}
.appride-contact-preview .apform-layout-inline .apform-reply-body{grid-column:2}
.appride-contact-preview .apform-layout-inline .apform-reply .appride-contact-check input{min-height:20px;height:20px;margin:0}
@media(max-width:600px){.appride-contact-preview .apform-layout-inline .apform-reply-body{grid-column:1}}

/* Result headings only: balanced line box; the existing focus outline stays visible. */
.appride-contact-preview.appride-contact :is(.appride-contact-confirmation,.apform-completion)>h2[data-contact-result]{
 box-sizing:border-box;
 margin:0 0 16px;
 padding:6px 8px;
 border:0;
 font-size:21px;
 font-weight:500;
 line-height:1.5;
 text-align:center;
 overflow-wrap:anywhere;
}
.appride-contact-preview.appride-contact :is(.appride-contact-confirmation,.apform-completion)>h2[data-contact-result]+p{
 margin-block-start:0;
}