@import url("https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@700&display=swap");

/* ── 색상: 따뜻한 테라코타 톤 ─────────────────────────── */
:root,
[data-md-color-scheme="default"] {
  --md-primary-fg-color: #b4532a;
  --md-primary-fg-color--light: #c96a42;
  --md-primary-fg-color--dark: #8f3f1f;
  --md-accent-fg-color: #d9771f;
  --md-default-bg-color: #fffaf4;
  --md-typeset-a-color: #a54a24;
}

[data-md-color-scheme="slate"] {
  --md-hue: 25;
  --md-primary-fg-color: #8f3f1f;
  --md-primary-fg-color--light: #a24a25;
  --md-primary-fg-color--dark: #6e3018;
  --md-accent-fg-color: #f0a37e;
  --md-typeset-a-color: #f0a37e;
}

/* ── 제목: 레시피북 느낌의 명조 ───────────────────────── */
.md-typeset h1,
.md-typeset h2 {
  font-family: "Gowun Batang", serif;
  font-weight: 700;
  color: var(--md-default-fg-color);
}

.md-typeset h1 {
  margin-bottom: 0.6em;
}

.md-typeset h2 {
  padding-bottom: 0.25em;
  border-bottom: 2px solid var(--md-typeset-a-color);
}

/* ── 레시피 정보 카드 (분량 · 시간 · 난이도) ──────────── */
.recipe-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: -0.3rem 0 1rem;
}

.recipe-chip {
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  font-size: 0.75rem;
  background: color-mix(in srgb, var(--md-typeset-a-color) 14%, transparent);
}

.recipe-source {
  font-size: 0.7rem;
  color: var(--md-default-fg-color--light);
  word-break: break-all;
}

/* ── 요리할 때 쓰는 버튼 (화면 켜두기 · 체크 초기화) ───── */
.recipe-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 1.4rem;
}

.recipe-toolbar button {
  font: inherit;
  font-size: 0.7rem;
  padding: 0.35rem 0.85rem;
  border-radius: 999px;
  border: 1px solid var(--md-typeset-a-color);
  color: var(--md-typeset-a-color);
  background: transparent;
  cursor: pointer;
}

.recipe-toolbar button[aria-pressed="true"] {
  background: var(--md-typeset-a-color);
  color: var(--md-default-bg-color);
}

/* ── 재료 체크리스트 ───────────────────────────────────── */
.md-typeset .task-list-item {
  margin-bottom: 0.5em;
}

.md-typeset .task-list-item:has(input:checked) {
  text-decoration: line-through;
  opacity: 0.5;
}

/* ── 만드는 법 ─────────────────────────────────────────── */
.md-typeset ol > li {
  margin-bottom: 0.8em;
}

/* ── 홈 카드 ──────────────────────────────────────────── */
.md-typeset .recipe-cards > ul > li {
  border-radius: 0.6rem;
}

.md-typeset .recipe-cards a {
  font-size: 0.95rem;
}

/* ── 휴대폰에서 글씨 조금 크게 ─────────────────────────── */
@media screen and (max-width: 600px) {
  .md-typeset {
    font-size: 0.85rem;
  }
}