/*
Theme Name: Flatsome Child
Description: Child theme Shop In Tại Nhà 24h (demo). MỘT hệ thống style, viết lại 19/10/2026 theo số đo vinaly.vn (xem 03-trien-khai/DO-VINALY.md).
Author: Halo Media
Template: flatsome
Version: 5.0
*/

/* =====================================================================
   MỤC LỤC  1 Token · 2 Nền · 3 Bố cục · 4 Thanh trên & header · 5 Nút · 6 Form
   7 Tiêu đề section · 8 Thẻ sản phẩm & danh mục · 9 Trang danh mục · 10 Trang sản phẩm
   11 Tin tức · 12 Chân trang · 13 Khối trang chủ · 14 Nội dung SEO (gập) · 15 Nút liên hệ nổi
   16 Chuyển động · 17 Mobile · 18 Truy cập
   Quy tắc: mọi màu, cỡ chữ, khoảng cách, góc bo lấy từ token mục 1. Mỗi thành phần chỉ viết MỘT nơi.
   ===================================================================== */

/* ---------- 1. TOKEN ---------- */
:root {
	/* màu (thương hiệu tạm, đổi ở đây khi khách chốt) */
	--iq-brand: #156953;       /* màu chủ theo inantainha24h.com (xanh lá); trắng trên nền này đạt 6,6:1 */
	--iq-brand-dark: #0F4F3E;
	--iq-hi: #1A8065;          /* chữ lớn nhấn từ khóa */
	--iq-yellow: #FFD21F;      /* nhấn vàng của web liên kết (gạch chân từ khóa, nhãn) */
	--iq-dark: #0F4F3E;        /* thanh trên, khối báo giá, chân trang dưới */
	--iq-ink: #17332C;         /* tiêu đề */
	--iq-text: #33433E;       /* đậm hơn (25/10) */
	--iq-muted: #55645E;
	--iq-bg: #FFFFFF;
	--iq-cream: #E1F1EA;       /* chip icon, nền nhấn (xanh lá nhạt) */
	--iq-cream-soft: #F2F8F5;  /* nền khối xen kẽ */
	--iq-media: #F1F6F3;       /* nền khung ảnh sản phẩm */
	--iq-line: #DDE9E3;        /* nét 1px */
	/* chữ */
	--iq-font: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
	--iq-font-head: "Raleway", "Manrope", system-ui, sans-serif;
	--iq-fs-h1: clamp(2.1rem, 4.2vw, 3.1rem);
	--iq-fs-h2: clamp(1.6rem, 2.8vw, 2.2rem);
	--iq-fs-h3: 1.25rem;
	--iq-fs-body: 1.0625rem;  /* 17px */
	--iq-fs-sm: .9375rem;
	--iq-fs-xs: .8125rem;
	/* khoảng cách theo nhịp 8px */
	--iq-s1: 8px; --iq-s2: 16px; --iq-s3: 24px; --iq-s4: 32px; --iq-s6: 48px; --iq-s8: 64px;
	/* hình khối */
	--iq-r-sm: 8px; --iq-r: 12px; --iq-r-lg: 20px; --iq-r-pill: 999px;
	--iq-shadow-1: 0 1px 2px rgba(23,51,44,.05);
	--iq-shadow-2: 0 14px 34px rgba(23,51,44,.10);
	/* chuyển động */
	--iq-ease: cubic-bezier(.22,.61,.36,1); --iq-t: .25s;
	--iq-h-main: 72px; --iq-h-cats: 46px;
}

/* ---------- 2. NỀN ---------- */
html { scroll-behavior: smooth; }
html body { font-family: var(--iq-font); font-size: var(--iq-fs-body); font-weight: 500; line-height: 1.65; color: var(--iq-text); background: var(--iq-bg); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
html body h1, html body h2, html body h3, html body h4, html body h5, html body h6, html body .section-title-main, html body .entry-title, html body .product-title { font-family: var(--iq-font-head); color: var(--iq-ink); letter-spacing: -.01em; text-transform: none; text-wrap: balance; }
html body h1 { font-size: var(--iq-fs-h1); font-weight: 700; line-height: 1.12; }
html body h2 { font-size: var(--iq-fs-h2); font-weight: 700; line-height: 1.25; }
html body h3 { font-size: var(--iq-fs-h3); font-weight: 700; line-height: 1.35; }
html body h4, html body h5, html body h6 { font-size: var(--iq-fs-body); font-weight: 700; line-height: 1.4; }
html body strong, html body b { font-weight: 800; }
p { margin-bottom: var(--iq-s2); text-wrap: pretty; }
a { color: var(--iq-brand); transition: color var(--iq-t) var(--iq-ease); }
a:hover { color: var(--iq-brand-dark); }
::selection { background: var(--iq-cream); color: var(--iq-ink); }
:focus-visible { outline: 2px solid var(--iq-brand); outline-offset: 3px; }
.is-divider { background: var(--iq-brand); height: 2px; max-width: 40px; opacity: 1; }

/* ---------- 3. BỐ CỤC ---------- */
.section { padding-top: var(--iq-s8); padding-bottom: var(--iq-s8); }
.page-wrapper { padding-top: var(--iq-s4); padding-bottom: var(--iq-s6); }
.row-main, .container { max-width: 1250px; }

/* ---------- 4. THANH TRÊN & HEADER ---------- */
#top-bar { background: var(--iq-dark); min-height: 34px; }
#top-bar, #top-bar * { color: #fff; opacity: 1; font-size: 13.5px; font-weight: 600; letter-spacing: .02em; }
/* thanh trên theo inantainha24h.com (25/10): địa chỉ · email · điện thoại bên trái, mạng xã hội bên phải */
#top-bar .iq-tb { display: flex; flex-wrap: wrap; align-items: center; gap: 0; margin: 0; text-transform: uppercase; }
#top-bar .iq-tb a { display: inline-flex; align-items: center; gap: 6px; padding: 0 14px; border-left: 1px solid rgba(255,255,255,.25); }
#top-bar .iq-tb a:first-child { padding-left: 0; border-left: 0; }
#top-bar .iq-tb i { font-size: 15px; }
#top-bar .iq-tb a:hover, #top-bar .social-icons a:hover { color: var(--iq-yellow); }
#top-bar .social-icons a { padding: 0 6px; font-size: 15px; }
#header .header-main { height: var(--iq-h-main); background: var(--iq-bg); }
#header .header-inner { max-width: 1250px; padding-left: 15px; padding-right: 15px; }
#logo img { max-height: 44px; width: auto; }
#header .nav > li > a { position: relative; font-family: var(--iq-font); font-weight: 700; color: var(--iq-ink); letter-spacing: 0; text-transform: none; transition: color var(--iq-t) var(--iq-ease); }
#header .nav > li > a:hover, #header .nav > li.active > a, #header .nav > li.current-menu-item > a { color: var(--iq-brand); }
/* menu chính có icon: icon trên, chữ dưới */
#header .header-main .nav > li > a.nav-top-link { display: flex; flex-direction: column; align-items: center; gap: 3px; padding: 6px 14px; font-size: 14px; line-height: 1.2; white-space: nowrap; }
#header .header-main .nav > li > a .ux-menu-icon { width: 24px; height: 24px; margin: 0; max-width: none; transition: transform var(--iq-t) var(--iq-ease); }
#header .header-main .nav > li > a:hover .ux-menu-icon { transform: translateY(-2px); }
#header .nav > li > a::after { content: ""; position: absolute; left: var(--iq-s2); right: var(--iq-s2); bottom: -2px; height: 2px; background: var(--iq-brand); transform: scaleX(0); transform-origin: left; transition: transform var(--iq-t) var(--iq-ease); }
#header .nav > li > a:hover::after, #header .nav > li.active > a::after, #header .nav > li.current-menu-item > a::after { transform: scaleX(1); }
/* ô tìm kiếm viên thuốc */
#header .header-search-form .searchform .flex-row { background: #fff; border: 1px solid var(--iq-line); border-radius: var(--iq-r-pill); overflow: hidden; transition: border-color var(--iq-t) var(--iq-ease), box-shadow var(--iq-t) var(--iq-ease); }
#header .header-search-form .searchform .flex-row:focus-within { border-color: var(--iq-brand); box-shadow: 0 0 0 3px var(--iq-cream); }
#header .header-search-form input[type=search] { height: 42px; min-width: 260px; padding: 0 var(--iq-s2) 0 var(--iq-s3); border: 0; background: transparent; box-shadow: none; font-size: var(--iq-fs-sm); }
#header .header-search-form .ux-search-submit { height: 42px; width: 44px; background: transparent; color: var(--iq-ink); box-shadow: none; }
/* hàng danh mục */
#header .header-bottom { min-height: var(--iq-h-cats); background: var(--iq-bg); border-top: 1px solid var(--iq-line); border-bottom: 1px solid var(--iq-line); }
#header .header-bottom .nav > li > a { padding: 0 12px; font-size: 15px; font-weight: 700; color: var(--iq-ink); white-space: nowrap; }
#header .header-bottom .nav { flex-wrap: nowrap; }
@media (min-width: 850px) and (max-width: 1199px) { #header .header-main .nav > li > a.nav-top-link { padding: 6px 8px; font-size: 13px; } #header .header-search-form input[type=search] { min-width: 170px; } #header .header-bottom .nav > li > a { padding: 0 7px; font-size: 13.5px; } }
#header .header-bottom .nav > li > a:hover, #header .header-bottom .nav > li.active > a { color: var(--iq-brand); }
#header .header-bottom .nav > li > a::after { bottom: 0; }
.nav-dropdown { padding: var(--iq-s1) 0; border: 1px solid var(--iq-line); border-radius: var(--iq-r); box-shadow: var(--iq-shadow-2); }
.nav-dropdown > li > a { padding: 10px var(--iq-s3); font-size: 15px; font-weight: 600; color: var(--iq-text); transition: color var(--iq-t) var(--iq-ease), background var(--iq-t) var(--iq-ease), padding var(--iq-t) var(--iq-ease); }
.nav-dropdown > li > a:hover { color: var(--iq-brand); background: var(--iq-cream-soft); padding-left: calc(var(--iq-s3) + 4px); }
#header.header.has-sticky .header-wrapper.stuck .header-main { box-shadow: 0 6px 20px rgba(23,51,44,.08); }
/* menu mobile (ngăn kéo) */
#main-menu.mobile-sidebar .nav > li > a { padding: 14px var(--iq-s2); min-height: 48px; font-size: 15px; font-weight: 600; color: var(--iq-ink); }
#main-menu.mobile-sidebar .nav > li > a:hover { color: var(--iq-brand); }
#main-menu.mobile-sidebar .nav-sidebar > li { border-color: var(--iq-line); }

/* ---------- 5. NÚT ---------- */
.button, button.button, input[type=submit] { font-family: var(--iq-font); font-weight: 700; letter-spacing: .03em; text-transform: uppercase; border-radius: var(--iq-r-pill); box-shadow: none; transition: background var(--iq-t) var(--iq-ease), color var(--iq-t) var(--iq-ease), border-color var(--iq-t) var(--iq-ease), transform var(--iq-t) var(--iq-ease), box-shadow var(--iq-t) var(--iq-ease); }
.button:not(.is-small), input[type=submit] { min-height: 46px; line-height: 44px; padding: 0 var(--iq-s4); font-size: 13px; margin-right: var(--iq-s1); }
.button.is-small { min-height: 38px; line-height: 36px; padding: 0 var(--iq-s3); font-size: 12px; }
.button.primary, .button.secondary, input[type=submit] { background: var(--iq-brand); border-color: var(--iq-brand); color: #fff; }
.button.primary:hover, .button.secondary:hover, input[type=submit]:hover { background: var(--iq-brand-dark); border-color: var(--iq-brand-dark); color: #fff; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(21,105,83,.28); }
.button:active { transform: translateY(0); box-shadow: none; }
.button.is-outline { background: transparent; border: 2px solid currentColor; line-height: 42px; }
.button.is-outline.primary, .button.is-outline.secondary { color: var(--iq-brand); border-color: var(--iq-brand); background: transparent; }
.button.is-outline.primary:hover, .button.is-outline.secondary:hover { background: var(--iq-brand); color: #fff; }
.button.white.is-outline { color: #fff; border-color: rgba(255,255,255,.7); }
.button.white.is-outline:hover { background: #fff; color: var(--iq-ink); border-color: #fff; box-shadow: none; }
#header .header-button .button { min-height: 42px; line-height: 40px; padding: 0 var(--iq-s3); font-size: 12px; }

/* ---------- 6. FORM ---------- */
input[type=text], input[type=email], input[type=tel], input[type=search], input[type=number], input[type=password], input[type=url], select, textarea { font-family: var(--iq-font); font-size: var(--iq-fs-body); color: var(--iq-ink); background: #fff; border: 1px solid var(--iq-line); border-radius: var(--iq-r-sm); box-shadow: none; min-height: 46px; transition: border-color var(--iq-t) var(--iq-ease), box-shadow var(--iq-t) var(--iq-ease); }
textarea { min-height: 140px; padding: 12px var(--iq-s2); }
input:focus, select:focus, textarea:focus { border-color: var(--iq-brand); box-shadow: 0 0 0 3px var(--iq-cream); outline: 0; }
::placeholder { color: var(--iq-muted); opacity: 1; }
.wpcf7 label { display: block; margin-bottom: var(--iq-s2); font-size: var(--iq-fs-sm); font-weight: 600; color: var(--iq-ink); }
.wpcf7 label input, .wpcf7 label textarea { margin-top: 6px; margin-bottom: 0; font-weight: 400; }
.wpcf7-not-valid-tip { margin-top: 4px; font-size: var(--iq-fs-sm); }
.wpcf7-response-output { margin: var(--iq-s2) 0 0; padding: var(--iq-s2); border-radius: var(--iq-r-sm); font-size: var(--iq-fs-sm); }

/* ---------- 7. TIÊU ĐỀ SECTION (căn giữa, nhãn nhỏ phía trên) ---------- */
.iq-eyebrow, .iq-eyebrow p { margin: 0 0 var(--iq-s1); font-size: var(--iq-fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--iq-brand); text-align: center; }
.section-title-container { margin-bottom: var(--iq-s4); }
.section-title { display: flex; justify-content: center; text-align: center; }
.section-title b { display: none; }
.section-title-main, .section-title span { font-family: var(--iq-font-head); font-size: var(--iq-fs-h2); font-weight: 500; letter-spacing: -.01em; text-transform: none; color: var(--iq-ink); }
.iq-sub, .iq-sub p { max-width: 640px; margin: 0 auto var(--iq-s4); padding: 0 var(--iq-s2); text-align: center; font-size: 15px; color: var(--iq-muted); }
.iq-more { text-align: center; margin-top: var(--iq-s4); }

/* ---------- 8. THẺ SẢN PHẨM & DANH MỤC ---------- */
.product-small.col { display: flex; }
.product-small .col-inner { display: flex; flex-direction: column; width: 100%; height: 100%; background: #fff; border: 1px solid var(--iq-line); border-radius: var(--iq-r); overflow: hidden; box-shadow: var(--iq-shadow-1); transition: box-shadow var(--iq-t) var(--iq-ease), transform var(--iq-t) var(--iq-ease), border-color var(--iq-t) var(--iq-ease); }
.product-small .col-inner:hover { border-color: transparent; box-shadow: var(--iq-shadow-2); transform: translateY(-4px); }
.product-small .box { display: flex; flex-direction: column; flex: 1; }
.product-small .box-image { aspect-ratio: 1 / 1; background: var(--iq-media); }
.product-small .box-image .image-fade_in_back, .product-small .box-image .image-zoom, .product-small .box-image a { display: block; width: 100%; height: 100%; }
.product-small .box-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--iq-ease); }
.product-small:hover .box-image img { transform: scale(1.05); }
.product-small .box-text { display: flex; flex-direction: column; flex: 1; padding: var(--iq-s2); text-align: left; }
.product-small .title-wrapper { flex: 1; }
.product-small .box-text .category, .product-small .box-text .category a { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--iq-muted); }
.product-small .name a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 2.8em; font-family: var(--iq-font); font-size: 16px; font-weight: 700; line-height: 1.4; color: var(--iq-ink); transition: color var(--iq-t) var(--iq-ease); }
.product-small .name a:hover { color: var(--iq-brand); }
.product-small .price-wrapper { margin-top: var(--iq-s1); }
html body .product-small .name a, html body .product-small .name a:visited { font-weight: 700; }
.home .products.row { justify-content: center; }
.price, .price .amount, .woocommerce-Price-amount { color: var(--iq-brand); font-family: var(--iq-font); font-size: 1.2rem; font-weight: 800; letter-spacing: -.01em; }
.price .woocommerce-Price-currencySymbol { font-size: .75em; font-weight: 600; }
.price del, .price del .amount { color: var(--iq-muted); font-size: .85em; font-weight: 500; }
.price ins { text-decoration: none; }
.price ins .amount { color: #D0011B; }
/* nhãn giảm giá -x% (Flatsome: Tùy biến > WooCommerce > Product Card > "Sale bubble" chọn phần trăm) */
.badge-container .badge-inner.on-sale, .badge-inner.on-sale { background: #D0011B; color: #fff; border-radius: var(--iq-r-pill); font-weight: 800; }
/* ô danh mục */
.box-category .col-inner { transition: transform var(--iq-t) var(--iq-ease); }
.box-category:hover .col-inner { transform: translateY(-4px); }
.box-category .box-image { aspect-ratio: 1 / 1; background: var(--iq-media); border-radius: var(--iq-r-lg); overflow: hidden; border: 1px solid var(--iq-line); }
.box-category .box-image .image-cover { width: 100%; padding-top: 100% !important; }
.box-category .box-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--iq-ease); }
.box-category:hover .box-image img { transform: scale(1.06); }
.box-category .box-text { padding: var(--iq-s2) 0 0; text-align: center; }
.box-category .header-title { font-family: var(--iq-font); font-size: 15px; font-weight: 600; text-transform: none; letter-spacing: 0; color: var(--iq-ink); line-height: 1.35; }

/* ---------- 9. TRANG DANH MỤC: tiêu đề, sidebar, sắp xếp, phân trang ---------- */
.shop-page-title, .page-title { background: var(--iq-cream-soft); border-bottom: 1px solid var(--iq-line); }
.page-title-inner { min-height: 0; padding: var(--iq-s2) 0; }
.woocommerce-breadcrumb, .breadcrumbs { font-size: var(--iq-fs-sm); font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--iq-muted); }
.woocommerce-breadcrumb a, .breadcrumbs a { color: var(--iq-muted); }
.woocommerce-breadcrumb a:hover { color: var(--iq-brand); }
.woocommerce-result-count, .woocommerce-ordering select { font-size: var(--iq-fs-sm); color: var(--iq-muted); }
.woocommerce-ordering select { border-radius: var(--iq-r-pill); padding: 0 var(--iq-s3) 0 var(--iq-s2); }
.widget { margin-bottom: var(--iq-s4); }
.widget .widget-title, .widget > span.widget-title { display: block; margin-bottom: var(--iq-s2); font-size: var(--iq-fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--iq-brand); }
.widget + .is-divider, .widget-title + .is-divider { display: none; }
.widget_product_categories ul.product-categories > li { border-bottom: 1px solid var(--iq-line); }
.widget_product_categories ul.product-categories li a { display: flex; align-items: center; min-height: 46px; font-size: 15px; font-weight: 600; color: var(--iq-ink); transition: color var(--iq-t) var(--iq-ease), padding var(--iq-t) var(--iq-ease); }
.widget_product_categories ul.product-categories li a:hover { color: var(--iq-brand); padding-left: 4px; }
.widget_product_categories li.current-cat > a { color: var(--iq-brand); }
.widget_product_categories ul.children { margin: 0 0 var(--iq-s1) var(--iq-s2); padding-left: var(--iq-s2); border-left: 2px solid var(--iq-cream); }
.widget_product_categories ul.children li a { min-height: 38px; font-size: var(--iq-fs-sm); font-weight: 500; color: var(--iq-muted); }
.widget_search input[type=search] { border-radius: var(--iq-r-pill); }
.page-numbers li .page-number { min-width: 42px; height: 42px; line-height: 40px; border: 1px solid var(--iq-line); border-radius: var(--iq-r-pill); box-shadow: none; font-size: 14px; font-weight: 600; color: var(--iq-text); transition: all var(--iq-t) var(--iq-ease); }
.page-numbers li .page-number.current, .page-numbers li .page-number:hover { background: var(--iq-brand); border-color: var(--iq-brand); color: #fff; }

/* ---------- 10. TRANG SẢN PHẨM ---------- */
.single-product .next-prev-thumbs, .product-info .social-icons { display: none !important; }
.product-info .woocommerce-breadcrumb { margin-bottom: var(--iq-s1); }
.product-info .price-wrapper .price, .product-info .price .amount { font-size: 2rem; font-weight: 700; }
.product-info .product-short-description { color: var(--iq-text); }
.product-info .product_meta { font-size: var(--iq-fs-sm); color: var(--iq-muted); }
.product-gallery .woocommerce-product-gallery__image { background: var(--iq-media); border-radius: var(--iq-r-lg); overflow: hidden; border: 1px solid var(--iq-line); }
.product-info .product-title { font-size: clamp(1.6rem, 2.6vw, 2.1rem); font-weight: 700; line-height: 1.25; }
/* lưu ý + 3 ý ngắn thay khối nút đặt hàng (giống levushop, 25/10) */
.iq-note { margin: var(--iq-s3) 0 var(--iq-s2); padding: 12px var(--iq-s2); background: var(--iq-cream-soft); border: 1px solid var(--iq-line); border-radius: var(--iq-r); font-size: var(--iq-fs-sm); font-style: italic; line-height: 1.6; }
.iq-note a { font-weight: 800; font-style: normal; }
.iq-checks { margin: 0 0 var(--iq-s3); padding: 0; list-style: none; }
.iq-checks li { position: relative; margin: 0; padding: 9px 0 9px 28px; border-bottom: 1px dashed var(--iq-line); font-size: var(--iq-fs-sm); }
.iq-checks li::before { content: ""; position: absolute; left: 4px; top: 13px; width: 12px; height: 7px; border-left: 3px solid var(--iq-brand); border-bottom: 3px solid var(--iq-brand); transform: rotate(-45deg); }
/* ảnh: thư viện dọc bên trái (Tùy biến > WooCommerce > Product Page > Image style: Vertical) */
.product-gallery .vertical-thumbnails .col { padding-bottom: var(--iq-s1); }
.product-gallery .product-thumbnails img, .product-gallery .vertical-thumbnails img { border: 1px solid var(--iq-line); border-radius: var(--iq-r-sm); opacity: .7; transition: opacity var(--iq-t) var(--iq-ease), border-color var(--iq-t) var(--iq-ease); }
.product-gallery .product-thumbnails .is-nav-selected img, .product-gallery .product-thumbnails a:hover img { opacity: 1; border-color: var(--iq-brand); }
/* Mô tả + Có thể bạn thích */
.iq-pdesc { margin-top: var(--iq-s4); padding-top: var(--iq-s3); border-top: 1px solid var(--iq-line); }
.iq-pdesc__title { margin: 0 0 var(--iq-s2); font-size: var(--iq-fs-sm) !important; font-weight: 800 !important; letter-spacing: .1em; text-transform: uppercase !important; color: var(--iq-ink); }
.iq-like { padding: var(--iq-s2); border: 1px solid var(--iq-line); border-radius: var(--iq-r); }
.iq-like__item { display: flex; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--iq-line); color: var(--iq-ink); }
.iq-like__item:last-child { border-bottom: 0; }
.iq-like__item img { flex: 0 0 64px; width: 64px; height: 64px; object-fit: cover; border-radius: var(--iq-r-sm); background: var(--iq-media); }
.iq-like__body { display: flex; flex-direction: column; gap: 2px; }
.iq-like__name { font-size: 14.5px; font-weight: 700; line-height: 1.35; }
.iq-like__item:hover .iq-like__name { color: var(--iq-brand); }
.iq-like .price, .iq-like .price .amount { font-size: 15px; }
.woocommerce-tabs .nav-line > li > a, .tabbed-content .nav > li > a { padding: var(--iq-s2) 0; font-size: var(--iq-fs-xs); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--iq-muted); }
.woocommerce-tabs .nav-line > li.active > a, .tabbed-content .nav > li.active > a { color: var(--iq-ink); border-color: var(--iq-brand); }
.woocommerce-Tabs-panel { line-height: 1.8; }
.related-products-wrapper .product-section-title, .up-sells .product-section-title { font-family: var(--iq-font-head); font-size: var(--iq-fs-h2); font-weight: 500; letter-spacing: -.01em; text-transform: none; color: var(--iq-ink); }

/* ---------- 11. TIN TỨC ---------- */
.box-blog-post .box-image { border-radius: var(--iq-r-lg); overflow: hidden; }
.box-blog-post .box-image img { transition: transform .6s var(--iq-ease); }
.box-blog-post:hover .box-image img { transform: scale(1.04); }
.box-blog-post .box-text { padding: var(--iq-s2) 0 0; text-align: left; }
.box-blog-post .post-title { font-size: var(--iq-fs-h3); font-weight: 600; line-height: 1.4; color: var(--iq-ink); }
.box-blog-post .is-divider { display: none; }
.box-blog-post .from_the_blog_excerpt { font-size: var(--iq-fs-sm); color: var(--iq-muted); }
.badge.post-date .badge-inner { border-radius: var(--iq-r-sm); background: #fff; color: var(--iq-brand); border: 1px solid var(--iq-line); }
.entry-title { font-size: var(--iq-fs-h1); font-weight: 400; line-height: 1.15; }
.entry-content { line-height: 1.85; }
.entry-meta, .entry-meta a, .posted-on, .byline, .entry-category a { font-size: var(--iq-fs-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--iq-muted); }

/* ---------- 12. CHÂN TRANG (theo inantainha24h.com, khách chốt 25/10) ---------- */
.footer-wrapper .section.iq-footer { padding-top: var(--iq-s6); padding-bottom: var(--iq-s4); }
.iq-footer, .iq-footer p, .iq-footer li { color: #fff; }
.iq-footer h3 { margin: 0 0 var(--iq-s2); font-family: var(--iq-font-head); font-size: 1.35rem; font-weight: 800; letter-spacing: .01em; text-transform: uppercase; color: #fff; }
.iq-footer p { margin: 0; font-size: 15px; font-weight: 700; line-height: 2; }
.iq-info p + p + p::before, .iq-links p::before, .iq-footer .ux-menu-link__link::before { content: ">>>"; margin-right: 6px; font-weight: 800; }
.iq-footer a { color: var(--iq-yellow); word-break: break-word; }
.iq-footer a:hover { color: #fff; }
.iq-footer .ux-menu-link { border: 0; }
.iq-footer .ux-menu-link__link { display: flex; align-items: center; min-height: 34px; font-size: 16.5px; font-weight: 600; color: #fff; transition: color var(--iq-t) var(--iq-ease), padding var(--iq-t) var(--iq-ease); }
.iq-footer .ux-menu-link__link:hover { color: var(--iq-yellow); padding-left: 4px; }
.absolute-footer, .absolute-footer.dark { padding: var(--iq-s2) 0; background: var(--iq-hi); border-top: 0; font-size: 12.5px; }
.absolute-footer, .absolute-footer span, .absolute-footer .copyright-footer, .absolute-footer a { color: rgba(255,255,255,.85) !important; }
.absolute-footer strong { color: var(--iq-yellow) !important; }
.absolute-footer .container { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.absolute-footer .footer-primary, .absolute-footer .footer-secondary { float: none; margin: 0; padding: 0; }
.absolute-footer .footer-nav { text-transform: uppercase; }
.absolute-footer .footer-nav a { font-size: 12px; font-weight: 600; letter-spacing: .02em; }

/* ---------- 13. KHỐI TRANG CHỦ ---------- */
.iq-hero :is(h1, h2) { margin: 0 0 var(--iq-s2); }
.iq-hero :is(h1, h2) strong { color: var(--iq-hi); font-weight: 400; background: linear-gradient(transparent 68%, rgba(255,210,31,.55) 68%, rgba(255,210,31,.55) 92%, transparent 92%); padding: 0 .08em; }
.iq-hero .iq-eyebrow, .iq-hero .iq-eyebrow p { text-align: left; }
.iq-hero p { max-width: 34em; font-size: 1.0625rem; }
.iq-hero-img img { border-radius: var(--iq-r-lg); box-shadow: var(--iq-shadow-2); }
/* hàng thẻ đều chiều cao */
.iq-cards { display: flex; flex-wrap: wrap; }
.iq-cards > .col { display: flex; }
.iq-cards > .col > .col-inner { width: 100%; }
/* thẻ lợi ích: chip icon cam nhạt phía trên */
.iq-benefit { width: 100%; text-align: left; padding: var(--iq-s4); background: #fff; border: 1px solid var(--iq-line); border-radius: var(--iq-r-lg); transition: box-shadow var(--iq-t) var(--iq-ease), transform var(--iq-t) var(--iq-ease), border-color var(--iq-t) var(--iq-ease); }
.iq-benefit:hover { transform: translateY(-4px); box-shadow: var(--iq-shadow-2); border-color: transparent; }
.iq-benefit .icon-box-img { float: none; display: flex; align-items: center; justify-content: center; width: 56px !important; height: 56px; margin: 0 0 var(--iq-s2) !important; background: var(--iq-cream); border-radius: var(--iq-r); }
.iq-benefit .icon-box-img img { width: 28px; height: 28px; }
.iq-benefit .icon-box-text h5 { margin: 0 0 var(--iq-s1); font-family: var(--iq-font-head); font-size: 1.25rem; font-weight: 600; text-transform: none; letter-spacing: -.01em; color: var(--iq-ink); }
.iq-benefit .icon-box-text p { margin: 0; font-size: 15px; line-height: 1.7; color: var(--iq-muted); }
/* 4 bước đặt hàng */
.iq-step { width: 100%; text-align: left; padding: var(--iq-s3); background: #fff; border: 1px solid var(--iq-line); border-radius: var(--iq-r-lg); transition: box-shadow var(--iq-t) var(--iq-ease), transform var(--iq-t) var(--iq-ease); }
.iq-step:hover { transform: translateY(-4px); box-shadow: var(--iq-shadow-2); }
.iq-step .icon-box-text h5 { margin: 0 0 6px; font-family: var(--iq-font-head); font-size: 1.125rem; font-weight: 700; text-transform: none; letter-spacing: -.01em; color: var(--iq-ink); }
.iq-step .icon-box-text p { margin: 0; font-size: 14.5px; color: var(--iq-muted); }
.iq-cta h2 { color: #fff; }
.iq-cta p { color: rgba(255,255,255,.82); }

/* ---------- 14. NỘI DUNG SEO (gập "Xem thêm", JS ở functions.php) ---------- */
.iq-seo { max-width: 860px; margin-left: auto; margin-right: auto; }
.iq-seo h2 { margin: var(--iq-s4) 0 var(--iq-s2); font-size: var(--iq-fs-h2); }
.iq-seo h2:first-child { margin-top: 0; }
.iq-seo h3 { margin: var(--iq-s3) 0 var(--iq-s1); font-size: var(--iq-fs-h3); }
.iq-seo p, .iq-seo li { font-size: var(--iq-fs-body); line-height: 1.85; color: var(--iq-text); }
.iq-seo ul { margin-bottom: var(--iq-s2); }
.iq-seo a { font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.archive.woocommerce .iq-seo { margin-top: var(--iq-s4); padding-top: var(--iq-s4); border-top: 1px solid var(--iq-line); }
.iq-seo__body { position: relative; }
.iq-seo.is-collapsible:not(.is-open) .iq-seo__body { max-height: 190px; overflow: hidden; }
.iq-seo.is-collapsible:not(.is-open) .iq-seo__body::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 5.5em; background: linear-gradient(to bottom, rgba(255,255,255,0), #fff 85%); pointer-events: none; }
.iq-seo__toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 46px; margin-top: var(--iq-s1); padding: 0 var(--iq-s3); background: transparent; border: 2px solid var(--iq-brand); border-radius: var(--iq-r-pill); font: inherit; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--iq-brand); cursor: pointer; transition: background var(--iq-t) var(--iq-ease), color var(--iq-t) var(--iq-ease); }
.iq-seo__toggle:hover { background: var(--iq-brand); color: #fff; }
.iq-seo__toggle::after { content: ""; width: 7px; height: 7px; margin-top: -3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform var(--iq-t) var(--iq-ease), margin var(--iq-t) var(--iq-ease); }
.iq-seo.is-open .iq-seo__toggle::after { margin-top: 3px; transform: rotate(-135deg); }

/* ---------- 15. NÚT LIÊN HỆ NỔI ---------- */
.iq-float { position: fixed; right: var(--iq-s2); bottom: var(--iq-s2); z-index: 90; display: flex; flex-direction: column; gap: var(--iq-s1); }
.iq-float__btn { display: flex; align-items: center; justify-content: center; width: 54px; height: 54px; border-radius: 50%; color: #fff; font-size: 13px; font-weight: 700; text-decoration: none; box-shadow: 0 6px 18px rgba(23,51,44,.28); transition: transform var(--iq-t) var(--iq-ease), box-shadow var(--iq-t) var(--iq-ease); }
.iq-float__btn:hover { transform: translateY(-3px) scale(1.05); color: #fff; box-shadow: 0 10px 24px rgba(23,51,44,.32); }
.iq-float__btn--zalo { background: #0068FF; }
.iq-float__btn--tel { background: var(--iq-brand); }

/* ---------- 16. CHUYỂN ĐỘNG (tinh tế, tôn trọng reduced-motion) ---------- */
[data-animate] { transition-timing-function: var(--iq-ease); }
.iq-float__btn--zalo { animation: iq-pulse 3.2s var(--iq-ease) 2s infinite; }
@keyframes iq-pulse { 0%, 100% { box-shadow: 0 6px 18px rgba(23,51,44,.28), 0 0 0 0 rgba(0,104,255,.35); } 55% { box-shadow: 0 6px 18px rgba(23,51,44,.28), 0 0 0 14px rgba(0,104,255,0); } }

/* ---------- 17. MOBILE ---------- */
@media (max-width: 849px) {
	:root { --iq-h-main: 60px; }
	.section { padding-top: var(--iq-s6); padding-bottom: var(--iq-s6); }
	#header .header-search-form input[type=search] { min-width: 0; }
	.iq-hero p { font-size: 1rem; }
}
@media (max-width: 549px) {
	html body h1 { font-size: 2rem; }
	.section { padding-top: var(--iq-s4); padding-bottom: var(--iq-s4); }
	.button:not(.is-small) { padding: 0 var(--iq-s3); }
	.iq-benefit, .iq-step { padding: var(--iq-s3); }
	.product-small .box-text { padding: 12px; }
	.product-small .name a { font-size: 15px; }
	.price, .price .amount { font-size: 1rem; }
	/* thanh liên hệ cố định dưới đáy màn hình */
	.iq-float { left: var(--iq-s2); right: var(--iq-s2); bottom: 12px; flex-direction: row; gap: var(--iq-s1); }
	.iq-float__btn { flex: 1; width: auto; height: 48px; border-radius: var(--iq-r-pill); font-size: 13px; letter-spacing: .04em; text-transform: uppercase; animation: none; }
	.iq-float__btn--zalo::after { content: " chat"; margin-left: 4px; font-weight: 500; text-transform: none; }
	.iq-float__btn--tel::after { content: " ngay"; margin-left: 4px; font-weight: 500; text-transform: none; }
	html body { padding-bottom: 72px; }
}

/* ---------- 18. TRUY CẬP ---------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
	[data-animate] { opacity: 1 !important; transform: none !important; }
}

/* ---------- 19. CẢM NHẬN KHÁCH HÀNG, CTA, WIDGET TƯ VẤN ---------- */
.iq-review { height: 100%; padding: var(--iq-s4); background: #fff; border: 1px solid var(--iq-line); border-radius: var(--iq-r-lg); transition: box-shadow var(--iq-t) var(--iq-ease), transform var(--iq-t) var(--iq-ease); }
.iq-review:hover { transform: translateY(-4px); box-shadow: var(--iq-shadow-2); }
.iq-review .testimonial-text, .iq-review .testimonial-text p { font-size: 15.5px; line-height: 1.75; font-style: normal; color: var(--iq-text); }
.iq-review .testimonial-meta { margin-top: var(--iq-s2); font-size: 14px; }
.iq-review .testimonial-name { font-weight: 700; color: var(--iq-ink); }
.iq-review .testimonial-company { color: var(--iq-muted); font-size: 12.5px; }
.iq-review .star-rating span:before { color: #E0A800; }
.widget_text { padding: var(--iq-s3); background: var(--iq-cream-soft); border: 1px solid var(--iq-line); border-radius: var(--iq-r-lg); }
.widget_text .widget-title { color: var(--iq-brand); }
.widget_text p { font-size: 14.5px; margin-bottom: var(--iq-s2); }
.widget_text .button { display: block; text-align: center; margin: 0; }
.woocommerce-tabs + .iq-cta-block, .single-product .section[class*=cta], .archive .section[class*=cta] { margin-top: var(--iq-s6); }
.archive .page-wrapper + .section, .single-product .page-wrapper { }
.widget_text .button { padding: 0 var(--iq-s2); white-space: normal; }
.iq-cards > .col > .col-inner { display: flex; flex-direction: column; }
.iq-cards .iq-review { flex: 1; }

/* ---------- 20. THANH TRƯỢT SẢN PHẨM / DANH MỤC (chuyển sang "row" trong UX Builder vẫn giữ kiểu) ---------- */
.slider-wrapper .product-small.col, .slider-wrapper .box-category.col { padding-bottom: var(--iq-s2); }
.slider-wrapper .flickity-prev-next-button { width: 44px; height: 44px; background: #fff; border: 1px solid var(--iq-line); border-radius: 50%; box-shadow: var(--iq-shadow-1); opacity: 1; transition: background var(--iq-t) var(--iq-ease), border-color var(--iq-t) var(--iq-ease); }
.slider-wrapper .flickity-prev-next-button:hover { background: var(--iq-brand); border-color: var(--iq-brand); }
.slider-wrapper .flickity-prev-next-button:hover .arrow { fill: #fff; }
.slider-wrapper .flickity-prev-next-button .arrow { fill: var(--iq-ink); }
.slider-wrapper .flickity-page-dots .dot { background: var(--iq-line); opacity: 1; }
.slider-wrapper .flickity-page-dots .dot.is-selected { background: var(--iq-brand); }

/* ---------- 21. HERO TRƯỢT ---------- */

.iq-hero .text-box :is(h1, h2) { margin: 0 0 var(--iq-s2); font-size: clamp(1.9rem, 3.2vw, 2.7rem); }
.iq-hero .text-box :is(h1, h2) strong { background-position: 0 100%; }
.iq-hero .text-box .iq-eyebrow, .iq-hero .text-box .iq-eyebrow p { text-align: left; }
.iq-hero .text-box p { margin-bottom: var(--iq-s2); font-size: 1rem; }
.iq-hero .flickity-page-dots { bottom: 16px; }
.iq-hero .flickity-page-dots .dot { background: #fff; opacity: .7; }
.iq-hero .flickity-page-dots .dot.is-selected { background: var(--iq-brand); opacity: 1; }
@media (max-width: 549px) {
	.iq-hero .text-box.banner-layer { margin-top: var(--iq-s3); }
	.iq-hero .text-box :is(h1, h2) { font-size: 1.55rem; line-height: 1.2; margin-bottom: var(--iq-s1); }
	.iq-hero .text-box .iq-sub, .iq-hero .text-box p:not(.iq-eyebrow) { display: none; }
	.iq-hero .text-box .iq-eyebrow p { display: block; }
	.iq-hero .text-box .button { min-height: 42px; line-height: 40px; padding: 0 var(--iq-s3); }
}
.iq-hero .text-box :is(h1, h2) strong { white-space: nowrap; box-decoration-break: clone; -webkit-box-decoration-break: clone; }
@media (max-width: 549px) { .iq-hero .text-box :is(h1, h2) strong { white-space: normal; } }
/* hero: ô chữ đồng bộ với thẻ (bo 20px, nét 1px, bóng nhẹ), tiêu đề cùng thang chữ */

.iq-hero .text-box :is(h1, h2) { font-size: clamp(1.75rem, 2.8vw, 2.4rem); line-height: 1.18; font-weight: 500; }
.iq-hero .text-box :is(h1, h2) strong { font-weight: 500; }
.iq-hero .text-box .button { margin-bottom: 0; }

/* hero: bo góc, viền, bóng đặt ĐÚNG lớp có nền (.text-box-content), lớp ngoài và lớp animation để trong suốt, không viền */
.iq-hero .text-box, .iq-hero .text-box > [data-animate] { border: 0; border-radius: 0; box-shadow: none; background: transparent; }
.iq-hero .text-box .text-box-content { border: 1px solid var(--iq-line); border-radius: var(--iq-r-lg); box-shadow: var(--iq-shadow-2); overflow: hidden; background-clip: padding-box; }
.iq-hero .text-box .text-box-content .text-box-bg, .iq-hero .text-box .text-box-content > .bg { border-radius: inherit; }
.iq-blog-title { margin: 0 0 var(--iq-s4); padding-top: var(--iq-s2); text-align: center; }

/* ---------- 22. Ô TÌM KIẾM TRONG SIDEBAR: một viên thuốc liền khối ---------- */
.widget_search .searchform .flex-row, .widget_product_search .searchform .flex-row { display: flex; align-items: stretch; border: 1px solid var(--iq-line); border-radius: var(--iq-r-pill); overflow: hidden; background: #fff; transition: border-color var(--iq-t) var(--iq-ease), box-shadow var(--iq-t) var(--iq-ease); }
.widget_search .searchform .flex-row:focus-within, .widget_product_search .searchform .flex-row:focus-within { border-color: var(--iq-brand); box-shadow: 0 0 0 3px var(--iq-cream); }
.widget_search .searchform input[type=search], .widget_product_search .searchform input[type=search] { border: 0; border-radius: 0; box-shadow: none; background: transparent; height: 46px; padding: 0 var(--iq-s2) 0 var(--iq-s3); margin: 0; }
.widget_search .searchform .flex-col:last-child, .widget_product_search .searchform .flex-col:last-child { display: flex; }
.widget_search .searchform button, .widget_product_search .searchform button { height: 46px; min-height: 46px; width: 52px; margin: 0; padding: 0; border: 0; border-radius: 0; background: var(--iq-brand); color: #fff; line-height: 1; }
.widget_search .searchform button:hover, .widget_product_search .searchform button:hover { background: var(--iq-brand-dark); transform: none; box-shadow: none; }
/* tiêu đề danh mục: bỏ đường kẻ ngang cắt qua chữ */
.shop-page-title .is-divider, .category-page-title .is-divider, .page-title .is-divider { display: none; }
.shop-page-title h1.shop-page-title, h1.shop-page-title { margin: 0 0 4px; font-size: var(--iq-fs-h2); font-weight: 500; line-height: 1.2; }
.shop-page-title .page-title-inner .flex-col:first-child { border: 0; }

/* ---------- 23. WIDGET SIDEBAR BLOG (dùng widget Flatsome Recent Posts + chuyên mục) ---------- */
.widget_flatsome_recent_posts ul, .is-recent-posts ul { margin: 0; padding: 0; list-style: none; }
.widget_flatsome_recent_posts li, .is-recent-posts li { display: flex; align-items: flex-start; gap: var(--iq-s2); margin: 0; padding: var(--iq-s2) 0; border-bottom: 1px solid var(--iq-line); }
.widget_flatsome_recent_posts li:first-child { padding-top: 0; }
.widget_flatsome_recent_posts li:last-child { border-bottom: 0; }
.widget_flatsome_recent_posts .badge, .widget_flatsome_recent_posts .badge-inner { flex: 0 0 72px; width: 72px; height: 72px; margin: 0; border: 0; border-radius: var(--iq-r); background-size: cover; background-position: center; background-color: var(--iq-media); }
.widget_flatsome_recent_posts .flatsome_recent_posts_text, .widget_flatsome_recent_posts .recent-blog-posts-text { flex: 1; min-width: 0; }
.widget_flatsome_recent_posts a.plain, .widget_flatsome_recent_posts li a { font-size: 14.5px; font-weight: 600; line-height: 1.45; color: var(--iq-ink); transition: color var(--iq-t) var(--iq-ease); }
.widget_flatsome_recent_posts li a:hover { color: var(--iq-brand); }
.widget_flatsome_recent_posts .post_comments, .widget_flatsome_recent_posts .post-date { font-size: var(--iq-fs-xs); color: var(--iq-muted); }
.widget_categories ul { margin: 0; padding: 0; list-style: none; }
.widget_categories li { margin: 0; border-bottom: 1px solid var(--iq-line); }
.widget_categories li:last-child { border-bottom: 0; }
.widget_categories li a { display: flex; align-items: center; justify-content: space-between; min-height: 44px; font-size: 15px; font-weight: 500; color: var(--iq-text); transition: color var(--iq-t) var(--iq-ease), padding var(--iq-t) var(--iq-ease); }
.widget_categories li a:hover { color: var(--iq-brand); padding-left: 4px; }
.blog-archive .is-divider, .widget .is-divider { display: none; }
.sidebar-inner .widget, .post-sidebar .widget { padding-bottom: var(--iq-s3); }
.widget_flatsome_recent_posts li { align-items: center; }
.widget_flatsome_recent_posts li > a, .widget_flatsome_recent_posts li a:not(.badge) { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.45; color: var(--iq-ink); }
.widget_flatsome_recent_posts li a:hover { color: var(--iq-brand); }
.post-sidebar { padding-left: var(--iq-s4); }
.single-post .entry-image img, .single-post .entry-image-attachment img { width: 100%; max-height: 460px; object-fit: cover; border-radius: var(--iq-r-lg); }

/* (24. khối nút đặt hàng ở trang sản phẩm: bỏ 25/10/2026 theo khách, xem mục 10) */