/* Make every temporarily locked or disabled action visibly unavailable. */
button:disabled,
button[aria-disabled="true"],
button[data-npn-click-locked="1"],
input[type="button"]:disabled,
input[type="button"][data-npn-click-locked="1"],
input[type="submit"]:disabled,
input[type="submit"][data-npn-click-locked="1"],
input[type="image"]:disabled,
input[type="image"][data-npn-click-locked="1"],
a[data-npn-click-locked="1"],
[role="button"][aria-disabled="true"],
[role="button"][data-npn-click-locked="1"] {
    background: linear-gradient(135deg, #475569, #64748b) !important;
    border-color: #64748b !important;
    box-shadow: none !important;
    color: #e2e8f0 !important;
    cursor: not-allowed !important;
    filter: grayscale(1) !important;
    opacity: 0.78 !important;
    pointer-events: none !important;
    text-shadow: none !important;
    transform: none !important;
}

/* Remove the animated turquoise shine from the locked Save this Request button. */
.npn-order-detail-save:disabled::before,
.npn-order-detail-save[aria-disabled="true"]::before,
.npn-order-detail-save[data-npn-click-locked="1"]::before {
    display: none !important;
}

/* Show an explicit working indicator only while a Save request is running. */
.npn-order-detail-save.is-loading,
.npn-order-detail-save.is-loading:hover {
    cursor: wait !important;
    pointer-events: auto !important;
}

.npn-order-detail-save.is-loading::after {
    animation: npn-save-button-spin 0.7s linear infinite;
    border: 2px solid rgba(226, 232, 240, 0.42);
    border-radius: 50%;
    border-top-color: #ffffff;
    content: "";
    display: inline-block;
    height: 16px;
    margin-left: 10px;
    position: relative;
    top: 3px;
    width: 16px;
    z-index: 2;
}

/* The whole order area reports that Save is still being processed. */
[data-npn-order-detail].npn-project-save-running,
[data-npn-order-detail].npn-project-save-running * {
    cursor: wait !important;
}

@keyframes npn-save-button-spin {
    to {
        transform: rotate(360deg);
    }
}
