/* Mostrador · estilos públicos. Usa las variables del tema Torta & Receta, con valores por defecto. */
:where(:root) {
	--tyr-ink: #241418; --tyr-mora: #4a1426; --tyr-accent: #a8324f; --tyr-accent-ink: #8c2440; --tyr-gold: #8f6b26;
	--tyr-bg: #fbf7f0; --tyr-surface: #f3eadb; --tyr-surface-2: #fffdf8; --tyr-line: #e7dac4; --tyr-muted: #6b5a5e; --tyr-wa: #1d7a4b; --tyr-gold-soft: #c9a75e;
	--tyr-font-display: "Lora", Georgia, serif; --tyr-font-body: "Figtree", system-ui, sans-serif;
}
.mst { color: var(--tyr-ink); font-family: var(--tyr-font-body); }
.mst-wrap { width: min(100% - 2.5rem, 1200px); margin-inline: auto; }
.mst-muted { color: var(--tyr-muted); font-size: .9rem; }
.mst-center { text-align: center; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }

/* Botones */
.mst-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 46px; padding: .6rem 1.25rem; border: 1.5px solid transparent; border-radius: 999px; font: 600 .98rem/1.1 var(--tyr-font-body); text-decoration: none; cursor: pointer; transition: background-color .15s, color .15s; }
.mst-btn--primary { background: var(--tyr-mora); color: #fff; }
.mst-btn--primary:hover { background: var(--tyr-accent-ink); color: #fff; }
.mst-btn--primary:disabled { opacity: .5; cursor: not-allowed; }
.mst-btn--ghost { border-color: var(--tyr-mora); color: var(--tyr-mora); background: transparent; }
.mst-btn--ghost:hover { background: var(--tyr-mora); color: #fff; }
.mst-btn--wa { background: var(--tyr-wa); color: #fff; }
.mst-btn--block { width: 100%; }
.mst-btn--sm { min-height: 36px; padding: .35rem .8rem; font-size: .85rem; }
.mst-link { background: none; border: 0; padding: 0; color: var(--tyr-accent-ink); font: inherit; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.mst :focus-visible { outline: 3px solid var(--tyr-accent); outline-offset: 2px; }

.mst-notice { padding: .9rem 1.1rem; border-radius: 12px; background: var(--tyr-surface); margin: 0 0 1rem; }
.mst-notice--ok { background: #e6f4ec; color: #134e2f; }
.mst-notice--err { background: #f7e9ea; color: #7a1d36; }
.mst-empty { padding: 2.25rem; border-radius: 18px; background: var(--tyr-surface-2); box-shadow: inset 0 0 0 1px var(--tyr-line); max-width: 44rem; }
.mst-empty p { margin: 0 0 .6rem; }

/* Tienda */
.mst-shop__head { padding: 3rem 0 2rem; }
.mst-shop__title { margin: 0; font: 600 clamp(2.2rem, 5vw, 3.4rem)/1.05 var(--tyr-font-display); color: var(--tyr-mora); }
.mst-shop__intro { max-width: 60ch; margin: .75rem 0 0; color: var(--tyr-muted); font-size: 1.08rem; }
.mst-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.mst-chip { padding: .4rem .95rem; border-radius: 999px; background: var(--tyr-surface); color: var(--tyr-mora); font-weight: 600; font-size: .9rem; text-decoration: none; }
.mst-chip:hover, .mst-chip.is-active { background: var(--tyr-mora); color: #fff; }
.mst-grid { display: grid; grid-template-columns: repeat(var(--mst-cols, 4), minmax(0, 1fr)); gap: 2.25rem 1.5rem; }
.mst-card-product { display: flex; flex-direction: column; gap: .45rem; }
.mst-card-product__media { position: relative; display: block; aspect-ratio: 1; border-radius: 16px; overflow: hidden; background: var(--tyr-surface); margin-bottom: .4rem; }
.mst-card-product__media img { width: 100%; height: 100%; object-fit: cover; }
.mst-card-product__ph { display: block; width: 100%; height: 100%; min-height: 200px; background: radial-gradient(circle at 12px 12px, #e9dcc6 2px, transparent 2.5px) 0 0 / 18px 18px, var(--tyr-surface); }
.mst-badge { position: absolute; top: .75rem; left: .75rem; padding: .2rem .65rem; border-radius: 999px; background: var(--tyr-mora); color: #f5ebdd; box-shadow: inset 0 0 0 1px var(--tyr-gold-soft); font-size: .78rem; font-weight: 700; }
.mst-card-product__cat { align-self: flex-start; color: var(--tyr-accent-ink); font-size: .85rem; font-weight: 600; text-decoration: none; }
.mst-card-product__title { margin: 0; font: 600 1.15rem/1.3 var(--tyr-font-display); color: var(--tyr-mora); }
.mst-card-product__title a { color: inherit; text-decoration: none; }
.mst-card-product__note { margin: 0; color: var(--tyr-muted); font-size: .85rem; }
.mst-card-product .mst-add { margin-top: auto; padding-top: .5rem; }
.mst-price { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: .35rem; }
.mst-price del { color: var(--tyr-muted); font-size: .9em; }
.mst-price__now { font-weight: 700; color: var(--tyr-mora); }
.mst-price__period { color: var(--tyr-muted); font-size: .9em; }
.mst-soldout { margin: 0; color: var(--tyr-muted); font-weight: 600; }
.mst-add { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.mst-qty input { width: 80px; min-height: 46px; padding: .4rem .6rem; border: 1.5px solid var(--tyr-line); border-radius: 12px; font: 600 1rem var(--tyr-font-body); text-align: center; background: #fff; }

/* Producto */
.mst-product__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 3.5rem; padding: 3rem 0 4rem; align-items: start; }
.mst-product__media { margin: 0; border-radius: 22px; overflow: hidden; background: var(--tyr-surface); aspect-ratio: 1; }
.mst-product__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mst-product__title { margin: .35rem 0 .75rem; font: 600 clamp(2rem, 4vw, 3rem)/1.08 var(--tyr-font-display); color: var(--tyr-mora); }
.mst-product__price { margin: 0 0 .25rem; font-size: 1.5rem; }
.mst-product__lede { font: 400 1.15rem/1.6 var(--tyr-font-display); color: var(--tyr-muted); margin: 1rem 0 1.5rem; }
.mst-facts { list-style: none; padding: 0; margin: 1.5rem 0; display: grid; gap: .4rem; }
.mst-facts li { padding-left: 1.4rem; position: relative; color: var(--tyr-muted); }
.mst-facts li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 50%; background: var(--tyr-accent); }
.mst-product__desc { font: 400 1.08rem/1.75 var(--tyr-font-display); border-top: 2px dotted var(--tyr-line); padding-top: 1.5rem; }

/* Carrito */
.mst-cart { max-width: 860px; }
.mst-cart__lines { list-style: none; margin: 0 0 1.5rem; padding: 0; }
.mst-cart__line { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto auto auto; align-items: center; gap: 1rem; padding: 1rem 0; border-bottom: 1px dashed var(--tyr-line); }
.mst-cart__img { display: block; width: 72px; height: 72px; border-radius: 12px; overflow: hidden; background: var(--tyr-surface); }
.mst-cart__img img { width: 100%; height: 100%; object-fit: cover; }
.mst-cart__info { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.mst-cart__name { font: 600 1.05rem var(--tyr-font-display); color: var(--tyr-mora); text-decoration: none; }
.mst-cart__qty input { width: 70px; }
.mst-cart__remove { width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--tyr-surface); color: var(--tyr-mora); font-size: 1.3rem; cursor: pointer; }
.mst-cart__remove:hover { background: var(--tyr-mora); color: #fff; }
.mst-cart__foot { display: grid; gap: .75rem; max-width: 380px; margin-left: auto; }
.mst-cart__foot .mst-link { text-align: center; }

/* Resumen */
.mst-summary { padding: 1.5rem; border-radius: 20px; background: var(--tyr-surface-2); box-shadow: inset 0 0 0 1px var(--tyr-line); align-self: start; position: sticky; top: 1.5rem; }
.mst-summary__title { margin: 0 0 1rem; font: 600 1.35rem var(--tyr-font-display); color: var(--tyr-mora); }
.mst-summary__lines { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .65rem; }
.mst-summary__lines li { display: flex; justify-content: space-between; gap: 1rem; }
.mst-summary__lines small { color: var(--tyr-muted); display: inline-block; margin-left: .15rem; }
.mst-summary__totals { display: grid; grid-template-columns: 1fr auto; gap: .45rem 1rem; margin: 0 0 1rem; padding-top: 1rem; border-top: 2px dotted var(--tyr-line); }
.mst-summary__totals dt, .mst-summary__totals dd { margin: 0; }
.mst-summary__totals dd { text-align: right; font-weight: 600; }
.mst-summary__total { font: 700 1.3rem var(--tyr-font-display) !important; color: var(--tyr-mora); padding-top: .4rem; }

/* Checkout */
.mst-checkout__grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 2.5rem; align-items: start; }
.mst-fieldset { margin: 0 0 1.25rem; padding: 1.5rem; border: 0; border-radius: 20px; background: var(--tyr-surface-2); box-shadow: inset 0 0 0 1px var(--tyr-line); }
.mst-fieldset legend { float: left; width: 100%; padding: 0; margin-bottom: 1rem; font: 600 1.25rem var(--tyr-font-display); color: var(--tyr-mora); }
.mst-fieldset legend + * { clear: both; }
.mst-field { display: grid; gap: .35rem; margin: 0 0 1rem; }
.mst-field label { font-weight: 600; font-size: .92rem; color: var(--tyr-mora); }
.mst-field small { color: var(--tyr-muted); }
.mst-field input, .mst-field select, .mst-field textarea, .mst-form-stack input { width: 100%; min-height: 48px; padding: .6rem .85rem; border: 1.5px solid var(--tyr-line); border-radius: 12px; background: #fff; font: 400 1rem var(--tyr-font-body); color: var(--tyr-ink); }
.mst-field input:focus, .mst-field select:focus, .mst-field textarea:focus { outline: none; border-color: var(--tyr-mora); box-shadow: 0 0 0 3px rgba(176, 138, 62, .4); }
.mst-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 1rem; }
.mst-choices, .mst-gateways { display: grid; gap: .6rem; margin-bottom: 1rem; }
.mst-choices { grid-template-columns: 1fr 1fr; }
.mst-choice, .mst-gateway { display: flex; align-items: flex-start; gap: .75rem; padding: .9rem 1rem; border-radius: 14px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--tyr-line); cursor: pointer; }
.mst-choice:has(input:checked), .mst-gateway:has(input:checked) { box-shadow: inset 0 0 0 2px var(--tyr-mora); background: #fdf8f0; }
.mst-choice input, .mst-gateway input { margin-top: .25rem; accent-color: var(--tyr-mora); width: 18px; height: 18px; }
.mst-choice span, .mst-gateway span { display: grid; gap: .15rem; }
.mst-choice small, .mst-gateway small { color: var(--tyr-muted); }
.mst-gateway[hidden] { display: none; }
.mst-address[hidden] { display: none; }
.mst-legal { padding: 0 .25rem; }
.mst-check label { display: flex; gap: .6rem; align-items: flex-start; line-height: 1.5; font-size: .95rem; }
.mst-check input { margin-top: .3rem; width: 18px; height: 18px; accent-color: var(--tyr-mora); flex: none; }

/* Pedido */
.mst-order__head { margin-bottom: 1.5rem; }
.mst-order__head .mst-muted { margin: 0; }
.mst-order__status { margin: .25rem 0 .75rem; font: 600 clamp(1.8rem, 4vw, 2.6rem)/1.1 var(--tyr-font-display); color: var(--tyr-mora); }
.mst-status--pagado, .mst-status--preparacion, .mst-status--enviado, .mst-status--completado { color: #17663d; }
.mst-order__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 2rem; align-items: start; }
.mst-card { padding: 1.5rem; border-radius: 20px; background: var(--tyr-surface-2); box-shadow: inset 0 0 0 1px var(--tyr-line); margin-bottom: 1.25rem; }
.mst-card--ok { box-shadow: inset 0 0 0 2px #9fd3b5; }
.mst-card h3 { margin: 0 0 .75rem; font: 600 1.25rem var(--tyr-font-display); color: var(--tyr-mora); }
.mst-tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.25rem; }
.mst-tab { padding: .45rem .95rem; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--tyr-line); color: var(--tyr-mora); font-weight: 600; text-decoration: none; font-size: .92rem; }
.mst-tab.is-active { background: var(--tyr-mora); color: #fff; box-shadow: none; }
.mst-paybox p { margin: 0 0 1rem; }
.mst-instructions { padding: 1rem 1.15rem; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px var(--tyr-line); margin-bottom: 1rem; white-space: normal; }
.mst-inline-form { display: inline; }

/* Mi cuenta */
.mst-account__guest { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.mst-account__guest input[type="text"], .mst-account__guest input[type="password"], .mst-account__guest input[type="email"] { width: 100%; min-height: 46px; padding: .55rem .8rem; border: 1.5px solid var(--tyr-line); border-radius: 12px; }
.mst-account__guest .button, .mst-account__guest input[type="submit"] { min-height: 46px; padding: .55rem 1.2rem; border: 0; border-radius: 999px; background: var(--tyr-mora); color: #fff; font-weight: 600; cursor: pointer; }
.mst-table-wrap { overflow-x: auto; }
.mst-table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.mst-table th { text-align: left; font-weight: 600; color: var(--tyr-muted); padding: .5rem; border-bottom: 2px dotted var(--tyr-line); }
.mst-table td { padding: .7rem .5rem; border-bottom: 1px dashed var(--tyr-line); }
.mst-table__actions { white-space: nowrap; }
.mst-pagination { margin-top: 3rem; }

@media (max-width: 960px) {
	.mst-grid { --mst-cols: 2 !important; }
	.mst-product__grid, .mst-checkout__grid, .mst-order__grid { grid-template-columns: 1fr; gap: 1.5rem; }
	.mst-summary { position: static; }
	.mst-account__guest { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.mst-row, .mst-choices { grid-template-columns: 1fr; }
	.mst-grid { gap: 1.75rem 1rem; }
	.mst-cart__line { grid-template-columns: 56px minmax(0, 1fr) auto; }
	.mst-cart__img { width: 56px; height: 56px; }
	.mst-cart__sub { grid-column: 2; }
	.mst-fieldset { padding: 1.15rem; }
}
