/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Tabulator: 데이터 없을 때 tableholder 배경 그라디언트(행 구분선) 제거 */
.tabulator .tabulator-tableholder {
  background: none !important;
}

/* resizable-columns=false 그리드: 컬럼 너비 조절 핸들 비활성화 */
[data-grid-resizable-columns-value="false"] .tabulator-col-resize-handle {
  display: none !important;
  pointer-events: none !important;
}

/* ─────────────────────────────────────────────────────────────────
   캘린더 (v1 § B-1, owner: Joy)
   vibe canon js_bundle/fullcalendar — FullCalendar 6.1.20 토큰 정합
   ───────────────────────────────────────────────────────────────── */
.fc {
  font: var(--db-text-label-2);
  color: var(--db-color-text);
}
/* 헤더툴바 가로 정렬 강제 — 기본 CSS가 깨질 경우 대비 */
.fc .fc-toolbar.fc-header-toolbar {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: var(--db-space-3);
  margin-bottom: var(--db-space-3);
}
.fc .fc-toolbar-chunk,
.fc .fc-toolbar-chunk > div {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: var(--db-space-2);
}
.fc .fc-toolbar-title {
  font: var(--db-text-heading-2);
  color: var(--db-color-text-strong);
  margin: 0;
  white-space: nowrap;
}
.fc .fc-button-primary {
  background: var(--db-color-fill-light) !important;
  border-color: var(--db-color-outline) !important;
  color: var(--db-color-text) !important;
}
.fc .fc-button-primary:hover {
  background: var(--db-color-fill-medium) !important;
}
.fc .fc-button-primary:not(:disabled).fc-button-active {
  background: var(--db-color-primary) !important;
  color: var(--db-color-on-primary) !important;
  border-color: var(--db-color-primary) !important;
}
.fc .fc-daygrid-day.fc-day-today {
  background-color: var(--db-color-cautionary-bg) !important;
}
.fc .fc-daygrid-day[aria-current="true"] {
  background-color: var(--db-color-fill-light) !important;
  outline: 2px solid var(--db-color-primary);
  outline-offset: -2px;
}
.fc .fc-daygrid-day-frame {
  min-height: 72px;
  position: relative;
}

/* 날짜 숫자 + count 배지를 한 줄에 분리 (겹침 방지) — flex space-between */
.fc .fc-daygrid-day-top {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  padding: 4px 6px;
  width: 100%;
}
.fc .fc-daygrid-day-number {
  font: var(--db-text-label-2);
  color: var(--db-color-text-strong);
  padding: 0;
}

/* 일별 count 배지 (Stimulus calendar_controller#_renderDayCell 가 삽입) — inline */
.db-calendar__count {
  background: var(--db-color-primary);
  color: var(--db-color-on-primary);
  font: var(--db-text-caption-1);
  padding: 2px 6px;
  border-radius: var(--db-radius-pill);
  min-width: 20px;
  text-align: center;
}
.db-calendar__count--overflow {
  background: var(--db-color-negative);
}

/* ─────────────────────────────────────────────────────────────
   주말/공휴일 색칠 (holidays-plan §3.8)
   - 일요일 = 빨강 / 토요일 = 파랑
   - 공휴일 = 빨강 + 굵게 (Stimulus가 .db-calendar__day--holiday 클래스 박음)
   ───────────────────────────────────────────────────────────── */
.fc .fc-day-sun .fc-daygrid-day-number {
  color: var(--db-color-negative);
}
.fc .fc-day-sat .fc-daygrid-day-number {
  color: var(--db-color-primary);
}
.fc .db-calendar__day--holiday .fc-daygrid-day-number {
  color: var(--db-color-negative);
  font-weight: 700;
}

/* ─────────────────────────────────────────────────────────────
   채팅 발주 초안 표 가로 스크롤바 표시
   tokens.css 가 전역(*) 스크롤바를 숨겨(scrollbar-width:none / ::-webkit-scrollbar
   display:none) 채팅 발주 초안 표(일반 div overflow-x)에서 스크롤바가 안 보였음.
   tabulator override 와 동일 패턴으로 .chat-hscroll 한정 복구.
   ───────────────────────────────────────────────────────────── */
.chat-hscroll {
  scrollbar-width: auto !important;        /* Firefox */
  -ms-overflow-style: auto !important;
}
.chat-hscroll::-webkit-scrollbar {
  height: 10px !important;
  display: block !important;               /* Chrome / Safari / WebView */
}
.chat-hscroll::-webkit-scrollbar-thumb {
  background: var(--db-color-outline, #cbd5e1);
  border-radius: 5px;
}
.chat-hscroll::-webkit-scrollbar-thumb:hover {
  background: var(--db-color-text-sub, #94a3b8);
}
.chat-hscroll::-webkit-scrollbar-track {
  background: var(--db-color-fill-light, #f1f5f9);
}

/* ─────────────────────────────────────────────────────────────
   엑셀 불러오기 + 컬럼 매핑 위저드 (import_wizard_controller)
   db-modal 골격(tokens.css) 재사용 — 아래는 위저드 전용 추가분만.
   ───────────────────────────────────────────────────────────── */
.iw-panel {
  width: 880px;
  max-width: 94vw;
}
.iw-steps {
  display: flex;
  gap: 6px;
  padding: 10px 20px 0;
  flex-wrap: wrap;
}
.iw-dot {
  font: var(--db-text-caption-1, 12px/1.4 sans-serif);
  color: var(--db-color-text-muted, #94a3b8);
  background: var(--db-color-fill-light, #f1f5f9);
  border-radius: 999px;
  padding: 3px 12px;
}
.iw-dot.is-active {
  color: var(--db-color-on-primary, #fff);
  background: var(--db-color-primary, #2563eb);
  font-weight: 600;
}
.iw-body {
  min-height: 240px;
}
.iw-help {
  font: var(--db-text-caption-1, 12px/1.5 sans-serif);
  color: var(--db-color-text-muted, #64748b);
  margin: 0 0 12px;
}
.iw-input {
  padding: 7px 10px;
  border: 1px solid var(--db-color-outline, #cbd5e1);
  border-radius: var(--db-radius-input, 6px);
  font: var(--db-text-label-2, 13px/1.4 sans-serif);
  background: var(--db-color-card, #fff);
  color: var(--db-color-text, #0f172a);
}
.iw-field {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.iw-field > label {
  width: 110px;
  flex-shrink: 0;
  font: var(--db-text-label-2, 13px/1.4 sans-serif);
  color: var(--db-color-text-strong, #0f172a);
}
.iw-filename {
  margin-left: 10px;
  font: var(--db-text-label-2, 13px/1.4 sans-serif);
  color: var(--db-color-text-sub, #475569);
}
.iw-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 16px;
}
.iw-map-wrap,
.iw-preview-wrap {
  max-height: 320px;
  overflow: auto;
  border: 1px solid var(--db-color-outline, #e2e8f0);
  border-radius: var(--db-radius-sm, 6px);
  /* tokens.css 전역 스크롤바 숨김 override (chat-hscroll 패턴) */
  scrollbar-width: auto !important;
}
.iw-map-wrap::-webkit-scrollbar,
.iw-preview-wrap::-webkit-scrollbar {
  width: 10px !important;
  height: 10px !important;
  display: block !important;
}
.iw-map-wrap::-webkit-scrollbar-thumb,
.iw-preview-wrap::-webkit-scrollbar-thumb {
  background: var(--db-color-outline, #cbd5e1);
  border-radius: 5px;
}
.iw-map,
.iw-preview {
  width: 100%;
  border-collapse: collapse;
  font: var(--db-text-label-2, 13px/1.4 sans-serif);
}
.iw-map th,
.iw-preview th {
  position: sticky;
  top: 0;
  background: var(--db-color-fill-light, #f1f5f9);
  color: var(--db-color-text-strong, #0f172a);
  text-align: left;
  padding: 7px 10px;
  border-bottom: 1px solid var(--db-color-outline, #e2e8f0);
  white-space: nowrap;
}
.iw-map td,
.iw-preview td {
  padding: 6px 10px;
  border-bottom: 1px solid var(--db-color-fill-light, #f1f5f9);
}
.iw-map-sel {
  width: 100%;
  padding: 5px 8px;
  border: 1px solid var(--db-color-outline, #cbd5e1);
  border-radius: var(--db-radius-input, 6px);
  background: var(--db-color-card, #fff);
  color: var(--db-color-text, #0f172a);
  font: var(--db-text-label-2, 13px/1.4 sans-serif);
}
.iw-sample {
  color: var(--db-color-text-muted, #94a3b8);
  white-space: nowrap;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.iw-err {
  background: rgba(255, 66, 66, 0.12);
  color: var(--db-color-negative, #dc2626);
}
.iw-errbox {
  margin-bottom: 12px;
  padding: 10px 12px;
  background: rgba(255, 66, 66, 0.08);
  border: 1px solid var(--db-color-negative, #f87171);
  border-radius: var(--db-radius-sm, 6px);
  color: var(--db-color-negative, #dc2626);
  font: var(--db-text-label-2, 13px/1.5 sans-serif);
}
.iw-okbox {
  margin-bottom: 12px;
  padding: 10px 12px;
  background: rgba(34, 197, 94, 0.08);
  border: 1px solid var(--db-color-positive, #4ade80);
  border-radius: var(--db-radius-sm, 6px);
  color: var(--db-color-positive, #16a34a);
  font: var(--db-text-label-2, 13px/1.5 sans-serif);
}

/* 로딩 오버레이 — 엑셀 읽기 / 그리드 주입 중 (import_wizard) */
.iw-loading {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  background: rgba(255, 255, 255, 0.88);
  border-radius: var(--db-radius-lg, 12px);
}
.iw-spinner {
  width: 42px;
  height: 42px;
  border: 4px solid var(--db-color-fill-light, #e2e8f0);
  border-top-color: var(--db-color-primary, #2563eb);
  border-radius: 50%;
  animation: iw-spin 0.8s linear infinite;
}
@keyframes iw-spin {
  to {
    transform: rotate(360deg);
  }
}
.iw-loading-msg {
  font: var(--db-text-label-1, 14px/1.4 sans-serif);
  color: var(--db-color-text-strong, #0f172a);
  font-weight: 600;
}