/* SAP supplier combobox on purchase-order approvals */
.mgr-po-supplier-select {
    display: grid;
    gap: 0.55rem;
    margin-bottom: 1rem;
    position: relative;
}

.mgr-po-supplier-select__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.mgr-po-supplier-select__label {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--vs-text);
}

.mgr-po-supplier-select__count {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--vs-text-muted);
    white-space: nowrap;
}

.mgr-po-supplier-select__control {
    position: relative;
}

.mgr-po-supplier-select__trigger {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    min-height: 3rem;
    padding: 0.72rem 0.85rem;
    border: 1px solid var(--vs-border);
    border-radius: 0.75rem;
    background: var(--vs-bg-card);
    color: var(--vs-text);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.mgr-po-supplier-select__trigger:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--vs-accent) 30%, var(--vs-border));
}

.mgr-po-supplier-select__trigger:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--vs-accent) 55%, var(--vs-border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--vs-accent) 14%, transparent);
}

.mgr-po-supplier-select.is-open .mgr-po-supplier-select__trigger {
    border-color: color-mix(in srgb, var(--vs-accent) 55%, var(--vs-border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--vs-accent) 14%, transparent);
}

.mgr-po-supplier-select__trigger:disabled {
    opacity: 0.65;
    cursor: not-allowed;
}

.mgr-po-supplier-select__placeholder {
    color: var(--vs-text-muted);
    font-size: 0.92rem;
}

.mgr-po-supplier-select__value {
    display: grid;
    gap: 0.12rem;
    min-width: 0;
}

.mgr-po-supplier-select__value strong {
    font-size: 0.92rem;
    line-height: 1.25;
    word-break: break-word;
}

.mgr-po-supplier-select__value-meta {
    font-size: 0.76rem;
    color: var(--vs-text-muted);
}

.mgr-po-supplier-select__chevron {
    color: var(--vs-text-muted);
    font-size: 0.9rem;
    transition: transform 0.18s ease;
}

.mgr-po-supplier-select.is-open .mgr-po-supplier-select__chevron {
    transform: rotate(180deg);
}

.mgr-po-supplier-select__backdrop {
    position: fixed;
    inset: 0;
    z-index: 1040;
    border: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    cursor: default;
}

.mgr-po-supplier-select__menu {
    position: fixed;
    z-index: 1050;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--vs-border);
    border-radius: 0.75rem;
    background: var(--vs-bg-card);
    box-shadow:
        0 16px 40px color-mix(in srgb, var(--vs-text) 12%, transparent),
        0 0 0 1px color-mix(in srgb, var(--vs-border) 70%, transparent);
}

.mgr-po-supplier-select__menu-search {
    position: relative;
    padding: 0.55rem;
    border-bottom: 1px solid color-mix(in srgb, var(--vs-border) 75%, transparent);
    background: color-mix(in srgb, var(--vs-border) 12%, var(--vs-bg-card));
}

.mgr-po-supplier-select__search-icon {
    position: absolute;
    left: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--vs-text-muted);
    font-size: 0.92rem;
    pointer-events: none;
}

.mgr-po-supplier-select__search {
    width: 100%;
    padding: 0.62rem 0.75rem 0.62rem 2rem;
    border: 1px solid var(--vs-border);
    border-radius: 0.62rem;
    background: var(--vs-bg-card);
    color: var(--vs-text);
    font: inherit;
    line-height: 1.35;
}

.mgr-po-supplier-select__search:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--vs-accent) 55%, var(--vs-border));
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--vs-accent) 12%, transparent);
}

.mgr-po-supplier-select__options {
    list-style: none;
    margin: 0;
    padding: 0.35rem;
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
}

.mgr-po-supplier-select__options li {
    margin: 0;
}

.mgr-po-supplier-select__option {
    display: grid;
    gap: 0.15rem;
    width: 100%;
    text-align: left;
    padding: 0.62rem 0.7rem;
    border: 0;
    border-radius: 0.55rem;
    background: transparent;
    color: var(--vs-text);
    cursor: pointer;
    transition: background 0.14s ease;
}

.mgr-po-supplier-select__option:hover {
    background: color-mix(in srgb, var(--vs-accent) 8%, var(--vs-bg-card));
}

.mgr-po-supplier-select__option.is-selected {
    background: color-mix(in srgb, var(--vs-accent) 14%, var(--vs-bg-card));
}

.mgr-po-supplier-select__option-main {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
}

.mgr-po-supplier-select__option-main strong {
    font-size: 0.86rem;
    line-height: 1.25;
}

.mgr-po-supplier-select__option-meta {
    font-size: 0.74rem;
    color: var(--vs-text-muted);
}

.mgr-po-supplier-select__empty {
    padding: 0.85rem 0.75rem;
    font-size: 0.82rem;
    color: var(--vs-text-muted);
}

.mgr-po-approve-modal__supplier {
    margin-bottom: 1rem;
}

.mgr-prealert-disapprove__field {
    display: grid;
    gap: 0.45rem;
}

.mgr-prealert-disapprove__field span {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--vs-text);
}

.mgr-prealert-disapprove__field textarea {
    width: 100%;
    min-height: 6rem;
    padding: 0.75rem 0.85rem;
    border: 1px solid var(--vs-border);
    border-radius: 0.75rem;
    background: var(--vs-bg-card);
    color: var(--vs-text);
    font: inherit;
    resize: vertical;
}

.mgr-prealert-disapprove__btn {
    justify-self: start;
}

@media (max-width: 900px) {
    .mgr-prealert-review__grid {
        grid-template-columns: 1fr;
    }
}

/* Keep the supplier list from being clipped by the review card shell. */
.page-manager-trip-requisition-detail .mgr-detail-card.mgr-po-req-review,
.page-manager-trip-requisition-detail .mgr-prealert-review__approve,
.page-manager-breakdown-requisition-detail .mgr-detail-card.mgr-po-req-review,
.page-manager-breakdown-requisition-detail .mgr-prealert-review__approve,
.page-manager-armed-response-requisition-detail .mgr-detail-card.mgr-po-req-review,
.page-manager-armed-response-requisition-detail .mgr-prealert-review__approve,
.page-manager-trip-expense-requisition-detail .mgr-detail-card.mgr-po-req-review,
.page-manager-trip-expense-requisition-detail .mgr-prealert-review__approve,
.page-manager-brk-req-raise .mgr-brk-req-create-panel,
.page-manager-brk-req-raise .mgr-contracts-panel.mgr-brk-req-create-panel,
.page-manager-brk-req-raise .mgr-brk-req-create-submit {
    overflow: visible;
}

.page-manager-armed-response-requisition-detail .mgr-detail-fields.mgr-po-armed-req-overview-fields {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

.page-manager-armed-response-requisition-detail .mgr-detail-fields.mgr-po-armed-req-context-fields {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
}

@media (max-width: 960px) {
    .page-manager-armed-response-requisition-detail .mgr-detail-fields.mgr-po-armed-req-overview-fields,
    .page-manager-armed-response-requisition-detail .mgr-detail-fields.mgr-po-armed-req-context-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 480px) {
    .page-manager-armed-response-requisition-detail .mgr-detail-fields.mgr-po-armed-req-overview-fields,
    .page-manager-armed-response-requisition-detail .mgr-detail-fields.mgr-po-armed-req-context-fields {
        grid-template-columns: 1fr;
    }
}