/* Small interaction cues; native controls remain usable without motion support. */
/* WooCommerce retains drawer state, focus management and its native keyframes. */
body.srs-site .wc-block-components-drawer__screen-overlay:has(.wc-block-mini-cart__drawer) {
  transition: opacity 220ms cubic-bezier(.2,.7,.2,1);
  animation-duration: 220ms;
  animation-timing-function: cubic-bezier(.2,.7,.2,1);
}
body.srs-site .wc-block-components-drawer__screen-overlay .wc-block-mini-cart__drawer {
  transition: transform 220ms cubic-bezier(.2,.7,.2,1);
  animation-duration: 220ms;
  animation-timing-function: cubic-bezier(.2,.7,.2,1);
}
/* Native navigation continues to own focus, Escape and scroll locking. */
@media (max-width: 1120px) and (prefers-reduced-motion: no-preference) {
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container {
    background: #08090b !important;
    color: #fff !important;
    padding: clamp(28px, 5vw, 56px) !important;
    z-index: 100000;
    opacity: 0;
    transform: translateX(-16px);
    transition: opacity 220ms ease, transform 220ms cubic-bezier(.2,.7,.2,1), display 220ms allow-discrete;
  }
  /* Keep the overlay's layout intact while display transitions to none. */
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container-content { padding-top: calc(2rem + 24px); background: #08090b !important; }
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container .wp-block-navigation__container { display: flex; flex-direction: column; align-items: flex-start; gap: 0; }
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container .wp-block-navigation-item { width: 100%; border-bottom: 1px solid #34373d; }
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container .wp-block-navigation-item__content { display: block; width: 100%; padding: 18px 0; font-size: clamp(28px, 6vw, 48px); font-weight: 700; line-height: 1; text-transform: uppercase; font-family: var(--srs-display) !important; }
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container :is(a, .wp-block-navigation__container, .wp-block-navigation-item__content, .wp-block-navigation__responsive-container-close) { color: #fff !important; -webkit-text-fill-color: #fff !important; }
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container.is-menu-open {
    opacity: 1;
    transform: translateX(0);
    animation: none;
  }
  @starting-style {
    body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container.is-menu-open { opacity: 0; transform: translateX(-16px); }
  }
}
body.srs-site ul.products li.product .cc-card-btn.cc-added .cc-card-btn-icon {
  display: block !important;
  background-color: #75dda2 !important;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12 4 4L19 6' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
body.srs-site ul.products li.product .cc-card-btn.cc-added .cc-btn-label { color: #75dda2 !important; -webkit-text-fill-color: #75dda2 !important; }
@media (prefers-reduced-motion: no-preference) {
  body.srs-site ul.products li.product .cc-card-btn.cc-added .cc-card-btn-icon { animation: srs-added-check 180ms ease-out; }
}
@keyframes srs-added-check { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: scale(1); } }
@supports (interpolate-size: allow-keywords) and selector(details::details-content) {
  :is(.srs-faq-item, .srs-faq-page__item, .cc-product-page-faq__item, .srs-article-toc-mobile) { interpolate-size: allow-keywords; }
  :is(.srs-faq-item, .srs-faq-page__item, .cc-product-page-faq__item, .srs-article-toc-mobile)::details-content {
    height: 0;
    opacity: 0;
    overflow: clip;
    transition: height 220ms cubic-bezier(.2,.7,.2,1), opacity 160ms ease, content-visibility 220ms allow-discrete;
  }
  :is(.srs-faq-item, .srs-faq-page__item, .cc-product-page-faq__item, .srs-article-toc-mobile)[open]::details-content { height: auto; opacity: 1; }
}
.srs-faq-item summary > i::after,
.srs-faq-page__item summary > i::after,
.cc-product-page-faq__toggle::after { transition: transform 180ms ease; }
.srs-button > span[aria-hidden="true"]:last-child,
.srs-batch-summary__link > span[aria-hidden="true"],
.srs-coa-document__link > span,
.srs-article-guide > span > svg { display: inline-block; transition: transform 180ms cubic-bezier(.2,.7,.2,1); }
@media (hover: hover) and (pointer: fine) {
  .srs-button:is(:hover,:focus-visible) > span[aria-hidden="true"]:last-child,
  .srs-batch-summary__link:is(:hover,:focus-visible) > span[aria-hidden="true"],
  .srs-coa-document:is(:hover,:focus-visible) .srs-coa-document__link > span,
  .srs-article-guide:is(:hover,:focus-visible) > span > svg { transform: translateX(3px); }
}
body.srs-site.single-product dialog.srs-coa-modal::backdrop { transition: background-color 160ms ease; }
body.srs-site.single-product dialog.srs-coa-modal.is-closing::backdrop { background-color: transparent; }
@starting-style {
  body.srs-site.single-product dialog.srs-coa-modal[open]::backdrop { background-color: transparent; }
}
@media (prefers-reduced-motion: reduce) {
  body.srs-site .wc-block-components-drawer__screen-overlay:has(.wc-block-mini-cart__drawer),
  body.srs-site .wc-block-components-drawer__screen-overlay .wc-block-mini-cart__drawer,
  body.srs-site .srs-header nav.srs-nav .wp-block-navigation__responsive-container { transition: none !important; animation: none !important; }
  :is(.srs-faq-item, .srs-faq-page__item, .cc-product-page-faq__item, .srs-article-toc-mobile)::details-content { transition: none !important; }
  body.srs-site.single-product dialog.srs-coa-modal::backdrop { transition: none !important; }
  .srs-button > span[aria-hidden="true"]:last-child,
  .srs-batch-summary__link > span[aria-hidden="true"],
  .srs-coa-document__link > span,
  .srs-article-guide > span > svg { transition: none !important; transform: none !important; }
}
