@import './base.css';

#app {
  font-weight: normal;
}

/* 모든 화면 본문 폭 통일 — 각 뷰가 제각각 두던 root max-width 를 한 곳에서 일관되게.
   (본문 직계 자식 = 각 화면 루트 컨테이너) scoped 스타일을 덮기 위해 !important 사용. */
.layout-body > * {
  max-width: var(--page-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* 폼 요소 폰트 상속(표준 리셋) — 네이티브 input/select/textarea 가 서로 폰트·높이 달라
   보이던 이질감 해소. (개별 화면 scoped 스타일이 더 구체적이면 그쪽이 우선) */
input,
select,
textarea {
  font: inherit;
}
/* scoped 스타일이 없는 select 의 기본 모양을 input 과 맞춤 */
select {
  box-sizing: border-box;
  padding: 0.5rem 0.7rem;
  border: 1px solid var(--color-border);
  border-radius: 4px;
  background: var(--color-background-soft);
  color: var(--color-text);
  line-height: 1.3;
}

/* 네이티브 앱(Capacitor) safe-area: 상단 상태바 / 하단 제스처바 영역 확보 */
html.is-native .layout-top {
  /* 상태바 높이(safe-area)에 더해 여유 간격을 줘서 헤더가 상태바에 붙지 않게 */
  padding-top: calc(env(safe-area-inset-top) + 14px);
  height: auto;
  min-height: 56px;
}
html.is-native .layout-bottom {
  padding-bottom: env(safe-area-inset-bottom);
}

a,
.green {
  text-decoration: none;
  color: hsla(160, 100%, 37%, 1);
  transition: 0.4s;
}

@media (hover: hover) {
  a:hover {
    background-color: hsla(160, 100%, 37%, 0.2);
  }
}

/* ===== Toast UI 코드 스타일 (에디터/뷰어 공통) =====
   인라인 코드: 다크 배경 + 흰 글자 / 코드 블록: 다크 + 구문 강조(Prism) + Copy 버튼.
   클래스 중첩으로 우선순위를 높여 라이브러리 기본 스타일을 덮어쓴다. */
.toastui-editor-contents.toastui-editor-contents :not(pre) > code {
  color: #ffffff;
  background-color: #1e1e1e;
  padding: 0.2em 0.4em;
  margin: 0;
  font-size: 100%;
  border-radius: 6px;
  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
}
.toastui-editor-contents.toastui-editor-contents pre {
  position: relative;
  background-color: #1e1e1e;
  border-radius: 8px;
  padding: 14px 16px;
  overflow: auto;
  font-size: 100%;
  line-height: 1.5;
}
.toastui-editor-contents.toastui-editor-contents pre code {
  background: transparent;
  padding: 0;
  font-size: 100%;
  color: #f0f0f0;
  font-family: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace;
}

/* 코드 블록 Copy 버튼 (JS로 주입되므로 전역 스타일) */
.toastui-editor-contents pre .code-copy-btn {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 4px 12px;
  font-size: 12px;
  color: #ddd;
  background: #2d2d2d;
  border: 1px solid #444;
  border-radius: 6px;
  cursor: pointer;
  transition: background 0.15s;
}
.toastui-editor-contents pre .code-copy-btn:hover {
  background: #3a3a3a;
  color: #fff;
}
