/* ========================================
   PC 사이드바 네비게이션 (1024px+)
   Tailwind 페이지용 독립 스타일시트
   ======================================== */
@media (min-width: 1024px) {
  .app-layout {
    display: grid;
    grid-template-columns: 260px 1fr;
    min-height: 100vh;
  }

  .app-sidebar {
    background: #f8fafc;
    border-right: 1px solid #e2e8f0;
    padding: 24px 16px;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    z-index: 40;
    font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Noto Sans KR', sans-serif;
  }

  .app-sidebar .sidebar-logo {
    font-size: 1.25rem;
    font-weight: 800;
    color: #1e293b;
    margin-bottom: 32px;
    padding: 0 8px;
  }

  .app-sidebar .sidebar-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
  }

  .app-sidebar .sidebar-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 10px;
    color: #64748b;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    transition: all 0.15s;
  }

  .app-sidebar .sidebar-link:hover {
    background: #e2e8f0;
    color: #1e293b;
  }

  .app-sidebar .sidebar-link.active {
    background: #6366f1;
    color: white;
  }

  .app-sidebar .sidebar-user {
    margin-top: auto;
    padding: 12px;
    border-top: 1px solid #e2e8f0;
    font-size: 0.75rem;
    color: #94a3b8;
  }

  /* PC에서 하단 네비게이션 숨김 */
  .bottom-nav {
    display: none !important;
  }

  /* PC에서 본문 넓게 + 패딩 조정 */
  .app-content {
    min-height: 100vh;
    max-width: 100%;
    padding: 24px 40px;
  }

  /* 사이드바 있을 때 컨테이너 제한 해제 → 넓게 사용 */
  .app-content .container,
  .app-content .container-sm {
    max-width: 960px;
  }

  /* 워크플로우 상세 페이지는 더 넓게 */
  .app-content .step-panel {
    max-width: 720px;
    margin: 0 auto;
  }
}

/* 모바일에서 사이드바 숨김 */
@media (max-width: 1023px) {
  .app-sidebar {
    display: none !important;
  }
}