.auth-layout {

      background: radial-gradient(circle at 8% 12%, color-mix(in srgb, var(--accent-color), transparent 82%), transparent 30%), radial-gradient(circle at 88% 82%, color-mix(in srgb, var(--info-color), transparent 86%), transparent 28%), var(--background-color);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 30px 20px;
    }

    .auth-shell {
      width: min(100%, 600px);
      min-height: auto;
      border-color: rgba(242, 131, 39, 0.28);
      box-shadow: 0 24px 55px rgba(5, 12, 26, 0.5);
      display: flex;
      align-items: center;
      justify-content: center;
      border: 1px solid rgba(242, 131, 39, 0.22);
      margin: 0 auto;
    }


    .auth-main {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 30px;
    }

    .auth-card {
      border-radius: 22px;
      padding: 28px 24px;

      margin: 0 auto;
      width: 100%;
    }

    .auth-main-inner {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
    }

    .auth-card-header,
    .auth-note-panel,
    .auth-form,
    .auth-main form,
    .auth-main .row,
    .auth-main .col,
    .auth-main .form-group,
    .auth-main .mb-3,
    .auth-main .text-start {
      text-align: center !important;
    }





    .auth-main .form-label {
      display: block;
      text-align: left;
      width: 100%;
    }