@font-face {
    font-family: "Be Vietnam Pro";
    src: url("../fonts/be-vietnam-pro/be-vietnam-pro-400.ttf") format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Be Vietnam Pro";
    src: url("../fonts/be-vietnam-pro/be-vietnam-pro-500.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Be Vietnam Pro";
    src: url("../fonts/be-vietnam-pro/be-vietnam-pro-600.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Be Vietnam Pro";
    src: url("../fonts/be-vietnam-pro/be-vietnam-pro-700.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Be Vietnam Pro";
    src: url("../fonts/be-vietnam-pro/be-vietnam-pro-800.ttf") format("truetype");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* Ánh xạ an toàn cho font-weight: 900 sử dụng ExtraBold 800 thật, ngăn chặn trình duyệt chạy thuật toán Faux-bold làm nhòe và méo dấu tiếng Việt */
@font-face {
    font-family: "Be Vietnam Pro";
    src: url("../fonts/be-vietnam-pro/be-vietnam-pro-800.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --ts-font-main: "Be Vietnam Pro", Arial, Helvetica, sans-serif;
}

html,
body,
button,
input,
select,
textarea {
    font-family: var(--ts-font-main) !important;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body,
.pc-site-head,
.pc-topbar,
.pc-nav,
.pc-search,
.pc-head-actions,
.pc-home,
.ts-shop-page,
.ts-quote-cart-page,
.dt-product-page,
.buildpc-page,
.ts-site-footer {
    font-family: var(--ts-font-main) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.pc-nav a,
.pc-search__cat,
.pc-search__submit,
.pc-head-actions a,
.ts-quote-head h1,
.ts-quote-product h2,
.ts-quote-payment h2,
.pc-product-card__name,
.pc-product-card__price,
.ts-filter-panel,
.ts-side-cats,
.build-page-title,
.summary-title,
.component-name,
.selected-product-name,
.ts-product-tabs nav a,
.ts-tab-panel,
.dt-entry-content {
    font-family: var(--ts-font-main) !important;
    letter-spacing: 0;
}

.fa,
.fas,
.far,
.fab,
.fa-solid,
.fa-regular,
.fa-brands,
[class^="fa-"],
[class*=" fa-"] {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", FontAwesome !important;
}

.fab,
.fa-brands {
    font-family: "Font Awesome 6 Brands", "Font Awesome 5 Brands" !important;
}