body {
      background: #f5f7fa;
      font-family: "Segoe UI", Roboto, sans-serif;
      display: flex;
      flex-direction: column;
      min-height: 100vh;
    }
    h2 { font-weight: 600; }

    .qr-box {
      width: 85vw;
      max-width: 340px;
      aspect-ratio: 1/1;
      margin: auto;
      border-radius: 16px;
      background: #fff;
      position: relative;
      overflow: hidden;
    }
    #reader video {
      width: 100% !important;
      height: 100% !important;
      object-fit: cover;
      border-radius: 16px;
    }
    .scan-overlay {
      position: absolute;
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      width: 260px; height: 260px;
      border: 3px solid rgba(0, 123, 255, 0.9);
      border-radius: 12px;
      box-shadow: 0 0 0 9999px rgba(0,0,0,0.6);
      pointer-events: none;
      overflow: hidden;
      background: rgba(255, 255, 255, 0.1);
    }
    .scan-line {
      position: absolute;
      top: 0; left: 0;
      width: 100%; height: 2px;
      background: rgba(0, 123, 255, 0.9);
      animation: scanMove 2.5s linear infinite;
    }
    @keyframes scanMove {
      0% { top: 0; } 100% { top: 100%; }
    }
    #status { font-size: 1rem; color: #495057; }
    .btn { border-radius: 8px; font-weight: 500; min-width: 140px; }
    .btn-group-custom { gap: 0.6rem; }

    /* Switch en la esquina abajo-derecha del card */
    .continuous-switch {
      position: absolute;
      bottom: 10px;
      right: 14px;
      padding: 6px 12px;
      font-size: 0.85rem;
     
    }

    @media (max-width: 576px) {
      .qr-box { width: 90vw; max-width: 300px; }
      .scan-overlay { width: 220px; height: 220px; }
      .btn { width: 100%; }
      .btn-group-custom { flex-direction: column; gap: 0.4rem; }
    }
    .container { flex: 1; padding-bottom: 2rem; }


  .fade-out {
  opacity: 0;
  transition: opacity 1s ease; /* duración de la animación */
}


body {
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif; 
}