.scanner-container {
    position: relative;
    width: 100%;
    max-width: 400px;
    aspect-ratio: 4 / 3;
    border: 1px solid gray;
    overflow: hidden;
}

    .scanner-container video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

/* Overlay 4 góc */
.scan-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none; /* không chặn thao tác camera */
}

    .scan-overlay .corner {
        position: absolute;
        width: 40px;
        height: 40px;
        border: 4px solid white;
    }

.corner.tl {
    top: 10px;
    left: 10px;
    border-right: none;
    border-bottom: none;
}

.corner.tr {
    top: 10px;
    right: 10px;
    border-left: none;
    border-bottom: none;
}

.corner.bl {
    bottom: 10px;
    left: 10px;
    border-right: none;
    border-top: none;
}

.corner.br {
    bottom: 10px;
    right: 10px;
    border-left: none;
    border-top: none;
}