/**
 * WECAR HR — PWA 설치 배너 + 모바일 UX 보강
 */

/* ── PWA 자동 설치 배너 ── */
.pwa-auto-banner {
  position: fixed;
  left: 50%;
  bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%) translateY(120%);
  z-index: 10050;
  width: min(480px, calc(100vw - 2rem));
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 14px;
  box-shadow: 0 8px 32px rgba(15, 23, 42, 0.16);
  padding: 0.85rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  opacity: 0;
  pointer-events: none;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.pwa-auto-banner.is-visible {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.pwa-auto-banner-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  object-fit: contain;
  background: #f4f5f7;
}

.pwa-auto-banner-body {
  flex: 1;
  min-width: 0;
}

.pwa-auto-banner-title {
  font-size: 0.9rem;
  font-weight: 700;
  margin: 0 0 0.15rem;
  color: #25282d;
}

.pwa-auto-banner-desc {
  font-size: 0.78rem;
  margin: 0;
  color: #64748b;
  line-height: 1.4;
}

.pwa-auto-banner-actions {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  flex-shrink: 0;
}

.pwa-auto-banner-actions .btn {
  min-height: 36px;
  font-size: 0.8rem;
  white-space: nowrap;
}

.pwa-auto-banner-close {
  position: absolute;
  top: 0.35rem;
  right: 0.35rem;
  border: none;
  background: transparent;
  color: #94a3b8;
  font-size: 1.1rem;
  line-height: 1;
  padding: 0.25rem;
  cursor: pointer;
}

/* PWA 설치됨(standalone) 모드 */
@media (display-mode: standalone) {
  .pwa-auto-banner,
  .sigma-pwa-install,
  .pwa-install-header-btn {
    display: none !important;
  }

  body {
    padding-top: env(safe-area-inset-top, 0px);
  }

  .top-header {
    padding-top: calc(0.5rem + env(safe-area-inset-top, 0px));
  }
}

/* ── 모바일 공통 UX ── */
@media (max-width: 767.98px) {
  /* iOS 입력 확대 방지 */
  input.form-control,
  select.form-select,
  textarea.form-control,
  .sigma-input {
    font-size: 16px !important;
  }

  .top-header {
    min-height: 48px;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    position: sticky;
    top: 0;
    z-index: 1030;
  }

  .main-content {
    padding-bottom: calc(5rem + env(safe-area-inset-bottom, 0px));
  }

  /* 2열 폼 → 1열 */
  .row > [class*="col-md-"],
  .row > [class*="col-lg-"],
  .row > [class*="col-xl-"] {
    margin-bottom: 0.75rem;
  }

  /* 페이지 헤더 버튼 터치 영역 */
  .page-header-actions .btn {
    min-height: 40px;
    flex: 1 1 auto;
  }

  /* 테이블 가로 스크롤 힌트 */
  .table-wrap {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
  }

  /* 모달 전체 너비 */
  .modal-dialog {
    margin: 0.5rem;
    max-width: calc(100% - 1rem);
  }

  .modal-dialog-scrollable .modal-body {
    max-height: calc(100vh - 8rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  }

  /* 로그인 카드 모바일 */
  .sigma-auth-shell {
    padding: 1rem;
    padding-top: calc(1rem + env(safe-area-inset-top, 0px));
    padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
  }

  .sigma-auth-card {
    width: 100%;
    max-width: 100%;
  }

  /* AI 어시스턴트 FAB safe area */
  .wecar-ai-fab {
    bottom: calc(1rem + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* PWA 배너가 FAB과 겹치지 않도록 */
  body.has-pwa-banner .wecar-ai-fab {
    bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px)) !important;
  }
}

@media (max-width: 575.98px) {
  .pwa-auto-banner {
    flex-wrap: wrap;
    padding-top: 1.75rem;
  }

  .pwa-auto-banner-actions {
    flex-direction: row;
    width: 100%;
  }

  .pwa-auto-banner-actions .btn {
    flex: 1;
  }

  .page-header-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
  }

  .dropdown-menu {
    max-width: calc(100vw - 2rem);
  }
}
