/* The quoted price at checkout (checkout-quote.js). The rows reuse .ck-t
   from styles.css; this adds the miles under Delivery, the green credit
   line, the loading bars, the "set your pin" box and the fee approval.
   Nothing is said by colour alone: the credit line is named and ticked,
   and the approval says what changed and what to do. */

.ck-t-sub{display:inline-block;margin-left:6px;color:#8a8a8f;font-size:.84rem;font-weight:500}
.ck-t.credit span{color:#1c7a3d;font-weight:600}
.ck-t.credit .ck-t-sub{color:#1c7a3d;opacity:.85}
.ck-credit-ic{display:inline-grid;place-items:center;width:18px;height:18px;margin-right:7px;border-radius:50%;
  background:#e6f4ea;color:#1c7a3d;font-style:normal;font-size:.7rem;font-weight:800;vertical-align:1px}
.summary-line.credit span{color:#1c7a3d}
.summary-line .ck-t-sub{font-size:.8rem}

/* Loading: bars where the numbers will be. */
.ck-q-skel span:last-child i{display:inline-block;width:62px;height:14px;border-radius:7px;vertical-align:middle;
  background:linear-gradient(90deg,#efefef 0,#f7f7f7 40%,#efefef 80%);background-size:200% 100%;animation:ckqShimmer 1.2s linear infinite}
.ck-t.total.ck-q-skel span:last-child i{width:78px;height:18px}
.ck-q-status{margin:6px 0 0;color:#6b6b70;font-size:.86rem}
@keyframes ckqShimmer{to{background-position:-200% 0}}
@media (prefers-reduced-motion:reduce){.ck-q-skel span:last-child i{animation:none}}

/* No pin yet, or the quote failed: say why and give the one button. */
.ck-q-pin{display:flex;flex-direction:column;gap:6px;margin:8px 0 4px;padding:14px;border:1.5px solid #ececed;border-radius:16px;background:#fafafa}
.ck-q-pin b{font-size:.98rem;color:#111}
.ck-q-pin small{color:#6b6b70;font-size:.86rem;line-height:1.4}
.ck-q-pin .secondary{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin-top:6px;min-height:44px}
.ck-q-pin .secondary svg{width:18px;height:18px;stroke:currentColor;stroke-width:1.9;fill:none}

/* The fee changed because the pin moved: one tap to accept it. */
.ck-q-ask{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;margin:10px 0 2px;padding:14px 16px;
  border:1.5px solid #ed1732;border-radius:16px;background:#fff4f5;color:#111;text-align:left;cursor:pointer;min-height:44px}
.ck-q-ask b{font-size:.95rem;line-height:1.35}
.ck-q-ask span{color:#b3122a;font-weight:700;font-size:.9rem}
.ck-q-ask:focus-visible{outline:3px solid #ff9aa4;outline-offset:2px}
.ck-totals .ck-t span:last-child,.receipt-totals .summary-line span:last-child{white-space:nowrap}
.ck-totals .ck-t span:first-child{min-width:0}