/**/ #snackys-tpl .to-opc-link-list { width: 100%; margin-top: var(--spacing-12); color: var(--color-primary-100); font-family: var(--font-family-base); } #snackys-tpl .to-opc-link-list h2, #snackys-tpl .to-opc-link-list h3 { margin: 0 0 var(--spacing-8); color: var(--color-primary-100); font-family: var(--font-family-base); font-size: var(--font-size-h4); font-weight: var(--font-weight-bold); line-height: var(--lh-heading); } #snackys-tpl .to-opc-link-list > p { margin: 0; } #snackys-tpl .to-opc-link-list > a, #snackys-tpl .to-opc-link-list > p > a { position: relative; display: flex; width: 100%; min-height: 42px; align-items: center; margin: 0 0 var(--spacing-2); padding: var(--spacing-2) calc(var(--spacing-8) + var(--spacing-3)) var(--spacing-2) var(--spacing-4); overflow: hidden; color: var(--color-primary-100) !important; font-family: var(--font-family-base); font-size: var(--font-size-normal); font-weight: var(--font-weight-regular); line-height: 1.25; text-decoration: none !important; text-overflow: ellipsis; background: var(--color-white); box-shadow: inset calc(-1 * var(--spacing-8)) 0 0 var(--color-secondary-50); border: 2px solid var(--color-tertiary-75); border-radius: var(--border-radius-sm); transition: color var(--transition-fast), background-color var(--transition-fast), border-color var(--transition-fast); } #snackys-tpl .to-opc-link-list > a::after, #snackys-tpl .to-opc-link-list > p > a::after { position: absolute; top: 50%; right: var(--spacing-2); width: var(--spacing-4); height: var(--spacing-4); background-color: currentColor; content: ''; transform: translateY(-50%); pointer-events: none; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E") center / contain no-repeat; } #snackys-tpl .to-opc-link-list > a:hover, #snackys-tpl .to-opc-link-list > a:focus-visible, #snackys-tpl .to-opc-link-list > p > a:hover, #snackys-tpl .to-opc-link-list > p > a:focus-visible { color: var(--color-primary-100) !important; background: var(--color-secondary-50); border-color: var(--color-primary-100); outline: 0; } #snackys-tpl .to-opc-link-list > a:last-child, #snackys-tpl .to-opc-link-list > p:last-child > a { margin-bottom: 0; } @media (max-width: 575px) { #snackys-tpl .to-opc-link-list h2, #snackys-tpl .to-opc-link-list h3 { margin-bottom: var(--spacing-6); font-size: var(--font-size-h5); } #snackys-tpl .to-opc-link-list > a, #snackys-tpl .to-opc-link-list > p > a { min-height: 44px; padding-left: 12px; } } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion { display: grid; gap: calc(var(--spacing-2) + 1px); } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .opc-Accordion-group { margin: 0; padding: 0; overflow: hidden; border: 2px solid var(--color-tertiary-75); border-radius: var(--border-radius-sm); background: var(--color-white); box-shadow: none; } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .card-header { margin: 0; padding: 0; border: 0; background: transparent; } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .card-header > h2 { margin: 0 !important; font-size: inherit; line-height: inherit; } :is(.to-pdp-faq__item summary, :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .opc-Accordion-head) { position: relative; display: block; width: 100%; margin: 0; padding: var(--spacing-3) var(--spacing-12) var(--spacing-3) var(--spacing-4); border: 0; border-radius: 0; color: var(--color-neutral); background: transparent; font-family: var(--font-family-base); font-size: calc(var(--font-size-normal) + 1px); font-weight: var(--font-weight-regular); line-height: 1.4; text-align: left; text-decoration: none; white-space: normal; cursor: pointer; } :is(.to-pdp-faq__item summary, :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .opc-Accordion-head)::after { content: ''; position: absolute; top: 50%; right: var(--spacing-4); width: 20px; height: 20px; transform: translateY(-50%); background: center / contain no-repeat; 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='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'%3E%3C/line%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E"); transition: transform var(--transition-fast); } :is(.to-pdp-faq__item[open] summary, :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .opc-Accordion-head[aria-expanded="true"])::after { transform: translateY(-50%) rotate(45deg); } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .opc-Accordion-head::before { content: none; } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .card-body { padding: 0 var(--spacing-4) var(--spacing-4); color: var(--color-neutral); font-size: var(--font-size-normal); line-height: var(--lh-paragraph); } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .card-body p:last-child { margin-bottom: 0; } :is(body:has(:is(.to-guide-intro, .to-info-article)), .to-search-article__content) .opc-Accordion .opc-Accordion-head:is(:hover, :focus, :active) { color: var(--color-neutral); background: transparent; text-decoration: none; }