html {
    --is-ltr: unset;
    --is-rtl: disabled;
}

html[dir=rtl] {
    --is-ltr: disabled;
    --is-rtl: unset;
}

/*html, body {
	height: 96.94%;
	margin: 0;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}*/

@media screen and (max-width: 768px) {
    .container-preload{
        zoom: 65%;
    }
}

.notifications {
    overflow-y: scroll;
    height: 410px;
}

.preloader {
    position: fixed;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 100000;
    flex-direction: column;
}

[data-bs-theme=light] .preloader {
    background: white;
}

.progress {
    width: 200px;
}

.navbar-brand {
    margin-left: var(--is-rtl, var(--bs-navbar-brand-margin-end));
    margin-right: var(--is-rtl, 0);
    margin-right: var(--is-ltr, var(--bs-navbar-brand-margin-end));
}

.navbar-center, .navbar-end {
    margin-left: var(--is-ltr, auto) !important;
    margin-right: var(--is-rtl, auto) !important;
}

.rpl-fc > .ql-container.ql-snow {
    height: 100px;
}

.rpl-fc {
    width: 100%;
}

[dir=rtl] .form-select {
    padding: .375rem .75rem .375rem 2.25rem;
    background-position: left .75rem center;
}

.lang-flag {
    height: 20px;
    width: 30px;
    margin: 0px 5px 0px 5px;
}

.db-sts {
    font-size: 100px;
    opacity: .25;
}

.sidebar {
    top: 58px;
    bottom: 0;
    left: var(--is-ltr, 0) !important;
    right: var(--is-rtl, 0) !important;
    position: fixed;
    background: var(--bs-secondary-bg-subtle);
}

.sidebar-md {
    width: 250px;
}

.sidebar-sm {
    width: 50px;
}

.sidebar, .sidecontent {
    transition: margin-inline-start .3s ease-in-out,width .3s ease-in-out;
}

.sidecontent-md {
    margin-left: var(--is-ltr, 265px);
    margin-right: var(--is-rtl, 265px);
}

.sidecontent-sm {
    margin-left: var(--is-ltr, 65px);
    margin-right: var(--is-rtl, 65px);
}

input[type="email"], input[type="password"], input[type="number"] {
    direction: ltr;
}

input::placeholder {
    text-align: var(--is-rtl, right);
}

.hr-position-1, .hr-position-2, .vr-position-1, .vr-position-2 {
    position: absolute;
    margin: 0;
    border: 0;
    padding: 0;
    display: none;
}

.hr-position-1, .hr-position-2 {
    top: 0px;
    width: 100000px;
    border-top: 1px dashed var(--bs-red);
}

.vr-position-1, .vr-position-2 {
    left: 0px;
    height: 100000px;
    border-left: 1px dashed var(--bs-red);
}

.flash-msg {
    position: fixed;
    bottom: 30px;
    left: var(--is-ltr, 50px);
    right: var(--is-rtl, 50px);
}

.btn-fullscreen {
    --bs-btn-fullscreen-color: #000;
    --bs-btn-fullscreen-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M5.828 10.172a.5.5 0 0 0-.707 0l-4.096 4.096V11.5a.5.5 0 0 0-1 0v3.975a.5.5 0 0 0 .5.5H4.5a.5.5 0 0 0 0-1H1.732l4.096-4.096a.5.5 0 0 0 0-.707m4.344 0a.5.5 0 0 1 .707 0l4.096 4.096V11.5a.5.5 0 1 1 1 0v3.975a.5.5 0 0 1-.5.5H11.5a.5.5 0 0 1 0-1h2.768l-4.096-4.096a.5.5 0 0 1 0-.707m0-4.344a.5.5 0 0 0 .707 0l4.096-4.096V4.5a.5.5 0 1 0 1 0V.525a.5.5 0 0 0-.5-.5H11.5a.5.5 0 0 0 0 1h2.768l-4.096 4.096a.5.5 0 0 0 0 .707m-4.344 0a.5.5 0 0 1-.707 0L1.025 1.732V4.5a.5.5 0 0 1-1 0V.525a.5.5 0 0 1 .5-.5H4.5a.5.5 0 0 1 0 1H1.732l4.096 4.096a.5.5 0 0 1 0 .707'/%3e%3c/svg%3e");
    --bs-btn-fullscreen-opacity: 0.5;
    --bs-btn-fullscreen-hover-opacity: 0.75;
    --bs-btn-fullscreen-focus-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-btn-fullscreen-focus-opacity: 1;
    --bs-btn-fullscreen-disabled-opacity: 0.25;
    --bs-btn-fullscreen-white-filter: invert(1) grayscale(100%) brightness(200%);
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .25em .25em;
    color: var(--bs-btn-fullscreen-color);
    background: transparent var(--bs-btn-fullscreen-bg) center/1em auto no-repeat;
    border: 0;
    border-radius: .375rem;
    opacity: var(--bs-btn-fullscreen-opacity);
}

.btn-fullscreen:hover, .btn-fullscreen-exit:hover {
    opacity: 1;
}

.btn-fullscreen-exit {
    --bs-btn-fullscreenexit-color: #000;
    --bs-btn-fullscreenexit-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M5.5 0a.5.5 0 0 1 .5.5v4A1.5 1.5 0 0 1 4.5 6h-4a.5.5 0 0 1 0-1h4a.5.5 0 0 0 .5-.5v-4a.5.5 0 0 1 .5-.5m5 0a.5.5 0 0 1 .5.5v4a.5.5 0 0 0 .5.5h4a.5.5 0 0 1 0 1h-4A1.5 1.5 0 0 1 10 4.5v-4a.5.5 0 0 1 .5-.5M0 10.5a.5.5 0 0 1 .5-.5h4A1.5 1.5 0 0 1 6 11.5v4a.5.5 0 0 1-1 0v-4a.5.5 0 0 0-.5-.5h-4a.5.5 0 0 1-.5-.5m10 1a1.5 1.5 0 0 1 1.5-1.5h4a.5.5 0 0 1 0 1h-4a.5.5 0 0 0-.5.5v4a.5.5 0 0 1-1 0z'/%3e%3c/svg%3e");
    --bs-btn-fullscreenexit-opacity: 0.5;
    --bs-btn-fullscreenexit-hover-opacity: 0.75;
    --bs-btn-fullscreenexit-focus-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-btn-fullscreenexit-focus-opacity: 1;
    --bs-btn-fullscreenexit-disabled-opacity: 0.25;
    --bs-btn-fullscreenexit-white-filter: invert(1) grayscale(100%) brightness(200%);
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .25em .25em;
    color: var(--bs-btn-fullscreenexit-color);
    background: transparent var(--bs-btn-fullscreenexit-bg) center/1em auto no-repeat;
    border: 0;
    border-radius: .375rem;
    opacity: var(--bs-btn-fullscreenexit-opacity);
}

.dropdown-menu.show {
    z-index: 100000;
    white-space: nowrap;
}

.list-group {
    padding-right: 0;
}

.tm-mode {
    display: none;
}

.ui-datepicker {
    z-index: 100001 !important;
}

.flash-msg .alert-primary::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background: var(--bs-primary);
    animation: anim 30s linear forwards;
}

.flash-msg .alert-success::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background: var(--bs-success);
    animation: anim 5s linear forwards;
}

.flash-msg .alert-danger::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background: var(--bs-danger);
    animation: anim 5s linear forwards;
}

.flash-msg .alert-warning::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background: var(--bs-warning);
    animation: anim 5s linear forwards;
}

.toast-notification {
    --bs-toast-zindex: 1090;
    --bs-toast-padding-x: 0.75rem;
    --bs-toast-padding-y: 0.5rem;
    --bs-alert-padding-x: 0;
    --bs-alert-padding-y: 0;
    --bs-toast-spacing: 1.5rem;
    --bs-toast-max-width: 350px;
    --bs-toast-font-size: 0.875rem;
    --bs-toast-color: ;
    --bs-toast-bg: rgba(var(--bs-body-bg-rgb), 0.85);
    --bs-toast-border-width: var(--bs-border-width);
    --bs-toast-border-color: var(--bs-border-color-translucent);
    --bs-toast-border-radius: var(--bs-border-radius);
    --bs-toast-box-shadow: var(--bs-box-shadow);
    --bs-toast-header-color: var(--bs-secondary-color);
    --bs-toast-header-bg: rgba(var(--bs-body-bg-rgb), 0.85);
    --bs-toast-header-border-color: var(--bs-border-color-translucent);
    width: var(--bs-toast-max-width);
    max-width: 100%;
    font-size: var(--bs-toast-font-size);
    color: var(--bs-toast-color);
    pointer-events: auto;
    background-color: var(--bs-toast-bg);
    background-clip: padding-box;
    border: var(--bs-toast-border-width) solid var(--bs-toast-border-color);
    box-shadow: var(--bs-toast-box-shadow);
    border-radius: var(--bs-toast-border-radius);
    transform:translateX(-100%);
    animation: moveRight 0.5s linear forwards;
}

@keyframes moveRight {
    100% {
        transform:translateX(0%);
    }
}

@keyframes anim {
    100% {
        width: 0;
    }
}

.btn-close-profile {
    margin: 0 !important;
}

#contextMenu, #contextMenuArea {
    position: absolute;
    display: none;
}

.left-panel {
    width: 100px;
    background: #e1e1e1;
    height: 100%;
    padding-bottom: 20px;
    text-align: center;
}

.top-panel {
    background: #e1e1e1;
}

.left-panel .drag-object {
    height: 100px;
    border-bottom: 1px solid #82828250;
}

/*.top-panel*/ .drag-object {
    height: 40px;
    /*border-right: 1px solid #82828250;
    border-left: 1px solid #82828250;
    border-bottom: 1px solid #82828250;*/
    margin-left: 15px;
    margin-right: 15px;
}

/*.drag-object:hover {
    background: rgba(128, 128, 128, 0.2);
}*/

.drag-object > img {
    width: 40px;
    height: 40px;
    /*margin: 10px;*/
    padding: 0px;
    position: relative !important;
    border: 0 !important;
    transition: 0.3s;
}

.drag-object > img:hover {
    height: 70px;
    width: 70px;
    z-index: 100000;
}

.left-panel > hr {
    border-top: 1px solid #828282;
}

.sma-o {
    display: flex;
    align-items: center;
}

.rabbit-signals {
    text-align: center;
    border-top: 1px solid #82828250;
    border-bottom: 1px solid #82828250;
    padding: 0px;
    bottom: 10px;
    width: 100%;
    /*position: absolute;*/
}

.a-workspace {
    margin-right: 75px;
    padding: 50px;
    border-radius: 50px;
    /*border: 1px solid #dcdcdc;*/
    height: 100%;
   /* background-color: #dcdcdc;*/
   text-decoration: none;
}

.area {
    padding: 15px;
    border-radius: 10px;
}

.area-name {
    position: absolute;
    /*left: 15px;*/
    right: var(--is-rtl, 15px);
    top: -15px;
    background: var(--bs-body-bg);
    width: fit-content;
}

.area-body {
    position: relative;
    width: 100%;
    height: 100%;
}

.create-area {
    /*position: absolute;*/
    width: 300px;
    height: 300px;
    --bs-bg-opacity: 0.5;
    background: rgba(var(--bs-primary-rgb),var(--bs-bg-opacity)) !important;
    -moz-box-shadow: 0 0 .5em rgba(var(--bs-primary-rgb), .8);
    -webkit-box-shadow: 0 0 .5em rgba(var(--bs-primary-rgb), .8);
    box-shadow: 0 0 .5em rgba(var(--bs-primary-rgb), .8);
}

.create-cage {
    /*position: absolute;*/
    width: 130px;
    height: 130px;
    background: rgba(65, 169, 74, 0.7) !important;
    -moz-box-shadow: 0 0 .5em rgba(65, 169, 74, .8);
    -webkit-box-shadow: 0 0 .5em rgba(65, 169, 74, .8);
    box-shadow: 0 0 .5em rgba(65, 169, 74, .8);
    z-index: 9999;
}
.a-workspace:hover {
    background: rgba(200, 221, 255, .33) !important;
    -moz-box-shadow: 0 0 .5em rgba(0, 176, 240, .8);
    -webkit-box-shadow: 0 0 .5em rgba(0, 176, 240, .8);
    box-shadow: 0 0 .5em rgba(0, 176, 240, .8);
    text-decoration: none;
}

.trash {
    position: fixed;
    width: 100px;
    height: 100px;
    bottom: 20px;
    display: none;
    left: 50%;
    padding: 10px;
    z-index: 9999;
}

.ws {
    min-height: 100000px;
    max-height: 100000px;
    min-width: 100000px;
    max-width: 100000px;
    position: relative;
    /*overflow: auto;*/
}

.tl-top {
    height: 10px;
    height: 10px;
    width: 215px;
    margin-top: -7px;
    cursor: move;
    background: var(--bs-secondary-bg-subtle);
}

.tl-drag {
    opacity: 0.5;
}

.tl-drag:hover {
    opacity: 1;
}

.dropdown-item {
    text-align: start;
}

.sob {
    text-align: start;
    border: 0;
    background: transparent;
}

.search-cages-rs {
    display: none;
    height: 130px;
    margin: 15px;
    position: relative !important;
}

.search-results {
    display: none;
    width: 100%;
}

.mating-syringe {
    position: absolute;
    left: 10px;
    bottom: 10px;
    color: var(--bs-danger-text-emphasis);
}

.gotobtn {
    position: fixed;
    z-index: 9999;
    background: var(--bs-black);
    opacity: 0;
    font-size: 35px;
    color: var(--bs-white);
}

.gotoright {
    right: 0px;
    width: 50px;
    height: 100%;
    margin-top: 50px;
}

.gotoleft {
    left: 0px;
    width: 50px;
    height: 100%;
    margin-top: 50px;
}

.gototop {
    top: 58px;
    height: 50px;
    width: 100%;
}

.gotobottom {
    bottom: 0px;
    height: 50px;
    width: 100%;
}

.r-sn-cl {
    font-size: 25px;
    margin-inline-end: 15px;
}

.img-theme {
    width: 92px;
    cursor: pointer;
    outline: 1px solid var(--bs-gray-600);
    border-radius: 10px;
    margin-bottom: 15px;
}

.img-number {
    width: 92px;
    cursor: pointer;
    outline: 1px solid var(--bs-gray-600);
    border-radius: 10px;
    margin-bottom: 15px;
}

.vr-border {
    border-left: 1px solid rgba(255, 255, 255, .25);
    border-right: 1px solid rgba(255, 255, 255, .25);
}

.hiddenradio [type=radio] + img {
    outline: 1px solid var(--bs-gray-600);
}

.hiddenradio [type=radio] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.hiddenradio [type=radio]:checked + img {
    outline: 5px solid #86b7fe;
}

.test-date {
    display: none;
    padding-left: 15px;
}

.bg-test {
    background-image: repeating-linear-gradient(45deg, #ffc1070d, #ffc1070d 20px, #00000014 0px, #00000014 40px);
}

@keyframes jump-shaking {
    0% { transform: translateX(0) }
    25% { transform: translateY(-3px) }
    35% { transform: translateY(-3px) rotate(2deg) }
    55% { transform: translateY(-3px) rotate(-2deg) }
    65% { transform: translateY(-3px) rotate(2deg) }
    75% { transform: translateY(-3px) rotate(-2deg) }
    100% { transform: translateY(0) rotate(0) }
}

@keyframes danger {
    50% { box-shadow: var(--bs-danger-border-subtle) 0px 0px 1.5em; }
}

@keyframes diagnostic {
    50% { box-shadow: var(--bs-yellow) 0px 0px 1.5em; }
}

@keyframes pregnant {
    50% { box-shadow: var(--bs-green) 0px 0px 1.5em; }
}

@keyframes pregnantdark {
    50% { box-shadow: var(--bs-teal) 0px 0px 1.5em; }
}

@keyframes birth {
    50% { box-shadow: var(--bs-blue) 0px 0px 1.5em; }
}

.dropdown-menu-navbar {
    transform: translate(0px, 10px);
}

.bad-drp{
    background: rgba(241, 53, 69, 0.5) !important;
    box-shadow: 0 0 .5em rgba(241, 53, 69, .5);
    border-color: rgba(241, 53, 69, 0.5) !important;
}

.cage {
    width: 130px;
    max-height: 130px;
    max-width: 130px;
    position: absolute;
    border-left: 1px;
    border-top: 7px;
    border-right: 1px;
    border-bottom: 1px;
    border-style: solid;
    border-color: darkgray;
}

.cage-header {
    background-size: 5px 5px;
    height: 35px;
    background-image: linear-gradient(to right, rgb(169, 169, 169, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(169, 169, 169, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(169, 169, 169, 50%);
}

.cage-body {
    height: 87px;
    overflow: unset;
}

.workspace.ui-droppable-active {
    background: rgba(221, 220, 220, .2) !important;
    -moz-box-shadow: 0 0 .5em rgba(221, 220, 220, .2);
    -webkit-box-shadow: 0 0 .5em rgba(221, 220, 220, .2);
    box-shadow: 0 0 .5em rgba(221, 220, 220, .2);
}

.workspace.ui-droppable-hover {
    background: rgba(221, 220, 220, .5) !important;
    -moz-box-shadow: 0 0 .5em rgba(221, 220, 220, .5);
    -webkit-box-shadow: 0 0 .5em rgba(221, 220, 220, .5);
    box-shadow: 0 0 .5em rgba(221, 220, 220, .5);
}

.area-body.ui-droppable-active {
    background: rgba(0, 176, 240, .2) !important;
    -moz-box-shadow: 0 0 .5em rgba(0, 176, 240, .2);
    -webkit-box-shadow: 0 0 .5em rgba(0, 176, 240, .2);
    box-shadow: 0 0 .5em rgba(0, 176, 240, .2);
    border: 1px solid rgba(0, 176, 240);
}

.area-body.ui-droppable-hover {
    background: rgba(0, 176, 240, .5) !important;
    -moz-box-shadow: 0 0 .5em rgba(0, 176, 240, .5);
    -webkit-box-shadow: 0 0 .5em rgba(0, 176, 240, .5);
    box-shadow: 0 0 .5em rgba(0, 176, 240, .5);
    border: 1px solid rgba(0, 176, 240);
}

.cage.ui-droppable-active {
    background: rgba(0, 176, 240, .2) !important;
    -moz-box-shadow: 0 0 .5em rgba(0, 176, 240, .2);
    -webkit-box-shadow: 0 0 .5em rgba(0, 176, 240, .2);
    box-shadow: 0 0 .5em rgba(0, 176, 240, .2);
}

.cage.ui-droppable-hover {
    background: rgba(0, 176, 240, .5) !important;
    -moz-box-shadow: 0 0 .5em rgba(0, 176, 240, .5);
    -webkit-box-shadow: 0 0 .5em rgba(0, 176, 240, .5);
    box-shadow: 0 0 .5em rgba(0, 176, 240, .5);
}

.cage-mating {
    background: rgba(248, 107, 236, 0.5) !important;
    box-shadow: 0 0 .5em rgba(248, 107, 236, .5);
    border-color: rgba(248, 107, 236, 0.5) !important;
}

.cage-bad {
    background: rgba(241, 53, 69, 0.5) !important;
    box-shadow: 0 0 .5em rgba(241, 53, 69, .5);
    border-color: rgba(241, 53, 69, 0.5) !important;
}

.cage-empty {
    border-color: var(--bs-red);
}

.cage-empty > .cage-header {
    background-image: linear-gradient(to right, rgb(220, 53, 69, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(220, 53, 69, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(220, 53, 69, 50%);
}

.cage-empty > .cage-header > .cage-number {
    background: var(--bs-red);
    border-color: var(--bs-red);
}

.cage-diagnostic {
    border-color: var(--bs-yellow);
}

.cage-diagnostic > .cage-header {
    background-image: linear-gradient(to right, rgb(255, 193, 7, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(255, 193, 7, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(255, 193, 7, 50%);
}

.cage-diagnostic > .cage-header > .cage-number {
    background: var(--bs-yellow);
    border-color: var(--bs-yellow);
}

.cage-diagnostic > .cage-header > .mating-days {
    color: var(--bs-yellow);
}

.cage-diagnostic-alert {
    border-color: var(--bs-yellow);
    animation: diagnostic 0.83s infinite;
}

.cage-pregnant {
    border-color: var(--bs-green);
}

.cage-pregnant > .cage-header {
    background-image: linear-gradient(to right, rgb(25, 135, 84, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(25, 135, 84, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(25, 135, 84, 50%);
}

.cage-pregnant > .cage-header > .cage-number {
    background: var(--bs-green);
    border-color: var(--bs-green);
}

.cage-pregnant > .cage-header > .mating-days {
    color: var(--bs-green);
}

.cage-pregnant-alert {
    border-color: var(--bs-green);
    animation: pregnant 0.83s infinite;
}

.cage-birth {
    border-color: var(--bs-blue);
}

.cage-birth-alert {
    border-color: var(--bs-blue);
    animation: birth 0.83s infinite;
}

.cage-birth > .cage-header {
    background-image: linear-gradient(to right, rgb(13, 110, 253, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(13, 110, 253, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(13, 110, 253, 50%);
}

.cage-birth > .cage-header > .cage-number {
    background: var(--bs-blue);
    border-color: var(--bs-blue);
}

.cage-birth > .cage-header > .mating-days {
    color: var(--bs-blue);
}

.cage-ready {
    border-color: var(--bs-purple);
}

.cage-ready > .cage-header {
    background-image: linear-gradient(to right, rgb(111, 66, 193, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(111, 66, 193, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(111, 66, 193, 50%);
}

.cage-ready > .cage-header > .cage-number {
    background: var(--bs-purple);
    border-color: var(--bs-purple);
}

.cage-rest {
    border-color: var(--bs-cyan);
}

.cage-rest > .cage-header {
    background-image: linear-gradient(to right, rgb(110, 223, 246, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(110, 223, 246, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(110, 223, 246, 50%);
}

.cage-rest > .cage-header > .cage-number {
    background: var(--bs-cyan);
    border-color: var(--bs-cyan);
}

.cage-rest > .cage-header > .mating-days {
    color: var(--bs-cyan);
}

.cage-weaned {
    border-color: #55f46d;
}

.cage-weaned > .cage-header {
    background-image: linear-gradient(to right, rgb(85, 244, 109, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(85, 244, 109, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(85, 244, 109, 50%);
}

.cage-weaned > .cage-header > .cage-number {
    background: #55f46d;
    border-color: #55f46d;
}

.cage-sterile {
    border-color: var(--bs-black);
}

.cage-sterile > .cage-header {
    background-image: linear-gradient(to right, rgb(0, 0, 0, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(0, 0, 0, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(0, 0, 0, 50%);
}

.cage-sterile > .cage-header > .cage-number {
    background: var(--bs-black);
    border-color: var(--bs-black);
    color: var(--bs-white);
}

.cage-danger {
    border-color: var(--bs-danger-border-subtle);
    animation: danger 0.83s infinite;
}

.cage-danger > .cage-header {
    background-image: linear-gradient(to right, rgb(109, 31, 39, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(109, 31, 39, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(109, 31, 39, 50%);
}

.cage-danger > .cage-header > .cage-number {
    background: var(--bs-danger-border-subtle);
    border-color: var(--bs-danger-border-subtle);
    color: var(--bs-white);
}

.cage-number {
    background: rgb(169,169,169, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: var(--bs-black);
    width: 40px;
    height: 40px;
    border-radius: 100%;
    border: 1px solid rgb(169, 169, 169, 0.5);
    overflow: hidden;
    text-overflow: ellipsis;
}

.cage-selected {
    box-shadow: var(--bs-blue) 0px 0px 0px 5px;
}

.animal-number {
    cursor: pointer !important;
    padding: 0px 5px 0px 5px;
    width: fit-content;
    color: white;
    text-align: center;
    font-weight: bold;
}

.a-m-m-btn, .a-m-f-btn, .a-m-btn {
    display: none;
    padding: 7px 10px;
}

.dropdown-item > i {
    margin-inline-end: 7px;
}

.drag-old-animal {
    margin: 10px 5px 10px 5px;
}

.img-animal {
    height: 50px;
}

.img-animal-baby {
    height: 25px;
}

.div-animal-baby {
    margin: 0px !important;
}

/*.pi-iep {
    display: none;
}*/

.no-cages-detect {
    font-size: 80px;
    color: #000;
    text-align: center;
    display: flex;
    opacity: 0.2;
    height: 100%;
}

.cage-name:hover, .cage-name:focus, .area-name:hover, .area-name:focus {
    opacity: 1;
}

.drag-new-animal, .drag-old-animal, .drag-new-cage, .drag-new-area {
    cursor: grab !important;
}

.notifications-panel {
    position: absolute;
    width: 380px;
    height: 92%;
    top: 58px;
    left: var(--is-ltr, 0) !important;
    right: var(--is-rtl, 0) !important;
    background: #e1e1e1;
    display: none;
    overflow-y: auto;
    padding: 15px;
}

.table > thead, .table > tbody {
    vertical-align: middle;
    text-align: center;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.circle-btn {
    border-radius: 100%;
    position: relative;
    margin: 0px 5px 0px 5px;
    width: 38px;
    height: 38px;
    padding: 0;
}

*[data-href] {
    cursor: pointer;
}

.img-circle {
    width: 80px;
    border-radius: 50%;
}

.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
    background-color: rgb(13, 110, 253, 0.3);
    border-color: rgb(13, 110, 253, 0.3);
}

.user-login::after, .drag-options::after, .hlp::after, .ntf::after {
    display: none !important;
}

.input-container {
    position: relative;
}
  
.input-container > label {
    position: absolute;
    padding: .375rem .75rem;
}
  
.input-container > input {
    padding-inline-start: 40px;
}

button > i {
    /*margin-inline-end: 5px;*/
}

.history-id {
    display: none;
}

.tr-selected {
    --bs-table-bg: rgb(13, 110, 253, 0.3) !important;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

[data-bs-theme=dark] body {
    background: var(--bs-secondary-bg-subtle);
}

[data-bs-theme=dark] .preloader {
    background: var(--bs-secondary-bg-subtle);
}

[data-bs-theme=dark] .btn-fullscreen {
    filter: var(--bs-btn-fullscreen-white-filter);
}

[data-bs-theme=dark] .btn-fullscreen-exit {
    filter: var(--bs-btn-fullscreenexit-white-filter);
}

[data-bs-theme=dark] .ui-datepicker {
    background: #121212;
    color: white;
}

[data-bs-theme=dark] .ui-widget.ui-widget-content {
    border: 1px solid #495057;
}

[data-bs-theme=dark] .ui-datepicker .ui-datepicker-header {
    background: #161719;
    color: white;
    border: 1px solid #495057;
}

[data-bs-theme=dark] .ui-state-hover {
    background: #212529;
    border: 1px solid #495057;
}

[data-bs-theme=dark] .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 1px solid #495057;
    background: var(--bs-body-bg);
    text-align: center;
    color: var(--bs-white);
}

[data-bs-theme=dark] .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
    border: 1px solid #003eff;
    background: #007fff;
}

[data-bs-theme=dark] .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    border: 1px solid #dad55e;
    background: #fffa90;
    color: #777620;
}

[data-bs-theme=dark] .left-panel, /*.top-panel,*/ .notifications-panel {
    background-color: var(--bs-dark-bg-subtle);
}

[data-bs-theme=dark] .navbar, .login-card {
    background-color: var(--bs-secondary-bg-subtle);
}

[data-bs-theme=dark] .left-panel .drag-object {
    border-bottom: 1px solid var(--bs-tertiary-bg);
}

[data-bs-theme=dark] /*.top-panel*/ .drag-object {
    /*border-right: 1px solid var(--bs-tertiary-bg);
    border-left: 1px solid var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-tertiary-bg);*/
}

[data-bs-theme=dark] .rabbit-signals {
    border-top: 1px solid var(--bs-tertiary-bg);
    border-bottom: 1px solid var(--bs-tertiary-bg);
}

[data-bs-theme=dark] .workspace.ui-droppable-active {
    background: rgba(61, 61, 61, 0.2) !important;
    -moz-box-shadow: 0 0 .5em rgba(61, 61, 61, .2);
    -webkit-box-shadow: 0 0 .5em rgba(61, 61, 61, .2);
    box-shadow: 0 0 .5em rgba(61, 61, 61, .2);
}

[data-bs-theme=dark] .workspace.ui-droppable-hover {
    background: rgba(61, 61, 61, 0.5) !important;
    -moz-box-shadow: 0 0 .5em rgba(61, 61, 61, .5);
    -webkit-box-shadow: 0 0 .5em rgba(61, 61, 61, .5);
    box-shadow: 0 0 .5em rgba(61, 61, 61, .5);
}

[data-bs-theme=dark] .cage-pregnant {
    border-color: var(--bs-teal);
}

[data-bs-theme=dark] .cage-pregnant > .cage-header {
    background-image: linear-gradient(to right, rgb(32, 201, 151, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(32, 201, 151, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(32, 201, 151, 50%);
}

[data-bs-theme=dark] .cage-pregnant > .cage-header > .cage-number {
    background: var(--bs-teal);
    border-color: var(--bs-teal);
}

[data-bs-theme=dark] .cage-pregnant > .cage-header > .mating-days {
    color: var(--bs-teal);
}

[data-bs-theme=dark] .cage-pregnant-alert {
    border-color: var(--bs-teal);
    animation: pregnantdark 0.83s infinite;
}

[data-bs-theme=dark] .cage-ready {
    border-color: #8955e7;
}

[data-bs-theme=dark] .cage-ready > .cage-header {
    background-image: linear-gradient(to right, rgb(137, 85, 231, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(137, 85, 231, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(137, 85, 231, 50%);
}

[data-bs-theme=dark] .cage-ready > .cage-header > .cage-number {
    background: #8955e7;
    border-color: #8955e7;
}

[data-bs-theme=dark] .cage-rest {
    border-color: var(--bs-info-text-emphasis);
}

[data-bs-theme=dark] .cage-rest > .cage-header {
    background-image: linear-gradient(to right, rgb(110, 223, 246, 50%) 1px, transparent 1px), linear-gradient(to bottom, rgb(110, 223, 246, 50%) 1px, transparent 1px);
    border-bottom: 5px solid rgb(110, 223, 246, 50%);
}

[data-bs-theme=dark] .cage-rest > .cage-header > .cage-number {
    background: var(--bs-info-text-emphasis);
    border-color: var(--bs-info-text-emphasis);
}

[data-bs-theme=dark] .cage-rest > .cage-header > .mating-days {
    color: var(--bs-info-text-emphasis);
}

[data-bs-theme=dark] .ql-toolbar.ql-snow {
    border: 1px solid #474a4e;
    background: var(--bs-secondary-bg-subtle);
}

[data-bs-theme=dark] .ql-container.ql-snow {
    border: 1px solid #474a4e;
}

[data-bs-theme=dark] .ql-snow .ql-stroke {
    stroke: #dee2e6;
}

[data-bs-theme=dark] .ql-snow .ql-fill, .ql-snow .ql-stroke.ql-fill {
    fill: #dee2e6;
}

.ms-calendar-day {
    position: absolute;
    right: 5px;
    top: -12px;
    font-size: 35px;
}

.ms-day {
    position: absolute;
    top: 6px;
    right: 5px;
    font-weight: bold;
    text-align: center;
    width: 35px;
}

.ms-rabbit-icon {
    padding: 0 .5rem 0 .5rem !important;
}

.ql-container.ql-snow {
    height: 300px;
}

.tk-user {
    line-height: 0;
    font-size: 40px;
    margin-inline-end: 15px;
}