/* ========================================
   게시글 목록 페이지 전용 스타일 (public/css/pages/posts.css)
   ======================================== */

/* (리팩토링) 삭제: .page-header, .profile-menu, .profile-button, .profile-placeholder, 
           .profile-image (header.css로 이동) */
/* (리팩토링) 삭제: .dropdown-menu, .dropdown-item (dropdown.css로 이동) */

/* 메인 콘텐츠 */
.main-content {
  padding: 0;
}

/* 환영 메시지 영역 */
.welcome-section {
  padding: 40px 20px 30px 20px;
  text-align: center;
  background-color: var(--white);
}

.welcome-text {
  font-size: var(--font-large);
  font-weight: 400;
  color: var(--gray-dark);
  line-height: 1.5;
}

/* 게시글 작성 버튼 영역 */
.write-section {
  padding: 20px;
  background-color: var(--white);
  border-bottom: 1px solid #E0E0E0;
  display: flex;
  justify-content: flex-end;
}

.btn-write {
  width: auto;
  min-width: 120px;
  height: 45px;
  padding: 0 24px;
  font-size: var(--font-medium);
  font-weight: 600;
  color: var(--white);
  background-color: var(--primary-color);
  border: none;
  border-radius: var(--border-radius);
  cursor: pointer;
  transition: background-color 0.3s;
}

.btn-write:hover {
  background-color: #6952D1;
}

/* 게시글 목록 */
.posts-section {
  background-color: #F5F5F5;
  min-height: 400px;
  padding: 20px;
}

.posts-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  list-style: none;  
  padding: 0;        
  margin: 0;         
}

/* 게시글 카드 */
.post-card {
  background-color: var(--white);
  padding: 24px;
  border-radius: 12px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.post-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  background-color: #FAFAFA;
}

/* 게시글 제목 */
.post-title {
  font-size: var(--font-medium);
  font-weight: 700;
  color: var(--gray-dark);
  margin-bottom: 16px;
  line-height: 1.4;
}

/* 게시글 통계 */
.post-stats {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid #F0F0F0;
}

.stat-item {
  display: flex;
  gap: 4px;
  font-size: var(--font-small);
}

.stat-label {
  color: var(--gray-medium);
}

.stat-value {
  color: var(--gray-dark);
  font-weight: 600;
}

/* 작성자 정보 */
.post-author {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* 작성자 프로필 이미지 */
.author-image {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    user-select: none; /* 이미지 드래그 방지 */
    -webkit-user-drag: none; /* Safari용 드래그 방지 */
}

/* placeholder가 있다면 제거하거나 숨김 처리 */
.author-image-placeholder {
    display: none; /* 더 이상 사용 안 함 */
}

.author-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.author-name {
  font-size: var(--font-small);
  font-weight: 600;
  color: var(--gray-dark);
}

.post-date {
  font-size: var(--font-small);
  color: var(--gray-medium);
}

/* 로딩 및 상태 메시지 */
.loading-indicator,
.no-more-posts {
  padding: 20px;
  text-align: center;
  color: var(--gray-medium);
}

.empty-posts {
  padding: 60px 20px;
  text-align: center;
  background-color: var(--white);
}

.empty-posts p {
  font-size: var(--font-regular);
  color: var(--gray-medium);
}

.hidden {
  display: none;
}