@layer theme {
  :root,
  :host {
    --font-sans: 'Pretendard Variable', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace;
  }
}

.hashcorp.custom .displaynone {
  display: none;
}
.hashcorp.custom .kt-btn .ki-menu {
  font-size: 1.5rem;
}

/* 로그인 페이지 배경
-------------------------------- */
.hashcorp.custom .page-bg {
  background-image: url('../media/images/2600x1200/bg-10.png');
}
.hashcorp.custom .dark .page-bg {
  background-image: url('../media/images/2600x1200/bg-10-dark.png');
}

/* ------------------------------------------------------------------
 * Table
 * ------------------------------------------------------------------ */
.hashcorp.custom thead th {
  white-space: nowrap;
}

/* ------------------------------------------------------------------
 * Accordion indicator (+ / -)
 * - 일부 번들(styles.css)에서 indicator 토글 CSS가 누락되어 아이콘이 안 보이는 문제 보완
 * ------------------------------------------------------------------ */
.hashcorp.custom [data-kt-accordion-toggle] .kt-accordion-indicator-on {
  display: block !important;
}
.hashcorp.custom [data-kt-accordion-toggle] .kt-accordion-indicator-off {
  display: none !important;
}
.hashcorp.custom [data-kt-accordion-item].active [data-kt-accordion-toggle] .kt-accordion-indicator-on {
  display: none !important;
}
.hashcorp.custom [data-kt-accordion-item].active [data-kt-accordion-toggle] .kt-accordion-indicator-off {
  display: block !important;
}

/* aria-expanded 기반(=JS에서 aria 업데이트만으로도 안정적으로 동작) */
.hashcorp.custom [data-kt-accordion-toggle][aria-expanded="true"] .kt-accordion-indicator-on {
  display: none !important;
}
.hashcorp.custom [data-kt-accordion-toggle][aria-expanded="true"] .kt-accordion-indicator-off {
  display: block !important;
}

/* KTUI 문서의 selector 형태를 그대로 보강(설정 페이지 포함) */
.hashcorp.custom .kt-accordion-indicator-off[data-kt-accordion-item].active,
.hashcorp.custom [data-kt-accordion-item].active > [data-kt-accordion-toggle] .kt-accordion-indicator-off,
.hashcorp.custom [data-kt-accordion-item].active > [data-kt-accordion-toggle].kt-accordion-indicator-off {
  display: block !important;
}
.hashcorp.custom [data-kt-accordion-item].active > [data-kt-accordion-toggle] .kt-accordion-indicator-on,
.hashcorp.custom [data-kt-accordion-item].active > [data-kt-accordion-toggle].kt-accordion-indicator-on {
  display: none !important;
}

/* ------------------------------------------------------------------
 * kt-btn-ghost 내부 SVG 표시 보정
 * - 일부 번들에서 .kt-btn-ghost svg 가 display:none/inline 처리되어 아코디언 아이콘이 안 보이는 이슈 보완
 * - 단, 토글 로직에서 hidden 클래스로 숨긴 SVG는 그대로 유지해야 함
 * ------------------------------------------------------------------ */
/* 주의:
 * - 아코디언 인디케이터(+/-)는 위에서 상태(aria-expanded/active) 기반으로 display를 제어합니다.
 * - 아래 보정 규칙이 인디케이터 SVG까지 강제로 block 처리하면 "접기" 아이콘이 항상 노출될 수 있어 제외합니다.
 */
.hashcorp.custom .kt-btn-ghost:not(.kt-btn-primary):not(.kt-btn-destructive)
  svg:not(.hidden):not(.kt-accordion-indicator-on):not(.kt-accordion-indicator-off) {
  display: block !important;
}

/* ------------------------------------------------------------------
 * Modal width helpers (Tailwind JIT 누락 방지용)
 * ------------------------------------------------------------------ */
.hashcorp.custom .hc-modal-xs {
  max-width: 420px;
  width: calc(100% - 2rem);
  margin-left: auto;
  margin-right: auto;
}
.hashcorp.custom .hc-modal-sm {
  max-width: 520px;
  width: calc(100% - 2rem);
  margin-left: auto;
  margin-right: auto;
}
.hashcorp.custom .hc-modal-md {
  max-width: 640px;
  width: calc(100% - 2rem);
  margin-left: auto;
  margin-right: auto;
}

/* ------------------------------------------------------------------
 * Layout spacing
 * ------------------------------------------------------------------ */
.hashcorp.custom .kt-footer {
  margin-top: 24px;
}

/* ------------------------------------------------------------------
 * KTSelect - Tags mode 보정
 * - 일부 번들(styles.css)에서 kt-select tag 스타일이 누락되어 선택 후 UI가 깨져 보이는 문제 보완
 * - 공식 문서: https://ktui.io/docs/select
 * ------------------------------------------------------------------ */
.hashcorp.custom .kt-select-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  /* 요청사항: 상/하 padding 제거, 좌/우만 5px 정도 */
  padding: 0 5px;
  border-radius: 9999px;
  border: 1px solid var(--border);
  background-color: var(--background);
  color: var(--secondary-foreground);
  font-size: 0.75rem;
  line-height: 1;
}
.hashcorp.custom .kt-select-tag-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: 2px;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  color: var(--muted-foreground);
  cursor: pointer;
}
.hashcorp.custom .kt-select-tag-remove:hover {
  background-color: var(--accent);
  color: var(--accent-foreground);
}