@charset "utf-8";

/* ===== 마이페이지 · 내 활동 내역 — Figma 1119:4913 (teal 액센트, 720px=Figma×1.92) ===== */
.mac-wrap {display:flex; flex-direction:column; min-height:100%; background:var(--snow);}

/* ---- 헤더 (sticky) — Figma 1119:4146 ---- */
.mac-head {position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:15px; padding:21px 27px; background:var(--card); border-bottom:1.92px solid var(--line);}
.mac-back {flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:54px; height:54px;}
/* back.svg는 흰색 stroke라 밝은 헤더에서 안 보여 filter로 보정(알림설정 .mno-back과 동일 관례) */
.mac-back img {width:38px; height:38px; filter:brightness(0);}
.churchro.dark-mode .mac-back img {filter:none;}
.mac-title {flex:1; margin-right:54px; text-align:center; font-size:33px; font-weight:800; color:var(--ink);}
.mac-act {flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:54px; height:54px;}
.mac-act img {width:38px; height:38px;}

/* ---- 프로필+통계 헤더 (그라데이션) — Figma 1119:4156 ---- */
.mac-profile {position:relative; display:flex; flex-direction:column; gap:23px; padding:31px 35px; overflow:hidden;
	background:linear-gradient(160deg, #1E3A5F 0%, #1A4A7A 60%, #0F766E 100%);}
.mac-profile::after {content:''; position:absolute; top:-58px; right:-58px; width:230px; height:230px; border-radius:50%; background:rgba(255,255,255,.04);}
.mac-pf-row {position:relative; z-index:1; display:flex; align-items:center; gap:23px;}
.mac-pf-avatar {flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:85px; height:85px; border-radius:42px; background:rgba(255,255,255,.15); border:3.84px solid rgba(255,255,255,.25);}
.mac-pf-avatar img {width:42px; height:42px;}
.mac-pf-info {flex:1; min-width:0; display:flex; flex-direction:column; gap:4px;}
.mac-pf-name {font-size:29px; font-weight:800; color:#fff;}
.mac-pf-church {font-size:21px; color:rgba(255,255,255,.55);}
.mac-pf-badge {flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:35px; height:35px; border-radius:18px; background:var(--teal-2);}
.mac-pf-badge img {width:19px; height:19px;}

/* 통계 4분할 — Figma 1119:4171 */
.mac-stats {position:relative; z-index:1; display:grid; grid-template-columns:repeat(4, 1fr); height:123px; border:1.92px solid rgba(255,255,255,.12); border-radius:19px; background:rgba(255,255,255,.08); overflow:hidden;}
.mac-stat {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; padding:19px 11px;}
.mac-stat + .mac-stat {border-left:1.92px solid rgba(255,255,255,.1);}
.mac-stat .n {font-size:33px; font-weight:800; color:var(--teal-3);}
.mac-stat .k {font-size:19px; color:rgba(255,255,255,.5);}

/* ---- 상단 탭 (작성글/댓글/좋아요/스크랩) — Figma 1119:4192 ---- */
.mac-tabs {display:flex; align-items:stretch; padding:0; background:var(--card); border-bottom:3.84px solid var(--line);}
.mac-tab {position:relative; flex:1; display:flex; flex-direction:column; align-items:center; gap:4px; padding:23px 8px; background:none; color:var(--sub); font-size:23px; font-weight:600;}
.mac-tab .ic {font-size:29px; line-height:1;}
.mac-tab .cnt {min-width:34px; padding:1px 10px; border-radius:19px; background:var(--line); color:var(--sub); font-size:17px; font-weight:700;}
.mac-tab.on {color:var(--teal); font-weight:800;}
.mac-tab.on .cnt {background:var(--mint); color:var(--teal);}
.mac-tab.on::after {content:''; position:absolute; left:0; right:0; bottom:-3.84px; height:3.84px; border-radius:2px 2px 0 0; background:var(--teal-2);}

/* ---- 서브 필터 칩 + 정렬 — Figma 1119:4223 ---- */
.mac-filters {display:flex; align-items:center; gap:13px; padding:15px 27px; background:var(--card); border-bottom:1.92px solid var(--line); overflow-x:auto; scrollbar-width:none;}
.mac-filters::-webkit-scrollbar {display:none;}
.mac-chip {flex:0 0 auto; display:inline-flex; align-items:center; gap:7px; padding:11px 25px; border:1.92px solid var(--line); border-radius:38px; background:var(--snow); color:var(--body); font-size:21px; font-weight:600; white-space:nowrap;}
.mac-chip .b {font-size:17px; font-weight:700; opacity:.7;}
.mac-chip.on {border-color:var(--teal-2); background:var(--teal-2); color:#fff;}
.mac-chip.on .b {opacity:.7;}
.mac-sort {flex:0 0 auto; display:inline-flex; align-items:center; gap:7px; margin-left:auto; padding:11px 21px; border:1.92px solid var(--line); border-radius:38px; background:var(--snow); color:var(--body); font-size:21px; font-weight:600; white-space:nowrap;}
.mac-sort img {width:23px; height:23px;}

/* ---- 카운트 요약 줄 — Figma 1119:4240 ---- */
.mac-summary {padding:15px 27px; background:var(--snow); font-size:23px; font-weight:600; color:var(--body);}
.mac-summary b {color:var(--teal); font-weight:900;}

/* ---- 본문 리스트 ---- */
.mac-body {flex:1; background:var(--snow); padding-bottom:170px;}
.mac-list {display:flex; flex-direction:column;}

/* === 작성글 카드 — Figma 1119:4245 === */
.mac-post {display:flex; gap:19px; align-items:flex-start; padding:27px; background:var(--card); border-bottom:1.92px solid var(--line);}
.mac-post-main {flex:1; min-width:0; display:flex; flex-direction:column; gap:11px;}
.mac-post-top {display:flex; align-items:center; gap:11px;}
.mac-cat {display:inline-flex; padding:4px 15px; border-radius:38px; font-size:19px; font-weight:700;}
.mac-cat.c-free {background:var(--mint); color:var(--teal);}
.mac-cat.c-qt {background:#F0FDF4; color:#16A34A;}
.mac-cat.c-market {background:#FFFBEB; color:#D97706;}
.mac-cat.c-sermon {background:#EFF6FF; color:#2563EB;}
.mac-cat.c-together {background:#FAF5FF; color:#9333EA;}
.mac-post-date {margin-left:auto; font-size:19px; color:var(--sub);}
.mac-post-title {font-size:27px; font-weight:700; color:var(--ink); line-height:1.4; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.mac-post-excerpt {font-size:23px; color:var(--body); line-height:1.6; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.mac-meta {display:flex; align-items:center; gap:19px; padding-top:4px;}
.mac-meta span {display:inline-flex; align-items:center; gap:6px; font-size:21px; color:var(--sub);}
.mac-meta span img {width:23px; height:23px;}
.mac-meta span.likes {color:#DC2626;}
.mac-post-thumb {flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:115px; height:115px; border:1.92px solid var(--line); border-radius:15px; background:var(--snow); font-size:42px; overflow:hidden;}
.mac-post-thumb img {width:100%; height:100%; object-fit:cover; display:block;}

/* === 댓글 카드 — Figma 1119:4354 === */
.mac-cmt {display:flex; flex-direction:column; gap:15px; padding:27px; background:var(--card); border-bottom:1.92px solid var(--line);}
.mac-cmt-src {display:flex; align-items:center; gap:11px;}
.mac-cmt-srctitle {font-size:23px; font-weight:700; color:var(--ink); overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.mac-cmt-srctitle b {display:block; font-size:21px; font-weight:700; color:var(--ink); overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.mac-cmt-date {margin-left:auto; flex:0 0 auto; font-size:19px; color:var(--sub);}
.mac-cmt-bubble {display:flex; gap:15px; align-items:flex-start; padding:21px; background:var(--snow); border:1.92px solid var(--line); border-radius:15px;}
.mac-cmt-me {flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:21px; background:var(--teal-2); color:#fff; font-size:19px; font-weight:800;}
.mac-cmt-text {flex:1; min-width:0; font-size:23px; color:var(--ink); line-height:1.55;}
.mac-cmt-foot {display:flex; align-items:center; gap:19px;}
.mac-cmt-time {font-size:19px; color:var(--sub);}
.mac-cmt-reply {display:inline-flex; align-items:center; gap:7px; font-size:19px; color:var(--teal); font-weight:600;}
.mac-cmt-reply img {width:23px; height:23px;}
.mac-cmt-actions {display:flex; align-items:center; gap:15px; margin-left:auto;}
.mac-cmt-btn {display:inline-flex; align-items:center; gap:6px; padding:0; background:none; font-size:19px; font-weight:600; color:var(--sub);}
.mac-cmt-btn img {width:21px; height:21px;}
.mac-cmt-btn.del {color:#DC2626;}

/* === 좋아요 카드 — Figma 1119:4579 === */
.mac-like {display:flex; gap:19px; align-items:flex-start; padding:27px; background:var(--card); border-bottom:1.92px solid var(--line);}
.mac-like-main {flex:1; min-width:0; display:flex; flex-direction:column; gap:9px;}
.mac-like-top {display:flex; align-items:center; gap:11px;}
.mac-like-date {margin-left:auto; font-size:19px; color:var(--sub);}
.mac-like-title {font-size:25px; font-weight:700; color:var(--ink); line-height:1.4; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
.mac-like-desc {font-size:22px; color:var(--body); line-height:1.5; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.mac-like-sub {font-size:21px; color:var(--sub); overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.mac-like-price {font-size:23px; font-weight:700; color:var(--teal);}
.mac-like-heart {flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:46px; height:46px;}
.mac-like-heart img {width:42px; height:42px;}

/* ---- 더보기 — Figma 1119:4236 ---- */
.mac-more {display:flex; align-items:center; justify-content:center; gap:9px; margin:25px auto; padding:17px 35px; background:var(--card); border:1.92px solid var(--line); border-radius:38px; color:var(--body); font-size:23px; font-weight:600;}
.mac-more img {width:25px; height:25px;}

/* ---- 빈 상태 (스크랩 없음) — Figma 1119:4895 ---- */
.mac-empty {display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:115px 55px;}
.mac-empty-ic {display:flex; align-items:center; justify-content:center; width:154px; height:154px; margin-bottom:16px; border:3.84px solid #FED7AA; border-radius:50%; background:#FFF7ED;}
.mac-empty-ic img {width:69px; height:69px;}
.mac-empty-title {font-size:33px; font-weight:800; color:var(--ink); text-align:center;}
.mac-empty-desc {font-size:25px; color:var(--body); text-align:center; line-height:1.65;}
.mac-empty-cta {display:inline-flex; align-items:center; gap:13px; margin-top:18px; padding:23px 54px; border-radius:42px; color:#fff; font-size:25px; font-weight:700;
	background:linear-gradient(137deg, #0F766E 0%, #0D9488 100%);}
.mac-empty-cta img {width:29px; height:29px;}

/* ---- 하단 탭바 (fixed) ---- */
.mac-nav {position:fixed; left:50%; bottom:0; transform:translateX(-50%); z-index:40; width:720px; max-width:100%; display:flex; align-items:center; justify-content:space-between; padding:20px 40px; background:var(--card); border-top:1.85px solid var(--line);}
.mac-nav .tab {display:flex; flex-direction:column; align-items:center; gap:5.8px; color:var(--sub); font-size:19.2px;}
.mac-nav .tab img {width:42px; height:42px;}
.mac-nav .tab.on {color:var(--teal);}
.mac-nav .tab-fab {position:relative; align-self:stretch; width:96px;}
.mac-nav .tab-fab .fab {position:absolute; left:50%; top:0; transform:translate(-50%,-50%); display:flex; align-items:center; justify-content:center; width:96px; height:96px; border-radius:50%; background:linear-gradient(135deg, #0D9488, #1E3A5F); border:5px solid var(--card); box-shadow:0 10px 24px rgba(13,148,136,0.4);}
.mac-nav .tab-fab .fab img {width:48px; height:48px;}

@media (hover:hover) and (pointer:fine) {
	.mac-post:hover, .mac-like:hover, .mac-cmt:hover {background:var(--snow);}
	.mac-more:hover {background:var(--snow);}
}

/* ===================== 다크모드 ===================== */
.churchro.dark-mode .mac-cat.c-qt {background:rgba(22,163,74,.18); color:#86EFAC;}
.churchro.dark-mode .mac-cat.c-market {background:rgba(217,119,6,.18); color:#FCD34D;}
.churchro.dark-mode .mac-cat.c-sermon {background:rgba(37,99,235,.18); color:#93C5FD;}
.churchro.dark-mode .mac-cat.c-together {background:rgba(147,51,234,.18); color:#D8B4FE;}
.churchro.dark-mode .mac-empty-ic {background:rgba(234,88,12,.12); border-color:rgba(234,88,12,.4);}
.churchro.dark-mode .mac-post-thumb {background:var(--mint);}
.churchro.dark-mode .mac-meta span.likes {color:#FCA5A5;}
.churchro.dark-mode .mac-cmt-btn.del {color:#FCA5A5;}
.churchro.dark-mode .mac-tab .cnt {color:var(--sub);}