/* merchant-profile.css — shared student profile (home.html + map.html).
 * Themed from the page's own tokens (--surface, --ink, --line, --purple);
 * falls back to the light palette when a page doesn't define them, and
 * body[data-theme="dark"] flips the accents that need more contrast. */
.mp{
  --mpk:var(--purple,#6C3FC5);
  --mp-ink:var(--ink,#201A33); --mp-soft:var(--ink-soft,#5C566F); --mp-faint:var(--ink-faint,#948DA8);
  --mp-line:var(--line,#E8E6EF); --mp-surface:var(--surface,#fff); --mp-canvas:var(--canvas,#F7F6FA);
  --mp-save:#1B7A4C; --mp-save-bg:rgba(47,168,106,.13); --mp-plus:#57309C; --mp-tint:var(--purple-tint,#F1ECFB);
  --mp-radius:14px;
  position:relative;font-family:var(--body,'Manrope',sans-serif);color:var(--mp-ink);
  padding:0 16px 24px;display:flex;flex-direction:column;gap:14px}
body[data-theme="dark"] .mp{--mp-save:#8EF0B9;--mp-save-bg:rgba(142,240,185,.14);--mp-plus:#CBB7F2}
.mp [hidden]{display:none!important}
.mp button{font-family:inherit}
.mp :focus-visible{outline:2px solid var(--mpk);outline-offset:2px}

/* top row */
.mp .mp-top{display:flex;justify-content:flex-end;margin:-4px 0 -6px}
.mp .mp-infobtn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--mp-line);background:var(--mp-surface);
  color:var(--mp-soft);border-radius:999px;padding:6px 12px 6px 9px;font-weight:800;font-size:12px;cursor:pointer}
.mp .mp-infobtn span{font-family:var(--display,'Sora',sans-serif)}

/* featured deal */
.mp .mp-feat{border:1px solid var(--mp-line);border-left:4px solid var(--dc);border-radius:var(--mp-radius);
  background:var(--mp-surface);padding:14px 16px 15px;display:flex;flex-direction:column;gap:9px}
.mp .mpf-chip{align-self:flex-start;background:color-mix(in srgb,var(--dc) 16%,var(--mp-surface));color:var(--dc);
  border-radius:999px;padding:5px 11px;font-size:12px;font-weight:800;font-family:var(--display,'Sora',sans-serif)}
body[data-theme="dark"] .mp .mpf-chip{background:color-mix(in srgb,var(--dc) 26%,var(--mp-surface));color:color-mix(in srgb,var(--dc) 70%,#fff)}
.mp .mpf-title{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:17px;line-height:1.25;letter-spacing:-.2px}
.mp .mpf-ex{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:13px;color:var(--mp-soft);font-weight:700}
.mp .mpf-ex b{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:22px;color:var(--mp-save)}
.mp .mpf-ex s{color:var(--mp-faint)}
.mp .mpf-plus{font-size:12.5px;font-weight:800;color:var(--mp-plus)}
.mp .mp-more{align-self:flex-start;border:none;background:none;color:var(--mp-plus);font-weight:800;font-size:12.5px;
  cursor:pointer;padding:0 2px;margin:-6px 0}

/* other deals (folded) */
.mp .mp-deals{display:flex;flex-direction:column;gap:10px}
.mp .mp-deal{border:1px solid var(--mp-line);border-left:4px solid var(--dc);border-radius:var(--mp-radius);background:var(--mp-surface);padding:12px 14px}
.mp .mpd-top{display:flex;gap:12px;align-items:flex-start}
.mp .mpd-pct{flex:0 0 auto;min-width:44px;text-align:center;background:color-mix(in srgb,var(--dc) 16%,var(--mp-surface));
  color:var(--dc);font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:14px;border-radius:10px;padding:7px 6px}
.mp .mpd-t b{display:block;font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:14px}
.mp .mpd-when{font-size:12px;font-weight:700;color:var(--mp-soft)}
.mp .mpd-items{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.mp .mpd-it{display:inline-flex;align-items:baseline;gap:6px;background:var(--mp-canvas);border-radius:9px;padding:6px 9px;font-size:12px;font-weight:700}
.mp .mpd-it b{color:var(--mp-save)}
.mp .mpd-it s{color:var(--mp-faint);font-size:12px}
.mp .mpd-plus{margin-top:9px;font-size:12px;font-weight:800;color:var(--mp-plus)}
.mp .mpd-plus.only{color:var(--dc)}

/* photo rail */
.mp .mp-rail{margin:0 -16px}
.mp .mpr-h{display:flex;justify-content:space-between;align-items:baseline;padding:0 16px 8px}
.mp .mpr-h b{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:15px}
.mp .mpr-h span{font-size:12px;font-weight:700;color:var(--mp-soft)}
.mp .mpr-row{display:flex;gap:10px;overflow-x:auto;padding:0 16px 4px;scroll-snap-type:x proximity;scroll-padding-left:16px;scrollbar-width:none}
.mp .mpr-row::-webkit-scrollbar{display:none}
.mp .mpr-ph{position:relative;flex:0 0 132px;height:172px;border-radius:14px;overflow:hidden;border:2px solid transparent;
  background:var(--mp-canvas);padding:0;cursor:pointer;scroll-snap-align:start}
.mp .mpr-ph img{width:100%;height:100%;object-fit:cover;display:block}
.mp .mpr-ph span{position:absolute;left:8px;bottom:8px;background:rgba(20,12,38,.7);color:#fff;font-size:12px;font-weight:800;
  padding:4px 8px;border-radius:999px}
.mp .mpr-add{flex:0 0 96px;height:172px;border-radius:14px;border:1.5px dashed var(--mp-line);background:var(--mp-surface);
  color:var(--mp-soft);font-weight:800;font-size:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer}
.mp .mpr-add span{width:34px;height:34px;border-radius:50%;background:var(--mp-tint);color:var(--mpk);font-size:20px;display:flex;align-items:center;justify-content:center}
.mp .mpr-empty{align-self:center;font-size:12.5px;color:var(--mp-soft);line-height:1.5;max-width:22ch}
.mp .mpr-empty b{display:block;font-family:var(--display,'Sora',sans-serif);color:var(--mp-ink);font-size:13.5px;margin-bottom:3px}

/* loyalty */
.mp .mp-loy{border:1px solid var(--mp-line);border-radius:var(--mp-radius);background:var(--mp-surface);padding:14px 16px}
.mp .mpl-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.mp .mpl-head b{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:19px}
.mp .mpl-next{font-size:13px;font-weight:800;color:#C9861A;text-align:right}
body[data-theme="dark"] .mp .mpl-next{color:#F0BE5E}
.mp .mpl-bartrack{position:relative;height:7px;border-radius:99px;background:var(--mp-canvas);margin:10px 0 8px;overflow:visible}
.mp .mpl-bar{position:absolute;inset:0 auto 0 0;border-radius:99px;background:linear-gradient(90deg,#7A50D6,#B79CF0);
  transition:width .7s cubic-bezier(.2,.8,.3,1)}
.mp .mpl-notch{position:absolute;top:-2px;width:12px;height:12px;border-radius:50%;transform:translateX(-6px);
  background:var(--mp-surface);border:2px solid var(--mp-line)}
.mp .mpl-notch.hit{background:var(--mpk);border-color:var(--mpk)}
.mp .mpl-foot{display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.mp .mpl-sub{font-size:12px;font-weight:700;color:var(--mp-soft)}
.mp .mpl-all{border:none;background:none;color:var(--mp-plus);font-weight:800;font-size:12.5px;cursor:pointer;padding:0;white-space:nowrap}
.mp .mpl-tiers{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.mp .mpl-tier{background:var(--mp-canvas);border:1px solid var(--mp-line);border-radius:11px;padding:9px 12px}
.mp .mpl-tier.hit{border-color:var(--mpk)}
.mp .mpl-tier .tl{display:flex;justify-content:space-between;align-items:baseline}
.mp .mpl-tier .tl b{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:12.5px}
.mp .mpl-tier .tl span{font-size:12px;font-weight:800;color:var(--mp-soft)}
.mp .mpl-tier .tr{margin-top:3px;font-size:12px;color:var(--mp-soft)}
.mp .mpl-tier em{font-style:normal;color:var(--mp-faint)}
.mp .mp-loy.off .mpl-head b{font-size:15px}
.mp .mp-loy.off .mpl-sub{display:block;margin:4px 0 10px}
.mp .mpl-signin{border:none;border-radius:10px;padding:9px 14px;background:var(--mpk);color:#fff;font-weight:800;font-size:12.5px;cursor:pointer}

/* menu — every section on one scroll, grouped-inset lists, sticky tab bar */
.mp .mp-menu{display:flex;flex-direction:column;gap:6px}
.mp .mpm-tabs{position:sticky;top:0;z-index:4;margin:0 -16px;padding:8px 0 6px;
  background:color-mix(in srgb,var(--mp-canvas) 86%,transparent);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3)}
.mp .mpm-rail{display:flex;gap:8px;overflow-x:auto;padding:2px 16px;scrollbar-width:none}
.mp .mpm-rail::-webkit-scrollbar{display:none}
.mp .mpm-sec{position:relative;flex:0 0 auto;border:1px solid transparent;background:var(--mp-surface);color:var(--mp-soft);
  border-radius:999px;padding:8px 14px;font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:12.5px;cursor:pointer;white-space:nowrap;
  transition:background .15s,color .15s}
.mp .mpm-sec.on{background:var(--mp-ink);color:var(--mp-surface)}
body[data-theme="dark"] .mp .mpm-sec.on{background:#fff;color:#201A33}
.mp .mpm-sec .dot{position:absolute;top:-2px;right:-2px;width:9px;height:9px;border-radius:50%;background:#2FA86A;border:2px solid var(--mp-canvas)}
.mp .mpm-group{padding-top:8px;scroll-margin-top:60px}
.mp .mpm-sec-h{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:19px;letter-spacing:-.2px;margin:6px 0 8px}
.mp .mpm-banner{border:none;background:var(--mp-save-bg);color:var(--mp-save);border-radius:10px;padding:8px 12px;font-size:12.5px;font-weight:800;margin-bottom:8px}
.mp .mpm-list{background:var(--mp-surface);border:1px solid var(--mp-line);border-radius:16px;overflow:hidden}
.mp .mpm-it{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:stretch;padding:13px 14px;border-bottom:1px solid var(--mp-line);transition:background .15s}
.mp .mpm-it:last-child{border-bottom:none}
.mp .mpm-it.in{background:color-mix(in srgb,var(--mpk) 5%,var(--mp-surface))}
.mp .mpm-it .n{min-width:0;display:flex;flex-direction:column}
.mp .mpm-it .n b{font-family:var(--display,'Sora',sans-serif);font-weight:700;font-size:14.5px;letter-spacing:-.1px}
.mp .mpm-it .n>span{font-size:12px;color:var(--mp-soft);line-height:1.4;margin-top:2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mp .mpm-it .p{margin-top:auto;padding-top:6px}
.mp .mpm-it .pl{display:flex;align-items:baseline;gap:6px;white-space:nowrap}
.mp .mpm-it .pl b{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:14px}
.mp .mpm-it .pl b.now{color:var(--mp-save)}
.mp .mpm-it .pl s{font-size:12px;color:var(--mp-faint)}
.mp .mpm-it .off{font-style:normal;font-size:12px;font-weight:800;color:var(--mp-save);background:var(--mp-save-bg);border-radius:99px;padding:2px 7px}
.mp .mpm-it .plus{font-size:12px;font-weight:800;color:var(--mp-plus);margin-top:2px}
.mp .mpm-it .r{position:relative;display:flex;align-items:flex-end;justify-content:flex-end;min-width:40px}
.mp .mpm-it .r img{width:88px;height:88px;border-radius:12px;object-fit:cover;background:var(--mp-canvas);display:block}
.mp .mpm-it .r img+.mpm-add,.mp .mpm-it .r img+.mpm-qty{position:absolute;right:6px;bottom:6px}
.mp .mpm-add{width:36px;height:36px;border:none;border-radius:50%;background:var(--mp-surface);color:var(--mp-ink);
  box-shadow:0 1px 2px rgba(32,26,51,.14),0 4px 12px rgba(32,26,51,.12);font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:20px;line-height:1;cursor:pointer;
  transition:transform .12s,background .15s,color .15s}
.mp .mpm-add:active{transform:scale(.92)}
.mp .mpm-add.done{background:var(--mp-ink);color:var(--mp-surface)}
.mp .mpm-qty{display:inline-flex;align-items:center;height:36px;border-radius:999px;background:var(--mp-ink);color:var(--mp-surface);
  box-shadow:0 4px 12px rgba(32,26,51,.18);font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:13px}
body[data-theme="dark"] .mp .mpm-qty{background:#fff;color:#201A33}
.mp .mpm-qty b{min-width:22px;text-align:center;font-variant-numeric:tabular-nums}
.mp .mpm-qty button{width:36px;height:36px;border:none;background:none;color:inherit;font-size:18px;line-height:1;cursor:pointer;border-radius:50%}
.mp .mpm-qty button:active{transform:scale(.9)}
.mp .mpm-empty{font-size:12.5px;color:var(--mp-soft);padding:14px}

/* basket bar — sticks to the sheet bottom while there's something in it */
.mp .mp-basket{position:sticky;bottom:12px;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--mpk);color:#fff;border-radius:999px;padding:12px 14px 12px 12px;text-decoration:none;margin-top:6px;
  font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:14px;box-shadow:0 10px 26px rgba(108,63,197,.4);
  bottom:calc(12px + env(safe-area-inset-bottom))}
.mp .mp-basket.bump{animation:mp-bump .32s cubic-bezier(.2,.9,.3,1.4)}
@keyframes mp-bump{0%{transform:scale(1)}40%{transform:scale(1.035)}100%{transform:scale(1)}}
.mp .mp-basket .c{background:rgba(255,255,255,.22);border-radius:999px;padding:5px 11px;font-size:12px}
.mp .mp-basket .t{font-size:14px}

/* info sheet */
.mp-scrim{position:fixed;inset:0;z-index:9998;background:rgba(28,16,56,.55);display:flex;align-items:center;justify-content:center;padding:20px}
.mp-info{position:relative;background:var(--surface,#fff);color:var(--ink,#201A33);border-radius:22px;padding:20px 20px 22px;max-width:380px;width:100%;font-family:var(--body,'Manrope',sans-serif);
  box-shadow:0 30px 60px rgba(20,12,38,.35)}
.mp-info .grab{display:none;width:36px;height:5px;border-radius:99px;background:var(--line,#E8E6EF);margin:-8px auto 14px}
@media(max-width:640px){
  .mp-scrim{align-items:flex-end;padding:0}
  .mp-info{max-width:none;border-radius:22px 22px 0 0;padding-bottom:calc(22px + env(safe-area-inset-bottom));animation:mp-up .28s cubic-bezier(.2,.8,.3,1)}
  .mp-info .grab{display:block}
}
@keyframes mp-up{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
.mp-info b{font-family:var(--display,'Sora',sans-serif);font-weight:800;font-size:16px}
.mp-info .mpi-type{font-size:12px;font-weight:700;color:var(--ink-soft,#5C566F);margin:2px 0 8px}
.mp-info .row{display:flex;gap:10px;font-size:12.5px;padding:8px 0;border-bottom:1px solid var(--line,#E8E6EF)}
.mp-info .row:last-child{border-bottom:none}
.mp-info .row span{flex:0 0 64px;font-weight:800;color:var(--ink-soft,#5C566F);font-size:12px}
.mp-info .row a{color:var(--purple,#6C3FC5);font-weight:700;text-decoration:none}
.mp-info .x{position:absolute;top:10px;right:10px;border:none;background:var(--line,#E8E6EF);color:inherit;border-radius:8px;width:28px;height:28px;cursor:pointer}

/* desktop: rows breathe, photos a touch larger */
@media(min-width:641px){
  .mp{padding:0 20px 28px}
  .mp .mp-rail,.mp .mpm-tabs{margin:0 -20px}
  .mp .mpr-h,.mp .mpr-row{padding-left:20px;padding-right:20px}
  .mp .mpr-row{scroll-padding-left:20px}
  .mp .mpm-rail{padding-left:20px;padding-right:20px}
  .mp .mpr-ph{flex-basis:148px;height:190px}
  .mp .mpr-add{height:190px}
}
@media(prefers-reduced-motion:reduce){.mp .mpl-bar{transition:none}.mp .mp-basket.bump{animation:none}.mp-info{animation:none}}

/* ---- App Project Fix R3: the sticky section bar is THE section nav ---- */
.mp .mpm-tabs{pointer-events:auto}
.mp .mpm-sec{cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.mp .mpm-group{scroll-margin-top:60px}

/* ---- App Project Fix R6: loyalty banner — framed block, purple streak bar ---- */
.mp .mp-loy.framed{border:1.5px solid var(--mp-line);border-radius:18px;padding:15px 16px 14px;
  background:linear-gradient(160deg,rgba(108,63,197,.055),rgba(108,63,197,0)) ,var(--mp-surface)}
.mp .mp-loy.framed .mpl-bartrack{height:12px;overflow:hidden;background:var(--mp-canvas)}
.mp .mp-loy.framed .mpl-bar{background:linear-gradient(90deg,#5B2E9D,#8B5CF0 55%,#A78BFA);overflow:hidden}
/* the light streak travelling left → right */
.mp .mp-loy.framed .mpl-bar:after{content:"";position:absolute;top:0;bottom:0;width:46%;border-radius:99px;
  background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.75),rgba(255,255,255,0));
  animation:mplSheen 2.1s linear infinite}
@keyframes mplSheen{0%{transform:translateX(-120%)}100%{transform:translateX(320%)}}
@media (prefers-reduced-motion:reduce){.mp .mp-loy.framed .mpl-bar:after{animation:none;opacity:.35}}
.mp .mp-loy.framed .mpl-notch{display:none}   /* the rail below carries the labels instead */
.mp .mpl-rail{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12px;font-weight:700;margin-top:2px}
.mp .mpl-done{display:flex;gap:8px;flex-wrap:wrap;min-width:0}
.mp .mpl-done .ok{color:var(--mp-green,#1E8E5A)}
.mp .mpl-done .none{color:var(--mp-soft)}
.mp .mpl-nxt{color:#C9861A;white-space:nowrap;text-align:right}
body[data-theme="dark"] .mp .mpl-nxt{color:#F0BE5E}
.mp .mpl-acts{display:flex;gap:9px;align-items:center;margin-top:12px}
/* framed rounded rectangle — the same shape as the rest of the banner */
.mp .mpl-check{flex:1;border:1.5px solid var(--mpk);border-radius:14px;background:linear-gradient(135deg,var(--mpk),#57309C);
  color:#fff;font-family:inherit;font-weight:800;font-size:13.5px;padding:12px 14px;cursor:pointer;
  box-shadow:0 8px 20px rgba(87,48,156,.22)}
.mp .mpl-check:active{transform:scale(.985)}
.mp .mpl-acts .mpl-all{flex:0 0 auto;border:1.5px solid var(--mp-line);border-radius:14px;padding:12px 14px;background:var(--mp-surface)}

/* ═══ Run 8 (R122): the full audit — tap targets of at least 44 px, words at WCAG AA
   contrast, and the end of the sheet clear of a phone's home bar. Nothing is moved. ═══ */
.mp .mp-infobtn,.mp .mpm-sec{min-height:44px}
.mp .mpm-add{width:44px;height:44px}
.mp .mpf-chip{color:color-mix(in srgb,var(--dc) 58%,#000)}
body[data-theme="dark"] .mp .mpf-chip,body.dark .mp .mpf-chip{color:color-mix(in srgb,var(--dc) 55%,#fff)}
.mp{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
@media(min-width:641px){.mp{padding-bottom:calc(28px + env(safe-area-inset-bottom))}}
.mp-info .x{width:44px;height:44px;top:6px;right:6px}

/* Run 8 (R122) — the audit on used data (a shop with more offers): "See all" and "more" are 44 px to tap; the line keeps its height */
.mp .mp-more{padding:13.5px 0;margin:-13.5px 0}
.mp .mpl-acts .mpl-all{min-height:44px}
