/* Lakaz Mama customer delivery page. Mobile first; one column throughout.
   No framework, no webfont, no external request of any kind. */
:root{
  --ink:#1a1a1a; --muted:#5c5c5c; --line:#e6e4e0; --bg:#faf9f7; --card:#fff;
  --brand:#0a5f66; --ok:#0f6b3f; --ok-bg:#eaf6ef;
  --plan:#8a5a00; --plan-bg:#fdf4e3; --way:#2a4e8f; --way-bg:#eef2fb;
  --wait:#6b4600; --wait-bg:#fdf3e2;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--bg); color:var(--ink);
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  -webkit-text-size-adjust:100%;
}
.lkm-wrap{max-width:620px;margin:0 auto;padding:16px}
.lkm-brand{
  display:block;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--brand);font-weight:700;margin:4px 0 14px
}
.lkm-card{
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:18px 16px;box-shadow:0 1px 2px rgba(0,0,0,.03)
}
.lkm-h1{font-size:22px;line-height:1.25;margin:0 0 2px;font-weight:700}
.lkm-h2{font-size:13px;text-transform:uppercase;letter-spacing:.07em;
  color:var(--muted);margin:20px 0 8px;font-weight:700}
.lkm-h2-plain{margin-top:0}
.lkm-where{margin:0;color:var(--muted);font-size:15px}
.lkm-note{margin:10px 0 0;font-size:15px}
.lkm-head{padding-bottom:4px}
.lkm-body{font-size:15.5px;margin:10px 0 0}
.lkm-muted{color:var(--muted)}
.lkm-quiet{text-align:center;color:var(--muted)}

.lkm-list{list-style:none;margin:0;padding:0}
.lkm-row{border:1px solid var(--line);border-radius:11px;padding:12px 13px;margin:0 0 9px}
.lkm-row-top{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.lkm-tag{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  border-radius:999px;padding:3px 9px;white-space:nowrap}
.lkm-tag-ok{color:var(--ok);background:var(--ok-bg)}
.lkm-tag-plan{color:var(--plan);background:var(--plan-bg)}
.lkm-tag-way{color:var(--way);background:var(--way-bg)}
.lkm-when{font-size:15px;font-weight:600}
/* the products in one delivery: a list, one column on a phone, two from 640px */
.lkm-items{list-style:none;margin:9px 0 0;padding:0;font-size:15px;line-height:1.4;
  display:grid;grid-template-columns:minmax(0,1fr);gap:5px 18px}
.lkm-items li{margin:0;padding-left:13px;position:relative;overflow-wrap:anywhere}
.lkm-items li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;
  border-radius:50%;background:var(--muted)}
@media (min-width:640px){ .lkm-items{grid-template-columns:repeat(2,minmax(0,1fr))} }
.lkm-sub{margin:7px 0 0;font-size:13.5px;color:var(--muted)}

.lkm-empty{background:var(--bg);border:1px solid var(--line);border-radius:11px;
  padding:14px;margin-top:14px}
.lkm-empty .lkm-body{margin:0}

.lkm-restock{background:var(--wait-bg);border-radius:11px;padding:13px 14px;margin-top:16px}
.lkm-restock .lkm-h2{color:var(--wait);margin-bottom:6px}
.lkm-restock-list{margin:0;padding-left:19px;font-size:15px}
.lkm-restock-list li{margin:4px 0}

.lkm-picklist{list-style:none;margin:14px 0 0;padding:0}
.lkm-pick{display:block;border:1px solid var(--line);border-radius:11px;
  padding:13px;margin:0 0 9px;text-decoration:none;color:inherit}
.lkm-pick:hover,.lkm-pick:focus{border-color:var(--brand);outline:none}
.lkm-pick-name{display:block;font-weight:600;font-size:16px}
.lkm-pick-where{display:block;color:var(--muted);font-size:14px;margin-top:2px}

.lkm-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}
.lkm-btn{display:inline-block;background:var(--brand);color:#fff;border:0;
  border-radius:9px;padding:11px 15px;font-size:15px;font-weight:600;
  text-decoration:none;cursor:pointer;font-family:inherit}
.lkm-btn-quiet{background:#fff;color:var(--brand);border:1px solid var(--brand)}
.lkm-share-done{margin:9px 0 0;font-size:14px;color:var(--ok);word-break:break-all}

.lkm-spinner{width:18px;height:18px;margin:2px auto 8px;border-radius:50%;
  border:2px solid var(--line);border-top-color:var(--brand);
  animation:lkm-spin .8s linear infinite}
@keyframes lkm-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.lkm-spinner{animation:none}}

.lkm-foot{color:var(--muted);font-size:13px;text-align:center;margin:16px 0 8px}
@media (min-width:640px){ .lkm-wrap{padding:28px 16px} .lkm-h1{font-size:25px} }

/* an update whose stage this page does not recognise */
.lkm-tag-unk{color:#5c5c5c;background:#efeeec}
/* the existing stock-alert route; shown only when one is configured */
.lkm-alert{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}
.lkm-alert .lkm-body{margin:0 0 11px}

/* Part 95 / the approved preview refinements.
   A row always answers "when?" — with a date, or with the fact that there
   isn't one yet. The pending form is deliberately quieter than a real date
   so it cannot be skim-read as one. */
.lkm-when-pending{font-size:14px;color:var(--muted);font-style:normal}

/* the restock outlook, one line under each product */
.lkm-restock-when{display:block;font-size:13.5px;color:var(--wait);margin-top:2px}
.lkm-restock .lkm-body{margin:0 0 10px}

/* Sharing is secondary: a quiet link, not a button competing with the one
   that matters. */
.lkm-secondary{margin:12px 0 0;text-align:center}
.lkm-link{background:none;border:0;padding:6px 4px;font:inherit;font-size:14px;
  color:var(--brand);text-decoration:underline;cursor:pointer;min-height:34px}
.lkm-link:hover,.lkm-link:focus{text-decoration:none;outline:2px solid var(--brand);
  outline-offset:2px;border-radius:5px}

/* The shop's own phone, beside the availability sentence. */
.lkm-callbox{border-top:1px solid var(--line);margin-top:18px;padding-top:16px}
.lkm-callbox .lkm-body{margin:0 0 8px}
.lkm-call{margin:0;font-size:19px;font-weight:700}
.lkm-call a{color:var(--brand);text-decoration:none}
.lkm-call a:hover,.lkm-call a:focus{text-decoration:underline}
.lkm-newsline{margin-top:14px}
.lkm-dot{color:var(--line);margin:0 8px}

.lkm-nav{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px}.lkm-nav a{color:var(--brand);font-size:14px}.lkm-nav .lkm-brand{margin-right:auto;text-decoration:none}.lkm-search-label{display:block;font-size:14px;margin:16px 0 6px}.lkm-search{box-sizing:border-box;width:100%;padding:12px;border:1px solid var(--line);border-radius:8px;font-size:16px}.lkm-picklist li[hidden]{display:none}

/* the staging review site only (config.js deliveryPreview) */
.lkm-preview{background:var(--plan-bg);color:var(--plan);border-radius:10px;padding:9px 12px;font-size:14px;margin:0 0 12px}
