:root{--primary: var(--primary-light);--primary-dark: #594ef3;--primary-light: #594ef3;--primary-highlight: var(--primary-highlight-light);--primary-highlight-dark: color-mix(in srgb, var(--primary-dark), white 15%);--primary-highlight-light: color-mix(in srgb, var(--primary-light), white 15%);--secondary: var(--secondary-light);--secondary-dark: rgba(61, 181, 255, .795);--secondary-light: rgb(61, 181, 255);--secondary-highlight: var(--secondary-highlight-light);--secondary-highlight-dark: color-mix(in srgb, var(--secondary-dark), white 15%);--secondary-highlight-light: color-mix(in srgb, var(--secondary-light), white 15%);--accent: var(--accent-light);--accent-dark: #9d9d9d;--accent-light: #2a5d42;--accent-highlight: var(--accent-highlight-light);--accent-highlight-dark: color-mix(in srgb, var(--accent-dark), white 15%);--accent-highlight-light: color-mix(in srgb, var(--accent-light), white 15%);--positive: var(--positive-light);--positive-dark: rgba(9, 166, 9, .583);--positive-light: rgba(9, 166, 9, .583);--positive-highlight: var(--positive-highlight-light);--positive-highlight-dark: color-mix(in srgb, var(--positive-dark), white 15%);--positive-highlight-light: color-mix(in srgb, var(--positive-light), white 15%);--negative: var(--negative-light);--negative-dark: rgba(255, 0, 0, .583);--negative-light: rgba(255, 0, 0, .9);--negative-highlight: var(--negative-highlight-light);--negative-highlight-dark: color-mix(in srgb, var(--negative-dark), white 15%);--negative-highlight-light: color-mix(in srgb, var(--negative-light), white 15%);--background: var(--background-light);--background-dark: #121212;--background-light: #f8f8f8;--button: var(--button-light);--button-dark: #313131;--button-light: #c2c2c2;--button-text: var(--button-text-light);--button-text-dark: #dddddd;--button-text-light: #2d2d2d;--button-highlight: var(--button-highlight-light);--button-highlight-dark: color-mix(in srgb, var(--button-dark), white 15%);--button-highlight-light: color-mix(in srgb, var(--button-light), white 15%);--footer: var(--footer-light);--footer-dark: rgb(52, 52, 52);--footer-light: rgb(232, 232, 232);--footer-text: var(--footer-text-light);--footer-text-dark: rgb(211, 211, 211);--footer-text-light: rgb(91, 91, 91);--info-label: var(--info-label-light);--info-label-dark: #2e2e2e;--info-label-light: #dbdbdb;--info-label-text: var(--info-label-text-light);--info-label-text-dark: #cfcfcf;--info-label-text-light: #5b5b5b;--info-label-highlight: var(--info-label-highlight-light);--info-label-highlight-dark: color-mix(in srgb, var(--info-label-dark), white 15%);--info-label-highlight-light: color-mix(in srgb, var(--info-label-light), white 15%);--input: var(--input-light);--input-dark: #f3f3f3;--input-light: #f9f9f9;--input-lowlight: var(--input-lowlight-light);--input-lowlight-dark: color-mix(in srgb, var(--input-dark), black 10%);--input-lowlight-light: color-mix(in srgb, var(--input-light), black 5%);--input-text: var(--input-text-light);--input-text-dark: #374151;--input-text-light: #374151;--nav: var(--nav-light);--nav-dark: #202020;--nav-light: #ffffff;--shadow: var(--shadow-light);--shadow-dark: #222222;--shadow-light: #e0e0e0;--spinner-border: var(--spinner-border-light);--spinner-border-dark: rgba(255, 255, 255, .5);--spinner-border-light: rgba(0, 0, 0, .5);--spinner-top: var(--spinner-top-light);--spinner-top-dark: white;--spinner-top-light: black;--subheading-text: var(--subheading-text-light);--subheading-text-dark: #cbcbcb;--subheading-text-light: #393939;--subtitle-text: var(--subtitle-text-light);--subtitle-text-dark: #b2b2b2;--subtitle-text-light: #4b4b4b;--table-border: var(--table-border-light);--table-border-dark: rgb(46, 46, 46);--table-border-light: #dddddd;--table-cell-border: var(--table-cell-border-light);--table-cell-border-dark: rgb(18, 18, 18);--table-cell-border-light: #eeeeee;--table-text: var(--table-text-light);--table-text-dark: rgb(237, 237, 237);--table-text-light: rgb(39, 39, 39);--table-alt-row: var(--table-alt-row-light);--table-alt-row-dark: rgb(32, 32, 32);--table-alt-row-light: rgb(212, 212, 212);--text: var(--text-light);--text-dark: #e4e4e4;--text-light: #1d1d1d;margin-top:5rem;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[data-theme=dark]{--primary: var(--primary-dark);--primary-highlight: var(--primary-highlight-dark);--secondary: var(--secondary-dark);--secondary-highlight: var(--secondary-highlight-dark);--accent: var(--accent-dark);--accent-highlight: var(--accent-highlight-dark);--positive: var(--positive-dark);--positive-highlight: var(--positive-highlight-dark);--negative: var(--negative-dark);--negative-highlight: var(--negative-highlight-dark);--background: var(--background-dark);--button-highlight: var(--button-highlight-dark);--button-text: var(--button-text-dark);--button: var(--button-dark);--footer: var(--footer-dark);--footer-text: var(--footer-text-dark);--info-label: var(--info-label-dark);--info-label-highlight: var(--info-label-highlight-dark);--info-label-text: var(--info-label-text-dark);--input: var(--input-dark);--input-lowlight: var(--input-lowlight-dark);--input-text: var(--input-text-dark);--nav: var(--nav-dark);--shadow: var(--shadow-dark);--spinner-border: var(--spinner-border-dark);--spinner-top: var(--spinner-top-dark);--subheading-text: var(--subheading-text-dark);--subtitle-text: var(--subtitle-text-dark);--table-border: var(--table-border-dark);--table-cell-border: var(--table-cell-border-dark);--table-text: var(--table-text-dark);--table-alt-row: var(--table-alt-row-dark);--text: var(--text-dark)}body{background-color:var(--background);color:var(--text);margin:0;transition:background-color .3s,color .3s}nav{background-color:var(--nav);position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:1rem;box-shadow:0 1px 2px -1px var(--shadow)}nav a{color:var(--secondary);font-weight:500;text-decoration:inherit}nav a:hover{color:var(--secondary-highlight)}nav a.login{color:inherit}nav a.login:hover{color:inherit}nav a.active{color:gray}nav a.brand-logo{display:flex;font-size:2rem}nav div.left,nav div.right{display:flex;align-items:center;gap:2rem}nav .search-nav-container{position:relative}nav .search-nav-icon{position:absolute;top:50%;left:.5rem;transform:translateY(-50%);width:1.25rem;height:1.25rem;color:#4e5259}nav .search-nav{font-size:1rem;max-width:40rem;padding:.5rem 1rem .5rem 2.5rem;color:#374151;background-color:var(--input-lowlight);border:1px solid transparent;border-radius:.25rem;transition:all .3s ease}nav .search-nav:focus{outline:none;background-color:var(--input);box-shadow:0 0 0 1px var(--shadow)}a.button{display:inline-block;border-radius:.5rem;border:1px solid transparent;padding:.5rem 1rem;font-size:1rem;font-weight:500;background-color:var(--button);color:var(--button-text);cursor:pointer;transition:background-color .25s ease;text-decoration:none}a.button:hover{background-color:var(--button-highlight)}article{padding:2rem}article.book-container{display:flex;gap:2rem}button{border:none;border-radius:.5rem;color:var(--button-text);padding:.5rem 1rem;font-size:1rem;font-weight:500;background-color:var(--button);cursor:pointer;transition:background-color .3s ease}button:hover{background-color:var(--button-highlight)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}button.icon{height:2.1rem;padding:.5rem;width:2.1rem}button.loading{background-color:var(--button-highlight);color:#ffffff80;cursor:wait;display:flex;align-items:center;justify-content:center;gap:8px}button.loading:hover{background-color:var(--button-highlight)}button.delete,button.negative{background-color:var(--negative)}button.delete:hover,button.negative:hover{background-color:var(--negative-highlight)}button.positive{background-color:var(--positive)}button.positive:hover{background-color:var(--positive-highlight)}button.theme{background-color:var(--secondary);border-radius:.5rem}button.theme:hover{background-color:var(--secondary-highlight)}div.book-actions{margin-top:1rem;display:flex;flex-direction:column;gap:1rem}div.book-subtitle{margin-bottom:.5rem;color:var(--subtitle-text);font-size:1.2rem}div.book-description{margin-top:1rem;color:var(--accent)}div.book-info-icons-container{margin-top:2rem;max-width:32rem;display:flex;flex-wrap:wrap;gap:1rem}div.heading-container{display:flex;justify-content:space-between}div.info-label{padding:.4rem .6rem;border-radius:.5rem;display:flex;align-items:center;gap:.5rem;color:var(--info-label-text);background-color:var(--info-label);box-shadow:0 2px 8px var(--shadow)}div.info-label:hover{background-color:var(--info-label-highlight)}h1{font-size:2em;line-height:1.1}h1.page-heading{margin-top:0}h1.book-title{margin:0}h2.book-addl-details,h2.book-danger-zone{color:var(--subheading-text);margin-top:2rem;font-size:1.5rem}img.book-cover{height:auto;object-fit:contain}span.info-label{border-radius:.5rem;padding:.25rem .5rem;background-color:var(--info-label);color:var(--info-label-text)}footer{color:var(--footer-text);font-size:.9rem;padding:1rem;background-color:var(--footer);box-shadow:0 50vh 0 50vh var(--shadow)}input{box-sizing:border-box;font-size:1rem;padding:.5rem;color:var(--text);background-color:var(--input-lowlight);border:1px solid transparent;border-radius:.25rem;transition:all .3s ease}input:focus{outline:none;background-color:var(--input);box-shadow:0 0 0 1px var(--shadow)}.book-card{max-width:12rem}.book-card-title-link{color:var(--secondary);text-decoration:none}.book-card-title-link:hover{color:var(--secondary-highlight)}.catalogue-container{display:flex;flex-wrap:wrap;gap:2rem}.flex-center{display:flex;flex-direction:column;gap:1rem;justify-content:center;align-items:center}.positive{background-color:var(--positive)}.spinner{width:.8rem;height:.8rem;border:3px solid var(--spinner-border);border-radius:50%;border-top-color:var(--spinner-top);animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.grid-table{display:grid;grid-template-columns:max-content 1fr;max-width:32rem;border:1px solid var(--table-border);border-radius:.25rem;overflow:hidden}.grid-cell{padding:.7rem 1rem;font-size:.9rem;border-right:1px solid var(--table-cell-border);display:flex;align-items:center;color:var(--table-text)}.grid-cell:nth-child(2n){border-right:none}.grid-cell:nth-child(4n+1),.grid-cell:nth-child(4n+2){background-color:var(--table-alt-row)}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:var(--background);border-radius:.5rem;box-shadow:0 2px 10px var(--shadow);padding:2rem;width:100%;max-width:20rem;position:relative;animation:modalFadeIn .3s ease-out}@keyframes modalFadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.close{position:absolute;top:1rem;right:1rem;font-size:1.5rem;cursor:pointer;color:var(--text);transition:all .3s ease}.close svg{transition:all .3s ease;transform:rotate(0)}.close:hover svg{transform:rotate(90deg)}.modal-content h2{margin-top:0;margin-bottom:1.5rem;color:var(--text)}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.5rem;color:var(--text);font-weight:500}.form-group input{width:100%;padding:.5rem;border:1px solid transparent;border-radius:.25rem;background-color:var(--input);color:var(--input-text);font-size:1rem;transition:all .3s ease}.form-group input:focus{box-shadow:0 0 0 1px var(--shadow)}.error{background-color:var(--negative-highlight);color:var(--negative);padding:.75rem;border-radius:.25rem;margin-bottom:1rem;border:1px solid var(--negative)}button[type=submit]{width:100%;padding:.75rem;border:none;border-radius:.5rem;font-size:1rem;font-weight:500;background-color:var(--primary);color:var(--button-text);cursor:pointer;transition:background-color .3s ease}button[type=submit]:hover:not(:disabled){background-color:var(--primary-highlight)}button[type=submit]:disabled{background-color:var(--button-highlight);cursor:wait;color:#ffffff80}.glass{-webkit-backdrop-filter:blur(8px) saturate(180%);backdrop-filter:blur(8px) saturate(180%);background-color:#111928bf;border-radius:12px;border:1px solid rgba(255,255,255,.125)}.api-battery-wrapper{display:flex;flex-direction:column;gap:.25rem}.api-battery-label{font-family:sans-serif;font-size:.8rem;text-align:center}.api-battery-progress{height:.5rem;border-radius:1rem;overflow:hidden}
