/* MarketBashi header/account actions, search layout and account modal. */
.mb-header-actions { display:flex; align-items:center; gap:6px; flex-shrink:0; }
.mb-header-actions .mb-header-action { position:relative; display:grid; place-items:center; flex:0 0 40px; width:40px; height:40px; padding:0; border:1px solid transparent; border-radius:12px; background:transparent; color:var(--mb-text,#20202a); text-decoration:none; cursor:pointer; box-sizing:border-box; }
.mb-header-actions .mb-header-action svg { display:block; width:22px; height:22px; }
.mb-header-actions .mb-header-action:hover,
.mb-header-actions .mb-header-action:focus-visible,
.mb-header-actions .mb-header-action[aria-expanded="true"] { color:var(--mb-primary,#8128d8); background:var(--mb-primary-soft,#f4edff); border-color:var(--mb-border,#e9e6ef); outline-offset:2px; }
.mb-header-actions .mb-header-cart .mb-cart-count { position:absolute; top:-3px; right:-4px; }
.mb-header-wishlist:hover svg { color:#e92a65; }

/* Compact brand copy; the search field shares the desktop header row. */
.mb-brand-copy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; min-width:0; gap:2px; line-height:1.35; }
.mb-brand-name { display:block; color:var(--mb-primary,#8128d8); font-size:clamp(14px,1.2vw,18px); font-weight:750; white-space:nowrap; }
.mb-brand-tagline { display:block; color:#77727f; font-size:11px; font-weight:400; line-height:1.45; white-space:nowrap; }
.mb-brand-link { gap:8px; }
.mb-header-top { display:grid !important; grid-template-columns:max-content minmax(0,1fr) max-content; align-items:center; gap:14px 18px; }
.mb-header-brand { grid-column:1; grid-row:1; min-width:0; }
.mb-header-search { grid-column:2; grid-row:1; width:100%; min-width:0; max-width:none; justify-self:stretch; margin:0; padding:0; }
.mb-header-actions { grid-column:3; grid-row:1; }
.mb-header-search form { width:100%; max-width:100%; margin:0; }

/* Account panel and overlay. */
.mb-account-backdrop[hidden],
.mb-account-popover[hidden] { display:none !important; }
.mb-account-backdrop { position:fixed; inset:0; z-index:100490; background:rgba(25,18,36,.56); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
.mb-account-popover { position:fixed; z-index:100500; top:88px; right:12px; width:min(300px,calc(100vw - 24px)); max-height:min(78vh,720px); overflow:auto; overscroll-behavior:contain; box-sizing:border-box; padding:12px; border:1px solid var(--mb-border,#e9e6ef); border-radius:16px; background:#fff; color:var(--mb-text,#20202a); box-shadow:0 18px 55px rgba(35,18,58,.20); }
.mb-account-popover__header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding-bottom:12px; margin-bottom:12px; border-bottom:1px solid var(--mb-border,#e9e6ef); }
.mb-account-popover__header strong { color:var(--mb-primary,#8128d8); font-size:15px; }
.mb-account-popover__close { display:grid; place-items:center; flex:0 0 36px; width:36px; height:36px; padding:0; border:1px solid var(--mb-border,#e9e6ef); border-radius:10px; background:#faf8fd; color:var(--mb-text,#20202a); font-size:24px; line-height:1; cursor:pointer; }
.mb-account-popover__links { display:grid; gap:3px; }
.mb-account-popover__links a,.mb-account-popover__fallback-link { display:block; padding:11px 12px; border-radius:10px; color:var(--mb-text,#20202a); text-decoration:none; font-size:14px; }
.mb-account-popover__links a:hover,.mb-account-popover__links a:focus-visible,.mb-account-popover__fallback-link:hover { background:var(--mb-primary-soft,#f4edff); color:var(--mb-primary,#8128d8); }
.mb-account-popover__links .mb-account-popover__logout { color:#d12d4b; border-top:1px solid var(--mb-border,#e9e6ef); margin-top:5px; }
.mb-account-popover__otp { width:100%; min-width:0; box-sizing:border-box; }
.mb-account-popover__otp > * { max-width:100%; box-sizing:border-box; }
.mb-account-popover__otp form { width:100%; max-width:100%; margin-inline:auto; }
.mb-account-popover__otp input:not([type="checkbox"]):not([type="radio"]),
.mb-account-popover__otp select,
.mb-account-popover__otp textarea { max-width:100%; box-sizing:border-box; }
.mb-account-popover__otp button { max-width:100%; box-sizing:border-box; }
.mb-account-popover__fallback { margin:0 0 8px; color:#6d6576; font-size:13px; line-height:1.8; }
.mb-account-popover__fallback-link { background:var(--mb-primary-soft,#f4edff); color:var(--mb-primary,#8128d8); text-align:center; }

/* Guest login: centered modal with no visible border or close X on desktop. */
@media (min-width:992px) {
  .mb-header-search input[type="search"] { min-height:42px; padding-top:8px; padding-bottom:8px; border-radius:11px; }
  .mb-header-search button,
  .mb-header-search input[type="submit"] { width:34px; height:34px; min-height:34px; }
  .mb-account-popover--guest { top:50% !important; left:50% !important; right:auto !important; bottom:auto !important; transform:translate(-50%,-50%); width:min(440px,calc(100vw - 36px)); max-width:440px; max-height:calc(100dvh - 40px); padding:28px 28px 30px; border:0; border-radius:20px; background:#c8c7fb; box-shadow:0 28px 90px rgba(18,10,32,.28); }
  .mb-account-popover--guest .mb-account-popover__header { display:none !important; }
  .mb-account-popover--guest .mb-account-popover__close { display:none !important; }
  .mb-account-popover--guest .mb-account-popover__otp { margin:auto; }
}

/* Stagger-in navigation for authenticated account links, on desktop and mobile. */
body.mb-account-popover-open .mb-account-popover--menu .mb-account-popover__links > a { opacity:0; animation:mb-account-link-enter 300ms cubic-bezier(.22,.7,.25,1) both; }
body.mb-account-popover-open .mb-account-popover--menu .mb-account-popover__links > a:nth-child(1) { animation-delay:0ms; }
body.mb-account-popover-open .mb-account-popover--menu .mb-account-popover__links > a:nth-child(2) { animation-delay:45ms; }
body.mb-account-popover-open .mb-account-popover--menu .mb-account-popover__links > a:nth-child(3) { animation-delay:90ms; }
body.mb-account-popover-open .mb-account-popover--menu .mb-account-popover__links > a:nth-child(4) { animation-delay:135ms; }
@keyframes mb-account-link-enter { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }

@media (max-width:991px) {
  /* MarketBashi mobile header — physical right/left in RTL.
     Grid track 1 is on the physical RIGHT; track 2 is on the LEFT.
     Never use direction:ltr on the outer grid for this layout. */
  .mb-header-top {
    grid-template-columns:max-content minmax(0,1fr) !important;
    grid-template-areas:
      "brand brand"
      "brand-rule brand-rule"
      "menu actions"
      "actions-rule actions-rule"
      "search search";
    grid-template-rows:auto 1px auto 1px auto;
    align-items:center;
    column-gap:8px;
    row-gap:7px;
    padding-top:9px;
    padding-bottom:9px;
    border-bottom:1px solid var(--mb-border,#e9e6ef);
    direction:rtl;
  }
  /* Rules occupy their own grid rows and cannot stretch outside the container. */
  .mb-header-top::before,
  .mb-header-top::after {
    content:"";
    display:block;
    width:100%;
    height:1px;
    min-width:0;
    background:var(--mb-border,#e9e6ef);
  }
  .mb-header-top::before { grid-area:brand-rule; }
  .mb-header-top::after  { grid-area:actions-rule; }
  .mb-header-brand {
    grid-area:brand;
    justify-self:center;
    display:block;
    width:100%;
    min-width:0;
  }
  .mb-brand-link {
    grid-area:brand;
    display:flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    max-width:100%;
    gap:7px;
    margin:0 auto;
    direction:rtl;
  }
  .mb-brand-copy {
    align-items:center;
    text-align:center;
    max-width:calc(100vw - 92px);
  }
  .mb-brand-logo { width:38px; height:38px; }
  .mb-brand-name {
    font-size:clamp(11px,3.6vw,15px);
    letter-spacing:0;
    line-height:1.45;
    white-space:normal;
    text-align:center;
  }
  .mb-brand-tagline {
    font-size:clamp(8px,2.25vw,10px);
    letter-spacing:0;
    line-height:1.55;
    white-space:normal;
    text-align:center;
  }
  .mb-menu-toggle {
    grid-area:menu;
    justify-self:start; /* physical RIGHT in RTL grid */
    display:flex !important;
    align-items:center;
    justify-content:center;
    gap:7px;
    width:auto !important;
    min-width:105px;
    max-width:100%;
    height:40px;
    padding:0 10px;
    border-radius:11px;
    font-size:20px;
    line-height:1;
    white-space:nowrap;
    direction:rtl;
    flex-shrink:0;
  }
  .mb-menu-toggle__icon { display:inline-block; line-height:1; }
  .mb-menu-toggle__label { display:inline-block; font-size:12px; font-weight:700; line-height:1.3; }
  .mb-header-actions {
    grid-area:actions;
    justify-self:end; /* physical LEFT in RTL grid */
    align-self:center;
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
    gap:2px;
    direction:rtl;
  }
  .mb-header-actions .mb-header-action {
    flex:0 0 31px;
    width:31px;
    height:34px;
    border-radius:9px;
  }
  .mb-header-actions .mb-header-action svg { width:19px; height:19px; }
  .mb-header-search {
    grid-area:search;
    justify-self:center;
    width:80%;
    max-width:80%;
    min-width:0;
    margin:0;
    padding:0;
    direction:rtl;
  }

  /* Match the original OTP form look: the shortcode owns its internal logo/title/buttons. */
  .mb-account-popover--guest {
    position:fixed !important;
    inset:0 !important;
    width:100vw !important;
    max-width:none !important;
    height:100dvh !important;
    max-height:100dvh !important;
    left:0 !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    transform:none !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:#c8c7fb !important;
    padding:calc(12px + env(safe-area-inset-top,0px)) 18px calc(20px + env(safe-area-inset-bottom,0px));
    overflow-x:hidden;
    overflow-y:auto;
    display:flex;
    flex-direction:column;
  }
  .mb-account-popover--guest .mb-account-popover__header { display:none !important; }
  .mb-account-popover--guest .mb-account-popover__close { display:none !important; }
  .mb-account-popover--guest .mb-account-popover__otp {
    width:min(100%,480px);
    margin:auto;
    padding:0;
  }
  .mb-account-popover--menu {
    width:calc(100vw - 24px);
    right:12px;
    max-height:calc(100dvh - 32px);
  }
  .mb-account-popover[data-mb-open-source="header"] { top:76px; bottom:auto; }
  .mb-account-popover[data-mb-open-source="mobile-bar"] { top:auto; bottom:calc(72px + env(safe-area-inset-bottom,0px)); }
}
@media (max-width:380px) {
  .mb-header-top { gap:8px 6px; padding-top:8px; }
  .mb-header-actions { gap:1px; }
  .mb-header-actions .mb-header-action { flex-basis:27px; width:27px; height:32px; }
  .mb-header-actions .mb-header-action svg { width:17px; height:17px; }
  .mb-menu-toggle { min-width:98px; padding:0 8px; height:38px; }
  .mb-menu-toggle__label { font-size:11px; }
  .mb-brand-link { gap:5px; }
  .mb-brand-logo { width:34px; height:34px; }
  .mb-brand-copy { max-width:calc(100vw - 82px); }
}
@media (prefers-reduced-motion:reduce) {
  .mb-account-popover { scroll-behavior:auto; }
  body.mb-account-popover-open .mb-account-popover--menu .mb-account-popover__links > a { animation:none; opacity:1; }
}