/**
 * HONORZONE product readability patch v0.2.9
 *
 * Goals:
 * - Improve the hero, tabs, overview and specification table shown in the
 *   supplied 1920px screenshots.
 * - Preserve compact badges, logos and WordPress administration screens.
 * - Remain reversible by deactivating the plugin.
 */

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body.single-product,
body.post-type-archive-product,
body.tax-product_cat,
body.tax-product_series {
    font-size: 16px;
    font-optical-sizing: auto;
    text-rendering: optimizeLegibility;
}

/* Product breadcrumb and navigation: readable without inflating badges. */
body.single-product .woocommerce-breadcrumb,
body.single-product nav[aria-label="breadcrumb"],
body.single-product [class*="breadcrumb"] {
    font-size: clamp(0.875rem, 0.18vw + 0.84rem, 0.95rem);
    line-height: 1.55;
}

body.single-product h1,
body.single-product .product_title,
body.single-product [class*="product-title"] {
    font-size: clamp(2.15rem, 2.2vw + 0.8rem, 3.5rem);
    line-height: 1.08;
    letter-spacing: -0.025em;
}

body.single-product h2 {
    font-size: clamp(1.55rem, 0.65vw + 1.25rem, 2rem);
    line-height: 1.25;
}

/* Hero highlights and explanatory text in screenshot 1. */
body.single-product .product-highlights,
body.single-product [class*="highlight"] li,
body.single-product [class*="highlight"] p,
body.single-product [class*="summary"] p,
body.single-product [class*="summary"] li,
body.single-product .woocommerce-product-details__short-description,
body.single-product .woocommerce-product-details__short-description p,
body.single-product .woocommerce-product-details__short-description li {
    font-size: clamp(0.96rem, 0.18vw + 0.92rem, 1.06rem);
    line-height: 1.62;
}

/* Main product action buttons and sticky section navigation. */
body.single-product a[href^="#tong-quan"],
body.single-product a[href^="#thong-so"],
body.single-product a[href^="#danh-gia"],
body.single-product a[href^="#thao-luan"],
body.single-product a[href^="#thu-vien"],
body.single-product [role="tab"],
body.single-product .product-tabs a,
body.single-product .sticky-tabs a {
    font-size: clamp(0.93rem, 0.14vw + 0.9rem, 1rem);
    line-height: 1.35;
}

/* Overview copy. */
body.single-product #tong-quan .prose,
body.single-product #tong-quan .prose p,
body.single-product #tong-quan .prose li,
body.single-product #overview .prose,
body.single-product #overview .prose p,
body.single-product #overview .prose li {
    font-size: clamp(1rem, 0.18vw + 0.96rem, 1.08rem);
    line-height: 1.75;
}

/* Specification table shown in screenshot 2. */
body.single-product #thong-so table,
body.single-product #specifications table,
body.single-product .product-specifications table,
body.single-product .specifications-table,
body.single-product table[class*="spec"] {
    font-size: clamp(0.94rem, 0.16vw + 0.91rem, 1.03rem);
    line-height: 1.65;
}

body.single-product #thong-so table th,
body.single-product #thong-so table td,
body.single-product #specifications table th,
body.single-product #specifications table td,
body.single-product .product-specifications table th,
body.single-product .product-specifications table td,
body.single-product .specifications-table th,
body.single-product .specifications-table td,
body.single-product table[class*="spec"] th,
body.single-product table[class*="spec"] td {
    font-size: inherit;
    line-height: 1.65;
    vertical-align: top;
}

body.single-product #thong-so table th,
body.single-product #specifications table th,
body.single-product .product-specifications table th,
body.single-product .specifications-table th,
body.single-product table[class*="spec"] th {
    color: #26344b;
    font-weight: 750;
}

body.single-product #thong-so table td,
body.single-product #specifications table td,
body.single-product .product-specifications table td,
body.single-product .specifications-table td,
body.single-product table[class*="spec"] td {
    color: #53627a;
}

/* The current theme renders detailed specifications as accordion/div groups,
 * not only as a table. Keep every label and value as readable as the overview
 * while leaving small status badges outside the specification section alone. */
body.single-product #thong-so,
body.single-product #specifications,
body.single-product .product-specifications,
body.single-product [data-hzem-specs],
body.single-product .honor-specifications {
    color: #3f4d63;
    font-size: clamp(1rem, 0.18vw + 0.96rem, 1.08rem);
    line-height: 1.68;
}

body.single-product #thong-so :is(p, li, dd, td, button, [class~="text-xs"], [class~="text-sm"]),
body.single-product #specifications :is(p, li, dd, td, button, [class~="text-xs"], [class~="text-sm"]),
body.single-product .product-specifications :is(p, li, dd, td, button, [class~="text-xs"], [class~="text-sm"]),
body.single-product [data-hzem-specs] :is(p, li, dd, td, button, [class~="text-xs"], [class~="text-sm"]),
body.single-product .honor-specifications :is(p, li, dd, td, button, [class~="text-xs"], [class~="text-sm"]) {
    font-size: inherit !important;
    line-height: 1.68 !important;
}

body.single-product #thong-so :is(th, dt, h3, h4, [class*="font-bold"], [class*="font-semibold"]),
body.single-product #specifications :is(th, dt, h3, h4, [class*="font-bold"], [class*="font-semibold"]),
body.single-product .product-specifications :is(th, dt, h3, h4, [class*="font-bold"], [class*="font-semibold"]),
body.single-product [data-hzem-specs] :is(th, dt, h3, h4, [class*="font-bold"], [class*="font-semibold"]),
body.single-product .honor-specifications :is(th, dt, h3, h4, [class*="font-bold"], [class*="font-semibold"]) {
    color: #26344b !important;
    font-size: clamp(1rem, 0.16vw + 0.97rem, 1.06rem) !important;
    line-height: 1.55 !important;
}

body.single-product #thong-so :is(.text-slate-300, .text-slate-400, .text-slate-500, .text-slate-600),
body.single-product #specifications :is(.text-slate-300, .text-slate-400, .text-slate-500, .text-slate-600),
body.single-product .product-specifications :is(.text-slate-300, .text-slate-400, .text-slate-500, .text-slate-600),
body.single-product [data-hzem-specs] :is(.text-slate-300, .text-slate-400, .text-slate-500, .text-slate-600),
body.single-product .honor-specifications :is(.text-slate-300, .text-slate-400, .text-slate-500, .text-slate-600) {
    color: #526176 !important;
}

/* Gallery captions, video titles and rights/source notes. */
body.single-product #thu-vien p,
body.single-product #thu-vien li,
body.single-product #gallery p,
body.single-product #gallery li,
body.single-product [class*="gallery"] figcaption,
body.single-product [class*="video"] figcaption {
    font-size: clamp(0.92rem, 0.14vw + 0.89rem, 1rem);
    line-height: 1.55;
}

/* Product grids also need balanced card copy. */
body.post-type-archive-product ul.products li.product .woocommerce-loop-product__title,
body.tax-product_cat ul.products li.product .woocommerce-loop-product__title,
body.tax-product_series ul.products li.product .woocommerce-loop-product__title {
    font-size: clamp(1.05rem, 0.25vw + 1rem, 1.18rem);
    line-height: 1.35;
}

body.post-type-archive-product ul.products li.product,
body.tax-product_cat ul.products li.product,
body.tax-product_series ul.products li.product {
    font-size: 0.96rem;
    line-height: 1.5;
}

/* Current /san-pham/ template uses compact Tailwind utility text. Increase
 * readability and contrast only inside product archives/taxonomies. */
body.post-type-archive-product main .text-xs,
body.tax-product_cat main .text-xs,
body.tax-product_series main .text-xs {
    font-size: 0.84rem;
    line-height: 1.48;
}

body.post-type-archive-product main .text-sm,
body.tax-product_cat main .text-sm,
body.tax-product_series main .text-sm {
    font-size: clamp(0.94rem, 0.12vw + 0.91rem, 1rem);
    line-height: 1.58;
}

body.post-type-archive-product main .text-slate-400,
body.tax-product_cat main .text-slate-400,
body.tax-product_series main .text-slate-400 {
    color: #64748b;
}

body.post-type-archive-product main .text-slate-500,
body.tax-product_cat main .text-slate-500,
body.tax-product_series main .text-slate-500 {
    color: #526176;
}

body.post-type-archive-product main .text-slate-600,
body.tax-product_cat main .text-slate-600,
body.tax-product_series main .text-slate-600 {
    color: #3f4d63;
}

body.post-type-archive-product main [class*="aspect-"] img,
body.tax-product_cat main [class*="aspect-"] img,
body.tax-product_series main [class*="aspect-"] img {
    filter: none;
    opacity: 1;
}

@media (max-width: 767px) {
    body.single-product,
    body.post-type-archive-product,
    body.tax-product_cat,
    body.tax-product_series {
        font-size: 15.5px;
    }

    body.single-product h1,
    body.single-product .product_title,
    body.single-product [class*="product-title"] {
        font-size: clamp(2rem, 9vw, 2.65rem);
        line-height: 1.1;
    }

    body.single-product #thong-so,
    body.single-product #specifications,
    body.single-product .product-specifications {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.single-product #thong-so table,
    body.single-product #specifications table,
    body.single-product .product-specifications table,
    body.single-product .specifications-table,
    body.single-product table[class*="spec"] {
        font-size: 0.94rem;
        line-height: 1.62;
    }

    body.single-product #thong-so table th,
    body.single-product #specifications table th,
    body.single-product .product-specifications table th,
    body.single-product .specifications-table th,
    body.single-product table[class*="spec"] th {
        min-width: 8.5rem;
    }
}

@media (min-width: 1600px) {
    body.single-product #thong-so table,
    body.single-product #specifications table,
    body.single-product .product-specifications table,
    body.single-product .specifications-table,
    body.single-product table[class*="spec"] {
        font-size: 1rem;
        line-height: 1.7;
    }
}
