/* Shared motion skin. Native dialog movement belongs exclusively to the runtime. */
:root {
  --mauto-motion-duration: 420ms;
  --mauto-motion-exit-duration: 220ms;
  --mauto-motion-micro-duration: 160ms;
  --mauto-motion-ease: cubic-bezier(.2,.8,.2,1);
  --mauto-motion-edge: rgba(37,49,65,.10);
  --mauto-motion-shadow: 0 24px 64px -20px rgba(20,27,37,.24), 0 6px 18px -8px rgba(20,27,37,.08);
  --mauto-motion-focus: #243c55;
  --mauto-motion-pearl: linear-gradient(rgba(255,255,255,.955),rgba(255,255,255,.955)),url('../img/pearl-card-backgrounds/pearl-blue-card-wide.png');
}
html body.mauto-ui-v1 :is(dialog[data-mauto-platform-sheet],dialog.mauto-select-sheet,[data-mauto-sheet-surface],[data-mauto-motion-surface="popover"]) {
  color: #172d43;
  border-color: var(--mauto-motion-edge) !important;
  background-color: #fdfefe !important;
  background-image: var(--mauto-motion-pearl) !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  box-shadow: var(--mauto-motion-shadow) !important;
}
/* Leave roadside's nested scroll, drag, expansion and sheet surface geometry intact. */
html body :is(dialog[data-mauto-platform-sheet],dialog.mauto-select-sheet):not(.rm-sheet):not([data-mauto-motion="lightbox"]) {
  position: fixed !important;
  inset: auto 0 0 !important;
  width: min(100%,640px) !important;
  max-width: 640px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  max-height: min(90dvh,calc(var(--mauto-sheet-viewport,100dvh) - max(12px,env(safe-area-inset-top)))) !important;
  margin: 0 auto !important;
  border: 1px solid var(--mauto-motion-edge) !important;
  border-bottom: 0 !important;
  border-radius: 27px 27px 0 0 !important;
  overscroll-behavior: contain;
  scroll-padding-bottom: max(24px,env(safe-area-inset-bottom));
}
html body :is(dialog[data-mauto-platform-sheet],dialog.mauto-select-sheet,[data-mauto-sheet-surface]):focus:not(:focus-visible) { outline: none !important; }
html body dialog[data-mauto-motion][open],
html body dialog[data-mauto-motion][data-mauto-motion-state][open] {
  animation: none !important;
  transition: none !important;
}
html body.mauto-ui-v1 [data-mauto-motion] { opacity: 1; }
html body.mauto-ui-v1 dialog[data-mauto-motion]:focus { outline: none !important; }
html body [data-mauto-motion-ghost]::backdrop { background: transparent !important; animation: none !important; backdrop-filter: none !important; }
html body [data-mauto-motion-ghost],html body [data-mauto-motion-ghost] * { pointer-events: none !important; }
html body.mauto-ui-v1 dialog[data-mauto-platform-sheet] :is(header,footer,.cm-sheet-head,.cm-sheet-actions,.pm-sheet-header,.pm-sheet-actions) { box-shadow: none !important; }
html body dialog[data-mauto-motion-state="closing"] { --mauto-motion-duration: 220ms; }
html body dialog[data-mauto-motion][open]::backdrop {
  background: rgba(24,31,41,.28) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1;
  transition: opacity var(--mauto-motion-duration) var(--mauto-motion-ease);
}
html body dialog[data-mauto-motion-state="closing"]::backdrop { opacity: 0; }
@starting-style {
  html body dialog[data-mauto-motion][open]::backdrop { opacity: 0; }
}
/* Remove coloured halos at the sheet boundary without touching form layouts. */
html body :is(dialog[data-mauto-platform-sheet],dialog.mauto-select-sheet,[data-mauto-sheet-surface]):focus-within { box-shadow: var(--mauto-motion-shadow) !important; }
html body :is(.mauto-platform-sheet__close,.mauto-select-sheet__close) { background-color: #f0f2f5; color: #35465a; }
html body :is(.mauto-platform-sheet__handle,.mauto-select-sheet__handle)>span { background: #cbd0d6; }
html body dialog.mauto-select-sheet .mauto-premium-select__option { background: #f3f5f7; border-color: transparent; }
html body dialog.mauto-select-sheet .mauto-premium-select__option[aria-selected="true"] { background: #edf3f9; border-color: #d9e2ec; color:var(--mauto-ds-color-primary,#3c78da); }
html body.mauto-ui-v1 :is(button,a,input,textarea,select,summary,[role="button"]) {
  transition-property: background-color,border-color,box-shadow,color,opacity !important;
  transition-duration: var(--mauto-motion-micro-duration) !important;
  transition-timing-function: var(--mauto-motion-ease) !important;
}
/* Keyboard focus stays visible. Pointer focus never draws a frame around a dialog. */
html body.mauto-ui-v1 :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible {
  outline: 2px solid var(--mauto-motion-focus) !important;
  outline-offset: 2px;
  box-shadow: none !important;
}
html body :is(dialog[data-mauto-motion],dialog[data-mauto-platform-sheet],dialog.mauto-select-sheet):focus-visible {
  outline: 2px solid var(--mauto-motion-focus) !important;
  outline-offset: -3px;
}
/* Opt in only independent controls; individual translate preserves their transforms. */
html body :is([data-mauto-motion-press],.mauto-platform-sheet__close,.mauto-select-sheet__close) {
  transition-property: background-color,border-color,box-shadow,color,opacity,translate !important;
  transition-duration: var(--mauto-motion-micro-duration) !important;
  transition-timing-function: var(--mauto-motion-ease) !important;
}
html body :is([data-mauto-motion-press],.mauto-platform-sheet__close,.mauto-select-sheet__close):active:not(:disabled):not([aria-disabled="true"]) { translate: 0 1px; }
@media (min-width:768px) {
  html body :is(dialog[data-mauto-platform-sheet],dialog.mauto-select-sheet):not(.rm-sheet):not([data-mauto-motion="lightbox"]) {
    inset: 0 !important;
    height: fit-content !important;
    width: min(640px,calc(100vw - 48px)) !important;
    max-width: 640px !important;
    max-height: min(90dvh,calc(var(--mauto-sheet-viewport,100dvh) - 48px)) !important;
    margin: auto !important;
    border: 1px solid var(--mauto-motion-edge) !important;
    border-radius: 27px !important;
  }
  html body #mauto-insurance-dialog:not([hidden]) { align-items: center !important; }
  html body #mauto-insurance-dialog [data-mauto-sheet-surface] {
    align-self: center !important;
    width: min(640px,calc(100vw - 48px)) !important;
    max-width: 640px !important;
    max-height: min(90dvh,calc(var(--mauto-sheet-viewport,100dvh) - 48px)) !important;
    margin: auto !important;
    border-radius: 27px !important;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
}
@media (max-width:767px) {
  html body :is(dialog[data-mauto-platform-sheet],dialog.mauto-select-sheet):not(.rm-sheet):not([data-mauto-motion="lightbox"]) { max-width: 100% !important; }
  html body dialog.mauto-select-sheet { padding-bottom: env(safe-area-inset-bottom); }
}
/* Insurance already owns a cancellable close timer; retain that lifecycle. */
html body #mauto-insurance-dialog .insurance-panel {
  animation: none !important;
  transform: none !important;
  translate: 0 44px;
  opacity: 0;
  transition: translate 220ms var(--mauto-motion-ease),opacity 180ms ease !important;
  outline: none !important;
}
html body #mauto-insurance-dialog.is-open .insurance-panel {
  translate: 0 0;
  opacity: 1;
  transition-duration: 420ms,260ms !important;
}
html body #mauto-insurance-dialog .insurance-backdrop { background: rgba(24,31,41,.28) !important; backdrop-filter: none !important; }
@media(max-width:767px) { html body #mauto-insurance-dialog:not(.is-open) .insurance-panel { translate: 0 100%; } }
@media (prefers-reduced-motion:reduce) {
  :root { --mauto-motion-duration: 0ms; --mauto-motion-exit-duration: 0ms; --mauto-motion-micro-duration: 0ms; }
  html body dialog[data-mauto-motion-state="closing"] { --mauto-motion-duration: 0ms; }
  html body dialog[data-mauto-motion],
  html body dialog[data-mauto-motion]::backdrop { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  html body :is([data-mauto-motion-press],.mauto-platform-sheet__close,.mauto-select-sheet__close):active { translate: none; }
  html body #mauto-insurance-dialog .insurance-panel { transition: none !important; translate: none; }
}

/* Nested pickers share their parent filter's scrim. A second modal backdrop
   must not dim the persistent actions or visually detach the inner surface. */
html body dialog[open][data-mauto-inner-picker]::backdrop,
html body dialog[data-mauto-motion][open][data-mauto-inner-picker]::backdrop {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}