/**
 * 原站 Drawer 壳层样式（chunk 127: Overlay + Drawer）
 * - 遮罩 z-index 1000，bg-black/50
 * - 右侧面板 w-[600px]、translate 300ms
 * - 购买 webview 默认 fullWidthInMobile=true，移动端仍用 600px 宽面板右对齐
 */

.jn-purchase-drawer {
  position: fixed;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
  visibility: hidden;
}

.jn-purchase-drawer.is-open {
  pointer-events: auto;
  visibility: visible;
}

.jn-purchase-drawer__overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.jn-purchase-drawer.is-open .jn-purchase-drawer__overlay {
  opacity: 1;
}

.jn-purchase-drawer__align {
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: flex-end;
  align-items: center;
}

.jn-purchase-drawer__panel {
  width: 600px;
  height: 100%;
  position: relative;
  background: #fff;
  overflow-y: auto;
  overflow-x: hidden;
  transform: translateX(100%);
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform;
}

.jn-purchase-drawer.is-open .jn-purchase-drawer__panel {
  transform: translateX(0);
}

.jn-purchase-drawer__frame {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}

html.jn-purchase-drawer-open,
html.jn-purchase-drawer-open body {
  overflow: hidden !important;
}