/* ========================================
 * 근로자 로그인 페이지
 * 계층: pages (단일 JSP 전용)
 * JSP: /WEB-INF/jsp/vasanta/login/employeeLogin.jsp
 * 네임스페이스: .page-employee-login
 * ======================================== */

.page-employee-login {
  .authentication-wrapper {
    --bs-auth-basic-inner-max-width: 460px;
    display: flex;
    flex-basis: 100%;
    inline-size: 100%;
    min-block-size: 100%;
  }

  .authentication-wrapper .authentication-inner {
    inline-size: 100%;
  }

  .authentication-wrapper.authentication-basic {
    overflow: hidden;
    align-items: center;
    justify-content: center;
  }

  .authentication-wrapper.authentication-basic .authentication-inner {
    position: relative;
    max-inline-size: var(--bs-auth-basic-inner-max-width);
  }

  .authentication-wrapper.authentication-basic .authentication-inner .card {
    z-index: 1;
  }

  .authentication-wrapper.authentication-basic .authentication-inner .card .app-brand {
    margin-block-end: 1.5rem;
  }
}

@media (max-width: 575.98px) {
  .page-employee-login {
    .authentication-wrapper.authentication-basic .authentication-inner::before,
    .authentication-wrapper.authentication-basic .authentication-inner::after {
      display: none;
    }

    .card-body {
      padding-left: 1rem;
      padding-right: 1rem;
    }
  }
}

@media (min-width: 576px) {
  .page-employee-login {
    .authentication-wrapper.authentication-basic .authentication-inner .card {
      padding: 1.5rem;
    }
  }
}

/* Step 전환 애니메이션 */
.page-employee-login {
  .step-section {
    display: none;
  }

  .step-section.active {
    display: block;
    animation: employeeLoginFadeIn 0.3s ease-in;
  }
}

@keyframes employeeLoginFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 확인된 정보 요약 표시 */
.page-employee-login {
  .step-summary {
    background-color: #f5f5f9;
    border-radius: 6px;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .step-summary .summary-info {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .step-summary .summary-label {
    color: #697a8d;
    font-size: 0.8125rem;
  }

  .step-summary .summary-value {
    font-weight: 600;
    color: #566a7f;
  }

  .step-summary .btn-edit {
    color: #697a8d;
    cursor: pointer;
    font-size: 0.875rem;
    border: none;
    background: none;
    padding: 0;
  }

  .step-summary .btn-edit:hover {
    color: #566a7f;
  }
}

/* 스텝 인디케이터 */
.page-employee-login {
  .step-indicator {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
  }

  .step-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #d9dee3;
    transition: background-color 0.3s;
  }

  .step-dot.active {
    background-color: #696cff;
  }

  .step-dot.completed {
    background-color: #71dd37;
  }
}

/* 에러 메시지 줄바꿈 */
.page-employee-login {
  .empl-login-alert {
    word-break: keep-all;
    white-space: normal;
  }
}