/* Tienda de Clínica Mirador. Prefijo ti- (no toca las clases mr- de la app) */
.ti-ph{display:flex;align-items:center;justify-content:center;width:100%;aspect-ratio:1;background:linear-gradient(160deg,var(--mi),var(--sa));border-radius:16px;flex:none}
.ti-ph svg{width:78%;height:78%}
.ti-hd{display:flex;justify-content:space-between;align-items:flex-end;gap:10px}
.ti-cartb{position:relative;width:46px;height:46px;border-radius:50%;background:var(--pt);color:#fff;display:flex;align-items:center;justify-content:center;flex:none}
.ti-cartb svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ti-cartb i,.ti-dot{font:700 12px/1 system-ui;font-style:normal;background:var(--cr);color:#fff;border-radius:99px;min-width:18px;height:18px;display:flex;align-items:center;justify-content:center;padding:0 5px}
.ti-cartb i{position:absolute;top:-3px;right:-3px}
.mr-pb button{position:relative}.ti-dot{position:absolute;top:0;right:8px}.ti-dot[hidden]{display:none}
.ti-lead{color:var(--mu);margin-top:4px}
.ti-rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -18px;padding:0 18px 6px;scrollbar-width:none}.ti-rail::-webkit-scrollbar{display:none}
.ti-rc{flex:none;width:272px;scroll-snap-align:start;display:flex;gap:12px;align-items:center;text-align:left;background:var(--w);border:1px solid var(--ln);border-radius:18px;padding:10px;transition:transform .15s}
.ti-rc:active{transform:scale(.98)}.ti-rc .ti-ph{width:64px;height:64px;border-radius:12px}
.ti-rc span:last-child{display:block;min-width:0}.ti-rc small{display:block;color:var(--cr);font-weight:700;font-size:12px}.ti-rc b{display:block;line-height:1.2;margin:2px 0}.ti-rc em{font-style:normal;color:var(--mu);font-size:12px}
.ti-chs{margin:16px 0 12px;overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.ti-chs::-webkit-scrollbar{display:none}
.ti-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.ti-c{display:flex;flex-direction:column;gap:6px;text-align:left;background:var(--w);border:1px solid var(--ln);border-radius:18px;padding:8px 8px 12px;transition:transform .15s,box-shadow .2s}
.ti-c:hover{box-shadow:0 8px 22px rgba(9,63,67,.12)}.ti-c:active{transform:scale(.98)}
.ti-c b{line-height:1.2;padding:0 4px;font-size:13.5px}.ti-pr{font:700 17px var(--sf);padding:0 4px}.ti-c .mr-tag{align-self:flex-start;margin-left:4px}
.ti-by{font-size:12px;color:var(--cr);font-weight:700;padding:0 4px}
.ti-fh{margin:6px 40px 12px 0;max-width:230px}.ti-fh .ti-ph{border-radius:20px}
.ti-why{background:var(--mi);border-radius:14px;padding:11px 13px;margin-top:12px;color:var(--pt2)}.ti-why b{display:block}
.ti-note{color:var(--mu);font-size:13px;margin-top:10px}
.ti-ln{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--ln)}
.ti-ln .ti-ph{width:52px;height:52px;border-radius:12px}.ti-ln>span:nth-child(2){flex:1;min-width:0}.ti-ln small{display:block;color:var(--mu)}
.ti-q{display:inline-flex;align-items:center;gap:6px}
.ti-q button{width:32px;height:32px;border-radius:50%;border:1px solid var(--ln);background:var(--w);font-weight:700;font-size:16px;line-height:1}.ti-q button:disabled{opacity:.35}
.ti-q b{min-width:20px;text-align:center}
.ti-opt{display:grid;grid-template-columns:1fr 1fr;gap:8px}.ti-pay{grid-template-columns:1fr}
.ti-opt button{text-align:left;background:var(--w);border:1.5px solid var(--ln);border-radius:14px;padding:11px 12px}.ti-opt button.on{border-color:var(--pt);background:var(--mi)}
.ti-opt small{display:block;color:var(--mu);font-size:12px}
.ti-ck{display:flex;gap:10px;align-items:flex-start;margin-top:12px;background:var(--w);border:1px solid var(--ln);border-radius:14px;padding:11px 12px}
.ti-ck input{width:20px;height:20px;accent-color:var(--pt);flex:none;margin-top:2px}.ti-ck small{display:block;color:var(--mu);font-size:12.5px}
/* recepción */
.ti-cols{display:grid;grid-template-columns:1.25fr 1fr;gap:14px;align-items:start}
.ti-or{align-items:flex-start;gap:12px}.ti-oa{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex:none}
.ti-st{align-items:center;gap:10px}.ti-st>div{flex:1;min-width:0}.ti-st .ti-ph{width:40px;height:40px;border-radius:10px}.ti-st small{display:block;color:var(--mu)}
.mr-rw .ti-q .mr-tag{margin-right:4px}
@media(max-width:1180px){.ti-cols{grid-template-columns:1fr}}
@media(max-width:900px){.mr-pane[data-s=tienda] .mr-stats{grid-template-columns:repeat(2,1fr)}}
.ti-tot .mr-tot b,.mr-sheet .mr-tot b{font:700 16px system-ui}.mr-sheet .mr-tot:last-of-type b{font:700 20px var(--sf)}
