@import"https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap";:root{--color-primary: #66ae9b;--color-primary-light: #84c0b0;--color-text: #dee2e6;--color-text-dark: #465d74;--color-background-body: #e0eae6;--color-background-section: #c3d5d0;--color-background-button: #559483;--color-alert-primary: #f8d7da;--color-alert-secondary: #f5c6cb;--color-loader: #aab745;--color-delete-button: #e26161}*{margin:0;padding:0;box-sizing:border-box}html{font-size:62.5%}body{font-family:Open Sans,sans-serif;color:var(--color-text);background-color:var(--color-background-body);padding:2.4rem}main{margin-top:2.4rem;height:calc(100vh - 7.2rem - 3 * 2.4rem);display:flex;gap:2.4rem;justify-content:center}.nav-bar{display:flex;justify-content:space-between;align-items:center;height:7.2rem;padding:0 3.2rem;background-color:var(--color-primary);border-radius:.9rem}h1{font-size:3rem;font-weight:600}.search{border:none;padding:1.1rem 1.6rem;font-size:1.8rem;border-radius:.7rem;width:40rem;transition:all .3s;color:var(--color-text);background-color:var(--color-primary-light)}.search::placeholder{color:var(--color-text-dark)}.search:focus{outline:none;box-shadow:0 2.4rem 2.4rem #0000001a;transform:translateY(-2px)}.num-results{font-size:1.8rem}.section{width:50rem;background-color:var(--color-background-section);border-radius:.9rem;color:var(--color-text-dark);overflow:scroll;position:relative}h2{padding:5rem 2rem}.btn{height:3rem;background-color:var(--color-background-button);color:var(--color-text);cursor:pointer;font-size:1.4rem;font-weight:700;border:none}.btn-toggle{position:absolute;top:.8rem;right:.8rem;aspect-ratio:1;border-radius:50%;z-index:2}.loader{align-content:center;border:16px solid var(--color-background-body);border-top:16px solid var(--color-loader);border-radius:50%;width:120px;height:120px;animation:spin 2s linear infinite;position:absolute;top:3rem;left:40%}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.list{list-style:none;padding:.8rem 0;overflow:scroll}.list li{position:relative;display:grid;grid-template-columns:5rem 1fr;grid-template-rows:auto auto;column-gap:2.4rem;font-size:1.6rem;align-items:center;min-height:14rem;padding:1.6rem 3.2rem;border-bottom:1px solid var(--color-primary)}.list li:last-child{border-bottom:none}.list.list-books li{cursor:pointer;transition:all .3s}.list.list-books li:hover{background-color:var(--color-background-button);color:var(--color-text)}.list-books li .description button{background-color:var(--color-background-body);color:var(--color-text-dark)}.list img{width:100%;grid-row:1 /4}.list h3{font-size:1.6rem;display:-webkit-box;text-overflow:ellipsis;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}.list h4{margin-top:.5rem;font-size:1.4rem;font-weight:400;display:-webkit-box;text-overflow:ellipsis;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:1}.release-date{display:flex;align-items:center;gap:2.4rem}.list p{display:flex;align-items:center;gap:.8rem}.description{padding:2rem 1rem;grid-column:1 / -1;text-align:justify}.description h3{padding:0 0 2rem}.text-btn{margin-top:2rem;padding:0 1rem;border-radius:2rem;border:1px solid var(--color-background-button)}.alert-container{position:fixed;top:1rem;right:1rem;background-color:var(--color-alert-primary);color:var(--color-text-dark);border:1px solid var(--color-alert-secondary);border-radius:5px;padding:1.5rem 2rem;max-width:300px;z-index:1}.alert-message{margin-bottom:1rem;font-size:1.6rem}.alert-close-btn{background-color:transparent;border:none;cursor:pointer;font-size:1.6rem;position:absolute;top:.5rem;right:.5rem}.summary{position:sticky;top:0;display:grid;grid-template-rows:3fr 1fr auto;grid-template-columns:2fr 1fr;background-color:inherit;align-items:center;justify-items:center;min-height:28rem;border-bottom:1px solid var(--color-primary);font-size:1.6rem;z-index:1}.summary h2{grid-column:1/-1}.btn-remove{position:absolute;top:.5rem;right:1rem;aspect-ratio:1;border-radius:50%;background-color:var(--color-delete-button);color:var(--color-text);height:2.5rem;font-size:2rem}.summary .text-btn{grid-column:2/-1;margin-top:0;margin-bottom:.5rem}.no-price{margin-left:2rem}.statistics{grid-column:1/-1}.statistics h2{padding:2rem}.statistics li{list-style:circle;padding:1rem 2rem 1rem 3rem}.statistics li:last-child{padding-top:0}@media screen and (max-width: 60em){.search{width:30rem}.summary{font-size:1.4rem}}@media screen and (max-width: 46.25em){.nav-bar{flex-direction:column;height:auto;align-items:end}h1{align-self:flex-start;font-size:2.4rem}.search{margin-top:1rem;width:max-content;font-size:1.6rem}.num-results{margin:1rem 0;font-size:1.4rem}}@media screen and (max-width: 37.5em){.alert-container{top:2.4rem;right:2.1rem}main{flex-direction:column;height:fit-content}.list li{column-gap:1.2rem;align-items:center;min-height:7rem;padding:1.6rem 3.2rem}.section:first-child{max-height:50rem}.section{width:100%;min-height:30rem;overflow-y:auto}.summary{height:14rem;font-size:1.2rem}.summary h2{padding:1rem 1.5rem}}@media screen and (max-width: 21em){.search{max-width:95%}}