/* Dr. Fixit Warranty Portal — public pages, on top of drfixit-base.css + warranty.css (the design) */
.wz-map-wrap { margin-top: .75rem; }
.wz-map { width: 100%; height: 260px; border-radius: var(--df-r, 16px); border: 1px solid var(--df-line-2, #D9E4F0); }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .02em; }
.btn-df-ghost.btn-sm { font-size: .85rem; padding: .35rem .8rem; }

/* Tracker / consent / verify pages */
.df-page { max-width: 880px; margin: 0 auto; padding: 1.5rem 1rem 3rem; }
.df-panel { background: #fff; border: 1px solid var(--df-line, #EAF0F7); border-radius: var(--df-r-lg, 20px); padding: 1.5rem; box-shadow: 0 1px 3px rgba(0, 41, 75, .06); }
.df-panel + .df-panel { margin-top: 1rem; }
.df-panel h2 { font-weight: 800; letter-spacing: -.01em; font-size: 1.35rem; margin-bottom: .25rem; }
.trk-steps { list-style: none; padding: 0; margin: 1.25rem 0 0; display: grid; gap: .5rem; }
.trk-steps li { display: flex; gap: .75rem; align-items: center; padding: .6rem .8rem; border-radius: 12px; background: #F5F8FC; color: #5A7290; font-weight: 600; font-size: .92rem; }
.trk-steps li .n { width: 1.8rem; height: 1.8rem; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 2px solid #D9E4F0; font-size: .8rem; flex: none; }
.trk-steps li.done { background: #E9F9EF; color: #15803d; }
.trk-steps li.done .n { background: #22C55E; border-color: #22C55E; color: #fff; }
.trk-steps li.now { background: #FFF9D6; color: #00294B; }
.trk-steps li.now .n { background: #FFDE00; border-color: #FBCF00; color: #00294B; }
.kv { display: grid; grid-template-columns: minmax(130px, 34%) 1fr; gap: .45rem 1rem; margin: 0; }
.kv dt { color: #5A7290; font-weight: 600; font-size: .9rem; }
.kv dd { margin: 0; font-weight: 600; color: #0C2039; }
.stamp-ok { display: inline-flex; align-items: center; gap: .5rem; background: #E9F9EF; color: #15803d; font-weight: 800; border-radius: 999px; padding: .4rem 1rem; }
.stamp-bad { display: inline-flex; align-items: center; gap: .5rem; background: #FDECEE; color: #B42335; font-weight: 800; border-radius: 999px; padding: .4rem 1rem; }
.df-flash { border-radius: 14px; padding: .8rem 1rem; font-weight: 600; margin-bottom: 1rem; }
.df-flash.ok { background: #E9F9EF; color: #15803d; } .df-flash.bad { background: #FDECEE; color: #B42335; }

/* Staff sign-in on the brand sheet */
.auth-box { max-width: 440px; margin: 2rem auto 3rem; }
.auth-box .df-panel { padding: 2rem 1.75rem; }
.auth-box .otp-boxes { display: flex; gap: .5rem; justify-content: center; }
.auth-box .otp-boxes input { width: 3rem; height: 3.3rem; text-align: center; font-size: 1.4rem; font-weight: 800; border-radius: 12px; }
@media (max-width: 400px) { .auth-box .otp-boxes input { width: 2.5rem; height: 2.9rem; font-size: 1.15rem; } }