/* Windows XP 데스크톱 아이콘 스타일 */
/* 이 파일은 Windows XP 운영체제의 데스크톱 아이콘 UI를 재현하기 위한 CSS 스타일을 포함하고 있습니다. */
/* 전체 구조: #desktop-icons 컨테이너 > .desktop-icon 요소들 */

#desktop-icons {
  position: absolute;
  top: 20px;
  left: 10px;
  z-index: 0;
}

#desktop-icons-col2 {
  position: absolute;
  top: 20px;
  left: 90px; /* 두 번째 열의 가로 위치 */
  z-index: 0;
}

#desktop-icons-col3 {
  position: absolute;
  top: 20px;
  left: 170px; /* 세 번째 열의 가로 위치 */
  z-index: 0;
}

#desktop-icons-col4 {
  position: absolute;
  top: 20px;
  left: 250px; /* 네 번째 열의 가로 위치 */
  z-index: 0;
}

.desktop-icon {
  width: 80px; /* 아이콘 너비 */
  height: 72px;
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  user-select: none; /* 텍스트 선택 방지 */
}

.desktop-icon img {
  width: 32px;
  height: 32px;
  margin-bottom: 5px;
  transition: filter 0.01s ease; /* 부드러운 필터 전환 효과 */
}

.desktop-icon span {
  font-family: 'Tahoma', sans-serif; /* 윈도우 XP 기본 폰트 */
  font-size: 11px;
  color: white;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); /* 텍스트 그림자 */
  padding: 2px 4px;
  text-align: center;
  border-radius: 3px;
}

/* 아이콘 선택 시 이미지에 파란색 필터 적용 */
.desktop-icon.selected img {
  filter: sepia(90%) hue-rotate(185deg) saturate(4) brightness(0.6) opacity(0.8);
}

/* 아이콘 선택 시 텍스트 배경 스타일 */
.desktop-icon.selected span {
  background-color: #1133a5; /* Windows 98 스타일의 진한 파란색 */
  color: white;
  border: 1px dotted white; /* 흰색 점선 테두리 */
  padding: 1px 3px;
  border-radius: 0; /* 사각형 테두리 */
}

/* 드래그 선택 상자 스타일 */
.selection-box {
  position: absolute;
  border: 1px dotted #4d4d4d;
  z-index: 100;
}