/* YHN 3.9.55.75 — context split from legacy yhn-site.css; selector declarations unchanged. */
/* Blog search form */
.tintuc-post-search,
.post-search-on-results{
	max-width: 820px;
	margin: 10px auto;
}
.yhng-search-input{
	width: 100%;
	padding: 14px 18px;
	border-radius: 10px;
	border: 1px solid #ddd;
	font-size: 16px;
	background: #fff;
}
.yhng-search-input:focus{
	outline: none;
	border-color: #fe259a;
	box-shadow: 0 0 0 3px rgba(254,37,154,.08);
}

/* Smart chips */
.yhng-smart-chips{
	max-width: 820px;
	margin: 8px auto 18px;
	padding: 0 2px;
}
.yhng-chip-row{
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}
.yhng-chip-label{
	font-size: 13px;
	opacity: .7;
	margin-right: 2px;
}
.yhng-chip{
	display: inline-block;
	padding: 7px 10px;
	border-radius: 999px;
	border: 1px solid #e8e8e8;
	background: #fff;
	font-size: 13px;
	line-height: 1;
	text-decoration: none;
	color: #5d5660;
	transition: all .2s ease;
}
.yhng-chip:hover{
	color: #fe259a;
	border-color: #f3cfe1;
	background: #fff6fb;
}
.yhng-chip-empty{
	font-size: 13px;
	opacity: .75;
}
.yhng-chip-link{
	text-decoration: underline;
	color: #c95a97;
}
.yhng-chip-link:hover{
	color: #fe259a;
}

@media (max-width: 849px){
	.tintuc-post-search,
	.post-search-on-results,
	.yhng-smart-chips{
		max-width: 100%;
	}
	.yhng-search-input{
		font-size: 14px;
		padding: 12px 14px;
	}
}
/* =========================================================
   YEUHANGNGOAI - FINAL MASTER CSS CLEAN
   Homepage + Product + Archive/Category + Footer + Blog Archive
   Bản đã làm sạch hoàn chỉnh
   ========================================================= */

:root{
  --pink: #fe259a;
  --pink-2: #ff5aae;
  --pink-dark: #d94b93;
  --pink-hover: #e83f97;
  --pink-soft: #fff8fb;
  --pink-soft-2: #fff3f8;
  --pink-soft-3: #fff1f7;

  --bg-soft: #fffdfd;
  --bg-soft-2: #fffafb;
  --bg-soft-3: #fffefe;

  --line: #f2e9ee;
  --line-2: #f0e4eb;
  --line-3: #ece5eb;
  --line-4: #efe1e8;

  --text: #2f2f36;
  --text-2: #3f3f46;
  --text-3: #544f58;
  --text-4: #6d6670;
  --muted: #7a7078;

  --shadow-xs: 0 3px 10px rgba(30,20,30,.04);
  --shadow-sm: 0 8px 22px rgba(30,20,30,.05);
  --shadow-md: 0 14px 34px rgba(30,20,30,.07);
  --shadow-lg: 0 18px 44px rgba(30,20,30,.08);

  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 18px;
  --radius-xl: 22px;
  --radius-2xl: 24px;

  --trans: all .24s ease;
}

   2) MENU HOVER
   ========================================================= */

#wide-nav .nav-dropdown{
  background: var(--bg-soft) !important;
  border: 1px solid #f0e6ec !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 14px 34px rgba(25,25,25,.08) !important;
}

#wide-nav .nav-dropdown::before{
  content: none !important;
  display: none !important;
}

#wide-nav .nav-dropdown > li > a,
#wide-nav .nav-dropdown .nav-column > li > a,
#wide-nav .nav-dropdown li a,
#wide-nav .nav-dropdown li a span{
  color: var(--text-2) !important;
  background: transparent !important;
  opacity: 1 !important;
}

#wide-nav .nav-dropdown > li > a:hover,
#wide-nav .nav-dropdown .nav-column > li > a:hover,
#wide-nav .nav-dropdown > li:hover > a,
#wide-nav .nav-dropdown .nav-column > li:hover > a{
  background: var(--pink-soft-2) !important;
  color: var(--pink-hover) !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

#wide-nav .nav-dropdown li a:hover,
#wide-nav .nav-dropdown li a:hover span{
  color: var(--pink-hover) !important;
}

#wide-nav .nav-dropdown li.current-menu-item > a,
#wide-nav .nav-dropdown li.current_page_item > a,
#wide-nav .nav-dropdown li.current-menu-parent > a{
  background: #fff0f7 !important;
  color: var(--pink-hover) !important;
  box-shadow: inset 2px 0 0 var(--pink) !important;
}

#wide-nav .nav-dropdown .ux-menu-icon,
#wide-nav .nav-dropdown > li > a:hover .ux-menu-icon,
#wide-nav .nav-dropdown .nav-column > li > a:hover .ux-menu-icon,
#wide-nav .nav-dropdown > li:hover > a .ux-menu-icon,
#wide-nav .nav-dropdown .nav-column > li:hover > a .ux-menu-icon{
  opacity: 1 !important;
  filter: none !important;
}

/* =========================================================
   7) FOOTER DEFAULT FLATSOME
   ========================================================= */

#footer .footer-widgets.footer.footer-2{
  background: linear-gradient(180deg, #8a8a8f 0%, #737379 100%) !important;
  color: rgba(255,255,255,.88) !important;
  padding: 34px 0 28px !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
}

#footer .footer-widgets.footer.footer-2 .row{ max-width: 1280px !important; margin: 0 auto !important; }
#footer .footer-widgets.footer.footer-2 .col{ padding-left: 18px !important; padding-right: 18px !important; }
#footer .footer-widgets.footer.footer-2 .widget{ margin-bottom: 0 !important; }

#footer .footer-widgets.footer.footer-2 .widget-title{
  display: block !important; margin: 0 0 10px !important; color: #ffffff !important; font-size: 20px !important;
  font-weight: 800 !important; line-height: 1.2 !important; letter-spacing: .3px !important; text-transform: uppercase !important;
}

#footer .footer-widgets.footer.footer-2 .is-divider.small{
  width: 46px !important; max-width: 46px !important; height: 3px !important; margin: 0 0 16px !important;
  background: linear-gradient(90deg, #fe259a 0%, #ffc2df 100%) !important; border-radius: 999px !important; opacity: 1 !important;
}

#footer .footer-widgets.footer.footer-2,
#footer .footer-widgets.footer.footer-2 p,
#footer .footer-widgets.footer.footer-2 li,
#footer .footer-widgets.footer.footer-2 span,
#footer .footer-widgets.footer.footer-2 .textwidget{
  color: rgba(255,255,255,.88) !important; font-size: 14px !important; line-height: 1.9 !important;
}

#footer .footer-widgets.footer.footer-2 a{
  color: #ffffff !important; text-decoration: none !important; transition: all .22s ease !important;
}

#footer .footer-widgets.footer.footer-2 a:hover{ color: #ffd0e7 !important; }

#footer #custom_html-6 .textwidget{ max-width: 100% !important; }
#footer #custom_html-6 strong{ color: #ffffff !important; font-weight: 800 !important; }
#footer #custom_html-6 a{ color: #ffd6ea !important; font-weight: 700 !important; }

#footer #custom_html-3 .button,
#footer #custom_html-3 .button.is-link,
#footer #custom_html-3 .button.secondary.is-link{
  display: flex !important; align-items: center !important; justify-content: flex-start !important;
  min-height: 40px !important; margin: 0 0 8px !important; padding: 0 !important;
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  color: rgba(255,255,255,.92) !important; font-size: 14px !important; font-weight: 600 !important;
  line-height: 1.5 !important; text-transform: none !important; opacity: 1 !important;
}

#footer #custom_html-3 .button:last-child{ margin-bottom: 0 !important; }

#footer #custom_html-3 .button .icon{
  width: 28px !important; height: 28px !important; min-width: 28px !important; margin-right: 10px !important;
  border-radius: 999px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important;
  background: rgba(255,255,255,.12) !important; color: #ffffff !important;
}

#footer #custom_html-3 .button:hover{ color: #ffd6ea !important; transform: translateX(2px); }

#footer #custom_html-4 ul{ margin: 0 !important; padding: 0 !important; list-style: none !important; }

#footer #custom_html-4 li{
  margin: 0 !important; padding: 0 !important; list-style: none !important; border-bottom: 1px solid rgba(255,255,255,.10) !important;
}

#footer #custom_html-4 li:last-child{ border-bottom: 0 !important; }

#footer #custom_html-4 li::before,
#footer #custom_html-4 .bullet-arrow::before{ content: none !important; display: none !important; }

#footer #custom_html-4 li a{
  display: flex !important; align-items: center !important; min-height: 42px !important; color: rgba(255,255,255,.9) !important;
}

#footer #custom_html-4 li a::before{
  content: "→"; color: #ffd0e7; font-size: 12px; font-weight: 700; margin-right: 10px;
}

#footer #custom_html-4 li a:hover{ color: #ffd6ea !important; transform: translateX(3px); }

#footer #custom_html-5 iframe{
  display: block !important; width: 100% !important; max-width: 100% !important; min-height: 210px !important;
  border: 1px solid rgba(255,255,255,.12) !important; border-radius: 14px !important; background: #fff !important;
}

#footer .absolute-footer{
  background: linear-gradient(180deg, #3d3940 0%, #2b2830 100%) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important; padding: 14px 0 12px !important;
}

#footer .absolute-footer .container{
  max-width: 1280px !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 18px !important;
}

#footer .absolute-footer .footer-primary,
#footer .absolute-footer .footer-secondary{ float: none !important; }

#footer .absolute-footer .footer-primary{
  display: flex !important; flex-direction: column !important; gap: 8px !important;
}

#footer .absolute-footer .footer-secondary{
  display: flex !important; align-items: center !important; gap: 12px !important; flex-wrap: wrap !important;
}

#footer .absolute-footer .footer-nav{
  display: flex !important; flex-wrap: wrap !important; gap: 10px 18px !important; margin: 0 !important; padding: 0 !important;
}

#footer .absolute-footer .footer-nav li{ margin: 0 !important; }

#footer .absolute-footer .footer-nav a{
  color: rgba(255,255,255,.78) !important; font-size: 12px !important; font-weight: 500 !important; letter-spacing: .2px !important; text-transform: none !important;
}

#footer .absolute-footer .footer-nav a:hover{ color: #fff !important; }

#footer .absolute-footer .copyright-footer{
  color: rgba(255,255,255,.82) !important; font-size: 12.5px !important;
}

#footer .absolute-footer .payment-icons{
  display: flex !important; align-items: center !important; gap: 8px !important;
}

#footer .absolute-footer .payment-icon{
  opacity: .9; transform: scale(.94); transform-origin: center;
}

#footer .absolute-footer .footer-text img{
  max-height: 22px !important; width: auto !important; opacity: .95 !important;
}

@media (max-width: 849px){
  #footer .footer-widgets.footer.footer-2{ padding: 22px 0 18px !important; }
  #footer .footer-widgets.footer.footer-2 .col{ padding-left: 15px !important; padding-right: 15px !important; margin-bottom: 18px !important; }
  #footer .footer-widgets.footer.footer-2 .widget-title{ font-size: 17px !important; }
  #footer #custom_html-5 iframe{ min-height: 190px !important; }
  #footer .absolute-footer .container{ flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; }
  #footer .absolute-footer .footer-secondary{ order: 2; }
  #footer .absolute-footer .footer-primary{ order: 1; width: 100% !important; }
  #footer .absolute-footer .footer-nav{ gap: 8px 12px !important; }
}

/* =========================================================
   FOOTER MENU - FINAL CLEAN
   ========================================================= */

#footer .absolute-footer .footer-primary{ gap: 10px !important; }

#footer #menu-footer-links{
  display: flex !important; flex-wrap: wrap !important; align-items: center !important;
  gap: 6px 0 !important; margin: 0 !important; padding: 0 !important; list-style: none !important;
}

#footer #menu-footer-links li{
  position: relative; margin: 0 !important; padding: 0 !important; list-style: none !important;
}

#footer #menu-footer-links li:not(:last-child)::after{
  content: ""; display: inline-block; width: 4px; height: 4px; margin: 0 12px;
  border-radius: 999px; background: rgba(255,255,255,.24); vertical-align: middle;
}

#footer #menu-footer-links a{
  display: inline !important; padding: 0 !important; background: transparent !important; border: 0 !important;
  box-shadow: none !important; color: rgba(255,255,255,.78) !important; font-size: 11.5px !important;
  font-weight: 500 !important; line-height: 1.6 !important; letter-spacing: .1px !important; text-transform: none !important;
  text-decoration: none !important; transition: color .2s ease !important;
}

#footer #menu-footer-links a:hover{ color: #fff !important; }

#footer .absolute-footer .copyright-footer{
  color: rgba(255,255,255,.78) !important; font-size: 12px !important; line-height: 1.5 !important;
}

@media (max-width: 849px){
  #footer .absolute-footer{ padding: 14px 0 16px !important; }
  #footer .absolute-footer .container{ flex-direction: column !important; align-items: center !important; text-align: center !important; gap: 12px !important; }
  #footer .absolute-footer .footer-primary,
  #footer .absolute-footer .footer-secondary{ width: 100% !important; float: none !important; text-align: center !important; }
  #footer .absolute-footer .footer-primary{ order: 1; align-items: center !important; }
  #footer .absolute-footer .copyright-footer{ order: 2; width: 100% !important; text-align: center !important; }
  #footer .absolute-footer .footer-secondary{ order: 3; justify-content: center !important; }
  #footer #menu-footer-links{ justify-content: center !important; max-width: 92% !important; margin: 0 auto !important; }
  #footer #menu-footer-links li:not(:last-child)::after{ margin: 0 9px; }
  #footer #menu-footer-links a{ font-size: 11px !important; line-height: 1.7 !important; }
  #footer .absolute-footer .payment-icons{ justify-content: center !important; width: 100% !important; }
}

/* =========================================================
   3.9.9.6 — CLASSIC TRUST FOOTER — LEADING ARROWS
   Content refresh only. Preserve the original dark footer design.
   ========================================================= */
#footer .footer-widgets.footer.footer-2 .yhn-footer-widget strong{color:#fff !important;font-weight:700 !important;}
#footer .footer-widgets.footer.footer-2 .yhn-footer-about p{margin-bottom:8px !important;line-height:1.65 !important;}
#footer .footer-widgets.footer.footer-2 .yhn-footer-more{margin-top:10px !important;}
#footer .footer-widgets.footer.footer-2 .yhn-footer-more a{color:#ffd6ea !important;font-weight:700 !important;}
#footer .yhn-footer-classic-links{margin:0 !important;padding:0 !important;list-style:none !important;}
#footer .yhn-footer-classic-links li{margin:0 !important;padding:0 !important;list-style:none !important;border-bottom:1px solid rgba(255,255,255,.10) !important;}
#footer .yhn-footer-classic-links li:last-child{border-bottom:0 !important;}
#footer .yhn-footer-classic-links li::before{display:none !important;content:none !important;}
#footer .yhn-footer-classic-links a{display:flex !important;align-items:center !important;min-height:38px !important;color:rgba(255,255,255,.90) !important;font-weight:500 !important;line-height:1.45 !important;}
#footer .yhn-footer-arrow{display:inline-block !important;flex:0 0 auto !important;color:#ffd0e7 !important;font-size:12px !important;font-weight:700 !important;line-height:1 !important;margin-right:8px !important;transform:translateY(-.5px);}
#footer .yhn-footer-more a{display:inline-flex !important;align-items:center !important;}
#footer .yhn-footer-classic-links a:hover{color:#ffd6ea !important;transform:translateX(2px) !important;}
#footer .yhn-footer-contact p{margin:0 0 8px !important;line-height:1.65 !important;}
#footer .yhn-footer-contact .yhn-footer-social-text{margin-top:10px !important;}
#footer .yhn-footer-contact .yhn-footer-social-text a{color:#ffd6ea !important;font-weight:600 !important;}
@media (max-width:849px){
  #footer .footer-widgets.footer.footer-2 .yhn-footer-col{margin-bottom:18px !important;}
}

/* 3.9.25 — Mobile Production Polish: global chrome + floating controls.
   Responsive-only; no footer architecture, desktop composition or schema changes. */
@media(max-width:549px){
  /* Keep floating utility controls useful without covering product cards/content. */
  .hotline-phone-ring-wrap{left:8px!important;bottom:14px!important;transform:scale(.82)!important;transform-origin:left bottom!important}
  .hotline-phone-ring,.phone-ring{transform:scale(.9)!important;transform-origin:center!important}
  .hotline-bar{display:none!important}
  .back-to-top,.back-to-top.active,.button.icon.circle.back-to-top{
    right:10px!important;bottom:14px!important;width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;
    line-height:40px!important;opacity:.72!important
  }

  /* Flatsome mobile header: trim vertical chrome, keep the same structure/branding. */
  #header .header-main{min-height:62px!important;height:auto!important}
  #header .header-main .header-inner{min-height:62px!important}
  #header .header-main .nav>li>a{min-height:44px!important}
  #header .search-form .search-field,#header .searchform .search-field{min-height:44px!important;height:44px!important}
  #header .header-search-form-wrapper{padding-top:7px!important;padding-bottom:7px!important}

  /* Footer remains the locked classic footer; only tighten mobile reading rhythm. */
  #footer .footer-widgets.footer.footer-2 .yhn-footer-widget{font-size:13px!important;line-height:1.55!important}
  #footer .footer-widgets.footer.footer-2 .yhn-footer-about p,#footer .yhn-footer-contact p{line-height:1.58!important}
  #footer .yhn-footer-classic-links a{min-height:35px!important;line-height:1.4!important}
}


/* 3.9.26 — Mobile utility-control collision guard. */
@media(max-width:549px){
  .hotline-phone-ring-wrap{left:6px!important;bottom:8px!important;transform:scale(.74)!important;transform-origin:left bottom!important}
  .hotline-phone-ring,.phone-ring{transform:scale(.84)!important}
  .back-to-top,.back-to-top.active,.button.icon.circle.back-to-top{
    right:8px!important;bottom:10px!important;width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;line-height:36px!important;opacity:.62!important
  }
}


/* 3.9.53.7 — Mobile collapsed-description handoff to related products. */
@media (max-width:549px){
  .single-product #tab-description:has(>.desc-readmore-wrap.is-collapsed),
  .single-product .woocommerce-Tabs-panel--description:has(>.desc-readmore-wrap.is-collapsed){padding-bottom:12px!important}
}


