/*
Theme Name: YTD Blog
Template: kadence
Description: Theme con cho yeutinhdau.com — blog đọc bài, shop phụ. Dựng 29/09/2026 (Y3).
Version: 1.0.0
Text Domain: ytd-blog
*/

/* ---------- Tokens ---------- */
:root {
  --ytd-leaf: #077340;      /* xanh thương hiệu — chữ nhấn, liên kết */
  --ytd-leaf-deep: #0b4f2e;
  --ytd-amber: #9a5b13;     /* hổ phách chai tinh dầu — màu nhấn duy nhất */
  --ytd-amber-soft: #f6ead8;
  --ytd-ink: #1b2921;
  --ytd-ink-soft: #4a5a50;
  --ytd-paper: #f5f7f3;
  --ytd-white: #ffffff;
  --ytd-line: #dfe5dc;
  --ytd-serif: "Literata", Georgia, serif;
  --ytd-sans: "Be Vietnam Pro", system-ui, sans-serif;

  /* map vào bảng màu Kadence */
  --global-palette1: var(--ytd-leaf);
  --global-palette2: var(--ytd-leaf-deep);
  --global-palette3: var(--ytd-ink);
  --global-palette4: var(--ytd-ink);
  --global-palette5: var(--ytd-ink-soft);
  --global-palette6: #7b887f;
  --global-palette7: var(--ytd-line);
  --global-palette8: var(--ytd-paper);
  --global-palette9: var(--ytd-white);
  --global-body-font-family: var(--ytd-serif);
  --global-heading-font-family: var(--ytd-sans);
  --global-content-width: 1120px;
  --global-content-narrow-width: 700px;
}

body {
  background: var(--ytd-paper);
  color: var(--ytd-ink);
  font-family: var(--ytd-serif);
  font-size: 18px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}
@media (min-width: 768px) { body { font-size: 19px; } }

h1, h2, h3, h4, h5, h6,
.site-title, .main-navigation, .mobile-navigation, .header-navigation,
button, .button, input, select, textarea, .woocommerce, .entry-meta, .ytd-sans {
  font-family: var(--ytd-sans);
}
h1, h2, h3 { letter-spacing: -0.01em; line-height: 1.3; color: var(--ytd-ink); }

a { color: var(--ytd-leaf); text-underline-offset: 3px; }
a:hover { color: var(--ytd-leaf-deep); }
:focus-visible { outline: 2px solid var(--ytd-amber); outline-offset: 2px; }

/* ---------- Header ---------- */
.site-header, #masthead, .site-main-header-wrap .site-header-row-container-inner {
  background: var(--ytd-white);
}
#masthead { border-bottom: 1px solid var(--ytd-line); }
.custom-logo { max-height: 52px; width: auto; }
.header-navigation .menu > li > a { font-weight: 500; font-size: 15px; color: var(--ytd-ink); }

/* ---------- Bài viết ---------- */
.single-post .entry-content-wrap, .single-post .content-bg { background: transparent; box-shadow: none; }
.single-post .entry-header { margin-bottom: 1.5em; }
.single-post .entry-title { font-size: clamp(28px, 6vw, 40px); font-weight: 700; }
.entry-content { font-size: 1em; }
.entry-content > p, .entry-content > ul, .entry-content > ol { margin-bottom: 1.1em; }
.entry-content h2 { font-size: 1.35em; margin-top: 1.8em; }
.entry-content h3 { font-size: 1.15em; margin-top: 1.5em; }
.entry-content img { border-radius: 4px; height: auto; }
.entry-content blockquote {
  border-left: 3px solid var(--ytd-amber);
  background: var(--ytd-amber-soft);
  margin: 1.5em 0; padding: .8em 1.1em; font-style: normal;
}
.entry-meta, .entry-meta a { font-size: 14px; color: var(--ytd-ink-soft); }

/* Mục lục (Easy TOC) */
#ez-toc-container {
  background: var(--ytd-white) !important; border: 1px solid var(--ytd-line) !important;
  border-radius: 4px; box-shadow: none !important; font-family: var(--ytd-sans); font-size: 15px;
  width: 100% !important; max-width: 100%; padding: 14px 18px;
}

/* Khung ⚠️ — dùng class .ytd-canh-bao trong bài */
.ytd-canh-bao {
  border: 1px solid var(--ytd-amber); border-left-width: 4px; background: var(--ytd-amber-soft);
  padding: 1em 1.2em; margin: 2em 0; border-radius: 2px;
}
.ytd-canh-bao > :first-child { margin-top: 0; }

/* Hộp tác giả cuối bài */
.ytd-author {
  display: grid; grid-template-columns: 56px 1fr; gap: 14px; align-items: start;
  border-top: 1px solid var(--ytd-line); margin-top: 2.5em; padding-top: 1.4em;
}
.ytd-author__mark {
  width: 56px; height: 56px; border-radius: 50%; background: var(--ytd-leaf);
  color: #fff; font: 600 20px/56px var(--ytd-sans); text-align: center;
}
.ytd-author__name { font: 600 16px/1.4 var(--ytd-sans); margin: 0 0 .2em; }
.ytd-author__bio { font-size: 15px; line-height: 1.6; color: var(--ytd-ink-soft); margin: 0; }

/* Bài cùng chủ đề */
.ytd-related { margin-top: 2.5em; }
.ytd-related h2 { font-size: 18px; margin: 0 0 .6em; }
.ytd-related ul { list-style: none; margin: 0; padding: 0; }
.ytd-related li { border-top: 1px solid var(--ytd-line); }
.ytd-related a { display: block; padding: .7em 0; font-family: var(--ytd-sans); font-size: 16px; line-height: 1.45; text-decoration: none; color: var(--ytd-ink); }
.ytd-related a:hover { color: var(--ytd-leaf); }

/* ---------- Trang chủ: kệ chủ đề ---------- */
.ytd-home { max-width: 1120px; margin: 0 auto; padding: 0 16px 48px; }
.ytd-intro { max-width: 720px; padding: 40px 0 28px; }
.ytd-intro h1 { font-size: clamp(26px, 5.5vw, 40px); font-weight: 700; margin: 0 0 .4em; }
.ytd-intro p { font-size: 1.05em; color: var(--ytd-ink-soft); margin: 0; }
.ytd-intro .ytd-byline { font: 500 14px/1.5 var(--ytd-sans); color: var(--ytd-ink-soft); margin-top: 1em; }

.ytd-shelf { border-top: 2px solid var(--ytd-ink); }
.ytd-topic {
  display: grid; gap: 12px 40px; padding: 26px 0; border-bottom: 1px solid var(--ytd-line);
}
@media (min-width: 900px) { .ytd-topic { grid-template-columns: 300px 1fr; } }
.ytd-topic__head h2 { font-size: 24px; font-weight: 700; margin: 0; }
.ytd-topic__head h2 a { color: var(--ytd-ink); text-decoration: none; }
.ytd-topic__head h2 a:hover { color: var(--ytd-leaf); }
.ytd-topic__label {
  display: inline-block; margin-top: 8px; padding: 2px 10px; border: 1px solid var(--ytd-amber);
  border-radius: 2px; color: var(--ytd-amber); font: 500 13px/1.6 var(--ytd-sans); text-decoration: none;
}
.ytd-topic__label:hover { background: var(--ytd-amber-soft); color: var(--ytd-amber); }
.ytd-topic__desc { font-size: 16px; color: var(--ytd-ink-soft); margin: 8px 0 0; line-height: 1.6; }
.ytd-topic__posts { list-style: none; margin: 0; padding: 0; }
.ytd-topic__posts li + li { border-top: 1px dashed var(--ytd-line); }
.ytd-topic__posts a {
  display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center;
  padding: 10px 0; text-decoration: none; color: var(--ytd-ink);
}
.ytd-topic__posts img { width: 88px; height: 66px; object-fit: cover; border-radius: 2px; background: var(--ytd-line); }
.ytd-topic__posts span { font: 500 16px/1.45 var(--ytd-sans); }
.ytd-topic__posts a:hover span { color: var(--ytd-leaf); }

.ytd-more { padding: 28px 0 0; }
.ytd-more h2 { font-size: 18px; margin: 0 0 .6em; }
.ytd-more ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.ytd-more a { display: inline-block; padding: 6px 12px; border: 1px solid var(--ytd-line); background: var(--ytd-white); border-radius: 2px; font: 500 14px/1.4 var(--ytd-sans); text-decoration: none; color: var(--ytd-ink); }
.ytd-more a:hover { border-color: var(--ytd-leaf); color: var(--ytd-leaf); }

.ytd-shopline { margin-top: 36px; padding: 18px 20px; background: var(--ytd-white); border: 1px solid var(--ytd-line); font-size: 16px; }
.ytd-shopline a { font-family: var(--ytd-sans); font-weight: 600; }

/* ---------- Lưu trữ chuyên mục ---------- */
.archive .entry-title, .blog .entry-title { font-size: 20px; }
.archive .loop-entry, .blog .loop-entry { box-shadow: none; border: 1px solid var(--ytd-line); border-radius: 2px; }

/* ---------- Woo: shop phụ, giữ gọn ---------- */
.woocommerce ul.products li.product .woocommerce-loop-product__title { font-size: 16px; }
.woocommerce .price { color: var(--ytd-leaf-deep); font-family: var(--ytd-sans); }
.woocommerce a.button, .woocommerce button.button, .single_add_to_cart_button {
  background: var(--ytd-leaf) !important; color: #fff !important; border-radius: 3px !important;
}

/* Chữ không tràn ngang trên điện thoại (lỗi thấy 27/09 ở Flatsome) */
.entry-content { overflow-wrap: anywhere; }
.entry-content table { display: block; max-width: 100%; overflow-x: auto; }
.entry-content iframe, .entry-content embed, .entry-content video { max-width: 100%; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* Nút Messenger */
.ytd-msgr {
  position: fixed; right: 16px; bottom: 18px; z-index: 900; width: 52px; height: 52px; border-radius: 50%;
  background: #0084ff; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 10px rgba(0, 40, 80, .25);
}
.ytd-msgr:focus-visible { outline-offset: 3px; }

/* Logo đã có chữ "Yêu Tinh Dầu" ⇒ ẩn tên site in lặp (vẫn còn alt của logo) */
.site-branding .site-title-wrap { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.ytd-topic__posts span { min-width: 0; overflow-wrap: anywhere; padding-right: 4px; }
.site-footer { font-family: var(--ytd-sans); font-size: 14px; color: var(--ytd-ink-soft); }

/* Nhãn chuyên mục trên tít: chữ thường, cỡ nhỏ, không kéo giãn */
.entry-taxonomies, .entry-taxonomies a { text-transform: none !important; letter-spacing: 0 !important; font: 500 14px/1.4 var(--ytd-sans); color: var(--ytd-amber) !important; }
.single-post .post-thumbnail { margin-top: 0; }
