/* ===== Việc 1: Ẩn floating banner 4 nút ở bottom ===== */
#brxe-owxepj {
    display: none !important;
}

/* ===== Việc 3: Ẩn SĐT và Zalo trong footer ===== */
/* Ẩn paragraph "Hotline / Zalo: 0899991131" - p thứ 4 trong #brxe-ffxvfc */
#brxe-ffxvfc p:nth-child(4) {
    display: none !important;
}


/* ── CTA Button J.A.I — dùng cho mọi trang ─────────────────────────── */
@keyframes jai-breathe {
    0%, 100% { box-shadow: 0 2px 12px rgba(27,150,254,0.2), 0 0 0 0 rgba(27,150,254,0.15); }
    50%       { box-shadow: 0 4px 20px rgba(27,150,254,0.35), 0 0 0 8px rgba(27,150,254,0); }
}
.jai-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: linear-gradient(135deg, #e0f0ff, #ede9fe);
    color: #1B96FE;
    border: 1.5px solid rgba(27,150,254,0.25);
    padding: 14px 28px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 50px;
    cursor: pointer;
    text-decoration: none;
    animation: jai-breathe 2.5s ease-in-out infinite;
    transition: background 0.2s, color 0.2s, transform 0.2s;
}
.jai-cta-btn::before {
    content: '';
    display: inline-block;
    width: 16px;
    height: 16px;
    background-color: currentColor;
    -webkit-mask: url('/wp-content/plugins/jay-functions/snippets/jai-spark.svg') center/contain no-repeat;
    mask: url('/wp-content/plugins/jay-functions/snippets/jai-spark.svg') center/contain no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
    vertical-align: middle;
    margin-right: 6px;
    flex-shrink: 0;
}
.jai-cta-btn:hover {
    background: linear-gradient(135deg, #1B96FE, #8B5CF6);
    color: #fff;
    border-color: transparent;
    transform: translateY(-2px);
    text-decoration: none;
    animation: none;
    box-shadow: 0 6px 24px rgba(27,150,254,0.4);
}


/* ═══════════════════════════════════════════
   Jay Header Override — injected by NoCode
   Hide Bricks header, replace with Jay Header
   ═══════════════════════════════════════════ */

/* Hide Bricks Builder header */
#brx-header,
.brxe-header,
header#brx-header {
    display: none !important;
}

/* ── Jay Header CSS ─────────────────────── */

  /* ── CSS Variables (scanned from jaybranding.com) ── */
  :root {
    --jay-blue:     #1B96FE;
    --jay-purple:   #8B5CF6;
    --jay-bg:       #ffffff;
    --jay-text:     #1a1a2e;
    --jay-muted:    #6b7280;
    --jay-border:   rgba(27,150,254,0.18);
    --jay-overlay:  rgba(0,0,0,0.55);
    --jay-offcanvas-w: 320px;
    --jay-header-h: 64px;
    --jay-radius:   12px;
    --jay-font:     'Lexend', 'Nunito', -apple-system, sans-serif;
  }

  .jay-header *, .jay-header *::before, .jay-header *::after,
  .jay-offcanvas *, .jay-offcanvas *::before, .jay-offcanvas *::after,
  .jay-overlay *, .jay-oc-close-fixed * { box-sizing: border-box; margin: 0; padding: 0; }

  /* body font/bg/color removed — do not override page styles */

  /* ── HEADER ── */
  .jay-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: var(--jay-header-h);
    background: rgba(255,255,255,0.55);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-bottom: 1px solid var(--jay-border);
    box-shadow: 0 2px 16px rgba(27,150,254,0.07);
    z-index: 9999;
    transition: transform 0.3s ease;
  }
  /* Issue 1: push content below fixed header — via .jay-header-spacer div, not body */

  .jay-header-spacer { height: var(--jay-header-h, 64px); }

  .jay-header.hidden {
    transform: translateY(-100%);
  }
  .jay-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
    height: 100%;
    width: 100%;
    gap: 12px;
  }
  .jay-header-left  { flex: 0 0 auto; display: flex; align-items: center; }
  .jay-header-center { flex: 1; display: flex; justify-content: center; align-items: center; }
  .jay-header-right  { flex: 0 0 auto; display: flex; align-items: center; justify-content: flex-end; }

  /* ── LEFT: Hamburger ── */
  .jay-hamburger {
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    border-radius: 8px;
    color: var(--jay-text);
    transition: background 0.2s;
    line-height: 1;
  }
  .jay-hamburger:hover { background: rgba(27,150,254,0.08); }
  .jay-hamburger svg { display: block; width: 24px; height: 24px; }

  /* ── CENTER: Logo ── */
  .jay-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
  }
  .jay-logo img {
    height: 36px;
    width: auto;
    display: block;
  }

  /* ── RIGHT: Chat AI Button ── */
  @keyframes jai-breathe {
    0%,100% { box-shadow: 0 2px 12px rgba(27,150,254,0.2), 0 0 0 0 rgba(27,150,254,0.15); }
    50%      { box-shadow: 0 4px 20px rgba(27,150,254,0.35), 0 0 0 8px rgba(27,150,254,0); }
  }

  .jai-cta-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    background: linear-gradient(135deg, #e0f0ff, #ede9fe);
    color: var(--jay-blue);
    border: 1.5px solid rgba(27,150,254,0.25);
    padding: 9px 18px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 50px;
    cursor: pointer;
    text-decoration: none;
    animation: jai-breathe 2.5s ease-in-out infinite;
    transition: background 0.2s, color 0.2s, transform 0.2s;
    white-space: nowrap;
    font-family: var(--jay-font);
  }
  .jai-cta-btn:hover {
    background: linear-gradient(135deg, var(--jay-blue), var(--jay-purple));
    color: #fff;
    border-color: transparent;
    transform: translateY(-2px);
    animation: none;
    box-shadow: 0 6px 24px rgba(27,150,254,0.4);
  }


  /* ── Fixed close button (outside offcanvas) ── */
  .jay-oc-close-fixed {
    display: none;
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 100002;
    background: none;
    border: 2px solid rgba(255,255,255,0.7);
    color: #fff;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    font-size: 18px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, border-color 0.2s;
    line-height: 1;
  }
  .jay-oc-close-fixed.open {
    display: flex;
  }
  .jay-oc-close-fixed:hover {
    background: rgba(255,255,255,0.15);
    border-color: #fff;
  }


  /* ── Google CSE inline results in offcanvas ── */
  .jay-oc-search .gsc-results-wrapper-overlay,
  .jay-oc-search .gsc-results-wrapper-nooverlay,
  .jay-oc-search .gsc-resultsbox-visible {
    position: static !important;
    box-shadow: none !important;
    border-top: 1px solid var(--jay-border);
    max-height: 60vh;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  /* iOS momentum scroll on the search section itself */
  .jay-oc-search {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .jay-oc-search .gsc-results-wrapper-visible { position: static !important; }
  .jay-oc-search .gsc-above-wrapper-area { display: none; }
  .jay-oc-search .gs-result .gs-title { font-size: 13px !important; }
  .jay-oc-search .gsc-webResult { padding: 8px 0 !important; }
  .jay-oc-search table.gsc-results { width: 100% !important; }
  /* All possible result containers */
  .gsc-results-wrapper-overlay,
  .gsc-results-wrapper-nooverlay,
  .gsc-resultsbox-visible {
    max-height: 60vh !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* ── OVERLAY ── */
  .jay-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: var(--jay-overlay);
    z-index: 100000;
    opacity: 0;
    transition: opacity 0.3s;
  }
  .jay-overlay.open {
    display: block;
    animation: fadeIn 0.3s forwards;
  }
  @keyframes fadeIn { to { opacity: 1; } }

  /* ── OFFCANVAS ── */
  .jay-offcanvas {
    position: fixed;
    top: 0; left: 0; bottom: 0;
    width: var(--jay-offcanvas-w);
    max-width: 90vw;
    background: var(--jay-bg);
    z-index: 100001;
    transform: translateX(-100%);
    transition: transform 0.32s cubic-bezier(0.4,0,0.2,1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 4px 0 32px rgba(0,0,0,0.12);
  }
  .jay-offcanvas.open { transform: translateX(0); }

  /* Offcanvas top bar */
  .jay-oc-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--jay-border);
    flex-shrink: 0;
  }
  .jay-oc-top img { height: 32px; width: auto; }
  .jay-oc-close {
    background: none; border: none; cursor: pointer;
    width: 32px; height: 32px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    color: var(--jay-muted);
    transition: background 0.2s, color 0.2s;
    font-size: 20px;
  }
  .jay-oc-close:hover { background: #fee2e2; color: #ef4444; }

  /* Search box */
  .jay-oc-search {
    padding: 14px 20px 10px;
    border-bottom: 1px solid var(--jay-border);
    flex-shrink: 0;
  }
  .jay-oc-search-wrap {
    position: relative;
    display: flex;
    align-items: center;
  }
  .jay-oc-search-wrap svg {
    position: absolute; left: 12px;
    width: 16px; height: 16px;
    color: var(--jay-muted); pointer-events: none;
  }
  .jay-oc-search input {
    width: 100%;
    height: 38px;
    background: #f5f5f5;
    border: 1px solid #d3d3d3;
    border-radius: 20px;
    padding: 5px 12px 5px 36px;
    font-size: 15px;
    font-family: var(--jay-font);
    outline: none;
    transition: border 0.2s, box-shadow 0.2s;
  }
  .jay-oc-search input:focus {
    border-color: var(--jay-blue);
    box-shadow: 0 0 0 3px rgba(27,150,254,0.12);
  }

  /* Nav menu */
  .jay-oc-nav {
    flex: 1;
    overflow-y: auto;
    padding: 8px 0;
  }
  .jay-oc-nav ul { list-style: none; }
  .jay-oc-nav > ul > li { border-bottom: 1px solid rgba(0,0,0,0.04); }

  /* Top-level item */
  .jay-nav-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 20px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    color: var(--jay-text);
    transition: background 0.15s, color 0.15s;
    user-select: none;
    text-transform: uppercase;
    letter-spacing: 0.04em;
  }
  .jay-nav-item:hover { background: rgba(27,150,254,0.06); color: var(--jay-blue); }
  .jay-nav-item a {
    color: inherit; text-decoration: none; flex: 1;
    display: flex; align-items: center; gap: 8px;
  }
  .jay-nav-item .chevron {
    width: 18px; height: 18px; flex-shrink: 0;
    color: var(--jay-muted);
    transition: transform 0.25s;
  }
  .jay-nav-item.open .chevron { transform: rotate(90deg); }

  /* Sub-menu */
  .jay-submenu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    background: #fafbff;
  }
  .jay-submenu.open { max-height: 600px; }
  .jay-submenu li a {
    display: flex; align-items: center; gap: 8px;
    padding: 9px 20px 9px 36px;
    font-size: 13px;
    color: var(--jay-text);
    text-decoration: none;
    transition: color 0.15s, background 0.15s;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
  }
  .jay-submenu li a:hover { color: var(--jay-blue); background: rgba(27,150,254,0.04); }
  .jay-submenu li a::before {
    content: '–';
    font-size: 13px;
    color: var(--jay-muted);
    flex-shrink: 0;
  }

  /* Footer info */
  .jay-oc-footer {
    padding: 16px 20px;
    border-top: 1px solid var(--jay-border);
    background: #fafbff;
    flex-shrink: 0;
    font-size: 12.5px;
    color: var(--jay-muted);
    line-height: 1.7;
  }
  .jay-oc-footer strong { color: var(--jay-text); display: block; margin-bottom: 4px; font-size: 13px; }

  /* ── Page content spacer ── */
  .page-body { margin-top: var(--jay-header-h); padding: 40px 24px; }
  .page-body h1 { font-size: 24px; color: var(--jay-text); margin-bottom: 12px; }
  .page-body p { color: var(--jay-muted); font-size: 15px; line-height: 1.7; }

  /* ── Offcanvas slide + stagger animation ── */
  @keyframes fadeInUp {
    from { opacity: 0; transform: translateY(14px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  /* Hide items until offcanvas is animating */
  .jay-offcanvas.is-animating .jay-oc-nav > ul > li {
    opacity: 0;
    animation: fadeInUp 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }

  /* Stagger per list item */
  .jay-offcanvas.is-animating .jay-oc-nav > ul > li:nth-child(1) { animation-delay: 0.15s; }
  .jay-offcanvas.is-animating .jay-oc-nav > ul > li:nth-child(2) { animation-delay: 0.30s; }
  .jay-offcanvas.is-animating .jay-oc-nav > ul > li:nth-child(3) { animation-delay: 0.45s; }
  .jay-offcanvas.is-animating .jay-oc-nav > ul > li:nth-child(4) { animation-delay: 0.60s; }
  .jay-offcanvas.is-animating .jay-oc-nav > ul > li:nth-child(5) { animation-delay: 0.75s; }


  /* Submenu item stagger */
  .jay-offcanvas.is-animating .jay-submenu.open li {
    opacity: 0;
    animation: fadeInUp 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
  }
  .jay-offcanvas.is-animating .jay-submenu.open li:nth-child(1) { animation-delay: 0.25s; }
  .jay-offcanvas.is-animating .jay-submenu.open li:nth-child(2) { animation-delay: 0.30s; }
  .jay-offcanvas.is-animating .jay-submenu.open li:nth-child(3) { animation-delay: 0.35s; }
  .jay-offcanvas.is-animating .jay-submenu.open li:nth-child(4) { animation-delay: 0.40s; }

  /* Reset when closed */
  .jay-offcanvas:not(.is-animating) .jay-oc-nav > ul > li {
    opacity: 1;
    animation: none;
  }


  /* ── Mobile responsive ── */
  @media (max-width: 480px) {
    .jay-header-inner { padding: 0 12px; gap: 8px; }
    .jay-logo img { max-height: 28px; max-width: 110px; }
    .jai-cta-btn {
      padding: 7px 12px;
      font-size: 12px;
      white-space: nowrap;
    }
  }
  @media (min-width: 481px) and (max-width: 768px) {
    .jay-header-inner { padding: 0 16px; gap: 10px; }
    .jay-logo img { max-height: 30px; }
    .jai-cta-btn { padding: 8px 14px; font-size: 13px; }
  }


  @media (max-width: 359px) {
    .jai-cta-btn .btn-text { display: none; }
    .jai-cta-btn { padding: 7px 8px; min-width: 32px; }
  }


/* ── /build page — hide WP post chrome ── */
.page-id-64996 #brxe-kydbhd,
.page-id-64996 #brxe-c84d73,
.page-id-64996 #brxe-zigqzk {
  display: none !important;
}

/* ── Strip WP figure wrapper around tables (single-table.php handles styling) ── */
.brxe-post-content figure.wp-block-table {
  margin: 0;
  padding: 0;
}


/* Center JAI CTA button when inside post content */
.brxe-post-content .jai-cta-btn,
.entry-content .jai-cta-btn,
.post-content .jai-cta-btn {
    display: flex;
    width: fit-content;
    margin: 16px auto;
}