body {
      background-color: #f8f9fa;
    }

    .fixed-controls {
      position: sticky;
      bottom: 0;
      background: white;
      padding: 1rem 0;
      z-index: 100;
    }

    .btn {
      min-width: 44px;
      min-height: 44px;
    }

    .alert {
      font-size: 0.9rem;
    }

    #video {
  border-radius: 0.5rem;
  max-width: 300px;
  width: 100%;
  height: auto;
  object-fit: contain;
  display: block;
}

/* Ensure the container size follows the video */
.camera-container {
  position: relative;
  display: inline-block; /* Shrinks to wrap the video */
}

/* Hide overlays by default */
.overlay-square,
.overlay-line {
  display: none;
  position: absolute;
  z-index: 10;
}

.overlay-square {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 150px;
  height: 150px;
  border: 2px solid blue;
}

.overlay-line {
  top: 50%;
  left: 0;
  transform: translateY(0); /* Adjust vertical position below square */
  width: 100%;
  height: 2px;
  background-color: blue;
}