/* ==========================================================================
   WPFlow brand layer — site-wide identity (Pretendard + Toss-blue accent)
   Loaded after the theme's main stylesheet so it wins. Scoped to keep the
   article body to the wpflow Blog Kit plugin; this file owns the chrome
   (header, nav, footer, home, archive) and the global type system.
   ========================================================================== */

/* Self-hosted Pretendard Variable (bundled with the theme, no external CDN). */
@font-face {
  font-family: "Pretendard Variable";
  src: url("../fonts/pretendard/PretendardVariable.woff2") format("woff2-variations"),
       url("../fonts/pretendard/PretendardVariable.woff2") format("woff2");
  font-weight: 45 920;
  font-style: normal;
  font-display: swap;
}

:root {
  --wpflow-font: "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --wpflow-accent: #3182f6;
}

/* ----- Global typography: Pretendard everywhere ----- */
body,
button,
input,
select,
optgroup,
textarea,
h1, h2, h3, h4, h5, h6,
.site-title,
.main-navigation,
.menu,
.widget,
.entry-title,
.blogsy-btn,
.wp-block-button__link {
  font-family: var(--wpflow-font);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  letter-spacing: -0.02em;
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6,
.entry-title {
  letter-spacing: -0.03em;
}

/* ----- Accent reinforcement (links / focus) ----- */
a:hover,
a:focus {
  color: var(--wpflow-accent);
}

/* ----- 사이드바 '최근 글' 위젯 썸네일 정돈 -----
   워드프레스 코어 Latest Posts 블록의 대표 이미지가 홈·아카이브에서 찌그러지거나
   정렬이 들쭉날쭉한 문제 보정. 균일한 둥근 사각형(64px)으로 맞추고 제목과 세로
   가운데 정렬한다. object-fit:cover 로 비율을 지켜 왜곡을 막는다.
   (썸네일이 정사각으로 잘리는 건 워드프레스 'thumbnail' 크기 특성 — 원본 전체를
   보이려면 위젯의 이미지 크기를 '중간'으로 바꾸면 된다.) */
.wp-block-latest-posts__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.wp-block-latest-posts__list li {
  display: flex;
  align-items: center;
  gap: 12px;
  /* 상하좌우 균일 패딩 — 이미지 주변 여백이 사방으로 같게. */
  padding: 12px;
  /* 테마 기본 margin-bottom(10px) 제거 → 구분선이 위·아래 이미지 정중앙에 온다.
     .wp-block-latest-posts li 규칙이 특정성에서 앞서므로 !important로 확실히 리셋. */
  margin: 0 !important;
}
/* 항목 사이 구분선 — 위 항목의 bottom 패딩(12px)과 아래 항목의 top 패딩(12px)
   사이에 놓여 두 썸네일의 정중앙에 위치한다(첫 항목 위엔 선 없음). */
.wp-block-latest-posts__list li + li {
  border-top: 1px solid #e9e8ff;
}
.wp-block-latest-posts__featured-image {
  flex: 0 0 auto;
  margin: 0 !important;
}
.wp-block-latest-posts__featured-image a,
.wp-block-latest-posts__featured-image img {
  display: block;
  width: 64px !important;
  height: 64px !important;
  max-width: 64px !important;
  max-height: 64px !important;
  border-radius: 12px;
  overflow: hidden;
}
.wp-block-latest-posts__featured-image img {
  object-fit: cover !important;
}
.wp-block-latest-posts__list li > a {
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.45;
}
