.qrComponent{display:flex;justify-content:center;align-items:center;min-height:100vh;background-image:linear-gradient(to right top,#d16ba5,#c777b9,#ba83ca,#aa8fd8,#9a9ae1,#8aa7ec,#79b3f4,#69bff8,#52cffe,#41dfff,#46eefa,#5ffbf1);margin:-8px;font-family:Signika Negative,sans-serif;gap:20px}.qrComponent__card{background-color:#ffffff1a;border-radius:8px;box-shadow:0 4px 6px #0000001a;padding:20px;width:35vw;display:flex;flex-direction:column;align-items:center}.qrComponent__card-h1{color:#333;font-size:2.2rem;margin-bottom:20px;padding:0 0 20px}.qrComponent__card-input{width:90%;padding:10px;margin-bottom:10px;border:1px solid #ccc;border-radius:8px;background-color:#ffffff63;color:#000;font-size:1rem}.qrComponent__containerSelect{display:flex;align-items:center;width:33vw;padding:20px 0 0}.qrComponent__card-label{color:#333;font-size:1.2rem;width:40vw}.qrComponent__card-select{width:35vw;padding:10px;border:1px solid #ccc;border-radius:8px;background-color:#ffffff63;color:#00000085;font-size:1rem;cursor:pointer}.qrComponent__card-button{background-color:#007bff28;color:#000;border:none;padding:10px 20px;border-radius:5px;cursor:pointer;transition:background-color .3s ease;margin:20px;font-size:1rem;font-weight:500}.qrComponent__card-button:hover{background-color:#1378e4;color:#fff}.qrComponent__card-qrCode{padding:10px;background-color:#fff}.qrComponent__qr{display:flex;justify-content:center;align-items:center;gap:20px}.qrComponent__buttons{display:flex;flex-direction:column}.qrComponent__buttons-button{background-color:#007bff28;color:#000;border:none;padding:10px 20px;border-radius:5px;cursor:pointer;transition:background-color .3s ease;margin:20px;font-size:1rem;font-weight:500}.qrComponent__buttons-button:hover,.qrComponent__buttons-button-img:hover{background-color:#1378e4;color:#fff}.alert__container{display:flex;justify-content:center}.alert{background-color:#ff0000e6;color:#fff;padding:10px;border-radius:5px;text-align:center;margin-bottom:10px;display:none;width:auto;box-shadow:0 4px 6px #0006;justify-content:space-around}.alert.show{display:block}@media (min-width: 769px) and (max-width: 1024px){.qrComponent__card{width:80vw}.qrComponent__card-h1{font-size:2.1rem}.qrComponent__containerSelect{width:75vw}}@media (min-width: 481px) and (max-width: 768px){.qrComponent__card{width:80vw}.qrComponent__card-h1{font-size:2rem}.qrComponent__containerSelect{width:75vw}}@media (max-width: 480px){.qrComponent__card{width:80vw}.qrComponent__card-h1{font-size:1.7rem}.qrComponent__containerSelect{width:77vw}}