/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 12 2026 | 13:27:56 */
/* =========================================================
   NEXT GROUP — Brand v2.0 cho nextentertainment.vn
   Theme: Twenty Twenty-Five + Kadence Blocks (CF7, WPForms)
   Concept: "INDOOR · NIGHT"
   Bản 2.1 (12/11/2026): thêm mục 12 sửa chữ chìm.
   Gỡ bỏ: tắt (Deactivate) đoạn CSS này là web về như cũ.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&family=Bricolage+Grotesque:opsz,wght@12..96,700;12..96,800&family=JetBrains+Mono:wght@400;500&display=swap');

/* ---------- 1. BRAND TOKENS ---------- */
:root,
body {
  --ng-forest:      #0C2A1B; /* Forest Midnight — nền chính   */
  --ng-forest-mid:  #1A4A30; /* Forest Mid — card, ô nhập     */
  --ng-ink:         #060F0A; /* Stage Ink — header, footer    */
  --ng-butter:      #F5D82E; /* Butter Spotlight — điểm nhấn  */
  --ng-cream:       #F3EED8; /* Paper Cream — chữ chính       */
  --ng-bone:        #E9E2C6; /* Bone — chữ phụ                */
  --ng-green:       #2C6B40; /* Daylight Green — section head */
  --ng-red:         #B03A2E; /* Warning Red — cảnh báo        */
  --ng-blue:        #6FA1E6; /* Comp Blue — LuxPro / BTS      */
  --ng-line:        rgba(243, 238, 216, 0.18);

  --ng-font-body:    'Be Vietnam Pro', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ng-font-display: 'Bricolage Grotesque', 'Be Vietnam Pro', sans-serif;
  --ng-font-mono:    'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;

  /* Ghi đè bảng màu mặc định của Twenty Twenty-Five */
  --wp--preset--color--base:     var(--ng-forest)     !important;
  --wp--preset--color--contrast: var(--ng-cream)      !important;
  --wp--preset--color--accent-1: var(--ng-butter)     !important;
  --wp--preset--color--accent-2: var(--ng-forest-mid) !important;
  --wp--preset--color--accent-3: var(--ng-green)      !important;
  --wp--preset--color--accent-4: var(--ng-bone)       !important;
  --wp--preset--color--accent-5: var(--ng-ink)        !important;
  --wp--preset--color--accent-6: var(--ng-line)       !important;

  /* Ghi đè font mặc định (Manrope / Fira Code) */
  --wp--preset--font-family--manrope:   var(--ng-font-body) !important;
  --wp--preset--font-family--fira-code: var(--ng-font-mono) !important;
  --wp--preset--font-family--montserrat: var(--ng-font-body) !important;
}

/* ---------- 2. NỀN & CHỮ ---------- */
html,
body {
  background-color: var(--ng-forest) !important;
  color: var(--ng-cream) !important;
  font-family: var(--ng-font-body) !important;
  -webkit-font-smoothing: antialiased;
}

body p,
body li,
body td,
body th,
body label,
body input,
body textarea,
body select,
body button {
  font-family: var(--ng-font-body) !important;
}

::selection {
  background: var(--ng-butter);
  color: var(--ng-forest);
}

/* ---------- 3. TIÊU ĐỀ ---------- */
body h1, body h2, body h3,
body .wp-block-heading,
body .wp-block-post-title,
body .vc_custom_heading {
  font-family: var(--ng-font-display) !important;
  font-weight: 800 !important;
  color: var(--ng-cream);
  letter-spacing: -0.02em;
  line-height: 1.15 !important; /* đủ chỗ cho dấu tiếng Việt */
}

body h4, body h5, body h6 {
  font-family: var(--ng-font-body) !important;
  font-weight: 700 !important;
  color: var(--ng-cream);
  line-height: 1.3 !important;
}

/* Chữ in đậm trong tiêu đề sẽ thành màu vàng */
body h1 strong, body h2 strong, body h3 strong {
  color: var(--ng-butter);
}

/* ---------- 4. LIÊN KẾT ---------- */
body a {
  color: var(--ng-butter);
  text-decoration-thickness: 1px;
  text-underline-offset: 0.2em;
}
body a:hover,
body a:focus {
  color: var(--ng-cream);
}

/* ---------- 5. HEADER & MENU ---------- */
body header.wp-block-template-part,
body .wp-site-blocks > header {
  background-color: var(--ng-ink) !important;
  border-bottom: 1px solid var(--ng-line);
}

body .wp-block-site-title,
body .wp-block-site-title a {
  font-family: var(--ng-font-display) !important;
  font-weight: 800 !important;
  color: var(--ng-cream) !important;
}

body .wp-block-navigation,
body .wp-block-navigation a,
body .wp-block-navigation-item__content {
  font-family: var(--ng-font-body) !important;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--ng-cream) !important;
  text-decoration: none;
}
body .wp-block-navigation a:hover,
body .wp-block-navigation .current-menu-item > a {
  color: var(--ng-butter) !important;
}

/* Menu con */
body .wp-block-navigation .wp-block-navigation__submenu-container {
  background-color: var(--ng-forest-mid) !important;
  border: 1px solid var(--ng-line) !important;
  color: var(--ng-cream) !important;
}

/* Menu trên điện thoại */
body .wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--ng-forest) !important;
  color: var(--ng-cream) !important;
}

/* ---------- 6. NÚT BẤM ---------- */
body .wp-block-button__link,
body .wp-element-button,
body input[type="submit"],
body button[type="submit"],
body .wpcf7-submit,
body .wpforms-submit,
body .vc_btn3,
body .vc_general.vc_btn3 {
  background-color: var(--ng-butter) !important;
  color: var(--ng-forest) !important;
  border: 2px solid var(--ng-butter) !important;
  border-radius: 2px !important;
  font-family: var(--ng-font-body) !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em;
  text-decoration: none !important;
  transition: background-color .2s ease, color .2s ease;
}
body .wp-block-button__link:hover,
body .wp-element-button:hover,
body input[type="submit"]:hover,
body .wpcf7-submit:hover,
body .wpforms-submit:hover,
body .vc_btn3:hover {
  background-color: var(--ng-cream) !important;
  border-color: var(--ng-cream) !important;
  color: var(--ng-forest) !important;
}

/* Nút dạng viền */
body .is-style-outline .wp-block-button__link {
  background-color: transparent !important;
  color: var(--ng-butter) !important;
  border-color: var(--ng-butter) !important;
}
body .is-style-outline .wp-block-button__link:hover {
  background-color: var(--ng-butter) !important;
  color: var(--ng-forest) !important;
}

/* ---------- 7. FORM LIÊN HỆ (CF7, WPForms) ---------- */
body input[type="text"],
body input[type="email"],
body input[type="tel"],
body input[type="url"],
body input[type="number"],
body input[type="search"],
body textarea,
body select {
  background-color: var(--ng-forest-mid) !important;
  color: var(--ng-cream) !important;
  border: 1px solid var(--ng-line) !important;
  border-radius: 2px !important;
}
body input::placeholder,
body textarea::placeholder {
  color: var(--ng-bone);
  opacity: 0.6;
}
body input:focus,
body textarea:focus,
body select:focus {
  outline: 2px solid var(--ng-butter) !important;
  outline-offset: 1px;
  border-color: var(--ng-butter) !important;
}

/* ---------- 8. NHÃN KỸ THUẬT / SỐ LIỆU ---------- */
body code, body pre, body kbd,
body .wp-block-post-date,
body .wp-block-post-terms,
body .wp-block-post-author-name,
body figcaption,
body .wp-element-caption {
  font-family: var(--ng-font-mono) !important;
  font-size: 0.85em;
  letter-spacing: 0.02em;
  color: var(--ng-bone);
}

/* ---------- 9. ĐƯỜNG KẺ, BẢNG, KHỐI TRÍCH ---------- */
body hr,
body .wp-block-separator {
  border-color: var(--ng-line) !important;
  color: var(--ng-line) !important;
  background-color: var(--ng-line) !important;
}
body table, body th, body td {
  border-color: var(--ng-line) !important;
}
body blockquote,
body .wp-block-quote {
  border-left: 3px solid var(--ng-butter) !important;
  color: var(--ng-cream);
}

/* ---------- 10. FOOTER ---------- */
body footer.wp-block-template-part,
body .wp-site-blocks > footer {
  background-color: var(--ng-ink) !important;
  color: var(--ng-bone) !important;
  border-top: 1px solid var(--ng-line);
}
body footer.wp-block-template-part a {
  color: var(--ng-bone) !important;
}
body footer.wp-block-template-part a:hover {
  color: var(--ng-butter) !important;
}

/* ---------- 11. CLASS TIỆN ÍCH ----------
   Chọn khối → Advanced → Additional CSS class → gõ tên class. */

/* Section nền Paper Cream (Trạm Mơ / PPP / đối tác) */
body .ng-section-cream {
  background-color: var(--ng-cream) !important;
  color: var(--ng-forest) !important;
}
body .ng-section-cream h1,
body .ng-section-cream h2,
body .ng-section-cream h3,
body .ng-section-cream h4,
body .ng-section-cream p,
body .ng-section-cream li {
  color: var(--ng-forest) !important;
}
body .ng-section-cream a { color: var(--ng-green) !important; }

/* Section nền Daylight Green */
body .ng-section-green {
  background-color: var(--ng-green) !important;
  color: var(--ng-cream) !important;
}

/* Khối nền vàng Butter (banner kêu gọi hành động) */
body .ng-butter {
  background-color: var(--ng-butter) !important;
  color: var(--ng-forest) !important;
}
body .ng-butter h1, body .ng-butter h2, body .ng-butter h3,
body .ng-butter p, body .ng-butter a {
  color: var(--ng-forest) !important;
}

/* Nhãn kiểu mã: 01 · EVENT MANAGEMENT */
body .ng-mono {
  font-family: var(--ng-font-mono) !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 0.8rem;
  color: var(--ng-butter);
}

/* =========================================================
   12. BẢN VÁ 2.1 (12/11/2026) — sửa chữ chìm sau khi đổi nền tối
   ========================================================= */

/* 12a. Chữ trước đây dùng màu "base" (trắng) → nay là Paper Cream */
body .has-base-color {
  color: var(--ng-cream) !important;
}

/* 12b. Khối Cover nền sáng (is-light) → chuyển sang nền tối, chữ kem */
body .wp-block-cover.is-light .wp-block-cover__background {
  background-color: var(--ng-forest) !important;
}
body .wp-block-cover.is-light .wp-block-cover__background[style*="e4e5e6"] {
  background-color: var(--ng-forest-mid) !important; /* Featured Projects */
}
body .wp-block-cover.is-light .wp-block-cover__inner-container,
body .wp-block-cover.is-light .wp-block-cover__inner-container p {
  color: var(--ng-cream) !important;
}
body .wp-block-cover.is-light .wp-block-cover__inner-container p.has-small-font-size {
  color: var(--ng-bone) !important;
  font-weight: 300 !important;
}

/* 12c. Footer: nền xám #222 → Stage Ink, chữ đọc được */
body footer.wp-block-template-part .wp-block-group.has-background {
  background-color: var(--ng-ink) !important;
}
body footer.wp-block-template-part p,
body footer.wp-block-template-part li,
body footer.wp-block-template-part .wp-block-site-tagline,
body footer.wp-block-template-part .has-text-color {
  color: var(--ng-bone) !important;
}
body footer.wp-block-template-part h1,
body footer.wp-block-template-part h2,
body footer.wp-block-template-part h3,
body footer.wp-block-template-part h4,
body footer.wp-block-template-part .wp-block-heading {
  color: var(--ng-butter) !important;
}

/* 12d. Bảng "Free Consultation" (nút + nổi góc phải) */
body .floating-wrapper > button {
  background-color: var(--ng-butter) !important;
  color: var(--ng-forest) !important;
}
body .floating-wrapper > div {
  background-color: var(--ng-forest-mid) !important;
  color: var(--ng-cream) !important;
  border: 1px solid var(--ng-line) !important;
}
body .floating-wrapper h3 {
  color: var(--ng-butter) !important;
  font-family: var(--ng-font-display) !important;
}
body .floating-wrapper .popup-item {
  background-color: var(--ng-forest) !important;
  color: var(--ng-cream) !important;
}
body .floating-wrapper .popup-item h4 {
  color: var(--ng-cream) !important;
}
body .floating-wrapper .popup-btn,
body .floating-wrapper .popup-btn:visited {
  background-color: var(--ng-butter) !important;
  color: var(--ng-forest) !important;
  text-decoration: none !important;
  font-weight: 700 !important;
}
body .floating-wrapper .popup-btn:hover {
  background-color: var(--ng-cream) !important;
  color: var(--ng-forest) !important;
}

/* 12e. Nhãn nền vàng (ví dụ "8,000 attendees") → chữ Forest */
body main .has-accent-1-background-color,
body main .has-accent-1-background-color a,
body .wp-block-cover.is-light .wp-block-cover__inner-container .has-accent-1-background-color {
  color: var(--ng-forest) !important;
  font-weight: 600;
}

/* 12f. Menu: khi rê chuột, nền vàng Butter + chữ Forest */
body .wp-block-navigation .wp-block-navigation-item a:hover,
body .wp-block-navigation .wp-block-navigation-item a:focus {
  background-color: var(--ng-butter) !important;
  color: var(--ng-forest) !important;
}

/* 12g. Logo đối tác (trang chủ): đặt trên thẻ nền kem cho rõ logo màu tối */
body .kb-gallery-wrap-id-264_43ac53-01 .kb-gal-image-radius {
  background-color: var(--ng-cream) !important;
  border-radius: 6px !important;
  padding: 6px;
}

/* 12h. Các trang con: khối nền sáng (#fff, #f9f9f9, #f0f0f0) → thẻ Forest Mid */
body main [style*="background-color:#f9f9f9"],
body main [style*="background-color:#f0f0f0"],
body main [style*="background-color:#ffffff"],
body main [style*="background-color:#fff;"],
body .wp-site-blocks [style*="background-color:#f9f9f9"],
body .wp-site-blocks [style*="background-color:#f0f0f0"],
body .kt-blocks-info-box-link-wrap,
body .kt-blocks-info-box-media,
body .wp-block-kadence-tab.kt-tab-inner-content {
  background-color: var(--ng-forest-mid) !important;
  color: var(--ng-cream) !important;
  border-color: var(--ng-line) !important;
}

/* 12i. Form liên hệ (Contact Form 7) trên nền tối */
body input[type="date"] {
  background-color: var(--ng-forest-mid) !important;
  color: var(--ng-cream) !important;
  border: 1px solid var(--ng-line) !important;
  color-scheme: dark;
}
body .wpcf7-form label,
body .wpcf7-form p,
body .wpcf7-form .wpcf7-list-item-label {
  color: var(--ng-cream) !important;
}
body .wpcf7-form a {
  color: var(--ng-butter) !important;
}
body .wpcf7-not-valid-tip,
body .wpcf7-response-output {
  color: var(--ng-butter) !important;
}

/* 12j. Tab (trang Rent Equipment): tab đang chọn nền Butter, tab khác chữ kem */
body .kt-tabs-title-list .kt-tab-title-inactive > a,
body .kt-tabs-title-list .kt-tab-title-inactive .kt-title-text {
  color: var(--ng-cream) !important;
}
body .kt-tabs-title-list .kt-tab-title-inactive > a {
  border-color: var(--ng-line) !important;
}
body .kt-tabs-title-list .kt-tab-title-active > a {
  background-color: var(--ng-butter) !important;
}
body .kt-tabs-title-list .kt-tab-title-active > a,
body .kt-tabs-title-list .kt-tab-title-active .kt-title-text {
  color: var(--ng-forest) !important;
}

/* 12k. Info box (trang Event Management): mô tả chữ Bone */
body .kt-blocks-info-box-link-wrap p,
body .kt-blocks-info-box-link-wrap em,
body .kt-blocks-info-box-text {
  color: var(--ng-bone) !important;
}

/* 12l. Tab WPBakery (trang Tuyển dụng / Recruitment) */
body .vc_tta.vc_general .vc_tta-panels,
body .vc_tta.vc_general .vc_tta-panel-body,
body .vc_tta.vc_general .vc_tta-panel-heading {
  background-color: var(--ng-forest-mid) !important;
  border-color: var(--ng-line) !important;
  color: var(--ng-cream) !important;
}
body .vc_tta.vc_general .vc_tta-tab > a,
body .vc_tta.vc_general .vc_tta-panel-title > a {
  background-color: var(--ng-forest) !important;
  border-color: var(--ng-line) !important;
  color: var(--ng-cream) !important;
}
body .vc_tta.vc_general .vc_tta-tab.vc_active > a,
body .vc_tta.vc_general .vc_tta-panel.vc_active .vc_tta-panel-title > a {
  background-color: var(--ng-butter) !important;
  color: var(--ng-forest) !important;
}
