/* WizardUx Modal Footer
 * Navigation buttons: Back, Skip, Continue
 * Desktop-first - DO NOT modify these base styles for mobile
 */

/* ==========================================================================
   FOOTER CONTAINER
   ========================================================================== */

.wizard-modal__footer {
  flex: none;
  padding: var(--wizard-spacing-block) var(--wizard-spacing-inline);
  border-block-start: 1px solid var(--wizard-color-border-darker);
  background: var(--wizard-color-shade);
}

/* ==========================================================================
   FOOTER LAYOUT
   Left side: Back + Skip buttons
   Right side: Continue button
   ========================================================================== */

.wizard-modal__footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--wizard-spacing-inline);
}

.wizard-modal__footer-left {
  display: flex;
  align-items: center;
  gap: var(--wizard-spacing-inline);
}

.wizard-modal__footer-right {
  display: flex;
  align-items: center;
  gap: var(--wizard-spacing-inline);
}

/* ==========================================================================
   SKIP MESSAGE
   Shown next to skip button when step has info skip type
   ========================================================================== */

.wizard-modal__skip-message {
  font-size: var(--wizard-text-small);
  color: var(--wizard-color-text-subtle);
}