/* Claude 테마 — 1399 AI 상담챗봇(/app/aichat) 기본 테마 정밀 이식. index.html·admin.html 인라인 스타일의 토큰·컴포넌트 레시피를 그대로 옮겨 app.css/admin.css 변수를 html[data-theme="claude"] 로 덮어쓴다 */

/* ═══ 1. 토큰 (aichat :root 원값) ═══ */
html[data-theme="claude"]{
  /* 팔레트 — aichat index.html/admin.html :root 동일값 */
  --navy:#0F2C52; --navy-d:#0A2140; --navy-l:#1E4A88; --navy-dd:#071829;
  --blue:#1E5BB8; --blue-bg:#e8f0fb; --blue-bd:#d3e3f8;
  --teal:#0E8A8A; --teal-bg:#e3f4f4;
  --amber:#B45309; --amber-bg:#fcf3e6;
  --red:#B91C1C;   --red-bg:#fdecec;
  --green:#15803D; --green-bg:#e7f5ec;
  /* 관리자 강조색(원본 gold 자리) — aichat 바이올렛 */
  --gold:#6D28D9;
  /* 텍스트·선·표면 */
  --ink:#16202e; --txt:#16202e; --sub:#43505f;
  --line:#e4e8ee; --line-d:#cbd3df;
  --bg:#eef2f7; --card:#FFFFFF;
  /* aichat admin.html --shadow 원값 */
  --shadow:0 1px 2px rgba(15,44,82,.05),0 6px 18px rgba(15,44,82,.06);
  /* aichat 카드 radius 13px */
  --r:13px;

  /* 테마 내부 보조 토큰 — aichat 원값 매핑 */
  --t-alt:#f7f9fc;            /* thead 배경 (aichat thead th) */
  --t-soft:#eef1f5;           /* line-2 — 칩·트랙·비활성 배경 */
  --t-hover:#fafbff;          /* 행 hover (aichat tbody tr:hover) */
  --t-muted:#6b7785;          /* ink-3 */
  --t-accent:#6D28D9;         /* violet */
  --t-accent-d:#5b2bb0;       /* violet hover (aichat .btn.pri:hover) */
  --t-accent-soft:#f0eafd;    /* violet-soft */
  --t-on-accent:#FFFFFF;
  --t-appbar:#0e2e5a;         /* aichat .appbar 배경 */
  --t-side:#0d1f38;           /* aichat admin .side 배경 */
  --t-nav-ink:#cfe0f6;        /* 진한 배경 위 본문 (aichat .mbtn) */
  --t-nav-ink-2:#9fb3cf;      /* aichat --side-ink */
  --t-nav-grp:#5f779a;        /* aichat .navgrp .gl */
  --t-scrim:rgba(15,32,46,.45);   /* aichat .modal-bg */
  --t-focus:rgba(109,40,217,.28); /* 바이올렛 포커스 링 */
  --t-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
/* 사용자/관리자 배경 분리 — aichat index --bg / admin --bg */
html[data-theme="claude"] body[data-app="user"]{background:#eef2f7}
html[data-theme="claude"] body[data-app="admin"]{background:#f3f5f9}

/* ═══ 2. 사용자 SPA(app.css) — aichat 컴포넌트 레시피 ═══ */
/* 브랜드 마크 — aichat 로고 그라데이션(135deg violet→blue)·radius 9px */
html[data-theme="claude"] body[data-app="user"] .brand-mark{
  background:linear-gradient(135deg,#6D28D9,#1E5BB8);border-radius:9px}
/* GNB — aichat appbar #0e2e5a, 활성 언더라인 바이올렛 */
html[data-theme="claude"] body[data-app="user"] .gnb{background:var(--t-appbar)}
html[data-theme="claude"] body[data-app="user"] .gnb a{color:var(--t-nav-ink)}
html[data-theme="claude"] body[data-app="user"] .gnb a.on{background:rgba(255,255,255,.08)}
html[data-theme="claude"] body[data-app="user"] .gnb a.on::after{background:var(--t-accent)}
html[data-theme="claude"] body[data-app="user"] .pt-code{color:var(--t-nav-ink-2);font-family:var(--t-mono)}
html[data-theme="claude"] body[data-app="user"] .pt-meta{color:var(--t-nav-ink)}
/* 폐쇄망 배지 — aichat .topbar .env(바이올렛 소프트 필) */
html[data-theme="claude"] body[data-app="user"] .net-badge{
  background:var(--t-accent-soft);color:var(--t-accent);border:1px solid #ddd0f5;border-radius:999px}

/* 주 버튼 — aichat .btn.pri(바이올렛, hover 진보라) */
html[data-theme="claude"] body[data-app="user"] .btn-p{background:var(--t-accent)}
html[data-theme="claude"] body[data-app="user"] .btn-p:hover{background:var(--t-accent-d)}
/* 보조 버튼 — aichat .btn(hover 바이올렛 테두리·텍스트) */
html[data-theme="claude"] body[data-app="user"] .btn-o:hover{border-color:var(--t-accent);color:var(--t-accent)}

/* 표 — aichat thead #f7f9fc(무거운 네이비 상단 보더 제거)·hover #fafbff */
html[data-theme="claude"] body[data-app="user"] .tbl thead th{
  background:var(--t-alt);border-top:1px solid var(--line);color:var(--sub)}
html[data-theme="claude"] body[data-app="user"] .tbl tbody tr:hover{background:var(--t-hover)}

/* 포커스 — aichat composer input:focus(바이올렛 보더 + 소프트 링) */
html[data-theme="claude"] body[data-app="user"] .f input:focus,
html[data-theme="claude"] body[data-app="user"] .f select:focus,
html[data-theme="claude"] body[data-app="user"] textarea:focus{
  outline:none;border-color:var(--t-accent);box-shadow:0 0 0 3px var(--t-accent-soft)}

/* 배지 — aichat .bdg(완전 필 999px) */
html[data-theme="claude"] body[data-app="user"] .bdg{border-radius:999px}

/* 모달 — aichat radius 15·딥 섀도·스크림 */
html[data-theme="claude"] body[data-app="user"] .modal{
  border-radius:15px;box-shadow:0 20px 60px rgba(15,44,82,.25)}
html[data-theme="claude"] body[data-app="user"] .modal-bg{background:var(--t-scrim)}

/* KPI 수치 — aichat .kpi .val(tabular-nums) */
html[data-theme="claude"] body[data-app="user"] .kpi-box .v{font-variant-numeric:tabular-nums}

/* 표면 통일 — 하드코딩 흰 배경 보정 */
html[data-theme="claude"] body[data-app="user"] .topbar,
html[data-theme="claude"] body[data-app="user"] .snb,
html[data-theme="claude"] body[data-app="user"] .footer,
html[data-theme="claude"] body[data-app="user"] .pt-body,
html[data-theme="claude"] body[data-app="user"] .inbox-item,
html[data-theme="claude"] body[data-app="user"] .sess,
html[data-theme="claude"] body[data-app="user"] .cal-nav,
html[data-theme="claude"] body[data-app="user"] .pager button,
html[data-theme="claude"] body[data-app="user"] .btn-o,
html[data-theme="claude"] body[data-app="user"] .ctabs button.on,
html[data-theme="claude"] body[data-app="user"] .f input[type=text],
html[data-theme="claude"] body[data-app="user"] .f input[type=date],
html[data-theme="claude"] body[data-app="user"] .f input[type=number],
html[data-theme="claude"] body[data-app="user"] .f select{background:var(--card)}

html[data-theme="claude"] body[data-app="user"] .ftbl th,
html[data-theme="claude"] body[data-app="user"] .epi-h,
html[data-theme="claude"] body[data-app="user"] .cal th,
html[data-theme="claude"] body[data-app="user"] .file-mock,
html[data-theme="claude"] body[data-app="user"] .sess.todo{background:var(--t-alt)}

html[data-theme="claude"] body[data-app="user"] .btn-g,
html[data-theme="claude"] body[data-app="user"] .bdg.closed,
html[data-theme="claude"] body[data-app="user"] .dday.ok,
html[data-theme="claude"] body[data-app="user"] .ctabs,
html[data-theme="claude"] body[data-app="user"] .gauge .g-bar,
html[data-theme="claude"] body[data-app="user"] .bar-row .bt,
html[data-theme="claude"] body[data-app="user"] .life-line,
html[data-theme="claude"] body[data-app="user"] .svc-pill.off,
html[data-theme="claude"] body[data-app="user"] .modal-x:hover{background:var(--t-soft)}
html[data-theme="claude"] body[data-app="user"] .bdg.closed,
html[data-theme="claude"] body[data-app="user"] .dday.ok,
html[data-theme="claude"] body[data-app="user"] .svc-pill.off{color:var(--t-muted)}
html[data-theme="claude"] body[data-app="user"] .svc-pill.off{border-color:var(--line)}

html[data-theme="claude"] body[data-app="user"] .last-login,
html[data-theme="claude"] body[data-app="user"] .bread,
html[data-theme="claude"] body[data-app="user"] .tbl .muted,
html[data-theme="claude"] body[data-app="user"] .kpi-box .d,
html[data-theme="claude"] body[data-app="user"] .hint,
html[data-theme="claude"] body[data-app="user"] .life-yr i,
html[data-theme="claude"] body[data-app="user"] .sess .d,
html[data-theme="claude"] body[data-app="user"] .footer-in,
html[data-theme="claude"] body[data-app="user"] ::placeholder{color:var(--t-muted)}

/* 강조(원본 #F5B942 자리) — 바이올렛 */
html[data-theme="claude"] body[data-app="user"] .kpi-box.a::before,
html[data-theme="claude"] body[data-app="user"] .gauge.warn .g-fill{background:var(--t-accent)}

/* 선·구분자 */
html[data-theme="claude"] body[data-app="user"] .life-yr,
html[data-theme="claude"] body[data-app="user"] .life-lbl::before{background:var(--line-d)}
html[data-theme="claude"] body[data-app="user"] .sess.done{border-color:var(--green)}
html[data-theme="claude"] body[data-app="user"] .alert-strip{border-color:var(--red)}
html[data-theme="claude"] body[data-app="user"] .ctabs button.on{box-shadow:0 1px 4px rgba(15,44,82,.14)}
html[data-theme="claude"] body[data-app="user"] .tbl tbody tr:hover{background:var(--t-hover)}

/* 페이저 활성 — 일괄 카드 배경 규칙이 .on 상태를 덮으므로 바이올렛으로 명시 */
html[data-theme="claude"] body[data-app="user"] .pager button.on{
  background:var(--t-accent);border-color:var(--t-accent);color:#fff}

/* 서비스 칩 — aichat soft/deep 조합 */
html[data-theme="claude"] body[data-app="user"] .ch.c1{color:#6D28D9;border-color:#ddd0f5;background:#f0eafd}
html[data-theme="claude"] body[data-app="user"] .ch.c2{color:#B45309;border-color:#f0ddc0;background:#fcf3e6}
html[data-theme="claude"] body[data-app="user"] .ch.c3{color:#0E8A8A;border-color:#cfeaea;background:#e3f4f4}
html[data-theme="claude"] body[data-app="user"] .ch.c4{color:#1E5BB8;border-color:#d3e3f8;background:#e8f0fb}

/* 일정 카테고리 */
html[data-theme="claude"] body[data-app="user"] .evt.e1{background:#6D28D9}
html[data-theme="claude"] body[data-app="user"] .evt.e2{background:#B45309}
html[data-theme="claude"] body[data-app="user"] .evt.e3{background:#0E8A8A}
html[data-theme="claude"] body[data-app="user"] .evt.e4{background:#1E5BB8}
html[data-theme="claude"] body[data-app="user"] .evt.e5{background:#6b7785}
html[data-theme="claude"] body[data-app="user"] .evt.e6{background:#B91C1C}
html[data-theme="claude"] body[data-app="user"] .evt.e7{background:#15803D}

/* ═══ 3. 관리자 콘솔(admin.css) — aichat admin 레시피 ═══ */
/* 사이드바 — aichat .side(플랫 #0d1f38), 활성 = 바이올렛 그라데이션 필 */
html[data-theme="claude"] body[data-app="admin"] .side{background:var(--t-side)}
html[data-theme="claude"] body[data-app="admin"] .snav a{color:var(--t-nav-ink-2)}
html[data-theme="claude"] body[data-app="admin"] .snav a:hover{background:#15294a;color:#fff}
html[data-theme="claude"] body[data-app="admin"] .snav a.on{
  background:linear-gradient(90deg,#6D28D9,#5b2bb0);color:#fff;
  border-left-color:transparent;box-shadow:0 2px 10px rgba(109,40,217,.35)}
html[data-theme="claude"] body[data-app="admin"] .snav .grp{
  color:var(--t-nav-grp);font-family:var(--t-mono);text-transform:uppercase;letter-spacing:.09em}
html[data-theme="claude"] body[data-app="admin"] .snav a .n{
  background:#1c3357;color:#9fc7ff;font-family:var(--t-mono)}
html[data-theme="claude"] body[data-app="admin"] .snav a.on .n{background:rgba(255,255,255,.2);color:#fff}
html[data-theme="claude"] body[data-app="admin"] .side .logo .s,
html[data-theme="claude"] body[data-app="admin"] .side .foot{color:var(--t-nav-grp)}
html[data-theme="claude"] body[data-app="admin"] .side .logo .adm{background:var(--gold);color:var(--t-on-accent)}

/* 상단바 — aichat .topbar(반투명 + 블러) */
html[data-theme="claude"] body[data-app="admin"] .topbar{
  background:rgba(255,255,255,.94);backdrop-filter:blur(10px)}

/* 주 버튼 — aichat .btn.pri */
html[data-theme="claude"] body[data-app="admin"] .btn-p{background:var(--t-accent)}
html[data-theme="claude"] body[data-app="admin"] .btn-p:hover{background:var(--t-accent-d)}
html[data-theme="claude"] body[data-app="admin"] .btn-r{background:var(--gold);color:var(--t-on-accent)}
html[data-theme="claude"] body[data-app="admin"] .btn-o{color:var(--navy);border-color:var(--line-d)}
html[data-theme="claude"] body[data-app="admin"] .btn-o:hover{border-color:var(--t-accent);color:var(--t-accent);background:#fff}

/* 표 — aichat thead·hover */
html[data-theme="claude"] body[data-app="admin"] .tbl th,
html[data-theme="claude"] body[data-app="admin"] .ftbl th,
html[data-theme="claude"] body[data-app="admin"] .mtx th,
html[data-theme="claude"] body[data-app="admin"] .batch{background:var(--t-alt)}
html[data-theme="claude"] body[data-app="admin"] .tbl tr:hover td{background:var(--t-hover)}
html[data-theme="claude"] body[data-app="admin"] .tbl td{border-bottom-color:var(--line)}

/* 표면·텍스트 보정 */
html[data-theme="claude"] body[data-app="admin"] .modal,
html[data-theme="claude"] body[data-app="admin"] .kpi-box,
html[data-theme="claude"] body[data-app="admin"] .searchbar,
html[data-theme="claude"] body[data-app="admin"] .pager button,
html[data-theme="claude"] body[data-app="admin"] input,
html[data-theme="claude"] body[data-app="admin"] select,
html[data-theme="claude"] body[data-app="admin"] textarea{background:var(--card)}
html[data-theme="claude"] body[data-app="admin"] .donut::after{background:var(--card)}
html[data-theme="claude"] body[data-app="admin"] .btn-g,
html[data-theme="claude"] body[data-app="admin"] .bdg.off,
html[data-theme="claude"] body[data-app="admin"] .gauge,
html[data-theme="claude"] body[data-app="admin"] .bar-row .tr,
html[data-theme="claude"] body[data-app="admin"] .sess,
html[data-theme="claude"] body[data-app="admin"] .file-chip{background:var(--t-soft)}
html[data-theme="claude"] body[data-app="admin"] .file-chip{border-color:var(--line)}
html[data-theme="claude"] body[data-app="admin"] .bdg.info,
html[data-theme="claude"] body[data-app="admin"] .tag-info{background:var(--blue-bg);border-color:var(--blue-bd);color:var(--blue)}
html[data-theme="claude"] body[data-app="admin"] .bdg.navy,
html[data-theme="claude"] body[data-app="admin"] .chip{background:var(--blue-bg);border-color:var(--blue-bd);color:var(--navy)}
html[data-theme="claude"] body[data-app="admin"] .batch .ic{background:var(--blue-bg)}
html[data-theme="claude"] body[data-app="admin"] .kpi-box .d,
html[data-theme="claude"] body[data-app="admin"] .hint,
html[data-theme="claude"] body[data-app="admin"] ::placeholder{color:var(--t-muted)}
html[data-theme="claude"] body[data-app="admin"] .bdg{border-radius:999px}
html[data-theme="claude"] body[data-app="admin"] .kpi-box .v{font-variant-numeric:tabular-nums}
html[data-theme="claude"] body[data-app="admin"] .pager button.on{
  background:var(--t-accent);border-color:var(--t-accent);color:#fff}

/* 입력 포커스 — 바이올렛 */
html[data-theme="claude"] body[data-app="admin"] input,
html[data-theme="claude"] body[data-app="admin"] select,
html[data-theme="claude"] body[data-app="admin"] textarea{border-color:var(--line-d)}
html[data-theme="claude"] body[data-app="admin"] input:focus,
html[data-theme="claude"] body[data-app="admin"] select:focus,
html[data-theme="claude"] body[data-app="admin"] textarea:focus{
  outline:2px solid var(--t-focus);border-color:var(--t-accent)}

/* 모달·스크림 */
html[data-theme="claude"] body[data-app="admin"] .modal{
  border-radius:15px;box-shadow:0 20px 60px rgba(15,44,82,.25)}
html[data-theme="claude"] body[data-app="admin"] .modal-bg{background:var(--t-scrim)}
html[data-theme="claude"] body[data-app="admin"] .modal .mh button{color:var(--t-muted)}

/* 강조색 위 텍스트 — 원본 gold(#3A2C08) 조합 보정 */
html[data-theme="claude"] body[data-app="admin"] .card-h .bar,
html[data-theme="claude"] body[data-app="admin"] .sec-title::before,
html[data-theme="claude"] body[data-app="admin"] .kpi-box.a::before,
html[data-theme="claude"] body[data-app="admin"] .gauge.warn i{background:var(--gold)}

/* ═══ 4. 로그인 페이지 ═══ */
html[data-theme="claude"] body[data-app="user"] .msg{border-color:var(--red)}
html[data-theme="claude"] body[data-app="user"] .login-foot{color:var(--t-muted)}
html[data-theme="claude"] body[data-app="admin"] .login-card{
  background:linear-gradient(165deg,var(--navy) 0%,var(--navy-dd) 100%);
  border-color:rgba(109,40,217,.34);
}
html[data-theme="claude"] body[data-app="admin"] .env-badge{
  background:rgba(109,40,217,.18);color:#C9B4F7;border-color:rgba(109,40,217,.45);
}
html[data-theme="claude"] body[data-app="admin"] .field input:focus,
html[data-theme="claude"] body[data-app="user"] .field input:focus{
  border-color:var(--t-accent);box-shadow:0 0 0 3px var(--t-focus);
}
html[data-theme="claude"] body[data-app="admin"] .change-guide{
  color:#DCD0F8;background:rgba(109,40,217,.14);border-color:rgba(109,40,217,.36);
}
html[data-theme="claude"] body[data-app="admin"] .logo .s,
html[data-theme="claude"] body[data-app="admin"] .hint,
html[data-theme="claude"] body[data-app="admin"] .security-note{color:var(--t-nav-ink-2)}
