/*==================
Name: Akappella INC
URL: Akappella.com
verison:  1.0 
29.10
====================*/

/*=login=*/
.login-form {
  width: 25%;
  text-align: center;
}
.login-form input{
  width: 100%;
  padding: 15px 20px;
  background: var(--main-bg);
  color: var(--text-white);
  border: 0;
  border-radius: 30px;
  font-size: 14px;
  margin-bottom: 10px;
}
.login-form input:focus{
  outline: none;
  box-shadow: 0 0 0 1px var(--text-white);
}
.lgbtn{
  height: 45px;
}
/*input::-webkit-credentials-auto-fill-button {
  background-color: var(--text-white);
}*/
/* .login-details a:hover{
  color: var(--text-white);
} */
.footer-login{
  bottom:30px;
  left: 0;
  right: 0;
  text-align: center;
}
.divider-line {
  flex-grow: 1;
  border-bottom: 1px solid var(--main-button);
}
/*==admin==*/
.admin-drp {
  display: none;
}
.admintable tbody tr:hover .admin-drp {
  display: block;
}
.adminpermi{
  width: 70px;
  text-align: left;
}
.f2a-admin {
  gap: 3%;
}
.f2a-admin input {
  text-align: center;
  font-size: 18px;
  padding: 10px;
  border:1px solid var(--main-button);
  width: 50px;
  height: 50px;
}
.f2a-admin .er {
  border: 1px solid var(--text-red);
}
.f2a-admin .sc {
  border: 1px solid var(--text-correct);
}
.f2a-admin input::-webkit-input-placeholder {
  font-size: 24px;
}
.f2a-admin input:-ms-input-placeholder {
  font-size: 24px;
}
.f2a-admin input::placeholder {
  font-size: 24px;
}
/*====*/
header {
  width: 100%;
  padding: 0.2rem 2rem;
  border-bottom: 1px solid var(--main-button);
  display: inline-block;
  vertical-align:top;
  background: var(--main-body);
  position: sticky;
  z-index: 9999;
  top: 0;
  height: 48px;
  box-sizing: border-box;
}
.nav-man{
  margin: auto 1rem;
  color: var(--text-white);
  /* opacity: 30%; */
}
.nav-man a {
  padding: 0.4rem 1rem;
}
.nav-man:hover, .t-name:hover, .t1-name:hover .template-title, .login-details a:hover, .hvr-agg {
  background: var(--text-correct);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.nav-man.active {
  background: var(--text-correct);
  opacity: 100%;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.nav-man img {
  filter: brightness(10);
}
.nav-man.active img, .nav-man:hover img {
  filter: brightness(1.0);
}
.profi, .notify{
  width: 34px;
  height: 34px;
}
.profi:hover{
  /* opacity:60%; */
  outline: solid #f9a6a1;
  outline-width: 2px;
}
.searchbox {
  height: 34px;
  /* padding: 5px; */
  max-width: 600px;
  width:34px !important;
  min-width:34px;
}
.search-btn{
  padding: 9px;
}
.searchuni {
  min-width: 260px;
  display:none;
}
.searchbox.active{
  width: 306px !important;
}
.searchbox.active .searchuni{
  display:block;
}
.template-edit {
  padding: 10px;
  border-radius: 10px;
  position: absolute;
  top: -20px;
}
.in-project {
  padding: 4px 8px;
}
.srchbxtp{
  padding-top:10px;
  min-width: 470px;
  z-index: 99;
}
.srchbxtp a, .srchbxtp button{
  padding: .9rem 1rem;
}
.srchbxtp a:hover, .srchbxtp button:hover{
  background: var(--main-hover);
}
.drpdn-u{
  padding: 2px 12px;
}
.drophdr{
  height: 4px;
}
.drpbtmhd{
  border-bottom: 1px solid var(--main-button);
  min-width: 212px;
}
/*==main-body==*/
#main-iframe {
  width: 100%;
  height: calc(100vh - 72px);
}
.container {
/*  width: 1380px;*/
  width: 100%;
  /* width: min(100% - 1px, 1420px); */
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0 2rem;
  margin: 1.5rem auto;
  /* min-height: calc(100% - 120px); */
}
.container::-webkit-scrollbar {
  display: none;
}
.container-100 {
  height: 100%;
}
.align-div-center {
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
}
/*==project list==*/
.new-button{
  padding: 12px 24px;
  min-width: 140px;
}
.crpj-btn {
  width: 18px;
  height: 18px;
}
.dlt-bt{
  padding: 7px 8px;
}
.pro-noti{
  left: 17px;
  top: 0;
  width: 4px;
  height: 4px;
  background-color: var(--text-red);
}
.pro-table tr .checkbox{
  display:none;
}
.pro-table tr:hover .checkbox, .pro-table tr .checkbox:checked{
  display:block;
}
#move-files, #delete-files {
  padding: 0px 14px;
}
/*==easedrop-external==*/
.edExbn{
  width: 30px;
  height: 30px;
}
.txt_prg p{
  margin: 0 0 .4rem 0;
}
.head-fix{
  position: fixed;
  width: 100%;
  padding: 0 4rem;
  background: var(--main-body);
  z-index: 9;
  left: 0;
  right: 0;
  padding-top: 2rem;
  padding-bottom: 1rem;
  top: 0;
}
/*==project main==*/
.p-main-left {
  width: 69% ;
}
.p-main-right {
  width: 31%;
/*  background: #1A1A1A;*/
}
.p-nav button {
  width: 36px;
  height: 36px;
}
.cdp{
  width: 30px;
  height: 30px;
}
.cmntbx{
  height: 40px;
}
.cMbx {
  height: 48px;
  border-radius:20px;
  /* border: 1px solid var(--main-button); */
  overflow:hidden;
  display:flex;
  background:var(--main-body)
}
.cMbx-time{
  background:var(--text-correct);
  margin:5px;
  border-radius:20px;
}
.cmt-div{
  padding-left: 46px;
}
.cmt-div::before{
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  display: block;
  width: 29px;
  height: 1px;
  background: var(--text-inactive);
}
.timebx {
  height: 18px;
}
.dltbtn:hover{
  color: var(--text-red);
}
/*.p-main-right:after {
  background-color: #1A1A1A;
  content: '';
  display: block;
  position: absolute;
  width: calc( ( 100vw - 1385px + 0px ) / 2 );
  height: 100%;
  z-index: 9;
  top: 0;
  right: calc( ( 100vw - 1403px + 18px ) / -2 )
}*/
.player__timestamp {
  top:-24px;
  left:-2%;
  background: url(../media/test.svg);
  background-repeat: no-repeat;
  width: 34px;
  height: 24px;
  background-size: cover;
  padding-top: 2px;
  cursor: move;
  cursor: grab;
  cursor: -moz-grab;
  cursor: -webkit-grab;
}
.player__timestamp:active {
  cursor: grabbing;
  cursor: -moz-grabbing;
  cursor: -webkit-grabbing;
}

/* .player__timestamp div:after {
  content: '';
  position: absolute;
  left: -3px;
  right: 0;
  top: 14.5px;
  display: block;
  border-top: 8px solid var(--text-correct);
  border-left: 17px solid transparent;
  border-right: 17px solid transparent;
  border-radius: 2px;
} */
.files-viewer {
  width: 100%;
  background: var(--main-bg);
  border-radius: 16px;
  /* padding: 20px 25px; */
}
.folders ul {
  list-style: none;
  padding: 0;
}
.folders li:hover{
  background:var(--main-hover);
  border-radius:20px;
}
.folders li.active{
  background-color: var(--text-white) !important;
  border-radius:20px;
}
#quick_folder li.active .flNm{
  color:black;
}
#quick_folder li.active .dropdown img{
  filter:brightness(0);
}
.folders li a{
  margin: 0px; 
  display: block; 
  width: 100%; 
  height: 100%;
}
.pro-notify {
  width: 6px;
  height: 6px;
  top: 0;
  bottom: 0;
  margin: auto;
  background: var(--main-purple);
}
.folder-nav, .v-hidden {
  visibility: hidden;
}
.folders li:hover .folder-nav,
.folders .active .folder-nav{
  visibility: visible;
}
.pro-table .active .pro-title{
  color: var(--text-correct);
}
.pro-table tbody tr:hover, .pro-table tbody tr.hover, .pro-table tbody .active{
  background: var(--main-hover);
}
tbody td .pro-title {
  max-width: 390px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pr-namefield{
  width:400px;
  border-radius:12px;
  padding:0 10px;
}
.rnwt{
  color: white;
  -webkit-text-fill-color: white !important;
  background-clip: unset;
  -webkit-background-clip: unset;
}
/* -- new UI 25 -- */
.cmt-divider{
  border-bottom: 1px solid var(--main-button);
  margin: 0 34px;
}
.cmnt-usr{
  height: 24px;
  width: 24px;
}
.cmnt-box:hover{
  background: var(--main-hover);
}
.p-btn{
  height: 22px;
  width: 22px;
}
.cstm-1012{
  margin-top: 10px;
  margin-bottom: 12px;
}
.g-18{
  gap: 18px;
}
.cmhvbtn{
  display: none;
}
.cmnt-box:hover .cmhvbtn{
  display: block;
}
.cmt-reply{
  margin-top: 24px;
  margin-left: 35px;
}
/*==newcss-project-main==*/
.player1{
  background: var(--main-bg);
  border-radius: 16px;
  padding: 20px 12px;
  height: 180px;
}
#track-player {
  padding-bottom:6px;
}
/* .player___empty {
  margin-top: 60px;
} */
.breadcrumb {
  color: var(--text-dark);
}
.breadcrumb .divide {
  padding: 0 8px;
}
.breadcrumb .active {
  color: var(--text-white);
}
.pro-table tr td:first-child{
  border-top-left-radius:32px;
  border-bottom-left-radius:32px;
}
.pro-table tr td:last-child{
  border-top-right-radius:32px;
  border-bottom-right-radius:32px;
}
.pro-table tr td:first-child, .pro-table tr th:first-child{
  padding-left: 1.3rem;
}
.pro-table tbody tr td {
  padding: 1rem .3rem 1rem 0;
}
.wavuser, .wavuser img{
  height: 20px;
  width: 20px;
}
.wavuser.read{
  border: 1px solid #E4976C;
}
.wavuser.unread{
  border: 1px solid #32CF0B;
}
.prmply{
  padding: 13px;
  width: 38px;
  height: 38px;
}
.pro_actfv{
  padding-top: 16px !important;
}
.pro_actfv:hover{
  background: var(--main-hover);
}
.pro_actfv span{
  /* font-weight: bold; */
}
.pr0__djnutJf, .cst-notfy .mx-cst-11, .actbtm {
  border-bottom: 1px solid var(--main-button);
}
/*==popup==*/
.popup-body table tbody tr:hover{
  background: var(--search-btn);
}
.popup-body table th:first-child{
  /* padding-left: 1.5rem; */
}
.popup-body table th:last-child, .popup-body table td:last-child{
  padding-right: 1.5rem;
}
#popside-inbox{
  top: 48px;
  width: 65%;
}
#popside-notify{
  top: 48px;
  width: 40%;
}
#popside-activity{
  width: 40%;
}
/*==popup-team==*/
.search-team{
  width: 100%;
  height: 40px;
}
.select-team{
  width: 100px !important;
}
.team-drp {
  display: none;
  z-index: 99;
  padding-top: 8px;
}
.tm-drp{
  width: 95px;
}
/* .tm-drp:hover .team-drp{
  display: block;
} */
.team-drp button:hover{
  background: var(--main-hover);
}
/*.tem-st:hover{
  background:var(--main-hover);
}
*/

/*==easedrop-internal==*/
.edpbx{
  /* padding: 35px; */
  border-radius: 28px;
  min-width: 418px;
  max-width: 418px;
  height: fit-content;
}

.edp-dp{
  width: 100%;
  height: 418px;
  border-radius: 28px 28px 0 0;
}
.edp-dp #easedrop-img {
  object-fit: cover;
  object-position: center;
  min-width: 100%;
}
.edpnbx{
  padding: 25px 35px;
}
.edp-dpz{
  inset: 0;
  display:none;
  background: rgba(0, 0, 0, 0.60);
}
.edp-dp:hover .edp-dpz{
  display:block;
}
.editico{
  width: 36px;
  height: 36px;
  position: absolute;
  bottom: 24px;
  left: calc(50% - 16px);
}
.edp-box{
  min-width: 740px;
  padding: 0 20px ;
  height: 70px;
  max-width: calc(100vw - 690px);
}
.edp-box:hover{
  background-color: var(--main-hover);
}
.edp-box .text{
  width:510px;
  padding: 12px 0;
}
.edpbtn{
  width: 90px;
  height: 30px;
}
.edpbtn:disabled,
.edpbtn[disabled],
.edExbn:disabled,
.edExbn [disabled]{
  color: var(--text-dark);
  cursor: not-allowed;
  pointer-events: none;
}
.edpbtn:disabled img,
.edpbtn[disabled] img,
.edExbn:disabled img,
.edExbn [disabled] img{
  opacity: .5;
}
.txt__htf {
  height: calc(100vh - 350px);
}
.p__fedmd{
  padding: 0.8rem;
}
.edtb__expdst td{
  padding: .5rem .3rem .5rem 0;
}
.edtb__expdst th:first-child, .edtb__expdst td:first-child{
  padding-left: 1.5rem !important;
}
.edtb__expdst th:last-child, .edtb__expdst td:last-child{
  padding-right: 1.5rem !important;
}
.edtb__expdst tr:hover th:first-child, .edtb__expdst tr:hover td:first-child {
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
}
.edtb__expdst tr:hover td:last-child {
  border-top-right-radius: 25px;
  border-bottom-right-radius: 25px;
}
.edlstpro{
  width: 20px;
  height: 20px;
}
.akatogle:disabled{
  opacity: .5;
}
.upd__stm {
  background-color: var(--text-white);
}
.tp-button{
  padding: 12px 24px;
}
.ed-details {
  transform: rotate(90deg);
}
.ed-details-rev {
  transform: rotate(-90deg);
}
#content {
  display: none;
}
.w-20{
  width: 20%;
}
.w-80{
  width:70%;
}
.import-table tr {
  height: 50px;
}
.play, .t-name:hover .edExbn, .t1-name:hover .edExbn{
  background: var(--text-correct);
}
.play img, .t-name:hover .edExbn img, .t1-name:hover .edExbn img{
  filter: brightness(0);
}
.play:hover{
  background: var(--text-white);
}
.aggico14{
  height: 14px;
}
.aggico16{
  height: 16px;
}
.hover-agg:disabled img,
.hover-agg[disabled] img{
  filter: invert(56%) sepia(2%) saturate(23%) hue-rotate(328deg) brightness(95%) contrast(94%) !important;
}
.discb p{
  margin-top: 0;
  letter-spacing: 0.21px;
}
.discb a, .forstnt:hover {
  background: var(--text-correct);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.inputbxdiscb{
  height: 171px; ;
}
.inputbxdiscb textarea {
  resize: none;
}
.tag__meta{
  background: var(--text-white);
  color: var(--main-bg);
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 40px;
  flex-shrink: 0;
}
/* .tag__meta button img {
  width: 8px;
} */
.stmuplbx{
  top: 0;
  bottom: 0;
  right: 10px;
}
.stmedcbx{
  top: 0;
  bottom: 0;
  left: -40px;
  width: 50px;
}
.edshrtm{
  width: 25px;
  height: 25px;
}
.edpsshrdp{
  padding-top:15px;
  z-index: 9;
}
.edpsshrdp a:hover{
  background: var(--text-inactive);
}
.ed-shnw{
  border-radius: 18px;
  flex-wrap: wrap;
}
#share-user {
  flex: 1;
  min-width: 120px;
}
.ed-shnwbt{
  height: 37px;
}
/* .ed-left{
  width: 49.4%;
  margin-right: 1rem;
}
.ed-right{
  width: 50.6%;
}
.tp-button{
  padding: 7px 14px;
}
.ed-box{
  border: 1px solid var(--main-button);
  margin-top: 1rem;
}
.ed-popbt {
  padding: 8px 22px;
}
.box-checkcolps, .ed-delete {
  visibility: hidden;
}
.show .box-checkcolps, .show .ed-delete img {
  visibility: visible;
}
.show .ed-arrow img{
  transform: rotate(90deg);
  margin-top: 5px !important;
}
.table-steams tr td:first-child{
  padding-left: 1rem !important;
}
.table-steams tr td:last-child{
  padding-right: 1rem !important;
}
.table-steams .title{
  width: 50%;
}
.table-steams .size{
  width: 15%;
}
.table-steams .ed-chkbx{
  width: 20px;
}
.table-steams .ed-chkbx input{
 margin: 0 0.7rem;
}
.table-steams td {
  padding:10px 0px !important;
}
.shsecbx{
 height: 40px;
}
.ed-box-stems {
  display: none;
}
.ed-box-stems.show{
  display: block;
}
.ed-table thead * {
  padding: 0.8rem 0.3rem 0.8rem 0;
}
.edlstpro{
  width: 20px;
  height: 20px;
}
.edpllftn{
  padding-left: 2rem !important;
}
.edmodal{
  width: 50%;
}
.heix1{
  height: calc(100% - 150px);
}
.txblbx1o .ed-chkbx:first-child {
  padding-left: 0 !important;
}
.player___empty{
  height: 158px;
} */
.edp-ckbx .checkbox{
  display:none;
}
.edp-ckbx .edp-box:hover .checkbox,.edp-ckbx #top-button:hover .checkbox, .edp-ckbx .edp-box .checkbox:checked, .edp-ckbx #top-button .checkbox:checked{
  display:block;
}
#track-list {
  overflow: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

#track-list::-webkit-scrollbar {
  display: none;
}
#easedrop-title{
  word-break: break-word;
}
/*==settings==*/
.stngl{
  width: 40%;
}
.plans{
  width: 60%;
}
/* .stngl:before {
  background-color: var(--main-bg);
  content: '';
  display: block;
  position: absolute;
  width: calc( ( 100vw - 1374px ) / 2 );
  height: 100%;
  z-index: 9;
  top: 0;
  left: calc( ( 100vw - 1410px + 35px ) / -2 );
} */
.profile-change{
  height: 80px;
  width: 80px;
}
.profile-hover{
  display: none;
}
.profile-change:hover .profile-hover{
  display: block;
  background: rgba(26, 26, 26, 0.7);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.profile-remove {
  right: 0;
  display: none;
}
.profile-change:hover .profile-remove{
  display: block;
}
.frmgp .form-input{
  display: block;
  width: 100%;
  height: calc(2.8rem + 2px);
  padding: 0.375rem 1.4rem;
  background: var(--main-hover);
}
.frmgp label{
  margin-bottom: 0.8rem;
}
.boxost{
  padding: 61px;
  border: 1px solid #313131;
  border-radius: 42px;
  max-width: 580px;
}
.form-btn{
  padding: 12px 38px;
  /* border: 1px solid var(--text-white); */
}
.stng-notify {
  width: 75%;
}
.plans-box{
  width: 60%;
}
.bar-end {
  right: -6px; 
}
.plan-selector {
  margin-top: 4rem;
}
.plan-table tr:hover {
  background-color: transparent;
}
.plntbtd{
  width: 25%;
}
.plan-btm{
  border-bottom: 1px solid transparent;
  border-image: var(--text-correct);
  border-image-slice: 1;
  width:100%;
}
.plantbnin .active {
  background: var(--text-correct);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.grdbtnnw {
  min-width: 107px;
  position: relative;
  display: inline-block;
  border-radius: 50px;
  border: none;
  cursor: pointer;
  z-index: 1;
  overflow: hidden;
}

.grdbtnnw::before {
  content: '';
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
  background: var(--text-correct); 
  border-radius: 50px;
  z-index: -1;
}
.grdbtnnw::after {
  content: '';
  position: absolute;
  top: 1px;
  left: 1px;
  right: 1px;
  bottom: 1px;
  background-color: #333;
  border-radius: 50px;
  z-index: -1;
}
.grdbtnnw:hover::after {
  background: var(--text-correct);
}
.grdbtnnw:disabled,
.grdbtnnw[disabled]{
  color: var(--text-dark);
  cursor: not-allowed;
  pointer-events: none;
  border: 0px !important;
}
.grdbtnnw:disabled::after,
.grdbtnnw[disabled]::after
{
  content: '';
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  bottom: -1px;
}
.tabin .tabs .in-tab .plan-table span {
  display: inline;
}
.tglstng{
  width: 36px !important;
  height: 18px !important;
}
.tglstng:before {
  height: 18px !important;
  width: 18px !important;
}
.tglstng:checked:before {
  left: 18px !important;
}
/*==easedrop=list==*/
.edrqst {
  width: 112px;
  padding: 9px;
/*  background: var(--main-org);*/
}
.esdrp_list .edrqst:hover{
  background: var(--text-white);
  color: var(--main-body);
}
.srch_Bx{
  min-width: 220px;
}
.divider{
  border:1px solid var(--text-inactive);
}
.join__btn{
  right: 3rem;
  top: 7rem;
}
/*new-css*/
.t-inbox{
  border-collapse: collapse;
  width: 100%;
  table-layout: fixed;
}
.t-inbox th:first-child {
  width: 5% ;
}
.t-inbox .th-1 {
  width:40%;
}
.th-2{
  width:10%
}
.th-3{
  width:15%
}
.th-4{
  width:10%
}
.th-5{
  width:10%
}
.th-6{
  width:10%
}
.th-7{
  width:5%
}
.eavesdrop-name{
  padding: 1rem .3rem 1rem 0;
}
/*==player==*/
.player{
  position: fixed;
  bottom: 14px;
  left: 30px;
  right: 30px;
  height: 64px;
  background: var(--main-bg);
  border-radius: 50px;
  max-height: 75px;
  padding: 12px;
}
.player-thumb{
  height: 48px;
  width: 48px;
  border-radius: 50px;
  background-position: center;
}
#player button:hover{
  opacity:.8;
  transform: scale(1.08);
}
#audio-thumb {
  min-height: 100%;
  object-fit: cover;
  width: 100%;
}
.pl__rptxt{
  top: 13.5px;
  left: 0;
  right: 0;
  font-size: 8px;
}
.ply__bgs{
  background-color: var(--text-inactive);
}
.ply__vol{
  height: 4px;
}
.mini{
  max-width: 237px;
  margin-left: auto;
}
.mini .minix {
  display: none !important;
}
.plyx {
  display: none !important;
}
.mini .plyx{
  display: flex !important;
}
.plycz_1{
  width: 30%;
  min-width: 360px;
}
.volume-slider {
  width: 100%;
  padding: 15px 0;
  cursor: pointer;
}
input[type="range"] {
  width: 100%;
  color: #fac6aa;
  --thumb-height: 14px;
  --track-height: 0.125em;
  --track-color: rgba(0, 0, 0, 0.2);
  --clip-edges: 0.125em;
}
input[type="range"] {
  /* position: relative; */
  background: #fff0;
  overflow: hidden;
}

/* === WebKit specific styles === */
input[type="range"],
input[type="range"]::-webkit-slider-runnable-track,
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  transition: all ease 100ms;
  height: var(--thumb-height);
    position: relative;
}
input[type="range"]::-webkit-slider-thumb {
  --thumb-radius: calc((var(--thumb-height) * 0.5) - 1px);
  --clip-top: calc((var(--thumb-height) - var(--track-height)) * 0.5 - 0.5px);
  --clip-bottom: calc(var(--thumb-height) - var(--clip-top));
  --clip-further: calc(100% + 1px);
  --box-fill: calc(-100vmax - var(--thumb-width, var(--thumb-height))) 0 0
    100vmax currentColor;

  width: var(--thumb-width, var(--thumb-height));
  background: linear-gradient(currentColor 0 0) scroll no-repeat left center /
    50% calc(var(--track-height) + 1px);
  background-color: currentColor;
  box-shadow: var(--box-fill);
  border-radius: var(--thumb-width, var(--thumb-height));

  clip-path: polygon(
    100% -1px,
    var(--clip-edges) -1px,
    0 var(--clip-top),
    -100vmax var(--clip-top),
    -100vmax var(--clip-bottom),
    0 var(--clip-bottom),
    var(--clip-edges) 100%,
    var(--clip-further) var(--clip-further)
  );
}

input[type="range"]::-webkit-slider-runnable-track {
  background: linear-gradient(var(--track-color) 0 0) scroll no-repeat center /
    100% calc(var(--track-height) + 1px);
}

/* === Firefox specific styles === */
input[type="range"],
input[type="range"]::-moz-range-track,
input[type="range"]::-moz-range-thumb {
  appearance: none;
  transition: all ease 100ms;
  height: var(--thumb-height);
}

input[type="range"]::-moz-range-track,
input[type="range"]::-moz-range-thumb,
input[type="range"]::-moz-range-progress {
  background: #fff0;
}

input[type="range"]::-moz-range-thumb {
  background: currentColor;
  border: 0;
  width: var(--thumb-width, var(--thumb-height));
  border-radius: var(--thumb-width, var(--thumb-height));
  cursor: grab;
}
input[type="range"]::-moz-range-track {
  width: 100%;
  background: var(--track-color);
}

input[type="range"]::-moz-range-progress {
  appearance: none;
  background: currentColor;
  transition-delay: 30ms;
}

input[type="range"]::-moz-range-track,
input[type="range"]::-moz-range-progress {
  height: calc(var(--track-height) + 1px);
  border-radius: var(--track-height);
}
.playerdrp {
  bottom:30px !important;
}
/*==player-old==*/
/* .player{
  position: fixed;
  bottom: 0;
  height: 81px;
  left: 0;
  right: 0;
}
.ply-in{
  flex-basis:33.33%; 
}
.plbg{
  height: 81px;
  width: 81px;
  bottom: 0;
  visibility: hidden;
}
.plytl{
  height: 5px;
}
.player-body{
  padding: 1rem 2rem;
}
.player-active {
  padding-bottom: 82px !important;
} */
.ply-w{
  min-width: 470px;
}
.repeat-t{
  top: 32%;
  left: 0;
  font-size: 8px;
  right: 0;
  bottom: 0;
}
/*==tabs==*/
.tabin .tabs .in-tab span {
  display: block;
}
.tabin .in-tab:not(:first-of-type) {
  display: none
}
/*==according==*/
.accordion button[aria-expanded=true] + .accordion-content, .acc-sc {
  opacity: 1;
  max-height: 16em;
  overflow-y: scroll;
  transition: all 200ms linear;
  will-change: opacity, max-height;
}
.accordion .accordion-content {
  opacity: 0;
  max-height: 0;
  overflow: hidden;
  transition: opacity 200ms linear, max-height 200ms linear;
  will-change: opacity, max-height;
}
.accordion-content P {
  margin-top: 0;
}
.acc-inacc {
  overflow-y: auto !important;
}
.accordion-content div.d-flex:last-child {
  margin-bottom:18px !important;
}
/*==import==*/
.impo-flip {
  transform: rotate(0deg);
  transition: .2s;
}
.accordion button[aria-expanded=true] .impo-flip, .ico-90d{
  transform: rotate(90deg);
}
.accinimpo {
  min-width: 6rem;
}
.accinimpo.active{
  background: var(--text-white);
  color: var(--main-body);
}
.acc-tab{
  width: 3.5rem;
}
.acc-tab:hover, .acc-tab.active{
  background: var(--text-white);
  color: var(--main-body);
}
/*==empty-height==*/
.empty-box{
  height: calc(100vh - 260px);
}
/*==homepage==*/
#main{
  cursor:none;
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
}
.topfi{
  position: fixed;
  top: 0;
  border-bottom: 1px solid var(--main-button);
  backdrop-filter: blur(5px);
}
.mt-110{
  margin-top: 110px;
}
.logo-main{
  max-width: 86px;
}
.f-light{
  font-weight: 300;
}
.f-xlight{
  font-weight: 200;
}
.f-42{
  font-size: 2.625rem;
}
.f-40{
  font-size: 40px;
}
.f-lighter{
  font-weight: 200;
}
.f-xbold{
  font-weight: 800;
}
.f-46{
  font-size: 46px;
}
.f-48{
  font-size: 48px;
}
.f-71{
  font-size: 4.6rem;
  font-weight: 600;
}
.ft-high{
  background: var(--highlight-text, linear-gradient(90deg, #FF9F9F 0.41%, #F3EDB5 100%));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.app-box{
  max-width: 1090px;
}
.mw4o{
  max-width: 440px;
}
.space{
  margin-top:4.75rem;
}
.emput{
  min-width: 400px;
}
.bg-pro{
  /* background-image: url(../media/pro-bg.png); */
  height: 508px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1300px 454px;
}
.bg-pro2{
  background-image: url(../media/ease-drop.png);
  height: 509px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1200px 448px;
}
.hpakptmns{
  top: -40px;
}
.login{
  font-size: 14px;
}
.mphdbrd {
  padding-top: 6.25rem;
  margin-bottom: 6.25rem;
}
.mphdbrd p {
  margin: 0;
}
.la:hover, .high, .btn-agg {
  color:black;
  background: linear-gradient(90deg, #FF9F9F 0.41%, #F3EDB5 100%);
}
.high:hover{
  background: var(--text-white);
}
.cursor-circle {
  position: fixed;
  width: 100px;
  height: 100px;
  background: radial-gradient(circle, rgb(244 235 181), rgb(255 160 159));
 /* background: radial-gradient(circle, rgba(255,159,158,1) 0%, rgba(243,235,180,0.5200674019607843) 55%, rgba(243,235,180,0) 100%);
  background: radial-gradient(circle, rgba(243,235,180,1) 0%, rgba(243,235,180,0) 100%);*/
  border-radius: 50%;
  pointer-events: none; /* Prevent the circle from blocking other elements */
  opacity: 0.7;
  filter: blur(15px);
  transform: translate(-50%, -50%);
  transition: opacity 0.1s;
  mix-blend-mode: screen;
}
/*==drag&drop==*/
.drag{
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin-top: 75px !important;
  background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='30' ry='30' stroke='%23E4976C' stroke-width='2' stroke-dasharray='6%2c 14' stroke-dashoffset='7' stroke-linecap='square'/%3e%3c/svg%3e");
  border-radius: 30px;
  z-index: -9;
}
.dragmsg{
  bottom: 10%;
  left: 0;
  right: 0;
  pointer-events: none;
}
.msgd {
  width: fit-content;
}
.drgdrp {
  animation: fadeOutGradient 2s ease-in-out;
}
@keyframes fadeOutGradient {
  0% {
    background: linear-gradient(90deg, #FF9F9F 0.41%, #F3EDB5 100%);
  }
  100% {
    background: rgba(255, 255, 255, 0);
  }
}
/*==poplogin==*/
.poplog{
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.60);
  z-index: 99;
  padding-top: 67px;
  overflow-y: hidden;
}
.pop-body{
  min-width: 420px;
  min-height: 351px;
}
.back-btn{
  transform: rotate(180deg);
}
/*==notification==*/
.mx-cst-11{
  padding-top: 16px;
  padding-bottom: 16px;
}
.ml-cst-11{
  margin-left: 11px;
}
.cst-notfy{
  padding-top: 16px;
}
.cst-notfy span{
  /* font-weight: 600; */
}
.cst-notfy:hover{
  background: var(--main-hover);
}
/*==like-track==*/
.trck-lk{
  width: 1003px;
  margin:  0 auto;
}
.trk-ic{
  opacity: .3;
}
.likebx{
  max-width: 100% !important;
}
/*==help==*/
.htfsc{
  height: calc(100vh - 256px);
}
/*==trash==*/
.trs__bx tbody td:first-child{
  padding: .4rem .3rem .4rem 1.3rem;
}
/*==feedback==*/
.feedback{
  background: #1d1d1d;
  position: fixed;
  height: 48px;
  bottom: 80px;
  left: 30px;
  border-radius: 9px;
  padding: 12px;
  padding-top: 18px;
  min-width: 240px;
  display: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 1000;
}
.feedback:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 9px;
  left: 0;
  background: var(--text-correct);
}
/*== Mobile ==*/
@media(max-width: 600px) {
  .login-form{
    width: 80%;
  }
  .container{
    margin: 25px 20px;
  }
  /* homepage */
  .flex-mob{
    flex-direction: column;
    align-items: center;
  }
  .flex-mob button{
    margin-top: 1.4rem;
    margin-left: 0 !important;
    padding: 10px;
    width: max-content;
  }
  .emput{
    min-width: 300px;
  }
  .bg-pro{
    background-size: 600px 245px;
    height: 255px;
    width: 100%;
  }
  .bg-pro2{
    background-size: 600px 255px;
    height: 260px;
  }
  .f-42{
    font-size: 20px;
  }
  .f-71{
    font-size: 3rem;
    margin-top: 1rem;
    margin-bottom: 4rem;
  }
  .f-48{
    font-size: 28px;
  }
  .space{
    font-size: 18px;
  }
  .cursor-circle{
    display: none;
  }
   .app-box{
    flex-direction:column;
  }
}