/*!***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/.pnpm/next@15.5.12_@babel+core@7.29.0_@playwright+test@1.58.2_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[2]!./node_modules/.pnpm/next@15.5.12_@babel+core@7.29.0_@playwright+test@1.58.2_react-dom@19.2.4_react@19.2.4__react@19.2.4/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[10].use[3]!./src/app/globals.css ***!
  \***************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* Pretendard 웹폰트 (SMB.md 기본 폰트) — @import 는 반드시 최상단 */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@latest/dist/web/static/pretendard.css');

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.spin-animation {
  animation: spin 1s linear infinite;
}

:root {
  --font-sans: Pretendard, -apple-system, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "Fira Code", ui-monospace, monospace;

  --color-purple: hsl(243 83% 65%);
  --color-purple-bg: hsl(243 83% 95%);
  --color-pink: hsl(330 81% 60%);
  --color-pink-bg: hsl(330 81% 95%);
  --color-yellow: hsl(48 96% 53%);
  --color-yellow-bg: hsl(48 96% 95%);
  --color-orange: hsl(27 95% 56%);
  --color-orange-bg: hsl(27 95% 95%);
  --color-teal: hsl(168 76% 42%);
  --color-teal-bg: hsl(168 76% 95%);
  --color-blue: hsl(210 100% 50%);
  --color-blue-bg: hsl(210 100% 95%);
  --color-slate: hsl(215 27% 17%);
  --color-slate-bg: hsl(215 27% 92%);
  --color-lavender: hsl(263 100% 74%);
  --color-lavender-bg: hsl(263 100% 95%);
  --color-mauve: hsl(249 6% 58%);
  --color-mauve-bg: hsl(249 6% 94%);

  /* BI 차트 카테고리컬 팔레트 — Tableau 10 (BI 업계 표준, 라이트·다크 공통) */
  --chart-1: #4E79A7;
  --chart-2: #F28E2B;
  --chart-3: #E15759;
  --chart-4: #76B7B2;
  --chart-5: #59A14F;
  --chart-6: #EDC948;
  --chart-7: #B07AA1;
  --chart-8: #FF9DA7;
  --chart-9: #9C755F;

  --sidebar-width: 240px;
  --header-height: 56px;
  --content-max-width: 1200px;
  --overlay-bg: hsl(0 0% 0% / 0.5);
  --overlay-blur: blur(2px);
  --scrollbar-width: 0.75em;
  --scrollbar-thumb: hsl(0 0% 0% / 0.15);
  --scrollbar-thumb-hover: hsl(0 0% 0% / 0.25);
  --scrollbar-track: transparent;
}

[data-theme="dark"] {
  --color-purple-bg: hsl(243 40% 18%);
  --color-pink-bg: hsl(330 40% 18%);
  --color-yellow-bg: hsl(48 40% 16%);
  --color-orange-bg: hsl(27 40% 16%);
  --color-teal-bg: hsl(168 40% 14%);
  --color-blue-bg: hsl(210 40% 16%);
  --color-slate-bg: hsl(215 20% 22%);
  --color-lavender-bg: hsl(263 40% 18%);
  --color-mauve-bg: hsl(249 10% 22%);
  --overlay-bg: hsl(0 0% 0% / 0.65);
  --scrollbar-thumb: hsl(0 0% 100% / 0.15);
  --scrollbar-thumb-hover: hsl(0 0% 100% / 0.25);
}

html,
body {
  height: 100%;
  min-height: 100dvh;
  max-height: 100dvh;
  margin: 0;
  overscroll-behavior: none;
  font-family: var(--font-sans);
  /* ERP 건조함 — 자간 타이트 + 숫자 등폭(표·금액 정렬) */
  letter-spacing: -0.01em;
  font-feature-settings: "tnum";
}

* {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

*::-webkit-scrollbar {
  width: var(--scrollbar-width);
  height: var(--scrollbar-width);
}
*::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border-radius: 999px;
}
*::-webkit-scrollbar-thumb:hover {
  background: var(--scrollbar-thumb-hover);
}
*::-webkit-scrollbar-track {
  background: var(--scrollbar-track);
}

@media (max-width: 575px) {
  * {
    scrollbar-width: none;
  }
  *::-webkit-scrollbar {
    display: none;
  }
}

/* Skeleton shimmer animation */
@keyframes skeleton-shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

/* Shiki code block theming */
.shiki {
  margin: 0;
  padding: 12px;
}
.shiki code {
  font-family: var(--font-mono);
}

/* Typing indicator animation */
@keyframes typing-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: 0.4; }
  40% { transform: translateY(-4px); opacity: 1; }
}
.typing-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  display: inline-block;
  animation: typing-bounce 1.2s infinite;
}

/* Chat bubble hover action bar */
.chat-bubble-root:hover .chat-action-bar {
  opacity: 1 !important;
}

/* WCAG 2.1.1 — 키보드 포커스(Tab)로도 액션 바 노출 (호버 없이 접근). */
.chat-bubble-root:focus-within .chat-action-bar {
  opacity: 1 !important;
}

.cmd-palette-item:hover {
  background: var(--ant-color-bg-text-hover, rgba(0, 0, 0, 0.06));
}

/* Mobile responsive — hide sidebar on small screens */
@media (max-width: 575px) {
  .ant-layout-sider {
    display: none !important;
  }
}

:where(.lobe-flex) {
  /* Define defaults on the element itself to avoid CSS variable inheritance leaking to nested Flex */
  --lobe-flex: 0 1 auto;
  --lobe-flex-direction: column;
  --lobe-flex-wrap: nowrap;
  --lobe-flex-justify: flex-start;
  --lobe-flex-align: stretch;
  --lobe-flex-width: auto;
  --lobe-flex-height: auto;
  --lobe-flex-padding: 0;
  /* Keep padding-inline/block aligned with padding by default, and prevent inheriting from parent */
  --lobe-flex-padding-inline: var(--lobe-flex-padding);
  --lobe-flex-padding-block: var(--lobe-flex-padding);
  --lobe-flex-gap: 0;

  display: flex;

  flex: var(--lobe-flex);
  flex-direction: var(--lobe-flex-direction);
  flex-wrap: var(--lobe-flex-wrap);
  justify-content: var(--lobe-flex-justify);
  align-items: var(--lobe-flex-align);

  width: var(--lobe-flex-width);
  height: var(--lobe-flex-height);

  padding: var(--lobe-flex-padding);
  padding-inline: var(--lobe-flex-padding-inline);
  padding-block: var(--lobe-flex-padding-block);

  gap: var(--lobe-flex-gap);
}

.lobe-flex-hidden {
  display: none;
}

/* PDF 비즈니스 톤 유틸 (유니포스트 토마스 매뉴얼) ─ 빨간 불릿 섹션헤더·형광 하이라이트·카드 핑크 보더 */
.pdf-section-title::before {
  content: "●";
  color: #ee3048;
  margin-right: 8px;
  font-size: 0.8em;
  vertical-align: middle;
}
.hl-yellow {
  background-color: #fff200;
  padding: 0 3px;
  border-radius: 1px;
}

/* === SMB 그룹웨어: 카드 부드러운 그림자 (SMB.md) === */
.ant-card {
  border-radius: 14px !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.05) !important;
}
[data-testid="setup-checklist"] > div {
  border-radius: 16px !important;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06), 0 10px 30px rgba(15, 23, 42, 0.07) !important;
  border-color: #e6e9ef !important;
}
/* SMB A안: 흰색 사이드바 우측 경계선 */
.ant-layout-sider {
  border-right: 1px solid #e6e9ef;
}

/* === 메탈릭 테마 — 은은한 브러시드 광택 (data-theme 스코프 · 다른 테마 무영향) ===
   antd 플랫 토큰(background-color) 위에 background-image gradient 를 얹어 "눌린 금속" 질감.
   선택자 specificity([data-theme] + 클래스)가 antd 기본보다 높아 색은 유지·gradient 만 오버레이. */
[data-theme="metallic"] .ant-layout-sider {
  background-image: linear-gradient(180deg, #f3f5f7 0%, #e9ebee 55%, #dfe2e6 100%);
  border-right: 1px solid #c7ccd3;
}
[data-theme="metallic"] .ant-btn-primary {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(0, 0, 0, 0.1) 100%);
}
[data-theme="metallic"] .ant-btn-primary:hover {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.28) 0%, rgba(0, 0, 0, 0.06) 100%);
}
[data-theme="metallic"] .ant-card {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 42%);
}