/****************************************
  MEDIA QUERIES
****************************************/
#andromeda_whatsapp {
  position: fixed;
  z-index: 10; }
  @media (max-width: 480px), (min-width: 481px) and (max-width: 769px), (min-width: 770px) and (max-width: 989px) {
    #andromeda_whatsapp {
      bottom: 5rem; } }
  @media (min-width: 990px) and (max-width: 1199px), (min-width: 1200px) {
    #andromeda_whatsapp {
      bottom: 1rem; } }
  #andromeda_whatsapp.right {
    right: 1rem; }
  #andromeda_whatsapp.left {
    left: 1rem; }
  #andromeda_whatsapp.center {
    left: 50%;
    transform: translateX(-50%); }
  #andromeda_whatsapp .bubble {
    background-color: var(--main-bubble-background-color);
    border-radius: 50%;
    height: 3.2rem;
    width: 3.2rem;
    border: none;
    cursor: pointer;
    box-shadow: rgba(0, 0, 0, 0.15) 0px 3px 12px 0px;
    position: relative; }
    @media (max-width: 480px), (min-width: 481px) and (max-width: 769px) {
      #andromeda_whatsapp .bubble {
        height: 3rem;
        width: 3rem; } }
    #andromeda_whatsapp .bubble .fa-whatsapp {
      color: var(--main-bubble-icon-color);
      font-size: 1.8rem; }
    #andromeda_whatsapp .bubble .notification-badge {
      width: 10px;
      height: 10px;
      background-color: var(--main-bubble-notification-badge-color);
      position: absolute;
      z-index: 1;
      border-radius: 50%;
      right: 4px;
      top: 4px;
      display: block !important; }
  #andromeda_whatsapp .chat-window {
    position: fixed;
    z-index: 999;
    width: 360px;
    transition: opacity 0.3s ease 0s, margin 0.3s ease 0s, visibility 0.3s ease 0s;
    pointer-events: none;
    touch-action: none;
    visibility: hidden;
    margin-bottom: 0px;
    opacity: 0; }
    @media (max-width: 480px), (min-width: 481px) and (max-width: 769px), (min-width: 770px) and (max-width: 989px) {
      #andromeda_whatsapp .chat-window {
        margin-bottom: 100px !important; } }
    @media (max-width: 480px), (min-width: 481px) and (max-width: 769px) {
      #andromeda_whatsapp .chat-window {
        width: 90dvw; } }
    @media (min-width: 770px) and (max-width: 989px) {
      #andromeda_whatsapp .chat-window {
        width: 70dvw; } }
  #andromeda_whatsapp .chat-window.active {
    position: fixed;
    pointer-events: all;
    touch-action: auto;
    visibility: visible;
    margin-bottom: 20px;
    opacity: 1;
    inset: auto 20px 76px auto;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.3) 0px 4px 30px 0px; }
    #andromeda_whatsapp .chat-window.active .header {
      color: #111111;
      display: flex;
      flex-direction: column;
      -webkit-box-align: center;
      align-items: center;
      padding: 20px;
      background: var(--main-header-background-color);
      border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
      #andromeda_whatsapp .chat-window.active .header .close-btn {
        background: transparent;
        border: none;
        position: absolute;
        right: 9px;
        top: 6px;
        cursor: pointer; }
        #andromeda_whatsapp .chat-window.active .header .close-btn i.fa-xmark {
          color: white; }
      #andromeda_whatsapp .chat-window.active .header .header-info {
        margin-left: 16px;
        margin-right: 16px;
        width: 100%;
        overflow: hidden; }
        #andromeda_whatsapp .chat-window.active .header .header-info .name {
          font-size: 16px;
          font-weight: 700;
          line-height: 20px;
          max-height: 60px;
          -webkit-line-clamp: 3;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          overflow: hidden;
          color: white; }
        #andromeda_whatsapp .chat-window.active .header .header-info .answer-time {
          font-size: 13px;
          line-height: 18px;
          margin-top: 4px;
          color: white; }
    #andromeda_whatsapp .chat-window.active .chat-body {
      max-height: 235px;
      min-height: 200px;
      position: relative; }
      #andromeda_whatsapp .chat-window.active .chat-body .bubble-detail {
        position: absolute;
        top: 14px;
        left: 18px; }
      #andromeda_whatsapp .chat-window.active .chat-body .bubble-chat {
        height: fit-content;
        max-height: 200px;
        width: fit-content;
        max-width: 310px;
        min-height: 40px;
        background: var(--main-message-background-color);
        position: absolute;
        left: 26px;
        top: 14px;
        border-radius: 0 10px 10px 10px;
        padding: 8px 20px;
        display: flex;
        align-items: center; }
        #andromeda_whatsapp .chat-window.active .chat-body .bubble-chat .loader {
          display: none;
          visibility: hidden;
          width: 30px;
          aspect-ratio: 2;
          --_g: no-repeat radial-gradient(circle closest-side,#000 90%,#0000);
          background: var(--_g) 0% 50%, var(--_g) 50% 50%, var(--_g) 100% 50%;
          background-size: calc(100%/3) 43%;
          animation: dots 1s infinite linear; }
          #andromeda_whatsapp .chat-window.active .chat-body .bubble-chat .loader.active {
            visibility: visible;
            display: block; }
      #andromeda_whatsapp .chat-window.active .chat-body .welcome-message {
        visibility: hidden;
        display: none;
        font-size: .75rem;
        opacity: 0;
        transition: opacity .2s ease-in; }
        #andromeda_whatsapp .chat-window.active .chat-body .welcome-message.active {
          visibility: visible;
          opacity: 1;
          display: block; }
      #andromeda_whatsapp .chat-window.active .chat-body .user-message {
        position: absolute;
        bottom: 0;
        width: 100%;
        border: none;
        height: 46px;
        border-radius: 0 0 15px 15px;
        font-size: .7rem;
        padding: 0 55px 0 10px;
        outline: none;
        background-color: var(--main-message-field-color); }
      #andromeda_whatsapp .chat-window.active .chat-body .send-message {
        position: absolute;
        right: 10px;
        bottom: 5px;
        background: var(--main-send-message-button-color);
        border: none;
        border-radius: 23px;
        height: 35px;
        width: 35px;
        display: flex;
        align-items: center;
        justify-content: center;
        cursor: pointer; }
        #andromeda_whatsapp .chat-window.active .chat-body .send-message i.fa-paper-plane {
          font-size: .8rem;
          color: white; }
      #andromeda_whatsapp .chat-window.active .chat-body .start-chat-button {
        display: none;
        position: absolute;
        bottom: 1.5rem;
        left: 50%;
        transform: translateX(-50%);
        border: none;
        background-color: var(--main-button-color);
        color: white;
        border-radius: 15px;
        font-size: .8rem;
        padding: .5rem 1rem;
        cursor: pointer;
        flex-direction: row;
        gap: .5rem;
        align-items: center;
        justify-content: center;
        text-decoration: none; }
        #andromeda_whatsapp .chat-window.active .chat-body .start-chat-button.active {
          display: flex; }
        #andromeda_whatsapp .chat-window.active .chat-body .start-chat-button i.fa-whatsapp {
          font-size: 1.2rem; }

@keyframes dots {
  20% {
    background-position: 0%   0%, 50%  50%, 100% 50%; }
  40% {
    background-position: 0% 100%, 50%   0%, 100% 50%; }
  60% {
    background-position: 0%  50%, 50% 100%, 100% 0%; }
  80% {
    background-position: 0%  50%, 50%  50%, 100% 100%; } }

.animated-border {
  position: relative; }

.animated-border::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid red;
  border-radius: 50px;
  z-index: -1;
  animation: border-animation var(--main-animation-interval) infinite; }

@keyframes border-animation {
  0% {
    transform: scale(1);
    opacity: 1; }
  50% {
    transform: scale(1.1);
    opacity: 0.7; }
  100% {
    transform: scale(1);
    opacity: 1; } }
