html.oliey-bag-preview-open { overflow: hidden; scrollbar-gutter: stable; }
.oliey-bag-preview {
  position: fixed; inset: 88px 24px auto auto; margin: 0; padding: 0;
  width: min(520px, calc(100vw - 48px)); max-width: none;
  height: 560px; max-height: calc(100dvh - 112px); border: 0; border-radius: 0;
  background: #fff; color: #171717; box-shadow: 0 12px 44px #0002;
  font-family: Arial, sans-serif; overflow: hidden;
}
.oliey-bag-preview[open] { display:flex; flex-direction:column; animation: oliey-bag-enter 140ms ease-out both; }
.oliey-bag-preview::backdrop { background: rgb(0 0 0 / 18%); animation: oliey-bag-enter 140ms ease-out both; }
.oliey-bag-preview.is-closing { animation: oliey-bag-exit 120ms ease-out both; pointer-events: none; }
.oliey-bag-preview.is-closing::backdrop { animation: oliey-bag-exit 120ms ease-out both; }
.oliey-bag-preview__header { flex-shrink:0; position:relative; display: flex; align-items: center; min-height:76px; box-sizing:border-box; padding: 16px 60px; border-bottom: 1px solid #ccc; }
.oliey-bag-preview__header h2 { flex: 1; margin: 0; text-align:center; font-size: 15px; line-height: 1.5; font-weight: 700; letter-spacing: .025em; text-transform: uppercase; }
.oliey-bag-preview__header .oliey-bag-preview__close { position:absolute; right:12px; top:calc(50% - 22px); }
.oliey-bag-preview__close { width: 44px; height: 44px; flex: 0 0 44px; padding: 0; border: 0; background: none; color: #171717; font-size: 28px; cursor: pointer; }
.checkout-preview-content { flex:1 1 0; min-height:0; overflow-y:auto; overflow-x:hidden; overscroll-behavior:contain; scrollbar-gutter:stable; -webkit-overflow-scrolling:touch; }
.oliey-bag-preview__notice { margin:0; padding:28px; font-size:14px; line-height:1.6; }
.oliey-bag-preview__product { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px; padding: 28px 26px; min-height:244px; box-sizing:border-box; }
.oliey-bag-preview__media { position:relative; aspect-ratio: 1; background: #fff; align-self: center; display: grid; place-items: center; min-width:0; }
.oliey-bag-preview__media img { position:absolute; inset:0; width: 100%; height: 100%; object-fit: contain; }
.oliey-bag-preview__media span { color: #666; font-size: 12px; text-align: center; padding: 12px; }
.oliey-bag-preview [hidden] { display: none !important; }
/* Reserve the checkout slot during loading/empty/error states: no footer jump. */
.oliey-bag-preview__actions [data-checkout-confirmed][hidden] { display:block !important; visibility:hidden; pointer-events:none; }
.oliey-bag-preview__name { margin: 0 0 16px; font-size: 14px; line-height: 1.5; font-weight: 700; text-transform:uppercase; overflow-wrap: anywhere; }
.oliey-bag-preview__price { font-size: 22px; margin: 0 0 22px; }
.oliey-bag-preview__details { margin: 0; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.oliey-bag-preview__details div { margin-top: 7px; }
.oliey-bag-preview__details dt, .oliey-bag-preview__details dd { display: inline; margin: 0; }
.oliey-bag-preview__details dt::after { content: ': '; }
.oliey-bag-preview__actions { flex-shrink:0; background:#fff; padding: 20px 26px; border-top: 1px solid #ccc; display: grid; gap: 14px; }
.oliey-bag-preview__actions a { display: block; padding: 18px 12px; border: 1px solid #171717; border-radius: 0; text-align: center; text-transform: uppercase; text-decoration: none; letter-spacing: .06em; font-size: 13px; font-weight: 600; line-height: 1.5; background: #fff; color: #171717; }
.oliey-bag-preview__actions a:first-child { background: #171717; color: #fff; }
.oliey-bag-preview a:focus-visible, .oliey-bag-preview button:focus-visible { outline: 2px solid #98783e; outline-offset: -5px; }
@keyframes oliey-bag-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes oliey-bag-exit { from { opacity: var(--bag-close-opacity, 1); } to { opacity: 0; } }
@media (max-width: 600px) {
  .oliey-bag-preview { inset: max(16px, env(safe-area-inset-top)) 16px auto; width: calc(100vw - 32px); max-height: calc(100dvh - 32px - env(safe-area-inset-top)); }
  .oliey-bag-preview__header { padding: 14px 52px; min-height:72px; }
  .oliey-bag-preview__header h2 { font-size: 13px; letter-spacing: .055em; }
  .oliey-bag-preview__product { padding: 24px 18px; grid-template-columns: minmax(80px, 36%) minmax(0, 1fr); gap: 18px; min-height:230px; }
  .oliey-bag-preview__name { font-size: 13px; }
  .oliey-bag-preview__price { font-size: 20px; }
  .oliey-bag-preview__actions { padding: 20px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .oliey-bag-preview[open], .oliey-bag-preview.is-closing,
  .oliey-bag-preview::backdrop, .oliey-bag-preview.is-closing::backdrop { animation: none; }
}
@media (max-height:500px) {
  .oliey-bag-preview { top:8px; max-height:calc(100dvh - 16px); }
  .oliey-bag-preview__header { min-height:52px; padding-top:4px; padding-bottom:4px; }
  .oliey-bag-preview__actions { padding:10px 18px; gap:8px; }
  .oliey-bag-preview__actions a { padding:10px; }
}