.image-crop-error {
    margin: 6px 0 0;
    color: #b42318;
    font-size: 13px;
}

.image-crop-thumb {
    display: block;
    width: 90px;
    height: 90px;
    object-fit: cover;
    margin-top: 8px;
    border: 1px solid #d6dadd;
    background: #fff;
}

.image-crop-modal {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(4, 52, 67, 0.72);
}

.image-crop-modal[hidden] {
    display: none;
}

.image-crop-dialog {
    width: min(720px, 100%);
    background: #fff;
    padding: 18px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
}

.image-crop-dialog h2 {
    margin: 0 0 12px;
    font-size: 18px;
    color: #043443;
}

.image-crop-stage {
    height: 360px;
    background: #111;
    overflow: hidden;
}

.image-crop-stage img {
    display: block;
    max-width: 100%;
}

.image-crop-tools,
.image-crop-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.image-crop-actions {
    justify-content: flex-end;
}

.image-crop-tools button,
.image-crop-actions button {
    border: 1px solid #0083ae;
    background: #fff;
    color: #0083ae;
    padding: 8px 14px;
    font: inherit;
    cursor: pointer;
}

.image-crop-actions #imageCropConfirm {
    background: #0083ae;
    color: #fff;
}

.image-crop-tools button:disabled,
.image-crop-actions button:disabled {
    opacity: 0.6;
    cursor: default;
}
