body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.home{padding:20px}.hero,.home{text-align:center}.hero{background:url(/cpsc449projectMechaKeys/static/media/hero.37d77ed65ec267634d37.jpg) no-repeat 50%/cover;color:#fff;padding:100px 20px}.hero h1{font-size:36px;font-weight:700}.hero p{font-size:25px;margin:10% 0}.hero .cta-button{background-color:#1a1a2e;border-radius:8px;color:#fff;padding:12px 24px;text-decoration:none;transition:.3s ease-in-out}.hero .cta-button:hover{background-color:#000}.content-section{align-items:center;background-color:#1a1a2e;border-radius:15px;box-shadow:0 4px 8px #0003;display:flex;margin:40px auto;max-width:900px;overflow:hidden}.content-section img{height:auto;object-fit:cover;width:50%}.content-section div{padding:40px;width:50%}.content-section h2{color:#fff;font-size:24px;font-weight:700}.content-section p{color:#d1d1d1;font-size:16px;margin:25px 0}.content-section .cta-button{background-color:#fff;border-radius:8px;color:#1a1a2e;display:inline-block;font-size:16px;font-weight:700;padding:10px 20px;text-decoration:none;transition:.3s ease-in-out}.content-section .cta-button:hover{background-color:#ddd}.keyboard-page{color:#fff;padding:20px}.keyboard-page h1{margin:0 0 10px;text-align:center}.keyboard-page p{margin-bottom:20px;text-align:center}.keyboard-grid{grid-gap:20px;display:grid;flex:3 1;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.keyboard-card{background-color:#353594;border-radius:8px;box-shadow:0 4px 6px #0000001a;cursor:pointer;overflow:hidden;text-align:center;transition:transform .2s}.keyboard-card:hover{transform:translateY(-5px)}.image-container{background-color:#fff;height:200px;object-fit:cover;width:100%}.keyboard-image{height:200px;object-fit:contain;width:100%}.keyboard-details{color:#fff;padding:15px}.keyboard-details h2{font-size:1.2em;margin:0 0 10px}.keyboard-price{color:#fff;font-weight:700;margin:5px 0}.keyboard-color,.keyboard-connectivity,.keyboard-rating{font-size:.9em;margin:3px 0}.modal-content{max-height:95vh;overflow-y:auto;padding:10px}.modal-content::-webkit-scrollbar{width:6px}.modal-content::-webkit-scrollbar-thumb{background-color:#fff3;border-radius:3px}.modal-image{height:100px;width:20%}.login-container{background-color:#212177;display:flex;flex-direction:column;margin:auto;padding:15px;text-align:center;width:25%}.login-container p{margin:10px 0}.login-container form{height:auto}.login-container input{height:20px;margin:10px;width:50%}.login-container button{background-color:#15023e;border:none;border-radius:8px;color:#fff;cursor:pointer;margin:20px 0;padding:10px;width:100%}.login-container img{height:30px;margin:auto;width:30px}.signup-container{background-color:#212177;display:flex;flex-direction:column;margin:auto;text-align:center;width:30%}.signup-container form{align-items:center;display:flex;flex-direction:column}.signup-container input{height:20px;margin:10px;width:50%}.signup-container button{background-color:#15023e;border:none;border-radius:8px;color:#fff;cursor:pointer;margin:20px 0;padding:10px;width:70%}.signup{color:#fff;margin:auto}.signup-container img{height:30px;margin:auto;width:30px}.switch-page{color:#fff;padding:20px}.switch-page h1{margin:0 0 10px;text-align:center}.switch-page p{margin-bottom:20px;text-align:center}.content-wrapper{background-color:grey;margin-left:15%;max-width:70%}.switch-grid{grid-gap:20px;display:grid;flex:3 1;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.switch-card{background-color:#353594;border-radius:8px;box-shadow:0 4px 6px #0000001a;cursor:pointer;overflow:hidden;text-align:center;transition:transform .2s}.switch-card:hover{transform:translateY(-5px)}.switch-image{height:200px;object-fit:contain;width:100%}.switch-details{background-color:#353594;color:#fff;padding:15px}.switch-details h2{font-size:1.2em;margin:0 0 10px}.switch-price{color:#fff;font-weight:700;margin:5px 0}.switch-color,.switch-connectivity,.switch-rating{font-size:.9em;margin:3px 0}.cart-section{background-color:#efefef;max-height:400px;padding:15px}.cart-section h2{margin-bottom:10px}.cart-section ul{padding:0}.checkout-button{margin-top:10px;width:100%}.close-button{background:#230b75}.save-button{background:#653be3}.accessory-page{color:#fff;padding:20px}.accessory-page h1{margin:0 0 10px;text-align:center}.accessory-page p{margin-bottom:20px;text-align:center}.filters{display:flex;gap:20px;justify-content:center;margin-bottom:20px}.filters input,.filters select{border:1px solid #ccc;border-radius:4px;padding:8px}.content-wrapper{border-radius:8px;display:flex;height:400px;margin:auto;max-width:60%}.accessory-grid{grid-gap:20px;display:grid;flex:3 1;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.accessory-card{background-color:#353594;border-radius:8px;box-shadow:0 4px 6px #0000001a;cursor:pointer;overflow:hidden;text-align:center;transition:transform .2s}.accessory-card:hover{transform:translateY(-5px)}.accessory-image{height:200px;object-fit:contain;width:100%}.accessory-details{color:#fff;padding:15px}.accessory-details h2{font-size:1.2em;margin:0 0 10px}.accessory-price{color:#fff;font-weight:700;margin:5px 0}.accessory-color,.accessory-connectivity,.accessory-rating{font-size:.9em;margin:3px 0}.cart-section{background-color:#fff;border-radius:8px;box-shadow:0 4px 6px #0000001a;color:#000;flex:1 1;overflow-y:auto}.cart-section h2{margin:30px 0}.cart-section h2,.cart-section p{text-align:center}.cart-section ul{list-style:none;padding:0 20px}.cart-section li{align-items:center;display:flex;justify-content:space-between;margin-bottom:10px}.cart-section button{align-items:center;max-width:30%}.cart-section button,.checkout-button{background:#3f15c6;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:8px}.checkout-button{display:block;margin:30px auto 0;width:fit-content}.modal-overlay{align-items:center;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.modal-content{background:#19045d;border-radius:8px;color:#fff;max-width:500px;padding:20px;position:relative;text-align:center;width:90%}.close-button{background:#3f15c6;border:none;border-radius:50%;color:#fff;cursor:pointer;height:25px;position:absolute;right:10px;top:10px;width:25px}.modal-image{height:200px;margin-bottom:15px;object-fit:cover;width:100%}.modal-form label{display:block;margin-bottom:10px}.modal-form select{border:1px solid #ccc;border-radius:4px;margin-bottom:15px;margin-top:5px;padding:8px;width:100%}.save-button{background:#3f15c6;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:10px 15px}.review-section{background:#28287b;border-radius:4px;margin-top:20px}.review-section h3{margin-bottom:10px}.review-section form{display:flex;flex-direction:column;gap:10px}.review-section input{border:1px solid #ccc;border-radius:4px;padding:5px}.review-section button{background:#653be3;border:none;border-radius:4px;color:#fff;cursor:pointer;padding:5px 10px}.settings-container{background-color:#212177;display:flex;flex-direction:column;margin:auto;padding:15px;text-align:center;width:50%}.settings-container p{margin:10px 0}.settings-container form{height:auto}.settings-container input{height:20px;margin:10px;width:50%}.settings-container button{background-color:#15023e;border:none;border-radius:8px;color:#fff;cursor:pointer;margin:20px 0;padding:10px;width:50%}.history-container{background-color:#212177;border-radius:8px;margin:auto;padding:20px;width:60%}.order-list{list-style:none;padding:0}.order-item{align-items:center;background-color:#1a1a40;border-radius:8px;display:flex;margin-bottom:20px;padding:15px}.order-thumb{border-radius:4px;height:auto;margin-right:20px;width:100px}.App-layout{display:flex;flex-direction:column;min-height:100vh}body{background-color:#19045d;color:#fff;font-family:Arial,sans-serif;height:100%;margin:0;padding:0}.container{background:#19045d;flex:1 1;padding:20px}.navbar{align-items:center;background-color:#0c0130;display:flex;justify-content:space-between;padding:15px 30px}.navbar h2{margin:0 auto 0 0}.logo img{height:30px;margin-right:20px}.nav-links{display:flex;gap:20px}.nav-links a{color:#fff;font-size:16px;font-weight:700;text-decoration:none;transition:color .3s}.nav-links a:hover{color:#4e5bed}.featured{margin-top:40px}.featured h2{font-size:2rem;margin-bottom:20px}.product-grid{display:flex;gap:20px;justify-content:center}.product{background:#fff;border-radius:10px;box-shadow:0 4px 6px #0000001a;padding:15px}.product img{border-radius:5px;width:100%}.product p{font-size:16px;margin-top:10px}.logout-button{background-color:initial;border:1px solid #fff;border-radius:5px;color:#fff;cursor:pointer;font-size:16px;margin-left:10px;padding:8px 16px;transition:background .3s,color .3s}.logout-button:hover{background-color:#fff;color:#333}.user-menu{display:inline-block;position:relative}.user-icon{background-color:#fff;border-radius:50%;cursor:pointer;height:25px;width:25px}.user-icon:hover{background-color:#4e5bed}.dropdown-menu{background-color:#0c0130;border:1px solid #4e5bed;border-radius:8px;box-shadow:0 8px 16px #00000040;display:flex;flex-direction:column;min-width:150px;padding:10px;position:absolute;right:0;top:50px;z-index:1000}.dropdown-menu a,.dropdown-menu button{background:none;border:none;color:#fff;cursor:pointer;font-size:14px;padding:8px 12px;text-align:center;transition:background .2s}.dropdown-menu button:hover{color:#4e5bed}.footer{background:#0c0130;color:#fff;padding:15px;text-align:center}.footer p{margin:0 0 10px}.footer a{color:#fff;margin:0 10px;text-decoration:none}.footer a:hover{color:#0056b3}
/*# sourceMappingURL=main.3f48eb4a.css.map*/