/* Power Pages multistep form buttons (desktop/tablet)
   - "Neste/Next" aligned to the RIGHT (steps where Next exists)
   - "Forrige/Previous" + "Send/Submit" CENTERED side-by-side (final step)
*/
@media (min-width: 769px){

  /* === 1) Steps with NEXT button ===
     In multistep forms, Next is inside .actions -> .col-md-6 -> .btn-group
  */
  .actions{
    display: flex !important;
    justify-content: flex-end !important; /* move Next to the right */
    align-items: center !important;
    width: 100% !important;
  }
  .actions > .col-md-6{
    float: none !important;
    width: auto !important;
  }

  /* === 2) Final step with PREVIOUS + SEND ===
     Buttons are rendered in .row.form-custom-actions with left/right containers
  */
  .row.form-custom-actions{
    display: flex !important;
    justify-content: center !important;   /* center the button area */
    align-items: center !important;
    gap: 7px !important;
  }

  .row.form-custom-actions > .col-md-6{
    float: none !important;
    width: auto !important;              /* shrink columns to button width */
    flex: 0 0 auto !important;
  }

  /* IMPORTANT: don't hide left/right containers globally.
     Sometimes Send is on the left depending on template/step.
     Just center whatever is inside each side.
  */
  .row.form-custom-actions .form-action-container-left,
  .row.form-custom-actions .form-action-container-right{
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
  }

  /* Small spacing if buttons are in a btn-group */
  .row.form-custom-actions .btn-group.entity-action-button{
    margin: 0 4px 0 0;
  }
}