/* Bismillaahirrohmanirrohim */
.lebar-maksimal {
    max-width: 100% !important;
}

.header-menu {
    color: white !important;
}

.header-menu h7 {
    color: inherit !important;
    /* mewarisi color dari elemen a di atasnya */
}

.warna-orange {
    background-color: orange;
}

.warna-judul-menu {
    color: black !important;
}

.mobile_logo {
    background-color: white;
    border-radius: 5px;
    padding: 5px;
}

.space-for-header {
    padding-top: 110px !important;
}

.section-box {
    border-radius: 12px;
    background-color: var(--tj-color-theme-bg);
    margin-inline-start: 20px;
    margin-inline-end: 20px;
    padding-top: 100px !important;

    /* --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5); */
}

.bukan-kotak {
    background-color: var(--tj-color-grey-1) !important;
}

/* Efek Hover Custom */
.TombolUang {
    min-width: 160px;
    text-align: center;
    margin-top: 10px;
}

.modal-content {
    padding: 10px;
}

#IdGambarPembayaran {
    height: 50px;
}

#IdKoleksi {
    width: 100%;
    margin: 10px;
}

.input-sedekah {
    border-radius: 10px;
    width: 20px;
    height: 60px;
    background-color: transparent;
    border: 1px solid var(--tj-color-theme-dark) !important;
    background-color: transparent !important;
}

.input-sedekah:focus {
    background-color: #fff9c4 !important;
    /* Warna kuning muda saat fokus */
    border-color: #fbc02d;
    /* Warna border saat fokus */
    outline: none;
    /* Menghilangkan outline biru default */
    box-shadow: 0 0 10px rgba(251, 192, 45, 0.5);
    /* Efek cahaya (glow) */
}

.tabel {
    border: 1px solid var(--tj-color-border-1);
    border-radius: 12px;
    width: 100%;
    margin-bottom: 0;
}

.peringatan {
    border-radius: 10px;
    background-color: #f5e44f;
    padding: 10px;
    text-align: center;
    border-color: azure;
    border-style: solid;
}

.peringatan-dua {
    border-radius: 10px;
    background-color: greenyellow;
    padding: 10px;
    text-align: center;
    border-color: white;
    border-style: solid;
}

.kartu {
    background-color: var(--tj-color-common-white);
    border-radius: 12px;
    padding: 30px;
    min-height: 408px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.tanggal-line {
    /* position: unset !important; */
    color: var(--tj-color-text-body-3);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 16px;
    background-color: var(--tj-color-theme-primary);
    color: white;
    border-radius: 10px;
    padding: 10px;
    width: fit-content;
}