/* ==========================================================================
   Bổ sung cho giao diện FSB trên nền Flatsome
   (CSS Flatsome đã nằm trong @layer flatsome nên không cần viết đè; file này chỉ chứa phần
   theme thêm vào mà thiết kế HTML tĩnh không có.)
   ========================================================================== */

/* --------------------------------------------------------------------------
   Vùng giao diện FSB hiển thị đúng như file HTML thiết kế (trình duyệt + Bootstrap + CSS thiết kế):
   layer "fsb-reset" (xếp trên layer "flatsome") trả mọi thuộc tính về mặc định trình duyệt
   → CSS Flatsome không lọt vào header, footer, các khối FSB và trang tin.
   Bootstrap + CSS thiết kế không nằm trong layer nên vẫn thắng như bình thường.
   Phần tử UX Builder gốc của Flatsome (nằm ngoài các vùng này) vẫn giữ style Flatsome.
   SVG không reset (thuộc tính trình bày như stroke/fill sẽ mất).
   -------------------------------------------------------------------------- */
@layer fsb-reset {
  :where(.topbar, .site-header, .site-footer, .float-contact, .fsb-block, main.news, .fsb-page),
  :where(.topbar, .site-header, .site-footer, .float-contact, .fsb-block, main.news, .fsb-page) :where(:not(svg, svg *)),
  :where(.topbar, .site-header, .site-footer, .float-contact, .fsb-block, main.news, .fsb-page)::before,
  :where(.topbar, .site-header, .site-footer, .float-contact, .fsb-block, main.news, .fsb-page)::after,
  :where(.topbar, .site-header, .site-footer, .float-contact, .fsb-block, main.news, .fsb-page) :where(:not(svg, svg *))::before,
  :where(.topbar, .site-header, .site-footer, .float-contact, .fsb-block, main.news, .fsb-page) :where(:not(svg, svg *))::after {
    all: revert;
  }
  /* Nội dung bài viết / trang thường dùng phần tử Flatsome ([button], [row]…): giữ style Flatsome. */
  :where(.sg-content .button, .sg-content .row, .sg-content .col, .sg-content [class*="ux-"]) { all: revert-layer; }
}

/* Flatsome tô nền xám cho <html> (bố cục "boxed") → trang ngắn lộ dải xám dưới footer. */
html { background-color: #fff; }

/* Vòng % (khối Số liệu) vẽ bằng SVG thay ảnh ring-80/75 */
.ring-rot .ring-arc { position: absolute; inset: 0; width: 160px; height: 160px; }

/* Logo ảnh tuỳ chọn ở banner */
.hero-logo-img { display: block; width: 100%; height: auto; }

/* Form đăng ký nhận tin: ô bẫy spam + thông báo */
.fsb-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.fsb-subscribe-msg { margin: 8px 0 0; font-size: 14px; line-height: 20px; color: #c3c3c3; text-align: left; }
.fsb-subscribe-msg:empty { display: none; }
.fsb-subscribe-msg.is-ok { color: #7ee0a1; }
.fsb-subscribe-msg.is-error { color: #ffb4a2; }
.fsb-subscribe.is-loading button { opacity: .6; pointer-events: none; }

/* Chọn ngôn ngữ (Polylang) */
.topbar-lang-wrap { position: relative; display: flex; align-items: center; }
.topbar-lang-menu { min-width: 140px; font-size: 14px; }
.topbar-lang-menu .dropdown-item.active, .topbar-lang-menu .dropdown-item:active { background: var(--blue); }

/* Link "Bỏ qua tới nội dung" */
.skip-link:focus { position: fixed !important; top: 8px; left: 8px; z-index: 2000; padding: 8px 16px; background: #fff; color: var(--ink); border-radius: 4px; }

/* Thẻ chương trình: chưa có dữ liệu */
.pg-empty { padding: 24px; text-align: center; color: var(--muted); }
