/*!
 * web/assets/css/index/10-ep-anim.css
 * EP 兼容层交互动画 / POS / 报销 / 批量发货
 *
 * 本文件由 tools/split_spa.py 从单文件 SPA 机械拆出，请勿手工改动切分边界。
 * 加载顺序由入口 HTML 统一控制（经典 script 共享全局词法环境）。
 */

/* ===== #159 修复：Element Plus 兼容层交互动画（原 van- 前缀已映射为 ep-/el- 两套，旧选择器失效） ===== */
/* 1. EP 主色对齐应用主色，tab 选中态可见 */
.el-button,[class*=el-tabs],[class*=el-dialog]{--el-color-primary:var(--pc)}
.el-tabs__item{transition:color .2s ease,font-weight .2s ease;color:var(--ts);font-size:14px;position:relative}
.el-tabs__item:hover{color:var(--pci)}
.el-tabs__item.is-active{color:var(--pci)!important;font-weight:700;border-bottom:2px solid var(--pc)}
.el-tabs__active-bar{background-color:var(--pc)!important;height:3px;border-radius:3px}
.el-tabs__nav-wrap::after{height:1px;background-color:var(--bd)}
.ep-tabs--sticky .el-tabs__header{margin-bottom:8px}
/* 需求 #7：el-tabs 文字贴边 —— nav-scroll 统一左右内边距（全项目生效） */
.el-tabs__nav-scroll{padding-left:12px;padding-right:12px;box-sizing:border-box}
.el-tabs__nav-wrap.is-scrollable{padding-left:0;padding-right:0}
.el-tabs__nav-next,.el-tabs__nav-prev{width:22px;font-size:14px;color:var(--ts)}
.el-tabs--card>.el-tabs__header .el-tabs__nav-scroll{padding-left:6px;padding-right:6px}
/* 2. el-button 按压反馈 + 主按钮常态投影 */
.el-button{transition:transform .12s ease,box-shadow .2s ease,filter .2s ease,background-color .2s ease}
.el-button:active{transform:scale(.96);filter:brightness(.94)}
.el-button--primary{box-shadow:0 2px 8px rgba(0,122,255,.28)}
:root.dark .el-button--primary{box-shadow:0 2px 8px rgba(10,132,255,.35)}
.el-button:focus-visible{outline:2px solid var(--pc);outline-offset:2px}
/* 3. ep-cell / ep-field 交互反馈（兼容层自定义类） */
.ep-cell{transition:background-color .18s ease,transform .12s ease}
.ep-cell--link,.ep-cell[style*=cursor]{cursor:pointer}
.ep-cell--link:active{transform:scale(.985);background:rgba(127,127,127,.08)}
.ep-field .el-input__wrapper{transition:box-shadow .2s ease,background-color .2s ease}
/* 4. 弹窗：进入 + 离开 双向交互动画（2026-09-12 重写）
   旧实现两个毛病：
     a) `.ep-pop,.ep-as{animation:wbPop}` 只在元素**创建**时播一次，关闭时不会被触发；
     b) `.ep-fade-leave-active` 虽然指定了 `wbPop ... reverse`，但紧接着的
        `.ep-fade-leave-active .ep-pop,.ep-fade-leave-active .ep-as{animation:none}` 又把面板动画
        关掉，只剩遮罩在动 → 观感上就是「关闭没有交互动画」。
   现在改为：遮罩管淡入淡出，面板按 position 管位移/缩放，且进出**都**走 transition，
   `enter-from` / `leave-to` 成对声明，两个方向都不会漏。 */
.el-overlay{animation:wbFadeIn .22s ease both}
.el-dialog{animation:wbZoomIn .24s cubic-bezier(.22,.61,.36,1) both}
.dialog-fade-leave-active .el-dialog{animation:wbZoomOut .2s ease both}
.el-dialog__header{padding:18px 24px 10px}
.el-dialog__body{padding:10px 24px 16px}
.el-dialog__footer{padding:6px 24px 18px}
/* 遮罩：ep-pop / ep-as / ep-overlay 三家共用 <transition name="ep-fade"> */
.ep-fade-enter-active{animation:wbFadeIn .22s ease both}
.ep-fade-leave-active{animation:wbFadeOut .22s ease both}
/* 面板：enter/leave 双向过渡（时长略短于遮罩，保证离场先落地） */
.ep-fade-enter-active .ep-pop,.ep-fade-enter-active .ep-as,
.ep-fade-enter-active .ep-overlay-mask>*,
.ep-fade-leave-active .ep-pop,.ep-fade-leave-active .ep-as,
.ep-fade-leave-active .ep-overlay-mask>*{
  transition:transform .2s cubic-bezier(.22,.61,.36,1),opacity .2s ease}
.ep-fade-enter-from .ep-pop,.ep-fade-enter-from .ep-as,.ep-fade-enter-from .ep-overlay-mask>*,
.ep-fade-leave-to .ep-pop,.ep-fade-leave-to .ep-as,.ep-fade-leave-to .ep-overlay-mask>*{opacity:0}
.ep-fade-enter-from .ep-pop--center,.ep-fade-leave-to .ep-pop--center{transform:scale(.92)}
.ep-fade-enter-from .ep-pop--top,.ep-fade-leave-to .ep-pop--top{transform:translateY(-100%)}
.ep-fade-enter-from .ep-pop--bottom,.ep-fade-leave-to .ep-pop--bottom{transform:translateY(100%)}
.ep-fade-enter-from .ep-pop--left,.ep-fade-leave-to .ep-pop--left{transform:translateX(-100%)}
.ep-fade-enter-from .ep-pop--right,.ep-fade-leave-to .ep-pop--right{transform:translateX(100%)}
.ep-fade-enter-from .ep-as,.ep-fade-leave-to .ep-as{transform:translateY(100%)}
.ep-fade-enter-from .ep-overlay-mask>*,.ep-fade-leave-to .ep-overlay-mask>*{transform:scale(.96)}
.ep-as__item{transition:background-color .15s ease,transform .12s ease}
.ep-as__item:active{transform:scale(.98);background:rgba(127,127,127,.08)}
.ep-as__cancel:active{transform:scale(.98)}
.ep-search__action{transition:opacity .15s ease,transform .12s ease}
.ep-search__action:active{transform:scale(.95);opacity:.7}
/* 5. 开关/标签/分页/下拉等控件按压反馈 */
.el-switch:active .el-switch__core,.el-radio:active,.el-checkbox:active{transform:scale(.94)}
.el-switch__core,.el-radio,.el-checkbox{transition:transform .12s ease,border-color .2s ease,background-color .2s ease}
/* 原生 radio/checkbox 垫片样式（替代 EP el-radio 的 use-radio 崩溃） */
.ep-radio,.ep-checkbox{display:inline-flex;align-items:center;font-size:14px;cursor:pointer;line-height:1;vertical-align:middle}
.ep-radio.is-disabled,.ep-checkbox.is-disabled{color:var(--ts);cursor:not-allowed;opacity:.55}
.ep-radio__input,.ep-checkbox__input{position:relative;display:inline-flex;align-items:center;margin-right:8px}
.ep-radio__original,.ep-checkbox__original{position:absolute;opacity:0;width:0;height:0;margin:0;padding:0;border:0}
.ep-radio__inner{position:relative;display:inline-block;width:16px;height:16px;border:1px solid var(--bd,#dcdfe6);border-radius:50%;background:var(--cb,#fff);box-sizing:border-box;transition:border-color .15s,background-color .15s}
.ep-radio.is-checked .ep-radio__inner{border-color:var(--pc,#409eff);background:var(--pc,#409eff)}
.ep-radio.is-checked .ep-radio__inner::after{content:'';position:absolute;left:5px;top:5px;width:4px;height:4px;border-radius:50%;background:#fff}
.ep-checkbox__inner{position:relative;display:inline-block;width:16px;height:16px;border:1px solid var(--bd,#dcdfe6);border-radius:3px;background:var(--cb,#fff);box-sizing:border-box;transition:border-color .15s,background-color .15s}
.ep-checkbox.is-checked .ep-checkbox__inner{border-color:var(--pc,#409eff);background:var(--pc,#409eff)}
.ep-checkbox.is-checked .ep-checkbox__inner::after{content:'';position:absolute;left:5px;top:2px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.ep-radio__label,.ep-checkbox__label{line-height:16px;padding-left:2px}
.ep-radio-group,.ep-checkbox-group{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.ep-radio-group.ep-radio-group--vertical,.ep-checkbox-group.ep-checkbox-group--vertical{flex-direction:column;align-items:flex-start}
.el-tag{transition:transform .12s ease}
.el-tag:active{transform:scale(.94)}
.el-pagination button,.el-pagination .el-pager li{transition:color .2s ease,background-color .2s ease,transform .12s ease}
.el-pagination button:active,.el-pagination .el-pager li:active{transform:scale(.94)}
/* #447 发货记录操作按钮 / 收银记录区 */
.ord-shiplog__acts{display:flex;gap:6px;margin-top:6px}
.ord-paylog{margin-top:10px;padding:10px 12px;background:var(--cd);border-radius:8px;box-shadow:var(--sh)}
.ord-paylog__title{font-weight:600;font-size:13px;color:var(--tc);margin-bottom:6px}
.ord-paylog__row{display:flex;align-items:center;justify-content:space-between;padding:4px 0;font-size:13px}
.ord-paylog__m{color:var(--ts)}
.ord-paylog__amt{color:var(--tc)}
.ord-paylog__meta{font-size:12px;color:var(--ts);margin-top:2px}
/* #443 POS 不允许配货提示 */
.pos-forbid-hint{padding:6px 16px;font-size:12px;color:var(--wc)}
/* 内部报销卡片样式 */
.rb-tab{display:inline-block;padding:5px 12px;border-radius:14px;font-size:12px;cursor:pointer;background:var(--cd);color:var(--ts);border:1px solid transparent}
.rb-tab.on{background:var(--pc);color:#fff;border-color:var(--pc)}
.rb-card{background:var(--cd);border:1px solid var(--br);border-radius:12px;padding:14px;margin:0 0 10px;cursor:pointer;box-shadow:var(--sh);transition:transform .15s,box-shadow .15s}
.rb-card:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.08)}
/* 2026-09-12 CSS 完整性修复：以下 .rb-card-* 选择器在拆包过程中丢失了声明块，
   且全库已无任何模板使用（内部报销页已改用其它类名），属死代码，直接清除。
   原状：8 个选择器连成一条永不匹配的后代选择器，既无样式也无收益。 */

/* #8 批量发货弹窗：整体内边距 + 各区块间距，避免文字挤在一起看不清 */
.bs-dlg .el-dialog__body{padding:14px 16px}
.bs-wrap{padding:2px}
.bs-step{padding:2px 2px 4px}
.bs-scroll{max-height:44vh;overflow:auto;-webkit-overflow-scrolling:touch;padding-right:2px}
.bs-head__img{width:44px;height:44px;object-fit:cover;border-radius:8px;flex:none;border:1px solid var(--bd)}
.bs-meta{font-size:12px;color:var(--ts)}
.bs-toolbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:8px;padding:8px;background:var(--cb);border-radius:8px}
.bs-total{margin-left:auto;font-size:12px;color:var(--ts)}
.bs-hint{font-size:12px;color:var(--ts);line-height:1.5;background:rgba(0,122,255,.06);border:1px solid rgba(0,122,255,.18);border-radius:8px;padding:7px 10px;margin-bottom:8px}
/* #183：列表被服务端上限截断时的告示条。用警告色而不是 --ts，
   因为它说的不是"提示"而是"你看到的不是全部"，滑过去就会少发货。 */
.bs-capped{font-size:12px;line-height:1.5;color:var(--wci);background:rgba(255,149,0,.10);border:1px solid rgba(255,149,0,.35);border-radius:8px;padding:7px 10px;margin-bottom:8px}
/* #185：分批渲染的展开条。它说的是"还有多少没画出来"，所以必须一直看得见，
   不能跟着列表一起滚走 —— 放在 .bs-scroll 之后。 */
.bs-more{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 0 2px}
.bs-more__tip{font-size:12px;line-height:1.5;color:var(--ts)}
/* #189：排队位置与排序口径。名次是解释「为什么这单发了那单没发」的依据，
   必须和订单号同一行看得见，不能只藏在按钮 title 里（手机上根本没有 hover）。 */
.bs-row__queue{font-size:11px;line-height:1.4;color:var(--sci);border:1px solid var(--bd);border-radius:6px;padding:1px 5px;white-space:nowrap}
.bs-hint--sort{margin-top:2px}
/* #190：第 2 步里标出「这一档已经加进清单」，点它是回去改而不是重新加一遍 */
.bs-pick__tag{margin-top:2px}
/* 选择行（商品 / 规格） */
.bs-pick{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--br);border-radius:8px;margin-bottom:8px;background:var(--cb);cursor:pointer;transition:background .15s ease,border-color .15s ease}
.bs-pick:active{background:var(--bg);border-color:var(--pc)}
.bs-pick__img{width:46px;height:46px;object-fit:cover;border-radius:8px;flex:none;border:1px solid var(--bd)}
.bs-pick__img--ph{display:flex;align-items:center;justify-content:center;color:var(--ts);background:var(--bg)}
.bs-pick__info{flex:1;min-width:0}
.bs-pick__name{font-size:14px;color:var(--tc);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bs-pick__meta{font-size:12px;color:var(--ts);margin-top:2px}
.bs-pick__right{display:flex;align-items:center;gap:6px;flex:none;color:var(--ts)}
.bs-pick__cnt{font-size:12px}
/* 订单行：加大间距，区分每一行 */
.bs-row{border:1px solid var(--br);border-radius:8px;padding:10px 12px;margin-bottom:10px;background:var(--cb);transition:background .15s ease,border-color .15s ease}
.bs-row--alloc{background:rgba(250,140,22,.10);border-color:var(--wc)}
.bs-row__hd{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:8px;flex-wrap:wrap}
.bs-row__no{color:var(--pci)}
.bs-row__cust{color:var(--tc);font-weight:500}
.bs-row__time{color:var(--ts);font-size:11px;margin-left:auto}
.bs-row__bd{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.bs-row__img{width:44px;height:44px;object-fit:cover;border-radius:8px;flex:none;border:1px solid var(--bd)}
.bs-row__input{width:118px;margin-left:auto}
.bs-qty-group{font-size:12px;color:var(--tc);background:var(--bg);border-radius:6px;padding:3px 8px;white-space:nowrap}
.bs-qty-group i{font-style:normal;color:var(--ts);margin-right:4px}
.bs-qty-group--hl{color:var(--wc);font-weight:600;background:rgba(250,140,22,.12)}
/* 预览批量发货单：表格形式 */
.bs-table{width:100%;border-collapse:collapse;font-size:12px}
.bs-table th,.bs-table td{border:1px solid var(--bd);padding:6px 8px;text-align:left;vertical-align:middle}
.bs-table th{background:var(--cb);color:var(--ts);font-weight:600;white-space:nowrap}
.bs-table td{color:var(--tc)}
.bs-table .num{text-align:right;white-space:nowrap}
.bs-table .bs-timg{width:32px;height:32px;object-fit:cover;border-radius:6px;vertical-align:middle}
/* #8 批量发货：候选订单行；已分配到数量时背景增强提示 */
.bs-row{border:1px solid var(--br);border-radius:8px;padding:8px 10px;margin-bottom:6px;background:var(--cb);transition:background .15s ease,border-color .15s ease}
.bs-row--alloc{background:rgba(250,140,22,.10);border-color:var(--wc)}
.bs-row__hd{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:6px}
.bs-row__bd{display:flex;align-items:center;gap:8px}
/* 销售退单样式（5.md §7.3）
   2026-09-12 CSS 完整性修复：原 8 条 .sret-card__* 选择器声明块丢失，且全库已无模板引用
   （销售退单页已改用其它命名），按死代码清除，避免残留永不匹配的选择器。 */

/* 2026-10-06（#350）：原 @media print{body.recon-printing …} 整块删除 —— body 上这个类全仓
   没有任何代码施加（对账打印走 exportReconPdf/jsPDF），.van-nav-bar 也早由 ep-nav-bar 取代。
   与 #37 删掉 ship-rec-printing 死块同一先例：打印样式由打印件自己的文档负责，不靠 body 类。 */

/* #104（2026-09-24）：批量发货 —— 已添加规格清单（看得见 / 点得回 / 删得掉）+ 配货方向选择 */
.bs-added{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:8px;background:var(--cb);border:1px solid var(--br);border-radius:8px;margin-bottom:8px}
.bs-added__title{font-size:12px;color:var(--ts);flex:none}
.bs-added__chip{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border:1px solid var(--bd);border-radius:999px;background:var(--bg);font-size:12px;color:var(--tc);cursor:pointer;max-width:100%}
.bs-added__chip--on{border-color:var(--pc);box-shadow:0 0 0 2px var(--pc-15,rgba(0,122,255,.15))}
.bs-added__chip b{font-weight:600;white-space:nowrap}
.bs-added__chip i{font-style:normal;color:var(--ts);white-space:nowrap}
.bs-added__x{font-size:13px;color:var(--ts);flex:none}
.bs-added__x:hover{color:var(--dc)}
.bs-added__sum{margin-left:auto;font-size:12px;color:var(--ts);flex:none}
.bs-dir{flex:none;padding:2px;margin:0}
.bs-dir .seg-tab{padding:4px 10px;font-size:12px}