/* Lock the image column size */
.grid-body .grid-static-col[data-fieldname="custom_item_image"] {
    width: 50px !important;
    padding: 0 !important;
    overflow: hidden;
}

/* Inner container for the image */
.grid-body .grid-static-col[data-fieldname="custom_item_image"] .static-area {
    height: 100% !important;
    width: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 4px;
    box-sizing: border-box;
}

/* Image scaling */
.grid-body .grid-static-col[data-fieldname="custom_item_image"] img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    display: block;
}

/* Keep thumbnail visible when row is selected (edit mode) */
.grid-row .col[data-fieldname="custom_item_image"] .field-area {
    display: none !important; /* Always hide the input */
}

.grid-row .col[data-fieldname="custom_item_image"] .static-area {
    display: flex !important; /* Always show the image */
    align-items: center;
    justify-content: center;
}
