@charset "utf-8";

@charset "utf-8";

/* reset.css
- box-sizing, 기본 여백 제거
- 텍스트/폼 요소 기본 상속
- 이미지/미디어 반응형 처리
- 접근성/읽기성 향상
- 작성자: 이상준
- 작성 시작일: 2025-09-29
*/

/* 1) 박스 모델 통일 */
*, *::before, *::after {
box-sizing: border-box;
}

/* 2) 기본 여백 제거 + iOS 오버스크롤 방지 */
html, body {
  margin: 0;
  padding: 0;
  overscroll-behavior: none; /* iOS/안드로이드에서 스크롤 끝에서 더 당겨지는 현상 방지 */
  -webkit-overflow-scrolling: touch; /* iOS 부드러운 스크롤 */
}

/* 제목 태그 초기화 */
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-size: inherit;    /* body 기본 글자 크기 상속 */
  font-weight: inherit;  /* 기본 굵기 상속 */
}

/* 3) 기본 폰트/라인 높이 */
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
background: #fff;
color: #000;
font-size: 16px;
}

/* 4) 문단/헤더 기본 여백 제거 */
h1, h2, h3, h4, h5, h6, p {
margin: 0;
font-weight: inherit;
}

/* 5) 리스트, 링크 기본 */
ul, ol {
margin: 0;
padding: 0;
list-style: none;
}

a {
color: inherit;
text-decoration: none;
background-color: transparent;
}

/* 6) 이미지, 비디오, SVG 반응형, 블록 처리 */
img, picture, video, canvas, svg {
display: block;
max-width: 100%;
height: auto;
}

/* 7) 표 기본 스타일 제거 */
table {
border-collapse: collapse;
border-spacing: 0;
}

/* 8) 폼 요소 폰트 상속 및 기본 스타일 초기화 */
input, button, textarea, select {
font: inherit;
color: inherit;
background: none;
border: none;
padding: 0;
margin: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

input:focus, textarea:focus, select:focus {
  outline: none;
}

/* 버튼은 필요한 경우 별도 스타일을 적용하도록 기본 커서만 지정 */
button {
cursor: pointer;
background-color: transparent;
border: none;
padding: 0;
margin: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}

/* 9) 필수 접근성: 숨김 처리 클래스 (스크린리더용) */
.sr-only {
position: absolute !important;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}

/* 10) 폼 토글/체크박스 기본 크로스브라우저 리셋 (필요 시 제거) */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
-webkit-appearance: none;
}

/* 11) 줄바꿈 관련 기본 */
pre, code, kbd, samp {
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, "Roboto Mono", "Noto Mono", monospace;
font-size: 1em;
}

/* 12) 스크롤바 스타일 통일 */
/* 웹킷 기반 브라우저 (Chrome, Safari, Edge) */
::-webkit-scrollbar {
  width: 8px;              /* 세로 스크롤바 너비 */
  height: 8px;             /* 가로 스크롤바 높이 */
}

::-webkit-scrollbar-track {
  background: #f1f1f1;     /* 스크롤바 트랙 배경색 */
  border-radius: 4px;      /* 트랙 모서리 둥글게 */
}

::-webkit-scrollbar-thumb {
  background: #c1c1c1;     /* 스크롤바 썸 색상 */
  border-radius: 4px;      /* 썸 모서리 둥글게 */
  transition: background 0.3s ease;  /* 호버 효과를 위한 전환 */
}

::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;     /* 호버 시 썸 색상 */
}

::-webkit-scrollbar-corner {
  background: #f1f1f1;     /* 스크롤바 코너 배경색 */
}

/* Firefox용 스크롤바 스타일 */
* {
  scrollbar-width: thin;           /* 스크롤바 너비 */
  scrollbar-color: #c1c1c1 #f1f1f1; /* 썸색상 트랙색상 */
}

/* 다크 테마용 스크롤바 (필요시 사용) */
.dark-theme ::-webkit-scrollbar-track {
  background: #2a2a2a;
}

.dark-theme ::-webkit-scrollbar-thumb {
  background: #555555;
}

.dark-theme ::-webkit-scrollbar-thumb:hover {
  background: #777777;
}

.dark-theme * {
  scrollbar-color: #555555 #2a2a2a;
}