.mc-qv { position: fixed; inset: 0; z-index: 1100; display: grid; place-items: center; padding: 1rem; }
.mc-qv__backdrop { position: absolute; inset: 0; background: rgb(15 23 42 / var(--mc-qv-overlay, .68)); backdrop-filter: blur(5px); animation: mc-qv-fade .18s ease; }
.mc-qv__panel { position: relative; width: min(var(--mc-qv-width, 760px), 100%); max-height: min(var(--mc-qv-max-height, 86vh), calc(100vh - 2rem)); overflow: auto; color: var(--mc-qv-text); background: var(--mc-qv-bg); border: 1px solid rgb(255 255 255 / .55); border-radius: var(--mc-qv-radius); box-shadow: 0 1.5rem 5rem rgb(15 23 42 / .3); animation: mc-qv-rise .22s ease; }
.mc-qv.is-glass .mc-qv__panel { background: rgb(255 255 255 / .88); backdrop-filter: blur(18px) saturate(145%); }
.mc-qv__close { position: absolute; z-index: 2; inset-block-start: .7rem; inset-inline-end: .7rem; display: grid; width: 2.4rem; height: 2.4rem; padding: 0; place-items: center; font-size: 1.7rem; line-height: 1; color: var(--mc-qv-text); background: rgb(255 255 255 / .88); border: 1px solid rgb(15 23 42 / .16); border-radius: 50%; cursor: pointer; }
.mc-qv__content { display: grid; grid-template-columns: var(--mc-qv-image-width, 44%) minmax(0, 1fr); min-height: 22rem; }
.mc-qv__media { display: grid; min-height: 22rem; padding: 1.5rem; place-items: center; background: var(--mc-qv-image-bg); }
.mc-qv__media img { display: block; width: 100%; height: 100%; max-height: calc(var(--mc-qv-max-height, 86vh) - 3rem); object-fit: contain; }
.mc-qv__info { display: flex; min-width: 0; flex-direction: column; justify-content: center; padding: var(--mc-qv-padding); }
.mc-qv__info h2 { margin: 0 0 .8rem; font-size: var(--mc-qv-title-size); line-height: 1.55; }
.mc-qv__price-row { display: flex; flex-wrap: wrap; gap: .55rem; align-items: center; margin-bottom: .65rem; }
.mc-qv__price { display: flex; flex-wrap: wrap; gap: .45rem; align-items: baseline; font-size: var(--mc-qv-price-size); font-weight: 800; color: var(--mc-qv-regular); }
.mc-qv__price del { color: var(--mc-qv-regular); font-size: .82em; font-weight: 500; opacity: 1; text-decoration-color: currentColor; }
.mc-qv__price ins { color: var(--mc-qv-sale); font-size: 1em; font-weight: 900; text-decoration: none; }
.mc-qv__discount { padding: .2rem .55rem; color: var(--mc-qv-sale); font-size: .78rem; font-weight: 800; background: color-mix(in srgb, var(--mc-qv-sale) 10%, transparent); border-radius: 999px; }
.mc-qv__stock { margin: .15rem 0 .8rem; font-weight: 700; }
.mc-qv__description { max-height: 9rem; overflow: auto; font-size: var(--mc-qv-description-size); line-height: 1.9; opacity: .8; }
.mc-qv__description p { margin: .4rem 0; }
.mc-qv__buttons { display: flex; flex-wrap: nowrap; gap: .7rem; width: 100%; margin-top: 1.25rem; }
.mc-qv__buy, .mc-qv__details { display: inline-flex; min-width: 0; min-height: 3rem; flex: 1 1 0; padding: .65rem .75rem; align-items: center; justify-content: center; font-size: var(--mc-qv-button-size); font-weight: 800; line-height: 1.5; text-align: center; text-decoration: none; border: 2px solid var(--mc-qv-accent); border-radius: var(--mc-qv-button-radius); box-shadow: 0 .45rem 1rem color-mix(in srgb, var(--mc-qv-accent) 18%, transparent); transition: transform .16s ease, box-shadow .16s ease; }
.mc-qv__buy { color: var(--mc-qv-button-text); background: var(--mc-qv-accent); }
.mc-qv__details { color: var(--mc-qv-accent); background: transparent; }
.mc-qv__buy:hover, .mc-qv__details:hover { transform: translateY(-1px); box-shadow: 0 .6rem 1.25rem color-mix(in srgb, var(--mc-qv-accent) 25%, transparent); text-decoration: none; }
.mc-qv__loading, .mc-qv__error { grid-column: 1/-1; margin: auto; padding: 5rem 2rem; text-align: center; }
.mc-qv-open { overflow: hidden; }
@keyframes mc-qv-fade { from { opacity: 0; } }
@keyframes mc-qv-rise { from { opacity: 0; transform: translateY(1rem) scale(.98); } }
@media (max-width: 47.999rem) { .mc-qv { padding: .5rem; } .mc-qv__panel { max-height: calc(100vh - 1rem); } .mc-qv__content { display: block; min-height: 0; } .mc-qv__media { min-height: 12rem; padding: .8rem; } .mc-qv__media img { max-height: 14rem; } .mc-qv__info { padding: min(var(--mc-qv-padding), 1.4rem); } .mc-qv__buttons { gap: .45rem; } .mc-qv__buy, .mc-qv__details { padding-inline: .4rem; font-size: min(var(--mc-qv-button-size), 13px); } }
@media (prefers-reduced-motion: reduce) { .mc-qv__backdrop, .mc-qv__panel, .mc-qv__buy, .mc-qv__details { animation: none; transition: none; } }