/*
 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: 1367px) {
  /* 전체 레이아웃 wrapper */
  .container.grid-container {
    max-width: 1260px !important;
    width: 100%;
    margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
  }

  /* 데스크탑: 커스텀 포스트 카드(이미지 + 요약) 가로 배치 (이전 인라인 스타일 복원) */
  .custom-post-box { display:flex; flex-direction:row; gap:20px; margin-bottom:40px; align-items:flex-start; }
  .custom-thumb { flex-shrink:0; }
  .custom-summary { flex:1; }

  /* 본문 + 사이드바 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;
  }
  
  /* h2 링크(메인 주제)를 굵게: 상위 a 선택자 */
  .gp-toc-h2 > div > a {
    font-weight: 700;      /* 굵게 */
    color: #111;           /* 필요하면 색 조정 */
    font-size: 15px;
  }

  /* h3 링크(소주제)는 기본 또는 가벼운 글씨로 유지 */
  .gp-toc-h3 > a {
    font-weight: 400;
    color: #444;
    font-size: 14px;
  }
}

/* 검색 입력창 높이 및 글자 크기 조정 */
.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;
}

.inner-link {
  color: #0047AB;
}

/* ------------------------------
   헤딩(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;
}

/* 본문 폰트 크기 강제 적용 */
body p,
body li,
body td,
.entry-content p, 
.entry-content li,
.entry-content td,
article p,
article li,
article td {
  line-height: 2.2 !important; }

p, li, td {
  line-height: 2.2 !important;
}


/* ------------------------------
   <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;
}

/* Floating Table of Contents (left side) */
@media (min-width: 1367px) {
  .gp-floating-toc {
    position: fixed;
    left: 20px; /* adjust to taste */
    top: 140px;
    width: 220px;
    max-height: calc(100vh - 200px);
    overflow: auto;
    background: rgba(255,255,255,0.98);
    border: 1px solid #e6e6e6;
    box-shadow: 0 6px 20px rgba(0,0,0,0.06);
    padding: 10px;
    border-radius: 8px;
    z-index: 9999;
    transition: transform 0.22s ease, opacity 0.22s ease;
  }

  .gp-toc-inner { display:block; }
  .gp-toc-toggle {
    box-sizing: border-box;
    transition: background 0.18s ease, color 0.18s ease;
    background: linear-gradient(90deg,#3b82f6,#1e3a8a);
    color: #fff;
    border-radius: 6px;
    cursor: default;
    pointer-events: none; /* 데스크탑: 클릭 비활성화 */
  }

  .gp-toc-toggle:hover {
    background: linear-gradient(90deg,#3b82f6,#1e3a8a); /* 예쁜 블루 그라데이션 */
    color: #fff;
  }

  /* 상위 항목(h2 링크)을 굵게 표시 */
  .gp-toc-h2 > div > a {
    font-weight: 700;
    color: #0f172a;
    display: inline-block;
    padding: 2px 0;
  }

  /* 하위 항목(h3)은 가볍게 표시 */
  .gp-toc-h3 > a {
    font-weight: 400;
    color: #374151;
    font-size: 14px;
  }

  .gp-toc-list { font-size: 14px; }
  .gp-toc-ul { list-style: none; margin: 0; padding: 0; }
  .gp-toc-ul li { margin: 6px 0; }
  .gp-toc-h3 { margin-left: 10px; }
  .gp-toc-h4 { margin-left: 18px; font-size: 13px; }

  /* nested sublist styling for h3 under h2 */
  .gp-toc-subul { list-style: none; margin: 6px 0 0 12px; padding: 0; }
  .gp-toc-subul li { margin: 4px 0; }

  #gp-toc-list a { color: #333; text-decoration: none; display: inline-block; max-width: 100%; }
  #gp-toc-list a:hover { text-decoration: underline; }
  #gp-toc-list a.active { color: #0066cc; font-weight: 700; }

  /* icons under TOC */
  .gp-toc-icons { display:flex; gap:8px; margin-top:12px; align-items:center; }
  .gp-toc-icon { display:inline-block; width:36px; height:36px; border-radius:6px; overflow:hidden; background:transparent; }
  .gp-toc-icon img { width:100%; height:100%; display:block; opacity:0.9; transition: transform 0.15s ease, opacity 0.15s ease; }
  .gp-toc-icon:hover img { transform: translateY(-3px); opacity:1; }

  /* separate floating follow box (right side) */
  .gp-floating-follow { position: fixed; right: 30px; top: 437px; width: 60px; display:flex; flex-direction:column; gap:10px; align-items:center; z-index: 9999; }
  .gp-follow-icon { width:40px; height:40px; display:block; border-radius:6px; overflow:hidden; box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
  .gp-follow-icon img { width:100%; height:100%; display:block; }

  /* follow floater toggle styles */
  .gp-follow-toggle {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.08);
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    line-height:1;
    cursor:pointer;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08);
  }

  /* SVG icons inside the toggle button */
  .gp-follow-toggle .gp-icon { display:block; width:18px; height:18px; }
  .gp-follow-toggle .gp-icon-hamburger { display:block; }
  .gp-follow-toggle .gp-icon-close { display:none; }
  /* when floater is open, show close icon */
  .gp-floating-follow.open .gp-follow-toggle .gp-icon-hamburger { display:none; }
  .gp-floating-follow.open .gp-follow-toggle .gp-icon-close { display:block; }

  /* small animation for icon swap */
  .gp-follow-toggle .gp-icon { transition: transform 0.18s ease, opacity 0.18s ease; }
  .gp-floating-follow.open .gp-follow-toggle .gp-icon-close { transform: rotate(0deg); }

  /* Desktop: show/hide icons based on .open */
  .gp-floating-follow .gp-follow-icons { display:flex; flex-direction:column; gap:10px; }
  .gp-floating-follow:not(.open) .gp-follow-icons { display: none; }
  .gp-floating-follow:not(.open) { width: 40px; }

  /* collapsed state (toggle) */
  .gp-floating-toc.collapsed { transform: translateX(-150px); opacity: 0.95; }
}

/* 모바일(<=1366px): TOC 버튼 헤더 아래 배치, 클릭 시 확장 */
@media (max-width: 1366px) {
  /* 모바일 햄버거 메뉴 숨김 */
  .menu-toggle, .mobile-menu-control-wrapper { display:none !important; }

  .custom-post-box { display:flex !important; flex-direction:column !important; gap:14px !important; margin-bottom:40px; }
  .custom-thumb { width:100% !important; }
  .custom-thumb img, .custom-thumb .wp-post-thumbnail { width:100% !important; height:auto !important; display:block !important; }
  .custom-summary { width:100% !important; }

  .gp-floating-toc { position:fixed; left:12px; top:67px; width:auto; background:transparent; border:none; box-shadow:none; padding:0; z-index:9999; }
  .gp-floating-toc .gp-toc-list { display:none; }
  .gp-floating-toc .gp-toc-toggle { background:linear-gradient(135deg,#ec4899,#f472b6); color:#fff; border-radius:8px; padding:8px 14px; border:none; }
  .gp-floating-toc.expanded { background:rgba(255,255,255,0.98); border:1px solid #e6e6e6; box-shadow:0 6px 20px rgba(0,0,0,0.06); padding:10px; width:80vw; max-width:320px; top:67px; left:12px; border-radius:10px; max-height:calc(100vh - 85px); overflow:auto; animation:gpTocFadeIn .28s ease; }
  .gp-floating-toc.expanded .gp-toc-list { display:block; }
  @keyframes gpTocFadeIn { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
  .gp-floating-toc.expanded { transition: opacity .28s ease, transform .28s ease; }
  /* 스크롤 다운 시 버튼 숨김 */
  .gp-floating-toc.gp-toc-hide { opacity:0; transform:translateY(-15px); pointer-events:none; transition:opacity .25s ease, transform .25s ease; }
  /* 오버레이 */
  .gp-toc-overlay { position:fixed; inset:0; background:rgba(0,0,0,.28); z-index:9998; display:none; }
  .gp-toc-overlay.visible { display:block; animation:gpTocOverlayFade .25s ease; }
  @keyframes gpTocOverlayFade { from { opacity:0; } to { opacity:1; } }
}

/* 사이트 제목(hafuture) 크기 통일 (모든 페이지 공통) */
.site-branding,
.site-logo {
  display: flex;
  align-items: center;
}

/* 텍스트 제목(hafuture) 통일: 로고 옆/단독 모두 적용 */
.site-branding .main-title,
.site-branding .main-title a,
.site-logo-text,
.site-logo-text a {
  font-size: 26px !important;   /* 원하는 공통 크기 (필요시 숫자만 바꾸면 됨) */
  line-height: 1.2 !important;
  font-weight: 700;
}

/* 반응형에서도 동일하게 유지 (필요하면 크기만 미세 조정 가능) */
@media (max-width: 768px) {
  .site-branding .main-title,
  .site-branding .main-title a,
  .site-logo-text,
  .site-logo-text a {
    font-size: 24px !important;
  }
}

/* 댓글 영역 카드 스타일 */
.comments-area {
  /*margin-top: 5px; 뉴스레터와의 간격을 줄인 상태 유지 */
  display: flex;
  justify-content: center;
}

.comments-area #respond {
  width: 100%;
  max-width: 720px;
  padding: 24px 24px;
  border-radius: 18px;
  background: linear-gradient(135deg, #a7f3d0 0%, #34d399 45%, #059669 100%);
  box-shadow: 0 18px 35px rgba(0, 0, 0, 0.12);
  color: #3b0b25;
}

/* 제목 "댓글 남기기" */
.comments-area #respond h3 {
  margin: 0 0 12px 0;
  font-size: 20px;
  font-weight: 700;
}

/* 안내 문구(있다면) */
.comments-area #respond p {
  margin-bottom: 10px;
}

/* 입력 필드 공통 */
.comments-area #respond input[type="text"],
.comments-area #respond input[type="email"],
.comments-area #respond input[type="url"],
.comments-area #respond textarea {
  width: 100%;
  padding: 10px 14px;
  border-radius: 12px;
  border: none;
  font-size: 14px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  margin-bottom: 10px;
  box-sizing: border-box;
}

/* 제출 버튼 */
.comments-area #respond input[type="submit"] {
  display: inline-block;
  padding: 10px 24px;
  border-radius: 999px;
  border: none;
  background: #ffffff;
  color: #c02465;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.comments-area #respond input[type="submit"]:hover {
  background: #ffe4f0;
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25);
}