:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#000000de;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;font-size:16px;background-color:#f9f9f9}h1{color:#5a5a5a;text-align:center}.login-container{width:600px;height:40vh;margin:0 auto;padding:20px;background-color:#f9f9f9;border-radius:8px;box-shadow:0 4px 8px #0000001a;text-align:center}.login-page{display:flex;height:92vh;font-family:Arial,sans-serif}.login-container form{display:flex;flex-direction:column;gap:15px}.login-container input{padding:10px;font-size:1rem;border:1px solid #ccc;border-radius:5px;width:100%;box-sizing:border-box}.login-container input:focus{border-color:#4caf50;outline:none}.login-container button{text-decoration:none;color:#007bff;font-size:20px;border:none;margin:1vh auto;padding:8px 12px;border-radius:4px;transition:all .3s ease;cursor:pointer}.login-container button:hover{background-color:#007bff;color:#fff}.login-container .switch-btn{margin-top:10px;padding:8px 16px;background-color:#f1f1f1;color:#333;font-size:1rem;border:1px solid #ccc;border-radius:5px;cursor:pointer;transition:background-color .3s ease}.login-container .switch-btn:hover{background-color:#e9e9e9}.login-container .alert{color:red;font-size:.9rem;margin-top:15px}@media screen and (max-width: 768px){.login-container{flex:1;width:100%;height:100%;background-color:inherit}}.sidebar{display:flex;flex-direction:column;justify-content:space-between;align-items:center;width:60px;height:90vh;background-color:#f7f7f7;border-right:1px solid #ddd;padding:10px 0;box-shadow:2px 0 5px #0000001a}.sidebar-icons{display:flex;flex-direction:column;gap:20px}.sidebar-footer{margin-bottom:20px}.icon-btn{background:none;border:none;font-size:24px;color:#555;cursor:pointer;transition:all .3s ease;text-decoration:none}.icon-btn:focus{outline:none;color:inherit}.icon-btn:active{color:inherit}.icon-btn:hover{color:#ff4d4f}.github-btn{font-size:26px;color:#000}.book-container{border:1px solid #ccc;border-radius:8px;width:200px;height:90%;padding:10px;margin:10px;text-align:center;box-shadow:0 4px 6px #0000001a;display:flex;flex-direction:column;background-color:#fff}.book-image{width:100%;height:250px;border-radius:4px}.book-details{margin-top:10px;flex-grow:1}.book-details h3{font-size:1.2rem;margin:0}.book-details p{font-size:.9rem;margin:5px 0}.edit-button{background-color:#007bff;color:#fff;padding:8px 16px;border:none;border-radius:4px;text-decoration:none;transition:all .3s ease}.edit-button:hover{background-color:#0056b3;cursor:pointer}.filter-bar{margin-bottom:20px;display:flex;justify-content:center;align-items:center}.filter-select{padding:10px;font-size:16px;border:1px solid #ccc;border-radius:4px;width:200px;background-color:#fff;transition:border-color .3s ease}.filter-select:hover{border-color:#007bff}.my-books-container{flex:1;padding:20px;width:100%;display:flex;flex-direction:column;overflow-y:auto;box-shadow:0 4px 6px #0000001a}.my-books-page{display:flex;height:92vh;font-family:Arial,sans-serif}.my-books-container h2{text-align:center}.books-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.book-card{background-color:#fff;border-radius:8px;box-shadow:0 4px 6px #0000001a;overflow:hidden;width:100%;max-width:250px;display:flex;align-items:center;justify-content:center;transition:transform .3s ease,box-shadow .3s ease}.book-card:hover{transform:translateY(-10px);box-shadow:0 6px 12px #0003}.login-text{display:flex;flex:1;text-align:center;justify-content:center;align-items:center;margin:20px}.login-text a{margin:0 9px;text-decoration:none;color:#007bff;font-weight:700;transition:color .3s ease}.login-text a:hover{color:#0056b3}@media screen and (max-width: 620px){.login-text{display:flex;flex-direction:column}}.popup-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.popup-content{background-color:#fff;padding:20px;border-radius:8px;width:90%;max-width:400px;box-shadow:0 4px 6px #0000001a}.popup-content h3,.popup-content p{margin-bottom:20px;text-align:center}.popup-content form input,.popup-content form select{display:flex;flex-direction:column;width:100%;padding:8px;margin-top:5px;border:1px solid #ccc;border-radius:4px}.popup-content form input{width:96%}.popup-buttons{display:flex;flex-direction:column;justify-content:space-between;gap:10px;margin-top:20px}.cancel-button{background-color:#ccc;color:#333;border:none;padding:8px 16px;border-radius:4px;cursor:pointer}.save-button,.cancel-button,.delete-button{color:#007bff;background-color:#ccc;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;transition:all .3s ease}.save-button:hover{background-color:#007bff;color:#fff}.cancel-button:hover{background-color:#9c9c9c}.delete-button:hover{background-color:#dc3545;color:#fff}@media screen and (max-width: 620px){.popup-content h1{font-size:1.5rem}.popup-content h3{margin-bottom:20px;text-align:center;font-size:1rem}.popup-content p{margin-bottom:20px;text-align:center;font-size:.8rem}.popup-content form input,.popup-content form select{padding:5px;margin-top:5px;border:1px solid #ccc;border-radius:4px}.popup-content label{font-size:.9rem}.popup-content{width:65%;padding:15px}}.add-book-container{flex:1;line-height:1.6;width:600px;height:40vh;margin:0 auto;padding:20px}.add-book-form{margin:0 auto;padding:20px;max-width:600px;background:#fff;border-radius:8px;box-shadow:0 4px 6px #0000001a}.add-book-form h2{text-align:center}.add-book-form input[type=text],.add-book-form input[type=number],.add-book-form select{box-sizing:border-box;width:100%;padding:10px;margin:10px 0;border:1px solid #ccc;border-radius:4px;font-size:16px}.add-book-form label{display:block;margin:10px 0 5px;font-weight:700;color:#5a5a5a}.add-book-form button{width:100%;background:#007bff;color:#fff;padding:10px;border:none;border-radius:4px;font-size:16px;cursor:pointer;transition:background .3s ease}.add-book-form button:hover{background:#0056b3}.add-book-form .suggestions-list{list-style:none;margin:0;padding:0;max-height:400px;overflow-y:auto;border:2px solid #ccc;border-radius:4px;background:#f9f9f9}.add-book-form .suggestions-list.empty{border:0px}.add-book-form .suggestions-list li{padding:10px;cursor:pointer;border-bottom:1px solid #ddd}.add-book-form .suggestions-list li:hover{background:#e9ecef}.add-book-form .suggestions-list li:last-child{border-bottom:none}.add-book-form h3,.add-book-details{margin-top:20px;color:#5a5a5a;justify-content:center;display:flex}.add-book-form p{margin:10px 0;color:#333}.add-book-image{width:50%;height:100%;border-radius:8px;display:block;margin:0 auto}.add-book-page{display:flex;height:92vh;font-family:Arial,sans-serif}.trending-books{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.book-card{padding:15px;width:100%;background-color:#fff;border:1px solid #dcdcdc;text-align:center;transition:transform .2s ease}.home-container{display:flex;height:92vh;font-family:Arial,sans-serif}.main-content{flex:1;padding:20px;overflow-y:auto}.main-content h1{text-align:center;margin-bottom:20px}.navbar{display:flex;justify-content:space-between;align-items:center;background-color:#f8f9fa;padding:15px 30px;box-shadow:0 2px 5px #0000001a}.site-name{font-size:1.8rem;font-weight:700;color:#333;margin:0}.navbar ul{list-style:none;display:flex;margin:0;padding:0;align-items:center;gap:15px}.navbar ul li{font-size:1rem;font-weight:500;color:#333}.navbar ul li a{text-decoration:none;color:#007bff;padding:8px 12px;border-radius:4px;transition:all .3s ease}.navbar ul li a:hover{background-color:#007bff;color:#fff}.navbar ul li:first-child{margin-right:auto}.navbar ul li span{font-weight:700;color:#555}.logout-link{background-color:#fff;color:#fff;padding:8px 15px;border:none;border-radius:4px;text-decoration:none;transition:all .3s ease}@media (max-width: 550px){.navbar{padding:15px}.site-name{font-size:1.2rem}.navbar ul{gap:5px}.navbar ul li{font-size:.9rem}}