*,:after,:before{box-sizing:border-box;margin:0;padding:0}body,html{height:100%}body{background-color:#edecec;font-family:Arial,Helvetica,sans-serif}.books-header{margin:1rem;gap:2rem;justify-content:flex-start}.books-header,.selectore-form{display:flex;align-items:center}.selectore-form{justify-content:center;gap:.5rem}li,ul{list-style-type:none}li>*{padding:.25rem}.link-container{display:flex;gap:1rem}.link-container a{text-decoration:none;color:inherit}.link{background-color:#aaa;border:2px solid #8c8c8c;display:flex;text-align:center;border-radius:5px;padding:.5rem;font-size:1rem}.book-type-wrapper{display:flex;gap:.75rem;list-style:none}.grid-2-col{grid-template-columns:repeat(2,1fr);align-items:center;grid-gap:.5rem}.grid-2-col,.grid-3-col{display:grid;justify-items:center;gap:.5rem}.grid-3-col{grid-template-columns:repeat(3,1fr);align-items:start;grid-gap:.5rem}button{background-color:#aaa;border:2px solid #8c8c8c;color:#000;border-radius:5px;padding:.5rem;font-size:1rem;cursor:pointer}.link:where(:hover,:focus),button:focus,button:hover{background-color:#c8c8c8}.link-active,button:disabled{background-color:#f0f0f0;cursor:none;pointer-events:none}.content-mannager button,.layout-update-btn{position:fixed;bottom:0;left:0}.layout-unit{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:.25rem;gap:.25rem}.layout-li{border:1px solid #8c8c8c;border-radius:5px;margin-bottom:1rem}.unit__input{width:100%}.header-wrapper{display:flex;gap:.5rem;justify-content:center;align-items:center}.login-heading,.register-heading{text-align:center;margin-block:1rem}.login-page,.register-page{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:2rem}.login-page .login-form,.login-page .register-form,.register-page .login-form,.register-page .register-form{display:flex;flex-direction:column;justify-content:center;align-items:center;border:1px solid #000;border-radius:5px;padding:1rem;min-width:30rem}@media(max-width:30rem){.login-page .login-form,.login-page .register-form,.register-page .login-form,.register-page .register-form{min-width:100%}}.login-page .login-form .field-container,.login-page .register-form .field-container,.register-page .login-form .field-container,.register-page .register-form .field-container{display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:5px;padding-inline:.5rem;min-width:100%}.login-page .login-form .field-container+.field-container,.login-page .login-form .field-container+.input-wrapper,.login-page .register-form .field-container+.field-container,.login-page .register-form .field-container+.input-wrapper,.register-page .login-form .field-container+.field-container,.register-page .login-form .field-container+.input-wrapper,.register-page .register-form .field-container+.field-container,.register-page .register-form .field-container+.input-wrapper{margin-top:1rem}.login-page .login-form .field-container .input-wrapper,.login-page .register-form .field-container .input-wrapper,.register-page .login-form .field-container .input-wrapper,.register-page .register-form .field-container .input-wrapper{display:flex;justify-content:space-between;align-items:center;gap:.5rem;background-color:#fbfbfb}@media(max-width:30rem){.login-page .login-form .field-container .input-wrapper,.login-page .register-form .field-container .input-wrapper,.register-page .login-form .field-container .input-wrapper,.register-page .register-form .field-container .input-wrapper{flex-direction:column;justify-content:center;align-items:flex-start}}.login-page .login-form .field-container .input-wrapper:focus-within,.login-page .register-form .field-container .input-wrapper:focus-within,.register-page .login-form .field-container .input-wrapper:focus-within,.register-page .register-form .field-container .input-wrapper:focus-within{outline:1px solid gray}.login-page .login-form .field-container .input-wrapper:has(.valid),.login-page .register-form .field-container .input-wrapper:has(.valid),.register-page .login-form .field-container .input-wrapper:has(.valid),.register-page .register-form .field-container .input-wrapper:has(.valid){outline:2px solid #377f37}.login-page .login-form .field-container .input-wrapper:has(.invalid),.login-page .register-form .field-container .input-wrapper:has(.invalid),.register-page .login-form .field-container .input-wrapper:has(.invalid),.register-page .register-form .field-container .input-wrapper:has(.invalid){outline:2px solid #7f3737}.login-page .login-form .field-container .input-wrapper:has(.show-password),.login-page .register-form .field-container .input-wrapper:has(.show-password),.register-page .login-form .field-container .input-wrapper:has(.show-password),.register-page .register-form .field-container .input-wrapper:has(.show-password){position:relative}.login-page .login-form .field-container .input-wrapper input,.login-page .register-form .field-container .input-wrapper input,.register-page .login-form .field-container .input-wrapper input,.register-page .register-form .field-container .input-wrapper input{border-radius:5px;padding:.25rem;width:70%;border:none}@media(max-width:30rem){.login-page .login-form .field-container .input-wrapper input,.login-page .register-form .field-container .input-wrapper input,.register-page .login-form .field-container .input-wrapper input,.register-page .register-form .field-container .input-wrapper input{width:100%}}.login-page .login-form .field-container .input-wrapper .show-password,.login-page .register-form .field-container .input-wrapper .show-password,.register-page .login-form .field-container .input-wrapper .show-password,.register-page .register-form .field-container .input-wrapper .show-password{position:absolute;left:0;bottom:0}.login-page .login-form .input-wrapper,.login-page .register-form .input-wrapper,.register-page .login-form .input-wrapper,.register-page .register-form .input-wrapper{padding:.5rem;border-radius:5px;width:100%}.login-page .login-form .input-wrapper .login-btn,.login-page .login-form .input-wrapper .register-btn,.login-page .register-form .input-wrapper .login-btn,.login-page .register-form .input-wrapper .register-btn,.register-page .login-form .input-wrapper .login-btn,.register-page .login-form .input-wrapper .register-btn,.register-page .register-form .input-wrapper .login-btn,.register-page .register-form .input-wrapper .register-btn{width:100%}.login-page .login-form .validation-wrapper,.login-page .register-form .validation-wrapper,.register-page .login-form .validation-wrapper,.register-page .register-form .validation-wrapper{color:#7f3737;font-size:.75rem;padding:.25rem}