/* ============================================================================
   KLO / YANFLOWER HEADER v1.5.122
   Layout patterned on the supplied Khánh Linh Orchids reference screenshots.
   Scope: header/drawer only. Shared max-width 1280px = existing slider/products.
   ============================================================================ */
:root { --klo-gold:#c2a258; --klo-text:#171717; --klo-muted:#555; --klo-header-width:1280px; }
.main-wrapper{overflow-x:clip!important;overflow-y:visible!important;}
header.site-header.klo-header{
    position:relative;z-index:500;background:#fff;box-shadow:none!important;border:0;
    font-family:'Open Sans',Arial,Helvetica,sans-serif;
}
header.site-header.klo-header .klo-header-container{
    width:var(--klo-header-width)!important;max-width:calc(100% - 32px)!important;
    margin-right:auto!important;margin-left:auto!important;
}
header.site-header.klo-header button,
header.site-header.klo-header input{font-family:inherit;}
header.site-header.klo-header button:focus-visible,
header.site-header.klo-header a:focus-visible,
.klo-mobile-drawer button:focus-visible,
.klo-mobile-drawer a:focus-visible{outline:2px solid var(--klo-gold);outline-offset:3px;}
/* ---------- Top caption / two hotlines ---------- */
header.klo-header .klo-topbar{background:#fff;border:0;box-shadow:none;}
header.klo-header .klo-topbar-inner{
    display:flex;align-items:center;justify-content:space-between;gap:16px;
    min-height:48px;border-bottom:1px solid var(--klo-gold);
}
header.klo-header .klo-top-caption{
    flex:1 1 auto;min-width:0;margin:0;padding:0;color:#292929;
    font-size:13px;line-height:1.4;font-weight:600;letter-spacing:0;
}
header.klo-header .klo-top-phones{
    display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto;gap:18px;
}
header.klo-header .klo-phone{
    display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
    color:#292929;text-decoration:none!important;font-size:14px;line-height:1.45;font-weight:400;
}
header.klo-header .klo-phone strong{font-size:14px;font-weight:650;color:#2c2c2c;}
header.klo-header .klo-phone em{color:var(--klo-gold);font-style:normal;font-weight:600;}
header.klo-header .klo-phone:hover em,header.klo-header .klo-phone:focus-visible em{color:#947734;}
header.klo-header .klo-phone-icon{display:block;width:22px;height:22px;flex:0 0 22px;color:var(--klo-gold);}
header.klo-header .klo-phone-icon svg{display:block;width:22px;height:22px;}
header.klo-header .klo-zalo-note{color:#3e3e3e;font-weight:400;}
/* ---------- Single white logo / nav / icon row ---------- */
header.klo-header .klo-main-row{
    position:relative;display:flex;align-items:center;justify-content:space-between;
    gap:22px;min-height:106px;padding:14px 0 16px;
}
header.klo-header .klo-logo{display:flex;flex:0 0 172px;min-width:0;align-items:center;justify-content:flex-start;}
header.klo-header .klo-logo a{display:flex;align-items:center;justify-content:flex-start;width:100%;max-width:160px;}
header.klo-header .klo-logo img{
    width:auto!important;max-width:155px!important;max-height:78px!important;height:auto!important;
    margin:0!important;object-fit:contain;object-position:left center;
}
header.klo-header .klo-navigation{
    display:flex;align-items:center;justify-content:flex-start;
    flex:1 1 auto;min-width:0;max-width:866px;height:74px;gap:8px;
}
header.klo-header .klo-nav-viewport{
    flex:1 1 auto;min-width:0;width:100%;height:74px;
    overflow:hidden;scrollbar-width:none;-ms-overflow-style:none;
}
header.klo-header .klo-nav-viewport::-webkit-scrollbar{display:none;}
header.klo-header .klo-menu{
    display:flex;align-items:center;flex-wrap:nowrap;justify-content:flex-start;
    gap:12px;width:max-content;min-width:100%;height:74px;
    margin:0!important;padding:0!important;list-style:none!important;
}
header.klo-header .klo-menu > li.klo-nav-hidden{display:none!important;}
header.klo-header .klo-menu > li{
    position:relative;display:flex;align-items:center;height:74px;
    flex:0 0 auto;margin:0!important;padding:0!important;list-style:none!important;
}
header.klo-header .klo-menu > li > a{
    display:inline-flex;align-items:center;gap:9px;
    height:74px;padding:0 6px!important;color:#121212!important;
    background:transparent!important;font-size:17px!important;line-height:1.3!important;
    font-weight:500!important;letter-spacing:.05px;text-transform:uppercase!important;
    text-decoration:none!important;white-space:nowrap;
    transition:color .16s ease;
}
header.klo-header .klo-menu > li.menu-item-has-children > a::after{
    content:'';display:block;width:0;height:0;
    border-left:5px solid transparent;border-right:5px solid transparent;
    border-top:6px solid currentColor;transform-origin:center;
    transition:transform .16s ease;
}
header.klo-header .klo-menu > li.is-klo-open > a,
header.klo-header .klo-menu > li:hover > a,
header.klo-header .klo-menu > li:focus-within > a,
header.klo-header .klo-menu > li.current-menu-item > a,
header.klo-header .klo-menu > li.current-menu-ancestor > a{color:var(--klo-gold)!important;}
header.klo-header .klo-menu > li.is-klo-open > a::after{transform:rotate(180deg);}
/* The original submenu stays in the WP menu DOM. JS copies it to the
   portal outside the scrolling strip, so it never gets clipped. */
header.klo-header .klo-menu > li > ul.sub-menu{display:none!important;}
header.klo-header .klo-nav-controls{
    display:flex;align-items:center;justify-content:center;gap:0;flex:0 0 49px;
    height:74px;
}
header.klo-header .klo-nav-arrow{
    display:inline-flex;align-items:center;justify-content:center;
    flex:0 0 24px;width:24px;height:44px;padding:0!important;
    border:0!important;border-radius:0!important;background:transparent!important;
    color:#101010!important;cursor:pointer;box-shadow:none!important;
}
header.klo-header .klo-nav-arrow svg{display:block;width:21px;height:21px;}
header.klo-header .klo-nav-arrow:hover{color:var(--klo-gold)!important;}
header.klo-header .klo-nav-arrow:disabled{opacity:.35;cursor:default;}
/* Portal for narrow, reference-like dropdowns */
header.klo-header .klo-dropdown-layer{
    position:absolute;z-index:140;top:calc(100% - 5px);left:0;
    width:100%;height:0;pointer-events:none;
}
header.klo-header .klo-dropdown-panel{
    position:absolute;top:0;left:0;display:block;
    width:278px;min-width:278px;max-width:calc(100vw - 24px);
    max-height:min(620px,calc(100vh - 170px));overflow-y:auto;
    border:1px solid #f0f0f0;border-radius:5px;
    background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.095);
    pointer-events:auto;scrollbar-width:thin;
}
header.klo-header .klo-dropdown-panel ul.sub-menu{
    display:block!important;width:100%!important;margin:0!important;padding:12px 0!important;
    background:#fff!important;list-style:none!important;
}
header.klo-header .klo-dropdown-panel li{display:block;margin:0!important;padding:0!important;list-style:none!important;}
header.klo-header .klo-dropdown-panel a{
    display:block;width:100%;padding:10px 25px!important;color:#555!important;
    background:transparent!important;text-decoration:none!important;
    text-transform:none!important;font-size:18px!important;
    line-height:1.55!important;font-weight:400!important;white-space:normal!important;
    transition:color .13s ease,background-color .13s ease;
}
header.klo-header .klo-dropdown-panel a:hover,
header.klo-header .klo-dropdown-panel a:focus-visible{color:var(--klo-gold)!important;background:#faf9f5!important;}
/* ---------- Search, account, wishlist, cart icons ---------- */
header.klo-header .klo-header-actions{
    display:flex;align-items:center;justify-content:flex-end;
    flex:0 0 162px;min-width:0;gap:5px;height:74px;
}
header.klo-header .klo-action-wrap{position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 36px;min-width:0;height:48px;}
header.klo-header .klo-icon-button{
    position:relative;display:inline-flex;align-items:center;justify-content:center;
    flex:0 0 36px;width:36px;height:42px;padding:0!important;margin:0!important;
    border:0!important;border-radius:0!important;background:transparent!important;
    box-shadow:none!important;color:#171717!important;text-decoration:none!important;cursor:pointer;
}
header.klo-header .klo-icon-button svg{display:block;width:24px;height:24px;flex:0 0 24px;}
header.klo-header .klo-icon-button:hover,
header.klo-header .klo-action-wrap.is-open .klo-icon-button{color:var(--klo-gold)!important;}
header.klo-header .klo-mobile-menu-toggle{display:none;}
header.klo-header .klo-count{
    position:absolute;top:0;right:-3px;display:flex;align-items:center;justify-content:center;
    min-width:20px;height:20px;padding:0 4px;border-radius:50%;
    background:var(--klo-gold);color:white!important;
    font-size:11px!important;font-weight:700!important;line-height:1;
}
header.klo-header .klo-account-wrap .klo-small-popover,
header.klo-header .klo-wishlist-wrap .klo-small-popover,
header.klo-header .klo-cart-wrap .klo-cart-popover{
    position:absolute;z-index:152;top:calc(100% + 8px);right:-14px;
    background:#fff;border-radius:5px;box-shadow:0 7px 25px rgba(0,0,0,.09);
    opacity:0;visibility:hidden;pointer-events:none;transform:translateY(3px);
    transition:opacity .16s ease,transform .16s ease,visibility .16s;
}
header.klo-header .klo-action-wrap:hover > .klo-small-popover,
header.klo-header .klo-action-wrap:hover > .klo-cart-popover,
header.klo-header .klo-action-wrap:focus-within > .klo-small-popover,
header.klo-header .klo-action-wrap:focus-within > .klo-cart-popover,
header.klo-header .klo-action-wrap.is-open > .klo-small-popover,
header.klo-header .klo-action-wrap.is-open > .klo-cart-popover{
    opacity:1;visibility:visible;pointer-events:auto;transform:none;
}
header.klo-header .klo-account-popover{
    display:flex;flex-direction:column;gap:0;width:188px;min-width:188px;
    padding:13px 15px 14px!important;
}
header.klo-header .klo-account-popover a{
    display:block;padding:7px 0!important;color:#222!important;background:none!important;
    font-size:15px!important;line-height:1.35;text-decoration:none!important;white-space:nowrap;
}
header.klo-header .klo-account-popover a:hover{color:var(--klo-gold)!important;}
header.klo-header .klo-wishlist-popover{
    display:block;width:310px;max-width:calc(100vw - 24px);
    padding:22px!important;color:#333;font-size:14px;text-align:center;
}
header.klo-header .klo-cart-popover{
    width:390px;max-width:calc(100vw - 24px);
    padding:20px 16px!important;
}
header.klo-header .klo-empty-cart{text-align:center;color:#191919;font-size:15px;line-height:1.5;}
header.klo-header .klo-empty-cart-icon{display:flex;align-items:center;justify-content:center;margin:1px auto 13px;color:var(--klo-gold);}
header.klo-header .klo-empty-cart-icon svg{width:23px;height:23px;}
header.klo-header .klo-empty-cart p{margin:0;padding:0;}
header.klo-header .klo-cart-popover .woocommerce-mini-cart{
    max-height:340px;overflow-y:auto;margin:0 0 14px!important;padding:0!important;
}
header.klo-header .klo-cart-popover .woocommerce-mini-cart > li{
    display:flex;align-items:center;gap:12px;padding:10px 0!important;
    border-bottom:1px solid #eee;font-size:14px;line-height:1.4;
}
header.klo-header .klo-cart-popover .woocommerce-mini-cart img{width:58px!important;height:58px!important;object-fit:cover;}
header.klo-header .klo-cart-popover .woocommerce-mini-cart .remove{flex:0 0 auto;color:#c33!important;}
header.klo-header .klo-cart-popover .woocommerce-mini-cart__total{padding:9px 0;font-size:14px;}
header.klo-header .klo-cart-popover .woocommerce-mini-cart__buttons{
    display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0;
}
header.klo-header .klo-cart-popover .woocommerce-mini-cart__buttons a{
    display:inline-flex;justify-content:center;align-items:center;flex:1 1 140px;
    padding:10px!important;color:#fff!important;background:var(--klo-gold)!important;
    border:0!important;border-radius:3px!important;font-size:13px!important;text-align:center;
}
header.klo-header .klo-cart-popover .woocommerce-mini-cart__buttons a:hover{background:#a78b43!important;}
/* Search pops out below the icon row; rest of header keeps its exact width. */
header.klo-header .klo-search-popover{
    position:absolute;z-index:159;top:calc(100% + 10px);right:-15px;
    width:360px;max-width:calc(100vw - 28px);
    padding:19px!important;border:1px solid #f0f0f0;border-radius:5px;
    background:#fff;box-shadow:0 6px 24px rgba(0,0,0,.12);
}
header.klo-header .klo-search-popover[hidden]{display:none!important;}
header.klo-header .klo-search-popover label{
    display:block;margin:0 0 9px;color:#292929;font-size:14px;font-weight:600;
}
header.klo-header .klo-search-line{display:flex;align-items:center;height:43px;border:1px solid #ddd;border-radius:3px;overflow:hidden;}
header.klo-header .klo-search-line input{
    display:block;min-width:0;flex:1 1 auto;width:100%;height:100%;padding:0 12px;
    border:0!important;outline:0;background:#fff;color:#333;font-size:14px!important;
}
header.klo-header .klo-search-line button{
    flex:0 0 45px;display:flex;align-items:center;justify-content:center;
    height:43px;padding:0;border:0;background:var(--klo-gold);color:white;cursor:pointer;
}
header.klo-header .klo-search-line button svg{width:19px;height:19px;}
header.klo-header .klo-search-line button:hover{background:#a78b43;}
/* Keep the original unused mobile popup out of the way; new drawer owns mobile. */
body .popup-menu-mobile{display:none!important;}
/* ---------- Responsive design ---------- */
@media (max-width:1380px) and (min-width:1101px){
    header.klo-header .klo-main-row{gap:13px;}
    header.klo-header .klo-logo{flex-basis:158px;}
    header.klo-header .klo-logo img{max-width:147px!important;}
    header.klo-header .klo-navigation{max-width:none;}
    header.klo-header .klo-menu{gap:7px;}
    header.klo-header .klo-menu > li > a{font-size:15.5px!important;padding:0 4px!important;gap:6px;}
    header.klo-header .klo-header-actions{flex-basis:156px;}
    header.klo-header .klo-top-caption{font-size:12.4px;}
    header.klo-header .klo-top-phones{gap:10px;}
    header.klo-header .klo-phone,header.klo-header .klo-phone strong{font-size:12.5px;}
}
@media (max-width:1100px){
    header.site-header.klo-header{position:relative!important;top:auto!important;}
    header.klo-header .klo-topbar-inner{min-height:39px;}
    header.klo-header .klo-top-caption{display:none;}
    header.klo-header .klo-top-phones{width:100%;justify-content:center;gap:18px;}
    header.klo-header .klo-phone{font-size:12.5px;}
    header.klo-header .klo-phone strong{font-size:12.5px;}
    header.klo-header .klo-main-row{gap:12px;min-height:85px;padding:11px 0;}
    header.klo-header .klo-mobile-menu-toggle{display:inline-flex;flex:0 0 40px;width:40px;}
    header.klo-header .klo-logo{flex:1 1 auto;justify-content:flex-start;}
    header.klo-header .klo-logo a{max-width:145px;}
    header.klo-header .klo-logo img{max-width:140px!important;max-height:64px!important;}
    header.klo-header .klo-navigation{display:none!important;}
    header.klo-header .klo-header-actions{flex:0 0 auto;gap:4px;height:48px;}
    header.klo-header .klo-action-wrap{flex-basis:38px;}
    header.klo-header .klo-account-popover{right:-35px;}
    header.klo-header .klo-search-popover{right:-120px;}
    header.klo-header .klo-cart-popover{right:-7px;}
    header.klo-header .klo-count{top:1px;}
}
@media (max-width:640px){
    header.klo-header .klo-topbar-inner{min-height:34px;}
    header.klo-header .klo-top-phones .klo-phone:nth-child(2){display:none;}
    header.klo-header .klo-phone{font-size:12px;}
    header.klo-header .klo-phone strong{font-size:12px;}
    header.klo-header .klo-phone-icon{width:17px;height:17px;flex-basis:17px;}
    header.klo-header .klo-phone-icon svg{width:17px;height:17px;}
    header.klo-header .klo-main-row{gap:4px;min-height:70px;padding:8px 0;}
    header.klo-header .klo-mobile-menu-toggle{flex-basis:30px;width:30px;height:36px;}
    header.klo-header .klo-logo a{max-width:125px;}
    header.klo-header .klo-logo img{max-width:122px!important;max-height:53px!important;}
    header.klo-header .klo-header-actions{gap:1px;}
    header.klo-header .klo-action-wrap{flex:0 0 31px;width:31px;height:36px;}
    header.klo-header .klo-icon-button{flex-basis:31px;width:31px;height:36px;}
    header.klo-header .klo-icon-button svg{width:21px;height:21px;flex-basis:21px;}
    header.klo-header .klo-count{min-width:16px;height:16px;right:-2px;font-size:9px!important;}
    header.klo-header .klo-account-popover{right:-80px;}
    header.klo-header .klo-search-popover{right:-106px;}
    header.klo-header .klo-wishlist-wrap > .klo-wishlist-popover{right:-40px!important;}
    header.klo-header .klo-cart-popover{right:0;}
}
/* ---------- Mobile slide-out navigation ---------- */
.klo-mobile-shade[hidden]{display:none!important;}
.klo-mobile-shade{
    position:fixed;z-index:9997;inset:0;background:rgba(22,22,22,.43);
    opacity:0;transition:opacity .22s ease;
}
.klo-mobile-shade.is-visible{opacity:1;}
.klo-mobile-drawer{
    position:fixed;z-index:9998;top:0;bottom:0;left:0;
    display:flex;flex-direction:column;
    width:min(370px, 88vw);max-width:100%;height:100vh;height:100dvh;
    background:white;box-shadow:6px 0 24px rgba(0,0,0,.1);
    font-family:'Open Sans',Arial,Helvetica,sans-serif;
    transform:translateX(-105%);transition:transform .23s ease;
    overflow:hidden;
}
.klo-mobile-drawer.is-visible{transform:translateX(0);}
.klo-mobile-drawer .klo-mobile-drawer-head{
    display:flex;justify-content:space-between;align-items:center;
    gap:14px;min-height:75px;padding:12px 18px;border-bottom:1px solid #eee;
}
.klo-mobile-drawer .klo-mobile-drawer-head img{display:block;width:auto;max-width:135px;max-height:56px;object-fit:contain;}
.klo-mobile-drawer .klo-mobile-drawer-head button{
    display:flex;align-items:center;justify-content:center;width:40px;height:40px;
    padding:0;border:0;background:transparent;color:#242424;cursor:pointer;
}
.klo-mobile-drawer .klo-mobile-drawer-head button svg{width:23px;height:23px;}
.klo-mobile-drawer .klo-mobile-nav{flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;padding:5px 0;}
.klo-mobile-drawer .klo-mobile-menu,
.klo-mobile-drawer .klo-mobile-menu ul{margin:0!important;padding:0!important;list-style:none!important;}
.klo-mobile-drawer .klo-mobile-menu > li{position:relative;border-bottom:1px solid #f0f0f0;}
.klo-mobile-drawer .klo-mobile-menu > li > a{
    display:block;padding:16px 55px 16px 22px;color:#222!important;
    font-size:14px!important;font-weight:600;text-transform:uppercase;
    text-decoration:none!important;line-height:1.4;
}
.klo-mobile-drawer .klo-mobile-menu > li.is-open > a{color:var(--klo-gold)!important;}
.klo-mobile-drawer .klo-drawer-sub-toggle{
    position:absolute;top:5px;right:5px;display:flex;align-items:center;justify-content:center;
    width:52px;height:44px;padding:0;border:0;background:transparent;color:#333;cursor:pointer;
}
.klo-mobile-drawer .klo-drawer-sub-toggle svg{width:16px;height:16px;transition:transform .2s ease;}
.klo-mobile-drawer .klo-mobile-menu > li.is-open > .klo-drawer-sub-toggle svg{transform:rotate(180deg);}
.klo-mobile-drawer .klo-mobile-menu > li > .sub-menu{display:none!important;padding:3px 0 12px!important;background:#fbfaf8;}
.klo-mobile-drawer .klo-mobile-menu > li.is-open > .sub-menu{display:block!important;}
.klo-mobile-drawer .klo-mobile-menu > li > .sub-menu li a{
    display:block;padding:12px 20px 12px 31px!important;color:#555!important;
    font-size:14px!important;font-weight:400;line-height:1.4;
    text-decoration:none!important;
}
.klo-mobile-drawer .klo-mobile-menu > li > .sub-menu li a:hover{color:var(--klo-gold)!important;}
.klo-mobile-drawer .klo-mobile-footer{
    display:flex;flex-direction:column;gap:10px;padding:16px 21px 19px;
    border-top:1px solid #eee;font-size:13px;color:#383838;
}
.klo-mobile-drawer .klo-mobile-footer a{text-decoration:none!important;}
body.klo-drawer-open{overflow:hidden!important;}
@media (prefers-reduced-motion:reduce){
    .klo-mobile-shade,.klo-mobile-drawer,
    header.klo-header .klo-dropdown-panel,
    header.klo-header .klo-action-wrap > div {transition:none!important;}
}