/* Custom colors */
:root {
  --bs-putih: #fff;
  --bs-hitam: #000;
  --bs-hijau: #5bda78;
  --bs-hijau-hover: #4c9c5f;
  --bs-merah: #ff6878;
  --bs-merah-hover: #da4f5d;
  --bs-kuning: #fff43a;
  --bs-kuning-hover: #edbe33;
  --bs-biru: #4ad5eb;
  --bs-biru-hover: #3f99a7;
  --bs-ungu: #9f75f4;
  --bs-orange: #fd7e14;

  --bs-orange-90: #fee3cd;
  --bs-orange-80: #fec79a;
  --bs-orange-70: #fdab68;
  --bs-orange-60: #fd8f35;
  --bs-orange-50: #fc7303;
  --bs-orange-40: #ca5c02;
  --bs-orange-30: #974502;
  --bs-orange-20: #652e01;
  --bs-orange-10: #321701;

  --bs-yellow-90: #fff2cc;
  --bs-yellow-80: #ffe699;
  --bs-yellow-70: #ffd966;
  --bs-yellow-60: #ffcc33;
  --bs-yellow-50: #ffbf00;
  --bs-yellow-40: #cc9900;
  --bs-yellow-30: #997300;
  --bs-yellow-20: #664d00;
  --bs-yellow-10: #332600;

  --bs-red-90: #f7d4d7;
  --bs-red-80: #f0a8af;
  --bs-red-70: #e87d88;
  --bs-red-60: #e05260;
  --bs-red-50: #d92638;
  --bs-red-40: #ad1f2d;
  --bs-red-30: #821722;
  --bs-red-20: #570f16;
  --bs-red-10: #2b080b;

  --bs-green-90: #d4f7e7;
  --bs-green-80: #a9efce;
  --bs-green-70: #7ee7b6;
  --bs-green-60: #53df9e;
  --bs-green-50: #28d785;
  --bs-green-40: #20ac6b;
  --bs-green-30: #188150;
  --bs-green-20: #105635;
  --bs-green-10: #082b1b;

  --bs-blue-90: #cde1fe;
  --bs-blue-80: #9ac2fe;
  --bs-blue-70: #68a4fd;
  --bs-blue-60: #3585fd;
  --bs-blue-50: #0367fc;
  --bs-blue-40: #0252ca;
  --bs-blue-30: #023e97;
  --bs-blue-20: #012965;
  --bs-blue-10: #011532;

  --bs-indigo-90: #e0cffc;
  --bs-indigo-80: #c19efa;
  --bs-indigo-70: #a26ef7;
  --bs-indigo-60: #843df5;
  --bs-indigo-50: #650df2;
  --bs-indigo-40: #510ac2;
  --bs-indigo-30: #3c0891;
  --bs-indigo-20: #280561;
  --bs-indigo-10: #140330;

  --bs-dark-90: #e6e6e6;
  --bs-dark-80: #cccccc;
  --bs-dark-70: #b3b3b3;
  --bs-dark-60: #999999;
  --bs-dark-50: #808080;
  --bs-dark-40: #666666;
  --bs-dark-30: #4d4d4d;
  --bs-dark-20: #333333;
  --bs-dark-10: #1a1a1a;

  --bs-body-bg: #fff1e6;
  --bs-body-color: #190c00;
  --bs-border-color: #fdab68;
  --bs-card-border-color: #fdab68;
}
body { background-color: var(--bs-putih); color: var(--bs-body-color); background-image:linear-gradient(135deg, var(--bs-putih), var(--bs-putih), var(--bs-body-bg), var(--bs-orange-90)); background-size:cover; background-attachment:fixed; }
a{color:var(--bs-orange);text-decoration:none;background-color:transparent}
a:hover{color:var(--bs-orange-30);text-decoration:none}
a:not([href]):not([class]){color:inherit;text-decoration:none}a:not([href]):not([class]):hover{color:inherit;text-decoration:none}

.preloader{display:-ms-flexbox;display:flex;background-color:#f4f6f9;height:100vh;width:100%;transition:height .2s linear;position:fixed;left:0;top:0;z-index:9999}
.custom-small{font-size: 0.75rem;}

.navbar { font-weight:700; background-color: transparent; transition: background-color 0.3s ease; }
/*.navbar.scrolled { background-color: rgba(240, 168, 175, 0.8); }*/
.navbar-bottom { position: fixed; bottom: 0; width: 100%; background:var(--bs-putih); line-height:1.2; z-index: 2; }
.navbar-bottom .nav-item { flex: 1; text-align: center; color: var(--bs-body-color); }
.navbar-bottom .nav-link { display: flex; flex-direction: column; align-items: center; font-size: 0.6rem; }
.navbar-bottom .nav-link .icon { font-size: 1.5rem; }

.navbar-toggler{border: 0 !important;}
.navbar-toggler-icon{display:inline-block;width:1.5em;height:1.5em;vertical-align:middle;content:"";background:50%/100% 100% no-repeat}
.navbar-light .navbar-toggler-icon{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28255, 255, 255, 1%29' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")}
.navbar-dark .navbar-toggler-icon{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%28254, 185, 129, 0.75%29' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")}

.ui-autocomplete { z-index: 1060; max-height: 200px; overflow-y: auto; overflow-x: hidden; position: absolute; }
.ui-menu-item-wrapper { font-size: 1rem; color: var(--bs-body-color); }
.ui-state-active { background-color: var(--bs-body-bg); color: var(--bs-body-color); }

.text-hijau{color:var(--bs-hijau)!important}a.text-hijau:focus,a.text-hijau:hover{color:var(--bs-hijau-hover)!important}
.text-merah{color:var(--bs-merah)!important}a.text-merah:focus,a.text-merah:hover{color:var(--bs-merah-hover)!important}
.text-kuning{color:var(--bs-kuning)!important}a.text-kuning:focus,a.text-kuning:hover{color:var(--bs-kuning-hover)!important}
.text-biru{color:var(--bs-biru)!important}a.text-info:focus,a.text-biru:hover{color:var(--bs-biru-hover)!important}
.text-ungu{color:var(--bs-ungu)!important}
.text-orange{color:var(--bs-orange)!important}
.text-red{color:var(--bs-merah)!important}
.text-green{color:var(--bs-hijau)!important}
.text-putih{color:var(--bs-putih)!important}

.bg-gradient-orange{color:var(--bs-putih); background-image:linear-gradient(180deg, var(--bs-orange-70), var(--bs-orange-50)); background-size:cover; background-attachment:fixed;}
.bg-gradient-red{color:var(--bs-putih); background-image:linear-gradient(180deg, var(--bs-red-70), var(--bs-red-50)); background-size:cover; background-attachment:fixed;}
.bg-gradient-dark{color:var(--bs-putih); background-image:linear-gradient(180deg, var(--bs-dark-50), var(--bs-dark-30)); background-size:cover; background-attachment:fixed;}
.bg-gradient-light{color:var(--bs-hitam); background-image:linear-gradient(180deg, var(--bs-dark-90), var(--bs-dark-70)); background-size:cover; background-attachment:fixed;}

.card-header{background-color:var(--bs-putih)!important;}
.card-footer{background-color:var(--bs-dark-90)!important;}
.card-header .btn-tool,.bg-orange>.card-header .btn-tool,.card-orange:not(.card-outline)>.card-header .btn-tool{color:rgba(31,45,61,.8)}

.bg-gradient-orange>.card-header .btn-tool:hover,.bg-orange>.card-header .btn-tool:hover,.card-orange:not(.card-outline)>.card-header .btn-tool:hover{color:#1f2d3d}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget .table td,.card.bg-gradient-orange .bootstrap-datetimepicker-widget .table th,.card.bg-orange .bootstrap-datetimepicker-widget .table td,.card.bg-orange .bootstrap-datetimepicker-widget .table th{border:none}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.day:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.hour:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.minute:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.second:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.day:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.hour:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.minute:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.second:hover,.card.bg-orange .bootstrap-datetimepicker-widget table thead tr:first-child th:hover{background-color:#e66a02;color:#1f2d3d}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.today::before,.card.bg-orange .bootstrap-datetimepicker-widget table td.today::before{border-bottom-color:#1f2d3d}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.active,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.active:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.active,.card.bg-orange .bootstrap-datetimepicker-widget table td.active:hover{background-color:#fd9a47;color:#1f2d3d}
.card-header .btn-tool,.dark-mode .bg-orange>.card-header .btn-tool,.dark-mode .card-orange:not(.card-outline)>.card-header .btn-tool{color:rgba(31,45,61,.8)}
.dark-mode .bg-gradient-orange>.card-header .btn-tool:hover,.dark-mode .bg-orange>.card-header .btn-tool:hover,.dark-mode .card-orange:not(.card-outline)>.card-header .btn-tool:hover{color:#1f2d3d}
.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget .table td,.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget .table th,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget .table td,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget .table th{border:none}
.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.day:hover,.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.hour:hover,.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.minute:hover,.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.second:hover,.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table td.day:hover,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table td.hour:hover,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table td.minute:hover,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table td.second:hover,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table thead tr:first-child th:hover{background-color:#e66a02;color:#1f2d3d}
.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.today::before,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table td.today::before{border-bottom-color:#1f2d3d}
.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.active,.dark-mode .card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.active:hover,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table td.active,.dark-mode .card.bg-orange .bootstrap-datetimepicker-widget table td.active:hover{background-color:#fd9a47;color:#1f2d3d}
.dark-mode .card-yellow:not(.card-outline)>.card-header{background-color:#f39c12}
.dark-mode .card-yellow:not(.card-outline)>.card-header,.dark-mode .card-yellow:not(.card-outline)>.card-header a{color:#1f2d3d}
.dark-mode .toast.bg-orange{background-color:rgba(253,126,20,.9)!important}
.dark-mode .toast.bg-orange .toast-header{background-color:rgba(253,126,20,.85);color:#1f2d3d}
.toast.bg-orange{background-color:rgba(253,126,20,.9)!important}
.toast.bg-orange .toast-header{background-color:rgba(253,126,20,.85);color:#1f2d3d}

.bg-orange{background-color:var(--bs-orange)!important;color:var(--bs-putih)!important;}
.bg-orange,.bg-orange>a{color:var(--bs-putih)!important}
.bg-orange.btn:hover{border-color:#dc6502;color:#121a24}
.bg-orange.btn.active,.bg-orange.btn:active,.bg-orange.btn:not(:disabled):not(.disabled).active,.bg-orange.btn:not(:disabled):not(.disabled):active{background-color:#dc6502!important;border-color:#cf5f02;color:#fff}

.table td.bg-orange,.table th.bg-orange{background-color:#fd7e14!important}
.table td.bg-orange,.table td.bg-orange>a,.table th.bg-orange,.table th.bg-orange>a{color:#1f2d3d!important}
.table td.bg-orange.btn:hover,.table th.bg-orange.btn:hover{border-color:#dc6502;color:#121a24}
.table td.bg-orange.btn.active,.table td.bg-orange.btn:active,.table td.bg-orange.btn:not(:disabled):not(.disabled).active,.table td.bg-orange.btn:not(:disabled):not(.disabled):active,.table th.bg-orange.btn.active,.table th.bg-orange.btn:active,.table th.bg-orange.btn:not(:disabled):not(.disabled).active,.table th.bg-orange.btn:not(:disabled):not(.disabled):active{background-color:#dc6502!important;border-color:#cf5f02;color:#fff}
.dark-mode.bg-orange{background-color:#fd7e14!important}
.dark-mode.bg-orange,.dark-mode.bg-orange>a{color:#1f2d3d!important}
.dark-mode.bg-orange.btn:hover{border-color:#dc6502;color:#121a24}
.dark-mode.bg-orange.btn.active,.dark-mode.bg-orange.btn:active,.dark-mode.bg-orange.btn:not(:disabled):not(.disabled).active,.dark-mode.bg-orange.btn:not(:disabled):not(.disabled):active{background-color:#dc6502!important;border-color:#cf5f02;color:#fff}
.card-header .btn-tool,.bg-orange>.card-header .btn-tool,.card-orange:not(.card-outline)>.card-header .btn-tool{color:rgba(31,45,61,.8)}
.bg-gradient-orange>.card-header .btn-tool:hover,.bg-orange>.card-header .btn-tool:hover,.card-orange:not(.card-outline)>.card-header .btn-tool:hover{color:#1f2d3d}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget .table td,.card.bg-gradient-orange .bootstrap-datetimepicker-widget .table th,.card.bg-orange .bootstrap-datetimepicker-widget .table td,.card.bg-orange .bootstrap-datetimepicker-widget .table th{border:none}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.day:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.hour:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.minute:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.second:hover,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table thead tr:first-child th:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.day:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.hour:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.minute:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.second:hover,.card.bg-orange .bootstrap-datetimepicker-widget table thead tr:first-child th:hover{background-color:#e66a02;color:#1f2d3d}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.today::before,.card.bg-orange .bootstrap-datetimepicker-widget table td.today::before{border-bottom-color:#1f2d3d}
.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.active,.card.bg-gradient-orange .bootstrap-datetimepicker-widget table td.active:hover,.card.bg-orange .bootstrap-datetimepicker-widget table td.active,.card.bg-orange .bootstrap-datetimepicker-widget table td.active:hover{background-color:#fd9a47;color:#1f2d3d}

.info-box{box-shadow:0 0 1px rgba(253, 126, 20),0 1px 3px rgba(253, 126, 20,.5);border-radius:.25rem;background-color:#fff;display:-ms-flexbox;display:flex;margin-bottom:1rem;min-height:80px;padding:.5rem;position:relative;width:100%}
.info-box .info-box-icon{border-radius:.25rem 0 0 .25rem;-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex;font-size:2.5rem;-ms-flex-pack:center;justify-content:center;text-align:center;}
.info-box .info-box-icon>img{max-width:100%}
.info-box .info-box-content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;line-height:1.8;-ms-flex:1;flex:1;padding:0 10px;overflow:hidden}
.info-box .info-box-number{display:block;margin-top:.25rem;font-weight:700}
.info-box .info-box-text,.info-box .progress-description{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.btn-outline-orange{color:var(--bs-orange);border-color:var(--bs-orange);}
.btn-outline-orange:hover{color:#1f2d3d;background-color:var(--bs-orange);border-color:var(--bs-orange)}
.btn-outline-orange.focus,.btn-outline-orange:focus{box-shadow:0 0 0 0 rgba(255,193,7,.5)}
.btn-outline-orange.disabled,.btn-outline-orange:disabled{color:var(--bs-orange);background-color:transparent}
.btn-outline-orange:not(:disabled):not(.disabled).active,.btn-outline-orange:not(:disabled):not(.disabled):active,.show>.btn-outline-orange.dropdown-toggle{color:#1f2d3d;background-color:var(--bs-orange);border-color:var(--bs-orange)}
.btn-outline-orange:not(:disabled):not(.disabled).active:focus,.btn-outline-orange:not(:disabled):not(.disabled):active:focus,.show>.btn-outline-orange.dropdown-toggle:focus{box-shadow:0 0 0 0 rgba(255,193,7,.5)}
.dark-mode .btn-outline-orange{color:#f39c12;border-color:#f39c12}
.dark-mode .btn-outline-orange:hover{color:#1f2d3d;background-color:#f39c12;border-color:#f39c12}
.dark-mode .btn-outline-orange.focus,.dark-mode .btn-outline-orange:focus{box-shadow:0 0 0 0 rgba(243,156,18,.5)}
.dark-mode .btn-outline-orange.disabled,.dark-mode .btn-outline-orange:disabled{color:#f39c12;background-color:transparent}
.dark-mode .btn-outline-orange:not(:disabled):not(.disabled).active,.dark-mode .btn-outline-orange:not(:disabled):not(.disabled):active,.show>.dark-mode .btn-outline-orange.dropdown-toggle{color:#1f2d3d;background-color:#f39c12;border-color:#f39c12}
.dark-mode .btn-outline-orange:not(:disabled):not(.disabled).active:focus,.dark-mode .btn-outline-orange:not(:disabled):not(.disabled):active:focus,.show>.dark-mode .btn-outline-orange.dropdown-toggle:focus{box-shadow:0 0 0 0 rgba(243,156,18,.5)}

.form-control, .form-select, .form-check-input {border-color:var(--bs-orange-50)!important;}

.swiper { width: 100%; }
.swiper-slide img { display: block; object-fit: cover; }
.swiper-slide { width: 95%; }
.swiper-pagination-bullet-active { background-color: var(--bs-orange) !important; }
.swiper-pagination-bullet-inactive { background-color: var(--bs-orange-80) !important; }

.h50 { height: 50px; }.h75 { height: 75px; }.h100 { height: 100px; }.h125 { height: 125px; }.h150 { height: 150px; }.h175 { height: 175px; } .h200 { height: 200px; }
.w50 { width: 50px; }.w75 { width: 75px; }.w100 { width: 100px; }

#splash{position:absolute;left:0;top:0;width:100%;height:100vh;background:var(--bs-white);z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:1;transition: opacity 2s ease-in;}
#splash img{width:320px;}
#splash.fade{animation-name:fadeOutOpacity;}
@keyframes fadeOutOpacity { 0% { opacity: 1; } 100% { opacity: 0; } }

#status{-webkit-text-stroke: 1px black;}
@media only screen and (max-width: 576px) { .desktop-only { display: none; } }
@media only screen and (max-width: 960px) { #content { margin-top: 60px; margin-bottom: 75px; }; .navbar-bottom { display: inline; } }
@media only screen and (min-width: 961px) { #content { margin-top: 70px; margin-bottom: 25px; }; .navbar-bottom { display: none; } }

#map { height: 50vh; width: 100%; z-index: 1; border-radius:15px; }#mapK { height: 50vh; width: 100%; z-index: 1; border-radius:15px; }

/* Slide in from bottom */
.modal.fullscreen-slide-in .modal-dialog { position:fixed; bottom:-75vh; width:100%; height:75vh; margin:0; transition:bottom 0.4s ease-in-out; border-radius:25px 25px 0 0; }
.modal.fullscreen-slide-in.show .modal-dialog { bottom:0; border-radius:25px 25px 0 0; }
/* Slide out to bottom */
.modal.fullscreen-slide-out .modal-dialog { bottom:0; transition:bottom 0.4s ease-in-out; }
.modal.fullscreen-slide-out.fade .modal-dialog { bottom:-75vh; }

.timeline { border-left: 1px solid #d35400; position: relative; list-style: none; }
.timeline .timeline-item { position: relative; }
.timeline .timeline-item:after { position: absolute; display: block; top: 0; }
.timeline .timeline-item:after { background-color: #d35400; left: -38px; border-radius: 50%; height: 11px; width: 11px; content: ""; }

/* Custom height for the offcanvas-bottom */
.custom-offcanvas {
    height: 90vh !important; /* Adjust to desired height, e.g., 50% of the viewport height */
    max-height: none !important; /* Ensure it doesn't exceed the viewport height */
}

.accent-orange .btn-link,.accent-orange .nav-tabs .nav-link,.accent-orange a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.badge):not(.btn){color:var(--bs-orange)}
.accent-orange .btn-link:hover,.accent-orange .nav-tabs .nav-link:hover,.accent-orange a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):not(.page-link):not(.badge):not(.btn):hover{color:var(--bs-orange-40)}
.accent-orange .dropdown-item.active,.accent-orange .dropdown-item:active{background-color:var(--bs-orange);color:white}
.accent-orange .custom-control-input:checked~.custom-control-label::before{background-color:var(--bs-orange);border-color:var(--bs-orange-30)}
.accent-orange .custom-control-input:checked~.custom-control-label::after{background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%231f2d3d' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E")}
.accent-orange .custom-control-input:focus:not(:checked)~.custom-control-label::before,.accent-orange .custom-file-input:focus~.custom-file-label,.accent-orange .custom-select:focus,.accent-orange .form-control:focus:not(.is-invalid):not(.is-warning):not(.is-valid){border-color:var(--bs-orange-70)}
.accent-orange .page-item .page-link{color:var(--bs-orange)}
.accent-orange .page-item.active .page-link,.accent-orange .page-item.active a{background-color:var(--bs-orange);border-color:var(--bs-orange);color:#fff}
.accent-orange .page-item.disabled .page-link,.accent-orange .page-item.disabled a{background-color:#fff;border-color:#dee2e6;color:#6c757d}
.accent-orange [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link){color:#c2c7d0}
.accent-orange [class*=sidebar-dark-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):hover{color:#fff}
.accent-orange [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link){color:#343a40}
.accent-orange [class*=sidebar-light-] .sidebar a:not(.dropdown-item):not(.btn-app):not(.nav-link):not(.brand-link):hover{color:#212529}
.dark-mode.accent-orange .page-item .page-link:focus,.dark-mode.accent-orange .page-item .page-link:hover{color:var(--bs-orange-60)}

.size-10 {font-size: 10px;line-height: 12px;}
.size-12 {font-size: 12px;}
.size-18 {font-size: 18px;}
.size-20 {font-size: 20px;}
.size-22 {font-size: 22px;}
.size-24 {font-size: 24px;}
.size-32 {font-size: 32px;}

.bottom-navbar {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 98%;
    background: var(--bs-yellow);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
	margin: 0 0 10px 0;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.3);
	border-radius: 25px 0 0 25px;
}

.bottom-navbar .nav-item {flex: 1; text-align: center; position: relative;}
.middle-button-container {position: absolute; left: 50%; transform: translateX(-50%); top: -30px;}
.middle-button {
    width: 60px;
    height: 60px;
    border-radius: 35%;
    background: var(--bs-teal);
	border: 1px solid var(--bs-green-50);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
	transform: rotate(45deg);
}
.middle-button .nav-link {font-size: 40px;}

.lcars-rounded-panel {
	background-color: var(--bs-red-50);
	padding: 5px;
	border-radius: 0 25px 25px 0;
	margin: 10px 10px 0 0;
	text-transform: uppercase;
}