@import"https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap";a{text-decoration:none;color:var(--light-color)}.user-name{text-transform:uppercase}.btn-close{height:30px;padding:4px 16px;cursor:pointer;background-color:#b71c1c;color:var(--light-color);border:1px solid var(--light-color);border-radius:16px}.btn-send{height:30px;padding:4px 16px;cursor:pointer;background-color:#27ae60;color:var(--light-color);border:1px solid var(--light-color);border-radius:16px}.btn-send:disabled{background-color:gray;color:#ffffff80;cursor:no-drop}.error{width:80%;background-color:#b71c1c;border:2px solid white;color:#fff;padding:4px;border-radius:4px;text-align:center}.chat-page{min-height:100vh}.navbar{height:70px;padding:4px 20px;display:flex;justify-content:center;align-items:center}.navbar__title{letter-spacing:2px}.navbar__img-content{flex-grow:1;display:flex;justify-content:flex-start}.navbar--mystic{border-bottom:2px solid var(--mystic-light-color)}.navbar--valor{border-bottom:2px solid var(--valor-light-color)}.navbar--instinct{border-bottom:2px solid var(--instinct-light-color)}.navbar__right-items{display:flex;justify-content:space-between;align-items:center}.navbar ul{display:flex;align-items:center;list-style:none;padding:0}.navbar ul li{padding-left:8px}.navbar img{width:50px;border-radius:50%}.chat-page__content{height:calc(100vh - 70px);display:flex}.friends{width:100%;overflow:scroll;scrollbar-width:none;display:flex;flex-direction:column}.friends::-webkit-scrollbar{display:none}.friends__search{height:120px;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center}.friends__search--mystic{border-bottom:1px solid var(--mystic-light-color)}.friends__search--valor{border-bottom:1px solid var(--valor-light-color)}.friends__search--instinct{border-bottom:1px solid var(--instinct-light-color)}.friends__search input{height:30px;border-radius:16px;outline:none;border:none;padding-left:12px;padding-right:12px;color:var(--light-color);width:80%}.friends__search input::placeholder{opacity:1}.friends__search button{height:30px;cursor:pointer;background-color:#27ae60;border:1px solid var(--light-color);border-radius:16px;color:var(--light-color);width:80%;padding:4px}.friends__search button:disabled{background-color:gray;color:#ffffff80;cursor:no-drop}.friend{height:60px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding-left:8px;padding-right:8px}.friend--mystic{background-color:var(--mystic-color);border-bottom:1px solid var(--mystic-light-color)}.friend--instinct{background-color:var(--instinct-color);border-bottom:1px solid var(--instinct-light-color)}.friend--valor{background-color:var(--valor-color);border-bottom:1px solid var(--valor-light-color)}.friend img{height:40px;border-radius:50%}.friend__name{flex-grow:1;overflow:hidden}.friend__name small{color:#fff9}.friend__name strong{letter-spacing:1px}.messages{flex-grow:1;display:flex;flex-direction:column}.messages__header{height:60px;display:flex;justify-content:space-around;align-items:center}.messages__header--mystic{background-color:var(--mystic-light-color);border-bottom:1px solid var(--mystic-color)}.messages__header--valor{background-color:var(--valor-light-color);border-bottom:1px solid var(--valor-color)}.messages__header--instinct{background-color:var(--instinct-light-color);border-bottom:1px solid var(--instinct-color)}.messages__header img{height:54px;border-radius:4px}.messages__content{max-height:100%;height:200px;flex-grow:1;display:flex;flex-direction:column;overflow-y:scroll;scrollbar-width:none}.messages__content::-webkit-scrollbar{display:none}.messages__content--mystic{background-color:var(--mystic-color)}.messages__content--valor{background-color:var(--valor-color)}.messages__content--instinct{background-color:var(--instinct-color)}.messages__message-item{width:80%;margin:0 8px 8px;padding:8px 12px}.messages__message-item--mystic{background-color:var(--mystic-light-color)}.messages__message-item--valor{background-color:var(--valor-light-color)}.messages__message-item--instinct{background-color:var(--instinct-light-color)}.messages__message-item--right{text-align:right;border-radius:12px 12px 0;align-self:flex-end}.messages__message-item--left{border-radius:0 12px 12px;text-align:left}.messages__footer{height:50px;padding:8px;display:flex;justify-content:center;align-items:center;gap:12px}.messages__footer--mystic{border-top:2px solid var(--mystic-light-color)}.messages__footer--valor{border-top:2px solid var(--valor-light-color)}.messages__footer--instinct{border-top:2px solid var(--instinct-light-color)}.input-message{min-height:30px;border-radius:16px;outline:none;border:none;padding-left:12px;padding-right:12px;flex-grow:1;color:#fff}.input-message--mystic{background-color:var(--mystic-light-color)}.input-message--valor{background-color:var(--valor-light-color)}.input-message--instinct{background-color:var(--instinct-light-color)}.empty-chat{height:100%;display:flex;justify-content:center;align-items:center;text-transform:uppercase;font-weight:700;font-size:20px}.hide-on-movile{display:none}@media (min-width: 600px){.navbar__img-content{justify-content:flex-end}.friends{width:250px}.hide-on-movile{display:flex}.friends--mystic{border-right:4px solid var(--mystic-light-color)}.friends--valor{border-right:4px solid var(--valor-light-color)}.friends--instinct{border-right:4px solid var(--instinct-light-color)}}@media (min-width: 800px){.friends{width:350px}}:root{--mystic-color: #2980b9;--mystic-light-color: #3498db;--instinct-color: #f39c12;--instinct-light-color: #f1c40f;--valor-color: #c0392b;--valor-light-color: #e74c3c;--dark-color: rgb(35, 35, 39);--light-color: white}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--dark-color);font-family:Lato,sans-serif;font-weight:400;font-style:normal;color:var(--light-color)}.bg-color--mystic{background-color:var(--mystic-color)}.bg-color--valor{background-color:var(--valor-color)}.bg-color--instinct{background-color:var(--instinct-color)}.loader{height:100vh;display:flex;justify-content:center;align-items:center}.loader div{width:40px;height:40px;border-radius:50%;margin:10px;transform:scale(0);animation:scaling 2s ease-in-out infinite}.loader div:nth-child(1){background-color:var(--mystic-color);animation-delay:.2s}.loader div:nth-child(2){background-color:var(--valor-color);animation-delay:.4s}.loader div:nth-child(3){background-color:var(--instinct-color);animation-delay:.6s}@keyframes scaling{0%,to{transform:scale(.2)}40%{transform:scale(1)}50%{transform:scale(1)}}.multi-team{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(6,1fr);min-height:100vh}.multi-team__team{grid-column:1 / 13;display:flex;justify-content:end;align-items:center;padding:12px}.multi-team__team--mystic{grid-row:1 / 3;background-image:linear-gradient(to right,var(--mystic-color),var(--dark-color))}.multi-team__team--valor{grid-row:3 / 5;justify-content:start;background-image:linear-gradient(to right,var(--dark-color),var(--valor-color))}.multi-team__team--instinct{grid-row:5 / 7;background-image:linear-gradient(to right,var(--instinct-color),var(--dark-color))}.multi-team__img{height:25vh;object-fit:contain}.multi-team__content{grid-column:1 / 13;grid-row:1 / 7}.login-page{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:repeat(6,1fr);height:100vh}.login-page__team{grid-column:1 / 13;display:flex;justify-content:end;align-items:center;padding:12px}.login-page__team--mystic{grid-row:1 / 3;background-image:linear-gradient(to right,var(--mystic-color),var(--dark-color))}.login-page__team--valor{grid-row:3 / 5;justify-content:start;background-image:linear-gradient(to right,var(--dark-color),var(--valor-color))}.login-page__team--instinct{grid-row:5 / 7;background-image:linear-gradient(to right,var(--instinct-color),var(--dark-color))}.login-page__img{height:75%}.login-page__form{grid-column:2 / 12;grid-row:2 / 6;display:grid;place-items:center;-webkit-backdrop-filter:blur(1.5rem);backdrop-filter:blur(1.5rem);border:1px solid var(--light-color)}.login-page__form--content{position:relative;z-index:1;width:250px;height:250px;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center}.login-page__form--prompt{text-transform:uppercase;font-weight:300}.login-page__form--title,.login-page__form--location,.login-page__form--button{text-transform:uppercase;font-weight:700}.login-page__form--button{background-color:var(--mystic-color);width:100%;padding:8px;letter-spacing:4px;border-radius:40px;cursor:pointer}@media only screen and (min-width: 600px){.login-page__form{grid-column:4 / 9}}.config-user-page{min-height:100vh;display:grid;place-items:center}.config-user-page__form{min-height:550px;width:90%;max-width:400px;padding:32px 20px;margin-top:28px;margin-bottom:28px;border:solid 2px var(--dark-color);border-radius:12px;display:flex;flex-direction:column;justify-content:space-evenly;align-items:center;-webkit-backdrop-filter:blur(2.5rem);backdrop-filter:blur(2.5rem);background-color:#0000001a}.config-user-page__title{text-transform:uppercase}.config-user-page__user-info{width:100%;display:flex;flex-direction:column;align-items:center;padding-bottom:8px}.config-user-page__img{height:150px;width:150px;border-radius:12px}.config-user-page p{text-align:center}.config-user-page__input-container{width:100%;margin-bottom:8px}.config-user-page__input{width:100%;padding:12px 20px;box-sizing:border-box;outline:none;background-color:var(--dark-color);color:var(--light-color)}.config-user-page__input::placeholder{opacity:1}.config-user-page__input:focus{background-color:var(--light-color);color:var(--dark-color)}.config-user-page__team-label{display:flex;justify-content:space-between;width:100%;padding:12px 20px;box-sizing:border-box;background-color:var(--valor-color);margin-bottom:4px;cursor:pointer}.config-user-page__team-label--mystic{background-color:var(--mystic-color);color:var(--light-color)}.config-user-page__team-label--valor{background-color:var(--valor-color);color:var(--light-color)}.config-user-page__team-label--instinct{background-color:var(--instinct-color);color:var(--light-color)}.config-user-page__buttom{width:100%;background-color:#27ae60;border:3px solid #27ae60;border-radius:4px;color:var(--light-color);padding:12px 20px;text-align:center;font-size:16px;cursor:pointer;box-sizing:border-box;text-transform:uppercase;letter-spacing:2px;font-weight:700}.config-user-page__buttom:hover{background-color:#a5d6a7;color:#27ae60}.config-user-page__buttom:disabled{background-color:gray;color:#ffffff80;border:3px solid gray;cursor:no-drop}