.video-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 20px 0;
    position: relative;
}

#qr_video_container, #ticket_video_container {
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}

#qr_video_container { width: 200px; height: 200px; }
#ticket_video_container { width: 350px; height: 100px; }

#qr_video, #ticket_video {
    width: 90%; height: 90%; object-fit: cover; z-index: 2;
}

#qr_video_overlay, #ticket_video_overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 1;
}

.corner-marker, .barcode-corner-marker {
    position: absolute; width: 30px; height: 30px; border: 3px solid white; z-index: 3;
}

.top-left { top: 10%; left: 10%; border-right: none; border-bottom: none; }
.top-right { top: 10%; right: 10%; border-left: none; border-bottom: none; }
.bottom-left { bottom: 10%; left: 10%; border-right: none; border-top: none; }
.bottom-right { bottom: 10%; right: 10%; border-left: none; border-top: none; }

.barcode-top-left { top: 5%; left: 5%; border-right: none; border-bottom: none; }
.barcode-top-right { top: 5%; right: 5%; border-left: none; border-bottom: none; }
.barcode-bottom-left { bottom: 5%; left: 5%; border-right: none; border-top: none; }
.barcode-bottom-right { bottom: 5%; right: 5%; border-left: none; border-top: none; }

#output { margin-top: 20px; font-size: 1.2em; text-align: center; }
.input-group .input-group-addon { cursor: pointer; }
#confirmBtnQR, #confirmBtnTicket { display: none; margin-top: 20px; }

.ticket-input-group .ticket-icon-container {
    position: absolute;
    top: 50%;
    right: 10px; /* Adjust this value to position the icon inside the input */
    transform: translateY(-50%);
    color: #000000; /* Adjust color if needed */
    cursor: pointer;
    font-size: 1.2em; /* Adjust font size for the icon */
}

.ticket-input-group .form-control {
    padding-right: 2.5em; /* Ensure space for the icon inside the input */
}

.ikea-input-group .ikea-icon-container {
    position: absolute;
    top: 50%;
    right: 10px; /* Adjust this value to position the icon inside the input */
    transform: translateY(-50%);
    color: #000000; /* Adjust color if needed */
    cursor: pointer;
    font-size: 1.2em; /* Adjust font size for the icon */
}
