1<!doctype html> 2<html 3 4 lang="en" 5> 6 <head> 7
7<script src="https://storage.googleapis.com/tagalys-public-assets/tagalys-ui-widgets-3.0.16.min.js" defer></script>
7 8
8<script src="//www.tagalys.com/cdn/shop/t/7/assets/tagalys-customisations.js?v=22653769880224154741786539027"></script>
8 9 10 11 <!-- Google Tag Manager --> 12
12<script>
vendor: 455 bytes, lines 12-22
12 13 (function (w, d, s, l, i) { 14 w[l] = w[l] || []; 15 w[l].push({ 'gtm.start': new Date().getTime(), event: 'gtm.js' }); 16 var f = d.getElementsByTagName(s)[0], 17 j = d.createElement(s), 18 dl = l != 'dataLayer' ? '&l=' + l : ''; 19 j.async = true; 20 j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl; 21 f.parentNode.insertBefore(j, f); 22 })(window, document, 'script', 'dataLayer', '
22GTM-P97Q2B4
vendor: 8 bytes, lines 22-23
22'); 23
23</script>
23 24 <!-- End Google Tag Manager --><link 25 rel="icon" 26 type="image/png" 27 href="//www.tagalys.com/cdn/shop/files/cropped-favicon-1-192x192_3.png?crop=center&height=32&v=1782721531&width=32" 28 > 29 30 31 32<meta charset="utf-8"> 33<meta 34 http-equiv="X-UA-Compatible" 35 content="IE=edge" 36> 37<meta 38 name="viewport" 39 content="width=device-width,initial-scale=1" 40> 41<meta 42 name="view-transition" 43 content="same-origin" 44> 45<meta 46 name="theme-color" 47 content="#ODODOD" 48> 49 50<meta 51 property="og:site_name" 52 content="Tagalys Website" 53> 54<meta 55 property="og:url" 56 content="https://www.tagalys.com/blogs/resources" 57> 58<meta 59 property="og:title" 60 content="Resources" 61> 62<meta 63 property="og:type" 64 content="website" 65> 66<meta 67 property="og:description" 68 content="Fashion merchandising built for control, storytelling, and speed. Discover smarter collections, better search, and stronger product discovery for Shopify." 69><meta 70 property="og:image" 71 content="http://www.tagalys.com/cdn/shop/files/Frame_40215.png?v=1782728110" 72 > 73 <meta 74 property="og:image:secure_url" 75 content="https://www.tagalys.com/cdn/shop/files/Frame_40215.png?v=1782728110" 76 > 77 <meta 78 property="og:image:width" 79 content="3600" 80 > 81 <meta 82 property="og:image:height" 83 content="1890" 84 ><meta 85 name="twitter:card" 86 content="summary_large_image" 87> 88<meta 89 name="twitter:title" 90 content="Resources" 91> 92<meta 93 name="twitter:description" 94 content="Fashion merchandising built for control, storytelling, and speed. Discover smarter collections, better search, and stronger product discovery for Shopify." 95> 96 97<title> 98 Resources 99 – Tagalys Website</title> 100 101<link 102 rel="canonical" 103 href="https://www.tagalys.com/blogs/resources" 104> 105 106 107<link href="//www.tagalys.com/cdn/shop/t/7/assets/overflow-list.css?v=16727044177065489451786539027" as="style" rel="preload"> 108<link href="//www.tagalys.com/cdn/shop/t/7/assets/base.css?v=126590144970261393271786539027" rel="stylesheet" type="text/css" media="all" /> 109 110 111<style> 112 113@font-face{ 114 font-family:"Saans"; 115 src: 116 url("https://cdn.shopify.com/s/files/1/0680/4140/8610/files/saans-regular.woff2?v=1782379808") format("woff2"), 117 url("https://cdn.shopify.com/s/files/1/0680/4140/8610/files/saans-regular.woff?v=1782379808") format("woff"); 118 font-weight:400; 119 font-style:normal; 120 font-display:swap; 121} 122 123@font-face{ 124 font-family:"Saans"; 125 src: 126 url("https://cdn.shopify.com/s/files/1/0680/4140/8610/files/saans-medium.woff2?v=1782379808") format("woff2"), 127 url("https://cdn.shopify.com/s/files/1/0680/4140/8610/files/saans-medium.woff?v=1782379808") format("woff"); 128 font-weight:500; 129 font-style:normal; 130 font-display:swap; 131} 132 133@font-face{ 134 font-family:"Saans"; 135 src: 136 url("https://cdn.shopify.com/s/files/1/0680/4140/8610/files/saans-semiBold.woff2?v=1782379808") format("woff2"), 137 url("https://cdn.shopify.com/s/files/1/0680/4140/8610/files/saans-semiBold.woff?v=1782379808") format("woff"); 138 font-weight:600 800; 139 font-style:normal; 140 font-display:swap; 141} 142 143</style><link href="//www.tagalys.com/cdn/shop/t/7/assets/tagalys-global.css?v=145114662507600039491786539027" rel="stylesheet" type="text/css" media="all" /> 144<link href="//www.tagalys.com/cdn/fonts/inter/inter_n4.b2a3f24c19b4de56e8871f609e73ca7f6d2e2bb9.woff2" as="font" type="font/woff2" fetchpriority="low" crossorigin="anonymous" rel="preload"> 145<link href="//www.tagalys.com/cdn/fonts/inter/inter_n5.d7101d5e168594dd06f56f290dd759fba5431d97.woff2" as="font" type="font/woff2" fetchpriority="low" crossorigin="anonymous" rel="preload"> 146<link href="//www.tagalys.com/cdn/fonts/inter/inter_n7.02711e6b374660cfc7915d1afc1c204e633421e4.woff2" as="font" type="font/woff2" fetchpriority="low" crossorigin="anonymous" rel="preload"> 147<link href="//www.tagalys.com/cdn/fonts/inter/inter_n7.02711e6b374660cfc7915d1afc1c204e633421e4.woff2" as="font" type="font/woff2" fetchpriority="low" crossorigin="anonymous" rel="preload"> 148 149
150<script async crossorigin fetchpriority="high" src="/cdn/shopifycloud/importmap-polyfill/es-modules-shim.2.4.0.js"></script>
vendor: 1 bytes, line 150
150
151<script type="importmap"> 152 { 153 "imports": { 154 "@theme/overflow-list": "//www.tagalys.com/cdn/shop/t/7/assets/overflow-list.js?v=46858356770684902511786539027", 155 "@theme/component": "//www.tagalys.com/cdn/shop/t/7/assets/component.js?v=175690430936884589731786539027", 156 "@theme/dialog": "//www.tagalys.com/cdn/shop/t/7/assets/dialog.js?v=50435175020407122251786539027", 157 "@theme/events": "//www.tagalys.com/cdn/shop/t/7/assets/events.js?v=99399773727497444581786539027", 158 "@shopify/events": "https://cdn.shopify.com/storefront/standard-events.js", 159 "@theme/view-event-elements": "//www.tagalys.com/cdn/shop/t/7/assets/view-event-elements.js?v=34258756885466567141786539027", 160 "@theme/focus": "//www.tagalys.com/cdn/shop/t/7/assets/focus.js?v=60436577539430446401786539027", 161 "@theme/morph": "//www.tagalys.com/cdn/shop/t/7/assets/morph.js?v=182601902166245204061786539027", 162 "@theme/paginated-list": "//www.tagalys.com/cdn/shop/t/7/assets/paginated-list.js?v=71290058904108491691786539027", 163 "@theme/performance": "//www.tagalys.com/cdn/shop/t/7/assets/performance.js?v=171015751390534793081786539027", 164 "@theme/product-form": "//www.tagalys.com/cdn/shop/t/7/assets/product-form.js?v=75424241456978697291786539027", 165 "@theme/recently-viewed-products": "//www.tagalys.com/cdn/shop/t/7/assets/recently-viewed-products.js?v=94729125001750262651786539027", 166 "@theme/scrolling": "//www.tagalys.com/cdn/shop/t/7/assets/scrolling.js?v=162288454571026455011786539027", 167 "@theme/section-renderer": "//www.tagalys.com/cdn/shop/t/7/assets/section-renderer.js?v=44511745960026958271786539027", 168 "@theme/section-hydration": "//www.tagalys.com/cdn/shop/t/7/assets/section-hydration.js?v=108434990705342316311786539027", 169 "@theme/money-formatting": "//www.tagalys.com/cdn/shop/t/7/assets/money-formatting.js?v=160151249720534550011786539027", 170 "@theme/utilities": "//www.tagalys.com/cdn/shop/t/7/assets/utilities.js?v=66596746310761568671786539027", 171 "@theme/variant-picker": "//www.tagalys.com/cdn/shop/t/7/assets/variant-picker.js?v=21977969907998071131786539027", 172 "@theme/media-gallery": "//www.tagalys.com/cdn/shop/t/7/assets/media-gallery.js?v=154207211298275592001786539027", 173 "@theme/quick-add": "//www.tagalys.com/cdn/shop/t/7/assets/quick-add.js?v=43065342542833269571786539027", 174 "@theme/paginated-list-aspect-ratio": "//www.tagalys.com/cdn/shop/t/7/assets/paginated-list-aspect-ratio.js?v=25254270272143792451786539027", 175 "@theme/popover-polyfill": "//www.tagalys.com/cdn/shop/t/7/assets/popover-polyfill.js?v=119029313658895111201786539027", 176 "@theme/component-quantity-selector": "//www.tagalys.com/cdn/shop/t/7/assets/component-quantity-selector.js?v=67906657287482036641786539027", 177 "@theme/comparison-slider": "//www.tagalys.com/cdn/shop/t/7/assets/comparison-slider.js?v=106705562947035711941786539027", 178 "@theme/sticky-add-to-cart": "//www.tagalys.com/cdn/shop/t/7/assets/sticky-add-to-cart.js?v=130489688094345781431786539027", 179 "@theme/fly-to-cart": "//www.tagalys.com/cdn/shop/t/7/assets/fly-to-cart.js?v=48483246440248933081786539027", 180 "@theme/scroll-container": "//www.tagalys.com/cdn/shop/t/7/assets/scroll-container.js?v=127018149358875384221786539027", 181 "@theme/theme-drawer": "//www.tagalys.com/cdn/shop/t/7/assets/theme-drawer.js?v=19271060799489679091786539027" 182 } 183 } 184</script>
184<script 185 src="//www.tagalys.com/cdn/shop/t/7/assets/standard-actions-override.js?v=171683365447094389611786539027" 186 type="module" 187></script>
187 188
189<script 190 src="//www.tagalys.com/cdn/shop/t/7/assets/page-view-event.js?v=12823247316348680231786539027" 191 type="module" 192 defer 193></script>
193 194
195<script 196 src="//www.tagalys.com/cdn/shop/t/7/assets/view-transitions.js?v=5297208939214537721786539027" 197 async 198 199></script>
199 200 201<link 202 rel="modulepreload" 203 href="//www.tagalys.com/cdn/shop/t/7/assets/utilities.js?v=66596746310761568671786539027" 204 fetchpriority="low" 205> 206<link 207 rel="modulepreload" 208 href="//www.tagalys.com/cdn/shop/t/7/assets/component.js?v=175690430936884589731786539027" 209 fetchpriority="low" 210> 211<link 212 rel="modulepreload" 213 href="//www.tagalys.com/cdn/shop/t/7/assets/section-renderer.js?v=44511745960026958271786539027" 214 fetchpriority="low" 215> 216<link 217 rel="modulepreload" 218 href="//www.tagalys.com/cdn/shop/t/7/assets/section-hydration.js?v=108434990705342316311786539027" 219 fetchpriority="low" 220> 221<link 222 rel="modulepreload" 223 href="//www.tagalys.com/cdn/shop/t/7/assets/morph.js?v=182601902166245204061786539027" 224 fetchpriority="low" 225> 226 227 228 229<link 230 rel="modulepreload" 231 href="//www.tagalys.com/cdn/shop/t/7/assets/focus.js?v=60436577539430446401786539027" 232 fetchpriority="low" 233> 234<link 235 rel="modulepreload" 236 href="//www.tagalys.com/cdn/shop/t/7/assets/recently-viewed-products.js?v=94729125001750262651786539027" 237 fetchpriority="low" 238> 239<link 240 rel="modulepreload" 241 href="//www.tagalys.com/cdn/shop/t/7/assets/scrolling.js?v=162288454571026455011786539027" 242 fetchpriority="low" 243> 244<link 245 rel="modulepreload" 246 href="//www.tagalys.com/cdn/shop/t/7/assets/events.js?v=99399773727497444581786539027" 247 fetchpriority="low" 248>
249<script 250 src="//www.tagalys.com/cdn/shop/t/7/assets/popover-polyfill.js?v=119029313658895111201786539027" 251 type="module" 252 fetchpriority="low" 253></script>
vendor: 1 bytes, line 253
253
254<script 255 src="//www.tagalys.com/cdn/shop/t/7/assets/overflow-list.js?v=46858356770684902511786539027" 256 type="module" 257 fetchpriority="low" 258></script>
vendor: 1 bytes, line 258
258
259<script 260 src="//www.tagalys.com/cdn/shop/t/7/assets/quick-add.js?v=43065342542833269571786539027" 261 type="module" 262 fetchpriority="low" 263></script>
263 264 265
265<script 266 src="//www.tagalys.com/cdn/shop/t/7/assets/cart-discount.js?v=138990160074728809221786539027" 267 type="module" 268 fetchpriority="low" 269 ></script>
269 270 271
272<script 273 src="//www.tagalys.com/cdn/shop/t/7/assets/dialog.js?v=50435175020407122251786539027" 274 type="module" 275 fetchpriority="low" 276></script>
vendor: 1 bytes, line 276
276
277<script 278 src="//www.tagalys.com/cdn/shop/t/7/assets/variant-picker.js?v=21977969907998071131786539027" 279 type="module" 280 fetchpriority="low" 281></script>
vendor: 1 bytes, line 281
281
282<script 283 src="//www.tagalys.com/cdn/shop/t/7/assets/product-card.js?v=37238785082130356571786539027" 284 type="module" 285 fetchpriority="low" 286></script>
vendor: 1 bytes, line 286
286
287<script 288 src="//www.tagalys.com/cdn/shop/t/7/assets/product-form.js?v=75424241456978697291786539027" 289 type="module" 290 fetchpriority="low" 291></script>
vendor: 1 bytes, line 291
291
292<script 293 src="//www.tagalys.com/cdn/shop/t/7/assets/fly-to-cart.js?v=48483246440248933081786539027" 294 type="module" 295 fetchpriority="low" 296></script>
vendor: 1 bytes, line 296
296
297<script 298 src="//www.tagalys.com/cdn/shop/t/7/assets/accordion-custom.js?v=97588419883090888471786539027" 299 type="module" 300 fetchpriority="low" 301></script>
vendor: 1 bytes, line 301
301
302<script 303 src="//www.tagalys.com/cdn/shop/t/7/assets/media.js?v=37825095869491791421786539027" 304 type="module" 305 fetchpriority="low" 306></script>
vendor: 1 bytes, line 306
306
307<script 308 src="//www.tagalys.com/cdn/shop/t/7/assets/product-price.js?v=179333985604099329921786539027" 309 type="module" 310 fetchpriority="low" 311></script>
vendor: 1 bytes, line 311
311
312<script 313 src="//www.tagalys.com/cdn/shop/t/7/assets/product-sku.js?v=28741104639155857071786539027" 314 type="module" 315 fetchpriority="low" 316></script>
vendor: 1 bytes, line 316
316
317<script 318 src="//www.tagalys.com/cdn/shop/t/7/assets/product-inventory.js?v=7173209571153411411786539027" 319 type="module" 320 fetchpriority="low" 321></script>
vendor: 1 bytes, line 321
321
322<script 323 src="//www.tagalys.com/cdn/shop/t/7/assets/show-more.js?v=94563802205717136101786539027" 324 type="module" 325 fetchpriority="low" 326></script>
vendor: 1 bytes, line 326
326
327<script 328 src="//www.tagalys.com/cdn/shop/t/7/assets/slideshow.js?v=28306258147874261831786539027" 329 type="module" 330 fetchpriority="low" 331></script>
vendor: 1 bytes, line 331
331
332<script 333 src="//www.tagalys.com/cdn/shop/t/7/assets/layered-slideshow.js?v=30135417790894624731786539027" 334 type="module" 335 fetchpriority="low" 336></script>
vendor: 1 bytes, line 336
336
337<script 338 src="//www.tagalys.com/cdn/shop/t/7/assets/anchored-popover.js?v=95953304814728754461786539027" 339 type="module" 340 fetchpriority="low" 341></script>
vendor: 1 bytes, line 341
341
342<script 343 src="//www.tagalys.com/cdn/shop/t/7/assets/floating-panel.js?v=151277338116891310371786539027" 344 type="module" 345 fetchpriority="low" 346></script>
vendor: 1 bytes, line 346
346
347<script 348 src="//www.tagalys.com/cdn/shop/t/7/assets/video-background.js?v=25237992823806706551786539027" 349 type="module" 350 fetchpriority="low" 351></script>
vendor: 1 bytes, line 351
351
352<script 353 src="//www.tagalys.com/cdn/shop/t/7/assets/component-quantity-selector.js?v=67906657287482036641786539027" 354 type="module" 355 fetchpriority="low" 356></script>
vendor: 1 bytes, line 356
356
357<script 358 src="//www.tagalys.com/cdn/shop/t/7/assets/media-gallery.js?v=154207211298275592001786539027" 359 type="module" 360 fetchpriority="low" 361></script>
vendor: 1 bytes, line 361
361
362<script 363 src="//www.tagalys.com/cdn/shop/t/7/assets/rte-formatter.js?v=40306132146590816021786539027" 364 type="module" 365 fetchpriority="low" 366></script>
vendor: 1 bytes, line 366
366
367<script 368 src="//www.tagalys.com/cdn/shop/t/7/assets/volume-pricing.js?v=15442793518842484731786539027" 369 type="module" 370 fetchpriority="low" 371></script>
vendor: 1 bytes, line 371
371
372<script 373 src="//www.tagalys.com/cdn/shop/t/7/assets/price-per-item.js?v=115937180292451397851786539027" 374 type="module" 375 fetchpriority="low" 376></script>
vendor: 1 bytes, line 376
376
377<script 378 src="//www.tagalys.com/cdn/shop/t/7/assets/volume-pricing-info.js?v=94479640769665442661786539027" 379 type="module" 380 fetchpriority="low" 381></script>
381 382 383 384 385 386
387<script 388 src="//www.tagalys.com/cdn/shop/t/7/assets/auto-close-details.js?v=58350291535404441581786539027" 389 defer="defer" 390></script>
390 391
392<script> 393 const Theme = { 394 translations: { 395 placeholder_image: `Placeholder image`, 396 added: `Added`, 397 recipient_form_fields_visible: `Recipient form fields are now visible`, 398 recipient_form_fields_hidden: `Recipient form fields are now hidden`, 399 recipient_form_error: `There was an error with the form submission`, 400 items_added_to_cart_one: `1 item added to cart`, 401 items_added_to_cart_other: `{{ count }} items added to cart`, 402 cart_count: `Total items in cart`, 403 }, 404 routes: { 405 cart_add_url: '/cart/add.js', 406 cart_change_url: '/cart/change', 407 cart_update_url: '/cart/update', 408 cart_url: '/cart', 409 predictive_search_url: '/search/suggest', 410 search_url: '/search', 411 }, 412 template: { 413 name: 'blog', 414 }, 415 }; 416</script>
416 417<style data-shopify> 418@font-face { 419 font-family: Inter; 420 font-weight: 400; 421 font-style: normal; 422 font-display: swap; 423 src: url("//www.tagalys.com/cdn/fonts/inter/inter_n4.b2a3f24c19b4de56e8871f609e73ca7f6d2e2bb9.woff2") format("woff2"), 424 url("//www.tagalys.com/cdn/fonts/inter/inter_n4.af8052d517e0c9ffac7b814872cecc27ae1fa132.woff") format("woff"); 425} 426@font-face { 427 font-family: Inter; 428 font-weight: 700; 429 font-style: normal; 430 font-display: swap; 431 src: url("//www.tagalys.com/cdn/fonts/inter/inter_n7.02711e6b374660cfc7915d1afc1c204e633421e4.woff2") format("woff2"), 432 url("//www.tagalys.com/cdn/fonts/inter/inter_n7.6dab87426f6b8813070abd79972ceaf2f8d3b012.woff") format("woff"); 433} 434@font-face { 435 font-family: Inter; 436 font-weight: 400; 437 font-style: italic; 438 font-display: swap; 439 src: url("//www.tagalys.com/cdn/fonts/inter/inter_i4.feae1981dda792ab80d117249d9c7e0f1017e5b3.woff2") format("woff2"), 440 url("//www.tagalys.com/cdn/fonts/inter/inter_i4.62773b7113d5e5f02c71486623cf828884c85c6e.woff") format("woff"); 441} 442@font-face { 443 font-family: Inter; 444 font-weight: 700; 445 font-style: italic; 446 font-display: swap; 447 src: url("//www.tagalys.com/cdn/fonts/inter/inter_i7.b377bcd4cc0f160622a22d638ae7e2cd9b86ea4c.woff2") format("woff2"), 448 url("//www.tagalys.com/cdn/fonts/inter/inter_i7.7c69a6a34e3bb44fcf6f975857e13b9a9b25beb4.woff") format("woff"); 449} 450@font-face { 451 font-family: Inter; 452 font-weight: 500; 453 font-style: normal; 454 font-display: swap; 455 src: url("//www.tagalys.com/cdn/fonts/inter/inter_n5.d7101d5e168594dd06f56f290dd759fba5431d97.woff2") format("woff2"), 456 url("//www.tagalys.com/cdn/fonts/inter/inter_n5.5332a76bbd27da00474c136abb1ca3cbbf259068.woff") format("woff"); 457} 458@font-face { 459 font-family: Inter; 460 font-weight: 500; 461 font-style: italic; 462 font-display: swap; 463 src: url("//www.tagalys.com/cdn/fonts/inter/inter_i5.4474f48e6ab2b1e01aa2b6d942dd27fa24f2d99f.woff2") format("woff2"), 464 url("//www.tagalys.com/cdn/fonts/inter/inter_i5.493dbd6ee8e49f4ad722ebb68d92f201af2c2f56.woff") format("woff"); 465} 466 467 468 :root { 469 /* Page Layout */ 470 --sidebar-width: 25rem; 471 --theme-drawer-width: 30rem; 472 --narrow-content-width: 36rem; 473 --normal-content-width: 42rem; 474 --wide-content-width: 46rem; 475 --narrow-page-width: 90rem; 476 --normal-page-width: 120rem; 477 --wide-page-width: 150rem; 478 479 /* Section Heights */ 480 --section-height-small: 15rem; 481 --section-height-medium: 25rem; 482 --section-height-large: 35rem; 483 484 @media screen and (min-width: 40em) { 485 --section-height-small: 40svh; 486 --section-height-medium: 55svh; 487 --section-height-large: 70svh; 488 } 489 490 @media screen and (min-width: 60em) { 491 --section-height-small: 50svh; 492 --section-height-medium: 65svh; 493 --section-height-large: 80svh; 494 } 495 496 /* Letter spacing */ 497 --letter-spacing-sm: 0.06em; 498 --letter-spacing-md: 0.13em; 499 500 /* Font families */ 501 --font-body--family: Inter, sans-serif; 502 --font-body--style: normal; 503 --font-body--weight: 400; 504 --font-subheading--family: Inter, sans-serif; 505 --font-subheading--style: normal; 506 --font-subheading--weight: 500; 507 --font-heading--family: Inter, sans-serif; 508 --font-heading--style: normal; 509 --font-heading--weight: 700; 510 --font-accent--family: Inter, sans-serif; 511 --font-accent--style: normal; 512 --font-accent--weight: 700; 513 514 /* Margin sizes */ 515 --font-heading--spacing: 0.25em; 516 --font-h1--spacing: var(--font-heading--spacing); 517 --font-h2--spacing: var(--font-heading--spacing); 518 --font-h3--spacing: var(--font-heading--spacing); 519 --font-h4--spacing: var(--font-heading--spacing); 520 --font-h5--spacing: var(--font-heading--spacing); 521 --font-h6--spacing: var(--font-heading--spacing); 522 --font-paragraph--spacing: 0.5em; 523 524 /** Z-Index / Layering */ 525 --layer-section-background: -2; 526 --layer-lowest: -1; 527 --layer-base: 0; 528 --layer-flat: 1; 529 --layer-raised: 2; 530 --layer-heightened: 4; 531 --layer-sticky: 8; 532 --layer-window-overlay: 10; 533 --layer-header-menu: 12; 534 --layer-overlay: 16; 535 --layer-menu-drawer: 18; 536 --layer-temporary: 20; 537 538 /* Max-width / Measure */ 539 --max-width--body-normal: 32.5em; 540 --max-width--body-narrow: 22.75em; 541 542 --max-width--heading-normal: 32.5em; 543 --max-width--heading-narrow: 19.5em; 544 545 --max-width--display-normal: 13em; 546 --max-width--display-narrow: 9.75em; 547 --max-width--display-tight: 3.25em; 548 549 /* Letter-spacing / Tracking */ 550 --letter-spacing--display-tight: -0.03em; 551 --letter-spacing--display-normal: 0em; 552 --letter-spacing--display-loose: 0.03em; 553 554 --letter-spacing--heading-tight: -0.03em; 555 --letter-spacing--heading-normal: 0em; 556 --letter-spacing--heading-loose: 0.03em; 557 558 --letter-spacing--body-tight: -0.03em; 559 --letter-spacing--body-normal: 0em; 560 --letter-spacing--body-loose: 0.03em; 561 562 /* Line height / Leading */ 563 --line-height: 1; 564 565 --line-height--display-tight: 1; 566 --line-height--display-normal: 1.1; 567 --line-height--display-loose: 1.2; 568 569 --line-height--heading-tight: 1.15; 570 --line-height--heading-normal: 1.25; 571 --line-height--heading-loose: 1.35; 572 573 --line-height--body-tight: 1.2; 574 --line-height--body-normal: 1.4; 575 --line-height--body-loose: 1.6; 576 577 /* Typography presets */ 578 --font-size--paragraph: 0.875rem;--font-size--h1: clamp(3.0rem, 5.6vw, 3.5rem);--font-size--h2: clamp(2.25rem, 4.8vw, 3.0rem);--font-size--h3: 2.0rem;--font-size--h4: 1.5rem;--font-size--h5: 0.875rem;--font-size--h6: 0.75rem;--font-paragraph--weight: 400;--font-paragraph--letter-spacing: var(--letter-spacing--body-normal);--font-paragraph--size: var(--font-size--paragraph);--font-paragraph--family: var(--font-body--family);--font-paragraph--style: var(--font-body--style);--font-paragraph--case: ;--font-paragraph--line-height: var(--line-height--body-loose);--font-h1--weight: var(--font-heading--weight);--font-h1--letter-spacing: var(--letter-spacing--heading-normal);--font-h1--size: var(--font-size--h1);--font-h1--family: var(--font-heading--family);--font-h1--style: var(--font-heading--style);--font-h1--case: none;--font-h1--line-height: var(--line-height--display-tight);--font-h2--weight: var(--font-heading--weight);--font-h2--letter-spacing: var(--letter-spacing--heading-normal);--font-h2--size: var(--font-size--h2);--font-h2--family: var(--font-heading--family);--font-h2--style: var(--font-heading--style);--font-h2--case: none;--font-h2--line-height: var(--line-height--display-tight);--font-h3--weight: var(--font-heading--weight);--font-h3--letter-spacing: var(--letter-spacing--heading-normal);--font-h3--size: var(--font-size--h3);--font-h3--family: var(--font-heading--family);--font-h3--style: var(--font-heading--style);--font-h3--case: none;--font-h3--line-height: var(--line-height--display-normal);--font-h4--weight: var(--font-heading--weight);--font-h4--letter-spacing: var(--letter-spacing--heading-normal);--font-h4--size: var(--font-size--h4);--font-h4--family: var(--font-heading--family);--font-h4--style: var(--font-heading--style);--font-h4--case: none;--font-h4--line-height: var(--line-height--display-tight);--font-h5--weight: var(--font-subheading--weight);--font-h5--letter-spacing: var(--letter-spacing--heading-normal);--font-h5--size: var(--font-size--h5);--font-h5--family: var(--font-subheading--family);--font-h5--style: var(--font-subheading--style);--font-h5--case: none;--font-h5--line-height: var(--line-height--display-loose);--font-h6--weight: var(--font-subheading--weight);--font-h6--letter-spacing: var(--letter-spacing--heading-normal);--font-h6--size: var(--font-size--h6);--font-h6--family: var(--font-subheading--family);--font-h6--style: var(--font-subheading--style);--font-h6--case: none;--font-h6--line-height: var(--line-height--display-loose); 579 580 /* Hardcoded font sizes */ 581 --font-size--3xs: 0.625rem; 582 --font-size--2xs: 0.75rem; 583 --font-size--xs: 0.8125rem; 584 --font-size--sm: 0.875rem; 585 --font-size--md: 1rem; 586 --font-size--lg: 1.125rem; 587 --font-size--xl: 1.25rem; 588 --font-size--2xl: 1.5rem; 589 --font-size--3xl: 2rem; 590 --font-size--4xl: 2.5rem; 591 --font-size--5xl: 3rem; 592 --font-size--6xl: 3.5rem; 593 594 /* Menu font sizes */ 595 --menu-font-sm--size: 0.875rem; 596 --menu-font-sm--line-height: calc(1.1 + 0.5 * min(16 / 14)); 597 --menu-font-md--size: 1rem; 598 --menu-font-md--line-height: calc(1.1 + 0.5 * min(16 / 16)); 599 --menu-font-lg--size: 1.125rem; 600 --menu-font-lg--line-height: calc(1.1 + 0.5 * min(16 / 18)); 601 --menu-font-xl--size: 1.25rem; 602 --menu-font-xl--line-height: calc(1.1 + 0.5 * min(16 / 20)); 603 --menu-font-2xl--size: 1.75rem; 604 --menu-font-2xl--line-height: calc(1.1 + 0.5 * min(16 / 28)); 605 606 /* Colors */ 607 --color-error: #8B0000; 608 --color-success: #006400; 609 --color-white: #FFFFFF; 610 --color-white-rgb: 255 255 255; 611 --color-black: #000000; 612 --color-instock: #3ED660; 613 --color-lowstock: #EE9441; 614 --color-outofstock: #C8C8C8; 615 616 /* Opacity */ 617 --opacity-5: 0.05; 618 --opacity-8: 0.08; 619 --opacity-10: 0.1; 620 --opacity-15: 0.15; 621 --opacity-20: 0.2;
622 --opacity-25: 0.25; 623 --opacity-30: 0.3; 624 --opacity-40: 0.4; 625 --opacity-50: 0.5; 626 --opacity-60: 0.6; 627 --opacity-70: 0.7; 628 --opacity-80: 0.8; 629 --opacity-85: 0.85; 630 --opacity-90: 0.9; 631 --opacity-subdued-text: 0.8; 632 --opacity-muted-text: 0.6; 633 634 --shadow-button: 0 2px 3px rgb(0 0 0 / 20%); 635 --gradient-image-overlay: linear-gradient(to top, rgb(0 0 0 / 0.5), transparent); 636 637 /* Spacing */ 638 --margin-3xs: 0.125rem; 639 --margin-2xs: 0.3rem; 640 --margin-xs: 0.5rem; 641 --margin-sm: 0.7rem; 642 --margin-md: 0.8rem; 643 --margin-lg: 1rem; 644 --margin-xl: 1.25rem; 645 --margin-2xl: 1.5rem; 646 --margin-3xl: 1.75rem; 647 --margin-4xl: 2rem; 648 --margin-5xl: 3rem; 649 --margin-6xl: 5rem; 650 651 --scroll-margin: 50px; 652 653 --padding-3xs: 0.125rem; 654 --padding-2xs: 0.25rem; 655 --padding-xs: 0.5rem; 656 --padding-sm: 0.7rem; 657 --padding-md: 0.8rem; 658 --padding-lg: 1rem; 659 --padding-xl: 1.25rem; 660 --padding-2xl: 1.5rem; 661 --padding-3xl: 1.75rem; 662 --padding-4xl: 2rem; 663 --padding-5xl: 3rem; 664 --padding-6xl: 4rem; 665 666 --gap-3xs: 0.125rem; 667 --gap-2xs: 0.3rem; 668 --gap-xs: 0.5rem; 669 --gap-sm: 0.7rem; 670 --gap-md: 0.9rem; 671 --gap-lg: 1rem; 672 --gap-xl: 1.25rem; 673 --gap-2xl: 2rem; 674 --gap-3xl: 3rem; 675 676 --spacing-scale-sm: 0.6; 677 --spacing-scale-md: 0.7; 678 --spacing-scale-default: 1.0; 679 680 /* Checkout buttons gap */ 681 --checkout-button-gap: 10px; 682 683 /* Borders */ 684 --style-border-width: 1px; 685 --style-border-radius-xs: 0.2rem; 686 --style-border-radius-sm: 0.6rem; 687 --style-border-radius-md: 0.8rem; 688 --style-border-radius-50: 50%; 689 --style-border-radius-lg: 1rem; 690 --style-border-radius-pills: 40px; 691 --style-border-radius-inputs: 4px; 692 --style-border-radius-buttons-primary: 14px; 693 --style-border-radius-buttons-secondary: 14px; 694 --style-border-width-primary: 0px; 695 --style-border-width-secondary: 1px; 696 --style-border-width-inputs: 1px; 697 --style-border-radius-popover: 14px; 698 --style-border-popover: 1px solid ; 699 --style-border-drawer: 1px solid ; 700 --style-border-swatch-opacity: 10%; 701 --style-border-swatch-width: 1px; 702 --style-border-swatch-style: solid; 703 704 /* Animation */ 705 --ease-out-cubic: cubic-bezier(0.33, 1, 0.68, 1); 706 --ease-out-quad: cubic-bezier(0.32, 0.72, 0, 1); 707 --ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955); 708 --animation-speed-fast: 0.0625s; 709 --animation-speed: 0.125s; 710 --animation-speed-slow: 0.2s; 711 --animation-speed-medium: 0.15s; 712 --animation-easing: ease-in-out; 713 --animation-slideshow-easing: cubic-bezier(0.4, 0, 0.2, 1); 714 --drawer-animation-speed: 0.2s; 715 --animation-values-slow: var(--animation-speed-slow) var(--animation-easing); 716 --animation-values: var(--animation-speed) var(--animation-easing); 717 --animation-values-fast: var(--animation-speed-fast) var(--animation-easing); 718 --animation-values-allow-discrete: var(--animation-speed) var(--animation-easing) allow-discrete; 719 --animation-timing-hover: cubic-bezier(0.25, 0.46, 0.45, 0.94); 720 --animation-timing-active: cubic-bezier(0.5, 0, 0.75, 0); 721 --animation-timing-bounce: cubic-bezier(0.34, 1.56, 0.64, 1); 722 --animation-timing-default: cubic-bezier(0, 0, 0.2, 1); 723 --animation-timing-fade-in: cubic-bezier(0.16, 1, 0.3, 1); 724 --animation-timing-fade-out: cubic-bezier(0.4, 0, 0.2, 1); 725 /* Spring definitions suffixed with perceptual duration (d<ms>) and bounce (b<%>)*/ 726 --spring-d300-b0-easing: linear(0, 0.0033 0.81%, 0.027 2.42%, 0.0916 4.84%, 0.4745 15.32%, 0.6422 20.97%, 0.7175, 0.7789, 0.8283 30.64%, 0.876, 0.9111 38.71%, 0.941, 0.9611 48.39%, 0.9707, 0.978 54.84%, 0.9885 62.1%, 0.9949 70.97%, 0.9982 82.26%, 0.9997 100%); 727 --spring-d300-b0-duration: 0.4980s; 728 --spring-d280-b0-easing: linear(0, 0.0044, 0.0164 1.85%, 0.085 4.63%, 0.4571 14.81%, 0.575 18.52%, 0.6505, 0.7148 24.07%, 0.7849, 0.8393, 0.8809 35.18%, 0.9189, 0.9453 44.44%, 0.9662, 0.9793 55.55%, 0.9894 62.95%, 0.995 71.28%, 0.9982 82.39%, 0.9997 99.98%); 729 --spring-d280-b0-duration: 0.4648s; 730 --spring-d260-b0-easing: linear(0, 0.0058, 0.0216 2.15%, 0.0748 4.29%, 0.4646 15.03%, 0.5673, 0.655, 0.7279, 0.7872, 0.8349, 0.8727 34.36%, 0.9107, 0.9379 42.95%, 0.9609 48.31%, 0.9778 54.76%, 0.9887 62.27%, 0.9948 70.86%, 0.9983 82.67%, 0.9997 99.85%); 731 --spring-d260-b0-duration: 0.4316s; 732 --spring-d220-b0-easing: linear( 733 0, 734 0.0093 1.37%, 735 0.0696 4.12%, 736 0.4667 15.09%, 737 0.6322 20.58%, 738 0.6986 23.32%, 739 0.7793 27.44%, 740 0.8219 30.18%, 741 0.8721, 742 0.9089 38.42%, 743 0.9427, 744 0.9644, 745 0.978 54.88%, 746 0.9881 61.74%, 747 0.9944 69.97%, 748 0.998 80.95%, 749 0.9996 98.78% 750 ); 751 --spring-d220-b0-duration: 0.3818s; 752 --spring-d180-b0-easing: linear(0, 0.0234, 0.0805 4.48%, 0.4865 15.68%, 0.6211 20.16%, 0.7696 26.88%, 0.8064 29.12%, 0.8646, 0.9063, 0.9358, 0.9563 47.04%, 0.9757, 0.9867 60.48%, 0.9941 69.44%, 0.9979 80.64%, 0.9996 98.56%); 753 --spring-d180-b0-duration: 0.2988s; 754 755 /* View transitions */ 756 /* View transition old */ 757 --view-transition-old-main-content: var(--animation-speed) var(--animation-easing) both fadeOut; 758 759 /* View transition new */ 760 --view-transition-new-main-content: var(--animation-speed) var(--animation-easing) both fadeIn, var(--animation-speed) var(--animation-easing) both slideInTopViewTransition; 761 762 /* Focus */ 763 --focus-outline-width: 0.09375rem; 764 --focus-outline-offset: 0.2em; 765 766 /* Badges */ 767 --badge-blob-padding-block: 1px; 768 --badge-blob-padding-inline: 12px 8px; 769 --badge-rectangle-padding-block: 1px; 770 --badge-rectangle-padding-inline: 6px; 771 @media screen and (min-width: 750px) { 772 --badge-blob-padding-block: 4px; 773 --badge-blob-padding-inline: 16px 12px; 774 --badge-rectangle-padding-block: 4px; 775 --badge-rectangle-padding-inline: 10px; 776 } 777 778 /* Icons */ 779 --icon-size-2xs: 0.6rem; 780 --icon-size-xs: 0.85rem; 781 --icon-size-sm: 1.25rem; 782 --icon-size-md: 1.375rem; 783 --icon-size-lg: 1.5rem; 784 --icon-stroke-width: 1.5px; 785 786 /* Input */ 787 --input-email-min-width: 200px; 788 --input-search-max-width: 650px; 789 --input-padding-y: 0.8rem; 790 --input-padding-x: 0.8rem; 791 --input-padding: var(--input-padding-y) var(--input-padding-x); 792 --input-box-shadow-width: var(--style-border-width-inputs); 793 --input-box-shadow: 0 0 0 var(--input-box-shadow-width) var(--color-input-border); 794 --input-box-shadow-focus: 0 0 0 calc(var(--input-box-shadow-width) + 0.5px) var(--color-input-border); 795 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 796 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5)); 797 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50));
798 --input-textarea-min-height: 55px; 799 800 /* Checkbox */ 801 --checkbox-size: 22px; 802 --checkbox-border-radius: 7px; 803 --checkbox-border: 1px solid rgb(var(--color-foreground-rgb) / var(--opacity-35-55)); 804 --checkbox-label-padding: 8px; 805 806 @media screen and (min-width: 750px) { 807 --checkbox-size: 16px; 808 --checkbox-border-radius: 5px; 809 --checkbox-label-padding: 6px; 810 } 811 812 /* Button size */ 813 --button-size-sm: 30px; 814 --button-size-md: 36px; 815 --button-size: var(--minimum-touch-target); 816 --button-padding-inline: 24px; 817 --button-padding-block: 16px; 818 819 /* Button font-family */ 820 --button-font-family-primary: var(--font-body--family); 821 --button-font-family-secondary: var(--font-body--family); 822 823 /* Button text case */ 824 --button-text-case: ; 825 --button-text-case-primary: default; 826 --button-text-case-secondary: default; 827 828 /* Borders */ 829 --border-color: rgb(var(--color-border-rgb) / var(--opacity-50)); 830 --border-width-sm: 1px; 831 --border-width-md: 2px; 832 --border-width-lg: 5px; 833 --border-radius-sm: 0.25rem; 834 835 /* Drawers */ 836 --drawer-inline-padding: 25px; 837 --drawer-menu-inline-padding: 2.5rem; 838 --drawer-header-block-padding: 20px; 839 --drawer-content-block-padding: 10px; 840 --drawer-header-desktop-top: 0rem; 841 --drawer-padding: calc(var(--padding-sm) + 7px); 842 --drawer-height: 100dvh; 843 --drawer-width: 95vw; 844 --drawer-max-width: 500px; 845 846 /* Variant Picker Swatches */ 847 --variant-picker-swatch-width-unitless: 34; 848 --variant-picker-swatch-height-unitless: 34; 849 --variant-picker-swatch-width: 34px; 850 --variant-picker-swatch-height: 34px; 851 --variant-picker-swatch-radius: 32px; 852 --variant-picker-border-width: 1px; 853 --variant-picker-border-style: solid; 854 --variant-picker-border-opacity: 10%; 855 856 /* Variant Picker Buttons */ 857 --variant-picker-button-radius: 14px; 858 --variant-picker-button-border-width: 1px; 859 --variant-option-label-color: var(--color, var(--color-foreground)); 860 861 /* Slideshow */ 862 --slideshow-controls-size: 3.5rem; 863 --slideshow-controls-icon: 2rem; 864 --peek-next-slide-size: 3rem; 865 866 /* Utilities */ 867 --backdrop-opacity: 0.15; 868 --backdrop-color-rgb: var(--color-shadow-rgb); 869 --minimum-touch-target: 44px; 870 --disabled-opacity: 0.5; 871 --skeleton-opacity: 0.025; 872 873 /* Shapes */ 874 --shape--circle: circle(50% at center); 875 --shape--sunburst: polygon(100% 50%,94.62% 55.87%,98.3% 62.94%,91.57% 67.22%,93.3% 75%,85.7% 77.39%,85.36% 85.36%,77.39% 85.7%,75% 93.3%,67.22% 91.57%,62.94% 98.3%,55.87% 94.62%,50% 100%,44.13% 94.62%,37.06% 98.3%,32.78% 91.57%,25% 93.3%,22.61% 85.7%,14.64% 85.36%,14.3% 77.39%,6.7% 75%,8.43% 67.22%,1.7% 62.94%,5.38% 55.87%,0% 50%,5.38% 44.13%,1.7% 37.06%,8.43% 32.78%,6.7% 25%,14.3% 22.61%,14.64% 14.64%,22.61% 14.3%,25% 6.7%,32.78% 8.43%,37.06% 1.7%,44.13% 5.38%,50% 0%,55.87% 5.38%,62.94% 1.7%,67.22% 8.43%,75% 6.7%,77.39% 14.3%,85.36% 14.64%,85.7% 22.61%,93.3% 25%,91.57% 32.78%,98.3% 37.06%,94.62% 44.13%); 876 --shape--diamond: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); 877 --shape--blob: polygon(85.349% 11.712%, 87.382% 13.587%, 89.228% 15.647%, 90.886% 17.862%, 92.359% 20.204%, 93.657% 22.647%, 94.795% 25.169%, 95.786% 27.752%, 96.645% 30.382%, 97.387% 33.048%, 98.025% 35.740%, 98.564% 38.454%, 99.007% 41.186%, 99.358% 43.931%, 99.622% 46.685%, 99.808% 49.446%, 99.926% 52.210%, 99.986% 54.977%, 99.999% 57.744%, 99.975% 60.511%, 99.923% 63.278%, 99.821% 66.043%, 99.671% 68.806%, 99.453% 71.565%, 99.145% 74.314%, 98.724% 77.049%, 98.164% 79.759%, 97.433% 82.427%, 96.495% 85.030%, 95.311% 87.529%, 93.841% 89.872%, 92.062% 91.988%, 89.972% 93.796%, 87.635% 95.273%, 85.135% 96.456%, 82.532% 97.393%, 79.864% 98.127%, 77.156% 98.695%, 74.424% 99.129%, 71.676% 99.452%, 68.918% 99.685%, 66.156% 99.844%, 63.390% 99.942%, 60.624% 99.990%, 57.856% 99.999%, 55.089% 99.978%, 52.323% 99.929%, 49.557% 99.847%, 46.792% 99.723%, 44.031% 99.549%, 41.273% 99.317%, 38.522% 99.017%, 35.781% 98.639%, 33.054% 98.170%, 30.347% 97.599%, 27.667% 96.911%, 25.024% 96.091%, 22.432% 95.123%, 19.907% 93.994%, 17.466% 92.690%, 15.126% 91.216%, 12.902% 89.569%, 10.808% 87.761%, 8.854% 85.803%, 7.053% 83.703%, 5.418% 81.471%, 3.962% 79.119%, 2.702% 76.656%, 1.656% 74.095%, 0.846% 71.450%, 0.294% 68.740%, 0.024% 65.987%, 0.050% 63.221%, 0.343% 60.471%, 0.858% 57.752%, 1.548% 55.073%, 2.370% 52.431%, 3.283% 49.819%, 4.253% 47.227%, 5.249% 44.646%, 6.244% 42.063%, 7.211% 39.471%, 8.124% 36.858%, 8.958% 34.220%, 9.711% 31.558%, 10.409% 28.880%, 11.083% 26.196%, 11.760% 23.513%, 12.474% 20.839%, 13.259% 18.186%, 14.156% 15.569%, 15.214% 13.012%, 16.485% 10.556%, 18.028% 8.261%, 19.883
877% 6.211%, 22.041% 4.484%, 24.440% 3.110%, 26.998% 2.057%, 29.651% 1.275%, 32.360% 0.714%, 35.101% 0.337%, 37.859% 0.110%, 40.624% 0.009%, 43.391% 0.016%, 46.156% 0.113%, 48.918% 0.289%, 51.674% 0.533%, 54.425% 0.837%, 57.166% 1.215%, 59.898% 1.654%, 62.618% 2.163%, 65.322% 2.750%, 68.006% 3.424%, 70.662% 4.197%, 73.284% 5.081%, 75.860% 6.091%, 78.376% 7.242%, 80.813% 8.551%, 83.148% 10.036%, 85.349% 11.712%); 878 879 /* Buy buttons */ 880 --height-buy-buttons: calc(var(--padding-lg) * 2 + var(--icon-size-sm)); 881 882 /* Card image width and height variables */ 883 --card-width-small: 10rem; 884 885 --height-small: 10rem; 886 --height-medium: 11.5rem; 887 --height-large: 13rem; 888 --height-full: 100vh; 889 890 @media screen and (min-width: 750px) { 891 --height-small: 17.5rem; 892 --height-medium: 21.25rem; 893 --height-large: 25rem; 894 } 895 896 /* Modal */ 897 --modal-max-height: 65dvh; 898 --quick-add-modal-height: min(38.5rem, 96vh); 899 --quick-add-modal-width: min(54rem, 96vw); 900 --quick-add-modal-gallery-width: 24rem; 901 902 /* Card styles for search */ 903 --card-bg-hover: rgb(var(--color-foreground-rgb) / var(--opacity-5)); 904 --card-border-hover: rgb(var(--color-foreground-rgb) / var(--opacity-30)); 905 --card-border-focus: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 906 907 /* Cart */ 908 --cart-primary-font-family: var(--font-body--family); 909 --cart-primary-font-style: var(--font-body--style); 910 --cart-primary-font-weight: var(--font-body--weight); 911 --cart-secondary-font-family: var(--font-secondary--family); 912 --cart-secondary-font-style: var(--font-secondary--style); 913 --cart-secondary-font-weight: var(--font-secondary--weight); 914 } 915</style> 916 917 918 919 920 921 922 <style data-shopify> 923 .color-custom-popover, 924 .color-custom-popover .text-block { 925 /* Background */ 926 --color-background: #ffffff; 927 --color-background-rgb: 255 255 255; 928 929 /* Opacity values adjusted for background brightness */ 930 931--opacity-5-15: 0.05; --opacity-10-25: 0.1; --opacity-35-55: 0.35; --opacity-40-60: 9320.4; --opacity-30-60: 0.3; --opacity-60: 0.6; 933 934 935 936 /* Foreground / text — explicit or smart-contrasted */ 937 --color: #000000; 938 --color-rgb: 0 0 0; 939 --color-foreground: #000000; 940 --color-foreground-rgb: 0 0 0; 941 --color-foreground-muted: rgb(0 0 0 / var(--opacity-muted-text)); 942 --color-foreground-subdued: rgb(0 0 0 / var(--opacity-subdued-text)); 943 --color-border: #000000; 944 --color-border-rgb: 0 0 0; 945 946 } 947 948 949 .color-custom-popover { 950 /* Form-related tokens stay on .color-custom only — .text-block is a prose 951 container (text/announcement/inline-text/blog-post-description/ 952 collection-link/price/sku) and never holds form inputs. */ 953 --input-disabled-background-color: rgb(0 0 0 / var(--opacity-10)); 954 --input-disabled-border-color: rgb(0 0 0 / var(--opacity-5)); 955 --input-disabled-text-color: rgb(0 0 0 / var(--opacity-50)); 956 --checkbox-border: 1px solid rgb(0 0 0 / var(--opacity-35-55)); 957 } 958 959 960 .color-custom-popover { 961 color: var(--color, var(--color-foreground)); 962 background-color: var(--color-background); 963 } 964 </style> 965 966 967 968 969 970 971 972 973 <style data-shopify> 974 .color-custom-drawer, 975 .color-custom-drawer .text-block { 976 /* Background */ 977 --color-background: #ffffff; 978 --color-background-rgb: 255 255 255; 979 980 /* Opacity values adjusted for background brightness */ 981 982--opacity-5-15: 0.05; --opacity-10-25: 0.1; --opacity-35-55: 0.35; --opacity-40-60: 9830.4; --opacity-30-60: 0.3; --opacity-60: 0.6; 984 985 986 987 /* Foreground / text — explicit or smart-contrasted */ 988 --color: #000000; 989 --color-rgb: 0 0 0; 990 --color-foreground: #000000; 991 --color-foreground-rgb: 0 0 0; 992 --color-foreground-muted: rgb(0 0 0 / var(--opacity-muted-text)); 993 --color-foreground-subdued: rgb(0 0 0 / var(--opacity-subdued-text)); 994 --color-border: #000000; 995 --color-border-rgb: 0 0 0; 996 997 } 998 999 1000 .color-custom-drawer { 1001 /* Form-related tokens stay on .color-custom only — .text-block is a prose 1002 container (text/announcement/inline-text/blog-post-description/ 1003 collection-link/price/sku) and never holds form inputs. */ 1004 --input-disabled-background-color: rgb(0 0 0 / var(--opacity-10)); 1005 --input-disabled-border-color: rgb(0 0 0 / var(--opacity-5)); 1006 --input-disabled-text-color: rgb(0 0 0 / var(--opacity-50)); 1007 --checkbox-border: 1px solid rgb(0 0 0 / var(--opacity-35-55)); 1008 } 1009 1010 1011 .color-custom-drawer { 1012 color: var(--color, var(--color-foreground)); 1013 background-color: var(--color-background); 1014 } 1015 </style> 1016 1017 1018 1019 1020 1021 1022 1023 1024 <style data-shopify> 1025 .color-custom-badge-sale, 1026 .color-custom-badge-sale .text-block {
1027 /* Background */ 1028 --color-background: #ffffff; 1029 --color-background-rgb: 255 255 255; 1030 1031 /* Opacity values adjusted for background brightness */ 1032 1033--opacity-5-15: 0.05; --opacity-10-25: 0.1; --opacity-35-55: 0.35; --opacity-40-60: 10340.4; --opacity-30-60: 0.3; --opacity-60: 0.6; 1035 1036 1037 1038 /* Foreground / text — explicit or smart-contrasted */ 1039 --color: #000000; 1040 --color-rgb: 0 0 0; 1041 --color-foreground: #000000; 1042 --color-foreground-rgb: 0 0 0; 1043 --color-foreground-muted: rgb(0 0 0 / var(--opacity-muted-text)); 1044 --color-foreground-subdued: rgb(0 0 0 / var(--opacity-subdued-text)); 1045 --color-border: #000000; 1046 --color-border-rgb: 0 0 0; 1047 1048 } 1049 1050 1051 .color-custom-badge-sale { 1052 /* Form-related tokens stay on .color-custom only — .text-block is a prose 1053 container (text/announcement/inline-text/blog-post-description/ 1054 collection-link/price/sku) and never holds form inputs. */ 1055 --input-disabled-background-color: rgb(0 0 0 / var(--opacity-10)); 1056 --input-disabled-border-color: rgb(0 0 0 / var(--opacity-5)); 1057 --input-disabled-text-color: rgb(0 0 0 / var(--opacity-50)); 1058 --checkbox-border: 1px solid rgb(0 0 0 / var(--opacity-35-55)); 1059 } 1060 1061 1062 .color-custom-badge-sale { 1063 color: var(--color, var(--color-foreground)); 1064 background-color: var(--color-background); 1065 } 1066 </style> 1067 1068 1069 1070 1071 1072 1073 1074 1075 <style data-shopify> 1076 .color-custom-badge-sold-out, 1077 .color-custom-badge-sold-out .text-block { 1078 /* Background */ 1079 --color-background: #eef1ea; 1080 --color-background-rgb: 238 241 234; 1081 1082 /* Opacity values adjusted for background brightness */ 1083 1084--opacity-5-15: 0.05; --opacity-10-25: 0.1; --opacity-35-55: 0.35; --opacity-40-60: 10850.4; --opacity-30-60: 0.3; --opacity-60: 0.6; 1086 1087 1088 1089 /* Foreground / text — explicit or smart-contrasted */ 1090 --color: #000000; 1091 --color-rgb: 0 0 0; 1092 --color-foreground: #000000; 1093 --color-foreground-rgb: 0 0 0; 1094 --color-foreground-muted: rgb(0 0 0 / var(--opacity-muted-text)); 1095 --color-foreground-subdued: rgb(0 0 0 / var(--opacity-subdued-text)); 1096 --color-border: #000000; 1097 --color-border-rgb: 0 0 0; 1098 1099 } 1100 1101 1102 .color-custom-badge-sold-out { 1103 /* Form-related tokens stay on .color-custom only — .text-block is a prose 1104 container (text/announcement/inline-text/blog-post-description/ 1105 collection-link/price/sku) and never holds form inputs. */ 1106 --input-disabled-background-color: rgb(0 0 0 / var(--opacity-10)); 1107 --input-disabled-border-color: rgb(0 0 0 / var(--opacity-5)); 1108 --input-disabled-text-color: rgb(0 0 0 / var(--opacity-50)); 1109 --checkbox-border: 1px solid rgb(0 0 0 / var(--opacity-35-55)); 1110 } 1111 1112 1113 .color-custom-badge-sold-out { 1114 color: var(--color, var(--color-foreground)); 1115 background-color: var(--color-background); 1116 } 1117 </style> 1118 1119 1120 1121 1122 1123 1124 1125 1126 1127 1128 1129 1130 1131 1132 1133 1134 1135 1136<style data-shopify> 1137 /* Palette colors */ 1138 :root { 1139 --color-background: #ffffff; 1140 --color-background-rgb: 255 255 255; 1141 --color-foreground: #000000; 1142 --color-foreground-rgb: 0 0 0; 1143 --color-border: #000000; 1144 --color-border-rgb: 0 0 0; 1145 --palette-lightest: #ffffff; 1146 --palette-lightest-rgb: 255 255 255; 1147 --palette-darkest: #000000; 1148 --palette-darkest-rgb: 0 0 0; 1149 1150--opacity-5-15: 0.05; --opacity-10-25: 0.1; --opacity-35-55: 0.35; --opacity-40-60: 11510.4; --opacity-30-60: 0.3; --opacity-60: 0.6; 1152 1153 1154 --color-primary-button-text: rgb(255 255 255 / 1.0); 1155 --color-primary-button-background: rgb(0 0 0 / 1.0); 1156 --color-primary-button-border: rgb(0 0 0 / 1.0); 1157 --color-primary-button-focus-outline: rgb(0 0 0); 1158 --color-primary-button-hover-text: rgb(255 255 255 / 1.0); 1159 --color-primary-button-hover-background: #262626; 1160 --color-primary-button-hover-border: #262626; 1161 1162 --color-secondary-button-text: rgb(0 0 0 / 1.0); 1163 --color-secondary-button-background: rgb(0 0 0 / 0.0); 1164 --color-secondary-button-border: rgb(0 0 0 / 1.0); 1165 --color-secondary-button-hover-text: rgb(0 0 0 / 1.0); 1166 --color-secondary-button-hover-background: rgba(0, 0, 0, 0.15);
1167 --color-secondary-button-hover-border: #262626; 1168 1169 --color-input-background: rgb(255 255 255 / 1.0); 1170 --color-input-text: rgb(); 1171 --color-input-text-rgb: ; 1172 --color-input-border: rgb(); 1173 1174 --color-variant-background: rgb(255 255 255 / 1.0); 1175 --color-variant-border: rgb(); 1176 --color-variant-text: rgb(0 0 0 / 1.0); 1177 --color-variant-text-rgb: 0 0 0; 1178 --color-variant-hover-background: #f2f2f2; 1179 --color-variant-hover-text: rgb(0 0 0 / 1.0); 1180 --color-variant-hover-border: ; 1181 1182 --color-selected-variant-background: rgb(0 0 0 / 1.0); 1183 --color-selected-variant-border: rgb(0 0 0 / 1.0); 1184 --color-selected-variant-text: rgb(255 255 255 / 1.0); 1185 --color-selected-variant-hover-background: #262626; 1186 --color-selected-variant-hover-text: rgb(255 255 255 / 1.0); 1187 --color-selected-variant-hover-border: #262626; 1188 1189 --input-disabled-background-color: rgb(var(--color-foreground-rgb) / var(--opacity-10)); 1190 --input-disabled-border-color: rgb(var(--color-foreground-rgb) / var(--opacity-5-15)); 1191 --input-disabled-text-color: rgb(var(--color-foreground-rgb) / var(--opacity-50)); 1192 --color-foreground-muted: rgb(var(--color-rgb, var(--color-foreground-rgb)) / var(--opacity-muted-text)); 1193 --color-foreground-subdued: rgb(var(--color-rgb, var(--color-foreground-rgb)) / var(--opacity-subdued-text)); 1194 --color-drawer-shadow-rgb: ; 1195 --color-popover-shadow-rgb: 0 0 0; 1196 1197 /* Shadows */ 1198 1199 1200 --shadow-blur: 20px; 1201 --shadow-popover: 0px 4px 20px rgb(var(--color-popover-shadow-rgb) / var(--opacity-15)); 1202 1203 } 1204 1205 body { 1206 color: var(--color-foreground); 1207 background-color: var(--color-background); 1208 } 1209</style> 1210 1211 1212
1212<script>window.performance && window.performance.mark && window.performance.mark('shopify.content_for_header.start');</script>
1212<meta id="shopify-digital-wallet" name="shopify-digital-wallet" content="/68041408610/digital_wallets/dialog"> 1213<link rel="ucp" href="/.well-known/ucp" version="2026-08-25"><link rel="alternate" type="application/atom+xml" title="Feed" href="/blogs/resources.atom" /> 1214<link rel="next" href="/blogs/resources?page=2">
1215<script async="async" src="/checkouts/internal/preloads.js?locale=en-IN"></script>
vendor: 1 bytes, line 1215
1215
1216<script id="shopify-features" type="application/json">{"accessToken":"b049ddb14d3368ace2dfa827bd633a79","betas":["rich-media-storefront-analytics"],"domain":"www.tagalys.com","predictiveSearch":true,"shopId":68041408610,"locale":"en"}</script>
vendor: 1 bytes, line 1216
1216
1217<script>var Shopify = Shopify || {}; 1218Shopify.shop = "24e3cw-g8.myshopify.com"; 1219Shopify.locale = "en"; 1220Shopify.currency = {"active":"USD","rate":"1.0"}; 1221Shopify.country = "IN"; 1222Shopify.theme = {"name":"Tagalys Website (Live)","id":143353708642,"schema_name":"Horizon","schema_version":"4.0.0","theme_store_id":null,"role":"main"}; 1223Shopify.theme.handle = "null"; 1224Shopify.theme.style = {"id":null,"handle":null}; 1225Shopify.cdnHost = "www.tagalys.com/cdn"; 1226Shopify.routes = Shopify.routes || {}; 1227Shopify.routes.root = "/"; 1228Shopify.shopJsCdnBaseUrl = "https://cdn.shopify.com/shopifycloud/shop-js"; 1229Shopify.SignInWithShop = Shopify.SignInWithShop || {}; 1230Shopify.SignInWithShop.User = Shopify.SignInWithShop.User || {}; 1231Shopify.SignInWithShop.User.recognized = false;</script>
vendor: 1 bytes, line 1231
1231
1232<script type="module">!function(o){(o.Shopify=o.Shopify||{}).modules=!0}(window);</script>
vendor: 1 bytes, line 1232
1232
1233<script>!function(o){function n(){var o=[];function n(){o.push(Array.prototype.slice.apply(arguments))}return n.q=o,n}var t=o.Shopify=o.Shopify||{};t.loadFeatures=n(),t.autoloadFeatures=n()}(window);</script>
vendor: 1 bytes, line 1233
1233
1234<script> 1235 window.Shopify = window.Shopify || {}; 1236 window.Shopify.SignInWithShop = window.Shopify.SignInWithShop || {}; 1237 window.Shopify.SignInWithShop.assetMetrics = { sampleRate: 0.25 }; 1238 window.Shopify.SignInWithShop.eligible = true; 1239</script>
vendor: 1 bytes, line 1239
1239
1240<script id="shop-js-analytics" type="application/json">{"pageType":"blog"}</script>
vendor: 1 bytes, line 1240
1240
1241<script defer="defer" async type="module" src="https://cdn.shopify.com/shopifycloud/shop-js/modules/v2/loader.init-shop-cart-sync.en.esm.js"></script>
vendor: 1 bytes, line 1241
1241
1242<script type="module"> 1243 await import("https://cdn.shopify.com/shopifycloud/shop-js/modules/v2/loader.init-shop-cart-sync.en.esm.js"); 1244 1245 window.Shopify.SignInWithShop?.initShopCartSync?.({"fedCMEnabled":true,"windoidEnabled":true}); 1246 1247</script>
vendor: 1 bytes, line 1247
1247
1248<script> 1249 window.Shopify = window.Shopify || {}; 1250 if (!window.Shopify.featureAssets) window.Shopify.featureAssets = {}; 1251 window.Shopify.featureAssets['shop-js'] = {"avatar":["modules/v2/loader.avatar.en.esm.js"],"checkout-modal":["modules/v2/loader.checkout-modal.en.esm.js"],"init-customer-accounts-sign-up":["modules/v2/loader.init-customer-accounts-sign-up.en.esm.js"],"init-customer-accounts":["modules/v2/loader.init-customer-accounts.en.esm.js"],"init-fed-cm":["modules/v2/loader.init-fed-cm.en.esm.js"],"init-shop-cart-sync":["modules/v2/loader.init-shop-cart-sync.en.esm.js"],"init-shop-email-lookup-coordinator":["modules/v2/loader.init-shop-email-lookup-coordinator.en.esm.js"],"init-shop-for-new-customer-accounts":["modules/v2/loader.init-shop-for-new-customer-accounts.en.esm.js"],"init-shop-user-recognition":["modules/v2/loader.init-shop-user-recognition.en.esm.js"],"init-windoid":["modules/v2/loader.init-windoid.en.esm.js"],"lead-capture":["modules/v2/loader.lead-capture.en.esm.js"],"listener":["modules/v2/loader.listener.en.esm.js"],"pay-button":["modules/v2/loader.pay-button.en.esm.js"],"payment-terms":["modules/v2/loader.payment-terms.en.esm.js"],"shop-button":["modules/v2/loader.shop-button.en.esm.js"],"shop-cart-sync":["modules/v2/loader.shop-cart-sync.en.esm.js"],"shop-cash-offers":["modules/v2/loader.shop-cash-offers.en.esm.js"],"shop-follow-button":["modules/v2/loader.shop-follow-button.en.esm.js"],"shop-login-button":["modules/v2/loader.shop-login-button.en.esm.js"],"shop-login":["modules/v2/loader.shop-login.en.esm.js"],"shop-toast-manager":["modules/v2/loader.shop-toast-manager.en.esm.js"],"shop-user-recognition":["modules/v2/loader.shop-user-recognition.en.esm.js"]}; 1252</script>
vendor: 1 bytes, line 1252
1252
1253<script id="__st">var __st={"a":68041408610,"offset":19800,"reqid":"0831a211-714e-4833-bccd-4583135fd718-1790360305","pageurl":"www.tagalys.com\/blogs\/resources","s":"blogs-90637598818","u":"1e1bb0d9e283","p":"blog","rtyp":"blog","rid":90637598818};</script>
vendor: 1 bytes, line 1253
1253
1254<script>window.ShopifyPaypalV4VisibilityTracking = true;</script>
vendor: 1 bytes, line 1254
1254
1255<script id="captcha-bootstrap">!function(){'use strict';const t='contact',e='account',n='new_comment',o=[[t,t],['blogs',n],['comments',n],[t,'customer']],c=[[e,'customer_login'],[e,'guest_login'],[e,'recover_customer_password'],[e,'create_customer']],r=t=>t.map((([t,e])=>`form[action*='/${t}']:not([data-nocaptcha='true']) input[name='form_type'][value='${e}']`)).join(','),a=t=>()=>t?[...document.querySelectorAll(t)].map((t=>t.form)):[];function s(){const t=[...o],e=r(t);return a(e)}const i='password',u='form_key',d=['recaptcha-v3-token','g-recaptcha-response','h-captcha-response',i],f=()=>{try{return window.sessionStorage}catch{return}},m='__shopify_v',_=t=>t.elements[u];function p(t,e,n=!1){try{const o=window.sessionStorage,c=JSON.parse(o.getItem(e)),{data:r}=function(t){const{data:e,action:n}=t;return t[m]||n?{data:e,action:n}:{data:t,action:n}}(c);for(const[e,n]of Object.entries(r))t.elements[e]&&(t.elements[e].value=n);n&&o.removeItem(e)}catch(o){console.error('form repopulation failed',{error:o})}}const l='form_type',E='cptcha';function T(t){t.dataset[E]=!0}const w=window,h=w.document,L='Shopify',v='ce_forms',y='captcha';let A=!1;((t,e)=>{const n=(g='f06e6c50-85a8-45c8-87d0-21a2b65856fe',I='https://cdn.shopify.com/shopifycloud/storefront-forms-hcaptcha/ce_storefront_forms_captcha_hcaptcha.v1.5.3.iife.js',D={infoText:'Protected by hCaptcha',privacyText:'Privacy',termsText:'Terms'},(t,e,n)=>{const o=w[L][v],c=o.bindForm;if(c)return c(t,g,e,D).then(n);var r;o.q.push([[t,g,e,D],n]),r=I,A||(h.body.append(Object.assign(h.createElement('script'),{id:'captcha-provider',async:!0,src:r})),A=!0)});var g,I,D;w[L]=w[L]||{},w[L][v]=w[L][v]||{},w[L][v].q=[],w[L][y]=w[L][y]||{},w[L][y].protect=function(t,e){n(t,void 0,e),T(t)},Object.freeze(w[L][y]),function(t,e,n,w,h,L){const[v,y,A,g]=function(t,e,n){const i=e?o:[],u=t?c:[],d=[...i,...u],f=r(d),m=r(i),_=r(d.filter((([t,e])=>n.includes(e))));return[a(f),a(m),a(_),s()]}(w,h,L),I=t=>{const e=t.target;return e instanceof HTMLFormElement?e:e&&e.form},D=t=>v().includes(t);t.addEventListener('submit',(t=>{const e=I(t);if(!e)return;const n=D(e)&&!e.dataset.hcaptchaBound&&!e.dataset.recaptchaBound,o=_(e),c=g().includes(e)&&(!o||!o.value);(n||c)&&t.preventDefault(),c&&!n&&(function(t){try{if(!f())return;!function(t){const e=f();if(!e)return;const n=_(t);if(!n)return;const o=n.value;o&&e.removeItem(o)}(t);const e=Array.from(Array(32),(()=>Math.random().toString(36)[2])).join('');!function(t,e){_(t)||t.append(Object.assign(document.createElement('input'),{type:'hidden',name:u})),t.elements[u].value=e}(t,e),function(t,e){const n=f();if(!n)return;const o=[...t.querySelectorAll(`input[type='${i}']`)].map((({name:t})=>t)),c=[...d,...o],r={};for(const[a,s]of new FormData(t).entries())c.includes(a)||(r[a]=s);n.setItem(e,JSON.stringify({[m]:1,action:t.action,data:r}))}(t,e)}catch(e){console.error('failed to persist form',e)}}(e),e.submit())}));const S=(t,e)=>{t&&!t.dataset[E]&&(n(t,e.some((e=>e===t))),T(t))};for(const o of['focusin','change'])t.addEventListener(o,(t=>{const e=I(t);D(e)&&S(e,y())}));const B=e.get('form_key'),M=e.get(l),P=B&&M;t.addEventListener('DOMContentLoaded',(()=>{const t=y();if(P)for(const e of t)e.elements[l].value===M&&p(e,B);[...new Set([...A(),...v().filter((t=>'true'===t.dataset.shopifyCaptcha))])].forEach((e=>S(e,t)))}))}(h,new URLSearchParams(w.location.search),n,t,e,['guest_login'])})(!0,!0)}();</script>
vendor: 1 bytes, line 1255
1255
1256<script integrity="sha256-JjoPp5ZfB1sSAs5SQaol1x1GgvveM+BgmRzyDexInEQ=" data-source-attribution="shopify.loadfeatures" defer="defer" src="//www.tagalys.com/cdn/shopifycloud/storefront/assets/storefront/load_feature-1bd60354.js" crossorigin="anonymous"></script>
vendor: 1 bytes, line 1256
1256
1257<script>(function () {var userAgent = navigator.userAgent;var platform = navigator.platform;var maxTouchPoints = navigator.maxTouchPoints || 0;var isIOS = /iPad|iPhone|iPod/.test(platform) || (platform === 'MacIntel' && maxTouchPoints > 1);var isMacSafari = platform.indexOf('Mac') === 0 && /Safari/.test(userAgent) && !/Chrome|Chromium|CriOS|FxiOS|Edg|OPR|Android/.test(userAgent);var isAppleSafari = isIOS || isMacSafari;if (isAppleSafari) {fetch('/sf_private_access_tokens' + location.search).catch(function () {});}function browserMajorVersion(pattern) {var match = userAgent.match(pattern);return match ? parseInt(match[1], 10) : null;}function shouldLoadAutosizesPolyfill() {if (!window.PerformanceObserver?.supportedEntryTypes?.includes('paint')) {return false;}var chromeVersion = browserMajorVersion(/Chrome\/(\d+)/);if (chromeVersion !== null) {return chromeVersion < 126;}var firefoxVersion = browserMajorVersion(/Firefox\/(\d+)/);if (firefoxVersion !== null) {return firefoxVersion < 150;}var safariVersion = isAppleSafari ? browserMajorVersion(/Version\/(\d+).*Safari\//) : null;if (safariVersion !== null) {return safariVersion < 27;}return true;}if (shouldLoadAutosizesPolyfill()) {var autosizesScript = document.createElement('script');autosizesScript.async = true;autosizesScript.crossOrigin = 'anonymous';autosizesScript.src = "//www.tagalys.com/cdn/shopifycloud/storefront/assets/storefront/autosizes-84416378.js";(document.head || document.documentElement).appendChild(autosizesScript);}window.ShopifyAnalytics = window.ShopifyAnalytics || {};window.ShopifyAnalytics.performance = window.ShopifyAnalytics.performance || {};(function () {var LONG_FRAME_THRESHOLD = 50;var longAnimationFrames = [];var activeRafId = null;function collectLongFrames() {var previousTime = null;function rafMonitor(now) {if (activeRafId === null) {return;}var delta = now - previousTime;if (delta > LONG_FRAME_THRESHOLD) {longAnimationFrames.push({startTime: previousTime,endTime: now,});}previousTime = now;activeRafId = requestAnimationFrame(rafMonitor);}previousTime = performance.now();activeRafId = requestAnimationFrame(rafMonitor);}if (!window.PerformanceObserver?.supportedEntryTypes?.includes('long-animation-frame')) {collectLongFrames();var timeoutId = setTimeout(function () {cancelAnimationFrame(activeRafId);}, 10000);window.ShopifyAnalytics.performance.getLongAnimationFrames = function (stopCollection) {if (stopCollection === undefined) {stopCollection = false;}if (stopCollection) {clearTimeout(timeoutId);cancelAnimationFrame(activeRafId);}return longAnimationFrames;};}})();})();</script>
1257<script id="shopify-origin-trials" async="async" integrity="sha256-qJbe/jEZBHtr5W/BlA2cKAz3vkXu6vJQyLjgvgCC86g=" src="//cdn.shopify.com/shopifycloud/storefront/assets/storefront/origin_trials-318ab40a.js" crossorigin="anonymous" onload="window.__shopifyOriginTrialsDone = true" onerror="window.__shopifyOriginTrialsDone = true"></script>
vendor: 1 bytes, line 1257
1257
1258<script> 1259 window.Shopify = window.Shopify || {}; 1260 window.Shopify.MCP = window.Shopify.MCP || {}; 1261 window.Shopify.MCP.enabled = true; 1262 window.Shopify.MCP.shop = "24e3cw-g8.myshopify.com"; 1263 window.Shopify.MCP.mcpEndpoint = "https:\/\/www.tagalys.com\/api\/mcp"; 1264 window.Shopify.MCP.tools = [{"name":"search_shop_policies_and_faqs","description":"Used to get facts about the stores policies, products, or services.\nSome examples of questions you can ask are:\n - What is your return policy?\n - What is your shipping policy?\n - What is your phone number?\n - What are your hours of operation?\"\n","inputSchema":{"$schema":"https:\/\/json-schema.org\/draft\/2020-12\/schema","type":"object","properties":{"query":{"type":"string","description":"A natural language query."},"context":{"type":"string","description":"Additional information about the request such as user demographics, mood, location, or other relevant details that could help in tailoring the response appropriately."}},"required":["query"]}}]; 1265</script>
vendor: 1 bytes, line 1265
1265
1266<script>(()=>{var d="shopify:webmcp_adapter_loaded",n=Symbol.for("shopify.webmcp_adapter_loading");function s(c,a,{win:r=window,doc:o=document}={}){function p(){try{return r.localStorage.getItem(d)==="true"}catch{return!1}}function l(){try{r.localStorage.setItem(d,"true")}catch{}}function u(){return typeof(o.modelContext||r.navigator?.modelContext)?.registerTool=="function"}function f(){if(r[n]||!u())return;let t=o.head||o.getElementsByTagName("head")[0];if(!t)return;let e=o.createElement("script");e.type="module",e.crossOrigin="anonymous",a&&(e.integrity=a),e.src=c,e.addEventListener("load",l,{once:!0}),e.addEventListener("error",()=>{r[n]=!1},{once:!0}),t.appendChild(e),r[n]=!0}function _(t){let e=o.getElementById("shopify-origin-trials");if(!e||r.__shopifyOriginTrialsDone){t();return}e.addEventListener("load",t,{once:!0}),e.addEventListener("error",t,{once:!0})}function i(){_(()=>r.setTimeout(f,0))}function m(){o.addEventListener("DOMContentLoaded",i,{once:!0})}p()?i():m()}s("\/\/www.tagalys.com\/cdn\/shopifycloud\/storefront\/assets\/storefront\/webmcp-c6b62ece.js","sha256-ke4DDuBjdvea3vxLWxHc9E9nq8zihuG4IfYEGbb77ys=");})(); 1267</script>
vendor: 1 bytes, line 1267
1267
1268<script data-source-attribution="shopify.dynamic_checkout.dynamic.init">var Shopify=Shopify||{};Shopify.PaymentButton=Shopify.PaymentButton||{isStorefrontPortableWallets:!0,init:function(){window.Shopify.PaymentButton.init=function(){};var t=document.createElement("script");t.src="https://www.tagalys.com/cdn/shopifycloud/portable-wallets/latest/portable-wallets.en.js",t.type="module",document.head.appendChild(t)}}; 1269</script>
vendor: 1 bytes, line 1269
1269
1270<script data-source-attribution="shopify.dynamic_checkout.buyer_consent"> 1271 function portableWalletsHideBuyerConsent(e){var t=document.getElementById("shopify-buyer-consent"),n=document.getElementById("shopify-subscription-policy-button");t&&n&&(t.classList.add("hidden"),t.setAttribute("aria-hidden","true"),n.removeEventListener("click",e))}function portableWalletsShowBuyerConsent(e){var t=document.getElementById("shopify-buyer-consent"),n=document.getElementById("shopify-subscription-policy-button");t&&n&&(t.classList.remove("hidden"),t.removeAttribute("aria-hidden"),n.addEventListener("click",e))}window.Shopify?.PaymentButton&&(window.Shopify.PaymentButton.hideBuyerConsent=portableWalletsHideBuyerConsent,window.Shopify.PaymentButton.showBuyerConsent=portableWalletsShowBuyerConsent); 1272</script>
vendor: 1 bytes, line 1272
1272
1273<script data-source-attribution="shopify.dynamic_checkout.cart.bootstrap">document.addEventListener("DOMContentLoaded",(function(){function t(){return document.querySelector("shopify-accelerated-checkout-cart, shopify-accelerated-checkout")}if(t())Shopify.PaymentButton.init();else{new MutationObserver((function(e,n){t()&&(Shopify.PaymentButton.init(),n.disconnect())})).observe(document.body,{childList:!0,subtree:!0})}})); 1274</script>
1274 1275<link rel="stylesheet" media="screen" href="//www.tagalys.com/cdn/shop/t/7/compiled_assets/styles.css?v=152423887554529861201790323525">
1276<script id="shopify-cfh-end">window.performance && window.performance.mark && window.performance.mark('shopify.content_for_header.end');</script>
1276 1277 <!-- BEGIN app block: shopify://apps/consentmo-gdpr/blocks/gdpr_cookie_consent/4fbe573f-a377-4fea-9801-3ee0858cae41 --> 1278<link rel="preconnect" href="https://app.consentmo.com" crossorigin data-csm-preconnect="app"> 1279<link rel="dns-prefetch" href="https://workers.consentmo.com" data-csm-preconnect="workers"> 1280<link rel="dns-prefetch" href="https://storage.consentmo.com" data-csm-preconnect="storage"> 1281<link rel="preconnect" href="https://cdn.consentmo.com" crossorigin data-csm-preconnect="cdn"><link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0d7a2-a36b-73ee-b8cb-ead3ca4862c3/gdpr-backpack-896/assets/layout-cookie-bar.consentmo.js" crossorigin data-csm-layout-prefetch="banner"> 1282 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0d7a2-a36b-73ee-b8cb-ead3ca4862c3/gdpr-backpack-896/assets/layout-cookie-dialog.consentmo.js" crossorigin data-csm-layout-prefetch="dialog"> 1283 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0d7a2-a36b-73ee-b8cb-ead3ca4862c3/gdpr-backpack-896/assets/layout-cookie-box.consentmo.js" crossorigin data-csm-layout-prefetch="box"> 1284 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0d7a2-a36b-73ee-b8cb-ead3ca4862c3/gdpr-backpack-896/assets/layout-cookie-smart-banner.consentmo.js" crossorigin data-csm-layout-prefetch="smart"> 1285 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0d7a2-a36b-73ee-b8cb-ead3ca4862c3/gdpr-backpack-896/assets/layout-mobile-cookie-bar.consentmo.js" crossorigin data-csm-layout-prefetch="mobile">
1285<script> 1286(function () { 1287 try { 1288 document.documentElement.classList.add('csm-cookie-embed'); 1289 } catch (e) {} 1290})(); 1291</script>
1291<script data-consentmo-data-src-bootstrap> 1292(function () { 1293 'use strict'; 1294 if (window.__consentmoDataSrcBootstrapInit) return; 1295 window.__consentmoDataSrcBootstrapInit = true; 1296 1297 var DATA_SRC_SELECTOR = [ 1298 'script[data-src*="consentmo_cookie_consent"]', 1299 'script[data-src*="gdpr_cookie_consent.min"]', 1300 'script[data-src*="gdrp_cookie_consent_unlimited"]' 1301 ].join(','); 1302 1303 function activateConsentmoDataSrcScripts() { 1304 if (!window.Shopify || !window.Shopify.shop) return; 1305 document.querySelectorAll(DATA_SRC_SELECTOR).forEach(function (scriptEl) { 1306 // getAttribute: src="" must not count as "already has src" (.src === page URL). 1307 if (scriptEl.getAttribute('src')) return; 1308 var url = scriptEl.getAttribute('data-src'); 1309 if (!url) return; 1310 if (scriptEl.getAttribute('type') === 'text/plain') { 1311 scriptEl.removeAttribute('type'); 1312 } 1313 scriptEl.src = url; 1314 }); 1315 } 1316 function scheduleActivation() { 1317 activateConsentmoDataSrcScripts(); 1318 // Retry on next task so other DCL handlers (lazy-loaders) can finish setting Shopify.shop / data-src first. 1319 setTimeout(activateConsentmoDataSrcScripts, 0); 1320 } 1321 if (document.readyState === 'loading') { 1322 document.addEventListener('DOMContentLoaded', scheduleActivation, { once: true }); 1323 } else { 1324 scheduleActivation(); 1325 } 1326})(); 1327</script>
1327 1328 1329 1330<!-- END app block -->
1330<script src="https://cdn.shopify.com/extensions/01a0d7a2-a36b-73ee-b8cb-ead3ca4862c3/gdpr-backpack-896/assets/consentmo_cookie_consent.js" type="text/javascript" defer="defer"></script>
1330 1331<link href="https://monorail-edge.shopifysvc.com" rel="dns-prefetch">
1332<script>(function(){if ("sendBeacon" in navigator && "performance" in window) {try {var session_token_from_headers = performance.getEntriesByType('navigation')[0].serverTiming.find(x => x.name == '_s').description;} catch {var session_token_from_headers = undefined;}var session_cookie_matches = document.cookie.match(/_shopify_s=([^;]*)/);var session_token_from_cookie = session_cookie_matches && session_cookie_matches.length === 2 ? session_cookie_matches[1] : "";var session_token = session_token_from_headers || session_token_from_cookie || "";function handle_abandonment_event(e) {var entries = performance.getEntries().filter(function(entry) {return /monorail-edge.shopifysvc.com/.test(entry.name);});if (!window.abandonment_tracked && entries.length === 0) {window.abandonment_tracked = true;var currentMs = Date.now();var navigation_start = performance.timing.navigationStart;var payload = {shop_id: 68041408610,url: window.location.href,navigation_start,duration: currentMs - navigation_start,session_token,page_type: "blog"};window.navigator.sendBeacon("https://monorail-edge.shopifysvc.com/v1/produce", JSON.stringify({schema_id: "online_store_buyer_site_abandonment/1.1",payload: payload,metadata: {event_created_at_ms: currentMs,event_sent_at_ms: currentMs}}));}}window.addEventListener('pagehide', handle_abandonment_event);}}());</script>
vendor: 1 bytes, line 1332
1332
1333<script> 1334 window.__TREKKIE_SHIM_QUEUE = window.__TREKKIE_SHIM_QUEUE || []; 1335</script>
vendor: 1 bytes, line 1335
1335
1336<script>(function(){var wpmLoader=function(){"use strict";var e=/Googlebot|Storebot-Google|bingbot|Baiduspider|YandexBot|DuckDuckBot|Slurp|facebookexternalhit|Twitterbot|LinkedInBot|Applebot|AdsBot-Google|Mediapartners-Google|APIs-Google|PetalBot|SemrushBot|AhrefsBot|MJ12bot|DotBot|Acunetix|PerplexityBot|Perplexity-User/i,t=/bytedance/i;function i(){try{var e=document.cookie;if(!e||"string"!=typeof e)return;for(var t=0,i=e.split(";");t<i.length;t++){var n=i[t],r=n.indexOf("=");if(-1!==r){var o=n.slice(0,r).trim();if(o){var a=void 0;try{a=decodeURIComponent(o)}catch(e){a=o}if("_shopify_s"===a){var d=n.slice(r+1).trim();try{return decodeURIComponent(d)}catch(e){return d}}}}}return}catch(e){return}}function n(e){try{"undefined"!=typeof console&&"function"==typeof console.warn&&console.warn(e)}catch(e){}}function r(e,t){return"string"==typeof e&&e.length>0&&e.length<=t?e:void 0}function o(e){var t;switch(null==(t=null==e?void 0:e.navigation)?void 0:t.type){case 0:return"navigate";case 1:return"reload";case 2:return"back_forward";default:return}}function a(){var e,t,i;try{var n=null==(i=null==(t=null==(e=self.ShopifyAnalytics)?void 0:e.lib)?void 0:t.trekkie)?void 0:i.state;return"awaiting-consent"===n||"initialized"===n?n:void 0}catch(e){return}}return function(d,s,u,l){var c=arguments.length>4&&void 0!==arguments[4]?arguments[4]:{};try{var p=c.trekkieShim;!0!==p&&"true"!==p||null!=window.__TREKKIE_SHIM_QUEUE||(window.__TREKKIE_SHIM_QUEUE=[])}catch(e){}var f,v,h,y,g=(v=(f={modern:/Edge?\/(1{2}[4-9]|1[2-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Firefox\/(1{2}[4-9]|1[2-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Chrom(ium|e)\/(9{2}|\d{3,})\.\d+(\.\d+|)|(Maci|X1{2}).+ Version\/(15\.\d+|(1[6-9]|[2-9]\d|\d{3,})\.\d+)([,.]\d+|)( \(\w+\)|)( Mobile\/\w+|) Safari\/|Chrome.+OPR\/(9{2}|\d{3,})\.\d+\.\d+|(CPU[ +]OS|iPhone[ +]OS|CPU[ +]iPhone|CPU IPhone OS|CPU iPad OS)[ +]+(15[._]\d+|(1[6-9]|[2-9]\d|\d{3,})[._]\d+)([._]\d+|)|Android:?[ /-](14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})(\.\d+|)(\.\d+|)|Android.+Firefox\/(15\d|1[6-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+Chrom(ium|e)\/(14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|SamsungBrowser\/([2-9]\d|\d{3,})\.\d+/,legacy:/Edge?\/(1[6-9]|[2-9]\d|\d{3,})\.\d+(\.\d+|)|Firefox\/(5[4-9]|[6-9]\d|\d{3,})\.\d+(\.\d+|)|Chrom(ium|e)\/(5[1-9]|[6-9]\d|\d{3,})\.\d+(\.\d+|)([\d.]+$|.*Safari\/(?![\d.]+ Edge\/[\d.]+$))|(Maci|X1{2}).+ Version\/(10\.\d+|(1[1-9]|[2-9]\d|\d{3,})\.\d+)([,.]\d+|)( \(\w+\)|)( Mobile\/\w+|) Safari\/|Chrome.+OPR\/(3[89]|[4-9]\d|\d{3,})\.\d+\.\d+|(CPU[ +]OS|iPhone[ +]OS|CPU[ +]iPhone|CPU IPhone OS|CPU iPad OS)[ +]+(10[._]\d+|(1[1-9]|[2-9]\d|\d{3,})[._]\d+)([._]\d+|)|Android:?[ /-](14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})(\.\d+|)(\.\d+|)|Mobile Safari.+OPR\/([89]\d|\d{3,})\.\d+\.\d+|Android.+Firefox\/(15\d|1[6-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+Chrom(ium|e)\/(14[89]|1[5-9]\d|[2-9]\d{2}|\d{4,})\.\d+(\.\d+|)|Android.+(UC? ?Browser|UCWEB|U3)[ /]?(15\.([5-9]|\d{2,})|(1[6-9]|[2-9]\d|\d{3,})\.\d+)\.\d+|SamsungBrowser\/(5\.\d+|([6-9]|\d{2,})\.\d+)|Android.+MQ{2}Browser\/(14(\.(9|\d{2,})|)|(1[5-9]|[2-9]\d|\d{3,})(\.\d+|))(\.\d+|)|K[Aa][Ii]OS\/(3\.\d+|([4-9]|\d{2,})\.\d+)(\.\d+|)/}).modern,h=f.legacy,(y=navigator.userAgent).match(e)?"bot":y.match(v)?"modern":y.match(h)?"legacy":y.match(t)?"bot":"unknown"),m=function(e){var t,i,n=r(e,128);try{var a=window.performance,d=null==(t=null==a?void 0:a.getEntriesByType)?void 0:t.call(a,"navigation")[0];if(!d)return{requestId:n,navigationType:o(a)};var s="type"in d?r(d.type,64):void 0,u="serverTiming"in d&&Array.isArray(d.serverTiming)?d.serverTiming:[];return{requestId:null!=n?n:r(null==(i=u.find(function(e){return"requestID"===e.name}))?void 0:i.description,128),navigationType:s}}catch(e){return{requestId:n}}}(c.requestId),w=function(e){var t=e.version,r=e.browserTarget,o=e.surface,a=e.shopId,d=e.monorailEndpoint,s=window.location.href;return{emit:function(e){var u=e.status,l=e.errorMsg,c=e.failureReason,p=e.useKeepaliveFallback,f=void 0!==p&&p,v=e.navigationType,h=e.pagehidePersisted,y=e.requestId,g=e.trekkieState;if(d){var m,w;try{var b=(new Date).getTime();m=JSON.stringify({metadata:{event_sent_at_ms:b},events:[{schema_id:"web_pixels_manager_load/3.3",payload:{version:t,bundle_target:r,page_url:s,status:u,surface:o,error_msg:l,failure_reason:c,navigation_type:v,pagehide_persisted:h,request_id:y,trekkie_state:g,shop_id:a,visit_token:i()},metadata:{event_created_at_ms:b}}]})}catch(e){return}try{if("function"==typeof window.navigator.sendBeacon&&-1===(w=window.navigator.userAgent).indexOf("iPhone; CPU iPhone OS 12_")&&-1===w.indexOf("iPad; CPU OS 12_")&&-1===w.indexOf("iPod touch; CPU iPhone OS 12_")&&window.navigator.sendBeacon.bind(window.navigator)(d,m))return}catch(e){}if(f)try{"function"==typeof window.fetch&&window.fetch(d,{method:"POST",headers:{"Content-Type":"text/plain"},body:m,keepalive:!0}
1336).catch(function(){})}catch(e){}else try{var _=new XMLHttpRequest;_.open("POST",d,!0),_.setRequestHeader("Content-Type","text/plain"),_.send(m)}catch(e){n("[Web Pixels Manager] Got an unhandled error while logging to Monorail.")}}else n("[Web Pixels Manager] No Monorail endpoint provided, skipping logging.")}}}({version:u,browserTarget:g,surface:d.surface,shopId:d.shopId,monorailEndpoint:d.monorailEndpoint});if(Boolean(null==(_=null==(b=window.Shopify)?void 0:b.analytics)?void 0:_.replayQueue))w.emit({status:"setup-skipped",errorMsg:"replay queue already initialized."});else{var b,_;w.emit({status:"setup-started"}),window.Shopify=window.Shopify||{};var S=window.Shopify;S.analytics=S.analytics||{};var P=S.analytics;P.replayQueue=[],P.publish=function(e,t,i){return P.replayQueue.push([e,t,i]),!0};try{self.performance.mark("wpm:start")}catch(e){}var k,C="modern"===g?"modern":"legacy",E=(null!=l?l:{modern:"",legacy:""})[C],I=[(k={baseUrl:s,hashVersion:u,buildTarget:C}).baseUrl,"/wpm","/b",k.hashVersion,"modern"===k.buildTarget?"m":"l",".js"].join(""),O=!1,T=!1;try{c.browserTarget=g,function(){O=!0;try{window.addEventListener("pagehide",M)}catch(e){O=!1}}(),R(function(){try{R(x)}catch(e){D(e)}}),w.emit({status:"loading",requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()})}catch(e){D(e)}}function U(){var e;if(q(),!function(){var e,t;return Boolean(null==(t=null==(e=window.Shopify)?void 0:e.analytics)?void 0:t.initialized)}()){var t,i,n;try{if("function"!=typeof(null==(e=window.webPixelsManager)?void 0:e.init))return void A();if(!(null!==(n=i=t=window.webPixelsManager.init(d))&&"function"!=typeof n&&Object(n)===n&&"publish"in i&&"function"==typeof i.publish&&"publishCustomEvent"in i&&"function"==typeof i.publishCustomEvent&&"visitor"in i&&"function"==typeof i.visitor))return void A()}catch(e){return void A(e)}var r=window.Shopify.analytics;r.replayQueue.forEach(function(e){var i=e[0],n=e[1],r=e[2];t.publishCustomEvent(i,n,r)}),r.replayQueue=[],r.publish=t.publishCustomEvent,r.visitor=t.visitor,r.initialized=!0}}function A(e){B("manager_api_unavailable",void 0===e?void 0:Q(e))}function x(){B("script_load_failed","".concat(I," has failed to load"))}function B(e,t){T||(T=!0,q(),w.emit({status:"failed",errorMsg:t,failureReason:e,requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()}))}function M(e){O&&(q(),w.emit({status:"pagehide-while-loading",useKeepaliveFallback:!0,pagehidePersisted:e.persisted,requestId:m.requestId,navigationType:m.navigationType,trekkieState:a()}))}function q(){O=!1;try{window.removeEventListener("pagehide",M)}catch(e){}}function R(e){var t;!function(e){var t=e.src,i=e.async,n=void 0===i||i,r=e.onload,o=e.onerror,a=e.sri,d=e.scriptDataAttributes,s=void 0===d?{}:d,u=document.createElement("script"),l=document.querySelector("head"),c=document.querySelector("body");if(u.async=n,u.src=t,a&&(u.integrity=a,u.crossOrigin="anonymous"),s)for(var p in s)if(Object.prototype.hasOwnProperty.call(s,p))try{u.dataset[p]=String(s[p])}catch(e){}if(r&&u.addEventListener("load",r),o&&u.addEventListener("error",o),l)l.appendChild(u);else{if(!c)throw new Error("Did not find a head or body element to append the script");c.appendChild(u)}}({src:I,async:!0,onload:U,onerror:e,sri:(t=E,"string"==typeof t&&/^sha384-[A-Za-z0-9+/=]+$/.test(t)?E:""),scriptDataAttributes:c})}function D(e){B("script_append_failed",Q(e))}function Q(e){return e instanceof Error?e.message:"Unknown error"}}}();wpmLoader({shopId: 68041408610,storefrontBaseUrl: "https://www.tagalys.com",extensionsBaseUrl: "https://extensions.shopifycdn.com/cdn/shopifycloud/web-pixels-manager",monorailEndpoint: "https://www.tagalys.com/.well-known/shopify/monorail/unstable/produce_batch",surface: "storefront-renderer",enabledBetaFlags: ["16072cab","8450a54b","7ee89bf1"],webPixelsConfigList: [{"id":"1907425378","configuration":"{\"pixel_configuration\":\"{\\\"api_configuration\\\":{\\\"api_server\\\":\\\"https:\\\/\\\/api-r4.tagalys.com\\\",\\\"client_code\\\":\\\"643251FD7D4CA741\\\",\\\"api_key\\\":\\\"b0aa44cdd8779517fcf0da387eca187a\\\",\\\"store_id\\\":\\\"68041408610\\\"}}\"}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"fd02daeaca31bc5e59430dad73616468","type":"APP","apiClientId":3369055,"privacyPurposes":["ANALYTICS","MARKETING","PREFERENCES"],"dataSharingAdjustments":{"protectedCustomerApprovalScopes":["read_customer_personal_data"],"dataSharingControls":["share_all_events"]},"dataSharingState":"optimized"},{"id":"shopify-app-pixel","configuration":"{}","eventPayloadVersion":"v1","runtimeContext":"STRICT","scriptVersion":"0530","apiClientId":"shopify-pixel","type":"APP","privacyPurposes":["ANALYTICS","MARKETING"]},{"id":"shopify-custom-pixel","eventPayloadVersion":"v1","runtimeContext":"LAX","scriptVersion":"0530","apiClientId":"shopify-pixel","type":"CUSTOM","privacyPurposes":["ANALYTICS","MARKETING"]}],isMerchantRequest: false,initData: {"shop":{"name":"Tagalys Website","paymentSettings":{"currencyCode":"USD"},"myshopifyDomain":"24e3cw-g8.myshopify.com","countryCode":"US","storefrontUrl":"https:\/\/www.tagalys.com"},"customer":null,"cart":null,"checkout":null,"productVariants":[],"products":[{"id":"7776085934178","handle":"ab-testing","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"43228669313122","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"7776086851682","handle":"auto-replication","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"43228670558306","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"7773574201442","handle":"banner-placeholders","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"43220082393186","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]},{"id":"7773574398050","handle":"collection-reports","isCollective":null,"title":null,"type":null,"untranslatedTitle":null,"url":null,"vendor":null,"remoteShopId":null,"variants":[{"id":"43220082688098","image":null,"price":null,"sku":null,"title":null,"untranslatedTitle":null}]}],"purchasingCompany":null},},"https://www.tagalys.com/cdn","c8540278we853e1abpb62b2c4amde256306",{"modern":"","legacy":""},{"trekkieShim":true,"agentContext":true,"apiClientId":"580111","facebookCapiEnabled":"false","themeId":"143353708642","themePublished":"true","eventMetadataId":"bf1937ab-e718-435a-8e31-2146f8b24f9b","pageType":"blog","resourceId":"90637598818","shopId":"68041408610","storefrontBaseUrl":"https:\/\/www.tagalys.com","extensionBaseUrl":"https:\/\/extensions.shopifycdn.com\/cdn\/shopifycloud\/web-pixels-manager","surface":"storefront-renderer","enabledBetaFlags":"[\"16072cab\", \"8450a54b\", \"7ee89bf1\"]","isMerchantRequest":"false","hashVersion":"c8540278we853e1abpb62b2c4amde256306","publish":"custom","events":"[[\"page_viewed\",{}]]"});})();</script>
1336<script> 1337 window.ShopifyAnalytics = window.ShopifyAnalytics || {}; 1338 window.ShopifyAnalytics.meta = window.ShopifyAnalytics.meta || {}; 1339 window.ShopifyAnalytics.meta.currency = 'USD'; 1340 var meta = {"page":{"pageType":"blog","resourceType":"blog","resourceId":90637598818,"requestId":"0831a211-714e-4833-bccd-4583135fd718-1790360305"}}; 1341 for (var attr in meta) { 1342 window.ShopifyAnalytics.meta[attr] = meta[attr]; 1343 } 1344</script>
vendor: 1 bytes, line 1344
1344
1345<script class="analytics"> 1346 (function () { 1347 var customDocumentWrite = function(content) { 1348 var jquery = null; 1349 1350 if (window.jQuery) { 1351 jquery = window.jQuery; 1352 } else if (window.Checkout && window.Checkout.$) { 1353 jquery = window.Checkout.$; 1354 } 1355 1356 if (jquery) { 1357 jquery('body').append(content); 1358 } 1359 }; 1360 1361 var hasLoggedConversion = function(token) { 1362 if (token) { 1363 return document.cookie.indexOf('loggedConversion=' + token) !== -1; 1364 } 1365 return false; 1366 } 1367 1368 var setCookieIfConversion = function(token) { 1369 if (token) { 1370 var twoMonthsFromNow = new Date(Date.now()); 1371 twoMonthsFromNow.setMonth(twoMonthsFromNow.getMonth() + 2); 1372 1373 document.cookie = 'loggedConversion=' + token + '; expires=' + twoMonthsFromNow; 1374 } 1375 } 1376 1377 var trekkie = window.ShopifyAnalytics.lib = window.trekkie = window.trekkie || []; 1378 window.ShopifyAnalytics.lib.trekkie = window.trekkie; 1379 if (trekkie.integrations) { 1380 return; 1381 } 1382 trekkie.methods = [ 1383 'identify', 1384 'page', 1385 'ready', 1386 'track', 1387 'trackForm', 1388 'trackLink' 1389 ]; 1390 trekkie.factory = function(method) { 1391 return function() { 1392 var args = Array.prototype.slice.call(arguments); 1393 args.unshift(method); 1394 trekkie.push(args); 1395 if (method == 'track' || method == 'page') { 1396 var pageUrl; 1397 try { 1398 pageUrl = window.location.href; 1399 } catch (e) {} 1400 var pageReferrer; 1401 try { 1402 pageReferrer = document.referrer; 1403 } catch (e) {} 1404 try { 1405 if (window.__TREKKIE_SHIM_QUEUE == null) { 1406 window.__TREKKIE_SHIM_QUEUE = []; 1407 } 1408 window.__TREKKIE_SHIM_QUEUE.push({ 1409 from: 'trekkie-stub', 1410 method: method, 1411 args: args.slice(1), 1412 pageContext: { 1413 url: pageUrl, 1414 referrer: pageReferrer 1415 } 1416 }); 1417 } catch (e) { 1418 // no-op 1419 } 1420 } 1421 return trekkie; 1422 }; 1423 }; 1424 for (var i = 0; i < trekkie.methods.length; i++) { 1425 var key = trekkie.methods[i]; 1426 trekkie[key] = trekkie.factory(key); 1427 } 1428 trekkie.load = function(config) { 1429 trekkie.config = config || {}; 1430 trekkie.config.initialDocumentCookie = document.cookie; 1431 var first = document.getElementsByTagName('script')[0]; 1432var script = document.createElement('script'); 1433script.type = 'text/javascript'; 1434script.onerror = function(e) { 1435 var scriptFallback = document.createElement('script'); 1436 scriptFallback.type = 'text/javascript'; 1437 scriptFallback.onerror = function(error) { 1438 var Monorail = { 1439 produce: function produce(monorailDomain, schemaId, payload) { 1440 var currentMs = new Date().getTime(); 1441 var event = { 1442 schema_id: schemaId, 1443 payload: payload, 1444 metadata: { 1445 event_created_at_ms: currentMs, 1446 event_sent_at_ms: currentMs 1447 } 1448 }; 1449 return Monorail.sendRequest("https://" + monorailDomain + "/v1/produce", JSON.stringify(event)); 1450 }, 1451 sendRequest: function sendRequest(endpointUrl, payload) { 1452 // Try the sendBeacon API 1453 if (window && window.navigator && typeof window.navigator.sendBeacon === 'function' && typeof window.Blob === 'function' && !Monorail.isIos12()) { 1454 var blobData = new window.Blob([payload], { 1455 type: 'text/plain' 1456 }); 1457 1458 if (window.navigator.sendBeacon(endpointUrl, blobData)) { 1459 return true; 1460 } // sendBeacon was not successful 1461 1462 } // XHR beacon 1463 1464 var xhr = new XMLHttpRequest(); 1465 1466 try { 1467 xhr.open('POST', endpointUrl); 1468 xhr.setRequestHeader('Content-Type', 'text/plain'); 1469 xhr.send(payload); 1470 } catch (e) { 1471 console.log(e); 1472 } 1473 1474 return false; 1475 }, 1476 isIos12: function isIos12() { 1477 return window.navigator.userAgent.lastIndexOf('iPhone; CPU iPhone OS 12_') !== -1 || window.navigator.userAgent.lastIndexOf('iPad; CPU OS 12_') !== -1; 1478 } 1479 }; 1480 Monorail.produce('monorail-edge.shopifysvc.com', 1481 'trekkie_storefront_load_errors/1.1', 1482 {shop_id: 68041408610, 1483 theme_id: 143353708642, 1484 app_name: "storefront", 1485 context_url: window.location.href, 1486 source_url: "//www.tagalys.com/cdn/s/trekkie.storefront.f1ba865b3fecd812ad617f74ac079261075e9edb.min.js"}); 1487 1488 }; 1489 scriptFallback.async = true; 1490 scriptFallback.src = '//www.tagalys.com/cdn/s/trekkie.storefront.f1ba865b3fecd812ad617f74ac079261075e9edb.min.js'; 1491 first.parentNode.insertBefore(scriptFallback, first); 1492}; 1493script.async = true; 1494script.src = '//www.tagalys.com/cdn/s/trekkie.storefront.f1ba865b3fecd812ad617f74ac079261075e9edb.min.js'; 1495first.parentNode.insertBefore(script, first); 1496 1497 }; 1498 trekkie.load( 1499 {"Trekkie":{"appName":"storefront","development":false,"defaultAttributes":{"shopId":68041408610,"isMerchantRequest":null,"themeId":143353708642,"themeCityHash":"8719221129680711226","contentLanguage":"en","currency":"USD","eventMetadataId":"bf1937ab-e718-435a-8e31-2146f8b24f9b"},"isServerSideCookieWritingEnabled":true,"monorailRegion":"shop_domain","enabledBetaFlags":["764d78cb","8450a54b","7ee89bf1"]},"Session Attribution":{},"S2S":{"facebookCapiEnabled":false,"source":"trekkie-storefront-renderer","apiClientId":580111}} 1500 ); 1501 1502 var loaded = false;
1503 trekkie.ready(function() { 1504 if (loaded) return; 1505 loaded = true; 1506 1507 window.ShopifyAnalytics.lib = window.trekkie; 1508 1509 var originalDocumentWrite = document.write; 1510 document.write = customDocumentWrite; 1511 try { window.ShopifyAnalytics.merchantGoogleAnalytics.call(this); } catch(error) {}; 1512 document.write = originalDocumentWrite; 1513 1514 var match = window.location.pathname.match(/checkouts\/(.+)\/(thank_you|post_purchase)/) 1515 var token = match? match[1]: undefined; 1516 if (!hasLoggedConversion(token)) { 1517 setCookieIfConversion(token); 1518 1519 } 1520 }); 1521 1522 window.ShopifyAnalytics.lib.page(null,{"pageType":"blog","resourceType":"blog","resourceId":90637598818,"requestId":"0831a211-714e-4833-bccd-4583135fd718-1790360305","shopifyEmitted":true}); 1523 1524 var eventsListenerScript = document.createElement('script'); 1525 eventsListenerScript.async = true; 1526 eventsListenerScript.src = "//www.tagalys.com/cdn/shopifycloud/storefront/assets/shop_events_listener-4e26a9ce.js"; 1527 document.getElementsByTagName('head')[0].appendChild(eventsListenerScript); 1528})();</script>
vendor: 1 bytes, line 1528
1528
1529<script 1530 defer 1531 src="https://www.tagalys.com/cdn/shopifycloud/perf-kit/shopify-perf-kit-3.9.4.min.js" 1532 data-application="storefront-renderer" 1533 data-shop-id="68041408610" 1534 data-render-region="gcp-us-central1" 1535 data-page-type="blog" 1536 data-theme-instance-id="143353708642" 1537 data-theme-name="Horizon" 1538 data-theme-version="4.0.0" 1539 data-monorail-region="shop_domain" 1540 data-resource-timing-sampling-rate="10" 1541 data-shs="true" 1542 data-shs-beacon="true" 1543 data-shs-export-with-fetch="true" 1544 data-shs-logs-sample-rate="1" 1545 data-shs-beacon-endpoint="https://www.tagalys.com/api/collect" 1546></script>
1546 1547<meta name="shopify-y" content="00000000-0000-0000-5000-000000000000" data-expiration="1821917905000"><meta name="shopify-s" content="00000000-0000-0000-5000-000000000000" data-expiration="1790362105000"><meta name="new-cookie-storage-activated" content="t"> 1548</head> 1549 1550 <body class="page-width-narrow card-hover-effect-none"> 1551 <!-- Google Tag Manager (noscript) -->
vendor: 87 bytes, lines 1551-1554
1551 1552 <noscript> 1553 <iframe 1554 src="https://www.googletagmanager.com/ns.html?id=
1554GTM-P97Q2B4
vendor: 123 bytes, lines 1554-1560
1554" 1555 height="0" 1556 width="0" 1557 style="display:none;visibility:hidden" 1558 ></iframe> 1559 </noscript> 1560
1560<!-- End Google Tag Manager (noscript) --> 1561 <a 1562 class="skip-to-content-link button-secondary" 1563 href="#MainContent" 1564> 1565 Skip to content 1566</a> 1567 1568 1569 1570 1571 1572 1573<theme-drawer id="chat-drawer"> 1574 <dialog 1575 ref="panel" 1576 class="theme-drawer__dialog chat-drawer" 1577 > 1578 <shopify-chat 1579 mode="standalone" 1580 mode-switch 1581 ></shopify-chat> 1582 </dialog> 1583</theme-drawer> 1584
1585<script type="module"> 1586 const chatDrawer = document.querySelector('#chat-drawer'); 1587 const shopifyChat = document.querySelector('shopify-chat'); 1588 1589 document.addEventListener('theme-drawer:open', (event) => { 1590 if (/** @type {Element} */ (event.target).id !== 'chat-drawer') return; 1591 shopifyChat?.setAttribute('mode', 'managed'); 1592 }); 1593 1594 document.addEventListener('theme-drawer:close', (event) => { 1595 if (/** @type {Element} */ (event.target).id !== 'chat-drawer') return; 1596 // If mode is still managed, this is a theme-initiated close (backdrop / 1597 // Escape) — close the chat so the FAB appears. If mode is already 1598 // standalone, the close was triggered by an undock (enter-standalone sets 1599 // mode before closing the drawer) — leave the chat open as a floating panel. 1600 if (shopifyChat?.getAttribute('mode') === 'managed') { 1601 shopifyChat?.removeAttribute('open'); 1602 } 1603 shopifyChat?.setAttribute('mode', 'standalone'); 1604 }); 1605 1606 document.addEventListener('shopify-chat:enter-managed', () => { 1607 // Captured at event-fire time — the dock-transition animation hint below 1608 // depends on state as it was when the event was dispatched. 1609 const isStandaloneAndOpen = shopifyChat?.hasAttribute('open') && shopifyChat?.getAttribute('mode') === 'standalone'; 1610 1611 // The activator-click path (FAB click on desktop with stored 1612 // preferredMode=managed) dispatches enter-managed *before* calling show(), 1613 // so the chat's `open` attribute at event time understates the imminent 1614 // outcome. Defer to a microtask: by then show() (if any) has run, and we 1615 // can distinguish the viewport-driven mobile→desktop transition that left 1616 // a minimized FAB (chat stays closed → don't open an empty drawer) from 1617 // an activator click (chat just opened → open the drawer). 1618 queueMicrotask(() => { 1619 if (!shopifyChat?.hasAttribute('open') && !chatDrawer?.hasAttribute('open')) { 1620 return; 1621 } 1622 chatDrawer?.open?.(isStandaloneAndOpen ? { enter: 'inline-start' } : undefined); 1623 }); 1624 }); 1625 1626 document.addEventListener('shopify-chat:enter-standalone', () => { 1627 shopifyChat?.setAttribute('mode', 'standalone'); 1628 chatDrawer?.close?.(); 1629 }); 1630 1631 document.addEventListener('shopify-chat:close', () => { 1632 if (shopifyChat?.getAttribute('mode') === 'managed') { 1633 chatDrawer?.close?.(); 1634 } 1635 }); 1636 1637 document.addEventListener('megaMenu:hover', () => { 1638 if (shopifyChat?.hasAttribute('open') && shopifyChat?.getAttribute('mode') === 'standalone') { 1639 shopifyChat?.removeAttribute('open'); 1640 } 1641 }); 1642 1643 // After the chat upgrades it self-restores its preferred mode from 1644 // sessionStorage. Reconcile any mismatch with the theme-drawer's state 1645 // — the drawer is the source of truth for which mode the chat should 1646 // be in (open → managed, closed → standalone). 1647 customElements.whenDefined('shopify-chat').then(() => { 1648 const mode = chatDrawer?.hasAttribute('open') ? 'managed' : 'standalone'; 1649 if (shopifyChat?.getAttribute('mode') !== mode) { 1650 // When switching managed → standalone (e.g. narrow viewport skipped 1651 // drawer restore), also close the chat so it renders as the FAB 1652 // rather than an open standalone panel. 1653 if (mode === 'standalone' && shopifyChat?.hasAttribute('open')) { 1654 shopifyChat?.removeAttribute('open'); 1655 } 1656 shopifyChat?.setAttribute('mode', mode); 1657 } 1658 }); 1659</script>
1659 1660 1661 1662 1663 1664 <div class="page-wrapper"> 1665 <div id="header-group"> 1666 <!-- BEGIN sections: header-group --> 1667<section id="shopify-section-sections--19314630230114__tagalys_header_Q3i7PH" class="shopify-section shopify-section-group-header-group tagalys-header"> 1668 1669<style> 1670.tgh-root *{ 1671 box-sizing:border-box; 1672 margin:0; 1673} 1674#header-group{position:sticky;top:0;z-index:1000} 1675.tgh-root{font-family:var(--tg-font-body);width:100%} 1676 1677.tgh-nav{background:var(--tg-white);border-bottom:1px solid var(--tg-border);height:68px;padding:0;position:relative;transition:box-shadow .25s,border-color .25s} 1678.tgh-nav.scrolled{box-shadow:0 2px 0 var(--tg-border),0 4px 24px rgba(0,0,0,.10);border-bottom-color:transparent} 1679.tgh-nav-inner{ 1680 width:100%; 1681 padding:0 var(--tg-page-pad); 1682 display:flex; 1683 align-items:center; 1684 height:68px; 1685} 1686 1687.tgh-logo{flex-shrink:0;margin-right:44px;display:flex;align-items:center;text-decoration:none} 1688.tgh-logo img{height:40px;width:auto;display:block} 1689.tgh-logo-text{font-family:var(--tg-font-heading);font-size:22px;font-weight:700;color:var(--tg-black);letter-spacing:-.03em} 1690 1691.tgh-links{display:flex;align-items:stretch;justify-content:center;flex:1;height:68px;gap:34px} 1692.tgh-item{position:static;display:flex;align-items:center} 1693 1694.tgh-item-trigger, 1695.tgh-item-link{ 1696 height:68px; 1697 padding:0 10px; 1698 font-family:var(--tg-font-body); 1699 font-size:16px; 1700 font-weight:400; 1701 line-height:1; 1702 letter-spacing:0; 1703 text-transform:none; 1704 color:var(--tg-ink); 1705 text-decoration:none;background:none;border:none;display:flex;align-items:center;gap:6px;white-space:nowrap;cursor:pointer;transition:color .15s;position:relative} 1706.tgh-item-trigger::after,.tgh-item-link::after{content:'';position:absolute;bottom:0;left:8px;right:8px;height:2px;background:var(--tg-black);transform:scaleX(0);transition:transform .2s} 1707.tgh-item.open .tgh-item-trigger::after,.tgh-item-trigger:hover::after,.tgh-item-link:hover::after{transform:scaleX(1)} 1708.tgh-item-trigger:hover,.tgh-item.open .tgh-item-trigger,.tgh-item-link:hover{color:var(--tg-black)} 1709.tgh-item-trigger svg{width:12px;height:12px;transition:transform .2s;flex-shrink:0} 1710.tgh-item.open .tgh-item-trigger svg{transform:rotate(180deg)} 1711 1712.tgh-right{margin-left:44px;display:flex;align-items:center;gap:22px;flex-shrink:0} 1713.tgh-login{ 1714 font-size:13px; 1715 font-weight:500; 1716 letter-spacing:0; 1717 text-transform:none; 1718 color:var(--tg-disabled);text-decoration:none;white-space:nowrap;transition:color .15s} 1719.tgh-login:hover{color:var(--tg-black)} 1720.tgh-search-trigger{width:40px;height:40px;padding:0;border:0;background:transparent;color:var(--tg-black);display:grid;place-items:center;cursor:pointer} 1721.tgh-search-trigger svg{width:20px;height:20px;display:block} 1722.tgh-search-trigger:hover,.tgh-search-trigger:focus-visible{color:var(--tg-black)} 1723.tgh-mobile-search-trigger{display:none} 1724 1725.tgh-mega{position:fixed;left:0;right:0;top:68px;background:var(--tg-white);border-top:1px solid var(--tg-border);box-shadow:0 20px 60px rgba(0,0,0,.14);display:none;z-index:999} 1726.tgh-mega{position:fixed;left:0;right:0;top:68px;background:var(--tg-white);border-top:1px solid var(--tg-border);box-shadow:0 20px 60px rgba(0,0,0,.14);display:none;z-index:1300} 1727.tgh-item.open .tgh-mega{display:block} 1728.tgh-mega-inner{ 1729 width:100%; 1730 padding:48px var(--tg-page-pad); 1731 min-height:300px;display:grid;grid-template-columns:repeat(3,minmax(160px,1fr)) minmax(0,360px);gap:56px;align-items:start} 1732.tgh-mega-col{ 1733 min-width:0; 1734 display:flex; 1735 flex-direction:column; 1736} 1737.tgh-mega-heading{font-size:12px;font-weight:600;color:var(--tg-charcoal);letter-spacing:.08em;text-transform:uppercase;margin-bottom:24px} 1738.tgh-mega-list{display:flex;flex-direction:column;gap:20px} 1739.tgh-mega-link{display:block;font-family:var(--tg-font-body);font-size:15px;font-weight:400;line-height:1.35;color:var(--tg-ink);text-decoration:none;transition:color .15s} 1740 1741.tgh-mega-promo{width:360px;text-decoration:none;color:var(--tg-black);display:block} 1742.tgh-mega-img-wrap{position:relative;overflow:hidden;height:220px;background:var(--tg-surface);width:100%} 1743.tgh-mega-img-wrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block} 1744.tgh-mega-img-title{margin-top:14px;font-family:var(--tg-font-body);font-size:12px;font-weight:600;color:var(--tg-black);letter-spacing:.06em;text-transform:uppercase} 1745.tgh-mega-img-link{ 1746 margin-top:auto; 1747 padding-top:32px; 1748 white-space:nowrap; 1749 display:inline-flex; 1750 align-items:center; 1751 gap:8px; 1752} 1753 1754.tgh-mega-img-link svg{ 1755 display:block; 1756 width:14px; 1757 height:14px; 1758 flex-shrink:0; 1759} 1760 1761.tgh-menu-collections .tgh-mega-link:hover,.tgh-menu-collections .tgh-mega-img-link:hover{color:var(--tg-collections-accent)} 1762.tgh-menu-search .tgh-mega-link:hover,.tgh-menu-search .tgh-mega-img-link:hover{color:var(--tg-search-accent)} 1763.tgh-menu-recommendations .tgh-mega-link:hover,.tgh-menu-recommendations .tgh-mega-img-link:hover{color:var(--tg-recs-accent)} 1764 1765.tgh-drop{position:absolute;top:68px;left:0;background:var(--tg-white);border:1px solid var(--tg-border);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.09);display:none;
1765min-width:200px;padding:6px;z-index:999} 1766.tgh-drop{position:absolute;top:68px;left:0;background:var(--tg-white);border:1px solid var(--tg-border);border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.09);display:none;min-width:200px;padding:6px;z-index:1300} 1767.tgh-item.open .tgh-drop{display:block} 1768.tgh-drop-item{display:block;padding:10px 14px;border-radius:7px;font-size:14px;font-weight:500;color:var(--tg-ink);text-decoration:none;transition:background .15s,color .15s} 1769.tgh-drop-item:hover{background:var(--tg-surface);color:var(--tg-collections-accent)} 1770.tgh-drop-desc{font-size:12px;color:var(--tg-charcoal);margin-top:2px} 1771 1772.tgh-overlay{position:fixed;inset:0;top:68px;background:rgba(0,0,0,.08);z-index:998;display:none} 1773.tgh-overlay{position:fixed;inset:0;top:68px;background:rgba(0,0,0,.08);z-index:1250;display:none} 1774.tgh-overlay.on{display:block} 1775 1776.tgh-ham{display:none;background:none;border:none;cursor:pointer;padding:6px;color:var(--tg-black);margin-left:auto} 1777.tgh-ham svg{width:22px;height:22px;display:block} 1778 1779.tgh-drawer{position:fixed;top:0;right:0;width:min(420px,100vw);height:auto;max-height:100vh;background:var(--tg-white);color:var(--tg-black);z-index:1100;transform:translateX(100%);transition:transform .3s cubic-bezier(.25,.46,.45,.94);overflow:hidden;box-shadow:0 16px 40px rgba(0,0,0,.14)} 1780.tgh-drawer.open{transform:translateX(0)} 1781.tgh-drawer-head{display:flex;justify-content:space-between;align-items:center;padding:16px var(--tg-page-pad);border-bottom:1px solid var(--tg-border)} 1782.tgh-drawer-logo{display:inline-flex;align-items:center;text-decoration:none} 1783.tgh-drawer-logo img{height:36px;width:auto;display:block} 1784.tgh-drawer-logo-text{font-family:var(--tg-font-heading);font-size:20px;font-weight:700;color:var(--tg-black);letter-spacing:-.03em} 1785.tgh-drawer-close{background:none;border:none;color:var(--tg-black);cursor:pointer;padding:6px;display:flex;border-radius:8px;transition:background .15s} 1786.tgh-drawer-close:hover{background:var(--tg-surface)} 1787.tgh-drawer-close svg{width:22px;height:22px} 1788 1789.tgh-drawer-nav{padding:14px 0 0;overflow-y:auto;max-height:calc(100vh - 96px)} 1790.tgh-drawer-row{border-bottom:1px solid #f0f0f0} 1791.tgh-drawer-btn{width:100%;background:none;border:none;padding:16px var(--tg-page-pad);font-family:var(--tg-font-body);font-size:14px;font-weight:500;letter-spacing:.04em;text-transform:none;color:var(--tg-black);display:flex;justify-content:space-between;align-items:center;cursor:pointer;text-align:left;transition:color .15s} 1792.tgh-drawer-btn:hover{color:var(--tg-disabled)} 1793.tgh-drawer-btn svg{width:16px;height:16px;flex-shrink:0;opacity:.7;color:var(--tg-black)} 1794.tgh-drawer-link{display:block;padding:16px var(--tg-page-pad);font-size:14px;font-weight:500;letter-spacing:.04em;text-transform:none;color:var(--tg-black);text-decoration:none;border-bottom:1px solid #f0f0f0;transition:color .15s} 1795.tgh-drawer-link:hover{color:var(--tg-disabled)} 1796 1797.tgh-drawer-panel{position:fixed;top:0;right:0;width:min(420px,100vw);height:auto;max-height:100vh;background:var(--tg-white);z-index:1110;transform:translateX(100%);transition:transform .3s cubic-bezier(.25,.46,.45,.94);overflow-y:auto;box-shadow:0 16px 40px rgba(0,0,0,.14)} 1798.tgh-drawer-panel.open{transform:translateX(0)} 1799.tgh-panel-head{display:flex;align-items:center;gap:12px;padding:16px var(--tg-page-pad);border-bottom:1px solid var(--tg-border)} 1800.tgh-panel-back{background:none;border:none;cursor:pointer;padding:6px;color:var(--tg-black);display:flex;align-items:center} 1801.tgh-panel-back svg{width:20px;height:20px} 1802.tgh-panel-title{font-family:var(--tg-font-body);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:none;color:var(--tg-black)} 1803.tgh-panel-content{padding:22px var(--tg-page-pad) 28px} 1804.tgh-panel-group{margin-bottom:22px} 1805.tgh-panel-heading{font-size:11px;font-weight:600;color:var(--tg-charcoal);letter-spacing:.08em;text-transform:uppercase;margin-bottom:10px} 1806.tgh-panel-link{display:block;padding:6px 0;font-size:13px;font-weight:400;color:var(--tg-black);text-decoration:none} 1807.tgh-panel-link:hover{color:var(--tg-disabled)} 1808.tgh-panel-cta{margin-top:12px;white-space:nowrap} 1809 1810.tgh-drawer-foot{padding:18px var(--tg-page-pad) 24px;
1810border-top:1px solid #f0f0f0;display:flex;flex-direction:column;gap:12px} 1811.tgh-drawer-foot .tg-btn{align-self:flex-start} 1812.tgh-drawer-util{font-size:13px;color:var(--tg-ink);text-decoration:none;transition:color .15s} 1813.tgh-drawer-util:hover{color:var(--tg-black)} 1814 1815@media(max-width:1180px){ 1816 .tgh-logo{margin-right:28px} 1817 .tgh-links{gap:18px} 1818 .tgh-item-trigger,.tgh-item-link{font-size:12px;padding:0 6px} 1819 .tgh-item-trigger::after,.tgh-item-link::after{left:6px;right:6px} 1820 .tgh-right{margin-left:28px} 1821 .tgh-mega-inner{gap:40px} 1822 .tgh-mega-link{font-size:14px} 1823} 1824 1825@media(max-width:860px){ 1826 .tgh-nav,.tgh-nav-inner{height:60px} 1827 .tgh-logo{margin-right:0} 1828 .tgh-links,.tgh-right{display:none} 1829 .tgh-mobile-search-trigger{display:grid;margin-left:auto;margin-right:8px} 1830 .tgh-ham{display:flex;margin-left:0} 1831 .tgh-mega,.tgh-drop{top:60px} 1832 .tgh-overlay{top:60px} 1833} 1834</style> 1835 1836<div class="tgh-root"> 1837 <nav class="tgh-nav" id="tghNav" role="navigation" aria-label="Main"> 1838 <div class="tgh-nav-inner"> 1839 <a href="/" class="tgh-logo" aria-label="Tagalys Website"> 1840 1841 <img src="//www.tagalys.com/cdn/shop/files/Tagalys_Black_Logo.png?v=1782142105&width=400" alt="Tagalys Website"> 1842 1843 </a> 1844 1845 <div class="tgh-links"> 1846 1847 1848 1849 1850 1851<div class="tgh-item tgh-menu-collections" data-key="mega_menu_iaemkv" onmouseenter="tghOpen('mega_menu_iaemkv')" onmouseleave="tghClose('mega_menu_iaemkv')" onfocusin="tghOpen('mega_menu_iaemkv')" onfocusout="tghClose('mega_menu_iaemkv')" > 1852 1853 <a href="/collections/collection-merchandising" class="tgh-item-trigger" aria-expanded="false"> 1854 Collections 1855 <svg viewBox="0 0 24 24" fill="none"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 1856 </a> 1857 1858 1859 <div class="tgh-mega"> 1860 <div class="tgh-mega-inner"> 1861 1862 1863 <div class="tgh-mega-col"> 1864 1865 <div class="tgh-mega-heading">CONTROL</div> 1866 1867 1868 1869 <div class="tgh-mega-list"> 1870 1871<a href="/products/smart-pinning" class="tgh-mega-link">Pin with conditions</a> 1872 1873 1874 1875<a href="/products/trending-score" class="tgh-mega-link">Trending Score</a> 1876 1877 1878 1879<a href="/products/product-boost" class="tgh-mega-link">Product Boost</a> 1880 1881 1882 1883<a href="/products/global-sort-options" class="tgh-mega-link">Global Sort Options</a> 1884 1885 1886 </div> 1887 1888 1889 1890 <a href="/collections/collection-merchandising" class="tg-text-cta tgh-mega-img-link"> 1891 EXPLORE COLLECTION MERCHANDISING 1892 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"> 1893 <path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> 1894 <path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> 1895 </svg> 1896 </a> 1897 1898 </div> 1899 1900 1901 1902 <div class="tgh-mega-col"> 1903 1904 <div class="tgh-mega-heading">CURATE</div> 1905 1906 1907 1908 <div class="tgh-mega-list"> 1909 1910<a href="/products/looks" class="tgh-mega-link">Looks</a> 1911 1912 1913 1914<a href="/products/visual-sequences" class="tgh-mega-link">Sequences</a> 1915 1916 1917 </div> 1918 1919 1920 1921 </div> 1922 1923 1924 1925 <div class="tgh-mega-col"> 1926 1927 <div class="tgh-mega-heading">SCALE</div> 1928 1929 1930 1931 <div class="tgh-mega-list"> 1932 1933<a href="/products/markets" class="tgh-mega-link">Markets</a> 1934 1935 1936 1937<a href="/products/server-side" class="tgh-mega-link">Server Side</a> 1938 1939 1940 1941<a href="/products/size-merchandising" class="tgh-mega-link">Size Merchandising</a> 1942 1943 1944 </div> 1945 1946 1947 1948 </div> 1949 1950 1951 1952 1953 </div> 1954 </div> 1955 </div> 1956 1957 1958 1959 1960 1961 1962 1963<div class="tgh-item tgh-menu-search" data-key="mega_menu_lkjzmk" onmouseenter="tghOpen('mega_menu_lkjzmk')" onmouseleave="tghClose('mega_menu_lkjzmk')" onfocusin="tghOpen('mega_menu_lkjzmk')" onfocusout="tghClose('mega_menu_lkjzmk')" > 1964 1965 <a href="/collections/site-search" class="tgh-item-trigger" aria-expanded="false"> 1966 Search 1967 <svg viewBox="0 0 24 24" fill="none"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 1968 </a> 1969 1970 1971 <div class="tgh-mega"> 1972 <div class="tgh-mega-inner"> 1973 1974 1975 <div class="tgh-mega-col"> 1976 1977 <div class="tgh-mega-heading">CONTROL</div> 1978 1979 1980 1981 <div class="tgh-mega-list"> 1982 1983<a href="/products/pinned-searches" class="tgh-mega-link">Pinned Search</a> 1984 1985 1986 1987<a href="/products/popular-searches" class="tgh-mega-link">Popular Search</a> 1988 1989 1990 1991<a href="/products/trending-score" class="tgh-mega-link">Trending Score</a> 1992 1993 1994 1995<a href="/products/global-sort-options" class="tgh-mega-link">Global Sort Options</a> 1996 1997 1998 </div> 1999 2000 2001 2002 <a href="/collections/site-search" class="tg-text-cta tgh-mega-img-link"> 2003 EXPLORE SITE SEARCH 2004 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"> 2005 <path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> 2006 <path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> 2007 </svg> 2008 </a> 2009 2010 </div> 2011 2012 2013 2014 <div class="tgh-mega-col"> 2015 2016 <div class="tgh-mega-heading">FIND</div> 2017 2018 2019 2020 <div class="tgh-mega-list"> 2021 2022<a href="/products/predictive-search" class="tgh-mega-link">Predictive Search</a> 2023 2024 2025 2026<a href="/products/search-accuracy" class="tgh-mega-link">Search Accuracy</a> 2027 2028 2029 2030<a href="/products/refine-search-results" class="tgh-mega-link">Search Results</a> 2031 2032 2033 </div> 2034 2035 2036 2037 </div> 2038 2039 2040 2041 2042 2043 2044 </div> 2045 </div> 2046 </div> 2047 2048 2049 2050 2051 2052 2053 2054<div class="tgh-item tgh-menu-recommendations" data-key="mega_menu_bty84e" onmouseenter="tghOpen('mega_menu_bty84e')" onmouseleave="tghClose('mega_menu_bty84e')" onfocusin="tghOpen('mega_menu_bty84e')" onfocusout="tghClose('mega_menu_bty84e')" > 2055 2056 <a href="/collections/product-recommendations" class="tgh-item-trigger" aria-expanded="false"> 2057 Recommendations 2058 <svg viewBox="0 0 24 24" fill="none"><path d="M6 9l6 6 6-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 2059 </a> 2060 2061 2062 <div class="tgh-mega"> 2063 <div class="tgh-mega-inner"> 2064 2065 2066 <div class="tgh-mega-col"> 2067 2068 <div class="tgh-mega-heading">CONTROL</div> 2069 2070 2071 2072 <div class="tgh-mega-list"> 2073 2074<a href="/products/smart-pinning" class="tgh-mega-link">Pin with conditions</a> 2075 2076 2077 2078<a href="/products/trending-score" class="tgh-mega-link">Trending Score</a> 2079 2080 2081 2082<a href="/products/product-boost" class="tgh-mega-link">Product Boost</a> 2083 2084 2085 2086<a href="/products/global-sort-options" class="tgh-mega-link">Global Sort Options</a> 2087 2088 2089 </div> 2090 2091 2092 2093 <a href="/collections/product-recommendations" class="tg-text-cta tgh-mega-img-link"> 2094 Explore Product Recommendations 2095 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"> 2096 <path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> 2097 <path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> 2098 </svg> 2099 </a> 2100 2101 </div> 2102 2103 2104 2105 <div class="tgh-mega-col"> 2106 2107 <div class="tgh-mega-heading">DISCOVER</div> 2108 2109 2110 2111 <div class="tgh-mega-list"> 2112 2113<a href="/products/similar-products" class="tgh-mega-link">Similar Products</a> 2114 2115 2116 2117<a href="/products/trending-best-sellers-recommendations" class="tgh-mega-link">Trending / Best Sellers</a> 2118 2119 2120 2121<a href="/products/new-arrivals-recommendations" class="tgh-mega-link">New Arrivals</a> 2122 2123 2124 </div> 2125 2126 2127 2128 </div> 2129 2130 2131 2132 2133 2134 2135 </div> 2136 </div> 2137 </div> 2138 2139 2140 2141 2142 2143 2144 2145 2146 2147 <div class="tgh-item" > 2148 <a href="/pages/pricing" class="tgh-item-link">Pricing</a> 2149 </div> 2150 2151 2152 2153 2154 2155 2156 2157 </div> 2158 2159 <div class="tgh-right"> 2160 <button 2161 class="tgh-search-trigger" 2162 type="button" 2163 aria-label="Search" 2164 aria-haspopup="dialog" 2165 aria-controls="tghSearchPanel" 2166 aria-expanded="false" 2167 onclick="tghSearchOpen(event)" 2168 > 2169 <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><circle cx="9" cy="9" r="4.75" stroke="currentColor" stroke-width="var(--icon-stroke-width)"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="var(--icon-stroke-width)" d="m12.5 12.5 3.25 3.25"/></svg> 2170 2171 </button> 2172 2173 2174 <a href="https://next.tagalys.com/users/sign_in?" class="tgh-login">Log in</a> 2175 2176 2177 2178 <a href="/pages/schedule-demo" class="tg-btn tg-btn--black"> 2179 Book a Demo
2180 <span class="tg-btn__arrow" aria-hidden="true"> 2181 <svg viewBox="0 0 24 24" fill="none"><path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 2182 </span> 2183 </a> 2184 2185 </div> 2186 2187 <button 2188 class="tgh-search-trigger tgh-mobile-search-trigger" 2189 type="button" 2190 aria-label="Search" 2191 aria-haspopup="dialog" 2192 aria-controls="tghSearchPanel" 2193 aria-expanded="false" 2194 onclick="tghSearchOpen(event)" 2195 > 2196 <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><circle cx="9" cy="9" r="4.75" stroke="currentColor" stroke-width="var(--icon-stroke-width)"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="var(--icon-stroke-width)" d="m12.5 12.5 3.25 3.25"/></svg> 2197 2198 </button> 2199 2200 <button class="tgh-ham" onclick="tghDrawerOpen()" aria-label="Open menu"> 2201 <svg viewBox="0 0 24 24" fill="none"><path d="M3 12h18M3 6h18M3 18h18" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg> 2202 </button> 2203 </div> 2204 </nav> 2205</div> 2206 2207<div class="tgh-overlay" id="tghOverlay"></div> 2208 2209<div class="tgh-drawer" id="tghDrawer"> 2210 <div class="tgh-drawer-head"> 2211 <a href="/" class="tgh-drawer-logo" aria-label="Tagalys Website"> 2212 2213 <img src="//www.tagalys.com/cdn/shop/files/Tagalys_Black_Logo.png?v=1782142105&width=300" alt="Tagalys Website"> 2214 2215 </a> 2216 2217 <button class="tgh-drawer-close" onclick="tghDrawerClose()" aria-label="Close menu"> 2218 <svg viewBox="0 0 24 24" fill="none"><path d="M18 6L6 18M6 6l12 12" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"/></svg> 2219 </button> 2220 </div> 2221 2222 <div class="tgh-drawer-nav"> 2223 2224 2225 2226 2227 2228 2229<div class="tgh-drawer-row"> 2230 <button class="tgh-drawer-btn" onclick="tghDrawerSubmenu('mega_menu_iaemkv')"> 2231 Collections 2232 <svg viewBox="0 0 24 24" fill="none"><path d="M9 6l6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 2233 </button> 2234 </div> 2235 2236 2237 2238 2239 2240 2241 2242<div class="tgh-drawer-row"> 2243 <button class="tgh-drawer-btn" onclick="tghDrawerSubmenu('mega_menu_lkjzmk')"> 2244 Search 2245 <svg viewBox="0 0 24 24" fill="none"><path d="M9 6l6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 2246 </button> 2247 </div> 2248 2249 2250 2251 2252 2253 2254 2255<div class="tgh-drawer-row"> 2256 <button class="tgh-drawer-btn" onclick="tghDrawerSubmenu('mega_menu_bty84e')"> 2257 Recommendations 2258 <svg viewBox="0 0 24 24" fill="none"><path d="M9 6l6 6-6 6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 2259 </button> 2260 </div> 2261 2262 2263 2264 2265 2266 2267 2268 <div class="tgh-drawer-row"> 2269 <a href="/pages/pricing" class="tgh-drawer-link">Pricing</a> 2270 </div> 2271 2272 2273 2274 2275 2276 2277 2278 2279 <div class="tgh-drawer-foot"> 2280 2281 <a href="https://next.tagalys.com/users/sign_in?" class="tgh-drawer-util">Log in</a> 2282 2283 2284 <a href="https://support.tagalys.com/" class="tgh-drawer-util">Support</a> 2285 2286 2287 <a href="/pages/schedule-demo" class="tg-btn tg-btn--black"> 2288 Book a Demo 2289 <span class="tg-btn__arrow" aria-hidden="true"> 2290 <svg viewBox="0 0 24 24" fill="none"><path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 2291 </span> 2292 </a> 2293 2294 </div> 2295 </div> 2296</div> 2297 2298 2299 2300<div class="tgh-search-shell" id="tghSearchShell" hidden aria-hidden="true"> 2301 <button class="tgh-search-backdrop" type="button" aria-label="Close search" onclick="tghSearchClose()"></button> 2302 2303 <section class="tgh-search-panel" id="tghSearchPanel" role="dialog" aria-modal="true" aria-labelledby="tghSearchTitle"> 2304 <h2 class="visually-hidden" id="tghSearchTitle">Search Tagalys</h2> 2305 2306 <button class="tgh-search-close" type="button" aria-label="Close search" onclick="tghSearchClose()">
2307 <svg aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 2308<path d="M11.1765 12.025C11.4108 12.2594 11.7907 12.2594 12.025 12.025C12.2594 11.7907 12.2594 11.4108 12.025 11.1765L8.84931 8.00078L12.025 4.82505C12.2594 4.59073 12.2594 4.21083 12.025 3.97652C11.7907 3.7422 11.4108 3.7422 11.1765 3.97652L8.00078 7.15225L4.82505 3.97652C4.59073 3.7422 4.21083 3.7422 3.97652 3.97652C3.7422 4.21083 3.7422 4.59073 3.97652 4.82505L7.15225 8.00078L3.97652 11.1765C3.7422 11.4108 3.7422 11.7907 3.97652 12.025C4.21083 12.2594 4.59073 12.2594 4.82505 12.025L8.00078 8.84931L11.1765 12.025Z" fill="currentColor"/> 2309</svg> 2310 2311 </button> 2312 2313 <div class="tgh-search-inner" id="tghSearchPanelContent"> 2314 <form class="tgh-search-form" action="/search" method="get" role="search"> 2315 <label class="visually-hidden" for="tghSearchInput">Search Tagalys</label> 2316 <input class="tgh-search-input" id="tghSearchInput" name="query" type="search" autocomplete="off" placeholder="Type to search" required> 2317 <button class="tgh-search-submit" type="submit" aria-label="Submit search"> 2318 <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><circle cx="9" cy="9" r="4.75" stroke="currentColor" stroke-width="var(--icon-stroke-width)"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="var(--icon-stroke-width)" d="m12.5 12.5 3.25 3.25"/></svg> 2319 2320 </button> 2321 </form> 2322 2323 <div class="tgh-tagalys-suggestions" aria-live="polite" aria-busy="true"></div> 2324 2325 <div class="tgh-search-help"> 2326 <div> 2327 <strong>Bring search like this to your Shopify store</strong> 2328 <span>Pin priority searches, suggest products as shoppers type, and control every result</span> 2329 </div> 2330 <a class="tg-text-cta" href="/collections/site-search"> 2331 Explore Tagalys Search 2332 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"> 2333 <path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> 2334 <path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> 2335 </svg> 2336 </a> 2337 </div> 2338 </div> 2339 </section> 2340</div> 2341 2342<style> 2343 body.tgh-search-open{overflow:hidden} 2344 .tgh-search-shell[hidden]{display:none} 2345 .tgh-search-shell{position:fixed;inset:68px 0 0;z-index:1200} 2346 .tgh-search-shell.tgh-search-preparing{position:fixed!important;inset:auto auto auto -12000px!important;width:min(1080px,100vw);visibility:hidden!important;pointer-events:none!important;overflow:hidden!important} 2347 .tgh-search-shell.tgh-search-preparing,.tgh-search-shell.tgh-search-preparing *{visibility:hidden!important} 2348 body:not(.tgh-search-open) .tgh-search-shell .search-suggestions,body:not(.tgh-search-open) .tgh-search-shell .recent-search-item,body:not(.tgh-search-open) .tgh-search-shell .click-suggestions{visibility:hidden!important;opacity:0!important;pointer-events:none!important} 2349 .tgh-search-backdrop{position:absolute;inset:0;border:0;background:rgba(13,13,13,.28);backdrop-filter:blur(2px);cursor:default} 2350 .tgh-search-panel{position:relative;width:100%;max-height:calc(100dvh - 68px);overflow:auto;overflow-x:hidden;background:var(--tg-white);color:var(--tg-black);box-shadow:0 24px 70px rgba(13,13,13,.18)} 2351 .tgh-search-inner{width:min(1080px,calc(100% - 96px));margin:0 auto;padding:40px 0 44px} 2352 .tgh-search-close{position:absolute;top:14px;right:18px;z-index:2;width:38px;height:38px;border:1px solid transparent;border-radius:50%;background:transparent;color:var(--tg-black);display:grid;place-items:center;cursor:pointer;transition:background-color .2s ease,border-color .2s ease,transform .2s ease} 2353 .tgh-search-close:hover{border-color:var(--tg-border);background:var(--tg-offwhite);transform:rotate(4deg)} 2354 .tgh-search-close:focus-visible{outline:2px solid var(--tg-black);outline-offset:2px} 2355 .tgh-search-close svg{width:18px;height:18px;display:block} 2356 .tgh-search-submit svg{width:22px;height:22px;display:block} 2357 .tgh-search-form{position:relative;width:100%;margin:0 auto} 2358 .tgh-search-input{width:100%;height:52px;padding:0 52px 0 0;border:0;border-bottom:1px solid var(--tg-black);border-radius:0;background:transparent;color:var(--tg-black);font-family:var(--tg-font-body);font-size:18px;font-weight:400;outline:none} 2359 .tgh-search-input::placeholder{color:var(--tg-disabled);opacity:1} 2360 .tgh-search-input:focus-visible,.tgh-search-shell:not([hidden]) .tgh-search-input{border-bottom:2px solid var(--tg-black);box-shadow:none} 2361 .tgh-search-submit{position:absolute;right:0;top:50%;width:48px;height:48px;transform:translateY(-50%);border:0;background:transparent;color:var(--tg-black);display:grid;place-items:center;cursor:pointer} 2362 #tagalys-namespace.tgh-tagalys-suggestions{position:relative;width:100%;margin-top:15px!important} 2363 2364 /* These elements are rendered dynamically by Tagalys. */ 2365 .tgh-search-shell.tgh-search-closing .tgh-tagalys-suggestions,.tgh-search-shell.tgh-search-closing #tagalys-namespace,.tgh-search-shell.tgh-search-closing .search-suggestions{visibility:hidden!important;opacity:0!important;pointer-events:none!important} 2366 .tgh-tagalys-suggestions .search-suggestions,#tagalys-namespace.tgh-tagalys-suggestions .search-suggestions{position:static!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;inset:auto!important;transform:none!important;visibility:inherit!important;width:100%!important;max-width:none!important;border:0!important;box-shadow:none!important;background:transparent!important;overflow:visible!important;z-index:auto!important} 2367 #tagalys-namespace.tgh-tagalys-suggestions .tgh-search-discovery{display:flex!important;flex-direction:column!important;gap:0!important} 2368 #tagalys-namespace.tgh-tagalys-suggestions .tgh-search-discovery>.click-suggestions{margin:0 0 10px 0!important;padding:0!important} 2369 .tgh-tagalys-suggestions .search-results-link{color:var(--tg-black);text-decoration:none} 2370 .tgh-tagalys-suggestions .search-results-link:not(.tgh-recent-search-link):hover,.tgh-tagalys-suggestions .search-results-link:not(.tgh-recent-search-link):focus-visible{color:var(--tg-black);text-decoration:none} 2371 .tgh-tagalys-suggestions .type-suggestions{display:grid!important;grid-template-columns:minmax(0,1.35fr) minmax(240px,.95fr)!important;gap:40px!important;align-items:start} 2372 .tgh-tagalys-suggestions .tgh-product-suggestions-column{display:flex;flex-direction:column;min-width:0} 2373 .tgh-tagalys-suggestions .type-suggestions:has(>.text-suggestions:only-child){grid-template-columns:minmax(0,1fr)!important} 2374 .tgh-tagalys-suggestions .type-suggestions:has(>.text-suggestions:only-child) .text-suggestions{width:100%;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important} 2375 .tgh-tagalys-suggestions .type-suggestions:has(.products.product-suggestions) .text-suggestions{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important} 2376 .tgh-tagalys-suggestions .type-suggestions:has(>.text-suggestions:only-child) .text-suggestion-section>ul>li>a.tgh-page-suggestion-link{max-width:760px;margin-left:-10px!important} 2377 .tgh-tagalys-suggestions .type-suggestions.tgh-single-product-suggestion{grid-template-columns:minmax(0,max-content) minmax(240px,.95fr)!important} 2378 .tgh-tagalys-suggestions .text-suggestions{margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;list-style:none!important} 2379 .tgh-tagalys-suggestions .text-suggestion-section{margin:0!important;list-style:none!important} 2380 .tgh-tagalys-suggestions .section-title{display:block!important;margin:0 0 12px!important;padding:4px 0 0!important;color:var(--tg-black)!important;font-family:var(--tg-font-body)!important;font-size:.6875rem!important;font-weight:700!important;line-height:1!important;letter-spacing:.11em!important;text-transform:uppercase!important} 2381 .tgh-tagalys-suggestions .text-suggestion-section>ul{margin:0!important;padding:0!important;list-style:none!important} 2382 .tgh-tagalys-suggestions .text-suggestion-section>ul>li{margin:0!important;padding:0!important;list-style:none!important} 2383 .tgh-tagalys-suggestions .text-suggestion-section>ul>li>a.tgh-page-suggestion-link{position:relative;display:block!important;margin:0 -10px!important;padding:8px 10px!important;border-radius:8px!important;color:var(--tg-charcoal)!important;font-size:.8125rem!important;line-height:1.38!important;transition:background-color .18s ease,color .18s ease} 2384 .tgh-tagalys-suggestions .text-suggestion-section>ul>li>a.tgh-page-suggestion-link::after{content:'→';position:absolute;right:10px;top:50%;opacity:0;transform:translate(-4px,-50%);transition:opacity .18s ease,transform .18s ease} 2385 .tgh-tagalys-suggestions .text-suggestion-section>ul>li>a.tgh-page-suggestion-link:hover,.tgh-tagalys-suggestions .text-suggestion-section>ul>li>a.tgh-page-suggestion-link:focus-visible{background:var(--tg-offwhite)!important;color:var(--tg-black)!important;text-decoration:none!important} 2386 .tgh-tagalys-suggestions .text-suggestion-section>ul>li>a.tgh-page-suggestion-link:hover::after,.tgh-tagalys-suggestions .text-suggestion-section>ul>li>a.tgh-page-suggestion-link:focus-visible::after{opacity:1;transform:translate(0,-50%)} 2387 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestions{display:flex;flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none} 2388 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion{dis
2388play:flex;align-items:center;gap:7px;min-height:34px;margin:0;padding:5px 10px;border:1px solid var(--tg-border);border-radius:999px;background:var(--tg-offwhite);list-style:none;transition:border-color .18s ease,background-color .18s ease} 2389 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item{gap:4px;min-height:auto;padding:4px 2px 4px 6px!important;border:0!important;border-radius:0!important;background:var(--tg-offwhite)!important;cursor:default!important;box-shadow:none!important;transition:none!important;align-items:center!important} 2390 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item:hover,#tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item:focus-within{border:0!important;background:var(--tg-offwhite)!important;box-shadow:none!important} 2391 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion:not(.recent-search-item):hover{border-color:rgba(13,13,13,.22);background:var(--tg-white)} 2392 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .search-results-link{display:flex;align-items:center;gap:6px;font-size:.8125rem;line-height:1} 2393 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .search-results-link.tgh-recent-search-link,#tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .search-results-link.tgh-recent-search-link:hover,#tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .search-results-link.tgh-recent-search-link:focus,#tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .search-results-link.tgh-recent-search-link:focus-visible{gap:4px;padding:0!important;font-size:.75rem;line-height:1;cursor:default!important;flex:0 1 auto;max-width:calc(100% - 24px);background:transparent!important;color:var(--tg-black)!important;text-decoration:none!important;box-shadow:none!important;outline:none!important} 2394 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .search-results-link.tgh-recent-search-link .highlight,#tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .search-results-link.tgh-recent-search-link:hover .highlight{background:transparent!important;color:inherit!important;font-weight:inherit!important} 2395 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .recent-search-icon,#tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .popular-search-icon{width:15px;height:15px;fill:currentColor;opacity:.58;flex-shrink:0} 2396 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .recent-search-icon{width:13px;height:13px;opacity:.5} 2397 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .tgh-recent-search-remove{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;align-self:center;width:20px;height:20px;margin:0;padding:0;border:0;border-radius:0;background:transparent!important;color:inherit;cursor:pointer!important;flex-shrink:0;pointer-events:auto!important;line-height:0} 2398 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .tgh-recent-search-remove:hover,#tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .tgh-recent-search-remove:focus-visible{background:transparent!important} 2399 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .tgh-recent-search-remove:focus-visible{outline:2px solid var(--tg-black);outline-offset:1px} 2400 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .tgh-recent-search-remove .close-icon{width:12px!important;height:12px!important;display:block!important;margin:1px 0 0 0!important;fill:currentColor;opacity:.45;pointer-events:none} 2401 #tagalys-namespace.tgh-tagalys-suggestions .type-suggestions>.products,#tagalys-namespace.tgh-tagalys-suggestions .type-suggestions>.product-suggestions,#tagalys-namespace.tgh-tagalys-suggestions .products.product-suggestions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important;flex-direction:unset!important;flex-wrap:unset!important;border:0!important;padding:0!important;width:100%!important} 2402 #tagalys-namespace.tgh-tagalys-suggestions .type-suggestions.tgh-single-product-suggestion .products.product-suggestions{grid-template-columns:minmax(0,240px)!important;width:auto!important} 2403 .tgh-tagalys-suggestions img{max-width:100%;height:auto;display:block} 2404 .tgh-tagalys-suggestions .hint{margin-top:24px;font-size:14px;color:var(--tg-charcoal)} 2405 .tgh-tagalys-suggestions .highlight{color:var(--tg-black)!important;background:transparent!important;font-weight:600} 2406 .tgh-smart-widget .widget-header{margin-bottom:14px} 2407 .tgh-smart-widget .widget-heading{margin:0;font-family:var(--tg-font-body);font-size:15px;font-weight:600;line-height:1.4;color:var(--tg-black)} 2408 .tgh-smart-widget .products{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px} 2409 #tagalys-namespace.tgh-tagalys-suggestions .tgc-card{display:flex;flex-direction:column;min-width:0;color:var(--tg-ink);text-decoration:none!important} 2410 .tgh-tagalys-suggestions .tgc-card-img{position:relative;overflow:hidden;aspect-ratio:4/2.8;border:1px solid var(--tg-border);border-radius:12px;background:var(--tg-surface);transition:border-color .22s ease,box-shadow .22s ease} 2411 .tgh-tagalys-suggestions .tgc-card-img img{display:block;width:100%;height:100%;object-fit:contain;background:var(--tg-black);transition:transform .35s ease,opacity .35s ease} 2412 .tgh-tagalys-suggestions .tgc-card-img .tgc-img-hover{position:absolute;inset:0;opacity:0}
2412 2413 .tgh-tagalys-suggestions .tgc-card:hover .tgc-card-img img{transform:scale(1.035)} 2414 .tgh-tagalys-suggestions .tgc-card:hover .tgc-img-hover{opacity:1} 2415 .tgh-tagalys-suggestions .tgc-card:hover .tgc-card-img{border-color:rgba(13,13,13,.2);box-shadow:0 12px 30px rgba(0,0,0,.08)} 2416 .tgh-tagalys-suggestions .tgc-card-body{padding:12px 2px 0} 2417 .tgh-tagalys-suggestions .tgc-card-name{margin:0;color:var(--tg-black);font-size:.875rem;line-height:1.3;text-decoration:none!important;transition:color .18s ease} 2418 .tgh-tagalys-suggestions .tgc-card:hover .tgc-card-name{color:var(--tg-charcoal)} 2419 .tgh-search-help{margin-top:42px;padding-top:40px;border-top:1px solid var(--tg-border);display:flex;align-items:center;justify-content:space-between;gap:32px} 2420 .tgh-search-help>div{display:flex;flex-direction:column;gap:4px} 2421 .tgh-search-help strong{font-family:var(--tg-font-body);font-size:15px;font-weight:600;color:var(--tg-black)} 2422 .tgh-search-help span{font-size:13px;color:var(--tg-charcoal)} 2423 .tgh-search-help .tg-text-cta{flex-shrink:0} 2424 2425 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-block{display:block;border-radius:999px;background:linear-gradient(100deg,var(--tg-surface) 25%,color-mix(in srgb,var(--tg-surface) 70%,white) 45%,var(--tg-surface) 65%);background-size:220% 100%;animation:tgh-suggestions-skeleton-shimmer 1.25s ease-in-out infinite} 2426 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-product{display:flex;flex-direction:column;min-width:0} 2427 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-product-image{aspect-ratio:4/2.8;border:1px solid var(--tg-border);border-radius:12px} 2428 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-product-title{width:68%;height:14px;margin:12px 2px 0;border-radius:999px} 2429 #tagalys-namespace.tgh-tagalys-suggestions .tgh-recommendations-skeleton .products{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px;width:100%} 2430 2431 @keyframes tgh-suggestions-skeleton-shimmer{ 2432 from{background-position:100% 0} 2433 to{background-position:-100% 0} 2434 } 2435 2436 @media(max-width:860px){ 2437 .tgh-search-shell{inset:60px 0 0} 2438 .tgh-search-panel{max-height:calc(100dvh - 60px)} 2439 .tgh-search-inner{width:calc(100% - 32px);padding:34px 0 28px} 2440 .tgh-search-close{top:10px;right:10px} 2441 .tgh-search-input{height:50px;font-size:16px} 2442 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestions{gap:10px} 2443 .tgh-tagalys-suggestions .type-suggestions{grid-template-columns:1fr!important;gap:28px!important} 2444 #tagalys-namespace.tgh-tagalys-suggestions .type-suggestions>.products,#tagalys-namespace.tgh-tagalys-suggestions .type-suggestions>.product-suggestions,#tagalys-namespace.tgh-tagalys-suggestions .products.product-suggestions{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important} 2445 .tgh-smart-widget .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px} 2446 .tgh-search-help{margin-top:40px;padding-top:28px;align-items:flex-start;flex-direction:column;gap:20px} 2447 #tagalys-namespace.tgh-tagalys-suggestions .tgh-recommendations-skeleton .products{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px 12px} 2448 } 2449 2450 @media (prefers-reduced-motion: reduce){ 2451 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-block{animation:none} 2452 } 2453 2454 @media(min-width:861px) and (max-width:1180px){ 2455 .tgh-search-inner{width:calc(100% - 80px)} 2456 } 2457</style> 2458
2459<script> 2460 var _tghSearchReturnFocus = null; 2461 var _tghSearchSuggestionsInitialised = false; 2462 var _tghSearchSuggestionsRequested = false; 2463 var _tghHideSearchSuggestionsPopover = null; 2464 var _tghSearchIsPreparing = false; 2465 var _tghSearchPreparationTimer = null; 2466 2467 function finishTagalysSearchPreparation() { 2468 if (!_tghSearchIsPreparing) return; 2469 2470 var shell = document.getElementById('tghSearchShell'); 2471 _tghSearchIsPreparing = false; 2472 window.clearTimeout(_tghSearchPreparationTimer); 2473 if (!shell) return; 2474 2475 shell.classList.remove('tgh-search-preparing'); 2476 shell.hidden = true; 2477 if (typeof _tghHideSearchSuggestionsPopover === 'function') _tghHideSearchSuggestionsPopover(); 2478 if (!shell.querySelector('.search-suggestions')) _tghSearchSuggestionsRequested = false; 2479 } 2480 2481 function requestInitialTagalysSearchSuggestions() { 2482 var input = document.getElementById('tghSearchInput'); 2483 if (!_tghSearchSuggestionsInitialised || _tghSearchSuggestionsRequested || !input) return; 2484 2485 _tghSearchSuggestionsRequested = true; 2486 input.dispatchEvent(new Event('input', { bubbles: true })); 2487 } 2488 2489 function prepareTagalysSearchSuggestions(delay) { 2490 initTagalysSearchSuggestions(); 2491 if (!_tghSearchSuggestionsInitialised) return; 2492 2493 // Prepare the empty-query discovery content while the panel is hidden so opening it is only a reveal and focus operation. 2494 window.setTimeout(function () { 2495 var shell = document.getElementById('tghSearchShell'); 2496 if (!shell || !shell.hidden || _tghSearchSuggestionsRequested) return; 2497 2498 _tghSearchIsPreparing = true; 2499 shell.classList.add('tgh-search-preparing'); 2500 shell.hidden = false; 2501 requestInitialTagalysSearchSuggestions(); 2502 _tghSearchPreparationTimer = window.setTimeout(finishTagalysSearchPreparation, 2000); 2503 }, typeof delay === 'number' ? delay : 250); 2504 } 2505 2506 function tghRenderRecommendationProductSkeletonGrid(html, count) { 2507 var tiles = []; 2508 2509 for (var index = 0; index < count; index += 1) { 2510 tiles.push(html` 2511 <div class="tgh-skeleton-product" key=${index}> 2512 <div class="tgh-skeleton-block tgh-skeleton-product-image"></div> 2513 <div class="tgh-skeleton-block tgh-skeleton-product-title"></div> 2514 </div> 2515 `); 2516 } 2517 2518 return html` 2519 <div class="products" aria-hidden="true"> 2520 ${tiles} 2521 </div> 2522 `; 2523 } 2524 2525 function tghRenderSuggestionProductCard(html, product, helpers) { 2526 var customMetafields = product.metafields && product.metafields.custom 2527 ? product.metafields.custom 2528 : {}; 2529 var slides = customMetafields.slides && Array.isArray(customMetafields.slides.value) 2530 ? customMetafields.slides.value 2531 : []; 2532 var primarySlideImage = slides[0] && slides[0].image ? slides[0].image : null; 2533 var hoverSlideImage = slides[1] && slides[1].image ? slides[1].image : null; 2534 var primaryImage = primarySlideImage ? primarySlideImage.url + '&width=900' : null; 2535 var hoverImage = hoverSlideImage ? hoverSlideImage.url + '&width=900' : null; 2536 var navigateToProductDetailPage = function (event) { 2537 helpers.navigateToProductDetailPage(event, product); 2538 }; 2539 var productOptions = helpers.getTemplateOptions('product'); 2540 var productLink = productOptions.productPageUrl(product); 2541 2542 return html` 2543 <a 2544 class="tgc-card exclude-tagalys-css-reset" 2545 href=${productLink} 2546 onclick=${navigateToProductDetailPage} 2547 > 2548 <div class="tgc-card-img"> 2549 ${primaryImage 2550 ? html` 2551 <img 2552 src=${primaryImage} 2553 alt=${primarySlideImage.alt_text || product.title} 2554 loading="lazy" 2555 /> 2556 ` 2557 : null} 2558 ${hoverImage 2559 ? html` 2560 <img 2561 class="tgc-img-hover" 2562 src=${hoverImage} 2563 alt=${hoverSlideImage.alt_text || product.title} 2564 loading="lazy" 2565 /> 2566 ` 2567 : null} 2568 </div> 2569 <div class="tgc-card-body"> 2570 <h2 class="tgc-card-name tg-h5">${product.title}</h2> 2571 </div> 2572 </a> 2573 `; 2574 } 2575 2576 function tghGetSuggestionSectionKey(section) { 2577 var id = section.id || section.section_id || ''; 2578 return String(id).toLowerCase(); 2579 } 2580
2581 function tghMergeCollectionsAndPages(textSuggestions, maxItems) { 2582 if (!textSuggestions || !textSuggestions.length) return textSuggestions || []; 2583 2584 maxItems = maxItems || 8; 2585 var collectionsSection = null; 2586 var pagesSection = null; 2587 var otherSections = []; 2588 2589 textSuggestions.forEach(function (section) { 2590 var key = tghGetSuggestionSectionKey(section); 2591 if (key === 'collections') { 2592 collectionsSection = section; 2593 } else if (key === 'pages') { 2594 pagesSection = section; 2595 } else { 2596 otherSections.push(section); 2597 } 2598 }); 2599 2600 var collectionItems = collectionsSection && collectionsSection.items ? collectionsSection.items : []; 2601 var pageItems = pagesSection && pagesSection.items ? pagesSection.items : []; 2602 var mergedItems = collectionItems.concat(pageItems).slice(0, maxItems); 2603 2604 if (!mergedItems.length) { 2605 return otherSections; 2606 } 2607 2608 return otherSections.concat([ 2609 { 2610 id: 'pages', 2611 section_id: 'pages', 2612 title: 'Pages', 2613 section_title: 'Pages', 2614 type: 'links', 2615 items: mergedItems 2616 } 2617 ]); 2618 } 2619 2620 function initTagalysSearchSuggestions() { 2621 if (_tghSearchSuggestionsInitialised || !window.Tagalys || !Tagalys.UIWidgets || !Tagalys.UIWidgets.SearchSuggestions) return; 2622 2623 try { 2624 Tagalys.UIWidgets.SearchSuggestions.init('#tghSearchInput', { 2625 searchResultsURL: '/search', 2626 templates: { 2627 widget: { 2628 options: { 2629 sections: { 2630 products: { 2631 count: 4 2632 }, 2633 collections: { 2634 count: 4 2635 }, 2636 pages: { 2637 count: 4 2638 } 2639 }, 2640 selector: '.tgh-tagalys-suggestions', 2641 includeTagalysCSS: true, 2642 position: false, 2643 minimumCharactersToShowSuggestions: 2, 2644 alignToSelector: '#tghSearchPanelContent', 2645 inheritAlignmentElementWidth: true, 2646 canBindSearchSubmitActionToNearestFormElement: true, 2647 interactionSelectors: [".tgh-search-panel", ".tgh-root"] 2648 } 2649 }, 2650 hint: { 2651 render: function (html, args) { 2652 return html``; 2653 } 2654 }, 2655 recentSearchItem: { 2656 render: function (html, args) { 2657 var props = args.props; 2658 var helpers = props.helpers; 2659 var enteredSearchQuery = helpers.getEnteredSearchQuery(); 2660 var recentQuery = props.recentSearch.query; 2661 var getRecentSearchRemovalQuery = function () { 2662 var searchLink = helpers.getLink(recentQuery); 2663 if (searchLink && searchLink.indexOf('?') !== -1) { 2664 return searchLink.split('?').slice(1).join('?'); 2665 } 2666 return 'query=' + encodeURIComponent(recentQuery); 2667 }; 2668 var removeRecentSearch = function (event) { 2669 event.preventDefault(); 2670 event.stopPropagation(); 2671 if (event.stopImmediatePropagation) event.stopImmediatePropagation(); 2672 helpers.removeRecentSearch(getRecentSearchRemovalQuery()); 2673 }; 2674 2675 return html` 2676 <li class="click-suggestion recent-search-item"> 2677 <a 2678 class="search-results-link tgh-recent-search-link" 2679 href=${helpers.getLink(recentQuery)} 2680 > 2681 <${args.templates.recentSearchIcon} /> 2682 <${args.templates.highlighter} 2683 label=${recentQuery} 2684 highlight=${enteredSearchQuery} 2685 /> 2686 </a> 2687 <button 2688 type="button" 2689 class="tgh-recent-search-remove" 2690 aria-label=${`Remove "${recentQuery}" from recent searches`} 2691 onClick=${removeRecentSearch} 2692 > 2693 <${args.templates.closeIcon} onClick=${removeRecentSearch} /> 2694 </button> 2695 </li> 2696 `; 2697 } 2698 }, 2699 clickSuggestions: { 2700 callbacks: { 2701 afterInitialRender: function () { 2702 var suggestions = document.querySelector('.tgh-tagalys-suggestions'); 2703 if (suggestions) suggestions.setAttribute('aria-busy', 'false'); 2704 2705 Tagalys.UIWidgets.Recommendations.init("[data-smart-widget]", { 2706 recommendationId: "529e3cca2f6d43262300", 2707 templates: { 2708 widget: { 2709 options: { 2710 count: 4, 2711 includeTagalysCSS: false, 2712 displayFormat: "grid" 2713 },
2714 render: function (html, args) { 2715 var props = args.props; 2716 var helpers = props.helpers; 2717 var products = helpers.getProducts(); 2718 2719 if (props.loading !== false) { 2720 return html` 2721 <div 2722 class="widget tgh-recommendations-skeleton" 2723 role="status" 2724 aria-busy="true" 2725 aria-label="Loading recommendations" 2726 > 2727 ${tghRenderRecommendationProductSkeletonGrid(html, 4)} 2728 </div> 2729 `; 2730 } 2731 2732 if (products.length === 0) { 2733 return null; 2734 } 2735 2736 return html` 2737 <div class="widget"> 2738 <div class="widget-body"> 2739 <${args.templates.productList} /> 2740 </div> 2741 <${args.templates.footer} /> 2742 </div> 2743 `; 2744 }, 2745 callbacks: { 2746 afterInitialRender: finishTagalysSearchPreparation 2747 } 2748 }, 2749 product: { 2750 render: function (html, args) { 2751 return tghRenderSuggestionProductCard( 2752 html, 2753 args.props.product, 2754 args.props.helpers 2755 ); 2756 } 2757 } 2758 } 2759 }); 2760 } 2761 }, 2762 render: function (html, args) { 2763 var helpers = args.props.helpers; 2764 var recentAndPopularSearches = helpers.getRecentAndPopularSearches(); 2765 var recentSearches = recentAndPopularSearches.recentSearches || []; 2766 var popularSearches = recentAndPopularSearches.popularSearches || []; 2767 var hasClickSuggestions = recentSearches.length > 0 || popularSearches.length > 0; 2768 2769 return html` 2770 <div class="tgh-search-discovery"> 2771 ${hasClickSuggestions 2772 ? html` 2773 <ul class="click-suggestions"> 2774 ${recentSearches.map( 2775 recentSearch => 2776 html`<${args.templates.recentSearchItem} recentSearch=${recentSearch} />` 2777 )} 2778 ${popularSearches.map( 2779 popularSearch => 2780 html`<${args.templates.popularSearchItem} popularSearch=${popularSearch} />` 2781 )} 2782 </ul> 2783 ` 2784 : null} 2785 <div class="tgh-smart-widget exclude-tagalys-css exclude-tagalys-css-reset" data-smart-widget></div> 2786 </div> 2787 `; 2788 } 2789 }, 2790 typeSuggestions: { 2791 render: function (html, args) { 2792 var props = args.props; 2793 var helpers = props.helpers; 2794 var textSuggestions = tghMergeCollectionsAndPages(helpers.getTextSuggestions(), 8); 2795 var products = helpers.getProducts ? helpers.getProducts() : []; 2796 2797 var classes = ['type-suggestions']; 2798 if (helpers.hasTextSearchSuggestions()) { 2799 classes.push('product-and-text-suggestions'); 2800 } else { 2801 classes.push('product-suggestions'); 2802 } 2803 if (products.length === 1) { 2804 classes.push('tgh-single-product-suggestion'); 2805 } 2806 2807 return html` 2808 <div class=${classes.join(' ')}> 2809 ${products.length 2810 ? html` 2811 <div class="tgh-product-suggestions-column">
2812 <span class="section-title">Features</span> 2813 <${args.templates.products} class="product-suggestions" /> 2814 </div> 2815 ` 2816 : null} 2817 ${helpers.hasTextSearchSuggestions() 2818 ? html` 2819 <ul class="text-suggestions"> 2820 ${textSuggestions.map( 2821 textSuggestionSection => 2822 html`<${args.templates.textSuggestionSection} textSuggestionSection=${textSuggestionSection} />` 2823 )} 2824 </ul> 2825 ` 2826 : null} 2827 </div> 2828 `; 2829 } 2830 }, 2831 textSuggestionSection: { 2832 render: function (html, args) { 2833 var textSuggestionSection = args.props.textSuggestionSection; 2834 if (!textSuggestionSection.items || !textSuggestionSection.items.length) { 2835 return null; 2836 } 2837 2838 return html` 2839 <li 2840 class="text-suggestion-section" 2841 data-section-id=${textSuggestionSection.id} 2842 > 2843 <span class="section-title">${textSuggestionSection.title}</span> 2844 <ul> 2845 ${textSuggestionSection.items.map(function (textSuggestionSectionItem) { 2846 return html` 2847 <${args.templates.textSuggestionSectionItem} 2848 textSuggestionSectionId=${textSuggestionSection.id} 2849 textSuggestionSectionItem=${textSuggestionSectionItem} 2850 /> 2851 `; 2852 })} 2853 </ul> 2854 </li> 2855 `; 2856 } 2857 }, 2858 textSuggestionSectionItem: { 2859 render: function (html, args) { 2860 var helpers = args.props.helpers; 2861 var enteredSearchQuery = helpers.getEnteredSearchQuery(); 2862 var item = args.props.textSuggestionSectionItem; 2863 var url = item.link ? item.link : helpers.getLink(item.query); 2864 var label = item.title ? item.title : item.query; 2865 2866 return html` 2867 <li> 2868 <a class="search-results-link tgh-page-suggestion-link" href=${url}> 2869 <${args.templates.highlighter} 2870 label=${label} 2871 highlight=${enteredSearchQuery} 2872 /> 2873 </a> 2874 </li> 2875 `; 2876 } 2877 }, 2878 products: { 2879 render: function (html, args) { 2880 var props = args.props; 2881 var products = props.helpers.getProducts(); 2882 var extraClass = props.className || props.class || ''; 2883 2884 return html` 2885 <div class=${`products product-suggestions ${extraClass}`.trim()}> 2886 ${products.map(function (product) { 2887 return html`<${args.templates.product} key=${product.id} product=${product} />`; 2888 })} 2889 </div> 2890 `; 2891 } 2892 }, 2893 product: { 2894 render: function (html, args) { 2895 return tghRenderSuggestionProductCard( 2896 html, 2897 args.props.product, 2898 args.props.helpers 2899 ); 2900 } 2901 } 2902 }, 2903 callbacks: { 2904 afterInitialRender: function (args) { 2905 _tghHideSearchSuggestionsPopover = args.hideSearchSuggestionsPopover; 2906 } 2907 } 2908 }); 2909 2910 _tghSearchSuggestionsInitialised = true; 2911 } catch (error) { 2912 console.warn('[Tagalys search] Suggestions could not initialise.', error); 2913 } 2914 } 2915 2916 function tghSearchOpen(event) { 2917 var shell = document.getElementById('tghSearchShell'); 2918 var input = document.getElementById('tghSearchInput'); 2919 if (!shell || !input) return; 2920 if (_tghSearchIsPreparing) { 2921 _tghSearchIsPreparing = false;
2922 window.clearTimeout(_tghSearchPreparationTimer); 2923 shell.classList.remove('tgh-search-preparing'); 2924 } 2925 if (typeof _tghOpen !== 'undefined' && _tghOpen) tghCloseNow(_tghOpen); 2926 if (typeof tghDrawerClose === 'function') tghDrawerClose(); 2927 _tghSearchReturnFocus = event && event.currentTarget ? event.currentTarget : document.activeElement; 2928 shell.hidden = false; 2929 shell.setAttribute('aria-hidden', 'false'); 2930 document.body.classList.add('tgh-search-open'); 2931 document.querySelectorAll('[aria-controls="tghSearchPanel"]').forEach(function(button){button.setAttribute('aria-expanded','true')}); 2932 function focusAndShowSuggestions() { 2933 input.focus({ preventScroll: true }); 2934 if (!shell.querySelector('.search-suggestions')) _tghSearchSuggestionsRequested = false; 2935 requestInitialTagalysSearchSuggestions(); 2936 } 2937 2938 function initialiseSuggestionsAndFocus() { 2939 prepareTagalysSearchSuggestions(); 2940 focusAndShowSuggestions(); 2941 } 2942 2943 if (_tghSearchSuggestionsInitialised) { 2944 focusAndShowSuggestions(); 2945 } else if (typeof window.onTagalysReady === 'function') { 2946 window.onTagalysReady(initialiseSuggestionsAndFocus); 2947 } else { 2948 initialiseSuggestionsAndFocus(); 2949 } 2950 } 2951 2952 function tghSearchClose() { 2953 var shell = document.getElementById('tghSearchShell'); 2954 if (!shell || shell.hidden) return; 2955 shell.classList.add('tgh-search-closing'); 2956 if (typeof _tghHideSearchSuggestionsPopover === 'function') _tghHideSearchSuggestionsPopover(); 2957 shell.hidden = true; 2958 shell.setAttribute('aria-hidden', 'true'); 2959 shell.classList.remove('tgh-search-closing'); 2960 document.body.classList.remove('tgh-search-open'); 2961 document.querySelectorAll('[aria-controls="tghSearchPanel"]').forEach(function(button){button.setAttribute('aria-expanded','false')}); 2962 if (_tghSearchReturnFocus && typeof _tghSearchReturnFocus.focus === 'function') _tghSearchReturnFocus.focus(); 2963 _tghSearchSuggestionsRequested = false; 2964 var suggestions = document.querySelector('.tgh-tagalys-suggestions'); 2965 if (suggestions) suggestions.setAttribute('aria-busy', 'true'); 2966 } 2967 2968 document.addEventListener('keydown',function(event){ 2969 var shell=document.getElementById('tghSearchShell'); 2970 if(!shell||shell.hidden)return; 2971 if(event.key==='Escape'){event.preventDefault();tghSearchClose();return} 2972 if(event.key!=='Tab')return; 2973 var focusable=Array.from(shell.querySelectorAll('a[href],button:not([disabled]),input:not([disabled])')).filter(function(element){return element.offsetParent!==null}); 2974 if(!focusable.length)return; 2975 var first=focusable[0],last=focusable[focusable.length-1]; 2976 if(event.shiftKey&&document.activeElement===first){event.preventDefault();last.focus()} 2977 if(!event.shiftKey&&document.activeElement===last){event.preventDefault();first.focus()} 2978 }); 2979 2980 (function () { 2981 var searchForm = document.querySelector('#tghSearchPanelContent .tgh-search-form'); 2982 if (searchForm) { 2983 searchForm.addEventListener('submit', function () { 2984 tghSearchClose(); 2985 }); 2986 } 2987 })(); 2988 2989 if (typeof window.onTagalysReady === 'function') { 2990 window.onTagalysReady(prepareTagalysSearchSuggestions); 2991 } 2992</script>
2992 2993 2994 2995 2996 2997 2998 2999 3000<div class="tgh-drawer-panel" id="panel-mega_menu_iaemkv"> 3001 <div class="tgh-panel-head"> 3002 <button class="tgh-panel-back" onclick="tghDrawerPanelClose()" aria-label="Back"> 3003 <svg viewBox="0 0 24 24" fill="none"><path d="M15 18l-6-6 6-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 3004 </button> 3005 <div class="tgh-panel-title">Collections</div> 3006 </div> 3007 3008 <div class="tgh-panel-content"> 3009 3010 3011 <div class="tgh-panel-group"> 3012 <div class="tgh-panel-heading">CONTROL</div> 3013 3014 3015 3016<a href="/products/smart-pinning" class="tgh-panel-link">Pin with conditions</a> 3017 3018 3019 3020<a href="/products/trending-score" class="tgh-panel-link">Trending Score</a> 3021 3022 3023 3024<a href="/products/product-boost" class="tgh-panel-link">Product Boost</a> 3025 3026 3027 3028<a href="/products/global-sort-options" class="tgh-panel-link">Global Sort Options</a> 3029 3030 3031 3032 </div> 3033 3034 3035 3036 <div class="tgh-panel-group"> 3037 <div class="tgh-panel-heading">CURATE</div> 3038 3039 3040 3041<a href="/products/looks" class="tgh-panel-link">Looks</a> 3042 3043 3044 3045<a href="/products/visual-sequences" class="tgh-panel-link">Sequences</a> 3046 3047 3048 3049 </div> 3050 3051 3052 3053 <div class="tgh-panel-group"> 3054 <div class="tgh-panel-heading">SCALE</div> 3055 3056 3057 3058<a href="/products/markets" class="tgh-panel-link">Markets</a> 3059 3060 3061 3062<a href="/products/server-side" class="tgh-panel-link">Server Side</a> 3063 3064 3065 3066<a href="/products/size-merchandising" class="tgh-panel-link">Size Merchandising</a> 3067 3068 3069 3070 </div> 3071 3072 3073 3074 3075 <a href="/collections/collection-merchandising" class="tg-text-cta tgh-panel-cta"> 3076 EXPLORE COLLECTION MERCHANDISING 3077 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 3078 </a> 3079 3080 </div> 3081 </div> 3082 3083 3084 3085 3086 3087 3088 3089<div class="tgh-drawer-panel" id="panel-mega_menu_lkjzmk"> 3090 <div class="tgh-panel-head"> 3091 <button class="tgh-panel-back" onclick="tghDrawerPanelClose()" aria-label="Back"> 3092 <svg viewBox="0 0 24 24" fill="none"><path d="M15 18l-6-6 6-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 3093 </button> 3094 <div class="tgh-panel-title">Search</div> 3095 </div> 3096 3097 <div class="tgh-panel-content"> 3098 3099 3100 <div class="tgh-panel-group"> 3101 <div class="tgh-panel-heading">CONTROL</div> 3102 3103 3104 3105<a href="/products/pinned-searches" class="tgh-panel-link">Pinned Search</a> 3106 3107 3108 3109<a href="/products/popular-searches" class="tgh-panel-link">Popular Search</a> 3110 3111 3112 3113<a href="/products/trending-score" class="tgh-panel-link">Trending Score</a> 3114 3115 3116 3117<a href="/products/global-sort-options" class="tgh-panel-link">Global Sort Options</a> 3118 3119 3120 3121 </div> 3122 3123 3124 3125 <div class="tgh-panel-group"> 3126 <div class="tgh-panel-heading">FIND</div> 3127 3128 3129 3130<a href="/products/predictive-search" class="tgh-panel-link">Predictive Search</a> 3131 3132 3133 3134<a href="/products/search-accuracy" class="tgh-panel-link">Search Accuracy</a> 3135 3136 3137 3138<a href="/products/refine-search-results" class="tgh-panel-link">Search Results</a> 3139 3140 3141 3142 </div> 3143 3144 3145 3146 3147 3148 3149 <a href="/collections/site-search" class="tg-text-cta tgh-panel-cta"> 3150 EXPLORE SITE SEARCH 3151 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
3151<path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 3152 </a> 3153 3154 </div> 3155 </div> 3156 3157 3158 3159 3160 3161 3162 3163<div class="tgh-drawer-panel" id="panel-mega_menu_bty84e"> 3164 <div class="tgh-panel-head"> 3165 <button class="tgh-panel-back" onclick="tghDrawerPanelClose()" aria-label="Back"> 3166 <svg viewBox="0 0 24 24" fill="none"><path d="M15 18l-6-6 6-6" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 3167 </button> 3168 <div class="tgh-panel-title">Recommendations</div> 3169 </div> 3170 3171 <div class="tgh-panel-content"> 3172 3173 3174 <div class="tgh-panel-group"> 3175 <div class="tgh-panel-heading">CONTROL</div> 3176 3177 3178 3179<a href="/products/smart-pinning" class="tgh-panel-link">Pin with conditions</a> 3180 3181 3182 3183<a href="/products/trending-score" class="tgh-panel-link">Trending Score</a> 3184 3185 3186 3187<a href="/products/product-boost" class="tgh-panel-link">Product Boost</a> 3188 3189 3190 3191<a href="/products/global-sort-options" class="tgh-panel-link">Global Sort Options</a> 3192 3193 3194 3195 </div> 3196 3197 3198 3199 <div class="tgh-panel-group"> 3200 <div class="tgh-panel-heading">DISCOVER</div> 3201 3202 3203 3204<a href="/products/similar-products" class="tgh-panel-link">Similar Products</a> 3205 3206 3207 3208<a href="/products/trending-best-sellers-recommendations" class="tgh-panel-link">Trending / Best Sellers</a> 3209 3210 3211 3212<a href="/products/new-arrivals-recommendations" class="tgh-panel-link">New Arrivals</a> 3213 3214 3215 3216 </div> 3217 3218 3219 3220 3221 3222 3223 <a href="/collections/product-recommendations" class="tg-text-cta tgh-panel-cta"> 3224 Explore Product Recommendations 3225 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/><path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 3226 </a> 3227 3228 </div> 3229 </div> 3230 3231 3232 3233 3234 3235 3236 3237 3238 3239
3240<script> 3241var _tghOpen=null;var _tghTimer=null; 3242function tghOpen(key){clearTimeout(_tghTimer);if(typeof tghSearchClose==='function')tghSearchClose();if(_tghOpen===key)return;if(_tghOpen)tghCloseNow(_tghOpen);var el=document.querySelector('.tgh-item[data-key="'+key+'"]');if(!el)return;el.classList.add('open');var btn=el.querySelector('.tgh-item-trigger');if(btn)btn.setAttribute('aria-expanded','true');document.getElementById('tghOverlay').classList.add('on');_tghOpen=key} 3243function tghOpen(key){clearTimeout(_tghTimer);if(_tghOpen===key)return;if(_tghOpen)tghCloseNow(_tghOpen);var el=document.querySelector('.tgh-item[data-key="'+key+'"]');if(!el)return;el.classList.add('open');var btn=el.querySelector('.tgh-item-trigger');if(btn)btn.setAttribute('aria-expanded','true');document.getElementById('tghOverlay').classList.add('on');_tghOpen=key} 3244function tghClose(key){_tghTimer=setTimeout(function(){tghCloseNow(key)},120)} 3245function tghCloseNow(key){var el=document.querySelector('.tgh-item[data-key="'+key+'"]');if(el){el.classList.remove('open');var btn=el.querySelector('.tgh-item-trigger');if(btn)btn.setAttribute('aria-expanded','false')}if(_tghOpen===key){document.getElementById('tghOverlay').classList.remove('on');_tghOpen=null}} 3246document.addEventListener('DOMContentLoaded',function(){document.querySelectorAll('.tgh-mega,.tgh-drop').forEach(function(menu){var item=menu.closest('.tgh-item');if(!item)return;var key=item.dataset.key;menu.addEventListener('mouseenter',function(){clearTimeout(_tghTimer)});menu.addEventListener('mouseleave',function(){tghClose(key)})})}); 3247function tghDrawerOpen(){ 3248 var searchShell = document.getElementById('tghSearchShell'); 3249 if (searchShell && !searchShell.hidden && typeof tghSearchClose === 'function') tghSearchClose(); 3250 document.getElementById('tghDrawer').classList.add('open'); 3251 document.body.style.overflow='hidden'; 3252} 3253function tghDrawerClose(){document.getElementById('tghDrawer').classList.remove('open');document.querySelectorAll('.tgh-drawer-panel.open').forEach(function(panel){panel.classList.remove('open')});document.body.style.overflow=''} 3254function tghDrawerSubmenu(key){var panel=document.getElementById('panel-'+key);if(!panel)return;panel.classList.add('open')} 3255function tghDrawerPanelClose(){document.querySelectorAll('.tgh-drawer-panel.open').forEach(function(panel){panel.classList.remove('open')})} 3256document.addEventListener('keydown',function(e){if(e.key==='Escape'){if(_tghOpen)tghCloseNow(_tghOpen);tghDrawerClose()}}); 3257window.addEventListener('scroll',function(){var nav=document.getElementById('tghNav');if(nav)nav.classList.toggle('scrolled',window.scrollY>20)},{passive:true}); 3258</script>
3258 3259 3260</section> 3261<!-- END sections: header-group --> 3262 </div> 3263 3264
3264<script> 3265 // Inline header height and menu style calculations to prevent layout shift 3266 // Note: Updates in calculateHeaderGroupHeight(), updateTransparentHeaderOffset() and setHeaderMenuStyle() utilities.js should be kept in sync with this function 3267 (function setHeaderHeighCustomProperties() { 3268 /* 3269 * Header calculation functions for maintaining CSS variables 3270 * Mimic calculateHeaderGroupHeight() in utilities.js 3271 */ 3272 const header = document.querySelector('header-component'); 3273 const headerGroup = document.querySelector('#header-group'); 3274 const hasHeaderSection = headerGroup?.querySelector('.header-section'); 3275 3276 if (!header || !headerGroup) return; 3277 3278 const headerTopRow = header.querySelector('.header__row--top'); 3279 const headerHeight = header.offsetHeight; 3280 3281 // Calculate the total height of the header group 3282 let headerGroupHeight = 0; 3283 const children = headerGroup.children; 3284 for (let i = 0; i < children.length; i++) { 3285 const element = children[i]; 3286 if (element === header || !(element instanceof HTMLElement)) continue; 3287 headerGroupHeight += element.offsetHeight; 3288 } 3289 3290 // Check for transparent header special case 3291 if (header.hasAttribute('transparent') && header.parentElement?.nextElementSibling) { 3292 headerGroupHeight += headerHeight; 3293 } 3294 3295 // Set CSS variables 3296 document.body.style.setProperty('--header-height', `${headerHeight}px`); 3297 document.body.style.setProperty('--header-group-height', `${headerGroupHeight}px`); 3298 3299 if (headerTopRow) { 3300 window.requestAnimationFrame(function () { 3301 document.body.style.setProperty('--top-row-height', `${headerTopRow.offsetHeight}px`); 3302 }); 3303 } 3304 3305 /** 3306 * Updates CSS custom properties for transparent header offset calculation 3307 * Mimic updateTransparentHeaderOffset() in utilities.js 3308 */ 3309 3310 if (!hasHeaderSection || !header?.hasAttribute('transparent')) { 3311 document.body.style.setProperty('--transparent-header-offset-boolean', '0'); 3312 return; 3313 } 3314 3315 const hasImmediateSection = hasHeaderSection.nextElementSibling?.classList.contains('shopify-section'); 3316 3317 const shouldApplyOffset = !hasImmediateSection ? '1' : '0'; 3318 document.body.style.setProperty('--transparent-header-offset-boolean', shouldApplyOffset); 3319 })(); 3320 3321 (function setHeaderMenuStyle() { 3322 const headerComponent = document.querySelector('#header-component'); 3323 if (headerComponent) { 3324 const isTouchDevice = 'ontouchstart' in window && navigator.maxTouchPoints > 0; 3325 const overflowList = headerComponent?.querySelector('overflow-list'); 3326 const hasReachedMinimum = overflowList && overflowList.hasAttribute('minimum-reached'); 3327 headerComponent.dataset.menuStyle = isTouchDevice || hasReachedMinimum ? 'drawer' : 'menu'; 3328 } 3329 })(); 3330 </script>
3330 3331 3332 <main 3333 id="MainContent" 3334 class="content-for-layout" 3335 role="main" 3336 data-page-transition-enabled="false" 3337 data-product-transition="false" 3338 data-template="blog" 3339 > 3340 <section id="shopify-section-template--19314630361186__main" class="shopify-section tagalys-blog-index-section"> 3341 3342 3343<section class="tg-blog-index"> 3344 3345 <header class="tg-blog-index-hero tg-section"> 3346 <div class="tg-blog-index-hero__inner tg-reading-wrap"> 3347 3348 <div class="tg-label tg-label--dark">Tagalys Resources</div> 3349 3350 3351 <h1 class="tg-blog-index-hero__title tg-h1"> 3352 3353 Thoughts on fashion merchandising 3354 3355 </h1> 3356 3357 3358 <p class="tg-blog-index-hero__copy tg-copy">Insights from the people building merchandising software for fashion brands on Shopify.</p> 3359 3360 </div> 3361 </header> 3362 3363 <nav class="tg-blog-filters" aria-label="Filter articles"> 3364 <div class="tg-blog-filters__inner tg-wrap"> 3365 <a href="/blogs/resources" class="tg-blog-filter is-active"> 3366 Latest 3367 </a> 3368 3369 3370 3371 3372 3373<a href="/blogs/resources/tagged/merchandising" 3374 class="tg-blog-filter"> 3375 Merchandising 3376</a> 3377 3378 3379 3380 3381<a href="/blogs/resources/tagged/search" 3382 class="tg-blog-filter"> 3383 Search 3384</a> 3385 3386 3387 3388 3389<a href="/blogs/resources/tagged/recommendations" 3390 class="tg-blog-filter"> 3391 Recommendations 3392</a> 3393 3394 3395 3396 3397<a href="/blogs/resources/tagged/industry" 3398 class="tg-blog-filter"> 3399 Industry 3400</a> 3401 3402 3403 3404 3405<a href="/blogs/resources/tagged/guides" 3406 class="tg-blog-filter"> 3407 Guides 3408</a> 3409 3410 3411 3412 </div> 3413 </nav> 3414 3415 <div class="tg-blog-index__grid-wrap tg-section"> 3416 <div class="tg-wrap"> 3417 3418 <div class="tg-blog-index-grid"> 3419 3420 3421 3422 3423 3424 3425 3426 3427 3428 3429 3430 3431 3432 3433 3434 3435 3436 3437 3438 3439 3440 3441 3442 3443 3444 3445 3446 3447 3448 3449 3450 3451 3452 <a href="/blogs/resources/articles-reimagine-fashion-merchandising" class="tg-blog-index-card"> 3453 <div class="tg-blog-index-card__media"> 3454 3455 <img 3456 src="//www.tagalys.com/cdn/shop/articles/68e77129eafd54b490054c46_Blog.jpg?v=1782452872&width=760" 3457 alt="A new way to merchandise fashion - see it first" 3458 loading="eager" 3459 > 3460 3461</div> 3462 3463 <div class="tg-blog-index-card__body"> 3464 3465 <span class="tg-label">Industry</span> 3466 3467 3468 <h2 class="tg-blog-index-card__title tg-h4">A new way to merchandise fashion - see it first</h2> 3469 3470 <p class="tg-blog-index-card__excerpt tg-small"> 3471 3472 Fashion merchandising has always been emotional. Online, it too often turns mechanical, working SKU by SKU. Teams spend ho... 3473 3474 </p> 3475 3476 <div class="tg-blog-index-card__date"> 3477 Oct 9, 2025 3478 </div> 3479 </div> 3480 </a> 3481 3482 3483 3484 3485 3486 3487 3488 3489 3490 3491 3492 3493 3494 3495 3496 3497 3498 3499 3500 3501 3502 3503 3504 3505 3506 3507 3508 3509 3510 3511 3512 3513 3514 <a href="/blogs/resources/articles-ai-fashion-ecommerce-online-retailer" class="tg-blog-index-card"> 3515 <div class="tg-blog-index-card__media"> 3516 3517 <img 3518 src="//www.tagalys.com/cdn/shop/articles/688b0765d0289e3a4525e0c9_ai-fashion-ecomm-blog-online-retailer.jpg?v=1782452820&width=760" 3519 alt="State of AI in fashion eCommerce in 2025 | Search, Conversational Commerce, Analytics" 3520 loading="eager" 3521 > 3522 3523</div> 3524 3525 <div class="tg-blog-index-card__body"> 3526 3527 <span class="tg-label">Industry</span> 3528 3529 3530 <h2 class="tg-blog-index-card__title tg-h4">State of AI in fashion eCommerce in 2025 | Search, Conversational Commerce, Analytics</h2> 3531 3532 <p class="tg-blog-index-card__excerpt tg-small"> 3533 3534 AI is everywhere right now, on every roadmap, investor deck, podcast, and feature release. Product teams are shipping “AI-... 3535 3536 </p> 3537 3538 <div class="tg-blog-index-card__date"> 3539 Jul 31, 2025 3540 </div> 3541 </div> 3542 </a> 3543 3544 3545 3546 3547 3548 3549 3550 3551 3552 <a href="/blogs/resources/articles-strategize-merchandising-with-effective-scheduling" class="tg-blog-index-card"> 3553 <div class="tg-blog-index-card__media"> 3554 3555 <img 3556 src="//www.tagalys.com/cdn/shop/articles/64a4052b7f4530a898681b48_Merchandising-with-effective-scheduling.jpg?v=1782452878&width=760" 3557 alt="Strategize merchandising with effective scheduling" 3558 loading="eager" 3559 > 3560 3561</div> 3562 3563 <div class="tg-blog-index-card__body"> 3564
3565 <span class="tg-label">Merchandising</span> 3566 3567 3568 <h2 class="tg-blog-index-card__title tg-h4">Strategize merchandising with effective scheduling</h2> 3569 3570 <p class="tg-blog-index-card__excerpt tg-small"> 3571 3572 Imagine a bustling online retail environment, with the upcoming seasonal sales, or a midnight sale just around the corner.... 3573 3574 </p> 3575 3576 <div class="tg-blog-index-card__date"> 3577 Jul 4, 2023 3578 </div> 3579 </div> 3580 </a> 3581 3582 3583 3584 3585 3586 3587 3588 3589 3590 <a href="/blogs/resources/articles-7-essential-merchandising-tips-for-fashion-retailers" class="tg-blog-index-card"> 3591 <div class="tg-blog-index-card__media"> 3592 3593 <img 3594 src="//www.tagalys.com/cdn/shop/articles/648d4f38ff4554bc4a257485_Essential-merchandising-tips-for-fashion-retailers-Tagalys.jpg?v=1782452818&width=760" 3595 alt="7 Essential merchandising tips for fashion retailers" 3596 loading="eager" 3597 > 3598 3599</div> 3600 3601 <div class="tg-blog-index-card__body"> 3602 3603 <span class="tg-label">Merchandising</span> 3604 3605 3606 <h2 class="tg-blog-index-card__title tg-h4">7 Essential merchandising tips for fashion retailers</h2> 3607 3608 <p class="tg-blog-index-card__excerpt tg-small"> 3609 3610 IntroductionThe fashion industry is undeniably one of the most rapidly evolving industries in the world. The fashion indus... 3611 3612 </p> 3613 3614 <div class="tg-blog-index-card__date"> 3615 Jun 17, 2023 3616 </div> 3617 </div> 3618 </a> 3619 3620 3621 3622 3623 3624 3625 3626 3627 3628 3629 3630 3631 3632 3633 3634 3635 3636 3637 3638 3639 3640 3641 3642 3643 3644 3645 3646 3647 3648 3649 3650 3651 3652 3653 3654 3655 3656 3657 3658 3659 3660 <a href="/blogs/resources/articles-optimizing-the-checkout-page-dos-and-donts" class="tg-blog-index-card"> 3661 <div class="tg-blog-index-card__media"> 3662 3663 <img 3664 src="//www.tagalys.com/cdn/shop/articles/6482c647cdc02c5dfb9a25ec_Tips-for-optimizing-checkout-page-Tagalys.jpg?v=1787060501&width=760" 3665 alt="Optimizing the Checkout Page: Dos and Don'ts" 3666 loading="eager" 3667 > 3668 3669</div> 3670 3671 <div class="tg-blog-index-card__body"> 3672 3673 <span class="tg-label">Guides</span> 3674 3675 3676 <h2 class="tg-blog-index-card__title tg-h4">Optimizing the Checkout Page: Dos and Don'ts</h2> 3677 3678 <p class="tg-blog-index-card__excerpt tg-small"> 3679 3680 A checkout page is one of the most critical and final points of a transaction with the customer and can significantly impa... 3681 3682 </p> 3683 3684 <div class="tg-blog-index-card__date"> 3685 Jun 9, 2023 3686 </div> 3687 </div> 3688 </a> 3689 3690 3691 3692 3693 3694 3695 3696 3697 3698 3699 3700 3701 3702 3703 3704 3705 3706 3707 3708 3709 3710 3711 3712 3713 3714 3715 3716 3717 3718 3719 3720 3721 3722 3723 3724 3725 3726 3727 3728 3729 3730 <a href="/blogs/resources/articles-is-recommerce-future-of-a-sustainable-retail" class="tg-blog-index-card"> 3731 <div class="tg-blog-index-card__media"> 3732 3733 <img 3734 src="//www.tagalys.com/cdn/shop/articles/646f33cbc3e1c85bd041e15d_Recommerce-The_20future_20of_20sustainable_20retail.jpg?v=1787060427&width=760" 3735 alt="Is Recommerce the future of a sustainable retail?" 3736 loading="eager" 3737 > 3738 3739</div> 3740 3741 <div class="tg-blog-index-card__body"> 3742 3743 <span class="tg-label">Guides</span> 3744 3745 3746 <h2 class="tg-blog-index-card__title tg-h4">Is Recommerce the future of a sustainable retail?</h2> 3747 3748 <p class="tg-blog-index-card__excerpt tg-small"> 3749 3750 While the term "recommerce" may be a recent addition to our vocabulary, the idea of reusing or purchasing second-hand item... 3751 3752 </p> 3753 3754 <div class="tg-blog-index-card__date"> 3755 May 25, 2023 3756 </div> 3757 </div> 3758 </a> 3759 3760 3761 3762 3763 3764 3765 3766 3767 3768 <a href="/blogs/resources/articles-product-listing-pages-plps-an-overview" class="tg-blog-index-card"> 3769 <div class="tg-blog-index-card__media"> 3770 3771 <img 3772 src="//www.tagalys.com/cdn/shop/articles/6461cffc82c013a06b77456e_Product-listing-pages-An-Overview-Tagalys.jpg?v=1782452869&width=760" 3773 alt="Product Listing Pages (PLPs): An Overview" 3774 loading="lazy" 3775 > 3776 3777</div> 3778 3779 <div class="tg-blog-index-card__body"> 3780
3781 <span class="tg-label">Merchandising</span> 3782 3783 3784 <h2 class="tg-blog-index-card__title tg-h4">Product Listing Pages (PLPs): An Overview</h2> 3785 3786 <p class="tg-blog-index-card__excerpt tg-small"> 3787 3788 The Product Listing Page (or category landing page) in an eCommerce is the page that displays a list of products from a sp... 3789 3790 </p> 3791 3792 <div class="tg-blog-index-card__date"> 3793 May 15, 2023 3794 </div> 3795 </div> 3796 </a> 3797 3798 3799 3800 3801 3802 3803 3804 3805 3806 3807 3808 3809 3810 3811 3812 3813 3814 3815 3816 3817 3818 3819 3820 3821 3822 <a href="/blogs/resources/articles-product-recommendations-best-practices" class="tg-blog-index-card"> 3823 <div class="tg-blog-index-card__media"> 3824 3825 <img 3826 src="//www.tagalys.com/cdn/shop/articles/645cc1b484048417ae3f1273_Product-recommendations-best-practices.jpg?v=1782452870&width=760" 3827 alt="Product Recommendations: Best Practices" 3828 loading="lazy" 3829 > 3830 3831</div> 3832 3833 <div class="tg-blog-index-card__body"> 3834 3835 <span class="tg-label">Recommendations</span> 3836 3837 3838 <h2 class="tg-blog-index-card__title tg-h4">Product Recommendations: Best Practices</h2> 3839 3840 <p class="tg-blog-index-card__excerpt tg-small"> 3841 3842 Product recommendations in eCommerce serve a similar purpose as when a salesperson in-store suggests products based on a s... 3843 3844 </p> 3845 3846 <div class="tg-blog-index-card__date"> 3847 May 11, 2023 3848 </div> 3849 </div> 3850 </a> 3851 3852 3853 3854 3855 3856 3857 3858 3859 3860 3861 3862 3863 3864 3865 3866 3867 3868 <a href="/blogs/resources/articles-what-is-a-faceted-search-in-ecommerce" class="tg-blog-index-card"> 3869 <div class="tg-blog-index-card__media"> 3870 3871 <img 3872 src="//www.tagalys.com/cdn/shop/articles/6437dd20a0a3c316a9974206_What-is-faceted-search-ecommerce-Tagalys-1536x864.jpg?v=1787060260&width=760" 3873 alt="What is a faceted search in eCommerce?" 3874 loading="lazy" 3875 > 3876 3877</div> 3878 3879 <div class="tg-blog-index-card__body"> 3880 3881 <span class="tg-label">Search</span> 3882 3883 3884 <h2 class="tg-blog-index-card__title tg-h4">What is a faceted search in eCommerce?</h2> 3885 3886 <p class="tg-blog-index-card__excerpt tg-small"> 3887 3888 Imagine if a shopper is looking for a pair of running shoes in an online store and finds more than 4000 pairs of shoes to ... 3889 3890 </p> 3891 3892 <div class="tg-blog-index-card__date"> 3893 Apr 12, 2023 3894 </div> 3895 </div> 3896 </a> 3897 3898 3899 3900 3901 3902 3903 3904 3905 3906 3907 3908 3909 3910 3911 3912 3913 3914 3915 3916 3917 3918 3919 3920 3921 3922 <a href="/blogs/resources/articles-how-to-win-over-shoppers-this-easter-2023" class="tg-blog-index-card"> 3923 <div class="tg-blog-index-card__media"> 3924 3925 <img 3926 src="//www.tagalys.com/cdn/shop/articles/642753b36a10ec6b2d4aa941_Easter-Tagalys.jpg?v=1782452850&width=760" 3927 alt="How to win over shoppers this Easter 2023?" 3928 loading="lazy" 3929 > 3930 3931</div> 3932 3933 <div class="tg-blog-index-card__body"> 3934 3935 <span class="tg-label">Recommendations</span> 3936 3937 3938 <h2 class="tg-blog-index-card__title tg-h4">How to win over shoppers this Easter 2023?</h2> 3939 3940 <p class="tg-blog-index-card__excerpt tg-small"> 3941 3942 Easter weekend is the first significant holiday after Christmas when retailers get the golden window of opportunity to boo... 3943 3944 </p> 3945 3946 <div class="tg-blog-index-card__date"> 3947 Mar 14, 2023 3948 </div> 3949 </div> 3950 </a> 3951 3952 3953 3954 3955 3956 3957 3958 3959 3960 3961 3962 3963 3964 3965 3966 3967 3968 3969 3970 3971 3972 3973 3974 3975 3976 <a href="/blogs/resources/articles-7-ways-to-improve-product-discovery-in-ecommerce" class="tg-blog-index-card"> 3977 <div class="tg-blog-index-card__media"> 3978 3979 <img 3980 src="//www.tagalys.com/cdn/shop/articles/6436b8118b7e2495844fb71e_Artboard-17-copy-4_V2-1536x864_2c62ccdb-90df-4ed4-be8a-7d2a2d2b6fca.jpg?v=1787060164&width=760" 3981 alt="7 Ways to improve product discovery in eCommerce" 3982 loading="lazy" 3983 > 3984 3985</div> 3986 3987 <div class="tg-blog-index-card__body"> 3988
3989 <span class="tg-label">Recommendations</span> 3990 3991 3992 <h2 class="tg-blog-index-card__title tg-h4">7 Ways to improve product discovery in eCommerce</h2> 3993 3994 <p class="tg-blog-index-card__excerpt tg-small"> 3995 3996 What is Product Discovery in eCommerce? 3997Consumers have varied buying behaviors as some consumers are certain of what exact... 3998 3999 </p> 4000 4001 <div class="tg-blog-index-card__date"> 4002 Mar 6, 2023 4003 </div> 4004 </div> 4005 </a> 4006 4007 4008 4009 4010 4011 4012 4013 4014 4015 <a href="/blogs/resources/articles-10-simple-ways-to-understand-online-visual-merchandising" class="tg-blog-index-card"> 4016 <div class="tg-blog-index-card__media"> 4017 4018 <img 4019 src="//www.tagalys.com/cdn/shop/articles/642753b3d9e8b2dcb861b811_10simple-ways-to-understand-Visual-merchandising-Tagalys_bf1cce08-1456-4246-9f6a-a432a556a213.jpg?v=1787060328&width=760" 4020 alt="10 Simple ways to understand Online Visual Merchandising" 4021 loading="lazy" 4022 > 4023 4024</div> 4025 4026 <div class="tg-blog-index-card__body"> 4027 4028 <span class="tg-label">Merchandising</span> 4029 4030 4031 <h2 class="tg-blog-index-card__title tg-h4">10 Simple ways to understand Online Visual Merchandising</h2> 4032 4033 <p class="tg-blog-index-card__excerpt tg-small"> 4034 4035 Shopping has always been a visual experience, whether mannequins sporting perfectly chosen outfits or new products exhibit... 4036 4037 </p> 4038 4039 <div class="tg-blog-index-card__date"> 4040 Feb 21, 2023 4041 </div> 4042 </div> 4043 </a> 4044 4045 </div> 4046 4047 4048 <div class="tg-blog-pagination"> 4049 4050 4051 4052 4053 <span class="is-current">1</span> 4054 4055 4056 4057 <a href="/blogs/resources?page=2">2</a> 4058 4059 4060 4061 <a href="/blogs/resources?page=3">3</a> 4062 4063 4064 4065 <span>…</span> 4066 4067 4068 4069 <a href="/blogs/resources?page=6">6</a> 4070 4071 4072 4073 4074 <a href="/blogs/resources?page=2">Next</a> 4075 4076 </div> 4077 4078 4079 </div> 4080 </div> 4081 4082</section> 4083 4084 4085
4086<script> 4087(function () { 4088 var wrap = null; 4089 var pills = null; 4090 var updating = false; 4091 4092 function init() { 4093 wrap = document.querySelector('.tg-blog-index__grid-wrap'); 4094 pills = document.querySelectorAll('.tg-blog-filter'); 4095 4096 if (!wrap || !pills.length) return; 4097 4098 pills.forEach(function (pill) { 4099 pill.addEventListener('click', function (event) { 4100 event.preventDefault(); 4101 if (updating) return; 4102 fetchFilter(pill.getAttribute('href'), pill); 4103 }); 4104 }); 4105 4106 document.addEventListener('click', function (event) { 4107 var pag = event.target.closest('.tg-blog-pagination a'); 4108 if (!pag) return; 4109 4110 event.preventDefault(); 4111 if (updating) return; 4112 fetchFilter(pag.getAttribute('href'), null); 4113 }); 4114 } 4115 4116 function fetchFilter(url, activePill) { 4117 updating = true; 4118 wrap.classList.add('is-loading'); 4119 4120 if (activePill) { 4121 pills.forEach(function (pill) { pill.classList.remove('is-active'); }); 4122 activePill.classList.add('is-active'); 4123 } 4124 4125 history.pushState({ tgBlogUrl: url }, '', url); 4126 4127 fetch(url, { headers: { 'X-Requested-With': 'XMLHttpRequest' } }) 4128 .then(function (response) { return response.text(); }) 4129 .then(function (html) { 4130 var doc = new DOMParser().parseFromString(html, 'text/html'); 4131 var newWrap = doc.querySelector('.tg-blog-index__grid-wrap'); 4132 var newPills = doc.querySelectorAll('.tg-blog-filter'); 4133 4134 if (newWrap) wrap.innerHTML = newWrap.innerHTML; 4135 4136 if (newPills.length && pills.length) { 4137 newPills.forEach(function (newPill, index) { 4138 if (pills[index]) { 4139 pills[index].classList.toggle('is-active', newPill.classList.contains('is-active')); 4140 } 4141 }); 4142 } 4143 4144 wrap.classList.remove('is-loading'); 4145 updating = false; 4146 }) 4147 .catch(function () { 4148 window.location.href = url; 4149 }); 4150 } 4151 4152 window.addEventListener('popstate', function () { 4153 window.location.reload(); 4154 }); 4155 4156 if (document.readyState === 'loading') { 4157 document.addEventListener('DOMContentLoaded', init); 4158 } else { 4159 init(); 4160 } 4161})(); 4162</script>
4162 4163 4164<style> 4165.tg-blog-index, 4166.tg-blog-index * { 4167 box-sizing: border-box; 4168} 4169 4170.tg-blog-index-hero { 4171 position: relative; 4172 overflow: hidden; 4173 padding-top: var(--tg-section-large); 4174 padding-bottom: var(--tg-section-large); 4175 text-align: center; 4176 background: var(--tg-black); 4177 color: var(--tg-white); 4178 border-bottom: 1px solid rgba(255,255,255,.08); 4179} 4180 4181.tg-blog-index-hero:before { 4182 content: ""; 4183 position: absolute; 4184 inset: 0; 4185 background: 4186 linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px), 4187 linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px); 4188 background-size: 42px 42px; 4189 -webkit-mask: linear-gradient(90deg,#000 0%,#000 11%,rgba(0,0,0,.45) 18%,rgba(0,0,0,.12) 25%,transparent 34%,transparent 66%,rgba(0,0,0,.12) 75%,rgba(0,0,0,.45) 82%,#000 89%,#000 100%); 4190 mask: linear-gradient(90deg,#000 0%,#000 11%,rgba(0,0,0,.45) 18%,rgba(0,0,0,.12) 25%,transparent 34%,transparent 66%,rgba(0,0,0,.12) 75%,rgba(0,0,0,.45) 82%,#000 89%,#000 100%); 4191 pointer-events: none; 4192} 4193 4194.tg-blog-index-hero:after { 4195 content: ""; 4196 position: absolute; 4197 left: 50%; 4198 top: 50%; 4199 width: 780px; 4200 height: 380px; 4201 transform: translate(-50%, -50%); 4202 background: radial-gradient(ellipse, rgba(159,115,255,.08), rgba(231,111,196,.045) 42%, transparent 72%); 4203 pointer-events: none; 4204} 4205 4206.tg-blog-index-hero__inner { 4207 position: relative; 4208 z-index: 2; 4209} 4210 4211.tg-blog-index-hero .tg-label { 4212 margin-bottom: var(--tg-label-heading-gap); 4213} 4214 4215.tg-blog-index-hero__title { 4216 margin: 0 auto; 4217 color: var(--tg-white); 4218} 4219 4220.tg-blog-index-hero__copy { 4221 max-width: 520px; 4222 margin: var(--tg-heading-copy-gap) auto 0; 4223 color: rgba(255,255,255,.68); 4224} 4225 4226.tg-blog-filters { 4227 position: sticky; 4228 top: 0; 4229 z-index: 20; 4230 padding-left: var(--tg-page-pad); 4231 padding-right: var(--tg-page-pad); 4232 background: rgba(255,255,255,.95); 4233 border-bottom: 1px solid var(--tg-border); 4234 backdrop-filter: blur(8px); 4235 -webkit-backdrop-filter: blur(8px); 4236} 4237 4238.tg-blog-filters__inner { 4239 display: flex; 4240 align-items: center; 4241 justify-content: center; 4242 gap: 8px; 4243 overflow-x: auto; 4244 padding-top: 16px; 4245 padding-bottom: 16px; 4246 scrollbar-width: none; 4247 -webkit-overflow-scrolling: touch; 4248} 4249 4250.tg-blog-filters__inner::-webkit-scrollbar {
4251 display: none; 4252} 4253 4254.tg-blog-filter { 4255 display: inline-flex; 4256 align-items: center; 4257 flex-shrink: 0; 4258 padding: 7px 14px; 4259 border: 1px solid var(--tg-border); 4260 border-radius: 6px; 4261 background: var(--tg-white); 4262 font-family: var(--tg-font-body); 4263 font-size: .75rem; 4264 font-weight: 600; 4265 line-height: 1; 4266 color: var(--tg-disabled); 4267 text-decoration: none; 4268 white-space: nowrap; 4269 transition: border-color .16s ease, color .16s ease; 4270} 4271 4272.tg-blog-filter:hover { 4273 border-color: var(--tg-black); 4274 color: var(--tg-black); 4275} 4276 4277.tg-blog-filter.is-active { 4278 border-color: transparent; 4279 background: 4280 linear-gradient(var(--tg-white), var(--tg-white)) padding-box, 4281 var(--tg-grad-ui) border-box; 4282 color: var(--tg-ink); 4283 font-weight: 700; 4284} 4285 4286.tg-blog-filter-note { 4287 flex-shrink: 0; 4288 padding-left: 8px; 4289 font-family: var(--tg-font-body); 4290 font-size: .75rem; 4291 color: var(--tg-disabled); 4292 white-space: nowrap; 4293} 4294 4295.tg-blog-filter-note a { 4296 color: var(--tg-ink); 4297 text-decoration: underline; 4298 text-underline-offset: 3px; 4299} 4300 4301.tg-blog-index__grid-wrap { 4302 padding-top: var(--tg-section-standard); 4303 padding-bottom: var(--tg-section-large); 4304 transition: opacity .2s ease; 4305} 4306 4307.tg-blog-index__grid-wrap.is-loading { 4308 opacity: .45; 4309 pointer-events: none; 4310} 4311 4312.tg-blog-index-grid { 4313 display: grid; 4314 grid-template-columns: repeat(3, minmax(0, 1fr)); 4315 column-gap: 28px; 4316 row-gap: 44px; 4317} 4318 4319.tg-blog-index-card { 4320 display: block; 4321 min-width: 0; 4322 color: inherit; 4323 text-decoration: none; 4324} 4325 4326.tg-blog-index-card__media { 4327 width: 100%; 4328 aspect-ratio: 16 / 9; 4329 overflow: hidden; 4330 border: 1px solid var(--tg-border); 4331 border-radius: 12px; 4332 background: var(--tg-surface); 4333} 4334 4335.tg-blog-index-card__media img { 4336 width: 100%; 4337 height: 100%; 4338 display: block; 4339 object-fit: cover; 4340 object-position: center center; 4341 transition: transform .5s ease; 4342} 4343 4344.tg-blog-index-card:hover .tg-blog-index-card__media img { 4345 transform: scale(1.04); 4346} 4347 4348.tg-blog-index-card__placeholder { 4349 width: 100%; 4350 height: 100%; 4351 background: var(--tg-grad-surface); 4352} 4353 4354.tg-blog-index-card__body { 4355 padding-top: 16px; 4356} 4357 4358.tg-blog-index-card__body .tg-label { 4359 margin-bottom: 12px; 4360} 4361 4362.tg-blog-index-card__title { 4363 margin: 0; 4364 color: var(--tg-black); 4365 display: -webkit-box; 4366 -webkit-line-clamp: 2; 4367 -webkit-box-orient: vertical; 4368 overflow: hidden; 4369} 4370 4371.tg-blog-index-card__excerpt { 4372 margin: 9px 0 0; 4373 color: var(--tg-charcoal); 4374 display: -webkit-box; 4375 -webkit-line-clamp: 2; 4376 -webkit-box-orient: vertical; 4377 overflow: hidden; 4378} 4379 4380.tg-blog-index-card__date { 4381 margin-top: 10px; 4382 font-family: var(--tg-font-body); 4383 font-size: .75rem; 4384 line-height: 1.4; 4385 color: var(--tg-disabled); 4386} 4387 4388.tg-blog-pagination { 4389 display: flex; 4390 align-items: center; 4391 justify-content: center; 4392 gap: 8px; 4393 margin-top: 56px; 4394} 4395 4396.tg-blog-pagination a, 4397.tg-blog-pagination span { 4398 display: inline-flex; 4399 align-items: center; 4400 justify-content: center; 4401 min-width: 36px; 4402 height: 36px; 4403 padding: 0 10px; 4404 border: 1px solid var(--tg-border); 4405 border-radius: 8px; 4406 background: var(--tg-white); 4407 font-family: var(--tg-font-body); 4408 font-size: .8125rem; 4409 font-weight: 500; 4410 color: var(--tg-disabled); 4411 text-decoration: none; 4412} 4413 4414.tg-blog-pagination a:hover { 4415 border-color: var(--tg-black); 4416 color: var(--tg-black); 4417} 4418 4419.tg-blog-pagination .is-current { 4420 border-color: transparent; 4421 background: 4422 linear-gradient(var(--tg-white), var(--tg-white)) padding-box, 4423 var(--tg-grad-ui) border-box; 4424 color: var(--tg-ink); 4425 font-weight: 700; 4426} 4427 4428.tg-blog-empty { 4429 max-width: 520px; 4430 margin: 0 auto; 4431 padding: 72px 0; 4432 text-align: center; 4433} 4434 4435.tg-blog-empty .tg-copy { 4436 margin: var(--tg-heading-copy-gap) auto 24px; 4437} 4438 4439@media (max-width: 1024px) { 4440 .tg-blog-index-grid { 4441 grid-template-columns: repeat(2, minmax(0, 1fr)); 4442 column-gap: 20px; 4443 row-gap: 36px; 4444 } 4445} 4446 4447@media (max-width: 680px) { 4448 .tg-blog-index-hero { 4449 padding-top: 52px; 4450 padding-bottom: 52px; 4451 } 4452 4453 .tg-blog-filters { 4454 padding-left: 0; 4455 padding-right: 0; 4456 } 4457 4458 .tg-blog-filters__inner { 4459 justify-content: flex-start; 4460 padding-left: var(--tg-page-pad); 4461 padding-right: var(--tg-page-pad); 4462 } 4463 4464 .tg-blog-index-grid { 4465 grid-template-columns: 1fr; 4466 row-gap: 36px; 4467 } 4468 4469 .tg-blog-index-card__body { 4470 padding-top: 14px; 4471 } 4472 4473 .tg-blog-index-card__excerpt { 4474 -webkit-line-clamp: 3; 4475 } 4476 4477 .tg-blog-pagination { 4478 margin-top: 44px; 4479 flex-wrap: wrap; 4480 } 4481} 4482 4483@media (prefers-reduced-motion: reduce) { 4484 .tg-blog-index-card__media img { 4485 transition: none; 4486 } 4487 4488 .tg-blog-index-card:hover .tg-blog-index-card__media img { 4489 transform: none; 4490 } 4491} 4492</style> 4493 4494</section> 4495 </main> 4496 4497 <footer> 4498 <!-- BEGIN sections: footer-group --> 4499<section id="shopify-section-sections--19314630197346__tagalys_footer_zh97xk" class="shopify-section shopify-section-group-footer-group tagalys-footer"> 4500 4501<style> 4502@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap'); 4503.tgf *{box-sizing:border-box;margin:0;padding:0;} 4504.tgf{font-family:'Inter',-apple-system,sans-serif;background:#0d0d0d;color:#fff;border-top:1px solid #333;} 4505.tgf-outer{padding-inline:var(--tg-page-pad);} 4506.tgf-band-top{height:2rem;border-left:1px solid #333;border-right:1px solid #333;} 4507.tgf-band-bottom{height:2rem;border-left:1px solid #333;border-right:1px solid #333;border-bottom:1px solid #333;} 4508.tgf-top{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;border:1px solid #333;} 4509.tgf-logo{display:inline-flex;align-items:center;text-decoration:none;flex-shrink:0;} 4510.tgf-logo img{height:40px;width:auto;display:block;} 4511.tgf-logo-text{font-family:'Saans','DM Sans',sans-serif;font-size:22px;font-weight:700;color:#fff;letter-spacing:-.03em;}
4512.tgf-body{display:flex;align-items:stretch;} 4513.tgf-socials{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:1.25rem;padding:0 2rem 2rem;border-right:1px solid #333;border-bottom:1px solid #333;border-left:1px solid #333;min-width:100px;} 4514.tgf-social-link{width:36px;height:36px;border-radius:8px;border:1px solid #333;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.45);text-decoration:none;transition:border-color .15s,color .15s;overflow:hidden;} 4515.tgf-social-link:hover{border-color:#555;color:#fff;} 4516.tgf-social-link svg{width:16px;height:16px;display:block;} 4517.tgf-social-link img{width:18px;height:18px;object-fit:contain;filter:brightness(0) invert(1);opacity:.55;transition:opacity .15s;} 4518.tgf-social-link:hover img{opacity:1;} 4519.tgf-right{flex:1;display:flex;flex-direction:column;border-right:1px solid #333;border-bottom:1px solid #333;} 4520.tgf-links-wrap{display:flex;width:100%;padding:2.5rem 4rem 2.5rem 2.5rem;justify-content:space-between;gap:2rem;flex:1;} 4521.tgf-col{flex:1;min-width:0;} 4522.tgf-col-label{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:1.5rem;display:block;} 4523.tgf-col-links{display:flex;flex-direction:column;gap:14px;} 4524.tgf-link{font-size:15px;font-weight:400;color:rgba(255,255,255,.45);text-decoration:none;transition:color .15s;line-height:1.4;} 4525.tgf-link:hover{color:#fff;} 4526.tgf-trusted-label{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:1.5rem;display:block;} 4527.tgf-badges{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start;margin-bottom:16px;} 4528.tgf-badge img{height:68px;width:auto;display:block;} 4529.tgf-g2-pill{display:inline-flex;align-items:center;gap:8px;background:#e8472a;border-radius:8px;padding:10px 16px;text-decoration:none;transition:opacity .15s;} 4530.tgf-g2-pill:hover{opacity:.85;} 4531.tgf-g2-icon-img{height:18px;width:auto;display:block;filter:brightness(0) invert(1);} 4532.tgf-g2-icon-fallback{font-size:14px;font-weight:800;color:#fff;font-style:italic;} 4533.tgf-g2-text{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;} 4534.tgf-legal-wrap{display:flex;padding:2rem 2.5rem;justify-content:space-between;align-items:center;border-top:1px solid #333;flex-wrap:wrap;gap:1rem;} 4535.tgf-copy{font-size:13px;color:rgba(255,255,255,.3);} 4536.tgf-legal{display:flex;gap:1.5rem;flex-wrap:wrap;} 4537.tgf-legal-link{font-size:13px;color:rgba(255,255,255,.3);text-decoration:none;transition:color .15s;} 4538.tgf-legal-link:hover{color:rgba(255,255,255,.65);} 4539 4540.tgf-top .tg-btn{ 4541 padding:4px 4px 4px 16px; 4542 gap:10px; 4543 border-radius:10px; 4544 font-size:14px; 4545} 4546 4547.tgf-top .tg-btn__arrow{ 4548 width:30px; 4549 height:30px; 4550 border-radius:6px; 4551} 4552 4553@media(max-width:991px){ 4554 .tgf-links-wrap{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:auto auto;gap:2rem;padding-right:0;} 4555} 4556 4557@media(max-width:767px){ 4558 .tgf-outer{padding-left:0;padding-right:0;} 4559 .tgf-band-top{height:1.5rem;} 4560 .tgf-band-bottom{height:1.5rem;} 4561 .tgf-top{padding:1.25rem 1.5rem;} 4562 .tgf-body{flex-direction:column;} 4563 .tgf-right{order:-1;border-left:1px solid #333;} 4564 .tgf-socials{flex-direction:row;justify-content:center;align-items:center;padding:1rem 1.5rem;border-right:1px solid #333;border-left:1px solid #333;min-width:0;} 4565 .tgf-links-wrap{grid-template-columns:1fr 1fr;padding:2rem 1.5rem;gap:2rem;} 4566 .tgf-legal-wrap{flex-direction:column;text-align:center;padding:1.5rem 1rem;gap:1rem;} 4567 .tgf-legal{justify-content:center;} 4568 .tgf-g2-pill{padding:8px 12px;} 4569 .tgf-g2-text{font-size:12px;} 4570 .tgf-badge img{height:56px;} 4571} 4572 4573@media(max-width:479px){ 4574 .tgf-links-wrap{grid-template-columns:1fr 1fr;} 4575 .tgf-col-label,.tgf-trusted-label{font-size:12px;} 4576 .tgf-link{font-size:14px;} 4577} 4578</style> 4579 4580<footer class="tgf" role="contentinfo"> 4581 <div class="tgf-outer"> 4582 <div class="tgf-band-top"></div> 4583 4584 <div class="tgf-top"> 4585 <a href="/" class="tgf-logo" aria-label="Tagalys Website"> 4586 4587 <img src="//www.tagalys.com/cdn/shop/files/New-Tagalys-White-Logo-Large_upscaled_illustration_x4_16b61a04-36db-4ce2-a503-32d1c9b787ac.png?v=1782142541&width=300" alt="Tagalys Website"> 4588 4589 </a> 4590 4591 <a href="/pages/schedule-demo" class="tg-btn tg-btn--white">
4592 <span>Book a Demo</span> 4593 <span class="tg-btn__arrow" aria-hidden="true"> 4594 <svg viewBox="0 0 24 24" fill="none"> 4595 <path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> 4596 <path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> 4597 </svg> 4598 </span> 4599 </a> 4600 </div> 4601 4602 <div class="tgf-body"> 4603 <div class="tgf-socials"> 4604 4605 <a href="https://www.linkedin.com/company/tagalys" target="_blank" rel="noopener" class="tgf-social-link" aria-label="LinkedIn"> 4606 4607 <img src="//www.tagalys.com/cdn/shop/files/LinkedIn_logo.png?v=1782142072&width=60" alt="LinkedIn"> 4608 4609 </a> 4610 4611 4612 4613 <a href="https://www.instagram.com/tagalys" target="_blank" rel="noopener" class="tgf-social-link" aria-label="Instagram"> 4614 4615 <img src="//www.tagalys.com/cdn/shop/files/Instagram-Icon.png?v=1782142238&width=60" alt="Instagram"> 4616 4617 </a> 4618 4619 4620 4621 <a href="mailto:[email protected]" class="tgf-social-link" aria-label="Email"> 4622 4623 <img src="//www.tagalys.com/cdn/shop/files/Email_Icon_New.png?v=1782142193&width=60" alt="Email"> 4624 4625 </a> 4626 4627 </div> 4628 4629 <div class="tgf-right"> 4630 <div class="tgf-links-wrap"> 4631 4632 4633 <div class="tgf-col" > 4634 4635 <span class="tgf-col-label">SOLUTION</span> 4636 4637 4638 4639 <div class="tgf-col-links"> 4640 4641 4642 4643 4644 4645 4646 4647 4648 4649 4650 <a href="/collections/collection-merchandising" class="tgf-link">Collection Merchandising</a> 4651 4652 4653 4654 4655 4656 4657 4658 4659 4660 4661 <a href="/collections/site-search" class="tgf-link">Site Search</a> 4662 4663 4664 4665 4666 4667 4668 4669 4670 4671 4672 <a href="/collections/product-recommendations" class="tgf-link">Recommendations</a> 4673 4674 4675 4676 4677 4678 4679 4680 4681 4682 4683 <a href="/pages/pricing" class="tgf-link">Pricing</a> 4684 4685 4686 </div> 4687 4688 </div> 4689 4690 4691 4692 <div class="tgf-col" > 4693 4694 <span class="tgf-col-label">FEATURES</span> 4695 4696 4697 4698 <div class="tgf-col-links"> 4699 4700 4701 4702 4703 4704 4705 4706 4707 4708 4709 <a href="/products/markets" class="tgf-link">Merchandise by Markets</a> 4710 4711 4712 4713 4714 4715 4716 4717 4718 4719 4720 <a href="/products/looks" class="tgf-link">Looks</a> 4721 4722 4723 4724 4725 4726 4727 4728 4729 4730 4731 <a href="/products/server-side" class="tgf-link">Server-side Collections</a> 4732 4733 4734 </div> 4735 4736 </div> 4737 4738 4739 4740 <div class="tgf-col" > 4741 4742 <span class="tgf-col-label">RESOURCES</span> 4743 4744 4745 4746 <div class="tgf-col-links"> 4747 4748 4749 4750 4751 4752 4753 4754 4755 4756 4757 <a href="/blogs/resources/" class="tgf-link">Blogs</a> 4758 4759 4760 4761 4762 4763 4764 4765 4766 4767 4768 <a href="https://support.tagalys.com/" class="tgf-link" target="_blank" rel="noopener">Help Docs</a> 4769 4770 4771 4772 4773 4774 4775 4776 4777 4778 4779 <a href="/pages/contact" class="tgf-link">Contact Us</a> 4780 4781 4782 </div> 4783 4784 </div> 4785 4786 4787 4788 4789 4790 4791 4792 <div class="tgf-col"> 4793 <span class="tgf-trusted-label">Loved & Trusted</span> 4794 4795 4796 <div class="tgf-badges"> 4797 <div class="tgf-badge"><img src="//www.tagalys.com/cdn/shop/files/G2_Badge_1.png?v=1782142084&width=160" alt="G2 badge" loading="lazy"></div> 4798 <div class="tgf-badge"><img src="//www.tagalys.com/cdn/shop/files/G2_Badge_2.png?v=1782142154&width=160" alt="G2 badge" loading="lazy"></div> 4799 <div class="tgf-badge"><img src="//www.tagalys.com/cdn/shop/files/G2_Badge_3.png?v=1782142116&width=160" alt="G2 badge" loading="lazy"></div> 4800 </div> 4801 4802 4803 4804 <a href="https://www.g2.com/products/tagalys/reviews" target="_blank" rel="noopener" class="tgf-g2-pill"> 4805 4806 <img class="tgf-g2-icon-img" src="//www.tagalys.com/cdn/shop/files/G2_Logo.png?v=1782142173&width=60" alt="G2"> 4807
4808 <span class="tgf-g2-text">4.8/5 | 128 reviews</span> 4809 </a> 4810 4811 </div> 4812 4813 </div> 4814 4815 <div class="tgf-legal-wrap"> 4816 <span class="tgf-copy">©2026 Tagalys Inc. All rights reserved.</span> 4817 <div class="tgf-legal"> 4818 <a href="/pages/terms-of-service" class="tgf-legal-link">Terms of Service</a> 4819 <a href="/pages/privacy-policy" class="tgf-legal-link">Privacy Policy</a> 4820 <a href="/pages/refund-policy" class="tgf-legal-link">Refund Policy</a> 4821 <a href="/pages/gdpr" class="tgf-legal-link">GDPR</a> 4822 </div> 4823 </div> 4824 </div> 4825 </div> 4826 4827 <div class="tgf-band-bottom"></div> 4828 </div> 4829</footer> 4830 4831</section> 4832<!-- END sections: footer-group --> 4833 </footer> 4834 </div> 4835 4836 4837 4838 <div 4839 id="shopify-section-cart-drawer-section" 4840 class="shopify-section" 4841 > 4842 4843 4844
4844<script 4845 type="module" 4846 src="//www.tagalys.com/cdn/shop/t/7/assets/cart-drawer.js?v=101430053943909765251786539027" 4847 fetchpriority="low" 4848 ></script>
4848 4849 4850 4851 4852 <theme-drawer 4853 id="cart-drawer" 4854 data-skip-node-update 4855 > 4856 <dialog 4857 ref="panel" 4858 class="theme-drawer__dialog color-custom-drawer" 4859 aria-labelledby="cart-drawer-heading" 4860 cart-summary-sticky="true" 4861 > 4862 <cart-drawer-component 4863 4864 > 4865 <template id="empty-cart-template"> 4866 4867 <div 4868 class="cart-drawer__content" 4869 aria-label="Cart" 4870 > 4871 <h2 4872 class="theme-drawer__title h4" 4873 id="cart-drawer-heading" 4874 > 4875 Your cart is empty 4876 </h2> 4877 4878 <div class="cart-drawer__items"> 4879 4880 4881
4882<script 4883 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-items.js?v=14476580701730542761786539027" 4884 type="module" 4885 fetchpriority="low" 4886></script>
vendor: 1 bytes, line 4886
4886
4887<script 4888 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-quantity-selector.js?v=168493463479860323171786539027" 4889 type="module" 4890 fetchpriority="low" 4891></script>
vendor: 1 bytes, line 4891
4891
4892<script 4893 src="//www.tagalys.com/cdn/shop/t/7/assets/volume-pricing-info.js?v=94479640769665442661786539027" 4894 type="module" 4895 fetchpriority="low" 4896></script>
4896 4897 4898<div 4899 4900 class="cart-items__wrapper cart-items__wrapper--drawer-empty" 4901 4902 data-cart-drawer-empty 4903 4904 style="" 4905> 4906 4907<p> 4908 Have an account? <a href="https://www.tagalys.com/customer_authentication/redirect?locale=en®ion_country=IN">Log in</a> to check out faster. 4909 </p><a 4910 class="button cart-items__empty-button" 4911 href="/collections/all" 4912 > 4913 <span class="button-text"> 4914 Continue shopping 4915 </span> 4916 </a></div> 4917 4918 4919 4920 </div> 4921 </div> 4922 4923 </template> 4924 4925 <div 4926 class="cart-drawer__inner cart-drawer--empty" 4927 data-hydration-key="cart-drawer-inner" 4928 ><div class="theme-drawer__header"> 4929 <button 4930 on:click="#cart-drawer/close" 4931 class="theme-drawer__close-button cart-drawer__close-button--empty" 4932 type="button" 4933 aria-label="Close" 4934 > 4935 <span class="svg-wrapper"><svg aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 4936<path d="M11.1765 12.025C11.4108 12.2594 11.7907 12.2594 12.025 12.025C12.2594 11.7907 12.2594 11.4108 12.025 11.1765L8.84931 8.00078L12.025 4.82505C12.2594 4.59073 12.2594 4.21083 12.025 3.97652C11.7907 3.7422 11.4108 3.7422 11.1765 3.97652L8.00078 7.15225L4.82505 3.97652C4.59073 3.7422 4.21083 3.7422 3.97652 3.97652C3.7422 4.21083 3.7422 4.59073 3.97652 4.82505L7.15225 8.00078L3.97652 11.1765C3.7422 11.4108 3.7422 11.7907 3.97652 12.025C4.21083 12.2594 4.59073 12.2594 4.82505 12.025L8.00078 8.84931L11.1765 12.025Z" fill="currentColor"/> 4937</svg> 4938</span> 4939 </button> 4940 </div> 4941 4942 4943<cart-items-component 4944 class="cart-items-component" 4945 4946 data-drawer 4947 view-event-trigger="dialog" 4948 4949 data-section-id="cart-drawer-section" 4950 4951 view-event-payload="{"context":null,"cart":null}" 4952 4953> 4954 4955 4956 <div 4957 class="cart-drawer__content" 4958 aria-label="Cart" 4959 > 4960 <h2 4961 class="theme-drawer__title h4" 4962 id="cart-drawer-heading" 4963 > 4964 Your cart is empty 4965 </h2> 4966 4967 <div class="cart-drawer__items"> 4968 4969 4970
4971<script 4972 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-items.js?v=14476580701730542761786539027" 4973 type="module" 4974 fetchpriority="low" 4975></script>
vendor: 1 bytes, line 4975
4975
4976<script 4977 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-quantity-selector.js?v=168493463479860323171786539027" 4978 type="module" 4979 fetchpriority="low" 4980></script>
vendor: 1 bytes, line 4980
4980
4981<script 4982 src="//www.tagalys.com/cdn/shop/t/7/assets/volume-pricing-info.js?v=94479640769665442661786539027" 4983 type="module" 4984 fetchpriority="low" 4985></script>
4985 4986 4987<div 4988 4989 class="cart-items__wrapper cart-items__wrapper--drawer-empty" 4990 4991 data-cart-drawer-empty 4992 4993 style="" 4994> 4995 4996<p> 4997 Have an account? <a href="https://www.tagalys.com/customer_authentication/redirect?locale=en®ion_country=IN">Log in</a> to check out faster. 4998 </p><a 4999 class="button cart-items__empty-button" 5000 href="/collections/all" 5001 > 5002 <span class="button-text"> 5003 Continue shopping 5004 </span> 5005 </a></div> 5006 5007 5008 5009 </div> 5010 </div> 5011 5012 5013</cart-items-component> 5014 5015 5016 5017 </div> 5018 </cart-drawer-component> 5019 </dialog> 5020 </theme-drawer> 5021 5022 5023 </div> 5024 5025 5026 5027 5028 5029 5030 5031 5032 5033
5034<script 5035 type="module" 5036 src="//www.tagalys.com/cdn/shop/t/7/assets/theme-drawer.js?v=19271060799489679091786539027" 5037 fetchpriority="low" 5038></script>
5038 5039
5040<script> 5041 /* Runs synchronously during HTML parsing — opens the correct drawer on first 5042 paint if navigation state was saved, so it renders with the rest of the page. */ 5043 (function () { 5044 var drawerIds = (sessionStorage.getItem('theme-drawer-open') || '').split(',').filter(Boolean); 5045 if (!drawerIds.length) return; 5046 5047 // Only restore on wide viewports (squeeze mode). On narrow viewports the 5048 // drawer is a modal overlay — let it start closed after navigation rather 5049 // than re-opening a fullscreen dialog the user may have left behind. 5050 if (!window.matchMedia('(min-width: 990px)').matches) return; 5051 5052 var dialogs = []; 5053 for (var i = 0; i < drawerIds.length; i++) { 5054 var drawer = document.getElementById(drawerIds[i]); 5055 if (!drawer) continue; 5056 5057 drawer.setAttribute('open', ''); 5058 5059 // Set [open] directly so the CSS slide-in applies without triggering 5060 // the browser's dialog focusing steps — on wide viewports the drawer is 5061 // a sidebar, not a modal, so focus should stay where it is. 5062 // The instant class suppresses the slide-in transition for the initial restore. 5063 // Set --drawer-stack-order so z-index layering matches the original order. 5064 drawer.style.setProperty('--drawer-stack-order', String(i + 1)); 5065 5066 var dialog = drawer.querySelector('dialog'); 5067 if (dialog) { 5068 dialog.setAttribute('open', ''); 5069 dialog.classList.add('theme-drawer__dialog-instant'); 5070 dialogs.push(dialog); 5071 } 5072 5073 // Let each drawer type handle its own restore (e.g. shopify-chat mode). 5074 // Synchronous dispatch — listeners attached during earlier parsing run immediately. 5075 drawer.dispatchEvent(new CustomEvent('theme-drawer:restoring')); 5076 } 5077 5078 // Apply squeeze immediately, bypassing the margin transition. 5079 // Only squeeze if at least one drawer was actually restored — saved 5080 // drawer IDs may not exist on every page (e.g. cart-drawer on /cart). 5081 var pageWrapper = document.querySelector('.page-wrapper'); 5082 if (pageWrapper && dialogs.length > 0) { 5083 pageWrapper.style.transition = 'none'; 5084 pageWrapper.classList.add('page-wrapper--drawer-open'); 5085 } 5086 5087 // Re-enable transitions after one paint so the instant state is rendered first. 5088 requestAnimationFrame(function () { 5089 requestAnimationFrame(function () { 5090 if (pageWrapper) pageWrapper.style.transition = ''; 5091 for (var j = 0; j < dialogs.length; j++) { 5092 dialogs[j].classList.remove('theme-drawer__dialog-instant'); 5093 } 5094 }); 5095 }); 5096 })(); 5097</script>
5097 5098
5099<script 5100 type="module" 5101> 5102 const pageWrapper = document.querySelector('.page-wrapper'); 5103 const squeezeQuery = window.matchMedia('(min-width: 990px)'); 5104 5105 // ── Squeeze coordination ── 5106 // Listens to all drawers. Only squeezes on wide viewports. 5107 document.addEventListener('theme-drawer:open', () => { 5108 if (squeezeQuery.matches) { 5109 pageWrapper?.classList.add('page-wrapper--drawer-open'); 5110 } 5111 }); 5112 5113 document.addEventListener('theme-drawer:close', () => { 5114 const openDrawer = document.querySelector('theme-drawer[open]'); 5115 if (!openDrawer) { 5116 pageWrapper?.classList.remove('page-wrapper--drawer-open'); 5117 } 5118 }); 5119 5120 squeezeQuery.addEventListener('change', () => { 5121 const openDrawer = document.querySelector('theme-drawer[open]'); 5122 pageWrapper?.classList.toggle('page-wrapper--drawer-open', Boolean(openDrawer) && squeezeQuery.matches); 5123 }); 5124 5125 // ── State persistence ── 5126 // Store open drawer IDs sorted by their visual stack order so 5127 // the restore script can recreate the same z-index layering. 5128 function persistDrawerState() { 5129 const openDrawers = Array.from(document.querySelectorAll('theme-drawer[open]:not([no-persist])')); 5130 if (!openDrawers.length) { 5131 sessionStorage.removeItem('theme-drawer-open'); 5132 return; 5133 } 5134 5135 openDrawers.sort((a, b) => { 5136 const orderA = Number(a.style.getPropertyValue('--drawer-stack-order') || 0); 5137 const orderB = Number(b.style.getPropertyValue('--drawer-stack-order') || 0); 5138 return orderA - orderB; 5139 }); 5140 5141 sessionStorage.setItem('theme-drawer-open', openDrawers.map((d) => d.id).join(',')); 5142 } 5143 5144 document.addEventListener('theme-drawer:open', persistDrawerState); 5145 document.addEventListener('theme-drawer:close', persistDrawerState); 5146</script>
5146 5147 5148 5149 5150 5151 5152 5153 5154 5155
5156<script 5157 src="//www.tagalys.com/cdn/shop/t/7/assets/dialog.js?v=50435175020407122251786539027" 5158 type="module" 5159></script>
5159 5160
5161<script 5162 src="//www.tagalys.com/cdn/shop/t/7/assets/predictive-search.js?v=162722252387887966571786539027" 5163 type="module" 5164 fetchpriority="low" 5165></script>
5165 5166 5167<dialog-component 5168 id="search-modal" 5169 class="search-modal" 5170 5171> 5172 <dialog 5173 ref="dialog" 5174 on:click="/closeDialogOnClickOutside" 5175 on:keydown="/closeDialogOnEscapePress" 5176 class="search-modal__content dialog-modal" 5177 scroll-lock 5178 aria-labelledby="search-modal-heading" 5179 > 5180 <h2 5181 id="search-modal-heading" 5182 class="visually-hidden" 5183 > 5184 Search 5185 </h2> 5186 <predictive-search-component 5187 class="predictive-search color-custom-popover" 5188 style="--product-corner-radius: 0px; --card-corner-radius: 4px;" 5189 data-section-id="predictive-search" 5190 data-testid="search-component--modal" 5191 role="search" 5192 aria-label="Search" 5193 > 5194 <form 5195 action="/search" 5196 method="get" 5197 role="search" 5198 class="predictive-search-form" 5199 ref="form" 5200 on:keydown="/onSearchKeyDown" 5201 > 5202 <div 5203 class="predictive-search-form__header" 5204 > 5205 <div class="predictive-search-form__header-inner"> 5206 <label 5207 for="cmdk-input" 5208 class="visually-hidden" 5209 >Search</label> 5210 <input 5211 class="search-input" 5212 id="cmdk-input" 5213 type="search" 5214 name="q" 5215 role="combobox" 5216 aria-expanded="false" 5217 aria-owns="predictive-search-results" 5218 aria-controls="predictive-search-results" 5219 aria-haspopup="listbox" 5220 aria-autocomplete="list" 5221 autocomplete="off" 5222 placeholder="Search" 5223 ref="searchInput" 5224 on:input="/search" 5225 on:keydown="/onSearchKeyDown" 5226 > 5227 <input 5228 name="options[prefix]" 5229 type="hidden" 5230 value="last" 5231 > 5232 <span class="svg-wrapper predictive-search__icon"> 5233 <svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none"><circle cx="9" cy="9" r="4.75" stroke="currentColor" stroke-width="var(--icon-stroke-width)"/><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="var(--icon-stroke-width)" d="m12.5 12.5 3.25 3.25"/></svg> 5234 5235 </span> 5236 <button 5237 type="button" 5238 class="button-unstyled predictive-search__reset-button" 5239 ref="resetButton" 5240 hidden 5241 on:click="/resetSearch" 5242 > 5243 Clear 5244 </button> 5245 </div> 5246 <button 5247 type="button" 5248 class="button predictive-search__close-modal-button" 5249 aria-label="Close dialog" 5250 on:click="dialog-component/closeDialog" 5251 ref="closeModalButton" 5252 > 5253 <span class="svg-wrapper"> 5254 <svg aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 5255<path d="M11.1765 12.025C11.4108 12.2594 11.7907 12.2594 12.025 12.025C12.2594 11.7907 12.2594 11.4108 12.025 11.1765L8.84931 8.00078L12.025 4.82505C12.2594 4.59073 12.2594 4.21083 12.025 3.97652C11.7907 3.7422 11.4108 3.7422 11.1765 3.97652L8.00078 7.15225L4.82505 3.97652C4.59073 3.7422 4.21083 3.7422 3.97652 3.97652C3.7422 4.21083 3.7422 4.59073 3.97652 4.82505L7.15225 8.00078L3.97652 11.1765C3.7422 11.4108 3.7422 11.7907 3.97652 12.025C4.21083 12.2594 4.59073 12.2594 4.82505 12.025L8.00078 8.84931L11.1765 12.025Z" fill="currentColor"/> 5256</svg> 5257 5258 </span> 5259 </button> 5260 </div> 5261 5262 <div class="predictive-search-form__content-wrapper"> 5263 <div 5264 class="predictive-search-form__content" 5265 ref="predictiveSearchResults" 5266 on:click="/handleModalClick" 5267 > 5268 5269 5270<div 5271 id="predictive-search-results" 5272 class="predictive-search-dropdown" 5273 role="listbox" 5274 aria-expanded="true" 5275 style="--color-shadow: rgb(var(--color-foreground-rgb) / 0.1);" 5276> 5277 5278 <div class="predictive-search-results__inner"> 5279 5280 5281 5282 5283 5284 <div 5285 id="predictive-search-products" 5286 class="predictive-search-results__products" 5287 5288 data-testid="products-list-default--modal" 5289 5290> 5291 5292 <h4 class="predictive-search-results__title"> 5293 Products 5294 </h4> 5295 <ul 5296 class="predictive-search-results__list predictive-search-results__wrapper-products list-unstyled" 5297 > 5298 5299 5300 <li 5301 class="predictive-search-results__card predictive-search-results__card--product" 5302 ref="resultsItems[]" 5303 > 5304 5305<product-component 5306 class="resource-card__wrapper" 5307 5308 5309 view-event-payload="{"product":{"id":7776085934178,"title":"A\/B Testing","handle":"ab-testing","selectedVariant":null},"context":"search","selectedOptions":[]}" 5310 5311 ><div 5312 class="resource-card" 5313 data-resource-type="product" 5314> 5315 <a 5316 class="resource-card__link" 5317 href="/products/ab-testing" 5318 > 5319 <span class="visually-hidden"> 5320 A/B Testing 5321 </span> 5322 </a> 5323 <div 5324 class="resource-card__media" 5325 style="--resource-card-aspect-ratio: 4 / 5;" 5326 5327 > 5328 5329 5330 5331 <img src="//www.tagalys.com/cdn/shop/files/ABTesting1.png?v=1787288176&width=500" alt="" srcset="//www.tagalys.com/cdn/shop/files/ABTesting1.png?v=1787288176&width=240 240w, //www.tagalys.com/cdn/shop/files/ABTesting1.png?v=1787288176&width=352 352w" width="500" height="281" loading="lazy" class="resource-card__image" sizes="auto" ref="" style="object-position: 50.0% 50.0%;"> 5332</div> 5333 5334 <div class="resource-card__content"> 5335 <p class="resource-card__title paragraph">A/B Testing</p> 5336 5337 5338 <div ref="priceContainer"> 5339 5340 5341 <div 5342 class=" 5343 price__regular 5344 5345 " 5346 >
5347 <span class="price">$0.00</span> 5348 </div> 5349 <div 5350 class=" 5351 price__sale 5352 5353 price__hidden 5354 5355 " 5356 > 5357 5358 <span class="price-item__group"> 5359 <span class="visually-hidden">Regular price </span> 5360 <span class="price-item--regular compare-at-price"></span> 5361 </span> 5362 <span class="price-item__group"> 5363 <span class="visually-hidden">Sale price </span> 5364 <span class="price-item--sale price">$0.00</span> 5365 </span> 5366 5367 </div> 5368 5369</div> 5370 5371 </div> 5372</div></product-component> 5373 5374 </li> 5375 5376 <li 5377 class="predictive-search-results__card predictive-search-results__card--product" 5378 ref="resultsItems[]" 5379 > 5380 5381<product-component 5382 class="resource-card__wrapper" 5383 5384 5385 view-event-payload="{"product":{"id":7776086851682,"title":"Auto Replication","handle":"auto-replication","selectedVariant":null},"context":"search","selectedOptions":[]}" 5386 5387 ><div 5388 class="resource-card" 5389 data-resource-type="product" 5390> 5391 <a 5392 class="resource-card__link" 5393 href="/products/auto-replication" 5394 > 5395 <span class="visually-hidden"> 5396 Auto Replication 5397 </span> 5398 </a> 5399 <div 5400 class="resource-card__media" 5401 style="--resource-card-aspect-ratio: 4 / 5;" 5402 5403 > 5404 5405 5406 5407 <img src="//www.tagalys.com/cdn/shop/files/MerchandisingReplication1.png?v=1787287692&width=500" alt="" srcset="//www.tagalys.com/cdn/shop/files/MerchandisingReplication1.png?v=1787287692&width=240 240w, //www.tagalys.com/cdn/shop/files/MerchandisingReplication1.png?v=1787287692&width=352 352w" width="500" height="281" loading="lazy" class="resource-card__image" sizes="auto" ref="" style="object-position: 50.0% 50.0%;"> 5408</div> 5409 5410 <div class="resource-card__content"> 5411 <p class="resource-card__title paragraph">Auto Replication</p> 5412 5413 5414 <div ref="priceContainer"> 5415 5416 5417 <div 5418 class=" 5419 price__regular 5420 5421 " 5422 > 5423 <span class="price">$0.00</span> 5424 </div> 5425 <div 5426 class=" 5427 price__sale 5428 5429 price__hidden 5430 5431 " 5432 > 5433 5434 <span class="price-item__group"> 5435 <span class="visually-hidden">Regular price </span> 5436 <span class="price-item--regular compare-at-price"></span> 5437 </span> 5438 <span class="price-item__group"> 5439 <span class="visually-hidden">Sale price </span> 5440 <span class="price-item--sale price">$0.00</span> 5441 </span> 5442 5443 </div> 5444 5445</div> 5446 5447 </div> 5448</div></product-component> 5449 5450 </li> 5451 5452 <li 5453 class="predictive-search-results__card predictive-search-results__card--product" 5454 ref="resultsItems[]" 5455 > 5456 5457<product-component 5458 class="resource-card__wrapper" 5459 5460 5461 view-event-payload="{"product":{"id":7773574201442,"title":"Banner Placeholders","handle":"banner-placeholders","selectedVariant":null},"context":"search","selectedOptions":[]}" 5462 5463 ><div 5464 class="resource-card" 5465 data-resource-type="product" 5466> 5467 <a 5468 class="resource-card__link" 5469 href="/products/banner-placeholders" 5470 > 5471 <span class="visually-hidden"> 5472 Banner Placeholders 5473 </span> 5474 </a> 5475 <div 5476 class="resource-card__media" 5477 style="--resource-card-aspect-ratio: 4 / 5;" 5478 5479 > 5480 5481 5482 5483 <img src="//www.tagalys.com/cdn/shop/files/Bannerplaceholder1.png?v=1788197790&width=500" alt="" srcset="//www.tagalys.com/cdn/shop/files/Bannerplaceholder1.png?v=1788197790&width=240 240w, //www.tagalys.com/cdn/shop/files/Bannerplaceholder1.png?v=1788197790&width=352 352w" width="500" height="281" loading="lazy" class="resource-card__image" sizes="auto" ref="" style="object-position: 50.0% 50.0%;"> 5484</div> 5485 5486 <div class="resource-card__content"> 5487 <p class="resource-card__title paragraph">Banner Placeholders</p> 5488 5489 5490 <div ref="priceContainer"> 5491 5492 5493 <div 5494 class=" 5495 price__regular 5496 5497 " 5498 >
5499 <span class="price">$0.00</span> 5500 </div> 5501 <div 5502 class=" 5503 price__sale 5504 5505 price__hidden 5506 5507 " 5508 > 5509 5510 <span class="price-item__group"> 5511 <span class="visually-hidden">Regular price </span> 5512 <span class="price-item--regular compare-at-price"></span> 5513 </span> 5514 <span class="price-item__group"> 5515 <span class="visually-hidden">Sale price </span> 5516 <span class="price-item--sale price">$0.00</span> 5517 </span> 5518 5519 </div> 5520 5521</div> 5522 5523 </div> 5524</div></product-component> 5525 5526 </li> 5527 5528 <li 5529 class="predictive-search-results__card predictive-search-results__card--product" 5530 ref="resultsItems[]" 5531 > 5532 5533<product-component 5534 class="resource-card__wrapper" 5535 5536 5537 view-event-payload="{"product":{"id":7773574398050,"title":"Collection Reports","handle":"collection-reports","selectedVariant":null},"context":"search","selectedOptions":[]}" 5538 5539 ><div 5540 class="resource-card" 5541 data-resource-type="product" 5542> 5543 <a 5544 class="resource-card__link" 5545 href="/products/collection-reports" 5546 > 5547 <span class="visually-hidden"> 5548 Collection Reports 5549 </span> 5550 </a> 5551 <div 5552 class="resource-card__media" 5553 style="--resource-card-aspect-ratio: 4 / 5;" 5554 5555 > 5556 5557 5558 5559 <img src="//www.tagalys.com/cdn/shop/files/Collectionreport1.png?v=1788197760&width=500" alt="" srcset="//www.tagalys.com/cdn/shop/files/Collectionreport1.png?v=1788197760&width=240 240w, //www.tagalys.com/cdn/shop/files/Collectionreport1.png?v=1788197760&width=352 352w" width="500" height="281" loading="lazy" class="resource-card__image" sizes="auto" ref="" style="object-position: 50.0% 50.0%;"> 5560</div> 5561 5562 <div class="resource-card__content"> 5563 <p class="resource-card__title paragraph">Collection Reports</p> 5564 5565 5566 <div ref="priceContainer"> 5567 5568 5569 <div 5570 class=" 5571 price__regular 5572 5573 " 5574 > 5575 <span class="price">$0.00</span> 5576 </div> 5577 <div 5578 class=" 5579 price__sale 5580 5581 price__hidden 5582 5583 " 5584 > 5585 5586 <span class="price-item__group"> 5587 <span class="visually-hidden">Regular price </span> 5588 <span class="price-item--regular compare-at-price"></span> 5589 </span> 5590 <span class="price-item__group"> 5591 <span class="visually-hidden">Sale price </span> 5592 <span class="price-item--sale price">$0.00</span> 5593 </span> 5594 5595 </div> 5596 5597</div> 5598 5599 </div> 5600</div></product-component> 5601 5602 </li> 5603 5604 </ul> 5605 5606</div> 5607 5608 5609 5610 </div> 5611 5612</div> 5613 5614 </div> 5615 5616 <div class="predictive-search-form__footer"> 5617 <button 5618 class="button predictive-search__search-button" 5619 ref="viewAllButton" 5620 > 5621 View all 5622 </button> 5623 </div> 5624 </div> 5625 </form> 5626 </predictive-search-component> 5627 </dialog> 5628</dialog-component> 5629 5630 5631 5632 5633 5634
5634<script 5635 src="//www.tagalys.com/cdn/shop/t/7/assets/gift-card-recipient-form.js?v=170482155849799299241786539026" 5636 type="module" 5637 fetchpriority="low" 5638></script>
5638 5639<quick-add-dialog id="quick-add-dialog"> 5640 <dialog 5641 class="quick-add-modal dialog-modal color-custom-popover" 5642 ref="dialog" 5643 scroll-lock 5644 > 5645 <button 5646 ref="closeButton" 5647 on:click="/closeDialog" 5648 class="button button-unstyled close-button quick-add-modal__close" 5649 aria-label="Close dialog" 5650 ><svg aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 5651<path d="M11.1765 12.025C11.4108 12.2594 11.7907 12.2594 12.025 12.025C12.2594 11.7907 12.2594 11.4108 12.025 11.1765L8.84931 8.00078L12.025 4.82505C12.2594 4.59073 12.2594 4.21083 12.025 3.97652C11.7907 3.7422 11.4108 3.7422 11.1765 3.97652L8.00078 7.15225L4.82505 3.97652C4.59073 3.7422 4.21083 3.7422 3.97652 3.97652C3.7422 4.21083 3.7422 4.59073 3.97652 4.82505L7.15225 8.00078L3.97652 11.1765C3.7422 11.4108 3.7422 11.7907 3.97652 12.025C4.21083 12.2594 4.59073 12.2594 4.82505 12.025L8.00078 8.84931L11.1765 12.025Z" fill="currentColor"/> 5652</svg> 5653</button> 5654 5655 <product-component 5656 id="quick-add-modal-content" 5657 class="quick-add-modal__content" 5658 view-event-trigger="dialog" 5659 ></product-component> 5660 </dialog> 5661</quick-add-dialog> 5662 5663 5664 5665 5666 5667 5668 5669
5669<script src="https://cdn.shopify.com/storefront/standard-actions.js" type="module" data-source-attribution="shopify.standard_actions"></script>
5669 5670</body> 5671</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.