/* Trang Đơn hàng v2 — dùng chung token và khối của /loyalty (loyalty.css), chỉ thêm phần riêng của đơn. */
.field-wrap{display:flex;align-items:stretch;margin-top:32px;height:72px;border-radius:var(--rl-r-16);background:var(--rl-card);border:2px solid var(--rl-dark);overflow:hidden}
.field-wrap:focus-within{outline:3px solid var(--rl-green);outline-offset:2px}
.field-wrap span{display:grid;place-items:center;padding:0 16px 0 24px;font-size:28px;font-weight:700;letter-spacing:.04em;color:var(--rl-text-faint)}
.field-wrap .field{margin:0;height:100%;border:0;border-radius:0;padding:0 24px 0 0;min-width:0}
.field-wrap .field:focus-visible{outline:none}
.message.error{color:#A8483B}

.recent{display:flex;align-items:center;gap:12px;width:100%;margin-top:24px;padding:12px 16px 12px 12px;border:0;border-radius:var(--rl-r-16);background:var(--rl-card);color:var(--rl-text);text-align:left;cursor:pointer}
.recent div{flex:1;min-width:0}
.recent b{display:block;font-size:15px}
.recent small{display:block;margin-top:2px;font-size:13px;color:var(--rl-text-faint)}

.status{margin-top:16px;background:var(--rl-card);border-radius:var(--rl-r-24);padding:24px;box-shadow:0 8px 24px rgba(11,61,42,.06)}
.status h2{margin:8px 0 0;font:30px/1.15 Georgia,serif;color:var(--rl-dark)}
.status p{margin:8px 0 0;font-size:15px;line-height:1.5;color:var(--rl-text-sec)}
.status .eyebrow{margin:0}
.status-top{display:flex;align-items:baseline;justify-content:space-between;gap:16px}
.timer{font-size:28px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--rl-dark)}
.status.warn .timer,.status.warn h2{color:#8A6516}
.status.late .timer,.status.late h2{color:#A8483B}
.status.ready{background:var(--rl-dark);box-shadow:0 12px 28px rgba(11,61,42,.28)}
.status.ready .eyebrow,.status.ready p{color:rgba(255,255,255,.8)}
.status.ready h2{color:#fff}
.status.ready .code{display:block;margin-top:16px;font-size:44px;font-weight:700;letter-spacing:.08em;color:#fff}
.status.cancelled h2{color:#A8483B}

.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:24px 0 0;padding:0}
.steps li{display:flex;flex-direction:column;gap:8px;font-size:12px;line-height:1.3;color:var(--rl-text-faint)}
.steps li::before{content:"";height:6px;border-radius:var(--rl-r-pill);background:rgba(11,61,42,.12)}
.steps li.done::before{background:var(--rl-dark)}
.steps li.now::before{background:var(--rl-green);animation:rlStepPulse 1.6s ease-in-out infinite}
.steps li.now{color:var(--rl-dark);font-weight:700}
.status.ready .steps li{color:rgba(255,255,255,.7)}
.status.ready .steps li::before{background:rgba(255,255,255,.2)}
.status.ready .steps li.done::before,.status.ready .steps li.now::before{background:#fff}
.status.ready .steps li.now{color:#fff}
@keyframes rlStepPulse{50%{opacity:.45}}

.checked{display:flex;align-items:center;gap:8px;margin:16px 0 0;font-size:13px;color:var(--rl-text-faint)}
.checked .ico{width:16px;height:16px}
.status.ready .checked{color:rgba(255,255,255,.75)}

.tile b.small{font-size:14px}
.item-img{width:48px;height:48px;flex:none;border-radius:var(--rl-r-12);background:var(--rl-page-2) center/contain no-repeat}
.row strong.money{color:var(--rl-text)}
.note{display:flex;gap:12px;align-items:flex-start;margin-top:8px;padding:12px 16px;border-radius:var(--rl-r-16);background:var(--rl-page-2);font-size:14px;line-height:1.45;color:var(--rl-text-sec)}
.note .ico{width:18px;height:18px;margin-top:1px;color:var(--rl-text-faint)}
.total{display:flex;justify-content:space-between;align-items:baseline;margin-top:16px;padding:16px 4px 0;border-top:1px solid var(--rl-line);font-size:17px;font-weight:700}
.total span:last-child{font-size:22px}

.follow{display:flex;align-items:center;gap:12px;margin-top:24px;padding:12px 12px 12px 16px;border-radius:var(--rl-r-16);background:var(--rl-card)}
.follow div{flex:1;min-width:0}
.follow b{display:block;font-size:15px}
.follow small{display:block;margin-top:2px;font-size:13px;color:var(--rl-text-faint)}
.follow a{width:44px;height:44px;flex:none;border-radius:50%;background:var(--rl-page-2);display:grid;place-items:center;color:var(--rl-dark)}

.skeleton{border-radius:var(--rl-r-12);background:linear-gradient(90deg,#ECE9DF 0,#F5F2EA 40px,#ECE9DF 80px);background-size:420px 100%;animation:rlShimmer 1.2s linear infinite}
@keyframes rlShimmer{0%{background-position:-420px 0}100%{background-position:420px 0}}

/* Nút "Hỏi Rừng Lá" nổi lên trên nút chính ở đáy, không che giá món. */
body #rl-ai-launcher{bottom:calc(104px + env(safe-area-inset-bottom))}
.scroll{padding-bottom:88px}

@media (prefers-reduced-motion:reduce){.steps li.now::before,.skeleton{animation:none}}

/* Âm báo & rung khi đơn sẵn sàng */
.alert-chip{display:flex;align-items:center;gap:8px;width:100%;min-height:44px;margin-top:16px;padding:8px 16px;border:1px dashed rgba(11,61,42,.25);border-radius:var(--rl-r-pill);background:var(--rl-page-2);color:var(--rl-text-sec);font-size:13px;font-weight:600;text-align:left;cursor:pointer}
.alert-chip .ico{width:18px;height:18px}
.alert-chip.is-on{border-style:solid;border-color:transparent;background:var(--rl-soft);color:var(--rl-dark)}
.alert-chip:focus-visible{outline:3px solid var(--rl-green);outline-offset:2px}