/* Keep delivery location separate from logo/search space at small widths. */
.rl-header-ship{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:4px 6px;border:0;border-radius:4px;background:transparent;color:inherit;font:inherit;font-size:12px;line-height:20px;white-space:nowrap;cursor:pointer;flex:none}
.rl-header-ship strong{font-weight:650;margin-left:3px}
.rl-header-ship>svg{flex:none}
.rl-header-ship:hover{background:#e9e8ed}
.rl-header-ship:focus-visible{outline:2px solid #7453b8;outline-offset:2px}
.rl-header-ship-mobile{display:none}
.rl-header-ship-compact{display:flex;align-items:center;gap:8px;margin-left:auto;padding-left:12px;flex:none}
.rl-header-ship-row{display:flex;align-items:center}
.rl-header-ship-secondary{min-height:32px;gap:12px}
.rl-header-ship-menu{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;padding:4px 12px;border:1px solid #e4e3e8;border-radius:6px;background:#f6f6f8}
.rl-header-ship-menu .rl-header-ship{flex:1;justify-content:flex-start;min-height:44px;padding:8px 0;font-size:14px}
.rl-header-ship-menu>img{display:block;width:24px;height:16px;object-fit:contain;flex:none}
.rc-zip-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.rc-zip-actions>[hidden]{display:none!important}
.rl-header-ship-compact>img,.rl-header-ship-mobile>img,.rl-header-us-flag{display:block;width:24px;height:16px;object-fit:contain;flex:none}
@media(max-width:767px){.rl-header-ship-mobile{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:36px;padding:2px 24px;background:#f6f6f8;border-top:1px solid #e4e3e8;box-sizing:border-box}.rl-header-ship-mobile .rl-header-ship{padding-left:0}.rl-header-ship-compact{gap:4px;padding-left:6px}.rl-header-ship-compact .rl-header-ship{gap:4px;font-size:11px;padding:2px}.rl-header-ship-compact .rl-header-ship>svg{width:15px;height:15px}}
@media(max-width:420px){.rl-header-with-ship-compact{padding-left:16px;padding-right:16px}.rl-header-ship-compact .rl-header-ship>span{display:flex;flex-direction:column;align-items:flex-start;line-height:14px}.rl-header-ship-compact .rl-header-ship strong{margin-left:0}}

/* ===== R89：页头 logo 尺寸统一 + 垂直居中（只做 CSS 覆盖，不动 HTML/JS） =====
   统一口径：主站页头变体（#header / account 认证页 / secondary 帮助中心品牌条）桌面 34px、移动 26px；
   结账页头（commerce）保持 20px 并维持行内居中。
   account 变体在 brand.css 中由 :not(#header) 选择器（含 ID 权重）定义 172×24，这里用同等权重 + important 覆盖。 */
header:not(#header) a[data-brand-link="account"] {
  width: 212px !important;
  height: 34px !important;
  flex: 0 0 212px !important;
  align-items: center !important;
  justify-content: center !important;
}
header:not(#header) a[data-brand-link="account"] img[data-brand-logo="true"] {
  width: 212px !important;
  height: 34px !important;
  max-width: none !important;
  max-height: none !important;
}
body a[data-brand-link="secondary"] {
  width: 212px !important;
  height: 34px !important;
  align-items: center !important;
  justify-content: center !important;
}
body a[data-brand-link="secondary"] img[data-brand-logo="true"] {
  width: 212px !important;
  height: 34px !important;
  max-width: none !important;
  max-height: none !important;
}
/* 行容器：容得下 34px logo，并保持行内所有控件垂直居中 */
.rl-header-ship-row:has(a[data-brand-link="account"]) {
  min-height: 34px;
  align-items: center;
}
.rl-header-ship-secondary {
  min-height: 34px;
  align-items: center;
}
/* 结账页头（commerce）logo 维持 20px：行高不变，只保证锚点与行垂直居中 */
header a[data-brand-link="commerce"] {
  height: 24px !important;
  align-items: center;
  justify-content: center;
}
header a[data-brand-link="commerce"] img[data-brand-logo="true"] {
  width: 124px !important;
  height: 20px !important;
  max-width: none !important;
  max-height: none !important;
}
@media (max-width: 767px) {
  header:not(#header) a[data-brand-link="account"],
  body a[data-brand-link="secondary"] {
    width: clamp(120px, calc(100vw - 180px), 170px) !important;
    height: 26px !important;
    flex-basis: clamp(120px, calc(100vw - 180px), 170px) !important;
  }
  header:not(#header) a[data-brand-link="account"] img[data-brand-logo="true"],
  body a[data-brand-link="secondary"] img[data-brand-logo="true"] {
    width: clamp(120px, calc(100vw - 180px), 170px) !important;
    height: 26px !important;
  }
  .rl-header-ship-row:has(a[data-brand-link="account"]) {
    min-height: 32px;
  }
  .rl-header-ship-secondary {
    min-height: 32px;
  }
}

/* ===== R93：页头 logo 可见左边缘对齐（只改 CSS） =====
   logo PNG（1252×292）比各页头显示槽窄，object-fit:contain 默认居中会在槽内留下左
   留白（桌面 ~33px、结账 ~19px），导致可见 logo 相对面包屑/副标题/正文左基线内缩。
   左对齐的页头上下文一律把可见内容贴槽位左缘；主站移动端页头 logo 是居中设计，保持居中。 */
@media (min-width: 768px) {
  #header img[data-brand-logo="true"] { object-position: left center !important; }
}
#header a[data-brand-link="drawer"] img[data-brand-logo="true"] { object-position: left center !important; }
body a[data-brand-link="secondary"] img[data-brand-logo="true"],
header:not(#header) a[data-brand-link="account"] img[data-brand-logo="true"],
header a[data-brand-link="commerce"] img[data-brand-logo="true"] { object-position: left center !important; }

/* R96：空占位骨架预留高度，保证首帧 header 高度=终态；JS 填充后 :empty 失效、高度自然一致 */
.rl-header-ship-compact:empty{min-height:28px}
@media (max-width:767px){.rl-header-ship-compact:empty{min-height:32px}}

/* R96：PDP 的购买条模块会把 banner 变 absolute（entry css: body:has(.rl-pdp-purchase-bar)）。
   这里让 PDP 页首帧即按终态定位，避免 banner 从流内改为绝对定位造成 header 高度跳变。 */
body.rl-pdp-has-purchase-bar #header > .rl-promo-banner{position:absolute}
/* R96：PDP 购买条模块会同时给 #header 加 padding-top:44px（entry css 的 :has 规则）。
   静态 body 类补齐同一组终态规则，保证首帧 header 高度=147px、banner 定位=absolute，零位移。 */
body.rl-pdp-has-purchase-bar #header{position:relative;padding-top:44px}
body.rl-pdp-has-purchase-bar #header > .rl-promo-banner{position:absolute!important;top:0;left:0;right:0;min-height:44px;display:flex!important}

/* R96b：结账/账户页 header padding 的移动端值由异步 chunk CSS 决定（32→16 过渡，首帧会横移）。
   在 head 静态规则里提前固定为终态 16px，让步进条出现的动画不再影响 header 布局（首帧固定值方案）。 */
@media (max-width:767px){body[data-demo-route^="/en-us/f2/"] header,body[data-demo-route^="/en-us/auth/"] header{padding-left:16px!important;padding-right:16px!important}}

/* R97：品牌栏页（无 #header 的 help/business 等）的 ship 行占位骨架高度 = JS 插入后的终态行高 */
.rl-header-ship-compact[data-header-ship-skeleton="bar"]:empty{min-height:34px}
@media (max-width:767px){.rl-header-ship-compact[data-header-ship-skeleton="bar"]:empty{min-height:32px}}

/* R98：ship-to 文案随 ZIP 检测更新时保持宽度稳定（5 位 ZIP 宽度），避免首帧后宽度变化推动相邻元素 */
.rl-header-ship strong[data-header-zip]{display:inline-block;width:5ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}

/* R99：help/account-access 等自定义 header 页静态化终态（行高 36px 桌面 / 32px 移动），避免首帧后挂类/插行造成位移 */
.rl-header-ship-compact[data-header-ship-skeleton="account"]:empty{min-height:36px}
@media (max-width:767px){.rl-header-ship-compact[data-header-ship-skeleton="account"]:empty{min-height:32px}}

/* R100：静态 HTML 里的备用语言链接在脚本 hydration 后会被移除（终态只有当前语言）；
   首帧即按终态隐藏，避免语言区宽度 101→39px 推动顶部工具条（CLS 0.0003~0.0006） */
[data-test="language-switch-links"] > [data-test^="language-switch-link-"],
[data-test="language-switch-links"] > span[aria-hidden="true"]{display:none}

/* R101：空 ship 占位骨架预留终态宽度，避免 JS 填充 button/flag 时组宽 7→93(桌面 160) 推动行内布局 */
.rl-header-ship-compact:empty{min-width:160px}
@media (max-width:767px){.rl-header-ship-compact:empty{min-width:93px}}