/* 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-lightblue: #86bad8;
  --bs-navy: #002c59;
  --bs-olive: #74c8a3;
  --bs-lime: #67ffa9;
  --bs-fuchsia: #f672d8;
  --bs-maroon: #ed6c9b;

  --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;
}

body {font-family: 'Source Sans Pro',sans-serif};
.custom-small{font-size: 0.75rem;}
.scrolled { background-color: var(--bg-body);opacity:.8 }
.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}

#content { margin-top: 70px; margin-bottom: 75px; }

.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}

.form-format {width: 100%; margin: auto;}
.form-format .checkbox {font-weight: 400;}
.form-format .form-floating:focus-within {z-index: 2;}
.form-format input[type="text"] {margin-bottom: 10px;}
.form-format input[type="date"] {margin-bottom: 10px;}
.form-format input[type="number"] {margin-bottom: 10px;}
.form-format input[type="password"] {margin-bottom: 10px; border-top-left-radius: 0; border-top-right-radius: 0;}
.form-format select {margin-bottom: 10px;}
.form-format textarea {margin-bottom: 10px;}
.btn-orange {color:var(--bs-putih);background-color:var(--bs-orange);}

.bottom-navbar {display: none;}
@media (max-width: 767px) {
.bottom-navbar {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 98%;
    background: var(--bs-dark-30);
    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;
	color: var(--bs-white);
	z-index: 1000;
}
.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-image:linear-gradient(90deg, var(--bs-yellow-90), var(--bs-yellow-20));
    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;}
}

.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;}