/*
 * Web(Cloud) 전역 스타일. body·글꼴·스크롤바·오류 표시줄·시트 틀(폭·본문 패딩·제목·푸터 정렬)·아바타 사진 비율(fluent-avatar > img)은
 * Shell(base.css·dialogs.css·DialogFrame)이 맡는다. 시트 본문은 각 시트의 범위 CSS 와 Shell 그룹 목록(GroupedList·ListRow·EmptyState)이 그린다 —
 * 옛 공용 본문 패턴(.tc-dialog-body · .tc-section* · .tc-error · .tc-empty · .tc-search-row)은 계획 ② Task 12 에서 없앴다.
 * 시트 푸터는 DialogFrame 의 것이라 옛 .tc-footer-actions 는 없다. 여기에는 업로드 드롭 영역의 FluentInputFile 바탕 지우기만 남는다.
 */

/* 업로드 드롭 영역(UploadDialog — FluentInputFile Class="upload-input"): Fluent 의 기본 바탕(점선 브랜드 테두리·배경·간격·가운데 정렬)을 지우고
   안쪽 내용(.inputfile-content)이 칸 전체를 채워 시트의 드롭 영역(.upload-drop-zone — UploadDialog.razor.css)이 테두리·반경·hover 를 그린다.
   Fluent 규칙은 범위 CSS(.fluent-inputfile-container … [b-…])라 !important 대신 요소 선택자(div)를 더한 특이도로 이긴다 —
   Fluent 가 인라인으로 주는 것은 z-index·진행 칸 visibility 뿐이라 덮을 인라인 스타일이 없다. */
div.fluent-inputfile-container.upload-input,
div.fluent-inputfile-container.upload-input[drop-files] {
	gap: 0;
	width: 100%;
	padding: 0;
	border: 0;
	background: transparent;
}

div.fluent-inputfile-container.upload-input .inputfile-content {
	display: block;
	align-self: stretch;
	justify-self: stretch;
	width: 100%;
	height: 100%;
	text-align: initial;
}

div.fluent-inputfile-container.upload-input label,
div.fluent-inputfile-container.upload-input a {
	color: inherit;
	text-decoration: none;
}

/* 업로드 진행은 시트의 파일 행이 보인다 — Fluent 의 진행 칸(숨어 있어도 자리를 차지한다)을 없앤다. */
div.fluent-inputfile-container.upload-input .inputfile-progress {
	display: none;
}

/* 키보드 포커스(숨은 파일 입력): 드롭 영역 반경(12px)에 맞춘 링. */
div.fluent-inputfile-container.upload-input:has(input[type="file"]:focus-visible) {
	outline: 2px solid var(--tc-focus);
	outline-offset: 2px;
	border-radius: var(--tc-radius-lg);
}

/* 파일을 끌어 영역 위에 두었을 때(Fluent 가 drop-files 속성을 단다): hover 와 같은 강조 옅은 채움. */
div.fluent-inputfile-container.upload-input[drop-files] .upload-drop-zone {
	background-color: var(--tc-accent-tint);
}