/* ============================================================
   MODDING CAFE — TYPOGRAPHY RESIZE V2
   Goal: tăng body text +3px toàn site cho dễ đọc trên màn lớn.
   KHÔNG đụng heading H1-H4, hero titles, menu nav, section titles.
   Loaded LAST trong public-head.php và admin-head.php.
   ============================================================ */

/* ===== FRONTEND BODY +3px =====
   Default 14-15px → 17-18px. Description / blockquote / card body / forms / footer text.
*/
body,
p,
li,
small,
label,
input,
textarea,
select,
button,
a,
.inner-hero__desc,
.blog-card__excerpt,
.blog-card__meta,
.post__body,
.post__excerpt,
.post-body,
.bio-hero__desc,
.bio-hero__role,
.bio-hero__resume,
.bio-hero__resume *,
.bio-hero__stats .lbl,
.stats-row .lbl,
.lbl,
.proj-card__year,
.proj-card__title,
.fp-card__title,
.fp-card__year,
.milestone__title,
.milestone__desc,
.inno-card__title,
.gallery-card,
.gallery-card *,
.video-card__title,
.video-meta,
.playlist__title,
.featured-video__sub,
.contact-form,
.contact-form *,
.contact-info,
.contact-info *,
.contact-grid p,
.contact-map-card__info-text,
.home-cta__desc,
.home-cta__socials .val,
.home-cta__socials .label,
.home-bottom,
.home-bottom__inner,
.partners .partner,
.purpose-item,
.purpose-item *,
.assurance,
.assurance *,
.consent,
.consent *,
.req,
.help,
.tag,
.chip,
.chip-mute,
.count,
.meta,
.cat-list a,
.cat-list .count,
.tools-grid .tool,
.tools-grid .tool *,
.skill-row,
.skill-row *,
.quote-block,
.quote-block *,
.quote,
.tbl td,
.tbl tbody,
.tbl tbody *,
.form-stack,
.form-stack p,
.form-stack small,
.form-stack label,
.field,
.field label,
.field small,
.field input,
.field textarea,
.field select {
  font-size-adjust: 0.52; /* tweak metrics so Smooch Sans reads consistent across systems */
}

/* Specific size bumps — prefix html[lang] selectors so we BEAT lang-vi.css overrides. */
html body { font-size: 17px !important; line-height: 1.65 !important; }
html body p { font-size: 17px !important; line-height: 1.65 !important; }
html[lang="vi"] body p,
html[lang="en"] body p { font-size: 17px !important; line-height: 1.65 !important; }

html .inner-hero__desc,
html[lang="vi"] .inner-hero__desc { font-size: 18px !important; line-height: 1.6 !important; }
html .bio-hero__desc,
html[lang="vi"] .bio-hero__desc { font-size: 18px !important; line-height: 1.6 !important; }
html .bio-hero__role,
html[lang="vi"] .bio-hero__role { font-size: 16px !important; }
html .bio-hero__resume,
html .bio-hero__resume *,
html[lang="vi"] .bio-hero__resume,
html[lang="vi"] .bio-hero__resume * { font-size: 15px !important; }
html .bio-hero__stats .lbl,
html .stats-row .lbl,
html .lbl,
html[lang="vi"] .lbl { font-size: 15px !important; }
html .milestone__title,
html[lang="vi"] .milestone__title { font-size: 17px !important; }
html .milestone__desc,
html[lang="vi"] .milestone__desc { font-size: 17px !important; line-height: 1.65 !important; }
html .inno-card__title,
html[lang="vi"] .inno-card__title { font-size: 18px !important; line-height: 1.45 !important; }
html .fp-card__title,
html[lang="vi"] .fp-card__title { font-size: 16px !important; }
html .fp-card__year,
html[lang="vi"] .fp-card__year { font-size: 16px !important; }
html .proj-card__title,
html[lang="vi"] .proj-card__title { font-size: 18px !important; }
html .proj-card__year,
html[lang="vi"] .proj-card__year { font-size: 16px !important; }
html .blog-card__title,
html[lang="vi"] .blog-card__title { font-size: 20px !important; line-height: 1.4 !important; }
html .blog-card__excerpt,
html .blog-card__meta,
html .post__excerpt,
html[lang="vi"] .blog-card__excerpt,
html[lang="vi"] .post__excerpt { font-size: 18px !important; line-height: 1.7 !important; }
html .video-card__title,
html[lang="vi"] .video-card__title { font-size: 16px !important; }
html .video-meta,
html[lang="vi"] .video-meta { font-size: 15px !important; }
html .featured-video__sub,
html[lang="vi"] .featured-video__sub { font-size: 15px !important; }
html .playlist__title,
html[lang="vi"] .playlist__title { font-size: 17px !important; }
html .tag,
html .chip,
html .chip-mute,
html .meta,
html[lang="vi"] .tag,
html[lang="vi"] .chip,
html[lang="vi"] .chip-mute,
html[lang="vi"] .meta { font-size: 15px !important; }
html .req, html .help, html small, html .form-stack small, html .field small,
html[lang="vi"] .req, html[lang="vi"] .help, html[lang="vi"] small { font-size: 14px !important; }
html .count, html[lang="vi"] .count { font-size: 15px !important; }

/* ============================================================
   ARTICLE CONTENT — Nội dung bài viết toàn site
   Body 20px / line-height 1.8. Áp dụng cho mọi vùng long-form:
   blog, project (.post-body), idea (.idea-lab__sec-body) + các tên
   class chuẩn (.article-content/.post-content/.project-content/
   .idea-content/.video-content). VI/EN đồng nhất 20px.
   CSS !important thắng inline style="font-size:16px" trên <article>.
   ============================================================ */
html .article-content,
html .post-content,
html .post-body,
html .post__body,
html .project-content,
html .idea-content,
html .video-content,
html .idea-lab__sec-body,
html .idea-lab__status-text,
html[lang="vi"] .article-content,
html[lang="vi"] .post-content,
html[lang="vi"] .post-body,
html[lang="vi"] .post__body,
html[lang="vi"] .project-content,
html[lang="vi"] .idea-content,
html[lang="vi"] .video-content,
html[lang="vi"] .idea-lab__sec-body,
html[lang="vi"] .idea-lab__status-text,
html[lang="en"] .article-content,
html[lang="en"] .post-content,
html[lang="en"] .post-body,
html[lang="en"] .post__body,
html[lang="en"] .project-content,
html[lang="en"] .idea-content,
html[lang="en"] .video-content,
html[lang="en"] .idea-lab__sec-body,
html[lang="en"] .idea-lab__status-text { font-size: 20px !important; line-height: 1.8 !important; }

/* Paragraph / list items / inline text bên trong vùng nội dung = 20px/1.8 */
html .article-content p, html .article-content li,
html .post-content p, html .post-content li,
html .post-body p, html .post-body li,
html .post__body p, html .post__body li,
html .project-content p, html .project-content li,
html .idea-content p, html .idea-content li,
html .video-content p, html .video-content li,
html .idea-lab__sec-body p, html .idea-lab__sec-body li,
html[lang="vi"] .post-body p, html[lang="vi"] .post-body li,
html[lang="vi"] .idea-lab__sec-body p, html[lang="vi"] .idea-lab__sec-body li,
html[lang="en"] .post-body p, html[lang="en"] .post-body li,
html[lang="en"] .idea-lab__sec-body p, html[lang="en"] .idea-lab__sec-body li {
  font-size: 20px !important; line-height: 1.8 !important;
}

/* Heading hierarchy TRONG vùng nội dung (rà soát sau khi body lên 20px) */
html .article-content h2, html .post-content h2, html .post-body h2,
html .post__body h2, html .project-content h2, html .idea-content h2,
html .video-content h2, html .idea-lab__sec-body h2 {
  font-size: 28px !important; line-height: 1.3 !important;
}
html .article-content h3, html .post-content h3, html .post-body h3,
html .post__body h3, html .project-content h3, html .idea-content h3,
html .video-content h3, html .idea-lab__sec-body h3 {
  font-size: 24px !important; line-height: 1.35 !important;
}
html .article-content h4, html .post-content h4, html .post-body h4,
html .post__body h4, html .project-content h4, html .idea-content h4,
html .video-content h4, html .idea-lab__sec-body h4 {
  font-size: 21px !important; line-height: 1.4 !important;
}

/* ul/ol/blockquote/pre/code/table đồng bộ với body mới = 20px */
html .article-content ul, html .article-content ol, html .article-content blockquote, html .article-content table, html .article-content td, html .article-content th,
html .post-content ul, html .post-content ol, html .post-content blockquote, html .post-content table, html .post-content td, html .post-content th,
html .post-body ul, html .post-body ol, html .post-body blockquote, html .post-body table, html .post-body td, html .post-body th,
html .post__body ul, html .post__body ol, html .post__body blockquote, html .post__body table, html .post__body td, html .post__body th,
html .project-content ul, html .project-content ol, html .project-content blockquote, html .project-content table, html .project-content td, html .project-content th,
html .idea-content ul, html .idea-content ol, html .idea-content blockquote, html .idea-content table, html .idea-content td, html .idea-content th,
html .video-content ul, html .video-content ol, html .video-content blockquote, html .video-content table, html .video-content td, html .video-content th,
html .idea-lab__sec-body ul, html .idea-lab__sec-body ol, html .idea-lab__sec-body blockquote, html .idea-lab__sec-body table, html .idea-lab__sec-body td, html .idea-lab__sec-body th {
  font-size: 20px !important; line-height: 1.8 !important;
}
/* code/pre: monospace nhỏ hơn 1 nhịp cho dễ phân biệt, vẫn đọc tốt */
html .post-body code, html .post-body pre, html .post-body pre code,
html .post__body code, html .post__body pre, html .post__body pre code,
html .article-content code, html .article-content pre,
html .post-content code, html .post-content pre,
html .project-content code, html .project-content pre,
html .idea-content code, html .idea-content pre,
html .video-content code, html .video-content pre,
html .idea-lab__sec-body code, html .idea-lab__sec-body pre {
  font-size: 18px !important; line-height: 1.7 !important;
}

/* ============================================================
   Mục I: Sidebar Category Font-size (+3px → 16px)
   Mục IV: Icon ↔ Text Gap (14px), Icon Container 18×18px flex-centered
   ============================================================ */
html .cat-list a,
html[lang="vi"] .cat-list a,
html .ideas-filter a,
html[lang="vi"] .ideas-filter a {
  font-size: 16px !important;
  gap: 14px !important;
}

html .cat-list .ico,
html[lang="vi"] .cat-list .ico,
html .ideas-filter .ico,
html[lang="vi"] .ideas-filter .ico {
  width: 18px !important;
  height: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
}

html .cat-list .ico svg,
html[lang="vi"] .cat-list .ico svg,
html .ideas-filter .ico svg,
html[lang="vi"] .ideas-filter .ico svg {
  width: 18px !important;
  height: 18px !important;
}

/* Buttons +3 */
html .btn,
html .btn-primary,
html .btn-outline-orange,
html .btn-ghost,
html button,
html[lang="vi"] .btn,
html[lang="vi"] .btn-outline-orange,
html[lang="vi"] .btn-ghost,
html[lang="vi"] .btn-primary,
html[lang="vi"] button { font-size: 16px !important; }
html .btn-sm, html[lang="vi"] .btn-sm { font-size: 14px !important; }
html .btn-lg, html[lang="vi"] .btn-lg { font-size: 18px !important; }

/* Form labels & inputs */
html label,
html .field > label,
html[lang="vi"] label { font-size: 16px !important; line-height: 1.5 !important; }
html input, html textarea, html select,
html[lang="vi"] input, html[lang="vi"] textarea, html[lang="vi"] select { font-size: 17px !important; line-height: 1.5 !important; }
html input::placeholder, html textarea::placeholder,
html[lang="vi"] input::placeholder, html[lang="vi"] textarea::placeholder { font-size: 16px !important; }

/* Footer CTA */
html .home-cta__desc, html[lang="vi"] .home-cta__desc { font-size: 17px !important; line-height: 1.6 !important; }
html .home-cta__socials .val { font-size: 16px !important; }
html .home-cta__socials .label,
html[lang="vi"] .home-cta__socials .label { font-size: 13px !important; letter-spacing: 0.16em !important; }
html .home-cta__btn,
html[lang="vi"] .home-cta__btn,
html[lang="vi"] .btn.home-cta__btn { font-size: 16px !important; }

/* Footer bottom */
html .home-bottom,
html .home-bottom__inner,
html .home-bottom__inner div,
html .home-bottom__inner .right,
html .home-bottom__inner a,
html[lang="vi"] .home-bottom,
html[lang="vi"] .home-bottom__inner,
html[lang="vi"] .home-bottom__inner a,
html[lang="vi"] .home-bottom a { font-size: 15px !important; }

/* Contact map info */
html .contact-map-card__info-text { font-size: 17px !important; line-height: 1.5 !important; }
html .contact-map-card__info-text small { font-size: 15px !important; }
html .contact-map-card__cta { font-size: 16px !important; }

/* Contact info column */
html .contact-info p { font-size: 17px !important; }
html .contact-info h5 { font-size: 14px !important; }

/* DO NOT INCREASE — headings + nav + section labels stay as designed */
h1, h2, h3, h4, h5, h6,
.section-label,
.home-cta__title,
.home-cta__title-line,
.home-cta__title-accent,
.primary-nav,
.primary-nav a,
.brand__name,
.brand__tag,
.timeline__year,
.milestone__year,
.bio-hero__stats .num,
.stats-row .num,
.num,
.home-cta__title { /* explicit no-bump */ }

/* ============================================================
   ADMIN BODY +3px — KHÔNG đụng sidebar/h*/section-title
   ============================================================ */
.admin-shell p,
.admin-shell li,
.admin-shell small,
.admin-shell input,
.admin-shell textarea,
.admin-shell select,
.admin-shell button,
.panel p,
.panel small,
.panel label,
.panel input,
.panel textarea,
.panel select,
.panel button,
.crud-card p,
.crud-card small,
.crud-card input,
.crud-card textarea,
.crud-card select,
.field input,
.field textarea,
.field select,
.field label,
.field small,
.tbl td,
.tbl tbody td,
.form-stack label,
.form-stack input,
.form-stack textarea,
.form-stack select,
.form-stack p,
.form-stack small,
.flash,
.flash-success,
.flash-error,
.badge,
.status {
  font-size: 16px !important;
  line-height: 1.55 !important;
}

.admin-shell .btn,
.admin-shell .btn-primary,
.admin-shell .btn-outline-orange,
.admin-shell .btn-sm,
.admin-shell .btn-lg,
.admin-shell button[type=submit] { font-size: 15px !important; }

.admin-shell .btn-sm { font-size: 13px !important; }

/* Table headers giữ nguyên (heading) */
.tbl th { font-size: 13px !important; }

/* Stat numbers (display heading) — không tăng */
.stat-card__num,
.stat-card__title,
.stat-card__label { /* unchanged */ }

/* Inputs/textarea placeholder */
.panel input::placeholder,
.panel textarea::placeholder,
.field input::placeholder,
.field textarea::placeholder { font-size: 15px !important; }

/* Helper text under inputs */
.field small,
.crud-card small,
.form-stack small { font-size: 13px !important; }

/* Sidebar — DO NOT touch (heading-style nav) */
.admin-sidebar,
.admin-sidebar *,
.admin-sidebar__brand,
.admin-sidebar__brand *,
.admin-sidebar__group h6,
.admin-sidebar__link,
.admin-topbar h1,
.admin-topbar h2 { /* keep current sizes */ }

/* ============================================================
   Mobile/Tablet safety — slightly less aggressive on small screens
   so cards/buttons don't overflow.
   ============================================================ */
@media (max-width: 700px) {
  body, p { font-size: 16px !important; }
  .blog-card__title { font-size: 18px !important; }
  .blog-card__excerpt { font-size: 16px !important; }
  .inner-hero__desc { font-size: 16px !important; }
  .home-cta__desc { font-size: 16px !important; }
  .home-cta__socials .val { font-size: 15px !important; }
  label { font-size: 15px !important; }
  input, textarea, select { font-size: 16px !important; }

  /* Nội dung bài viết: giảm nhẹ 20px → 17px để đọc tốt, không vỡ layout */
  html .article-content, html .post-content, html .post-body, html .post__body,
  html .project-content, html .idea-content, html .video-content,
  html .idea-lab__sec-body, html .idea-lab__status-text,
  html .post-body p, html .post-body li, html .post__body p, html .post__body li,
  html .idea-lab__sec-body p, html .idea-lab__sec-body li,
  html .post-body ul, html .post-body ol, html .post-body blockquote, html .post-body td,
  html .post__body ul, html .post__body ol, html .post__body blockquote, html .post__body td,
  html .idea-lab__sec-body ul, html .idea-lab__sec-body ol, html .idea-lab__sec-body blockquote, html .idea-lab__sec-body td {
    font-size: 17px !important; line-height: 1.75 !important;
  }
  html .post-body h2, html .post__body h2, html .idea-lab__sec-body h2 { font-size: 24px !important; }
  html .post-body h3, html .post__body h3, html .idea-lab__sec-body h3 { font-size: 21px !important; }
  html .post-body h4, html .post__body h4, html .idea-lab__sec-body h4 { font-size: 19px !important; }
  html .post-body code, html .post-body pre, html .post__body code, html .post__body pre,
  html .idea-lab__sec-body code, html .idea-lab__sec-body pre { font-size: 16px !important; }
}