/* ============================
   FONT TỔNG THỂ CHO COOKBOOK
   ============================ */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700&family=Playfair+Display:wght@500;600;700&display=swap');

body {
  font-family: "Nunito", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 18px;
  line-height: 1.7;
  color: #333333;
  text-align: justify;
  text-justify: inter-word;
  hyphens: auto;
  margin: 0;
}

/* ============================
   HEADING – ĐẬM, ẤM, HỢP SANDSTONE
   ============================ */
h1, h2, h3, h4 {
  font-family: "Playfair Display", "Times New Roman", serif;
  letter-spacing: 0.2px;
  margin-top: 1.4em;
  margin-bottom: 0.5em;
}

/* Tông màu đậm + ấm hơn cho Sandstone */
h1 {
  color: #3c2f26;       /* nâu đậm */
  font-weight: 700;
}

h2 {
  color: #6b4f32;       /* nâu đất */
  font-weight: 700;
}

h3 {
  color: #8b6a3a;       /* nâu vàng */
  font-weight: 700;
}

/* Sub-heading nhỏ hơn chút cho cookbook */
h3 {
  font-size: 1.1rem;
}

/* ============================
   ĐOẠN VĂN, DANH SÁCH, KHOẢNG CÁCH
   ============================ */

p {
  margin-top: 0;
  margin-bottom: 0.85em;
}

ul, ol {
  margin-top: 0.2em;
  margin-bottom: 0.9em;
  padding-left: 1.5em;
}

ul li, ol li {
  margin-bottom: 0.2em;
}

/* Nhìn giống mục nguyên liệu/cách làm đẹp hơn */
ul li::marker {
  font-size: 0.9em;
}

/* ============================
   LINK
   ============================ */
a {
  color: #b45f4b;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

/* ============================
   HÌNH ẢNH & CAPTION – CHUẨN COOKBOOK
   ============================ */

figure {
  margin: 1.5em auto;
  text-align: center;
}

img {
  max-width: 100%;
  height: auto;
}

/* Class riêng cho hình trong cookbook nếu bạn dùng .cookbook-img */
.cookbook-img {
  border-radius: 8px;
  box-shadow: 0 4px 18px rgba(0,0,0,0.12);
}

/* Caption hình: nhỏ hơn, nghiêng, màu dịu */
figcaption {
  font-size: 0.9rem;
  font-style: italic;
  color: #666666;
  margin-top: 0.4em;
}

/* ============================
   TABLE OF CONTENTS (trong trang)
   ============================ */

.toc-title {
  font-family: "Playfair Display", serif;
  font-weight: 600;
  color: #3c2f26;
}

.sidebar margin-sidebar {}

/* Nếu bạn muốn TOC trong trang rõ hơn (in-page TOC) */
#TOC ul {
  list-style-type: none;
  padding-left: 0;
}

#TOC li {
  margin-bottom: 0.25em;
}

/* ============================
   “RECIPE CARD” – KHUNG CÔNG THỨC
   ============================ */
/* Dùng cho chỗ ghi nguyên liệu / cách làm */
.recipe-card {
  border-radius: 12px;
  padding: 1.2em 1.4em;
  margin: 1.5em 0;
  background: #fdf7ef;
  border: 1px solid #e2c9a6;
}

.recipe-card h3 {
  margin-top: 0;
  margin-bottom: 0.6em;
  font-size: 1.05rem;
}

.recipe-meta {
  font-size: 0.9rem;
  color: #7a6a54;
  margin-bottom: 0.8em;
}

/* ============================
   CODE (NẾU CÓ, NHƯNG CHO NÓ NHẸ NHÀNG)
   ============================ */

pre code {
  font-size: 0.85rem;
}

/* ============================
   FOOTNOTE & SMALL TEXT
   ============================ */

.small-note {
  font-size: 0.85rem;
  color: #777777;
}