/* ===== header (mobile) ===== */
.hdr-m{--teal:#0b5675;--navy:#2b3f5f;--red:#862f24;--ink:#0f4a5f;--line:#eceff3}
.hdr-m a{text-decoration:none}
.hdr-m button{font-family:inherit}
.hdr-m [hidden]{display:none!important}

.hdr-m__top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 20px;
  background:var(--teal) url("../images/header_background.jpg") center/cover no-repeat;color:#fff}
.hdr-m__account,.hdr-m__cart{color:#fff;flex:0 0 auto;position:relative;display:block;line-height:0}
.hdr-m__logo{--logo-w:min(285px,62vw);  /* logo width: was 300px max, now 250px */
             --logo-h:.3;               /* visible band height (fraction of width) */
             --slogan-pull:.12;         /* slogan overlap into the logo box (fraction of width) = old -30px at ~250px */
             --pad-bottom:8px}         /* space under the slogan, was 7px */
.hdr-m__logoimg{display:flex;align-items:center;justify-content:center;width:var(--logo-w);
  height:calc(var(--logo-w) * var(--logo-h));margin:0 auto;overflow:hidden; position: relative;}
.hdr-m__logoimg img{flex:none;display:block;width:100%;height:auto;max-width:none;
  position:absolute; top: 42%; transform: translateY(-50%);}
.hdr-m__slogan{display:block;margin-top:calc(var(--logo-w) * var(--slogan-pull) * -1);font-style:italic;
  font-size:clamp(14px,4vw,18px);color:#fff;position:relative;z-index:1;text-align:center;padding-bottom:var(--pad-bottom)}
.hdr-m__badge{position:absolute;top:-6px;right:-8px;min-width:18px;height:18px;padding:0 4px;border-radius:9px;
  background:#fff;color:var(--navy);font:700 11px/18px sans-serif;text-align:center}

.hdr-m__contact{display:flex;align-items:center;gap:10px;padding:10px 16px;background:#fff;position:relative}
.hdr-m__tel{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:clamp(15px,4.4vw,20px);
  color:var(--navy);white-space:nowrap;direction:ltr;unicode-bidi:isolate}
.hdr-m__tel svg{color:#6b7686}
.hdr-m__ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:#fff;font-size:22px;flex:0 0 auto}
.hdr-m__ico--wa{background:#25d366}.hdr-m__ico--vb{background:#7360f2}.hdr-m__ico--tg{background:#229ed9}
@media (max-width:400px){.hdr-m__ico{width:38px;height:38px;font-size:19px;border-radius:10px}.hdr-m__contact{gap:6px;padding:10px 10px}}

.hdr-vat{margin-inline-start:auto}
.hdr-lang{position:relative;margin-inline-start:auto}
.hdr-vat + .hdr-lang{margin-inline-start:0}
.hdr-lang__btn{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px;border:1px solid #d9dce2;
  border-radius:999px;background:#fff;color:var(--navy);font-weight:700;font-size:17px;cursor:pointer}
.hdr-lang__menu{position:absolute;top:calc(100% + 8px);inset-inline-end:0;min-width:210px;margin:0;padding:0;list-style:none;
  background:#fff;border-radius:18px;box-shadow:0 12px 32px rgba(15,35,60,.2);overflow:hidden;z-index:1200}
.hdr-lang__item{display:flex;align-items:center;gap:22px;padding:15px 20px;border-bottom:1px solid #eef0f3;color:#6b7686;font-size:18px}
.hdr-lang__menu li:last-child .hdr-lang__item{border-bottom:0}
.hdr-lang__item b{width:30px;color:#aab1bd}
.hdr-lang__item.is-active{background:#f6f8fa}
.hdr-lang__item.is-active b,.hdr-lang__item.is-active span{color:var(--navy);font-weight:700}
.hdr-lang__item.is-active::after{content:"";margin-inline-start:auto;width:8px;height:8px;border-radius:50%;background:var(--navy)}

.hdr-m__nav{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:16px;
  background:#fff;border-top:5px solid #f1f2f4}
.hdr-m__navbtn{position:relative;background:none;border:0;padding:0 0 7px;color:var(--navy);font-weight:700;
  font-size:clamp(16px,4.4vw,19px);cursor:pointer}
.hdr-m__navbtn::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--red)}
.hdr-m__navbtn::before{content:"";position:absolute;bottom:-2px;width:6px;height:6px;border:solid var(--red);border-width:0 0 1px 1px}
.hdr-m__navbtn--l::before{left:0;transform:rotate(45deg)}
.hdr-m__navbtn--r::before{right:0;border-width:0 1px 1px 0;transform:rotate(-45deg)}
.hdr-m__search{display:flex;align-items:center;gap:10px;height:46px;padding:0 16px;border:1px solid #dcdfe5;
  border-radius:999px;background:#f4f6f8;color:#aeb6c2;min-width:0;overflow:hidden;white-space:nowrap}
.hdr-m__search span{overflow:hidden;text-overflow:ellipsis}

/* ===== drawers + overlay ===== */
html.hdr-lock,html.hdr-lock body{overflow:hidden}
.hdr-overlay{position:fixed;left:0;right:0;bottom:0;top:var(--hdr-drawer-top,0);background:rgba(10,25,45,.45);
  z-index:1090;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.hdr-overlay.is-open{opacity:1;visibility:visible}
.hdr-drawer{position:fixed;top:var(--hdr-drawer-top,0);bottom:0;width:min(82vw,420px);background:#fff;z-index:1100;
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;visibility:hidden;
  transition:transform .28s ease,visibility .28s}
.hdr-drawer--left{left:0;transform:translateX(-100%);border-top-right-radius:28px}
.hdr-drawer--right{right:0;transform:translateX(100%);border-top-left-radius:28px}
.hdr-drawer.is-open{transform:none;visibility:visible}
.hdr-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:18px 24px 12px}
.hdr-drawer__head h2{margin:0;font-size:22px;font-weight:700;color:var(--ink)}
.hdr-drawer__close{background:none;border:0;font-size:30px;line-height:1;color:#c3c9d2;cursor:pointer;padding:0 4px}
.hdr-drawer--right .hdr-drawer__head{flex-direction:row-reverse}

.hdr-drawer__list{list-style:none;margin:0;padding:0}
.hdr-drawer__list a,.cat-link{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;
  border-top:1px solid var(--line);font-weight:700;font-size:18px;color:var(--ink)}
.hdr-drawer__list a::after,.cat-link::after,.cat-group__list a::after{content:"";width:7px;height:7px;flex:0 0 auto;
  border:solid #c3c9d2;border-width:2px 2px 0 0;transform:rotate(45deg)}
.hdr-drawer--right .hdr-drawer__list a{flex-direction:row-reverse}
.hdr-drawer--right .hdr-drawer__list a::after{transform:rotate(-135deg)}

/* categories: visual groups (not links), real category links inside */
.cat-group{border-top:1px solid var(--line)}
.cat-group__head{display:flex;align-items:center;gap:10px;width:100%;padding:16px 24px;background:none;border:0;
  text-align:start;cursor:pointer;font-weight:700;font-size:18px;color:var(--ink)}
.cat-group__count{font-weight:400;font-size:15px;color:#cfd4db}
.cat-group__head::after{content:"";margin-inline-start:auto;width:7px;height:7px;border:solid #c3c9d2;
  border-width:0 2px 2px 0;transform:rotate(45deg);transition:transform .2s}
.cat-group.is-open .cat-group__head::after{transform:rotate(-135deg)}
.cat-group__list{display:none;list-style:none;margin:0;padding:0}
.cat-group.is-open .cat-group__list{display:block}
.cat-group__list a{display:flex;align-items:center;justify-content:space-between;padding:14px 24px 14px 30px;
  border-top:1px solid var(--line);font-weight:400;font-size:17px;color:var(--ink)}

/* ===== benefits bar ===== */
.hdr-benefits{background:#f3f4f6;border-bottom:1px solid #e6e8ec}
.hdr-benefits__inner{display:grid;grid-template-columns:repeat(3,1fr);max-width:1140px;margin:0 auto}
.hdr-benefits__item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  padding:14px 6px;text-align:center;color:var(--navy,#2b3f5f);font-size:clamp(12px,3.3vw,15px);line-height:1.25;text-decoration:none}
.hdr-benefits__item + .hdr-benefits__item{border-inline-start:1px solid #cfd3da}
.hdr-benefits__item img{height:auto;max-width:100%}
.hdr-benefits__txt b,.hdr-benefits__txt strong{display:block;font-weight:700}
.hdr-benefits__item--ship .hdr-benefits__txt b,.hdr-benefits__item--ship .hdr-benefits__txt strong{color:#862f24}

  .cat-list{padding-bottom:24px}
.cat-list > .cat-link:first-child{border-top:1px solid var(--line)}

/* welcome: strip is mobile-only; desktop keeps the original .welcome-text */
.hdr-welcome__toggle,.hdr-welcome__close{display:none}
@media (max-width:991.98px){
  .boxsearch{display:none}
  .hdr-welcome{background:#fff;border-bottom:1px solid #eceff3;text-align:center}
  .hdr-welcome__toggle{display:inline-flex;align-items:center;gap:12px;padding:14px 16px;background:none;border:0;
    color:#0b5675;font-family:inherit;font-size:clamp(16px,4.6vw,20px);cursor:pointer}
  .hdr-welcome__toggle svg{color:#862f24;transition:transform .2s}
  .hdr-welcome.is-open .hdr-welcome__toggle svg{transform:rotate(90deg)}
  .arabic .hdr-welcome:not(.is-open) .hdr-welcome__toggle svg{transform:scaleX(-1)}
  .arabic .hdr-welcome.is-open .hdr-welcome__toggle svg{transform:scaleX(-1) rotate(90deg)}

  .hdr-welcome__panel{display:none;padding:4px 20px 18px;text-align:start;color:#2b3f5f;line-height:1.55}
  .hdr-welcome.is-open .hdr-welcome__panel{display:block}
  /* override the old .welcome-text rules (centered, max-width, margins) on mobile only */
  .hdr-welcome .hdr-welcome__panel .welcome-text{display:block}
  .hdr-welcome .hdr-welcome__panel .welcome-text h1{max-width:none;margin:0;font-size:inherit;line-height:inherit;
    font-weight:400;text-align:start;color:inherit}
  .hdr-welcome .hdr-welcome__panel .welcome-text a{font-weight:600}

  .hdr-welcome__close{display:block;margin:14px auto 0;padding:9px 22px;border:1px solid #d9dce2;border-radius:999px;
    background:#fff;color:#2b3f5f;font-family:inherit;font-weight:600;cursor:pointer}
}