/*
 * Lớp đổi màu Cảm Nhận — nạp sau style.css chính (xem inc/feature-camnhan-skin.php).
 *
 * Bảng màu thương hiệu:
 * - Đỏ bordo chủ đạo: #6B0F1A (nền hero, nút, badge giảm giá, giá, link nhấn)
 * - Đỏ bordo đậm (hover): #4A0A12
 * - Đỏ bordo sáng, chỉ dùng cho chi tiết nhỏ trên nền tối để vẫn đọc được: #B03A44
 * - Xanh lá chè (điểm nhấn thứ hai): #2E5A3D, đậm hơn khi hover: #22452E
 * - Nền kem: #FDFBF7 (nền trang; thẻ nội dung giữ nền trắng như cũ)
 *
 * Quy tắc của file này:
 * - Chỉ đổi màu sắc và font-family của tiêu đề. Không đổi font-size,
 *   không đổi bố cục, không thêm class uppercase.
 * - font-family của tiêu đề dùng !important để thắng rule font của Flatsome
 *   và Kirki (Kirki in style sau file enqueue). Chỉ áp cho selector tiêu đề.
 * - !important cho màu chỉ dùng ở những chỗ rule gốc đã có !important hoặc
 *   in sau file này (style inline trong wp_head), và đã ghi chú rõ.
 * - Chữ tiếng Việt trong comment viết thường đầu câu.
 */

/* ---------- 1. Biến màu dùng chung ---------- */
:root {
    --primary-color: #6B0F1A;
    --primary-dark: #4A0A12;
    --primary-light: #7E1B27;
    --primary-soft: #F7E9EB;
    --price-color: #6B0F1A;
    --camnhan-green: #2E5A3D;
    --camnhan-green-dark: #22452E;
    --camnhan-cream: #FDFBF7;
    --camnhan-bordo-light: #B03A44;
    --lp-red: #6B0F1A;
    --lp-red-dark: #4A0A12;
    --lp-bg-alt: #FDFBF7;
}

.memip-toc {
    --toc-red: #6B0F1A;
    --toc-red-dark: #4A0A12;
}

.memip-home-news {
    --news-red: #6B0F1A;
    --news-red-dark: #4A0A12;
}

/* ---------- 2. Nền trang kem ---------- */
html body {
    background-color: #FDFBF7;
}

/* ---------- 3. Chữ tiêu đề dùng serif (giống chữ trong logo) ---------- */
body h1,
body .h1,
body h2,
body .h2,
body h3,
body .h3 {
    font-family: 'Noto Serif', Georgia, 'Times New Roman', serif !important;
}

body .banner h1,
body .hero h1,
body .banner h2,
body .hero h2,
body .section-title span,
body .section-title-main,
body .section-title-normal span,
body h3.product-section-title-related,
body .product-section-title-related,
body .entry-title,
body .entry-title a {
    font-family: 'Noto Serif', Georgia, 'Times New Roman', serif !important;
}

body .name.product-title,
body .name.product-title a,
body p.name.product-title,
body h1.product-title.product_title,
body .memip-cat-banner .memip-archive-title,
body .memip-finder h2,
body .memip-finder-card-title,
body .memip-dishes h2,
body .memip-promo-landing h2,
body .memip-promo-hot h2,
body .memip-promo-card-name,
body .memip-promo-grid-title,
body .memip-cat-desc__inner h2,
body .memip-cat-desc__inner h3,
body .memip-shorts .memip-shorts-title,
body .memip-toc__title,
body .memip-home-news__title,
body .memip-footer__brand-name,
body .memip-compare-page h1 {
    font-family: 'Noto Serif', Georgia, 'Times New Roman', serif !important;
}

/* ---------- 4. Khối hero đầu trang ---------- */
.memip-topwrap {
    background-color: #6B0F1A;
}

.memip-topwrap::after {
    background-image: linear-gradient(180deg, rgba(107, 15, 26, 0), #FDFBF7);
}

body.home section.section.dark:not(:has(.section-bg[style])):before {
    background-image: linear-gradient(135deg, #6B0F1A, #4A0A12);
}

/* ---------- 5. Giá tiền ---------- */
body span.amount {
    color: #6B0F1A;
}

body .col.product span.amount {
    color: #6B0F1A;
}

.sidebar-inner span.amount {
    color: #6B0F1A;
}

.product-info span.amount {
    color: #6B0F1A;
}

.widget_shopping_cart_content span.amount {
    color: #6B0F1A;
}

.memip-search-item-price {
    color: #6B0F1A;
}

.memip-compare-results .memip-compare-price,
.memip-compare-suggest .memip-compare-price,
.memip-compare-table .memip-compare-price {
    color: #6B0F1A;
}

.memip-side-price {
    color: #6B0F1A;
}

.memip-price-history-now strong {
    color: #6B0F1A;
}

.memip-finder-pprice {
    color: #6B0F1A;
}

.memip-shorts .memip-shorts-product-price {
    color: #6B0F1A;
}

.qka-search-suggestions .deal-price {
    color: #6B0F1A;
}

.memip-promo-tiles .memip-promo-tile-price {
    color: #6B0F1A;
}

/* ---------- 6. Badge giảm giá ---------- */
body .badge.onsale,
body .badge-container .onsale {
    background-color: #6B0F1A;
}

.memip-promo-badge {
    background: #6B0F1A;
}

.memip-mfilter__bar-cnt {
    background: #6B0F1A;
}

.memip-mfilter__group-cnt {
    background: #6B0F1A;
}

/* ---------- 7. Nút chính và nút kêu gọi ---------- */
.memip-promo-banner-btn {
    color: #6B0F1A;
}

.memip-promo-hot-btn {
    background: #6B0F1A;
}

.memip-promo-hot-btn:hover {
    background: #4A0A12;
}

.memip-promo-combo-btn {
    background: #6B0F1A;
}

.memip-promo-combo-btn:hover {
    background: #4A0A12;
}

.memip-finder-next {
    background: #6B0F1A;
}

.memip-finder-add {
    background: #6B0F1A;
}

.memip-search-footer a {
    background: #6B0F1A;
}

.memip-search-footer a:hover {
    background: #4A0A12;
}

/* Nút trượt banner in style inline trong nội dung, nên thêm tiền tố body để thắng. */
body .memip-slider-nav {
    color: #6B0F1A;
}

/* Popup tuổi in style inline trong chân trang, nên thêm tiền tố body để thắng. */
body .age-popup-inner h2 {
    color: #6B0F1A;
}

body .age-yes {
    background: #6B0F1A;
}

body .age-yes:hover {
    background: #4A0A12;
}

.mobile-search-btn {
    background: #6B0F1A;
}

.mobile-search-btn:hover {
    background: #4A0A12;
}

.phone-btn {
    background: #6B0F1A;
}

.phone-btn:hover {
    background: #4A0A12;
}

.float-phone {
    background-image: linear-gradient(135deg, #6B0F1A, #6B0F1A);
}

.fix-mobile {
    background: #6B0F1A;
}

.btn-contact-hotline {
    background-image: linear-gradient(135deg, #6B0F1A, #4A0A12) !important;
}

.btn-contact-hotline:hover {
    background-image: linear-gradient(135deg, #4A0A12, #36080E) !important;
}

.sale-countdown {
    background-image: linear-gradient(135deg, #6B0F1A, #8A2430);
}

.qka-main .qka-search-btn {
    background: #6B0F1A;
}

.qka-main .qka-search-btn:hover {
    background: #4A0A12;
}

.qka-main .qka-cart-badge {
    background: #6B0F1A;
}

.qka-main .qka-hotline-icon {
    background: #6B0F1A;
    border-color: #6B0F1A;
}

.qka-top-bar {
    background: #6B0F1A;
}

.qka-nav-bar {
    background: #6B0F1A !important;
}

#mega-menu-wrap {
    background: #6B0F1A;
}

ul#header-contact a,
li.cart-item > a {
    background: #6B0F1A;
}

#wide-nav .nav > li > a:hover {
    color: #6B0F1A;
}

#wide-nav .menu-item-icon {
    color: #6B0F1A;
}

.nav li.nav-icon a {
    color: #6B0F1A;
}

.menu-item.menu-item-promo > a {
    background: #6B0F1A !important;
}

.menu-item.menu-item-promo > a:hover {
    background: #4A0A12 !important;
}

.back-to-top.active {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.back-to-top.active i {
    color: #6B0F1A;
}

.memip-ph-btn:hover {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.memip-price-history-ranges button.active {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.memip-mfilter__apply {
    background: #6B0F1A;
}

.memip-mfilter__apply:active {
    background: #4A0A12;
}

/* Nút chính của WooCommerce và Flatsome (thêm vào giỏ, đặt hàng). */
body .button.primary,
body .button.alt,
body .woocommerce button.button.alt,
body .woocommerce a.button.alt,
body .woocommerce input.button.alt,
body .woocommerce #respond input#submit.alt,
body button.single_add_to_cart_button {
    background-color: #6B0F1A;
    border-color: #6B0F1A;
}

body .button.primary:hover,
body .button.alt:hover,
body .woocommerce button.button.alt:hover,
body .woocommerce a.button.alt:hover,
body .woocommerce input.button.alt:hover,
body .woocommerce #respond input#submit.alt:hover,
body button.single_add_to_cart_button:hover {
    background-color: #4A0A12;
    border-color: #4A0A12;
}

/* ---------- 8. Link nhấn, viền và tiêu đề nhấn ---------- */
.section-title-normal span {
    border-bottom-color: #6B0F1A;
    border-left-color: #6B0F1A;
}

.section-title-normal span:before {
    border-color: transparent transparent transparent #6B0F1A;
}

h3.product-section-title-related span {
    color: #6B0F1A;
}

h3.product-section-title-related span:after {
    background: #6B0F1A;
}

.product-header h5 {
    color: #6B0F1A;
}

.product-header h5:after {
    background: #6B0F1A;
}

.sidebar-inner span.widget-title {
    border-left-color: #6B0F1A;
}

.sidebar-inner span.widget-title:before,
.yith-wcan-filters .yith-wcan-filter h4:before {
    border-color: transparent transparent transparent #6B0F1A;
}

.widget_price_filter .ui-slider .ui-slider-range {
    background-color: #6B0F1A;
}

.widget_price_filter .ui-slider .ui-slider-handle {
    background-color: #6B0F1A;
}

#shop-sidebar .widget_price_filter .ui-slider .ui-slider-range {
    background: #6B0F1A;
}

#shop-sidebar .widget_price_filter .ui-slider .ui-slider-handle {
    background: #6B0F1A;
}

/* Tiêu đề khối lọc in style inline ở wp_head với !important, nên thêm
   tiền tố body (specificity cao hơn) và giữ !important để thắng. */
body #shop-sidebar .widget-title,
body #shop-sidebar .widgettitle {
    color: #6B0F1A !important;
    border-bottom-color: #6B0F1A !important;
}

.ux-swatch.selected {
    -webkit-box-shadow: 0 0 0 0.1rem #6B0F1A;
    box-shadow: 0 0 0 0.1rem #6B0F1A;
}

body #content .memip-post-tags__list a,
.memip-post-tags__list a {
    color: #6B0F1A;
}

.memip-post-tags__list a:hover {
    color: #6B0F1A;
    border-bottom-color: #6B0F1A;
}

.memip-related-posts__title span::before {
    background: #6B0F1A;
}

.memip-related-posts__title::after {
    background-image: linear-gradient(90deg, #6B0F1A 0%, rgba(107, 15, 26, 0) 100%);
}

.memip-related-card__title a:hover {
    color: #6B0F1A;
}

.memip-related-card__more {
    color: #6B0F1A;
}

.memip-related-card__more:hover {
    color: #4A0A12;
}

body .memip-cat-desc__inner a {
    color: #6B0F1A;
}

body .memip-cat-desc__inner a:hover {
    color: #4A0A12;
}

body .memip-cat-desc__toggle {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

body .memip-cat-desc__toggle:hover,
body .memip-cat-desc__toggle:focus-visible {
    background: #6B0F1A;
}

.memip-cat-banner .memip-cat-desc__toggle {
    background: #6B0F1A;
    border-color: #6B0F1A;
}

.memip-cat-banner .memip-cat-desc__toggle:hover,
.memip-cat-banner .memip-cat-desc__toggle:focus-visible {
    background: #4A0A12;
    border-color: #4A0A12;
}

.memip-chip:hover {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.memip-clear-filters a {
    color: #6B0F1A;
    border-color: #6B0F1A;
}

.memip-clear-filters a:hover {
    background: #6B0F1A;
}

.memip-finder-opt:hover {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.memip-finder-opt.selected {
    border-color: #6B0F1A;
    background: #6B0F1A;
}

.memip-finder-know button {
    color: #6B0F1A;
}

.memip-finder-resume button {
    color: #6B0F1A;
}

.memip-finder-skip button {
    color: #6B0F1A;
}

.memip-finder-bulk a {
    color: #6B0F1A;
}

.memip-finder-all {
    color: #6B0F1A;
}

.memip-finder-card:hover {
    border-color: #6B0F1A;
}

.memip-shorts .memip-shorts-more {
    color: #6B0F1A;
}

.memip-shorts .memip-shorts-more:hover {
    color: #4A0A12;
}

.memip-shorts .memip-shorts-product::after {
    color: #6B0F1A;
}

.memip-promo-tiles .memip-promo-tile-title {
    color: #6B0F1A;
}

.memip-promo-tiles .memip-promo-tile-btn {
    background: #6B0F1A;
}

.memip-promo-card:hover .memip-promo-card-name,
.memip-promo-card-name:hover {
    color: #6B0F1A;
}

.memip-promo-grid-title::after {
    background: #6B0F1A;
}

.memip-promo-criteria li::before {
    background: #6B0F1A;
}

.memip-promo-banner-offer {
    background-image: linear-gradient(135deg, #6B0F1A, #7E1B27);
}

.memip-bulk-table {
    background-image: linear-gradient(135deg, #4A0A12, #6B0F1A);
}

.single-post .entry-content table th,
.memip-cat-desc__inner table th {
    background: #6B0F1A;
}

.memip-cat-banner {
    background-image: linear-gradient(135deg, #3D0A0F, #6B0F1A);
}

.memip-compare-btn:hover {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.memip-compare-search:focus {
    border-color: #6B0F1A;
}

.memip-compare-suggest li a:hover {
    color: #6B0F1A;
}

.memip-compare-add:hover {
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.memip-ph-line {
    stroke: #6B0F1A;
}

.memip-price-history-chart circle {
    fill: #6B0F1A;
}

.qka-search-suggestions h4 {
    color: #6B0F1A;
}

.qka-search-suggestions .search-brands a:hover {
    color: #6B0F1A;
    border-color: #6B0F1A;
}

.qka-search-suggestions::-webkit-scrollbar-thumb {
    background: #6B0F1A;
}

.qka-main .qka-search-form {
    border-color: #6B0F1A;
}

.qka-main .qka-cart-link:hover {
    color: #6B0F1A;
}

.qka-main .qka-icon-circle {
    color: #6B0F1A;
}

.qka-main .qka-hotline-text strong {
    color: #6B0F1A;
}

.qka-main .qka-logo .qka-logo-text {
    color: #6B0F1A;
}

.mobile-sidebar .nav-sidebar > li.active > a {
    color: #6B0F1A !important;
}

.mobile-sidebar .nav-sidebar li.active > .toggle {
    color: #6B0F1A;
}

.mobile-sidebar .parent-link-back > button {
    color: #6B0F1A;
}

.mobile-sidebar .nav-sidebar .sub-menu li.active > button.nested-toggle,
.mobile-sidebar .nav-sidebar .children li.active > button.nested-toggle {
    color: #6B0F1A;
}

.mobile-sidebar .mobile-drawer-footer .hotline-row {
    color: #6B0F1A !important;
}

.mobile-sidebar .mobile-drawer-footer .badge-item i {
    color: #6B0F1A;
}

.mobile-sidebar .nav-sidebar .children > li > a:hover {
    color: #6B0F1A !important;
}

.memip-mfilter__bar-btn svg {
    color: #6B0F1A;
}

.memip-mfilter button.memip-mfilter__chip {
    background: #F7E9EB !important;
    color: #6B0F1A !important;
    border-color: #6B0F1A !important;
}

.memip-mfilter__clear {
    color: #6B0F1A;
}

.memip-mfilter__opt.is-checked {
    background: #F7E9EB;
    border-color: #6B0F1A;
    color: #6B0F1A;
}

.memip-mfilter__opt.is-checked .memip-mfilter__opt-cnt {
    color: #6B0F1A;
}

.col.product .process-bar,
.col.product .hot-deal .process-bar {
    color: #6B0F1A;
}

.col.product .deals-progress {
    background-image: linear-gradient(90deg, #D8A0A6, #6B0F1A);
}

.mobile-search-input {
    border-color: #6B0F1A;
}

.mobile-search-input:focus {
    border-color: #6B0F1A;
}

/* Chân trang: nền tối nên tên thương hiệu và gạch chân tiêu đề dùng đỏ
   bordo sáng để vẫn đọc được; các chi tiết còn lại dùng đỏ bordo. */
body .memip-footer__main {
    border-top-color: #6B0F1A;
}

body .memip-footer__brand-name {
    color: #B03A44;
}

body .memip-footer__trust-tick {
    background: #6B0F1A;
}

body .memip-footer__social-link:hover {
    background: #6B0F1A;
    border-color: #6B0F1A;
}

body .memip-footer__heading::after {
    background: #B03A44;
    color: #B03A44;
}

/* ============ 1.0.33: màu nền chân trang chọn trong Cài đặt chung (Hà 14/11) ============ */
/* Đen hẳn nặng và lạnh khi web có thêm chè. Mỗi lựa chọn đổi nền cả 3 tầng
   (chính, pháp lý, bản quyền) theo cùng một tông; chữ sáng giữ nguyên nên
   vẫn đọc được. Mặc định black = không đổi gì so với trước. */
body.cn-footer-tea .memip-footer__main {
    background: #24492F;
}
body.cn-footer-tea .memip-footer__legal {
    background: #1B3823;
}
body.cn-footer-tea .memip-footer__copyright {
    background: #122619;
}
body.cn-footer-bordo .memip-footer__main {
    background: #4A0A12;
    border-top-color: #B03A44;
}
body.cn-footer-bordo .memip-footer__legal {
    background: #380810;
}
body.cn-footer-bordo .memip-footer__copyright {
    background: #26060B;
}
body.cn-footer-brown .memip-footer__main {
    background: #2B1D16;
}
body.cn-footer-brown .memip-footer__legal {
    background: #201510;
}
body.cn-footer-brown .memip-footer__copyright {
    background: #150E0A;
}

/* ---------- 9. Xanh lá chè: điểm nhấn thứ hai ---------- */
body .button.secondary,
body a.button.secondary,
body .woocommerce a.button.secondary,
body .btn-secondary {
    color: #2E5A3D;
    border-color: #2E5A3D;
}

body .button.secondary:hover,
body a.button.secondary:hover,
body .woocommerce a.button.secondary:hover,
body .btn-secondary:hover {
    background-color: #2E5A3D;
    border-color: #2E5A3D;
    color: #fff;
}

/* Khối combo là khối thứ hai cạnh khối ưu đãi, dùng nền xanh lá để phân biệt. */
.memip-promo-banner-combo {
    background-image: linear-gradient(135deg, #22452E, #2E5A3D);
}

.memip-promo-banner-combo .memip-promo-banner-btn {
    background: #fff;
    color: #2E5A3D;
}

/* Nhãn chè: class mới để gắn cho sản phẩm hoặc khối về chè khi cần. */
.memip-badge-tra {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    background: #2E5A3D;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.6;
}

/* ---------- 10. Ảnh sản phẩm không cắt xén ---------- */
/* Flatsome cha hiển thị ảnh sản phẩm trong khung vuông (padding-top: 100%)
   với ảnh position absolute và object-fit: cover, nên ảnh chai bị cắt.
   Các rule dưới đây gỡ khung đó, chỉ trong phạm vi ảnh sản phẩm: lưới
   shop/danh mục, gallery trang chi tiết, related/upsell (cùng markup
   .col.product). Ảnh hero/banner giữ nguyên vì là khung thiết kế có chủ
   đích. Ảnh nhỏ cố định (gợi ý tìm kiếm, sidebar, Shorts) và ảnh danh
   mục tròn trang chủ giữ nguyên vì là ảnh xem trước, không phải ảnh
   sản phẩm chính. Xem nhanh (quick view), kết quả tìm dịp và bảng so
   sánh vốn đã hiện đủ ảnh, chỉ thêm object-fit: contain để chắc chắn. */

.col.product .box-image,
.col.product .product-small .box-image {
    overflow: visible;
}

.col.product .box-image .img,
.col.product .box-image .img-inner,
.col.product .product-small .box-image .img,
.col.product .product-small .box-image .img-inner {
    padding-top: 0 !important;
    height: auto !important;
    overflow: visible;
}

.col.product .box-image img:not(.back-image),
.col.product .box-image .img-inner img:not(.back-image),
.col.product .box-image .img img:not(.back-image),
.col.product .product-small .box-image img:not(.back-image) {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
}

/* Ảnh thứ hai khi rê chuột (nếu bật) vẫn phủ lên trên, nhưng hiện đủ ảnh. */
.col.product .box-image img.back-image {
    object-fit: contain !important;
}

/* Bỏ zoom khi rê chuột: zoom sẽ làm ảnh tràn khung và bị cắt mép. */
body .col.product:hover .box-image img {
    transform: none !important;
}

/* Gallery trang chi tiết sản phẩm: gỡ khung tỉ lệ, ảnh hiện đủ chiều cao thật. */
.single-product .product-images .img,
.single-product .product-images .img-inner,
.single-product .woocommerce-product-gallery .img,
.single-product .woocommerce-product-gallery .img-inner,
.single-product .product-gallery .img,
.single-product .product-gallery .img-inner {
    padding-top: 0 !important;
    height: auto !important;
    overflow: visible;
}

.single-product .product-images .img-inner img,
.single-product .product-images .img img,
.single-product .woocommerce-product-gallery .img-inner img,
.single-product .woocommerce-product-gallery .img img,
.single-product .product-gallery .img-inner img,
.single-product .product-gallery .img img,
.single-product .woocommerce-product-gallery__image img {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    object-fit: contain !important;
}

/* Ảnh nhỏ điều hướng trong gallery: giữ khung, chỉ đổi sang hiện đủ ảnh. */
.single-product .product-thumbnails img {
    object-fit: contain;
}

/* Xem nhanh, kết quả tìm dịp, bảng so sánh: đã hiện đủ ảnh, giữ chắc chắn. */
.qv-image img {
    object-fit: contain;
    max-height: none;
}

.memip-finder-product img {
    object-fit: contain;
    max-height: none;
}

.memip-compare-table th img {
    object-fit: contain;
}

/* ==========================================================================
   1.0.2 — Đồng bộ chiều rộng + màu sau đợt kiểm tra trang chủ 13/11/2026
   Đo thật trên trang: thân trang co 15px mỗi bên (nội dung 1200px), chân
   trang tràn full 1230px vì rule padding-0 ở style.css. Đặt lại padding
   15px cho chân trang để thẳng hàng với thân trang. Điện thoại: 4px như
   thân trang. Thanh chào mừng bị rule ID của Customizer đè thành xanh
   thép — thắng bằng selector có ID + !important. Ẩn thanh menu ngang
   trên điện thoại (dùng menu hamburger) và ẩn cột giới thiệu trống ở
   chân trang điện thoại (nó không có tiêu đề nên accordion để lại
   khoảng đen trống).
   ========================================================================== */
body div.memip-footer__container[class*="container"]:not(#x),
body div.memip-footer__legal-inner[class*="container"]:not(#x),
body div.memip-footer__copy-inner[class*="container"]:not(#x),
body div.memip-footer__main-inner[class*="container"]:not(#x) {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

body #top-bar.qka-top-bar {
    background: #6B0F1A !important;
}

@media (max-width: 849px) {
    #wide-nav.qka-nav-bar {
        display: none !important;
    }
}

@media (max-width: 767px) {
    body div.memip-footer__container[class*="container"]:not(#x),
    body div.memip-footer__legal-inner[class*="container"]:not(#x),
    body div.memip-footer__copy-inner[class*="container"]:not(#x),
    body div.memip-footer__main-inner[class*="container"]:not(#x) {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    body .memip-footer__col--about {
        display: none !important;
    }
}

/* ============ 1.0.3: icon điện thoại header + tiêu đề mục viết thường ============ */
/* Lỗi: quy tắc .qka-icon-circle { color: #6B0F1A } trong file này thắng màu trắng
   của .qka-hotline-icon (cùng độ ưu tiên, nạp sau) nên icon điện thoại màu đỏ
   rượu nằm trên nền đỏ rượu → nhìn như vòng tròn trống. Dùng chọn lọc 3 class
   để màu trắng luôn thắng. */
.qka-main .qka-icon-circle.qka-hotline-icon {
    color: #fff;
}

/* Vòng sáng nhấp nháy của icon hotline cũng đổi sang đỏ rượu cho đồng bộ. */
@keyframes qka-pulse {
    0% { box-shadow: 0 0 0 0 rgba(107, 15, 26, 0.6); }
    70% { box-shadow: 0 0 0 10px rgba(107, 15, 26, 0); }
    100% { box-shadow: 0 0 0 0 rgba(107, 15, 26, 0); }
}

/* Flatsome viết hoa toàn bộ tiêu đề mục (.section-title span). Nhà mình viết
   thường: chỉ viết hoa chữ đầu câu, nên tắt uppercase ở tiêu đề mục sản phẩm. */
.section-title-container .section-title span,
h3.section-title span {
    text-transform: none;
}

/* ============ 1.0.4: nút trang sản phẩm không cắt chữ + viết thường ============ */
/* Lỗi Hà chụp 13/11: nút "THÊM VÀO GIỎ..." bị cắt thành "...", 2 nút liên hệ
   mất chữ cuối ("Fanpag", "Hotlin"). Nguyên nhân: chữ hoa + giãn chữ làm nút
   chính quá dài so với cột, còn chữ trong nút liên hệ bị quy tắc font chung
   đẩy lên 14px (dự kiến 12px) nên tràn khỏi nút. */
/* Viết thường, bỏ giãn chữ ở nút thêm vào giỏ + mua ngay. Chữ thường ngắn hơn
   chữ hoa nên nút đủ chỗ hiện trọn chữ. */
.single-product .product-info form.cart .single_add_to_cart_button,
.single-product .buy-now-btn {
    text-transform: none !important;
    letter-spacing: 0 !important;
}
/* Bỏ kiểu cắt chữ "...": hai nút có chiều rộng tối thiểu theo chữ, thiếu chỗ
   thì nút "Mua ngay" tự xuống dòng (form đã có flex-wrap) thay vì cắt chữ. */
.single-product .product-info form.cart .single_add_to_cart_button,
.single-product .buy-now-btn {
    flex: 1 1 170px !important;
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}
/* Nhãn rút gọn ở màn cực hẹp (<359px) cũng viết thường. */
.single-product .product-info form.cart .single_add_to_cart_button::before,
.single-product .buy-now-btn::before {
    text-transform: none !important;
}
/* Chữ trong 3 nút liên hệ: ép đúng cỡ dự kiến, thắng quy tắc font chung. */
.btn-contact span,
.btn-contact-hotline span,
.btn-contact-zalo span {
    font-size: 12px !important;
}
@media (max-width: 480px) {
    .btn-contact span,
    .btn-contact-hotline span,
    .btn-contact-zalo span {
        font-size: 11px !important;
    }
}

/* ============ 1.0.5: hàng nút liên hệ không cắt chữ ============ */
/* 1.0.4 chưa đủ: kiểm tra 15:56 13/11 vẫn "Fanpag"/"Hotlin", icon cắt nửa.
   Nguyên nhân sâu: hàng nút là flex-item của form.cart, cỡ tối thiểu tự động
   bằng tổng chiều rộng chữ không ngắt dòng → hàng tràn khỏi cột, chữ căn giữa
   tràn đều 2 mép. Chữa dứt điểm: cho hàng co lại được, chữ được ngắt dòng
   ("Liên hệ" / "Fanpage") thay vì cắt, không giấu phần tràn. */
.memip-contact-row {
    min-width: 0 !important;
    flex-wrap: wrap !important;
}
.btn-contact,
.btn-contact-hotline,
.btn-contact-zalo {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.25 !important;
}

/* ============ 1.0.7/1.0.8: khung ảnh trang sản phẩm ============ */
/* Ảnh chai nền trắng nằm trực tiếp trên nền trang nên nhìn như trôi, không
   phân biệt được vùng ảnh với nền trang (Hà 16:04 13/11). Đóng khung trắng
   + viền mảnh + bo 8px để vùng ảnh rõ ràng. Chỉ thêm khung, ảnh vẫn hiện
   đủ, không cắt. Huy hiệu giảm giá nằm ở góc khung như cũ.
   1.0.8: 1.0.7 chọn nhầm .product-gallery-default (mẫu gallery mới, web không
   dùng) nên khung không hiện. Web đang dùng mẫu gallery cổ điển của Flatsome
   (.product-images, có nút phóng to ở góc dưới bên trái). Giữ cả hai chọn
   lọc để khung hiện dù web dùng mẫu nào. */
.single-product .product-images,
.single-product .product-gallery-default {
    background: #fff;
    border: 1px solid #ece5df;
    border-radius: 8px;
    padding: 12px;
    box-sizing: border-box;
}

/* ============ 1.0.10: nút "Mua ngay" xanh lá trà ============ */
/* (Bỏ qua số hiệu 1.0.9: bản đó ẩn mô tả ngắn, Hà đã đổi ý hủy trước khi
   dùng, xem ghi chú 16:26 13/11. Số hiệu này tránh nhầm với file zip 1.0.9
   còn lưu trên máy.)
   Nút "Mua ngay" đang dùng gradient cam (#ff6b00 → #ff9500) của style.css
   gốc, lệch khỏi bộ màu Cảm Nhận. Đổi sang gradient xanh lá trà, giữ nguyên
   kiểu chuyển màu + bóng đổ để nút vẫn nổi bật cạnh nút thêm giỏ bordeaux
   nhưng trầm và hợp thương hiệu hơn. */
.single-product .buy-now-btn {
    background: linear-gradient(135deg, #2E5A3D, #3A6B4B) !important;
}
.single-product .buy-now-btn:hover {
    background: linear-gradient(135deg, #24492F, #2E5A3D) !important;
    box-shadow: 0 5px 15px rgba(46, 90, 61, 0.3) !important;
}

/* ============ 1.0.11: tiêu đề dùng Inter + đồng bộ màu còn sót ============ */
/* Hà yêu cầu 17:40 13/11: soát hết một lượt, sửa giao diện và font chữ, font
   giống trang demo lấy sản phẩm (qkawine.com). Trang đó dùng Inter cho cả
   tiêu đề (đã kiểm tra CSS thật của trang: chỉ có Inter + Dancing Script
   trang trí, không dùng serif). Web mình đã dùng Inter cho chữ thường, chỉ
   tiêu đề đang dùng Noto Serif (chọn theo logo). Đổi cả 3 nhóm chọn lọc tiêu
   đề sang Inter; logo không ảnh hưởng vì logo là file hình. Khai báo
   @font-face Noto Serif vẫn giữ trong inc/feature-fonts.php nhưng trình
   duyệt không tải font không dùng tới.
   Cùng bản: nút trong khối giỏ hàng/thanh toán của WooCommerce Blocks đang
   xám than #32373C (mặc định của Blocks, Customizer không chỉnh được) → nền
   bordeaux; nút Tìm kiếm trong widget sidebar → bordeaux; dấu −/+ số lượng
   → bordeaux; nút "So sánh với chai khác" → viền + chữ bordeaux, hover đỏ
   tươi #ed1c24 cũ → nền bordeaux chữ trắng. Breadcrumb, hộp sắp xếp, nút
   phóng to ảnh giữ xám trung tính như trang demo. */
body h1,
body .h1,
body h2,
body .h2,
body h3,
body .h3,
body .banner h1,
body .hero h1,
body .banner h2,
body .hero h2,
body .section-title span,
body .section-title-main,
body .section-title-normal span,
body h3.product-section-title-related,
body .product-section-title-related,
body .entry-title,
body .entry-title a,
body .name.product-title,
body .name.product-title a,
body p.name.product-title,
body h1.product-title.product_title,
body .memip-cat-banner .memip-archive-title,
body .memip-finder h2,
body .memip-finder-card-title,
body .memip-dishes h2,
body .memip-promo-landing h2,
body .memip-promo-hot h2,
body .memip-promo-card-name,
body .memip-promo-grid-title,
body .memip-cat-desc__inner h2,
body .memip-cat-desc__inner h3,
body .memip-shorts .memip-shorts-title,
body .memip-toc__title,
body .memip-home-news__title,
body .memip-footer__brand-name,
body .memip-compare-page h1 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

body.woocommerce-cart .wp-block-button__link:not(:disabled),
body.woocommerce-checkout .wp-block-button__link:not(:disabled) {
    background-color: #6B0F1A !important;
    border-color: #6B0F1A !important;
    color: #fff !important;
}
body.woocommerce-cart .wp-block-button__link:not(:disabled):hover,
body.woocommerce-checkout .wp-block-button__link:not(:disabled):hover {
    background-color: #4A0A12 !important;
    border-color: #4A0A12 !important;
}

.widget_search .search-submit,
.widget_search .wp-block-search__button {
    background: #6B0F1A !important;
    border-color: #6B0F1A !important;
    color: #fff !important;
}

.single-product .quantity .minus,
.single-product .quantity .plus {
    color: #6B0F1A !important;
}

.single-product .memip-compare-btn {
    border-color: #6B0F1A !important;
    color: #6B0F1A !important;
}
.single-product .memip-compare-btn:hover {
    background: #6B0F1A !important;
    border-color: #6B0F1A !important;
    color: #fff !important;
}

/* ============ 1.0.13: nút Xem thêm/Thu gọn mô tả sản phẩm + tiêu đề bảng viết thường ============ */
/* Kẹp mô tả dài ở 480px + lớp mờ dần về nền kem (JS chỉ gắn class khi bài thật sự dài). */
.single-product .cn-desc-clamped {
    max-height: 480px !important;
    overflow: hidden !important;
    position: relative;
}
.single-product .cn-desc-clamped::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 90px;
    background: linear-gradient(to bottom, rgba(253, 251, 247, 0), #FDFBF7);
    pointer-events: none;
}
/* Nút Xem thêm / Thu gọn: nhỏ gọn, viền bordeaux, chữ thường như Hà viết. */
.single-product .cn-desc-toggle {
    display: block;
    margin: 14px auto 0;
    padding: 8px 22px;
    background: transparent;
    border: 1px solid #6B0F1A;
    border-radius: 999px;
    color: #6B0F1A;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    letter-spacing: normal;
    text-transform: none;
    cursor: pointer;
}
.single-product .cn-desc-toggle:hover {
    background: #6B0F1A;
    color: #fff;
}
.single-product .cn-desc-toggle .cn-desc-toggle__less {
    display: none;
}
.single-product .cn-desc-toggle[aria-expanded="true"] .cn-desc-toggle__more {
    display: none;
}
.single-product .cn-desc-toggle[aria-expanded="true"] .cn-desc-toggle__less {
    display: inline;
}
/* Tiêu đề bảng trong bài sản phẩm giữ đúng chữ thường như Hà viết:
   Flatsome cha có luật chung th{text-transform:uppercase} — tắt riêng ở đây. */
.single-product #tab-description table th,
.single-product .tab-panels table th,
.single-product .product-page-sections table th,
.single-product .accordion-inner table th {
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ============ 1.0.14: kiểu bảng so sánh trong bài sản phẩm (Hà 14/11, theo mẫu QKA) ============ */
/* Hầu hết bảng lấy về đều dùng cấu trúc div.table-wrapper > table#comparison-table.comparison-table.
   Màu dùng bordeaux #6B0F1A của Cảm Nhận (bên họ #7c071c), bo góc 8px cho đồng bộ các khối khác. */
.single-product .table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    display: block;
    width: 100%;
    margin-top: 20px;
}
.single-product table#comparison-table {
    display: table;
    width: 100% !important;
    min-width: 600px;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 8px;
    overflow: hidden;
    table-layout: auto;
}
.single-product table#comparison-table th {
    background-color: #6B0F1A;
    color: #fff;
    padding: 12px;
    text-align: left;
    white-space: nowrap;
    text-transform: none;
    letter-spacing: normal;
}
.single-product table#comparison-table td {
    background-color: #f9f9f9;
    padding: 12px;
    vertical-align: top;
    white-space: normal;
    word-break: break-word;
}
.single-product table#comparison-table th:first-child {
    border-top-left-radius: 8px;
}
.single-product table#comparison-table th:last-child {
    border-top-right-radius: 8px;
}
/* Chữ thường cho tiêu đề bảng comparison-table ở mọi vị trí trong trang sản phẩm
   (kể cả bảng nằm trong phần mô tả ngắn của bài chưa viết lại). */
.single-product table.comparison-table th {
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ============ 1.0.15: link tự động Hadim không gạch chân cả khi di chuột ============ */
/* Cài đặt "Không gạch chân" của plugin chỉ áp dụng lúc bình thường; luật :hover sẵn
   trong code plugin vẫn gạch chân khi di chuột vào. Tắt hẳn bằng CSS của mình,
   giữ nguyên màu link và màu khi di chuột của plugin. */
a.hadim-auto-link,
a.hadim-auto-link:hover {
    text-decoration: none !important;
}

/* ============ 1.0.16: chữ và khoảng cách trong phần mô tả sản phẩm ============ */
/* Chỉ áp dụng trong phần mô tả của trang sản phẩm, ở cả 3 kiểu hiển thị của
   Flatsome (tab #tab-description, section, accordion). Không động tới phần
   khác của trang. Chữ to hơn một chút, dòng thoáng hơn, đoạn và tiêu đề có
   khoảng cách rõ ràng, link trong bài không gạch chân. */
.single-product #tab-description p,
.single-product .product-section--description p,
.single-product .accordion-item--description p {
    font-size: 15px !important;
    line-height: 1.75;
    margin: 0 0 14px;
}
.single-product #tab-description h2,
.single-product .product-section--description h2,
.single-product .accordion-item--description h2 {
    font-size: 20px;
    line-height: 1.35;
    margin: 28px 0 12px;
}
.single-product #tab-description h2:first-child,
.single-product .product-section--description h2:first-child,
.single-product .accordion-item--description h2:first-child {
    margin-top: 0;
}
.single-product #tab-description h3,
.single-product .product-section--description h3,
.single-product .accordion-item--description h3 {
    font-size: 17px;
    line-height: 1.4;
    margin: 24px 0 10px;
}
.single-product #tab-description ul,
.single-product #tab-description ol,
.single-product .product-section--description ul,
.single-product .product-section--description ol,
.single-product .accordion-item--description ul,
.single-product .accordion-item--description ol {
    margin: 0 0 14px 20px;
}
.single-product #tab-description li,
.single-product .product-section--description li,
.single-product .accordion-item--description li {
    line-height: 1.7;
    margin-bottom: 6px;
}
.single-product #tab-description a,
.single-product .product-section--description a,
.single-product .accordion-item--description a,
.single-product #tab-description a:hover,
.single-product .product-section--description a:hover,
.single-product .accordion-item--description a:hover {
    text-decoration: none !important;
}
.single-product #tab-description .table-wrapper,
.single-product .product-section--description .table-wrapper,
.single-product .accordion-item--description .table-wrapper {
    margin-bottom: 16px;
}

/* ============ 1.0.19: thẻ món ăn có ảnh ============ */
/* Thẻ có ảnh: ảnh vuông phủ kín phía trên, chữ phía dưới. Thẻ chưa có ảnh
   giữ nguyên dạng chữ như cũ. Ảnh món ăn dùng cover (ảnh chụp món, khác với
   ảnh sản phẩm vốn phải giữ nguyên không cắt). */
.memip-dish-card.has-img {
    padding: 0 0 14px;
    overflow: hidden;
}
.memip-dish-card-img {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    margin-bottom: 10px;
}
.memip-dish-card.has-img strong,
.memip-dish-card.has-img span {
    padding: 0 14px;
}
/* Tiêu đề trang món ăn: ảnh vuông nhỏ bên trái, chữ bên phải. */
.memip-dish-header.has-img {
    display: flex;
    align-items: center;
    gap: 16px;
}
.memip-dish-header-img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 8px;
    flex: 0 0 auto;
}
@media (max-width: 767px) {
    .memip-dish-header-img {
        width: 72px;
        height: 72px;
    }
}

/* ============ 1.0.20: chữ menu chính to hơn ============ */
/* Chữ menu đang 12px, nhỏ hơn cả biểu tượng 14px bên cạnh, dấu tiếng Việt
   bị chật nên nhìn xấu. Tăng lên 14px cho dấu thở và cân với biểu tượng. */
#wide-nav.qka-nav-bar .qka-main-nav > li > a {
    font-size: 14px !important;
    gap: 5px;
}

/* ============ 1.0.20 (tiếp): nút viền không bị tô nền ============ */
/* Nút "Tiếp tục mua sắm" và nút "Áp dụng phiếu giảm giá" là nút viền
   (is-outline): nền trong, chữ màu đỏ rượu. Luật tô nền của skin đè lên
   làm nút thành nền đỏ đặc mà chữ vẫn đỏ nên không đọc được, di chuột
   tới mới thấy chữ. Khôi phục đúng kiểu nút viền ở đây. */
body .button.primary.is-outline,
body .button.is-outline {
    background-color: transparent !important;
    color: #6B0F1A !important;
    border-color: #6B0F1A !important;
}
body .button.primary.is-outline:hover,
body .button.is-outline:hover {
    background-color: #6B0F1A !important;
    color: #fff !important;
    border-color: #6B0F1A !important;
}

/* ============ 1.0.21: chip món ăn có ảnh tròn trên trang sản phẩm ============ */
/* Dòng "Hợp với món" thành các chip bo tròn: ảnh món thu nhỏ hình tròn +
   tên món. Món chưa có ảnh thì chip chỉ hiện tên, không vỡ giao diện. */
.memip-dish-line {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}
.memip-dish-line-label {
    font-size: 13px;
    color: #555;
}
.memip-dish-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #e8e0d8;
    border-radius: 999px;
    padding: 3px 10px 3px 3px;
    background: #fff;
    text-decoration: none;
    color: #4a4a4a;
    font-size: 13px;
    line-height: 1.4;
}
.memip-dish-chip:hover {
    border-color: #6B0F1A;
    color: #6B0F1A;
}
.memip-dish-chip-img {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

/* ============ 1.0.25: bảng giá trong mô tả danh mục/thuộc tính (Hà 14/11, theo mẫu QKA) ============ */
/* Khối mô tả bổ sung của danh mục chứa bảng div.table-wrapper > table#comparison-table
   giống bảng trong bài sản phẩm. Áp cùng kiểu 1.0.14 vào khối mô tả danh mục/thuộc tính
   (.memip-cat-desc__inner dùng chung cho cả banner và hộp mô tả thường) để bảng có
   nền cuộn ngang trên điện thoại và tiêu đề bảng chữ thường. */
.memip-cat-desc__inner .table-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    display: block;
    width: 100%;
    margin-top: 20px;
}
.memip-cat-desc__inner table#comparison-table {
    display: table;
    width: 100% !important;
    min-width: 600px;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 8px;
    overflow: hidden;
    table-layout: auto;
}
.memip-cat-desc__inner table#comparison-table th {
    background-color: #6B0F1A;
    color: #fff;
    padding: 12px;
    text-align: left;
    white-space: nowrap;
    text-transform: none;
    letter-spacing: normal;
}
.memip-cat-desc__inner table#comparison-table td {
    background-color: #f9f9f9;
    padding: 12px;
    vertical-align: top;
    white-space: normal;
    word-break: break-word;
}
.memip-cat-desc__inner table#comparison-table th:first-child {
    border-top-left-radius: 8px;
}
.memip-cat-desc__inner table#comparison-table th:last-child {
    border-top-right-radius: 8px;
}
.memip-cat-desc__inner table.comparison-table th {
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* ============ 1.0.26: bảng full chiều rộng + bài mở rộng không bị cắt (Hà 14/11) ============ */
/* Bảng giá trong mô tả danh mục hiện hẹp hơn khung chữ vì khung bọc dùng display:flex
   còn bảng bị luật cũ trong style.css ép display:block. Khung bọc để block, bảng về
   display:table và rộng 100% (ghi đè ngay trong mục 1.0.14 và 1.0.25 ở trên).
   Bài mô tả dài bị cắt ở mục 6 vì luật cũ giới hạn chiều cao khối mở rộng 4000px
   kèm overflow:hidden — dữ liệu đủ 9 mục nhưng 3 mục cuối không hiện được. Khi đã
   mở rộng thì bỏ hẳn giới hạn chiều cao để hiện đủ bài, nút Thu gọn cuối bài vẫn
   hiện bình thường. Lúc thu gọn vẫn kẹp ~4 dòng như cũ. */
body .memip-cat-desc--collapsible:not(.is-collapsed) .memip-cat-desc__inner {
    max-height: none !important;
    overflow: visible;
}

/* ============ 1.0.27: nhãn % giảm giá ở trang sản phẩm giống nhãn ở lưới (Hà 14/11) ============ */
/* Trang sản phẩm dùng chung mẫu sale-flash của Flatsome nhưng không có luật riêng nên
   nhãn % hiện dạng hình tròn to, lồi ra ngoài khung ảnh (margin-left âm của
   .badge-circle) trông xấu và dễ bị cắt ở mép màn hình. Gắn đúng kiểu nhãn ở lưới
   trang chủ/cửa hàng (mục BADGE SALE trong style.css): nhãn chữ nhật nhỏ, nền đỏ
   rượu, nằm gọn trong góc trên trái của ảnh. Chỉ áp dụng ở trang sản phẩm; lưới
   sản phẩm (kể cả khối liên quan) giữ nguyên luật sẵn có. */
.single-product .badge.onsale,
.single-product .badge-container .onsale {
    background: #6B0F1A !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    border-radius: 4px !important;
    padding: 4px 8px !important;
    box-shadow: 0 2px 6px rgba(107, 15, 26, 0.3);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.single-product .badge-container {
    position: absolute !important;
    top: 8px !important;
    left: 8px !important;
    z-index: 10;
    margin: 0 !important;
}
.single-product .badge {
    height: auto !important;
    width: auto !important;
}
.single-product .badge-circle {
    margin-left: 0 !important;
}
.single-product .badge-circle .badge-inner {
    border-radius: 4px !important;
    height: auto !important;
    width: auto !important;
}
.single-product .onsale {
    min-width: 38px;
    text-align: center;
}

/* ============ 1.0.28: logo đầu trang to hơn (Hà 14/11) ============ */
/* Logo hiện nhỏ vì 2 lý do cộng lại: khung ảnh logo trong style.css chỉ 160x55px,
   và file logo ngang có lề trong suốt lớn (hình thật chỉ chiếm 74% chiều rộng,
   57% chiều cao khung file). File logo đã cắt sát hình (9-logo-ngang-dau-trang-cat.png,
   1899x594) và khung hiển thị nới lên 210x64px để logo rõ và cân với thanh tìm kiếm.
   Chỉ áp dụng cho đầu trang desktop; logo trên điện thoại giữ nguyên 45px. */
.qka-main .qka-logo {
    max-width: 240px;
}
.qka-main .qka-logo .qka-logo-img {
    height: 64px !important;
    width: 210px !important;
    max-height: 64px !important;
    max-width: 240px !important;
}
.qka-main .qka-logo a {
    height: 64px;
}

/* ============ 1.0.29–1.0.32: logo nhỏ lại trong thanh đầu trang cố định khi cuộn (Hà 14/11) ============ */
/* Đầu trang thường đã đẹp với logo 64px, nhưng khi cuộn xuống, thanh cố định
   hẹp hơn nên logo 64px trông quá to và dòng phụ bị cắt ở mép dưới. Khi dính
   thì logo thu về 44px cho vừa thanh hẹp; đầu trang thường giữ nguyên.
   1.0.30 sửa bộ chọn: class stuck không nằm chắc trên .header-wrapper mà có
   thể ở phần tử cha khác, nên chỉ neo theo .stuck như các luật sẵn có trong
   style.css (.stuck #logo img), cho chắc chắn khớp.
   1.0.31 tăng độ ưu tiên: neo theo #logo (id) để thắng mọi luật class khác
   có thể đang giữ chiều cao logo, kể cả luật do Customizer in ra.
   1.0.32: cả 3 bản trên đều không có tác dụng vì đầu trang dính bằng CSS
   position: sticky, không hề có class trạng thái nào thay đổi lúc cuộn.
   File sticky-logo.js tự gắn class cn-header-stuck vào body khi cuộn xuống,
   luật dưới đây neo theo class đó; giữ cả luật .stuck làm dự phòng.
   1.0.48: cả .stuck lẫn class body đều chưa chắc đã gắn được (cơ chế dính
   của đầu trang này không rõ, file JS có thể bị trì hoãn tải), nên neo
   theo MỌI vị trí .stuck có thể + class body do 2 nguồn JS gắn (file
   riêng và script inline trong header-main.php, cùng khối script với menu
   dropdown đã chạy tốt). Khi dính thêm: ẩn dải thông báo đỏ trên cùng.
   1.0.49: thu mạnh tay hơn để nhìn rõ ràng — logo 36px (thay vì 44px) +
   bớt padding hàng logo, vì 44px qua 5 lần kiểm tra đều không nhìn ra khác
   biệt. Nếu bản này nhìn rõ thì giữ, Hà muốn to hơn thì chỉnh sau. */
.stuck #logo .qka-logo-img,
.header-wrapper.stuck #logo .qka-logo-img,
#header.stuck #logo .qka-logo-img,
body.cn-header-stuck #logo .qka-logo-img {
    height: 36px !important;
    width: auto !important;
    max-height: 36px !important;
}
.stuck #logo a,
body.cn-header-stuck #logo a {
    height: 36px;
}
.stuck .qka-main .qka-main-inner,
body.cn-header-stuck .qka-main .qka-main-inner {
    padding-top: 6px;
    padding-bottom: 6px;
}
.stuck #top-bar,
.header-wrapper.stuck #top-bar,
#header.stuck #top-bar,
body.cn-header-stuck #top-bar {
    display: none !important;
}

/* ============ 1.0.48: bỏ khoảng trắng ~100px cuối trang chủ (Hà 15/11) ============ */
/* Khoảng trắng = margin dưới 32px của mục món ăn + padding dưới 30px của cột
   nội dung + padding dưới 30px của .page-wrapper. Chỉ trang chủ: bỏ 2 lớp
   padding, giữ 20px thở dưới mục món ăn. Bộ chọn cột neo trực tiếp theo
   cấu trúc page.php (.page-wrapper > .row-main > .col) để không chạm tới
   các cột thẻ sản phẩm nằm sâu bên trong. */
body.home .page-wrapper {
    padding-bottom: 0;
}
body.home .page-wrapper > .row-main > .col {
    padding-bottom: 0;
}
body.home .memip-dishes {
    margin-bottom: 20px;
}

/* =============================================================
   1.0.37: trang chi tiết sản phẩm gọn hơn (Hà 14/11)
   - Hàng tab biến mất khi chỉ còn tab Mô tả (tiêu đề tab này đã ẩn sẵn
     trong style.css): tránh dải tab trơ trọi + đường kẻ đỏ thừa sau khi
     tab Đánh giá bị ẩn vì chưa có đánh giá thật. Khi có đánh giá thật,
     tab Đánh giá hiện lại thì hàng tab tự hiện theo (2 tab).
   - Mục sản phẩm tương tự: gọn khoảng trắng trên/dưới.
   - Cặp nút So sánh / Biến động giá: đủ chỗ thở, không chạm mép phải.
   ============================================================= */
.single-product .woocommerce-tabs .product-tabs:has(> li:only-child.description_tab) {
    display: none !important;
}
.single-product .related-products-wrapper {
    margin-top: 20px;
    margin-bottom: 0;
}
.single-product .related-products-wrapper .slider {
    margin-bottom: 8px;
}
.single-product .memip-compare-btn,
.single-product .memip-ph-btn {
    box-sizing: border-box;
}
.single-product .entry-summary:has(> .memip-ph-btn) .memip-compare-btn,
.single-product .memip-ph-btn {
    width: calc(50% - 5px);
}

/* =============================================================
   1.0.38: khối chân trang trống nội dung thì ẩn (Hà 14/11 — xóa
   chữ trong ô là ẩn, gõ lại là hiện, không làm nút tích ẩn).
   Khi tầng pháp lý chỉ còn mục thanh toán thì giữ các ô ở bên
   phải như cũ thay vì dạt sang trái.
   ============================================================= */
body .memip-footer__legal-inner:has(> .memip-footer__legal-right:only-child) {
    justify-content: flex-end;
}

/* =============================================================
   1.0.40: thiết kế lại mục sản phẩm tương tự (Hà 14/11 — kiểu cũ
   thô và xấu: nền xám + ô vuông nhỏ + gạch xám dày, khoảng trắng
   thừa lớn). Tiêu đề mới gọn: chữ bordo, gạch chân ngắn bordo,
   đường kẻ nhạt hết chiều rộng. Ẩn mũi tên trượt khi không còn
   gì để trượt (ít sản phẩm) để không còn 2 ô vuông mờ vô dụng.
   ============================================================= */
.single-product .woocommerce-tabs {
    margin-bottom: 0 !important;
}
.single-product .related-products-wrapper {
    margin-top: 28px !important;
    margin-bottom: 0 !important;
}
.single-product h3.product-section-title-related {
    margin: 0 0 16px !important;
    padding: 0 0 10px !important;
    border-bottom: 1px solid #e8e8e8;
    font-size: 18px !important;
    line-height: 1.3;
}
.single-product h3.product-section-title-related span {
    background: transparent !important;
    padding: 0 !important;
    color: #6B0F1A !important;
}
.single-product h3.product-section-title-related span:after {
    content: "";
    position: absolute;
    left: 0;
    right: auto;
    bottom: -11px;
    width: 48px;
    height: 3px;
    display: block;
    background: #6B0F1A;
}
.single-product h3.product-section-title-related:after {
    display: none !important;
}
.single-product .related-products-wrapper .flickity-prev-next-button:disabled,
.single-product .related-products-wrapper .flickity-prev-next-button.disabled,
.single-product .related-products-wrapper .flickity-prev-next-button[aria-disabled="true"] {
    display: none !important;
}
@media screen and (max-width: 767px) {
    .single-product h3.product-section-title-related {
        margin-left: 15px !important;
        margin-right: 15px !important;
        font-size: 17px !important;
    }
}

/* ===== 1.0.47: tiêu đề mục kiểu gọn (giống .net) ===== */
/* Hà 05:11 ngày 15/11: kiểu chữ viết tay to + vệt hồng "to thô xấu quá",
   quay về kiểu gọn của .net: chữ nhỏ, căn trái, vạch đỏ + gạch đỏ dưới
   chữ, đường kẻ xám full width. Một kiểu duy nhất cho cả 4 chỗ: tiêu đề
   mục trang chủ, "Thông tin sản phẩm", "Sản phẩm liên quan", và "Tìm rượu
   theo món ăn". Chữ viết hoa toàn bộ như .net (tiêu đề mục, không phải
   nội dung). Font Dancing Script vẫn giữ trong theme, chỉ không dùng ở
   các tiêu đề này nữa. */
body.home h3.section-title.cn-home-title,
.cn-desc-title,
.single-product h3.product-section-title-related,
body.home .memip-dishes > h2 {
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.5 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    letter-spacing: normal !important;
    color: #333 !important;
    position: relative;
    z-index: 0;
    border-bottom: 1px solid #e6e6e6 !important;
    padding: 0 !important;
}
/* Khoảng cách riêng từng chỗ (giữ nhịp dọc cũ, chỉ đổi kiểu chữ). */
body.home h3.section-title.cn-home-title {
    margin: 30px 0 16px !important;
}
.cn-desc-title {
    margin: 4px 0 16px !important;
}
.single-product h3.product-section-title-related {
    margin: 0 0 20px !important;
}
body.home .memip-dishes > h2 {
    margin: 0 0 16px !important;
}
/* Vạch đỏ + gạch đỏ ôm sát chữ; mũi tên đỏ ở mép trái (kiểu .net). */
body.home h3.section-title.cn-home-title span,
.cn-desc-title span,
.single-product h3.product-section-title-related span,
body.home .memip-dishes > h2 span {
    display: inline-block !important;
    position: relative !important;
    width: auto !important;
    border-left: 10px solid #b71c1c !important;
    border-bottom: 2px solid #b71c1c !important;
    margin: 0 0 -2px !important;
    padding: 0 0 0 10px !important;
    background: transparent !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    letter-spacing: normal !important;
}
body.home h3.section-title.cn-home-title span::before,
.cn-desc-title span::before,
.single-product h3.product-section-title-related span::before,
body.home .memip-dishes > h2 span::before {
    content: "";
    border: 5px solid #b71c1c;
    border-color: transparent transparent transparent #b71c1c;
    position: absolute;
    transform: translateY(-50%);
    top: 50%;
    left: 0;
}
/* Bỏ đường kẻ 2 bên của kiểu section-title-normal: đường kẻ xám full
   width đã có từ border-bottom của chính tiêu đề. */
body.home h3.section-title.cn-home-title b {
    display: none !important;
}
/* Bỏ đường kẻ xám dày + chấm đỏ của kiểu cũ ở mục sản phẩm liên quan
   (style.css). */
.single-product h3.product-section-title-related::after {
    display: none !important;
    content: none !important;
}
.single-product h3.product-section-title-related span::after {
    display: none !important;
    content: none !important;
}
@media screen and (max-width: 767px) {
    .single-product h3.product-section-title-related {
        margin-left: 15px !important;
        margin-right: 15px !important;
    }
}


/* ===== 1.0.42: bỏ đường kẻ xám ngăn cách trên trang sản phẩm ===== */
/* Đường kẻ do theme cha Flatsome đặt (viền trên/dưới các khối của trang
   sản phẩm), theme con không hề đặt. Bỏ viền của các khối trong luồng:
   khu mua hàng, khu chân trang sản phẩm, khu tab mô tả, và khối sản phẩm
   tương tự. Không động tới viền của khung mô tả (.tab-panels) và các
   khối khác. Cỡ chữ tiêu đề 34px chỉ áp dụng màn hình lớn; điện thoại
   giữ 26px như 1.0.41 (Hà đã ưng trên điện thoại). */
.single-product .product-main,
.single-product .product-footer,
.single-product .woocommerce-tabs,
.single-product .tabbed-content {
    border-top: none !important;
    border-bottom: none !important;
}
.single-product .related-products-wrapper {
    border-top: none !important;
}

/* ===== 1.0.43: kéo khung mô tả sát lên khu vực sản phẩm ===== */
/* Thu hẹp khoảng trắng giữa khu mua hàng và khung mô tả chi tiết: bỏ
   phần đệm/lề trên của các khối tab và lề dưới của khối sản phẩm.
   Không động tới lề trong của khung mô tả và khu vực phía dưới. */
.single-product .product-main {
    margin-bottom: 8px !important;
}
.single-product .product-footer {
    padding-top: 0 !important;
}
.single-product .woocommerce-tabs {
    margin-top: 0 !important;
    padding-top: 0 !important;
}
.single-product .tab-panels {
    margin-top: 0 !important;
}

/* ===== 1.0.46: Tiêu đề các mục sản phẩm trên trang chủ ===== */
/* Chữ viết tay + vệt hồng, giống 2 tiêu đề trong trang sản phẩm (1.0.41–1.0.44).
   Link "Xem tất cả" ở mép phải trên máy tính, xuống dưới và căn giữa trên điện thoại. */
/* Link "Xem tất cả": mép phải, cùng hàng với tiêu đề (mọi cỡ màn hình).
   Tiêu đề mới nhỏ và căn trái nên link không còn đè lên chữ như kiểu cũ. */
body.home h3.section-title.cn-home-title a.cn-view-all {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    font-family: inherit !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    color: #666 !important;
    text-decoration: none !important;
    white-space: nowrap;
    z-index: 1;
}
body.home h3.section-title.cn-home-title a.cn-view-all:hover {
    text-decoration: underline !important;
    color: #b71c1c !important;
}