/* 客单价计算器 —— 靛蓝小票 · 收银纸质感 */
.c60{
  --a:#4338ca;
  --a2:#818cf8;
  --a-soft:rgba(67,56,202,.10);
  --a-line:rgba(67,56,202,.26);
}

/* 收银小票母题：横向虚线 + 轻微纸纹 */
.c60-hero{
  background:
    radial-gradient(720px 300px at 8% 0%, rgba(255,255,255,.8), transparent 60%),
    repeating-linear-gradient(0deg, rgba(67,56,202,.05) 0 1px, transparent 1px 26px),
    linear-gradient(135deg,#eef2ff 0%,#e0e7ff 52%,#f5f3ff 100%);
}
:root[data-theme="dark"] .c60-hero{
  background:
    radial-gradient(720px 300px at 8% 0%, rgba(129,140,248,.16), transparent 62%),
    repeating-linear-gradient(0deg, rgba(129,140,248,.07) 0 1px, transparent 1px 26px),
    linear-gradient(135deg,#0c1128 0%,#151a3a 52%,#1b1430 100%);
}

/* hero 里的小票插画 */
.aov-paper{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:7px;
  width:206px;
  padding:18px 18px 22px;
  border-radius:4px;
  background:#fffdf7;
  color:#312e81;
  border:1px solid #c7d2fe;
  box-shadow:0 22px 44px rgba(49,46,129,.24);
  transform:rotate(-5deg);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:11px;
  font-weight:700;
  letter-spacing:.2px;
}
.aov-paper::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-9px;
  height:10px;
  background:radial-gradient(circle at 5px 0, transparent 4px, #fffdf7 4.6px) repeat-x;
  background-size:10px 10px;
}
.aov-paper .t{font-size:10px;letter-spacing:2px;color:#6366f1;}
.aov-paper .l{display:flex;justify-content:space-between;}
.aov-paper .d{
  margin-top:4px;
  padding-top:8px;
  border-top:1px dashed #c7d2fe;
  display:flex;justify-content:space-between;
  font-size:12px;
}
.aov-paper .d b{color:#3730a3;font-size:16px;}
.aov-paper .code{font-size:9px;letter-spacing:1px;color:#a5b4fc;}
:root[data-theme="dark"] .aov-paper{
  background:#141a33;color:#c7d2fe;border-color:#2c3766;
  box-shadow:0 22px 44px rgba(0,0,0,.4);
}
:root[data-theme="dark"] .aov-paper::after{
  background:radial-gradient(circle at 5px 0, transparent 4px, #141a33 4.6px) repeat-x;
  background-size:10px 10px;
}
:root[data-theme="dark"] .aov-paper .t{color:#818cf8;}
:root[data-theme="dark"] .aov-paper .d{border-color:#2c3766;}
:root[data-theme="dark"] .aov-paper .d b{color:#a5b4fc;}

.c60-metric.is-hero{
  background:linear-gradient(135deg,#4338ca,#312e81 70%);
  box-shadow:0 16px 34px rgba(49,46,129,.34);
}
.c60-metric.is-hero .v{font-size:clamp(30px,3.6vw,44px);}

.c60-segbtn.on{color:#3730a3;}
.c60-chip.on{background:rgba(67,56,202,.12);border-color:#4338ca;color:#3730a3;}

/* 结果小票 */
.aov-receipt{
  position:relative;
  max-width:330px;
  margin:18px auto 26px;
  padding:16px 20px 20px;
  background:#fffdf7;
  color:#1e1b4b;
  border:1px solid #c7d2fe;
  border-radius:4px;
  box-shadow:0 14px 30px rgba(49,46,129,.14);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
  font-size:12.5px;
  font-weight:700;
}
.aov-receipt::before,
.aov-receipt::after{
  content:"";
  position:absolute;
  left:0;right:0;
  height:9px;
}
.aov-receipt::before{
  top:-8px;
  background:radial-gradient(circle at 5px 8px, transparent 4px, #fffdf7 4.6px) repeat-x;
  background-size:10px 10px;
}
.aov-receipt::after{
  bottom:-8px;
  background:radial-gradient(circle at 5px 0, transparent 4px, #fffdf7 4.6px) repeat-x;
  background-size:10px 10px;
}
.aov-receipt-head{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.4px;color:#6366f1;}
.aov-receipt-line.dashed{margin:9px 0;border-top:1px dashed #c7d2fe;}
.aov-receipt-row{display:flex;justify-content:space-between;gap:12px;padding:3px 0;color:#4c4a8a;}
.aov-receipt-row b{color:#1e1b4b;}
.aov-receipt-total{
  display:flex;justify-content:space-between;align-items:baseline;
  padding-top:8px;
  border-top:1px dashed #c7d2fe;
  font-size:14px;
  color:#312e81;
}
.aov-receipt-total b{font-size:22px;color:#3730a3;letter-spacing:-.5px;}
.aov-receipt-foot{display:flex;justify-content:space-between;align-items:center;margin-top:12px;font-size:9px;letter-spacing:1.2px;color:#a5b4fc;}
.aov-receipt-foot .code{letter-spacing:1px;}
:root[data-theme="dark"] .aov-receipt{
  background:#141a33;color:#c7d2fe;border-color:#2c3766;
  box-shadow:0 14px 30px rgba(0,0,0,.36);
}
:root[data-theme="dark"] .aov-receipt::before{background:radial-gradient(circle at 5px 8px, transparent 4px, #141a33 4.6px) repeat-x;background-size:10px 10px;}
:root[data-theme="dark"] .aov-receipt::after{background:radial-gradient(circle at 5px 0, transparent 4px, #141a33 4.6px) repeat-x;background-size:10px 10px;}
:root[data-theme="dark"] .aov-receipt-line.dashed{border-color:#2c3766;}
:root[data-theme="dark"] .aov-receipt-total{border-color:#2c3766;}
:root[data-theme="dark"] .aov-receipt-row b,
:root[data-theme="dark"] .aov-receipt-total b{color:#c7d2fe;}
:root[data-theme="dark"] .aov-receipt-head{color:#818cf8;}
:root[data-theme="dark"] .aov-receipt-row{color:#9fa9d8;}

/* 健康区间刻度条 */
.aov-gauge{margin-top:18px;padding:14px 15px 12px;border:1px dashed var(--a-line);border-radius:14px;background:linear-gradient(180deg,var(--a-soft),transparent);}
.aov-gauge-track{position:relative;height:14px;border-radius:999px;background:var(--soft);border:1px solid var(--line);overflow:visible;}
.aov-gauge-band{position:absolute;top:0;bottom:0;left:0;width:100%;border-radius:999px;background:rgba(129,140,248,.28);}
.aov-gauge-marker{position:absolute;top:50%;left:0;width:4px;height:24px;margin-left:-2px;transform:translateY(-50%);border-radius:3px;background:#4338ca;box-shadow:0 0 0 4px rgba(67,56,202,.16);transition:left .5s cubic-bezier(.2,.7,.2,1);}
:root[data-theme="dark"] .aov-gauge-marker{background:#a5b4fc;box-shadow:0 0 0 4px rgba(165,180,252,.16);}
.aov-gauge-labels{display:flex;justify-content:space-between;margin-top:7px;font-size:11px;color:var(--muted);font-weight:700;font-variant-numeric:tabular-nums;}
.aov-health{margin:8px 0 0;font-size:12.5px;line-height:1.7;color:var(--ink2);}
.aov-health b{color:var(--a);}

/* 批量表格 */
#aovBatchTable td{font-variant-numeric:tabular-nums;}
#aovBatchTable tbody tr:nth-child(even) td{background:rgba(67,56,202,.035);}
#aovBatchTable td:first-child{font-weight:800;color:var(--ink);}
#aovBatchTable tr.is-total td{background:rgba(67,56,202,.08);}

#aovBatchInput{
  width:100%;min-height:108px;resize:vertical;
  padding:12px 14px;border:1.5px solid var(--line);border-radius:12px;outline:0;
  background:#fff;color:var(--ink);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:13px;line-height:1.7;
}
#aovBatchInput:focus{border-color:var(--a);box-shadow:0 0 0 4px rgba(67,56,202,.13);}
:root[data-theme="dark"] #aovBatchInput{background:#101a2b;}

/* 客单价条形贴合主题 */
.c60-bar-row .bf{background:linear-gradient(90deg,#818cf8,#4338ca);}

@media (max-width:640px){
  .aov-receipt{max-width:100%;font-size:12px;}
  .aov-receipt-total b{font-size:19px;}
  .c60-bar-row{grid-template-columns:78px minmax(0,1fr) 68px;}
}
