/* CSS Reset - 모든 기본 스타일 제거 */

/* Box sizing */
*, *::before, *::after {
  box-sizing: border-box;
}

/* 기본 마진/패딩 제거 */
* {
  margin: 0;
  padding: 0;
}

/* HTML 기본 스타일 */
html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

/* Body 기본 스타일 */
body {
  margin: 0;
  font-family: system-ui, -apple-system, sans-serif;
  line-height: 1.5;
}

/* 제목 요소 */
h1, h2, h3, h4, h5, h6 {
  font-size: inherit;
  font-weight: inherit;
  margin: 0;
}

/* 리스트 */
ul, ol {
  list-style: none;
}

/* 링크 */
a {
  color: inherit;
  text-decoration: none;
  background-color: transparent;
}

/* 버튼 */
button {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* 입력 요소 */
input, textarea, select {
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* textarea */
textarea {
  resize: none;
  overflow: auto;
}

/* select */
select {
  cursor: pointer;
}

/* 이미지 */
img, picture, video, canvas, svg {
  display: block;
  max-width: 100%;
  height: auto;
}

/* 테이블 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* 폼 요소 */
fieldset {
  border: none;
  padding: 0;
  margin: 0;
}

legend {
  padding: 0;
}

/* 기타 요소 */
hr {
  border: none;
  height: 0;
}

/* 포커스 스타일 제거 */
*:focus {
  outline: none;
}

/* 드래그 방지 */
img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

/* 선택 방지 */
button, input, textarea, select {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* 터치 하이라이트 제거 */
button, input, textarea, select, a {
  -webkit-tap-highlight-color: transparent;
}

/* 스크롤바 스타일 */
::-webkit-scrollbar {
  width: 0;
  height: 0;
  background: transparent;
}

/* 브라우저별 기본 스타일 제거 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/* iOS Safari 기본 스타일 제거 */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="url"],
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0;
}

/* Chrome autofill 스타일 제거 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px transparent inset !important;
  -webkit-text-fill-color: inherit !important;
}

/* Firefox 기본 스타일 제거 */
input[type="number"] {
  -moz-appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* IE 기본 스타일 제거 */
button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

/* 접근성 - 스크린 리더용 */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Safari/iOS 전용 스타일 */
@supports (-webkit-touch-callout: none) {
  /* Safari에서 SVG 강제 표시 */
  .icon-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 1.5rem !important;
    height: 1.5rem !important;
    min-width: 1.5rem !important;
    min-height: 1.5rem !important;
  }
  
  /* Safari에서 SVG 렌더링 강제 적용 */
  svg {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 1rem !important;
    min-height: 1rem !important;
    max-width: 1.5rem !important;
    max-height: 1.5rem !important;
    fill: #ffffff !important;
    color: #ffffff !important;
    visibility: visible !important;
    opacity: 1 !important;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
  }
  
  /* 모든 SVG 하위 요소 강제 표시 */
  svg *,
  svg rect,
  svg path,
  svg polygon,
  svg circle,
  svg ellipse,
  svg line,
  svg polyline {
    fill: #ffffff !important;
    color: #ffffff !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  /* 클래스별 강제 적용 */
  .cls-1,
  .cls-2,
  svg .cls-1,
  svg .cls-2 {
    fill: #ffffff !important;
    color: #ffffff !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  /* Safari 터치 이벤트 최적화 */
  * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
  }
  
  /* Safari 스크롤 최적화 */
  body {
    -webkit-overflow-scrolling: touch;
  }
}

/* Android 브라우저 전용 SVG 최적화 */
@supports (-webkit-appearance: none) and (not (-webkit-touch-callout: none)) {
  .cls-1,
  .cls-2 {
    fill: var(--main-color) !important;
    color: var(--main-color);
  }
  
  .icon-wrapper {
    color: var(--main-color);
  }
}