/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/Loading.razor.rz.scp.css */
.loader[b-k3ax49hdzb] {
    width: 100px;
    aspect-ratio: 2;
    --_g-left: no-repeat radial-gradient(circle closest-side, #EE7631 90%, #0000);
    --_g-middle: no-repeat radial-gradient(circle closest-side, #4DAFEA 90%, #0000);
    --_g-right: no-repeat radial-gradient(circle closest-side, #F4D954 90%, #0000);
    background: var(--_g-left) 0% 50%, var(--_g-middle) 50% 50%, var(--_g-right) 100% 50%;
    background-size: calc(100% / 3) 50%;
    animation: l3-b-k3ax49hdzb 1s infinite linear;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    pointer-events: none;
    margin: auto;
}

@keyframes l3-b-k3ax49hdzb {
    20% {
        background-position: 0% 0%, 50% 50%,100% 50%
    }

    40% {
        background-position: 0% 100%, 50% 0%,100% 50%
    }

    60% {
        background-position: 0% 50%, 50% 100%,100% 0%
    }

    80% {
        background-position: 0% 50%, 50% 50%,100% 100%
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataBreadcrumbs.razor.rz.scp.css */
.master-data-breadcrumbs[b-h7idfw4hyf] {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    width: 100%;
}

.master-data-breadcrumbs[b-h7idfw4hyf]  .mud-breadcrumbs {
    align-items: center;
    flex-wrap: wrap;
    max-width: 100%;
    min-width: 0;
    row-gap: 0.25rem;
}

.master-data-breadcrumbs[b-h7idfw4hyf]  .mud-breadcrumb-item {
    max-width: 100%;
    min-width: 0;
}

.master-data-breadcrumbs[b-h7idfw4hyf]  .mud-breadcrumb-item a,
.master-data-breadcrumbs[b-h7idfw4hyf]  .mud-breadcrumb-item span {
    overflow-wrap: anywhere;
    word-break: break-word;
}

@media (max-width: 767px) {
    .master-data-breadcrumbs[b-h7idfw4hyf]  .mud-breadcrumbs {
        padding-inline: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataCard.razor.rz.scp.css */
.master-data-card[b-ubbmfc6334] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    box-shadow: 0 1px 2px rgb(0 0 0 / 5%);
    padding: 1rem;
}

.master-data-card__header[b-ubbmfc6334] {
    align-items: flex-start;
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1rem;
    background: white;
    border-bottom: 1px solid #EAEEF4;
    padding-bottom: 12px;
    /* The header itself is a flex item in some layouts; without this it refuses to shrink and pushes
       its children out instead. */
    min-width: 0;
}

.master-data-card__title[b-ubbmfc6334] {
    color: #111827;
    /* `flex: 1 1 auto` rather than `flex: 1`: the `0%` basis in the shorthand makes older WebKit
       compute the title's width from content alone, which is how it ended up running under the
       action buttons on iOS. */
    flex: 1 1 auto;
    font-size: 1rem;
    font-weight: 700;
    margin: 0;
    min-width: 0;
    /* min-width alone does not force a shrink on iOS Safari when the content cannot break; a clipping
       context does. */
    overflow: hidden;
    /* Ordered weakest to strongest so each browser takes the best it understands.
       `word-break: break-word` is legacy but is what pre-15.4 Safari actually honours, and
       `overflow-wrap: anywhere` — the original sole rule — is unsupported there, so a long unbroken
       title never wrapped and simply overflowed. */
    word-break: break-word;
    overflow-wrap: break-word;
    overflow-wrap: anywhere;
}

.master-data-card__actions[b-ubbmfc6334] {
    /* Never shrink and never grow: the buttons keep their intrinsic size and the title yields instead.
       `flex: none` already implies flex-shrink: 0; both are kept because iOS has historically ignored
       the shorthand in nested flex contexts. */
    flex: none;
    flex-shrink: 0;
    min-width: 100px;
    /* Wins the paint order if anything still overlaps, so the buttons stay tappable. */
    position: relative;
    z-index: 1;
}

.master-data-card__fields[b-ubbmfc6334] {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataDetailSection.razor.rz.scp.css */
.master-data-detail-section[b-pc0x3dgamf] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 1.5rem;
}

.master-data-detail-section__title[b-pc0x3dgamf] {
    border-bottom: 2px solid #fb6108;
    color: #374151;
    margin: 0 0 1.25rem;
    padding-bottom: 0.5rem;
}

.master-data-detail-section__content[b-pc0x3dgamf] {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: repeat(var(--master-data-detail-columns), minmax(0, 1fr));
}

@media (max-width: 767px) {
    .master-data-detail-section[b-pc0x3dgamf] {
        padding: 1rem;
    }

    .master-data-detail-section__content[b-pc0x3dgamf] {
        grid-template-columns: 1fr;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataDetailShell.razor.rz.scp.css */
.master-data-detail-shell__heading[b-u9u1cc56xy] {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    margin: 1rem 0;
    min-width: 0;
}

.master-data-detail-shell__heading h4[b-u9u1cc56xy] {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.master-data-detail-shell__heading[b-u9u1cc56xy]  .mud-icon-button {
    flex: none;
    /* 44px is the minimum tap target used across the kit. */
    min-height: 44px;
    min-width: 44px;
}

.master-data-detail-shell__actions[b-u9u1cc56xy] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-left: auto;
}

/* Fields on the left, approval history on the right. This 992px breakpoint is deliberately its own —
   it is not one of the 767/1023 pair in masterDataResponsive.js, because the two-column detail layout
   runs out of room before the grid/card switch does. */
.master-data-detail-shell[b-u9u1cc56xy] {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

.master-data-detail-shell--single[b-u9u1cc56xy] {
    grid-template-columns: minmax(0, 1fr);
}

.master-data-detail-shell__info[b-u9u1cc56xy],
.master-data-detail-shell__side[b-u9u1cc56xy] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.master-data-detail-shell__not-found[b-u9u1cc56xy] {
    padding: 3rem 1rem;
    text-align: center;
}

@media (max-width: 992px) {
    .master-data-detail-shell[b-u9u1cc56xy] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .master-data-detail-shell__heading h4[b-u9u1cc56xy] {
        font-size: 1.1rem;
    }

/*    .master-data-detail-shell__actions {
        margin-left: 0;
        width: 100%;
    }*/
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataFieldPair.razor.rz.scp.css */
.master-data-field-pair[b-qc2swm793x] {
    min-width: 0;
}

.master-data-field-pair--full[b-qc2swm793x] {
    grid-column: 1 / -1;
}

.master-data-field-pair__label[b-qc2swm793x] {
    color: #6b7280;
    display: block;
    font-size: 0.75rem;
    margin-bottom: 0.25rem;
}

.master-data-field-pair__value[b-qc2swm793x] {
    color: #111827;
    font-size: 0.875rem;
    font-weight: 600;
    min-height: 1.5rem;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
    word-break: break-word;
}

.master-data-field-pair__value--truncate[b-qc2swm793x] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataFileField.razor.rz.scp.css */
.master-data-file-field[b-soynsa7vm8] {
    display: grid;
    /* An implicit `auto` track is sized by the file name's min-content width, so a long name pushes
       the chip past the dialog and the ellipsis below never gets to act. minmax(0, 1fr) caps the
       track at the space actually available. */
    grid-template-columns: minmax(0, 1fr);
    gap: 0.5rem;
    min-width: 0;
    max-width: 100%;
}

.master-data-file-field > .form-label[b-soynsa7vm8],
.master-data-file-field > small[b-soynsa7vm8] {
    margin: 0;
}

.master-data-file-field__selected[b-soynsa7vm8],
.master-data-file-field__dropzone[b-soynsa7vm8] {
    align-items: center;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    display: flex;
    gap: 0.75rem;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    padding: 0.75rem;
}

.master-data-file-field__selected[b-soynsa7vm8] {
    background: #fff;
}

.master-data-file-field__name[b-soynsa7vm8],
.master-data-file-field__drop-copy[b-soynsa7vm8] {
    flex: 1 1 0;
    min-width: 0;
}

.master-data-file-field__name[b-soynsa7vm8] {
    /* width: 0 keeps the name out of the row's intrinsic width, so it only ever takes the space the
       icon and the clear button leave behind. Without it a long name still widens the row when an
       ancestor — a dialog, a card — is sized by its content. */
    width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* The icon and the clear button are fixed furniture: they must not shrink to make room for the
   name, otherwise the clear button is what disappears instead of the end of the name. */
.master-data-file-field__selected[b-soynsa7vm8]  .mud-icon-root,
.master-data-file-field__selected[b-soynsa7vm8]  .mud-button-root,
.master-data-file-field__dropzone[b-soynsa7vm8]  .mud-icon-root {
    flex: none;
}

.master-data-file-field__dropzone[b-soynsa7vm8] {
    border-style: dashed;
    cursor: pointer;
    min-height: 5.5rem;
    position: relative;
    transition: background-color 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}

.master-data-file-field__dropzone:hover[b-soynsa7vm8],
.master-data-file-field__dropzone:focus-within[b-soynsa7vm8] {
    background: #f2f7ff;
    border-color: #005ee6;
    box-shadow: 0 0 0 3px rgb(0 94 230 / 10%);
}

.master-data-file-field__dropzone.is-disabled[b-soynsa7vm8] {
    cursor: not-allowed;
    opacity: 0.6;
}

.master-data-file-field__drop-copy[b-soynsa7vm8] {
    display: grid;
    gap: 0.125rem;
}

.master-data-file-field__drop-copy strong[b-soynsa7vm8] {
    color: #27364a;
    font-size: 0.875rem;
}

.master-data-file-field__drop-copy span[b-soynsa7vm8] {
    color: #667085;
    font-size: 0.75rem;
}

.master-data-file-field__browse[b-soynsa7vm8] {
    color: #005ee6;
    font-size: 0.8125rem;
    font-weight: 700;
}

/* Keeping the native file input over the whole surface makes both pointer selection and browser
   file-drop behavior work without copying browser File objects through JavaScript. */
.master-data-file-field__dropzone[b-soynsa7vm8]  input[type="file"] {
    cursor: pointer;
    height: 100%;
    inset: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
    z-index: 2;
}

.master-data-file-field__dropzone.is-disabled[b-soynsa7vm8]  input[type="file"] {
    cursor: not-allowed;
}

@media (max-width: 576px) {
    .master-data-file-field__dropzone[b-soynsa7vm8] {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .master-data-file-field__drop-copy[b-soynsa7vm8] {
        flex-basis: calc(100% - 3rem);
    }

    .master-data-file-field__browse[b-soynsa7vm8] {
        margin-left: 2.5rem;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataFilterPanel.razor.rz.scp.css */
.master-data-filter[b-h5vrh184q0] {
    flex: 0 0 auto;
    position: relative;
}

.master-data-filter__title[b-h5vrh184q0] {
    font-weight: 700;
    margin: 0 0 1rem;
}

.master-data-filter__fields[b-h5vrh184q0] {
    display: grid;
    gap: 1rem;
}

/* The field controls are Syncfusion's own wrappers, so ::deep is the only way to reach them from
   here. Rounder than the theme default so the inputs match the panel and the pill buttons. */
.master-data-filter__fields[b-h5vrh184q0]  .e-input-group,
.master-data-filter__fields[b-h5vrh184q0]  .e-input-group.e-control-wrapper {
    border-radius: 0.75rem;
    overflow: hidden;
}

.master-data-filter__actions[b-h5vrh184q0] {
    display: flex;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

/* Desktop light-dismiss layer: invisible, covers the viewport, one below the popover. */
.master-data-filter__scrim[b-h5vrh184q0] {
    inset: 0;
    position: fixed;
    z-index: calc(var(--mud-zindex-popover, 1200) - 1);
}

/* Mobile modal. position: fixed keeps it clear of the list card's overflow clipping. */
.master-data-filter__backdrop[b-h5vrh184q0] {
    background: rgb(15 23 42 / 45%);
    inset: 0;
    position: fixed;
    z-index: 1400;
}

.master-data-filter__dialog[b-h5vrh184q0] {
    background: #fff;
    border-radius: 1.25rem;
    box-shadow: 0 20px 45px rgb(15 23 42 / 25%);
    left: 50%;
    max-height: 85vh;
    max-width: min(22rem, calc(100vw - 2rem));
    overflow-y: auto;
    padding: 1.5rem;
    position: fixed;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 1401;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataFormSection.razor.rz.scp.css */
.master-data-form-section[b-k5kg0f781i] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 1.5rem;
}

.master-data-form-section__title[b-k5kg0f781i] {
    color: #374151;
    font-size: 1rem;
    margin: 0 0 1.25rem;
}

@media (max-width: 576px) {
    .master-data-form-section[b-k5kg0f781i] {
        padding: 1rem;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataFormShell.razor.rz.scp.css */
.master-data-form-shell__heading[b-2eez5cm37w] {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    margin-bottom: 1rem;
    min-width: 0;
}

.master-data-form-shell__title[b-2eez5cm37w] {
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Desktop keeps a single cancel, in the bottom bar. */
.master-data-form-shell__back[b-2eez5cm37w] {
    display: none;
}

.master-data-form-shell__back[b-2eez5cm37w]  .mud-icon-button {
    flex: none;
    min-height: 44px;
    min-width: 44px;
}

.master-data-form-shell__sections[b-2eez5cm37w] {
    display: grid;
    gap: 1rem;
}

.master-data-form-shell__actions[b-2eez5cm37w] {
    margin-top: 1rem;
}

.master-data-form-shell__submit[b-2eez5cm37w] {
    background-color: #005EE6;
    border-color: #005EE6;
    box-shadow: none;
    color: #fff;
}

.master-data-form-shell__submit:hover:not(:disabled)[b-2eez5cm37w],
.master-data-form-shell__submit:focus-visible[b-2eez5cm37w] {
    background-color: #0360D9;
    border-color: #0360D9;
    color: #fff;
}

.master-data-form-shell__submit:disabled[b-2eez5cm37w] {
    background-color: #005EE6;
    border-color: #005EE6;
    color: #fff;
    opacity: 0.65;
}

@media (max-width: 767px) {
    /* Cancel becomes a back arrow beside the title; the bottom bar keeps submit only. */
    .master-data-form-shell__back[b-2eez5cm37w] {
        display: inline-flex;
    }

    .master-data-form-shell__actions[b-2eez5cm37w]  .master-data-form-shell__cancel {
        display: none;
    }
}

@media (max-width: 576px) {
    .master-data-form-shell[b-2eez5cm37w] {
        padding-bottom: 5.5rem;
    }

    .master-data-form-shell__actions[b-2eez5cm37w] {
        background: #fff;
        border-top: 1px solid #e5e7eb;
        bottom: 0;
        box-shadow: 0 -4px 12px rgb(15 23 42 / 8%);
        left: 0;
        margin: 0;
        padding: 0.75rem 1rem;
        position: fixed;
        right: 0;
        z-index: 100;
    }

    .master-data-form-shell__actions[b-2eez5cm37w]  .right-buttons {
        display: grid;
        gap: 0.75rem;
        grid-template-columns: 1fr;
        margin: 0 !important;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataListHeader.razor.rz.scp.css */
.master-data-list-header[b-1dl3oqfmil],
.master-data-list-header__actions[b-1dl3oqfmil] {
    align-items: center;
    display: flex;
    gap: 0.75rem;
}

.master-data-list-header[b-1dl3oqfmil] {
    background: transparent;
    justify-content: space-between;
    margin: 1rem 0;
    min-width: 0;
}

.master-data-list-header__title[b-1dl3oqfmil] {
    margin: 0;
    min-width: 0;
    overflow-wrap: anywhere;
}

.master-data-list-header__actions[b-1dl3oqfmil] {
    flex: none;
    margin-left: auto;
}

.master-data-list-header__actions[b-1dl3oqfmil]  .master-data-list-header__add {
    background-color: #005EE6 !important;
    box-shadow: none;
    color: #fff !important;
}

.master-data-list-header__actions[b-1dl3oqfmil]  .master-data-list-header__add:hover {
    background-color: #0360D9 !important;
}

@media (max-width: 767px) {
    .master-data-list-header[b-1dl3oqfmil],
    .master-data-list-header__actions[b-1dl3oqfmil] {
        gap: 0.5rem;
    }

    .master-data-list-header__title[b-1dl3oqfmil] {
        font-size: clamp(1.125rem, 5vw, 1.5rem);
    }

    .master-data-list-header__actions[b-1dl3oqfmil]  .master-data-list-header__add {
        border-radius: 999px !important;
        height: 2.75rem;
        min-width: 2.75rem !important;
        padding: 0 !important;
        width: 2.75rem;
    }

    /* With the label hidden the button is an icon circle, so drop MudButton's
       start-icon offsets — otherwise the icon sits left of centre. */
    .master-data-list-header__actions[b-1dl3oqfmil]  .master-data-list-header__add .mud-button-icon-start {
        margin-left: 0;
        margin-right: 0;
    }

    .master-data-list-header__actions[b-1dl3oqfmil]  .master-data-list-header__add .mud-button-label {
        justify-content: center;
    }

    .master-data-list-header__add-label[b-1dl3oqfmil] {
        display: none;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataListToolbar.razor.rz.scp.css */
.master-data-toolbar[b-w9rn2drdxr] {
    align-items: center;
    display: flex;
    gap: 0.75rem;
    margin-bottom: 1rem;
    min-width: 0;
    width: 100%;
}

.master-data-toolbar__search[b-w9rn2drdxr] {
    flex: 1;
    min-width: 0;
}

.master-data-toolbar__search input[b-w9rn2drdxr] {
    height: 2.5rem;
    min-width: 0;
}

.master-data-toolbar__exports[b-w9rn2drdxr] {
    align-items: center;
    display: flex;
    flex: none;
    gap: 0.75rem;
    margin-left: auto;
}

@media (max-width: 767px) {
    .master-data-toolbar[b-w9rn2drdxr] {
        align-items: stretch;
        flex-wrap: wrap;
    }

    .master-data-toolbar__search[b-w9rn2drdxr] {
        flex: 1 0 100%;
        order: 1;
    }

    .master-data-toolbar__exports[b-w9rn2drdxr] {
        margin-left: 0;
        order: 2;
    }

    .master-data-toolbar__exports[b-w9rn2drdxr]  .mud-icon-button {
        height: 2.75rem;
        min-height: 2.75rem;
        min-width: 2.75rem;
        width: 2.75rem;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataListView.razor.rz.scp.css */
.master-data-list-view__mobile[b-4ujucwj6ey] {
    display: block;
}

.master-data-list-view__mobile[b-4ujucwj6ey]  .master-data-card + .master-data-card {
    margin-top: 0.75rem;
}

.master-data-list-view__loading[b-4ujucwj6ey],
.master-data-list-view__empty[b-4ujucwj6ey] {
    align-items: center;
    color: #6b7280;
    display: flex;
    justify-content: center;
    padding: 2rem;
    text-align: center;
}

/* Zero-height probe for the IntersectionObserver. It needs a little height so a browser will
   report it as intersecting; the 300px rootMargin in site.js does the actual look-ahead. */
.master-data-list-view__sentinel[b-4ujucwj6ey] {
    height: 1px;
    margin: 0;
    padding: 0;
    width: 100%;
}

/* Anchors the loading overlay to the grid. */
.master-data-list-view__grid-wrapper[b-4ujucwj6ey] {
    position: relative;
}

/* Sits over the rows instead of pushing them down, and swallows clicks so the grid cannot be paged
   or sorted again mid-fetch. Opaque enough to hide stale rows during a refresh. */
.master-data-list-view__overlay[b-4ujucwj6ey] {
    /* Present in the DOM at all times and revealed with .is-visible — see the razor comment. */
    display: none;
    align-items: center;
    background: rgba(255, 255, 255, 0.85);
    inset: 0;
    justify-content: center;
    position: absolute;
    z-index: 5;
}

.master-data-list-view__overlay.is-visible[b-4ujucwj6ey] {
    display: flex;
}

.master-data-list-view__empty.is-hidden[b-4ujucwj6ey] {
    visibility: hidden;
}

.master-data-list-view__pager[b-4ujucwj6ey] {
    padding: 0.75rem;
}

.master-data-list-view__pager[b-4ujucwj6ey]  .e-pager {
    border: 0;
    border-radius: 0.5rem;
}

@media (max-width: 767px) {
    .master-data-list-view__pager[b-4ujucwj6ey] {
        padding: 0.5rem 0.25rem;
    }
}

.master-data-list-view__load-more[b-4ujucwj6ey] {
    display: flex;
    justify-content: center;
    margin-top: 1rem;
}

.master-data-list-view__load-more[b-4ujucwj6ey]  .mud-button-root {
    min-height: 2.75rem;
    min-width: 8rem;
}

.master-data-list-view__desktop[b-4ujucwj6ey]  .e-grid .e-checkbox-wrapper {
    margin-top: 2px;
    transform: scale(1.3);
}

.master-data-list-view__desktop[b-4ujucwj6ey]  .e-grid .e-checkbox-wrapper .e-check,
.master-data-list-view__desktop[b-4ujucwj6ey]  .e-grid .e-checkbox-wrapper .e-stop {
    background-color: #fb6108 !important;
    border-color: #fb6108 !important;
}

.master-data-list-view__desktop[b-4ujucwj6ey]  .e-grid .e-headercell {
    height: 50px !important;
    line-height: 50px;
}

.master-data-list-view__desktop[b-4ujucwj6ey]  .master-data-action-group,
.master-data-list-view__mobile[b-4ujucwj6ey]  .master-data-action-group {
    align-items: center;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    display: inline-flex;
    flex-shrink: 0;
    gap: 0.25rem;
    justify-content: center;
    min-width: 100px;
    padding: 0.25rem;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/MasterData/MasterDataResponsive.razor.rz.scp.css */
.master-data-responsive__initializing[b-7w4l4q457f] {
    min-height: 1px;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Components/ToastAlert.razor.rz.scp.css */
/* POSISI DI POJOK KANAN ATAS */
.toast-alert[b-4nljpg7htm] {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 10001; /* lebih tinggi dari overlay 9999 */
    max-width: 380px;
    border-radius: 12px;
    padding: 12px 14px 12px 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,.12), 0 4px 6px rgba(0,0,0,.1);
    transition: transform .2s ease, opacity .2s ease;
    opacity: 1;
    transform: translateY(0);
    display: block;
}

/* Animasi untuk toast muncul (fade-in & slide-up) */
@keyframes toast-in-b-4nljpg7htm {
    0% {
        opacity: 0;
        transform: translateY(-20px); /* Mulai dari atas */
    }

    100% {
        opacity: 1;
        transform: translateY(0); /* Bergerak ke posisi normal */
    }
}

/* Animasi untuk toast hilang (fade-out & slide-up) */
@keyframes toast-out-b-4nljpg7htm {
    0% {
        opacity: 1;
        transform: translateY(0); /* Mulai dari posisi normal */
    }

    100% {
        opacity: 0;
        transform: translateY(-20px); /* Bergerak ke atas */
    }
}

/* VARIAN WARNA – pilih salah satu gaya */
/* 1) Gaya "solid merah" (sesuai minta: rounded dan merah) */
.toast-alert.error[b-4nljpg7htm] {
    background: #ef4444; /* merah */
    color: #fff;
}
/* 2) (Alternatif) Gaya latar putih dengan garis kiri – hapus jika tak dipakai */
/*
.toast-alert { background: #fff; color: #1f2937; border-left: 6px solid #3b82f6; }
.toast-alert.info    { border-left-color: #3b82f6; }
.toast-alert.success { border-left-color: #16a34a; }
.toast-alert.warning { border-left-color: #f59e0b; }
.toast-alert.error   { border-left-color: #ef4444; }
*/

.toast-content[b-4nljpg7htm] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.toast-title[b-4nljpg7htm] {
    margin-right: 4px;
    color: inherit;
}

.toast-message[b-4nljpg7htm] {
    flex: 1 1 auto;
}

.toast-close[b-4nljpg7htm] {
    margin-left: 8px;
    border: 0;
    background: transparent;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    color: inherit; /* putih saat error */
}

    .toast-close:hover[b-4nljpg7htm] {
        opacity: .85;
    }

.toast-alert.show[b-4nljpg7htm] {
    animation: toast-in-b-4nljpg7htm 0.5s forwards; /* Menambahkan animasi saat muncul */
}

.toast-alert.hide[b-4nljpg7htm] {
    animation: toast-out-b-4nljpg7htm 0.5s forwards; /* Menambahkan animasi saat hilang */
}
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Components/Popup/PopupAddBunker.razor.rz.scp.css */
/* Field labels inside the add bunker dialog - same weight as the deviation dialog's, so the two
   forms read as one family. */
.bunker-field-label[b-qfj614tl8g] {
    margin-bottom: 0.25rem;
    font-size: 0.8125rem;
    line-height: 1.35;
    font-weight: 400;
    color: #1f2937;
}

.bunker-field-label .required-mark[b-qfj614tl8g] {
    color: #dc3545;
}

/* The grouped sections the mock draws as cards: replenishment, bunker activity, location. */
.bunker-panel[b-qfj614tl8g] {
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    padding: 12px 16px;
}

/* Connector between a bunker time and its duration. */
.bunker-dashed[b-qfj614tl8g] {
    height: 0;
    border-bottom: 2px dashed #D1D5DB;
    min-width: 20px;
}

/* Syncfusion renders the dropdown input as a child component, so it needs ::deep to be reached.
   Width lives here rather than in CssClass: that string is copied onto the popup element too, and
   the popup is appended to <body>, where w-100 stretches the list across the whole page. */
[b-qfj614tl8g] .e-ddl.e-input-group {
    width: 100%;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Components/Popup/PopupAddCommenceCargo.razor.rz.scp.css */
/* Field labels - same weight as the add bunker dialog's, so the two forms read as one family. */
.commence-field-label[b-120r9f89ly] {
    margin-bottom: 0.25rem;
    font-size: 0.8125rem;
    line-height: 1.35;
    font-weight: 400;
    color: #1f2937;
}

/* The grouped Start section the mock draws as a card. */
.commence-panel[b-120r9f89ly] {
    border: 1px solid #E0E0E0;
    border-radius: 8px;
    padding: 12px 16px;
}

.commence-required[b-120r9f89ly] {
    color: #dc3545;
}

/* The Activity block folds away, so its whole header is the hit target. */
.commence-activity-header[b-120r9f89ly] {
    cursor: pointer;
    user-select: none;
}

/* Add Time menu rows: label left, the mock's plus right. The width is set here because a menu item
   sizes to its content, so without it the two never separate. */
.commence-menu-row[b-120r9f89ly] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    min-width: 200px;
}

/* Syncfusion renders its input wrapper as a child component, so it needs ::deep to be reached.
   Width lives here rather than in CssClass: that string is copied onto the popup element too, and
   the popup is appended to <body>, where a width rule stretches the list across the whole page.
   The date and time pickers deliberately carry no class of ours - they are left on the theme's
   defaults so they match the activity time dialog. */
[b-120r9f89ly] .commence-pill.e-input-group {
    width: 100%;
    border: 1px solid #E0E0E0;
    border-radius: 999px;
    padding: 2px 12px;
}

/* The bootstrap5 focus rule resets border-radius to 4px, so opening the dropdown squares the pill
   off mid-interaction. Its :not() chain outweighs the rule above, so the radius has to be
   re-asserted at the same weight rather than inherited. */
[b-120r9f89ly] .commence-pill.e-input-group.e-input-focus:not(.e-success):not(.e-warning):not(.e-error) {
    border-radius: 999px;
}

/* Sits under the date / time pair whose value is out of order, in the panel that owns it. */
.commence-field-error[b-120r9f89ly] {
    margin: 0.5rem 0 0;
    font-size: 0.75rem;
    line-height: 1.35;
    color: #dc3545;
}

/* Says why the rest of the form is greyed out. Only shown while no cargo is picked. */
.commence-field-hint[b-120r9f89ly] {
    margin: 0.25rem 0 0;
    font-size: 0.75rem;
    line-height: 1.35;
    color: #6b7280;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Components/Popup/PopupSurveyAgreement.razor.rz.scp.css */
.sa-dialog .mud-dialog-content[b-j6f6ax5ukj] {
    padding-top: .5rem;
}

.sa-form .row[b-j6f6ax5ukj] {
    display: flex;
    gap: 1rem;
}

.sa-form .col[b-j6f6ax5ukj] {
    flex: 1 1 0;
}

.w-50[b-j6f6ax5ukj] {
    width: 50%;
}

.mt-3[b-j6f6ax5ukj] {
    margin-top: 1rem;
}

.mt-4[b-j6f6ax5ukj] {
    margin-top: 1.25rem;
}

.mud-dialog-title[b-j6f6ax5ukj] {
    padding: 12px !important;
}

.mud-dialog .mud-dialog-content[b-j6f6ax5ukj] {
    padding: 0 !important;
}

.mud-dialog .mud-dialog-actions[b-j6f6ax5ukj] {
    padding: 16px !important;
}

.mud-icon-button[b-j6f6ax5ukj] {
    padding: 0 !important;
}

.mud-input[b-j6f6ax5ukj] {
    border: 1px solid #B7B7B7;
    padding: 6px 18px 6px 10px;
    border-radius: 999px;
}

.mud-input.mud-input-underline[b-j6f6ax5ukj]:before {
    border: 0 !important;
}

.mud-input > input.mud-input-root[b-j6f6ax5ukj], div.mud-input-slot.mud-input-root[b-j6f6ax5ukj] {
    padding: 0 !important;
}

.mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol[b-j6f6ax5ukj] {
    margin-left: 12px !important;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Dashboard/DashboardV2.razor.rz.scp.css */
.dashboard-v2[b-vnv9vdeptv] {
    --dashboard-v2-gap: clamp(0.9rem, 1.45vw, 1.25rem);
    display: flex;
    flex-direction: column;
    gap: var(--dashboard-v2-gap);
    padding-bottom: 2rem;
    width: 100%;
    font-family: "Figtree", "Avenir", system-ui, sans-serif;
}

.dashboard-v2__grid[b-vnv9vdeptv] {
    display: grid;
    gap: var(--dashboard-v2-gap);
    align-items: stretch;
}

.dashboard-v2__grid--primary[b-vnv9vdeptv] {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.dashboard-v2__grid--secondary[b-vnv9vdeptv],
.dashboard-v2__grid--reports[b-vnv9vdeptv] {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.dashboard-v2-card[b-vnv9vdeptv] {
    display: flex;
    min-width: 0;
    min-height: 9.5rem;
    height: auto;
    aspect-ratio: 1.15 / 1;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    border-radius: 16px;
    padding: clamp(0.78rem, 1.25vw, 1rem);
    background: var(--card-color, #dd4d00);
    color: #ffffff !important;
    box-shadow: none;
    inline-size: 100%;
    transition: transform 180ms ease, filter 180ms ease;
}

.dashboard-v2-card[b-vnv9vdeptv],
.dashboard-v2-card *[b-vnv9vdeptv] {
    font-family: inherit;
}

.dashboard-v2-card:hover[b-vnv9vdeptv],
.dashboard-v2-card:focus-visible[b-vnv9vdeptv] {
    color: #ffffff !important;
    filter: brightness(1.03) saturate(1.02);
    transform: translateY(-2px);
}

.dashboard-v2-card:focus-visible[b-vnv9vdeptv] {
    outline: 3px solid rgba(12, 52, 110, 0.35);
    outline-offset: 3px;
}

.dashboard-v2-card--primary[b-vnv9vdeptv] {
    min-height: 9.5rem;
    height: auto;
    aspect-ratio: 1.15 / 1;
}

.dashboard-v2-card__header[b-vnv9vdeptv] {
    color: #ffffff !important;
    font-size: clamp(1.08rem, 1.45vw, 1.22rem);
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.1;
    text-shadow: none;
}

.dashboard-v2-card__loading[b-vnv9vdeptv] {
    display: grid;
    min-height: 82px;
    place-items: center;
}

.dashboard-v2-card__metrics[b-vnv9vdeptv] {
    display: grid;
    align-items: end;
    gap: clamp(0.5rem, 0.8vw, 0.85rem);
    margin-top: 1.25rem;
}

.dashboard-v2-card__metrics--1[b-vnv9vdeptv] {
    grid-template-columns: minmax(0, 1fr);
}

.dashboard-v2-card__metrics--2[b-vnv9vdeptv] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    margin-top: auto;
    margin-bottom: 0.35rem;
}

.dashboard-v2-card__metrics--2 .dashboard-v2-card__metric[b-vnv9vdeptv] {
    align-items: center;
    justify-content: center;
    text-align: center;
}

.dashboard-v2-card__metrics--many[b-vnv9vdeptv] {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: 0.55rem;
}

.dashboard-v2-card__metric[b-vnv9vdeptv] {
    display: flex;
    min-width: 0;
    flex-direction: column;
    justify-content: flex-end;
    text-align: left;
    color: #ffffff !important;
}

.dashboard-v2-card__metric + .dashboard-v2-card__metric[b-vnv9vdeptv] {
    border-left: 1px solid rgba(255, 255, 255, 0.52);
    padding-left: clamp(0.48rem, 0.75vw, 0.85rem);
}

.dashboard-v2-card__metrics--many .dashboard-v2-card__metric[b-vnv9vdeptv] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.75rem;
}

.dashboard-v2-card__metrics--many .dashboard-v2-card__metric + .dashboard-v2-card__metric[b-vnv9vdeptv] {
    border-left: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.42);
    padding-top: 0.55rem;
    padding-left: 0;
}

.dashboard-v2-card__metric-label[b-vnv9vdeptv],
.dashboard-v2-card__metric-caption[b-vnv9vdeptv] {
    color: #ffffff !important;
    font-size: clamp(0.56rem, 0.72vw, 0.68rem);
    font-weight: 700;
    line-height: 1.15;
}

.dashboard-v2-card__metric-label[b-vnv9vdeptv] {
    min-height: 1.45rem;
    margin-bottom: 1.05rem;
    overflow-wrap: anywhere;
}

.dashboard-v2-card__metric-caption[b-vnv9vdeptv] {
    margin-top: 0.12rem;
}

.dashboard-v2-card__metric-value[b-vnv9vdeptv] {
    color: #ffffff !important;
    font-size: clamp(1.85rem, 2.75vw, 2.55rem);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 0.9;
    white-space: nowrap;
}

.dashboard-v2-card__metrics--many .dashboard-v2-card__metric-value[b-vnv9vdeptv] {
    font-size: clamp(1.38rem, 1.62vw, 1.78rem);
    letter-spacing: -0.07em;
    text-align: right;
}

.dashboard-v2-card__metrics--many .dashboard-v2-card__metric-unit[b-vnv9vdeptv] {
    font-size: clamp(0.64rem, 0.82vw, 0.88rem);
}

.dashboard-v2-card__metrics--many .dashboard-v2-card__metric-label[b-vnv9vdeptv] {
    min-height: 0;
    margin-bottom: 0;
    font-size: clamp(0.86rem, 1vw, 1.08rem);
    line-height: 1.05;
}

.dashboard-v2-card__metric-unit[b-vnv9vdeptv] {
    margin-left: 0.18rem;
    color: #ffffff !important;
    font-size: clamp(0.72rem, 0.95vw, 0.98rem);
    font-weight: 800;
    letter-spacing: -0.02em;
}

.dashboard-v2-card__metrics--1 .dashboard-v2-card__metric-value[b-vnv9vdeptv] {
    font-size: clamp(2.45rem, 4vw, 3.35rem);
}

.dashboard-v2-card__metrics--1 .dashboard-v2-card__metric-unit[b-vnv9vdeptv] {
    font-size: clamp(0.9rem, 1.25vw, 1.2rem);
}

.dashboard-v2__grid--primary .dashboard-v2-card__metric-value[b-vnv9vdeptv] {
    font-size: clamp(1.4rem, 1.85vw, 2.05rem);
}

.dashboard-v2__grid--primary .dashboard-v2-card__metric-unit[b-vnv9vdeptv] {
    font-size: clamp(0.52rem, 0.68vw, 0.78rem);
}

.dashboard-v2__grid--primary .dashboard-v2-card__metrics--many .dashboard-v2-card__metric-value[b-vnv9vdeptv] {
    font-size: clamp(1.18rem, 1.35vw, 1.5rem);
}

.dashboard-v2__grid--primary .dashboard-v2-card__metrics--many .dashboard-v2-card__metric-unit[b-vnv9vdeptv] {
    font-size: clamp(0.56rem, 0.68vw, 0.76rem);
}

.dashboard-v2__grid--primary .dashboard-v2-card__metrics--many .dashboard-v2-card__metric-label[b-vnv9vdeptv] {
    font-size: clamp(0.74rem, 0.86vw, 0.96rem);
}

.dashboard-v2__grid--primary .dashboard-v2-card__metrics--1 .dashboard-v2-card__metric-value[b-vnv9vdeptv] {
    font-size: clamp(2.2rem, 3.2vw, 3rem);
}

.dashboard-v2__grid--primary .dashboard-v2-card__metrics--1 .dashboard-v2-card__metric-unit[b-vnv9vdeptv] {
    font-size: clamp(0.82rem, 1.05vw, 1.08rem);
}

@media (min-width: 1200px) {
    .dashboard-v2-card__header[b-vnv9vdeptv] {
        font-size: clamp(1.3rem, 1.8vw, 1.58rem);
    }

    .dashboard-v2-card__metrics--1 .dashboard-v2-card__metric-value[b-vnv9vdeptv] {
        font-size: clamp(3rem, 4.45vw, 4.2rem);
    }

    .dashboard-v2-card__metrics--1 .dashboard-v2-card__metric-unit[b-vnv9vdeptv] {
        font-size: clamp(1rem, 1.35vw, 1.35rem);
    }

    .dashboard-v2__grid--primary .dashboard-v2-card__metrics--1 .dashboard-v2-card__metric-value[b-vnv9vdeptv] {
        font-size: clamp(2.75rem, 3.6vw, 3.55rem);
    }
}

@media (max-width: 1199.98px) {
    .dashboard-v2__grid--primary[b-vnv9vdeptv] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .dashboard-v2__grid--secondary[b-vnv9vdeptv],
    .dashboard-v2__grid--reports[b-vnv9vdeptv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .dashboard-v2-card[b-vnv9vdeptv],
    .dashboard-v2-card--primary[b-vnv9vdeptv] {
        aspect-ratio: 1.15 / 1;
        min-height: 9.5rem;
        height: auto;
    }
}

@media (max-width: 899.98px) {
    .dashboard-v2__grid--primary[b-vnv9vdeptv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .dashboard-v2[b-vnv9vdeptv] {
        gap: 0.9rem;
    }

    .dashboard-v2__grid--primary[b-vnv9vdeptv],
    .dashboard-v2__grid--secondary[b-vnv9vdeptv],
    .dashboard-v2__grid--reports[b-vnv9vdeptv] {
        grid-template-columns: minmax(0, 1fr);
    }

    .dashboard-v2-card[b-vnv9vdeptv] {
        min-height: 9.5rem;
        aspect-ratio: 1.15 / 1;
        height: auto;
    }

    .dashboard-v2-card__metrics--2[b-vnv9vdeptv] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    .dashboard-v2-card[b-vnv9vdeptv] {
        transition: none;
    }

    .dashboard-v2-card:hover[b-vnv9vdeptv],
    .dashboard-v2-card:focus-visible[b-vnv9vdeptv] {
        transform: none;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Errors/NotFound.razor.rz.scp.css */
.not-found-page[b-6fc1lcahle] {
    align-items: center;
    display: grid;
    gap: clamp(2rem, 6vw, 6.5rem);
    grid-template-columns: minmax(0, 0.9fr) minmax(18rem, 1.1fr);
    margin: 0 auto;
    max-width: 76rem;
    min-height: calc(100vh - 7rem);
    padding: clamp(2rem, 7vh, 5rem) clamp(0.5rem, 3vw, 2.5rem);
}

.not-found-page__content[b-6fc1lcahle] {
    max-width: 34rem;
}

.not-found-page__eyebrow[b-6fc1lcahle] {
    align-items: center;
    color: #005ee6;
    display: flex;
    font-size: 0.8125rem;
    font-weight: 800;
    gap: 0.625rem;
    letter-spacing: 0.08em;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.not-found-page__eyebrow span:nth-child(2)[b-6fc1lcahle] {
    background: #fb6108;
    border-radius: 999px;
    height: 0.3rem;
    width: 0.3rem;
}

.not-found-page h1[b-6fc1lcahle] {
    color: #17243a;
    font-size: clamp(2.25rem, 5vw, 4.25rem);
    font-weight: 800;
    letter-spacing: -0.035em;
    line-height: 1.05;
    margin: 0;
    max-width: 12ch;
}

.not-found-page p[b-6fc1lcahle] {
    color: #5c6879;
    font-size: clamp(1rem, 1.5vw, 1.125rem);
    line-height: 1.7;
    margin: 1.5rem 0 0;
    max-width: 31rem;
}

.not-found-page__actions[b-6fc1lcahle] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 2rem;
}

.not-found-page__action[b-6fc1lcahle] {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 999px;
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-size: 0.875rem;
    font-weight: 800;
    gap: 0.5rem;
    justify-content: center;
    min-height: 2.875rem;
    padding: 0.6875rem 1.25rem;
    text-decoration: none;
    transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.not-found-page__action:hover[b-6fc1lcahle] {
    transform: translateY(-1px);
}

.not-found-page__action:focus-visible[b-6fc1lcahle] {
    box-shadow: 0 0 0 4px rgb(0 94 230 / 18%);
    outline: none;
}

.not-found-page__action--primary[b-6fc1lcahle] {
    background: #fb6108;
    color: #fffaf6;
}

.not-found-page__action--primary:hover[b-6fc1lcahle] {
    background: #e95606;
    color: #fffaf6;
}

.not-found-page__action--secondary[b-6fc1lcahle] {
    background: #f9fbff;
    border-color: #cfd8e6;
    color: #27364a;
}

.not-found-page__action--secondary:hover[b-6fc1lcahle] {
    background: #edf4ff;
    border-color: #a8bfe2;
}

.not-found-page__visual[b-6fc1lcahle] {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 24rem;
    position: relative;
}

.not-found-page__visual[b-6fc1lcahle]::before {
    background: #eff5ff;
    border-radius: 50%;
    content: "";
    height: min(34vw, 28rem);
    position: absolute;
    width: min(34vw, 28rem);
}

.not-found-page__visual img[b-6fc1lcahle] {
    height: auto;
    max-width: 34rem;
    position: relative;
    width: min(100%, 34rem);
    z-index: 1;
}

.not-found-page__code[b-6fc1lcahle] {
    color: #dce9fc;
    font-size: clamp(8rem, 20vw, 17rem);
    font-weight: 900;
    letter-spacing: -0.09em;
    line-height: 0.75;
    position: absolute;
    right: 0;
    top: 4%;
}

@media (max-width: 899px) {
    .not-found-page[b-6fc1lcahle] {
        gap: 1rem;
        grid-template-columns: 1fr;
        min-height: auto;
        padding-bottom: 3rem;
        padding-top: 3rem;
    }

    .not-found-page__content[b-6fc1lcahle] {
        max-width: 38rem;
    }

    .not-found-page__visual[b-6fc1lcahle] {
        min-height: 18rem;
        order: -1;
    }

    .not-found-page__visual[b-6fc1lcahle]::before {
        height: min(64vw, 23rem);
        width: min(64vw, 23rem);
    }

    .not-found-page__visual img[b-6fc1lcahle] {
        max-width: 25rem;
        width: min(78vw, 25rem);
    }

    .not-found-page__code[b-6fc1lcahle] {
        font-size: clamp(7rem, 30vw, 13rem);
        right: 8%;
    }
}

@media (max-width: 575px) {
    .not-found-page[b-6fc1lcahle] {
        padding-left: 0;
        padding-right: 0;
        padding-top: 1.5rem;
    }

    .not-found-page__visual[b-6fc1lcahle] {
        min-height: 14rem;
    }

    .not-found-page__actions[b-6fc1lcahle] {
        align-items: stretch;
        flex-direction: column;
    }

    .not-found-page__action[b-6fc1lcahle] {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .not-found-page__action[b-6fc1lcahle] {
        transition: none;
    }

    .not-found-page__action:hover[b-6fc1lcahle] {
        transform: none;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Activity/Activity.razor.rz.scp.css */
.activity-list[b-r1ry5gh70s] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .activity-list[b-r1ry5gh70s] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/BunkerType/BunkerType.razor.rz.scp.css */
.bunker-type-list[b-ux2gwoi3rh] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

@media (max-width: 767px) {
    .bunker-type-list[b-ux2gwoi3rh] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/BunkerType/DetailBunkerType.razor.rz.scp.css */
.bunker-type-detail__heading[b-5fr60pvyuy] {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    margin: 1rem 0;
    min-width: 0;
}

.bunker-type-detail__heading h4[b-5fr60pvyuy] {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.bunker-type-detail__heading[b-5fr60pvyuy]  .mud-icon-button {
    flex: none;
    min-height: 44px;
    min-width: 44px;
}

.bunker-type-detail[b-5fr60pvyuy] {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

.bunker-type-detail__info[b-5fr60pvyuy] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

@media (max-width: 992px) {
    .bunker-type-detail[b-5fr60pvyuy] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .bunker-type-detail__heading h4[b-5fr60pvyuy] {
        font-size: 1.1rem;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/BunkerType/ManageBunkerType.razor.rz.scp.css */
/* ValidationMessage renders an unscoped <div class="validation-message">; the only rule for it
   in the bundled Syncfusion CSS is nested under .e-data-form, which this form is not. Without
   ::deep it inherits body colour and reads as ordinary helper text. */
[b-6wefeyw1w6] .validation-message {
    color: #bd2130;
    display: block;
    font-size: 12px;
    margin-top: 0.25rem;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/CargoActivity/CargoActivity.razor.rz.scp.css */
.cargo-activity-list[b-6xi234tmix] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .cargo-activity-list[b-6xi234tmix] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/DelayActivity/DelayActivity.razor.rz.scp.css */
.delay-activity-list[b-hkj8sd5h0u] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .delay-activity-list[b-hkj8sd5h0u] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/IPT/Ipt.razor.rz.scp.css */
.ipt-list[b-gy4m7qa56a] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .ipt-list[b-gy4m7qa56a] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Jetties/Jetty.razor.rz.scp.css */
.jetty-list[b-esd3c29dtl] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .jetty-list[b-esd3c29dtl] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Plant/PlantPort.razor.rz.scp.css */
.plant-port-list[b-idvvw20n7f] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .plant-port-list[b-idvvw20n7f] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/PortActivity/PortActivity.razor.rz.scp.css */
.port-activity-list[b-dybrwpzoem] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .port-activity-list[b-dybrwpzoem] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/PortGroups/PortGroup.razor.rz.scp.css */
.port-group-list[b-n8s4aw4iki] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* On phones the cards float directly on the page background, so the card chrome is dropped. Keep this
   breakpoint at 767px — it must match the mobile query in wwwroot/js/masterDataResponsive.js, which is
   what actually switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .port-group-list[b-n8s4aw4iki] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Ports/Port.razor.rz.scp.css */
.port-list[b-4c5dul5a0j] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* On phones the cards float directly on the page background, so the card chrome is dropped. Keep this
   breakpoint at 767px — it must match the mobile query in wwwroot/js/masterDataResponsive.js, which is
   what actually switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .port-list[b-4c5dul5a0j] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/PortSubprocesses/ManagePortSubprocess.razor.rz.scp.css */
/* ValidationMessage renders an unscoped <div class="validation-message">; the only rule for it
   in the bundled Syncfusion CSS is nested under .e-data-form, which this form is not. Without
   ::deep it inherits body colour and reads as ordinary helper text. */
[b-hksz4nd289] .validation-message {
    color: #bd2130;
    display: block;
    font-size: 12px;
    margin-top: 0.25rem;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/PortSubprocesses/PortSubprocess.razor.rz.scp.css */
.port-sub-process-list[b-67xaivlm3l] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

@media (max-width: 767px) {
    .port-sub-process-list[b-67xaivlm3l] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/ProductGroups/ProductGroup.razor.rz.scp.css */
.product-group-list[b-pyefyl712c] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* On phones the cards float on the page background, so the card chrome is dropped. Keep 767px in step
   with the mobile query in wwwroot/js/masterDataResponsive.js, which is what actually switches
   MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .product-group-list[b-pyefyl712c] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Products/ManageProduct.razor.rz.scp.css */
.product-mixed-cargo-options[b-l94dmhgi4c] {
    margin-top: 0.75rem;
}

.product-mix[b-l94dmhgi4c] {
    display: grid;
    gap: 1.25rem;
}

.product-composition[b-l94dmhgi4c] {
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    display: grid;
    gap: 1rem;
    padding: 1rem;
}

.product-composition__header[b-l94dmhgi4c] {
    align-items: center;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
}

.product-composition__header h6[b-l94dmhgi4c] {
    font-weight: 700;
    margin: 0;
}

.product-composition__row[b-l94dmhgi4c] {
    align-items: end;
    background: #f8fafc;
    border-radius: 0.625rem;
    display: grid;
    gap: 0.75rem;
    grid-template-columns: minmax(0, 2fr) minmax(8rem, 1fr) auto;
    padding: 0.875rem;
}

.product-composition__cargo[b-l94dmhgi4c] {
    min-width: 0;
    width: 100%;
}

.product-composition__cargo[b-l94dmhgi4c]  .e-control-wrapper,
.product-composition__cargo[b-l94dmhgi4c]  .e-ddl {
    max-width: 100%;
    min-width: 0;
    width: 100% !important;
}

.product-composition__cargo[b-l94dmhgi4c]  input.e-input {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.product-composition__total[b-l94dmhgi4c] {
    align-items: center;
    background: var(--bs-warning-bg-subtle, #fff7ed);
    border: 1px solid var(--bs-warning-border-subtle, #fed7aa);
    border-radius: 0.5rem;
    color: var(--bs-warning-text-emphasis, #9a3412);
    display: flex;
    justify-content: space-between;
    padding: 0.625rem 0.75rem;
}

.product-composition__total.is-valid[b-l94dmhgi4c] {
    background: var(--bs-success-bg-subtle, #f0fdf4);
    border-color: var(--bs-success-border-subtle, #bbf7d0);
    color: var(--bs-success-text-emphasis, #166534);
}

.product-composition__row:has(> div:nth-child(1):nth-last-child(2))[b-l94dmhgi4c] {
    grid-template-columns: minmax(0, 1fr) auto;
}

.product-composition__remove[b-l94dmhgi4c] {
    margin-bottom: 0.125rem;
}

@media (max-width: 767px) {
    .product-composition__header[b-l94dmhgi4c] {
        align-items: stretch;
        flex-direction: column;
    }

    .product-composition__row[b-l94dmhgi4c],
    .product-composition__row:has(> div:nth-child(1):nth-last-child(2))[b-l94dmhgi4c] {
        align-items: stretch;
        grid-template-columns: 1fr;
        padding-top: 0.875rem;
        position: relative;
    }

    .product-composition__cargo > .form-label[b-l94dmhgi4c] {
        padding-right: 3rem;
    }

    .product-composition__remove[b-l94dmhgi4c] {
        height: 2.75rem;
        margin: 0;
        position: absolute;
        right: 0.375rem;
        top: 0.25rem;
        width: 2.75rem;
        z-index: 1;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Products/Product.razor.rz.scp.css */
.product-list[b-s11rpig584] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

.product-compositions[b-s11rpig584] {
    display: block;
    min-width: 10rem;
    overflow-wrap: break-word;
    white-space: normal;
}

/* On phones the cards float directly on the page background, so the card chrome is dropped. Keep this
   breakpoint at 767px — it must match the mobile query in wwwroot/js/masterDataResponsive.js, which is
   what actually switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .product-list[b-s11rpig584] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }

    .product-compositions[b-s11rpig584] {
        display: block;
        line-height: 1.35;
        max-width: 100%;
        overflow-wrap: anywhere;
        white-space: normal;
    }

    .product-list[b-s11rpig584]  .master-data-field-pair:has(.product-compositions) {
        grid-column: 1 / -1;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Region/Region.razor.rz.scp.css */
.region-list[b-z4y766nsul] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* On phones the cards float directly on the page background, so the card chrome is dropped. Keep this
   breakpoint at 767px — it must match the mobile query in wwwroot/js/masterDataResponsive.js, which is
   what actually switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .region-list[b-z4y766nsul] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/StandardDistance/StandardDistancePlant.razor.rz.scp.css */
.standard-distance-list[b-ujcwjrzsmi] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .standard-distance-list[b-ujcwjrzsmi] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/SubProcess/ManageSubProcess.razor.rz.scp.css */
/* ValidationMessage renders an unscoped <div class="validation-message">; the only rule for it
   in the bundled Syncfusion CSS is nested under .e-data-form, which this form is not. Without
   ::deep it inherits body colour and reads as ordinary helper text. */
[b-pud0zwhbqx] .validation-message {
    color: #bd2130;
    display: block;
    font-size: 12px;
    margin-top: 0.25rem;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/SubProcess/SubProcess.razor.rz.scp.css */
.sub-process-list[b-a9h58ahpgj] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

@media (max-width: 767px) {
    .sub-process-list[b-a9h58ahpgj] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Vessel/Vessel.razor.rz.scp.css */
.vessel-list[b-yeo9ddyhpt] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

[b-yeo9ddyhpt] .vessel-contract-upload-button {
    height: 2.5rem;
    white-space: nowrap;
}

/* Cards float on the page background at phone width. Keep 767px in step with the mobile query in
   wwwroot/js/masterDataResponsive.js, which is what switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .vessel-list[b-yeo9ddyhpt] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }

    [b-yeo9ddyhpt] .vessel-contract-upload-button {
        border-radius: 999px !important;
        height: 2.75rem;
        min-width: 2.75rem !important;
        padding: 0 !important;
        width: 2.75rem;
    }

    [b-yeo9ddyhpt] .vessel-contract-upload-button .mud-button-icon-start {
        margin-left: 0;
        margin-right: 0;
    }

    [b-yeo9ddyhpt] .vessel-contract-upload-button .mud-button-label {
        justify-content: center;
    }

    .vessel-contract-upload-button__label[b-yeo9ddyhpt] {
        display: none;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/Vessel/VesselContractUploadDialog.razor.rz.scp.css */
.vessel-contract-upload__title[b-u72bgk6c1g],
.vessel-contract-upload__section-heading[b-u72bgk6c1g],
.vessel-contract-upload__actions[b-u72bgk6c1g] {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.vessel-contract-upload__title[b-u72bgk6c1g] {
    gap: 1rem;
    width: 100%;
}

.vessel-contract-upload__title > div:first-child[b-u72bgk6c1g],
.vessel-contract-upload__section-heading > div:first-child[b-u72bgk6c1g] {
    display: grid;
    gap: 0.125rem;
}

.vessel-contract-upload__content[b-u72bgk6c1g] {
    display: grid;
    gap: 1rem;
    min-width: 0;
    padding-top: 0.25rem;
}

.vessel-contract-upload__guide[b-u72bgk6c1g] {
    align-items: center;
    background: #f1f6ff;
    border: 1px solid #d7e5fb;
    border-radius: 0.75rem;
    display: flex;
    gap: 0.75rem;
    padding: 0.875rem 1rem;
}

.vessel-contract-upload__guide-copy[b-u72bgk6c1g] {
    display: grid;
    flex: 1;
    gap: 0.125rem;
    min-width: 0;
}

.vessel-contract-upload__guide-copy strong[b-u72bgk6c1g],
.vessel-contract-upload__section-heading strong[b-u72bgk6c1g] {
    color: #1f2937;
    font-size: 0.875rem;
}

.vessel-contract-upload__guide-copy span[b-u72bgk6c1g],
.vessel-contract-upload__section-heading span[b-u72bgk6c1g],
.vessel-contract-upload__progress-label[b-u72bgk6c1g] {
    color: #667085;
    font-size: 0.75rem;
}

.vessel-contract-upload__progress[b-u72bgk6c1g] {
    display: grid;
    gap: 0.5rem;
}

.vessel-contract-upload__progress-label[b-u72bgk6c1g] {
    display: flex;
    justify-content: space-between;
}

.vessel-contract-upload__preview[b-u72bgk6c1g],
.vessel-contract-upload__result[b-u72bgk6c1g] {
    border: 1px solid #e2e7ee;
    border-radius: 0.75rem;
    display: grid;
    gap: 0.75rem;
    overflow: hidden;
    padding: 0.875rem;
}

.vessel-contract-upload__table-scroll[b-u72bgk6c1g] {
    max-height: 18rem;
    overflow: auto;
}

.vessel-contract-upload__table-scroll table[b-u72bgk6c1g] {
    border-collapse: separate;
    border-spacing: 0;
    font-size: 0.8125rem;
    min-width: 100%;
    width: max-content;
}

.vessel-contract-upload__table-scroll th[b-u72bgk6c1g],
.vessel-contract-upload__table-scroll td[b-u72bgk6c1g] {
    border-bottom: 1px solid #e7ebf0;
    color: #344054;
    max-width: 15rem;
    padding: 0.625rem 0.75rem;
    text-align: left;
    white-space: nowrap;
}

.vessel-contract-upload__table-scroll th[b-u72bgk6c1g] {
    background: #f5f7fa;
    color: #475467;
    font-weight: 700;
    position: sticky;
    top: 0;
    z-index: 1;
}

.vessel-contract-upload__result.is-valid[b-u72bgk6c1g] {
    background: #f2fbf6;
    border-color: #bfe7cd;
}

.vessel-contract-upload__result.has-errors[b-u72bgk6c1g] {
    background: #fff9ed;
    border-color: #f1d59c;
}

.vessel-contract-upload__stats[b-u72bgk6c1g] {
    display: grid;
    gap: 0.625rem;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.vessel-contract-upload__stats > div[b-u72bgk6c1g] {
    background: rgb(255 255 255 / 78%);
    border: 1px solid rgb(152 162 179 / 30%);
    border-radius: 0.625rem;
    display: grid;
    gap: 0.125rem;
    padding: 0.625rem 0.75rem;
}

.vessel-contract-upload__stats span[b-u72bgk6c1g] {
    color: #667085;
    font-size: 0.6875rem;
    text-transform: uppercase;
}

.vessel-contract-upload__stats strong[b-u72bgk6c1g] {
    color: #1d2939;
    font-size: 1.125rem;
}

.vessel-contract-upload__errors[b-u72bgk6c1g] {
    border-top: 1px solid rgb(152 162 179 / 30%);
    display: grid;
    gap: 0.5rem;
    padding-top: 0.75rem;
}

.vessel-contract-upload__errors > strong[b-u72bgk6c1g] {
    color: #912018;
    font-size: 0.8125rem;
}

.vessel-contract-upload__errors ul[b-u72bgk6c1g] {
    display: grid;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    max-height: 12rem;
    overflow: auto;
    padding: 0;
}

.vessel-contract-upload__errors li[b-u72bgk6c1g] {
    align-items: start;
    display: grid;
    gap: 0.625rem;
    grid-template-columns: 4.5rem 1fr;
}

.vessel-contract-upload__errors li span[b-u72bgk6c1g] {
    background: #fee4e2;
    border-radius: 999px;
    color: #b42318;
    font-size: 0.6875rem;
    font-weight: 700;
    padding: 0.25rem 0.5rem;
    text-align: center;
}

.vessel-contract-upload__errors p[b-u72bgk6c1g] {
    color: #7a271a;
    font-size: 0.75rem;
    margin: 0.2rem 0 0;
}

.vessel-contract-upload__actions[b-u72bgk6c1g] {
    gap: 0.75rem;
    width: 100%;
}

.vessel-contract-upload__actions[b-u72bgk6c1g]  .mud-button:last-child {
    margin-left: auto;
}

@media (max-width: 959.98px) {
    .mud-dialog-width-full.vessel-contract-upload-dialog[b-u72bgk6c1g] {
        border-radius: 0 !important;
        height: 100dvh !important;
        margin: 0 !important;
        max-height: 100dvh !important;
        max-width: 100vw !important;
        width: 100vw !important;
    }
}

@media (max-width: 767px) {
    .vessel-contract-upload__guide[b-u72bgk6c1g] {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .vessel-contract-upload__guide-copy[b-u72bgk6c1g] {
        flex-basis: calc(100% - 2.5rem);
    }

    .vessel-contract-upload__guide[b-u72bgk6c1g]  .mud-button-root {
        margin-left: 2.25rem;
    }

    .vessel-contract-upload__stats[b-u72bgk6c1g] {
        gap: 0.375rem;
    }

    .vessel-contract-upload__stats > div[b-u72bgk6c1g] {
        padding: 0.5rem;
    }

    .vessel-contract-upload__errors li[b-u72bgk6c1g] {
        gap: 0.375rem;
        grid-template-columns: 1fr;
    }

    .vessel-contract-upload__errors li span[b-u72bgk6c1g] {
        justify-self: start;
    }

    .vessel-contract-upload__actions[b-u72bgk6c1g]  .mud-button-root {
        flex: 1;
        min-height: 2.75rem;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/VesselContractType/DetailVesselContractType.razor.rz.scp.css */
.vessel-contract-type-detail__heading[b-noaevepdnp] {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    margin: 1rem 0;
    min-width: 0;
}

.vessel-contract-type-detail__heading h4[b-noaevepdnp] {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.vessel-contract-type-detail__heading[b-noaevepdnp]  .mud-icon-button {
    flex: none;
    min-height: 44px;
    min-width: 44px;
}

.vessel-contract-type-detail[b-noaevepdnp] {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

.vessel-contract-type-detail__info[b-noaevepdnp] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

@media (max-width: 992px) {
    .vessel-contract-type-detail[b-noaevepdnp] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .vessel-contract-type-detail__heading h4[b-noaevepdnp] {
        font-size: 1.1rem;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/VesselContractType/VesselContractType.razor.rz.scp.css */
.vessel-contract-type-list[b-wo3z06my2l] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

@media (max-width: 767px) {
    .vessel-contract-type-list[b-wo3z06my2l] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Master Data/VesselTypes/VesselType.razor.rz.scp.css */
.vessel-type-list[b-fnm3qemqb4] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* On phones the cards float directly on the page background, so the card chrome is dropped. Keep this
   breakpoint at 767px — it must match the mobile query in wwwroot/js/masterDataResponsive.js, which is
   what actually switches MasterDataListView from grid to cards. */
@media (max-width: 767px) {
    .vessel-type-list[b-fnm3qemqb4] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/MySession.razor.rz.scp.css */
.access-token[b-fza17ue6l8]
{
    font-family: 'Cascadia Mono', Consolas, 'Courier New', Courier, monospace;
    width: 100%;
    height: 500px;
    padding: 12px;
    resize: none;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Tariff/Tariff Port Charge/DetailTariffPortCharge.razor.rz.scp.css */
.tariff-port-charge-detail__heading[b-hzdx2cq74o] {
    align-items: center;
    display: flex;
    gap: 0.5rem;
    margin: 1rem 0;
    min-width: 0;
}

.tariff-port-charge-detail__heading h4[b-hzdx2cq74o] {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.tariff-port-charge-detail__heading[b-hzdx2cq74o]  .mud-icon-button {
    flex: none;
    min-height: 44px;
    min-width: 44px;
}

.tariff-port-charge-detail[b-hzdx2cq74o] {
    align-items: start;
    display: grid;
    gap: 1rem;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
}

.tariff-port-charge-detail__info[b-hzdx2cq74o] {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

@media (max-width: 992px) {
    .tariff-port-charge-detail[b-hzdx2cq74o] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767px) {
    .tariff-port-charge-detail__heading h4[b-hzdx2cq74o] {
        font-size: 1.1rem;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Tariff/Tariff Port Charge/ManageTariffPortCharge.razor.rz.scp.css */
/* ValidationMessage renders an unscoped <div class="validation-message">; the only rule for it
   in the bundled Syncfusion CSS is nested under .e-data-form, which this form is not. Without
   ::deep it inherits body colour and reads as ordinary helper text. */
[b-7sm9bi156m] .validation-message {
    color: #bd2130;
    display: block;
    font-size: 12px;
    margin-top: 0.25rem;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Tariff/Tariff Port Charge/TariffPortCharge.razor.rz.scp.css */
.tariff-port-charge-list[b-fssm0aj4te] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    margin: 1rem 0 3rem;
    min-height: 32rem;
    overflow: hidden;
    padding: 1rem;
}

/* On a phone the list is a stack of cards, so the framing card around it is only wasted width. */
@media (max-width: 767px) {
    .tariff-port-charge-list[b-fssm0aj4te] {
        background: transparent;
        border: 0;
        margin-top: 0;
        min-height: 0;
        padding: 0;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Voyage Order/DetailVOShip/Components/ComponentDeparture.razor.rz.scp.css */
.tanker-timesheet-field[b-h8zbp2hnps] {
    width: 100%;
}

@media (min-width: 768px) {
    .tanker-timesheet-field[b-h8zbp2hnps] {
        width: auto;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Common/Pages/Voyage Order/DetailVOShip/Components/PumpingLogs/DetailVOShipPumpingLog.razor.rz.scp.css */

table.table-custom tr:nth-last-child(1)[b-2p4itbiean] {
    border-bottom: 1px solid #B7B7B7
}

table.table-custom tr:nth-last-child(2)[b-2p4itbiean] {
    border-bottom: none
}

.e-acrdn-header-content[b-2p4itbiean] {
    width: 100%
}

.e-accordion .e-tgl-collapse-icon[b-2p4itbiean]::before {
    content: "\e729"
}

/* OUTER CARD */
.vo-outer-acc .e-acrdn-item[b-2p4itbiean] {
    border-radius: 18px;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
    margin-bottom: 16px;
    overflow: hidden
}

/* Header bar */
.vo-outer-header[b-2p4itbiean] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 18px 20px 10px
}

.vo-left[b-2p4itbiean] {
    display: flex;
    align-items: center;
    gap: 12px
}

.vo-dot[b-2p4itbiean] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #1E66F5;
    display: inline-block;
    flex-shrink: 0;
}

.vo-title-wrap[b-2p4itbiean] {
    line-height: 1.2
}

.vo-title[b-2p4itbiean] {
    font-weight: 800;
    font-size: 20px
}

.vo-subtitle[b-2p4itbiean] {
    color: #2c2c2c;
    opacity: .7;
    font-weight: 700
}

.vo-date[b-2p4itbiean] {
    margin-left: auto;
    font-weight: 700
}

.vo-sep[b-2p4itbiean] {
    height: 1px;
    background: #e8e8e8;
    margin: 10px 20px
}

.vo-proceed[b-2p4itbiean] {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 0 20px 12px
}

.vo-proceed-label[b-2p4itbiean] {
    color: #1E66F5;
    font-weight: 700
}

.vo-proceed-value[b-2p4itbiean] {
    font-weight: 800;
    font-size: 18px
}

/* INNER ACCORDION */
.vo-inner-acc .e-acrdn-item[b-2p4itbiean] {
    border-radius: 14px;
    border: 1px solid #E9ECEF;
    margin: 12px 0
}

.vo-inner-header[b-2p4itbiean] {
    display: flex;
    align-items: center;
    padding: 14px 34px 14px 14px
}

.vo-status[b-2p4itbiean] {
    font-weight: 800
}

    .vo-status.ok[b-2p4itbiean] {
        color: #0F766E
    }

    .vo-status.no[b-2p4itbiean] {
        color: #E11D48
    }

.vo-time[b-2p4itbiean] {
    margin-left: auto;
    font-weight: 800
}

.vo-inner-body[b-2p4itbiean] {
    padding: 14px 16px 18px
}

.vo-grid[b-2p4itbiean] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 18px
}

.vo-field .vo-label[b-2p4itbiean] {
    color: #666
}

.vo-field .vo-value[b-2p4itbiean] {
    font-weight: 800;
    font-size: 18px
}

.vo-not-recorded[b-2p4itbiean] {
    color: #E11D48;
    font-weight: 700;
    margin-top: 4px
}

.vo-not-recorded-sub[b-2p4itbiean] {
    color: #666
}

.vo-notes.hide[b-2p4itbiean] {
    display: none
}

.vo-remark[b-2p4itbiean] {
    margin-top: 10px
}

.vo-textarea[b-2p4itbiean] {
    width: 100%
}

.vo-actions[b-2p4itbiean] {
    margin-top: 16px
}

.vo-btn-edit[b-2p4itbiean] {
    border-radius: 16px;
    padding: 10px 20px;
    font-weight: 700
}
/* _content/Pertamina.SolutionTemplate.Bsui/Features/JettyKpiImport/Components/JettyKpiUploadForm.razor.rz.scp.css */
.jetty-kpi-upload-dropzone[b-4hqslp4xhp] {
    display: block;
    padding: 1.25rem;
    border: 1.5px dashed #b7c6cc;
    border-radius: 22px;
    background:
        linear-gradient(135deg, rgba(31, 58, 77, 0.03), rgba(180, 91, 45, 0.04));
    cursor: pointer;
    transition: border-color 160ms ease, transform 160ms ease, background-color 160ms ease;
}

.jetty-kpi-upload-dropzone:hover[b-4hqslp4xhp] {
    border-color: #8aa1ab;
    transform: translateY(-1px);
}

.jetty-kpi-upload-hint[b-4hqslp4xhp] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.jetty-kpi-upload-pill[b-4hqslp4xhp] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 0.7rem;
    border-radius: 999px;
    background-color: rgba(24, 50, 67, 0.06);
    color: #37505e;
    font-size: 0.8rem;
}
/* _content/Pertamina.SolutionTemplate.Bsui/Features/JettyKpiImport/Pages/JettyKpiImportPage.razor.rz.scp.css */
.jetty-kpi-page[b-7pa5fx1wyz] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding-bottom: 2rem;
}

.jetty-kpi-hero[b-7pa5fx1wyz] {
    position: relative;
    overflow: hidden;
    padding: clamp(1.5rem, 2vw, 2.25rem);
    border: 1px solid #d7dfdf;
    border-radius: 28px;
    background:
        radial-gradient(circle at top right, rgba(180, 91, 45, 0.16), transparent 28%),
        linear-gradient(135deg, #f3eee6 0%, #fbfaf7 52%, #edf4f4 100%);
}

.jetty-kpi-hero[b-7pa5fx1wyz]::after {
    content: "";
    position: absolute;
    inset: auto -6rem -7rem auto;
    width: 18rem;
    height: 18rem;
    border-radius: 999px;
    background: rgba(24, 50, 67, 0.06);
}

.jetty-kpi-hero-copy[b-7pa5fx1wyz] {
    position: relative;
    z-index: 1;
    max-width: 52rem;
}

.jetty-kpi-kicker[b-7pa5fx1wyz] {
    color: #8b4f2f;
    font-weight: 700;
    letter-spacing: 0.12em;
}

.jetty-kpi-title[b-7pa5fx1wyz] {
    max-width: 20ch;
    margin-bottom: 0.75rem;
    color: #183243;
    font-weight: 700;
    line-height: 1.05;
}

.jetty-kpi-subtitle[b-7pa5fx1wyz] {
    max-width: 68ch;
    color: #4b6069;
}

.jetty-kpi-checklist[b-7pa5fx1wyz] {
    margin: 0;
    padding-left: 1.1rem;
    color: rgba(247, 250, 249, 0.88);
    display: grid;
    gap: 0.85rem;
}

.jetty-kpi-checklist li[b-7pa5fx1wyz]::marker {
    color: #f0c26f;
}

@media (max-width: 768px) {
    .jetty-kpi-title[b-7pa5fx1wyz] {
        max-width: none;
    }
}
/* _content/Pertamina.SolutionTemplate.Bsui/Layouts/MainLayout.razor.rz.scp.css */
.logo[b-d8khm4ankt] {
    margin: 10px;
    background-image: url(~/../img/logo.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;
    min-height: 44px;
}

.main-content[b-d8khm4ankt] {
    position: relative;
    padding: 12px 24px 24px 24px;
    min-height: calc(100vh - 64px);
    background-image: url(~/../img/assets-circle.png);
    background-size: 300px auto;
    background-position: bottom right;
    background-repeat: no-repeat;
    background-attachment: fixed;
}