/* ==========================================================================
   Chrome: promo bar, header, primary nav, mobile menu, notifications,
   location picker, footer, help sheet, chat button.
   ========================================================================== */

/* ---- Promo bar ---- */
.mm-promo { background: var(--ink); color: #fff; display: flex; justify-content: center; align-items: center; gap: 4px 28px; flex-wrap: wrap; padding: 6px var(--gutter); font-size: 12.5px; text-align: center; }
.mm-promo strong { color: var(--mint); }
.mm-promo__item + .mm-promo__item::before { content: "•"; margin-right: 28px; opacity: .5; }
@media (max-width: 767px) {
	.mm-promo { flex-wrap: nowrap; min-height: 32px; }
	.mm-promo__item { display: none; }
	.mm-promo__item.is-on { display: block; }
	.mm-promo__item + .mm-promo__item::before { content: none; }
}

/* ---- Header ---- */
.mm-header { position: sticky; top: 0; z-index: 90; background: #fff; border-bottom: 1px solid var(--line); }
.admin-bar .mm-header { top: 32px; }
.mm-header__row { display: flex; align-items: center; gap: 10px; min-height: var(--header-h); }
.mm-header--bare .mm-header__row { justify-content: space-between; }
.mm-logo { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); text-decoration: none !important; flex: none; font: 700 19px var(--display); }
.mm-logo__mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--pri); }
.mm-logo__mark svg { width: 22px; height: 22px; }
.mm-logo__img { max-height: 40px; width: auto; }
.mm-logo__text { display: grid; gap: 1px; line-height: 1.1; }
.mm-logo__text strong { font: 700 18px var(--display); color: var(--ink); white-space: nowrap; }
.mm-logo__text small { font: 500 10.5px var(--font); color: var(--mute); letter-spacing: .02em; white-space: nowrap; }
@media (max-width: 1279px) { .mm-logo__text small { display: none; } }

.mm-loc { position: relative; flex: none; }
.mm-loc__btn { display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); background: #fff; border-radius: var(--r-md); padding: 6px 12px; color: var(--pri); text-align: left; min-height: 46px; max-width: 230px; }
.mm-loc__btn .mm-ico { width: 18px; height: 18px; }
.mm-loc__txt { display: grid; line-height: 1.15; min-width: 0; }
.mm-loc__txt small { font-size: 11.5px; color: var(--mute); }
.mm-loc__txt strong { font-size: 14px; color: var(--pri); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mm-loc__chev { width: 14px; height: 14px; color: var(--mute); }
.mm-loc__btn[aria-expanded="true"] .mm-loc__chev { transform: rotate(180deg); }

.mm-searchbtn { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; height: 46px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--mute); font: 400 15px var(--font); text-align: left; transition: border-color .15s, box-shadow .15s; }
.mm-searchbtn:hover { border-color: #cbbff0; box-shadow: var(--sh-sm); }
.mm-searchbtn .mm-ico { width: 19px; height: 19px; color: var(--mute); }
.mm-searchbtn span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-searchbtn kbd { font: 700 12px var(--font); color: var(--subtle); border: 1px solid var(--line); border-radius: 6px; padding: 1px 7px; background: var(--bg); }
.mm-searchbtn--lg { height: 56px; max-width: 760px; width: 100%; padding: 0 22px; font-size: 16px; background: #fff; border-color: transparent; box-shadow: 0 6px 24px rgba(20, 8, 60, .25); }
.mm-header__search { max-width: 640px; flex: 1 1 220px; min-width: 180px; }
.mm-header__searchicon { display: none; }

.mm-header__actions { display: flex; align-items: center; gap: 10px; margin-left: auto; flex: none; }
.mm-header__saved { display: none; }
@media (min-width: 1024px) { .mm-header__saved { display: inline-grid; } }
.mm-header__rx { min-height: 44px; padding: 0 16px; }
.mm-account-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px 0 8px; border: 1.5px solid var(--pri); border-radius: var(--r-md); color: var(--pri); font-weight: 700; text-decoration: none !important; background: #fff; }
.mm-account-btn:hover { background: var(--soft); }
.mm-account-btn i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--pri); color: #fff; font: 700 13px var(--font); font-style: normal; }
.mm-account-btn:not(.is-user) { padding-left: 14px; }
.mm-account-btn .mm-ico { width: 18px; height: 18px; }
.mm-secure { display: inline-flex; align-items: center; gap: 6px; color: var(--teal-ink); background: var(--teal-bg); border-radius: 999px; padding: 6px 14px; font-weight: 700; font-size: 13.5px; }
.mm-secure .mm-ico { width: 15px; height: 15px; }
.mm-header__menu { display: none; }

/* Primary nav */
.mm-nav { border-top: 1px solid var(--line-2); }
.mm-nav__in { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.mm-nav__in::-webkit-scrollbar { display: none; }
.mm-navlink { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; font-size: 14.5px; font-weight: 500; color: var(--body); white-space: nowrap; text-decoration: none !important; }
.mm-navlink:hover { color: var(--pri); }
.mm-navlink.is-active { color: var(--pri); font-weight: 700; }
.mm-navlink.is-active::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--pri); }

@media (max-width: 1023px) {
	.mm-header__row { gap: 8px; min-height: 60px; flex-wrap: nowrap; }
	.mm-header__menu { display: inline-grid; }
	.mm-loc { margin-left: auto; }
	.mm-header__actions { margin-left: 0; }
	.mm-header__search { display: none; }
	.mm-header__searchicon { display: inline-grid; }
	.mm-nav { display: none; }
	.mm-loc__btn { padding: 5px 9px; min-height: 42px; max-width: 168px; }
	.mm-loc__txt small { display: none; }
	.mm-header__rx span, .mm-account-btn span { display: none; }
	.mm-header__rx { padding: 0 12px; }
	.mm-account-btn, .mm-account-btn:not(.is-user) { padding: 0 6px; }
	.mm-header__actions { gap: 6px; }
}
@media (max-width: 430px) { .mm-header:not(.mm-header--bare) .mm-logo__text { display: none; } }
@media (max-width: 640px) {
	.mm-header--bare .mm-logo__text strong { font-size: 16px; }
	.mm-header .mm-notes, .mm-header .mm-account-btn { display: none; }
	.mm-loc__btn { width: 44px; min-height: 44px; padding: 0; justify-content: center; }
	.mm-loc__txt, .mm-loc__chev { display: none; }
	.mm-logo__text strong { font-size: 16px; }
	.mm-secure { padding: 6px 10px; font-size: 12.5px; }
	.mm-header__rx { display: none; }
	.mm-logo { font-size: 17px; }
}

/* ---- Notifications ---- */
.mm-notes { position: relative; }
.mm-notes__panel { position: absolute; right: 0; top: calc(100% + 10px); width: 340px; max-width: calc(100vw - 24px); background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-lg); z-index: 95; overflow: hidden; }
.mm-notes__head { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.mm-notes__head > span { display: flex; align-items: center; gap: 4px; }
.mm-notes__x { display: grid; place-items: center; width: 32px; height: 32px; border: 0; background: none; border-radius: 8px; color: var(--mute); }
.mm-notes__list { max-height: 360px; overflow-y: auto; }
.mm-notes__empty { padding: 22px 16px; margin: 0; text-align: center; color: var(--mute); font-size: 14px; }
.mm-note { display: block; padding: 12px 14px; border-bottom: 1px solid var(--line-2); color: var(--body); text-decoration: none !important; }
.mm-note:hover { background: var(--bg); }
.mm-note.is-unread { background: var(--soft); }
.mm-note b { display: block; color: var(--ink); font-size: 14px; }
.mm-note p { margin: 2px 0 4px; font-size: 13.5px; color: var(--mute); }
.mm-note small { color: var(--subtle); font-size: 12px; }
@media (max-width: 640px) { .mm-notes { position: static; } .mm-notes__panel { left: 12px; right: 12px; top: 64px; position: fixed; width: auto; } }

/* ---- Location picker (dropdown on desktop, bottom sheet on phones) ---- */
.mm-locp { position: absolute; left: 0; top: calc(100% + 10px); width: 400px; max-width: calc(100vw - 24px); background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-lg); padding: 18px; z-index: 95; }
.mm-locp__head { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.mm-locp__head h2 { font-size: 18px; margin: 0 0 2px; }
.mm-locp__head p { margin: 0; color: var(--mute); font-size: 13.5px; }
.mm-locp__or { display: flex; align-items: center; gap: 10px; margin: 14px 0; color: var(--mute); font-size: 12.5px; }
.mm-locp__or span { flex: 1; height: 1px; background: var(--line); }
.mm-locp__form { display: flex; gap: 8px; }
.mm-locp__pin { flex: 1; display: flex; align-items: center; gap: 8px; border: 1.5px solid #d3cce9; border-radius: 12px; padding: 0 12px; background: #fff; color: var(--mute); }
.mm-locp__pin:focus-within { border-color: var(--pri); }
.mm-locp__pin .mm-ico { width: 18px; height: 18px; }
.mm-locp__pin input { flex: 1; min-width: 0; border: 0; outline: 0; min-height: 44px; font: 400 16px var(--font); background: none; color: var(--ink); }
.mm-locp__detect { margin-top: 10px; }
.mm-locp__msg { margin: 10px 0 0; font-size: 13.5px; color: var(--red); }
.mm-locp__ctitle { font: 700 12px var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--mute); margin: 16px 0 8px; }
.mm-locp__grid { display: flex; flex-wrap: wrap; gap: 6px; max-height: 150px; overflow-y: auto; }
.mm-locp__grid button { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 5px 12px; font-size: 13px; color: var(--body); min-height: 32px; }
.mm-locp__grid button:hover { border-color: var(--pri-xl); }
.mm-locp__grid button.is-on { background: var(--pri); border-color: var(--pri); color: #fff; }
@media (max-width: 1023px) {
	.mm-loc { position: static; }
	.mm-loc.is-open::before { content: ""; position: fixed; inset: 0; background: rgba(26, 18, 48, .5); z-index: 94; }
	.mm-locp { position: fixed; left: 0; right: 0; bottom: 0; top: auto; width: auto; max-width: none; border-radius: 20px 20px 0 0; max-height: 86vh; overflow-y: auto; padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)); z-index: 96; }
}

/* ---- Mobile menu ---- */
.mm-menu { position: fixed; inset: 0; z-index: 200; }
.mm-menu[hidden] { display: none; }
.mm-menu__scrim { position: absolute; inset: 0; border: 0; background: rgba(26, 18, 48, .55); }
.mm-menu__panel { position: absolute; left: 0; top: 0; bottom: 0; width: min(340px, 88vw); background: #fff; overflow-y: auto; padding: 14px 16px 24px; animation: mm-slide .2s ease; outline: 0; }
@keyframes mm-slide { from { transform: translateX(-24px); opacity: 0; } to { transform: none; opacity: 1; } }
.mm-menu__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.mm-menu__acct { margin-bottom: 14px; }
.mm-menu__user { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: var(--r-md); background: var(--soft); text-decoration: none !important; color: var(--ink); }
.mm-menu__user i { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--pri); color: #fff; font: 700 16px var(--font); font-style: normal; }
.mm-menu__user small { display: block; color: var(--mute); font-size: 12.5px; }
.mm-menu__label { margin: 16px 0 6px; font: 700 11.5px var(--font); letter-spacing: .1em; text-transform: uppercase; color: var(--subtle); }
.mm-dlink { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 46px; padding: 0 10px; border: 0; background: none; border-radius: 10px; color: var(--ink); font: 500 15.5px var(--font); text-align: left; text-decoration: none !important; }
.mm-dlink:hover, .mm-dlink.is-active { background: var(--soft); color: var(--pri); }
.mm-dlink .mm-ico { width: 20px; height: 20px; color: var(--pri); }
.mm-menu__count { margin-left: auto; background: var(--red); color: #fff; border-radius: 99px; padding: 0 7px; font-size: 12px; font-weight: 700; }

/* ---- Chat button ---- */
.chat-fab { position: fixed; right: 18px; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); width: 52px; height: 52px; border-radius: 50%; border: 0; background: var(--pri); color: #fff; display: grid; place-items: center; box-shadow: var(--sh-lg); z-index: 80; }
.chat-fab:hover { background: var(--pri-d); }
.chat-fab .mm-ico { width: 24px; height: 24px; }

/* Chat button: always present; sits above the product page's purchase bar on phones */



/* ---- chrome: page-level rules ported from the previous design, one rule per selector ---- */
@media(prefers-reduced-motion:reduce){
.mm-marquee__track{animation:none}
}
.mm-footer{margin-top:32px;border-top:1px solid var(--line);background:#fff}
.mm-footer__cta{border-bottom:1px solid var(--line);padding:28px 0}
.mm-footer__ctarow{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
@media(min-width:640px){
.mm-footer__ctarow{flex-direction:row;align-items:center;justify-content:space-between}
}
.mm-footer__ctarow p{font-family:var(--display);font-size:22px;font-weight:700;color:var(--ink);margin:0}
.mm-footer__ghost{border:1.5px solid var(--ink);border-radius:99px;background:none;padding:11px 26px;font-weight:600;font-size:14px;color:var(--ink);min-height:44px}
.mm-footer__ghost:hover{background:var(--ink);color:#fff}
.mm-footer__grid{display:grid;gap:0;padding-block:8px}
@media(min-width:768px){
.mm-footer__grid{grid-template-columns:1.3fr repeat(4,1fr);gap:32px;padding-block:44px}
}
.mm-footer__news{padding:20px 0}
@media(min-width:768px){
.mm-footer__news{padding:0}
}
.mm-footer__big{font-family:var(--display);font-size:26px;font-weight:800;line-height:1.15;color:var(--ink);margin-bottom:18px}
.mm-newsform__pill{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:99px;padding:4px 4px 4px 18px;background:#fff}
.mm-newsform__pill:focus-within{border-color:var(--pri)}
.mm-newsform__pill input{flex:1;border:0;outline:0;font:inherit;font-size:14px;min-width:0;padding:8px 0}
.mm-newsform__pill button{width:38px;height:38px;border:0;border-radius:50%;background:var(--pri);color:#fff;font-size:16px}
.mm-fcol{border-top:1px solid var(--line)}
@media(min-width:768px){
.mm-fcol{border:0}
}
.mm-fcol__btn{display:flex;width:100%;justify-content:space-between;align-items:center;background:none;border:0;padding:16px 0;text-align:left}
.mm-fcol__btn .mm-ico{width:16px;height:16px;color:var(--mute);transition:transform .2s}
.mm-fcol__btn[aria-expanded=true] .mm-ico{transform:rotate(180deg)}
.mm-fcol__body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s}
.mm-fcol__body>div{overflow:hidden;display:flex;flex-direction:column}
.mm-fcol__btn[aria-expanded=true]+.mm-fcol__body{grid-template-rows:1fr;padding-bottom:12px}
.mm-flink{display:block;padding:6px 0;font-size:14px;color:var(--body);text-decoration:none}
.mm-flink:hover{color:var(--pri)}
@media(min-width:768px){
.mm-fcol__btn{pointer-events:none;padding:0;margin-bottom:14px}
.mm-fcol__btn .mm-ico{display:none}
.mm-fcol__body{grid-template-rows:1fr}
}
.mm-fcol--contact{padding:16px 0}
@media(min-width:768px){
.mm-fcol--contact{padding:0}
.mm-fcol__static{margin-bottom:14px}
}
.ftr-marquee-track{display:flex;width:max-content;gap:4rem;animation:marquee-x 38s linear infinite}
.mm-marquee__set{display:flex;align-items:center;gap:4rem}
.mm-marquee__item{display:flex;align-items:center;gap:4rem}
.mq-outline{color:var(--pri-xl)}
.mq-solid{color:var(--pri)}
.mm-marquee__dot{width:8px;height:8px;border-radius:50%;background:var(--line);flex:none}
.mm-footer__legal{border-top:1px solid var(--line);padding:20px 0;font-size:12.5px;color:var(--mute)}
.mm-footer__legalrow{display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;justify-content:space-between}
.mm-footer__badges{display:flex;flex-wrap:wrap;gap:6px 18px}
.mm-footer--min{margin-top:40px}
.mm-footer__minrow{display:flex;flex-wrap:wrap;gap:6px 24px;padding-block:20px;font-size:12.5px;color:var(--mute)}
.mm-help{position:fixed;inset:0;z-index:110}
.mm-help[hidden]{display:none}
.mm-help__scrim{position:absolute;inset:0;width:100%;border:0;background:rgba(12,10,30,.45)}
.mm-help__panel{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:20px 20px 0 0;padding:20px 20px calc(20px + env(safe-area-inset-bottom));max-width:440px;margin-inline:auto;outline:none}
@media(min-width:640px){
.mm-help__panel{bottom:24px;right:24px;left:auto;border-radius:20px;box-shadow:var(--sh-lg)}
}
.mm-help__head{display:flex;justify-content:space-between;gap:12px}
.mm-help__head h2{font-size:18px;margin:0}
.mm-help__head p{margin:2px 0 0;font-size:12.5px;color:var(--mute)}
.mm-help__head button{border:0;background:none;color:var(--mute);align-self:flex-start;display:flex;padding:4px}
.mm-help__form{display:grid;gap:10px;margin-top:14px}
.mm-help__form textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px 14px;font:inherit;font-size:14px;outline:none}
.mm-help__form input{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px 14px;font:inherit;font-size:14px;outline:none}
.mm-help__form textarea:focus{border-color:var(--pri)}
.mm-help__form input:focus{border-color:var(--pri)}
.mm-help__send{border:0;border-radius:10px;background:var(--pri);color:#fff;font-weight:700;min-height:46px}
.mm-help__row{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);border-radius:10px;padding:11px 14px;font-size:14px;font-weight:600;color:var(--ink);text-decoration:none!important}
.mm-help__row:hover{border-color:var(--pri);background:var(--soft)}
.mm-help__row .mm-ico{color:var(--pri)}
.mm-help__ok{background:var(--green-bg);color:#166534;border-radius:10px;padding:12px 14px;font-size:14px;margin:14px 0 10px}
.mm-help__done{display:grid;gap:10px}
.mm-marquee{overflow:hidden;border-top:1px solid var(--line);padding:18px 0}
.mm-marquee__word{font-family:var(--display);font-weight:800;letter-spacing:-.02em;white-space:nowrap;font-size:clamp(28px,5vw,56px)}
.mm-footer__copy{font-size:13px}
.mm-footer__minrow a{color:var(--mute)}
.mm-footer__minrow a:hover{color:var(--pri)}
@media(min-width:1024px){
.mm-footer__legalrow{padding-right:84px}
.mm-footer__minrow{padding-right:84px}
}
.mm-footer__eyebrow{font-weight:700;letter-spacing:.12em;text-transform:uppercase;margin-bottom:10px;font-size:12px;color:var(--mute)}
.mm-fcol__btn h4{margin:0;font-family:var(--font);letter-spacing:.12em;text-transform:uppercase;font-size:12px;color:var(--mute)}
.mm-fcol__static{margin:0;font-family:var(--font);letter-spacing:.12em;text-transform:uppercase;font-size:12px;color:var(--mute)}
.mm-newsform p{color:var(--mute);margin:8px 0 0 6px;font-size:12.5px}

/* ---- Mobile bottom navigation (phones and tablets; the header drops its cart there) ---- */
.tcc-bnav { display: none; }
@media (max-width: 1023px) {
	:root { --bnav-h: 62px; }
	.mm-header .mm-header__cart { display: none !important; }
	body.has-bnav { padding-bottom: calc(var(--bnav-h) + env(safe-area-inset-bottom, 0px)); }
	.tcc-bnav { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 88; height: calc(var(--bnav-h) + env(safe-area-inset-bottom, 0px)); padding-bottom: env(safe-area-inset-bottom, 0px); background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -6px 18px rgba(53, 30, 99, .08); }
	.tcc-bnav a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; color: var(--mute); text-decoration: none !important; font-size: 11px; font-weight: 600; -webkit-tap-highlight-color: transparent; }
	.tcc-bnav a.is-active { color: var(--pri); }
	.tcc-bnav__ico { position: relative; display: grid; place-items: center; width: 28px; height: 28px; }
	.tcc-bnav__ico .mm-ico { width: 23px; height: 23px; }
	.tcc-bnav .mm-dot { top: -4px; right: -8px; }
	/* Everything that used to sit at the bottom edge moves above the bar. */
	.has-bnav .chat-fab { bottom: calc(var(--bnav-h) + 14px + env(safe-area-inset-bottom, 0px)); }
	.has-bnav .mm-toasts { bottom: calc(var(--bnav-h) + 16px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 767px) {
	.has-bnav .mm-mbar { bottom: calc(var(--bnav-h) + env(safe-area-inset-bottom, 0px)); padding-bottom: 10px; }
	.has-bnav.mm-is-product .chat-fab { bottom: calc(var(--bnav-h) + 78px + env(safe-area-inset-bottom, 0px)); }
	.has-bnav .mm-pdp { padding-bottom: 60px; }
}