/* ==========================================================================
   街边咖啡 · 电子菜单
   菜单视觉完全对齐参考稿（背景 #3FA9F5，竖向滚动，底部 LOGO / MENU 固定）
   ========================================================================== */

:root{
  --brand-blue:#3FA9F5;
  --menu-bg:#3FA9F5;      /* 菜单页背景，后台可改；--menu-bg-rgb 供渐变用 */
  --menu-bg-rgb:63,169,245;
  --cols:5;
  --col:256px;          /* 单列宽度，由 JS 实测写入，用于等比缩放字号 */
  --pad-x:3.6vw;
  --logo-w:16vw;
  --foot-h:calc(var(--logo-w) * 0.659 + 1.2vh);
  --ink:#0F172A;
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  background:var(--menu-bg);
  font-family:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overscroll-behavior:none;
}
img{border:0;}
button{font-family:inherit;}

/* ============================ 菜单 ============================ */
.menu-view{position:fixed;inset:0;background:var(--menu-bg);overflow:hidden;}

.menu-scroll{
  position:absolute;inset:0;
  overflow-y:auto;overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
  scrollbar-width:none;
  padding-bottom:calc(var(--foot-h) + 1.5vh);
}
.menu-scroll::-webkit-scrollbar{width:0;height:0;display:none;}

.menu-grid{
  display:grid;
  grid-template-columns:repeat(var(--cols),minmax(0,1fr));
  padding:calc(var(--col) * .17) var(--pad-x) 0;
  row-gap:calc(var(--col) * .246);
}

.mi{display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;}

.mi-thumb{
  width:100%;height:calc(var(--col) * .708);
  display:flex;align-items:flex-end;justify-content:center;
  position:relative;
}
.mi-thumb img{
  display:block;max-width:100%;max-height:100%;
  object-fit:contain;object-position:center bottom;
}

.mi-name{
  margin-top:calc(var(--col) * .078);
  font-size:calc(var(--col) * .134);
  line-height:1;font-weight:800;letter-spacing:.004em;color:#fff;
  -webkit-text-stroke:.028em #fff;
  transform:scaleX(.93);transform-origin:center center;
  white-space:nowrap;
}
.mi-en{
  margin-top:calc(var(--col) * .008);
  font-family:"Helvetica Neue",Helvetica,Arial,"Segoe UI",sans-serif;
  font-size:calc(var(--col) * .083);
  line-height:1;font-weight:800;font-style:italic;letter-spacing:.004em;color:#fff;
  transform:scaleX(.87);transform-origin:center center;
  white-space:nowrap;
}
.mi-price{
  margin-top:calc(var(--col) * .024);
  font-family:"Helvetica Neue",Helvetica,Arial,"Segoe UI",sans-serif;
  font-size:calc(var(--col) * .124);
  line-height:1;font-weight:800;color:#fff;white-space:nowrap;
  letter-spacing:.01em;-webkit-text-stroke:.026em #fff;
  display:flex;align-items:baseline;justify-content:center;
}
.mi-price .cur{font-size:.70em;margin-right:.22em;font-weight:800;}

/* 估清状态 */
.mi.is-out .mi-thumb img{filter:grayscale(1) brightness(1.03) contrast(.94);opacity:.95;}
.mi.is-out .mi-name,
.mi.is-out .mi-en,
.mi.is-out .mi-price{opacity:.62;}
.mi-out-tag{
  position:absolute;left:50%;top:calc(var(--col) * .30);
  transform:translate(-50%,-50%);
  background:#fff;color:var(--brand-blue);
  font-size:calc(var(--col) * .058);font-weight:700;letter-spacing:.16em;
  padding:.42em .55em .42em .71em;border-radius:999px;line-height:1;
  box-shadow:0 2px 10px rgba(0,40,80,.12);
}

/* 本月销量 TOP3 角标（图片右上角，数据每天统计一次、次日更新） */
.mi-top{
  position:absolute;top:0;right:0;z-index:2;
  padding:.34em .52em;border-radius:999px;
  font-family:"Helvetica Neue",Helvetica,Arial,"Segoe UI",sans-serif;
  font-size:clamp(8.5px,calc(var(--col) * .058),13px);
  font-weight:900;line-height:1;letter-spacing:.02em;white-space:nowrap;
  color:#6B4400;
  background:linear-gradient(135deg,#FFE9A6 0%,#FFC53D 100%);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 2px 7px rgba(0,40,80,.22);
  pointer-events:none;
  /* 图片懒加载完成前不显示：此时量不到图片尺寸，角标只能停在缩略图默认位置，
     会浮在空白处看着像多出来的 */
  opacity:0;
}
.mi-top.on{opacity:1;}
.mi-top.t2{color:#3C4B5A;background:linear-gradient(135deg,#F8FBFE 0%,#C9D6E2 100%);}
.mi-top.t3{color:#5B3521;background:linear-gradient(135deg,#FBE1CA 0%,#DCA173 100%);}

.menu-empty{
  padding:22vh 8vw 0;text-align:center;color:#fff;
  font-size:calc(var(--col) * .09);font-weight:700;opacity:.9;letter-spacing:.06em;
}

/* 底部固定 LOGO + MENU */
.menu-foot{
  position:fixed;left:0;right:0;bottom:0;z-index:20;
  height:var(--foot-h);
  padding:0 1.2vw 1vh calc(2.4vw + env(safe-area-inset-left, 0px));
  background:var(--menu-bg);
  display:flex;align-items:flex-end;justify-content:space-between;
  /* 底栏保持 pointer-events:none：从这一带起手仍能拖动菜单滚动。
     拦截逻辑在 cart.js 的点击处理里按坐标判掉（点在这里不算点商品） */
  pointer-events:none;
}
.menu-foot::before{
  content:"";position:absolute;left:0;right:0;bottom:100%;height:2.4vh;
  background:linear-gradient(to top,var(--menu-bg) 15%,rgba(var(--menu-bg-rgb),0));
  pointer-events:none;
}
/* LOGO 允许后台换成任意比例，用 max-height + contain 保证不会撑破底栏、盖住菜单 */
.menu-foot .logo{
  width:var(--logo-w);height:auto;max-height:calc(var(--foot-h) * .92);max-width:42vw;
  object-fit:contain;object-position:left bottom;
  display:block;pointer-events:auto;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;
  /* 长按进后台要吃掉手势，避免浏览器把长按判成滚动/选图而中断 */
  touch-action:none;-webkit-tap-highlight-color:transparent;
}
.menu-foot .word{width:calc(var(--logo-w) * 2.079);height:auto;display:block;pointer-events:none;}

@media (max-aspect-ratio: 3/4){
  :root{--logo-w:29vw;--pad-x:5vw;}
}
@media (min-width:1500px){
  :root{--pad-x:6vw;}
}

/* ============================ 管理后台 ============================ */
.adm{
  min-height:100%;
  background:#EEF3F9;
  color:var(--ink);
  font-size:14px;
  padding-bottom:80px;
}
.adm *{box-sizing:border-box;}

.adm-top{
  position:sticky;top:0;z-index:30;
  background:var(--brand-blue);
  color:#fff;
  padding:14px 18px;
  display:flex;align-items:center;gap:12px;
  box-shadow:0 2px 14px rgba(15,40,80,.12);
}
.adm-top h1{font-size:16px;margin:0;font-weight:800;letter-spacing:.04em;}
.adm-top .sp{flex:1;}
.adm-top .ghost{
  background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.4);
  border-radius:999px;padding:7px 14px;font-size:13px;font-weight:600;cursor:pointer;
  text-decoration:none;display:inline-flex;align-items:center;gap:6px;
}
.adm-top .ghost:hover{background:rgba(255,255,255,.3);}

/* 云端同步状态 */
.adm-top .sync{
  font-size:12px;font-weight:700;line-height:1;
  padding:6px 11px;border-radius:999px;white-space:nowrap;
  background:rgba(255,255,255,.16);color:#EAF4FF;
  border:1px solid rgba(255,255,255,.28);
}
.adm-top .sync.ok{background:rgba(46,204,138,.26);border-color:rgba(160,255,215,.6);color:#E9FFF6;}
.adm-top .sync.saving{background:rgba(255,214,102,.24);border-color:rgba(255,231,168,.7);color:#FFF8E3;}
.adm-top .sync.error{background:rgba(255,120,120,.3);border-color:rgba(255,190,190,.75);color:#FFF0F0;}
.adm-top .sync.local{background:rgba(255,255,255,.14);color:#E4EEFA;}

/* ---------------- 未收款提醒（顶栏铃铛 + 悬浮面板） ---------------- */
.adm-top .bell{
  position:relative;flex:none;
  width:34px;height:34px;border-radius:999px;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.18);color:#fff;
  border:1px solid rgba(255,255,255,.4);cursor:pointer;
  transition:background .15s,color .15s;
}
.adm-top .bell:hover{background:rgba(255,255,255,.3);}
/* 有待收款时反白，一眼能看到 */
.adm-top .bell.has{background:#fff;color:#E8622F;border-color:#fff;}
.adm-top .bell.open{box-shadow:0 0 0 3px rgba(255,255,255,.26);}
.bell-dot{
  position:absolute;top:-5px;right:-5px;min-width:18px;height:18px;
  border-radius:999px;background:#FF5A3C;color:#fff;
  font-size:10.5px;font-weight:800;line-height:18px;text-align:center;
  padding:0 4px;box-shadow:0 0 0 2px var(--brand-blue);
}

.bell-pop{
  position:absolute;top:calc(100% - 2px);right:18px;z-index:70;
  width:min(370px,calc(100vw - 20px));
  background:#fff;border-radius:16px;padding:8px;color:var(--ink);
  box-shadow:0 20px 48px rgba(9,30,66,.28);
  opacity:0;transform:translateY(-6px);pointer-events:none;
  transition:opacity .14s ease,transform .14s ease;
}
.bell-pop.on{opacity:1;transform:none;pointer-events:auto;}
.bell-head{
  display:flex;align-items:center;gap:6px;
  padding:6px 10px 9px;border-bottom:1px solid #EEF1F6;
  font-size:12.5px;color:#64748B;font-weight:700;
}
.bell-head b{font-size:13.5px;color:var(--ink);}
.bell-n{
  background:#FFF0EA;color:#D9532B;border-radius:999px;
  font-size:11px;font-weight:800;padding:1px 7px;
}
.bell-sp{flex:1;}
.bell-head i{font-style:normal;font-size:12px;color:#8A9AB0;font-weight:600;}
.bell-empty{padding:26px 12px;text-align:center;font-size:13px;color:#8A9AB0;}
.bell-list{max-height:min(56vh,380px);overflow:auto;padding:4px 0;}
.bell-item{
  width:100%;display:flex;align-items:center;gap:10px;
  padding:10px;border:0;background:transparent;border-radius:11px;
  cursor:pointer;text-align:left;font-family:inherit;
}
.bell-item:hover{background:#F4F9FF;}
.bi-code{
  flex:none;min-width:46px;text-align:center;
  background:#EEF6FF;color:#2C7BD0;border-radius:8px;
  font-size:13px;font-weight:800;padding:6px;letter-spacing:.02em;
}
.bi-main{flex:1;min-width:0;}
.bi-l1{display:flex;align-items:baseline;gap:8px;}
.bi-l1 b{font-size:14px;font-weight:800;color:var(--ink);}
.bi-l1 i{font-style:normal;font-size:11.5px;color:#E8622F;font-weight:700;}
.bi-main em{
  display:block;font-style:normal;font-size:12px;color:#5A6B82;margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.bi-main u{
  display:block;text-decoration:none;font-size:11.5px;color:#8A9AB0;margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.bi-go{
  flex:none;background:var(--brand-blue);color:#fff;border-radius:8px;
  font-size:12px;font-weight:800;padding:6px 12px;
}
.bell-item:hover .bi-go{filter:brightness(.96);}
@media (max-width:640px){
  .adm-top .bell{width:30px;height:30px;}
  .bell-pop{right:12px;}
}

/* 改备注弹窗 */
.note-modal{width:min(420px,100%);}
.note-modal textarea{
  width:100%;border:1px solid #DDE5F0;border-radius:10px;
  padding:10px 12px;font-size:14px;font-family:inherit;color:var(--ink);
  resize:vertical;min-height:76px;line-height:1.5;
}
.note-modal textarea:focus{outline:2px solid rgba(63,169,245,.35);border-color:var(--brand-blue);}

@media (max-width:640px){
  .adm-top{padding:12px 12px;gap:8px;}
  .adm-top h1{font-size:14px;}
  .adm-top .sync{font-size:11px;padding:5px 9px;}
  .adm-top .ghost{padding:6px 10px;font-size:12px;}
  /* 手机顶栏放不下这么多字：标题不折行，同步状态缩成指示灯，
     二维码只留图标，预览菜单只留箭头（图标按钮都保留，功能不丢） */
  .adm-top h1{font-size:13px;white-space:nowrap;flex:none;}
  .adm-top .sync{
    width:12px;height:12px;min-width:12px;padding:0;border-radius:999px;
    font-size:0;line-height:0;overflow:hidden;text-indent:-99px;
  }
  .adm-top .qr-entry{padding:7px 9px;}
  .adm-top .qr-entry span{display:none;}
  .adm-top .gh-t{display:none;}
  .adm-top .ghost{flex:none;white-space:nowrap;}
}

.adm-tabs{
  display:flex;gap:8px;padding:14px 18px 0;max-width:1080px;margin:0 auto;
  overflow-x:auto;scrollbar-width:none;
}
.adm-tabs::-webkit-scrollbar{display:none;}
.adm-tabs button{
  border:0;background:#fff;color:#475569;border-radius:10px;padding:9px 16px;
  font-size:13.5px;font-weight:700;cursor:pointer;white-space:nowrap;
  box-shadow:0 1px 2px rgba(15,23,42,.06);
}
.adm-tabs button.on{background:var(--brand-blue);color:#fff;box-shadow:0 6px 16px rgba(63,169,245,.35);}

.adm-main{max-width:1080px;margin:0 auto;padding:14px 18px 0;}
.panel{display:none;}
.panel.on{display:block;}

.card{
  background:#fff;border-radius:16px;padding:16px;
  box-shadow:0 2px 12px rgba(15,23,42,.06);
  margin-bottom:14px;
}
.card h3{margin:0 0 4px;font-size:14.5px;font-weight:800;}
.card .hint{margin:0;color:#7C8CA1;font-size:12.5px;line-height:1.65;}
.card-head{display:flex;align-items:center;gap:10px;margin-bottom:12px;}
.card-head h3{margin:0;flex:1;}

.btn{
  border:1px solid #DDE5F0;background:#fff;color:#1E293B;
  border-radius:10px;padding:8px 14px;font-size:13px;font-weight:700;cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;transition:.15s;
}
.btn:hover{border-color:#B9CBE0;background:#F7FAFE;}
.btn.primary{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff;}
.btn.primary:hover{filter:brightness(.96);background:var(--brand-blue);}
.btn.danger{color:#D33B3B;border-color:#F3C9C9;}
.btn.danger:hover{background:#FFF5F5;}
.btn.sm{padding:6px 10px;font-size:12.5px;border-radius:9px;}
.btn:disabled{opacity:.45;cursor:not-allowed;}
.btn[hidden]{display:none !important;}

.adm-storebar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.adm-storebar label{font-size:12.5px;color:#64748B;font-weight:700;}
.adm-storebar input{
  border:1px solid #DDE5F0;border-radius:9px;padding:8px 12px;font-size:13.5px;
  font-family:inherit;color:var(--ink);min-width:180px;
}
.adm-storebar input:focus{outline:2px solid rgba(63,169,245,.35);border-color:var(--brand-blue);}

/* 商品行 */
.item-list{display:flex;flex-direction:column;gap:10px;}
.irow{
  display:flex;align-items:center;gap:12px;
  background:#fff;border:1px solid #E8EEF7;border-radius:14px;padding:10px 12px;
}
.irow.off{background:#FAFBFD;}
.irow.off .irow-name{color:#94A3B8;}
.irow-thumb{
  width:54px;height:54px;flex:0 0 54px;border-radius:10px;background:#F0F7FF;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.irow-thumb img{max-width:100%;max-height:100%;object-fit:contain;}
.irow-main{flex:1;min-width:0;}
.irow-name{font-weight:800;font-size:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.irow-name .en{font-weight:600;color:#8A9AB0;font-size:12px;font-style:italic;}
.irow-price{color:#D9523D;font-weight:800;font-size:13px;margin-top:3px;}
.irow-price small{color:#9AA8BA;font-weight:600;margin-left:8px;}

.pill{
  border:1px solid #DDE5F0;background:#fff;border-radius:999px;
  padding:5px 11px;font-size:12px;font-weight:700;color:#64748B;cursor:pointer;
  white-space:nowrap;
}
.pill.on-sale{background:#E8F7EE;border-color:#BFE8CE;color:#17864B;}
.pill.out{background:#FFF2E2;border-color:#F8D8AE;color:#B26B0C;}
.pill.offline{background:#F1F4F9;border-color:#E2E8F1;color:#7C8CA1;}
.irow-ops{display:flex;align-items:center;gap:6px;}
.irow-actions{display:flex;align-items:center;gap:10px;}

.iconbtn{
  width:30px;height:30px;border-radius:9px;border:1px solid #E3EAF4;background:#fff;
  color:#64748B;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;
}
.iconbtn:hover{background:#F4F8FD;color:var(--brand-blue);border-color:#C9DCF0;}
.iconbtn:disabled{opacity:.35;cursor:not-allowed;}

@media (max-width:640px){
  .irow{flex-wrap:wrap;gap:10px;}
  .irow-actions{width:100%;justify-content:space-between;}
}

/* 弹窗 */
.modal-mask{
  position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:100;
  display:flex;align-items:center;justify-content:center;padding:16px;
  backdrop-filter:blur(2px);
}
.modal{
  background:#fff;border-radius:18px;width:min(460px,100%);
  max-height:92vh;overflow:auto;padding:18px;
  box-shadow:0 24px 60px rgba(15,23,42,.3);
}
.modal h3{margin:0 0 14px;font-size:16px;font-weight:800;}
.field{margin-bottom:12px;}
.field label{display:block;font-size:12.5px;font-weight:700;color:#64748B;margin-bottom:6px;}
.field input[type=text],.field input[type=number],.field input[type=password]{
  width:100%;border:1px solid #DDE5F0;border-radius:10px;padding:10px 12px;
  font-size:14px;font-family:inherit;color:var(--ink);
}
.field input:focus{outline:2px solid rgba(63,169,245,.35);border-color:var(--brand-blue);}
.field .row2{display:flex;gap:10px;}
.field .row2>*{flex:1;}

.dropzone{
  border:1.5px dashed #C6D6E8;border-radius:14px;background:#F7FAFE;
  padding:16px;text-align:center;cursor:pointer;transition:.15s;
}
.dropzone:hover,.dropzone.over{border-color:var(--brand-blue);background:#EEF7FF;}
.dropzone .dz-t{font-size:13px;font-weight:700;color:#3E5670;}
.dropzone .dz-s{font-size:12px;color:#8A9AB0;margin-top:4px;}
.dropzone img{max-height:110px;max-width:100%;object-fit:contain;}
.dropzone.has-img{padding:10px;background:#fff;border-style:solid;border-color:#E3EAF4;}

.modal-foot{display:flex;justify-content:flex-end;gap:8px;margin-top:6px;}

/* 收款确认弹窗 */
.pay-modal{width:min(420px,100%);}
/* 三段式：内容多（有收款码）时中间滚动，底部按钮永远在屏幕里 */
.pay-modal{padding:0;display:flex;flex-direction:column;overflow:hidden;}
.pay-body{padding:18px 18px 10px;overflow-y:auto;flex:1 1 auto;min-height:0;}
.pay-foot{margin-top:0;padding:12px 18px;border-top:1px solid #EEF1F6;flex:none;background:#fff;}
.pay-recv{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  background:#F7FAFE;border:1px solid #E6EEF8;border-radius:12px;padding:10px 14px;margin-bottom:12px;
}
.pay-recv span{font-size:12.5px;color:#64748B;font-weight:700;}
/* 应收只是个参考值（下面输入框里才是真正要收的钱），别抢收款码金额的视觉重心 */
.pay-recv b{font-size:15.5px;font-weight:700;color:#475569;}
.pay-input{position:relative;display:flex;align-items:center;}
.pay-input i{position:absolute;left:12px;font-style:normal;font-size:15px;font-weight:800;color:#64748B;}
.pay-input input{
  width:100%;border:1px solid #DDE5F0;border-radius:10px;padding:10px 12px 10px 30px;
  font-size:18px;font-weight:800;font-family:inherit;color:var(--ink);
  appearance:textfield;-moz-appearance:textfield;-webkit-appearance:none;
}
/* 上一条会被 .field input[type=number] 的 padding 覆盖，这里用 id 提权，保证给 ¥ 留出位置 */
#payMask .pay-input input[type=number]{padding-left:31px;}
.pay-input input::-webkit-outer-spin-button,
.pay-input input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.pay-input input:focus{outline:2px solid rgba(63,169,245,.35);border-color:var(--brand-blue);}
.pay-disc{display:flex;gap:8px;flex-wrap:wrap;margin:2px 0 0;}
.pchip{
  flex:1;min-width:98px;border:1px solid #DDE5F0;background:#fff;border-radius:10px;padding:8px 6px;
  font-size:12.5px;font-weight:700;color:#3E5670;font-family:inherit;cursor:pointer;
  transition:.15s;white-space:nowrap;
}
.pchip:hover{border-color:var(--brand-blue);color:var(--brand-blue);}
.pchip.on{border-color:var(--brand-blue);background:#EEF7FF;color:var(--brand-blue);box-shadow:inset 0 0 0 1px rgba(63,169,245,.35);}
.pay-tip{margin:6px 0 0;font-size:12px;font-weight:700;color:#B26B0C;min-height:17px;opacity:0;transition:.15s;}
.pay-tip.show{opacity:1;}
@media (max-width:520px){
  .pchip{min-width:0;font-size:12px;padding:8px 4px;}
}

/* 收款弹窗里的静态收款码（码里不带金额，顾客手输） */
.pay-qr{margin:0 0 12px;text-align:center;}
.pay-qrtabs{display:flex;justify-content:center;gap:6px;margin-bottom:8px;min-height:24px;align-items:center;}
.qrt{
  border:1px solid #DDE5F0;background:#fff;border-radius:999px;padding:4px 16px;
  font-size:12px;font-weight:700;color:#3E5670;font-family:inherit;cursor:pointer;transition:.15s;
}
.qrt:hover{border-color:var(--brand-blue);color:var(--brand-blue);}
.qrt.on{border-color:var(--brand-blue);background:#EEF7FF;color:var(--brand-blue);}
.qrt-one{font-size:12px;font-weight:700;color:#8A9AB0;}
.pay-qrimg{
  width:200px;height:200px;margin:0 auto;padding:6px;
  border:1px solid #E6EEF8;border-radius:12px;background:#fff;
  display:flex;align-items:center;justify-content:center;
}
.pay-qrimg img{width:100%;height:100%;object-fit:contain;display:block;}
/* 金额提示条：随实收金额实时变化，字号放大到顾客隔屏也能看清 */
.pay-qrhint{
  margin:9px auto 0;max-width:288px;
  display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
  background:#FFF7E9;border:1px solid #FADFB4;border-radius:12px;padding:10px 14px;
}
.pay-qrhint span{font-size:13px;font-weight:700;color:#8A6A20;line-height:1.3;}
.pay-qrhint b{
  font-size:28px;font-weight:900;color:#D9660A;line-height:1.05;letter-spacing:.01em;
  font-variant-numeric:tabular-nums;
}
@media (max-width:380px){ .pay-qrhint b{font-size:24px;} }
.pay-noqr{margin:0 0 12px;font-size:11.5px;color:#9AA9BC;text-align:center;}

/* 设置 → 收款码 */
.qr-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;}
.qr-pick{flex:1 1 132px;min-width:132px;max-width:180px;}
.qr-name{font-size:12px;font-weight:700;color:#64748B;margin-bottom:6px;}
.qr-thumb{
  width:100%;aspect-ratio:1 / 1;border:1.5px dashed #D6DEE9;border-radius:12px;background:#F7FAFE;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  font-size:11.5px;color:#9AA9BC;
}
.qr-thumb img{width:100%;height:100%;object-fit:contain;display:block;}
.qr-acts{display:flex;gap:6px;margin-top:8px;}

/* 发送账单：图片预览 */
.bill-modal{width:min(420px,100%);padding:16px 16px 14px;}
.bill-modal h3{margin-bottom:12px;}
.bill-shot{
  display:block;width:100%;height:auto;border-radius:10px;
  background:#F5F6F7;user-select:auto;-webkit-user-select:auto;
}
.bill-tip{margin:10px 0 12px;font-size:12px;color:#8A9AB0;text-align:center;}
.bill-modal .modal-foot{justify-content:center;}
.bill-modal .modal-foot .btn{min-width:132px;justify-content:center;}
@media (max-width:520px){
  .bill-modal{padding:14px 12px 12px;}
}

/* 二维码 */
.qr-preview{
  display:flex;flex-direction:column;align-items:center;gap:10px;
  background:#F7FAFE;border-radius:14px;padding:14px;margin-top:12px;
}
.qr-preview canvas,.qr-preview svg{width:180px;height:180px;background:#fff;border-radius:8px;padding:6px;box-shadow:0 1px 4px rgba(15,23,42,.08);}
.qr-preview .cap{font-size:12px;color:#7C8CA1;text-align:center;word-break:break-all;line-height:1.5;}

/* 顶栏 · 二维码入口 */
.adm-top .qr-entry{display:inline-flex;align-items:center;gap:6px;}

/* 菜单二维码悬浮层 */
.qr-modal{width:min(400px,100%);text-align:center;max-height:94vh;}
.qr-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.qr-head h3{margin:0;}
.qr-x{
  border:0;background:transparent;padding:0 6px;margin:-6px -6px 0 0;
  font-size:24px;line-height:1;color:#8A9AB0;cursor:pointer;
}
.qr-x:hover{color:#0F172A;}
.qr-modal .hint{text-align:left;margin:0 0 12px;}
.qr-modal .qr-preview{margin-top:0;}
.qr-modal .qr-preview svg{width:224px;height:224px;padding:8px;}
.qr-url{
  margin-top:10px;background:#F7FAFE;border:1px solid #E7EEF6;
  border-radius:9px;padding:8px 10px;text-align:left;
}
.qr-url code{
  font-size:11px;color:#5A6B82;word-break:break-all;line-height:1.5;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.qr-modal .qr-warn{
  margin:8px 0 0;padding:7px 9px;border-radius:8px;
  background:#FFF7E6;color:#A66A0E;text-align:left;
}
.qr-acts{display:flex;gap:8px;justify-content:center;margin-top:14px;}

.result{
  margin-top:12px;border-radius:12px;padding:12px;background:#F7FAFE;
  border:1px solid #E6EDF6;font-size:12.5px;line-height:1.7;color:#3E5670;
}
.result b{color:var(--ink);}
.result .code{
  display:block;margin-top:6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11.5px;color:#5B7086;word-break:break-all;
}
.result.warn{background:#FFF8EE;border-color:#F6E0BE;}
.result.warn b{color:#B26B0C;}
.result.ok{background:#F2FBF5;border-color:#CDEBD8;}
.result.ok b{color:#17864B;}
.res-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}

/* ======================= 商品编辑（手动录入主表单） ======================= */
.modal.wide{width:min(720px,100%);}
.modal h3 .sub{font-size:12px;font-weight:600;color:#8A9AB0;margin-left:8px;}

.ed-grid{display:grid;grid-template-columns:250px minmax(0,1fr);gap:18px;}
@media (max-width:640px){.ed-grid{grid-template-columns:1fr;}}

.ed-media .dropzone{
  min-height:198px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  padding:14px;
}
.ed-media .dropzone.has-img{
  background:var(--brand-blue);border:1px solid var(--brand-blue);padding:12px;
}
.ed-media .dropzone.has-img img{max-height:172px;max-width:100%;object-fit:contain;}
.ed-tools{display:flex;align-items:center;gap:8px;margin-top:8px;}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:#64748B;cursor:pointer;margin-top:8px;user-select:none;}
.chk input{width:14px;height:14px;accent-color:var(--brand-blue);margin:0;}
.ed-media-tip{font-size:11.5px;line-height:1.6;color:#93A2B5;margin-top:8px;}

.ed-fields .field{margin-bottom:12px;}
.field label .cnt{float:right;font-size:11px;font-weight:600;color:#A6B4C6;letter-spacing:.02em;}
.field input.invalid{border-color:#E9A0A0;background:#FFF7F7;}

.ed-preview{margin-top:14px;border:1px solid #E8EEF7;border-radius:12px;padding:10px;background:#FBFDFF;}
.ed-preview .cap{font-size:11.5px;color:#8A9AB0;font-weight:700;margin-bottom:8px;letter-spacing:.04em;}
.edp-stage{
  --pcol:150px;
  background:var(--menu-bg);border-radius:10px;padding:calc(var(--pcol) * .16) 8px 14px;
  display:flex;justify-content:center;
}
.edp-item{width:var(--pcol);display:flex;flex-direction:column;align-items:center;text-align:center;}
.edp-thumb{width:100%;height:calc(var(--pcol) * .708);display:flex;align-items:flex-end;justify-content:center;}
.edp-thumb img{max-width:100%;max-height:100%;object-fit:contain;object-position:center bottom;}
.edp-name{
  margin-top:calc(var(--pcol) * .078);font-size:calc(var(--pcol) * .134);line-height:1;
  font-weight:800;color:#fff;-webkit-text-stroke:.026em #fff;
  transform:scaleX(.93);transform-origin:center center;white-space:nowrap;
}
.edp-en{
  margin-top:calc(var(--pcol) * .008);font-size:calc(var(--pcol) * .083);line-height:1;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:800;font-style:italic;
  color:#fff;transform:scaleX(.87);transform-origin:center center;white-space:nowrap;
}
.edp-price{
  margin-top:calc(var(--pcol) * .024);font-size:calc(var(--pcol) * .124);line-height:1;
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:800;color:#fff;
  -webkit-text-stroke:.026em #fff;letter-spacing:.01em;white-space:nowrap;
}
.edp-price .cur{font-size:.70em;margin-right:.22em;}

/* 批量录入 */
.bulk-ta{
  width:100%;min-height:168px;margin-top:12px;border:1px solid #DDE5F0;border-radius:12px;
  padding:12px;font-size:13px;line-height:1.75;color:var(--ink);resize:vertical;
  font-family:ui-monospace,SFMono-Regular,Menlo,"PingFang SC",monospace;
}
.bulk-ta:focus{outline:2px solid rgba(63,169,245,.35);border-color:var(--brand-blue);}
.bulk-foot{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12.5px;color:#7C8CA1;}
.bulk-foot b{color:var(--ink);}

.irow-thumb .noimg{font-size:11px;color:#B4C1D2;}
.irow-name .en.miss{color:#C2A16B;font-style:normal;}

@media (max-width:640px){
  .modal{padding:16px 16px 0;}
  .modal-foot{
    flex-wrap:wrap;position:sticky;bottom:0;z-index:2;gap:8px;
    background:#fff;padding:10px 0 calc(12px + env(safe-area-inset-bottom, 0px));
    border-top:1px solid #EEF2F8;
  }
  .modal-foot .btn{flex:1;justify-content:center;}
  .ed-media .dropzone{min-height:170px;}
  .ed-media .dropzone.has-img img{max-height:140px;}
}

/* ====================== 后台登录 / 设置 ====================== */
.lock{
  position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:20px;
  background:radial-gradient(120% 90% at 50% 0%, #57B6F7 0%, #3FA9F5 46%, #2E8FDB 100%);
}
.lock-card{
  width:min(360px,100%);background:#fff;border-radius:22px;padding:26px 24px 20px;
  text-align:center;box-shadow:0 24px 60px rgba(9,45,80,.28);
}
/* LOGO 与菜单底部同源（后台可换图，任意比例都用 contain 收进框内）；
   浅色 LOGO 会自动垫一块菜单底色，白卡片上也看得清 */
.lock-logo-box{
  width:118px;height:100px;margin:0 auto 14px;border-radius:20px;
  display:flex;align-items:center;justify-content:center;
  transition:background .18s ease, box-shadow .18s ease;
}
.lock-logo-box.on-tint{
  background:var(--lock-tint,#3FA9F5);
  box-shadow:0 8px 20px rgba(63,169,245,.26);
}
.lock-logo{
  max-width:100px;max-height:80px;width:auto;height:auto;
  object-fit:contain;display:block;
}
.lock-card h2{margin:0;font-size:17px;font-weight:800;color:var(--ink);letter-spacing:.02em;}
.lock-sub{margin:6px 0 16px;font-size:12.5px;color:#8A9AB0;}
.lock-input{
  width:100%;height:46px;border:1px solid #DDE5F0;border-radius:12px;
  text-align:center;font-size:16px;letter-spacing:.3em;padding:0 12px;color:var(--ink);
  font-family:inherit;
}
.lock-input:focus{outline:none;border-color:var(--brand-blue);box-shadow:0 0 0 3px rgba(63,169,245,.18);}
.lock-err{min-height:18px;font-size:12px;color:#D33B3B;margin:6px 0 4px;font-weight:600;}
.btn.block{display:flex;width:100%;justify-content:center;height:46px;border-radius:12px;font-size:14.5px;}
.lock-tip{margin:14px 0 0;font-size:11.5px;color:#93A2B5;line-height:1.6;}
.lock-tip b{color:#B26B0C;}
.lock-back{display:inline-block;margin-top:12px;font-size:12.5px;color:#7C8CA1;text-decoration:none;}
.lock-back:hover{color:var(--brand-blue);}
@keyframes lockShake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-7px)}40%{transform:translateX(6px)}
  60%{transform:translateX(-4px)}80%{transform:translateX(3px)}
}
.lock-card.shake{animation:lockShake .38s ease;}

.pw-form{max-width:380px;margin-top:14px;}
.pw-form .field{margin-bottom:10px;}
.pw-form .btn{margin-top:2px;}

.toast{
  position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);
  background:rgba(15,23,42,.92);color:#fff;padding:10px 18px;border-radius:999px;
  font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:.22s;z-index:200;
  max-width:86vw;text-align:center;
}
.toast.show{opacity:1;transform:translate(-50%,0);}

.file-hidden{display:none !important;}

/* ============================ 设置 · 菜单外观 ============================ */
.bg-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.bg-row input[type=color]{
  width:52px;height:40px;padding:0;border:1px solid #DDE5F0;border-radius:10px;
  background:#fff;cursor:pointer;flex:0 0 auto;appearance:none;-webkit-appearance:none;
}
.bg-row input[type=color]::-webkit-color-swatch-wrapper{padding:4px;}
.bg-row input[type=color]::-webkit-color-swatch{border:0;border-radius:7px;}
.bg-row input[type=color]::-moz-color-swatch{border:0;border-radius:7px;}
.bg-row #bgHex{
  width:118px;flex:0 0 auto;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.06em;text-transform:uppercase;
}
.bg-swatches{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.bg-swatches .sw{
  width:34px;height:34px;border-radius:10px;border:2px solid #fff;cursor:pointer;padding:0;
  box-shadow:0 0 0 1px #DDE5F0;transition:transform .12s,box-shadow .12s;
}
.bg-swatches .sw:hover{transform:translateY(-1px);}
.bg-swatches .sw.on{box-shadow:0 0 0 2px var(--brand-blue);}
.logo-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.logo-box{
  min-width:168px;height:70px;padding:9px 14px;border-radius:12px;
  background:#1F4E79;display:flex;align-items:center;justify-content:center;flex:0 0 auto;
}
.logo-box img{max-height:52px;max-width:160px;object-fit:contain;display:block;}
.logo-acts{display:flex;gap:8px;flex-wrap:wrap;}

/* ==========================================================================
   顾客端 · 购物车 / 下单（全部为新增类，不改动上方既有菜单样式）
   ========================================================================== */
.cart-layer{position:fixed;inset:0;z-index:40;pointer-events:none;}
.cart-layer>*{pointer-events:auto;}

/* 商品上的已选数量角标（绝对定位，不参与 --col 布局计算） */
.mi-qty{
  position:absolute;right:1%;top:0;
  min-width:calc(var(--col) * .135);height:calc(var(--col) * .135);
  padding:0 calc(var(--col) * .03);
  border-radius:999px;background:#FFFFFF;color:#0F172A;
  font-size:calc(var(--col) * .082);font-weight:800;line-height:1;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 2px 8px rgba(15,23,42,.28);
  pointer-events:none;
}
.mi:active .mi-thumb{transform:scale(.96);transition:transform .12s ease;}

/* 底部悬浮结算条：靠右，左下角 LOGO 区域保持可点 */
.cart-bar{
  position:fixed;right:max(14px,3.4vw);bottom:calc(var(--foot-h) + 14px);
  display:flex;align-items:center;gap:10px;
  padding:9px 10px 9px 14px;border:0;border-radius:999px;
  background:#0F172A;color:#fff;
  font-size:14px;font-weight:700;letter-spacing:.01em;
  box-shadow:0 10px 26px rgba(15,23,42,.32);
  cursor:pointer;transition:transform .14s ease;
}
.cart-bar:active{transform:scale(.97);}
.cart-ico{position:relative;display:flex;align-items:center;}
.cart-dot{
  position:absolute;top:-7px;right:-9px;min-width:16px;height:16px;padding:0 4px;
  border-radius:999px;background:#FF5A3C;color:#fff;font-style:normal;
  font-size:10px;font-weight:800;line-height:16px;text-align:center;
}
.cart-sum{font-size:16px;}
.cart-go{
  background:#FFFFFF;color:#0F172A;border-radius:999px;
  padding:7px 14px;font-size:13px;font-weight:800;
}

/* 上一单入口（空车时才有） */
.cart-chip{
  position:fixed;right:max(14px,3.4vw);bottom:calc(var(--foot-h) + 14px);
  display:flex;align-items:center;gap:6px;
  padding:8px 13px;border:0;border-radius:999px;
  background:rgba(255,255,255,.94);color:#0F172A;
  font-size:12.5px;font-weight:700;cursor:pointer;
  box-shadow:0 6px 18px rgba(15,23,42,.18);
  -webkit-tap-highlight-color:transparent;
}
.cart-chip:active{background:#F1F5FA;}
.cart-chip b{font-size:13.5px;letter-spacing:.04em;}
.chip-ar{opacity:.45;font-size:14px;}

/* 购物车抽屉 */
.cart-mask{
  position:fixed;inset:0;background:rgba(15,23,42,.45);
  display:flex;align-items:flex-end;z-index:60;
  animation:cmFade .16s ease;
}
@keyframes cmFade{from{opacity:0}to{opacity:1}}
.cart-sheet{
  width:100%;max-width:560px;margin:0 auto;max-height:78vh;display:flex;flex-direction:column;
  background:#FFFFFF;color:#0F172A;
  border-radius:18px 18px 0 0;
  padding-bottom:env(safe-area-inset-bottom);
  animation:csUp .2s cubic-bezier(.2,.9,.3,1);
}
@keyframes csUp{from{transform:translateY(24px)}to{transform:translateY(0)}}
.cs-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 16px 10px;border-bottom:1px solid #EEF1F6;
}
.cs-head h3{margin:0;font-size:15px;font-weight:800;}
.cs-head h3 span{color:#3FA9F5;}
.cs-x{
  border:0;background:transparent;font-size:22px;line-height:1;
  color:#8A9AB0;cursor:pointer;padding:0 4px;
}
.cs-list{flex:1;overflow-y:auto;padding:6px 16px;}
.cs-row{
  display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;
  padding:11px 0;border-bottom:1px solid #F2F5F9;
}
.cs-row.is-bad{opacity:.55;}
.cs-name{font-size:14px;font-weight:700;}
.cs-bad{
  margin-left:8px;font-size:10.5px;font-weight:700;color:#D33B3B;
  border:1px solid #F3C7C7;background:#FDF1F1;border-radius:5px;padding:1px 5px;
}
.cs-price{font-size:13px;font-weight:700;color:#5A6B82;}
.cs-qty{display:flex;align-items:center;gap:2px;}
.cs-qty button{
  width:28px;height:28px;border:1px solid #DCE4EE;border-radius:8px;
  background:#F7FAFD;color:#0F172A;font-size:15px;font-weight:700;
  cursor:pointer;line-height:1;
}
.cs-qty b{min-width:26px;text-align:center;font-size:14px;}
.cs-empty{padding:28px 0;text-align:center;color:#8A9AB0;font-size:13px;}
.cs-warn{
  margin:0;padding:8px 16px;background:#FFF7E6;color:#9A6B12;
  font-size:12px;font-weight:600;
}
.cs-note{padding:10px 16px 4px;}
.cs-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:9px;}
.cs-chip{
  border:1px solid #DCE4EE;background:#F7FAFD;color:#5A6B82;
  border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700;
  cursor:pointer;line-height:1;transition:background .12s,color .12s,border-color .12s;
}
.cs-chip:active{transform:scale(.97);}
.cs-chip.on{background:#0F172A;border-color:#0F172A;color:#fff;}
.cs-note input{
  width:100%;padding:10px 12px;border:1px solid #DCE4EE;border-radius:10px;
  font-size:13px;color:#0F172A;background:#FBFDFF;outline:none;
}
.cs-note input:focus{border-color:#3FA9F5;background:#fff;}
.cs-foot{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px 16px;
}
.cs-clear{
  border:0;background:transparent;color:#8A9AB0;
  font-size:12.5px;font-weight:600;cursor:pointer;padding:6px 2px;
}
.cs-total{flex:1;display:flex;align-items:baseline;justify-content:flex-end;gap:6px;}
.cs-total small{font-size:12px;color:#8A9AB0;}
.cs-total b{font-size:19px;color:#C0573C;}
.cs-submit{
  border:0;border-radius:11px;padding:12px 20px;
  background:#0F172A;color:#fff;font-size:14px;font-weight:800;cursor:pointer;
}
.cs-submit:disabled{background:#C7D2DF;cursor:not-allowed;}

/* 下单成功 / 订单状态 */
.od-mask{
  position:fixed;inset:0;background:rgba(15,23,42,.5);
  display:flex;align-items:center;justify-content:center;padding:20px;z-index:70;
  animation:cmFade .16s ease;
}
.od-card{
  width:100%;max-width:340px;background:#fff;border-radius:18px;
  padding:20px 20px 16px;text-align:center;color:#0F172A;
  box-shadow:0 20px 50px rgba(15,23,42,.35);
}
.od-tt{font-size:13px;font-weight:700;color:#8A9AB0;letter-spacing:.04em;}
.od-code{
  margin:8px 0 2px;font-size:46px;font-weight:900;line-height:1.05;
  letter-spacing:.02em;color:#0F172A;
}
.od-lab{font-size:11.5px;color:#A6B3C4;letter-spacing:.14em;}
.od-st{
  display:inline-block;margin:12px 0 4px;padding:5px 12px;border-radius:999px;
  font-size:12.5px;font-weight:800;
  background:#EAF4FE;color:#1B6FB0;
}
.od-st.st-making{background:#FFF3E2;color:#A66A0E;}
.od-st.st-done{background:#E9F7EE;color:#1D7A44;}
.od-st.st-cancelled{background:#FBECEC;color:#B03A3A;}
.od-list{list-style:none;margin:12px 0 0;padding:0;text-align:left;}
.od-list li{
  display:flex;justify-content:space-between;gap:10px;
  padding:7px 0;border-bottom:1px dashed #EDF1F6;
  font-size:13px;color:#4A5B72;
}
.od-list li span:last-child{color:#0F172A;font-weight:700;}
.od-total{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-top:12px;font-size:13px;color:#8A9AB0;
}
.od-total b{font-size:20px;color:#C0573C;}
.od-tip{margin:10px 0 14px;font-size:12px;color:#8A9AB0;}
.od-acts{display:flex;gap:10px;}
.od-btn{
  flex:1;border:0;border-radius:11px;padding:11px 0;
  background:#0F172A;color:#fff;font-size:13.5px;font-weight:800;cursor:pointer;
}
.od-btn.ghost{background:#F1F5FA;color:#0F172A;}

.menu-scroll.has-cart{padding-bottom:calc(var(--foot-h) + 74px);}

/* ==========================================================================
   后台 · 订单与统计（全部为新增类）
   ========================================================================== */
.ord-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.ord-dates{display:flex;align-items:center;gap:6px;}
.ord-dates i{font-style:normal;color:#8A9AB0;font-size:12px;}
.ord-dates input{
  border:1px solid #DCE4EE;border-radius:9px;padding:6px 8px;
  font-size:12.5px;color:#0F172A;background:#fff;outline:none;
}
.ord-dates input:focus{border-color:var(--brand-blue);}

.seg{display:flex;background:#EEF3F9;border-radius:10px;padding:3px;gap:2px;}
.seg button{
  border:0;background:transparent;border-radius:8px;
  padding:5px 10px;font-size:12.5px;font-weight:700;color:#5A6B82;cursor:pointer;
}
.seg button.on{background:#fff;color:#0F172A;box-shadow:0 2px 6px rgba(15,23,42,.1);}

.ord-kpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:12px 0;}
.ord-kpi .kpi{
  background:#fff;border:1px solid #E7EEF6;border-radius:14px;
  padding:12px 14px;display:flex;flex-direction:column;gap:3px;
}
.ord-kpi .kpi span{font-size:12px;color:#7C8CA1;font-weight:600;}
.ord-kpi .kpi b{font-size:22px;font-weight:900;color:#0F172A;line-height:1.15;}
.ord-kpi .kpi i{font-style:normal;font-size:11.5px;color:#9AA9BC;}
.ord-kpi .kpi.hot{border-color:#F8D8AE;background:#FFFBF3;}
.ord-kpi .kpi.hot b{color:#B26B0C;}

.card-sub{font-size:12px;color:#8A9AB0;font-weight:600;}

.ord-chart{min-height:150px;}
.ord-skel{color:#A6B3C4;font-size:12.5px;padding:18px 0;text-align:center;}
.ord-empty{color:#8A9AB0;font-size:12.5px;padding:22px 0;text-align:center;}

.bars{display:flex;align-items:flex-end;gap:8px;height:158px;padding-top:14px;}
.bars.dense{gap:3px;}
.bars.few{justify-content:center;gap:14px;}
.bars.few .bar{flex:0 0 84px;max-width:84px;}
.bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;min-width:0;}
.bar .bf{width:100%;flex:1;display:flex;align-items:flex-end;}
.bar .bf s{
  display:block;width:100%;text-decoration:none;
  background:linear-gradient(180deg,#5FB7F8,#2E8FE0);
  border-radius:5px 5px 2px 2px;min-height:2px;
}
.bar.is-zero .bf s{background:#E3EBF4;}
.bar .bv{font-size:10.5px;font-weight:800;color:#3E5470;margin-bottom:3px;font-style:normal;}
.bar .bl{
  font-size:10.5px;color:#8A9AB0;margin-top:6px;
  white-space:nowrap;overflow:hidden;max-width:100%;
}
.bars.dense .bl{font-size:9px;transform:rotate(-38deg);transform-origin:center;}

.ord-cols{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
@media (max-width:820px){.ord-cols{grid-template-columns:1fr;} .ord-kpi{grid-template-columns:repeat(2,minmax(0,1fr));}}

.tp{display:grid;grid-template-columns:minmax(64px,1fr) 1.3fr 34px 56px;align-items:center;gap:8px;padding:5px 0;}
.tp-n{font-size:12.5px;font-weight:700;color:#22303F;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.tp-bar{height:8px;background:#EEF3F9;border-radius:999px;overflow:hidden;}
.tp-bar s{display:block;height:100%;background:linear-gradient(90deg,#5FB7F8,#2E8FE0);border-radius:999px;}
.tp b{font-size:12.5px;text-align:right;color:#0F172A;}
.tp i{font-style:normal;font-size:11.5px;color:#8A9AB0;text-align:right;}

.hbs{display:flex;align-items:flex-end;gap:2px;height:130px;padding-top:10px;border-bottom:1px solid #E3EBF4;}
.hb{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;}
.hb s{display:block;width:100%;background:linear-gradient(180deg,#8FD0FA,#4AA6EC);border-radius:3px 3px 0 0;min-height:2px;}
.hb span{font-size:9.5px;color:#9AA9BC;margin-top:4px;}

.orow{
  display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;
  padding:12px 2px;border-bottom:1px solid #EFF3F8;
}
.orow:last-child{border-bottom:0;}
.orow-code{
  font-size:15px;font-weight:900;letter-spacing:.03em;color:#0F172A;
  background:#F1F6FB;border-radius:9px;text-align:center;padding:8px 0;
}
.orow.st-pending .orow-code{background:#FFF4E3;color:#A66A0E;}
.orow.st-making .orow-code{background:#E9F3FE;color:#1B6FB0;}
.orow.st-cancelled{opacity:.62;}
.orow-l1{display:flex;align-items:center;gap:8px;}
.orow-l1 b{font-size:15px;color:#0F172A;}
.orow-l1 span{font-size:11.5px;color:#9AA9BC;}
.orow-l1 em{font-style:normal;font-size:10.5px;font-weight:700;border-radius:5px;padding:1px 5px;}
.orow-l1 em.pay{background:#E9F7EE;color:#1D7A44;}
.orow-l1 em.unpay{background:#FBECEC;color:#B03A3A;}
.orow-l2{font-size:12.5px;color:#5A6B82;margin-top:3px;line-height:1.5;}
.orow-note{font-size:12px;color:#A66A0E;margin-top:3px;}
.orow-right{display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
.ost{font-size:11px;font-weight:800;border-radius:999px;padding:3px 9px;}
.ost.st-pending{background:#FFF4E3;color:#A66A0E;}
.ost.st-making{background:#E9F3FE;color:#1B6FB0;}
.ost.st-done{background:#E9F7EE;color:#1D7A44;}
.ost.st-cancelled{background:#F1F4F9;color:#7C8CA1;}
.ost.st-deleted{background:#F3F0EC;color:#8A7355;}
.orow.is-del{opacity:.58;}
.orow.is-del .orow-l2{text-decoration:line-through;text-decoration-color:rgba(0,0,0,.18);}
.orow-acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;}
.obtn{
  border:1px solid #DCE4EE;background:#fff;border-radius:8px;
  padding:5px 9px;font-size:12px;font-weight:700;color:#40536B;cursor:pointer;
}
.obtn:hover{background:#F7FAFE;}
.obtn.primary{background:var(--brand-blue);border-color:var(--brand-blue);color:#fff;}
.obtn.primary:hover{filter:brightness(.96);}

@media (max-width:640px){
  .orow{grid-template-columns:54px 1fr;}
  .orow-right{grid-column:1 / -1;flex-direction:row;justify-content:space-between;align-items:center;}
}

/* ==========================================================================
   订单合并（2026-11-03）
   --------------------------------------------------------------------------
   合并模式：每行前多一列勾选框，行内操作按钮隐藏（避免误点收款 / 取消）。
   只有「未收款 + 制作中」的单可勾，其余行置灰锁定（后端还会再校验一遍）。
   ========================================================================== */

.ord-list.mode-merge .orow{grid-template-columns:26px 64px 1fr auto;}
.ord-list.mode-merge .orow-acts{display:none;}
/* 底部浮条是 fixed，最后一行会被它盖住，列表自己留出空间 */
.ord-list.mode-merge{padding-bottom:86px;}

.ck{
  width:18px;height:18px;border-radius:5px;border:1.5px solid #C6D6E8;background:#fff;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:none;
  transition:border-color .12s,background .12s;
}
.ck:hover{border-color:#9CC7E8;}
.ck.on{background:var(--brand-blue);border-color:var(--brand-blue);}
.ck.on::after{
  content:"";width:9px;height:5px;border-left:2px solid #fff;border-bottom:2px solid #fff;
  transform:rotate(-45deg) translate(1px,-1px);
}
.ck.off{background:#F1F4F9;border-color:#E3EAF4;cursor:not-allowed;}
.orow.sel{background:#F3F9FF;border-radius:12px;box-shadow:inset 0 0 0 1.5px #CFE5FA;}
.orow.locked{opacity:.5;cursor:not-allowed;}

/* 被合并的单不进列表（merge 后只剩主单），这里不再保留 merged 行样式 */

/* 底部合并浮条 */
.merge-bar{
  position:fixed;left:50%;bottom:20px;
  /* 收起时要真的移出视口（只写 160% 会露出上面一截黑边） */
  transform:translate(-50%,calc(100% + 40px));
  width:min(560px,calc(100% - 32px));
  background:#0F172A;color:#fff;border-radius:16px;padding:12px 14px 12px 18px;
  display:flex;align-items:center;gap:12px;
  box-shadow:0 14px 34px rgba(15,23,42,.34);
  transition:transform .22s cubic-bezier(.2,.8,.3,1);z-index:60;
}
.merge-bar.on{transform:translate(-50%,0);}
.merge-bar .mb-main{flex:1;min-width:0;}
.merge-bar .mb-t{font-size:13.5px;font-weight:800;}
.merge-bar .mb-s{font-size:11.5px;color:#A9B6C8;margin-top:2px;}
.merge-bar .mb-s b{color:#FFD479;font-weight:800;}
.merge-bar .btn{border-color:transparent;}
.merge-bar .btn.ghost2{background:rgba(255,255,255,.14);color:#fff;}
.merge-bar .btn.ghost2:hover{background:rgba(255,255,255,.24);color:#fff;}
.merge-bar .btn.primary{background:var(--brand-blue);color:#fff;}
.merge-bar .btn:disabled{opacity:.4;cursor:not-allowed;}

/* 合并预览弹窗 */
/* 三段式：标题 / 明细 / 备注在 .mg-body 里滚动，按钮固定在底部。
   弹窗再长（跨营业日提示会让内容更高）也不会把「确认合并」挤出屏幕。
   用 .modal.mg-modal 是因为窄屏媒体查询里的 .modal{padding} 会盖掉单类选择器 */
.modal.mg-modal{
  width:min(580px,100%);
  padding:0;overflow:hidden;
  display:flex;flex-direction:column;
}
.mg-body{
  flex:1 1 auto;min-height:0;overflow-y:auto;
  padding:18px 18px 2px;
}
.mg-block{border:1px solid #E7EEF7;border-radius:12px;padding:12px;margin-bottom:12px;}
.mg-block h4{margin:0 0 10px;font-size:12.5px;color:#64748B;font-weight:800;letter-spacing:.02em;}
/* 主单固定取最早一单，不再让用户选：只读展示保留的取餐号 */
.mg-keep{
  display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
  background:#F2F9FF;border:1.5px solid #CFE4F7;border-radius:10px;padding:9px 12px;
}
.mg-keep b{font-size:19px;font-weight:900;color:#1B6FB0;letter-spacing:.02em;line-height:1.1;}
.mg-keep small{font-size:11.5px;color:#6C8CA8;font-weight:600;}
table.mg{width:100%;border-collapse:collapse;font-size:12.5px;}
table.mg th{
  text-align:left;font-size:11.5px;color:#9AA9BC;font-weight:700;
  padding:0 0 8px;border-bottom:1px solid #EFF3F8;
}
table.mg td{padding:7px 0;border-bottom:1px dashed #F1F5FA;color:#334155;}
table.mg tr:last-child td{border-bottom:0;}
table.mg .num{text-align:right;font-variant-numeric:tabular-nums;}
table.mg .mut{color:#9AA9BC;}
.mg-sum{
  display:flex;align-items:baseline;justify-content:flex-end;gap:8px;
  padding-top:10px;margin-top:2px;border-top:1px solid #EFF3F8;
}
.mg-sum span{font-size:12.5px;color:#7C8CA1;}
.mg-sum b{font-size:20px;color:#C0573C;font-weight:900;}
.mg-note{
  font-size:12px;color:#334155;background:#F7FAFE;border-radius:9px;padding:9px 11px;
  line-height:1.6;
}
.mg-note .k{color:#9AA9BC;margin-right:4px;}
.mg-foot{
  flex:none;display:flex;justify-content:flex-end;gap:8px;
  padding:12px 18px 16px;background:#fff;border-top:1px solid #F1F5FA;
}

@media (max-width:640px){
  /* 订单卡头：状态筛转换到第二行，合并按钮留在第一行 */
  .ord-head{flex-wrap:wrap;row-gap:8px;}
  .ord-head #ordStatus{order:5;width:100%;}
  .ord-head #ordStatus button{flex:1;text-align:center;}
  .ord-head #ordMergeBtn{order:4;}
  .ord-list.mode-merge .orow{grid-template-columns:26px 54px 1fr;}
  /* 合并模式下行内按钮被隐藏，状态徽章单独占一行时靠右才不显得孤立 */
  .ord-list.mode-merge .orow-right{justify-content:flex-end;}
  .mg-foot .btn{flex:1;justify-content:center;}
  .merge-bar{bottom:14px;padding:10px 12px 10px 14px;}
  .merge-bar .mb-s{font-size:11px;}
}