/**
 * Clean Design Area Styles - No !important spam
 */

/* Product background image */
#cm-design-product-bg {
    max-width: 100%;
    max-height: 100%;
    display: block;
    position: relative;
    z-index: 0; /* najniższa warstwa dla obrazka produktu */
}

/* Design drop zone - positioned by JavaScript */
#cm-design-drop-zone {
    position: absolute;
    border: 2px dashed #007cba;
    background: rgba(255, 255, 255, 0.05);
    z-index: 100;
    box-sizing: border-box;
    min-width: 100px;
    min-height: 100px;
}

#cm-design-drop-zone:hover {
    background: rgba(0, 124, 186, 0.08);
    border-color: #005a87;
}

/* Canvas container */
.cm-canvas-container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Let Fabric.js handle canvas positioning */
#cm-design-drop-zone .canvas-container {
    position: relative;
    width: 100%;
    height: 100%;
}

/* Info tooltip */
.cm-design-area-info {
    position: absolute;
    bottom: -25px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,0.8);
    color: white;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 11px;
    white-space: nowrap;
    pointer-events: none;
}