.pass-preview{--pass-width:100%;--pass-height:auto;--pass-space:12.5px;--pass-strip-height:115px;--pass-header-height:35px;--pass-barcode-height:100px;--pass-bg-color:#303030;--pass-fg-color:#fff;--pass-text-color:var(--pass-fg-color);--pass-label-color:#fff;--pass-radius:12px;width:100%;max-width:300px}.pass-preview .pass-front{width:100%;color:var(--pass-text-color);background-color:var(--pass-bg-color);border-radius:var(--pass-radius);flex-direction:column;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.pass-preview .pass-header{padding:var(--pass-space);align-items:center;gap:var(--pass-space);display:flex}.pass-preview .pass-header h1{color:var(--pass-text-color);margin:0;font-size:16px;font-weight:400}.pass-preview .pass-header>h2{color:var(--pass-text-color);margin:0;font-size:14px;font-weight:600}.pass-preview .pass-header__img{min-width:var(--pass-header-height);min-height:var(--pass-header-height);border-radius:var(--pass-radius);background-color:#20202026;line-height:0}.pass-preview .pass-header__img:has(>img){background-color:#0000}.pass-preview .pass-header__img>img{border-radius:var(--pass-radius);max-height:var(--pass-header-height)}.pass-preview .pass-strip{height:var(--pass-strip-height);position:relative}.pass-preview .pass-strip>img{z-index:2;object-fit:cover;width:100%;height:100%;position:absolute;top:0;left:0}.pass-preview .pass-strip:before{content:"";z-index:1;opacity:.15;background-color:#202020;width:100%;height:100%;display:block;position:absolute;top:0;left:0}.pass-preview .pass-body{padding:var(--pass-space);flex-direction:column;flex-grow:1;display:flex}.pass-preview .pass-body__fields{gap:var(--pass-space);margin-bottom:var(--pass-space);grid-template-columns:repeat(2,1fr);display:grid}.pass-preview .pass-body__fields>.pass-field:nth-child(2n){text-align:right}.pass-preview .pass-field{flex-direction:column;min-width:0;display:flex}.pass-preview .pass-field__label{color:var(--pass-label-color);text-transform:uppercase;font-size:12px;font-weight:600}.pass-preview .pass-field__value{color:var(--pass-text-color);font-size:16px;font-weight:400}.pass-preview .pass-body__footer{margin-top:auto}.pass-preview .pass-body__barcode{text-align:center;margin-top:16px}.pass-preview .pass-body__barcode-value{color:var(--pass-text-color);letter-spacing:.05rem;font-size:12px;font-weight:400}.pass-preview .pass-body__barcode-content{height:var(--pass-barcode-height);text-align:center;background-color:#fff;border-radius:8px;justify-content:center;align-items:center;margin-bottom:5px;padding:5px;display:flex}.pass-preview .pass-body__barcode[data-type=qr_code]>.pass-body__barcode-content{height:var(--pass-barcode-height);width:var(--pass-barcode-height);margin:auto auto 5px}.pass-preview [data-editor-trigger]{cursor:pointer;outline:var(--p-border-width-050) solid transparent;outline-offset:calc(-1 * var(--p-border-width-050));border-radius:var(--p-border-radius-200);transition:outline .15s,background-color .15s}.pass-preview [data-editor-trigger]:not([data-editor-trigger=strip]):not([data-editor-trigger=logo]):not([data-editor-trigger=icon]){outline-offset:var(--p-space-100)}.pass-preview [data-editor-trigger]:hover{outline-color:var(--p-color-border-focus)}.pass-preview [data-editor-trigger=strip]{box-shadow:none}.pass-preview [data-editor-trigger=strip]:after{content:"";inset:var(--p-space-200);z-index:3;border-radius:var(--p-border-radius-200);border:var(--p-border-width-050) solid transparent;pointer-events:none;transition:border-color .15s;position:absolute}.pass-preview [data-editor-trigger=strip]:hover:after{border-color:var(--p-color-border-focus)}[data-editor-target].editor-highlight{outline:var(--p-border-width-050) solid var(--p-color-border-focus);outline-offset:var(--p-space-050);border-radius:var(--p-border-radius-200);transition:outline .15s}