/* =============================================================
   공용 창 맥 시트 — 비밀번호 변경 · 사용자 등록 신청 · 공지 쓰기/보기 · 공지 메일 보내기 · 팝업 공지 관리 ·
   소식 남기기 · 거부 사유 · 영업 기록 · 항목 설명.
   마크업(테일윈드 창)은 그대로 두고 이 창들 id 안쪽만 덮는다. 값은 ui-tokens.css 에서만. 화면에서만(인쇄 그대로).
   흰 시트 · 시트 모서리/그림자 · 뒤 배경 옅게(흐림 없음) · 제목 17px(앞 색 아이콘 숨김) · 닫기 회색 동그라미 ·
   칸 28px · 색 상자 → 회색 묶음 · 단추는 흰 단추, 채운 파랑은 창마다 주 행동 하나, 위험은 흰 단추 + 빨간 글자.
   휴대폰: 아래에서 올라오는 시트(폭 가득 · 위 모서리만 둥글게), 칸 36px · 글자 16px.
   되돌리기: index.tsx 의 이 파일 <link> 한 줄.
   ============================================================= */
@media screen {
/* 뒤 배경 · 시트 */
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal){ background:var(--ui-scrim) !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; font-family:var(--ui-font) }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) > div{ border:0 !important; border-radius:var(--ui-radius-sheet) !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-sheet) !important; color:var(--ui-text-1) }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) *{ font-family:var(--ui-font) }

/* 제목: 17px 검정, 앞 색 아이콘 숨김 */
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) :is(h2, h3){ margin-top:0; font-size:var(--ui-text-title2) !important; font-weight:var(--ui-weight-semibold) !important; color:var(--ui-text-1) !important; line-height:1.35 }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) :is(h2, h3) > i.fas,
html #activity-record-modal > div > div:first-child > div > i.fas{ display:none }
/* 머리 · 바닥 줄: 흰 바탕 + 머리카락 선 */
html :is(#notice-modal, #notice-view-modal, #newsfeed-modal, #register-modal, #activity-record-modal, #nm-modal, #popup-notice-mgr-modal, #field-desc-modal) > div > div:first-child{ padding:10px 10px 10px 16px !important; background:var(--ui-surface) !important; border-bottom:var(--ui-hairline) solid var(--ui-line) !important }
html :is(#notice-modal, #notice-view-modal, #newsfeed-modal, #nm-modal) > div > div:last-child,
html #activity-record-modal > div > div:last-child{ padding:10px 16px !important; background:var(--ui-surface) !important; border-top:var(--ui-hairline) solid var(--ui-line) !important; gap:8px !important }
html #change-password-modal > div > div{ padding:0 !important }
html #change-password-modal > div > div > div:first-child{ margin:0 !important; padding:10px 10px 10px 16px; border-bottom:var(--ui-hairline) solid var(--ui-line) }
html #change-password-modal form{ padding:14px 16px 16px }
html #reject-reason-modal > div{ padding:16px !important }
html #reject-reason-modal h3{ margin-bottom:10px !important }

/* 닫기: 회색 동그라미(× 글자 · 아이콘 단추) */
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) > div > div:first-child button:last-child,
html #change-password-modal > div > div > div:first-child > button{ display:inline-flex !important; align-items:center; justify-content:center; flex:none; width:22px !important; height:22px !important; min-height:0 !important; padding:0 !important; border:0 !important; border-radius:50% !important; background:var(--ui-fill) !important; box-shadow:none !important; color:var(--ui-text-2) !important; font-size:var(--ui-text-callout) !important; line-height:1 !important }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) > div > div:first-child button:last-child i,
html #change-password-modal > div > div > div:first-child > button i{ font-size:var(--ui-text-caption) }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) > div > div:first-child button:last-child:hover{ background:var(--ui-fill-hover) !important }

/* 글자 · 칸 */
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) label{ color:var(--ui-text-1) }
html :is(#change-password-modal, #register-modal, #notice-modal, #newsfeed-modal, #reject-reason-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) label.block{ margin-bottom:4px !important; font-size:var(--ui-text-body) !important; font-weight:var(--ui-weight-semibold) !important }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]), select){ height:var(--ui-control) !important; min-height:0 !important; padding:0 8px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background-color:var(--ui-surface) !important; box-shadow:var(--ui-elev-field) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-body) !important }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) textarea{ padding:6px 8px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background-color:var(--ui-surface) !important; box-shadow:var(--ui-elev-field) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-body) !important; line-height:1.55 !important }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) :is(input, select, textarea):focus{ outline:none !important; box-shadow:var(--ui-focus-ring) !important }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) :is(input, textarea)::placeholder{ color:var(--ui-text-3) }
html :is(#notice-modal, #notice-view-modal, #activity-record-modal, #nm-modal, #popup-notice-mgr-modal) input[type="checkbox"]{ accent-color:var(--ui-accent) }

/* 색 상자 → 회색 묶음(경고 주황 · 오류 빨강 글자는 그대로) */
html :is(#register-modal, #notice-modal, #nm-modal, #popup-notice-mgr-modal) :is(.bg-blue-50, .bg-indigo-50\/50, .bg-yellow-50){ border:0 !important; border-radius:var(--ui-radius-group) !important; background:var(--ui-fill-subtle) !important }
html :is(#register-modal, #nm-modal, #popup-notice-mgr-modal) :is(.text-blue-700, .text-indigo-800, .text-indigo-700\/80){ color:var(--ui-text-1) !important }
html #register-modal .bg-blue-50 i.fas{ display:none }
html :is(#notice-modal, #nm-modal, #popup-notice-mgr-modal) :is(#notice-dept-wrap, #nm-dept-wrap, .border.rounded-lg){ border:0 !important; border-radius:var(--ui-radius-group) !important; box-shadow:0 0 0 var(--ui-hairline) var(--ui-line) }
html :is(#notice-modal, #popup-notice-mgr-modal) :is(.text-yellow-700, .text-blue-600){ color:var(--ui-text-1) !important }

/* 단추: 흰 단추가 기본 */
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) button,
html #activity-record-modal > div > div:last-child button{ display:inline-flex; align-items:center; justify-content:center; gap:4px; height:var(--ui-control) !important; min-height:0 !important; padding:0 14px !important; border:0 !important; border-radius:var(--ui-radius-control) !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-body) !important; font-weight:var(--ui-weight-regular) !important; white-space:nowrap }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) button > i.fas,
html #activity-record-modal > div > div:last-child button > i.fas{ display:none }
/* 주 행동 하나 = 채운 파랑 */
html :is(#change-password-modal, #register-modal, #notice-modal, #newsfeed-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal, #activity-record-modal) :is(#reg-submit-btn, #notice-save-btn, #newsfeed-save-btn, #fd-save-btn, #nm-send-btn, #change-password-form button[type="submit"], button[type="submit"][form="activity-record-form"], button[onclick^="_createPopupNotice"]){ background:var(--ui-accent) !important; box-shadow:none !important; color:var(--ui-on-accent) !important; font-weight:var(--ui-weight-semibold) !important }
html :is(#change-password-modal, #register-modal, #notice-modal, #newsfeed-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal, #activity-record-modal) :is(#reg-submit-btn, #notice-save-btn, #newsfeed-save-btn, #fd-save-btn, #nm-send-btn, #change-password-form button[type="submit"], button[type="submit"][form="activity-record-form"], button[onclick^="_createPopupNotice"]):hover{ background:var(--ui-accent-hover) !important }
/* 영업 기록 안쪽 [등록] 같은 채운 단추 → 흰 단추(채운 파랑은 바닥 [저장] 하나) */
html #activity-record-modal form button:is(.bg-blue-500, .bg-blue-600, .bg-indigo-600, .bg-green-600, .bg-purple-600, .bg-indigo-50, .bg-purple-50, .bg-blue-50){ height:var(--ui-control-sm) !important; padding:0 10px !important; font-size:var(--ui-text-footnote) !important;  border:0 !important; background:var(--ui-surface) !important; box-shadow:var(--ui-elev-control) !important; color:var(--ui-text-1) !important }
html #activity-record-modal .text-\[10px\]{ font-size:var(--ui-text-caption) !important }
/* 영업 기록: 영업 선택 칩 → 회색 알약, 고른 칩은 연한 파랑 / 칸 이름 앞 색 아이콘 숨김 */
html #activity-record-modal .act-chip-label{ height:28px; padding:0 12px !important; border:0 !important; border-radius:var(--ui-radius-pill) !important; background:var(--ui-fill) !important; color:var(--ui-text-1) !important; font-size:var(--ui-text-body) !important; font-weight:var(--ui-weight-regular) !important }
html #activity-record-modal .act-chip-label i.fas{ color:var(--ui-text-2) }
html #activity-record-modal .act-chip input:checked + .act-chip-label{ background:var(--ui-accent-tint) !important; color:var(--ui-accent-text) !important; font-weight:var(--ui-weight-semibold) !important; box-shadow:inset 0 0 0 1px var(--ui-accent) }
html #activity-record-modal .act-chip input:checked + .act-chip-label i.fas{ color:var(--ui-accent-text) }
html #register-modal label > i.fas{ display:none }
html #nm-modal .text-yellow-600, html #nm-modal .text-yellow-700{ color:var(--ui-text-1) !important }
/* 위험 = 흰 단추 + 빨간 글자 */
html :is(#notice-view-modal, #reject-reason-modal) :is(#notice-delete-btn, button[onclick^="confirmReject"]){ color:var(--ui-danger) !important; font-weight:var(--ui-weight-semibold) !important }
html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal, #activity-record-modal) button:focus-visible{ outline:none !important; box-shadow:var(--ui-focus-ring) !important }
html :is(#register-modal, #reject-reason-modal) form .flex.gap-3 > button, html #reject-reason-modal .flex.gap-3 > button{ flex:1 }
/* 팝업 공지 목록의 상태 표시 · 날짜(10px) → 11px — 운영에 공지가 쌓이면 145곳 */
html #popup-notice-mgr-modal .text-\[10px\]{ font-size:var(--ui-text-caption) !important }

@media (max-width:767px){
  /* 휴대폰: 아래에서 올라오는 시트 */
  html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal){ align-items:flex-end !important; padding:0 !important }
  html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) > div{ width:100% !important; max-width:none !important; margin:0 !important; max-height:92vh !important; max-height:92dvh !important; border-radius:var(--ui-radius-sheet) var(--ui-radius-sheet) 0 0 !important; padding-bottom:env(safe-area-inset-bottom) }
  html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="range"]), select){ height:var(--ui-control-mobile) !important; font-size:16px !important }
  html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #activity-record-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) textarea{ font-size:16px !important }
  html :is(#change-password-modal, #register-modal, #notice-modal, #notice-view-modal, #newsfeed-modal, #reject-reason-modal, #field-desc-modal, #nm-modal, #popup-notice-mgr-modal) button,
  html #activity-record-modal > div > div:last-child button{ height:44px !important }
  html :is(#notice-modal, #notice-view-modal, #newsfeed-modal, #nm-modal) > div > div:last-child, html #activity-record-modal > div > div:last-child{ flex-wrap:wrap }
  html :is(#notice-modal, #notice-view-modal, #newsfeed-modal, #nm-modal) > div > div:last-child > button, html #activity-record-modal > div > div:last-child button{ flex:1 }
}
}