/* ==========================================================================
   pwa-header-bar-theme26-button.css · 新皮肤 PWA 栏按钮（deep-sea-teal / theme-35）
   对应源码：ptgame/app/src/pwa/HeaderBar/Theme26Button.vue <style scoped lang="less">
   （#pwa-header-bar-new-btn-26-index.style() mixin 默认参数展开；new-skin-symbol 挂 html；
     垫底 SVG 已提取为 assets/src-assets/svg-inline/theme26-btn-bg.svg，fetch 内联进 .btn-26）
   ========================================================================== */

/* ---- .new-skin-symbol { .style() }（@btnTextColor/@downloadIconColor 默认参数） ---- */
.new-skin-symbol .btn-26 {
  position: relative;
  z-index: 0;
  width: 6.75rem;
  height: 2.125rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.5rem 0.625rem;
  box-sizing: border-box;
  border-radius: var(--ep-border-radius-m);
  margin-left: 18px;
}

.new-skin-symbol .btn-26 .download-svg {
  width: 1.625rem;
  height: 1.625rem;
  color: var(--ep-color-icon-inverse);
}

.new-skin-symbol .btn-26 .btn-text {
  font-size: var(--ep-font-size-s);
  color: var(--ep-color-text-inverse);
  font-weight: var(--ep-font-weight-bold);
}

/* 源码 .btn-26 svg：模板内联 SVG 绝对定位垫底（本项目为 fetch 内联的同一 SVG）。
   注：源码 scoped 下 svg 需带本组件 data-v，SvgIcon 内部 v-html 的 svg 不带，故源码该规则
   只命中垫底 SVG；扁平 CSS 中 `.btn-26 svg` 会同时命中图标内 svg，下方用更具体的选择器
   将其还原（净效果与源码一致） */
.new-skin-symbol .btn-26 svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

/* 还原图标 svg（见上方注）：文档流内撑满 .download-svg 容器 */
.new-skin-symbol .btn-26 .download-svg svg {
  position: static;
  width: 100%;
  height: 100%;
  z-index: auto;
}