.acsa-shortcuts {
  --shortcut-blue: #003377;
}

.acsa-shortcuts a {
  text-decoration: none;
}

.acsa-shortcut-icon {
  display: block;
  flex: none;
  width: 21px;
  height: 21px;
  background-color: currentColor;
  -webkit-mask: var(--shortcut-icon) center / contain no-repeat;
  mask: var(--shortcut-icon) center / contain no-repeat;
}

.acsa-shortcut-icon--service {
  --shortcut-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='9.43,4.53 9.92,2.22 14.08,2.22 14.57,4.53 17.18,6.04 19.43,5.31 21.51,8.91 19.75,10.49 19.75,13.51 21.51,15.09 19.43,18.69 17.18,17.96 14.57,19.47 14.08,21.78 9.92,21.78 9.43,19.47 6.82,17.96 4.57,18.69 2.49,15.09 4.25,13.51 4.25,10.49 2.49,8.91 4.57,5.31 6.82,6.04'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.acsa-shortcut-icon--mail {
  --shortcut-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m4 7 8 6 8-6'/%3E%3C/svg%3E");
}

.acsa-shortcut-icon--location {
  --shortcut-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 10c0 5-7 10-7 10S5 15 5 10a7 7 0 1 1 14 0Z'/%3E%3Ccircle cx='12' cy='10' r='2.3'/%3E%3C/svg%3E");
}

.acsa-shortcuts--desktop {
  display: none;
}

@media (min-width: 769px) {
  .acsa-shortcuts--desktop {
    position: fixed;
    z-index: 950;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    display: grid;
    justify-items: end;
    gap: 6px;
    pointer-events: none;
  }

  .acsa-shortcuts--desktop a {
    display: grid;
    grid-template-columns: 48px max-content;
    align-items: center;
    width: 48px;
    min-height: 48px;
    overflow: hidden;
    border-radius: 6px 0 0 6px;
    background-color: var(--shortcut-blue);
    color: #fff;
    font: 600 16px / 1.2 var(--f-baslik, sans-serif);
    pointer-events: auto;
    transition: width 220ms ease, background-color 180ms ease;
  }

  .acsa-shortcuts--desktop a:hover,
  .acsa-shortcuts--desktop a:focus-visible {
    width: 175px;
    background-color: #002454;
  }

  .acsa-shortcuts.acsa-shortcuts--desktop a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
  }

  .acsa-shortcuts--desktop .acsa-shortcut-icon {
    justify-self: center;
  }

  .acsa-shortcuts--desktop .acsa-shortcut-label {
    padding-right: 14px;
    opacity: 0;
    transition: opacity 150ms ease;
  }

  .acsa-shortcuts--desktop a:hover .acsa-shortcut-label,
  .acsa-shortcuts--desktop a:focus-visible .acsa-shortcut-label {
    opacity: 1;
  }
}

@media (max-width: 768px) {
  .acsa-shortcuts--mobile {
    margin: 8px 18px 4px;
    padding: 5px 0;
    border-top: 1px solid var(--acsa-cizgi);
    visibility: hidden;
  }

  body.m-open .acsa-shortcuts--mobile {
    visibility: visible;
  }

  .acsa-shortcuts--mobile a {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 44px;
    padding: 5px 4px;
    color: var(--shortcut-blue);
    font: 600 16px / 1.2 var(--f-baslik, sans-serif);
  }

  .acsa-shortcuts--mobile a::after {
    content: "";
    width: 7px;
    height: 7px;
    margin-left: auto;
    margin-right: 3px;
    border-right: 1.5px solid currentColor;
    border-top: 1.5px solid currentColor;
    transform: rotate(45deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .acsa-shortcuts--desktop a,
  .acsa-shortcuts--desktop .acsa-shortcut-label {
    transition: none;
  }
}
