/* 장치 설정 모달 스타일 - 타입 B (비디오에디션 디자인 맞춤) */
/* 외부 공개: 이 파일만 수정해도 설정창 디자인 변경 가능. (타입 A 는 setting-a.css 로 교체) */
/* device.js 의 dialogHTML(인라인 스타일)을 덮어쓰므로 일부 !important 사용 */

#device-setting-modal-div{
  border:none !important; border-radius:16px !important; padding:0;
  max-width:520px; width:92vw; box-sizing:border-box;
  background:#FFFFFF; color:#0F172A;
  box-shadow:0 20px 60px rgba(15,23,42,.35) !important; font-size:14px !important;
  font-family:inherit;
}
#device-setting-modal-div::backdrop{ background:rgba(15,23,42,.5); }

#device-setting-modal-div .modal-header{
  height:auto !important; padding:16px 20px; border-bottom:1px solid #E2E8F0;
}
#device-setting-modal-div .modal-title{ font-size:16px; font-weight:700; color:#0F172A; }

#device-setting-modal-div .device-button{
  padding:8px 16px; border-radius:9px; border:1px solid #E2E8F0;
  background:#fff; color:#0F172A; font:600 13px/1.2 inherit; cursor:pointer;
}
#device-setting-modal-div .device-button:hover{ background:#F1F5F9; }
#device-setting-modal-div #device-setting-ok-btn{ background:#2563EB; color:#fff; border-color:transparent; }
#device-setting-modal-div #device-setting-ok-btn:hover{ background:#1D4ED8; }
#device-setting-modal-div .text-btn{ background:transparent; border-color:transparent; color:#64748B; }

#device-setting-modal-div .modal-body{ margin:0 !important; padding:18px 20px; }
#device-setting-modal-div .cam,
#device-setting-modal-div .mic,
#device-setting-modal-div .spk{ margin-bottom:18px; }

/* 카메라 미리보기 : 인라인 640x360 을 모달 폭에 맞게 */
#device-setting-modal-div #setting-video{
  width:100% !important; height:auto !important; aspect-ratio:16/9;
  border-radius:12px; background:#0B0F17; object-fit:cover; display:block;
}

#device-setting-modal-div .device-setting{
  display:flex; align-items:center; gap:8px; margin-top:8px; font-size:13px; color:#64748B;
}
#device-setting-modal-div .device-setting span{ font-weight:600; color:#0F172A; }
#device-setting-modal-div select.device-setting{
  width:100%; padding:9px 11px; border:1px solid #E2E8F0; border-radius:9px;
  background:#fff; color:#0F172A; font-size:13px; font-family:inherit; box-sizing:border-box; cursor:pointer;
}
#device-setting-modal-div progress{ height:8px; accent-color:#2563EB; }
#device-setting-modal-div input[type=checkbox]{ accent-color:#2563EB; width:16px; height:16px; }
#device-setting-modal-div label{ font-size:12px; color:#64748B; cursor:pointer; }