:root { --to-header-height: 60px; --to-header-container: 1504px; --to-header-nav-height: 44px; } html#snackys-tpl, html#snackys-tpl body { overscroll-behavior-y: none; } #snackys-tpl .mw-container { padding-left: var(--spacing-16, 64px); padding-right: var(--spacing-16, 64px); max-width: var(--to-header-container, 1504px); } @media (max-width: 1199px) { #snackys-tpl .mw-container { padding-right: var(--spacing-8); padding-left: var(--spacing-8); } } @media (max-width: 991px) { #snackys-tpl .mw-container { padding-right: var(--spacing-4); padding-left: var(--spacing-4); } } #snackys-tpl #top-bar-wrapper { min-height: 28px; border: 0; background: var(--color-primary-100); color: var(--color-white); } #snackys-tpl #top-bar { min-height: 28px; max-width: var(--to-header-container); padding: 0 var(--spacing-16); color: var(--color-white); font-family: var(--font-family-base); font-size: 11px; line-height: 1; } #snackys-tpl #top-bar a, #snackys-tpl #top-bar a:visited, #snackys-tpl #top-bar a:hover, #snackys-tpl #top-bar a:focus, #snackys-tpl #top-bar .active > a { color: var(--color-white); } #snackys-tpl #top-bar .list-inline > li { padding-right: var(--spacing-8); padding-left: var(--spacing-8); } #snackys-tpl #top-bar .list-inline > li:first-child { padding-left: 0; } #snackys-tpl .to-topbar__tools, #snackys-tpl .to-topbar__account { display: flex; align-items: center; } #snackys-tpl .to-topbar__tools { gap: var(--spacing-6); margin-left: auto; } #snackys-tpl .to-topbar__settings { margin: 0; } #snackys-tpl .to-topbar__account { gap: var(--spacing-2); min-height: 28px; font-size: 11px; font-weight: var(--font-weight-bold); text-transform: uppercase; } #snackys-tpl .to-topbar__account .caret { margin: 0 0 0 var(--spacing-1); border-top-color: var(--color-white); } #snackys-tpl #shop-nav { min-height: var(--to-header-height); margin: 0; padding: 0; border: 0; background: var(--color-primary-100); } #snackys-tpl #shop-nav > .mw-container { display: grid; grid-template-areas: "logo reviews actions"; grid-template-columns: minmax(190px, 1fr) minmax(360px, auto) minmax(260px, 1fr); align-items: center; min-height: var(--to-header-height); max-width: var(--to-header-container); margin: 0 auto; padding: 0 var(--spacing-16); } #snackys-tpl #shop-nav > .mw-container > [class*="col-"], #snackys-tpl #shop-nav .to-header__logo, #snackys-tpl #shop-nav .to-header__actions { width: auto; min-height: 0; padding: 0; } #snackys-tpl .to-header__logo { grid-area: logo; display: flex; align-items: center; justify-content: flex-start; height: 35px; text-align: left; } #snackys-tpl .to-header__logo a { display: flex; align-items: center; justify-content: flex-start; width: auto; max-width: 200px; height: 35px; } #snackys-tpl .to-header__logo img { width: auto; max-width: 200px; height: auto; max-height: 35px; margin: 0; object-fit: contain; object-position: left center; } #snackys-tpl .to-header__reviews { grid-area: reviews; display: flex; align-items: center; justify-content: center; min-width: 360px; max-width: 520px; min-height: 1px; color: var(--color-white); } #snackys-tpl .to-header__reviews-data { display: flex; align-items: center; justify-content: center; gap: 12px; font-family: var(--font-family-base); font-size: 18px; line-height: 1; white-space: nowrap; } #snackys-tpl .to-header__reviews-logo { width: 35px; height: 35px; margin-right: 4px; } #snackys-tpl .to-header__reviews-stars { color: var(--color-warning); font-family: var(--font-family-base); font-size: 17.5px; letter-spacing: .125em; } #snackys-tpl .to-header__reviews-score { color: var(--color-white); font-size: 20px; font-weight: var(--font-weight-bold); } #snackys-tpl .to-header__reviews-label, #snackys-tpl .to-header__reviews-count { font-size: 16px; } @media (max-width: 1399px) { #snackys-tpl .to-header__reviews-count.is-logged-in { display: none; } } #snackys-tpl .to-header__actions { grid-area: actions; justify-self: end; } #snackys-tpl .to-header__search { grid-area: search; } #snackys-tpl #shop-nav .to-header__search form { position: relative; display: flex; width: 100%; max-width: 480px; margin: 0; } #snackys-tpl #shop-nav .to-header__search input { width: 100%; height: 40px; margin: 0; padding: 0 44px 0 var(--spacing-3); border: 0; border-radius: var(--border-radius-sm); background: var(--color-white); color: var(--color-primary-100); font-family: var(--font-family-base); font-size: 15px; line-height: 1; } #snackys-tpl #shop-nav .to-header__search input::placeholder { color: var(--color-secondary-75); opacity: 1; } @media (max-width: 767px) { #snackys-tpl #shop-nav .to-header__search input { font-size: 16px; } } #snackys-tpl #shop-nav .to-header__search #search-submit-button { position: absolute; top: 0; right: 0; z-index: 2; display: flex; align-items: center; justify-content: center; width: 44px; height: 40px; padding: 0; border: 0; background: transparent; color: var(--color-primary-100); } #snackys-tpl #shop-nav .to-header__search .to-header-search__icon { width: 18px; height: 18px; fill: currentColor; } @media (min-width: 768px) { #snackys-tpl #shop-nav .to-header__search { display: none; } #snackys-tpl #shop-nav .wish-list-menu { display: block !important; } } #snackys-tpl #shop-nav .hdr-nav { display: grid; grid-auto-flow: column; grid-auto-columns: max-content; gap: var(--spacing-6); align-items: center; justify-content: flex-end; } #snackys-tpl #shop-nav .hdr-nav > div, #snackys-tpl #shop-nav .hdr-nav > div:not(:first-child) { margin: 0; } #snackys-tpl #shop-nav .hdr-l { color: var(--color-white); } #snackys-tpl #shop-nav .hdr-nav .icon-xl { display: flex; align-items: center; justify-content: center; width: 20px; min-width: 20px; height: 20px; } #snackys-tpl svg.to-ui-icon { display: block; fill: none !important; stroke: currentColor !important; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; } #snackys-tpl #shop-nav .hdr-nav .icon-xl svg, #snackys-tpl #shop-nav .hdr-nav .hdr-l:hover .icon-xl svg, #snackys-tpl #shop-nav .hdr-nav .hdr-l:focus .icon-xl svg { fill: var(--color-white); } #snackys-tpl #shop-nav .hdr-nav svg.to-header-icon { fill: currentColor; stroke: none !important; } #snackys-tpl #shop-nav .hdr-nav .to-header-account svg.to-header-icon { stroke: currentColor !important; stroke-width: .25; paint-order: stroke fill; } #snackys-tpl #shop-nav .hdr-nav .to-header-account > .hdr-l { display: flex; align-items: center; gap: var(--spacing-3); position: relative; } #snackys-tpl #shop-nav .to-header-account__icon-wrap { position: relative; display: flex; flex: 0 0 auto; align-items: center; justify-content: center; } #snackys-tpl #shop-nav .hdr-nav .to-header-account.dropdown { display: flex; align-items: center; gap: var(--spacing-3); box-sizing: border-box; min-height: 36px; margin-right: -1em; padding: 0 var(--spacing-3); padding-right: 25px; border: 2px solid var(--color-primary-75); border-radius: var(--border-radius-sm); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: calc(100% - 1px); background-size: 15px; box-shadow: inset -18px 0 0 #3f5aae45; } #snackys-tpl #shop-nav .hdr-nav .to-header-account.dropdown:not(.is-logged-in) { margin-right: 0; padding: 0; border: 0; background-color: transparent; background-image: none; box-shadow: none; } #snackys-tpl #shop-nav .hdr-nav .to-header-account.is-logged-in > .hdr-l .icon-xl { width: 18px; min-width: 18px; height: 18px; } #snackys-tpl #shop-nav .to-header-account__greeting { display: flex; flex-direction: column; color: var(--color-white); font-size: var(--font-size-xs, 12px); line-height: 1; white-space: nowrap; } #snackys-tpl #shop-nav .to-header-account__greeting-name, #snackys-tpl #shop-nav .to-header-account__greeting-account { display: block; } #snackys-tpl #shop-nav .to-header-account__greeting-name { line-height: 1; } @media (max-width: 991.98px) { #snackys-tpl #shop-nav .to-header-account__greeting { display: none; } #snackys-tpl #shop-nav .hdr-nav .to-header-account.dropdown { padding-right: 30px; } } @media (max-width: 575.98px) { #snackys-tpl #shop-nav .hdr-nav .to-header-account.dropdown { min-height: 33px; } } #snackys-tpl #shop-nav .to-header-account__logged-check { position: absolute; right: -7px; bottom: -5px; z-index: 1; display: block; width: 15px; height: 15px; padding: 1px; border-radius: 7.5px; background: #002293; color: var(--color-white); pointer-events: none; } #snackys-tpl #shop-nav .to-header-account__logged-check svg { display: block; width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; } #snackys-tpl #shop-nav .hdr-nav .hdr-l:focus-visible, #snackys-tpl #cat-w .mm-mainlink:focus-visible, #snackys-tpl .to-topbar__account:focus-visible { outline: 2px solid var(--color-warning); outline-offset: 3px; } #snackys-tpl .to-header-clp__tab:focus, #snackys-tpl .to-header-clp__tab:focus-visible, #snackys-tpl .to-home-hero__tab:focus, #snackys-tpl .to-home-hero__tab:focus-visible, #snackys-tpl .to-search-tab:focus, #snackys-tpl .to-search-tab:focus-visible, #snackys-tpl .to-pdp-support__tab:focus, #snackys-tpl .to-pdp-support__tab:focus-visible, #snackys-tpl .to-search-product__variant:focus, #snackys-tpl .to-search-product__variant:focus-visible, #snackys-tpl [role="tab"]:focus, #snackys-tpl [role="tab"]:focus-visible { outline: none; } #snackys-tpl #shop-nav .hdr-nav .badge { top: -9px; right: -9px; background: var(--color-warning); color: var(--color-primary-100); } #snackys-tpl .to-header-cart { display: grid; grid-template-columns: 40px 88px 30px; align-items: center; width: 158px; min-height: 36px; overflow: hidden; border-radius: var(--border-radius-sm); background: var(--color-warning); color: var(--color-primary-100) !important; font-family: var(--font-family-base); font-size: 16px; font-weight: var(--font-weight-bold); line-height: 1; text-transform: uppercase; } #snackys-tpl .to-header-cart:hover, #snackys-tpl .to-header-cart:focus { background: var(--color-warning); color: var(--color-primary-100) !important; } #snackys-tpl .to-header-cart__icon { margin: 0 auto; } #snackys-tpl #shop-nav .hdr-nav .to-header-cart .to-header-cart__icon { width: 23px; min-width: 23px; height: 23px; } #snackys-tpl #shop-nav .hdr-nav .to-header-cart .to-header-cart__icon svg.to-header-icon, #snackys-tpl #shop-nav .hdr-nav .to-header-cart:hover .to-header-cart__icon svg.to-header-icon, #snackys-tpl #shop-nav .hdr-nav .to-header-cart:focus .to-header-cart__icon svg.to-header-icon { fill: var(--color-primary-100); } #snackys-tpl .to-header-cart__label { padding: 0; font-size: 16px; white-space: nowrap; } #snackys-tpl .to-header-cart__count { display: flex; align-items: center; align-self: stretch; justify-content: center; min-width: 30px; border-left: 1px solid rgba(0, 34, 147, .16); color: var(--color-primary-100); } /**/ #snackys-tpl .overlay-bg, #snackys-tpl .modal-backdrop { background: color-mix(in srgb, var(--color-primary-100) 75%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } /**/ #snackys-tpl #shop-nav .cart-menu > .c-dp { position: fixed !important; top: 0; right: 0; bottom: 0; left: auto; width: 0 !important; height: 0 !important; min-width: 0 !important; min-height: 0 !important; margin: 0 !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; background: transparent !important; box-shadow: none !important; transform: none !important; pointer-events: none; visibility: hidden; z-index: 10120; } #snackys-tpl #shop-nav .cart-menu.open > .c-dp { overflow: visible !important; pointer-events: auto; visibility: visible; } /**/ #snackys-tpl #shop-nav .cart-menu > .c-dp > .inside { position: fixed !important; top: 0; right: 0; bottom: 0; left: auto; width: 100%; max-width: 25rem; box-sizing: border-box; display: flex; flex-direction: column; pointer-events: auto; overflow-x: hidden; padding: 0; padding-block: var(--spacing-4) !important; } #snackys-tpl #shop-nav .cart-menu.open > .c-dp > .inside { visibility: visible; } #snackys-tpl #shop-nav .cart-menu .c-dp .sc-item .cols-name { min-width: 0; max-width: 100%; overflow-wrap: anywhere; } @media screen and (max-width: 767px) { #snackys-tpl #shop-nav .cart-menu > .c-dp > .inside { max-width: min(320px, 100vw); } } /**/ #snackys-tpl body.sidebasket-open #shop-nav { position: relative !important; z-index: 10100 !important; } #snackys-tpl .cart-menu.open .overlay-bg, #snackys-tpl .cart-menu.open .c-dp > .overlay-bg { z-index: 10110 !important; } #snackys-tpl .cart-menu.open .c-dp, #snackys-tpl .cart-menu.open .c-dp > .inside, #snackys-tpl .cart-menu.open .c-dp > .close-sidebar { z-index: 10120 !important; } #snackys-tpl .c-dp .close-sidebar { top: 1rem !important; } .c-dp .close-sidebar, .c-dp .close-btn { outline: none; box-shadow: none; } .c-dp .close-sidebar:focus, .c-dp .close-sidebar:focus-visible, .c-dp .close-btn:focus, .c-dp .close-btn:focus-visible { outline: none; box-shadow: none; } /**/ [id^="trustbadge-container"] { z-index: 40 !important; } #snackys-tpl .c-dp .items-list { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; height: 100%; overflow: hidden; padding: 0; } .c-dp .items-list, .cart-menu { padding: 0 !important; } .cart-icon-dropdown .alert { margin-top: 0 !important; } #snackys-tpl .c-dp .to-sidebasket-title { display: flex; align-items: center; justify-content: flex-start; gap: 5px; margin-bottom: 0; } #snackys-tpl .c-dp .to-sidebasket-title__icon { width: 30px; height: auto; flex: 0 0 auto; fill: currentColor; } /**/ #snackys-tpl .c-dp .to-sidebasket-header { flex: 0 0 auto; padding-inline: var(--spacing-6); margin-bottom: var(--spacing-6); padding: 0 var(--spacing-4) var(--spacing-4) !important; text-align: left !important; border-bottom: 2px solid var(--color-tertiary-75); } #snackys-tpl .c-dp .to-sidebasket-content { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; padding-inline: var(--spacing-6); } #snackys-tpl .c-dp .to-sidebasket-content .img-ct img { object-fit: contain; } #snackys-tpl .c-dp .to-sidebasket-footer { display: flex; flex-direction: column; flex: 0 0 auto; background: var(--color-white); padding-inline: var(--spacing-6); border-top: 2px solid var(--color-tertiary-75); box-shadow: 0px 5px 20px -5px #0000005e; } /**/ #snackys-tpl .c-dp .to-sidebasket-content:has(.c-empt) ~ .to-sidebasket-footer .add-pays, #snackys-tpl .c-dp .to-sidebasket-content:has(.c-empt) ~ .to-sidebasket-footer .payplan { display: none; } #snackys-tpl .c-dp { --ts-lg: var(--font-size-xs); --ts-md: var(--font-size-xs); --ts-sm: var(--font-size-xs); } #snackys-tpl .c-dp .small, #snackys-tpl .c-dp small { font-size: var(--font-size-xs); } #snackys-tpl .c-dp #cart-form-xs { flex: 1 1 auto; min-height: 0; overflow: auto; margin-bottom: 0; gap: .5em; } .cart-icon-dropdown.c-dp #cart-form-xs { gap: .5em; padding-bottom: var(--spacing-6); } /**/ #snackys-tpl .c-dp .sc-item.dropdown { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr) auto auto; grid-template-areas: "img name name name" "img price qty del"; column-gap: 0.35rem; row-gap: 0.35rem; align-items: center; } .cart-icon-dropdown .sc-item { padding: var(--spacing-3); border: 2px solid #d5d6dd; border-radius: .5em; } .wi-marketing-notice__inner { border-left: none !important; } .wi-marketing-notice__inner .wi-marketing-notice__list { list-style: none; padding: 0; } #snackys-tpl .c-dp .sc-item.dropdown > .flx-ac, #snackys-tpl .c-dp .sc-item.dropdown > .to-sidebasket-edit, #snackys-tpl .c-dp .sc-item.dropdown .collapse, #snackys-tpl .c-dp .sc-item.dropdown .edit-item { display: contents; } #snackys-tpl .c-dp .sc-item .cols-img { grid-area: img; width: 3.5rem; min-width: 3.5rem; align-self: center; } #snackys-tpl .c-dp .sc-item .cols-name { grid-area: name; margin: 0; padding-left: 0.65rem; } #snackys-tpl .c-dp .sc-item .cols-price { grid-area: price; margin-left: 0; padding-left: 0.65rem; font-size: 16px; } #snackys-tpl .c-dp .sc-item .cols-price strong { font-size: 16px; } #snackys-tpl .c-dp .sc-item .to-sidebasket-qty, #snackys-tpl .c-dp .sc-item .qty-wrapper { grid-area: qty; justify-self: end; } #snackys-tpl .c-dp .sc-item .droppos { grid-area: del; display: inline-flex; align-items: center; justify-content: center; width: 25px; height: 25px; min-height: 25px; margin-left: 0; padding: 0; box-sizing: border-box; transform: none; } #snackys-tpl .c-dp .sc-item .droppos:hover, #snackys-tpl .c-dp .sc-item .droppos:focus, #snackys-tpl .c-dp .sc-item .droppos:focus-visible, #snackys-tpl .c-dp .sc-item .droppos:active { transform: none; } #snackys-tpl .c-dp .sc-item .droppos .icon.img-ct, #snackys-tpl .c-dp .sc-item .droppos svg { width: 12px; height: 12px; } #snackys-tpl .c-dp .sc-item .to-search-qty.is-loading, #snackys-tpl .c-dp .sc-item .droppos.is-loading { position: relative; overflow: hidden; background: var(--color-tertiary-50); border-color: transparent; color: transparent; pointer-events: none; } #snackys-tpl .c-dp .sc-item .to-search-qty.is-loading > *, #snackys-tpl .c-dp .sc-item .droppos.is-loading > * { visibility: hidden; } #snackys-tpl .c-dp .sc-item .to-search-qty.is-loading::after, #snackys-tpl .c-dp .sc-item .droppos.is-loading::after { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 70%; background: linear-gradient( 90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.85) 50%, rgba(255, 255, 255, 0) 100% ); transform: translateX(-140%); animation: to-listing-shimmer 0.85s ease-in-out infinite; pointer-events: none; } #snackys-tpl .c-dp .sc-item .to-sidebasket-qty { gap: 0.35rem; margin: 0; } #snackys-tpl .c-dp .sc-item .to-search-qty { display: grid; grid-template-columns: 22px 24px 22px; width: 68px; height: 25px; overflow: hidden; border: 1px solid var(--color-tertiary-75); border-radius: 4px; background: var(--color-white); } #snackys-tpl .c-dp .sc-item .to-search-qty__btn, #snackys-tpl .c-dp .sc-item .to-search-qty__input { display: grid; place-items: center; width: 100%; min-width: 0; height: 25px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: var(--color-white); color: var(--color-neutral, #1a1a1a); font-family: inherit; font-size: 13px; font-weight: var(--font-weight-bold, 700); line-height: 1; box-shadow: none; appearance: none; } #snackys-tpl .c-dp .sc-item .to-search-qty__btn { cursor: pointer; } #snackys-tpl:not(.sidebar-cart-optimized) .c-dp .sc-item .to-search-qty { grid-template-columns: 24px !important; width: 24px !important; } #snackys-tpl:not(.sidebar-cart-optimized) .c-dp .sc-item .to-search-qty__btn { display: none !important; } #snackys-tpl .c-dp .sc-item .to-search-qty__btn svg { display: block; width: 12px; height: 12px; } #snackys-tpl .c-dp .sc-item .to-search-qty__btn:hover { background: var(--color-tertiary-50); } #snackys-tpl .c-dp .sc-item .to-search-qty__btn:disabled { opacity: .35; background: var(--color-white); cursor: default; } #snackys-tpl .c-dp .sc-item .to-search-qty__input { border-right: 1px solid var(--color-tertiary-75); border-left: 1px solid var(--color-tertiary-75); text-align: center; -moz-appearance: textfield; } #snackys-tpl .c-dp .sc-item .to-search-qty__input::-webkit-inner-spin-button, #snackys-tpl .c-dp .sc-item .to-search-qty__input::-webkit-outer-spin-button { margin: 0; appearance: none; } #snackys-tpl .c-dp .sc-item .to-search-qty.is-loading .to-search-qty__input { visibility: visible; background: var(--color-tertiary-50); color: transparent; -webkit-text-fill-color: transparent; caret-color: transparent; border-right-color: transparent; border-left-color: transparent; } #snackys-tpl .c-dp .sc-item .to-sidebasket-qty__refresh { display: grid; place-items: center; flex: 0 0 25px; width: 25px; min-width: 25px; height: 25px; min-height: 25px; padding: 0; } #snackys-tpl .c-dp .sc-item .to-sidebasket-qty__refresh .img-ct, #snackys-tpl .c-dp .sc-item .to-sidebasket-qty__refresh svg { display: block; width: 14px; height: 14px; } html.sidebar-cart-optimized .to-sidebasket-qty__refresh { display: none !important; } #snackys-tpl .c-dp .sc-sum, #snackys-tpl .c-dp .fixed-btn-group, #snackys-tpl .c-dp .add-pays, #snackys-tpl .c-dp .payplan { flex: 0 0 auto; background: var(--color-white); } #ppc-miniCart-horizontal-container { padding: 0 !important; } #snackys-tpl .c-dp .c-empt + p { font-size: 16px; } #snackys-tpl .c-dp .fixed-btn-group .btn { display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-height: 52px; padding: 0.85rem 1.2rem; font-size: var(--tl-lg); font-weight: var(--font-weight-bold, 700); line-height: 1.2; } .cart-icon-dropdown .to-cart-checkout { text-transform: uppercase; } #snackys-tpl .c-dp .sc-sum { padding-top: var(--spacing-4); } #snackys-tpl body.sidebasket-open #cat-w, #snackys-tpl body.sidebasket-open .to-header-clp { z-index: 1; } #snackys-tpl #cat-w { top: 0; margin: 0; border: 0; background: var(--color-white); box-shadow: none; } #snackys-tpl body[data-page="3"] #cat-w { box-shadow: var(--shadow-md); } /**/ @media (min-width: 1200px) { #snackys-tpl:has(.to-header-clp:not([hidden])) #cat-w { position: relative; top: auto; } #snackys-tpl #cat-w > .mgm.mw-container { max-width: var(--to-header-container); margin: 0 auto; padding: 0 var(--spacing-12); } #snackys-tpl #cat-w #cat-ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(82px, 1fr)); align-items: stretch; width: 100%; min-height: var(--to-header-nav-height); margin: 0; } #snackys-tpl #cat-w #cat-ul > li { position: relative; min-width: 0; overflow: visible; } #snackys-tpl #cat-w #cat-ul > li > .mm-mainlink { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 100%; height: var(--to-header-nav-height); padding: 0 var(--spacing-2); border-radius: var(--border-radius-sm) var(--border-radius-sm) 0 0; background: var(--color-white); color: var(--color-primary-100); font-family: var(--font-family-base); font-size: 16px; font-weight: var(--font-weight-bold); line-height: 1; text-align: center; text-transform: uppercase; transition: background-color .3s ease, color .3s ease; } #snackys-tpl #cat-w, #snackys-tpl #cat-w:hover, #snackys-tpl #cat-w:has(#cat-ul > li:hover), #snackys-tpl #cat-w:has(#cat-ul > li:focus-within) { background: var(--color-white); transition: background-color .3s ease; } #snackys-tpl #cat-w:has(#cat-ul > li.active) { background: var(--color-primary-100); } #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li > .mm-mainlink { background: transparent; color: var(--color-white); } #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.active > .mm-mainlink, #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li:hover > .mm-mainlink, #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li:focus-within > .mm-mainlink { background: var(--color-white); color: var(--color-primary-100); box-shadow: 0px 3px 0px #fff; } #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.active > .mm-mainlink { border-radius: var(--border-radius-sm) var(--border-radius-sm) 0 0; } #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.mgm-fw::before, #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.mgm-fw::after { content: ""; position: absolute; bottom: -1.5px; z-index: 0; display: block; width: 15px; height: 15px; pointer-events: none; opacity: 0; background-color: var(--color-white); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15'%3E%3Cpath d='M15 0L0 0L0 15A15 15 0 0 1 15 0Z' fill='%23fff'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: 12px 12px; -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15'%3E%3Cpath d='M15 0L0 0L0 15A15 15 0 0 1 15 0Z' fill='%23fff'/%3E%3Cpath d='M15 0A15 15 0 0 0 0 15' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E"); -webkit-mask-repeat: no-repeat; -webkit-mask-size: 15px 15px; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15'%3E%3Cpath d='M15 0L0 0L0 15A15 15 0 0 1 15 0Z' fill='%23fff'/%3E%3Cpath d='M15 0A15 15 0 0 0 0 15' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E"); mask-repeat: no-repeat; mask-size: 15px 15px; transition: opacity .3s ease; } #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.mgm-fw::before { right: 100%; margin-right: -1px; transform: rotate(180deg); } #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.mgm-fw::after { left: 100%; margin-left: -1px; transform: rotate(180deg) scaleX(-1); } #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.mgm-fw:is(:hover, :focus-within, .active)::before, #snackys-tpl #cat-w:has(#cat-ul > li.active) #cat-ul > li.mgm-fw:is(:hover, :focus-within, .active)::after { opacity: 1; } #snackys-tpl #cat-w #cat-ul > li > .mm-mainlink > .caret, #snackys-tpl #cat-w #cat-ul > li > .mm-mainlink > .fa-caret-down, #snackys-tpl #cat-w #cat-ul > li > .mm-mainlink .fa-caret-down.visible-xs, #snackys-tpl #cat-w #cat-ul > li > .mm-mainlink > .ar-r { display: none !important; } } /**/ @media (max-width: 1199px) { #snackys-tpl #top-bar, #snackys-tpl #shop-nav > .mw-container { padding-right: var(--spacing-8); padding-left: var(--spacing-8); } #snackys-tpl #shop-nav > .mw-container { grid-template-areas: "mobile logo reviews actions"; grid-template-columns: 30px minmax(170px, 1fr) minmax(280px, auto) minmax(200px, 1fr); column-gap: var(--spacing-4); align-items: center; } #snackys-tpl .to-header__reviews { min-width: 280px; } #snackys-tpl .to-header__reviews-count { display: none; } #snackys-tpl #shop-nav > .mw-container > .visible-xs { grid-area: mobile; position: relative; display: block !important; width: 30px; min-width: 30px; height: 30px; padding: 0; } #snackys-tpl #shop-nav #mob-nt { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; border: 0; background: transparent; color: var(--color-white); } #snackys-tpl #shop-nav #mob-nt .to-ui-icon { width: 25px; height: 25px; } #snackys-tpl #shop-nav #sr-tg-m { display: none !important; } #snackys-tpl .to-header__logo a, #snackys-tpl .to-header__logo img { max-width: 145px; max-height: 25px; } /**/ #snackys-tpl #cat-w { position: fixed !important; top: 0; left: 0; bottom: 0; z-index: 70; display: block; width: 20rem; max-width: 85vw; margin: 0; padding: 0; border: 0; background: var(--meg-b, var(--color-white)); box-shadow: none; transform: translateX(-120%); transition: transform .3s ease; visibility: hidden; overflow: hidden; } #snackys-tpl body.shw-sb #cat-w { transform: none; visibility: visible; } #snackys-tpl #cls-catw { display: block; } #snackys-tpl body.shw-sb #cls-catw { z-index: 65; opacity: 1; transform: none; pointer-events: auto; } #snackys-tpl #cat-w > .mgm.mw-container, #snackys-tpl #cat-w > .mw-container { max-width: none; height: 100%; margin: 0; padding: 0; } #snackys-tpl #cat-w #cat-ul, #snackys-tpl #cat-w .blanklist { display: block; position: relative; width: 100%; min-height: 0; height: 100%; margin: 0; padding: 0; } #snackys-tpl #cat-w > .mw-container > .blanklist { top: 5rem; height: calc(100% - 5rem); padding-bottom: 4rem; overflow: auto; } #snackys-tpl #cat-w #cat-ul > li, #snackys-tpl #cat-w li { position: static; width: 100%; min-width: 0; border-bottom: 1px solid var(--hr-li, rgba(0, 0, 0, .08)); box-shadow: none; overflow: visible; } #snackys-tpl #cat-w #cat-ul > li > .mm-mainlink, #snackys-tpl #cat-w .mm-mainlink, #snackys-tpl #cat-w a { position: relative; display: block; width: auto; height: auto; padding: .7rem 2.5rem .7rem 1.25rem; border-radius: 0; background: transparent; color: var(--meg-l, var(--color-primary-100)); font-size: 16px; font-weight: 600; line-height: 1.1; text-align: left; text-transform: none; white-space: normal; } #snackys-tpl #cat-w #cat-ul > li.mgm-fw::before, #snackys-tpl #cat-w #cat-ul > li.mgm-fw::after { content: none !important; display: none !important; } #snackys-tpl #cat-w .mm-mainlink .fa-caret-down.visible-xs, #snackys-tpl #cat-w .fa-caret-down.visible-xs { position: absolute; top: 0; right: 0; bottom: 0; z-index: 2; display: flex !important; align-items: center; justify-content: center; width: 2.5rem; height: 100%; background: none; } #snackys-tpl #cat-w .hidden-xs, #snackys-tpl #cat-w .ar.hidden-xs { display: none !important; } #snackys-tpl #cat-w .home-icon + .visible-xs, #snackys-tpl #cat-w .menu-title { display: flex; } #snackys-tpl #cat-w .mgm-c { height: 100%; max-height: none; margin: 0; padding: 0; transform: none; opacity: 1; } #snackys-tpl #cat-w .dropdown-menu, #snackys-tpl #cat-w .subsub, #snackys-tpl #cat-w .mgm .dropdown-menu { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; display: block !important; max-height: none; margin: 0; padding: 0; visibility: hidden; background: var(--meg-b, var(--color-white)); opacity: 1 !important; pointer-events: auto !important; transform: translateX(-100%); transition: transform .3s ease, visibility .3s ease; } #snackys-tpl #cat-w .open > .dropdown-menu, #snackys-tpl #cat-w .open > .subsub, #snackys-tpl #cat-w .open > .row > .row .col-12 > .subsub { max-height: 100%; overflow: auto; visibility: visible; transform: none; } #snackys-tpl #cat-w .menu-title { position: absolute; top: 0; right: 0; left: 0; height: 5rem; padding: 0 1.25rem; } } @media (max-width: 1199.98px) { #snackys-tpl .to-header__reviews { display: none; } } @media (max-width: 991px) { #snackys-tpl #shop-nav > .mw-container { grid-template-areas: "mobile logo actions"; grid-template-columns: 30px minmax(170px, 1fr) auto; } } @media (max-width: 767px) { :root { --to-header-height: 45px; } #snackys-tpl #shop-nav { z-index: 55; min-height: 45px; height: 45px; max-height: 45px; padding: 0; border-bottom: 0; overflow: visible; } #snackys-tpl #shop-nav > .mw-container { grid-template-areas: "mobile logo actions"; grid-template-columns: 30px minmax(0, auto) minmax(0, 1fr); grid-template-rows: 45px; min-height: 45px; height: 45px; max-height: 45px; padding: 0 var(--spacing-4); column-gap: var(--spacing-4); align-items: center; overflow: hidden; } #snackys-tpl #shop-nav .to-header__search { display: none !important; } #snackys-tpl .to-header__logo { justify-content: flex-start; justify-self: start; width: auto; height: 22px; } #snackys-tpl .to-header__actions { justify-self: end; } #snackys-tpl .to-header__logo a, #snackys-tpl .to-header__logo img { max-width: 140px; max-height: 22px; height: 22px; } #snackys-tpl #shop-nav .hdr-nav { gap: var(--spacing-4); } #snackys-tpl #shop-nav .hdr-nav .to-header-account.dropdown { margin-right: -0.5em; } #snackys-tpl .to-header-cart { position: relative; display: flex; align-items: center; justify-content: center; grid-template-columns: none; width: 28px; min-width: 28px; min-height: 28px; height: 28px; padding: 0; overflow: visible; border-radius: 0; background: transparent; color: var(--color-white) !important; } #snackys-tpl .to-header-cart:hover, #snackys-tpl .to-header-cart:focus { background: transparent; color: var(--color-white) !important; } #snackys-tpl #shop-nav .hdr-nav .to-header-cart .to-header-cart__icon { width: 24px; min-width: 24px; height: 24px; margin: 0; } #snackys-tpl #shop-nav .hdr-nav .to-header-cart .to-header-cart__icon svg.to-header-icon, #snackys-tpl #shop-nav .hdr-nav .to-header-cart:hover .to-header-cart__icon svg.to-header-icon, #snackys-tpl #shop-nav .hdr-nav .to-header-cart:focus .to-header-cart__icon svg.to-header-icon { fill: var(--color-white); stroke: var(--color-primary-100) !important; stroke-width: .4; paint-order: fill stroke; } #snackys-tpl .to-header-cart__label { display: none; } #snackys-tpl .to-header-cart__count { position: absolute; top: -4px; right: 0; display: flex; align-items: center; justify-content: center; align-self: auto; min-width: 16px; width: 16px; height: 16px; padding: 0; border: 0; border-radius: 50%; background: var(--color-warning); color: var(--color-primary-100); font-size: 10px; font-weight: var(--font-weight-bold); line-height: 1; } } @media (max-width: 449px) { #snackys-tpl #shop-nav > .mw-container { grid-template-columns: 30px auto 1fr; padding: 0 var(--spacing-3); column-gap: var(--spacing-4); } #snackys-tpl .to-header__logo a, #snackys-tpl .to-header__logo img { max-width: 116px; } } /**/ #snackys-tpl .to-header-clp-spacer { height: 0; overflow: hidden; pointer-events: none; } #snackys-tpl .to-header-clp { position: relative; z-index: 50; border-bottom: 1px solid rgba(150, 169, 215, .45); background: var(--color-white); box-shadow: var(--shadow-md); font-family: var(--font-family-base); } #snackys-tpl body.to-order-completion-optimized[data-page="33"] .to-header-clp { display: none !important; } #snackys-tpl body.to-order-completion-optimized[data-page="33"] #cat-w { border-bottom: 1px solid var(--color-tertiary-75); } /**/ #snackys-tpl body:not([data-page="2"]) .to-header-clp { box-shadow: inset 0 1.5px 0 0px rgba(150, 169, 215, .45), var(--shadow-md); } #snackys-tpl .to-header-clp.is-stuck { position: fixed; top: 0; right: 0; left: 0; width: 100%; } /**/ #snackys-tpl .to-header-clp__tabs { display: none; } @media (max-width: 991px) { #snackys-tpl #shop-nav { z-index: 55; } #snackys-tpl .to-header-clp.is-stuck { top: var(--to-header-height); } #snackys-tpl .to-header-clp__tabs { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; width: 100%; min-height: 32px; padding: 0 var(--spacing-2); overflow: visible; background: var(--color-primary-100); } #snackys-tpl .to-header-clp__tabs-list { display: flex; align-items: flex-end; gap: 15px; min-width: 0; padding-left: var(--spacing-2); /**/ overflow: visible; } #snackys-tpl .to-header-clp__tab { position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; margin: 0; padding: var(--spacing-1) var(--spacing-3); border: 0; border-radius: var(--border-radius-sm) var(--border-radius-sm) 0 0; background: transparent; color: var(--color-white); font-family: var(--font-family-base); font-size: var(--font-size-normal, 16px); font-weight: var(--font-weight-bold); line-height: 24.64px; white-space: nowrap; cursor: pointer; } #snackys-tpl .to-header-clp__tab.is-active { z-index: 3; background: var(--color-white); color: var(--color-primary-100); } /**/ #snackys-tpl .to-header-clp__tab.is-active::before, #snackys-tpl .to-header-clp__tab.is-active::after { content: ""; position: absolute; bottom: 0; z-index: 0; display: block; width: 6px; height: 6px; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 15'%3E%3Cpath d='M15 0L0 0L0 15A15 15 0 0 1 15 0Z' fill='%23fff'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: 6px 6px; } #snackys-tpl .to-header-clp__tab.is-active::before { right: 100%; transform: rotate(180deg); } #snackys-tpl .to-header-clp__tab.is-active::after { left: 100%; transform: rotate(180deg) scaleX(-1); } #snackys-tpl .to-header-clp__tabs-help { display: inline-flex; flex: 0 0 auto; align-items: center; align-self: center; gap: 5px; margin: 0; padding: 0; border: 0; background: transparent; color: var(--color-tertiary-50, #96a9d7); font-family: var(--font-family-base); font-size: 13.3px; font-weight: var(--font-weight-regular); line-height: 1; white-space: nowrap; cursor: pointer; } #snackys-tpl .to-header-clp__tabs-help-icon { width: 14px; height: 14px; stroke: currentColor; stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; } #snackys-tpl .to-header-clp__tabs-help:hover, #snackys-tpl .to-header-clp__tabs-help:focus { color: var(--color-white); outline: none; } #snackys-tpl .to-header-clp [data-to-clp-panel]:not(.is-clp-panel-active) { display: none !important; } #snackys-tpl .to-header-clp [data-to-clp-panel].is-clp-panel-active { display: block !important; } /**/ #snackys-tpl .to-header-clp .to-header-clp__heading-row, #snackys-tpl .to-header-clp .to-printer-selector__heading-row, #snackys-tpl .to-header-clp .to-header-saved .to-header-clp__heading-row { display: none !important; } /**/ #snackys-tpl .to-header-clp.is-compact .to-printer-selector__border-label, #snackys-tpl .to-header-clp.is-compact .to-header-saved__border-label, #snackys-tpl .to-header-clp.is-compact .to-header-clp__border-label { display: none !important; opacity: 0; visibility: hidden; } } #snackys-tpl .to-header-clp[hidden] { display: none !important; } #snackys-tpl .to-header-clp__inner { --to-header-clp-gap: var(--spacing-16); display: grid; grid-template-columns: 1fr 1fr; column-gap: var(--to-header-clp-gap); max-width: var(--to-header-container); min-height: 132px; margin: 0 auto; padding: 0 var(--spacing-16); transition: min-height .25s ease; } #snackys-tpl .to-header-clp__selector, #snackys-tpl .to-header-clp__quick { min-width: 0; transition: padding .25s ease; } #snackys-tpl .to-header-clp__selector, #snackys-tpl .to-header-clp__quick { padding: var(--spacing-6) 0; } #snackys-tpl .to-header-clp.is-compact .to-header-clp__inner { min-height: 0; } #snackys-tpl .to-header-clp.is-compact .to-header-clp__selector, #snackys-tpl .to-header-clp.is-compact .to-header-clp__quick { padding: var(--spacing-4) 0; } #snackys-tpl .to-header-clp .to-printer-selector__heading-row, #snackys-tpl .to-header-clp .to-header-clp__heading-row { overflow: hidden; max-height: 32px; opacity: 1; transition: max-height .25s ease, opacity .25s ease, margin .25s ease; } #snackys-tpl .to-header-clp.is-compact .to-printer-selector__heading-row, #snackys-tpl .to-header-clp.is-compact .to-header-clp__heading-row { max-height: 0; opacity: 0; margin-bottom: 0; pointer-events: none; } #snackys-tpl .to-printer-selector__border-label, #snackys-tpl .to-header-saved__border-label, #snackys-tpl .to-header-clp__border-label { display: none; } #snackys-tpl .to-header-clp .to-printer-selector__steps { position: relative; } #snackys-tpl .to-header-saved__box-wrap { position: relative; } #snackys-tpl .to-header-saved__row { position: relative; display: flex; align-items: stretch; gap: var(--spacing-2); width: 100%; } #snackys-tpl .to-header-saved__box { position: relative; display: flex; flex: 1 1 auto; align-items: center; justify-content: flex-start; gap: 0; min-width: 0; min-height: 42px; padding: var(--spacing-1) var(--spacing-1) var(--spacing-1) 75px; overflow: visible; border: 2px solid var(--color-success); border-radius: var(--border-radius-sm); background: var(--color-success-soft); } #snackys-tpl .to-header-saved__box.is-products-link, #snackys-tpl .to-header-saved__card { cursor: pointer; } #snackys-tpl .to-header-clp .to-header-saved__box { padding: var(--spacing-1) var(--spacing-1) var(--spacing-1) 75px; } #snackys-tpl .to-header-clp .to-printer-selector__border-label, #snackys-tpl .to-header-clp .to-header-saved__border-label, #snackys-tpl .to-header-clp .to-header-clp__border-label { position: absolute; top: 0; left: var(--spacing-2); z-index: 3; display: inline-block; margin: 0; padding: 0 var(--spacing-1); overflow: hidden; background: var(--color-white); color: var(--color-tertiary-100); font-size: var(--font-size-xs); font-weight: var(--font-weight-regular); line-height: 1; white-space: nowrap; pointer-events: none; opacity: 0; visibility: hidden; transform: translateY(-50%); transition: opacity .25s ease, visibility .25s ease; } #snackys-tpl .to-header-clp .to-header-saved__border-label { background: var(--color-success-soft); } #snackys-tpl .to-header-clp.is-compact .to-printer-selector__border-label, #snackys-tpl .to-header-clp.is-compact .to-header-saved__border-label, #snackys-tpl .to-header-clp.is-compact .to-header-clp__border-label { opacity: 1; visibility: visible; } #snackys-tpl .to-header-clp__quick { position: relative; border-left: 0; } #snackys-tpl .to-header-clp__quick::before { content: ""; position: absolute; top: 0; bottom: 0; left: calc(var(--to-header-clp-gap) / -2); width: 1px; background: var(--color-tertiary-50); } #snackys-tpl .to-header-clp__heading-row { display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-4); margin-bottom: var(--spacing-4); } #snackys-tpl .to-header-clp__heading { margin: 0; color: var(--color-primary-100); fon