/* 가계부 — cat (네이버 가계부 참고 기능, 2026-09-23) */
/* 작은 분류 · 자주 쓰는 분류 · 태그. 모양은 W61 틀 값(칩 34/17 · 카드 22 · 1px #EDF0F3). PC 배치는 아래 @media (min-width:600px) 안 */

/* ── 태그 칩 (읽기) */
.mc-tags{display:inline-flex;flex-wrap:wrap;align-items:center;gap:5px;min-width:0;width:auto}
.mc-tag{display:inline-flex;align-items:center;gap:3px;height:24px;padding:0 9px;border-radius:12px;background:#EEF4FC;color:var(--primary);font-size:12.5px;font-weight:600;font-style:normal;white-space:nowrap;width:auto;flex:none}
.mc-tags.sm .mc-tag{height:20px;padding:0 7px;border-radius:10px;font-size:11.5px}
.mn-rd .mc-tags,.mn-rd .mc-tag,.fr .mc-tag{width:auto;color:var(--primary);font-size:12.5px}
.mc-tagrd{align-items:center}
.mc-tagrd .mc-tags{flex:1}

/* ── 태그 칸 (입력 · 고정지출) — 적고 Enter · 최근 태그 */
.mc-tagf{display:flex;align-items:flex-start;padding:14px 18px;width:100%}
.mc-tagf .mc-k{width:100px;flex:none;font-size:15px;line-height:24px;color:var(--t3)}
.mc-fxtags .mc-tagf .mc-k{width:110px}
.mc-tagcol{flex:1;min-width:0}
.mc-tagbox{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-height:24px}
.mc-tagbox .mc-tag.on{padding-right:3px}
.mc-tagbox .mc-tag button{width:18px;height:18px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--primary)}
.mc-tagbox .mc-tag button:hover{background:rgba(26,111,209,.14)}
.mc-tagin{flex:1;min-width:120px;height:24px;border:0;outline:0;background:none;font:inherit;font-size:15px;font-weight:500;color:var(--ink);border-bottom:1.5px solid transparent}
.mc-tagin:focus{border-bottom-color:var(--primary)}
.mc-tagin::placeholder{font-weight:400;color:var(--t3)}
.mc-full{font-style:normal;font-size:12px;color:var(--t3)}
.mc-recent{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px}
.mc-recent em{font-style:normal;font-size:11.5px;font-weight:600;color:var(--t3);margin-right:2px}
.mc-rtag{height:28px;padding:0 11px;border-radius:14px;background:#F5F7FA;color:var(--t2);font-size:13px;font-weight:600;white-space:nowrap}
.mc-rtag:hover{background:#EDF0F4;color:var(--ink)}

/* ── 작은 분류 칩 (입력 화면 · 분류 수정) */
.mc-schips{display:flex;flex-wrap:wrap;gap:6px}
.mc-schip{height:32px;padding:0 13px;border-radius:16px;background:#F5F7FA;color:var(--t2);font-size:13.5px;font-weight:600;white-space:nowrap}
.mc-schip:hover{background:#EDF0F4}
.mc-schip.on{background:var(--ink);color:#fff}
.side .mc-catlist .mc-schips{padding:2px 18px 12px 62px}
.fr.mc-subfr{align-items:flex-start}
.fr.mc-subfr>span{line-height:32px}
.mc-subfr .mc-schips{flex:1;min-width:0}
.mc-subpick{padding:14px 16px}

/* ── 자주 쓰는 분류 칩 (입력 화면 PC 분류 판 맨 앞) */
.side .mn-lab.mc-flab{padding-top:0}
.mc-favchips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.mc-fchip{height:34px;padding:0 14px 0 12px;border-radius:17px;background:#fff;border:1px solid #EDF0F3;color:var(--t2);font-size:13.5px;font-weight:600;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.mc-fchip i{width:8px;height:8px;border-radius:50%;flex:none}
.mc-fchip:hover{background:#F5F7FA}
.mc-fchip.on{background:var(--ink);border-color:var(--ink);color:#fff}

/* ── 분류 관리 조각 (폰 · PC 같이) */
.mc-hd{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex:none}
.mc-hd b{font-size:16px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-hd s{margin-left:auto;text-decoration:none;font-size:13px;font-weight:600;color:var(--t3);white-space:nowrap;font-variant-numeric:tabular-nums}
.mc-note{margin:-4px 0 12px;font-size:12px;line-height:1.5;color:var(--t3)}
.mc-self{display:flex;align-items:center;gap:10px;height:46px;padding:0 6px 0 14px;border-radius:14px;background:#F5F7FA;margin-bottom:8px;flex:none}
.mc-self span{font-size:12px;font-weight:600;color:var(--t3)}
.mc-self b{flex:1;min-width:0;font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-sbody{min-height:0}
.mn-srt.mc-srow{display:flex;align-items:center;height:50px;margin:0;padding:0 4px 0 10px;border-bottom:1px solid #EDF0F3;background:#fff}
.mc-srow .mn-grip{margin-right:8px}
.mc-sname{flex:1;min-width:0;height:100%;text-align:left;font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-sname:hover{color:var(--primary)}
.mc-renin{flex:1;min-width:0;height:34px;margin-right:6px;padding:0 10px;border:1.5px solid var(--primary);border-radius:10px;outline:0;font:inherit;font-size:15px;font-weight:500;color:var(--ink);background:#fff}
.mc-used{font-style:normal;font-size:12px;color:var(--t3);margin:0 6px;white-space:nowrap}
.mc-star,.mc-x{width:34px;height:34px;border-radius:17px;display:flex;align-items:center;justify-content:center;flex:none}
.mc-star:hover,.mc-x:hover{background:#F5F7FA}
.mc-none{padding:16px 4px;text-align:center;font-size:13px;color:var(--t3)}
.mc-addrow{display:flex;align-items:center;gap:10px;height:48px;margin-top:12px;padding:0 6px 0 14px;border:1px solid #E3E7EC;border-radius:14px;background:#fff;flex:none;cursor:text}
.mc-addrow:focus-within{border-color:var(--primary)}
.mc-addrow input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:15px;font-weight:500;color:var(--ink)}
.mc-addrow input::placeholder{font-weight:400;color:var(--t3)}
.mc-addbtn{height:34px;padding:0 14px;border-radius:17px;background:var(--primary);color:#fff;font-size:13px;font-weight:700;flex:none}
.mc-foot{margin-top:10px;font-size:11.5px;line-height:1.5;color:var(--t3);flex:none}
.mn-srt.mc-frow{display:flex;align-items:center;height:52px;margin:0 0 8px;padding:0 4px 0 10px;border:1px solid #EDF0F3;border-radius:14px;background:#fff}
.mc-frow .tx{flex:1;min-width:0;margin-left:10px;display:flex;flex-direction:column}
.mc-frow .tx b{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mc-frow .tx span{font-size:11.5px;color:var(--t3)}
.mc-fempty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px 10px;text-align:center}
.mc-fempty b{margin-top:4px;font-size:14px;font-weight:600;color:var(--t2)}
.mc-fempty span{font-size:12px;color:var(--t3)}
.mc-subcard{padding:12px 14px 14px}
.mc-favcard{margin-top:16px;padding:16px 16px 10px}

/* ── 내역 표 (PC) — 분류 칩 뒤 작은 분류 · 이름 밑 태그 */
.mn-cc .mc-ccsub{font-style:normal;font-weight:500;color:var(--t2);margin-left:-3px}
.mc-tl{display:flex;align-items:center;gap:6px;min-width:0;max-width:100%;margin-top:2px}
.mc-tl>i{margin-top:0!important;min-width:0}
.mc-tl .mc-tags{flex-wrap:nowrap;overflow:hidden}

@media (min-width:600px){
  /* 분류 관리 — 왼쪽 큰 분류 · 가운데 작은 분류 · 오른쪽 자주 쓰는 분류 (카드가 아래 끝까지) */
  .mc-cats{display:grid;grid-template-columns:minmax(250px,1fr) minmax(0,1.45fr) minmax(250px,1fr);gap:14px;min-height:520px}
  .mc-col{display:flex;flex-direction:column;min-height:0;overflow:hidden}
  .mc-scroll,.mc-mid .mc-sbody,.mc-right .mc-favlist{flex:1;min-height:0;overflow-y:auto;margin:0 -8px;padding:0 8px}
  .mc-glab{display:flex;align-items:center;gap:6px;padding:10px 4px 6px;font-size:12.5px;font-weight:600;color:var(--t3)}
  .mc-glab:first-child{padding-top:0}
  .mc-glab em{font-style:normal;color:var(--t4)}
  .mn-srt.mc-big{display:flex;align-items:center;height:52px;margin:0 0 2px;border-radius:14px;background:#fff}
  .mc-big:hover{background:#F5F7FA}
  .mc-big.on{background:#EEF4FC}
  .mc-big.on .tx b{color:var(--primary)}
  .mc-pick{flex:1;min-width:0;height:100%;display:flex;align-items:center;padding:0 4px 0 10px;text-align:left}
  .mc-pick .tx{flex:1;min-width:0;margin-left:12px;display:flex;flex-direction:column}
  .mc-pick .tx b{font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mc-pick .tx span{font-size:11.5px;color:var(--t3)}
  .mn-srt .mn-row.mc-edit{width:34px;height:34px;padding:0;margin-right:8px;border-radius:17px;display:flex;align-items:center;justify-content:center;flex:none}
  .mc-edit:hover{background:#fff;box-shadow:0 0 0 1px #E3E7EC}
  .mc-addbig.mn-add{height:40px;padding:0;margin:4px 0 6px;border-radius:13px;background:#F5F7FA;font-size:13.5px;font-weight:700;display:flex;align-items:center;justify-content:center}
  .mc-addbig.mn-add:hover{background:#EDF0F4}
  .mc-left .mn-hint{padding:8px 0 0;flex:none}
  .mc-mid .mc-hd b{font-size:18px}
  .mc-subcard .mc-sbody{max-height:none}
}
@media (max-width:599px){
  .mc-tagf .mc-k{width:100px}
  .mc-favcard .mc-favlist{margin-bottom:6px}
}