/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/* 전체 컨테이너 너비 확장 */
@media (min-width: 1025px) {
  /* 전체 레이아웃 wrapper */
  .container.grid-container {
    max-width: 1260px !important;
    width: 100%;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
  }

  /* 본문 + 사이드바 2단 grid 레이아웃 */
  .generate-columns-container {
    display: grid !important;
    grid-template-columns: 1000px 260px !important;  /* 본문+사이드바 포함 총 1260px */
    column-gap: 0 !important;
    box-sizing: border-box;
  }

  /* 본문 wrapper */
  #primary.content-area {
    width: 1000px !important; /* 본문 전체 크기 (내용 + 여백) */
    padding: 0;
    margin: 0;
    box-sizing: border-box;
  }

  /* 아티클 내부 전체 */
  .inside-article {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
  }

  /* 본문 내용: 900px 고정, 가운데 정렬 */
  .entry-content {
    width: 900px !important;           /* 핵심: 본문 내용 폭 고정 */
    margin-left: 0px !important;      /* 좌우 여백 = (1000 - 900)/2 */
    margin-right: 0px !important;
    box-sizing: border-box;
  }

  /* 내부 요소들 */
  .entry-content > * {
    max-width: 100% !important;
    box-sizing: border-box;
  }

  /* 사이드바 */
  #right-sidebar {
    width: 360px !important;
    box-sizing: border-box;
  }
}

/* 검색 입력창 높이 및 글자 크기 조정 */
.widget_search input[type="search"] {
  height: 32px !important;             /* 전체 입력창 높이 조절 */
  padding: 4px 8px !important;         /* 위아래/좌우 여백 */
  font-size: 15px !important;          /* 텍스트 크기 */
  line-height: 1.4 !important;         /* 줄 높이로 정렬 */
  box-sizing: border-box;              /* 패딩 포함 너비 계산 */
}

/* 검색 버튼(<button>) 높이 및 글자 크기 정리 */
.widget_search button {
  height: 32px !important;             /* 버튼 높이 입력창과 동일하게 */
  padding: 0 12px !important;          /* 좌우 여백만 설정 */
  font-size: 15px !important;          /* 글자 크기 동일하게 */
  line-height: 1.4 !important;         /* 줄 높이 */
  white-space: nowrap !important;      /* 버튼 안 텍스트 줄바꿈 방지 */
  box-sizing: border-box;              /* 너비 계산 방식 통일 */
  font-family: "Noto Sans KR", sans-serif; /* 한글 폰트 명시 */
}

/* 기본 상태에서는 밑줄 제거 */
a {
  text-decoration: none;
}

/* 마우스 오버 시 밑줄 표시 */
a:hover {
  text-decoration: underline;
}

/* ------------------------------
   헤딩(h2, h3 등) 크기 조정
------------------------------ */
h1 {
  font-size: 28px;
  line-height: 1.4;
  margin-bottom: 1em;
}
h2 {
  font-size: 22px;
  line-height: 1.4;
  margin-bottom: 1em;
}
h3 {
  font-size: 18px;
  line-height: 1.4;
  margin-bottom: 0.8em;
}

/* ------------------------------
   <code> 태그에 코드 스타일 적용
------------------------------ */
code {
  font-family: 'Courier New', Courier, monospace;
  background-color: #f4f4f4;
  padding: 2px 4px;
  font-size: 14px;
  color: #c7254e;
  border-radius: 4px;
}

.related-posts {
  border: 2px solid #e9e9e9;
  border-radius: 20px;
  padding: 20px;
}

/* =========================================================
   테이블 가독성 개선 (표 너비로 인한 어색한 개행 방지)
   - 첫 번째 컬럼(대상 등)이 좁아서 글자가 세로로 쪼개지는 현상 방지
   - 긴 설명은 자연스럽게 줄바꿈
   - 화면이 좁으면 가로 스크롤로 보존
========================================================= */

/* WP 기본 테이블 블록 기준 */
.entry-content .wp-block-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.entry-content .wp-block-table table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto; /* 내용에 맞춰 컬럼 폭 자동 */
}

.entry-content .wp-block-table th,
.entry-content .wp-block-table td {
  padding: 12px 14px;
  vertical-align: top;
  line-height: 1.6;
  word-break: keep-all;     /* 한글 단어 중간 쪼개짐 방지 */
  overflow-wrap: break-word; /* 너무 긴 텍스트는 다음 줄로 */
}

/* 첫 번째 컬럼(대상) 세로 쪼개짐 방지 */
.entry-content .wp-block-table th:first-child,
.entry-content .wp-block-table td:first-child {
  min-width: 88px;       /* 80~110px 사이로 취향 조절 */
  white-space: nowrap;   /* "영유아" 같은 텍스트가 세로로 깨지지 않게 */
}

/* 두 번째 컬럼도 너무 좁아지면 최소 폭 */
.entry-content .wp-block-table th:nth-child(2),
.entry-content .wp-block-table td:nth-child(2) {
  min-width: 180px;
}

/* =========================================================
   모바일 대응: custom-post-box 구조 변경
   (인라인 스타일 덮어쓰기)
========================================================= */

@media (max-width: 1024px) {
  
  /* 메인 포스트 박스 - 인라인 스타일 강제 덮어쓰기 */
  .site-main .custom-post-box {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    margin-bottom: 30px !important;
  }
  
  /* 썸네일 영역 */
  .custom-post-box .custom-thumb {
    flex-shrink: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 15px !important;
  }
  
  /* 썸네일 링크 */
  .custom-post-box .custom-thumb a {
    display: block !important;
    width: 100% !important;
  }
  
  /* 썸네일 이미지 */
  .custom-post-box .custom-thumb img {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
  }
  
  /* 콘텐츠 영역 */
  .custom-post-box .custom-summary {
    width: 100% !important;
    max-width: 100% !important;
  }
  
  /* 제목 */
  .custom-post-box .custom-summary h3 {
    font-size: 18px !important;
    margin: 0 0 10px 0 !important;
    line-height: 1.4 !important;
  }
  
  /* 요약 텍스트 */
  .custom-post-box .custom-summary .excerpt {
    font-size: 15px !important;
    line-height: 1.6 !important;
  }
  
  /* 전체 컨테이너 */
  .container.grid-container {
    max-width: 100% !important;
    padding: 0 15px !important;
  }
  
  /* 본문 영역 */
  #primary.content-area {
    width: 100% !important;
  }
  
  /* 사이드바 */
  #right-sidebar {
    width: 100% !important;
    margin-top: 30px !important;
  }
}

/* 작은 모바일 (480px 이하) */
@media (max-width: 480px) {
  
  /* 포스트 박스 여백 축소 */
  .site-main .custom-post-box {
    margin-bottom: 25px !important;
  }
  
  /* 썸네일 하단 여백 */
  .custom-post-box .custom-thumb {
    margin-bottom: 12px !important;
  }
  
  /* 제목 크기 축소 */
  .custom-post-box .custom-summary h3 {
    font-size: 16px !important;
  }
  
  /* 요약 텍스트 */
  .custom-post-box .custom-summary .excerpt {
    font-size: 14px !important;
  }
  
  /* 컨테이너 패딩 */
  .container.grid-container {
    padding: 0 10px !important;
  }
}

/* =========================================================
   모바일 본문 패딩 최소화 (가독성 개선)
========================================================= */

@media (max-width: 1024px) {
  
  /* 본문 콘텐츠 영역 패딩 최소화 */
  .entry-content {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
  
  /* 아티클 내부 패딩 제거 */
  .inside-article {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  
  /* 소개 박스(민트색 영역) 패딩 조정 */
  .entry-content > div[style*="background"] {
    padding: 15px 12px !important;
    margin-left: -8px !important;
    margin-right: -8px !important;
    border-radius: 12px !important;
  }
}

/* 작은 모바일 및 폴드 커버 화면 (480px 이하) */
@media (max-width: 480px) {
  
  /* 컨테이너 패딩 더 축소 */
  .container.grid-container {
    padding: 0 6px !important;
  }
  
  /* 본문 패딩 최소화 */
  .entry-content {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  
  /* 소개 박스 조정 */
  .entry-content > div[style*="background"] {
    padding: 12px 10px !important;
    margin-left: -4px !important;
    margin-right: -4px !important;
  }
  
  /* 목차 박스 패딩 */
  .entry-content .toc-wrapper,
  .entry-content [class*="toc"] {
    padding: 12px 10px !important;
  }
  
  /* 본문 폰트 살짝 키워서 가독성 보완 */
  .entry-content p,
  .entry-content li {
    font-size: 16px !important;
    line-height: 1.7 !important;
  }
}

/* 폴드 커버 화면 등 극소형 (360px 이하) */
@media (max-width: 360px) {
  
  .container.grid-container {
    padding: 0 4px !important;
  }
  
  .entry-content {
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  
  .entry-content > div[style*="background"] {
    padding: 10px 8px !important;
    margin-left: -2px !important;
    margin-right: -2px !important;
    border-radius: 8px !important;
  }
}

/* 목차 ul/li 여백 조정 */
@media (max-width: 1024px) {
  .entry-content ul {
    padding-left: 24px !important;
    margin-left: 8px !important;
  }
  
  .entry-content ul li {
    padding-left: 4px !important;
    margin-bottom: 8px !important;
  }
}

@media (max-width: 480px) {
  .entry-content ul {
    padding-left: 20px !important;
    margin-left: 6px !important;
  }
  
  .entry-content ul li {
    margin-bottom: 6px !important;
  }
}

/* 데스크톱 ul/li 여백 조정 */
.entry-content ul {
  padding-left: 10px;
  margin-left: 5px;
}

.entry-content ul li {
  margin-bottom: 5px;
}

/* 중첩 리스트 (하위 ul) */
.entry-content ul ul {
  margin-left: 5px;
  margin-top: 5px;
}