/* Q1 Iraq Store V17.08
   Arabic/English only, centered compact header, canonical share menu and responsive fit.
*/
html,body{max-width:100%;overflow-x:hidden}
body.q1-v16-94 .lux-header-inner{
  width:min(1580px,calc(100% - 24px))!important;
  min-height:104px!important;
  display:grid!important;
  grid-template-columns:minmax(190px,250px) minmax(0,1fr) max-content!important;
  grid-template-areas:"brand nav tools" "search search search"!important;
  align-items:center!important;
  justify-items:stretch!important;
  column-gap:16px!important;
  row-gap:7px!important;
  padding:8px 0 10px!important;
}
body.q1-v16-94 .lux-brand{
  grid-area:brand!important;justify-self:start!important;min-width:0!important;max-width:250px!important;
  transform:none!important;transform-origin:center!important;gap:10px!important;
}
body.q1-v16-94 .lux-brand img{width:64px!important;height:64px!important;object-fit:contain!important}
body.q1-v16-94 .lux-brand strong{font-size:20px!important;line-height:1!important;white-space:nowrap!important}
body.q1-v16-94 .lux-brand b{font-size:14px!important}
body.q1-v16-94 .lux-brand small{font-size:11px!important}
body.q1-v16-94 .lux-nav{
  grid-area:nav!important;display:flex!important;align-items:center!important;justify-content:center!important;
  gap:clamp(10px,1.5vw,24px)!important;white-space:nowrap!important;min-width:0!important;max-width:100%!important;
  overflow:visible!important;padding:0!important;order:initial!important;
}
body.q1-v16-94 .lux-nav a,body.q1-v16-94 .lux-nav button{
  flex:0 0 auto!important;font-size:clamp(12px,.9vw,15px)!important;padding:9px 2px!important;line-height:1.2!important;
}
body.q1-v16-94 .lux-header-tools{
  grid-area:tools!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;
  gap:6px!important;flex-wrap:nowrap!important;min-width:max-content!important;max-width:none!important;order:initial!important;
}
body.q1-v16-94 .lux-header-left{
  grid-area:search!important;display:flex!important;align-items:center!important;justify-content:center!important;
  gap:10px!important;width:min(760px,100%)!important;max-width:760px!important;justify-self:center!important;order:initial!important;
}
body.q1-v16-94 .lux-search-top{flex:1 1 420px!important;min-width:220px!important;max-width:520px!important}
body.q1-v16-94 .lux-offer-btn{flex:0 0 auto!important;min-height:40px!important;padding-inline:18px!important;font-size:13px!important}

.q1-original-install{display:none!important}
.q1-lang-switch{
  display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid #d7a33a;border-radius:999px;
  background:#fff;box-shadow:0 5px 14px rgba(17,31,49,.08);height:40px;flex:0 0 auto;
}
.q1-lang-switch button{
  width:36px;height:32px;border:0;border-radius:999px;background:transparent;color:#253247;
  font:900 11px/1 Arial,sans-serif;cursor:pointer;padding:0;
}
.q1-lang-switch button.active{background:#0b2d47;color:#fff;box-shadow:0 4px 10px rgba(11,45,71,.24)}
.q1-lang-switch button:focus-visible{outline:2px solid #d69a20;outline-offset:2px}

.q1-share-wrap{position:relative;display:inline-flex;align-items:center;flex:0 0 auto}
.q1-share-trigger{
  width:48px;height:42px;padding:3px 2px;border:1px solid #d7a33a;border-radius:14px;background:#fff;color:#0b2d47;
  display:grid;place-items:center;align-content:center;gap:0;cursor:pointer;box-shadow:0 5px 14px rgba(17,31,49,.08)
}
.q1-share-trigger:hover,.q1-share-trigger[aria-expanded="true"]{background:#0b2d47;color:#fff}
.q1-share-arrow{font:1000 19px/15px Arial,sans-serif;display:block}
.q1-share-label{font:900 9px/11px inherit;display:block;white-space:nowrap}
.q1-share-menu{
  position:absolute;z-index:70000;top:calc(100% + 10px);inset-inline-end:0;width:min(360px,calc(100vw - 24px));
  padding:13px;background:#fff;border:1px solid #d9e1ea;border-radius:18px;box-shadow:0 20px 55px rgba(12,27,45,.24);
  display:none;color:#15263a;text-align:start;
}
.q1-share-menu.open{display:block}
.q1-share-menu-title{display:block;padding:1px 3px 11px;font-size:14px}
.q1-share-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.q1-share-grid>a,.q1-share-grid>button{
  min-width:0;min-height:48px;border:1px solid #e0e6ed;border-radius:12px;background:#f7f9fc;color:#14253a;
  padding:8px;text-decoration:none;display:flex;align-items:center;gap:8px;cursor:pointer;font:inherit;text-align:start;
}
.q1-share-grid>a:hover,.q1-share-grid>button:hover{border-color:#d29a2e;background:#fff8e8}
.q1-share-grid span{width:28px;height:28px;border-radius:9px;background:#0b2d47;color:#fff;display:grid;place-items:center;font:900 10px/1 Arial}
.q1-share-grid b{font-size:12px;line-height:1.2;min-width:0}
html[dir="ltr"] .q1-share-menu{inset-inline-start:auto;inset-inline-end:0}

.lux-header-tools>.mini-toggle,.lux-header-tools>.cart-button{
  height:40px!important;min-height:40px!important;padding-inline:10px!important;flex:0 0 auto!important;
}
#themeToggle{width:40px!important;padding:0!important}
#customerLoginOpen{max-width:88px!important;font-size:12px!important}
#cartOpenTop{max-width:86px!important;font-size:12px!important}

/* Correct LTR behavior without changing product image/order logic. */
html[dir="ltr"] body{text-align:left}
html[dir="ltr"] .lux-brand{direction:ltr}
html[dir="ltr"] .lux-nav,html[dir="ltr"] .lux-header-tools,html[dir="ltr"] .drawer-head,
html[dir="ltr"] .live-chat-head,html[dir="ltr"] .live-chat-social-title,
html[dir="ltr"] .modal-box,html[dir="ltr"] .product-card,html[dir="ltr"] .footer{text-align:left}
html[dir="ltr"] input,html[dir="ltr"] textarea,html[dir="ltr"] select{direction:ltr;text-align:left}
html[dir="rtl"] input,html[dir="rtl"] textarea,html[dir="rtl"] select{direction:rtl;text-align:right}

/* Chat close remains fully clickable. */
.live-chat-box{display:none!important}
.live-chat-widget.open .live-chat-box,.live-chat-box.open{display:flex!important}
#liveChatClose{
  position:relative!important;z-index:80!important;pointer-events:auto!important;touch-action:manipulation!important;
  cursor:pointer!important;flex:0 0 42px!important;width:42px!important;height:42px!important;min-width:42px!important;
  display:grid!important;place-items:center!important;border:0!important;border-radius:50%!important;
  background:rgba(255,255,255,.15)!important;color:#fff!important;font-size:28px!important;line-height:1!important
}

/* Medium screens: centered menu on a dedicated row, no overlapping. */
@media(max-width:1180px){
  body.q1-v16-94 .lux-header-inner{
    grid-template-columns:minmax(180px,1fr) max-content!important;
    grid-template-areas:"brand tools" "nav nav" "search search"!important;
    min-height:132px!important;row-gap:6px!important;
  }
  body.q1-v16-94 .lux-brand{justify-self:start!important}
  body.q1-v16-94 .lux-header-tools{justify-self:end!important}
  body.q1-v16-94 .lux-nav{
    width:100%!important;overflow-x:auto!important;overflow-y:hidden!important;justify-content:center!important;
    scrollbar-width:none!important;gap:10px 20px!important;padding:2px 8px!important;
  }
  body.q1-v16-94 .lux-nav::-webkit-scrollbar{display:none}
  body.q1-v16-94 .lux-header-left{width:min(700px,100%)!important}
}

/* Mobile auto-fit: tools stay on one line; nav scrolls horizontally instead of colliding. */
@media(max-width:720px){
  body.q1-v16-94 .lux-header-inner{
    width:calc(100% - 14px)!important;grid-template-columns:minmax(0,1fr) max-content!important;
    grid-template-areas:"brand tools" "search search" "nav nav"!important;min-height:auto!important;padding:7px 0 8px!important;
  }
  body.q1-v16-94 .lux-brand{max-width:145px!important;gap:5px!important}
  body.q1-v16-94 .lux-brand img{width:48px!important;height:48px!important}
  body.q1-v16-94 .lux-brand strong{font-size:15px!important;white-space:normal!important}
  body.q1-v16-94 .lux-brand b{font-size:10px!important}
  body.q1-v16-94 .lux-brand small{display:none!important}
  body.q1-v16-94 .lux-header-tools{gap:3px!important}
  .q1-share-trigger{width:38px;height:38px;border-radius:12px}
  .q1-share-label{display:none}
  .q1-share-arrow{font-size:20px;line-height:1}
  .q1-lang-switch{height:38px;padding:2px}
  .q1-lang-switch button{width:30px;height:32px;font-size:10px}
  #themeToggle{width:38px!important;height:38px!important;min-height:38px!important}
  #customerLoginOpen{width:38px!important;max-width:38px!important;height:38px!important;min-height:38px!important;padding:0!important;font-size:0!important}
  #customerLoginOpen::before{content:'👤';font-size:17px}
  #cartOpenTop{width:42px!important;max-width:42px!important;height:38px!important;min-height:38px!important;padding:0!important}
  #cartOpenTop span{display:none!important}
  body.q1-v16-94 .lux-header-left{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;width:100%!important;gap:7px!important}
  body.q1-v16-94 .lux-search-top{min-width:0!important;width:100%!important}
  body.q1-v16-94 .lux-offer-btn{min-height:38px!important;padding:8px 10px!important;font-size:0!important}
  body.q1-v16-94 .lux-offer-btn span{font-size:18px!important}
  body.q1-v16-94 .lux-nav{
    justify-content:flex-start!important;width:100%!important;gap:6px!important;padding:4px 1px!important;
    scroll-snap-type:x proximity!important;
  }
  body.q1-v16-94 .lux-nav a,body.q1-v16-94 .lux-nav button{
    scroll-snap-align:start!important;padding:8px 10px!important;border:1px solid #edf0f4!important;border-radius:999px!important;
    background:#fff!important;font-size:12px!important;
  }
  body.q1-v16-94 .lux-nav .active{background:#fff8e8!important;border-color:#d7a33a!important}
  body.q1-v16-94 .lux-nav .active:after{display:none!important}
  .q1-share-menu{
    position:fixed;top:auto;bottom:82px;left:10px;right:10px;inset-inline:auto;width:auto;max-height:calc(100vh - 110px);overflow:auto
  }
  .q1-share-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .q1-share-grid>a,.q1-share-grid>button{min-height:52px}
  .live-chat-box{left:8px!important;right:8px!important;width:auto!important;max-width:none!important}
}
@media(max-width:390px){
  body.q1-v16-94 .lux-brand div{display:none!important}
  body.q1-v16-94 .lux-brand{max-width:54px!important}
  .q1-share-grid{grid-template-columns:1fr 1fr}
}
