/* Header (Kit) — template Elementor loại Header (Kit) của plugin trungdev-elementor-kit (Templates › Header (Kit)).
   Container mang class thiết kế (.topbar, .topbar__inner, .site-header, .header__inner) → rule mục 5 của site.css áp thẳng;
   file này chỉ vá chỗ DOM widget khác DOM thiết kế: Icon List làm mục topbar, Social Icons cỡ nhỏ, Site Logo, Nav Menu (Kit).
   Màu/chữ/khoảng cách menu đặt bằng control của widget (sửa trong editor); ở đây chỉ phần control không có. */

/* Topbar: mỗi mục = Icon List 1 dòng (icon + nhãn + nội dung), khoảng cách 7px như .topbar__item */
.elementor .topbar__item .elementor-icon-list-items { margin: 0; padding: 0; }
.elementor .topbar__item .elementor-icon-list-item { display: flex; gap: 7px; align-items: center; margin: 0; padding: 0; }
/* widget-icon-list.min.css nạp SAU file này: icon có margin phải .25em, chữ có padding-inline-start 5px (0,3,0) → đè ở (0,4,0) */
.elementor .topbar__item { --e-icon-list-icon-size: 14px; --e-icon-list-icon-margin: 0; white-space: nowrap; }
.elementor .topbar__item .elementor-icon-list-icon svg { fill: var(--slate-2); }
.elementor .topbar__item .elementor-icon-list-item .elementor-icon-list-text {
  display: flex; gap: 7px; align-items: center; padding-inline-start: 0; color: inherit;
}
.elementor .topbar__item .elementor-icon-list-text a { color: #16202e; }

/* Social topbar: tròn 27px viền xanh nhạt (khác bản lớn ở footer — mục 9.7 site.css) */
.elementor .topbar .social { margin-left: auto; }
.elementor .topbar .social .elementor-social-icons-wrapper { gap: 8px; }
.elementor .topbar .social .elementor-social-icon { width: 27px; height: 27px; background: transparent; border-color: #bfd4ef; }
.elementor .topbar .social .elementor-social-icon:hover { background: #d8e6f8; }
.elementor .topbar .social .elementor-social-icon svg { width: 13px; height: 13px; }

/* Hàng header: logo | menu (giữa) | nút báo giá — như .nav { margin: 0 auto } + .header__actions { padding-left: 20px } */
.elementor .e-con.header__inner { --flex-wrap: nowrap; }
.elementor .header__nav { margin: 0 auto; }
.elementor .header__cta { padding-left: 20px; }
.elementor .logo .tdek-logo__link { display: flex; }

/* Menu cấp 1: không gạch dưới khi hover (thiết kế chỉ đổi màu), mục đang xem đậm 700; caret cách chữ 6px */
.elementor .header__nav .tdek-nav__menu > .tdek-nav__item > .tdek-nav__link { gap: 6px; }
.elementor .header__nav .tdek-nav__menu > .tdek-nav__item > .tdek-nav__link:not(.is-active):hover::after { opacity: 0; }
.elementor .header__nav .tdek-nav__menu > .tdek-nav__item > .tdek-nav__link.is-active { font-weight: 700; }
/* Dropdown: lệch trái 14px, các mục cách nhau 2px */
.elementor .header__nav .tdek-nav__menu > .tdek-nav__item > .tdek-nav__sub { left: -14px; }
.elementor .header__nav .tdek-nav__sub .tdek-nav__item + .tdek-nav__item { margin-top: 2px; }
/* Mục "Get a Quote" trong menu (class nav-cta ở Giao diện › Menu) chỉ hiện trong menu xổ ở màn ≤480px */
.elementor .header__nav .nav-cta { display: none; }

/* Burger (≤1024px — breakpoint tablet của Elementor): nút viền mảnh bên trái nút báo giá, menu xổ ngay dưới header */
@media (max-width: 1024px) {
  .elementor .e-con.header__inner { --column-gap: 16px; gap: 16px; }
  .elementor .header__nav { margin: 0 0 0 auto; }
  .elementor .header__cta { padding-left: 0; }
  .elementor .header__nav .tdek-nav button.tdek-nav__burger { border: 1px solid var(--input-line); }
  .elementor .header__nav .tdek-nav { --tdek-nav-mobile-pad: 14px var(--gutter); }
  .elementor .header__nav .tdek-nav__menu { border-top: 1px solid var(--line); }
}

/* Rule burger của widget là {{WRAPPER}} .tdek-nav .tdek-nav__menu .tdek-nav__item > .tdek-nav__link (0,7,0) → nút CTA cần (0,8,0) */
@media (max-width: 480px) {
  .elementor .header__cta { display: none; }
  .elementor .elementor-element.header__nav .tdek-nav .tdek-nav__menu > .tdek-nav__item.nav-cta {
    display: flex; padding: 14px var(--gutter); border-top: 0;
  }
  .elementor .elementor-element.header__nav .tdek-nav .tdek-nav__menu > .tdek-nav__item.nav-cta > .tdek-nav__link {
    justify-content: center; padding: 11px 20px; border-radius: 8px;
    background: var(--blue); color: #fff; font-size: 14px; text-transform: none; letter-spacing: 0;
  }
}