/* Bổ sung cho demo.css (Tailwind đã biên dịch): menu động, form CF7, phân trang, nội dung bài viết. */

/* Menu di động / bộ lọc */
.dnm-nav.is-open { display: block; }
.dnm-filter.is-open { display: block; }
body.admin-bar header.sticky { top: 32px; }
@media (max-width: 782px) { body.admin-bar header.sticky { top: 46px; } }

/* Menu con */
.dnm-primary-menu li { position: relative; }
.dnm-primary-menu .sub-menu { list-style: none; margin: 0; padding: 0 0 0 1.25rem; }
.dnm-primary-menu .sub-menu a { display: block; padding: .4rem 0; font-size: 12px; text-transform: none; color: #1f2a24; }
@media (min-width: 1024px) {
	.dnm-primary-menu .sub-menu {
		display: none; position: absolute; left: 0; top: 100%; z-index: 50; min-width: 220px;
		padding: .5rem 1rem; background: #fff; border: 1px solid rgb(201 154 62 / .3);
		box-shadow: 0 10px 25px rgb(0 0 0 / .1);
	}
	.dnm-primary-menu li:hover > .sub-menu,
	.dnm-primary-menu li:focus-within > .sub-menu { display: block; }
}

/* WOW.js: giữ trạng thái tự nhiên sau khi chạy xong để không đè hiệu ứng hover */
.wow.animated { animation-fill-mode: backwards; }
@media (prefers-reduced-motion: reduce) {
	.wow { visibility: visible !important; animation: none !important; }
}

/* Carousel đơn giản */
[data-carousel-item].is-hidden { display: none; }

/* Yêu thích */
[data-wish].is-on { color: #b3261e; }

/* Phân trang */
.dnm-pagination .page-numbers {
	display: grid; place-items: center; min-width: 2rem; height: 2rem; padding: 0 .5rem;
	border: 1px solid rgb(201 154 62 / .3); border-radius: 4px; background: #fff;
	color: #0f3a2c; font-size: .75rem; font-weight: 600;
}
.dnm-pagination a.page-numbers:hover { border-color: #c99a3e; }
.dnm-pagination .page-numbers.current { background: #0f3a2c; border-color: #0f3a2c; color: #fff; }
.dnm-pagination .page-numbers.dots { border: 0; background: transparent; }

/* Nội dung soạn thảo (wysiwyg, bài viết, trang) */
.dnm-prose p { margin-top: .75rem; }
.dnm-prose p:first-child { margin-top: 0; }
.dnm-prose h1, .dnm-prose h2, .dnm-prose h3, .dnm-prose h4, .dnm-prose h5, .dnm-prose h6 {
	font-family: var(--font-display); font-weight: 700; color: #0f3a2c; margin: 1.5rem 0 .5rem; line-height: 1.3;
}
.dnm-prose h1 { font-size: 2rem; }
.dnm-prose h2 { font-size: 1.5rem; }
.dnm-prose h3 { font-size: 1.25rem; }
.dnm-prose h4 { font-size: 1.125rem; }
.dnm-prose h5 { font-size: 1rem; }
.dnm-prose h6 { font-size: .875rem; text-transform: uppercase; letter-spacing: .03em; }
.dnm-prose ul { list-style: disc; padding-left: 1.25rem; margin-top: .75rem; }
.dnm-prose ol { list-style: decimal; padding-left: 1.25rem; margin-top: .75rem; }
.dnm-prose a { color: #c99a3e; text-decoration: underline; }
.dnm-prose img { max-width: 100%; height: auto; border-radius: 6px; margin: 1rem 0; }
.dnm-prose b, .dnm-prose strong { color: #0f3a2c; }
.dnm-prose table { width: 100%; border-collapse: collapse; margin-top: 1rem; }
.dnm-prose td, .dnm-prose th { border: 1px solid rgb(201 154 62 / .25); padding: .5rem .75rem; }

/* Nội dung banner trang chủ (editor): H1 → dòng phụ → mô tả */
.dnm-hero-content h1 {
	margin-top: 1rem; font-family: var(--font-display, inherit); font-size: clamp(2.4rem, 6vw, 4.2rem);
	font-weight: 800; line-height: 1.02; color: #e6c27a; text-transform: uppercase;
}
.dnm-hero-content h1 strong, .dnm-hero-content h1 b { color: #fff; font-weight: inherit; }
.dnm-hero-content p { margin-top: .75rem; font-size: .875rem; color: rgb(255 255 255 / .8); }
.dnm-hero-content h1 + p { margin-top: .75rem; font-family: var(--font-display, inherit); font-size: 1.25rem; color: inherit; }
@media (min-width: 768px) { .dnm-hero-content h1 + p { font-size: 1.5rem; } }

/* Contact Form 7 */
.dnm-cf7 .wpcf7-form { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; margin: 0; }
.dnm-cf7 .wpcf7-form > p { display: contents; }
.dnm-cf7 .hidden-fields-container,
.dnm-cf7 .screen-reader-response { display: none; }
.dnm-cf7 .wpcf7-form-control-wrap { display: block; }
.dnm-cf7 .wpcf7-form-control-wrap[data-name="your-address"],
.dnm-cf7 .wpcf7-form-control-wrap[data-name="your-doc"],
.dnm-cf7 .wpcf7-form-control-wrap[data-name="your-message"],
.dnm-cf7 .wpcf7-form-control-wrap[data-name="your-email"],
.dnm-cf7 .wpcf7-submit,
.dnm-cf7 .wpcf7-response-output,
.dnm-cf7 .wpcf7-spinner { grid-column: 1 / -1; }
.dnm-cf7 input[type="text"],
.dnm-cf7 input[type="tel"],
.dnm-cf7 input[type="email"],
.dnm-cf7 select,
.dnm-cf7 textarea {
	width: 100%; border: 1px solid rgb(201 154 62 / .4); border-radius: 5px; background: rgb(255 255 255 / .9);
	padding: .625rem .75rem; font-size: .875rem; color: #1f2a24; outline: none; font-family: inherit;
}
.dnm-cf7 input:focus, .dnm-cf7 select:focus, .dnm-cf7 textarea:focus {
	border-color: #c99a3e; box-shadow: 0 0 0 2px rgb(201 154 62 / .2);
}
.dnm-cf7 .wpcf7-submit {
	display: inline-flex; justify-content: center; cursor: pointer; border: 0; padding: .75rem 1rem;
	background: #c99a3e; color: #0a2a20; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; border-radius: 3px;
}
.dnm-cf7 .wpcf7-submit:hover { filter: brightness(1.08); }
.dnm-cf7 .wpcf7-not-valid-tip { font-size: .75rem; color: #b3261e; margin-top: .25rem; }
.dnm-cf7 .wpcf7-response-output { margin: 0 !important; padding: .5rem .75rem !important; font-size: .8rem; border-radius: 4px; }
.dnm-cf7 .wpcf7-spinner { margin: 0; }

/* Lightbox */
.dnm-lightbox {
	position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center;
	background: rgb(0 0 0 / .85); padding: 1rem;
}
.dnm-lightbox.is-open { display: flex; }
.dnm-lightbox img { max-width: 100%; max-height: 100%; border-radius: 6px; }
.dnm-lightbox button {
	position: absolute; top: 1rem; right: 1rem; width: 2.5rem; height: 2.5rem; border-radius: 9999px;
	background: #fff; color: #0f3a2c; font-size: 1.5rem; line-height: 1;
}

/* Bản đồ nhúng trang Liên hệ */
.dnm-map iframe { display: block; width: 100%; height: 420px; border: 0; }

/* Tiện ích cho trang Giới thiệu / Liên hệ (chưa có trong CSS demo đã biên dịch) */
.items-start { align-items: flex-start; }
.max-w-4xl { max-width: 56rem; }
.order-1 { order: 1; }
.order-2 { order: 2; }
.text-\[14px\] { font-size: 14px; }
@media (min-width: 768px) {
	.md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.md\:gap-12 { gap: 3rem; }
	.md\:order-1 { order: 1; }
	.md\:order-2 { order: 2; }
	.md\:text-5xl { font-size: 3rem; line-height: 1; }
}
@media (min-width: 1024px) {
	.lg\:grid-cols-\[1fr_1\.2fr\] { grid-template-columns: 1fr 1.2fr; }
}

/* Điện thoại / iPad: nút liên hệ nổi nhỏ gọn để không che nội dung */
@media (max-width: 1023px) {
	.dnm-float { bottom: .75rem; right: .5rem; gap: .5rem; }
	.dnm-float .ring { width: 2.5rem; height: 2.5rem; }
	.dnm-float .ring .shake { font-size: 1rem; }
	.dnm-float .ring .shake.text-\[11px\] { font-size: 10px; }
	.dnm-float .pointer-events-none { display: none; }
}
@media (max-width: 767px) {
	footer { padding-bottom: 3.5rem; }
}
