/* 福宠订单卡片 & 后台收款标识（fc-ui-v1）
   独立样式文件，只作用于带 fc-oc / fc-paid-pill 类名的元素；撤销只需从 index.html 去掉这一行引用。
   买家订单：去掉框线和阴影，改成一条条有呼吸感的"票据"，图片放大、状态带色点，进场错落浮起，按下有回弹。 */

/* ---------- 买家订单列表 ---------- */
.fuchong-orders .orders:has(> .fc-oc){gap:0;padding:6px 18px 28px}

.fuchong-orders .orders>article.fc-oc{
  --oc-ink:#2f2924;--oc-mute:#9a8d80;--oc-line:#efe7dc;--oc-accent:#cf3b00;--oc-go:#1f8a5b;
  position:relative;background:transparent;border:0;border-radius:0;box-shadow:none;
  padding:22px 0 20px;border-bottom:1px solid var(--oc-line);
  animation:fc-oc-in .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 55ms);
  transition:transform .28s cubic-bezier(.2,.8,.2,1);
  -webkit-tap-highlight-color:transparent;
}
.fuchong-orders .orders>article.fc-oc:last-child{border-bottom:0}
.fuchong-orders .orders>article.fc-oc:active{transform:scale(.985)}

/* 顶部：门店 + 状态 */
.fuchong-orders .orders>article.fc-oc>header{
  border:0;margin:0 0 14px;padding:0;align-items:center;font-size:12px;letter-spacing:.02em;
}
.fuchong-orders .orders>article.fc-oc>header>span{color:var(--oc-mute)}
.fuchong-orders .orders>article.fc-oc>header>b{
  display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;color:var(--oc-ink);
}
.fuchong-orders .orders>article.fc-oc>header>b::before{
  content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none;
}
.fuchong-orders .orders>article.fc-oc-go>header>b{color:var(--oc-go)}
.fuchong-orders .orders>article.fc-oc-pay>header>b{color:var(--oc-accent)}
.fuchong-orders .orders>article.fc-oc-done>header>b,
.fuchong-orders .orders>article.fc-oc-off>header>b{color:#a49a8f}
/* 待收货：状态点带一圈柔和的呼吸光 */
.fuchong-orders .orders>article.fc-oc-go>header>b::before{
  box-shadow:0 0 0 0 rgba(31,138,91,.45);animation:fc-oc-pulse 2.2s ease-out infinite;
}

/* 主体：大图 + 名字 + 价格 */
.fuchong-orders .orders>article.fc-oc>div:first-of-type{
  display:grid;grid-template-columns:112px minmax(0,1fr) auto;gap:16px;align-items:center;margin:0;
}
.fuchong-orders .orders>article.fc-oc>div:first-of-type>img{
  width:112px;height:112px;border-radius:18px;object-fit:cover;background:#f3ece3;
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 10px 24px -14px rgba(64,40,20,.55);
  transform:translateZ(0);transition:transform .45s cubic-bezier(.2,.8,.2,1);
}
.fuchong-orders .orders>article.fc-oc:active>div:first-of-type>img{transform:scale(1.03)}
.fuchong-orders .orders>article.fc-oc>div:first-of-type>p{margin:0;min-width:0}
.fuchong-orders .orders>article.fc-oc>div:first-of-type>p>strong{
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  color:var(--oc-ink);font-size:16px;font-weight:600;line-height:1.4;letter-spacing:-.01em;
}
.fuchong-orders .orders>article.fc-oc>div:first-of-type>p>small{
  display:block;margin-top:6px;color:var(--oc-mute);font-size:12px;line-height:1.5;
}
.fuchong-orders .orders>article.fc-oc>div:first-of-type>p>em{
  display:block;margin-top:2px;color:#b3a698;font-size:12px;font-style:normal;line-height:1.5;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.fuchong-orders .orders>article.fc-oc>div:first-of-type>b{
  align-self:start;margin-top:2px;color:var(--oc-ink);font-size:18px;font-weight:600;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}

/* 接宠旅程：去掉框，变成一条浅底的进度带 */
.fuchong-orders .orders>article.fc-oc>.fc-delivery-journey{
  margin:18px 0 0!important;padding:16px 16px 14px!important;border:0!important;border-radius:16px!important;
  background:linear-gradient(180deg,#faf6f0,#f6f0e7)!important;
}
.fuchong-orders .orders>article.fc-oc>.fc-delivery-journey footer{border-top-color:rgba(160,130,100,.14)}
.fuchong-orders .orders>article.fc-oc .journey-active{
  stroke:var(--oc-go);stroke-dasharray:400;stroke-dashoffset:400;
  animation:fc-oc-draw 1.1s .25s cubic-bezier(.2,.8,.2,1) forwards;
}
.fuchong-orders .orders>article.fc-oc .fc-delivery-journey svg circle.reached{fill:var(--oc-go);stroke:var(--oc-go)}
.fuchong-orders .orders>article.fc-oc .journey-vehicle{animation:fc-oc-bob 2.4s ease-in-out infinite}

/* 实拍预览 */
.fuchong-orders .orders>article.fc-oc>.order-inspection-preview{margin:14px 0 0!important;box-shadow:none}

/* 底部：订单号 + 按钮 */
.fuchong-orders .orders>article.fc-oc>footer{margin-top:16px;gap:8px}
.fuchong-orders .orders>article.fc-oc>footer>small{color:#b8ad9f;font-size:11px;font-variant-numeric:tabular-nums}
.fuchong-orders .orders>article.fc-oc>footer>button{
  min-height:34px;padding:0 14px;border-radius:999px;border:1px solid #e6ddd1;background:transparent;
  color:#5d5045;font-size:12px;transition:background-color .2s,transform .2s;
}
.fuchong-orders .orders>article.fc-oc>footer>button:active{transform:scale(.96);background:#f5efe7}
.fuchong-orders .orders>article.fc-oc>footer>button.fc-oc-primary{
  border-color:var(--oc-accent);background:var(--oc-accent);color:#fff;font-weight:600;
}

@keyframes fc-oc-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes fc-oc-pulse{0%{box-shadow:0 0 0 0 rgba(31,138,91,.45)}70%,100%{box-shadow:0 0 0 7px rgba(31,138,91,0)}}
@keyframes fc-oc-draw{to{stroke-dashoffset:0}}
@keyframes fc-oc-bob{0%,100%{translate:0 0}50%{translate:0 -2px}}

@media (max-width:360px){
  .fuchong-orders .orders>article.fc-oc>div:first-of-type{grid-template-columns:92px minmax(0,1fr) auto;gap:12px}
  .fuchong-orders .orders>article.fc-oc>div:first-of-type>img{width:92px;height:92px;border-radius:15px}
}

/* ---------- 后台：收款标识 ---------- */
.fc-paid-pill{
  position:relative;display:inline-flex;align-items:center;gap:6px;margin-top:6px;
  padding:4px 10px 4px 7px;border-radius:999px;overflow:hidden;
  background:#e6f5ec;color:#16773f;font-size:12px;font-weight:600;line-height:1.3;white-space:nowrap;
}
.fc-paid-pill>i{
  width:14px;height:14px;border-radius:50%;background:currentColor;flex:none;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8'/%3E%3C/svg%3E") center/contain no-repeat;
  position:relative;
}
.fc-paid-pill>i::after{
  content:"";position:absolute;left:4px;top:3.5px;width:3.5px;height:6px;
  border:solid #fff;border-width:0 1.8px 1.8px 0;transform:rotate(45deg);
}
.fc-paid-pill.ali{background:#1677ff;color:#fff;box-shadow:0 6px 16px -8px rgba(22,119,255,.9)}
.fc-paid-pill.ali>i{background:#fff}
.fc-paid-pill.ali>i::after{border-color:#1677ff}
.fc-paid-pill.ali::after{
  content:"";position:absolute;inset:0;transform:translateX(-120%);
  background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);
  animation:fc-pill-shine 3.6s 0.4s ease-in-out infinite;
}
.ops-drawer-status>span.fc-paid-pill.big{margin:0;padding:7px 14px 7px 10px;font-size:14px;color:#16773f}
.ops-drawer-status>span.fc-paid-pill.big.ali{color:#fff}
.fc-paid-pill.big>i{width:17px;height:17px}
.fc-paid-pill.big>i::after{left:5px;top:4px;width:4px;height:7.5px}
@keyframes fc-pill-shine{0%{transform:translateX(-120%)}35%,100%{transform:translateX(120%)}}

@media (prefers-reduced-motion:reduce){
  .fuchong-orders .orders>article.fc-oc,
  .fuchong-orders .orders>article.fc-oc *,
  .fc-paid-pill,.fc-paid-pill::after{animation:none!important;transition:none!important}
  .fuchong-orders .orders>article.fc-oc .journey-active{stroke-dashoffset:0}
}
