.gf-image-marker-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
}

#imageCanvas {
    border: 2px solid #000;
    cursor: crosshair;
}

#resetCanvas, #undoCanvas {
    margin-top: 10px;
    padding: 8px 12px;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 14px;
    border-radius: 5px;
}

#resetCanvas {
    background-color: #ff4d4d;
}

#resetCanvas:hover {
    background-color: #cc0000;
}

#undoCanvas {
    background-color: #4d94ff;
}

#undoCanvas:hover {
    background-color: #0066cc;
}

.update-size-button, .match-aspect-button {
    margin-top: 5px;
    padding: 6px 10px;
    background-color: #4CAF50;
    color: white;
    border: none;
    cursor: pointer;
    font-size: 12px;
    border-radius: 3px;
}

.update-size-button:hover {
    background-color: #45a049;
}

.match-aspect-button {
    background-color: #ff9800;
}

.match-aspect-button:hover {
    background-color: #e68a00;
}

.gf-image-marker-container img, 
.gf-image-marker-container canvas {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    pointer-events: auto;
}

.gf-image-marker-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
}

.marker-buttons {
    margin-top: 10px;
    display: flex;
    gap: 10px;
}

.gf-image-marker-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 20px;
}

.marker-buttons {
    margin-top: 10px;
    display: flex;
    gap: 10px;
}