.ucp{--ucp-thumb: 72px;--ucp-preview: 240px;background-color:var(--color-surface);border:1px solid rgba(27,59,54,.12);border-radius:var(--radius-card);padding:var(--space-4);min-width:0}.ucp__head{margin-bottom:var(--space-3)}.ucp__title{font-family:var(--font-heading);font-size:var(--text-lg);line-height:var(--leading-snug);color:var(--color-secondary);margin:0}.ucp__intro{font-size:var(--text-xs);line-height:var(--leading-normal);color:var(--color-text-secondary);margin:var(--space-1) 0 0}.ucp__list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--space-2)}.ucp__item{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2);border-radius:var(--radius-md);transition:background-color var(--transition-base)}.ucp__item+.ucp__item{border-top:1px solid rgba(27,59,54,.07)}@media(hover:hover)and (pointer:fine){.ucp__item:hover{background-color:var(--color-surface-warm)}}.ucp__thumb-wrap{position:relative;flex:0 0 auto}.ucp__thumb{display:block;width:var(--ucp-thumb);height:var(--ucp-thumb);padding:0;border:1px solid rgba(27,59,54,.1);border-radius:12px;overflow:hidden;background-color:var(--color-surface-warm);cursor:zoom-in;color:var(--color-accent-green)}.ucp__thumb img{width:100%;height:100%;object-fit:cover;display:block}.ucp__thumb-placeholder{width:100%;height:100%;display:block}.ucp__thumb:focus-visible{outline:2px solid var(--color-secondary);outline-offset:2px}.ucp__preview{position:absolute;bottom:calc(100% + 10px);left:0;z-index:30;width:var(--ucp-preview);max-width:calc(100vw - var(--space-8));padding:var(--space-2);background-color:var(--color-surface);border-radius:var(--radius-card);box-shadow:var(--shadow-lg);opacity:0;transform:translateY(4px) scale(.96);transform-origin:bottom left;transition:opacity var(--transition-base),transform var(--transition-base);pointer-events:none}.ucp__preview img{width:100%;height:auto;aspect-ratio:1 / 1;object-fit:cover;border-radius:var(--radius-md);display:block}@media(hover:hover)and (pointer:fine){.ucp__thumb-wrap:hover .ucp__preview,.ucp__thumb:focus-visible+.ucp__preview{opacity:1;transform:translateY(0) scale(1)}}.ucp__item.is-preview-open .ucp__preview{opacity:1;transform:translateY(0) scale(1)}.ucp__item.is-preview-below .ucp__preview{bottom:auto;top:calc(100% + 10px);transform-origin:top left;transform:translateY(-4px) scale(.96)}@media(hover:hover)and (pointer:fine){.ucp__item.is-preview-below .ucp__thumb-wrap:hover .ucp__preview,.ucp__item.is-preview-below .ucp__thumb:focus-visible+.ucp__preview{transform:translateY(0) scale(1)}}.ucp__item.is-preview-below.is-preview-open .ucp__preview{transform:translateY(0) scale(1)}@media(prefers-reduced-motion:reduce){.ucp__preview{transition:opacity var(--transition-fast);transform:none}.ucp__thumb-wrap:hover .ucp__preview,.ucp__item.is-preview-open .ucp__preview{transform:none}}.ucp__info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}.ucp__name{font-size:var(--text-sm);font-weight:500;line-height:var(--leading-snug);color:var(--color-text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ucp__meta{display:flex;align-items:baseline;flex-wrap:wrap;gap:var(--space-2);row-gap:4px;font-size:var(--text-xs);color:var(--color-text-secondary)}.ucp__price{font-weight:600;color:var(--color-text-primary)}.ucp__badge{display:inline-block;padding:2px 8px;border-radius:var(--radius-badge);background-color:var(--color-surface-green);color:var(--color-secondary);font-size:10.5px;font-weight:500;line-height:1.5;letter-spacing:var(--tracking-wide);white-space:nowrap}.ucp__add{flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid var(--color-secondary);border-radius:var(--radius-button);background-color:transparent;color:var(--color-secondary);font-family:var(--font-body);font-size:var(--text-xs);font-weight:600;line-height:1;cursor:pointer;transition:background-color var(--transition-base),color var(--transition-base),border-color var(--transition-base)}.ucp__add svg{width:13px;height:13px;flex:0 0 auto}@media(hover:hover)and (pointer:fine){.ucp__add:hover{background-color:var(--color-secondary);color:var(--color-text-light)}}.ucp__add:focus-visible{outline:2px solid var(--color-secondary);outline-offset:2px}.ucp__add[disabled]{cursor:default}.ucp__add.is-added{background-color:var(--color-surface-green);border-color:var(--color-accent-green);color:var(--color-secondary)}.ucp__add.is-added svg{display:none}.ucp__error{margin:var(--space-3) 0 0;font-size:var(--text-xs);color:var(--color-error)}@media(max-width:749px){.ucp{--ucp-thumb: 64px;--ucp-preview: 220px;padding:var(--space-3)}.ucp__item{gap:var(--space-2)}.ucp__add{padding:8px 12px}.ucp__add span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.ucp__add svg{width:15px;height:15px}.ucp__add.is-added span{position:static;width:auto;height:auto;clip:auto}}
/*# sourceMappingURL=/cdn/shop/t/14/assets/component-upsell-compleet.css.map */
