/* =========================================================
   Yellow Host - Bengali font (Varendra) + mobile extras
   ========================================================= */

/* ---------- Bengali font ---------- */
@font-face{font-family:'Varendra';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/Varendra-Regular.woff') format('woff'),url('../fonts/Varendra-Regular.ttf') format('truetype')}
@font-face{font-family:'Varendra';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/Varendra-Medium.woff') format('woff'),url('../fonts/Varendra-Medium.ttf') format('truetype')}
@font-face{font-family:'Varendra';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/Varendra-Bold.woff') format('woff'),url('../fonts/Varendra-Bold.ttf') format('truetype')}

body,button,input,select,textarea,
h1,h2,h3,h4,h5,h6,
.yh-btn,.button,.woocommerce-Price-amount{
  font-family:'Varendra',Arial,Helvetica,sans-serif;
}

/* ---------- Hidden on desktop (desktop layout stays untouched) ---------- */
.yh-lang-switch,
.yh-search-mobile{display:none}

/* ---------- Hide Google Translate UI ---------- */
.goog-te-banner-frame,.goog-te-banner-frame.skiptranslate,
iframe.skiptranslate,#goog-gt-tt,.goog-tooltip,.goog-te-balloon-frame{display:none!important}
.goog-text-highlight{background:none!important;box-shadow:none!important}
body{top:0!important}

/* ---------- Desktop: language switcher in the top bar ---------- */
.yh-topbar-right{display:flex;align-items:center;gap:22px}
.yh-topbar .yh-lang-switch--top{display:flex;align-items:center;gap:2px;color:#fff;font-size:12px;white-space:nowrap}
.yh-topbar .yh-lang-btn{background:none;border:0;padding:2px 6px;margin:0;color:inherit;font:inherit;cursor:pointer;opacity:.8;text-decoration:none;line-height:1.4}
.yh-topbar .yh-lang-btn:hover{opacity:1}
.yh-topbar .yh-lang-btn.is-active{opacity:1;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.yh-topbar .yh-lang-sep{opacity:.45}

/* ---------- Footer: social icons ---------- */
.yh-social-icons{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.yh-social-icon{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;
  background:#fff;border:1px solid #dcdcdc;color:#555;transition:background .2s,color .2s,border-color .2s,transform .2s}
.yh-social-icon svg{width:18px;height:18px;display:block}
.yh-social-icon:hover{background:var(--yh-orange);border-color:var(--yh-orange);color:#fff;transform:translateY(-2px)}
.yh-social-whatsapp:hover{background:#25d366;border-color:#25d366}

/* ---------- Desktop: floating WhatsApp button ---------- */
.yh-wa-float{position:fixed;right:24px;bottom:24px;z-index:9990;display:flex;align-items:center;flex-direction:row-reverse;gap:0;text-decoration:none}
.yh-wa-float-icon{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;
  background:#25d366;color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.22);transition:transform .2s,box-shadow .2s}
.yh-wa-float-icon svg{width:30px;height:30px;display:block}
.yh-wa-float-label{background:#fff;color:#333;font-size:13px;font-weight:500;padding:8px 14px;border-radius:20px;margin-right:10px;
  box-shadow:0 4px 12px rgba(0,0,0,.15);opacity:0;transform:translateX(8px);pointer-events:none;white-space:nowrap;transition:opacity .2s,transform .2s}
.yh-wa-float:hover .yh-wa-float-label,.yh-wa-float:focus-visible .yh-wa-float-label{opacity:1;transform:none}
.yh-wa-float:hover .yh-wa-float-icon{transform:scale(1.06);box-shadow:0 8px 22px rgba(0,0,0,.28)}
.yh-rtl .yh-wa-float{right:auto;left:24px}

/* ---------- Mobile only ---------- */
@media(max-width:600px){
  .yh-wa-float{display:none}
  .yh-topbar .yh-lang-switch--top{display:none}

  /* Header: logo left, language switcher right */
  .yh-header-main{justify-content:space-between}
  .yh-header .yh-search{display:none}
  .yh-lang-switch{
    display:flex;align-items:center;gap:4px;margin-left:auto;
    color:var(--yh-header-text,#fff);font-size:13px;white-space:nowrap;
  }
  .yh-lang-btn{
    background:none;border:0;padding:8px 4px;margin:0;color:inherit;font:inherit;
    cursor:pointer;opacity:.72;text-decoration:none;line-height:1.2;
  }
  .yh-lang-btn.is-active{opacity:1;font-weight:700;text-decoration:underline;text-underline-offset:5px}
  .yh-lang-sep{opacity:.5}

  /* Home | Shop | Cart  ...  [ search ] */
  .yh-mobile-nav .yh-container{display:flex;align-items:center;gap:8px}
  .yh-mobile-nav ul{flex:0 0 auto;overflow:visible;padding:8px 0 8px 4px;gap:14px}
  .yh-mobile-nav .yh-search-mobile{
    display:flex;flex:1 1 auto;min-width:0;margin:6px 4px 6px 0;
    background:#fff;border:1px solid #d9d9d9;border-radius:18px;overflow:hidden;
  }
  .yh-search-mobile input[type=search]{
    flex:1 1 auto;min-width:0;width:100%;border:0;outline:0;background:transparent;
    padding:7px 4px 7px 12px;font-size:13px;
  }
  .yh-search-mobile button{
    flex:0 0 34px;width:34px;border:0;background:transparent;color:var(--yh-orange);
    font-size:17px;padding:0;cursor:pointer;
  }

  /* Bottom bar: Home | Categories | Cart | WhatsApp | Account */
  .yh-mobile-bottom.has-wa{grid-template-columns:repeat(5,1fr)}
  /* All five bottom-bar items share exactly the same text style */
  .yh-mobile-bottom a{
    color:var(--yh-text,#333);font-family:inherit;font-size:12px;font-weight:400;line-height:1.3;
  }
  /* WhatsApp: thin outline icon, same colour/size as the other icons */
  .yh-mobile-bottom .yh-wa-icon{
    display:flex;align-items:center;justify-content:center;
    height:28px;font-size:29px;line-height:1.05;margin-bottom:5px;color:inherit;
  }
  .yh-wa-icon svg{width:28px;height:28px;display:block;fill:none;stroke:currentColor}

  /* Footer: SOCIAL sits in the right column, beside POLICY (4 icons, one row) */
  .yh-social-icons{gap:6px;flex-wrap:wrap}
  .yh-social-icons .yh-social-icon{width:34px;height:34px}
  .yh-social-icons .yh-social-icon svg{width:17px;height:17px}

  /* Arabic (RTL) */
  .yh-rtl .yh-lang-switch{margin-left:0;margin-right:auto}
  .yh-rtl .yh-mobile-nav ul{padding:8px 4px 8px 0}
  .yh-rtl .yh-search-mobile input[type=search]{padding:7px 12px 7px 4px}
}

/* ---------- Sticky header (desktop + mobile) ---------- */
.yh-sticky-header{position:-webkit-sticky;position:sticky;top:0;z-index:999;box-shadow:0 2px 6px rgba(0,0,0,.12)}
body.admin-bar .yh-sticky-header{top:32px}
@media(max-width:782px){body.admin-bar .yh-sticky-header{top:46px}}
@media(max-width:600px){body.admin-bar .yh-sticky-header{top:0}} /* admin bar scrolls away on small screens */


/* =========================================================
   Announcement bar (desktop + mobile)
   ========================================================= */
.yh-announce{background:var(--yh-ann-bg,#222);color:var(--yh-ann-fg,#fff);overflow:hidden;font-size:13px;line-height:1.5}
.yh-announce a{color:inherit;text-decoration:none}
.yh-ann-static{display:block;padding:7px 12px;text-align:center}
.yh-ann-static .yh-ann-item{display:inline;padding:0;white-space:normal}
.yh-ann-track{display:flex;width:max-content;direction:ltr;padding:7px 0;animation:yh-ann-marquee var(--yh-ann-dur,30s) linear infinite;will-change:transform}
.yh-ann-group{display:flex;flex:0 0 auto}
.yh-ann-track .yh-ann-item{display:block;padding:0 48px;white-space:nowrap;unicode-bidi:plaintext}
.yh-announce:hover .yh-ann-track{animation-play-state:paused}
@keyframes yh-ann-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.yh-ann-d-scroll .yh-ann-static{display:none}
.yh-ann-d-static .yh-ann-track{display:none}
@media(max-width:600px){
  .yh-ann-m-scroll .yh-ann-static{display:none}
  .yh-ann-m-scroll .yh-ann-track{display:flex}
  .yh-ann-m-static .yh-ann-static{display:block}
  .yh-ann-m-static .yh-ann-track{display:none}
  .yh-announce{font-size:12px}
}

/* Icons without a link: still visible, but tapping does nothing */
.yh-no-link{cursor:default}