/*
Theme Name: 알바장부 블로그
Theme URI:
Description: Twenty Twenty-Five 기반 자식 테마. 알바장부 블로그 전용.
Author: 알바장부
Version: 0.1.0
Template: twentytwentyfive
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: albajangbu-child
*/

/* ------------------------------------------------------------------
   여기에는 theme.json으로 해결 안 되는 CSS만 씁니다.
   색상·폰트·여백 같은 전역 스타일은 theme.json에서 관리하세요.
   ------------------------------------------------------------------ */

/* no-underline: 요소 자신과 내부 모든 링크의 밑줄 제거 */
.no-underline,
.no-underline a {
  text-decoration: none !important;
}

/* 목록 카드 — 카테고리 칩 */
.post-chip a{
  display:inline-block;
  background:#F0F7F4;
  padding:3px 10px;
  border-radius:20px;
  text-decoration:none;
}

/* 본문 표 — 헤더 가운데, 내용 오른쪽 */
.th-center th{ text-align:center !important; }

/* 계산기 탭 줄 */
.calc-tabs{
  display:flex;
  gap:8px;
  margin:0 0 28px;
}
.calc-tabs a{
  flex:1;
  text-align:center;
  padding:13px 8px;
  border:1px solid #cfd8d4;
  border-radius:10px;
  background:#fff;
  color:#66706b;
  font-size:1.05rem;
  font-weight:600;
  text-decoration:none;
}
.calc-tabs a:hover{
  border-color:#006241;
  color:#006241;
}
.calc-tabs a[aria-current="page"]{
  background:#006241;
  border-color:#006241;
  color:#fff;
  font-weight:800;
}

@media (max-width: 781px) {
  :root body,
  :root :where(body) {
    --wp--style--root--padding-left: 20px;
    --wp--style--root--padding-right: 20px;
  }
}

/* ------------------------------------------------------------------
   포커스 네모 — 마우스로 누를 때만 없앱니다.
   Twenty Twenty-Five 가 :where(.wp-site-blocks :focus) 로 테두리를 거는데,
   :focus-visible 이 아니라 :focus 라서 클릭에도 뜹니다.
   :where() 는 특정도가 0이라 아래 규칙이 !important 없이 이깁니다.
   키보드(Tab)일 때는 남겨둡니다 — 없애면 키보드만 쓰는 사람이 길을 잃습니다.
   ------------------------------------------------------------------ */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
summary:focus:not(:focus-visible){
  outline:none;
}

a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:2px solid #006241;
  outline-offset:4px;
}

/* 모바일에서 누를 때 뜨는 회색 사각형 */
a,button,summary,
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close{
  -webkit-tap-highlight-color:transparent;
}

/* ------------------------------------------------------------------
   지금 보고 있는 메뉴 — aria-current 는 functions.php 가 붙입니다.
   밑줄 + 굵게 둘 다 씁니다. 색만 바꾸면 색 구분이 어려운 분이 못 봅니다.
   ------------------------------------------------------------------ */
/* 선택자가 길어 보이지만 이유가 있습니다 — 워드프레스가
   .wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content
   처럼 클래스를 일부러 두 번 써서 color:inherit 을 겁니다(특정도 0,3,0).
   같은 꼼수로 (0,4,0) 을 만들어 이깁니다. !important 를 안 쓰는 쪽이 낫습니다. */
.wp-block-navigation .wp-block-navigation-item__content.wp-block-navigation-item__content[aria-current="page"]{
  color:#006241;
  font-weight:700;
  text-decoration:underline !important;   /* .no-underline a 의 !important 대비 */
  text-decoration-thickness:2px;
  text-underline-offset:6px;
}