/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmSU5fCRc4EsA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmSU5fABc4EsA.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmSU5fCBc4EsA.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmSU5fBxc4EsA.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmSU5fCxc4EsA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmSU5fChc4EsA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmSU5fBBc4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/KFOmCnqEu92Fr1Mu72xKOzY.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/KFOmCnqEu92Fr1Mu5mxKOzY.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/KFOmCnqEu92Fr1Mu7mxKOzY.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/KFOmCnqEu92Fr1Mu4WxKOzY.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/KFOmCnqEu92Fr1Mu7WxKOzY.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/KFOmCnqEu92Fr1Mu7GxKOzY.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/KFOmCnqEu92Fr1Mu4mxK.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmEU9fCRc4EsA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmEU9fABc4EsA.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmEU9fCBc4EsA.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmEU9fBxc4EsA.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmEU9fCxc4EsA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmEU9fChc4EsA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmEU9fBBc4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* cyrillic-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmWUlfCRc4EsA.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmWUlfABc4EsA.woff2) format('woff2');
  unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmWUlfCBc4EsA.woff2) format('woff2');
  unicode-range: U+1F00-1FFF;
}
/* greek */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmWUlfBxc4EsA.woff2) format('woff2');
  unicode-range: U+0370-03FF;
}
/* vietnamese */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmWUlfCxc4EsA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmWUlfChc4EsA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(../fonts/KFOlCnqEu92Fr1MmWUlfBBc4.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* Dropdown Menu Open */
div.dropdown-menu.open {
  max-height: 214px !important;
  overflow: hidden !important;
}
/* Inner Dropdown with Scrollbar Support */
ul.dropdown-menu.inner {
  max-height: 160px !important;
  overflow-y: auto !important;
  scrollbar-width: thin;           /* Firefox */
  scrollbar-color: #ccc transparent; /* Optional color for Firefox */
}
/* Optional Scrollbar Styling for WebKit browsers (Chrome, Edge) */
ul.dropdown-menu.inner::-webkit-scrollbar {
  width: 6px;
}
ul.dropdown-menu.inner::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 3px;
}
/* Toggle Switch Container */
.toggle-switch {
  display: inline-block;
  width: 36px;
  height: 20px;
  position: relative;
}
/* Toggle Switch Helper Area */
.toggle-switch__helper {
  position: absolute;
  height: 12px;
  width: 100%;
  top: 4px;
}
/* Background and Knob Base */
.toggle-switch__helper:after,
.toggle-switch__helper:before {
  content: "";
  position: absolute;
  left: 0;
  will-change: left, background-color;
  transition: left 0.2s, background-color 0.2s;
}
/* Track Background */
.toggle-switch__helper:before {
  background-color: rgba(0, 0, 0, 0.4);
  height: 100%;
  width: 100%;
  border-radius: 10px;
}
/* Toggle Knob */
.toggle-switch__helper:after {
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background-color: #fff;
  left: 0;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 1;
}
/* Checkbox Layer */
.toggle-switch__checkbox {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 2;
  cursor: pointer;
}
/* Checked State - Move Knob */
.toggle-switch__checkbox:checked ~ .toggle-switch__helper:after {
  left: calc(100% - 19px);
  background-color: #dc3545;
}
/* Disabled State */
.toggle-switch__checkbox:disabled {
  cursor: auto;
}
.toggle-switch__checkbox:disabled ~ .toggle-switch__helper {
  opacity: 0.65;
}
/* Active State */
.toggle-switch__checkbox:active ~ .toggle-switch__helper:after {
  box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.05);
}
/* Variant Colors */
.toggle-switch--amber .toggle-switch__checkbox:checked ~ .toggle-switch__helper:after {
  background-color: #ffc107;
}
.toggle-switch--blue .toggle-switch__checkbox:checked ~ .toggle-switch__helper:after {
  background-color: #007bff;
}
.toggle-switch--green .toggle-switch__checkbox:checked ~ .toggle-switch__helper:after {
  background-color: #28a745;
}
.toggle-switch--teal .toggle-switch__checkbox:checked ~ .toggle-switch__helper:after {
  background-color: #20c997;
}
.toggle-switch--purple .toggle-switch__checkbox:checked ~ .toggle-switch__helper:after {
  background-color: #6f42c1;
}
.toggle-switch--cyan .toggle-switch__checkbox:checked ~ .toggle-switch__helper:after {
  background-color: #17a2b8;
}
.card-box {
  background-color: #211a42b3;
  padding: 1.5rem;
  box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.3);
  margin-bottom: 24px;
  border-radius: 0.25rem;
}
/* Scrollbar global (Chrome, Edge, Opera) */
::-webkit-scrollbar {
  width: 3px;
}
::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.01);
  border-radius: 2px;
}
::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.4);
  border-radius: 2px;
}
/* Scrollbar untuk Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
}
/* Background gradien */
.bg-hura {
  background-image: linear-gradient(90deg, #e82a7a 0%, #252f59 100%);
}
/* Word wrapping */
.break-force {
  white-space: pre-wrap;
  word-wrap: break-word;
}
/* Text kecil */
.text-sm {
  font-size: 0.7rem !important;
}
/* Fix posisi bottom */
.footMobile {
  bottom: auto !important;
}
html,
.scroll-thin {
  scrollbar-color: rgba(145, 138, 4, 0.3) rgba(54, 53, 17, 0.01);
  scrollbar-width: thin;
}
/* Word wrapping support */
.break-force {
  white-space: pre-wrap;
  word-wrap: break-word;
}
/* Scrollable table wrapper */
.table-scroll {
  position: relative;
  width: 100%;
  z-index: 1;
  margin: auto;
  overflow: auto;
  max-height: 65vh;
}
.table-scroll table {
  width: 100%;
  margin: auto;
}
.table-wrap {
  position: relative;
}
/* Sticky thead and tfoot */
.table-scroll thead th,
.table-scroll tfoot th {
  background-color: #39176a;
  text-transform: uppercase;
  color: #7cfc00;
  position: sticky;
  line-height: 1.85;
  background-clip: padding-box;
  z-index: 99;
}
.table-scroll thead th {
  top: 0;
}
.table-scroll tfoot th {
  bottom: 0;
}
/* Print media support */
@media print {
  .table-scroll {
    position: static;
    overflow: visible;
    max-height: none;
  }
  .table-scroll thead th,
  .table-scroll tfoot th {
    background-color: #39176a;
    color: #fff;
    position: static;
    line-height: 1.5;
  }
  .table-scroll tfoot {
    display: table-row-group;
  }
}
/* Hide scrollbar for smaller screens */
@media (max-width: 991.98px) {
  .table-responsive::-webkit-scrollbar {
    display: none !important;
  }
  .table-responsive,
  .table-scroll {
    scrollbar-width: none !important;
  }
}
/* Responsive adjustments */
@media (min-width: 576px), (min-width: 768px) {
  .justify-content-gal {
    justify-content: flex-start !important;
  }
  .p-1-gal {
    padding: 0.75rem !important;
  }
}
@media (min-width: 992px), (min-width: 1367px) {
  .justify-content-gal {
    justify-content: flex-end !important;
  }
  .p-1-gal {
    padding: 0.375rem !important;
  }
}
/* Mengatur scroll pada elemen global */
* {
  scrollbar-width: thin;
  scrollbar-color: #a19902 #393812;
}
/* Mengatur scrollbar untuk elemen khusus */
::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  overflow-x: hidden;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #393812;
  margin-block: 0.1em;
  border-radius: 0.1em;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(to right, #a19902, #393812);
  border-radius: 0.1em;
  background-color: #a19902;
}
/* Menambahkan tampilan header tabel yang lebih spesifik */
.table .thead-green th,
.table .thead-danger th,
.table .thead-success th,
.table .thead-primary th,
.table .thead-warning th,
.table .thead-info th,
.table .thead-pink th,
.table .thead-blue th,
.table .thead-light th,
.table .thead-dark th {
  border-color: rgba(255, 255, 255, 0.1);
}
.table .thead-green th { color: #dee2e6; background-color: #030206; }
.table .thead-danger th { color: #f86262 !important; background-color: #4b1f32; }
.table .thead-success th { color: #44cf9c !important; background-color: #1e3b41; border-width: 1px; }
.table .thead-primary th { color: #3283f6 !important; background-color: #192858; }
.table .thead-warning th { color: #fcc015 !important; background-color: #4c371f; }
.table .thead-info th { color: #43bee1 !important; background-color: #1e3753; }
.table .thead-pink th { color: #f672a7 !important; background-color: #4b2344; }
.table .thead-blue th { color: #6658dd !important; background-color: #261d52; }
.table .thead-light th { color: #cecbd2 !important; background-color: #4b445a; }
.table .thead-dark th { color: #807f8a !important; background-color: #160f1e; }
/* Preloader blur background */
.bg-preloader-blur {
  background: #030206db !important;
}
/* Styling dropdown, form select inputs */
.for-select, .for-select-sm {
  border: 1px solid #4f425a5e !important;
  background-color: #030206 !important;
}
.for-select-sm {
  height: calc(1.5em + 0.56rem + 2px);
  padding: 0.28rem 0.28rem;
  font-size: 0.7875rem;
  line-height: 1.5;
}
.all-center-table th,
.all-center-table td {
  text-align: center !important;
  vertical-align: middle !important;
}
/* Dropdown arrow styling */
.dropdown-toggle:after {
  display: inline-block;
  margin-left: 0.15em;
  vertical-align: 0.15em;
  content: "";
  border-top: 0.2em solid;
  border-right: 0.2em solid transparent;
  border-bottom: 0;
  border-left: 0.2em solid transparent;
}
/* Animasi pulse-glow dengan penambahan vendor prefix untuk kompatibilitas */
@keyframes pulse-glow {
  0% {
    box-shadow: 0 0 6px rgba(167,13,253,0.4), 0 0 4px rgba(255,193,7,0.4);
  }
  50% {
    box-shadow: 0 0 16px rgba(167,13,253,0.7), 0 0 10px rgba(255,193,7,0.8);
  }
  100% {
    box-shadow: 0 0 6px rgba(167,13,253,0.4), 0 0 4px rgba(255,193,7,0.4);
  }
}
/* Styling untuk textarea */
textarea {
  width: 100%;
  padding-right: 30px;
  font-family: 'Roboto Mono', monospace;
  font-size: 1.29em;
  border: 2px solid #f2740c;
  background-color: transparent;
  color: white;
  outline: none;
  caret-color: #f2740c;
  animation: blink 0.1s step-end infinite;
  /* Menambahkan pengaturan untuk memastikan tampilan yang lebih konsisten di semua browser */
  -webkit-appearance: none; /* untuk Safari dan WebKit-based browser */
  -moz-appearance: none;    /* untuk Firefox */
  appearance: none;         /* untuk browser modern */
}
/* Animasi blink untuk kursor */
@keyframes blink {
  25% {
    caret-color: transparent;
  }
}
/* Styling untuk teks yang diseleksi */
textarea::selection {
  background-color: yellow;
  color: red;
}
/* Styling untuk footer */
.text-foot {
  font-size: 80%;
}
/* Vendor prefix untuk scrollbar di browser modern */
::-webkit-scrollbar {
  width: 2px;
  height: 2px;
  overflow-x: hidden;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #393812;
  margin-block: 0.1em;
  border-radius: 0.1em;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(to right, #a19902, #393812);
  border-radius: 0.1em;
  background-color: #a19902;
}
/* Untuk Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #a19902 #393812;
}
table {
  width: 100%;
  border-collapse: collapse;
  margin: 2em auto;
  font-size: 12px;
  background-color: rgba(60, 50, 80, 0.2); /* ungu keabuan */
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 0 15px rgba(40, 30, 60, 0.2); /* ungu gelap */
}
th, td {
  padding: 14px 16px;
  text-align: left;
  transition: all 0.4s ease;
  color: rgba(245, 240, 255, 0.85); /* putih ungu lembut */
}
th {
  background-color: rgba(70, 60, 100, 0.4); /* ungu gelap transparan */
  font-weight: bold;
}
tr:nth-child(even) {
  background-color: rgba(80, 70, 110, 0.15); /* ungu sedang */
}
tr:nth-child(odd) {
  background-color: rgba(70, 60, 100, 0.1); /* ungu muda */
}
td:first-child {
  font-weight: bold;
}
tr:hover {
  background-color: rgba(90, 80, 130, 0.3); /* ungu lebih pekat */
  box-shadow: 0 6px 6px -6px rgba(40, 30, 60, 0.4); /* shadow ungu gelap */
}
td:hover {
  font-weight: bold;
  box-shadow: rgba(127, 124, 33, 0.5) -1px 1px, rgba(127, 124, 33, 0.4) -2px 2px, rgba(127, 124, 33, 0.3) -3px 3px;
  transform: translate3d(4px, -4px, 0);
}
table.table.main-table thead th.custom-th {
  color: #cc82ee !important;
  font-weight: bold !important;
}
.input-mini {
  max-width: 80px;
  min-width: 60px;
  padding: 0.25rem 0.5rem;
  font-size: 0.9rem;
}
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
input:not(.input-mini):focus {
  border-color: #1aff00;
  box-shadow: 0 0 5px rgba(0, 196, 255, 0.5);
  outline: none;
  transition: all 0.3s ease-in-out;
}
input:not(.input-mini):hover {
  border-color: #00ffd0;
  box-shadow: 0 0 3px rgba(0, 255, 213, 0.4);
  transition: all 0.2s ease-in-out;
}
.input-group:hover .input-group-text {
  background-color: #17b8a0 !important;
  color: #fff;
  transition: 0.3s ease-in-out;
}
.input-group-text {
  min-width: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  transition: all 0.3s ease-in-out;
}
.form-control {
  transition: all 0.3s ease-in-out;
}
@media (max-width: 768px) {
  .input-mini {
    max-width: 60px;
  }
}