*, ::before, ::after{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}
::backdrop{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
}
.container{
  width: 100%;
}
@media (min-width: 640px){
  .container{
    max-width: 640px;
  }
}
@media (min-width: 768px){
  .container{
    max-width: 768px;
  }
}
@media (min-width: 1024px){
  .container{
    max-width: 1024px;
  }
}
@media (min-width: 1280px){
  .container{
    max-width: 1280px;
  }
}
@media (min-width: 1536px){
  .container{
    max-width: 1536px;
  }
}
.visible{
  visibility: visible;
}
.collapse{
  visibility: collapse;
}
.static{
  position: static;
}
.fixed{
  position: fixed;
}
.\!absolute{
  position: absolute !important;
}
.absolute{
  position: absolute;
}
.relative{
  position: relative;
}
.sticky{
  position: sticky;
}
.\!top-4{
  top: 1rem !important;
}
.\!top-auto{
  top: auto !important;
}
.-bottom-px{
  bottom: -1px;
}
.-left-8{
  left: -2rem;
}
.-top-2{
  top: -0.5rem;
}
.bottom-0{
  bottom: 0px;
}
.bottom-6{
  bottom: 1.5rem;
}
.left-0{
  left: 0px;
}
.left-1{
  left: 0.25rem;
}
.right-0{
  right: 0px;
}
.right-2{
  right: 0.5rem;
}
.right-3{
  right: 0.75rem;
}
.top-0{
  top: 0px;
}
.top-2{
  top: 0.5rem;
}
.top-3{
  top: 0.75rem;
}
.top-4{
  top: 1rem;
}
.top-5{
  top: 1.25rem;
}
.top-auto{
  top: auto;
}
.z-0{
  z-index: 0;
}
.z-10{
  z-index: 10;
}
.z-20{
  z-index: 20;
}
.z-30{
  z-index: 30;
}
.float-right{
  float: right;
}
.\!m-0{
  margin: 0px !important;
}
.\!m-2{
  margin: 0.5rem !important;
}
.m-0{
  margin: 0px;
}
.m-4{
  margin: 1rem;
}
.m-5{
  margin: 1.25rem;
}
.m-6{
  margin: 1.5rem;
}
.m-auto{
  margin: auto;
}
.\!mx-1{
  margin-left: 0.25rem !important;
  margin-right: 0.25rem !important;
}
.mx-0{
  margin-left: 0px;
  margin-right: 0px;
}
.mx-2{
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
.mx-3{
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}
.mx-4{
  margin-left: 1rem;
  margin-right: 1rem;
}
.mx-auto{
  margin-left: auto;
  margin-right: auto;
}
.my-0{
  margin-top: 0px;
  margin-bottom: 0px;
}
.my-0\.5{
  margin-top: 0.125rem;
  margin-bottom: 0.125rem;
}
.my-1{
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}
.my-3{
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}
.my-4{
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.\!mb-0{
  margin-bottom: 0px !important;
}
.\!mb-2{
  margin-bottom: 0.5rem !important;
}
.\!mb-3{
  margin-bottom: 0.75rem !important;
}
.\!mb-4{
  margin-bottom: 1rem !important;
}
.\!ml-auto{
  margin-left: auto !important;
}
.\!mr-1{
  margin-right: 0.25rem !important;
}
.\!mt-0{
  margin-top: 0px !important;
}
.-mb-1{
  margin-bottom: -0.25rem;
}
.-mb-2{
  margin-bottom: -0.5rem;
}
.-mb-80{
  margin-bottom: -20rem;
}
.-mb-96{
  margin-bottom: -24rem;
}
.-ml-1{
  margin-left: -0.25rem;
}
.-ml-2{
  margin-left: -0.5rem;
}
.-ml-8{
  margin-left: -2rem;
}
.-ml-\[2px\]{
  margin-left: -2px;
}
.-mr-1{
  margin-right: -0.25rem;
}
.-mr-8{
  margin-right: -2rem;
}
.-mt-1{
  margin-top: -0.25rem;
}
.-mt-2{
  margin-top: -0.5rem;
}
.-mt-4{
  margin-top: -1rem;
}
.-mt-\[10px\]{
  margin-top: -10px;
}
.-mt-px{
  margin-top: -1px;
}
.mb-1{
  margin-bottom: 0.25rem;
}
.mb-14{
  margin-bottom: 3.5rem;
}
.mb-2{
  margin-bottom: 0.5rem;
}
.mb-3{
  margin-bottom: 0.75rem;
}
.mb-4{
  margin-bottom: 1rem;
}
.mb-5{
  margin-bottom: 1.25rem;
}
.mb-6{
  margin-bottom: 1.5rem;
}
.mb-8{
  margin-bottom: 2rem;
}
.mb-\[10px\]{
  margin-bottom: 10px;
}
.ml-1{
  margin-left: 0.25rem;
}
.ml-2{
  margin-left: 0.5rem;
}
.ml-4{
  margin-left: 1rem;
}
.ml-8{
  margin-left: 2rem;
}
.ml-\[30\%\]{
  margin-left: 30%;
}
.ml-auto{
  margin-left: auto;
}
.mr-0{
  margin-right: 0px;
}
.mr-1{
  margin-right: 0.25rem;
}
.mr-14{
  margin-right: 3.5rem;
}
.mr-2{
  margin-right: 0.5rem;
}
.mr-2\.5{
  margin-right: 0.625rem;
}
.mr-3{
  margin-right: 0.75rem;
}
.mr-4{
  margin-right: 1rem;
}
.mr-5{
  margin-right: 1.25rem;
}
.mt-0{
  margin-top: 0px;
}
.mt-0\.5{
  margin-top: 0.125rem;
}
.mt-1{
  margin-top: 0.25rem;
}
.mt-2{
  margin-top: 0.5rem;
}
.mt-3{
  margin-top: 0.75rem;
}
.mt-4{
  margin-top: 1rem;
}
.mt-5{
  margin-top: 1.25rem;
}
.mt-6{
  margin-top: 1.5rem;
}
.mt-8{
  margin-top: 2rem;
}
.mt-\[10vh\]{
  margin-top: 10vh;
}
.mt-\[50\%\]{
  margin-top: 50%;
}
.mt-auto{
  margin-top: auto;
}
.\!block{
  display: block !important;
}
.block{
  display: block;
}
.inline-block{
  display: inline-block;
}
.inline{
  display: inline;
}
.flex{
  display: flex;
}
.table{
  display: table;
}
.table-caption{
  display: table-caption;
}
.table-cell{
  display: table-cell;
}
.table-row{
  display: table-row;
}
.grid{
  display: grid;
}
.contents{
  display: contents;
}
.list-item{
  display: list-item;
}
.hidden{
  display: none;
}
.\!h-48{
  height: 12rem !important;
}
.\!h-6{
  height: 1.5rem !important;
}
.\!h-80{
  height: 20rem !important;
}
.\!h-\[80vh\]{
  height: 80vh !important;
}
.\!h-fit{
  height: -moz-fit-content !important;
  height: fit-content !important;
}
.h-0{
  height: 0px;
}
.h-1{
  height: 0.25rem;
}
.h-10{
  height: 2.5rem;
}
.h-12{
  height: 3rem;
}
.h-2{
  height: 0.5rem;
}
.h-32{
  height: 8rem;
}
.h-4{
  height: 1rem;
}
.h-5{
  height: 1.25rem;
}
.h-6{
  height: 1.5rem;
}
.h-7{
  height: 1.75rem;
}
.h-8{
  height: 2rem;
}
.h-80{
  height: 20rem;
}
.h-9{
  height: 2.25rem;
}
.h-96{
  height: 24rem;
}
.h-\[10px\]{
  height: 10px;
}
.h-\[21px\]{
  height: 21px;
}
.h-\[30px\]{
  height: 30px;
}
.h-\[340px\]{
  height: 340px;
}
.h-\[34px\]{
  height: 34px;
}
.h-\[70vh\]{
  height: 70vh;
}
.h-\[80vh\]{
  height: 80vh;
}
.h-\[90vh\]{
  height: 90vh;
}
.h-fit{
  height: -moz-fit-content;
  height: fit-content;
}
.h-full{
  height: 100%;
}
.h-px{
  height: 1px;
}
.h-screen{
  height: 100vh;
}
.max-h-4{
  max-height: 1rem;
}
.max-h-48{
  max-height: 12rem;
}
.max-h-56{
  max-height: 14rem;
}
.max-h-\[200px\]{
  max-height: 200px;
}
.min-h-0{
  min-height: 0px;
}
.\!w-auto{
  width: auto !important;
}
.\!w-full{
  width: 100% !important;
}
.w-10{
  width: 2.5rem;
}
.w-12{
  width: 3rem;
}
.w-14{
  width: 3.5rem;
}
.w-2{
  width: 0.5rem;
}
.w-20{
  width: 5rem;
}
.w-28{
  width: 7rem;
}
.w-32{
  width: 8rem;
}
.w-36{
  width: 9rem;
}
.w-4{
  width: 1rem;
}
.w-40{
  width: 10rem;
}
.w-5{
  width: 1.25rem;
}
.w-56{
  width: 14rem;
}
.w-6{
  width: 1.5rem;
}
.w-60{
  width: 15rem;
}
.w-7{
  width: 1.75rem;
}
.w-8{
  width: 2rem;
}
.w-9{
  width: 2.25rem;
}
.w-96{
  width: 24rem;
}
.w-\[220px\]{
  width: 220px;
}
.w-\[32rem\]{
  width: 32rem;
}
.w-\[60px\]{
  width: 60px;
}
.w-auto{
  width: auto;
}
.w-fit{
  width: -moz-fit-content;
  width: fit-content;
}
.w-full{
  width: 100%;
}
.w-max{
  width: -moz-max-content;
  width: max-content;
}
.w-screen{
  width: 100vw;
}
.\!min-w-full{
  min-width: 100% !important;
}
.min-w-\[9rem\]{
  min-width: 9rem;
}
.min-w-fit{
  min-width: -moz-fit-content;
  min-width: fit-content;
}
.min-w-full{
  min-width: 100%;
}
.max-w-full{
  max-width: 100%;
}
.max-w-md{
  max-width: 28rem;
}
.max-w-sm{
  max-width: 24rem;
}
.max-w-xl{
  max-width: 36rem;
}
.max-w-xs{
  max-width: 20rem;
}
.flex-1{
  flex: 1 1 0%;
}
.flex-none{
  flex: none;
}
.grow{
  flex-grow: 1;
}
.border-collapse{
  border-collapse: collapse;
}
.rotate-180{
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.rotate-90{
  --tw-rotate: 90deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform{
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.transform-none{
  transform: none;
}
@keyframes slideDownAndFade{
  from{
    opacity: 0;
    transform: translateY(-10px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}
.animate-slideDownAndFade{
  animation: slideDownAndFade 200ms ease-in-out;
}
@keyframes slideUpAndFade{
  from{
    opacity: 0;
    transform: translateY(2px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}
.animate-slideUpAndFade{
  animation: slideUpAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1);
}
.\!cursor-default{
  cursor: default !important;
}
.cursor-default{
  cursor: default;
}
.cursor-pointer{
  cursor: pointer;
}
.select-text{
  -webkit-user-select: text;
     -moz-user-select: text;
          user-select: text;
}
.select-auto{
  -webkit-user-select: auto;
     -moz-user-select: auto;
          user-select: auto;
}
.resize{
  resize: both;
}
.list-decimal{
  list-style-type: decimal;
}
.list-disc{
  list-style-type: disc;
}
.flex-row{
  flex-direction: row;
}
.flex-col{
  flex-direction: column;
}
.flex-wrap{
  flex-wrap: wrap;
}
.flex-nowrap{
  flex-wrap: nowrap;
}
.items-start{
  align-items: flex-start;
}
.items-center{
  align-items: center;
}
.items-baseline{
  align-items: baseline;
}
.justify-start{
  justify-content: flex-start;
}
.justify-end{
  justify-content: flex-end;
}
.justify-center{
  justify-content: center;
}
.justify-between{
  justify-content: space-between;
}
.gap-2{
  gap: 0.5rem;
}
.gap-3{
  gap: 0.75rem;
}
.gap-4{
  gap: 1rem;
}
.overflow-auto{
  overflow: auto;
}
.\!overflow-hidden{
  overflow: hidden !important;
}
.overflow-hidden{
  overflow: hidden;
}
.overflow-visible{
  overflow: visible;
}
.overflow-x-auto{
  overflow-x: auto;
}
.\!overflow-y-auto{
  overflow-y: auto !important;
}
.overflow-y-scroll{
  overflow-y: scroll;
}
.truncate{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.text-ellipsis{
  text-overflow: ellipsis;
}
.whitespace-normal{
  white-space: normal;
}
.whitespace-nowrap{
  white-space: nowrap;
}
.whitespace-pre{
  white-space: pre;
}
.\!rounded-none{
  border-radius: 0px !important;
}
.rounded{
  border-radius: 0.25rem;
}
.rounded-2xl{
  border-radius: 1rem;
}
.rounded-3xl{
  border-radius: 1.5rem;
}
.rounded-full{
  border-radius: 9999px;
}
.rounded-none{
  border-radius: 0px;
}
.rounded-sm{
  border-radius: 0.125rem;
}
.\!rounded-bl-none{
  border-bottom-left-radius: 0px !important;
}
.\!rounded-br-none{
  border-bottom-right-radius: 0px !important;
}
.\!rounded-tl-none{
  border-top-left-radius: 0px !important;
}
.\!rounded-tr-none{
  border-top-right-radius: 0px !important;
}
.\!border-0{
  border-width: 0px !important;
}
.border{
  border-width: 1px;
}
.border-0{
  border-width: 0px;
}
.border-y{
  border-top-width: 1px;
  border-bottom-width: 1px;
}
.border-b{
  border-bottom-width: 1px;
}
.border-b-2{
  border-bottom-width: 2px;
}
.border-l{
  border-left-width: 1px;
}
.border-l-2{
  border-left-width: 2px;
}
.border-r{
  border-right-width: 1px;
}
.border-t{
  border-top-width: 1px;
}
.border-solid{
  border-style: solid;
}
.border-dashed{
  border-style: dashed;
}
.\!border-none{
  border-style: none !important;
}
.\!border-app-border{
  border-color: var(--app-border) !important;
}
.\!border-input-border{
  border-color: var(--input-border) !important;
}
.\!border-statusBar-border{
  border-color: var(--statusBar-border) !important;
}
.\!border-tab-border{
  border-color: var(--tab-border) !important;
}
.\!border-transparent{
  border-color: #ffffff00 !important;
}
.border-activityBar-border{
  border-color: var(--activityBar-border);
}
.border-activityBar-foreground-inactive{
  border-color: var(--activityBar-foreground-inactive);
}
.border-app-background{
  border-color: var(--app-background);
}
.border-app-border{
  border-color: var(--app-border);
}
.border-app-foreground{
  border-color: var(--app-foreground);
}
.border-app-foreground-inactive{
  border-color: var(--app-foreground-inactive);
}
.border-error{
  border-color: var(--error);
}
.border-focusBorder{
  border-color: var(--focus-border);
}
.border-info{
  border-color: var(--info);
}
.border-input-border{
  border-color: var(--input-border);
}
.border-modal-border{
  border-color: var(--modal-border);
}
.border-primaryColor{
  border-color: var(--app-primary);
}
.border-success{
  border-color: var(--success);
}
.border-tab-border{
  border-color: var(--tab-border);
}
.border-transparent{
  border-color: #ffffff00;
}
.border-warning{
  border-color: var(--warning);
}
.\!border-b-popover-background{
  border-bottom-color: var(--popover-background) !important;
}
.\!border-b-transparent{
  border-bottom-color: #ffffff00 !important;
}
.\!border-l-popover-background{
  border-left-color: var(--popover-background) !important;
}
.\!border-l-transparent{
  border-left-color: #ffffff00 !important;
}
.\!border-r-popover-background{
  border-right-color: var(--popover-background) !important;
}
.\!border-t-popover-background{
  border-top-color: var(--popover-background) !important;
}
.\!border-t-transparent{
  border-top-color: #ffffff00 !important;
}
.border-b-tab-border{
  border-bottom-color: var(--tab-border);
}
.border-l-tab-border{
  border-left-color: var(--tab-border);
}
.border-l-transparent{
  border-left-color: #ffffff00;
}
.border-r-app-border{
  border-right-color: var(--app-border);
}
.border-r-tab-border{
  border-right-color: var(--tab-border);
}
.border-r-transparent{
  border-right-color: #ffffff00;
}
.\!bg-app-background-secondary{
  background-color: var(--app-background-secondary) !important;
}
.\!bg-focus2{
  background-color: var(--focus-level-2) !important;
}
.\!bg-statusBar-background-active{
  background-color: var(--statusBar-background-active) !important;
}
.\!bg-tab-background-active{
  background-color: var(--tab-background-active) !important;
}
.\!bg-transparent{
  background-color: #ffffff00 !important;
}
.bg-activityBar-background{
  background-color: var(--activityBar-background);
}
.bg-activityBar-background-active{
  background-color: var(--activityBar-background-active);
}
.bg-activityBar-foreground-inactive{
  background-color: var(--activityBar-foreground-inactive);
}
.bg-app-background{
  background-color: var(--app-background);
}
.bg-app-background-secondary{
  background-color: var(--app-background-secondary);
}
.bg-app-border{
  background-color: var(--app-border);
}
.bg-app-foreground{
  background-color: var(--app-foreground);
}
.bg-app-foreground-inactive{
  background-color: var(--app-foreground-inactive);
}
.bg-error{
  background-color: var(--error);
}
.bg-focus1{
  background-color: var(--focus-level-1);
}
.bg-focus2{
  background-color: var(--focus-level-2);
}
.bg-focus3{
  background-color: var(--focus-level-3);
}
.bg-focus4{
  background-color: var(--focus-level-4);
}
.bg-focusColor{
  background-color: #ffffff1a;
}
.bg-info{
  background-color: var(--info);
}
.bg-input-background{
  background-color: var(--input-background);
}
.bg-modal-background{
  background-color: var(--modal-background);
}
.bg-popover-background{
  background-color: var(--popover-background);
}
.bg-primaryColor{
  background-color: var(--app-primary);
}
.bg-statusBar-background{
  background-color: var(--statusBar-background);
}
.bg-statusBar-background-active{
  background-color: var(--statusBar-background-active);
}
.bg-success{
  background-color: var(--success);
}
.bg-tab-background{
  background-color: var(--tab-background);
}
.bg-tab-background-activeColor{
  background-color: var(--tab-background-activeColor);
}
.bg-transparent{
  background-color: #ffffff00;
}
.bg-warning{
  background-color: var(--warning);
}
.\!p-0{
  padding: 0px !important;
}
.\!p-1{
  padding: 0.25rem !important;
}
.\!p-4{
  padding: 1rem !important;
}
.p-0{
  padding: 0px;
}
.p-1{
  padding: 0.25rem;
}
.p-1\.5{
  padding: 0.375rem;
}
.p-12{
  padding: 3rem;
}
.p-2{
  padding: 0.5rem;
}
.p-3{
  padding: 0.75rem;
}
.p-4{
  padding: 1rem;
}
.p-6{
  padding: 1.5rem;
}
.p-8{
  padding: 2rem;
}
.\!px-0{
  padding-left: 0px !important;
  padding-right: 0px !important;
}
.\!px-2{
  padding-left: 0.5rem !important;
  padding-right: 0.5rem !important;
}
.\!px-3{
  padding-left: 0.75rem !important;
  padding-right: 0.75rem !important;
}
.\!px-4{
  padding-left: 1rem !important;
  padding-right: 1rem !important;
}
.\!px-5{
  padding-left: 1.25rem !important;
  padding-right: 1.25rem !important;
}
.\!px-6{
  padding-left: 1.5rem !important;
  padding-right: 1.5rem !important;
}
.\!py-0{
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
.\!py-1{
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}
.\!py-2{
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}
.\!py-3{
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}
.px-0{
  padding-left: 0px;
  padding-right: 0px;
}
.px-1{
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}
.px-10{
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}
.px-14{
  padding-left: 3.5rem;
  padding-right: 3.5rem;
}
.px-16{
  padding-left: 4rem;
  padding-right: 4rem;
}
.px-2{
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.px-3{
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}
.px-4{
  padding-left: 1rem;
  padding-right: 1rem;
}
.px-5{
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}
.px-6{
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.px-8{
  padding-left: 2rem;
  padding-right: 2rem;
}
.py-0{
  padding-top: 0px;
  padding-bottom: 0px;
}
.py-0\.5{
  padding-top: 0.125rem;
  padding-bottom: 0.125rem;
}
.py-1{
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.py-2{
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-2\.5{
  padding-top: 0.625rem;
  padding-bottom: 0.625rem;
}
.py-20{
  padding-top: 5rem;
  padding-bottom: 5rem;
}
.py-3{
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}
.py-4{
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.py-6{
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.py-\[15px\]{
  padding-top: 15px;
  padding-bottom: 15px;
}
.py-px{
  padding-top: 1px;
  padding-bottom: 1px;
}
.\!pb-0{
  padding-bottom: 0px !important;
}
.\!pb-1{
  padding-bottom: 0.25rem !important;
}
.\!pb-2{
  padding-bottom: 0.5rem !important;
}
.\!pb-3{
  padding-bottom: 0.75rem !important;
}
.\!pb-4{
  padding-bottom: 1rem !important;
}
.\!pb-6{
  padding-bottom: 1.5rem !important;
}
.\!pl-3{
  padding-left: 0.75rem !important;
}
.\!pr-3{
  padding-right: 0.75rem !important;
}
.\!pt-0{
  padding-top: 0px !important;
}
.\!pt-2{
  padding-top: 0.5rem !important;
}
.\!pt-3{
  padding-top: 0.75rem !important;
}
.\!pt-4{
  padding-top: 1rem !important;
}
.\!pt-\[0\.2rem\]{
  padding-top: 0.2rem !important;
}
.pb-0{
  padding-bottom: 0px;
}
.pb-1{
  padding-bottom: 0.25rem;
}
.pb-2{
  padding-bottom: 0.5rem;
}
.pb-4{
  padding-bottom: 1rem;
}
.pb-6{
  padding-bottom: 1.5rem;
}
.pb-80{
  padding-bottom: 20rem;
}
.pb-96{
  padding-bottom: 24rem;
}
.pl-0{
  padding-left: 0px;
}
.pl-1{
  padding-left: 0.25rem;
}
.pl-12{
  padding-left: 3rem;
}
.pl-2{
  padding-left: 0.5rem;
}
.pl-3{
  padding-left: 0.75rem;
}
.pl-4{
  padding-left: 1rem;
}
.pr-0{
  padding-right: 0px;
}
.pr-1{
  padding-right: 0.25rem;
}
.pr-1\.5{
  padding-right: 0.375rem;
}
.pr-2{
  padding-right: 0.5rem;
}
.pr-3{
  padding-right: 0.75rem;
}
.pr-4{
  padding-right: 1rem;
}
.pt-0{
  padding-top: 0px;
}
.pt-0\.5{
  padding-top: 0.125rem;
}
.pt-14{
  padding-top: 3.5rem;
}
.pt-2{
  padding-top: 0.5rem;
}
.pt-3{
  padding-top: 0.75rem;
}
.pt-4{
  padding-top: 1rem;
}
.pt-5{
  padding-top: 1.25rem;
}
.pt-6{
  padding-top: 1.5rem;
}
.pt-px{
  padding-top: 1px;
}
.text-left{
  text-align: left;
}
.text-center{
  text-align: center;
}
.text-right{
  text-align: right;
}
.\!text-start{
  text-align: start !important;
}
.align-baseline{
  vertical-align: baseline;
}
.align-middle{
  vertical-align: middle;
}
.font-default{
  font-family: Lato, sans-serif;
}
.font-sans{
  font-family: sans-serif;
}
.\!text-base{
  font-size: 14px !important;
}
.\!text-sm{
  font-size: 12px !important;
}
.\!text-xs{
  font-size: 10px !important;
}
.text-2xl{
  font-size: 1.5rem;
  line-height: 2rem;
}
.text-5xl{
  font-size: 3rem;
  line-height: 1;
}
.text-base{
  font-size: 14px;
}
.text-lg{
  font-size: 16px;
}
.text-sm{
  font-size: 12px;
}
.text-xl{
  font-size: 18px;
}
.text-xs{
  font-size: 10px;
}
.font-bold{
  font-weight: 700;
}
.font-light{
  font-weight: 300;
}
.font-medium{
  font-weight: 500;
}
.font-normal{
  font-weight: 400;
}
.font-semibold{
  font-weight: 600;
}
.uppercase{
  text-transform: uppercase;
}
.\!capitalize{
  text-transform: capitalize !important;
}
.italic{
  font-style: italic;
}
.\!leading-\[18px\]{
  line-height: 18px !important;
}
.leading-3{
  line-height: .75rem;
}
.leading-5{
  line-height: 1.25rem;
}
.leading-6{
  line-height: 1.5rem;
}
.leading-7{
  line-height: 1.75rem;
}
.\!text-activityBar-foreground-inactive{
  color: var(--activityBar-foreground-inactive) !important;
}
.\!text-app-foreground-active{
  color: var(--app-foreground-active) !important;
}
.\!text-app-foreground-inactive{
  color: var(--app-foreground-inactive) !important;
}
.\!text-info{
  color: var(--info) !important;
}
.\!text-link{
  color: var(--link) !important;
}
.\!text-primaryColor{
  color: var(--app-primary) !important;
}
.text-activityBar-foreground{
  color: var(--activityBar-foreground);
}
.text-activityBar-foreground-inactive{
  color: var(--activityBar-foreground-inactive);
}
.text-app-foreground{
  color: var(--app-foreground);
}
.text-app-foreground-active{
  color: var(--app-foreground-active);
}
.text-app-foreground-inactive{
  color: var(--app-foreground-inactive);
}
.text-error{
  color: var(--error);
}
.text-graphql{
  color: var(--req-graphql);
}
.text-heading-color{
  color: var(--heading-color);
}
.text-info{
  color: var(--info);
}
.text-input-placeholder{
  color: var(--input-placeholder);
}
.text-input-text{
  color: var(--input-text);
}
.text-link{
  color: var(--link);
}
.text-modal-foreground-active{
  color: var(--modal-foreground-active);
}
.text-popover-foreground{
  color: var(--popover-foreground);
}
.text-primaryColor{
  color: var(--app-primary);
}
.text-primaryColor-text{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-rest{
  color: var(--req-link);
}
.text-secondaryColor-text{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-selected-text{
  color: var(--selected);
}
.text-statusBar-foreground{
  color: var(--statusBar-foreground);
}
.text-success{
  color: var(--success);
}
.text-tab-foreground{
  color: var(--tab-foreground);
}
.text-tab-foreground-inactive{
  color: var(--tab-foreground-inactive);
}
.text-transparent{
  color: #ffffff00;
}
.text-warning{
  color: var(--warning);
}
.underline{
  text-decoration-line: underline;
}
.placeholder-input-placeholder::-moz-placeholder{
  color: var(--input-placeholder);
}
.placeholder-input-placeholder::placeholder{
  color: var(--input-placeholder);
}
.\!opacity-100{
  opacity: 1 !important;
}
.opacity-10{
  opacity: 0.1;
}
.opacity-100{
  opacity: 1;
}
.opacity-20{
  opacity: 0.2;
}
.opacity-30{
  opacity: 0.3;
}
.opacity-50{
  opacity: 0.5;
}
.opacity-60{
  opacity: 0.6;
}
.opacity-70{
  opacity: 0.7;
}
.opacity-80{
  opacity: 0.8;
}
.shadow{
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0_0_8px_2px_rgba\(0\2c 0\2c 0\2c 0\.3\)\]{
  --tw-shadow: 0 0 8px 2px rgba(0,0,0,0.3);
  --tw-shadow-colored: 0 0 8px 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-md{
  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-sm{
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-modal-shadow{
  --tw-shadow-color: var(--modal-shadow);
  --tw-shadow: var(--tw-shadow-colored);
}
.outline-none{
  outline: 2px solid transparent;
  outline-offset: 2px;
}
.outline{
  outline-style: solid;
}
.blur{
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.invert{
  --tw-invert: invert(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.\!filter-none{
  filter: none !important;
}
.transition{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-100{
  transition-duration: 100ms;
}
.before\:absolute::before{
  content: var(--tw-content);
  position: absolute;
}
.before\:-inset-x-px::before{
  content: var(--tw-content);
  left: -1px;
  right: -1px;
}
.before\:-top-px::before{
  content: var(--tw-content);
  top: -1px;
}
.before\:bottom-0::before{
  content: var(--tw-content);
  bottom: 0px;
}
.before\:left-0::before{
  content: var(--tw-content);
  left: 0px;
}
.before\:top-0::before{
  content: var(--tw-content);
  top: 0px;
}
.before\:z-0::before{
  content: var(--tw-content);
  z-index: 0;
}
.before\:block::before{
  content: var(--tw-content);
  display: block;
}
.before\:h-0::before{
  content: var(--tw-content);
  height: 0px;
}
.before\:h-0\.5::before{
  content: var(--tw-content);
  height: 0.125rem;
}
.before\:w-0::before{
  content: var(--tw-content);
  width: 0px;
}
.before\:w-0\.5::before{
  content: var(--tw-content);
  width: 0.125rem;
}
.before\:bg-activityBar-border-active::before{
  content: var(--tw-content);
  background-color: var(--activityBar-border-active);
}
.before\:bg-primaryColor::before{
  content: var(--tw-content);
  background-color: var(--app-primary);
}
.before\:content-\[\"\"\]::before{
  --tw-content: "";
  content: var(--tw-content);
}
.before\:content-\[\'\'\]::before{
  --tw-content: '';
  content: var(--tw-content);
}
.after\:absolute::after{
  content: var(--tw-content);
  position: absolute;
}
.after\:inset-x-0::after{
  content: var(--tw-content);
  left: 0px;
  right: 0px;
}
.after\:-bottom-px::after{
  content: var(--tw-content);
  bottom: -1px;
}
.after\:-left-0::after{
  content: var(--tw-content);
  left: -0px;
}
.after\:-left-0\.5::after{
  content: var(--tw-content);
  left: -0.125rem;
}
.after\:bottom-0::after{
  content: var(--tw-content);
  bottom: 0px;
}
.after\:left-0::after{
  content: var(--tw-content);
  left: 0px;
}
.after\:right-0::after{
  content: var(--tw-content);
  right: 0px;
}
.after\:top-0::after{
  content: var(--tw-content);
  top: 0px;
}
.after\:block::after{
  content: var(--tw-content);
  display: block;
}
.after\:h-px::after{
  content: var(--tw-content);
  height: 1px;
}
.after\:w-0::after{
  content: var(--tw-content);
  width: 0px;
}
.after\:w-0\.5::after{
  content: var(--tw-content);
  width: 0.125rem;
}
.after\:border-t::after{
  content: var(--tw-content);
  border-top-width: 1px;
}
.after\:border-tab-border::after{
  content: var(--tw-content);
  border-color: var(--tab-border);
}
.after\:\!bg-statusBar-background-active::after{
  content: var(--tw-content);
  background-color: var(--statusBar-background-active) !important;
}
.after\:\!bg-tab-background-active::after{
  content: var(--tw-content);
  background-color: var(--tab-background-active) !important;
}
.after\:bg-statusBar-background-active::after{
  content: var(--tw-content);
  background-color: var(--statusBar-background-active);
}
.after\:opacity-10::after{
  content: var(--tw-content);
  opacity: 0.1;
}
.after\:content-\[\'\'\]::after{
  --tw-content: '';
  content: var(--tw-content);
}
.first\:ml-0:first-child{
  margin-left: 0px;
}
.first\:mt-0:first-child{
  margin-top: 0px;
}
.first\:border-l-0:first-child{
  border-left-width: 0px;
}
.first\:border-t-0:first-child{
  border-top-width: 0px;
}
.last\:mb-0:last-child{
  margin-bottom: 0px;
}
.last\:mr-0:last-child{
  margin-right: 0px;
}
.last\:border-b-0:last-child{
  border-bottom-width: 0px;
}
.last-of-type\:border-r-tab-border:last-of-type{
  border-right-color: var(--tab-border);
}
.hover\:border-focusBorder:hover{
  border-color: var(--focus-border);
}
.hover\:border-primaryColor:hover{
  border-color: var(--app-primary);
}
.hover\:border-transparent:hover{
  border-color: #ffffff00;
}
.hover\:\!bg-focus1:hover{
  background-color: var(--focus-level-1) !important;
}
.hover\:\!bg-focus2:hover{
  background-color: var(--focus-level-2) !important;
}
.hover\:\!bg-focusColor:hover{
  background-color: #ffffff1a !important;
}
.hover\:bg-focus1:hover{
  background-color: var(--focus-level-1);
}
.hover\:bg-focus2:hover{
  background-color: var(--focus-level-2);
}
.hover\:bg-focusColor:hover{
  background-color: #ffffff1a;
}
.hover\:bg-input-background-focus:hover{
  background-color: var(--input-background-focus);
}
.hover\:bg-primaryColor:hover{
  background-color: var(--app-primary);
}
.hover\:bg-tab-background-hover:hover{
  background-color: var(--tab-background-hover);
}
.hover\:pr-1:hover{
  padding-right: 0.25rem;
}
.hover\:\!text-link:hover{
  color: var(--link) !important;
}
.hover\:text-activityBar-foreground:hover{
  color: var(--activityBar-foreground);
}
.hover\:text-app-foreground:hover{
  color: var(--app-foreground);
}
.hover\:text-app-foreground-active:hover{
  color: var(--app-foreground-active);
}
.hover\:text-modal-foreground-active:hover{
  color: var(--modal-foreground-active);
}
.hover\:text-primaryColor:hover{
  color: var(--app-primary);
}
.hover\:text-secondaryColor-text:hover{
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}
.hover\:text-statusBar-foreground-active:hover{
  color: var(--statusBar-foreground-active);
}
.hover\:underline:hover{
  text-decoration-line: underline;
}
.hover\:opacity-100:hover{
  opacity: 1;
}
.hover\:after\:bg-focusBorder:hover::after{
  content: var(--tw-content);
  background-color: var(--focus-border);
}
.focus\:\!border-none:focus{
  border-style: none !important;
}
.focus\:bg-input-background-focus:focus{
  background-color: var(--input-background-focus);
}
.focus-visible\:\!border-none:focus-visible{
  border-style: none !important;
}
.focus-visible\:\!shadow-none:focus-visible{
  --tw-shadow: 0 0 #0000 !important;
  --tw-shadow-colored: 0 0 #0000 !important;
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
}
.group:hover .group-hover\:h-auto{
  height: auto;
}
@keyframes slideDownAndFade{
  from{
    opacity: 0;
    transform: translateY(-10px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}
.data-\[side\=\'bottom\'\]\:animate-slideDownAndFade[data-side='bottom']{
  animation: slideDownAndFade 200ms ease-in-out;
}
@keyframes slideUpAndFade{
  from{
    opacity: 0;
    transform: translateY(2px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}
.data-\[side\=\'bottom\'\]\:animate-slideUpAndFade[data-side='bottom']{
  animation: slideUpAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1);
}

@import url(../components/split-view/SplitView.scss);
/* @import url(collection.scss); */
@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700,900&display=swap');
/* @import url('https://fonts.googleapis.com/css2?family=Lato:wght@100&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap');
@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap');

body{
  background-color: var(--app-background);
  height: 100vh;
  width: 100vw;
  margin: 0px;
  padding: 0px;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  -o-user-select: none;
  background: var(--app-background);
  color: var(--app-foreground);
  font-weight: 400;
  font-family: var(--font-family);
}

a,
a:hover {
  color: inherit !important;
}
button:disabled,
button[disabled]{
  opacity: 0.5;
}
hr {
  border-color: var(--app-border);
}
.fullscreen {
  height: 100%;
}
*:focus-visible {
  box-shadow: inset 0px 0px 0px 1px var(--focus-border) !important;
  outline: none;
}
*:focus {
  outline: none;
}
::-moz-placeholder {
  color: var(--input-placeholder) !important;
  opacity: 1;
}
::placeholder {
  color: var(--input-placeholder) !important;
  opacity: 1;
}
input:focus,
input:focus-visible textarea:focus,
textarea:focus-visible {
  box-shadow: none !important;
  border: 1px solid var(--focus-border) !important;
}
tr:focus-visible {
  box-shadow: none !important;
}
.focus-outer:focus {
  box-shadow: inset 0px 0px 0px 1px var(--focus-border) !important;
  outline: none;
}
.focus-outer-tab:focus {
  box-shadow: inset 0px 0px 0px 1px var(--focus-border),
    inset 0px -2px 0px 0px var(--focus-border) !important;
  outline: none;
}

.focus-outer2:focus {
  box-shadow: inset 0px 0px 0px 1px var(--focus-border) !important;
  outline: none;
}
.fc-error{
  margin-bottom: 0.5rem;
  font-size: 12px;
  color: var(--error);
}
.pt-half {
  padding-top: 2px;
}
.z-9999 {
  z-index: 9999;
}
.action {
  visibility: hidden;
  cursor: pointer;
}
.explorer-wrapper {
  max-height: calc(100vh - 25px);
}
.GET:not(.tab-icon) {
  color: var(--req-get);
}
.POST:not(.tab-icon) {
  color: var(--req-post);
}
.PUT:not(.tab-icon) {
  color: var(--req-put);
}
.DELETE:not(.tab-icon) {
  color: var(--req-delete);
}
.PATCH:not(.tab-icon) {
  color: var(--req-patch);
}
.HEAD:not(.tab-icon) {
  color: var(--req-head);
}
.OPTIONS:not(.tab-icon) {
  color: var(--req-options);
}
.PURGE:not(.tab-icon) {
  color: var(--req-purge);
}
.LINK:not(.tab-icon) {
  color: var(--req-link);
}
.UNLINK:not(.tab-icon) {
  color: var(--req-unlink);
}
.GRAPHQL:not(.tab-icon) {
  color: var(--req-graphql);
}
.WEBSOCKET:not(.tab-icon) {
  color: var(--req-websocket);
}
.SOCKETIO:not(.tab-icon) {
  color: var(--req-socketio);
}
.hide-action:hover .action {
  visibility: visible;
}
.max-h-screen-third {
  max-height: 75vh;
}
.popover-boxshadow {
  box-shadow: var(--popover-shadow);
}
*.bg-app-background-secondary,
*.bg-app-background-secondary .fc-col,
*.bg-app-background-secondary .fc-col {
  background: var(--app-background-secondary);
}
.fc-h-screen {
  height: 100vh !important;
}
.fc-h-full {
  height: 100% !important;
}
.react-tiny-popover-container {
  z-index: 9999 !important;
}

/*------theme widget css start-------------*/
.fc-theme {
  height: 32px;
  width: 32px;
  margin-right: 8px;
  border: 2px solid var(--app-border);
  display: flex;
  border-radius: 32px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.fc-theme > .themeBG.light-green {
  background: linear-gradient(
    to right,
    var(--mantine-color-gray-0) 14px,
    var(--mantine-color-green-7) 15px
  );
}

.fc-theme > .themeBG.light-orange {
  background: linear-gradient(
    to right,
    var(--mantine-color-gray-0) 14px,
    var(--mantine-color-yellow-9) 15px
  );
}

.fc-theme > .themeBG.dark-green {
  background: linear-gradient(
    to right,
    var(--mantine-color-dark-7) 14px,
    var(--mantine-color-green-7) 15px
  );
}

.fc-theme > .themeBG.dark-orange {
  background: linear-gradient(
    to right,
    var(--mantine-color-dark-7) 14px,
    var(--mantine-color-yellow-9) 15px
  );
}

.fc-theme:hover > .themeBG,
.fc-theme.active > .themeBG {
  opacity: 1;
}

.active.fc-theme {
  border-color: var(--app-foreground) !important;
}

.fc-theme > .themeBG {
  z-index: 0;
  border-radius: 100%;
  width: 100%;
  height: 100%;
  opacity: 0.5;
}
/*------theme widget css end-------------*/

/*----------form css start--------*/
.fc-form label {
  font-size: 12px;
}

.grid.fc-form > div > label {
  width: 40px !important;
  padding-right: 10px !important;
  white-space: nowrap !important;
}

.fc-form input:not([type="checkbox"]),
.fc-form select {
  border-radius: 0px !important;
  resize: none;
  font-size: 14px;
  padding: 4px 10px !important;
  height: 31px !important;
}

.fc-form textarea,
.fc-form textarea:hover,
.fc-form textarea:focus {
  border-radius: 0px;
  resize: none;
  font-size: 13px;
  min-height: 120px;
}

.fc-form .row > label {
  padding-right: 0px;
}

.fc-form-field-group {
  font-size: 14px !important;
  text-transform: uppercase;
  max-width: 0px;
  overflow: visible;
}

.fc-form-field-group span {
  font-size: 12px;
  color: var(--app-foreground-inactive);
  text-transform: none;
  margin-left: 4px;
}

.fc-form.grid {
  display: table;
  width: 100%;
  position: relative;
}

.fc-form.with-padding {
  padding: 12px;
}

.fc-form.grid > div {
  display: table-row;
}

.fc-form.grid > div > label,
.fc-form.grid > div > div {
  display: table-cell;
  flex: none;
  max-width: none;
  padding-bottom: 10px;
  vertical-align: middle;
}

/*---------form css end--------*/

/*---------Collapse button css starts----------*/
.btn-collapse {
  cursor: pointer;
}
.collapsed .btn-collapse {
  cursor: pointer;
  transform: rotate(180deg);
}
.fc-collapsed .fc-btn-collapse {
  cursor: pointer;
  display: block !important;
  transform: rotate(0deg);
}
.fc-collapsed .fc-btn-collapse > span {
  margin-left: -3px;
}
.fc-btn-collapse {
  max-height: 32px !important;
  border: 1px solid var(--app-border);
  max-width: 20px !important;
  position: absolute;
  left: 100%;
  min-width: 20px !important;
  font-size: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -1px;
  z-index: 1;
  transform: rotate(180deg);
}
.fc-btn-collapse.v2 {
  left: -1px;
  min-height: 33px !important;
}
.fc-collapsed {
  width: 0px !important;
  min-width: 0px !important;
  border: 0px !important;
}
.fc-collapsed > *:not(.fc-collapse-btn),
.fc-collapsed.fc-collapsed-v3 > *:not(.fc-collapse-btn-v3) {
  display: none;
}
.fc-collapsed > .fc-collapse-btn-v3 {
  display: block !important;
}
.fc-collapsed > *:not(.fc-collapse-btn),
.fc-collapsed.fc-collapsed-v3 > *:not(.fc-collapse-btn-v3) {
  display: none;
}
.fc-collapsed > .fc-collapse-btn-v3 {
  display: block !important;
}
.fc-tab-panel-header.fc-collapse-btn-v3 {
  display: flex;
  flex-direction: column-reverse;
  position: absolute;
  left: 0px;
  width: 32px !important;
  border-left: 1px solid var(--app-border);
}
.fc-tab-panel-header.fc-collapse-btn-v3 > .fc-tab-panel-header-left {
  position: absolute;
  transform: rotate(90deg);
  left: -23px;
  top: 54px;
}
.fc-collapsable > .fc-collapse-btn-v3 {
  display: none;
}
.fc-tab-panel-header.fc-collapse-btn-v3 > .fc-tab-panel-header-right {
  top: 6px;
  position: absolute;
  font-size: 20px;
  left: 6px;
  transform: rotate(180deg);
}
.fc-collapsed-v3 {
  width: 32px !important;
}
.fc-col-resizer.fc-collapsed.fc-collapsed-v3.fc-collapsable.left {
  border-left: 1px solid var(--app-border) !important;
}
.fc-collapsed > .fc-collapse-btn,
.fc-collapsed ~ div .fc-collapse-btn {
  transform: rotate(180deg);
}
.fc-collapsed > .fc-collapse-btn.fc-collapse-btn-v2,
.fc-collapsed ~ div .fc-collapse-btn.fc-collapse-btn-v2 {
  transform: rotate(0deg) !important;
}
.fc-collapsed > .fc-collapse-btn.fc-collapse-btn-v2 > span,
.fc-collapsed ~ div .fc-collapse-btn.fc-collapse-btn-v2 > span {
  transform: rotate(180deg) !important;
}
.fc-collapse-btn-v2.fc-collapse-btn > span.ic-caret:before {
  transform: rotate(180deg);
  display: block;
}
.fc-collapse-btn {
  position: absolute;
  max-width: 20px !important;
  min-width: 20px !important;
  max-height: 20px !important;
  width: 40px !important;
  min-height: 40px !important;
  height: 40px !important;
  padding: 2px;
  background-color: var(--app-background-secondary);
  z-index: 9;
  top: -1px;
  cursor: pointer;
  left: 100%;
  border: 1px solid var(--app-border);
  background-image: url('../../public/assets/icon/png/toggle-icon.png');
  background-size: 12px;
  background-position: center;
  background-repeat: no-repeat;
}

.collapsed {
  height: -moz-fit-content !important;
  height: fit-content !important;
  min-height: 0px !important;
}

.collapsed > .fc-row > .fc-collapsable,
.collapsed > .fc-collapsable {
  display: none;
}
/*---------Collapse button css ends----------*/

/*---------scrollbar css start----------*/
.doc-explorer-contents::-webkit-scrollbar {
  width: 0px;
  height: 0px;
  -webkit-transition: width 1s;
  transition: width 1s;
}
.doc-explorer-contents:hover::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
.doc-explorer-contents:hover::-webkit-scrollbar:hover {
  width: 12px;
  height: 8px;
}
.visible-scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--focus-level-4) !important;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: var(--focus-level-4) !important;
  border-radius: 10px;
}

.scrollbar-thin ::-webkit-scrollbar {
  width: 3px;
  height: 3px;
  display: block;
}
.scrollbar-thin ::-webkit-scrollbar-track {
  background: transparent;
}
.scrollbar-thin ::-webkit-scrollbar-thumb {
  background: var(--focus-level-2) !important;
  border-radius: 10px;
}
.invisible-scrollbar::-webkit-scrollbar,
.invisible-scrollbar > div::-webkit-scrollbar {
  display: none;
}
.visible-scrollbar::-webkit-scrollbar,
.visible-scrollbar > div::-webkit-scrollbar {
  display: block;
  width: 0px;
  height: 0px;
}
.visible-scrollbar:hover::-webkit-scrollbar,
.visible-scrollbar > div:hover::-webkit-scrollbar {
  display: block;
  width: 8px;
  height: 8px;
}
.visible-scrollbar.thick::-webkit-scrollbar {
  width: 8px !important;
  display: block !important;
}
.visible-scrollbar.thin::-webkit-scrollbar {
  width: 4px !important;
  display: none !important;
}
.visible-scrollbar.thin:hover::-webkit-scrollbar {
  width: 4px !important;
  display: block !important;
}

.visible-scrollbar ::-webkit-scrollbar-track {
  background: transparent;
}
.visible-scrollbar ::-webkit-scrollbar-thumb {
  background: var(--focus-level-2) !important;
  border-radius: 10px;
}

/*---------scrollbar css end----------*/

/*-------editor css starts---------*/

.CodeMirror {
  background-color: var(--app-background) !important;
  height: 100% !important;
}

.CodeMirror-gutters {
  background-color: transparent !important;
}

.CodeMirror pre {
  font: 12px / normal 'Monaco', 'Menlo', 'Ubuntu Mono', 'Consolas',
    'source-code-pro', monospace;
}

.react-codemirror2 {
  height: 100%;
}

/*-------editor css end---------*/

/*----------other css  start--------*/

.fc-empty {
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}

.fc-empty-center {
  width: 100%;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  display: flex;
  font-size: 12px;
  color: var(--app-foreground-inactive);
}

.fc-empty.center-block {
  display: flex;
}

.CodeMirror-sizer {
  margin-left: 39px !important;
}

.request-tab-wrapper {
  width: calc(100% - 40px);
}
.fc-urlbar-path,
.fc-tab-panel-info > span,
.fc-history-req-list-item-url-text,
.collection_leaf-node-name {
  -webkit-user-select: text;
     -moz-user-select: text;
          user-select: text;
}
/*
  * // .json-as-form input.json_row--key, .json-as-form input.json_row--value{
  * //   background: transparent;
  * // }
  */
/*----------other css  end--------*/

/*---code mirror css starts -------*/

.cm-property {
  color: var(--cm-property) !important;
}

.cm-keyword {
  color: var(--cm-keyword) !important;
}

.cm-def {
  color: var(--cm-def) !important;
}

.cm-attribute {
  color: var(--cm-attribute) !important;
}

.cm-number {
  color: var(--cm-number) !important;
}

.cm-string {
  color: var(--cm-string) !important;
}

.CodeMirror-selected {
  background: var(--selected) !important;
}

.cm-punctuation {
  color: var(--cm-punctuation);
}

.cm-ws {
  color: var(--cm-ws);
}

/*---code mirror css ends----------*/

.expandable-right-pane {
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 2s;
}

.expandable-right-pane.expanded {
  transform: scaleX(1);
}

/*--------table temporary css starts ------------*/
.response-headers-table,
.response-cookies-table {
  display: table;
  border-collapse: collapse;
  width: 100%;
}

.response-headers-table > div,
.response-cookies-table > div {
  display: table-row;
}

.response-headers-table > div > div,
.response-cookies-table > div > div {
  display: table-cell;
  border: 1px solid var(--app-border);
  border-collapse: collapse;
  padding: 4px 8px;
  font-size: 14px;
  word-break: break-all;
  color: var(--app-foreground-inactive);
  -webkit-user-select: text;
     -moz-user-select: text;
          user-select: text;
}

.response-headers-table > div:first-child,
.response-cookies-table > div:first-child {
  background: var(--focus-level-2);
  font-weight: 600;
}
.response-headers-table > div:first-child > div,
.response-cookies-table > div:first-child > div {
  border-top: 0px solid transparent;
}
.response-headers-table > div > div:first-child,
.response-cookies-table > div > div:first-child {
  border-left: 0px solid transparent;
}
/*--------table temporary css starts ------------*/

/*--------table 2 css starts------------*/
.primary-table .mtk1 {
  color: var(--tab-foreground-inactive) !important;
}
.primary-table th {
  color: var(--heading-color) !important;
}

.table-cell .table-action {
  visibility: hidden;
}
.table-cell:hover .table-action {
  visibility: visible;
}

.table.border-0 .table-row:first-child .table-cell {
  border-top: none;
}

.table.border-0 .table-row:last-child .table-cell {
  border-bottom: none;
}

.table.border-0 .table-row .table-cell:first-child {
  border-left: none;
}

.table.border-0 .table-row .table-cell:last-child {
  border-right: none;
}
/*-----------table 2 css end --------*/

.dropzone-wrapper > .dropzone {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}
