/* 자동배정 설정탭 킬스위치 행 (2026-07-17) — DB배정 모달 > 자동배정 > 설정탭.
 * 데스크톱: [스위치·라벨] --- [요일][시간 시작~종료 ⟲][저장] 한 줄.
 * 모바일(≤640px): 스위치·요일·시간·저장이 각 줄로 줄바꿈되며 전부 우측 정렬,
 *                시작~종료는 한 줄 유지(.fdb-ks-time nowrap).
 */
.fdb-ks-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  row-gap: 8px;
}
.fdb-ks-head { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.fdb-ks-spacer { flex: 1; }
.fdb-ks-opts {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  row-gap: 6px;
}
.fdb-ks-time { display: inline-flex; align-items: center; gap: 6px; flex-wrap: nowrap; flex-shrink: 0; }
.fdb-ks-divider { width: 1px; height: 24px; background: var(--ord-line-2); margin: 0 4px; flex-shrink: 0; }

/* 시간 초기화 아이콘 버튼 */
.fdb-ks-time-reset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 1px solid var(--ord-line-2);
  border-radius: 5px;
  background: var(--ord-panel);
  color: var(--ord-text-4);
  cursor: pointer;
  flex-shrink: 0;
}
.fdb-ks-time-reset:hover { color: var(--ord-tint-red-fg); border-color: var(--ord-tint-red-line); background: var(--ord-tint-red-bg); }

@media (max-width: 640px) {
  .fdb-ks-row { justify-content: flex-end; }
  .fdb-ks-head { margin-right: auto; }  /* 스위치·라벨은 좌측 고정, 나머지 줄은 우측 정렬 */
  .fdb-ks-opts { justify-content: flex-end; }
  .fdb-ks-spacer { display: none; }
  .fdb-ks-divider { display: none; }
}

/* ── 자동배정 «설정별» 켜기·일정 (2026-10-26) ─────────────────────────────
 * 내역 카드 머리줄 slot(.aas-slot) = 일정 칩 · 소형 스위치 (Stimulus auto-scope-setting)
 *   상태 pill(배정 중·일정 밖·전체 꺼짐)은 사용자 요청으로 뺐다(10/26) — 꺼짐은 스위치 + 대상 행 흐림으로 보인다.
 *   모바일(≤640px) = 머리줄 두 줄: 1줄 [구분·이름·×] / 2줄 [일정 칩 · 스위치] 우측 정렬(.aas-head).
 * 일정 모달(.aas-modal) = A-4 액센트형 (Stimulus auto-scope-schedule). 색은 전부 테마 토큰.
 */
.aas-default-tag { font-size: 10px; font-weight: 700; color: var(--ord-text-3); border: 1px solid var(--ord-line-2); background: var(--ord-surface); border-radius: 999px; padding: 1px 7px; margin-right: 2px; white-space: nowrap; flex-shrink: 0; }

.aas-slot { display: inline-flex; align-items: center; gap: 6px; margin: 0 6px 0 8px; flex-wrap: wrap; justify-content: flex-end; cursor: default; }
.aas-slot:empty { display: none; }
.aas-chip { font-size: 10.5px; font-weight: 600; padding: 2px 8px; border-radius: 6px; border: 1px dashed var(--ord-line-2); background: var(--ord-surface); color: var(--ord-text-3); cursor: pointer; white-space: nowrap; max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.aas-chip:hover { border-color: var(--ord-accent); color: var(--ord-accent-strong); }
.aas-chip.is-custom { border-style: solid; border-color: var(--ord-tint-blue-line); background: var(--ord-tint-blue-bg); color: var(--ord-tint-blue-fg); }
.aas-switch { flex-shrink: 0; }
/* 꺼진 설정 = 대상 행을 흐리게(머리줄은 그대로 — 다시 켜야 하므로) */
.auto-summary-item.aas-off > div:not(:first-child) { opacity: 0.45; }

.aas-modal { padding: 16px; background: var(--ord-surface-2); }
.aas-title { border-left: 4px solid var(--ord-accent); padding-left: 12px; font-size: 15px; font-weight: 800; color: var(--ord-text); margin-bottom: 12px; word-break: break-all; }
.aas-card { border: 1px solid var(--ord-line); border-radius: 12px; background: var(--ord-surface); overflow: hidden; }
.aas-band { padding: 8px 14px; font-size: 12px; font-weight: 700; color: var(--ord-accent-strong); background: var(--ord-band); border-bottom: 1px solid var(--ord-line); }
.aas-body { padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; }
.aas-opt { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--ord-text-2); cursor: pointer; }
.aas-opt input { accent-color: var(--ord-accent); margin: 0; }
.aas-opt-main { font-weight: 700; color: var(--ord-text); }
.aas-opt-sub { font-size: 11.5px; color: var(--ord-text-4); }
.aas-custom { border: 1px solid var(--ord-line-soft); border-radius: 10px; padding: 10px 12px; margin: 0 0 0 22px; min-width: 0; display: flex; flex-direction: column; gap: 10px; background: var(--ord-surface-2); }
.aas-custom.is-off { opacity: 0.45; }
.aas-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.aas-lbl { font-size: 11.5px; font-weight: 700; color: var(--ord-text-3); width: 28px; flex-shrink: 0; }
.aas-days { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.aas-day { position: relative; cursor: pointer; }
.aas-day input { position: absolute; opacity: 0; pointer-events: none; }
.aas-day span { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 999px; border: 1.5px solid var(--ord-line-2); background: var(--ord-surface); color: var(--ord-text-2); font-size: 12px; font-weight: 700; }
.aas-day.is-weekend span { color: var(--ord-tint-red-fg); }
.aas-day input:checked + span { background: var(--ord-accent); border-color: var(--ord-accent); color: var(--ord-on-accent); }
.aas-day input:focus-visible + span { box-shadow: 0 0 0 3px var(--ord-focus-ring); }
.aas-presets { display: inline-flex; gap: 4px; }
.aas-preset { padding: 3px 9px; border: 1px solid var(--ord-line-2); border-radius: 999px; background: var(--ord-surface); color: var(--ord-text-3); font-size: 11px; font-weight: 600; cursor: pointer; }
.aas-preset:hover { border-color: var(--ord-accent); color: var(--ord-accent-strong); }
.aas-time { display: inline-flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.aas-input { width: 112px; padding: 5px 8px; border: 1.5px solid var(--ord-line-2); border-radius: 8px; background: var(--ord-input-bg); color: var(--ord-text); font-size: 12.5px; outline: none; }
.aas-input:focus { border-color: var(--ord-accent); box-shadow: 0 0 0 3px var(--ord-focus-ring); }
.aas-tilde { color: var(--ord-text-4); font-size: 12px; }
.aas-note { margin: 10px 2px 0; font-size: 11.5px; color: var(--ord-text-4); }

@media (max-width: 640px) {
  /* 머리줄 인라인 style 은 display:flex 만 정하므로 줄바꿈·순서는 여기서. slot 을 맨 뒤(× 다음) 한 줄로 */
  .aas-head { flex-wrap: wrap; row-gap: 6px; }
  .aas-head .aas-slot { order: 3; flex-basis: 100%; justify-content: flex-end; flex-wrap: nowrap; margin: 0; }
  .aas-chip { max-width: calc(100% - 48px); }
  .aas-custom { margin-left: 0; }
}