/*
 * Premium UX round 3 (inc/80-premium.php): PDP delivery block (its layout rules are inline in <head>, see
 * mm_pr_pdp_inline_css()), recently viewed, order received page (.mm-ty2), 404 (.mm-404).
 * Tokens: docs/DESIGN-MM.md (sharp corners, ink / paper / sand, deep rose for status only, 4–96 spacing scale).
 */

/* ── PDP delivery block: states and press feedback ───────────────────────────── */
.mm-dlv__pin input:focus-visible { outline: 2px solid var(--mm-focus, #111); outline-offset: 2px; position: relative; z-index: 1; }
.mm-dlv__pin input[aria-invalid="true"] { border-color: var(--mm-rose, #a62b43); }
.mm-dlv .mm-dlv__pin button,
.mm-dlv__shbtn { transition: transform var(--mm-press, 120ms) var(--mm-ease-out, ease-out), background-color var(--mm-press, 120ms) var(--mm-ease-out, ease-out), border-color var(--mm-press, 120ms); }
.mm-dlv .mm-dlv__pin button:active,
.mm-dlv__shbtn:active { transform: translateY(1px) scale(.98); }
.mm-dlv__pin button[aria-busy="true"] { opacity: .6; cursor: progress; }
.mm-dlv__shbtn:hover { border-color: var(--mm-ink, #111); }
.mm-dlv__res { color: var(--mm-ink-2, #5f5f5f); }
.mm-dlv__res.is-cod { color: var(--mm-ink, #111); font-weight: 500; }
.mm-dlv__res.is-cod::before { content: ""; display: inline-block; width: 8px; height: 8px; margin: 0 8px 1px 0; background: #1f7a4d; vertical-align: middle; }
.mm-dlv__res.is-prepaid { color: var(--mm-ink, #111); }
.mm-dlv__res.is-none,
.mm-dlv__res.is-bad { color: var(--mm-rose, #a62b43); }
.mm-dlv__res small { display: block; margin-top: 2px; color: var(--mm-ink-2, #5f5f5f); font-size: var(--mm-t-small, 12px); font-weight: 400; }

/* ── Recently viewed ────────────────────────────────────────────────────────── */
.mm-seen[hidden] { display: none !important; }
.mm-seen { animation: mm-pr-in var(--mm-fade, 200ms) var(--mm-ease-out, ease-out) both; }
@keyframes mm-pr-in { from { opacity: 0; } to { opacity: 1; } }

/* ── Order received (.mm-ty2) ───────────────────────────────────────────────── */
.mm-ty2 { max-width: 680px; margin: 0 auto; padding: var(--mm-s-7, 48px) var(--mm-gutter, 16px) var(--mm-s-8, 64px); font-family: var(--mm-font); color: var(--mm-ink, #111); }
.mm-ty2__hero { text-align: center; padding: 0 0 var(--mm-s-6, 32px); }
.mm-ty2__mark { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; margin: 0 0 var(--mm-s-5, 24px); background: var(--mm-ink, #111); color: var(--mm-paper, #fff); animation: mm-ty2-pop 360ms var(--mm-ease-out, ease-out) both; }
.mm-ty2__mark--bad { background: var(--mm-rose, #a62b43); }
@keyframes mm-ty2-pop { from { transform: scale(.6); opacity: 0; } to { transform: none; opacity: 1; } }
.mm-ty2__title { margin: 0 0 var(--mm-s-2, 8px); font: 500 var(--mm-t-page, 28px)/1.1 var(--mm-font); letter-spacing: var(--mm-tight, -.02em); color: var(--mm-ink, #111); }
.mm-ty2__sub { max-width: 30em; margin: 0 auto; font-size: var(--mm-t-body, 15px); line-height: 1.5; color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__num { display: inline-grid; grid-template-columns: auto auto; grid-template-areas: "l l" "r c"; align-items: center; column-gap: var(--mm-s-3, 12px); margin: var(--mm-s-5, 24px) 0 0; padding: var(--mm-s-3, 12px) var(--mm-s-4, 16px); background: var(--mm-sand, #f4f1ec); text-align: left; }
.mm-ty2__label { grid-area: l; font: 500 var(--mm-t-label, 11px)/1.4 var(--mm-font); letter-spacing: var(--mm-track, .1em); text-transform: uppercase; color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__ref { grid-area: r; font: 600 22px/1.2 var(--mm-font); letter-spacing: .01em; white-space: nowrap; }
.mm-ty2__copy { grid-area: c; min-height: 44px; min-width: 44px; padding: 0 var(--mm-s-3, 12px); border: 1px solid var(--mm-ink, #111); border-radius: 0; background: transparent; color: var(--mm-ink, #111); font: 600 var(--mm-t-label, 11px)/1 var(--mm-font); letter-spacing: var(--mm-track, .1em); text-transform: uppercase; cursor: pointer; transition: transform var(--mm-press, 120ms) var(--mm-ease-out, ease-out); }
.mm-ty2__copy:active { transform: translateY(1px) scale(.97); }
.mm-ty2__copy.is-done { background: var(--mm-ink, #111); color: var(--mm-paper, #fff); }
.mm-ty2__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 var(--mm-s-6, 32px); border-top: 1px solid var(--mm-hair, #e4e0da); border-bottom: 1px solid var(--mm-hair, #e4e0da); }
.mm-ty2__facts > div { padding: var(--mm-s-4, 16px) var(--mm-s-2, 8px); text-align: center; }
.mm-ty2__facts > div + div { border-left: 1px solid var(--mm-hair, #e4e0da); }
.mm-ty2__facts dt { margin: 0 0 4px; font: 500 var(--mm-t-label, 11px)/1.3 var(--mm-font); letter-spacing: var(--mm-track, .1em); text-transform: uppercase; color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__facts dd { margin: 0; font: 500 var(--mm-t-meta, 13px)/1.35 var(--mm-font); color: var(--mm-ink, #111); }
@media (min-width: 768px) { .mm-ty2__facts dd { font-size: var(--mm-t-ui, 14px); } }
.mm-ty2__sec { margin: 0 0 var(--mm-s-6, 32px); }
.mm-ty2__h { margin: 0 0 var(--mm-s-4, 16px); font: 500 var(--mm-t-label, 11px)/1.3 var(--mm-font); letter-spacing: var(--mm-track, .1em); text-transform: uppercase; color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__tl { list-style: none; margin: 0; padding: 0; }
.mm-ty2__step { position: relative; display: grid; grid-template-columns: 24px 1fr; column-gap: var(--mm-s-3, 12px); padding: 0 0 var(--mm-s-4, 16px); }
.mm-ty2__step::before { content: ""; position: absolute; left: 5px; top: 14px; bottom: -2px; width: 2px; background: var(--mm-hair, #e4e0da); }
.mm-ty2__step:last-child { padding-bottom: 0; }
.mm-ty2__step:last-child::before { display: none; }
.mm-ty2__step.is-done::before { background: var(--mm-ink, #111); }
.mm-ty2__dot { grid-row: 1 / span 2; width: 12px; height: 12px; margin-top: 4px; border: 2px solid var(--mm-hair, #e4e0da); background: var(--mm-paper, #fff); position: relative; z-index: 1; }
.mm-ty2__step.is-done .mm-ty2__dot { border-color: var(--mm-ink, #111); background: var(--mm-ink, #111); }
.mm-ty2__step.is-current .mm-ty2__dot { border-color: var(--mm-ink, #111); background: var(--mm-paper, #fff); box-shadow: 0 0 0 4px var(--mm-sand, #f4f1ec); }
.mm-ty2__step-t { font: 400 var(--mm-t-ui, 14px)/1.4 var(--mm-font); color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__step.is-done .mm-ty2__step-t, .mm-ty2__step.is-current .mm-ty2__step-t { color: var(--mm-ink, #111); }
.mm-ty2__step.is-current .mm-ty2__step-t { font-weight: 600; }
.mm-ty2__step-d { grid-column: 2; font-size: var(--mm-t-meta, 13px); color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__items { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--mm-hair, #e4e0da); }
.mm-ty2__item { display: grid; grid-template-columns: 64px 1fr auto; gap: var(--mm-s-3, 12px); align-items: start; padding: var(--mm-s-4, 16px) 0; border-bottom: 1px solid var(--mm-hair, #e4e0da); }
.mm-ty2__thumb { display: block; width: 64px; aspect-ratio: 3 / 4; overflow: hidden; background: var(--mm-sand, #f4f1ec); }
.mm-ty2__thumb img { display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; }
.mm-ty2__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.mm-ty2__name { font: 500 var(--mm-t-name, 13px)/1.35 var(--mm-font); color: var(--mm-ink, #111); }
.mm-ty2__meta, .mm-ty2__meta p, .mm-ty2__meta ul, .mm-ty2__meta li { margin: 0; padding: 0; list-style: none; display: inline; font-size: var(--mm-t-small, 12px); color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__meta strong { font-weight: 500; }
.mm-ty2__price { font: 500 var(--mm-t-price, 14px)/1.35 var(--mm-font); white-space: nowrap; font-variant-numeric: tabular-nums; }
.mm-ty2__totals { width: 100%; margin: var(--mm-s-3, 12px) 0 0; border-collapse: collapse; font-size: var(--mm-t-meta, 13px); }
.mm-ty2__totals th, .mm-ty2__totals td { padding: 6px 0; border: 0; background: none; text-align: left; font-weight: 400; color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__totals td { text-align: right; color: var(--mm-ink, #111); font-variant-numeric: tabular-nums; }
.mm-ty2__trow--order_total th, .mm-ty2__trow--order_total td { padding-top: var(--mm-s-3, 12px); border-top: 1px solid var(--mm-hair, #e4e0da); font: 600 var(--mm-t-price, 14px)/1.3 var(--mm-font); color: var(--mm-ink, #111); }
.mm-ty2__addr { margin: 0; padding: var(--mm-s-4, 16px); background: var(--mm-sand, #f4f1ec); font-style: normal; font-size: var(--mm-t-meta, 13px); line-height: 1.6; color: var(--mm-ink, #111); }
.mm-ty2__ctas { display: grid; gap: var(--mm-s-3, 12px); margin: 0 0 var(--mm-s-5, 24px); }
.mm-ty2__ctas .mm-c-btn { display: flex; align-items: center; justify-content: center; width: 100%; min-height: var(--mm-control-h, 52px); text-decoration: none; text-transform: uppercase; letter-spacing: var(--mm-track, .1em); }
.mm-ty2__act { margin: 0 0 var(--mm-s-3, 12px); text-align: center; }
.mm-ty2__actlink, .mm-ty2__help a { display: inline-flex; align-items: center; min-height: 44px; color: var(--mm-ink, #111); text-decoration: underline; text-underline-offset: 3px; font-size: var(--mm-t-meta, 13px); }
.mm-ty2__help { margin: 0; text-align: center; font-size: var(--mm-t-meta, 13px); color: var(--mm-ink-2, #5f5f5f); }
.mm-ty2__gw:empty { display: none; }
.mm-ty2__gw { margin: var(--mm-s-5, 24px) 0 0; font-size: var(--mm-t-meta, 13px); color: var(--mm-ink-2, #5f5f5f); text-align: center; }
.mm-ty2__gw p { margin: 0; }
@media (min-width: 768px) {
	.mm-ty2 { padding-top: var(--mm-s-8, 64px); }
	.mm-ty2__ctas { grid-template-columns: 1fr 1fr; }
	.mm-ty2__item { grid-template-columns: 72px 1fr auto; }
	.mm-ty2__thumb { width: 72px; }
}
@media (max-width: 380px) {
	.mm-ty2__facts { grid-template-columns: 1fr; }
	.mm-ty2__facts > div { display: flex; justify-content: space-between; align-items: baseline; gap: var(--mm-s-3, 12px); padding: var(--mm-s-3, 12px) 0; text-align: left; }
	.mm-ty2__facts > div + div { border-left: 0; border-top: 1px solid var(--mm-hair, #e4e0da); }
	.mm-ty2__facts dt { margin: 0; }
}

/* ── 404 ────────────────────────────────────────────────────────────────────── */
.mm-404 { max-width: var(--mm-container, 1440px); margin: 0 auto; padding: var(--mm-s-7, 48px) 0 var(--mm-s-8, 64px); font-family: var(--mm-font); color: var(--mm-ink, #111); }
.mm-404__head { max-width: 560px; margin: 0 auto var(--mm-s-6, 32px); padding: 0 var(--mm-gutter, 16px); text-align: center; }
.mm-404__code { margin: 0 0 var(--mm-s-3, 12px); font: 500 var(--mm-t-label, 11px)/1 var(--mm-font); letter-spacing: .3em; color: var(--mm-ink-2, #5f5f5f); }
.mm-404__title { margin: 0 0 var(--mm-s-3, 12px); font: 500 var(--mm-t-page, 28px)/1.1 var(--mm-font); letter-spacing: var(--mm-tight, -.02em); }
.mm-404__sub { margin: 0 0 var(--mm-s-5, 24px); font-size: var(--mm-t-body, 15px); line-height: 1.5; color: var(--mm-ink-2, #5f5f5f); }
.mm-404__search { display: flex; max-width: 480px; margin: 0 auto; }
.mm-404__search input[type="search"] { flex: 1 1 auto; min-width: 0; height: var(--mm-control-h, 52px); margin: 0; padding: 0 var(--mm-s-4, 16px); border: 1px solid var(--mm-ink, #111); border-right: 0; border-radius: 0; background: var(--mm-paper, #fff); font: 400 16px/1 var(--mm-font); color: var(--mm-ink, #111); }
.mm-404__search input[type="search"]:focus-visible { outline: 2px solid var(--mm-focus, #111); outline-offset: 2px; }
.mm-404__search .mm-c-btn { flex: none; min-height: var(--mm-control-h, 52px); padding: 0 var(--mm-s-5, 24px); }
.mm-404__cats { margin: 0 0 var(--mm-s-6, 32px); }
.mm-404__new { margin: 0 0 var(--mm-s-6, 32px); padding: 0 var(--mm-gutter, 16px); }
.mm-404__newhead { display: flex; align-items: baseline; justify-content: space-between; gap: var(--mm-s-4, 16px); margin: 0 0 var(--mm-s-4, 16px); }
.mm-404__newhead .mm-rail__title { margin: 0; }
.mm-404__more { display: inline-flex; align-items: center; min-height: 44px; color: var(--mm-ink, #111); font-size: var(--mm-t-meta, 13px); text-decoration: underline; text-underline-offset: 3px; }
.mm-404__grid { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--mm-s-5, 24px) var(--mm-tile-gap, 12px); margin: 0 !important; padding: 0; list-style: none; }
.mm-404__grid > * { width: auto !important; max-width: none !important; margin: 0 !important; }
.mm-404__home { margin: 0; text-align: center; }
.mm-404__home .mm-c-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 var(--mm-s-5, 24px); text-decoration: none; }
@media (min-width: 1024px) {
	.mm-404 { padding-top: var(--mm-s-8, 64px); }
	.mm-404__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.mm-404__cats .mm-circs__list { justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.mm-seen, .mm-ty2__mark { animation: none; }
	.mm-dlv__pin button:active, .mm-dlv__shbtn:active, .mm-ty2__copy:active { transform: none; }
}