/* See: tailwind/components/link-plugin.tailwind.js */

.yubicool-link-arrow:after {
  content: ' ';
}

.yubicool-link.has-arrow {
  --ybc-arrow-size: var(--ybc-link-custom-desktop-text-fontSize, var(--ybc-link-standard-desktop-text-fontSize,var(--ybc-link-custom-tablet-landscape-text-fontSize, var(--ybc-link-standard-tablet-landscape-text-fontSize,var(--ybc-link-custom-tablet-text-fontSize, var(--ybc-link-standard-tablet-text-fontSize,var(--ybc-link-custom-mobile-text-fontSize, var(--ybc-link-standard-mobile-text-fontSize,var(--ybc-link-custom-default-text-fontSize , var(--ybc-link-standard-default-text-fontSize, 1rem))))))))));;
  width: -moz-fit-content;
  width: fit-content;
  text-decoration-line: none;
}

.yubicool-link.has-arrow:after {
  height: calc(var(--ybc-arrow-size));
  width: calc(var(--ybc-arrow-size));
  left: calc(var(--ybc-arrow-size) / 2);
  padding-bottom: calc(var(--ybc-arrow-size) * 1.125);
  transition: 0.2s;
  content:  ;
  position: relative;
  display: inline-block;
  height: 1rem;
  width: 1rem;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: bottom;
  --default-arrow-color: var(--ybc-link-custom-default-text-color, var(--ybc-link-standard-default-text-color, #0073A5));
  --mobile-arrow-color: var(--ybc-link-custom-mobile-text-color, var(--ybc-link-standard-mobile-text-color, var(--default-arrow-color)));
  --tablet-arrow-color: var(--ybc-link-custom-tablet-text-color, var(--ybc-link-standard-tablet-text-color, var(--mobile-arrow-color)));
  --tablet-landscape-arrow-color: var(--ybc-link-custom-tablet-landscape-text-color, var(--ybc-link-standard-tablet-landscape-text-color, var(--tablet-arrow-color)));
  --desktop-arrow-color: var(--ybc-link-custom-desktop-text-color, var(--ybc-link-standard-desktop-text-color, var(--tablet-landscape-arrow-color)));
  background-color: var(--default-arrow-color);
  -webkit-mask-image: url(../../dist/assets/img/arrow.svg);
  mask-image: url(../../dist/assets/img/arrow.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

@media (min-width: 320px) {

  .yubicool-link.has-arrow:after {
    background-color: var(--mobile-arrow-color);
  }
}

@media (min-width: 768px) {

  .yubicool-link.has-arrow:after {
    background-color: var(--tablet-arrow-color);
  }
}

@media (min-width: 1024px) {

  .yubicool-link.has-arrow:after {
    background-color: var(--tablet-landscape-arrow-color);
  }
}

@media (min-width: 1440px) {

  .yubicool-link.has-arrow:after {
    background-color: var(--desktop-arrow-color);
  }
}

.yubicool-link.has-arrow:hover {
  cursor: pointer;
  text-decoration-line: none;
}

.yubicool-link.has-arrow:hover:after {
  left: calc(0.5rem + 4px);
}

.yubicool-link.has-arrow.ybc-child-text-white,.yubicool-link.has-arrow[style="--link-text-color:#FFFFFF"] {
  --ybc-link-standard-default-text-color: white;
}

.yubicool-link.has-arrow.ybc-child-text-white p,.yubicool-link.has-arrow.ybc-child-text-white a,.yubicool-link.has-arrow.ybc-child-text-white a:hover,.yubicool-link.has-arrow[style="--link-text-color:#FFFFFF"] p,.yubicool-link.has-arrow[style="--link-text-color:#FFFFFF"] a,.yubicool-link.has-arrow[style="--link-text-color:#FFFFFF"] a:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.yubicool-link.has-arrow.ybc-child-text-white::after,.yubicool-link.has-arrow[style="--link-text-color:#FFFFFF"]::after {
  background-image: url(../../dist/assets/img/arrow-white.svg);
  content:  ;
}

.yubicool-link.has-arrow:after {
  content: ' ';
}

.yubicool-card > span.yubicool-link,
.yubicool-card > a.yubicool-link {
  --ybc-arrow-size: var(--ybc-link-custom-desktop-text-fontSize, var(--ybc-link-standard-desktop-text-fontSize,var(--ybc-link-custom-tablet-landscape-text-fontSize, var(--ybc-link-standard-tablet-landscape-text-fontSize,var(--ybc-link-custom-tablet-text-fontSize, var(--ybc-link-standard-tablet-text-fontSize,var(--ybc-link-custom-mobile-text-fontSize, var(--ybc-link-standard-mobile-text-fontSize,var(--ybc-link-custom-default-text-fontSize , var(--ybc-link-standard-default-text-fontSize, 1rem))))))))));;
  width: -moz-fit-content;
  width: fit-content;
  text-decoration-line: none;
}

.yubicool-card > span.yubicool-link:after,
.yubicool-card > a.yubicool-link:after {
  height: calc(var(--ybc-arrow-size));
  width: calc(var(--ybc-arrow-size));
  left: calc(var(--ybc-arrow-size) / 2);
  padding-bottom: calc(var(--ybc-arrow-size) * 1.125);
  transition: 0.2s;
  content:  ;
  position: relative;
  display: inline-block;
  height: 1rem;
  width: 1rem;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: bottom;
  --default-arrow-color: var(--ybc-link-custom-default-text-color, var(--ybc-link-standard-default-text-color, #0073A5));
  --mobile-arrow-color: var(--ybc-link-custom-mobile-text-color, var(--ybc-link-standard-mobile-text-color, var(--default-arrow-color)));
  --tablet-arrow-color: var(--ybc-link-custom-tablet-text-color, var(--ybc-link-standard-tablet-text-color, var(--mobile-arrow-color)));
  --tablet-landscape-arrow-color: var(--ybc-link-custom-tablet-landscape-text-color, var(--ybc-link-standard-tablet-landscape-text-color, var(--tablet-arrow-color)));
  --desktop-arrow-color: var(--ybc-link-custom-desktop-text-color, var(--ybc-link-standard-desktop-text-color, var(--tablet-landscape-arrow-color)));
  background-color: var(--default-arrow-color);
  -webkit-mask-image: url(../../dist/assets/img/arrow.svg);
  mask-image: url(../../dist/assets/img/arrow.svg);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

@media (min-width: 320px) {

  .yubicool-card > span.yubicool-link:after,
.yubicool-card > a.yubicool-link:after {
    background-color: var(--mobile-arrow-color);
  }
}

@media (min-width: 768px) {

  .yubicool-card > span.yubicool-link:after,
.yubicool-card > a.yubicool-link:after {
    background-color: var(--tablet-arrow-color);
  }
}

@media (min-width: 1024px) {

  .yubicool-card > span.yubicool-link:after,
.yubicool-card > a.yubicool-link:after {
    background-color: var(--tablet-landscape-arrow-color);
  }
}

@media (min-width: 1440px) {

  .yubicool-card > span.yubicool-link:after,
.yubicool-card > a.yubicool-link:after {
    background-color: var(--desktop-arrow-color);
  }
}

.yubicool-card > span.yubicool-link:hover,
.yubicool-card > a.yubicool-link:hover {
  cursor: pointer;
  text-decoration-line: none;
}

.yubicool-card > span.yubicool-link:hover:after,
.yubicool-card > a.yubicool-link:hover:after {
  left: calc(0.5rem + 4px);
}

.yubicool-card > span.yubicool-link.ybc-child-text-white,.yubicool-card > span.yubicool-link[style="--link-text-color:#FFFFFF"],
.yubicool-card > a.yubicool-link.ybc-child-text-white,
.yubicool-card > a.yubicool-link[style="--link-text-color:#FFFFFF"] {
  --ybc-link-standard-default-text-color: white;
}

.yubicool-card > span.yubicool-link.ybc-child-text-white p,.yubicool-card > span.yubicool-link.ybc-child-text-white a,.yubicool-card > span.yubicool-link.ybc-child-text-white a:hover,.yubicool-card > span.yubicool-link[style="--link-text-color:#FFFFFF"] p,.yubicool-card > span.yubicool-link[style="--link-text-color:#FFFFFF"] a,.yubicool-card > span.yubicool-link[style="--link-text-color:#FFFFFF"] a:hover,
.yubicool-card > a.yubicool-link.ybc-child-text-white p,
.yubicool-card > a.yubicool-link.ybc-child-text-white a,
.yubicool-card > a.yubicool-link.ybc-child-text-white a:hover,
.yubicool-card > a.yubicool-link[style="--link-text-color:#FFFFFF"] p,
.yubicool-card > a.yubicool-link[style="--link-text-color:#FFFFFF"] a,
.yubicool-card > a.yubicool-link[style="--link-text-color:#FFFFFF"] a:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.yubicool-card > span.yubicool-link.ybc-child-text-white::after,.yubicool-card > span.yubicool-link[style="--link-text-color:#FFFFFF"]::after,
.yubicool-card > a.yubicool-link.ybc-child-text-white::after,
.yubicool-card > a.yubicool-link[style="--link-text-color:#FFFFFF"]::after {
  background-image: url(../../dist/assets/img/arrow-white.svg);
  content:  ;
}

.yubicool-card > span.yubicool-link:after,
.yubicool-card > a.yubicool-link:after {
  content: ' ';
}

.yubicool-link-social-media span {
  display: none;
}

.yubicool-link-social-media::after {
  content: ' ';
  background-image: var(--icon-image, '');
}

.yubicool-link-social-media:hover::after {
  content: ' ';
  background-image: var(--icon-hover-image, '');
}

.yubicool-link {
  --ybc-link-standard-default-size-minHeight: 0 !important;
  --ybc-link-standard-default-size-height: 3rem !important;
}

p.has-text-align-center + .wp-block-group .yubicool-link {
    --ybc-link-standard-default-layout-display: block;
    --ybc-link-standard-default-text-align: center;
    --ybc-link-standard-default-margin-left: auto;
    --ybc-link-standard-default-margin-right: auto;
    --ybc-link-standard-default-margin-top: 0.5rem;
  }
