/* ============================================================================
   theme.css — 총무인사팀 AI 포털 공용 스킨 (현재 = Apple 디자인 가이드)
   원본 레이아웃 그대로, 색·폰트·라운드만 교체. 각 페이지 <head> 끝 <link>로 로드되어
   인라인 <style>를 덮어씀. 프록시(감사/검토)는 _inject_theme가 자동 주입.
   Claude 버전은 theme-claude.css 로 보존. 스킨 전환 = 이 파일 내용 교체 + ?v= 올림.
   시맨틱색(성공/경고/오류, 발송 경고바, 감사 카테고리 색)은 보존.
   ============================================================================ */
:root{
  --accent:#0066cc; --accent-tint:#e9f1fb; --accent-tint2:#f2f7fc; --accent-bd:#cfe0f5;
  --a-primary:#0066cc; --a-primary-focus:#0071e3; --a-on-dark-link:#2997ff;
  --a-ink:#1d1d1f; --a-muted:#7a7a7a; --a-muted-2:#333;
  --a-canvas:#fff; --a-parchment:#f5f5f7; --a-pearl:#fafafc;
  --a-tile-dark:#1d1d1f; --a-black:#000;
  --a-hairline:#e0e0e0; --a-divider:#f0f0f0;
  --a-on-dark:#fff; --a-on-dark-soft:#a1a1a6;
  --a-success:#248a3d; --a-warning:#b25000; --a-error:#d70015;
  --a-disp:-apple-system,'SF Pro Display',BlinkMacSystemFont,system-ui,'Malgun Gothic',sans-serif;
  --a-text:-apple-system,'SF Pro Text',BlinkMacSystemFont,system-ui,'Malgun Gothic',sans-serif;
}

/* ── 베이스 ── */
body{background:var(--a-parchment)!important;color:var(--a-ink)!important;font-family:var(--a-text)!important;}
*{ -webkit-font-smoothing:antialiased; }

/* 디스플레이(제목류) — SF Pro Display, 굵게, 음수 자간(Apple 타이트) */
h1,h2,h3,.portal-title,.header h1,.header h2,.header .title,.header .t,.gh,.hero h1{
  font-family:var(--a-disp)!important; font-weight:600!important;
  letter-spacing:-.5px!important;
}

/* ── 상단 헤더 밴드 (모든 에이전트 페이지가 .header 사용) → 니어블랙 + 흰 SF ── */
.header{
  background:var(--a-tile-dark)!important; color:#fff!important;
  border-bottom:none!important;
}
.header h1,.header h2,.header .title,.header .t{ color:#fff!important; }
.header .sub, .header .desc, .header p{ color:var(--a-on-dark-soft)!important; }
.header a{ color:var(--a-on-dark-link)!important; }

/* ── 버튼 — 필(pill), 프라이머리 블루 ── */
.btn, button{ font-family:var(--a-text)!important; }
.btn{ border-radius:9999px!important; }
.btn.primary, .btn-primary, button.primary{
  background:var(--a-primary)!important; color:#fff!important; border:none!important;
}
.btn.primary:active, button.primary:active{ transform:scale(.97); }
.btn.ghost, .btn.secondary, .btn.outline{
  background:var(--a-canvas)!important; color:var(--a-ink)!important;
  border:1px solid var(--a-hairline)!important;
}

/* 인라인 링크 → Action Blue */
a{ color:var(--a-primary); }

/* ── 콘텐츠 카드 — 흰색, 헤어라인, 18px, 그림자 없음 ── */
.card{
  background:var(--a-canvas)!important; border:1px solid var(--a-hairline)!important;
  border-radius:18px!important; box-shadow:none!important;
}

/* ── 탭 ── */
.tab.on, .tab.active{ color:var(--a-ink)!important; border-bottom-color:var(--a-primary)!important; }

/* ── 표 ── */
table th, .hist th{ background:var(--a-parchment)!important; color:var(--a-ink)!important; }
table td, .hist td{ border-color:var(--a-divider)!important; }

/* ── 입력 ── */
input,textarea,select{
  background:var(--a-canvas)!important; border:1px solid var(--a-hairline)!important;
  border-radius:8px!important; color:var(--a-ink)!important; font-family:var(--a-text)!important;
}
input:focus,textarea:focus,select:focus{
  outline:2px solid var(--a-primary-focus)!important; border-color:var(--a-primary)!important;
}

/* ============================================================================
   포털 메인 (app.py PORTAL_HTML) — 고유 클래스
   ============================================================================ */
.portal-header{
  background:var(--a-tile-dark)!important; color:#fff!important; border-bottom:none!important;
}
.portal-title{ color:#fff!important; }
.portal-sub{ color:var(--a-on-dark-soft)!important; opacity:1!important; }
.topbar .who{ color:var(--a-muted)!important; }
.topbar a, .admin-link{ color:var(--a-primary)!important; }

.agent-card{
  background:var(--a-canvas)!important; border:1px solid var(--a-hairline)!important;
  border-radius:18px!important; box-shadow:none!important; color:var(--a-ink)!important;
}
.agent-card:hover{ box-shadow:none!important; transform:none!important; }
/* 아이콘 타일 → 무채색(Apple 절제, 이모지가 색을 담당) */
.agent-icon{ background:var(--a-parchment)!important; border-radius:11px!important; }
.agent-name{ color:var(--a-ink)!important; font-family:var(--a-text)!important; font-weight:600!important; }
.agent-desc{ color:var(--a-muted)!important; }
.agent-badge{ border-radius:9999px!important; }
.agent-stats{ color:var(--a-muted)!important; }
.agent-stats .s-item{
  background:var(--a-parchment)!important; color:var(--a-muted-2)!important; border-radius:8px!important;
}

/* 푸터 → 파치먼트(Apple 푸터) */
.footer{ background:var(--a-parchment)!important; color:var(--a-muted-2)!important; border-top:none!important; }

/* ============================================================================
   로그인 (LOGIN_HTML)
   ============================================================================ */
.login-box{
  background:var(--a-canvas)!important; border:1px solid var(--a-hairline)!important;
  box-shadow:none!important; border-radius:18px!important;
}
.login-title{ font-family:var(--a-disp)!important; font-weight:600!important; letter-spacing:-.5px!important; color:var(--a-ink)!important; }
.login-sub{ color:var(--a-muted)!important; }
.login-box button{ background:var(--a-primary)!important; color:#fff!important; border-radius:9999px!important; }

/* ============================================================================
   접근 거부 (FORBIDDEN_HTML)
   ============================================================================ */
.box{ background:var(--a-canvas)!important; border:1px solid var(--a-hairline)!important;
  box-shadow:none!important; border-radius:18px!important; }
.box h1{ font-family:var(--a-disp)!important; font-weight:600!important; }
.box a{ color:var(--a-primary)!important; }

/* ══════ 에이전트 내부 컴포넌트 액센트 오버라이드 (변수기반·자동생성) ══════ */
/* 브랜드 파랑/틸/인디고 → var(--accent). :root 액센트만 바꾸면 내부까지 전환. 초록·빨강 보존. */

/* — dispatch — */
.group-flow{border-color:var(--accent-tint) !important}
.group-flow .group-label{color:var(--accent) !important}
.pipe-step:hover{border-color:var(--accent) !important; background:var(--accent-tint2) !important}
.pipe-step.view-active{border-color:var(--accent) !important; background:var(--accent-tint2) !important}
.tab:hover{color:var(--accent) !important}
.tab.active{color:var(--accent) !important; border-bottom-color:var(--accent) !important}
.stage-title{background:var(--accent-tint) !important}
.ai-suggestion{border:1px solid var(--accent-bd) !important}
.ai-dept{color:var(--accent) !important}
.btn-confirm{background:var(--accent) !important}
.status-confirmed{background:var(--accent-tint) !important}
.body-toggle{color:var(--accent) !important}
.dept-tag{background:var(--accent-tint) !important}
.dept-search-input:focus{border-color:var(--accent) !important}
.dept-search-item:hover{background:var(--accent-tint2) !important}
.dept-search-item.active{background:var(--accent-tint2) !important}
.dash-card.highlight{border-color:var(--accent) !important; background:var(--accent-tint2) !important}
.stage-chip.fetch{background:var(--accent-tint) !important}
.stage-filter button:hover{border-color:var(--accent) !important}
.stage-filter button.active{background:var(--accent) !important; border-color:var(--accent) !important}
.ai-kpi .v{color:var(--accent) !important}
.ai-bar{background:var(--accent) !important}
.ai-bar-wrap.partial .ai-bar{background:var(--accent) !important}

/* — welfare — */
.s.hold{background:var(--accent-tint2) !important; color:var(--accent) !important}
.v.카탈로그필요{background:var(--accent-tint2) !important; color:var(--accent) !important}
.dec{color:var(--accent) !important}

/* — dept_assign — */
.btn-step:hover{border-color:var(--accent) !important; background:var(--accent-tint2) !important}
.btn-assign{background:var(--accent) !important}
.btn-assign:hover{background:var(--accent) !important}
.tab.active .cnt{background:var(--accent) !important}
.tier-rule{background:var(--accent-tint) !important}
.ai-person{color:var(--accent) !important}
.mini-ok{background:var(--accent) !important}
.mini-ok:hover{background:var(--accent) !important}

/* — approval — */
.btn-go{background:var(--accent) !important}
.type-연장{background:var(--accent-tint) !important}
.lv-팀장{background:var(--accent-tint) !important}

/* — admin — */
.admin-tag{background:var(--accent) !important}
.always{color:var(--accent) !important}
