/* You can add global styles to this file, and also import other style files */
@import "../node_modules/primeng/resources/primeng.min.css";
@import "../node_modules/primeflex/primeflex.scss";
@import "../node_modules/primeicons/primeicons.css";
@import "../node_modules/prismjs/themes/prism-coy.css";
@import "./demo/flags/flags.css";
@import "./demo/documentation.scss";
@import "./sass/layout/_variables";
@import "./sass/layout/_layout";
@import "./sass/overrides/_overrides";

.deleted{
    opacity: 0.7 !important
}
.remaining{
    background: rgba(252, 167, 84, 0.86);

}

:host ::ng-deep .ui-tree.my-tree {
    width: 100%;
}

:host ::ng-deep .ui-tree-select.my-tree-select {
    width: 100%;
}

.a-toolbar-button{
    margin-right:10px !important;
}




.dot-color0{
    background-color: var(--bluegray-500); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}

.dot-color1{
    background-color: var(--purple-300); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color2{
    background-color: var(--purple-600); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color3{
    background-color: var(--purple-800); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}



.dot-color4{
    background-color: var(--pink-300); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color5{
    background-color: var(--pink-500); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color6{
    background-color: var(--pink-600); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}



.dot-color7{
    background-color: var(--blue-800); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color8{
    background-color: var(--blue-500); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color9{
    background-color: var(--blue-300); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}



.dot-color10{
    background-color: var(--green-800); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}

.dot-color11{
    background-color: var(--green-600); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color12{
    background-color: var(--green-300); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}



.dot-color13{
    background-color: var(--yellow-200); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color14{
    background-color: var(  --yellow-400); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
.dot-color15{
    background-color: var(--yellow-600); border-radius: 50%;display: inline-block;height: 15px;width: 15px;
}
