/* ============================================================
 * scm-select — 셀렉트박스 (mock 또는 실제 dropdown)
 * ------------------------------------------------------------
 * 시각은 input 과 동일. 우측 chevron, value/placeholder 톤.
 * 실제 드롭다운 기능은 별도 popover 모듈 (Stage 7) 과 결합.
 * 이 모듈은 트리거 버튼/표시 영역만 담당.
 *
 * Sizes:
 *   기본              h44 (form 페이지)
 *   .scm-select--sm   h36
 *   .scm-select--bu   h40, padding 8 12, font 14 (bulk upload modal 톤)
 *
 * States:
 *   :hover           border #000
 *   [aria-expanded="true"]  border #000
 *   [data-state="placeholder"]  value 톤 회색
 *   [data-state="filled"]       value 톤 검정
 *   .is-disabled / [disabled]   회색 톤 + cursor not-allowed
 *
 * Inner:
 *   .scm-select__value    value text (ellipsis)
 *   .scm-select__chev     chevron-down 16
 *   .scm-select__dot      앞 상태 도트 (sd-select-mock 흡수, 옵션)
 * ============================================================ */

.scm-select {
  width: 100%;
  height: 44px;
  padding: 12px 16px;
  background: #fff;
  border: 1px solid #E0E0E0;
  border-radius: 4px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 400;
  line-height: 20.4px;
  color: #000;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  cursor: pointer;
  box-sizing: border-box;
  text-align: left;
  white-space: nowrap;
}

.scm-select:hover { border-color: #000; }
.scm-select[aria-expanded="true"] { border-color: #000; }

.scm-select__value {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.scm-select[data-state="placeholder"] .scm-select__value {
  color: #8A8A8A;
  font-weight: 500;
}

.scm-select__chev {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  color: #000;
}

/* 앞 도트 (옵션) — sd-select-mock 흡수 */
.scm-select__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.scm-select__dot--accent { background: #245EFF; }
.scm-select__dot--success { background: #1EA514; }
.scm-select__dot--disabled { background: rgba(0, 0, 0, 0.20); }

/* Sizes */
.scm-select--sm {
  height: 36px;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 19.6px;
}

.scm-select--bu {
  height: 40px;
  padding: 8px 12px;
  border-color: #CCCCCC;
  font-size: 14px;
  line-height: 19.6px;
  min-width: 240px;
}

/* Disabled */
.scm-select.is-disabled,
.scm-select[disabled] {
  background: rgba(138, 138, 138, 0.10);
  border-color: #EBEBEB;
  color: rgba(0, 0, 0, 0.20);
  cursor: not-allowed;
}
.scm-select.is-disabled .scm-select__chev,
.scm-select[disabled] .scm-select__chev { color: rgba(0, 0, 0, 0.20); }
.scm-select.is-disabled .scm-select__value,
.scm-select[disabled] .scm-select__value { color: rgba(0, 0, 0, 0.20); font-weight: 400; }