/*
 * ISSVN BUILD81.45.6.6.30
 * Exact bridge from Admin > Cài đặt Header/Topbar to the ISS renderer.
 * Loaded after site.css, shared PH shell CSS and the Theme Customizer CSS.
 */

/* Header surface + border size. Shared PH shell hard-codes 1px, so ISS must
   explicitly consume frontend.header_border_width here. */
body.iss-theme header.site-header.ph-unified-site-header {
  background:var(--ph-header-bg,#fff)!important;
  border-bottom-style:solid!important;
  border-bottom-color:var(--ph-header-border-color,#e4e9ee)!important;
  border-bottom-width:var(--ph-header-border-width,1px)!important;
}

/* Exact menu contract used by the PH settings panel. */
body.iss-theme header.site-header .ph-site-menu {
  justify-content:var(--ph-header-menu-justify,center)!important;
  gap:var(--ph-header-menu-gap,8px)!important;
}
body.iss-theme header.site-header .ph-menu-item>a {
  color:var(--ph-header-menu-color,#252b31)!important;
  font-family:var(--ph-header-font-family,Arial,sans-serif)!important;
  font-size:var(--ph-header-menu-font-size,16px)!important;
}
body.iss-theme header.site-header .ph-menu-item>a:hover,
body.iss-theme header.site-header .ph-menu-item:focus-within>a {
  color:var(--ph-header-menu-hover-color,#0b669f)!important;
  background:var(--ph-header-menu-hover-bg,#edf7fd)!important;
}
body.iss-theme header.site-header .ph-menu-item.active>a,
body.iss-theme header.site-header .ph-menu-item>a[aria-current="page"] {
  color:var(--ph-header-menu-active-color,#fff)!important;
  background:var(--ph-header-menu-active-bg,#0b669f)!important;
}
body.iss-theme header.site-header .ph-submenu .ph-menu-item>a:hover,
body.iss-theme header.site-header .ph-submenu .ph-menu-item>a:focus {
  color:var(--ph-header-menu-hover-color,#0b669f)!important;
  background:var(--ph-header-menu-hover-bg,#edf7fd)!important;
}

/* Topbar: consume every option exposed by PH's Header settings panel. */
body.iss-theme .site-topbar.ph-public-topbar {
  background:var(--ph-topbar-bg,#0d2b45)!important;
  color:var(--ph-topbar-text,#fff)!important;
  border-bottom-style:solid!important;
  border-bottom-color:var(--ph-topbar-border,#173b59)!important;
  border-bottom-width:var(--ph-topbar-border-width,1px)!important;
  font-family:var(--ph-topbar-font-family,var(--ph-font-family,Arial,sans-serif))!important;
  font-size:var(--ph-topbar-font-size,14px)!important;
}
/* BUILD81.45.6.6.161 — Topbar typography is controlled by the saved variables,
   not by legacy .875rem/.78rem or responsive hard-codes. */
body.iss-theme .site-topbar :where(
  .site-topbar__inner,
  .site-topbar__contacts,
  .ph-public-topbar__contacts,
  .ph-public-topbar__item,
  .ph-public-topbar__phone-group,
  .site-topbar__lang,
  .site-topbar__lang a
){
  font-family:inherit!important;
  font-size:inherit!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item {
  color:var(--ph-topbar-text,#fff)!important;
  text-decoration:none!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item:hover {
  color:var(--ph-topbar-hover,#fff)!important;
}
body.iss-theme .site-topbar .site-topbar__lang a {
  color:var(--ph-topbar-lang-text,var(--ph-topbar-text,#fff))!important;
  background:var(--ph-topbar-lang-bg,transparent)!important;
  border-color:var(--ph-topbar-border,#173b59)!important;
}
body.iss-theme .site-topbar .site-topbar__lang a.active,
body.iss-theme .site-topbar .site-topbar__lang a[aria-current="true"] {
  color:var(--ph-topbar-lang-active-text,#fff)!important;
  background:var(--ph-topbar-lang-active-bg,#b58b55)!important;
}

/* Mobile menu background is also an Admin Header setting. */
@media (max-width:1100px) {
  body.iss-theme header.site-header .navbar-collapse {
    background:var(--ph-header-menu-mobile-bg,#fff)!important;
  }
}

/* BUILD81.45.6.6.133: contact data comes from Website settings.
   Keep the Zalo mark compact and allow Hotline + Hotline 2 in one Topbar item. */
body.iss-theme .site-topbar .ph-public-topbar__item--zalo{
  padding:0;
  line-height:1;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo img{
  display:block;
  width:20px;
  height:20px;
  object-fit:contain;
}
body.iss-theme .site-topbar .ph-public-topbar__phone-group{
  display:inline-flex;
  align-items:center;
  gap:4px;
  white-space:nowrap;
}
body.iss-theme .site-topbar .ph-public-topbar__phone-group a{
  color:inherit;
  text-decoration:none;
}
body.iss-theme .site-topbar .ph-public-topbar__phone-group a:hover{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:3px;
}
body.iss-theme .site-topbar .ph-public-topbar__phone-separator{
  opacity:.75;
}
/* BUILD81.45.6.6.160 — Topbar icon color is a real saved System setting. */
body.iss-theme .site-topbar :where(i,svg){
  color:var(--ph-topbar-icon-color,var(--ph-topbar-text,#fff))!important;
  fill:currentColor;
}

/* BUILD109.2.158 — merged topbar-contact-v2.css; canonical header settings stays one blocking request. */
/* BUILD107.2.6 — ISS Topbar Contact Manager base styles.
   BUILD109.2.5 now owns the presentation semantics through ContactPointService;
   standalone Zalo hides its raw value only in Icon mode.
*/
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline{
  display:inline-flex!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:auto!important;
  min-width:max-content!important;
  max-width:none!important;
  white-space:nowrap!important;
  line-height:1.2!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__dual-actions{
  display:inline-flex!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:6px!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:max-content!important;
  margin:0 8px 0 0!important;
  white-space:nowrap!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__dual-action,
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__phone-separator,
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__contact-label,
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__value-link,
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline strong{
  display:inline-flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  width:auto!important;
  white-space:nowrap!important;
  line-height:1.2!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__phone-separator{
  margin:0!important;
  opacity:.78!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__contact-icon-img--zalo{
  display:block!important;
  width:20px!important;
  height:20px!important;
  flex:0 0 20px!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__dual-action > i{
  display:block!important;
  line-height:1!important;
}
/* Second Zalo contact: icon + Zalo label only. Never force its raw phone value into Topbar. */
body.iss-theme .site-topbar .ph-public-topbar__item--zalo{
  display:inline-flex!important;
  flex-flow:row nowrap!important;
  align-items:center!important;
  white-space:nowrap!important;
}
@media (max-width:767.98px){
  body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline{
    min-width:0!important;
  }
  body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__dual-actions{
    min-width:max-content!important;
  }
}

/* BUILD109.2.33 follow-up — type-specific Topbar spacing.
   Do not use one shared .ph-public-topbar__item gap contract. */
body.iss-theme .site-topbar .ph-public-topbar__contact--zalo-hotline{
  gap:7px!important;
  margin-right:18px!important;
}
body.iss-theme .site-topbar .ph-public-topbar__contact--hotline,
body.iss-theme .site-topbar .ph-public-topbar__contact--landline{
  gap:8px!important;
  margin-right:18px!important;
}
body.iss-theme .site-topbar .ph-public-topbar__contact--switchboard{
  gap:8px!important;
  margin-right:18px!important;
}
body.iss-theme .site-topbar .ph-public-topbar__contact--email{
  gap:8px!important;
  margin-right:0!important;
}
body.iss-theme .site-topbar .ph-public-topbar__contact--zalo,
body.iss-theme .site-topbar .ph-public-topbar__contact--whatsapp,
body.iss-theme .site-topbar .ph-public-topbar__contact--messenger,
body.iss-theme .site-topbar .ph-public-topbar__contact--custom{
  gap:8px!important;
  margin-right:18px!important;
}
body.iss-theme .site-topbar [class*="ph-public-topbar__contact--"] .ph-public-topbar__contact-icon{
  margin:0!important;
  flex:0 0 auto!important;
}
body.iss-theme .site-topbar .ph-public-topbar__phone-group{
  gap:7px!important;
}
body.iss-theme .site-topbar .ph-public-topbar__phone-group .ph-public-topbar__phone-separator{
  margin:0 2px!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item > :where(i,svg,img),
body.iss-theme .site-topbar .ph-public-topbar__phone-group > :where(i,svg,img){
  flex:0 0 auto;
}


/* BUILD109.2.5 — ContactPointService presentation contract.
   Zalo/Hotline now follows the same four-state display style as every contact:
   icons (when enabled) + optional label + its own configured value. */
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__dual-actions{
  margin:0 1px 0 0!important;
  gap:5px!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__value-link{
  display:inline-flex!important;
  align-items:center!important;
  white-space:nowrap!important;
}
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__contact-label,
body.iss-theme .site-topbar .ph-public-topbar__item--zalo-hotline .ph-public-topbar__contact-value{
  white-space:nowrap!important;
}

/* BUILD109.2.158 — merged typography-unified.css; preserve one-font contract without extra request. */
/*
 * ISSVN BUILD81.45.6.6.77
 * One-font frontend contract.
 *
 * Source of truth: Theme Customizer / Website settings -> font_family -> --ph-font-family.
 * No page/module is allowed to choose Inter, Arial, Times New Roman, heading font, or menu font independently.
 */
:root{
  --iss-site-font:var(--ph-font-family,Arial,sans-serif);
}

body.iss-theme{
  font-family:var(--iss-site-font)!important;
  font-synthesis:none;
}

/* Text-bearing containers inherit the single site font. */
body.iss-theme :where(
  main,header,footer,nav,section,article,aside,form,fieldset,legend,table,
  h1,h2,h3,h4,h5,h6,p,a,span,strong,b,em,label,small,li,dt,dd,th,td,
  input,textarea,select,button,option
){
  font-family:var(--iss-site-font)!important;
}

/* Explicitly neutralize the old separate heading/menu/footer font branches. */
body.iss-theme :where(h1,h2,h3,h4,h5,h6),
body.iss-theme .site-header,
body.iss-theme .site-header .ph-site-menu,
body.iss-theme .site-header .site-nav,
body.iss-theme .site-topbar,
body.iss-theme .iss-footer,
body.iss-theme .iss-footer :where(h1,h2,h3,h4,h5,h6){
  font-family:var(--iss-site-font)!important;
}

/* Form controls must not fall back to the UA/old module font. */
body.iss-theme :where(input,textarea,select,button){
  font:inherit;
}

/* Keep icon fonts owned by their icon libraries. */
body.iss-theme :where(
  i.fa,i.fas,i.far,i.fab,i.fa-solid,i.fa-regular,i.fa-brands,
  [class^="fa-"],[class*=" fa-"]
){
  font-family:"Font Awesome 6 Free","Font Awesome 6 Brands"!important;
}
body.iss-theme :where(i.fa-brands,[class^="fa-brands"],[class*=" fa-brands"]){
  font-family:"Font Awesome 6 Brands"!important;
}