/* Gaya tambahan FundGate di atas Tabler. Warna merek lender diatur lewat branding (F7). */

.fg-brand {
    color: inherit;
    font-weight: 700;
    letter-spacing: .02em;
    text-decoration: none;
}

/* Penanda lingkungan SANDBOX di semua halaman (spec 06 bagian 1). */
.fg-env-banner {
    background: #f59f00;
    color: #1d1d1d;
    font-weight: 600;
    padding: .5rem 1rem;
    text-align: center;
}

body.env-sandbox .navbar-vertical {
    border-top: 4px solid #f59f00;
}

/* F7: logo branding, indikator jeda darurat, body pesan, grafik, timeline. */
.fg-brand-logo {
    max-height: 32px;
    max-width: 140px;
    margin-right: .5rem;
    vertical-align: middle;
}

.fg-pause-indicator {
    text-decoration: none;
    letter-spacing: .03em;
}

.fg-pre {
    white-space: pre-wrap;
    word-break: break-all;
    max-height: 480px;
    overflow: auto;
    font-size: .8125rem;
    margin: 0;
}

.fg-chart {
    position: relative;
    height: 280px;
}

.fg-stage {
    min-width: 4.5rem;
    text-align: center;
}

/* Contoh nilai dari penawaran terakhir di editor RAC (spec 03 bagian 2). */
.fg-rac-sample code {
    word-break: break-all;
}

/* CSP tanpa data URI (spec 04 bagian 9): ikon SVG Tabler yang aslinya data URI disalin ke /img/ui/ dan dipasang
   ulang di sini dengan selektor yang sama (berkas ini dimuat setelah tabler.min.css). Dibuat dari tabler 1.4.0;
   periksa ulang bila versi Tabler diganti (cari data URI di tabler.min.css; CspAssetsTest). */
.form-select {
    --tblr-form-select-bg-img:url("/img/ui/tb-92686f6207.svg");
}
[data-bs-theme=dark] .form-select,body[data-bs-theme=dark] [data-bs-theme=light] .form-select {
    --tblr-form-select-bg-img:url("/img/ui/tb-a30f68145a.svg");
}
.form-check-input:checked[type=checkbox] {
    --tblr-form-check-bg-image:url("/img/ui/tb-06144d05b0.svg");
}
.form-check-input:checked[type=radio] {
    --tblr-form-check-bg-image:url("/img/ui/tb-d07d75b258.svg");
}
.form-check-input[type=checkbox]:indeterminate {
    --tblr-form-check-bg-image:url("/img/ui/tb-c6738a2c1e.svg");
}
.form-switch .form-check-input {
    --tblr-form-switch-bg:url("/img/ui/tb-fee2438231.svg");
}
.form-switch .form-check-input:focus {
    --tblr-form-switch-bg:url("/img/ui/tb-a8a45af616.svg");
}
.form-switch .form-check-input:checked {
    --tblr-form-switch-bg:url("/img/ui/tb-85ea755e28.svg");
}
[data-bs-theme=dark] .form-switch .form-check-input:not(:checked):not(:focus) {
    --tblr-form-switch-bg:url("/img/ui/tb-efef0636f1.svg");
}
.form-control.is-valid,.was-validated .form-control:valid {
    background-image:url("/img/ui/tb-8f6dbd1a9f.svg");
}
.form-select.is-valid:not([multiple]):not([size]),.form-select.is-valid:not([multiple])[size="1"],.was-validated .form-select:valid:not([multiple]):not([size]),.was-validated .form-select:valid:not([multiple])[size="1"] {
    --tblr-form-select-bg-icon:url("/img/ui/tb-8f6dbd1a9f.svg");
}
.form-control.is-invalid,.was-validated .form-control:invalid {
    background-image:url("/img/ui/tb-78a362b987.svg");
}
.form-select.is-invalid:not([multiple]):not([size]),.form-select.is-invalid:not([multiple])[size="1"],.was-validated .form-select:invalid:not([multiple]):not([size]),.was-validated .form-select:invalid:not([multiple])[size="1"] {
    --tblr-form-select-bg-icon:url("/img/ui/tb-78a362b987.svg");
}
.navbar {
    --tblr-navbar-toggler-icon-bg:url("/img/ui/tb-4d73350dad.svg");
}
.navbar-dark,.navbar[data-bs-theme=dark],body[data-bs-theme=dark] .navbar[data-bs-theme=light] {
    --tblr-navbar-toggler-icon-bg:url("/img/ui/tb-37fb13efe9.svg");
}
[data-bs-theme=dark] .navbar-toggler-icon,body[data-bs-theme=dark] [data-bs-theme=light] .navbar-toggler-icon {
    --tblr-navbar-toggler-icon-bg:url("/img/ui/tb-37fb13efe9.svg");
}
.carousel-control-prev-icon {
    background-image:url("/img/ui/tb-ac8067ed60.svg");
}
.carousel-control-next-icon {
    background-image:url("/img/ui/tb-d0d5890890.svg");
}
.bg-pattern-transparent {
    background:url("/img/ui/tb-de1851155d.svg") repeat center/16px 16px!important;
}
.btn-close {
    --tblr-btn-close-bg:url("/img/ui/tb-2200fd3408.svg");
}
.form-colorinput-color:before {
    background-image:url("/img/ui/tb-06144d05b0.svg");
}
.form-colorinput-light .form-colorinput-color:before {
    background-image:url("/img/ui/tb-4c5cc4cc2f.svg");
}
.form-imagecheck-input:checked~.form-imagecheck-figure:before {
    background-image:url("/img/ui/tb-06144d05b0.svg");
}
.form-imagecheck-input[type=radio]:checked~.form-imagecheck-figure:before {
    background-image:url("/img/ui/tb-d07d75b258.svg");
}
.form-selectgroup-input[type=checkbox]:checked+.form-selectgroup-label .form-selectgroup-check {
    background-image:url("/img/ui/tb-06144d05b0.svg");
}
.form-selectgroup-input[type=radio]:checked+.form-selectgroup-label .form-selectgroup-check {
    background-image:url("/img/ui/tb-d07d75b258.svg");
}
.table-sort:after {
    -webkit-mask-image:url("/img/ui/tb-4131fbace8.svg");
    mask-image:url("/img/ui/tb-4131fbace8.svg");
}
.table-sort.asc:after {
    -webkit-mask-image:url("/img/ui/tb-1506b86ac5.svg");
    mask-image:url("/img/ui/tb-1506b86ac5.svg");
}
.table-sort.desc:after {
    -webkit-mask-image:url("/img/ui/tb-b20a89f1a7.svg");
    mask-image:url("/img/ui/tb-b20a89f1a7.svg");
}

/* Sel tabel yang dipotong dengan lebar maksimum (pengganti style inline). */
.fg-truncate-20 {
    max-width: 20rem;
}

/* Sidebar ringkas dengan menu bergrup: lebar lebih sempit, jarak antarbaris rapat, sub menu menjorok. */
@media (min-width: 992px) {
    .navbar-vertical.navbar-expand-lg {
        width: 13rem;
    }
    .navbar-vertical.navbar-expand-lg ~ .page-wrapper {
        margin-left: 13rem;
    }
}

.fg-nav .nav-link {
    padding-top: .375rem;
    padding-bottom: .375rem;
    font-size: .875rem;
}

.fg-nav .dropdown-menu {
    padding-top: 0;
    padding-bottom: .25rem;
}

.fg-nav .dropdown-item {
    padding-top: .3rem;
    padding-bottom: .3rem;
    font-size: .8125rem;
}

.fg-nav .nav-item.active > .nav-link,
.fg-nav .dropdown-item.active {
    font-weight: 600;
}

/* Header atas dan judul halaman lebih rapat; di layar sempit kontrol header boleh turun baris. */
.page-wrapper > header.navbar {
    min-height: 3rem;
    padding-top: .25rem;
    padding-bottom: .25rem;
}

.page-wrapper > .page-header {
    margin-top: 1rem;
}

@media (max-width: 767.98px) {
    .page-wrapper > header.navbar .container-xl {
        flex-wrap: wrap;
        row-gap: .25rem;
    }
    .page-wrapper > header.navbar .navbar-nav.ms-auto {
        gap: .5rem !important;
    }
}

/* Halaman auth (login, setup, PIN, ganti password): panel merek kiri + formulir kanan. Warna mengikuti
   --tblr-primary (branding.css bila diatur), pola dekoratif dari gradien CSS (tanpa gambar/data URI). */
/* Tabler menggeser html sebesar lebar scrollbar (margin-left: calc(100vw - 100%)); di halaman auth itu
   memunculkan celah putih di kiri panel merek. */
html.fg-auth-html {
    margin-left: 0;
}

body.fg-auth {
    background: var(--tblr-bg-surface);
}

.fg-auth-wrap {
    display: flex;
    min-height: 100vh;
}

.fg-auth-hero {
    position: relative;
    overflow: hidden;
    flex: 0 0 46%;
    max-width: 46%;
    align-items: center;
    padding: 3rem;
    color: #fff;
    background-color: var(--tblr-primary);
    background-image: linear-gradient(135deg, rgba(255, 255, 255, .16) 0%, rgba(0, 0, 0, .18) 100%);
}

.fg-auth-hero::before {
    content: "";
    position: absolute;
    top: 0;
    right: 1rem;
    width: 2.5rem;
    height: 12rem;
    opacity: .35;
    background-image: repeating-linear-gradient(90deg, rgba(0, 0, 0, .45) 0 6px, transparent 6px 14px);
    -webkit-mask-image: linear-gradient(180deg, #000 60%, transparent);
    mask-image: linear-gradient(180deg, #000 60%, transparent);
}

.fg-auth-hero::after {
    content: "";
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    width: 9rem;
    height: 6rem;
    opacity: .4;
    background-image: radial-gradient(circle, rgba(0, 0, 0, .55) 5px, transparent 6px);
    background-size: 1.75rem 1.75rem;
}

.fg-auth-hero-inner {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 34rem;
}

.fg-auth-brand {
    display: flex;
    align-items: center;
    gap: .6rem;
    font-size: 1.35rem;
    font-weight: 600;
    letter-spacing: .03em;
}

.fg-auth-brand-logo {
    display: inline-flex;
    padding: .3rem;
    border-radius: var(--tblr-border-radius);
    background: #fff;
}

.fg-auth-brand-logo img {
    max-height: 28px;
    max-width: 120px;
}

.fg-auth-hero-title {
    margin: 1.75rem 0 2rem;
    font-size: 1.85rem;
    line-height: 1.25;
    font-weight: 700;
    color: #fff;
}

.fg-auth-features {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 0;
}

.fg-auth-feature {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 88%;
    padding: 1rem 1.25rem;
    border-radius: var(--tblr-border-radius-lg);
    background: #fff;
    color: var(--tblr-body-color);
    box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .12);
}

.fg-auth-feature:nth-child(even) {
    margin-left: 12%;
}

.fg-auth-feature-icon {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background: var(--tblr-primary);
    color: #fff;
}

.fg-auth-feature-icon svg {
    width: 1.5rem;
    height: 1.5rem;
}

.fg-auth-feature-title {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--tblr-primary);
}

.fg-auth-feature-text {
    color: var(--tblr-secondary);
}

.fg-auth-main {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1.25rem;
}

.fg-auth-panel {
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 28rem;
    min-height: 100%;
}

.fg-auth-brand-mobile {
    margin-bottom: 2rem;
    color: var(--tblr-primary);
}

.fg-auth-welcome {
    margin-bottom: .5rem;
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
}

.fg-auth-welcome > span:first-child {
    display: block;
}

.fg-auth-main .form-control {
    padding-top: .6rem;
    padding-bottom: .6rem;
}

.fg-auth-main .form-footer .btn {
    padding-top: .65rem;
    padding-bottom: .65rem;
    border-radius: 999px;
    font-weight: 600;
}

.fg-auth-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .5rem;
    margin-top: 3rem;
    font-size: .8125rem;
}

@media (max-width: 991.98px) {
    .fg-auth-main {
        align-items: flex-start;
        padding-top: 2rem;
    }
    .fg-auth-welcome {
        font-size: 1.6rem;
    }
}

.fg-pw-toggle {
    min-width: 0;
    min-height: 0;
    line-height: 1;
    border: 0;
    gap: 0;
}

.fg-auth-main .input-group-flat .input-group-text {
    padding-right: .75rem;
}

.fg-pw-toggle .icon {
    width: 1.25rem;
    height: 1.25rem;
    margin: 0;
}

@media (min-width: 1400px) {
    .fg-auth-hero {
        padding: 3rem 5rem;
    }
}
