/* Storefront typography system: semantic roles, Vietnamese-friendly metrics. */
:root {
    --dmtk-font-family: 'Be Vietnam Pro', Arial, sans-serif;
    --dmtk-type-xs: 12px;
    --dmtk-type-sm: 13px;
    --dmtk-type-ui: 14px;
    --dmtk-type-product: 15px;
    --dmtk-type-base: 16px;
    --dmtk-type-section: 18px;
    --dmtk-type-h3: 20px;
    --dmtk-type-h2: 24px;
    --dmtk-type-h1: 32px;
    --dmtk-leading-tight: 1.25;
    --dmtk-leading-heading: 1.35;
    --dmtk-leading-ui: 1.4;
    --dmtk-leading-copy: 1.6;
    --dmtk-weight-regular: 400;
    --dmtk-weight-medium: 500;
    --dmtk-weight-semibold: 600;
    --dmtk-weight-bold: 700;
}

body,
button,
input,
select,
textarea,
.nav > li > a,
.mobile-nav > li > a,
h1,
h2,
h3,
h4,
h5,
h6,
.product-title,
.section-title,
.widget-title {
    font-family: var(--dmtk-font-family) !important;
}

body {
    font-size: var(--dmtk-type-base);
    font-weight: var(--dmtk-weight-regular);
    line-height: var(--dmtk-leading-copy);
}

h1,
.h1 {
    font-size: var(--dmtk-type-h1) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: var(--dmtk-leading-tight) !important;
}

h2,
.h2 {
    font-size: var(--dmtk-type-h2) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: 1.3 !important;
}

h3,
.h3 {
    font-size: var(--dmtk-type-h3) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: var(--dmtk-leading-heading) !important;
}

h4,
.h4 {
    font-size: var(--dmtk-type-section) !important;
    font-weight: var(--dmtk-weight-semibold) !important;
    line-height: var(--dmtk-leading-heading) !important;
}

h5,
.h5 {
    font-size: var(--dmtk-type-base) !important;
    font-weight: var(--dmtk-weight-semibold) !important;
    line-height: var(--dmtk-leading-ui) !important;
}

h6,
.h6 {
    font-size: var(--dmtk-type-ui) !important;
    font-weight: var(--dmtk-weight-semibold) !important;
    line-height: var(--dmtk-leading-ui) !important;
}

/* Editorial and transactional copy. Avoid global p/span selectors around prices and badges. */
.entry-content p,
.entry-content li,
.page-inner p,
.page-inner li,
.woocommerce-Tabs-panel p,
.woocommerce-Tabs-panel li,
.woocommerce-MyAccount-content p,
.woocommerce-MyAccount-content li,
.cart-container p,
.checkout p,
.product-short-description p,
.product-short-description li {
    font-size: var(--dmtk-type-base) !important;
    font-weight: var(--dmtk-weight-regular);
    line-height: var(--dmtk-leading-copy) !important;
}

/* Header, navigation and sidebar UI. */
.header-nav > li > a,
#wide-nav .nav > li > a,
.mobile-nav > li > a,
.nav-sidebar > li > a {
    font-size: var(--dmtk-type-ui) !important;
    font-weight: var(--dmtk-weight-semibold);
    line-height: var(--dmtk-leading-ui) !important;
}

#mega_menu > li > a,
.widget_nav_menu .menu > li > a,
.sidebar-wrapper .widget li > a,
#secondary .widget li > a {
    font-size: var(--dmtk-type-product) !important;
    font-weight: var(--dmtk-weight-medium);
    line-height: var(--dmtk-leading-ui) !important;
}

.breadcrumbs,
.product_meta,
.product_meta span,
.posted_in,
.tagged_as,
.woocommerce-breadcrumb {
    font-size: var(--dmtk-type-sm) !important;
    font-weight: var(--dmtk-weight-regular);
    line-height: 1.5 !important;
}

.woocommerce-result-count,
.woocommerce-ordering select {
    font-size: var(--dmtk-type-ui) !important;
    line-height: var(--dmtk-leading-ui) !important;
}

/* Structural headings share one clear scale. */
.home .ct-heading .cth2,
.category-page-row .widget-title,
.custom-product-page .widget-title,
.sidebar-wrapper .widget-title,
#secondary .widget-title,
.thongso-sp h3,
.product-section-title,
.product-section-title-related,
.section-title-main {
    font-size: var(--dmtk-type-section) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: var(--dmtk-leading-heading) !important;
}

.home .ct-heading .ulh3 h3 {
    font-size: inherit !important;
    line-height: 1 !important;
}

.home .ct-heading .ulh3 a {
    font-size: var(--dmtk-type-sm) !important;
    font-weight: var(--dmtk-weight-medium);
    line-height: 1 !important;
}

/* Product grids: two-line titles and aligned price rhythm. */
.product-small .title-wrapper {
    height: 44px;
    max-height: 44px;
    min-height: 44px;
    overflow: hidden;
}

.product-small .woocommerce-loop-product__title,
.product-small .title-wrapper .product-title {
    display: -webkit-box;
    font-size: var(--dmtk-type-product) !important;
    font-weight: var(--dmtk-weight-medium) !important;
    height: 44px;
    line-height: 22px !important;
    max-height: 44px;
    min-height: 44px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.product-small .title-wrapper .product-title a {
    display: -webkit-box;
    height: 44px;
    line-height: 22px !important;
    max-height: 44px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.product-small .price,
.product-small .price ins,
.product-small .price ins .amount,
.product-small .price > .amount {
    font-size: var(--dmtk-type-base) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: 1.3 !important;
}

.product-small .price del,
.product-small .price del .amount {
    font-size: var(--dmtk-type-sm) !important;
    font-weight: var(--dmtk-weight-regular) !important;
    line-height: 1.3 !important;
}

/* Single-product hierarchy. */
.single-product h1.product-title,
.single-product .product-summary .product-title,
.single-product .thongtin-sp .product-title {
    font-size: 28px !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: var(--dmtk-leading-tight) !important;
}

.single-product .product-main .price-wrapper .price,
.single-product .product-main .price-wrapper ins,
.single-product .product-main .price-wrapper ins .amount,
.single-product .product-main .price-wrapper > .price > .amount {
    font-size: var(--dmtk-type-h2) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: 1.3 !important;
}

.single-product .product-main .price-wrapper del,
.single-product .product-main .price-wrapper del .amount {
    font-size: var(--dmtk-type-ui) !important;
    font-weight: var(--dmtk-weight-regular) !important;
}

.woocommerce-tabs .nav > li > a,
.product-tabs > li > a {
    font-size: var(--dmtk-type-ui) !important;
    font-weight: var(--dmtk-weight-semibold) !important;
    line-height: var(--dmtk-leading-ui) !important;
}

.woocommerce-Reviews-title,
.comment-reply-title {
    font-size: var(--dmtk-type-h3) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: var(--dmtk-leading-copy) !important;
}

/* Forms, buttons and commerce tables. */
button,
.button,
input[type='button'],
input[type='reset'],
input[type='submit'] {
    font-size: var(--dmtk-type-ui) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: 1.2 !important;
}

input:not([type='checkbox']):not([type='radio']),
select,
textarea {
    font-size: var(--dmtk-type-product) !important;
    font-weight: var(--dmtk-weight-regular);
    line-height: 1.4 !important;
}

label,
.form-row label {
    font-size: var(--dmtk-type-ui) !important;
    font-weight: var(--dmtk-weight-semibold) !important;
    line-height: var(--dmtk-leading-ui) !important;
}

.shop_table th,
.woocommerce-checkout-review-order-table th,
.cart_totals th {
    font-size: var(--dmtk-type-ui) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: var(--dmtk-leading-ui) !important;
}

.shop_table td,
.woocommerce-checkout-review-order-table td,
.cart_totals td {
    font-size: var(--dmtk-type-product) !important;
    line-height: 1.5 !important;
}

.order-total th,
.order-total td,
.order-total .amount {
    font-size: var(--dmtk-type-section) !important;
    font-weight: var(--dmtk-weight-bold) !important;
}

/* Footer copy is intentionally one step quieter than body copy. */
.footer p,
.footer li,
.footer a,
.absolute-footer {
    font-size: var(--dmtk-type-product) !important;
    line-height: var(--dmtk-leading-copy) !important;
}

.footer .widget-title,
.footer .footer-title {
    font-size: var(--dmtk-type-base) !important;
    font-weight: var(--dmtk-weight-bold) !important;
    line-height: var(--dmtk-leading-heading) !important;
}

@media screen and (max-width: 849px) {
    :root {
        --dmtk-type-h1: 26px;
        --dmtk-type-h2: 22px;
        --dmtk-type-h3: 18px;
        --dmtk-type-section: 16px;
    }

    .single-product h1.product-title,
    .single-product .product-summary .product-title,
    .single-product .thongtin-sp .product-title {
        font-size: 24px !important;
    }

    input:not([type='checkbox']):not([type='radio']),
    select,
    textarea {
        font-size: var(--dmtk-type-base) !important;
    }
}

@media screen and (max-width: 549px) {
    .product-small .title-wrapper,
    .product-small .woocommerce-loop-product__title,
    .product-small .title-wrapper .product-title,
    .product-small .title-wrapper .product-title a {
        height: 38px;
        line-height: 19px !important;
        max-height: 38px;
        min-height: 38px;
    }

    .product-small .woocommerce-loop-product__title,
    .product-small .title-wrapper .product-title,
    .product-small .title-wrapper .product-title a {
        font-size: 13px !important;
    }
}