/* 글·댓글 아래 버튼 줄 — 조용하게, 한 글꼴, 한 크기 */
.cact{
  display:flex; align-items:center; flex-wrap:wrap; gap:14px;
  font-family:inherit; font-size:13px; line-height:1;
}
/* ★버튼·입력요소는 글꼴을 안 물려받음 → 여기서 강제 상속(크기·모양 통일의 핵심) */
.cact button, .cact a, .cact input, .cact select, .cact textarea{ font:inherit; }
.cact form{ display:inline; margin:0; }
.cact button{
  background:none; border:0; padding:0; cursor:pointer;
  color:#9b8a76; transition:color .13s;
  display:inline-flex; align-items:center; gap:5px; white-space:nowrap;
}
.cact a{
  color:#9b8a76; text-decoration:none; transition:color .13s;
  display:inline-flex; align-items:center; gap:5px; white-space:nowrap;
}
.cact button:hover, .cact a:hover{ color:#e8730c; }
/* 위험한 것만 빨강 — 평소엔 얌전히 있다가 마우스 올릴 때만 */
.cact .cact-danger:hover{ color:#dc3545; }
.cact svg{ width:15px; height:15px; flex:0 0 auto; }

/* ★쪽지 버튼만 예외였음 — communityDmButtonHtml(community_profile_manager.php) 이 자기 인라인으로
   padding:4px 8px / font-size:13px / color 를 달고 나옴. 그래서 이 줄 안에서 혼자 8px씩 더 벌어지고,
   모바일에선 .cact 가 12.5px 로 줄 때 혼자 13px 로 남아 커 보였음(회장님 지적: "크고 작고, 멀고 좁고").
   ※ 그 버튼은 .cact 밖(관리자 마스터알림)에서도 쓰여서 인라인을 떼면 거기가 깨짐 →
     원본은 두고, '.cact 줄 안에 있을 때만' 규격에 맞춰 되돌린다. 이 한 곳이 index·post·mypage 전부 담당. */
.cact .dm-send-btn{ padding:0 !important; font-size:inherit !important; color:#9b8a76 !important; }
.cact .dm-send-btn:hover{ color:#e8730c !important; }   /* 인라인 color 가 :hover 를 이겨서 혼자 안 변하던 것 */

/* 좋아요(글 상세) — ★댓글 하트(.cmt-like)와 '똑같은' 값으로 맞춤.
   댓글 쪽은 크기가 안 변하고 잘 나온다고 회장님이 확인해줬으므로 그 값을 그대로 복제:
     버튼 12px / 하트 15px / 색 #adb5bd, 눌리면 #e0245e.
   ※ 하트 칸을 고정폭+가운데정렬로 잡음 — '❤'(U+2764)와 '♡'(U+2661)는 서로 다른 글자라
     글자 폭이 미묘하게 다름. 칸을 고정하면 켜고 꺼도 옆 숫자가 안 밀림. */
/* ★크기는 .cact(13px) 하나로 통일 — 여기서 font-size 를 따로 주지 말 것.
   "조용하게" 는 크기가 아니라 '색'으로만 구분한다. (크기를 섞으면 줄이 들쭉날쭉해짐) */
.cact .cact-like{ color:#adb5bd; }
/* ★하트는 SVG 하나 — 안 눌리면 테두리만(fill:none), 눌리면 속을 채움(fill).
   크기는 어느 쪽이든 16px 고정이라 켜고 꺼도 절대 안 변함. */
.cact .cact-like .cact-like-ico{ display:inline-flex; align-items:center; flex:0 0 auto; }
.cact .cact-like .cact-like-ico svg{
  width:16px; height:16px;
  fill:none; stroke:currentColor; stroke-width:1.9; stroke-linejoin:round;
  transition:fill .15s;
}
.cact .cact-like.on .cact-like-ico svg{ fill:currentColor; }
.cact .cact-like.on{ color:#e0245e; }

.cact .cact-like:hover{ color:#e0245e; }

/* 글쓰기 툴바·비주얼 메뉴바 안의 SVG 크기 (버튼마다 크기 안 흔들리게 한 곳에서)
   ★14px로 작게 + 글자 간격을 좁힘 — 아이콘이 들어가며 버튼이 넓어져 툴바가 두 줄로 밀렸음(회장님 지적).
     아이콘 없던 때보다 버튼이 커지면 안 됨. */
.community-toolbar-sticky button svg{ width:14px; height:14px; flex:0 0 auto; }
.community-toolbar-sticky .tb-sep{ width:1px; height:18px; background:#e0d6c8; margin:0 5px; flex:0 0 auto; }

/* ============ 글쓰기 툴바 배열 ============
   문제였던 것: 버튼 15개가 그룹 없이 쭉 나열 + flex-wrap:wrap 이라
                PC에선 뭐가 뭔지 구분 안 되고, 모바일에선 2~3줄로 흩어져 지저분했음.
   해결: ① 모바일 = 줄바꿈 없애고 '한 줄 + 옆으로 밀어 보기'(스크롤바 숨김)
         ② PC     = 기능 묶음 사이에 얇은 구분선 → 한 줄에 들어가면서 그룹이 보임
   ※ 사진 편집 줄(회전·작게·크게·왼쪽…)은 '사진을 클릭했을 때만' 뜨는 별개 줄 = 그대로 둠. */
/* ※ 툴바 자체의 gap·정렬·크기는 건드리지 않는다 — 원래 잘 되던 배치가 깨짐(잘림·정렬버튼 먹통).
   사진 편집줄(회전·크기 / 위치·삭제)의 줄 나눔 — flex 에서 폭 100% 짜리를 끼우면 그 자리에서 줄이 바뀜 */
/* ★PC는 공간이 넉넉하니 한 줄로 — 줄바꿈은 모바일에서만 (PC까지 자르던 것 수정) */
.mb-break{ display:none; }
@media (max-width:768px){
  .mb-break{ display:block; flex-basis:100%; width:100%; height:0; margin:0; }
  /* 모바일 사진 편집줄 순서 — ★× 가 혼자 셋째 줄로 떨어지던 것 해결.
     윗줄 = 회전·작게·중간·크게·꽉 + 삭제·닫기  /  아랫줄 = 왼쪽·가운데·오른쪽·위·아래 */
  .community-toolbar-sticky [data-a="rotate"],
  .community-toolbar-sticky [data-a="small"],
  .community-toolbar-sticky [data-a="medium"],
  .community-toolbar-sticky [data-a="large"],
  .community-toolbar-sticky [data-a="full"]{ order:1; }
  .community-toolbar-sticky [data-a="del"],
  .community-toolbar-sticky [data-a="close"]{ order:2; }
  .community-toolbar-sticky .mb-break{ order:3; }
  .community-toolbar-sticky [data-a="left"],
  .community-toolbar-sticky [data-a="center"],
  .community-toolbar-sticky [data-a="right"],
  .community-toolbar-sticky [data-a="up"],
  .community-toolbar-sticky [data-a="down"],
  .community-toolbar-sticky [data-a="ungroup"]{ order:4; }
}
@media (max-width:768px){
  /* 모바일 = 원래대로 줄바꿈. 줄 간격만 살짝 띄워 두 줄이 붙어 보이지 않게 (그 이상 손대지 않음).
     ※ 여기서 버튼 크기·정렬·스크롤을 건드렸다가 사진 편집줄이 잘리고 정렬 버튼이 안 먹었음 → 원복함. */
  .community-toolbar-sticky{ row-gap:6px !important; }
  .community-toolbar-sticky .tb-sep{ display:none; }   /* 줄바꿈될 땐 구분선이 줄 끝에 혼자 남아 지저분 */
}

/* 헤더 번역(지구) 아이콘 — 🌐 대신 SVG. custom.css 의 .translate-icon{font-size:16px} 은 그대로 두고
   여기서 SVG 크기만 잡음(custom.css 는 custom_css.json 이 덮어쓰는 함정이 있어 안 건드림). */
.translate-icon{ display:inline-flex; align-items:center; vertical-align:-3px; }
.translate-icon svg{ width:16px; height:16px; }

/* 등급 아이콘 — 등급 뱃지 글자색을 그대로 물려받음(currentColor) */
.grade-ico svg{ width:13px; height:13px; }
.dist-emoji .grade-ico svg{ width:24px; height:24px; }   /* 관리자 등급 분포는 크게 */

/* 프로필 사진이 없을 때 자리 채우는 아이콘 — 👤 대신 SVG (원형 틀은 .profile-avatar 가 유지) */
.profile-avatar.mp-noimg{ display:inline-flex; align-items:center; justify-content:center; color:#c4b5a0; }
.profile-avatar.mp-noimg svg{ width:52%; height:52%; }

/* 마이페이지 탭 라벨 — 아이콘 + 글자 나란히 */
.mp-tl{ display:inline-flex; align-items:center; gap:6px; }
.mp-tl svg{ width:16px; height:16px; flex:0 0 auto; }
.mp-tl.edit svg{ width:14px; height:14px; }
div.mp-tl{ display:flex; }   /* div 로 쓸 땐 한 줄 차지(가운데 정렬 되게) */
/* 마이페이지 알림·쪽지 버튼 안의 아이콘 */
.mp-tabs ~ * button svg, .msg-tool-btn svg, .msg-btn svg{ width:14px; height:14px; flex:0 0 auto; }

/* 이모티콘 넣기 버튼(.emo-btn) — 😊 대신 SVG. 크기·색은 여기서 한 번에 */
.emo-btn{ color:#9b8a76; line-height:0; }
.emo-btn:hover{ color:#e8730c; }
.emo-btn svg{ width:19px; height:19px; }

/* 사이드바 위젯 제목의 아이콘 — 이모지(🔥📝💬⚡📌) 대신 SVG.
   ★홈(index_sidebar.php)과 블로그(post.php)가 같은 위젯을 복붙해 갖고 있으므로 반드시 짝으로 바꿀 것.
   가운데 정렬(text-align:center)인 위젯도 있어서 flex 로 강제하지 않고 vertical-align 로만 맞춤. */
.widget-title .wt-ico{ vertical-align:-3px; margin-right:5px; color:#e8730c; }

/* 조회수·날짜·카테고리 — 누르는 게 아니라 '정보'라서 더 조용하게 */
.cact .cact-view{
  color:#a89680; white-space:nowrap;   /* ★크기 지정 안 함 — .cact 의 13px 그대로 */
  display:inline-flex; align-items:center; gap:5px;
}

@media (max-width:768px){
  .cact{ gap:12px; font-size:12.5px; }
  .cact svg{ width:14px; height:14px; }
  .cact .cact-like .cact-like-ico{ font-size:15px; }
}
/* ★로그인 유도 모달 — 좋아요·댓글좋아요·찜을 로그인 없이 누르면 '띠용' 튀어나옴.
   예전엔 브라우저 기본 alert/confirm(밋밋함) → 커뮤니티 카드 스타일 커스텀 모달로 통일.
   쓰는 법(어디서든): window.needLogin('좋아요')  ← 인자는 뭘 하려 했는지(문구용, 생략가능) */
.nlog-back{position:fixed;inset:0;z-index:2147483000;background:rgba(40,26,10,.42);
  display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;
  transition:opacity .18s ease;-webkit-tap-highlight-color:transparent}
.nlog-back.on{opacity:1}
.nlog-card{width:100%;max-width:320px;background:#fff;border:1px solid #ffe0c2;border-radius:18px;
  box-shadow:0 12px 34px rgba(90,60,25,.28);padding:26px 22px 20px;text-align:center;
  transform:scale(.82);transition:transform .22s cubic-bezier(.34,1.56,.64,1)}
.nlog-back.on .nlog-card{transform:scale(1)}   /* 띠용(살짝 튀어나옴) */
.nlog-ic{width:54px;height:54px;margin:0 auto 12px;border-radius:50%;background:#fff3e0;
  display:flex;align-items:center;justify-content:center;color:#e8730c}
.nlog-ic svg{width:28px;height:28px}
.nlog-ttl{font-size:17px;font-weight:800;color:#5a402a;margin:0 0 5px}
.nlog-txt{font-size:13.5px;color:#9a7d54;line-height:1.5;margin:0 0 18px}
.nlog-btns{display:flex;flex-direction:column;gap:9px}
.nlog-go{display:block;padding:12px;border-radius:12px;border:none;cursor:pointer;font-family:inherit;
  font-size:15px;font-weight:800;color:#fff;background:linear-gradient(160deg,#fb923c,#e8730c);
  box-shadow:0 3px 0 #c9610f;text-decoration:none}
.nlog-go:active{transform:translateY(2px);box-shadow:0 1px 0 #c9610f}
.nlog-close{background:none;border:none;color:#a89680;font-size:13px;cursor:pointer;font-family:inherit;padding:6px}
