html,
body { 
  scroll-behavior: smooth;
}   
button {
  cursor: pointer;
  transition: 0.8s;
  border: none !important; 
  outline: none !important;
}
.bgt {
  background-image: linear-gradient(48deg, #fff, #ffffff76, #fff, #ffffff28);
  background-size: 218%;
  width: fit-content;
  background-clip: text;
  animation: bgscroll 2.8s linear infinite alternate-reverse;
}
.bgtick {
  background-image: linear-gradient(48deg, #147800, #00ff22);
  width: fit-content;
  background-clip: text;
  height: fit-content;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bgtick i {
  color: transparent;
  font-size: large;
  margin-bottom: -3.28px !important;
}
.bgx {
  background-image: linear-gradient(48deg, #780000, #ff0000);
  width: fit-content;
  background-clip: text;
  height: fit-content;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.bgx i {
  color: transparent;
  font-size: large;
  margin-bottom: -3.28px !important;
}
card {
  margin: 8px;
  border: 1px solid #ffffff28;
  padding: 14.8px;
  display: block;
  width: fit-content;
  min-width: 288px;
  border-radius: 18px;
  filter: drop-shadow(0 0 0.8rem rgba(238, 130, 238, 0.18));
  background-color: #000000e5;
}
card h1{
  font-weight: 700;
  font-size: 24.8px;
}
card h3 {
  color: violet;
  font-weight: 600;
}
.price {
  font-size: larger !important;
  color: rgb(255, 255, 255) !important;
  padding: 8px;
  background-image: linear-gradient(48deg, #0003d0, #3b76ff);
  border-radius: 28px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700 !important;
  height: fit-content;
  margin-left: 78px;
  padding-left: 14px;
  padding-right: 14px;
}
.specs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: "Outfit", sans-serif;
  margin: 6.48px;
}
.specs p {
  font-size: larger !important;
  margin-top: -4.28px;
}
.getplan {
  border: none;
  border-radius: 28px;
  padding: 8px;
  margin: 8px;
  font-weight: 600;
  width: 88%;
  background-color: rgb(69, 0, 208);
  margin-top: 18px;
  color: white;
  background-size: 188%;
  background-position: left;
  height: 42px;
  font-size: large;
}

.flex {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  padding: 8px;
}

@media (max-width: 780px) {
  .flex {
    flex-direction: column;
  }
}

store-checkout {
  display: none;
  text-align: left;
  width: 88% !important;
  border: 2px solid #9e16f8;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}

input {
  border: none;
  background-color: white;
  border-radius: 4.8px;
  padding: 8px;
  margin: 8px;
  outline: none;
}
select {
  border: none;
  background-color: white;
  border-radius: 4.8px;
  padding: 8px;
  margin: 8px;
  outline: none;
  width: 188px;
}

#sc_plan_name {
  color: #9e16f8;
}

#userarea {
  display: none;
}

user-subcriptions {
  display: block;
  text-align: left;
  justify-content: left !important;
  width: 88% !important;
  border: 2px solid #9e16f8;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}

basic-tools {
  display: block;
  text-align: left;
  width: 88% !important;
  border: 2px solid #161af8;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}
ni {
  padding: 8px;
  margin: 8px;
  justify-content: center !important;
  border: 2px solid #ffffff28;
  filter: drop-shadow(0 0 0.8rem #ffffff28);
  border-radius: 8px;
  background-color: #000;
  cursor: pointer;
}
ni:hover{
  border: 2px solid #b6b6b6;
}
ni img {
  width: 48px;
  height: 48px;
  justify-self: center !important;
}

support {
  width: 88% !important;
  border: 2px solid #161af828;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
  cursor: pointer;
}

#subscription_status {
  color: #22cb00;
}
basic-tools-requester {
  display: none;
  width: 88% !important;
  border: 2px solid #161af828;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}
basic-tools-requester textarea {
  display: block;
  width: 88% !important;
  min-height: 88px !important;
  outline: none;
  border: 2px solid #9e16f8;
  border-radius: 8px;
  padding: 8px;
  font-size: large;
}

general-pro-tools-editor {
  display: none;
  width: 88% !important;
  border: 2px solid #161af828;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}

#userarea #support_msgs {
  display: none;
  width: 98% !important;
  padding: 18px;
  margin: 18px;
  margin-left: 0px !important;
  margin-top: -14.8px;
  border-radius: 18px;
  background-color: transparent;
}

.msg_support {
  width: 88%;
  height: fit-content;
  border-radius: 8px;
  padding: 8px;
  background-color: #4e4e4e;
  text-align: left;
  margin: 8px;
  color: white;
}

.msg_user {
  width: 88%;
  height: fit-content;
  border-radius: 8px;
  padding: 8px;
  background-color: #11357c;
  text-align: right;
  margin: 8px;
  color: white;
}

support-msgs-container {
  display: block;
  height: 328px;
  overflow-y: scroll !important;
}

previous-basic-requests {
  text-align: left;
  display: block;
  width: 88% !important;
  padding: 18px;
  margin: 18px;
  margin-top: -14.8px;
  border-radius: 18px;
  background-color: #000000;
  border: 2px solid #161af888;
}
#prev_basic_requests {
  max-height: 288px;
  overflow-y: scroll;
  padding-top: 18px !important;
  display: flex;
  flex-direction: column-reverse;
}
.prev_basic_request {
  margin: 8px;
  padding: 8px;
  border-radius: 8px;
  background-color: #11357c;
}

/*For Team*/
.support_list_child {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background-color: #11357c;
  border-radius: 8px;
  cursor: pointer;
}
.support_list_child img {
  width: 42.8px;
  height: 42.8px;
}

.prev_basic_request_team {
  margin: 8px;
  padding: 8px;
  border-radius: 8px;
  background-color: #11357c;
  color: white;
}
.basic_status {
  background: #0003d0;
  color: white;
  border-radius: 18px;
  height: 28px;
  font-size: small;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 8px;
  margin: 8px;
}
.basic_msg {
  background: #0070ad;
  color: white;
  border-radius: 18px;
  height: 28px;
  font-size: small;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 8px;
  margin: 8px;
}

seo-tools-basic {
  display: block;
  text-align: left;
  width: 88% !important;
  border: 2px solid #161af8;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}

seo-tools-pro {
  display: block;
  text-align: left;
  width: 88% !important;
  border: 2px solid #161af8;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}

pro-tools {
  display: block;
  text-align: left;
  width: 88% !important;
  border: 2px solid #8600b7;
  padding: 18px;
  margin: 18px;
  border-radius: 18px;
  background-color: #000000;
}
#token_balance{
  text-align: left;
  width: max-content;
  border: 2px solid #8600b7;
  padding: 8px;
  margin: 18px;
  border-radius: 28px;
  background-color: #000000;
}

#sociotrue_tokens_balance_dashboard{
  color: rgb(241, 212, 47);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 2.8px;
}

#sociotrue_tokens_balance_dashboard i{
  margin-top: 2.8px;
}

websites-users{
  display: none;
  text-align: left;
  background-color: #0070ad;
  padding: 8px;
}

.bui1{
  border: 1px solid #fff;
  background-color: #0003d0;
  color: white;
  outline: none;
  padding: 8px;
  border-radius: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4.8px;
  font-weight: 600;
  margin: 8px !important;
  width: 188px;
}
.bui1 i{
  margin-top: 2.8px;
}
.bui1 span{
  color: gold;
  display: flex;
  align-items: center;
  gap: 4.8px;
}
.bui1 span i{
  margin-top: 2.8px !important;
}

.bui1se{
  border: 1px solid #fff !important;
  background-color: #bb00c2;
  color: white;
  outline: none;
  padding: 8px;
  border-radius: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4.8px;
  font-weight: 600;
  margin: 8px !important;
  width: 118px;
}

.buic{
  border: 1px solid #fff !important;
  background-color: transparent;
  color: white;
  outline: none;
  padding: 8px !important;
  border-radius: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4.8px;
  font-weight: 600;
  height: 32.8px;
  margin: 8px;
  width: 188px;
}
.buic i{
  margin-top: 2.8px;
}

#pro_tool_prompt{
  width: 94.8% !important;
  padding: 4.8px;
  margin: 8px;
  border-radius: 8px;
  border: 2px solid #6f71ff;
  outline: none;
  height: 88px;
}

meta-ads{
  display: none;
  text-align: left;
  background-image: linear-gradient(48deg,#682fe3,#690a7f);
  padding: 8px;
}

.flex .bui1{
  background-color: transparent !important;
  border: 1.8px solid #ffffff !important;
}

payment-gateway-tools{
  text-align: left;
  display: none;
  width: 92.8%;
  padding: 8px;
  margin: 8px;
  border: 2px solid #2c2fd4;
  border-radius: 18px;
}

payment-gateway-tools .flex .bui1{
  width:88px;
}

#payment-gateway-qr{
  width: 188px;
  height: 188px;
  border-radius: 8px;
}

get-followers{
  text-align: left;
  display: none;
  width: 92.8%;
  padding: 8px;
  margin: 8px;
  border: 2px solid #2c2fd4;
  border-radius: 18px;
}

#get-followers span{
  color: gold;
  display: flex;
  align-items: center;
  gap: 4.8px;
}
#get-followers span i{
  margin-top: 2.8px !important;
}

previous-pro-requests {
  text-align: left;
  display: block;
  width: 88% !important;
  padding: 18px;
  margin: 18px;
  margin-top: -14.8px;
  border-radius: 18px;
  background-color: #000000;
  border: 2px solid #161af888;
}
#prev_pro_requests {
  max-height: 288px;
  overflow-y: scroll;
  padding-top: 18px !important;
  display: flex;
  flex-direction: column-reverse;
}

#notification{
  padding: 8px;
  margin: 8px;
  border: 2px solid #0003d0;
  color: white;
  border-radius: 8px;
  display: none;
}

#support_msgs img{
   max-width: 88% !important;
   max-height: 228px !important;
   border-radius: 4.8px;
}