/* 아름 통합관리 — 공통 스타일 (내부 전용, 모바일/태블릿 대응) */
/* 한국 제품 표준 UI 폰트 Pretendard (AI 기본 Inter 탈피) */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.css');
:root{
  /* 따뜻한 크림 중립 + 딥 파인그린/틸 (돌봄·복지 톤, 차가운 AI블루 탈피) */
  --navy:#173f39;      /* 딥 파인그린 : 헤더/제목/브랜드 */
  --navy-2:#1f524a;
  --blue:#157a6e;      /* 틸그린 : 버튼·링크·선택(유일 악센트) */
  --blue-d:#0f5f55;    /* 진한 틸 : hover·링크 텍스트 */
  --blue-50:#e4f0ed;   /* 연한 틸 틴트 */
  --bg:#f7f3ec;        /* 따뜻한 크림 배경 */
  --card:#fffdf9;      /* 웜 화이트 카드 */
  --line:#e7ded0;      /* 웜 타우프 경계 */
  --line-2:#f1ebe0;
  --text:#2c2823;      /* 웜 차콜 본문 */
  --muted:#7c7367;     /* 웜 그레이 보조 */
  --ok:#2f7d55;   --ok-bg:#e8f2ea;      /* 완료 : 잎 초록 */
  --pending:#bb6336; --pending-bg:#f7eae0; /* 대기 : 흙빛 클레이 */
  --danger:#bf4a3a;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Malgun Gothic","맑은 고딕",sans-serif;
  background:var(--bg);color:var(--text);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
/* 키보드 포커스 표시(접근성) */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,.type-btn:focus-visible{outline:3px solid #93c5fd;outline-offset:2px}

/* 레이아웃 */
.topbar{background:var(--navy);position:sticky;top:0;z-index:20}
.topbar-in{max-width:1040px;margin:0 auto;padding:13px 16px;color:#fff;
  display:flex;align-items:center;justify-content:space-between;gap:12px}
.topbar .brand{font-weight:700;font-size:16px;color:#fff;line-height:1.25}
.topbar .brand small{display:block;font-weight:400;opacity:.6;font-size:11px;letter-spacing:.2px}
.topbar .who{font-size:13px;opacity:.95;display:flex;align-items:center;gap:10px}
.topbar .who a{color:#bfdbfe}
.wrap{max-width:1040px;margin:0 auto;padding:22px 16px 64px}
.nav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 18px}
.nav a{background:var(--card);border:1px solid var(--line);border-radius:9px;padding:9px 16px;color:var(--navy);font-size:15px;font-weight:500}
.nav a.active{background:var(--navy);color:#fff;border-color:var(--navy)}

/* 카드 */
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:22px;margin-bottom:16px}
.card h2{margin:0 0 4px;font-size:19px;color:var(--navy);letter-spacing:-.3px;font-weight:700}
.card .sub{color:var(--muted);font-size:13px;margin:0 0 16px}
.grid{display:grid;gap:14px}
.grid.cols-2{grid-template-columns:repeat(2,1fr)}
.grid.cols-3{grid-template-columns:repeat(3,1fr)}
@media(max-width:720px){.grid.cols-2,.grid.cols-3{grid-template-columns:1fr}}

/* 통계 타일 */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:18px}
@media(max-width:720px){.tiles{grid-template-columns:repeat(2,1fr)}}
.tile{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px 16px;text-align:center}
.tile .n{font-size:34px;font-weight:800;color:var(--navy);line-height:1.1;letter-spacing:-.5px}
.tile .l{color:var(--muted);font-size:14px;margin-top:4px}

/* 폼 */
label{display:block;font-size:14px;color:var(--muted);margin:12px 0 5px}
input,select,textarea{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:11px;
  font-size:16px;font-family:inherit;background:#fff;min-height:48px}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--blue)}
textarea{resize:vertical;min-height:90px}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--blue);color:#fff;border:0;
  border-radius:10px;padding:12px 22px;font-size:16px;font-weight:600;cursor:pointer;min-height:48px}
.btn:hover{background:var(--blue-d);text-decoration:none}
.btn.gray{background:var(--line-2);color:var(--navy)}
.btn.danger{background:var(--danger)}
.btn.sm{padding:8px 14px;font-size:14px;min-height:40px}
.row{display:flex;gap:14px;flex-wrap:wrap}
.row>*{flex:1;min-width:160px}
/* 모바일: 폼 칸을 억지로 나란히 두지 않고 한 줄에 하나씩 */
@media(max-width:620px){.row{flex-direction:column;gap:8px}.row>*{width:100%;min-width:0}}

/* 표 */
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line)}
th{color:var(--muted);font-weight:600;font-size:12.5px;background:var(--line-2)}
tr:hover td{background:#faf6ee}

/* 모바일: 표 → 카드형 리스트 (가독성 우선) */
@media(max-width:620px){
  table.rtable thead{display:none}
  table.rtable, table.rtable tbody, table.rtable tr, table.rtable td{display:block;width:100%}
  table.rtable tr{border:1px solid var(--line);border-radius:14px;padding:6px 16px;margin-bottom:12px;background:#fff}
  table.rtable tr:hover td{background:transparent}
  table.rtable td{border:0;padding:9px 0;display:flex;align-items:center;justify-content:space-between;gap:16px;
    border-bottom:1px solid var(--line-2)}
  table.rtable td:last-child{border-bottom:0}
  table.rtable td::before{content:attr(data-label);color:var(--muted);font-size:12.5px;font-weight:600;flex:0 0 auto}
  table.rtable td.strong{font-size:16px;font-weight:700;color:var(--navy)}
  table.rtable td .btn.sm{padding:8px 16px}
}

/* 뱃지 */
.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600}
.badge.ok{background:var(--ok-bg);color:var(--ok)}
.badge.pending{background:var(--pending-bg);color:var(--pending)}
.badge.admin{background:var(--blue-50);color:var(--blue-d)}
.badge.staff{background:var(--line-2);color:var(--muted)}

/* 알림 */
.alert{padding:12px 16px;border-radius:10px;margin-bottom:16px;font-size:14px}
.alert.err{background:#fdecec;color:#a52b2b;border:1px solid #f3c6c6}
.alert.ok{background:#e9f7ef;color:#1a7a43;border:1px solid #bfe6cf}
.muted{color:var(--muted)}
.right{text-align:right}

/* 로그인 */
.login-wrap{max-width:380px;margin:10vh auto;padding:0 16px}
.login-wrap .card{padding:30px 28px}
.login-mark{width:54px;height:54px;border-radius:13px;background:var(--navy);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.login-mark svg{width:28px;height:28px;color:#fff}
.login-wrap h1{font-size:21px;color:var(--navy);margin:0 0 3px;text-align:center;letter-spacing:-.2px}
.login-wrap .sub{text-align:center}

/* 상담 녹음 재생 (관리자 개인 페이지) */
.voice{background:var(--blue-50);border-radius:10px;padding:12px 14px;margin:10px 0}
.voice-label{display:block;font-size:13px;font-weight:700;color:var(--blue-d);margin-bottom:6px}
.voice audio{width:100%;height:44px}
/* 대상자 목록의 비밀번호 설정 펼치기 */
details.pwset{margin-top:6px}
details.pwset summary{cursor:pointer;color:var(--blue-d);font-size:14px;font-weight:600}