/* ========================================
   QR SCANNER - VERSIÓN SIMPLIFICADA
   ======================================== */

/* Contenedor principal */
#qr-reader-config,
#qr-reader-cosechero {
    width: 100%;
    max-width: 100%;
    position: relative;
    background: #000;
    border-radius: 8px;
    overflow: hidden;
}

/* Video - ocupa todo el espacio */
#qr-reader-config video,
#qr-reader-cosechero video {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    max-width: 100% !important;
}

/* Canvas - superpuesto sobre el video */
#qr-reader-config canvas,
#qr-reader-cosechero canvas {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 2 !important;
    pointer-events: none !important;
}

/* Ocultar elementos UI no deseados */
#qr-reader-config > div:not(:has(video)):not(:has(canvas)),
#qr-reader-cosechero > div:not(:has(video)):not(:has(canvas)) {
    display: none !important;
}

/* Móvil */
@media (max-width: 768px) {
    #qr-reader-config,
    #qr-reader-cosechero {
        min-height: 300px;
        max-height: 500px;
    }
}

/* Desktop */
@media (min-width: 769px) {
    #qr-reader-config,
    #qr-reader-cosechero {
        max-width: 500px;
        margin: 0 auto;
    }
}