#snackys-tpl .form-group label, #snackys-tpl label.control-label { font-weight: var(--font-weight-regular, 400); } #snackys-tpl body[data-page="11"] { background: var(--color-secondary-50); } #snackys-tpl body[data-page="11"] #result-wrapper { padding-bottom: 0px; } #snackys-tpl #checkout input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]), #snackys-tpl #checkout select, #snackys-tpl #checkout textarea, #snackys-tpl #checkout .to-address-search__input { font-size: var(--font-size-h6); border-width: 2px; box-shadow: var(--shadow-sm); } #snackys-tpl #checkout #orderreference { font-size: 16px; } #snackys-tpl #checkout .panel { background: var(--color-white, #fff); border: 2px solid var(--color-tertiary-50); box-shadow: var(--shadow-sm); } #snackys-tpl #checkout .row:has(> [class*="col-"] > .form-group) { margin-inline: calc(var(--spacing-4) / -2); } #snackys-tpl #checkout .row:has(> [class*="col-"] > .form-group) > [class*="col-"] { padding-inline: calc(var(--spacing-4) / 2); } #snackys-tpl #checkout fieldset.panel:has(+ #checkout_register_shipping_address_div:not(.hidden)) { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } #snackys-tpl #checkout #checkout_register_shipping_address_div.panel { margin: -2px 0 0; border-top-left-radius: 0; border-top-right-radius: 0; } #snackys-tpl #checkout .to-checkout-contact-heading { margin-bottom: 1rem; display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-3); width: 100%; } #snackys-tpl #existing-customer .to-checkout-login-heading { display: block; width: 100%; max-width: none; } #snackys-tpl #existing-customer .to-checkout-contact-heading { line-height: 1.1; display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-3); width: 100%; } #snackys-tpl #existing-customer .to-checkout-contact-actions { margin-left: auto; } #snackys-tpl #existing-customer #login_password ~ a.small { display: inline-block; margin-block: var(--spacing-2); } #snackys-tpl #checkout #create_account_data { margin-top: 1rem; } #snackys-tpl #checkout .to-checkout-account-link { display: inline-flex; align-items: center; gap: var(--spacing-1); font-size: 16px; font-weight: var(--font-weight-regular, 400); color: var(--color-neutral); } #snackys-tpl .to-checkout-contact-actions > .to-checkout-account-link, #snackys-tpl .to-checkout-contact-actions > .to-checkout-account-link:hover, #snackys-tpl .to-checkout-contact-actions > .to-checkout-account-link:focus, #snackys-tpl .to-checkout-contact-actions > .to-checkout-account-link > span { text-decoration: none !important; } #snackys-tpl #checkout .to-checkout-account-icon { flex: 0 0 1em; width: 1em; height: 1em; fill: currentColor; } #snackys-tpl #checkout .to-checkout-create-account { margin: 0; } #snackys-tpl #checkout .to-checkout-contact-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: var(--spacing-3); } #snackys-tpl #checkout .to-checkout-create-account-icon { position: relative; display: inline-flex; flex: 0 0 1em; width: 1em; height: 1em; } #snackys-tpl #checkout .to-checkout-create-account-icon > .to-checkout-account-icon { fill: none; } #snackys-tpl #checkout .to-checkout-create-account-plus, #snackys-tpl #checkout .to-checkout-guest-arrow { position: absolute; right: -.3em; bottom: -.15em; width: .85em; height: .85em; stroke: var(--color-neutral); filter: drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff); } #snackys-tpl #checkout .to-checkout-create-account[data-to-checkout-mode="guest"] .to-checkout-create-account-plus { display: none; } #snackys-tpl #checkout .to-checkout-create-account .to-checkout-guest-arrow { display: none; } #snackys-tpl #checkout .to-checkout-create-account[data-to-checkout-mode="guest"] .to-checkout-guest-arrow { display: block; } #snackys-tpl #order-confirm .row > div:has(> #panel-edit-comment) { flex: 0 0 100%; max-width: 100%; } #snackys-tpl #checkout .to-checkout-address-email { margin-block: var(--spacing-2); } #snackys-tpl #checkout .to-checkout-completed-summary { width: 100%; color: var(--color-neutral); position: relative; z-index: 1; } #snackys-tpl #checkout .to-checkout-completed-summary > .panel { margin-bottom: 0; } #snackys-tpl #checkout .c-stps > .c-stp:has(> .to-checkout-completed-summary) { padding-bottom: var(--spacing-6); } #snackys-tpl #check-billing-shipping-address .panel-body > .row { row-gap: var(--spacing-4); } #snackys-tpl #check-billing-shipping-address > .panel { position: relative; --to-checkout-badge-background: var(--color-tertiary-50); --to-checkout-badge-color: var(--color-neutral); } #snackys-tpl #check-billing-shipping-address .to-checkout-summary-contact { display: flex; align-items: center; flex-wrap: wrap; gap: var(--spacing-2); margin-bottom: var(--spacing-4); overflow-wrap: anywhere; } #snackys-tpl #check-billing-shipping-address .to-checkout-summary-email { display: inline-flex; align-items: center; gap: var(--spacing-2); max-width: 100%; padding: var(--spacing-1) var(--spacing-3); border: 1px solid var(--color-tertiary-50); border-radius: 999px; } #snackys-tpl #check-billing-shipping-address .to-checkout-summary-email > span { min-width: 0; } #snackys-tpl #check-billing-shipping-address .to-checkout-summary-email-edit { display: inline-flex; flex: 0 0 1em; color: var(--color-neutral); } #snackys-tpl #check-billing-shipping-address .to-checkout-summary-email-edit svg { width: 1em; height: 1em; fill: currentColor; } #snackys-tpl #check-billing-shipping-address .to-checkout-summary-contact-label { font-size: var(--font-size-h6); } #snackys-tpl #check-billing-shipping-address .title { font-size: var(--font-size-h6); margin-top: 0; margin-bottom: var(--spacing-3); } #snackys-tpl #check-billing-shipping-address :is(#billing-address, #shipping-address) > a { margin-top: var(--spacing-2); } #snackys-tpl #check-billing-shipping-address :is(#billing-address, #shipping-address) { min-width: 0; overflow-wrap: anywhere; } #snackys-tpl #checkout #panel-edit-comment textarea { font-size: 16px; } #snackys-tpl .to-checkout-confirmation-legal { margin-top: 0; } #snackys-tpl #checkout .to-checkout-newsletter-optin .control-label { display: flex; align-items: center; gap: var(--spacing-2); font-size: 16px; } #snackys-tpl .to-checkout-confirm, #snackys-tpl .to-checkout-next { font-size: var(--font-size-h5); display: flex; align-items: center; justify-content: center; gap: var(--spacing-2); } #snackys-tpl #complete-order-button .to-checkout-order-check { display: none; } #snackys-tpl .to-checkout-confirm:disabled .to-checkout-button-arrows { display: none; } #snackys-tpl .to-checkout-button-arrows { flex: 0 0 24px; width: 24px; height: 24px; fill: none !important; } #snackys-tpl .to-checkout-button-arrows path { fill: none !important; animation: to-checkout-button-chevron 1.15s ease-in-out infinite; } #snackys-tpl .to-checkout-button-arrows path:last-child { animation-delay: .18s; } @keyframes to-checkout-button-chevron { 0%, 100% { opacity: 0; transform: translateX(-2px); } 40%, 60% { opacity: 1; transform: translateX(0); } } @media (prefers-reduced-motion: reduce) { #snackys-tpl .to-checkout-button-arrows path { animation: none; } } #snackys-tpl #complete-order-button svg { flex: 0 0 24px; width: 24px; height: 24px; fill: none !important; } #snackys-tpl #complete-order-button svg polyline { fill: none !important; } #snackys-tpl .to-checkout-order-action { margin-top: var(--spacing-4); } #snackys-tpl #check-payment-shipping > .panel > .panel-body { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: var(--spacing-6); } #snackys-tpl #check-payment-shipping > .panel > .panel-body > hr { display: none; } #snackys-tpl #check-payment-shipping #shipping-method, #snackys-tpl #check-payment-shipping #payment-method { min-width: 0; overflow-wrap: anywhere; } #snackys-tpl #check-payment-shipping :is(#shipping-method, #payment-method) > p:first-child { margin-top: 0; font-size: var(--font-size-h6); } #snackys-tpl #shipping-method .to-checkout-delivery-cost { margin-bottom: 0; } #snackys-tpl #shipping-method .to-checkout-delivery-cost + p { margin-top: 0; } #snackys-tpl #panel-edit-coupon { margin: var(--spacing-4) 0; } #snackys-tpl #panel-edit-coupon form, #snackys-tpl #panel-edit-coupon .input-group { width: 100%; } #snackys-tpl #panel-edit-coupon .input-group { display: flex; } #snackys-tpl #panel-edit-coupon .input-group > .form-control { flex: 1 1 0; min-width: 0; width: 0; border-width: 2px; } #snackys-tpl #panel-edit-coupon .input-group-btn { display: block; flex: 0 0 auto; width: auto; } #snackys-tpl #panel-edit-coupon .to-checkout-coupon-submit { display: inline-flex; align-items: center; gap: var(--spacing-1); height: 100%; background: var(--color-neutral); border-color: var(--color-neutral); color: var(--color-white, #fff); } #snackys-tpl #panel-edit-coupon .to-checkout-coupon-submit svg { position: relative; top: 1px; flex: 0 0 1em; width: 1em; height: 1em; color: var(--color-white, #fff); fill: none !important; } #snackys-tpl #checkout .form-group > div:last-child > div { border-bottom: 0; } #snackys-tpl #checkout .c-stps > .c-stp > .flx-ac { gap: var(--spacing-3); } #snackys-tpl #checkout .c-stps > .c-stp { --to-checkout-step-color: var(--color-neutral); position: relative; } #snackys-tpl #checkout .c-stps > .c-stp > a.flx-ac > .img-ct.icon { display: none; } #snackys-tpl #checkout .c-stps.first > .c-stp:not(.active) { --to-checkout-step-color: color-mix(in srgb, var(--color-neutral) 50%, white); } #snackys-tpl #checkout .c-stps.first > .c-stp:not(.active):hover, #snackys-tpl #checkout .c-stps.first > .c-stp:not(.active):focus-within { --to-checkout-step-color: var(--color-neutral); } #snackys-tpl #checkout .c-stps > .c-stp:not(:last-child)::before { content: ''; position: absolute; left: calc(var(--spacing-8) / 2 - 1.5px); top: calc(var(--spacing-8) / 2); bottom: calc(var(--spacing-8) / -2); width: 3px; background: var(--to-checkout-step-color); transition: background-color .2s ease; pointer-events: none; } #snackys-tpl #checkout .c-stps.last > .c-stp { --to-checkout-step-color: color-mix(in srgb, var(--color-neutral) 50%, white); } #snackys-tpl #checkout .c-stps.last > .c-stp:first-child::after { content: ''; position: absolute; top: calc(-1 * var(--spacing-6)); left: calc(var(--spacing-8) / 2 - 1.5px); width: 3px; height: calc(var(--spacing-6) + var(--spacing-8) / 2); background: var(--to-checkout-step-color); -webkit-mask-image: linear-gradient(to bottom, transparent, #000); mask-image: linear-gradient(to bottom, transparent, #000); pointer-events: none; } #snackys-tpl #checkout .c-stps.last > .c-stp > .flx-ac { opacity: 1; } #snackys-tpl #checkout .c-stps.last > .c-stp:not(:last-child) > .flx-ac { padding-bottom: var(--spacing-6); } #snackys-tpl #checkout .c-stps.last .c-stp h2[data-step-number] { color: var(--to-checkout-step-color); } #snackys-tpl #checkout .c-stps.last .c-stp h2[data-step-number]::before { background: var(--to-checkout-step-color); } #snackys-tpl #checkout .c-stps .c-stp h2[data-step-number] { display: flex; align-items: center; gap: var(--spacing-3); min-width: 0; } #snackys-tpl #checkout .c-stps .c-stp h2[data-step-number]::before { content: attr(data-step-number); position: relative; z-index: 1; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 var(--spacing-8); width: var(--spacing-8); height: var(--spacing-8); border-radius: 50%; background: var(--color-primary-100); color: var(--color-white, #fff); font-size: var(--font-size-h6); font-weight: var(--font-weight-bold, 700); line-height: 1; } #snackys-tpl #checkout .c-stps.first > .c-stp:not(.active) h2 { color: var(--to-checkout-step-color); transition: color .2s ease; } #snackys-tpl #checkout .c-stps.first > .c-stp:not(.active) h2[data-step-number]::before { content: ''; background-color: var(--to-checkout-step-color); transition: background-color .2s ease; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"); background-position: center; background-repeat: no-repeat; background-size: 65% 65%; } #snackys-tpl #checkout .c-stps.first > .c-stp:not(.active) h2.to-checkout-step-completed::before { display: none; } #snackys-tpl .to-checkout-step-check { position: relative; z-index: 1; display: block; flex: 0 0 var(--spacing-8); width: var(--spacing-8); height: var(--spacing-8); overflow: visible; color: var(--to-checkout-step-color); } #snackys-tpl .to-checkout-step-check__group { transform-origin: 66.5px 66.5px; animation: to-checkout-check-pulse 3.35s ease-in-out both; } #snackys-tpl .to-checkout-step-check__fill { fill: currentColor; animation: to-checkout-check-fill 3.35s ease both; } #snackys-tpl .to-checkout-step-check__cover { fill: var(--color-secondary-50); transform: scale(0); transform-origin: 66.5px 66.5px; animation: to-checkout-check-cover 3.35s ease-in-out both; } #snackys-tpl .to-checkout-step-check__outline { stroke: currentColor; stroke-width: 4; stroke-dasharray: 345.576px 345.576px; animation: to-checkout-check-outline 3.35s ease-in-out both; } #snackys-tpl .to-checkout-step-check__mark { stroke: var(--color-white, #fff); stroke-width: 10; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 75px 75px; animation: to-checkout-check-mark 3.35s cubic-bezier(.65, 0, 1, 1) both; } #snackys-tpl #checkout .c-stps.first > .c-stp:not(.active):has(~ .c-stp:not(.active)) .to-checkout-step-check :is(g, circle, polyline) { animation: none; } @keyframes to-checkout-check-outline { 0% { stroke: var(--color-success); stroke-dasharray: 0 345.576px; } 12%, 65% { stroke: var(--color-success); stroke-dasharray: 345.576px 345.576px; } 100% { stroke: currentColor; stroke-dasharray: 345.576px 345.576px; } } @keyframes to-checkout-check-fill { 0%, 65% { fill: var(--color-success); } 100% { fill: currentColor; } } @keyframes to-checkout-check-cover { 0%, 10.5% { transform: scale(1); } 21%, 100% { transform: scale(0); } } @keyframes to-checkout-check-mark { 0%, 24% { stroke-dasharray: 0 75px; } 34%, 100% { stroke-dasharray: 75px 75px; } } @keyframes to-checkout-check-pulse { 0%, 30.7%, 40.3%, 100% { transform: scale(1); } 35.5% { transform: scale(1.09); } } @media (prefers-reduced-motion: reduce) { #snackys-tpl .to-checkout-step-check :is(g, circle, polyline) { animation: none; } } #snackys-tpl #checkout-shipping-payment > .form-group { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--spacing-3); margin-bottom: 0; } /**/ #snackys-tpl #checkout-shipping-payment.has-gls-quickfix > .form-group:not(:has(.to-shipping-choice--gls input:checked)) .to-shipping-choice--gls ~ .to-shipping-choice--gls, #snackys-tpl #checkout-shipping-payment.has-gls-quickfix > .form-group:has(.to-shipping-choice--gls input:checked) .to-shipping-choice--gls:not(:has(input:checked)) { display: none; } #snackys-tpl #checkout-shipping-payment .payship-option { position: relative; min-width: 0; padding: 0; border: 0; border-radius: var(--border-radius-sm); background: var(--color-white); --to-shipping-choice-border: var(--color-tertiary-50); overflow: hidden; } #snackys-tpl #checkout-shipping-payment .payship-option::after { content: ''; position: absolute; inset: 0; z-index: 2; border: 2px solid var(--to-shipping-choice-border); border-radius: inherit; pointer-events: none; } #snackys-tpl #checkout-shipping-payment .payship-option:has(input:checked) { background: var(--color-white); --to-shipping-choice-border: var(--color-primary-100); } #snackys-tpl #checkout-shipping-payment .payship-option > label { display: grid; grid-template-columns: var(--spacing-12) minmax(0, 1fr) 100px; grid-template-rows: auto; grid-template-areas: "radio content logo"; align-items: stretch; gap: 0; width: 100%; height: auto; padding: 0; text-align: left; overflow: hidden; } #snackys-tpl #checkout-shipping-payment .payship-option .stc-input { grid-area: radio; position: relative; display: grid; place-items: center; width: 100%; height: 100%; min-height: 0; margin: 0; z-index: 1; border-right: 2px solid var(--color-tertiary-50); background: var(--color-secondary-50); } #snackys-tpl #checkout-shipping-payment .payship-option:has(input:checked) .stc-input { background: var(--color-primary-100); } #snackys-tpl #checkout-shipping-payment .to-shipping-choice-check { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border: 2px solid var(--color-tertiary-50); border-radius: var(--border-radius-xs); background: var(--color-white); color: transparent; } #snackys-tpl #checkout-shipping-payment input:checked + .to-shipping-choice-check { border-color: var(--color-primary-100); background: var(--color-primary-100); color: var(--color-white, #fff); } #snackys-tpl #checkout-shipping-payment .to-shipping-choice-check svg { width: 16px; height: 16px; } #snackys-tpl #checkout-shipping-payment .payship-option .payship-img { grid-area: logo; display: flex; align-self: stretch; justify-self: stretch; align-items: center; justify-content: center; min-width: 0; min-height: 0; width: 100%; height: 100%; margin: 0; padding: var(--spacing-4) var(--spacing-4) var(--spacing-4) 0; border-radius: var(--border-radius-sm); background: var(--color-white); overflow: hidden; } #snackys-tpl #checkout-shipping-payment .to-shipping-choice-logo img { display: block; width: 100%; max-width: 65px; height: 100%; min-height: 0; object-fit: contain; border-radius: var(--border-radius-sm); } #snackys-tpl #checkout-shipping-payment .payship-option .payship-content { grid-area: content; min-width: 0; max-width: 100%; align-self: center; padding: var(--spacing-4); background: var(--color-white); font-size: 16px; overflow-wrap: anywhere; } #snackys-tpl #checkout-shipping-payment .payship-content > strong { display: flex; flex-direction: column; align-items: flex-start; gap: var(--spacing-1); font-size: 16px; font-weight: var(--font-weight-regular); white-space: nowrap; } #snackys-tpl #checkout-shipping-payment .payship-option:has(input:checked) .payship-content > strong { font-weight: var(--font-weight-bold, 700); } #snackys-tpl #checkout-shipping-payment .payship-content .badge { top: auto; margin: 0; font-size: 16px; } #snackys-tpl #checkout-shipping-payment .payship-content .to-checkout-shipping-free { display: block; color: var(--color-success); font-size: 16px; font-weight: var(--font-weight-bold, 700); } #snackys-tpl #checkout-shipping-payment .payship-content .to-checkout-shipping-delivery { font-size: var(--font-size-xs, 13.3px); font-weight: var(--font-weight-normal, 400); } #snackys-tpl #checkout-cart .to-checkout-shipping-free-text, #snackys-tpl #shipping-method .to-checkout-shipping-free-text { color: var(--color-success); font-weight: var(--font-weight-bold, 700); } #snackys-tpl #checkout #fieldset-payment { position: relative; border: 3px solid var(--color-success); padding-top: var(--spacing-6); } #snackys-tpl .to-checkout-secure-payment, #snackys-tpl .to-checkout-summary-customer-badge { position: absolute; top: 0; right: 0; display: inline-flex; align-items: center; gap: var(--spacing-1); padding: var(--spacing-1) var(--spacing-3); border-radius: 0 0 0 var(--border-radius-sm); background: var(--to-checkout-badge-background, var(--color-success)); color: var(--to-checkout-badge-color, var(--color-white, #fff)); font-size: 16px; font-weight: var(--font-weight-bold, 700); line-height: 1.5; } #snackys-tpl .to-checkout-secure-payment > svg { position: relative; top: -0.05em; width: .85em; height: .85em; flex: 0 0 .85em; fill: currentColor; } #snackys-tpl .to-checkout-secure-payment::before, #snackys-tpl .to-checkout-secure-payment::after, #snackys-tpl .to-checkout-summary-customer-badge::before, #snackys-tpl .to-checkout-summary-customer-badge::after { content: ''; position: absolute; width: 8px; height: 8px; background: var(--to-checkout-badge-background, var(--color-success)); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M0 8H8V0H7A7 7 0 0 1 0 7Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M0 8H8V0H7A7 7 0 0 1 0 7Z'/%3E%3C/svg%3E") center / contain no-repeat; pointer-events: none; } #snackys-tpl .to-checkout-secure-payment::before, #snackys-tpl .to-checkout-summary-customer-badge::before { top: -1px; right: calc(100% - 1px); transform: rotate(270deg); } #snackys-tpl .to-checkout-secure-payment::after, #snackys-tpl .to-checkout-summary-customer-badge::after { top: calc(100% - 1px); right: -1px; transform: rotate(270deg); } #snackys-tpl #fieldset-payment .to-checkout-payment-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--spacing-3); } #snackys-tpl #fieldset-payment .checkout-payment-method { width: 100%; min-width: 0; max-width: none; padding: 0; border: 2px solid var(--color-tertiary-50); border-bottom: 2px solid var(--color-tertiary-50) !important; border-radius: var(--border-radius-sm); background: var(--color-white); overflow: hidden; } #snackys-tpl #fieldset-payment .checkout-payment-method:has(input:checked) { border-color: var(--color-primary-100); border-bottom-color: var(--color-primary-100) !important; } #snackys-tpl #fieldset-payment .checkout-payment-method .custom-control { display: block; width: 100%; height: 100%; margin: 0; padding: 0; } #snackys-tpl #fieldset-payment .checkout-payment-method .custom-control-label { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: 1fr auto; grid-template-areas: "content" "check"; align-items: center; gap: 0; width: 100%; height: 100%; padding: 0; text-align: center; } #snackys-tpl #fieldset-payment .checkout-payment-method .custom-control-label::before, #snackys-tpl #fieldset-payment .checkout-payment-method .custom-control-label::after { display: none; } #snackys-tpl #fieldset-payment .checkout-payment-method--preview .custom-control-label { cursor: default; } #snackys-tpl #fieldset-payment .to-payment-choice-content { position: relative; grid-area: content; display: flex; flex-direction: column; align-items: center; gap: var(--spacing-3); min-width: 0; padding: var(--spacing-3) var(--spacing-4); } #snackys-tpl #fieldset-payment .to-payment-choice-info { position: absolute; top: 0; left: 0; z-index: 2; display: inline-flex; align-items: center; justify-content: center; margin: 0; padding: var(--spacing-1); border: 0; border-radius: 0 0 var(--border-radius-sm) 0; background: var(--color-tertiary-50); color: var(--color-white, #fff); line-height: 1.1; cursor: pointer; } #snackys-tpl #fieldset-payment .checkout-payment-method:has(input:checked) .to-payment-choice-info { background: var(--color-primary-100); } #snackys-tpl #fieldset-payment .to-payment-choice-info > svg { position: relative; top: -1px; left: -1px; display: block; width: 15px; height: 15px; stroke-width: 1.75; color: var(--color-neutral); } #snackys-tpl #fieldset-payment .checkout-payment-method:has(input:checked) .to-payment-choice-info > svg { color: var(--color-white, #fff); } #snackys-tpl #fieldset-payment .to-payment-choice-info::before, #snackys-tpl #fieldset-payment .to-payment-choice-info::after { content: ''; position: absolute; width: 8px; height: 8px; background: inherit; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M0 8H8V0H7A7 7 0 0 1 0 7Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath d='M0 8H8V0H7A7 7 0 0 1 0 7Z'/%3E%3C/svg%3E") center / contain no-repeat; transform: scaleX(-1) rotate(270deg); pointer-events: none; } #snackys-tpl #fieldset-payment .to-payment-choice-info::before { top: -1px; left: calc(100% - 1px); } #snackys-tpl #fieldset-payment .to-payment-choice-info::after { top: calc(100% - 1px); left: -1px; } #snackys-tpl .to-payment-info-modal { width: min(680px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); margin: auto; padding: var(--spacing-6); border: 2px solid var(--color-tertiary-50); border-radius: var(--border-radius-sm); background: var(--color-white, #fff); color: var(--color-neutral); box-shadow: var(--shadow-sm); overflow-y: auto; text-align: left; } #snackys-tpl .to-payment-info-modal::backdrop { background: rgb(0 0 0 / 45%); } #snackys-tpl .to-payment-info-modal h2 { margin: 0 0 var(--spacing-4); padding-right: 32px; font-size: var(--font-size-h5); } #snackys-tpl .to-payment-info-modal__description { margin-bottom: var(--spacing-4); font-size: 16px; line-height: 1.5; } #snackys-tpl .to-payment-info-modal__close { position: absolute; top: var(--spacing-3); right: var(--spacing-3); display: inline-flex; align-items: center; justify-content: center; padding: var(--spacing-2); margin: 0; border: 0; background: transparent; color: var(--color-neutral); cursor: pointer; } #snackys-tpl .to-payment-info-modal__close > svg { display: block; width: 20px; height: 20px; } #snackys-tpl #fieldset-payment .to-payment-choice-logo { --to-payment-logo-width: 115px; --to-payment-logo-height: 35px; --to-payment-logo-border: 0; --to-payment-logo-radius: 0; --to-payment-logo-overflow: visible; --to-payment-logo-scale-paypal: 1; --to-payment-logo-scale-sepa: 1; --to-payment-logo-scale-cards: 1; --to-payment-logo-scale-klarna: 1; --to-payment-logo-scale-google-pay: 0.8; --to-payment-logo-scale-prepayment: .7; --to-payment-logo-scale-invoice: 1; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: var(--spacing-1); width: 100%; min-width: 0; } #snackys-tpl #fieldset-payment .to-payment-choice-logo:empty { display: none; } #snackys-tpl #fieldset-payment .to-payment-choice-logo--paypal { --to-payment-logo-scale: var(--to-payment-logo-scale-paypal); } #snackys-tpl #fieldset-payment .to-payment-choice-logo--prepayment { --to-payment-logo-scale: var(--to-payment-logo-scale-prepayment); } #snackys-tpl #fieldset-payment .to-payment-choice-logo--invoice { --to-payment-logo-scale: var(--to-payment-logo-scale-invoice); } #snackys-tpl #fieldset-payment .to-payment-choice-logo--sepa { --to-payment-logo-scale: var(--to-payment-logo-scale-sepa); } #snackys-tpl #fieldset-payment .to-payment-choice-logo--cards { --to-payment-logo-width: 160px; --to-payment-logo-scale: var(--to-payment-logo-scale-cards); } #snackys-tpl #fieldset-payment .to-payment-choice-logo--klarna { --to-payment-logo-scale: var(--to-payment-logo-scale-klarna); } #snackys-tpl #fieldset-payment .to-payment-choice-logo--google-pay { --to-payment-logo-scale: var(--to-payment-logo-scale-google-pay); } #snackys-tpl #fieldset-payment .to-payment-choice-logo img, #snackys-tpl #fieldset-payment .to-payment-choice-logo svg { display: block; width: 100%; height: 100% !important; max-width: 100%; max-height: 100%; margin: 0; object-fit: contain; object-position: center; transform: scale(var(--to-payment-logo-scale, 1)); transform-origin: center; } #snackys-tpl #fieldset-payment .to-payment-choice-marquee { display: block; width: var(--to-payment-logo-width); max-width: 100%; height: var(--to-payment-logo-height); overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent, #000 8px, #000 calc(100% - 8px), transparent); mask-image: linear-gradient(to right, transparent, #000 8px, #000 calc(100% - 8px), transparent); } #snackys-tpl #fieldset-payment .to-payment-choice-marquee__track { display: flex; width: max-content; height: 100%; animation: to-payment-logo-marquee 8s linear infinite; } #snackys-tpl #fieldset-payment .to-payment-choice-marquee__group { display: flex; flex-shrink: 0; align-items: center; gap: var(--spacing-2); height: 100%; padding-right: var(--spacing-2); } #snackys-tpl #fieldset-payment .to-payment-choice-marquee .to-payment-choice-logo-card { flex-basis: 50px; width: 50px; height: 100%; border-radius: var(--border-radius-xs); overflow: hidden; } #snackys-tpl #fieldset-payment .to-payment-choice-marquee .to-payment-choice-logo-card--visa-checkout { padding: 6px; background: #1434cb; } #snackys-tpl #fieldset-payment .to-payment-choice-marquee .to-payment-choice-logo-card--american-express { background: var(--color-secondary-50); } #snackys-tpl #fieldset-payment .to-payment-choice-marquee .to-payment-choice-logo-card--mastercard-checkout { background: #232323; } #snackys-tpl #fieldset-payment .to-payment-choice-marquee .to-payment-choice-logo-card--maestro-checkout { background: #eee; } #snackys-tpl #fieldset-payment .to-payment-choice-marquee img { object-position: center; } @keyframes to-payment-logo-marquee { to { transform: translateX(-50%); } } @media (prefers-reduced-motion: reduce) { #snackys-tpl #fieldset-payment .to-payment-choice-marquee__track { animation: none; } } #snackys-tpl #fieldset-payment .checkout-payment-method .pay-wrap { width: 100%; min-width: 0; overflow-wrap: anywhere; } #snackys-tpl #fieldset-payment .checkout-payment-method-note { display: none; } #snackys-tpl #fieldset-payment .checkout-payment-method .title { display: block; font-size: 16px; line-height: 1; } #snackys-tpl #fieldset-payment .checkout-payment-method:has(input:checked) .title { font-weight: var(--font-weight-bold, 700); } #snackys-tpl #fieldset-payment .checkout-payment-method-note small { font-size: 13.3px; } #snackys-tpl #fieldset-payment .to-payment-choice-footer { grid-area: check; align-self: stretch; display: flex; align-items: center; justify-content: center; width: 100%; margin: 0; padding: var(--spacing-2) var(--spacing-3); border-top: 2px solid var(--color-tertiary-50); background: var(--color-secondary-50); } #snackys-tpl #fieldset-payment .checkout-payment-method:has(input:checked) .to-payment-choice-footer { background: var(--color-primary-100); } #snackys-tpl #fieldset-payment .to-payment-choice-check { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 20px; width: 20px; height: 20px; border: 2px solid var(--color-tertiary-50); border-radius: var(--border-radius-xs); background: var(--color-white); color: transparent; } #snackys-tpl #fieldset-payment .to-payment-choice-check svg { width: 16px; height: 16px; } #snackys-tpl #fieldset-payment .checkout-payment-method:has(input:checked) .to-payment-choice-check { border-color: var(--color-primary-100); background: var(--color-primary-100); color: var(--color-white, #fff); } @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) { #snackys-tpl #checkout-shipping-payment .payship-option, #snackys-tpl #fieldset-payment .checkout-payment-method { transition: transform 180ms ease; } #snackys-tpl #checkout-shipping-payment .payship-option:hover, #snackys-tpl #fieldset-payment .checkout-payment-method:hover { transform: scale(1.015); } } @media (max-width: 575px) { #snackys-tpl #fieldset-payment .to-checkout-payment-options { grid-template-columns: minmax(0, 1fr); } } #snackys-tpl #checkout fieldset + fieldset, #snackys-tpl #checkout :is(#form-register, #neukunde) .panel-wrap > fieldset.panel ~ fieldset.panel { margin-top: 1em; } #snackys-tpl #checkout #form-register > .text-right:has(> .to-checkout-confirm) { margin-top: 1em; } #snackys-tpl #checkout .to-checkout-required-info { margin: var(--spacing-3) 0; } #snackys-tpl #checkout .to-checkout-required-info--address { margin: var(--spacing-2) 0 0; } #snackys-tpl .form-group:has(> .form-control, > select, > textarea) { margin-top: var(--spacing-3, 12px); } #snackys-tpl .form-group:has(> .form-control, > select, > textarea) > label:not(.sr-only):not([hidden]) { position: absolute; top: 0; left: var(--spacing-3, 12px); z-index: 2; display: inline-block; width: auto; max-width: calc(100% - 24px); margin: 0; padding: 0 var(--spacing-1, 4px); overflow: hidden; background: var(--inp-b, var(--color-white, #fff)); color: var(--color-neutral, #242424); font-size: var(--font-size-xs, 13px); font-weight: var(--font-weight-regular, 400); line-height: 1; white-space: nowrap; text-overflow: ellipsis; pointer-events: none; transform: translateY(-50%); } #snackys-tpl #checkout .to-floating-label > label:not(.sr-only):not([hidden]) { transition: top .16s ease, font-size .16s ease, background-color .16s ease; } #snackys-tpl #checkout .to-floating-label:not(:focus-within):not(:has(> input:autofill)):is( :has(> input:placeholder-shown), :has(> textarea:placeholder-shown), :has(> select > option[value=""]:checked), :has(> .to-address-search__input:empty), :has(> .to-address-search-modal__trigger:not(.has-value)) ) > label:not(.sr-only):not([hidden]) { top: calc(var(--to-floating-label-padding-y, .75rem) + .75em + 2px); background: transparent; font-size: var(--font-size-h6); } #snackys-tpl .apply-coupon.panel-body .form-group, #snackys-tpl .apply-coupon.panel-body .input-group, #snackys-tpl #shipping-estimate-form .form-inline, #snackys-tpl #shipping-estimate-form .form-group, #snackys-tpl #shipping-estimate-form .form-inline > .form-control, #snackys-tpl #shipping-estimate-form .input-group { width: 100%; max-width: 100%; } #snackys-tpl .apply-coupon.panel-body .input-group, #snackys-tpl #shipping-estimate-form .input-group { display: flex; flex-wrap: nowrap; align-items: stretch; } #snackys-tpl .apply-coupon.panel-body .input-group > .form-control, #snackys-tpl #shipping-estimate-form .input-group > .form-control { flex: 1 1 auto; width: auto; min-width: 0; max-width: none; } #snackys-tpl .apply-coupon.panel-body .input-group-btn, #snackys-tpl #shipping-estimate-form .input-group-btn { flex: 0 0 auto; width: auto; } #snackys-tpl .btn:hover, #snackys-tpl .btn:focus, #snackys-tpl .btn:focus-visible, #snackys-tpl .btn:active, #snackys-tpl .consent-btn:hover, #snackys-tpl .consent-btn:focus { box-shadow: none; } #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm), #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):visited { background: var(--color-primary-100) !important; border-color: var(--color-primary-100) !important; color: var(--color-white) !important; } #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm) svg { fill: var(--color-white) !important; } #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):hover, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):focus, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):focus-visible { background: var(--color-primary-75) !important; border-color: var(--color-primary-75) !important; color: var(--color-white) !important; } #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):hover svg, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):focus svg, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):focus-visible svg { fill: var(--color-white) !important; } #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):active, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm).active, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):active:focus, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm).active:focus, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm).show { background: var(--color-primary-100) !important; border-color: var(--color-primary-100) !important; color: var(--color-white) !important; } #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):active svg, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm).active svg, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm).show svg { fill: var(--color-white) !important; } #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm):disabled, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm).disabled, #snackys-tpl .btn.btn-primary:not(.sn-addBasket):not(.to-product-card__add):not(.to-crossselling-card__add):not(.to-stck-bskt__submit):not(.to-cart-checkout):not(.to-checkout-confirm)[disabled] { background: var(--color-primary-50) !important; border-color: var(--color-primary-50) !important; color: var(--color-white) !important; opacity: 0.7; } #snackys-tpl .sn-addBasket, #snackys-tpl .to-pdp__basket .submit, #snackys-tpl #stck-bskt-add, #snackys-tpl .to-stck-bskt__submit, #snackys-tpl .to-product-card__add, #snackys-tpl .to-crossselling-card__add, #snackys-tpl .to-header-saved__products, #snackys-tpl .to-search-cart, #snackys-tpl .to-cart-checkout, #snackys-tpl .to-checkout-confirm { --btn-pr-b: var(--color-success); --btn-pr-r: var(--color-success); --btn-pr-t: var(--color-white); --btn-pr-b-h: var(--color-success-hover); --btn-pr-r-h: var(--color-success-hover); --btn-pr-t-h: var(--color-white); background: var(--color-success) !important; border-color: var(--color-success) !important; color: var(--color-white) !important; } #snackys-tpl .sn-addBasket:hover, #snackys-tpl .sn-addBasket:focus, #snackys-tpl .sn-addBasket:focus-visible, #snackys-tpl .to-pdp__basket .submit:hover, #snackys-tpl .to-pdp__basket .submit:focus, #snackys-tpl .to-pdp__basket .submit:focus-visible, #snackys-tpl .to-stck-bskt__submit:hover, #snackys-tpl .to-stck-bskt__submit:focus, #snackys-tpl .to-stck-bskt__submit:focus-visible, #snackys-tpl .to-product-card__add:hover, #snackys-tpl .to-product-card__add:focus, #snackys-tpl .to-product-card__add:focus-visible, #snackys-tpl .to-crossselling-card__add:hover, #snackys-tpl .to-crossselling-card__add:focus, #snackys-tpl .to-crossselling-card__add:focus-visible, #snackys-tpl .to-header-saved__products:hover, #snackys-tpl .to-header-saved__products:focus, #snackys-tpl .to-header-saved__products:focus-visible, #snackys-tpl .to-search-cart:hover, #snackys-tpl .to-search-cart:focus, #snackys-tpl .to-search-cart:focus-visible, #snackys-tpl .to-cart-checkout:hover, #snackys-tpl .to-cart-checkout:focus, #snackys-tpl .to-cart-checkout:focus-visible, #snackys-tpl .to-checkout-confirm:hover, #snackys-tpl .to-checkout-confirm:focus, #snackys-tpl .to-checkout-confirm:focus-visible { background: var(--color-success-hover) !important; border-color: var(--color-success-hover) !important; color: var(--color-white) !important; } #snackys-tpl .sn-addBasket:active, #snackys-tpl .sn-addBasket.active, #snackys-tpl .to-pdp__basket .submit:active, #snackys-tpl .to-pdp__basket .submit.active, #snackys-tpl .to-stck-bskt__submit:active, #snackys-tpl .to-stck-bskt__submit.active, #snackys-tpl .to-product-card__add:active, #snackys-tpl .to-product-card__add.active, #snackys-tpl .to-crossselling-card__add:active, #snackys-tpl .to-crossselling-card__add.active, #snackys-tpl .to-header-saved__products:active, #snackys-tpl .to-search-cart:active, #snackys-tpl .to-cart-checkout:active, #snackys-tpl .to-checkout-confirm:active, #snackys-tpl .to-checkout-confirm.active { background: var(--color-success) !important; border-color: var(--color-success) !important; color: var(--color-white) !important; } #snackys-tpl { --succ-b: var(--color-success-soft, #e5f7ea); --succ-r: var(--color-success, #00b831); --succ-t: var(--color-success-text, #00671c); } #snackys-tpl .alert-success { background: var(--color-success-soft, #e5f7ea); border-color: var(--color-success, #00b831); color: var(--color-success-text, #00671c); } #snackys-tpl .alert-success hr { border-top-color: var(--color-success, #00b831); } #snackys-tpl .alert-success .alert-link, #snackys-tpl .alert-success a:not(.btn) { color: var(--color-success-text, #00671c); } #snackys-tpl .bskt .qty-wrapper, #snackys-tpl .bskt .qty-wrapper .panel-body, #snackys-tpl .bskt .form-inline.flx-je, #snackys-tpl .bskt .choose_quantity { display: flex; justify-content: flex-end; width: auto; max-width: none; margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; } #snackys-tpl .bskt .qty-btns { display: grid; grid-template-columns: 28px 36px 28px; width: 92px; height: 40px; overflow: hidden; border: 2px solid var(--color-tertiary-50); border-radius: var(--border-radius-sm, 8px); } #snackys-tpl .bskt .qty-btns .btn, #snackys-tpl .bskt .qty-btns input { min-width: 0; height: 100%; margin: 0; padding: 0; color: var(--color-neutral, #242424); background: var(--color-white, #fff); border: 0; border-radius: 0; box-shadow: none; } #snackys-tpl .bskt .qty-btns .btn { display: flex; align-items: center; justify-content: center; } #snackys-tpl .bskt .qty-btns .btn svg { display: block; flex: 0 0 auto; width: 14px; height: 14px; fill: none; stroke: currentColor; } #snackys-tpl .bskt .qty-btns .qty-sub svg { transform: translateX(1px); } #snackys-tpl .bskt .qty-btns .qty-add svg { transform: translateX(-1px); } #snackys-tpl .bskt .qty-btns .qty-sub:disabled { opacity: 0.4; pointer-events: none; } #snackys-tpl .bskt .qty-btns input { border-right: 2px solid var(--color-tertiary-50); border-left: 2px solid var(--color-tertiary-50); font-size: 16px; font-weight: var(--font-weight-bold, 700); line-height: 1; text-align: center !important; -moz-appearance: textfield; } #snackys-tpl .bskt .qty-btns input::-webkit-inner-spin-button, #snackys-tpl .bskt .qty-btns input::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; } #snackys-tpl select { padding-right: 2.75rem; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23242424' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 0.85rem center; background-size: 20px 20px; } #snackys-tpl .to-chevron { display: block; flex: 0 0 20px; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s ease; } #consent-banner { max-width: var(--to-header-container, 1504px) !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; border: 2px solid var(--color-tertiary-75); box-shadow: 0 -20px 20px -15px rgba(0, 0, 0, .1); } #consent-manager { bottom: 0 !important; } #consent-banner .to-consent-title { display: flex; align-items: center; gap: var(--spacing-2); } #consent-banner .to-consent-title__icon { display: block; flex: 0 0 1em; width: 1em; height: 1em; fill: currentColor; } #consent-manager > .to-consent-backdrop { display: none; position: fixed; bottom: 0; left: 0; width: calc(100vw * (1 + var(--page-zoom, 0))); height: calc(75dvh * (1 + var(--page-zoom, 0))); background: #000; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); z-index: -1; -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 85%); mask-image: linear-gradient(to bottom, transparent 0%, black 85%); animation: fadeInConsent 500ms ease-in-out forwards; } #consent-manager.active:not(.mini):has(> #consent-banner:not(.consent-hidden)) > .to-consent-backdrop { display: block; } #consent-banner.wiggle { animation: consentWiggle 400ms ease-in-out; } @keyframes consentWiggle { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-8px); } 40% { transform: translateX(8px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(4px); } } @keyframes fadeInConsent { from { opacity: 0; } to { opacity: 1; } } @media (prefers-reduced-motion: reduce) { #consent-manager > .to-consent-backdrop, #consent-banner.wiggle { animation: none; } } #consent-banner-btn-all, #consent-manager .consent-btn-tertiary { background: var(--csm-btn-a-b); border: 1px solid var(--csm-btn-a-r); color: var(--csm-btn-a-l); } #consent-manager .consent-btn-tertiary, #consent-manager .consent-btn-tertiary:active { background: #022594; border: 1px solid #022594; color: var(--csm-btn-a-l); } #consent-manager .consent-btn-tertiary:hover, #consent-manager .consent-btn-tertiary:focus { background: var(--color-primary-75) !important; border: 1px solid var(--color-primary-75) !important; color: var(--csm-btn-a-l); } .consent-accept + div { display: none !important; } .consent-accept ~ div { width: 100% !important; } #consent-manager .consent-banner-description > span:not(.mx-1) { font-size: var(--font-size-h5); } #consent-manager .consent-banner-description > p, #consent-manager .consent-banner-description > a, #consent-manager .consent-banner-description > span.mx-1, .consent-banner-actions button { font-size: 16px !important; } #consent-manager p i { font-style: normal !important; } #consent-manager p #consent-banner-btn-settings, #consent-manager p #consent-banner-btn-close { border: none !important; }