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":"edfe4745-2c7a-4548-a5ad-867eac0dff5f-1791061326","pageurl":"www.tagalys.com\/blogs\/resources","s":"blogs-90637598818","u":"abf9cb033c3c","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=16773527487632265261790754342">
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/01a0fcf5-9827-75b1-9d7e-ea3a10d70819/gdpr-backpack-903/assets/layout-cookie-bar.consentmo.js" crossorigin data-csm-layout-prefetch="banner"> 1282 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0fcf5-9827-75b1-9d7e-ea3a10d70819/gdpr-backpack-903/assets/layout-cookie-dialog.consentmo.js" crossorigin data-csm-layout-prefetch="dialog"> 1283 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0fcf5-9827-75b1-9d7e-ea3a10d70819/gdpr-backpack-903/assets/layout-cookie-box.consentmo.js" crossorigin data-csm-layout-prefetch="box"> 1284 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0fcf5-9827-75b1-9d7e-ea3a10d70819/gdpr-backpack-903/assets/layout-cookie-smart-banner.consentmo.js" crossorigin data-csm-layout-prefetch="smart"> 1285 <link rel="prefetch" href="https://cdn.shopify.com/extensions/01a0fcf5-9827-75b1-9d7e-ea3a10d70819/gdpr-backpack-903/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/01a0fcf5-9827-75b1-9d7e-ea3a10d70819/gdpr-backpack-903/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: ["4c64608a","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":"7963e9093ec6a0c062f7ad9878436179","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","5982071ew7ea472e3p69b68784m2150dfea",{"modern":"","legacy":""},{"trekkieShim":true,"agentContext":true,"apiClientId":"580111","facebookCapiEnabled":"false","themeId":"143353708642","themePublished":"true","eventMetadataId":"94b990d2-9a3e-471f-8dd0-4de34da1f181","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":"[\"4c64608a\", \"16072cab\", \"8450a54b\", \"7ee89bf1\"]","isMerchantRequest":"false","hashVersion":"5982071ew7ea472e3p69b68784m2150dfea","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":"edfe4745-2c7a-4548-a5ad-867eac0dff5f-1791061326"}}; 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.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js"}); 1487 1488 }; 1489 scriptFallback.async = true; 1490 scriptFallback.src = '//www.tagalys.com/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.min.js'; 1491 first.parentNode.insertBefore(scriptFallback, first); 1492}; 1493script.async = true; 1494script.src = '//www.tagalys.com/cdn/s/trekkie.storefront.2f6d7d7ede7d24234881a9cd5f47e679642fa1f6.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":"5999413007735135015","contentLanguage":"en","currency":"USD","eventMetadataId":"94b990d2-9a3e-471f-8dd0-4de34da1f181"},"isServerSideCookieWritingEnabled":true,"monorailRegion":"shop_domain","enabledBetaFlags":["764d78cb","8450a54b","7ee89bf1","4c64608a"]},"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":"edfe4745-2c7a-4548-a5ad-867eac0dff5f-1791061326","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="1822618926000"><meta name="shopify-s" content="00000000-0000-0000-5000-000000000000" data-expiration="1791063126000"><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 2158 2159 2160 2161 2162 2163 <div class="tgh-item" > 2164 <a href="/pages/partners" class="tgh-item-link">Partners</a> 2165 </div> 2166 2167 2168 2169 2170 2171 2172 2173 </div> 2174 2175 <div class="tgh-right"> 2176 <button 2177 class="tgh-search-trigger" 2178 type="button" 2179 aria-label="Search" 2180 aria-haspopup="dialog" 2181 aria-controls="tghSearchPanel" 2182 aria-expanded="false" 2183 onclick="tghSearchOpen(event)" 2184 > 2185 <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> 2186 2187 </button> 2188 2189 2190 <a href="https://next.tagalys.com/users/sign_in?" class="tgh-login">Log in</a> 2191 2192 2193 2194 <a href="/pages/schedule-demo" class="tg-btn tg-btn--black"> 2195 Book a Demo
2196 <span class="tg-btn__arrow" aria-hidden="true"> 2197 <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> 2198 </span> 2199 </a> 2200 2201 </div> 2202 2203 <button 2204 class="tgh-search-trigger tgh-mobile-search-trigger" 2205 type="button" 2206 aria-label="Search" 2207 aria-haspopup="dialog" 2208 aria-controls="tghSearchPanel" 2209 aria-expanded="false" 2210 onclick="tghSearchOpen(event)" 2211 > 2212 <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> 2213 2214 </button> 2215 2216 <button class="tgh-ham" onclick="tghDrawerOpen()" aria-label="Open menu"> 2217 <svg viewBox="0 0 24 24" fill="none"><path d="M3 12h18M3 6h18M3 18h18" stroke="currentColor" stroke-width="2" stroke-linecap="round"/></svg> 2218 </button> 2219 </div> 2220 </nav> 2221</div> 2222 2223<div class="tgh-overlay" id="tghOverlay"></div> 2224 2225<div class="tgh-drawer" id="tghDrawer"> 2226 <div class="tgh-drawer-head"> 2227 <a href="/" class="tgh-drawer-logo" aria-label="Tagalys Website"> 2228 2229 <img src="//www.tagalys.com/cdn/shop/files/Tagalys_Black_Logo.png?v=1782142105&width=300" alt="Tagalys Website"> 2230 2231 </a> 2232 2233 <button class="tgh-drawer-close" onclick="tghDrawerClose()" aria-label="Close menu"> 2234 <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> 2235 </button> 2236 </div> 2237 2238 <div class="tgh-drawer-nav"> 2239 2240 2241 2242 2243 2244 2245<div class="tgh-drawer-row"> 2246 <button class="tgh-drawer-btn" onclick="tghDrawerSubmenu('mega_menu_iaemkv')"> 2247 Collections 2248 <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> 2249 </button> 2250 </div> 2251 2252 2253 2254 2255 2256 2257 2258<div class="tgh-drawer-row"> 2259 <button class="tgh-drawer-btn" onclick="tghDrawerSubmenu('mega_menu_lkjzmk')"> 2260 Search 2261 <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> 2262 </button> 2263 </div> 2264 2265 2266 2267 2268 2269 2270 2271<div class="tgh-drawer-row"> 2272 <button class="tgh-drawer-btn" onclick="tghDrawerSubmenu('mega_menu_bty84e')"> 2273 Recommendations 2274 <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> 2275 </button> 2276 </div> 2277 2278 2279 2280 2281 2282 2283 2284 <div class="tgh-drawer-row"> 2285 <a href="/pages/pricing" class="tgh-drawer-link">Pricing</a> 2286 </div> 2287 2288 2289 2290 2291 2292 2293 2294 2295 2296 2297 2298 <div class="tgh-drawer-row"> 2299 <a href="/pages/partners" class="tgh-drawer-link">Partners</a> 2300 </div> 2301 2302 2303 2304 2305 2306 2307 2308 2309 <div class="tgh-drawer-foot"> 2310 2311 <a href="https://next.tagalys.com/users/sign_in?" class="tgh-drawer-util">Log in</a> 2312 2313 2314 <a href="https://support.tagalys.com/" class="tgh-drawer-util">Support</a> 2315 2316 2317 <a href="/pages/schedule-demo" class="tg-btn tg-btn--black"> 2318 Book a Demo 2319 <span class="tg-btn__arrow" aria-hidden="true"> 2320 <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> 2321 </span> 2322 </a> 2323 2324 </div> 2325 </div> 2326</div> 2327 2328 2329 2330<div class="tgh-search-shell" id="tghSearchShell" hidden aria-hidden="true"> 2331 <button class="tgh-search-backdrop" type="button" aria-label="Close search" onclick="tghSearchClose()"></button> 2332 2333 <section class="tgh-search-panel" id="tghSearchPanel" role="dialog" aria-modal="true" aria-labelledby="tghSearchTitle"> 2334 <h2 class="visually-hidden" id="tghSearchTitle">Search Tagalys</h2> 2335 2336 <button class="tgh-search-close" type="button" aria-label="Close search" onclick="tghSearchClose()">
2337 <svg aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 2338<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"/> 2339</svg> 2340 2341 </button> 2342 2343 <div class="tgh-search-inner" id="tghSearchPanelContent"> 2344 <form class="tgh-search-form" action="/search" method="get" role="search"> 2345 <label class="visually-hidden" for="tghSearchInput">Search Tagalys</label> 2346 <input class="tgh-search-input" id="tghSearchInput" name="query" type="search" autocomplete="off" placeholder="Type to search" required> 2347 <button class="tgh-search-submit" type="submit" aria-label="Submit search"> 2348 <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> 2349 2350 </button> 2351 </form> 2352 2353 <div class="tgh-tagalys-suggestions" aria-live="polite" aria-busy="true"></div> 2354 2355 <div class="tgh-search-help"> 2356 <div> 2357 <strong>Bring search like this to your Shopify store</strong> 2358 <span>Pin priority searches, suggest products as shoppers type, and control every result</span> 2359 </div> 2360 <a class="tg-text-cta" href="/collections/site-search"> 2361 Explore Tagalys Search 2362 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"> 2363 <path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> 2364 <path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> 2365 </svg> 2366 </a> 2367 </div> 2368 </div> 2369 </section> 2370</div> 2371 2372<style> 2373 body.tgh-search-open{overflow:hidden} 2374 .tgh-search-shell[hidden]{display:none} 2375 .tgh-search-shell{position:fixed;inset:68px 0 0;z-index:1200} 2376 .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} 2377 .tgh-search-shell.tgh-search-preparing,.tgh-search-shell.tgh-search-preparing *{visibility:hidden!important} 2378 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} 2379 .tgh-search-backdrop{position:absolute;inset:0;border:0;background:rgba(13,13,13,.28);backdrop-filter:blur(2px);cursor:default} 2380 .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)} 2381 .tgh-search-inner{width:min(1080px,calc(100% - 96px));margin:0 auto;padding:40px 0 44px} 2382 .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} 2383 .tgh-search-close:hover{border-color:var(--tg-border);background:var(--tg-offwhite);transform:rotate(4deg)} 2384 .tgh-search-close:focus-visible{outline:2px solid var(--tg-black);outline-offset:2px} 2385 .tgh-search-close svg{width:18px;height:18px;display:block} 2386 .tgh-search-submit svg{width:22px;height:22px;display:block} 2387 .tgh-search-form{position:relative;width:100%;margin:0 auto} 2388 .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} 2389 .tgh-search-input::placeholder{color:var(--tg-disabled);opacity:1} 2390 .tgh-search-input:focus-visible,.tgh-search-shell:not([hidden]) .tgh-search-input{border-bottom:2px solid var(--tg-black);box-shadow:none} 2391 .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} 2392 #tagalys-namespace.tgh-tagalys-suggestions{position:relative;width:100%;margin-top:15px!important} 2393 2394 /* These elements are rendered dynamically by Tagalys. */ 2395 .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} 2396 .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} 2397 #tagalys-namespace.tgh-tagalys-suggestions .tgh-search-discovery{display:flex!important;flex-direction:column!important;gap:0!important} 2398 #tagalys-namespace.tgh-tagalys-suggestions .tgh-search-discovery>.click-suggestions{margin:0 0 10px 0!important;padding:0!important} 2399 .tgh-tagalys-suggestions .search-results-link{color:var(--tg-black);text-decoration:none} 2400 .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} 2401 .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} 2402 .tgh-tagalys-suggestions .tgh-product-suggestions-column{display:flex;flex-direction:column;min-width:0} 2403 .tgh-tagalys-suggestions .type-suggestions:has(>.text-suggestions:only-child){grid-template-columns:minmax(0,1fr)!important} 2404 .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} 2405 .tgh-tagalys-suggestions .type-suggestions:has(.products.product-suggestions) .text-suggestions{padding:0!important;border:0!important;border-radius:0!important;background:transparent!important} 2406 .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} 2407 .tgh-tagalys-suggestions .type-suggestions.tgh-single-product-suggestion{grid-template-columns:minmax(0,max-content) minmax(240px,.95fr)!important} 2408 .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} 2409 .tgh-tagalys-suggestions .text-suggestion-section{margin:0!important;list-style:none!important} 2410 .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} 2411 .tgh-tagalys-suggestions .text-suggestion-section>ul{margin:0!important;padding:0!important;list-style:none!important} 2412 .tgh-tagalys-suggestions .text-suggestion-section>ul>li{margin:0!important;padding:0!important;list-style:none!important} 2413 .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} 2414 .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} 2415 .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} 2416 .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%)} 2417 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestions{display:flex;flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none} 2418 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion{dis
2418play: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} 2419 #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} 2420 #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} 2421 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion:not(.recent-search-item):hover{border-color:rgba(13,13,13,.22);background:var(--tg-white)} 2422 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .search-results-link{display:flex;align-items:center;gap:6px;font-size:.8125rem;line-height:1} 2423 #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} 2424 #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} 2425 #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} 2426 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion.recent-search-item .recent-search-icon{width:13px;height:13px;opacity:.5} 2427 #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} 2428 #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} 2429 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestion .tgh-recent-search-remove:focus-visible{outline:2px solid var(--tg-black);outline-offset:1px} 2430 #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} 2431 #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} 2432 #tagalys-namespace.tgh-tagalys-suggestions .type-suggestions.tgh-single-product-suggestion .products.product-suggestions{grid-template-columns:minmax(0,240px)!important;width:auto!important} 2433 .tgh-tagalys-suggestions img{max-width:100%;height:auto;display:block} 2434 .tgh-tagalys-suggestions .hint{margin-top:24px;font-size:14px;color:var(--tg-charcoal)} 2435 .tgh-tagalys-suggestions .highlight{color:var(--tg-black)!important;background:transparent!important;font-weight:600} 2436 .tgh-smart-widget .widget-header{margin-bottom:14px} 2437 .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)} 2438 .tgh-smart-widget .products{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px} 2439 #tagalys-namespace.tgh-tagalys-suggestions .tgc-card{display:flex;flex-direction:column;min-width:0;color:var(--tg-ink);text-decoration:none!important} 2440 .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} 2441 .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} 2442 .tgh-tagalys-suggestions .tgc-card-img .tgc-img-hover{position:absolute;inset:0;opacity:0}
2442 2443 .tgh-tagalys-suggestions .tgc-card:hover .tgc-card-img img{transform:scale(1.035)} 2444 .tgh-tagalys-suggestions .tgc-card:hover .tgc-img-hover{opacity:1} 2445 .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)} 2446 .tgh-tagalys-suggestions .tgc-card-body{padding:12px 2px 0} 2447 .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} 2448 .tgh-tagalys-suggestions .tgc-card:hover .tgc-card-name{color:var(--tg-charcoal)} 2449 .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} 2450 .tgh-search-help>div{display:flex;flex-direction:column;gap:4px} 2451 .tgh-search-help strong{font-family:var(--tg-font-body);font-size:15px;font-weight:600;color:var(--tg-black)} 2452 .tgh-search-help span{font-size:13px;color:var(--tg-charcoal)} 2453 .tgh-search-help .tg-text-cta{flex-shrink:0} 2454 2455 #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} 2456 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-product{display:flex;flex-direction:column;min-width:0} 2457 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-product-image{aspect-ratio:4/2.8;border:1px solid var(--tg-border);border-radius:12px} 2458 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-product-title{width:68%;height:14px;margin:12px 2px 0;border-radius:999px} 2459 #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%} 2460 2461 @keyframes tgh-suggestions-skeleton-shimmer{ 2462 from{background-position:100% 0} 2463 to{background-position:-100% 0} 2464 } 2465 2466 @media(max-width:860px){ 2467 .tgh-search-shell{inset:60px 0 0} 2468 .tgh-search-panel{max-height:calc(100dvh - 60px)} 2469 .tgh-search-inner{width:calc(100% - 32px);padding:34px 0 28px} 2470 .tgh-search-close{top:10px;right:10px} 2471 .tgh-search-input{height:50px;font-size:16px} 2472 #tagalys-namespace.tgh-tagalys-suggestions .click-suggestions{gap:10px} 2473 .tgh-tagalys-suggestions .type-suggestions{grid-template-columns:1fr!important;gap:28px!important} 2474 #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} 2475 .tgh-smart-widget .products{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px} 2476 .tgh-search-help{margin-top:40px;padding-top:28px;align-items:flex-start;flex-direction:column;gap:20px} 2477 #tagalys-namespace.tgh-tagalys-suggestions .tgh-recommendations-skeleton .products{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:22px 12px} 2478 } 2479 2480 @media (prefers-reduced-motion: reduce){ 2481 #tagalys-namespace.tgh-tagalys-suggestions .tgh-skeleton-block{animation:none} 2482 } 2483 2484 @media(min-width:861px) and (max-width:1180px){ 2485 .tgh-search-inner{width:calc(100% - 80px)} 2486 } 2487</style> 2488
2489<script> 2490 var _tghSearchReturnFocus = null; 2491 var _tghSearchSuggestionsInitialised = false; 2492 var _tghSearchSuggestionsRequested = false; 2493 var _tghHideSearchSuggestionsPopover = null; 2494 var _tghSearchIsPreparing = false; 2495 var _tghSearchPreparationTimer = null; 2496 2497 function finishTagalysSearchPreparation() { 2498 if (!_tghSearchIsPreparing) return; 2499 2500 var shell = document.getElementById('tghSearchShell'); 2501 _tghSearchIsPreparing = false; 2502 window.clearTimeout(_tghSearchPreparationTimer); 2503 if (!shell) return; 2504 2505 shell.classList.remove('tgh-search-preparing'); 2506 shell.hidden = true; 2507 if (typeof _tghHideSearchSuggestionsPopover === 'function') _tghHideSearchSuggestionsPopover(); 2508 if (!shell.querySelector('.search-suggestions')) _tghSearchSuggestionsRequested = false; 2509 } 2510 2511 function requestInitialTagalysSearchSuggestions() { 2512 var input = document.getElementById('tghSearchInput'); 2513 if (!_tghSearchSuggestionsInitialised || _tghSearchSuggestionsRequested || !input) return; 2514 2515 _tghSearchSuggestionsRequested = true; 2516 input.dispatchEvent(new Event('input', { bubbles: true })); 2517 } 2518 2519 function prepareTagalysSearchSuggestions(delay) { 2520 initTagalysSearchSuggestions(); 2521 if (!_tghSearchSuggestionsInitialised) return; 2522 2523 // Prepare the empty-query discovery content while the panel is hidden so opening it is only a reveal and focus operation. 2524 window.setTimeout(function () { 2525 var shell = document.getElementById('tghSearchShell'); 2526 if (!shell || !shell.hidden || _tghSearchSuggestionsRequested) return; 2527 2528 _tghSearchIsPreparing = true; 2529 shell.classList.add('tgh-search-preparing'); 2530 shell.hidden = false; 2531 requestInitialTagalysSearchSuggestions(); 2532 _tghSearchPreparationTimer = window.setTimeout(finishTagalysSearchPreparation, 2000); 2533 }, typeof delay === 'number' ? delay : 250); 2534 } 2535 2536 function tghRenderRecommendationProductSkeletonGrid(html, count) { 2537 var tiles = []; 2538 2539 for (var index = 0; index < count; index += 1) { 2540 tiles.push(html` 2541 <div class="tgh-skeleton-product" key=${index}> 2542 <div class="tgh-skeleton-block tgh-skeleton-product-image"></div> 2543 <div class="tgh-skeleton-block tgh-skeleton-product-title"></div> 2544 </div> 2545 `); 2546 } 2547 2548 return html` 2549 <div class="products" aria-hidden="true"> 2550 ${tiles} 2551 </div> 2552 `; 2553 } 2554 2555 function tghRenderSuggestionProductCard(html, product, helpers) { 2556 var customMetafields = product.metafields && product.metafields.custom 2557 ? product.metafields.custom 2558 : {}; 2559 var slides = customMetafields.slides && Array.isArray(customMetafields.slides.value) 2560 ? customMetafields.slides.value 2561 : []; 2562 var primarySlideImage = slides[0] && slides[0].image ? slides[0].image : null; 2563 var hoverSlideImage = slides[1] && slides[1].image ? slides[1].image : null; 2564 var primaryImage = primarySlideImage ? primarySlideImage.url + '&width=900' : null; 2565 var hoverImage = hoverSlideImage ? hoverSlideImage.url + '&width=900' : null; 2566 var navigateToProductDetailPage = function (event) { 2567 helpers.navigateToProductDetailPage(event, product); 2568 }; 2569 var productOptions = helpers.getTemplateOptions('product'); 2570 var productLink = productOptions.productPageUrl(product); 2571 2572 return html` 2573 <a 2574 class="tgc-card exclude-tagalys-css-reset" 2575 href=${productLink} 2576 onclick=${navigateToProductDetailPage} 2577 > 2578 <div class="tgc-card-img"> 2579 ${primaryImage 2580 ? html` 2581 <img 2582 src=${primaryImage} 2583 alt=${primarySlideImage.alt_text || product.title} 2584 loading="lazy" 2585 /> 2586 ` 2587 : null} 2588 ${hoverImage 2589 ? html` 2590 <img 2591 class="tgc-img-hover" 2592 src=${hoverImage} 2593 alt=${hoverSlideImage.alt_text || product.title} 2594 loading="lazy" 2595 /> 2596 ` 2597 : null} 2598 </div> 2599 <div class="tgc-card-body"> 2600 <h2 class="tgc-card-name tg-h5">${product.title}</h2> 2601 </div> 2602 </a> 2603 `; 2604 } 2605 2606 function tghGetSuggestionSectionKey(section) { 2607 var id = section.id || section.section_id || ''; 2608 return String(id).toLowerCase(); 2609 } 2610
2611 function tghMergeCollectionsAndPages(textSuggestions, maxItems) { 2612 if (!textSuggestions || !textSuggestions.length) return textSuggestions || []; 2613 2614 maxItems = maxItems || 8; 2615 var collectionsSection = null; 2616 var pagesSection = null; 2617 var otherSections = []; 2618 2619 textSuggestions.forEach(function (section) { 2620 var key = tghGetSuggestionSectionKey(section); 2621 if (key === 'collections') { 2622 collectionsSection = section; 2623 } else if (key === 'pages') { 2624 pagesSection = section; 2625 } else { 2626 otherSections.push(section); 2627 } 2628 }); 2629 2630 var collectionItems = collectionsSection && collectionsSection.items ? collectionsSection.items : []; 2631 var pageItems = pagesSection && pagesSection.items ? pagesSection.items : []; 2632 var mergedItems = collectionItems.concat(pageItems).slice(0, maxItems); 2633 2634 if (!mergedItems.length) { 2635 return otherSections; 2636 } 2637 2638 return otherSections.concat([ 2639 { 2640 id: 'pages', 2641 section_id: 'pages', 2642 title: 'Pages', 2643 section_title: 'Pages', 2644 type: 'links', 2645 items: mergedItems 2646 } 2647 ]); 2648 } 2649 2650 function initTagalysSearchSuggestions() { 2651 if (_tghSearchSuggestionsInitialised || !window.Tagalys || !Tagalys.UIWidgets || !Tagalys.UIWidgets.SearchSuggestions) return; 2652 2653 try { 2654 Tagalys.UIWidgets.SearchSuggestions.init('#tghSearchInput', { 2655 searchResultsURL: '/search', 2656 templates: { 2657 widget: { 2658 options: { 2659 sections: { 2660 products: { 2661 count: 4 2662 }, 2663 collections: { 2664 count: 4 2665 }, 2666 pages: { 2667 count: 4 2668 } 2669 }, 2670 selector: '.tgh-tagalys-suggestions', 2671 includeTagalysCSS: true, 2672 position: false, 2673 minimumCharactersToShowSuggestions: 2, 2674 alignToSelector: '#tghSearchPanelContent', 2675 inheritAlignmentElementWidth: true, 2676 canBindSearchSubmitActionToNearestFormElement: true, 2677 interactionSelectors: [".tgh-search-panel", ".tgh-root"] 2678 } 2679 }, 2680 hint: { 2681 render: function (html, args) { 2682 return html``; 2683 } 2684 }, 2685 recentSearchItem: { 2686 render: function (html, args) { 2687 var props = args.props; 2688 var helpers = props.helpers; 2689 var enteredSearchQuery = helpers.getEnteredSearchQuery(); 2690 var recentQuery = props.recentSearch.query; 2691 var getRecentSearchRemovalQuery = function () { 2692 var searchLink = helpers.getLink(recentQuery); 2693 if (searchLink && searchLink.indexOf('?') !== -1) { 2694 return searchLink.split('?').slice(1).join('?'); 2695 } 2696 return 'query=' + encodeURIComponent(recentQuery); 2697 }; 2698 var removeRecentSearch = function (event) { 2699 event.preventDefault(); 2700 event.stopPropagation(); 2701 if (event.stopImmediatePropagation) event.stopImmediatePropagation(); 2702 helpers.removeRecentSearch(getRecentSearchRemovalQuery()); 2703 }; 2704 2705 return html` 2706 <li class="click-suggestion recent-search-item"> 2707 <a 2708 class="search-results-link tgh-recent-search-link" 2709 href=${helpers.getLink(recentQuery)} 2710 > 2711 <${args.templates.recentSearchIcon} /> 2712 <${args.templates.highlighter} 2713 label=${recentQuery} 2714 highlight=${enteredSearchQuery} 2715 /> 2716 </a> 2717 <button 2718 type="button" 2719 class="tgh-recent-search-remove" 2720 aria-label=${`Remove "${recentQuery}" from recent searches`} 2721 onClick=${removeRecentSearch} 2722 > 2723 <${args.templates.closeIcon} onClick=${removeRecentSearch} /> 2724 </button> 2725 </li> 2726 `; 2727 } 2728 }, 2729 clickSuggestions: { 2730 callbacks: { 2731 afterInitialRender: function () { 2732 var suggestions = document.querySelector('.tgh-tagalys-suggestions'); 2733 if (suggestions) suggestions.setAttribute('aria-busy', 'false'); 2734 2735 Tagalys.UIWidgets.Recommendations.init("[data-smart-widget]", { 2736 recommendationId: "529e3cca2f6d43262300", 2737 templates: { 2738 widget: { 2739 options: { 2740 count: 4, 2741 includeTagalysCSS: false, 2742 displayFormat: "grid" 2743 },
2744 render: function (html, args) { 2745 var props = args.props; 2746 var helpers = props.helpers; 2747 var products = helpers.getProducts(); 2748 2749 if (props.loading !== false) { 2750 return html` 2751 <div 2752 class="widget tgh-recommendations-skeleton" 2753 role="status" 2754 aria-busy="true" 2755 aria-label="Loading recommendations" 2756 > 2757 ${tghRenderRecommendationProductSkeletonGrid(html, 4)} 2758 </div> 2759 `; 2760 } 2761 2762 if (products.length === 0) { 2763 return null; 2764 } 2765 2766 return html` 2767 <div class="widget"> 2768 <div class="widget-body"> 2769 <${args.templates.productList} /> 2770 </div> 2771 <${args.templates.footer} /> 2772 </div> 2773 `; 2774 }, 2775 callbacks: { 2776 afterInitialRender: finishTagalysSearchPreparation 2777 } 2778 }, 2779 product: { 2780 render: function (html, args) { 2781 return tghRenderSuggestionProductCard( 2782 html, 2783 args.props.product, 2784 args.props.helpers 2785 ); 2786 } 2787 } 2788 } 2789 }); 2790 } 2791 }, 2792 render: function (html, args) { 2793 var helpers = args.props.helpers; 2794 var recentAndPopularSearches = helpers.getRecentAndPopularSearches(); 2795 var recentSearches = recentAndPopularSearches.recentSearches || []; 2796 var popularSearches = recentAndPopularSearches.popularSearches || []; 2797 var hasClickSuggestions = recentSearches.length > 0 || popularSearches.length > 0; 2798 2799 return html` 2800 <div class="tgh-search-discovery"> 2801 ${hasClickSuggestions 2802 ? html` 2803 <ul class="click-suggestions"> 2804 ${recentSearches.map( 2805 recentSearch => 2806 html`<${args.templates.recentSearchItem} recentSearch=${recentSearch} />` 2807 )} 2808 ${popularSearches.map( 2809 popularSearch => 2810 html`<${args.templates.popularSearchItem} popularSearch=${popularSearch} />` 2811 )} 2812 </ul> 2813 ` 2814 : null} 2815 <div class="tgh-smart-widget exclude-tagalys-css exclude-tagalys-css-reset" data-smart-widget></div> 2816 </div> 2817 `; 2818 } 2819 }, 2820 typeSuggestions: { 2821 render: function (html, args) { 2822 var props = args.props; 2823 var helpers = props.helpers; 2824 var textSuggestions = tghMergeCollectionsAndPages(helpers.getTextSuggestions(), 8); 2825 var products = helpers.getProducts ? helpers.getProducts() : []; 2826 2827 var classes = ['type-suggestions']; 2828 if (helpers.hasTextSearchSuggestions()) { 2829 classes.push('product-and-text-suggestions'); 2830 } else { 2831 classes.push('product-suggestions'); 2832 } 2833 if (products.length === 1) { 2834 classes.push('tgh-single-product-suggestion'); 2835 } 2836 2837 return html` 2838 <div class=${classes.join(' ')}> 2839 ${products.length 2840 ? html` 2841 <div class="tgh-product-suggestions-column">
2842 <span class="section-title">Features</span> 2843 <${args.templates.products} class="product-suggestions" /> 2844 </div> 2845 ` 2846 : null} 2847 ${helpers.hasTextSearchSuggestions() 2848 ? html` 2849 <ul class="text-suggestions"> 2850 ${textSuggestions.map( 2851 textSuggestionSection => 2852 html`<${args.templates.textSuggestionSection} textSuggestionSection=${textSuggestionSection} />` 2853 )} 2854 </ul> 2855 ` 2856 : null} 2857 </div> 2858 `; 2859 } 2860 }, 2861 textSuggestionSection: { 2862 render: function (html, args) { 2863 var textSuggestionSection = args.props.textSuggestionSection; 2864 if (!textSuggestionSection.items || !textSuggestionSection.items.length) { 2865 return null; 2866 } 2867 2868 return html` 2869 <li 2870 class="text-suggestion-section" 2871 data-section-id=${textSuggestionSection.id} 2872 > 2873 <span class="section-title">${textSuggestionSection.title}</span> 2874 <ul> 2875 ${textSuggestionSection.items.map(function (textSuggestionSectionItem) { 2876 return html` 2877 <${args.templates.textSuggestionSectionItem} 2878 textSuggestionSectionId=${textSuggestionSection.id} 2879 textSuggestionSectionItem=${textSuggestionSectionItem} 2880 /> 2881 `; 2882 })} 2883 </ul> 2884 </li> 2885 `; 2886 } 2887 }, 2888 textSuggestionSectionItem: { 2889 render: function (html, args) { 2890 var helpers = args.props.helpers; 2891 var enteredSearchQuery = helpers.getEnteredSearchQuery(); 2892 var item = args.props.textSuggestionSectionItem; 2893 var url = item.link ? item.link : helpers.getLink(item.query); 2894 var label = item.title ? item.title : item.query; 2895 2896 return html` 2897 <li> 2898 <a class="search-results-link tgh-page-suggestion-link" href=${url}> 2899 <${args.templates.highlighter} 2900 label=${label} 2901 highlight=${enteredSearchQuery} 2902 /> 2903 </a> 2904 </li> 2905 `; 2906 } 2907 }, 2908 products: { 2909 render: function (html, args) { 2910 var props = args.props; 2911 var products = props.helpers.getProducts(); 2912 var extraClass = props.className || props.class || ''; 2913 2914 return html` 2915 <div class=${`products product-suggestions ${extraClass}`.trim()}> 2916 ${products.map(function (product) { 2917 return html`<${args.templates.product} key=${product.id} product=${product} />`; 2918 })} 2919 </div> 2920 `; 2921 } 2922 }, 2923 product: { 2924 render: function (html, args) { 2925 return tghRenderSuggestionProductCard( 2926 html, 2927 args.props.product, 2928 args.props.helpers 2929 ); 2930 } 2931 } 2932 }, 2933 callbacks: { 2934 afterInitialRender: function (args) { 2935 _tghHideSearchSuggestionsPopover = args.hideSearchSuggestionsPopover; 2936 } 2937 } 2938 }); 2939 2940 _tghSearchSuggestionsInitialised = true; 2941 } catch (error) { 2942 console.warn('[Tagalys search] Suggestions could not initialise.', error); 2943 } 2944 } 2945 2946 function tghSearchOpen(event) { 2947 var shell = document.getElementById('tghSearchShell'); 2948 var input = document.getElementById('tghSearchInput'); 2949 if (!shell || !input) return; 2950 if (_tghSearchIsPreparing) { 2951 _tghSearchIsPreparing = false;
2952 window.clearTimeout(_tghSearchPreparationTimer); 2953 shell.classList.remove('tgh-search-preparing'); 2954 } 2955 if (typeof _tghOpen !== 'undefined' && _tghOpen) tghCloseNow(_tghOpen); 2956 if (typeof tghDrawerClose === 'function') tghDrawerClose(); 2957 _tghSearchReturnFocus = event && event.currentTarget ? event.currentTarget : document.activeElement; 2958 shell.hidden = false; 2959 shell.setAttribute('aria-hidden', 'false'); 2960 document.body.classList.add('tgh-search-open'); 2961 document.querySelectorAll('[aria-controls="tghSearchPanel"]').forEach(function(button){button.setAttribute('aria-expanded','true')}); 2962 function focusAndShowSuggestions() { 2963 input.focus({ preventScroll: true }); 2964 if (!shell.querySelector('.search-suggestions')) _tghSearchSuggestionsRequested = false; 2965 requestInitialTagalysSearchSuggestions(); 2966 } 2967 2968 function initialiseSuggestionsAndFocus() { 2969 prepareTagalysSearchSuggestions(); 2970 focusAndShowSuggestions(); 2971 } 2972 2973 if (_tghSearchSuggestionsInitialised) { 2974 focusAndShowSuggestions(); 2975 } else if (typeof window.onTagalysReady === 'function') { 2976 window.onTagalysReady(initialiseSuggestionsAndFocus); 2977 } else { 2978 initialiseSuggestionsAndFocus(); 2979 } 2980 } 2981 2982 function tghSearchClose() { 2983 var shell = document.getElementById('tghSearchShell'); 2984 if (!shell || shell.hidden) return; 2985 shell.classList.add('tgh-search-closing'); 2986 if (typeof _tghHideSearchSuggestionsPopover === 'function') _tghHideSearchSuggestionsPopover(); 2987 shell.hidden = true; 2988 shell.setAttribute('aria-hidden', 'true'); 2989 shell.classList.remove('tgh-search-closing'); 2990 document.body.classList.remove('tgh-search-open'); 2991 document.querySelectorAll('[aria-controls="tghSearchPanel"]').forEach(function(button){button.setAttribute('aria-expanded','false')}); 2992 if (_tghSearchReturnFocus && typeof _tghSearchReturnFocus.focus === 'function') _tghSearchReturnFocus.focus(); 2993 _tghSearchSuggestionsRequested = false; 2994 var suggestions = document.querySelector('.tgh-tagalys-suggestions'); 2995 if (suggestions) suggestions.setAttribute('aria-busy', 'true'); 2996 } 2997 2998 document.addEventListener('keydown',function(event){ 2999 var shell=document.getElementById('tghSearchShell'); 3000 if(!shell||shell.hidden)return; 3001 if(event.key==='Escape'){event.preventDefault();tghSearchClose();return} 3002 if(event.key!=='Tab')return; 3003 var focusable=Array.from(shell.querySelectorAll('a[href],button:not([disabled]),input:not([disabled])')).filter(function(element){return element.offsetParent!==null}); 3004 if(!focusable.length)return; 3005 var first=focusable[0],last=focusable[focusable.length-1]; 3006 if(event.shiftKey&&document.activeElement===first){event.preventDefault();last.focus()} 3007 if(!event.shiftKey&&document.activeElement===last){event.preventDefault();first.focus()} 3008 }); 3009 3010 (function () { 3011 var searchForm = document.querySelector('#tghSearchPanelContent .tgh-search-form'); 3012 if (searchForm) { 3013 searchForm.addEventListener('submit', function () { 3014 tghSearchClose(); 3015 }); 3016 } 3017 })(); 3018 3019 if (typeof window.onTagalysReady === 'function') { 3020 window.onTagalysReady(prepareTagalysSearchSuggestions); 3021 } 3022</script>
3022 3023 3024 3025 3026 3027 3028 3029 3030<div class="tgh-drawer-panel" id="panel-mega_menu_iaemkv"> 3031 <div class="tgh-panel-head"> 3032 <button class="tgh-panel-back" onclick="tghDrawerPanelClose()" aria-label="Back"> 3033 <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> 3034 </button> 3035 <div class="tgh-panel-title">Collections</div> 3036 </div> 3037 3038 <div class="tgh-panel-content"> 3039 3040 3041 <div class="tgh-panel-group"> 3042 <div class="tgh-panel-heading">CONTROL</div> 3043 3044 3045 3046<a href="/products/smart-pinning" class="tgh-panel-link">Pin with conditions</a> 3047 3048 3049 3050<a href="/products/trending-score" class="tgh-panel-link">Trending Score</a> 3051 3052 3053 3054<a href="/products/product-boost" class="tgh-panel-link">Product Boost</a> 3055 3056 3057 3058<a href="/products/global-sort-options" class="tgh-panel-link">Global Sort Options</a> 3059 3060 3061 3062 </div> 3063 3064 3065 3066 <div class="tgh-panel-group"> 3067 <div class="tgh-panel-heading">CURATE</div> 3068 3069 3070 3071<a href="/products/looks" class="tgh-panel-link">Looks</a> 3072 3073 3074 3075<a href="/products/visual-sequences" class="tgh-panel-link">Sequences</a> 3076 3077 3078 3079 </div> 3080 3081 3082 3083 <div class="tgh-panel-group"> 3084 <div class="tgh-panel-heading">SCALE</div> 3085 3086 3087 3088<a href="/products/markets" class="tgh-panel-link">Markets</a> 3089 3090 3091 3092<a href="/products/server-side" class="tgh-panel-link">Server Side</a> 3093 3094 3095 3096<a href="/products/size-merchandising" class="tgh-panel-link">Size Merchandising</a> 3097 3098 3099 3100 </div> 3101 3102 3103 3104 3105 <a href="/collections/collection-merchandising" class="tg-text-cta tgh-panel-cta"> 3106 EXPLORE COLLECTION MERCHANDISING 3107 <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> 3108 </a> 3109 3110 </div> 3111 </div> 3112 3113 3114 3115 3116 3117 3118 3119<div class="tgh-drawer-panel" id="panel-mega_menu_lkjzmk"> 3120 <div class="tgh-panel-head"> 3121 <button class="tgh-panel-back" onclick="tghDrawerPanelClose()" aria-label="Back"> 3122 <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> 3123 </button> 3124 <div class="tgh-panel-title">Search</div> 3125 </div> 3126 3127 <div class="tgh-panel-content"> 3128 3129 3130 <div class="tgh-panel-group"> 3131 <div class="tgh-panel-heading">CONTROL</div> 3132 3133 3134 3135<a href="/products/pinned-searches" class="tgh-panel-link">Pinned Search</a> 3136 3137 3138 3139<a href="/products/popular-searches" class="tgh-panel-link">Popular Search</a> 3140 3141 3142 3143<a href="/products/trending-score" class="tgh-panel-link">Trending Score</a> 3144 3145 3146 3147<a href="/products/global-sort-options" class="tgh-panel-link">Global Sort Options</a> 3148 3149 3150 3151 </div> 3152 3153 3154 3155 <div class="tgh-panel-group"> 3156 <div class="tgh-panel-heading">FIND</div> 3157 3158 3159 3160<a href="/products/predictive-search" class="tgh-panel-link">Predictive Search</a> 3161 3162 3163 3164<a href="/products/search-accuracy" class="tgh-panel-link">Search Accuracy</a> 3165 3166 3167 3168<a href="/products/refine-search-results" class="tgh-panel-link">Search Results</a> 3169 3170 3171 3172 </div> 3173 3174 3175 3176 3177 3178 3179 <a href="/collections/site-search" class="tg-text-cta tgh-panel-cta"> 3180 EXPLORE SITE SEARCH 3181 <svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
3181<path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg> 3182 </a> 3183 3184 </div> 3185 </div> 3186 3187 3188 3189 3190 3191 3192 3193<div class="tgh-drawer-panel" id="panel-mega_menu_bty84e"> 3194 <div class="tgh-panel-head"> 3195 <button class="tgh-panel-back" onclick="tghDrawerPanelClose()" aria-label="Back"> 3196 <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> 3197 </button> 3198 <div class="tgh-panel-title">Recommendations</div> 3199 </div> 3200 3201 <div class="tgh-panel-content"> 3202 3203 3204 <div class="tgh-panel-group"> 3205 <div class="tgh-panel-heading">CONTROL</div> 3206 3207 3208 3209<a href="/products/smart-pinning" class="tgh-panel-link">Pin with conditions</a> 3210 3211 3212 3213<a href="/products/trending-score" class="tgh-panel-link">Trending Score</a> 3214 3215 3216 3217<a href="/products/product-boost" class="tgh-panel-link">Product Boost</a> 3218 3219 3220 3221<a href="/products/global-sort-options" class="tgh-panel-link">Global Sort Options</a> 3222 3223 3224 3225 </div> 3226 3227 3228 3229 <div class="tgh-panel-group"> 3230 <div class="tgh-panel-heading">DISCOVER</div> 3231 3232 3233 3234<a href="/products/similar-products" class="tgh-panel-link">Similar Products</a> 3235 3236 3237 3238<a href="/products/trending-best-sellers-recommendations" class="tgh-panel-link">Trending / Best Sellers</a> 3239 3240 3241 3242<a href="/products/new-arrivals-recommendations" class="tgh-panel-link">New Arrivals</a> 3243 3244 3245 3246 </div> 3247 3248 3249 3250 3251 3252 3253 <a href="/collections/product-recommendations" class="tg-text-cta tgh-panel-cta"> 3254 Explore Product Recommendations 3255 <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> 3256 </a> 3257 3258 </div> 3259 </div> 3260 3261 3262 3263 3264 3265 3266 3267 3268 3269 3270 3271 3272 3273 3274 3275
3276<script> 3277var _tghOpen=null;var _tghTimer=null; 3278function 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} 3279function 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} 3280function tghClose(key){_tghTimer=setTimeout(function(){tghCloseNow(key)},120)} 3281function 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}} 3282document.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)})})}); 3283function tghDrawerOpen(){ 3284 var searchShell = document.getElementById('tghSearchShell'); 3285 if (searchShell && !searchShell.hidden && typeof tghSearchClose === 'function') tghSearchClose(); 3286 document.getElementById('tghDrawer').classList.add('open'); 3287 document.body.style.overflow='hidden'; 3288} 3289function tghDrawerClose(){document.getElementById('tghDrawer').classList.remove('open');document.querySelectorAll('.tgh-drawer-panel.open').forEach(function(panel){panel.classList.remove('open')});document.body.style.overflow=''} 3290function tghDrawerSubmenu(key){var panel=document.getElementById('panel-'+key);if(!panel)return;panel.classList.add('open')} 3291function tghDrawerPanelClose(){document.querySelectorAll('.tgh-drawer-panel.open').forEach(function(panel){panel.classList.remove('open')})} 3292document.addEventListener('keydown',function(e){if(e.key==='Escape'){if(_tghOpen)tghCloseNow(_tghOpen);tghDrawerClose()}}); 3293window.addEventListener('scroll',function(){var nav=document.getElementById('tghNav');if(nav)nav.classList.toggle('scrolled',window.scrollY>20)},{passive:true}); 3294</script>
3294 3295 3296</section> 3297<!-- END sections: header-group --> 3298 </div> 3299 3300
3300<script> 3301 // Inline header height and menu style calculations to prevent layout shift 3302 // Note: Updates in calculateHeaderGroupHeight(), updateTransparentHeaderOffset() and setHeaderMenuStyle() utilities.js should be kept in sync with this function 3303 (function setHeaderHeighCustomProperties() { 3304 /* 3305 * Header calculation functions for maintaining CSS variables 3306 * Mimic calculateHeaderGroupHeight() in utilities.js 3307 */ 3308 const header = document.querySelector('header-component'); 3309 const headerGroup = document.querySelector('#header-group'); 3310 const hasHeaderSection = headerGroup?.querySelector('.header-section'); 3311 3312 if (!header || !headerGroup) return; 3313 3314 const headerTopRow = header.querySelector('.header__row--top'); 3315 const headerHeight = header.offsetHeight; 3316 3317 // Calculate the total height of the header group 3318 let headerGroupHeight = 0; 3319 const children = headerGroup.children; 3320 for (let i = 0; i < children.length; i++) { 3321 const element = children[i]; 3322 if (element === header || !(element instanceof HTMLElement)) continue; 3323 headerGroupHeight += element.offsetHeight; 3324 } 3325 3326 // Check for transparent header special case 3327 if (header.hasAttribute('transparent') && header.parentElement?.nextElementSibling) { 3328 headerGroupHeight += headerHeight; 3329 } 3330 3331 // Set CSS variables 3332 document.body.style.setProperty('--header-height', `${headerHeight}px`); 3333 document.body.style.setProperty('--header-group-height', `${headerGroupHeight}px`); 3334 3335 if (headerTopRow) { 3336 window.requestAnimationFrame(function () { 3337 document.body.style.setProperty('--top-row-height', `${headerTopRow.offsetHeight}px`); 3338 }); 3339 } 3340 3341 /** 3342 * Updates CSS custom properties for transparent header offset calculation 3343 * Mimic updateTransparentHeaderOffset() in utilities.js 3344 */ 3345 3346 if (!hasHeaderSection || !header?.hasAttribute('transparent')) { 3347 document.body.style.setProperty('--transparent-header-offset-boolean', '0'); 3348 return; 3349 } 3350 3351 const hasImmediateSection = hasHeaderSection.nextElementSibling?.classList.contains('shopify-section'); 3352 3353 const shouldApplyOffset = !hasImmediateSection ? '1' : '0'; 3354 document.body.style.setProperty('--transparent-header-offset-boolean', shouldApplyOffset); 3355 })(); 3356 3357 (function setHeaderMenuStyle() { 3358 const headerComponent = document.querySelector('#header-component'); 3359 if (headerComponent) { 3360 const isTouchDevice = 'ontouchstart' in window && navigator.maxTouchPoints > 0; 3361 const overflowList = headerComponent?.querySelector('overflow-list'); 3362 const hasReachedMinimum = overflowList && overflowList.hasAttribute('minimum-reached'); 3363 headerComponent.dataset.menuStyle = isTouchDevice || hasReachedMinimum ? 'drawer' : 'menu'; 3364 } 3365 })(); 3366 </script>
3366 3367 3368 <main 3369 id="MainContent" 3370 class="content-for-layout" 3371 role="main" 3372 data-page-transition-enabled="false" 3373 data-product-transition="false" 3374 data-template="blog" 3375 > 3376 <section id="shopify-section-template--19314630361186__main" class="shopify-section tagalys-blog-index-section"> 3377 3378 3379<section class="tg-blog-index"> 3380 3381 <header class="tg-blog-index-hero tg-section"> 3382 <div class="tg-blog-index-hero__inner tg-reading-wrap"> 3383 3384 <div class="tg-label tg-label--dark">Tagalys Resources</div> 3385 3386 3387 <h1 class="tg-blog-index-hero__title tg-h1"> 3388 3389 Thoughts on fashion merchandising 3390 3391 </h1> 3392 3393 3394 <p class="tg-blog-index-hero__copy tg-copy">Insights from the people building merchandising software for fashion brands on Shopify.</p> 3395 3396 </div> 3397 </header> 3398 3399 <nav class="tg-blog-filters" aria-label="Filter articles"> 3400 <div class="tg-blog-filters__inner tg-wrap"> 3401 <a href="/blogs/resources" class="tg-blog-filter is-active"> 3402 Latest 3403 </a> 3404 3405 3406 3407 3408 3409 3410 3411 3412 3413 3414 3415<a href="/blogs/resources/tagged/cat-merchandising" 3416 class="tg-blog-filter"> 3417 Merchandising 3418</a> 3419 3420 3421 3422 3423 3424 3425 3426 3427 3428 3429 3430 3431 3432 3433<a href="/blogs/resources/tagged/cat-search" 3434 class="tg-blog-filter"> 3435 Search 3436</a> 3437 3438 3439 3440 3441 3442 3443 3444 3445 3446 3447 3448 3449<a href="/blogs/resources/tagged/cat-recommendations" 3450 class="tg-blog-filter"> 3451 Recommendations 3452</a> 3453 3454 3455 3456 3457 3458 3459 3460 3461<a href="/blogs/resources/tagged/cat-industry" 3462 class="tg-blog-filter"> 3463 Industry 3464</a> 3465 3466 3467 3468 3469 3470 3471<a href="/blogs/resources/tagged/cat-guides" 3472 class="tg-blog-filter"> 3473 Guides 3474</a> 3475 3476 3477 3478 </div> 3479 </nav> 3480 3481 <div class="tg-blog-index__grid-wrap tg-section"> 3482 <div class="tg-wrap"> 3483 3484 <div class="tg-blog-index-grid"> 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 3515 3516 3517 3518 <a href="/blogs/resources/articles-reimagine-fashion-merchandising" class="tg-blog-index-card"> 3519 <div class="tg-blog-index-card__media"> 3520 3521 <img 3522 src="//www.tagalys.com/cdn/shop/articles/68e77129eafd54b490054c46_Blog.jpg?v=1782452872&width=760" 3523 alt="A new way to merchandise fashion - see it first" 3524 loading="eager" 3525 > 3526 3527</div> 3528 3529 <div class="tg-blog-index-card__body"> 3530 3531 <span class="tg-label">Industry</span> 3532 3533 3534 <h2 class="tg-blog-index-card__title tg-h4">A new way to merchandise fashion - see it first</h2> 3535 3536 <p class="tg-blog-index-card__excerpt tg-small"> 3537 3538 Fashion merchandising has always been emotional. Online, it too often turns mechanical, working SKU by SKU. Teams spend ho... 3539 3540 </p> 3541 3542 <div class="tg-blog-index-card__date"> 3543 Oct 9, 2025 3544 </div> 3545 </div> 3546 </a> 3547 3548 3549 3550 3551 3552 3553 3554 3555 3556 3557 3558 3559 3560 3561 3562 3563 3564 3565 3566 3567 3568 3569 3570 3571 3572 3573 3574 3575 3576 3577 3578 3579 3580 <a href="/blogs/resources/articles-ai-fashion-ecommerce-online-retailer" class="tg-blog-index-card"> 3581 <div class="tg-blog-index-card__media"> 3582 3583 <img 3584 src="//www.tagalys.com/cdn/shop/articles/688b0765d0289e3a4525e0c9_ai-fashion-ecomm-blog-online-retailer.jpg?v=1782452820&width=760" 3585 alt="State of AI in fashion eCommerce in 2025 | Search, Conversational Commerce, Analytics" 3586 loading="eager" 3587 > 3588 3589</div> 3590 3591 <div class="tg-blog-index-card__body"> 3592 3593 <span class="tg-label">Industry</span> 3594 3595 3596 <h2 class="tg-blog-index-card__title tg-h4">State of AI in fashion eCommerce in 2025 | Search, Conversational Commerce, Analytics</h2> 3597 3598 <p class="tg-blog-index-card__excerpt tg-small"> 3599 3600 AI is everywhere right now, on every roadmap, investor deck, podcast, and feature release. Product teams are shipping “AI-... 3601 3602 </p> 3603 3604 <div class="tg-blog-index-card__date"> 3605 Jul 31, 2025 3606 </div> 3607 </div> 3608 </a> 3609 3610 3611 3612 3613 3614 3615 3616 3617 3618 <a href="/blogs/resources/articles-strategize-merchandising-with-effective-scheduling" class="tg-blog-index-card"> 3619 <div class="tg-blog-index-card__media"> 3620 3621 <img 3622 src="//www.tagalys.com/cdn/shop/articles/64a4052b7f4530a898681b48_Merchandising-with-effective-scheduling.jpg?v=1782452878&width=760" 3623 alt="Strategize merchandising with effective scheduling" 3624 loading="eager" 3625 > 3626 3627</div> 3628 3629 <div class="tg-blog-index-card__body"> 3630
3631 <span class="tg-label">Merchandising</span> 3632 3633 3634 <h2 class="tg-blog-index-card__title tg-h4">Strategize merchandising with effective scheduling</h2> 3635 3636 <p class="tg-blog-index-card__excerpt tg-small"> 3637 3638 Imagine a bustling online retail environment, with the upcoming seasonal sales, or a midnight sale just around the corner.... 3639 3640 </p> 3641 3642 <div class="tg-blog-index-card__date"> 3643 Jul 4, 2023 3644 </div> 3645 </div> 3646 </a> 3647 3648 3649 3650 3651 3652 3653 3654 3655 3656 <a href="/blogs/resources/articles-7-essential-merchandising-tips-for-fashion-retailers" class="tg-blog-index-card"> 3657 <div class="tg-blog-index-card__media"> 3658 3659 <img 3660 src="//www.tagalys.com/cdn/shop/articles/648d4f38ff4554bc4a257485_Essential-merchandising-tips-for-fashion-retailers-Tagalys.jpg?v=1782452818&width=760" 3661 alt="7 Essential merchandising tips for fashion retailers" 3662 loading="eager" 3663 > 3664 3665</div> 3666 3667 <div class="tg-blog-index-card__body"> 3668 3669 <span class="tg-label">Merchandising</span> 3670 3671 3672 <h2 class="tg-blog-index-card__title tg-h4">7 Essential merchandising tips for fashion retailers</h2> 3673 3674 <p class="tg-blog-index-card__excerpt tg-small"> 3675 3676 IntroductionThe fashion industry is undeniably one of the most rapidly evolving industries in the world. The fashion indus... 3677 3678 </p> 3679 3680 <div class="tg-blog-index-card__date"> 3681 Jun 17, 2023 3682 </div> 3683 </div> 3684 </a> 3685 3686 3687 3688 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 <a href="/blogs/resources/articles-optimizing-the-checkout-page-dos-and-donts" class="tg-blog-index-card"> 3727 <div class="tg-blog-index-card__media"> 3728 3729 <img 3730 src="//www.tagalys.com/cdn/shop/articles/6482c647cdc02c5dfb9a25ec_Tips-for-optimizing-checkout-page-Tagalys.jpg?v=1787060501&width=760" 3731 alt="Optimizing the Checkout Page: Dos and Don'ts" 3732 loading="eager" 3733 > 3734 3735</div> 3736 3737 <div class="tg-blog-index-card__body"> 3738 3739 <span class="tg-label">Guides</span> 3740 3741 3742 <h2 class="tg-blog-index-card__title tg-h4">Optimizing the Checkout Page: Dos and Don'ts</h2> 3743 3744 <p class="tg-blog-index-card__excerpt tg-small"> 3745 3746 A checkout page is one of the most critical and final points of a transaction with the customer and can significantly impa... 3747 3748 </p> 3749 3750 <div class="tg-blog-index-card__date"> 3751 Jun 9, 2023 3752 </div> 3753 </div> 3754 </a> 3755 3756 3757 3758 3759 3760 3761 3762 3763 3764 3765 3766 3767 3768 3769 3770 3771 3772 3773 3774 3775 3776 3777 3778 3779 3780 3781 3782 3783 3784 3785 3786 3787 3788 3789 3790 3791 3792 3793 3794 3795 3796 <a href="/blogs/resources/articles-is-recommerce-future-of-a-sustainable-retail" class="tg-blog-index-card"> 3797 <div class="tg-blog-index-card__media"> 3798 3799 <img 3800 src="//www.tagalys.com/cdn/shop/articles/646f33cbc3e1c85bd041e15d_Recommerce-The_20future_20of_20sustainable_20retail.jpg?v=1787060427&width=760" 3801 alt="Is Recommerce the future of a sustainable retail?" 3802 loading="eager" 3803 > 3804 3805</div> 3806 3807 <div class="tg-blog-index-card__body"> 3808 3809 <span class="tg-label">Guides</span> 3810 3811 3812 <h2 class="tg-blog-index-card__title tg-h4">Is Recommerce the future of a sustainable retail?</h2> 3813 3814 <p class="tg-blog-index-card__excerpt tg-small"> 3815 3816 While the term "recommerce" may be a recent addition to our vocabulary, the idea of reusing or purchasing second-hand item... 3817 3818 </p> 3819 3820 <div class="tg-blog-index-card__date"> 3821 May 25, 2023 3822 </div> 3823 </div> 3824 </a> 3825 3826 3827 3828 3829 3830 3831 3832 3833 3834 <a href="/blogs/resources/articles-product-listing-pages-plps-an-overview" class="tg-blog-index-card"> 3835 <div class="tg-blog-index-card__media"> 3836 3837 <img 3838 src="//www.tagalys.com/cdn/shop/articles/6461cffc82c013a06b77456e_Product-listing-pages-An-Overview-Tagalys.jpg?v=1782452869&width=760" 3839 alt="Product Listing Pages (PLPs): An Overview" 3840 loading="lazy" 3841 > 3842 3843</div> 3844 3845 <div class="tg-blog-index-card__body"> 3846
3847 <span class="tg-label">Merchandising</span> 3848 3849 3850 <h2 class="tg-blog-index-card__title tg-h4">Product Listing Pages (PLPs): An Overview</h2> 3851 3852 <p class="tg-blog-index-card__excerpt tg-small"> 3853 3854 The Product Listing Page (or category landing page) in an eCommerce is the page that displays a list of products from a sp... 3855 3856 </p> 3857 3858 <div class="tg-blog-index-card__date"> 3859 May 15, 2023 3860 </div> 3861 </div> 3862 </a> 3863 3864 3865 3866 3867 3868 3869 3870 3871 3872 3873 3874 3875 3876 3877 3878 3879 3880 3881 3882 3883 3884 3885 3886 3887 3888 <a href="/blogs/resources/articles-product-recommendations-best-practices" class="tg-blog-index-card"> 3889 <div class="tg-blog-index-card__media"> 3890 3891 <img 3892 src="//www.tagalys.com/cdn/shop/articles/645cc1b484048417ae3f1273_Product-recommendations-best-practices.jpg?v=1782452870&width=760" 3893 alt="Product Recommendations: Best Practices" 3894 loading="lazy" 3895 > 3896 3897</div> 3898 3899 <div class="tg-blog-index-card__body"> 3900 3901 <span class="tg-label">Recommendations</span> 3902 3903 3904 <h2 class="tg-blog-index-card__title tg-h4">Product Recommendations: Best Practices</h2> 3905 3906 <p class="tg-blog-index-card__excerpt tg-small"> 3907 3908 Product recommendations in eCommerce serve a similar purpose as when a salesperson in-store suggests products based on a s... 3909 3910 </p> 3911 3912 <div class="tg-blog-index-card__date"> 3913 May 11, 2023 3914 </div> 3915 </div> 3916 </a> 3917 3918 3919 3920 3921 3922 3923 3924 3925 3926 3927 3928 3929 3930 3931 3932 3933 3934 <a href="/blogs/resources/articles-what-is-a-faceted-search-in-ecommerce" class="tg-blog-index-card"> 3935 <div class="tg-blog-index-card__media"> 3936 3937 <img 3938 src="//www.tagalys.com/cdn/shop/articles/6437dd20a0a3c316a9974206_What-is-faceted-search-ecommerce-Tagalys-1536x864.jpg?v=1787060260&width=760" 3939 alt="What is a faceted search in eCommerce?" 3940 loading="lazy" 3941 > 3942 3943</div> 3944 3945 <div class="tg-blog-index-card__body"> 3946 3947 <span class="tg-label">Search</span> 3948 3949 3950 <h2 class="tg-blog-index-card__title tg-h4">What is a faceted search in eCommerce?</h2> 3951 3952 <p class="tg-blog-index-card__excerpt tg-small"> 3953 3954 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 ... 3955 3956 </p> 3957 3958 <div class="tg-blog-index-card__date"> 3959 Apr 12, 2023 3960 </div> 3961 </div> 3962 </a> 3963 3964 3965 3966 3967 3968 3969 3970 3971 3972 3973 3974 3975 3976 3977 3978 3979 3980 3981 3982 3983 3984 3985 3986 3987 3988 <a href="/blogs/resources/articles-how-to-win-over-shoppers-this-easter-2023" class="tg-blog-index-card"> 3989 <div class="tg-blog-index-card__media"> 3990 3991 <img 3992 src="//www.tagalys.com/cdn/shop/articles/642753b36a10ec6b2d4aa941_Easter-Tagalys.jpg?v=1782452850&width=760" 3993 alt="How to win over shoppers this Easter 2023?" 3994 loading="lazy" 3995 > 3996 3997</div> 3998 3999 <div class="tg-blog-index-card__body"> 4000 4001 <span class="tg-label">Recommendations</span> 4002 4003 4004 <h2 class="tg-blog-index-card__title tg-h4">How to win over shoppers this Easter 2023?</h2> 4005 4006 <p class="tg-blog-index-card__excerpt tg-small"> 4007 4008 Easter weekend is the first significant holiday after Christmas when retailers get the golden window of opportunity to boo... 4009 4010 </p> 4011 4012 <div class="tg-blog-index-card__date"> 4013 Mar 14, 2023 4014 </div> 4015 </div> 4016 </a> 4017 4018 4019 4020 4021 4022 4023 4024 4025 4026 4027 4028 4029 4030 4031 4032 4033 4034 4035 4036 4037 4038 4039 4040 4041 4042 <a href="/blogs/resources/articles-7-ways-to-improve-product-discovery-in-ecommerce" class="tg-blog-index-card"> 4043 <div class="tg-blog-index-card__media"> 4044 4045 <img 4046 src="//www.tagalys.com/cdn/shop/articles/6436b8118b7e2495844fb71e_Artboard-17-copy-4_V2-1536x864_2c62ccdb-90df-4ed4-be8a-7d2a2d2b6fca.jpg?v=1787060164&width=760" 4047 alt="7 Ways to improve product discovery in eCommerce" 4048 loading="lazy" 4049 > 4050 4051</div> 4052 4053 <div class="tg-blog-index-card__body"> 4054
4055 <span class="tg-label">Recommendations</span> 4056 4057 4058 <h2 class="tg-blog-index-card__title tg-h4">7 Ways to improve product discovery in eCommerce</h2> 4059 4060 <p class="tg-blog-index-card__excerpt tg-small"> 4061 4062 What is Product Discovery in eCommerce? 4063Consumers have varied buying behaviors as some consumers are certain of what exact... 4064 4065 </p> 4066 4067 <div class="tg-blog-index-card__date"> 4068 Mar 6, 2023 4069 </div> 4070 </div> 4071 </a> 4072 4073 4074 4075 4076 4077 4078 4079 4080 4081 <a href="/blogs/resources/articles-10-simple-ways-to-understand-online-visual-merchandising" class="tg-blog-index-card"> 4082 <div class="tg-blog-index-card__media"> 4083 4084 <img 4085 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" 4086 alt="10 Simple ways to understand Online Visual Merchandising" 4087 loading="lazy" 4088 > 4089 4090</div> 4091 4092 <div class="tg-blog-index-card__body"> 4093 4094 <span class="tg-label">Merchandising</span> 4095 4096 4097 <h2 class="tg-blog-index-card__title tg-h4">10 Simple ways to understand Online Visual Merchandising</h2> 4098 4099 <p class="tg-blog-index-card__excerpt tg-small"> 4100 4101 Shopping has always been a visual experience, whether mannequins sporting perfectly chosen outfits or new products exhibit... 4102 4103 </p> 4104 4105 <div class="tg-blog-index-card__date"> 4106 Feb 21, 2023 4107 </div> 4108 </div> 4109 </a> 4110 4111 </div> 4112 4113 4114 <div class="tg-blog-pagination"> 4115 4116 4117 4118 4119 <span class="is-current">1</span> 4120 4121 4122 4123 <a href="/blogs/resources?page=2">2</a> 4124 4125 4126 4127 <a href="/blogs/resources?page=3">3</a> 4128 4129 4130 4131 <span>…</span> 4132 4133 4134 4135 <a href="/blogs/resources?page=6">6</a> 4136 4137 4138 4139 4140 <a href="/blogs/resources?page=2">Next</a> 4141 4142 </div> 4143 4144 4145 </div> 4146 </div> 4147 4148</section> 4149 4150 4151
4152<script> 4153(function () { 4154 var wrap = null; 4155 var pills = null; 4156 var updating = false; 4157 4158 function init() { 4159 wrap = document.querySelector('.tg-blog-index__grid-wrap'); 4160 pills = document.querySelectorAll('.tg-blog-filter'); 4161 4162 if (!wrap || !pills.length) return; 4163 4164 pills.forEach(function (pill) { 4165 pill.addEventListener('click', function (event) { 4166 event.preventDefault(); 4167 if (updating) return; 4168 fetchFilter(pill.getAttribute('href'), pill); 4169 }); 4170 }); 4171 4172 document.addEventListener('click', function (event) { 4173 var pag = event.target.closest('.tg-blog-pagination a'); 4174 if (!pag) return; 4175 4176 event.preventDefault(); 4177 if (updating) return; 4178 fetchFilter(pag.getAttribute('href'), null); 4179 }); 4180 } 4181 4182 function fetchFilter(url, activePill) { 4183 updating = true; 4184 wrap.classList.add('is-loading'); 4185 4186 if (activePill) { 4187 pills.forEach(function (pill) { pill.classList.remove('is-active'); }); 4188 activePill.classList.add('is-active'); 4189 } 4190 4191 history.pushState({ tgBlogUrl: url }, '', url); 4192 4193 fetch(url, { headers: { 'X-Requested-With': 'XMLHttpRequest' } }) 4194 .then(function (response) { return response.text(); }) 4195 .then(function (html) { 4196 var doc = new DOMParser().parseFromString(html, 'text/html'); 4197 var newWrap = doc.querySelector('.tg-blog-index__grid-wrap'); 4198 var newPills = doc.querySelectorAll('.tg-blog-filter'); 4199 4200 if (newWrap) wrap.innerHTML = newWrap.innerHTML; 4201 4202 if (newPills.length && pills.length) { 4203 newPills.forEach(function (newPill, index) { 4204 if (pills[index]) { 4205 pills[index].classList.toggle('is-active', newPill.classList.contains('is-active')); 4206 } 4207 }); 4208 } 4209 4210 wrap.classList.remove('is-loading'); 4211 updating = false; 4212 }) 4213 .catch(function () { 4214 window.location.href = url; 4215 }); 4216 } 4217 4218 window.addEventListener('popstate', function () { 4219 window.location.reload(); 4220 }); 4221 4222 if (document.readyState === 'loading') { 4223 document.addEventListener('DOMContentLoaded', init); 4224 } else { 4225 init(); 4226 } 4227})(); 4228</script>
4228 4229 4230<style> 4231.tg-blog-index, 4232.tg-blog-index * { 4233 box-sizing: border-box; 4234} 4235 4236.tg-blog-index-hero { 4237 position: relative; 4238 overflow: hidden; 4239 padding-top: var(--tg-section-large); 4240 padding-bottom: var(--tg-section-large); 4241 text-align: center; 4242 background: var(--tg-black); 4243 color: var(--tg-white); 4244 border-bottom: 1px solid rgba(255,255,255,.08); 4245} 4246 4247.tg-blog-index-hero:before { 4248 content: ""; 4249 position: absolute; 4250 inset: 0; 4251 background: 4252 linear-gradient(rgba(255,255,255,.055) 1px, transparent 1px), 4253 linear-gradient(90deg, rgba(255,255,255,.055) 1px, transparent 1px); 4254 background-size: 42px 42px; 4255 -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%); 4256 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%); 4257 pointer-events: none; 4258} 4259 4260.tg-blog-index-hero:after { 4261 content: ""; 4262 position: absolute; 4263 left: 50%; 4264 top: 50%; 4265 width: 780px; 4266 height: 380px; 4267 transform: translate(-50%, -50%); 4268 background: radial-gradient(ellipse, rgba(159,115,255,.08), rgba(231,111,196,.045) 42%, transparent 72%); 4269 pointer-events: none; 4270} 4271 4272.tg-blog-index-hero__inner { 4273 position: relative; 4274 z-index: 2; 4275} 4276 4277.tg-blog-index-hero .tg-label { 4278 margin-bottom: var(--tg-label-heading-gap); 4279} 4280 4281.tg-blog-index-hero__title { 4282 margin: 0 auto; 4283 color: var(--tg-white); 4284} 4285 4286.tg-blog-index-hero__copy { 4287 max-width: 520px; 4288 margin: var(--tg-heading-copy-gap) auto 0; 4289 color: rgba(255,255,255,.68); 4290} 4291 4292.tg-blog-filters { 4293 position: sticky; 4294 top: 0; 4295 z-index: 20; 4296 padding-left: var(--tg-page-pad); 4297 padding-right: var(--tg-page-pad); 4298 background: rgba(255,255,255,.95); 4299 border-bottom: 1px solid var(--tg-border); 4300 backdrop-filter: blur(8px); 4301 -webkit-backdrop-filter: blur(8px); 4302} 4303 4304.tg-blog-filters__inner { 4305 display: flex; 4306 align-items: center; 4307 justify-content: center; 4308 gap: 8px; 4309 overflow-x: auto; 4310 padding-top: 16px; 4311 padding-bottom: 16px; 4312 scrollbar-width: none; 4313 -webkit-overflow-scrolling: touch; 4314} 4315 4316.tg-blog-filters__inner::-webkit-scrollbar {
4317 display: none; 4318} 4319 4320.tg-blog-filter { 4321 display: inline-flex; 4322 align-items: center; 4323 flex-shrink: 0; 4324 padding: 7px 14px; 4325 border: 1px solid var(--tg-border); 4326 border-radius: 6px; 4327 background: var(--tg-white); 4328 font-family: var(--tg-font-body); 4329 font-size: .75rem; 4330 font-weight: 600; 4331 line-height: 1; 4332 color: var(--tg-disabled); 4333 text-decoration: none; 4334 white-space: nowrap; 4335 transition: border-color .16s ease, color .16s ease; 4336} 4337 4338.tg-blog-filter:hover { 4339 border-color: var(--tg-black); 4340 color: var(--tg-black); 4341} 4342 4343.tg-blog-filter.is-active { 4344 border-color: transparent; 4345 background: 4346 linear-gradient(var(--tg-white), var(--tg-white)) padding-box, 4347 var(--tg-grad-ui) border-box; 4348 color: var(--tg-ink); 4349 font-weight: 700; 4350} 4351 4352.tg-blog-filter-note { 4353 flex-shrink: 0; 4354 padding-left: 8px; 4355 font-family: var(--tg-font-body); 4356 font-size: .75rem; 4357 color: var(--tg-disabled); 4358 white-space: nowrap; 4359} 4360 4361.tg-blog-filter-note a { 4362 color: var(--tg-ink); 4363 text-decoration: underline; 4364 text-underline-offset: 3px; 4365} 4366 4367.tg-blog-index__grid-wrap { 4368 padding-top: var(--tg-section-standard); 4369 padding-bottom: var(--tg-section-large); 4370 transition: opacity .2s ease; 4371} 4372 4373.tg-blog-index__grid-wrap.is-loading { 4374 opacity: .45; 4375 pointer-events: none; 4376} 4377 4378.tg-blog-index-grid { 4379 display: grid; 4380 grid-template-columns: repeat(3, minmax(0, 1fr)); 4381 column-gap: 28px; 4382 row-gap: 44px; 4383} 4384 4385.tg-blog-index-card { 4386 display: block; 4387 min-width: 0; 4388 color: inherit; 4389 text-decoration: none; 4390} 4391 4392.tg-blog-index-card__media { 4393 width: 100%; 4394 aspect-ratio: 16 / 9; 4395 overflow: hidden; 4396 border: 1px solid var(--tg-border); 4397 border-radius: 12px; 4398 background: var(--tg-surface); 4399} 4400 4401.tg-blog-index-card__media img { 4402 width: 100%; 4403 height: 100%; 4404 display: block; 4405 object-fit: cover; 4406 object-position: center center; 4407 transition: transform .5s ease; 4408} 4409 4410.tg-blog-index-card:hover .tg-blog-index-card__media img { 4411 transform: scale(1.04); 4412} 4413 4414.tg-blog-index-card__placeholder { 4415 width: 100%; 4416 height: 100%; 4417 background: var(--tg-grad-surface); 4418} 4419 4420.tg-blog-index-card__body { 4421 padding-top: 16px; 4422} 4423 4424.tg-blog-index-card__body .tg-label { 4425 margin-bottom: 12px; 4426} 4427 4428.tg-blog-index-card__title { 4429 margin: 0; 4430 color: var(--tg-black); 4431 display: -webkit-box; 4432 -webkit-line-clamp: 2; 4433 -webkit-box-orient: vertical; 4434 overflow: hidden; 4435} 4436 4437.tg-blog-index-card__excerpt { 4438 margin: 9px 0 0; 4439 color: var(--tg-charcoal); 4440 display: -webkit-box; 4441 -webkit-line-clamp: 2; 4442 -webkit-box-orient: vertical; 4443 overflow: hidden; 4444} 4445 4446.tg-blog-index-card__date { 4447 margin-top: 10px; 4448 font-family: var(--tg-font-body); 4449 font-size: .75rem; 4450 line-height: 1.4; 4451 color: var(--tg-disabled); 4452} 4453 4454.tg-blog-pagination { 4455 display: flex; 4456 align-items: center; 4457 justify-content: center; 4458 gap: 8px; 4459 margin-top: 56px; 4460} 4461 4462.tg-blog-pagination a, 4463.tg-blog-pagination span { 4464 display: inline-flex; 4465 align-items: center; 4466 justify-content: center; 4467 min-width: 36px; 4468 height: 36px; 4469 padding: 0 10px; 4470 border: 1px solid var(--tg-border); 4471 border-radius: 8px; 4472 background: var(--tg-white); 4473 font-family: var(--tg-font-body); 4474 font-size: .8125rem; 4475 font-weight: 500; 4476 color: var(--tg-disabled); 4477 text-decoration: none; 4478} 4479 4480.tg-blog-pagination a:hover { 4481 border-color: var(--tg-black); 4482 color: var(--tg-black); 4483} 4484 4485.tg-blog-pagination .is-current { 4486 border-color: transparent; 4487 background: 4488 linear-gradient(var(--tg-white), var(--tg-white)) padding-box, 4489 var(--tg-grad-ui) border-box; 4490 color: var(--tg-ink); 4491 font-weight: 700; 4492} 4493 4494.tg-blog-empty { 4495 max-width: 520px; 4496 margin: 0 auto; 4497 padding: 72px 0; 4498 text-align: center; 4499} 4500 4501.tg-blog-empty .tg-copy { 4502 margin: var(--tg-heading-copy-gap) auto 24px; 4503} 4504 4505@media (max-width: 1024px) { 4506 .tg-blog-index-grid { 4507 grid-template-columns: repeat(2, minmax(0, 1fr)); 4508 column-gap: 20px; 4509 row-gap: 36px; 4510 } 4511} 4512 4513@media (max-width: 680px) { 4514 .tg-blog-index-hero { 4515 padding-top: 52px; 4516 padding-bottom: 52px; 4517 } 4518 4519 .tg-blog-filters { 4520 padding-left: 0; 4521 padding-right: 0; 4522 } 4523 4524 .tg-blog-filters__inner { 4525 justify-content: flex-start; 4526 padding-left: var(--tg-page-pad); 4527 padding-right: var(--tg-page-pad); 4528 } 4529 4530 .tg-blog-index-grid { 4531 grid-template-columns: 1fr; 4532 row-gap: 36px; 4533 } 4534 4535 .tg-blog-index-card__body { 4536 padding-top: 14px; 4537 } 4538 4539 .tg-blog-index-card__excerpt { 4540 -webkit-line-clamp: 3; 4541 } 4542 4543 .tg-blog-pagination { 4544 margin-top: 44px; 4545 flex-wrap: wrap; 4546 } 4547} 4548 4549@media (prefers-reduced-motion: reduce) { 4550 .tg-blog-index-card__media img { 4551 transition: none; 4552 } 4553 4554 .tg-blog-index-card:hover .tg-blog-index-card__media img { 4555 transform: none; 4556 } 4557} 4558</style> 4559 4560</section> 4561 </main> 4562 4563 <footer> 4564 <!-- BEGIN sections: footer-group --> 4565<section id="shopify-section-sections--19314630197346__tagalys_footer_zh97xk" class="shopify-section shopify-section-group-footer-group tagalys-footer"> 4566 4567<style> 4568@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap'); 4569.tgf *{box-sizing:border-box;margin:0;padding:0;} 4570.tgf{font-family:'Inter',-apple-system,sans-serif;background:#0d0d0d;color:#fff;border-top:1px solid #333;} 4571.tgf-outer{padding-inline:var(--tg-page-pad);} 4572.tgf-band-top{height:2rem;border-left:1px solid #333;border-right:1px solid #333;} 4573.tgf-band-bottom{height:2rem;border-left:1px solid #333;border-right:1px solid #333;border-bottom:1px solid #333;} 4574.tgf-top{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;border:1px solid #333;} 4575.tgf-logo{display:inline-flex;align-items:center;text-decoration:none;flex-shrink:0;} 4576.tgf-logo img{height:40px;width:auto;display:block;} 4577.tgf-logo-text{font-family:'Saans','DM Sans',sans-serif;font-size:22px;font-weight:700;color:#fff;letter-spacing:-.03em;}
4578.tgf-body{display:flex;align-items:stretch;} 4579.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;} 4580.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;} 4581.tgf-social-link:hover{border-color:#555;color:#fff;} 4582.tgf-social-link svg{width:16px;height:16px;display:block;} 4583.tgf-social-link img{width:18px;height:18px;object-fit:contain;filter:brightness(0) invert(1);opacity:.55;transition:opacity .15s;} 4584.tgf-social-link:hover img{opacity:1;} 4585.tgf-right{flex:1;display:flex;flex-direction:column;border-right:1px solid #333;border-bottom:1px solid #333;} 4586.tgf-links-wrap{display:flex;width:100%;padding:2.5rem 4rem 2.5rem 2.5rem;justify-content:space-between;gap:2rem;flex:1;} 4587.tgf-col{flex:1;min-width:0;} 4588.tgf-col-label{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:1.5rem;display:block;} 4589.tgf-col-links{display:flex;flex-direction:column;gap:14px;} 4590.tgf-link{font-size:15px;font-weight:400;color:rgba(255,255,255,.45);text-decoration:none;transition:color .15s;line-height:1.4;} 4591.tgf-link:hover{color:#fff;} 4592.tgf-trusted-label{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:1.5rem;display:block;} 4593.tgf-badges{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-start;margin-bottom:16px;} 4594.tgf-badge img{height:68px;width:auto;display:block;} 4595.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;} 4596.tgf-g2-pill:hover{opacity:.85;} 4597.tgf-g2-icon-img{height:18px;width:auto;display:block;filter:brightness(0) invert(1);} 4598.tgf-g2-icon-fallback{font-size:14px;font-weight:800;color:#fff;font-style:italic;} 4599.tgf-g2-text{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;} 4600.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;} 4601.tgf-copy{font-size:13px;color:rgba(255,255,255,.3);} 4602.tgf-legal{display:flex;gap:1.5rem;flex-wrap:wrap;} 4603.tgf-legal-link{font-size:13px;color:rgba(255,255,255,.3);text-decoration:none;transition:color .15s;} 4604.tgf-legal-link:hover{color:rgba(255,255,255,.65);} 4605 4606.tgf-top .tg-btn{ 4607 padding:4px 4px 4px 16px; 4608 gap:10px; 4609 border-radius:10px; 4610 font-size:14px; 4611} 4612 4613.tgf-top .tg-btn__arrow{ 4614 width:30px; 4615 height:30px; 4616 border-radius:6px; 4617} 4618 4619@media(max-width:991px){ 4620 .tgf-links-wrap{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:auto auto;gap:2rem;padding-right:0;} 4621} 4622 4623@media(max-width:767px){ 4624 .tgf-outer{padding-left:0;padding-right:0;} 4625 .tgf-band-top{height:1.5rem;} 4626 .tgf-band-bottom{height:1.5rem;} 4627 .tgf-top{padding:1.25rem 1.5rem;} 4628 .tgf-body{flex-direction:column;} 4629 .tgf-right{order:-1;border-left:1px solid #333;} 4630 .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;} 4631 .tgf-links-wrap{grid-template-columns:1fr 1fr;padding:2rem 1.5rem;gap:2rem;} 4632 .tgf-legal-wrap{flex-direction:column;text-align:center;padding:1.5rem 1rem;gap:1rem;} 4633 .tgf-legal{justify-content:center;} 4634 .tgf-g2-pill{padding:8px 12px;} 4635 .tgf-g2-text{font-size:12px;} 4636 .tgf-badge img{height:56px;} 4637} 4638 4639@media(max-width:479px){ 4640 .tgf-links-wrap{grid-template-columns:1fr 1fr;} 4641 .tgf-col-label,.tgf-trusted-label{font-size:12px;} 4642 .tgf-link{font-size:14px;} 4643} 4644</style> 4645 4646<footer class="tgf" role="contentinfo"> 4647 <div class="tgf-outer"> 4648 <div class="tgf-band-top"></div> 4649 4650 <div class="tgf-top"> 4651 <a href="/" class="tgf-logo" aria-label="Tagalys Website"> 4652 4653 <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"> 4654 4655 </a> 4656 4657 <a href="/pages/schedule-demo" class="tg-btn tg-btn--white">
4658 <span>Book a Demo</span> 4659 <span class="tg-btn__arrow" aria-hidden="true"> 4660 <svg viewBox="0 0 24 24" fill="none"> 4661 <path d="M5 12H19" stroke="currentColor" stroke-width="2" stroke-linecap="round"/> 4662 <path d="M12 5L19 12L12 19" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/> 4663 </svg> 4664 </span> 4665 </a> 4666 </div> 4667 4668 <div class="tgf-body"> 4669 <div class="tgf-socials"> 4670 4671 <a href="https://www.linkedin.com/company/tagalys" target="_blank" rel="noopener" class="tgf-social-link" aria-label="LinkedIn"> 4672 4673 <img src="//www.tagalys.com/cdn/shop/files/LinkedIn_logo.png?v=1782142072&width=60" alt="LinkedIn"> 4674 4675 </a> 4676 4677 4678 4679 <a href="https://www.instagram.com/tagalys" target="_blank" rel="noopener" class="tgf-social-link" aria-label="Instagram"> 4680 4681 <img src="//www.tagalys.com/cdn/shop/files/Instagram-Icon.png?v=1782142238&width=60" alt="Instagram"> 4682 4683 </a> 4684 4685 4686 4687 <a href="mailto:[email protected]" class="tgf-social-link" aria-label="Email"> 4688 4689 <img src="//www.tagalys.com/cdn/shop/files/Email_Icon_New.png?v=1782142193&width=60" alt="Email"> 4690 4691 </a> 4692 4693 </div> 4694 4695 <div class="tgf-right"> 4696 <div class="tgf-links-wrap"> 4697 4698 4699 <div class="tgf-col" > 4700 4701 <span class="tgf-col-label">SOLUTION</span> 4702 4703 4704 4705 <div class="tgf-col-links"> 4706 4707 4708 4709 4710 4711 4712 4713 4714 4715 4716 <a href="/collections/collection-merchandising" class="tgf-link">Collection Merchandising</a> 4717 4718 4719 4720 4721 4722 4723 4724 4725 4726 4727 <a href="/collections/site-search" class="tgf-link">Site Search</a> 4728 4729 4730 4731 4732 4733 4734 4735 4736 4737 4738 <a href="/collections/product-recommendations" class="tgf-link">Recommendations</a> 4739 4740 4741 4742 4743 4744 4745 4746 4747 4748 4749 <a href="/pages/pricing" class="tgf-link">Pricing</a> 4750 4751 4752 </div> 4753 4754 </div> 4755 4756 4757 4758 <div class="tgf-col" > 4759 4760 <span class="tgf-col-label">FEATURES</span> 4761 4762 4763 4764 <div class="tgf-col-links"> 4765 4766 4767 4768 4769 4770 4771 4772 4773 4774 4775 <a href="/products/markets" class="tgf-link">Merchandise by Markets</a> 4776 4777 4778 4779 4780 4781 4782 4783 4784 4785 4786 <a href="/products/looks" class="tgf-link">Looks</a> 4787 4788 4789 4790 4791 4792 4793 4794 4795 4796 4797 <a href="/products/server-side" class="tgf-link">Server-side Collections</a> 4798 4799 4800 </div> 4801 4802 </div> 4803 4804 4805 4806 <div class="tgf-col" > 4807 4808 <span class="tgf-col-label">RESOURCES</span> 4809 4810 4811 4812 <div class="tgf-col-links"> 4813 4814 4815 4816 4817 4818 4819 4820 4821 4822 4823 <a href="/blogs/resources/" class="tgf-link">Blogs</a> 4824 4825 4826 4827 4828 4829 4830 4831 4832 4833 4834 <a href="https://support.tagalys.com/" class="tgf-link" target="_blank" rel="noopener">Help Docs</a> 4835 4836 4837 4838 4839 4840 4841 4842 4843 4844 4845 <a href="/pages/contact" class="tgf-link">Contact Us</a> 4846 4847 4848 </div> 4849 4850 </div> 4851 4852 4853 4854 4855 4856 4857 4858 <div class="tgf-col"> 4859 <span class="tgf-trusted-label">Loved & Trusted</span> 4860 4861 4862 <div class="tgf-badges"> 4863 <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> 4864 <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> 4865 <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> 4866 </div> 4867 4868 4869 4870 <a href="https://www.g2.com/products/tagalys/reviews" target="_blank" rel="noopener" class="tgf-g2-pill"> 4871 4872 <img class="tgf-g2-icon-img" src="//www.tagalys.com/cdn/shop/files/G2_Logo.png?v=1782142173&width=60" alt="G2"> 4873
4874 <span class="tgf-g2-text">4.8/5 | 128 reviews</span> 4875 </a> 4876 4877 </div> 4878 4879 </div> 4880 4881 <div class="tgf-legal-wrap"> 4882 <span class="tgf-copy">©2026 Tagalys Inc. All rights reserved.</span> 4883 <div class="tgf-legal"> 4884 <a href="/pages/terms-of-service" class="tgf-legal-link">Terms of Service</a> 4885 <a href="/pages/privacy-policy" class="tgf-legal-link">Privacy Policy</a> 4886 <a href="/pages/refund-policy" class="tgf-legal-link">Refund Policy</a> 4887 <a href="/pages/gdpr" class="tgf-legal-link">GDPR</a> 4888 </div> 4889 </div> 4890 </div> 4891 </div> 4892 4893 <div class="tgf-band-bottom"></div> 4894 </div> 4895</footer> 4896 4897</section> 4898<!-- END sections: footer-group --> 4899 </footer> 4900 </div> 4901 4902 4903 4904 <div 4905 id="shopify-section-cart-drawer-section" 4906 class="shopify-section" 4907 > 4908 4909 4910
4910<script 4911 type="module" 4912 src="//www.tagalys.com/cdn/shop/t/7/assets/cart-drawer.js?v=101430053943909765251786539027" 4913 fetchpriority="low" 4914 ></script>
4914 4915 4916 4917 4918 <theme-drawer 4919 id="cart-drawer" 4920 data-skip-node-update 4921 > 4922 <dialog 4923 ref="panel" 4924 class="theme-drawer__dialog color-custom-drawer" 4925 aria-labelledby="cart-drawer-heading" 4926 cart-summary-sticky="true" 4927 > 4928 <cart-drawer-component 4929 4930 > 4931 <template id="empty-cart-template"> 4932 4933 <div 4934 class="cart-drawer__content" 4935 aria-label="Cart" 4936 > 4937 <h2 4938 class="theme-drawer__title h4" 4939 id="cart-drawer-heading" 4940 > 4941 Your cart is empty 4942 </h2> 4943 4944 <div class="cart-drawer__items"> 4945 4946 4947
4948<script 4949 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-items.js?v=14476580701730542761786539027" 4950 type="module" 4951 fetchpriority="low" 4952></script>
vendor: 1 bytes, line 4952
4952
4953<script 4954 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-quantity-selector.js?v=168493463479860323171786539027" 4955 type="module" 4956 fetchpriority="low" 4957></script>
vendor: 1 bytes, line 4957
4957
4958<script 4959 src="//www.tagalys.com/cdn/shop/t/7/assets/volume-pricing-info.js?v=94479640769665442661786539027" 4960 type="module" 4961 fetchpriority="low" 4962></script>
4962 4963 4964<div 4965 4966 class="cart-items__wrapper cart-items__wrapper--drawer-empty" 4967 4968 data-cart-drawer-empty 4969 4970 style="" 4971> 4972 4973<p> 4974 Have an account? <a href="https://www.tagalys.com/customer_authentication/redirect?locale=en®ion_country=IN">Log in</a> to check out faster. 4975 </p><a 4976 class="button cart-items__empty-button" 4977 href="/collections/all" 4978 > 4979 <span class="button-text"> 4980 Continue shopping 4981 </span> 4982 </a></div> 4983 4984 4985 4986 </div> 4987 </div> 4988 4989 </template> 4990 4991 <div 4992 class="cart-drawer__inner cart-drawer--empty" 4993 data-hydration-key="cart-drawer-inner" 4994 ><div class="theme-drawer__header"> 4995 <button 4996 on:click="#cart-drawer/close" 4997 class="theme-drawer__close-button cart-drawer__close-button--empty" 4998 type="button" 4999 aria-label="Close" 5000 > 5001 <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"> 5002<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"/> 5003</svg> 5004</span> 5005 </button> 5006 </div> 5007 5008 5009<cart-items-component 5010 class="cart-items-component" 5011 5012 data-drawer 5013 view-event-trigger="dialog" 5014 5015 data-section-id="cart-drawer-section" 5016 5017 view-event-payload="{"context":null,"cart":null}" 5018 5019> 5020 5021 5022 <div 5023 class="cart-drawer__content" 5024 aria-label="Cart" 5025 > 5026 <h2 5027 class="theme-drawer__title h4" 5028 id="cart-drawer-heading" 5029 > 5030 Your cart is empty 5031 </h2> 5032 5033 <div class="cart-drawer__items"> 5034 5035 5036
5037<script 5038 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-items.js?v=14476580701730542761786539027" 5039 type="module" 5040 fetchpriority="low" 5041></script>
vendor: 1 bytes, line 5041
5041
5042<script 5043 src="//www.tagalys.com/cdn/shop/t/7/assets/component-cart-quantity-selector.js?v=168493463479860323171786539027" 5044 type="module" 5045 fetchpriority="low" 5046></script>
vendor: 1 bytes, line 5046
5046
5047<script 5048 src="//www.tagalys.com/cdn/shop/t/7/assets/volume-pricing-info.js?v=94479640769665442661786539027" 5049 type="module" 5050 fetchpriority="low" 5051></script>
5051 5052 5053<div 5054 5055 class="cart-items__wrapper cart-items__wrapper--drawer-empty" 5056 5057 data-cart-drawer-empty 5058 5059 style="" 5060> 5061 5062<p> 5063 Have an account? <a href="https://www.tagalys.com/customer_authentication/redirect?locale=en®ion_country=IN">Log in</a> to check out faster. 5064 </p><a 5065 class="button cart-items__empty-button" 5066 href="/collections/all" 5067 > 5068 <span class="button-text"> 5069 Continue shopping 5070 </span> 5071 </a></div> 5072 5073 5074 5075 </div> 5076 </div> 5077 5078 5079</cart-items-component> 5080 5081 5082 5083 </div> 5084 </cart-drawer-component> 5085 </dialog> 5086 </theme-drawer> 5087 5088 5089 </div> 5090 5091 5092 5093 5094 5095 5096 5097 5098 5099
5100<script 5101 type="module" 5102 src="//www.tagalys.com/cdn/shop/t/7/assets/theme-drawer.js?v=19271060799489679091786539027" 5103 fetchpriority="low" 5104></script>
5104 5105
5106<script> 5107 /* Runs synchronously during HTML parsing — opens the correct drawer on first 5108 paint if navigation state was saved, so it renders with the rest of the page. */ 5109 (function () { 5110 var drawerIds = (sessionStorage.getItem('theme-drawer-open') || '').split(',').filter(Boolean); 5111 if (!drawerIds.length) return; 5112 5113 // Only restore on wide viewports (squeeze mode). On narrow viewports the 5114 // drawer is a modal overlay — let it start closed after navigation rather 5115 // than re-opening a fullscreen dialog the user may have left behind. 5116 if (!window.matchMedia('(min-width: 990px)').matches) return; 5117 5118 var dialogs = []; 5119 for (var i = 0; i < drawerIds.length; i++) { 5120 var drawer = document.getElementById(drawerIds[i]); 5121 if (!drawer) continue; 5122 5123 drawer.setAttribute('open', ''); 5124 5125 // Set [open] directly so the CSS slide-in applies without triggering 5126 // the browser's dialog focusing steps — on wide viewports the drawer is 5127 // a sidebar, not a modal, so focus should stay where it is. 5128 // The instant class suppresses the slide-in transition for the initial restore. 5129 // Set --drawer-stack-order so z-index layering matches the original order. 5130 drawer.style.setProperty('--drawer-stack-order', String(i + 1)); 5131 5132 var dialog = drawer.querySelector('dialog'); 5133 if (dialog) { 5134 dialog.setAttribute('open', ''); 5135 dialog.classList.add('theme-drawer__dialog-instant'); 5136 dialogs.push(dialog); 5137 } 5138 5139 // Let each drawer type handle its own restore (e.g. shopify-chat mode). 5140 // Synchronous dispatch — listeners attached during earlier parsing run immediately. 5141 drawer.dispatchEvent(new CustomEvent('theme-drawer:restoring')); 5142 } 5143 5144 // Apply squeeze immediately, bypassing the margin transition. 5145 // Only squeeze if at least one drawer was actually restored — saved 5146 // drawer IDs may not exist on every page (e.g. cart-drawer on /cart). 5147 var pageWrapper = document.querySelector('.page-wrapper'); 5148 if (pageWrapper && dialogs.length > 0) { 5149 pageWrapper.style.transition = 'none'; 5150 pageWrapper.classList.add('page-wrapper--drawer-open'); 5151 } 5152 5153 // Re-enable transitions after one paint so the instant state is rendered first. 5154 requestAnimationFrame(function () { 5155 requestAnimationFrame(function () { 5156 if (pageWrapper) pageWrapper.style.transition = ''; 5157 for (var j = 0; j < dialogs.length; j++) { 5158 dialogs[j].classList.remove('theme-drawer__dialog-instant'); 5159 } 5160 }); 5161 }); 5162 })(); 5163</script>
5163 5164
5165<script 5166 type="module" 5167> 5168 const pageWrapper = document.querySelector('.page-wrapper'); 5169 const squeezeQuery = window.matchMedia('(min-width: 990px)'); 5170 5171 // ── Squeeze coordination ── 5172 // Listens to all drawers. Only squeezes on wide viewports. 5173 document.addEventListener('theme-drawer:open', () => { 5174 if (squeezeQuery.matches) { 5175 pageWrapper?.classList.add('page-wrapper--drawer-open'); 5176 } 5177 }); 5178 5179 document.addEventListener('theme-drawer:close', () => { 5180 const openDrawer = document.querySelector('theme-drawer[open]'); 5181 if (!openDrawer) { 5182 pageWrapper?.classList.remove('page-wrapper--drawer-open'); 5183 } 5184 }); 5185 5186 squeezeQuery.addEventListener('change', () => { 5187 const openDrawer = document.querySelector('theme-drawer[open]'); 5188 pageWrapper?.classList.toggle('page-wrapper--drawer-open', Boolean(openDrawer) && squeezeQuery.matches); 5189 }); 5190 5191 // ── State persistence ── 5192 // Store open drawer IDs sorted by their visual stack order so 5193 // the restore script can recreate the same z-index layering. 5194 function persistDrawerState() { 5195 const openDrawers = Array.from(document.querySelectorAll('theme-drawer[open]:not([no-persist])')); 5196 if (!openDrawers.length) { 5197 sessionStorage.removeItem('theme-drawer-open'); 5198 return; 5199 } 5200 5201 openDrawers.sort((a, b) => { 5202 const orderA = Number(a.style.getPropertyValue('--drawer-stack-order') || 0); 5203 const orderB = Number(b.style.getPropertyValue('--drawer-stack-order') || 0); 5204 return orderA - orderB; 5205 }); 5206 5207 sessionStorage.setItem('theme-drawer-open', openDrawers.map((d) => d.id).join(',')); 5208 } 5209 5210 document.addEventListener('theme-drawer:open', persistDrawerState); 5211 document.addEventListener('theme-drawer:close', persistDrawerState); 5212</script>
5212 5213 5214 5215 5216 5217 5218 5219 5220 5221
5222<script 5223 src="//www.tagalys.com/cdn/shop/t/7/assets/dialog.js?v=50435175020407122251786539027" 5224 type="module" 5225></script>
5225 5226
5227<script 5228 src="//www.tagalys.com/cdn/shop/t/7/assets/predictive-search.js?v=162722252387887966571786539027" 5229 type="module" 5230 fetchpriority="low" 5231></script>
5231 5232 5233<dialog-component 5234 id="search-modal" 5235 class="search-modal" 5236 5237> 5238 <dialog 5239 ref="dialog" 5240 on:click="/closeDialogOnClickOutside" 5241 on:keydown="/closeDialogOnEscapePress" 5242 class="search-modal__content dialog-modal" 5243 scroll-lock 5244 aria-labelledby="search-modal-heading" 5245 > 5246 <h2 5247 id="search-modal-heading" 5248 class="visually-hidden" 5249 > 5250 Search 5251 </h2> 5252 <predictive-search-component 5253 class="predictive-search color-custom-popover" 5254 style="--product-corner-radius: 0px; --card-corner-radius: 4px;" 5255 data-section-id="predictive-search" 5256 data-testid="search-component--modal" 5257 role="search" 5258 aria-label="Search" 5259 > 5260 <form 5261 action="/search" 5262 method="get" 5263 role="search" 5264 class="predictive-search-form" 5265 ref="form" 5266 on:keydown="/onSearchKeyDown" 5267 > 5268 <div 5269 class="predictive-search-form__header" 5270 > 5271 <div class="predictive-search-form__header-inner"> 5272 <label 5273 for="cmdk-input" 5274 class="visually-hidden" 5275 >Search</label> 5276 <input 5277 class="search-input" 5278 id="cmdk-input" 5279 type="search" 5280 name="q" 5281 role="combobox" 5282 aria-expanded="false" 5283 aria-owns="predictive-search-results" 5284 aria-controls="predictive-search-results" 5285 aria-haspopup="listbox" 5286 aria-autocomplete="list" 5287 autocomplete="off" 5288 placeholder="Search" 5289 ref="searchInput" 5290 on:input="/search" 5291 on:keydown="/onSearchKeyDown" 5292 > 5293 <input 5294 name="options[prefix]" 5295 type="hidden" 5296 value="last" 5297 > 5298 <span class="svg-wrapper predictive-search__icon"> 5299 <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> 5300 5301 </span> 5302 <button 5303 type="button" 5304 class="button-unstyled predictive-search__reset-button" 5305 ref="resetButton" 5306 hidden 5307 on:click="/resetSearch" 5308 > 5309 Clear 5310 </button> 5311 </div> 5312 <button 5313 type="button" 5314 class="button predictive-search__close-modal-button" 5315 aria-label="Close dialog" 5316 on:click="dialog-component/closeDialog" 5317 ref="closeModalButton" 5318 > 5319 <span class="svg-wrapper"> 5320 <svg aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 5321<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"/> 5322</svg> 5323 5324 </span> 5325 </button> 5326 </div> 5327 5328 <div class="predictive-search-form__content-wrapper"> 5329 <div 5330 class="predictive-search-form__content" 5331 ref="predictiveSearchResults" 5332 on:click="/handleModalClick" 5333 > 5334 5335 5336<div 5337 id="predictive-search-results" 5338 class="predictive-search-dropdown" 5339 role="listbox" 5340 aria-expanded="true" 5341 style="--color-shadow: rgb(var(--color-foreground-rgb) / 0.1);" 5342> 5343 5344 <div class="predictive-search-results__inner"> 5345 5346 5347 5348 5349 5350 <div 5351 id="predictive-search-products" 5352 class="predictive-search-results__products" 5353 5354 data-testid="products-list-default--modal" 5355 5356> 5357 5358 <h4 class="predictive-search-results__title"> 5359 Products 5360 </h4> 5361 <ul 5362 class="predictive-search-results__list predictive-search-results__wrapper-products list-unstyled" 5363 > 5364 5365 5366 <li 5367 class="predictive-search-results__card predictive-search-results__card--product" 5368 ref="resultsItems[]" 5369 > 5370 5371<product-component 5372 class="resource-card__wrapper" 5373 5374 5375 view-event-payload="{"product":{"id":7776085934178,"title":"A\/B Testing","handle":"ab-testing","selectedVariant":null},"context":"search","selectedOptions":[]}" 5376 5377 ><div 5378 class="resource-card" 5379 data-resource-type="product" 5380> 5381 <a 5382 class="resource-card__link" 5383 href="/products/ab-testing" 5384 > 5385 <span class="visually-hidden"> 5386 A/B Testing 5387 </span> 5388 </a> 5389 <div 5390 class="resource-card__media" 5391 style="--resource-card-aspect-ratio: 4 / 5;" 5392 5393 > 5394 5395 5396 5397 <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%;"> 5398</div> 5399 5400 <div class="resource-card__content"> 5401 <p class="resource-card__title paragraph">A/B Testing</p> 5402 5403 5404 <div ref="priceContainer"> 5405 5406 5407 <div 5408 class=" 5409 price__regular 5410 5411 " 5412 >
5413 <span class="price">$0.00</span> 5414 </div> 5415 <div 5416 class=" 5417 price__sale 5418 5419 price__hidden 5420 5421 " 5422 > 5423 5424 <span class="price-item__group"> 5425 <span class="visually-hidden">Regular price </span> 5426 <span class="price-item--regular compare-at-price"></span> 5427 </span> 5428 <span class="price-item__group"> 5429 <span class="visually-hidden">Sale price </span> 5430 <span class="price-item--sale price">$0.00</span> 5431 </span> 5432 5433 </div> 5434 5435</div> 5436 5437 </div> 5438</div></product-component> 5439 5440 </li> 5441 5442 <li 5443 class="predictive-search-results__card predictive-search-results__card--product" 5444 ref="resultsItems[]" 5445 > 5446 5447<product-component 5448 class="resource-card__wrapper" 5449 5450 5451 view-event-payload="{"product":{"id":7776086851682,"title":"Auto Replication","handle":"auto-replication","selectedVariant":null},"context":"search","selectedOptions":[]}" 5452 5453 ><div 5454 class="resource-card" 5455 data-resource-type="product" 5456> 5457 <a 5458 class="resource-card__link" 5459 href="/products/auto-replication" 5460 > 5461 <span class="visually-hidden"> 5462 Auto Replication 5463 </span> 5464 </a> 5465 <div 5466 class="resource-card__media" 5467 style="--resource-card-aspect-ratio: 4 / 5;" 5468 5469 > 5470 5471 5472 5473 <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%;"> 5474</div> 5475 5476 <div class="resource-card__content"> 5477 <p class="resource-card__title paragraph">Auto Replication</p> 5478 5479 5480 <div ref="priceContainer"> 5481 5482 5483 <div 5484 class=" 5485 price__regular 5486 5487 " 5488 > 5489 <span class="price">$0.00</span> 5490 </div> 5491 <div 5492 class=" 5493 price__sale 5494 5495 price__hidden 5496 5497 " 5498 > 5499 5500 <span class="price-item__group"> 5501 <span class="visually-hidden">Regular price </span> 5502 <span class="price-item--regular compare-at-price"></span> 5503 </span> 5504 <span class="price-item__group"> 5505 <span class="visually-hidden">Sale price </span> 5506 <span class="price-item--sale price">$0.00</span> 5507 </span> 5508 5509 </div> 5510 5511</div> 5512 5513 </div> 5514</div></product-component> 5515 5516 </li> 5517 5518 <li 5519 class="predictive-search-results__card predictive-search-results__card--product" 5520 ref="resultsItems[]" 5521 > 5522 5523<product-component 5524 class="resource-card__wrapper" 5525 5526 5527 view-event-payload="{"product":{"id":7773574201442,"title":"Banner Placeholders","handle":"banner-placeholders","selectedVariant":null},"context":"search","selectedOptions":[]}" 5528 5529 ><div 5530 class="resource-card" 5531 data-resource-type="product" 5532> 5533 <a 5534 class="resource-card__link" 5535 href="/products/banner-placeholders" 5536 > 5537 <span class="visually-hidden"> 5538 Banner Placeholders 5539 </span> 5540 </a> 5541 <div 5542 class="resource-card__media" 5543 style="--resource-card-aspect-ratio: 4 / 5;" 5544 5545 > 5546 5547 5548 5549 <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%;"> 5550</div> 5551 5552 <div class="resource-card__content"> 5553 <p class="resource-card__title paragraph">Banner Placeholders</p> 5554 5555 5556 <div ref="priceContainer"> 5557 5558 5559 <div 5560 class=" 5561 price__regular 5562 5563 " 5564 >
5565 <span class="price">$0.00</span> 5566 </div> 5567 <div 5568 class=" 5569 price__sale 5570 5571 price__hidden 5572 5573 " 5574 > 5575 5576 <span class="price-item__group"> 5577 <span class="visually-hidden">Regular price </span> 5578 <span class="price-item--regular compare-at-price"></span> 5579 </span> 5580 <span class="price-item__group"> 5581 <span class="visually-hidden">Sale price </span> 5582 <span class="price-item--sale price">$0.00</span> 5583 </span> 5584 5585 </div> 5586 5587</div> 5588 5589 </div> 5590</div></product-component> 5591 5592 </li> 5593 5594 <li 5595 class="predictive-search-results__card predictive-search-results__card--product" 5596 ref="resultsItems[]" 5597 > 5598 5599<product-component 5600 class="resource-card__wrapper" 5601 5602 5603 view-event-payload="{"product":{"id":7773574398050,"title":"Collection Reports","handle":"collection-reports","selectedVariant":null},"context":"search","selectedOptions":[]}" 5604 5605 ><div 5606 class="resource-card" 5607 data-resource-type="product" 5608> 5609 <a 5610 class="resource-card__link" 5611 href="/products/collection-reports" 5612 > 5613 <span class="visually-hidden"> 5614 Collection Reports 5615 </span> 5616 </a> 5617 <div 5618 class="resource-card__media" 5619 style="--resource-card-aspect-ratio: 4 / 5;" 5620 5621 > 5622 5623 5624 5625 <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%;"> 5626</div> 5627 5628 <div class="resource-card__content"> 5629 <p class="resource-card__title paragraph">Collection Reports</p> 5630 5631 5632 <div ref="priceContainer"> 5633 5634 5635 <div 5636 class=" 5637 price__regular 5638 5639 " 5640 > 5641 <span class="price">$0.00</span> 5642 </div> 5643 <div 5644 class=" 5645 price__sale 5646 5647 price__hidden 5648 5649 " 5650 > 5651 5652 <span class="price-item__group"> 5653 <span class="visually-hidden">Regular price </span> 5654 <span class="price-item--regular compare-at-price"></span> 5655 </span> 5656 <span class="price-item__group"> 5657 <span class="visually-hidden">Sale price </span> 5658 <span class="price-item--sale price">$0.00</span> 5659 </span> 5660 5661 </div> 5662 5663</div> 5664 5665 </div> 5666</div></product-component> 5667 5668 </li> 5669 5670 </ul> 5671 5672</div> 5673 5674 5675 5676 </div> 5677 5678</div> 5679 5680 </div> 5681 5682 <div class="predictive-search-form__footer"> 5683 <button 5684 class="button predictive-search__search-button" 5685 ref="viewAllButton" 5686 > 5687 View all 5688 </button> 5689 </div> 5690 </div> 5691 </form> 5692 </predictive-search-component> 5693 </dialog> 5694</dialog-component> 5695 5696 5697 5698 5699 5700
5700<script 5701 src="//www.tagalys.com/cdn/shop/t/7/assets/gift-card-recipient-form.js?v=170482155849799299241786539026" 5702 type="module" 5703 fetchpriority="low" 5704></script>
5704 5705<quick-add-dialog id="quick-add-dialog"> 5706 <dialog 5707 class="quick-add-modal dialog-modal color-custom-popover" 5708 ref="dialog" 5709 scroll-lock 5710 > 5711 <button 5712 ref="closeButton" 5713 on:click="/closeDialog" 5714 class="button button-unstyled close-button quick-add-modal__close" 5715 aria-label="Close dialog" 5716 ><svg aria-hidden="true" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"> 5717<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"/> 5718</svg> 5719</button> 5720 5721 <product-component 5722 id="quick-add-modal-content" 5723 class="quick-add-modal__content" 5724 view-event-trigger="dialog" 5725 ></product-component> 5726 </dialog> 5727</quick-add-dialog> 5728 5729 5730 5731 5732 5733 5734 5735
5735<script src="https://cdn.shopify.com/storefront/standard-actions.js" type="module" data-source-attribution="shopify.standard_actions"></script>
5735 5736</body> 5737</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.