// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`PoolDetailsHeader loading skeleton is shown 1`] = `
<DocumentFragment>
  .c1 {
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
}

.c2 {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 8px;
}

.c3 {
  border-radius: 12px;
  border-radius: 12px;
  height: 24px;
  width: 50%;
  width: 50%;
  -webkit-animation: fAQEyV 1.5s infinite;
  animation: fAQEyV 1.5s infinite;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  background: linear-gradient( to left, #22222212 25%, rgba(53,53,53,0.07) 50%, #22222212 75% );
  will-change: background-position;
  background-size: 400%;
}

.c5 {
  height: 40px;
  width: 137px;
}

.c0 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-align-items: 'flex-start';
  -webkit-box-align: 'flex-start';
  -ms-flex-align: 'flex-start';
  align-items: 'flex-start';
  width: 100%;
  -webkit-animation: iAjNNh 125ms ease-in;
  animation: iAjNNh 125ms ease-in;
  -webkit-animation-duration: 250ms;
  animation-duration: 250ms;
}

.c4 {
  width: 32px;
  height: 32px;
  border-radius: 50%;
}

<span
    class=""
    style="display: contents;"
  >
    <span
      class=" _dsp_contents"
    >
      <span
        class=" t_light _dsp_contents is_Theme"
      >
        <div
          class="c0"
          data-testid="pdp-header-loading-skeleton"
        >
          <div
            class="c1 c2"
          >
            <div
              class="c3 c4"
            />
            <div
              class="c3 c5"
            />
          </div>
        </div>
      </span>
    </span>
  </span>
</DocumentFragment>
`;

exports[`PoolDetailsHeader renders breadcrumb text correctly 1`] = `
<DocumentFragment>
  .c2 {
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
}

.c3 {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.c7 {
  display: inline-block;
  height: inherit;
}

.c0 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  color: #7D7D7D;
  font-size: 16px;
  line-height: 24px;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 4px;
  margin-bottom: 20px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
}

.c1 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #7D7D7D;
  -webkit-transition-duration: 125ms;
  transition-duration: 125ms;
  -webkit-text-decoration: none;
  text-decoration: none;
}

.c1:hover {
  color: #CECECE;
}

.c4 {
  gap: 6px;
}

.c5 {
  font-weight: inherit;
  font-size: inherit;
  line-height: inherit;
  color: #222222;
  white-space: nowrap;
  margin: 0;
}

.c6 {
  cursor: pointer;
  gap: 10px;
  white-space: nowrap;
}

<span
    class=""
    style="display: contents;"
  >
    <span
      class=" _dsp_contents"
    >
      <span
        class=" t_light _dsp_contents is_Theme"
      >
        <nav
          aria-label="breadcrumb-nav"
          class="c0"
        >
          <a
            class="c1"
            href="/explore/ethereum"
          >
            Explore 
            <svg
              fill="none"
              height="14"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="14"
              xmlns="http://www.w3.org/2000/svg"
            >
              <polyline
                points="9 18 15 12 9 6"
              />
            </svg>
          </a>
          <a
            class="c1"
            href="/explore/pools/ethereum"
          >
            Pools 
            <svg
              fill="none"
              height="14"
              stroke="currentColor"
              stroke-linecap="round"
              stroke-linejoin="round"
              stroke-width="2"
              viewBox="0 0 24 24"
              width="14"
              xmlns="http://www.w3.org/2000/svg"
            >
              <polyline
                points="9 18 15 12 9 6"
              />
            </svg>
          </a>
          <div
            aria-current="page"
            class="c2 c3 c4"
            data-testid="current-breadcrumb"
          >
            <h1
              class="c5"
            >
              USDC / WETH
            </h1>
             
            <div
              class="c2 c3 c6"
              data-testid="breadcrumb-token-address"
            >
              <div
                class="c7"
              >
                0x88e6...5640
              </div>
            </div>
          </div>
        </nav>
      </span>
    </span>
  </span>
</DocumentFragment>
`;

exports[`PoolDetailsHeader renders header text correctly 1`] = `
<DocumentFragment>
  .c1 {
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
}

.c10 {
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
}

.c2 {
  width: 100%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 12px;
}

.c11 {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 0;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  gap: 8px;
}

.c12 {
  display: inline-block;
  height: inherit;
}

.c7 {
  color: #222222;
  -webkit-letter-spacing: -0.01em;
  -moz-letter-spacing: -0.01em;
  -ms-letter-spacing: -0.01em;
  letter-spacing: -0.01em;
}

.c4 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  gap: 2px;
  position: relative;
  top: 0;
  left: 0;
}

.c4 img {
  width: 15px;
  height: 32px;
  object-fit: cover;
}

.c4 img:first-child {
  border-radius: 16px 0 0 16px;
  object-position: 0 0;
}

.c4 img:last-child {
  border-radius: 0 16px 16px 0;
  object-position: 100% 0;
}

.c5 {
  width: 16px;
  height: 32px;
  border-radius: 50%;
}

.c3 {
  position: relative;
  top: 0;
  left: 0;
}

.c0 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-align-items: 'flex-start';
  -webkit-box-align: 'flex-start';
  -ms-flex-align: 'flex-start';
  align-items: 'flex-start';
  width: 100%;
  -webkit-animation: iAjNNh 125ms ease-in;
  animation: iAjNNh 125ms ease-in;
  -webkit-animation-duration: 250ms;
  animation-duration: 250ms;
}

.c6 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  gap: 12px;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  -webkit-align-items: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.c8 {
  font-size: 24px !important;
}

.c9 {
  color: #222222;
  -webkit-text-decoration: none;
  text-decoration: none;
  -webkit-text-decoration: none;
  text-decoration: none;
  cursor: pointer;
  -webkit-transition-duration: 125ms;
  transition-duration: 125ms;
}

.c9:hover {
  opacity: 0.6;
}

.c9:active {
  opacity: 0.4;
}

@media screen and (max-width:640px) {
  .c8 {
    font-size: 18px !important;
    line-height: 24px !important;
  }
}

<span
    class=""
    style="display: contents;"
  >
    <span
      class=" _dsp_contents"
    >
      <span
        class=" t_light _dsp_contents is_Theme"
      >
        <div
          class="c0"
        >
          <div
            class="c1 c2"
          >
            <div
              class="c3"
            >
              <div
                class="c4"
                size="32"
              >
                <img
                  class="c5"
                  size="32"
                  src="https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xA0b86991c6218b36c1d19D4a2e9Eb0cE3606eB48/logo.png"
                />
                <img
                  class="c5"
                  size="32"
                  src="https://raw.githubusercontent.com/Uniswap/assets/master/blockchains/ethereum/assets/0xC02aaA39b223FE8D0A0e5C4F27eAD9083C756Cc2/logo.png"
                />
              </div>
            </div>
            <div
              class="c6"
            >
              <div>
                <div
                  class="c7 c8 css-4kpdx7"
                >
                  <a
                    class="c9"
                    href="/explore/tokens/ethereum/0xa0b86991c6218b36c1d19d4a2e9eb0ce3606eb48"
                  >
                    USDC
                  </a>
                   / 
                  <a
                    class="c9"
                    href="/explore/tokens/ethereum/0xc02aaa39b223fe8d0a0e5c4f27ead9083c756cc2"
                  >
                    WETH
                  </a>
                </div>
              </div>
              <div
                class="_display-flex _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _gap-1316331199 _alignItems-center"
              >
                <span
                  class="font_body _display-inline _boxSizing-border-box _whiteSpace-pre-wrap _mt-0px _mr-0px _mb-0px _ml-0px _color-843135005 _fontFamily-299667014 _wordWrap-break-word _pt-2px _pb-2px _pr-6px _pl-6px _backgroundColor-568007293 _fontSize-229441158 _lineHeight-222976511 _fontWeight-233016202 _borderTopLeftRadius-4px _borderBottomLeftRadius-4px"
                  data-disable-theme="true"
                />
                <span
                  class="font_body _display-inline _boxSizing-border-box _whiteSpace-pre-wrap _mt-0px _mr-0px _mb-0px _ml-0px _color-843135005 _fontFamily-299667014 _wordWrap-break-word _pt-2px _pb-2px _pr-6px _pl-6px _backgroundColor-568007293 _fontSize-229441158 _lineHeight-222976511 _fontWeight-233016202 _borderTopRightRadius-4px _borderBottomRightRadius-4px"
                  data-disable-theme="true"
                >
                  0.05%
                </span>
              </div>
              <div
                class="_opacity-0hover-0d0t846 _opacity-0active-0d0t7546 _transform-0active-scale11281 _display-flex _alignItems-stretch _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-column _cursor-pointer"
              >
                <svg
                  data-testid="toggle-tokens-reverse-arrows"
                  fill="none"
                  height="100%"
                  stroke-width="8"
                  style="color: rgb(125, 125, 125); width: 20px; height: 20px; cursor: pointer; text-decoration: none; transition-duration: 0.2s; opacity: 1; transform: rotate(90deg);"
                  viewBox="0 0 16 16"
                  width="100%"
                >
                  <path
                    d="M7.33336 4.00003V14C7.33336 14.2694 7.1714 14.5127 6.92206 14.6161C6.8394 14.6501 6.75269 14.6667 6.66669 14.6667C6.49336 14.6667 6.32267 14.5987 6.19534 14.4714L2.862 11.1381C2.60134 10.8774 2.60134 10.456 2.862 10.1953C3.12267 9.93468 3.54405 9.93468 3.80471 10.1953L6.00002 12.3907V4.00003C6.00002 3.63203 6.29802 3.33337 6.66669 3.33337C7.03536 3.33337 7.33336 3.63203 7.33336 4.00003ZM13.8047 4.86201L10.4714 1.52868C10.2807 1.33801 9.99532 1.28132 9.74465 1.38399C9.49532 1.48732 9.33336 1.7307 9.33336 2.00003V12C9.33336 12.368 9.63136 12.6667 10 12.6667C10.3687 12.6667 10.6667 12.368 10.6667 12V3.60941L12.862 5.80472C13.1227 6.06539 13.544 6.06539 13.8047 5.80472C14.0654 5.54405 14.0654 5.12268 13.8047 4.86201Z"
                    fill="currentColor"
                  />
                </svg>
              </div>
            </div>
          </div>
          <div
            class="c10 c11"
            width="max-content"
          >
            <div
              style="width: 100%;"
            >
              <span
                class="font_body _display-inline _boxSizing-border-box _whiteSpace-pre-wrap _mt-0px _mr-0px _mb-0px _ml-0px _color-843134974 _fontFamily-299667014 _wordWrap-break-word _fontSize-229441189 _lineHeight-222976542 _fontWeight-233016202 _justifyContent-center _alignItems-center _position-relative _borderTopWidth-1481558400 _borderRightWidth-1481558400 _borderBottomWidth-1481558400 _borderLeftWidth-1481558400 _textAlign-left _width-10037 _borderBottomStyle-solid _borderTopStyle-solid _borderLeftStyle-solid _borderRightStyle-solid"
                data-disable-theme="true"
                id="Dropdown"
              >
                <div
                  class="c12"
                  style="width: 100%;"
                >
                  <div>
                    <div
                      class="css-text-146c3p1"
                      dir="auto"
                      style="box-sizing: border-box; font-family: Basel,-apple-system,system-ui,BlinkMacSystemFont,\\"Segoe UI\\",Roboto,Helvetica,Arial,sans-serif; word-wrap: break-word; flex-direction: row; margin: 0px 0px 0px 0px; padding: 8px 12px 8px 12px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; white-space: nowrap; display: flex; align-items: center; justify-content: flex-start; text-decoration: none; cursor: pointer; color: rgb(34, 34, 34); font-size: 16px; line-height: 24px; font-weight: 485; height: 100%; border-top-color: rgba(34,34,34,0.05); border-right-color: rgba(34,34,34,0.05); border-bottom-color: rgba(34,34,34,0.05); border-left-color: rgba(34,34,34,0.05); background-color: rgb(249, 249, 249); border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px;"
                    >
                      <div
                        class="_display-flex _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _justifyContent-441309761 _alignItems-center _gap-1316331230 _width-10037"
                      >
                        <svg
                          fill="#222222"
                          height="18px"
                          stroke="transparent"
                          viewBox="0 0 18 18"
                          width="18px"
                          xmlns="http://www.w3.org/2000/svg"
                        >
                          <path
                            d="M5.08042 8.66148C5.08043 8.58693 5.09517 8.51313 5.12378 8.44429C5.1524 8.37546 5.19432 8.31297 5.24716 8.26038C5.30001 8.2078 5.3627 8.16617 5.43167 8.13788C5.50064 8.1096 5.57452 8.09522 5.64907 8.09557L6.59187 8.09865C6.74218 8.09865 6.88635 8.15836 6.99263 8.26465C7.09893 8.37094 7.15865 8.5151 7.15865 8.66543V12.2303C7.26478 12.1988 7.4011 12.1652 7.55026 12.1301C7.65387 12.1058 7.74621 12.0471 7.8123 11.9637C7.87839 11.8803 7.91434 11.777 7.91432 11.6705V7.24848C7.91432 7.09814 7.97403 6.95397 8.08032 6.84766C8.1866 6.74135 8.33077 6.68162 8.4811 6.68158H9.42577C9.57609 6.68162 9.72026 6.74135 9.82655 6.84766C9.93284 6.95397 9.99255 7.09814 9.99255 7.24848V11.3526C9.99255 11.3526 10.2291 11.2569 10.4595 11.1596C10.545 11.1234 10.6181 11.0629 10.6694 10.9854C10.7208 10.908 10.7482 10.8172 10.7483 10.7242V5.83152C10.7483 5.68122 10.808 5.53707 10.9143 5.43078C11.0206 5.32449 11.1647 5.26478 11.315 5.26474H12.2597C12.41 5.26474 12.5542 5.32445 12.6604 5.43075C12.7667 5.53704 12.8265 5.6812 12.8265 5.83152V9.86056C13.6455 9.267 14.4754 8.55315 15.1341 7.69474C15.2297 7.57015 15.2929 7.42383 15.3181 7.26887C15.3434 7.1139 15.3299 6.95509 15.2788 6.8066C14.9739 5.9294 14.4894 5.12551 13.856 4.44636C13.2226 3.76722 12.4544 3.22777 11.6005 2.86256C10.7467 2.49734 9.82602 2.31439 8.89742 2.32542C7.96882 2.33645 7.05275 2.54121 6.20783 2.9266C5.36291 3.31199 4.60774 3.86952 3.99066 4.56352C3.37358 5.25751 2.90817 6.07269 2.62422 6.95689C2.34027 7.84107 2.24403 8.7748 2.34166 9.69832C2.43929 10.6218 2.72863 11.5148 3.19118 12.3201C3.27176 12.459 3.39031 12.572 3.53289 12.6459C3.67548 12.7198 3.83618 12.7514 3.99614 12.7372C4.17482 12.7215 4.3973 12.6992 4.66181 12.6681C4.77695 12.655 4.88326 12.6001 4.96048 12.5137C5.0377 12.4273 5.08043 12.3155 5.08053 12.1996L5.08042 8.66148Z"
                            fill="#222222"
                          />
                          <path
                            d="M5.05957 14.3792C6.05531 15.1036 7.23206 15.5384 8.45961 15.6356C9.68716 15.7326 10.9176 15.4883 12.0149 14.9294C13.1122 14.3705 14.0334 13.519 14.6768 12.4691C15.3201 11.4191 15.6605 10.2116 15.6601 8.98024C15.6601 8.82658 15.653 8.67457 15.6428 8.52344C13.2041 12.1605 8.70139 13.8609 5.05978 14.3786"
                            fill="#222222"
                          />
                        </svg>
                      </div>
                    </div>
                  </div>
                </div>
              </span>
            </div>
            <div />
            <div
              style="width: 100%;"
            >
              <span
                class="font_body _display-inline _boxSizing-border-box _whiteSpace-pre-wrap _mt-0px _mr-0px _mb-0px _ml-0px _color-843134974 _fontFamily-299667014 _wordWrap-break-word _fontSize-229441189 _lineHeight-222976542 _fontWeight-233016202 _justifyContent-center _alignItems-center _position-relative _borderTopWidth-1481558400 _borderRightWidth-1481558400 _borderBottomWidth-1481558400 _borderLeftWidth-1481558400 _textAlign-left _width-10037 _borderBottomStyle-solid _borderTopStyle-solid _borderLeftStyle-solid _borderRightStyle-solid"
                data-disable-theme="true"
                id="Dropdown"
              >
                <div
                  class="c12"
                  style="width: 100%;"
                >
                  <div>
                    <div
                      class="css-text-146c3p1"
                      dir="auto"
                      style="box-sizing: border-box; font-family: Basel,-apple-system,system-ui,BlinkMacSystemFont,\\"Segoe UI\\",Roboto,Helvetica,Arial,sans-serif; word-wrap: break-word; flex-direction: row; margin: 0px 0px 0px 0px; padding: 8px 12px 8px 12px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; white-space: nowrap; display: flex; align-items: center; justify-content: flex-start; text-decoration: none; cursor: pointer; color: rgb(34, 34, 34); font-size: 16px; line-height: 24px; font-weight: 485; height: 100%; border-top-color: rgba(34,34,34,0.05); border-right-color: rgba(34,34,34,0.05); border-bottom-color: rgba(34,34,34,0.05); border-left-color: rgba(34,34,34,0.05); background-color: rgb(249, 249, 249); border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px;"
                    >
                      <div
                        class="_display-flex _flexBasis-auto _boxSizing-border-box _position-relative _minHeight-0px _minWidth-0px _flexShrink-0 _flexDirection-row _justifyContent-441309761 _alignItems-center _gap-1316331230 _width-10037"
                      >
                        <svg
                          fill="#222222"
                          height="18"
                          viewBox="0 0 24 24"
                          width="18"
                          xmlns="http://www.w3.org/2000/svg"
                        >
                          <path
                            d="M13 4.99092C13 4.09592 14.094 3.66096 14.709 4.31196L20.637 10.582C21.121 11.094 21.121 11.894 20.637 12.406L14.709 18.676C14.094 19.326 13 18.891 13 17.997V14.4919C5.437 14.4919 4.93602 16.962 4.96802 19.529C4.97402 20.019 4.32501 20.1811 4.08301 19.7561C3.46701 18.6751 3 17.1999 3 15.4909C3 8.99592 10 8.49702 13 8.49702V4.99092Z"
                            fill="#222222"
                          />
                        </svg>
                      </div>
                    </div>
                  </div>
                </div>
              </span>
            </div>
            <div />
          </div>
        </div>
      </span>
    </span>
  </span>
</DocumentFragment>
`;
