/* Mebanh – MỘT file CSS cho mọi phần sửa riêng (nạp bởi giao-dien.php). Tiền tố mb- để không đụng Flatsome.
   Màu thương hiệu: hồng #e8457a · nền hồng nhạt #fff4f7 · Zalo #0068ff. Điện thoại trước (≤ 549px). */

:root { --mb-hong: #e8457a; --mb-hong-nhat: #fff4f7; --mb-zalo: #0068ff; }

/* ── Đặt qua Zalo: ẩn giỏ hàng ── */
li.cart-item, .header-cart-link { display: none !important; }

/* ── Thẻ sản phẩm (the-san-pham.php) ── */
.mb-ma { margin: 0 0 2px; font-size: .85em; color: #777; }
.mb-lien-he { color: var(--mb-hong); font-weight: 700; }
/* Đợt 5: sao đánh giá chỉ ở trang sản phẩm (thẻ có sao làm lệch hàng); tên tối đa 2 dòng, mã + giá ngay dưới;
   bỏ chiều cao theme ép cho khung chữ (cắt mất "trên 1 triệu" và để khoảng trắng) */
.products .star-rating { display: none !important; }
.product-small .product-title { min-height: 2.6em; margin-bottom: 4px; }
.product-small .product-title a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.product-small .box-text { height: auto !important; min-height: 0 !important; }
@media (max-width: 549px) {
	.product-small .mb-tt { display: none; }
	.product-small .mb-ten { display: inline-block; }
	.product-small .mb-ten::first-letter { text-transform: uppercase; }
}

/* ── Trang sản phẩm (trang-san-pham.php) ── */
.mb-dat { margin: 4px 0 16px; }
.mb-gia-uoc { font-size: 14px; color: #555; margin: 4px 0 10px; }
.mb-nut { display: flex; gap: 8px; flex-wrap: wrap; margin: 0 0 12px; }
.mb-nut a { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 18px; border-radius: 99px; font-weight: 700; font-size: 15px; text-decoration: none; }
.mb-nut-zalo { background: var(--mb-zalo); color: #fff !important; flex: 1 1 auto; }
.mb-nut-goi { border: 2px solid var(--mb-hong); color: var(--mb-hong) !important; }
.mb-dat-khung { background: var(--mb-hong-nhat); border-radius: 10px; padding: 10px 14px; margin: 0 0 10px; font-size: 14px; }
.mb-dat-td { margin: 0 0 6px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; font-size: 14px; color: var(--mb-hong); }
.mb-dat-khung ul { list-style: none; margin: 0; padding: 0; }
/* 2 lớp: thắng ".entry-summary ul li { margin-left: 1.3em }" của Flatsome (nạp sau) — nếu không, dòng thụt vào xa */
.mb-dat .mb-dat-khung ul li { margin: 0 0 4px; padding-left: 26px; position: relative; line-height: 1.45; }
.mb-dat-khung li span { position: absolute; left: 0; }
.mb-cam-ket { margin: 6px 0 0; font-size: 12px; color: #777; }
.mb-theo-yc { font-size: 14px; margin: 0; }
.mb-cua-mo { text-align: center; margin: 4px 0 24px; }
/* Mô tả chi tiết thu gọn: ~6 dòng + "Xem thêm mô tả" (ô đánh dấu ẩn, không JS) */
.mb-mo-ta-mo { display: none !important; } /* Flatsome đè thuộc tính hidden của ô đánh dấu */
.mb-mo-ta-nd { max-height: 9em; overflow: hidden; position: relative; }
.mb-mo-ta-nd:after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3em; background: linear-gradient(rgba(255,255,255,0), #fff); }
.mb-mo-ta-mo:checked + .mb-mo-ta-nd { max-height: none; }
.mb-mo-ta-mo:checked + .mb-mo-ta-nd:after { display: none; }
.mb-mo-ta-nut { display: inline-block; margin-top: 6px; color: var(--mb-hong); font-weight: 700; cursor: pointer; }
.mb-mo-ta-nut:before { content: "Xem thêm mô tả ▾"; }
.mb-mo-ta-mo:checked ~ .mb-mo-ta-nut:before { content: "Thu gọn ▴"; }

/* ── Danh mục + trang kiểu (danh-muc.php) ── */
.mb-chips { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 10px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.mb-chips::-webkit-scrollbar { display: none; }
.mb-chips-boc { flex-wrap: wrap; justify-content: center; overflow: visible; }
.mb-chip { flex: none; border: 1px solid #ddd; border-radius: 99px; padding: 8px 14px; font-size: 14px; line-height: 1.2; background: #fff; color: #333; white-space: nowrap; }
.mb-chip i { font-style: normal; opacity: .65; font-size: 12px; margin-left: 4px; }
.mb-chip.mb-chon { background: var(--mb-hong); border-color: var(--mb-hong); color: #fff; font-weight: 700; }
.mb-ghi-chu { background: var(--mb-hong-nhat); border-radius: 8px; padding: 10px 12px; font-size: 14px; margin: 0 0 14px; }
@media (min-width: 850px) { .mb-chips { flex-wrap: wrap; } }

/* ── Menu "Danh mục bánh" (menu.php; đầu trang, điện thoại, cột trái): nhãn nhóm hồng có biểu tượng, mục chữ thường có biểu tượng (đợt 5) ── */
.mb-nhom-menu > a { pointer-events: none; cursor: default; font-size: 13px !important; text-transform: none !important; letter-spacing: 0; color: var(--mb-hong) !important; font-weight: 700 !important; }
.mb-nhom-menu > a:after, .mb-nhom-menu .toggle { display: none !important; }
.mb-mn-ic { display: inline-block; width: 22px; margin-right: 8px; text-align: center; font-size: 17px; flex: none; }
#main-menu .nav-sidebar > li > a { text-transform: none; font-size: 15px; color: #333; letter-spacing: 0; display: flex; align-items: center; }
#main-menu .nav-sidebar > li.mb-nhom-menu > a { background: var(--mb-hong-nhat); font-size: 14px !important; border-top: 2px solid #f6c9d8; }
#main-menu .nav-sidebar > li.mb-chi-dien-thoai:not(.mb-nhom-menu) > a { font-size: 14px; color: #666; padding-left: 48px; }
.mb-chi-dien-thoai { display: none !important; }
#main-menu .mb-chi-dien-thoai { display: list-item !important; }
.widget_nav_menu .current-menu-item > a { color: var(--mb-hong); font-weight: 700; }

/* ── Chân trang (chan-trang.php, đợt 5): điện thoại gọn, không bản đồ; máy tính 3 cột + bản đồ ── */
.mb-ct { background: #fff; border-top: 1px solid #f1dbe3; color: #444; font-size: 14px; }
.mb-ct-trong { max-width: 1080px; margin: 0 auto; padding: 20px 16px 8px; display: grid; gap: 14px; }
.mb-ct p { margin: 0 0 6px; }
.mb-ct-kh { font-weight: 700; color: var(--mb-hong); }
.mb-ct-goi { display: flex; align-items: center; gap: 10px; }
.mb-ct-sdt { font-size: 18px; font-weight: 700; color: #222; }
.mb-ct-zalo { flex: none !important; width: auto !important; min-height: 0 !important; padding: 4px 14px !important; border-radius: 99px; background: var(--mb-zalo); color: #fff !important; font-weight: 700; font-size: 13px !important; }
.mb-ct-phu { color: #888; font-size: 12px; }
.mb-ct-dc a, .mb-ct-tt a { color: var(--mb-hong); }
.mb-ct-dm { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mb-ct-td { font-weight: 700; font-size: 13px; color: #222; }
.mb-ct ul { list-style: none; margin: 0; padding: 0; }
.mb-ct li { margin: 0 0 4px; font-size: 13px; line-height: 1.35; }
.mb-ct li a { color: #555; }
.mb-ct-bd { display: none; }
.mb-ct-bd iframe { border-radius: 10px; display: block; }
.mb-ct-cuoi { text-align: center; font-size: 12px; color: #888; padding: 10px 16px 14px; border-top: 1px solid #f4f4f4; }
.mb-ct-cuoi a { color: #888; }
@media (min-width: 850px) { .mb-ct-trong { grid-template-columns: 1.1fr 1.4fr 1fr; gap: 28px; } .mb-ct-bd { display: block; } }

/* ── Chưa ưng? ở chân mọi trang (chua-ung.php) ── */
.mb-chua-ung-khoi { background: var(--mb-hong-nhat); text-align: center; padding: 22px 16px 14px; }
.mb-cu-td { margin: 0 0 10px; font-weight: 700; font-size: 16px; color: #333; }
.mb-cu-nut { display: inline-flex; align-items: center; min-height: 44px; padding: 0 22px; border-radius: 99px; font-weight: 700; text-decoration: none; }
.mb-cu-phu { margin: 14px 0 6px; font-size: 13px; color: #777; }
.mb-chua-ung-khoi .mb-chips { max-width: 900px; margin: 0 auto; }

/* ── Tìm kiếm tức thì (tim-kiem.php + assets/tim-kiem.js) ── */
.mb-tim-form { position: relative; }
.mb-tim-kq { position: absolute; left: 0; right: 0; min-width: min(300px, 92vw); top: 100%; z-index: 1000; background: #fff; border: 1px solid #eee; border-radius: 0 0 8px 8px; box-shadow: 0 8px 20px rgba(0,0,0,.12); max-height: 70vh; overflow-y: auto; text-align: left; }
.mb-tim-dong { display: flex; gap: 10px; align-items: center; padding: 6px 10px; color: #333; border-bottom: 1px solid #f3f3f3; }
.mb-tim-dong:hover, .mb-tim-dong:focus { background: var(--mb-hong-nhat); }
.mb-tim-dong img, .mb-tim-anh { width: 44px; height: 44px; border-radius: 6px; object-fit: cover; flex: none; background: #f3f3f3; }
.mb-tim-dong b { display: block; font-weight: 600; font-size: 14px; line-height: 1.3; }
.mb-tim-dong small { color: #888; font-size: 12px; }
.mb-tim-het { display: block; width: 100%; margin: 0; padding: 10px; background: #fafafa; border: 0; color: var(--mb-hong); font-weight: 700; text-transform: none; }
.mb-tim-rong { margin: 0; padding: 12px; font-size: 14px; color: #666; }

/* ── Thanh dưới màn điện thoại (dat-qua-zalo.php) ── */
.mb-thanh-duoi { display: none; }
@media (max-width: 549px) {
	.mb-thanh-duoi { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 999; gap: 8px; align-items: center; padding: 8px 10px calc(8px + env(safe-area-inset-bottom)); background: #fff; box-shadow: 0 -2px 8px rgba(0,0,0,.12); }
	.mb-td-chu { flex: 1; font-size: 12px; line-height: 1.3; font-weight: 600; color: #333; }
	.mb-thanh-duoi a { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 99px; font-weight: 700; font-size: 15px; text-decoration: none; }
	.mb-td-zalo { background: var(--mb-zalo); color: #fff !important; }
	.mb-td-goi { border: 2px solid var(--mb-hong); color: var(--mb-hong) !important; }
	body { padding-bottom: 72px; }
	#arcontactus { display: none !important; }
	.back-to-top { bottom: 80px !important; }
}

/* ── Học làm bánh (hoc-lam-banh.php): điện thoại một cột, máy tính giới hạn bề rộng cho dễ đọc ── */
.mb-hoc { font-size: 16px; line-height: 1.55; overflow-wrap: anywhere; }
/* D19: mỗi mục là một hàng UX Builder 890px (class mb-hoc trên cột); thẻ gói là 3 cột cao bằng nhau */
.row > .col.mb-hoc { padding-bottom: 12px; }
.mb-hoc-hang-goi > .col > .col-inner, .mb-hoc-hang-goi .mb-hoc-goi, .mb-hoc-hang-goi .mb-hoc-goi-chon { height: 100%; }
/* Mời học ở trang mẫu (D19): dưới khối Đặt bánh, nhẹ hơn nút đặt bánh */
.mb-moi-hoc { margin: 12px 0 0; }
.mb-moi-hoc a { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 10px; padding: 10px 12px; border: 1px dashed var(--mb-hong); border-radius: 10px; background: var(--mb-hong-nhat); color: #333 !important; font-size: 14px; line-height: 1.4; text-decoration: none; }
.mb-moi-hoc b { color: var(--mb-hong); white-space: nowrap; }
.mb-hoc p { margin: 0 0 12px; }
.mb-hoc a:not(.mb-nut-zalo) { color: var(--mb-hong); }
.mb-hoc h2 { margin: 12px 0; font-size: 21px; line-height: 1.3; color: #222; }
.mb-hoc h3 { margin: 0 0 8px; font-size: 17px; color: var(--mb-hong); }
.mb-hoc ul, .mb-hoc ol { margin: 0 0 12px 1.15em; padding-left: 0; }
.mb-hoc li { margin: 0 0 6px; }
.mb-hoc-nut { text-align: center; margin: 14px 0 !important; }
.mb-hoc-nut a { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 24px; border-radius: 99px; font-weight: 700; text-decoration: none; }
.mb-hoc-mau { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 12px; }
.mb-hoc-mau a { display: block; font-size: 13px; text-align: center; }
.mb-hoc-mau img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 10px; margin-bottom: 4px; }
.mb-hoc-noi-bat { background: var(--mb-hong); color: #fff; border-radius: 12px; padding: 18px 16px; text-align: center; }
.mb-hoc-noi-bat p:first-child { display: inline-block; background: #fff; color: var(--mb-hong); border-radius: 6px; padding: 4px 8px; font-weight: 700; font-size: 13px; line-height: 1.4; }
.mb-hoc-noi-bat p:nth-child(2) { font-size: 22px; line-height: 1.3; }
.mb-hoc-noi-bat .mb-hoc-nut { margin-bottom: 0 !important; }
.mb-hoc-noi-bat .mb-nut-zalo { background: #fff; color: var(--mb-hong) !important; }
.mb-hoc-diem-manh { display: grid; gap: 8px; margin-top: 12px; }
.mb-hoc-diem-manh p { background: var(--mb-hong-nhat); border-left: 4px solid var(--mb-hong); border-radius: 8px; padding: 10px 12px; margin: 0; }
.mb-hoc-goi, .mb-hoc-goi-chon { background: #fff; border: 1px solid #ddd; border-radius: 12px; padding: 14px; min-width: 0; }
.mb-hoc-goi-chon { background: var(--mb-hong-nhat); border: 2px solid var(--mb-hong); }
.mb-hoc-goi ul, .mb-hoc-goi-chon ul { margin-bottom: 0; }
.mb-hoc-tan-noi { background: #eef6ff; border-radius: 10px; padding: 12px 14px; }
.mb-hoc-tan-noi p { margin: 0; }
.mb-hoc-tb { background: var(--mb-hong); }
.mb-hoc-tb a { display: flex; align-items: center; justify-content: center; gap: 10px; max-width: 760px; margin: 0 auto; padding: 6px 12px; color: #fff !important; font-size: 13px; line-height: 1.35; text-decoration: none; }
.mb-hoc-tb span { min-width: 0; text-wrap: balance; }
.mb-hoc-tb b { flex: none; background: #fff; color: var(--mb-hong); border-radius: 99px; padding: 4px 10px; white-space: nowrap; }
/* Vạch ::after của theme dành cho tiêu đề ngắn, tiêu đề dài bị gạch ngang chữ */
.page-title h1::after { display: none; }
.mb-trang-hoc .page-title h1 { text-transform: none; font-size: 22px; font-weight: 700; line-height: 1.3; text-wrap: balance; }
.mb-hoc h2, .mb-hoc-noi-bat p { text-wrap: balance; }
.mb-hoc p, .mb-hoc li { text-wrap: pretty; }
.mb-hoc .mb-hoc-goi h3, .mb-hoc .mb-hoc-goi-chon h3 { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 10px; margin-bottom: 6px; font-size: 15px; font-weight: 700; color: #222; }
.mb-hoc-goi h3 b, .mb-hoc-goi-chon h3 b { font-size: 21px; color: var(--mb-hong); white-space: nowrap; }
.mb-hoc-hoi-dap p { border-bottom: 1px solid #eee; padding-bottom: 10px; }
.mb-hoc-hoi-dap strong { display: block; margin-bottom: 2px; }
.mb-hoc-them p { background: #f7f7f7; border-radius: 8px; padding: 10px 12px; margin-bottom: 8px; }
.mb-hoc-them strong { display: block; }
.mb-td-hoc a { flex: 1; }
@media (min-width: 850px) {
	.mb-hoc-diem-manh { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ── Trang chủ (nội dung sinh bởi src/trang-chu/tao_trang_chu.py) ── */
.mb-banner { background: var(--mb-hong-nhat); }
.mb-nhan { display: inline-block; background: var(--mb-hong); color: #fff; border-radius: 99px; padding: 2px 12px; font-size: .85em; margin-bottom: 8px; }
/* H1 giữ trong mã cho Google + trình đọc màn hình, ẩn khỏi mắt cho thoáng (Dien 2026-10-26; kiểu screen-reader-text của WordPress) */
.mb-banner h1 { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.mb-diem-manh { list-style: none; margin: 4px 0 14px; padding: 0; }
.mb-diem-manh li { margin: 0 0 6px; font-size: 15px; line-height: 1.4; color: #333; }
/* Ảnh banner khung 2:1 (trang-chu.php MEBANH_BANNER_TI_LE): neo lệch lên trên để ảnh 5:3 cũ không mất logo, chỉ cắt đáy */
.mb-banner .img-inner img { object-position: 50% 22%; }
/* Điện thoại: ảnh lên đầu tràn bề ngang, điểm mạnh gọn, ẩn 2 nút trùng thanh Zalo/Gọi dưới màn (DE-XUAT-TRANG-CHU-DIEN-THOAI v2) */
@media (max-width: 549px) {
	.mb-banner { padding-top: 0 !important; padding-bottom: 6px !important; }
	.mb-banner .row { display: flex; flex-direction: column; }
	.mb-banner .row > .col:nth-child(2) { order: -1; padding: 0 !important; margin: 0 -15px 10px; }
	.mb-banner .row > .col:nth-child(2) .img { margin: 0 !important; }
	.mb-banner .row > .col:first-child { padding-bottom: 0 !important; }
	.mb-banner .button { display: none !important; }
	.mb-diem-manh { margin: 0 0 4px; }
	.mb-diem-manh li { margin: 0 0 3px; font-size: 14px; }
}
.mb-tieu-de { text-align: center; margin: 28px 0 16px; font-size: 22px; font-weight: 700; color: #222; line-height: 1.3; }
.mb-tieu-de:after { content: ""; display: block; width: 56px; height: 3px; border-radius: 3px; background: var(--mb-hong); margin: 8px auto 0; }
.mb-so { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; margin-right: 8px; border-radius: 50%; background: var(--mb-hong); color: #fff; font-size: 16px; vertical-align: 3px; }
/* ① Dành cho: 6 nút gọn — điện thoại lưới 2 cột (3 hàng chẵn), máy tính 1 hàng 6 */
.mb-dm-luoi { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.mb-dm-nut { display: flex; align-items: center; gap: 8px; min-height: 52px; padding: 8px 12px; background: #fff; border: 1px solid #f1dbe3; border-radius: 12px; box-shadow: 0 2px 8px rgba(232,69,122,.08); color: #333; font-weight: 700; font-size: 14px; line-height: 1.25; }
.mb-dm-nut span { font-size: 22px; flex: none; }
.mb-dm-nut:hover { border-color: var(--mb-hong); color: var(--mb-hong); }
@media (min-width: 850px) { .mb-dm-luoi { grid-template-columns: repeat(6, 1fr); } .mb-dm-nut { flex-direction: column; text-align: center; min-height: 92px; justify-content: center; } }
.mb-kieu { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.mb-kieu .mb-chip { border-color: #f1c4d3; }
@media (min-width: 850px) { .mb-tieu-de { font-size: 26px; margin-top: 36px; } }
/* ③ Ô tìm theo tên, chủ đề (trang-chu.php [mebanh_o_tim]) */
.mb-o-tim { display: flex; max-width: 560px; margin: 0 auto; position: relative; }
.mb-o-tim input[type=search] { flex: 1; height: 46px; margin: 0; border: 1px solid var(--mb-hong); border-right: 0; border-radius: 99px 0 0 99px; padding: 0 16px; font-size: 15px; box-shadow: none; background: #fff; }
.mb-o-tim button { width: 54px; height: 46px; margin: 0; padding: 0; border: 0; border-radius: 0 99px 99px 0; background: var(--mb-hong); color: #fff; display: flex; align-items: center; justify-content: center; }
/* Điện thoại: ①②③ gọn trong tầm nhìn — đặt SAU quy tắc gốc .mb-tieu-de để không bị ghi đè; ô tìm đầu trang chủ chuyển xuống ③ */
@media (max-width: 549px) {
	.mb-tieu-de { margin: 14px 0 10px; font-size: 19px; }
	.mb-tieu-de:after { margin-top: 6px; }
	.mb-so { width: 26px; height: 26px; font-size: 14px; }
	.mb-dm-luoi { gap: 8px; }
	.mb-dm-nut { min-height: 46px; padding: 6px 10px; }
	.mb-kieu { gap: 6px; }
	.mb-kieu .mb-chip { padding: 6px 11px; font-size: 13px; }
	.home #header li.header-search-form { display: none !important; }
}