.modal-content {
      background-color: #0c012c !important;
      color: white !important;
      border-radius: 10px;
      padding: 20px;
    }

    .modal-header {
      border-bottom: none;
    }


@media (max-width: 768px) {
    .hide-on-mobile {
        display: none;
    }




}







    .modal-header .btn-close {
      filter: invert(100%);
    }

    .modal-title {
      font-size: 1.5rem;
    }

    .qr-box {
      border: 3px solid green;
      margin: 20px auto;
      width: 250px;
      height: 250px;
      background-color: rgba(25, 0, 83, 0.322);
      position: relative;
    }

    video#videoPreview {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    /* Scanning line effect (blue) */
    .scanning-line {
        position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 6px; /* Thickness of the tube light */
      background: linear-gradient(90deg, rgba(0, 123, 255, 1) 0%, rgba(0, 255, 255, 0.7) 100%); /* Blue tube light gradient */
      box-shadow: 0 0 15px rgba(0, 123, 255, 0.8), 0 0 25px rgba(0, 255, 255, 0.6); /* Glowing effect */
      animation: scanEffect 2s linear infinite;
    }

    @keyframes scanEffect {
      0% {
        top: 0;
      }
      50% {
        top: 80%;
      }
      100% {
        top: 0;
      }
    }

    .modal-footer {
      border-top: none;
      justify-content: center;
    }

    .btn-custom {
      background-color: #2a2a72;
      color: white;
      border: none;
      padding: 10px 15px;
      border-radius: 5px;
    }

    .btn-custom:hover {
      background-color: #5656a2;
    }

    p#qrResult {
      color: #28a745;
      font-size: 1.2rem;
      font-weight: bold;
    }

    input[type="file"] {
      display: none;
    }

    .file-upload-btn {
      background-color: #2a2a72;
      color: white;
      border: none;
      padding: 10px 15px;
      border-radius: 5px;
    }
    .file-upload-btn:hover {
      background-color: #5656a2;
    }