@import url(https://fonts.googleapis.com/css?family=Nunito:400,100,100italic,300,300italic,400italic,500,500italic,700,700italic,900italic,900);
html, body, html * {
  font-family: 'Nunito', sans-serif;
}

/* Works on Firefox */

  
  /* Works on Chrome, Edge, and Safari */
  *::-webkit-scrollbar {
    width: 12px;
    border-radius: 10px !important;
  }
  
  *::-webkit-scrollbar-track {
    background: var(--bulma-primary-00);
    border-radius: 10px !important;
  }
  
  *::-webkit-scrollbar-thumb {
    background-color: #ACB2BE;
    border-radius: 10px !important;
    border: 3px solid var(--bulma-primary-00);
  }

.fade-me-out {
    opacity: 0;
    transition: opacity 1s ease-out;
}

input[type="checkbox"] {
    accent-color: var(--bulma-primary);
}


.badge{
box-shadow: none;
}
* {
outline: none;
}
span[data-tooltip]{
    border-bottom: none !important;
}
.qrcode{
    background-color: #ACB2BE;
    width:22%;
}
html{
    height: 100vh;
    overflow-y: hidden;
    background-color: #1E1E1E;
}
.table{
    background-color: #1E1E1E;
}
.table-files{
    background-color: unset;
    overflow-wrap:anywhere;
}
.table-avatars-field{
    display:flex;
    margin-bottom: -1px;
    margin-left:5px;
}
.is-hidden{
    display: none;
}
.full-width{
    width: 100%;
}

body{
  margin: 0px;
  min-height: 100%;

}
.content-container-main{
    height: 100vh;
    margin-left:50px;
    z-index:25;
}
.content-container-main-sidebar-right{
    width: calc(100% - 300px);
}
.title-header-sidebar-right{
    width: calc(100% - 375px) !important;
}

.content-container {
  width: auto;
  overflow-x: hidden;
  margin-left: 65px;
  padding-right: 20px;
  overflow-y: auto;
  height: 85vh;
  padding-bottom:5px;
}
.content-container-phase {
    height: 92vh; 
    margin-left: 0px !important;
}
.single-column-title-header-container {
    margin-left: 50px;
}
.sidebar-float{
    position: fixed;
    transition: max-width 0.3s ease-out;
    max-width: 1000px;
    width: 300px;
    height: 100vh;
    overflow-y: auto;
    background-color: #0A0A0A;
    right: 0;
    top: 0;
    z-index: 999;
}
.sidebar-float-left{
    right:unset;
    left:85px;
}
.sidebar-float-invisible{
    max-width: 0px;

}
.sidebar-float-header{
    display: flex;
    padding: 10px;
}
.sidebar-float-close{
    float:right;
    margin-left: auto;
    margin-top: 5px;
}
.work-instruction-lists{
    padding:10px;
}
.work-instruction-list{
    padding-bottom: 10px;
}
.work-instruction{
    padding-bottom: 2px;
}
.work-instruction-item{
    display: flex;
    flex-direction: row;
    padding: 3px;
}
.work-instruction-item-checkbox{
    accent-color: #0A0A0A;
    align-self: flex-start;
    margin-top: 5px;
    margin-right: 5px;

}
.work-instruction-header{
    display:flex;
}
.work-instruction-header-checkboxes{
    margin-left: auto;
}
.sidebar-right{
    margin-top: 5px;
    padding-right: 5px;
    padding-top: 10px;
    padding-bottom: 0;
}
.sidebar-scroll{
    overflow-y: auto;
    height: 100vh;
    padding-top: 15px;
    padding-right: 10px;
}
.sidebar-content{
    height: 84vh;
    overflow-y: auto;
    max-height: 84vh;
    padding-right: 10px;
}
.sidebar-save{
    height: 6vh;
    max-height: 6vh;
    display: flex;
    flex-direction: row;
    margin-top: 10px;
    margin-right: 10px;
}
.sidebar-save-button{
    margin-top: 10px;
    margin-right: 10px;
}
.check{
    margin-right: 5px;
}
.check-item{
    padding: 10px !important;

}
.check-header{
    display:flex;
    flex-direction: row;
}
.check-header-name{
    overflow:hidden;
}
.check-button-group-header{
    display:flex;
    float:right;
    place-content: flex-end;
    right: 0;
    margin-left:auto;
    position: relative;
    
}
.check-button-group{
    display:flex;
    place-content: flex-end;
    min-width: 180px;
    margin-left:auto;
    position: relative;
    right: 0;
    align-items: end;
}
.check-button-group-button{
    margin-left: 15px;
    cursor: pointer;    
}
.check-button-selected{
    color: var(--bulma-primary);
}
.markdown-content a{
    text-decoration: underline;
}
.check-content-comment-header{
    display: flex;
    flex-direction: row;
    align-items: center;
}

.check-content-information{
    margin-top: 5px;
}
.check-content-status{
    position:relative;
    top: 18%;
    padding-right:5px;
}
.check-content-outcome{
    margin-top: 5px;
    display:flex;
    flex-direction: row;
    width:100%;
}
.check-content-reference{
    color: #0A0A0A;
}
.check-content-reference-document{
    display:inline-flex;
    background: #0A0A0A;
    border-radius: var(--bulma-radius);
    align-items:center;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 5px;
    overflow-wrap: anywhere;
}
.check-content-reference-page{
    margin-left: 5px;
}
.collapse-content-box{
    padding-bottom: 5px;
}
.content-container-no-sidebar{
    padding-top: 0 !important;
    padding-left: 55px !important;
    padding-right: 20px !important;
    margin-left: 10px !important;
}
.content-container-left{
    /* padding-right: 20px; */
    border-right: 1px solid #363636;

}
.collapse-content-button-small{
    margin-top: -15px;
}
.collapse-content-box-content{
    transition: max-height 500ms ease-out;
    padding-left: 5px;
    margin-top: 10px;
    overflow: visible;
    display:flex;
    flex-direction: column;
}
.collapse-content-box-content-created{
    clear: both;
}
.collapse-content-box-content-created-item{
    padding-top: 5px;
    padding-left: 5px;
    padding-right: 10px;
    border: 1px solid #4F535C;
    border-radius: 5px;
    margin-bottom: 5px;
    clear:both;
}

.collapse-content-box-content-created-item-inner{
    clear:both;
    position: relative;
}
.collapse-content-box-content-created-item-inner:nth-child(n+2){
    border-top: 1px solid #4F535C;
    padding-top: 5px;

}
.collapse-content-box-content-inner-collapse{
    margin-left: 15px;

}
.collapse-content-box-content-divider{
    border-top: 1px solid #4F535C;
    margin-left:-5px;
    margin-right:-5px;
    width: calc(100% + 15px); 

}
.collapse-content-box-activity{
    padding-left: 15px;
    display:flex;
    flex-direction:row;
    padding-top:5px;
    padding-bottom:5px;
}
.collapse-content-box-content-created-section{
    padding: 5px;
    clear: both;
    position: relative;
    margin-top: 10px;
    border-left: 5px solid #4F535C;
}
.collapse-content-box-content-created-item-inner-border{
    border: 1px solid #4F535C;
    border-radius: 5px;
}
.collapse-content-box-header{
    display: flex;
    flex-direction:row;
    align-items: center;
}
.collapse-content-box-header-title-text{
    padding-left: 5px;
}
.collapse-content-box-header-content{
    padding-left: 12px;
}
.collapse-content-box-header-tag{
    margin-left: 10px;
}
.collapse-content-box-content-created-item-title{
    overflow: hidden;
}

.collapse-content-invisible{
    max-height: 0 !important;
    overflow: hidden !important;
    display: none !important;
    visibility: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    position: absolute !important;
    pointer-events: none !important;
}
.align-right{
    float:right;
}
.collapse-content-box-buttons{
    float: right;
}
.collapse-content-caret{
    padding-right: 5px;
    align-self:start;
    padding-top: 3px;
    cursor:pointer;
    
}
.collapse-content-caret-sidebar{
    padding-top: 0px;
}

.collapse-content-box-header{
    display: flex;
    align-items: center;
    cursor: pointer;
    padding-top: 5px;
    
    .collapse-content-box-header-text{
        margin-bottom: 0px;
    }
}

.collapse-content-box-header-icons{
    display: flex;
    flex-direction: column;
    width: 100%;

}
.collapse-content-box-header-title{
    align-content: center;
    width: 66%;
}
.collapse-content-box-header-title-text{
    margin-bottom:0px;
    text-overflow:ellipsis;
    white-space:nowrap;
    overflow:hidden;
}
.collapse-content-header-button-group{
    padding-left: 10px;
}
.collapse-content-title-icons{
    display: flex;
    flex-direction: row;
}
.collapse-content-box-header-add{
    margin-left: auto;
}
.collapse-content-box-header-title-icons{
    margin-left: auto;
}
.is-small{
    font-size: var(--bulma-size-small) !important;
}
.button.is-outlined:hover{
    --bulma-button-border-width: max(1px,0.0625em) !important;
    background-color: #363636 !important;
}
.sidebar{
    height: 100vh;
    background: #121212;
    overflow-y: hidden;
    position: fixed;
    transition: all 0.5s;
    z-index: 999;

}
.sidebar-open{
    max-width: 100px;
    min-width: 100px;
}

.content-container-sidebar-open{
    margin-left:315px;
}
.phase-nav-item{
    padding:5px;
    display: flex;
    cursor: pointer;
    font-size: 0.9em;
}
.phase-nav-item-active{
    background-color: #346D62;
}
.phase-nav-item-child{
    margin-left: 20px;
}
.phase-nav-item:hover{
    background-color: #346D62;
}
.phase-nav-item-selected{
    background-color: var(--bulma-primary) !important;
}
.sidebar-menu-item{
    display: flex;
}

.sidebar-link:hover{
    background-color: #242424 !important;
    /* text-align: center; */

}
.sidebar-active{
    background-color: var(--bulma-primary) !important;
    color: #242424 !important;

}
.sidebar-active:hover{
    background-color: #ACB2BE !important;
    color: white !important;
}
.sidebar-icon{
    padding: 5px;
    font-size:small;

}
.sidebar-link{
    font-size: 0.9em !important;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.sidebar-link-text{
    transition: all 0.3s;
    font-size:small;
    word-break: break-word;
    width: 100%;
}
.sidebar-brand{
    height: 28px;
    display:inline;
}
.logo-button-spin{
    animation: spin-animation 2s infinite;
    animation-timing-function: linear;
    display: inline-block;
}
.select2-selection__choice {
    max-width: 60vw;
}
.select2-results__option{
    max-width: 60vw;
}
@keyframes spin-animation {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(359deg);
    }
  }
.sidebar-link-text-brand{
    display:block;
    font-size:small;
}
.close-sidebar{
    display:none !important;
}
.sidebar-popup {
    display: none;
    position: fixed;
    bottom: 0;
    left: 53px;
    background-color: #1E1E1E;
    z-index: 999;

}
.sidebar-popup-open{
    display: block;
}
.sidebar-link-popup{
    padding: 5px !important;
    text-align:center;
}
.sidebar-form-popup{
    width: 100%;
}
.is-divider{
    margin: 0 10px 10px 5px;
    margin-top: 0;
    margin-bottom: 0;
}
.menu-list a{
    text-align: center;
}



.menu-list-bottom{
    position: absolute;
    bottom: 0;
    width: 100%;
}
.tabs li.is-active a{
border-bottom-color: var(--bulma-primary);
color: var(--bulma-primary);
}
.table-row{
    border-bottom: 1px solid #353a46;
}
.table-calendar{
    display: inline-flex;
    float: right !important;

}
.input-table-calendar{
    width: inherit;

}
.table-checkbox{
    padding-top: 10px;
}
.checkboxes-vertical{
    display: flex;
    flex-direction: column;
}
.hide-field{
    display: none !important;
}
.embed-container{
    height: 90vh;
}
.chat-container{
  position: relative;
  height: 85vh;

}
.chat-container-input{
  margin-top: auto;
  width: 100%;
}
.chat-box{
  margin-bottom: 5px;
  height: 78vh;
  max-height: 78vh;
  overflow-y: auto;
}

.chat-loader-content {
    font-style: italic;
}

.chat-divider{
    padding-bottom: 24px;
    border-top:1px solid #363636; 

}

@keyframes loadingDots {
    0%, 100% { content: ""; }
    25% { content: "."; }
    50% { content: ".."; }
    75% { content: "..."; }
}

.chat-loader-content::after {
    content: "";
    animation: loadingDots 1.5s infinite step-start;
}

.chat-loader-hidden {
    display: none;
}

.chat-message{
  padding: 10px;
  border-radius: 20px;
  background-color: #4F535C;
  margin: 10px;
}
.chat-content-workbench{
    position: relative;
    width: 100%;
    height: 89vh;
}
.chat-content{
    position: relative;
    width: 100%;
    height: 88vh;
}

.chat-content-input{
    position: absolute;
    bottom: 5px;
    width: 100%;
    padding-right:10px;
}
.chat-content-messages{
    padding-bottom: 10px;
    max-height: 83vh;
    overflow-y: auto;
}
.chat-content-messages-workbench{
    padding-bottom: 10px;
    max-height: 83vh;
    overflow-y: auto;
    padding-top:5px;
    padding-right:10px;
}
.chat-content-messages-header{
    display: flex;
    flex-direction: row;
}
.chat-content-message-date{
    align-content: center;
    padding-left: 5px;
    padding-top: 2px;
}

.is-system{
    margin-right: 20px;
}
.is-response{
    margin-left: 20px;
    background-color: #363636;
}
.is-primary-soft{
    background-color: var(--bulma-primary-soft);
    color: var(--bulma-primary-bold);
}
.select2-container--default .select2-selection--multiple .select2-selection__choice
{    --bulma-tag-h: var(--bulma-primary-h);
    --bulma-tag-s: var(--bulma-primary-s);
    --bulma-tag-background-l: var(--bulma-primary-l);
    --bulma-tag-color-l: var(--bulma-primary-invert-l);
    --bulma-tag-background-l-delta: 0%;
    --bulma-tag-hover-background-l-delta: var(--bulma-hover-background-l-delta);
    --bulma-tag-active-background-l-delta: var(--bulma-active-background-l-delta);
    border-radius: var(--bulma-radius) !important;
    color: hsl(var(--bulma-tag-h),var(--bulma-tag-s),var(--bulma-tag-color-l)) !important;
    background-color: hsl(var(--bulma-tag-h),var(--bulma-tag-s),calc(var(--bulma-tag-background-l) + var(--bulma-tag-background-l-delta))) !important;
    margin-top: 5px !important;
    border: none !important;
}
.is-blue-invert{
    background-color: #1B5284;
    color: #DEEDFB;
}
.is-clickable{
    cursor: pointer;
}

.button-group{
    float:right;
    margin-left: auto;
    margin-top: 15px;
    margin-right: 5px;
    margin-bottom: 5px;
}
.button-group-form{
    display: inline;
}
.button-group-update-form{
    position:absolute;
    bottom: 0;
    right: 0;
    padding-bottom: 10px;
    width: 100%;
    float: right;
    padding-right: 10px;
    margin-right: 20px;
    z-index: 100;
    background-color: #1E1E1E;
}
.sticky-button-group {
    position: sticky;
    bottom: 0;
    background-color: #1E1E1E;
}
.button-group-left{
    float:left;
}
.button-group-no-sidebar{
    margin-left: auto;
    padding-top: 15px;
}
.button-group-title{
    margin-bottom: 0px !important;
}
.button-back-color{
    background-color: #363636;
}
.button-back-button-sidebar{
    margin-left: -55px;
    margin-top: 15px;
}
.button-group-back-button{
    margin-right: 5px;
    margin-top: 5px;
}
.button-back-button-icon{
    color: #ACB2BE;
}
.is-button-primary{
    color: var(--bulma-primary);
}
.ck-powered-by{
    display: none !important;
}
.ck-word-count{
    display: none !important;
}
.ck.ck-editor {
  display: flex;
  flex-direction: column-reverse;
}

.menu ul {
    margin-left: 0em !important;
    margin-top: 0em !important;
}

.pagination-ellipsis{
color: black !important;
}
.pagination{
    display: inline-flex;
}
.pagination-list{
    display: inline-flex;
}
.pagination-previous{
order: 0;
}
.pagination-link.is-current{
    background: hsl(171, 100%, 41%);
}
.pagination-link{
    border: none;
}
.pagination-next, .pagination-previous{
    border-width: 1px;
    margin-top: 15px;
    border-color: var(--bulma-text-strong);
}
.pagination-link:hover, .pagination-next:hover, .pagination-previous:hover{
    background-color: #121212;
}

.scroll {
  overflow-x: hidden;
  overflow-y: auto;
  height:100vh;
}
.no-scroll {
  overflow-y: hidden;
}
.fix-position{
  position: fixed;
  top: 75px;
  z-index: 1000;
}
/* used for pagination */
.content li+li{
    margin-top: 0 !important;
}

.editor-card{
    height: 50vh;
}
.ck.ck-content:not(.ck-comment__input *) {
   min-height: 70vh !important;
   max-height: 70vh !important;
   overflow-y: auto !important;
}
.ck.ck-editor{
    border-radius: 3px !important;
    border: #ACB2BE 2px solid !important;
}
.ck.ck-editor__editable_inline{
    border: none !important;
}
.ck-content {
    background: black !important;
}
.ck-content ul {
    list-style-type: disc !important;
    margin-left: 2em !important;
    margin-top: 1em !important;
}

.ck-button{
    color: #ACB2BE !important;
}
.ck-toolbar{
    background-color: #242424 !important;
    border: none !important;
}
.text-right{
    text-align: right !important;
}

.align-right-table{
    justify-content: end !important;
}

.align-center-table{
    vertical-align: middle !important;
}
.dropzone{
    background-color: #1E1E1E;
    border: none;
}
.dz-size{
display:none;
}
.dz-default{
    display:none;
}
.dz-preview{
    background-color: #1E1E1E !important;
}
.dz-image{
    background-color: #1E1E1E !important;
}
::-webkit-calendar-picker-indicator {
    filter: invert(1);
}
.file-name{
    max-width: 100% !important;
    border-color: var(--bulma-primary);
    background-color: var(--bulma-primary);
    color: black;
    overflow: visible;

}
.file-icon{
    color: var(--bulma-primary);
}
.file-label{
    justify-content: center;
    color: var(--bulma-primary);
    width: 100%
}
.file-cta{
    border-color: var(--bulma-primary);
    width: 100%;
}

.loader-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  z-index: -1;
  transition: opacity 0.3s;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 0px;

  .loader {
    height: 80px;
    width: 80px;
  }

  &.is-active {
    opacity: 1;
    z-index: 999;
  }

  &.htmx-request {
    opacity: 1;
    z-index: 999;
  }
}


a.dropdown-item:hover{
    background-color: #363636;
}
a.dropdown-item.is-active{
    background-color: var(--bulma-primary-20);
}
.dropdown-item{
    color: var(--bulma-body-color); 
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    background-color: var(--bulma-primary-20);
}
.navbar-item {
  &.has-dropdown {
    .navbar-dropdown {
      display: none;
    }
    
  }
} 
.dropdown.is-active .dropdown-menu {
  display: inline-table !important;
}

.avatar{
    color: #1E1E1E;
    padding: 2px;
    display: inline-grid;
    justify-content: center;
    align-items: center;
    border-radius:100%;
    width: 35px;
    height: 35px;
    font-weight: 600;
    font-size: small;
    background-color: #a2b9bc;
    border: solid 1px #1E1E1E;
}
.avatar-status{
    padding: 2px;
    display: inline-grid;
    justify-content: center;
    align-items: center;
    border-radius:100%;
    width: 35px;
    height: 35px;
    font-weight: 600;
    font-size: small;
    border: solid 1px #69748c;
    margin-left: 5px;

}
.avatar-badge{
    border-radius:100%;
    width: 20px;
    height: 20px;
    font-weight: 400;
    font-size: smaller;
    justify-content: center;
    align-items: center;
    display: inline-grid;
    position: relative;
    vertical-align: bottom;
    margin-left: -15px;
    color: #1E1E1E;

    border: solid 1px #1E1E1E;

    background-color: var(--bulma-primary);
}
.media-content-header{
    display:flex; 
    flex-direction:row;
    align-items:center;
    margin-top:-5px;
}
.media-content-header-date{
    padding-left:5px;
    padding-right: 5px;
}
.media-content-header-divider{
    border-top:1px solid #363636; 
    flex-grow:1; 
    margin:0; 
    margin-left:5px;
}
.check-divider{
    border-top:1px solid #363636; 
    margin-left:-20px;
    width: calc(100% + 30px); 
    margin-top: 8px;
    margin-bottom: 8px;
}
.file-divider{
    border-top:1px solid #363636; 
    margin-left:-45px;
    width: calc(100% + 55px); 
    margin-top: 8px;
    margin-bottom: 8px;
}
.activity-divider{
    border-top:1px solid #363636; 
    margin-left:-20px;
    width: calc(100% + 30px); 
    margin-top: 8px;
    margin-bottom: 8px;
}
.finding-header{
    padding-right: 5px;
    align-items: center;
}
.finding-divider{
    margin-top: 8px;
    margin-bottom: 8px;
    border-top:1px solid #363636; 
    width: calc(100% + 10px);
    margin-left: -5px;

}

.media+.media{
    border-top: none;
    margin-top: 0;
    padding-top: 0;
}
/* chat css */

* {box-sizing: border-box;}

/* Button used to open the chat form - fixed at the bottom of the page */
.open-button {
  padding:10px 40px;
  background-color: #04AA6D;
  color: white;
  font-size:17px;
  max-width:300px;
  border-radius:20px;
  border: none;
  cursor: pointer;
  position: fixed;
  bottom: 23px;
  right: 28px;
}

/* The popup chat - hidden by default */
.chat-popup {
  display: none;
  position: fixed;
  bottom: 0;
  right: 15px;
  z-index: 9;

}

/* Add styles to the form container */
.form-container {
  max-width: 50vw;
  max-height: 50vh;
  min-width:30vw;

  padding: 10px;
  border-radius:20px;
  background-color: #b5b5b5;
  color:#777;
  overflow-y: auto;
  display: flex;
  flex-direction: column-reverse;
}

.main-content{
    margin-left: 50px;
}
.page-header{
    background-color: #14161A;
    width: 100%;
    height: 55px;    
}
.page-header-title{
    padding-top:5px;
    padding-left: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.page-header-tag{
    margin-right:10px;
    float:right;
}
.organisation-information{
    border-bottom: 1px solid #14161A;
    padding-top: 10px;
    padding-left: 15px;
    padding-bottom: 10px;
}

.side-information{
    border-right: 1px solid #14161A;
    height:100vh;
}
.side-information-content{
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: 15px;
    border-top: 1px solid #4F535C;
}
.created-item-list:nth-child(n+2){
    padding-top: 10px;
}
.divider-inner:nth-child(n+2){
    border-top: 1px solid #4F535C;

}

.center{
    margin-left: auto;
}

.main-information-header{
    width: 100%;
    border-bottom: 1px solid #14161A;
    height: 55px;
}
.tabs-header{
    width:fit-content;
    margin-left: auto;
}
.tabs-content{
    margin: 10px;
    height: 90vh;
    overflow-y:auto;
    clear:both;
}
/* title header css */
.title-header{
    width: calc(100% - 50px);
    margin-left: 50px;
    padding-left: 10px;
    display:flex;
    background-color: #1E1E1E;
    z-index: 99;
    height:65px;

}
.title-header-sidebar-open{
}
.title-header-box{
    display: flex;


}
.title-header-box-no-sidebar{
 position:inherit;
 padding-left: 0;
 width: auto !important;
 margin-left: 0;


}
.title-header-box-no-sidebar-flex{
    display: flex;
    flex-direction: column;
}
.title-header-box-no-sidebar-title{
    display: flex;
    flex-direction: row;
}
.title-header-title{
    align-self:end; 
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.title-header-title-info{
    overflow:hidden;
    text-overflow: ellipsis;
    max-width: 50vw;
    white-space:nowrap;

}
.title-header-topic{
    align-self:end;
    margin-left: 10px;
}
.title-header-tag{
    margin-top: 7px;
    margin-left: 10px;
    background-color: #ACB2BE;
    color: #1E1E1E;
}
.tag-is-grey{
    background-color: #ACB2BE;
    color: #1E1E1E;
}
.tags-input .tag{
    background-color: var(--bulma-primary-soft);
    color: var(--bulma-primary-bold);
}
.tags-input{
    border-color: hsl(var(--bulma-input-h),var(--bulma-input-s),calc(var(--bulma-input-border-l) + var(--bulma-input-border-l-delta)));
    background-color: #14161A;
}
.select2-container--default .select2-selection--multiple {
    border-color: hsl(var(--bulma-input-h),var(--bulma-input-s),calc(var(--bulma-input-border-l) + var(--bulma-input-border-l-delta))) !important;
    background-color: #14161A !important;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{
    color:#0A0A0A !important;
}
.select2-container--default .select2-search--inline .select2-search__field{
    color:hsl(var(--bulma-input-h),var(--bulma-input-s),var(--bulma-input-color-l)) !important;
}

.content h3:not(:first-child){
    margin-top: 20px !important;
    padding-bottom: 2px !important;
}

.content-form-container{
    margin-bottom: 60px;
}

.article-approval{
    border: 2px solid;
    --bulma-message-border-style: unset;
}
.article-links{
    position: relative;
    float:right;
    margin-top: -5px;
    color:var(--bulma-body-color);
}

/* chart box css */
.chart-box-canvas-container{
    text-align:center;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
}
.chart-box-dma{
    text-align:center;
    width: 100%;
}
.chart-box-canvas{
    display: inline !important;
}
.chart-box-button-group{
    float: right;
    margin-top: -3px;
    margin-right: -10px;
}
.chart-box-button{
    align-content: center;
    margin: auto;
    width: 100%;
    text-align:center;
}
.chart-box-summary{
    float: left;
    margin-top: 75px;
    padding-right: 20px;
}
/* bulma 2 select 2 */
.select2-container {
   min-width: 22em !important;
   width: 100% !important;


  .select2-selection--single {
    height: 40px !important;
    padding-top: 7px;
    padding-bottom: 7px;
    border: 1px solid black !important;
    background-color: hsl(221, 14%,calc(9% + 0%)) !important;

    .select2-selection__arrow{
      border: .125em solid var(--bulma-link);
      inset-inline-end: 1.125em;
        z-index: 4;
        right: 15px !important;

        border-right: 0;
        border-top: 0;
        content: " ";
        display: block;
        height: .625em !important;
        margin-top: -.4375em;
        pointer-events: none;
        position: absolute !important;
        top: 50% !important;
        transform: rotate(315deg);
        transform-origin: center;
        transition-duration: var(--bulma-duration);
        transition-property: border-color;
        width: .625em !important;
    }
    .select2-selection__arrow b{
    display:none;
    }

    .select2-selection__placeholder {
      color: #dbdbdb !important;
    }

    .select2-selection__rendered {
       margin-left: 0.2em;
    }

    .select2-selection__clear{
        margin-right: 40px !important;
    }
  }

  .select2-dropdown {
    border: 1px solid black !important;
    border-top: 0 !important;
    background-color: hsl(221, 14%,calc(9% + 0%)) !important;
    .select2-search {
      margin: 5px;

      .select2-search__field {
        padding: 10px !important;
        border-radius: 3px !important;
        font-size: 1rem;
        height: 2.25em;
        box-shadow: inset 0 1px 2px rgba(10,10,10,.1);
        max-width: 100%;
        width: 100%;
        border-radius: 3px !important;
        background-color: hsl(221, 14%,calc(9% + 0%)) !important;
        color: #dbdbdb !important;
      }
    }


    .select2-results__options {
      max-height: 200px !important;

      .select2-results__option {
        padding: 0.37em 0.75em !important;
        font-size: 1rem;

      }
    }
  }
}
.select2-container--default .select2-selection .select2-selection__rendered{
    color: white !important;
    margin-inline-start: 0px;
}
.select2-container--default .select2-results__option[aria-selected="true"]{
    background-color: #363636 !important;
}

.emphasize{
    font-style: italic;
}

.signup-agree{
    padding-bottom: 10px;
}

.signup-agree a {
    text-decoration: underline;
}

.input-selected{
    color: var(--bulma-primary);
}

textarea.scaling-vertical {
    min-height: 60px;
    overflow:hidden;
    resize: none;
    word-wrap:break-word;
    max-height: none !important;
}
.scaling-vertical {
    height: 100%;
}

.scrolling-vertical {
    overflow-y: auto; 
    height: 100%;
}

.auth-select-method {
    margin-bottom: 10px;
}
.auth-page-title {
    margin-top: 15px;
}

.editable:hover {
    cursor: pointer;
}
.editable-text:hover {
    cursor: pointer;
    text-decoration: underline;
}

.phase-nav-wrapper {
    margin: 0;
}

.phase-children {
    margin-left: 0;
    display: block;
    transition: max-height 0.3s ease-out;
}

.phase-nav-item {
    padding: 5px;
    display: flex;
    cursor: pointer;
    font-size: 0.9em;
    margin: 0;
}

.procedure-row {
    display: flex;
    padding: 5px 0;
    align-items: center;
    margin-left: 5px;
    border-bottom: 1px solid #353a46;
}

/* Hide number input spinner arrows */
.no-spinner input[type=number]::-webkit-outer-spin-button,
.no-spinner input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.no-spinner input[type=number] {
    -moz-appearance: textfield;
}


/* Stacked Progress Bar Styles */
.progress-container {
    position: relative;
    overflow: hidden;
    border-radius: 5px;
}

.progress-container > div {
    transition: width 0.3s ease;
    height: 100%;
    float: left;
}


.phase-item {
    padding: 10px 0;
    border-bottom: 1px solid #363636;
}

.phase-item:last-child {
    border-bottom: none;
}

/* Status colors for progress bars */
.progress-completed {
    background-color: var(--bulma-primary-00);
}

.progress-waiting-for-review {
    background-color: #FFB70F;
}

.progress-in-progress {
    background-color: #75B7F4;
}

.progress-assigned {
    background-color: #BF086C;
}

.progress-unassigned {
    background-color: #4F535C;
}

/* Legend styles */
.progress-legend {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 10px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 5px;
}

.legend-color {
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

.legend-text {
    font-size: 12px;
    color: #ACB2BE;
}