/* Content Variables */
/* Header Variables */
/* Login Variables */
/* Form Variables */
/* Button Variables */


/*GSAP DEV TOOLS */
.gs-dev-tools .time-scale, .gs-dev-tools .loop, .gs-dev-tools .logo, .gs-dev-tools .select-animation, .gs-dev-tools .in-point, .gs-dev-tools .out-point {
  display: none;
}
/*GSAP DEV TOOLS */


[data-bs-theme=dark].lg2, body[data-bs-theme=dark].lg2{
  --tblr-border-color: #5a5a5a;
  --tblr-primary-lt-rgb: 37, 37, 37;
  --tblr-primary-lt: #1e1e1e;
}

[data-bs-theme=dark].lg2 .border-end {
  border-right: var(--tblr-border-width) var(--tblr-border-style) rgb(255 255 255 / 14%) !important;
}

[data-bs-theme=dark].lg2 .timeline-event-icon{
    background-color: #252525;
    color:#ffffff;
    border:solid 2px var(--tblr-border-color);
  }

  [data-bs-theme=light] .timeline-event-icon{
    background-color: #d9d9d9 !important;
    color:#5f5f5f !important;
    border:solid 2px var(--tblr-border-color) !important;
  }

.timeline-event-icon.bg-primary-lt{
    background-color: var(--tblr-primary) !important;
    color:#ffffff !important;
    border:solid 2px var(--tblr-primary) !important;
  }

  [data-bs-theme=dark].lg2 .form-help{
    background-color: transparent !important;
  }

  [data-bs-theme-base=zinc] {
    --tblr-gray-50: #fafafa;
    --tblr-gray-100: #f4f4f5;
    --tblr-gray-200: #e4e4e7;
    --tblr-gray-300: #d4d4d8;
    --tblr-gray-400: #a1a1aa;
    --tblr-gray-500: #71717a;
    --tblr-gray-600: #52525b;
    --tblr-gray-700: #3f3f46;
    --tblr-gray-800: #27272a;
    --tblr-gray-900: #18181b;
    --tblr-gray-950: #09090b;
  }

  [data-bs-theme-radius="0.5"] {
    --tblr-border-radius-scale: 0.5;
}

  :root {
    --tblr-primary: #ff2300 !important;
    --tblr-primary-rgb: 255, 35, 0 !important;
  }

  :root, [data-bs-theme=light] {
    --tblr-primary: #ff2300 !important;
    --tblr-primary-rgb: 255, 35, 0 !important;
  }

html {
  --scrollbarBG: #CFD8DC;
  --thumbBG: #90A4AE;
}

html, body {
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
body::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
}
body::-webkit-scrollbar-thumb {
  background-color: var(--thumbBG) ;
  border-radius: 6px;
  border: 3px solid var(--scrollbarBG);
}

[data-bs-theme=dark] .btn:hover{
  --tblr-btn-hover-border-color: #ff2300;
}

[data-bs-theme=dark] .timer{
  color: #ffffff !important;
}

[data-bs-theme=dark] .list-group, [data-bs-theme=dark] .table-responsive .dropdown-menu{
  border: solid 1px var(--tblr-border-color);
}

[data-bs-theme=dark] .assets_folder .card:hover{
  background-color: #353535;
}


[data-bs-theme=dark] .layer_preview{
  background-color: #353535;
}

.modal-backdrop{
  --tblr-backdrop-bg: #000000;
}

.modal{
  --tblr-modal-border-color: #3d3d3d;
}


.offcanvas{
  --tblr-offcanvas-width : 600px;
}

.offcanvas-backdrop.show{
  opacity:0.5;
}

.offcanvas-backdrop{
  background-color: #000000;
}

.modal-backdrop{
  --tblr-backdrop-opacity: 0.5;
}

.login_logo{
  background-color: #1d1c1c;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}
.theme_light{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ffffff 50%, rgb(208, 208, 208) 50%);
}

.theme_dark{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #273747 50%, #131c27 50%);
}

.theme_lg2{
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ff2300 50%, #000000 50%);
}

html, body{
  border:0;
  margin:0;
  padding:0;
}

.page-body{
  padding-bottom:150px;
  margin-top:0px;;
}

/*.cm360_status{
  padding:7px;
  color: #ffffff;
  height: auto;
  position: relative;
}*/

.particle_preset_apply{
  cursor: pointer;
  border:solid 1px var(--tblr-border-color);
}

.particle_preset_apply:hover{
  border:solid 1px var(--tblr-primary);
}

#guide-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 999;
}

#guide-container.visible{
  pointer-events: initial;
}

.guide-line-grid {
  position: absolute;
  /*background: rgba(0, 255, 247, 1);*/
  border-left:solid 1px rgba(0, 255, 247, 1);
  border-top:solid 1px rgba(0, 255, 247, 1);
}

.guide-line-center {
  position: absolute;
  /*background: rgb(255, 0, 34);*/
  border-top:solid 1px rgb(255, 0, 34);
  border-left:solid 1px rgb(255, 0, 34);
  z-index: 999;
}

.px_div {
  position: absolute;
  top:10px;
  background-color: rgba(0, 255, 247, 1);
  pointer-events: none;
  font-size: 12px;
  color: #ffffff;
  padding: 2px 5px;
  border-radius: 3px;
  width:50px;
  text-align: center;
}

.guide-line-grid.vertical, .guide-line-center.vertical {
  width: 10px;
  height: 100%;
  cursor: ew-resize;
  border-top:none;
}

.guide-line-grid.horizontal, .guide-line-center.horizontal {
  height: 10px;
  width: 100%;
  cursor: ns-resize;
  border-left:none;
}

.advanced_timeline .accordion-item{
  background-color: #363636;
}

.timeline_group{
  position: relative;
  width: 100%;
  background-color: #3b3b3b;
  border:solid 1px var(--tblr-border-color);
  margin-bottom: 10px;
  border-radius: var(--tblr-border-radius);
}

.timeline_title{
  position: relative;
  width: 100%;
  height: auto;
  padding:5px;
}

.timeline_layer_right{
  position: absolute;
  top:2px;
  right: 2px;
  width:15px;
  height: 93%;
  border-radius: var(--tblr-border-radius);
}

.timeline_layer_data{
  position:absolute;
  right:10px;
  color:#ffffff;
  font-size:0.9rem;
  font-weight: 500;
  padding:5px;

}

.advanced_timeline_main{
  position: relative;
  top:0px;
  left:0px;
  width:100%;
  height: auto;
  margin-top: 20px;
  border-radius: var(--tblr-border-radius);
}

.advanced_timeline{
  position: relative;
  top:0px;
  left: 0px;
  width:100%;
  height: 100%;
  max-height:400px;
  overflow-y: auto;
}


.timeline_layer{
  position: relative;
  width: 100px;
  height: auto;
  top:0px;
  left:0px;
  background-color: var(--tblr-primary);
  border-radius: var(--tblr-border-radius);
  padding: 5px 5px;
  margin-top:5px;
  font-size: 12px;
}

.timeline_layer:hover{
  background-color: var(--tblr-link-hover-color);
}

.timeline_time {
  position: relative;
  width: 100%;
  height: 10px;
  display: flex;
}

.tick-block {
  flex: 1;
  position: relative;
}

.tick-block::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  height: 10px;
  width: 1px;
  background: white;
}

.subtick {
  position: absolute;
  top: 0;
  width: 1px;
  height: 6px;
  background-color: #aaa;
}

.tick-labels {
  display: flex;
  font-size: 12px;
  margin-bottom:5px;
}

.tick-label {
  flex: 1;
  text-align: right;
  padding-right: 0px;
  margin-right:-3px;
}

.card-header-tabs .nav-link.active{
  background-color:var(--tblr-primary-lt);
}

.cm360_status{
 
}

.position-border{
  border: 2px dashed var(--tblr-primary);
  cursor: move;
  z-index:999999;
}

.dropdown-item{
  text-transform: none;
}

.badge-lg{
  font-size: 1.15rem;
}

.banner{
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  overflow:hidden;
  /*cursor: pointer;*/ 
}

.modal-xxl{
  --tblr-modal-width: min(90%, 1525px);
}

.particles_system_container{
  display: flex;
  align-items: center;
  justify-content: center;
  height:100%;
}

.form-selectgroup-check{
    border: var(--tblr-border-width) var(--tblr-border-style) rgb(255 255 255 / 24%);
}

h2 .icon{
      --tblr-icon-size: 1.6rem;
}

h3 .icon{
      --tblr-icon-size: 1.4rem;
}

.left_particles_settings{
  height: 50rem;
}

.particles_system{
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  overflow:hidden;
  /*cursor: pointer;*/
  border:solid 1px var(--tblr-border-color);
  background-color: #ffffff;
}
.banner.size_760x500, .particles_system.size_760x500{
  width: 760px;
  height: 500px;
}
.banner.size_300x250, .particles_system.size_300x250{
  width: 300px;
  height: 250px;
}
.banner.size_300x600, .particles_system.size_300x600{
  width: 300px;
  height: 600px;
}
.banner.size_728x90, .particles_system.size_728x90{
  width: 728px;
  height: 90px;
}
.banner.size_160x600, .particles_system.size_160x600{
  width: 160px;
  height: 600px;
}
.banner.size_970x250, .particles_system.size_970x250{
  width: 970px;
  height: 250px;
}
.banner.size_320x50, .particles_system.size_320x50{
  width: 320px;
  height: 50px;
}
.banner.size_300x50, .particles_system.size_300x50{
  width: 300px;
  height: 50px;
}
.banner.size_1080x1080, .particles_system.size_1080x1080{
  width: 540px;
  height: 540px;
}
.banner.size_1080x1920, .particles_system.size_1080x1920{
  width: 540px;
  height: 960px;
}
.banner.size_1920x1080, .particles_system.size_1920x1080{
  width: 960px;
  height: 540px;
}

.banner.size_760x500 .bannerSize, .banner.size_760x500 .banner_content{
  width: 760px;
  height: 500px;
  /*overflow:hidden;*/
}
.banner.size_300x250 .bannerSize, .banner.size_300x250 .banner_content{
  width: 300px;
  height: 250px;
  /*overflow:hidden;*/
}
.banner.size_300x600 .bannerSize, .banner.size_300x600 .banner_content{
  width: 300px;
  height: 600px;
  /*overflow:hidden;*/
}
.banner.size_728x90 .bannerSize, .banner.size_728x90 .banner_content{
  width: 728px;
  height: 90px;
  /*overflow:hidden;*/
}
.banner.size_160x600 .bannerSize, .banner.size_160x600 .banner_content{
  width: 160px;
  height: 600px;
  /*overflow:hidden;*/
}
.banner.size_970x250 .bannerSize, .banner.size_970x250 .banner_content{
  width: 970px;
  height: 250px;
  /*overflow:hidden;*/
}
.banner.size_320x50 .bannerSize, .banner.size_320x50 .banner_content{
  width: 320px;
  height: 50px;
  /*overflow:hidden;*/
}
.banner.size_300x50 .bannerSize, .banner.size_300x50 .banner_content{
  width: 300px;
  height: 50px;
  /*overflow:hidden;*/
}
.banner.size_1080x1080 .bannerSize, .banner.size_1080x1080 .banner_content{
  width: 540px;
  height: 540px;
  /*overflow:hidden;*/
}
.banner.size_1080x1920 .bannerSize, .banner.size_1080x1920 .banner_content{
  width: 540px;
  height: 960px;
  /*overflow:hidden;*/
}
.banner.size_1920x1080 .bannerSize, .banner.size_1920x1080 .banner_content{
  width: 960px;
  height: 540px;
  /*overflow:hidden;*/
}

.half-size{
 transform: scale(0.5);
 transform-origin: 0 0;
}

.dropdown-divider{
 margin:0.5rem 0;
}

.bannerSize{
  position: absolute;
  top:0px;
  left: 0px;
}

.banner_content{
  width:100%;
  height:100%;
}

.main_controller.disabled .card-footer{
  opacity: 0.1;
  pointer-events: none;
}

.controller_instructions{
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  z-index: 999;
  font-size:1.2rem;
}

.controller_instructions.hide{
  display: none;
}


/*.bannerSize img{
  width: 100%;
  height: 100%;
}*/

.layer_preview img{
  width: 100%;
  height: 100%;
}

img {
  max-width: initial;
}


.banner .slide_left_fade{
  opacity:0;
}

.banner_content{
  position: absolute;
  top:0px;
  left: 0px;
  
}

.transition{
  position:absolute;
  visibility: hidden;
}



.my-handle{
  cursor: grab;
  padding:10px;
}

.list_actions{
  position:absolute;
  left:310px;
  top:80px;
}

.selection-box {
  position: absolute;
  border: 1px dashed blue;
  background: rgba(0, 0, 255, 0.2);
  display: none;
  z-index:9999;
  pointer-events: none;
}

.list_actions_btn{
  position:absolute;
  left:360px;
  top:80px;
  display:flex;
}

.progress-main{
  height:40px;
  position:absolute;
  top:50px;
  z-index:9999;
  width: 250px;
  border-radius: 100px;
  left:50%;
  transform: translate(-50%, 0);
  font-size:1rem;
  font-weight: 700;
}


.list_actions_btn .btn{
  margin-right:10px;
}

#offcanvasFlowchart{
  visibility: visible !important;
}

.flowchart_list .list-group-item{
  padding: 10px 10px;
  margin:0;
  border-radius:2px;
}

.navbar-vertical.navbar-expand-lg{
  width:initial;
  position:initial;
  box-shadow:none;
  margin:0px;
  overflow-y:auto;
}

#main_list .list-group-item{
  background-color: white;
  padding: 1em 0.8em;
}

[data-bs-theme=dark] #main_list .list-group-item{
  background-color: var(--tblr-bg-surface);
  color: var(--tblr-text-color);
}

.layer_name_text{
  word-break: break-all;
  text-wrap: auto;
}

.list-group-item-shadow{
  background-color: white;
  padding: 1em 0.8em 1em 1.6em;
  opacity:0.5;
}

.list-group-item .text-truncate:hover .layer_preview{
  display: block;
}

.list-group-item .text-truncate{
  cursor: pointer;
}

input[type="file"] {
  display: none;
}

.list-group{
  border: solid 1px var(--tblr-border-color);
  padding: 3px;
  border-radius: var(--tblr-border-radius);
  /*background-color: var(--tblr-bg-surface);*/
  margin-left: 25px;
  min-height:3.5rem;
}

[data-bs-theme=dark] .list-group{
  background-color: var(--tblr-bg-surface);
  color: var(--tblr-text-color);
}

.form-range .noUi-tooltip {
  display: none;
}
.form-range .noUi-active .noUi-tooltip {
  display: block;
}

.cross{
  width:40px;
  height:40px;
  position:absolute;
  top:50%;
  left:50%;
  z-index:9999;
  display:none;
  mix-blend-mode: difference;
}

.cross::after {
  left: -1000px;
  width: 2000px;
  height: 1px;
}

.timer{
  position: absolute;
  top:0;
  right:0;
  padding: 20px;
  color: #000000;
  border-radius: 0 0 0 5px;
  z-index:9999;
  font-size:80px;
}

/* HTML: <div class="loader"></div> */
.blocks_loader {
  position: absolute;
  width: 55px;
  aspect-ratio: 1;
  --g1:conic-gradient(from  90deg at 3px  3px ,#0000 90deg,#fff 0);
  --g2:conic-gradient(from -90deg at 22px 22px,#0000 90deg,#fff 0);
  background:var(--g1),var(--g1),var(--g1), var(--g2),var(--g2),var(--g2);
  background-size: 25px 25px;
  background-repeat: no-repeat;
  animation: l7 1.5s infinite;
}
@keyframes l7 {
  0%   {background-position:0    0   ,0 100%,100% 100% }
  25%  {background-position:100% 0   ,0 100%,100% 100% }
  50%  {background-position:100% 0   ,0 0   ,100% 100% }
  75%  {background-position:100% 0   ,0 0   ,0    100% }
  100% {background-position:100% 100%,0 0   ,0    100% }
}

.noCursor{
  cursor: none;
}

.cross::before {
  top: -1000px;
  width: 1px;
  height: 2000px;
}

.cross::after, .cross::before {
  content: "";
  background: #ffffff;
  border-radius: 2px;
  position: absolute;
}

.dropdown-menu .form-selectgroup-label svg, .navbar .form-selectgroup-label svg{
  --tblr-icon-size: 1.5rem;
  width: 1.5rem;
  height: 1.5rem;
  font-size: 1.5rem;
}

.timeline-event-icon{
  /*width: 3rem;
  height: 2.5rem;*/
  margin-top:-1rem;
}

datalist {
  max-height: 500px;
  overflow-y: auto;
}

.timeline-event-icon.bg-primary-lt{
  border: solid 2px var(--tblr-primary);
  transition: border-width 0.1s ease-in-out;
}

/*#main_list::before{
  content: "";
  display: block;
  height: calc(100% - 4.9rem);
  width: 2px;
  background-color: var(--tblr-border-color);
  position: absolute;
  left: 9px;
  top: 0px;
}

#main_list::after{
  content: "";
  display: block;
  height: 20%;
  width: 2px;
  background-color: var(--tblr-primary);
  position: absolute;
  left: 9px;
  top: 0px;
}*/

.list-group{
  position: relative;
}

.list-group:before{
  content: "";
  display: block;
  height: calc(100% + 1rem);
  width: 2px;
  background-color: var(--tblr-border-color);
  position: absolute;
  left: -14px;
  top: 0px;
}

.list-group .vertical_progress{
  display: block;
  height: 0;
  width: 2px;
  background-color: var(--tblr-primary);
  position: absolute;
  left: -14px;
  top: 0px;
}

.list-group:last-child:before, .list-group:last-child:after {
  /*content: none;*/
}

.helper-abs{
  position: absolute;
  top:10px;
  right:10px;
  border:solid 1px var(--tblr-primary);
}

.offcanvas-end.small{
  max-width: 500px;
}

.dropdown-item:hover{
  background-color: var(--tblr-primary-lt);
}

#empty_state .btn-close{
  display:inline-block
}

.spinner-overlay{
  width:100%;
  height: 100%;
  position: absolute;
  top:0px;
  left: 0px;
  z-index:999;
}

.table-selectable-row{
  background-color: var(--tblr-primary);
  border-color: var(--tblr-primary);
}

.table-selectable-row .text-muted{
  color: #ffffff !important;
}

.table-selectable-row .badge.bg-green-lt{
  color: #ffffff !important;
}

.spinner-background{
  width:100%;
  height:100%;
  background-color: rgba(255, 255, 255, 0.7);
}

.spinner-background.black{
  background-color: rgba(0, 0, 0, 0.7);
}

.form-selectgroup-input:checked+.form-selectgroup-label{
  border-width: 2px;
}

.spinner-container.blocks{
  width:55px;
}
.spinner-container{
  position: absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
}

#main_list{
  position: relative;
}

.easing{
  display: block;
}

.easing .form-selectgroup-label{
  width: 100%;
  display: flex;
}


.easing .form-selectgroup-item{
  display: inline-block;
  width: 20%;
}

.transition_name {
  font-size: 6px;
  text-transform: uppercase;
  text-align: center;
  margin-top:4px;
  transition: all 0.4s ease-in-out;
  opacity: 0;
  display:none;
}

/*.form-selectgroup-item:hover .transition_name {
  opacity: 1;
}*/

.easing .form-selectgroup-input:checked+.form-selectgroup-label{
  border-width: 2px;
  opacity:1;
}

.easing .form-selectgroup-input+.form-selectgroup-label{
  opacity:0.4;
}

[data-bs-theme=dark] .easing .form-selectgroup-input+.form-selectgroup-label{
  opacity:1;
}

.form-control.disabled, .form-control:disabled{
  opacity: 0.4;
}

.layer_preview{
  position: absolute;
  border:solid 1px var(--tblr-border-active-color);
  box-sizing: border-box;
  overflow:hidden;
  top:-100px;
  left: 68px;
  background-color: #ffffff;
  display: none;
  width: 100px;
  height: auto;
  box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.2);
  z-index:50;
  aspect-ratio: 300/250;
}

.layer_preview.preview_160x600{
  top:50px;
  width: 75px;
  aspect-ratio: 160/600;
}
.layer_preview.preview_300x600{
  top:50px;
  width: 75px;
  aspect-ratio: 300/600;
}

.layer_preview.preview_728x90{
  top:50px;
  width: 200px;
  aspect-ratio: 728/90;
}

.layer_preview.preview_970x250{
  top:50px;
  width: 200px;
  aspect-ratio: 970/250;
}

#sharedDropdown{
  max-width: 45rem;
}

.form-check-input:disabled~.form-check-label, .form-check-input[disabled]~.form-check-label
{
  opacity: 0.15;
}
.form-check-input:disabled{
  opacity:0.15;
}
.form-check-input {
  border: var(--tblr-border-width) var(--tblr-border-style) rgb(143 143 143 / 50%);
}

.loading_status{
  /*display:flex;
  justify-content: center;
  align-items: center;*/
}

.noUi-connect{
  /*background: var(--tblr-border-color);*/
}

.total_loop.badge .icon{
  height:0.8rem;
  width:0.8rem;
  font-size:0.8rem;
}

.text-muted-light{
  --tblr-text-opacity: 0.4;
  color: rgba(var(--tblr-muted-rgb), var(--tblr-text-opacity)) !important;
}

[data-bs-theme=dark] .text-muted {
    color: rgb(138 138 138) !important;
}


[data-bs-theme=dark] .text-muted-light{
  --tblr-text-opacity: 0.8;
}

@media (min-width: 1400px) {
  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
    max-width: 1450px;
  }
}

.breadcrumb-item+.banner_name::before{
  display: none;
}

.breadcrumb-item+.banner_name.breadcrumb_active::before{
  display: block;
}

.breadcrumb-item+.banner_name{
  padding-left: 0;
}

.breadcrumb-item+.banner_name.breadcrumb_active{
  padding-left: var(--tblr-breadcrumb-item-padding-x);
}

.flowchart ol, ul{
  padding-left:0;
}

.flowchart{
  position: relative;
  /*border: solid 1px var(--tblr-border-color);*/
  height:100%;
  min-height: 70vh;
  min-width: 105vw;
  /* LINES*/
  
  /*DOTS
  background-image: radial-gradient(#e5e7eb 1px, transparent 1px);
  background-size: 16px 16px;*/
  z-index:2;
  /*display: flex;
  align-items: flex-start;
  justify-content: center;*/
  padding:70px;
  display: flex;
  align-items: center;
  justify-content: center;
  width:max-content
}

.group_name .badge{
  position:relative !important;
  top:0 !important;
  left:0 !important;
  transform: none !important;
}

.flowchart_list .layer_name{
  font-size:0.9em;
  line-height: 1.2em;
}


.flowchart_list .navbar-vertical.navbar-expand-lg{
  width: 100%;
  position:relative;
}

.flowchart_list .navbar-expand-lg.navbar-vertical{
  box-shadow: none;
}

.flowchart_list .layer_name_text{
  max-width:75%;
}

.flowchart_list .dropdown-menu{
  box-shadow: none;
}

.flowchart_list .nav-link{
  padding:10px 15px;
}

.bg-lines{
  background-image: linear-gradient(to right, #80808012 1px, transparent 1px),
    linear-gradient(to bottom, #80808012 1px, transparent 1px);
  background-size: 24px 24px;
}

.main_header{
  /*z-index:5;*/
  position:relative;
}

.flowchart .main-card{
  width:375px;
  display: inline-block;
  border-color: #868686;
  margin-left:5px;
  margin-right:5px;
  transition: all .2s ease-in-out;
  position:relative;
  top:0px;
  margin-bottom:15px;
}

.tree_group{
  min-width:435px;
}

.list-group-item-assets.selected{
  border:solid 2px var(--tblr-primary);
  border-radius:4px;
}

.tree_group .accordion-body{
  max-width:1500px;
}

.bg-body{
  --tblr-bg-opacity: 0;
}

.tree_group .accordion-button, .tree_group .accordion-collapse{
  /*background-color: var(--tblr-purple-lt);*/
}

.accordion-body{
  padding: var(--tblr-accordion-body-padding-x) var(--tblr-accordion-body-padding-y);
}

.offcanvas-flowchart{
  max-width: 300px;
  margin-top:7rem;
}

.offcanvas-flowchart .offcanvas-body{
  padding:10px 5px;
}

.flowchart .card.active{
  border:solid 3px var(--tblr-green);
  background-color: var(--tblr-green-lt);
}

.flowchart .card .badge-notification{
  width:0.7rem;
  height: 0.7rem;;
}

.card-advertisers{
  position: relative;
  transition: top .25s ease-in-out, border .25s ease-in-out, box-shadow .25s ease-in-out;
  top:0px;
  cursor: pointer;
}
.card-advertisers:hover{
  border-color: var(--tblr-green);
  box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.15);
  top:-6px;
}

.flowchart .card.primary:hover{
  border-color: var(--tblr-primary);
  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.20);
  top:-6px;
}

.flowchart .card.purple:hover{
  border-color: var(--tblr-purple);
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.20);
  top:-6px;
}
.tree ul {
	padding-top: 20px; position: relative;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}

.tree li {
	float: left; text-align: center;
	list-style-type: none;
	position: relative;
	padding: 20px 5px 0 5px;
	
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
}

#main_tree li:first-of-type::before{
  display: none !important;
}

/*We will use ::before and ::after to draw the connectors*/

.tree li::before, .tree li::after{
	content: '';
	position: absolute; top: 0; right: 50%;
	border-top: 1px solid var(--tblr-purple);
	width: 50%; height: 20px;
}
.tree li::after{
	right: auto; left: 50%;
	border-left: 1px solid var(--tblr-purple);
}

.tree .card-title{
  word-break: break-all;
}

/*We need to remove left-right connectors from elements without 
any siblings*/
.tree li:only-child::after, .tree li:only-child::before {
	display: none;
}

/*Remove space from the top of single children*/
.tree li:only-child{ padding-top: 0;}

/*Remove left connector from first child and 
right connector from last child*/
.tree li:first-child::before, .tree li:last-child::after{
	border: 0 none;
}
/*Adding back the vertical connector to the last nodes*/
.tree li:last-child::before{
	border-right: 1px solid var(--tblr-purple);
	border-radius: 0 5px 0 0;
	-webkit-border-radius: 0 5px 0 0;
	-moz-border-radius: 0 5px 0 0;
}
.tree li:first-child::after{
	border-radius: 5px 0 0 0;
	-webkit-border-radius: 5px 0 0 0;
	-moz-border-radius: 5px 0 0 0;
}

/*Time to add downward connectors from parents*/
.tree ul ul::before{
	content: '';
	position: absolute; top: 0; left: 50%;
	border-left: 1px solid var(--tblr-purple);
	width: 0; height: 20px;
}

.tree li a{
	
}


.overflow-h{
  overflow:hidden;
}

.flowchart .card-title{
  font-size: 0.8rem;
  line-height: 1.0rem;
}

.page-header{
  z-index:5;
}

.accordion-button{
  padding: 0.7rem 1rem;
}

.accordion-button:not(.collapsed){
  
}

.screenshot_marker_icon{
  position: absolute;
  top:-15px;
  left:0;
  margin-left:-10px;
  margin-right:-10px;
}

.versions_amount{
  top: 1rem !important;
  right: -0.225rem !important;
}

.is-variation{
  /*border-color: var(--tblr-purple);
  color: var(--tblr-purple);*/
}

.handle_data{
  position: relative;
  left:14px;
  font-size: 0.85rem;
  font-weight: 500;
}

.is-variation{
  display: inline-block;
  width: .7rem;
  height: .7rem;
  min-width: 0;
  min-height: auto;
  padding: 0;
  border-radius: 100rem !important;
  vertical-align: baseline;
  background-color: var(--tblr-purple);
  border:solid 3px var(--tblr-purple);
  position: absolute;
  top: 0;
  right: 0;
  transform: translate(50%, -50%);
  z-index: 50;
  cursor: pointer;
  display:none;
}

.is-variation.show{
  display: inline-block;
}

.is-variation.checkbox{
  right: 9px;
}

.is-variation.left{
  position:relative;
  left: 0px;
  right: auto;
}

.dropdown-menu-variation{
  z-index: 1000;
}

.dropdown-menu{
 /* --tblr-dropdown-zindex: 1500;*/
  --tblr-dropdown-zindex: 1080;
  --tblr-dropdown-bg: #191919;
}

.variation_sync_to_master:hover{
  color : var(--tblr-primary);
}

.variation_push_setting:hover{
  color : var(--tblr-purple);
}

.is-variation:hover{
  background-color: #ffffff;
}

.is-variation.form-check-input:checked, .is-variation .form-check-input:checked{
  /*color: var(--tblr-purple);
  background-color: var(--tblr-purple);*/
}

.is-variation.form-selectgroup-input:checked+.form-selectgroup-label{
  /*color: var(--tblr-purple);
  border-color: var(--tblr-purple);*/
}

.zindex-60{
  z-index: 60;
}


.timescale_container{
  position: relative;
  background: repeating-linear-gradient(45deg, #ffffff, #ffffff 6px, #dadfe5 6px, #dadfe5 10px);
  border: solid 1px #d0d6e1;
  width: 100%;
  height: 52px;
  padding-left:0px;
  border-radius: 5px;
}

[data-bs-theme=dark] .timescale_container{
  background: repeating-linear-gradient(45deg, #19222d, #19222d 6px, #394f68 6px, #394f68 10px);
  border: solid 1px #4b6782;
}

.timescale_block{
  top: 0;
  position: absolute;
  width: 250px;
  height: 52px;
  margin: 0 auto;
  background-image: linear-gradient(45deg, #54ffd1 12.50%, #ffffff 12.50%, #ffffff 50%, #54ffd1 50%, #54ffd1 62.50%, #ffffff 62.50%, #ffffff 100%);
  background-size: 11.31px 11.31px;
  border:solid 2px #54ffd1;
  box-sizing: border-box;
  border-radius: 5px;
}

.timescale_block.master{
  border: solid 2px rgba(var(--tblr-primary-rgb), 1);
  background: rgba(var(--tblr-primary-rgb), 1);
}

.timescale_block.variation{
  border: solid 2px rgba(var(--tblr-purple-rgb), 1);
  background: rgba(var(--tblr-purple-rgb), 1);
}


.timescale_handle{
  position: absolute;
  top: 16px;
  left:0px;
  width: 16px;
  height: 16px;
  background-color: rgba(var(--tblr-primary-rgb), 1);
  cursor: ew-resize !important;
  border-radius: 50px;
  border: solid 2px #ffffff;
}

.timescale_handle.master{
  background-color: var(--tblr-primary);
}
.timescale_handle.variation{
  background-color: var(--tblr-purple);
}

.timescale_handle &.left{
  transform-origin: left center;
}

.cursor-text{
  cursor:text;
}

.bg-timescale{
  --tblr-bg-opacity: 0.6;
  background-color: rgba(var(--tblr-dark-rgb), var(--tblr-bg-opacity)) !important;
}

.accordion-button{
  font-weight: 700;
}

#editTimescale svg{
  margin:0;
}

.handle_data{
  position: relative;
  left: 17px;
  font-size: 0.85rem;
  font-weight: 500;
  top: -3px;
}

.dropdown-toggle:after{
  transform: rotate(-135deg);
}

.dropdown-toggle.show:after{
  transform: rotate(-45deg);
}

.flowchart_list .dropdown-toggle{
  /*background-color: rgba(var(--tblr-primary-rgb), 0.05);*/
}


#motionPath_container{
  position: absolute;
  top:0px;
  left:0px;
  width: 100%;
  height: 100%;
}

.motion-path-helper{
  /*z-index: 9999 !important;*/
}

.transition.showTemp{
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  transform: scale(1) translate(0px, 0px) rotate(0deg) !important;
  top: 0px !important;
  left: 0px !important;
}

.copy-motion-path{
  display: none;
}

/*.accordion-item:not(:first-of-type){
  border-top: solid 1px var(--tblr-border-color);
}*/

/*.legal{
  position: absolute;
  bottom:-100%;
  left:0%;
  width: 100%;
  height: auto;
  font-size:12px;
  color: #000000;
  font-family: Arial, Helvetica, sans-serif;
  padding:10px;
  background-color: #e1e1e1;
  z-index:9998;
}

.legal_btn{
  position: absolute;
  bottom:0;
  right:0;
  padding:3px 8px;
  font-size:12px;
  color: #000000;
  font-family: Arial, Helvetica, sans-serif;
  background-color: #e1e1e1;
  z-index:9999;
  cursor: pointer;
}
*/

/*=== LEGAL | debut ============================*/
.legal-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.4);
  opacity: 0;
  cursor: pointer;
  z-index: 999;
  -webkit-transform: translate3d(-1px,100%,0);
  -webkit-transition: opacity .5s ease;
  -moz-transition:    opacity .5s ease;
  -o-transition:      opacity .5s ease;
  -ms-transition:     opacity .5s ease;
  transition:         opacity .5s ease;
  visibility:hidden
}
.legal-bg.legal-active {
  opacity: 1;
  -webkit-transform: translate3d(-1px,0,0);
  -webkit-transition: opacity .5s ease;
  -moz-transition:    opacity .5s ease;
  -o-transition:      opacity .5s ease;
  -ms-transition:     opacity .5s ease;
  transition:         opacity .5s ease;
  visibility:visible;
}
.legal {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  height: auto;
  font-family: helvetica, arial, sans-serif;
  color: #707070;
  z-index: 999;
  -webkit-transform: translate3d(0,0,0);
  -webkit-transition: -webkit-transform .5s ease;
}
.legal.legal-active {
  -webkit-transform: translate3d(0,-100%,0);
}
.legal-btn {
  position: absolute;
  top: -22px;
  left: 0;
  height: 25px;
  background: #f0f0f0;
  font-size: 12px;
  text-align: center;
  cursor: pointer;
  padding-top:2px;
  padding-left:6px;
  padding-right:6px;
}
.legal-btn.legal-right{
  right: 0;
  left: auto;
}
.legal-text {
  position: relative;
  float: left;
  width: 100%;
  height: auto;
  max-height: 300px;
  background: #f0f0f0;
  font-size: 10px;
  line-height:11px;
  text-align: justify;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 8px;
  -webkit-overflow-scrolling: touch;
  overflow: auto;
  color: #707070;
}

.banner.size_300x250 .legal-text{
  max-height: 210px;
}
/*=== LEGAL | fin ============================*/

.offcanvas .form-imagecheck-image{
  max-width: 150px;
}

.offcanvas.offcanvas-top{
  min-height: 375px;
}

#featureBackground {
  height: 100%;
  overflow: hidden;
  position: absolute;
  width: 100%;
  top:0px;
  left: 0px;
}

.particle-emitter{
  position:absolute;
  top:calc(50% - 15px); left:calc(50% - 15px); 
  width:30px; 
  height:30px;
  border:dashed 2px #ff0000;
}

.particle-emitter.hide{
  border: none;
}

.particle-base{
  position: absolute;
  width: 10px;
  height: 10px;
  will-change: transform;
}

.particle-circle{
  background-color: #91e600;
  border-radius: 50%;
}

.dot {
  position: absolute;
  background-color: #91e600;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  will-change: transform;
}

.snowflake {
  width: 10px;
  height: 10px;
  background-color: rgb(0, 0, 0);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}

.prod_layer.is_morph_path .layer_name_text, .layer_is_morph{
  opacity:0.3;
}

.accordion-item:not(.d-none):not(:first-of-type){
  border-top: var(--tblr-accordion-border-width) solid var(--tblr-accordion-border-color);
}

.is-removed{
  background-color: var(--tblr-danger-lt);
}

.is-removed .layer_name_text{
  text-decoration: line-through;
  color: var(--tblr-danger);
}

.prod_layer.is-removed{
  padding: 0.4em 0.8em !important;
  opacity:0.4;
}

.is-added{
  background-color: var(--tblr-green-lt);
}
.is-added .layer_name_text{
  color: var(--tblr-green);
}

.avatar{
  --tblr-avatar-size: 4.5rem;
  --tblr-avatar-font-size: 1rem;
}

.load_recent_project:hover{
  text-decoration: none;
}

.hide_for_empty{
  display: none;
}

.form-switch{
  padding-left:3rem;
}

.currentAppVersion{
  font-size: 0.8rem;
  letter-spacing: .04em;
}

.assets_folder .card:hover{
  background-color: #f3f3fc;
}

.assets_folder .image{
  width: 100%;
  height: auto;
  max-width: 200px;
  max-height: 200px;
  border:var(--tblr-border-width) solid var(--tblr-border-color);
}

.assets_folder .folder{
  width: 100%;
  height: auto;
  max-width: 200px;
  max-height: 200px;
}

.height-fit-content{
  height: fit-content;
}

#offcanvasEndAssets{
  -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#offcanvasEndAssets .offcanvas-body{
  flex-grow: initial;
}

.imageUsed{
  position: absolute;
  top:10px;
  right:10px;
}

.cta_bounds{
  position: absolute;
  top:0;
  left:0;
  background-color:rgba(0, 255, 200, 0.5);
  border:solid 2px #a8ffe8;
  width:300px;
  height: 250px;
  z-index:999;
}

.corners{
  display: block;
  position: absolute;
  height: 10px;
  width: 10px;
  background: #00b081;
}

.corners.bottomRight {
  right: 0;
  bottom: 0;
}

.corners.bottomLeft {
  left: 0;
  bottom: 0;
}

.corners.topLeft {
  left: 0;
  top: 0;
}

.corners.topRight {
  right: 0;
  top: 0;
}

.corners.top {
  height: 2px;
  width: 100%;
  background: #00ffbb;
}

.corners.left {
  height: 100%;
  width: 2px;
  background: #00ffbb;
  left: 0;
}

.corners.right {
  height: 100%;
  width: 2px;
  background: #00ffbb;
  right: 0;
}

.corners.bottom {
  height: 2px;
  width: 100%;
  background: #00ffbb;
  bottom: 0;
}

.bounds_actions{
  position: absolute;
  top:10px;
  right:10px;
  z-index: 99999;
}

.bounds_actions svg{
  width: 1.5rem;
  height: 1.5rem;
}

.cta_rect{
  position: absolute;
  top:0;
  left:0;
  width: 300px;
  height: 250px;
  background-color: rgba(0, 255, 200, 0);
  border:solid 2px #a8ffe8;
  z-index: 990;
  opacity: 0;
}

.form-check-input.green:checked{
  background-color:var(--tblr-green);
}

.form-check-input.purple:checked{
  background-color:var(--tblr-purple);
}

.full .clr-field button {
  width: 100%;
  height: 100%;
  border-radius: 5px;
}

.dropdown-menu .form-selectgroup-label{
  padding: .7rem 1rem;
}

iframe{
  border:0;
  overflow: hidden;
}

.card.selected{
  background-color: var(--tblr-primary-lt);
  border:solid 1px var(--tblr-primary);
}

.card.selected.green{
  background-color: var(--tblr-green-lt);
  border:solid 1px var(--tblr-green);
}

.card.selected.purple{
  background-color: var(--tblr-purple-lt);
  border:solid 1px var(--tblr-purple);
}

.card.selection:not(.selected){
  opacity:0.15;
}

.sticky-offset{
  padding-top:20px;
}

.banner_name_preview{
  white-space: nowrap;
  max-width: 185px;
  text-overflow: ellipsis;
  overflow: hidden;
  position: relative;
}

.banner_name_preview:hover{
  overflow: visible;
}
.banner_name_preview:hover::after {
  content: attr(data-fulltext);
  position: absolute;
  left: 0;
  top: 0;
  background: #fff;
  color: #000;
  border: 1px solid #ccc;
  padding: 5px;
  white-space: normal;
  z-index: 10;
  width: max-content;
  max-width: 400px; /* Optional: Limit tooltip width */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  overflow:visible;
}
/* Change tooltip background and text color */
.tooltip .tooltip-inner {
  background-color: var(--tblr-primary); /* your desired background color */
  color: #fff; /* your desired text color */
}

/* Change tooltip arrow color */
.tooltip .tooltip-arrow::before {
  border-top-color: var(--tblr-primary) !important; /* for top placement */
}

.nav-link.disabled-elipsis{
  color: var(--tblr-nav-link-disabled-color);
  cursor: default;
}

.main_controller{
  position: fixed;
  bottom:0;
  width:100%;
  padding:20px 60px;
  background-color:#ffffff;
  transition:all 0.4s ease;
  box-shadow: 0px -5px 20px 0px rgba(0,0,0,0.05);
  z-index:9999;
}

.main_controller.hide{
  bottom:-200px;
}

.nav-link{
  
}

.fade-scale {
  transform: scale(0);
  opacity: 0;
  -webkit-transition: all .25s ease-in-out;
  -o-transition: all .25s ease-in-out;
  transition: all .25s ease-in-out;
}

.fade-scale.show {
  opacity: 1;
  transform: scale(1);
}



.hr-text.small{
  margin: 1.4rem 0;
}

hr.small{
   margin: 1rem 0;
}

.main_controller{
  position: fixed;
  bottom:0;
  width:100%;
  padding:20px 60px;
  background-color:#ffffff;
  transition:all 0.4s ease;
  box-shadow: 0px -5px 20px 0px rgba(0,0,0,0.05);
  z-index:1000;
}

[data-bs-theme=dark] .main_controller{
  background-color: var(--tblr-bg-surface);
}
.main_controller.hide{
  bottom:-150px;
}

.main_controller.hide .main_controller_drawer svg{
  transform: rotate(180deg);
}

.btn.disabled, .btn:disabled, fieldset:disabled .btn {
  background-color: var(--tblr-btn-bg);
  border: var(--tblr-btn-border-width) solid var(--tblr-btn-border-color);
  box-shadow: var(--tblr-btn-box-shadow);
}

.visibility_hidden{
  position: absolute;
  top:-5000px;
  left: -5000px;
}

.gif_container{
  width: 100%;
  height: 125px;
  margin-bottom:10px;
  display: flex;
}

.gif_preview{
  width: 100px;
  height: 100px;
  object-fit:cover;
  display: flex;
  flex-direction: column;
  align-items: center;
  /*justify-content: center;*/
  text-align: center;
  margin-right:10px;
  position: relative;
}

.gif_preview img{
  max-width: 100%;
  max-height: auto;
}

.gif_preview_add{
  width: 100px;
  height: 100px;
  object-fit:cover;
  display: inline-block;
  margin-right:10px;
  border:solid 1px var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
}

.icon-item-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  
}

.icon-item{
  cursor:pointer;
  width: 100px;
  height: 100px;
  object-fit:cover;
  margin-right:10px;
  border:solid 1px var(--tblr-border-color);
  border-radius: var(--tblr-border-radius);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  text-decoration: none;
  position: relative;
  background-color:#ffffff;
}

.icon-item.disabled{
  opacity:0.5;
  pointer-events: none;
}

.icon-item:hover{
  background-color: var(--tblr-primary-lt);
  border:solid 1px var(--tblr-primary);
}

.gif_remove_icon{
  position: absolute;
  top:-10px;
  right:-10px;
  cursor: pointer;
  margin-right: 0;
  background-color:#ffffff;
}

.container-tight{
  max-width: 30rem !important;
}


.comment_cursor{
  cursor: move;
}

.banner_comment_box{
  position: absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  background-color: rgba(0,0,0,0);
  z-index:9999;
  display:none;
  border:solid 5px rgba(var(--tblr-success-rgb),0.8);
}

.card-subtitle{
  max-width:220px;
}


.comment_icon_actions{
  position:absolute;
  right:15px;
  top:10px;
}

.card-comments{
  position:relative;
  top:0px;
  transition:box-shadow 0.25s ease-in-out, top 0.25s ease-in-out;
}

.card-comments:hover{
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.15);
  border:solid 2px #000000;
  top:-8px;
}

.card-comments .card-header{
  display:block;
}
.banner:hover .banner_comment_box{
  display:block;
}

.page-wrapper .page-header{
  margin:.5rem 0 0;
}

.offcanvas-comments .offcanvas-body{
  padding-bottom:175px;
}

.comment_mode{
  cursor: grab;
}

.offcanvas.offcanvas-comments{
  width:400px;
}

/* PROOFREADING */
.card-comments.proofreading{
  background-color: rgba(var(--tblr-purple-rgb), 0.05);
  color:var(--tblr-purple);
  cursor:pointer;
}

.card-comments.proofreading.completed{
  background-color: rgba(var(--tblr-secondary-rgb), 0.05);
  color:var(--tblr-secondary);
  opacity:0.5;
}

.card-comments.proofreading.completed.highlight{
  background-color: rgba(var(--tblr-secondary-rgb), 0.1);
  border:solid 2px var(--tblr-secondary);
}

.card-comments.proofreading.completed:hover{
  background-color: rgba(var(--tblr-secondary-rgb), 0.1);
}

.card-comments.proofreading.highlight{
  background-color: rgba(var(--tblr-purple-rgb), 0.1);
  border:solid 2px var(--tblr-purple);
}

.card-comments.proofreading:hover{
  background-color: rgba(var(--tblr-purple-rgb), 0.1);
}
/* PROOFREADING */
/* INTERNAL */
.card-comments.internal{
  background-color: rgba(var(--tblr-green-rgb), 0.05);
  color:var(--tblr-green);
  cursor:pointer;
}

.card-comments.internal.completed{
  background-color: rgba(var(--tblr-secondary-rgb), 0.05);
  color:var(--tblr-secondary);
  opacity:0.5;
}

.card-comments.internal.completed.highlight{
  background-color: rgba(var(--tblr-secondary-rgb), 0.1);
  border:solid 2px var(--tblr-secondary);
}

.card-comments.internal.completed:hover{
  background-color: rgba(var(--tblr-secondary-rgb), 0.1);
}

.card-comments.internal.highlight{
  background-color: rgba(var(--tblr-green-rgb), 0.1);
  border:solid 2px var(--tblr-green);
}

.card-comments.internal:hover{
  background-color: rgba(var(--tblr-green-rgb), 0.1);
}
/* INTERNAL */
/* EXTERNAL */
.card-comments.external{
  background-color: rgba(var(--tblr-primary-rgb), 0.05);
  color:var(--tblr-green);
  cursor:pointer;
}

.card-comments.external.completed{
  background-color: rgba(var(--tblr-secondary-rgb), 0.05);
  color:var(--tblr-secondary);
  opacity:0.5;
}

.card-comments.external.completed.highlight{
  background-color: rgba(var(--tblr-secondary-rgb), 0.1);
  border:solid 2px var(--tblr-secondary);
}

.card-comments.external.completed:hover{
  background-color: rgba(var(--tblr-secondary-rgb), 0.1);
}

.card-comments.external.highlight{
  background-color: rgba(var(--tblr-primary-rgb), 0.1);
  border:solid 2px var(--tblr-primary);
}

.card-comments.external:hover{
  background-color: rgba(var(--tblr-primary-rgb), 0.1);
}
/* EXTERNAL */

.comment_icon, .comment_icon_scrub, .comment_icon_new{
  position: absolute;
  cursor: pointer;
  transition: all 0.2s ease-out;
  z-index: 99999;
  width:24px;
  height: 24px;;
}

.comment_icon svg, .comment_icon_scrub svg, .comment_icon_new svg{
 /* width: 1.6rem;
  height: 1.6rem;
  font-size: 1.6rem;*/
  width:24px;
  height:24px;
}

.mark_as_done{
  transition:transform 0.2s ease-out;
}

.card.move-up{
  /*background-color:rgba(var(--tblr-purple-rgb), 0.5);*/
  border:solid 2px var(--tblr-primary);
  box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.20);
  transform:translateY(-10px);
  -moz-transform: translateY(-10px);
  -webkit-transform: translateY(-10px);
  transition: transform 0.2s ease-out, box-shadow 0.2s ease-out;
  background-color: var(--tblr-primary-lt);
  color: var(--tblr-primary);
  cursor: pointer;
  box-sizing: border-box;
  border-radius: var(--tblr-border-radius);
  margin:-1px;
}

.card.green.move-up{
  border:solid 2px var(--tblr-green);
  background-color: var(--tblr-green-lt);
}

.card.purple.move-up{
  border:solid 2px var(--tblr-purple);
  background-color: var(--tblr-purple-lt);
}

.mark_as_done:hover{
  transform:scale(1.3);
  -moz-transform: scale(1.3);
  -webkit-transform: scale(1.3);
}

.comment_icon:hover, .comment_icon_scrub:hover{
  transform:scale(1.3);
  -moz-transform: scale(1.3);
  -webkit-transform: scale(1.3);
}

.comment_icon, .comment_icon_scrub, .comment_icon_new{
  position: absolute;
  cursor: pointer;
  transition: all 0.2s ease-out;
  z-index: 1054;
}

.comment_icon:hover, .comment_icon_scrub:hover{
  transform:scale(1.5);
  -moz-transform: scale(1.5);
  -webkit-transform: scale(1.5);
}

.card.move-up{
  background-color:rgba(var(--tblr-purple-rgb), 0.5);
}

.fit-content{
  width: fit-content;
}

.status_pending_opacity{
  opacity:0.3;
}

.comment_tag{
  position: absolute;
  top:50%;
  left:50%;
  display: none;
  z-index:999999;
}

.comment_tag svg{
  width: 1.6rem;
  height: 1.6rem;
  font-size: 1.6rem;
}

.pointer-none{
  pointer-events: none;
}

.comment_tag{
  position: absolute;
  top:50%;
  left:50%;
  display: none;
  z-index:9999;
}

.comment_tag .card{
  box-shadow: 0px 10px 15px -3px rgba(0,0,0,0.1);
}

.comment_tag_text .form-check{
  margin-bottom: 0rem;
}

.comment_tag_text .form-switch{
  padding-left: 2.5rem;
}
 

.comment_tag_text{
  width:350px;
}

.driver-popover.driverjs-theme {
  background-color: #fde047;
  color: #000;
}

.empty-img img{
  height:13rem;
}


.driver-popover.driverjs-theme .driver-popover-title {
  font-size: 20px;
}

.driver-popover.driverjs-theme .driver-popover-title,
.driver-popover.driverjs-theme .driver-popover-description,
.driver-popover.driverjs-theme .driver-popover-progress-text {
  color: #000;
}

.driver-popover.driverjs-theme button {
  flex: 1;
  text-align: center;
  background-color: #000 !important;
  color: #ffffff;
  border: 2px solid #000;
  text-shadow: none;
  font-size: 14px;
  padding: 5px 8px;
  border-radius: 6px;
}

.driver-popover.driverjs-theme button:hover {
  background-color: #000;
  color: #ffffff;
}

.driver-popover.driverjs-theme .driver-popover-navigation-btns {
  justify-content: space-between;
  gap: 3px;
}

.driver-popover.driverjs-theme .driver-popover-close-btn {
  color: #9b9b9b;
}

.driver-popover.driverjs-theme .driver-popover-close-btn:hover {
  color: #000;
}

.driver-popover.driverjs-theme .driver-popover-arrow-side-left.driver-popover-arrow {
  border-left-color: #fde047;
}

.driver-popover.driverjs-theme .driver-popover-arrow-side-right.driver-popover-arrow {
  border-right-color: #fde047;
}

.driver-popover.driverjs-theme .driver-popover-arrow-side-top.driver-popover-arrow {
  border-top-color: #fde047;
}

.driver-popover.driverjs-theme .driver-popover-arrow-side-bottom.driver-popover-arrow {
  border-bottom-color: #fde047;
}

.page-body{
  min-height: 50rem;
}

.bg-transparent{
  --tblr-bg-opacity: 0;
  box-shadow: none;
}

.border-top-none{
  border-top: none !important;
}


.modal {
    --tblr-modal-zindex: 1100;
}

.slick-dots{
  bottom:-35px;
}

.slick-dots li.slick-active button:before{
  color: #ffffff;
  opacity: 1;
}

.slick-dots li button:before{
  color: #ffffff;
  opacity: 0.3;
  font-size: 12px;
}

.slick-slide {
  margin: 0 10px;
}

.sticky-offset{
  padding-top:15px;
  backdrop-filter: blur(12px);
  background-color: rgba(var(--tblr-body-bg-rgb), 0.8);
}

.modal-blur{
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.slide-indicator {
  text-align: center;
  margin-top: 40px;
  font-size: 16px;
  color:#ffffff;
  font-weight: bold;
}

.main_controller_drawer{
  position: absolute;
  top:-35px;
  left:50%;
  transform: translateX(-50%);
  padding:10px 40px;
  background-color:#ffffff;
  z-index:9999;
  cursor: pointer;
  border-radius: 6px;
}

[data-bs-theme=dark] .main_controller_drawer{
  background-color: var(--tblr-bg-surface);
}

.motion_path_actions{
  position: absolute;
  top:50px;
  right:-90px;
  z-index:9999;
}

.bound_btn .icon{
  --tblr-icon-size: 1.5rem;
}

.motion_path_instructions{
  position: absolute;
  top: 80px;
  left: 103%;
  /* transform: translateX(-50%); */
  /* width: 310px;*/
  width: 300px;
}