/*!
 * Bootstrap 5.3.x — local compatibility layer for PESONA NIAS
 * Letakkan file bootstrap.min.css RESMI Bootstrap 5.3.x di path ini
 * untuk memakai seluruh komponen tanpa koneksi internet.
 *
 * Proyek ini memuat komponen dan grid yang dibutuhkannya secara lokal.
 * Jangan mengganti path pada HTML: bootstrap/css/bootstrap.min.css
 */
:root {
  --bs-blue: #0d6efd;
  --bs-green: #198754;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-body-font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --bs-body-font-size: 1rem;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-bg: #fff;
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  --bs-border-radius: .375rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: var(--bs-body-font-family); font-size: var(--bs-body-font-size); font-weight: 400; line-height: var(--bs-body-line-height); color: var(--bs-body-color); background: var(--bs-body-bg); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4, h5, h6 { margin: 0 0 .5rem; font-weight: 500; line-height: 1.2; }
p { margin: 0 0 1rem; }
a { color: inherit; text-decoration: none; }
b, strong { font-weight: 700; }
small { font-size: .875em; }
img, svg { vertical-align: middle; }
img { max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; margin: 0; }
button { border-radius: 0; }
[type="button"], [type="reset"], [type="submit"], button { -webkit-appearance: button; cursor: pointer; }
button:not(:disabled), [type="button"]:not(:disabled), [type="submit"]:not(:disabled) { cursor: pointer; }
[hidden] { display: none !important; }

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl { width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-right: auto; margin-left: auto; }
@media (min-width: 576px) { .container, .container-sm { max-width: 540px; } }
@media (min-width: 768px) { .container, .container-md, .container-sm { max-width: 720px; } }
@media (min-width: 992px) { .container, .container-lg, .container-md, .container-sm { max-width: 960px; } }
@media (min-width: 1200px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1140px; } }
@media (min-width: 1400px) { .container, .container-lg, .container-md, .container-sm, .container-xl { max-width: 1320px; } }

.row { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(-1 * var(--bs-gutter-y)); margin-right: calc(-.5 * var(--bs-gutter-x)); margin-left: calc(-.5 * var(--bs-gutter-x)); }
.row > * { flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-top: var(--bs-gutter-y); }
.col { flex: 1 0 0%; }
.col-auto { flex: 0 0 auto; width: auto; }
.g-0, .gx-0 { --bs-gutter-x: 0; }
.g-1, .gx-1 { --bs-gutter-x: .25rem; }
.g-2, .gx-2 { --bs-gutter-x: .5rem; }
.g-3, .gx-3 { --bs-gutter-x: 1rem; }
.g-4, .gx-4 { --bs-gutter-x: 1.5rem; }
.g-5, .gx-5 { --bs-gutter-x: 3rem; }
.gy-1 { --bs-gutter-y: .25rem; }
.gy-2 { --bs-gutter-y: .5rem; }
.gy-3 { --bs-gutter-y: 1rem; }
.gy-4 { --bs-gutter-y: 1.5rem; }
.gy-5 { --bs-gutter-y: 3rem; }
@media (min-width: 576px) {
  .col-sm-6 { flex: 0 0 auto; width: 50%; }
  .col-sm-12 { flex: 0 0 auto; width: 100%; }
}
@media (min-width: 768px) {
  .col-md-4 { flex: 0 0 auto; width: 33.33333333%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
  .col-md-8 { flex: 0 0 auto; width: 66.66666667%; }
  .col-md-12 { flex: 0 0 auto; width: 100%; }
}
@media (min-width: 992px) {
  .col-lg-3 { flex: 0 0 auto; width: 25%; }
  .col-lg-4 { flex: 0 0 auto; width: 33.33333333%; }
  .col-lg-5 { flex: 0 0 auto; width: 41.66666667%; }
  .col-lg-6 { flex: 0 0 auto; width: 50%; }
  .col-lg-7 { flex: 0 0 auto; width: 58.33333333%; }
  .col-lg-8 { flex: 0 0 auto; width: 66.66666667%; }
  .col-lg-12 { flex: 0 0 auto; width: 100%; }
}

.btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; padding: .625rem 1.25rem; font-size: 1rem; font-weight: 500; line-height: 1.5; color: #212529; text-align: center; vertical-align: middle; border: 1px solid transparent; border-radius: .375rem; transition: color .15s, background-color .15s, border-color .15s, box-shadow .15s; }
.btn:focus-visible { outline: 0; box-shadow: 0 0 0 .25rem rgba(13,110,253,.25); }
.btn:disabled { pointer-events: none; opacity: .65; }
.btn-primary { color: #fff; background: #0d6efd; border-color: #0d6efd; }
.btn-outline-primary { color: #0d6efd; border-color: #0d6efd; background: transparent; }
.btn-close { box-sizing: content-box; width: 1em; height: 1em; padding: .25em; color: #000; background: transparent; border: 0; opacity: .5; }
.btn-close::before { content: "\00d7"; display: block; font-size: 1.5rem; line-height: 1; }
.btn-close:hover { opacity: 1; }

.form-label { margin-bottom: .5rem; display: inline-block; }
.form-control, .form-select { display: block; width: 100%; padding: .5rem .75rem; font-size: 1rem; line-height: 1.5; color: #212529; background: #fff; border: 1px solid #dee2e6; border-radius: .375rem; transition: border-color .15s, box-shadow .15s; }
.form-control:focus, .form-select:focus { border-color: #86b7fe; outline: 0; box-shadow: 0 0 0 .25rem rgba(13,110,253,.25); }
.form-check { display: block; min-height: 1.5rem; padding-left: 1.5em; margin-bottom: .125rem; }
.form-check-input { width: 1em; height: 1em; margin-top: .25em; margin-left: -1.5em; vertical-align: top; border: 1px solid rgba(0,0,0,.25); border-radius: .25em; appearance: none; background-color: #fff; background-repeat: no-repeat; background-position: center; background-size: contain; }
.form-check-input:checked { background-color: #0d6efd; border-color: #0d6efd; }
.invalid-feedback { display: none; width: 100%; margin-top: .25rem; font-size: .875em; color: #dc3545; }
.is-invalid ~ .invalid-feedback, .is-invalid + .invalid-feedback { display: block; }
.is-invalid { border-color: #dc3545 !important; }

.alert { position: relative; padding: 1rem; margin-bottom: 1rem; border: 1px solid transparent; border-radius: .375rem; }
.alert-success { color: #0f5132; background: #d1e7dd; border-color: #badbcc; }
.alert-danger { color: #842029; background: #f8d7da; border-color: #f5c2c7; }
.alert-heading { color: inherit; }

.card { position: relative; display: flex; flex-direction: column; min-width: 0; word-wrap: break-word; background: #fff; background-clip: border-box; border: 1px solid rgba(0,0,0,.125); border-radius: .5rem; }
.card-body { flex: 1 1 auto; padding: 1rem; }

.navbar { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; padding: .5rem 0; }
.navbar > .container { display: flex; flex-wrap: inherit; align-items: center; justify-content: space-between; }
.navbar-brand { padding: 0; margin-right: 1rem; font-size: 1.25rem; white-space: nowrap; }
.navbar-nav { display: flex; flex-direction: column; padding-left: 0; margin: 0; list-style: none; }
.nav-link { display: block; padding: .5rem 1rem; transition: color .15s; }
.navbar-toggler { padding: .25rem .75rem; font-size: 1.25rem; line-height: 1; color: rgba(0,0,0,.55); background: transparent; border: 1px solid rgba(0,0,0,.1); border-radius: .375rem; }
.navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center; }
@media (min-width: 992px) {
  .navbar-expand-lg { flex-wrap: nowrap; justify-content: flex-start; }
  .navbar-expand-lg .navbar-nav { flex-direction: row; }
  .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto; }
  .navbar-expand-lg .navbar-toggler { display: none; }
}
.d-flex { display: flex !important; }
.d-none { display: none !important; }
.d-block { display: block !important; }
.align-items-center { align-items: center !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-center { justify-content: center !important; }
.flex-wrap { flex-wrap: wrap !important; }
.text-center { text-align: center !important; }
.w-100 { width: 100% !important; }
.visually-hidden, .visually-hidden-focusable:not(:focus):not(:focus-within) { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.mb-0 { margin-bottom: 0 !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }

.modal { position: fixed; top: 0; left: 0; z-index: 1055; display: none; width: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; outline: 0; }
.modal.show { display: block; }
.modal-dialog { position: relative; width: auto; margin: .5rem; pointer-events: none; }
@media (min-width: 576px) { .modal-dialog { max-width: 500px; margin: 1.75rem auto; } }
.modal-dialog-centered { display: flex; min-height: calc(100% - 1rem); align-items: center; }
@media (min-width: 576px) { .modal-dialog-centered { min-height: calc(100% - 3.5rem); } }
.modal-content { position: relative; display: flex; flex-direction: column; width: 100%; pointer-events: auto; background: #fff; background-clip: padding-box; border: 1px solid rgba(0,0,0,.2); border-radius: .5rem; outline: 0; }
.modal-header { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; padding: 1rem; border-bottom: 1px solid #dee2e6; }
.modal-body { position: relative; flex: 1 1 auto; padding: 1rem; }
.modal-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .5rem; padding: .75rem; border-top: 1px solid #dee2e6; }
.modal-backdrop { --bs-backdrop-zindex: 1050; --bs-backdrop-bg: #000; --bs-backdrop-opacity: .5; position: fixed; top: 0; left: 0; z-index: var(--bs-backdrop-zindex); width: 100vw; height: 100vh; background-color: var(--bs-backdrop-bg); }
.modal-backdrop.fade { opacity: 0; }
.modal-backdrop.show { opacity: var(--bs-backdrop-opacity); }
body.modal-open { overflow: hidden; }

.accordion-button { position: relative; display: flex; align-items: center; width: 100%; padding: 1rem 1.25rem; font-size: 1rem; color: #212529; text-align: left; background: #fff; border: 0; border-radius: 0; overflow-anchor: none; }
.accordion-button::after { flex-shrink: 0; width: 1.25rem; height: 1.25rem; margin-left: auto; content: ""; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-size: 1.25rem; transition: transform .2s ease-in-out; }
.accordion-button:not(.collapsed)::after { transform: rotate(-180deg); }
.accordion-item { background: #fff; border: 1px solid rgba(0,0,0,.125); }
.accordion-collapse.collapse:not(.show) { display: none; }
.collapsing { height: 0; overflow: hidden; transition: height .2s ease; }
.ratio { position: relative; width: 100%; }
.ratio::before { display: block; padding-top: var(--bs-aspect-ratio, 100%); content: ""; }
.ratio > * { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
