*{box-sizing:border-box}body{margin:0;line-height:1.4}img{max-width:100%;max-height:100%;height:auto;display:block}input,textarea,select{width:100%;font:inherit}label{display:block;margin-bottom:2px}button{font:inherit;background-color:transparent;border:none;padding:0;cursor:pointer}button svg{vertical-align:middle}a{text-decoration:none;display:inline-block;color:inherit}svg{display:block}figure{margin:0}h1,h2,h3,h4,p{margin:0}.form-container{max-width:420px;margin:16px auto 0}.auth-form{padding:20px;display:flex;flex-direction:column;gap:1rem}.form-title{text-transform:capitalize}.form-desc{color:var(--gray-700)}header ul{padding:0;margin:0;list-style:none;display:flex;align-items:center}header ul li a{padding:5px 10px 5px 0}header ul li a.active{color:var(--purple-900)}header{margin-bottom:1rem;border-bottom:1px solid var(--gray-300)}header .container{display:flex;flex-direction:row;justify-content:space-between;position:relative;align-items:center}.profile-actions{display:flex;gap:16px;align-items:center}.cart{position:absolute;right:16px;max-width:400px;margin-left:auto;left:16px;top:4.5rem;display:flex;flex-direction:column;gap:17px}.cart h3,.cart h4{font-size:1.1rem}.cart h4{font-weight:500;border-top:1px solid var(--gray-300);padding-top:16px}.cart svg{color:var(--red-700)}.cart-item{display:flex;gap:16px;align-items:center}.cart-item img{border-radius:var(--border-radius);width:80px;height:80px;object-fit:cover}.cart-item .wrapper{display:flex;flex-direction:column;gap:4px}.cart-item .title{font-size:1.1rem}.cart-item .price,.cart-item .title{font-weight:500}.cart-item .category{color:var(--gray-500)}.cart-item button{margin-left:auto;align-self:flex-start}.social-auth-container{display:flex;align-items:center;gap:8px;margin-left:auto}.social-btns{display:flex;gap:10px}.social-btns img{width:25px;height:25px;border-radius:100%}.social-btn.btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;padding:5px;border-radius:100%}.social-btn.btn img{max-height:25px}.pfp{max-height:35px;border-radius:100%}body{font-family:Geist,sans-serif}:root{--border-radius: 10px;--card-spacing: 1rem;--purple-900: hsl(271, 81%, 46%);--purple-700: hsl(271, 81%, 56%);--purple-300: hsl(271, 81%, 86%);--red-900: hsl(0, 84%, 40%);--red-700: hsl(0, 84%, 60%);--green-900: hsl(142, 76%, 26%);--green-700: hsl(142, 76%, 36%);--gray-700: hsl(0, 0%, 20%);--gray-500: hsl(0, 0%, 50%);--gray-300: hsl(0, 0%, 85%);--gray-200: hsl(210, 40%, 90%);--gray-100: hsl(210, 40%, 96%);--gray-50: hsl(0, 0%, 97%);--white: hsl(0, 0%, 100%);--black: hsl(0, 0%, 0%)}html,body,#root{height:100%}#root{display:flex;flex-direction:column}#root main{flex-grow:1}#root main>div{padding-bottom:3rem}.container{max-width:960px;margin:0 auto;padding:var(--card-spacing)}.btn{border:none;padding:.5rem 1rem;border-radius:var(--border-radius);cursor:pointer;font:inherit}.btn-primary{background-color:var(--purple-700);color:var(--white)}.btn-danger{background-color:var(--red-700);color:var(--white)}.btn-icon{display:flex;justify-content:center;align-items:center;border:1px solid var(--gray-300);padding:10px;border-radius:100%}.btn-icon svg{width:18px;height:18px}.btn-primary:hover{background-color:var(--purple-900)}.btn-outline{border:1px solid var(--gray-300);background-color:var(--white);color:var(--gray-700)}.btn-outline:hover{background-color:var(--gray-100)}.btn-secondary{background-color:var(--gray-100);color:var(--black)}.btn-secondary:hover{background-color:var(--gray-50)}.card{padding:var(--card-spacing);border:1px solid var(--gray-300);border-radius:var(--border-radius);background-color:var(--white)}input,textarea,select{padding:.5rem;border:1px solid var(--gray-300);border-radius:var(--border-radius)}input,textarea,select,button{outline-color:var(--purple-900)}span{display:inline-block}.error{margin:2px 0;color:var(--red-700)}.badge{font-size:.75rem;padding:.25rem .7rem;border-radius:12px;display:inline-block}.badge-danger{background-color:var(--red-700);color:var(--white)}.badge-success{background-color:var(--green-700);color:var(--white)}.badge-secondary{background-color:var(--gray-100)}.badge-outline{border:1px solid var(--gray-300)}.page-title{margin-bottom:1.2rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-spinner{display:flex;justify-content:center;align-items:center;height:100%}.loading-spinner svg{width:100px;height:100px;color:var(--gray-300);animation:spin 2s linear infinite}.products-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,auto));gap:24px}.products-container img{border-radius:var(--border-radius)}.products-container .category{margin:8px 0;color:var(--gray-500)}.products-container .title{font-size:1.2rem;margin-top:1rem;font-weight:500}.price-col{display:flex;justify-content:space-between;gap:8px}.product-card img{height:230px;object-fit:cover;width:100%}.price-container{display:flex;align-items:center;gap:8px}.price-container .regular-price{font-size:1.2rem;font-weight:500}.price-container .sale-price{color:var(--gray-500);text-decoration:line-through}.reviews-container{display:flex;flex-direction:column;gap:32px;margin-top:1.5rem}.star-container{display:flex;gap:4px}.star-container svg{width:20px;height:20px}.review{display:flex;flex-direction:column;gap:8px}.review .title{font-weight:500}.review .description{color:var(--gray-700)}.review .btn-danger{margin-right:auto}.reviews-header{display:flex;align-items:center;gap:16px;margin-bottom:1rem;justify-content:space-between}.review-form{display:flex;gap:16px;flex-direction:column}.review-form .btn-container{display:flex;gap:8px;justify-content:flex-end}.review-form textarea{resize:vertical}.review-form .star-container{gap:0;margin-top:8px}.review-form .star-container button{padding:2px}.review-form .star-container svg{width:27px;height:27px}.product-container{display:flex;flex-direction:column;gap:16px}.product-container img{width:100%}.product-container .category{color:var(--gray-500)}.product-container .price{font-size:1.2rem;font-weight:500;margin:1rem 0}.product-container button{width:100%}.thumbnail img{border-radius:var(--border-radius);object-fit:contain}.thumbnail{max-height:300px}.quantity-container{display:flex;max-width:100px;text-align:center;gap:8px;margin:1rem 0;align-items:center}.quantity-container button{padding-left:0;padding-right:0;display:flex;align-items:center;justify-content:center}.quantity-container input{text-align:center;height:35px}.quantity-container input,.quantity-container button{flex:1}@media screen and (min-width: 800px){.product-container{flex-direction:row}.product-container .thumbnail{max-width:400px}.product-container .details{flex-grow:1}.product-container button{width:auto;margin-left:auto}}.divider{height:1px;background-color:var(--gray-200);margin:3rem auto}.product-form{max-width:600px;margin:0 auto;display:grid;gap:16px;grid-template-areas:"title" "category" "price" "sale-price" "img-url" "description" "save"}@media (min-width: 600px){.product-form{grid-template-columns:1fr 1fr;grid-template-areas:"title category" "price sale-price" "img-url img-url" "description description" "save save"}}.save{grid-area:save}.product-form button{margin-left:auto;margin-top:8px}button.save{margin-left:auto}.title{grid-area:title}.category{grid-area:category}.price{grid-area:price}.sale-price{grid-area:sale-price}.img-url{grid-area:img-url}.description{grid-area:description}.save{display:flex;justify-content:flex-end}
