/* ---------- address search, date and time pickers, checkout popup ---------- */
.fld{position:relative;cursor:text}
.fld.pick{cursor:pointer}
.fld .val{font:500 16px 'Plus Jakarta Sans',sans-serif;color:#000;padding:2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fld .val.ph{color:#687272}
.pop{position:absolute;top:calc(100% + 12px);left:0;z-index:60;background:#fff;color:#000;border-radius:22px;box-shadow:0 24px 60px rgba(3,22,16,.28),0 0 0 1px rgba(6,43,33,.06);text-align:left;font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.pop[hidden]{display:none!important}
/* address suggestions */
.ac{width:min(520px,calc(100vw - 32px));padding:8px;max-height:420px;overflow:auto}
.ac ul{list-style:none;margin:0;padding:0}
.ac li{display:flex;gap:14px;align-items:center;padding:12px 14px;border-radius:14px;cursor:pointer}
.ac li:hover,.ac li.on{background:#f3f5f6}
.ac .ai{width:40px;height:40px;border-radius:12px;background:#eef6f3;color:#00805b;display:grid;place-items:center;flex:none;font-size:19px}
.ac .ai svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ac b{display:block;font-size:15px;font-weight:700;line-height:1.3}
.ac b mark{background:none;color:#00805b}
.ac small{display:block;font-size:13px;color:#4d5555;margin-top:1px}
.ac .ah{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#4d5555;padding:10px 14px 4px}
.ac .empty{padding:14px;font-size:14px;color:#4d5555;line-height:1.45}
.ac .empty a{color:#000;font-weight:700}
.ac .foot{display:flex;justify-content:flex-end;padding:8px 12px 4px;border-top:1px solid #eef0f0;margin-top:6px;font-size:12px;color:#687272;font-weight:600}
/* date picker */
.dp{width:340px;padding:18px}
.dp .mh{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.dp .mh b{font-size:16px;font-weight:800}
.dp .mh button{width:38px;height:38px;border-radius:50%;border:0;background:#f3f5f6;cursor:pointer;display:grid;place-items:center;font-size:16px;color:#000}
.dp .mh button:disabled{opacity:.3;cursor:default}
.dp .mh svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.dp .gr{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.dp .dw{font-size:11px;font-weight:800;color:#687272;padding:6px 0;letter-spacing:.04em}
.dp .gr button{height:40px;border:0;border-radius:12px;background:none;font:600 14px 'Plus Jakarta Sans',sans-serif;color:#000;cursor:pointer}
.dp .gr button:hover{background:#eef6f3}
.dp .gr button.td{box-shadow:inset 0 0 0 1.5px #00c48c}
.dp .gr button.sel{background:#062b21;color:#fff}
.dp .gr button:disabled{color:#c3c9c9;cursor:default;background:none}
/* time picker: one scrolling list */
.tp{width:300px;padding:10px}
.tp .th{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:#4d5555;padding:8px 14px 6px}
.tp .tg{display:flex!important;flex-direction:column;max-height:360px;overflow:auto;gap:2px;padding:2px}
.tp .tg button{display:block;width:100%;text-align:left;height:auto;padding:14px 18px;border:0;border-radius:12px;background:none;font:500 17px 'Plus Jakarta Sans',sans-serif;cursor:pointer;color:#000}
.tp .tg button:hover{background:#f3f5f6}
.tp .tg button.sel{background:#eef0f0;font-weight:700}
.tp .tg button:disabled{color:#c3c9c9;cursor:default;background:none}
.tp .tg button .bk{float:right;font-size:13px;font-weight:600;color:#9aa3a3}
/* chevron on date and time fields */
.fld .chev{width:18px;height:18px;flex:none;fill:none;stroke:#000;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s;margin-left:auto}
.fld.open .chev{transform:rotate(180deg)}
/* checkout popup */
.ckm{position:fixed;inset:0;z-index:90;background:rgba(3,22,16,.55);display:grid;place-items:center;padding:16px;font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.ckm[hidden]{display:none!important}
.ckd{width:min(440px,100%);background:#fff;border-radius:26px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.35);color:#000}
.ckd .ch{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:22px 24px;border-bottom:1px solid #eef0f0}
.ckd .ch small{display:block;font-size:13px;color:#4d5555;font-weight:600}
.ckd .ch b{display:block;font-size:26px;font-weight:800;letter-spacing:-.02em;margin-top:2px}
.ckd .ch span.em{display:block;font-size:13px;color:#4d5555;margin-top:2px}
.ckd .x{width:38px;height:38px;border-radius:50%;border:0;background:#f3f5f6;cursor:pointer;font-size:18px;display:grid;place-items:center;flex:none;color:#000}
.ckd .x svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ckd .tabs{display:flex;gap:6px;padding:16px 24px 0}
.ckd .tabs button{flex:1;height:44px;border-radius:12px;border:1.5px solid #e3e6e6;background:#fff;font:700 14px 'Plus Jakarta Sans',sans-serif;cursor:pointer;color:#4d5555}
.ckd .tabs button.on{border-color:#062b21;color:#000;background:#f3faf7}
.ckd .cb{padding:18px 24px 8px;display:flex;flex-direction:column;gap:12px}
.ckd label{font-size:13px;font-weight:700;display:block;margin-bottom:6px}
.ckd .ci{height:50px;border:1.5px solid #e3e6e6;border-radius:14px;display:flex;align-items:center;padding:0 14px;gap:10px}
.ckd .ci:focus-within{border-color:#062b21;box-shadow:0 0 0 4px rgba(0,196,140,.18)}
.ckd .ci input{border:0;outline:0;font:500 16px 'Plus Jakarta Sans',sans-serif;width:100%;min-width:0;background:none}
.ckd .ci.bad{border-color:#d0443a}
.ckd .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ckd .note{font-size:13px;color:#4d5555;line-height:1.45}
.ckd .er{background:#fdeceb;color:#7a1d14;border-radius:12px;padding:10px 12px;font-size:13px;font-weight:600}
.ckd .pay{margin:8px 24px 0;height:54px;width:calc(100% - 48px);border:0;border-radius:999px;background:#00c48c;color:#000;font:800 16px 'Plus Jakarta Sans',sans-serif;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px}
.ckd .pay[disabled]{opacity:.6;cursor:default}
.ckd .cf{display:flex;justify-content:center;align-items:center;gap:8px;padding:14px 24px 20px;font-size:12px;color:#687272;font-weight:600}
.ckd .cf svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2}
.ckd .sim{margin:0 24px 6px;font-size:12px;color:#8a6d10;background:#fff6e5;border-radius:10px;padding:8px 10px;line-height:1.4}
.ckd .done{padding:34px 24px 10px;text-align:center}
.ckd .done .ok{width:64px;height:64px;border-radius:50%;background:#00c48c;display:grid;place-items:center;margin:0 auto 14px;font-size:30px}
.ckd .done .ok svg{width:1em;height:1em;fill:none;stroke:#000;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ckd .done b{display:block;font-size:20px}
.ckd .done p{font-size:14px;color:#4d5555;margin-top:6px}
.spin{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(0,0,0,.2);border-top-color:#000;animation:sp .8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
@media(max-width:1000px){.pop{left:0;right:0}.ac,.dp,.tp{width:auto}}
/* inside the landing fields, undo the field's column layout */
.fld .pop div{display:block;flex:none;min-width:0}
.fld .pop .mh{display:flex!important;flex-direction:row}
.fld .pop .gr{display:grid!important}
.fld .pop .foot{display:flex!important}
.ac{max-height:460px}
