/* 전체 레이아웃 */
body {
  font-family: 'Pretendard', sans-serif;
  margin: 0;
  padding: 0;
  background-color: #f8f8f8;
}

/* 네비게이션 바 */
.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: white;
  padding: 1vh 5%;
  border-bottom: 1px solid #ddd;
  height: 8vh;
  min-height: 60px;
  box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
  border-radius: 0 0 10px 10px;
  position: relative;
  z-index: 10;
}

/* 배너 섹션 */
.main-banner {
  position: relative;
  width: 100%;
  height: 35vh; /* 세로 크기 상대적 */
  min-height: 200px;
  background: url("../assets/images/banner.png") center/cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.1rem; /* 기존 간격(4rem)의 55% */
}

/* 배너 안쪽 텍스트 */
.banner-text {
  position: absolute;
  color: white;
  font-size: 1.5rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.4;
  background: none; /* 바탕 제거 */
  padding: 0;
  top: 55%;
  left: 60%;
  transform: translate(-60%, -55%);
}

/* 대시보드 */
.dashboard {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin: 1.8rem auto; /* 기존 간격보다 줄임 */
  width: 85%;
  gap: 1.8rem; /* 기존 간격보다 줄임 */
}

/* 최근 도서 & 목표 */
.recent-books, .reading-goals {
  flex: 1;
  background: white;
  padding: 1.5rem;
  border-radius: 12px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* 내 목표 */
.goal-graph img {
  width: 100%;
  border-radius: 8px;
}

/* 반응형 스타일 */
@media (max-width: 1024px) {
  .dashboard {
    flex-direction: column;
    align-items: center;
  }

  .books-container {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .banner-text {
    font-size: 1.2rem;
  }

  .books-container {
    grid-template-columns: repeat(1, 1fr);
  }
}
.reading-goals {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: center;
    position: relative;
}

.goal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.goal-button {
    background: gold;
    border: none;
    padding: 10px 15px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 18px;
}

.goal-button:hover {
    background: darkgoldenrod;
}

canvas {
    max-width: 100%;
    height: auto;
    margin-top: 20px;
}

/* 최근 스타일 모음 */

/* 책 리스트 3x2 레이아웃 유지 */
.books-container {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(30%, 1fr)); /* 3x2 유지 */
  gap: 1rem;
  justify-content: start;
}

/* 개별 책 카드 */
.book-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  cursor: pointer;
  padding: 10px;
  background: none; /* 배경 제거 */
}

/* 책 표지 스타일 */
.book-cover {
  width: 120px; /* 고정 크기 */
  height: auto;
  object-fit: cover;
  background: none; /* 배경 제거 */
  border-radius: 5px;
}

/* 책 제목 스타일 (2줄 제한 & 초과 시 ... 처리) */
.book-title {
  font-size: 14px;
  font-weight: bold;
  width: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 2; /* 최대 2줄 */
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 책 저자 스타일 */
.book-author {
  font-size: 12px;
  color: gray;
}