/**
 * DoiHinhTFT.VN - Mobile spacing fix v2
 * Mục tiêu: bài viết BlogHash trên mobile dùng khoảng cách 2 bên 12px giống trang plugin tướng.
 * Fix mạnh hơn bản cũ: không phụ thuộc body.single để áp dụng được cả post/page/custom single.
 */
@media (max-width: 640px) {
  /* Container chính của theme: BlogHash mặc định còn 3rem/5rem nên gây hở 2 bên lớn. */
  html body #page #main > .bloghash-container,
  html body #page .site-main > .bloghash-container,
  html body #page .page-header > .bloghash-container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  /* Không để primary/article tự thêm padding/margin làm nội dung bị thụt vào. */
  html body #page #main #primary,
  html body #page #main .content-area,
  html body #page #main .site-content,
  html body #page #main .site-main,
  html body #page #main .bloghash-article,
  html body #page #main article,
  html body #page #main .bloghash-entry,
  html body #page #main .bloghash-blog-entry-wrapper,
  html body #page #main .entry-content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  html body #page #main #primary {
    margin-top: 18px !important;
  }

  /* Fix các block alignfull/alignwide của Gutenberg bị theme kéo âm margin. */
  html body #page #main .entry-content > *,
  html body #page #main .entry-content .alignwide,
  html body #page #main .entry-content .alignfull,
  html body #page #main .entry-content .bloghash-fw-section,
  html body #page #main .entry-content > :where(.wp-block-group, .wp-block-columns, .wp-block-cover, .wp-block-image, .wp-block-table),
  html body #page #main .entry-content > :where(.tftpro-wrap, .tcm-wrap, .tft-comp-manager, .dhtft-wrap, .dhtft-card) {
    width: 100% !important;
    max-width: 100% !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  html body #page #main .entry-content img,
  html body #page #main .entry-content iframe,
  html body #page #main .entry-content video,
  html body #page #main .entry-content table {
    max-width: 100% !important;
    height: auto;
  }
}