@import "../../../style/mixin.scss";

@include export-module('co-step-menu-layout') {
  .co-step-menu {
    .step-menu-container {
      width: 100%;
      max-width: 1200px;
      margin: 20px auto;
      display: flex;
      gap: 50px;
      justify-content: space-between;
      justify-items: center;

      .step-menu-item {
        display: flex;
        align-items: center;
        gap: 15px;
        cursor: pointer;

        .step-menu-item-number {
          height: 40px;
          width: 40px;
          border-radius: 50%;
          display: flex;
          align-items: center;
          justify-content: center;
        }
      }

      .step-disabled {
        pointer-events: none;
        opacity: 0.5;
      }

      .step-finished {
        .step-menu-item-finished {
          box-sizing: border-box;
          padding: 5px;
        }
      }
    }
  }
}
