@import"https://fonts.googleapis.com/css2?family=OCR+A+Std&display=swap";#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.generalPage{height:100%;width:80%;position:fixed;top:0;right:0;background-color:#f5f5f5;z-index:900;color:#000;font-family:Roboto,sans-serif;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;overflow-y:auto;padding-top:2rem}.checkPreview{width:100%;max-width:600px;height:auto;border:solid 2px #ccc;border-radius:10px;background-color:#f9f9f9;padding:1rem;box-shadow:0 2px 5px #0000001a;display:grid;grid-template-areas:"bank date chk" "payee payee amount" "memo acc rt";grid-gap:.5rem;margin-top:2rem}.checkPreview div{margin-bottom:.5rem}.checkPreview u{text-decoration:underline}.checkPreview_bank{grid-area:bank;text-align:left}.checkPreview_payee{grid-area:payee;text-align:left}.checkPreview_acc{grid-area:acc;text-align:left;font-family:OCR A Std,monospace}.checkPreview_rt{grid-area:rt;text-align:center;font-family:OCR A Std,monospace}.checkPreview_chk{grid-area:chk;text-align:right}.checkPreview_amount{grid-area:amount;text-align:right;font-size:1.2em}.checkPreview_date{grid-area:date;text-align:left}.checkPreview_memo{grid-area:memo;text-align:left}.newCheckInfo{width:100%;max-width:600px;border-radius:8px;padding:20px;background:linear-gradient(135deg,#f0f0f0,#fff);box-shadow:0 4px 8px #0000001a}.newCheckInfo form{display:grid;grid-template-columns:1fr 4fr;gap:8px}.newCheckInfo label{margin-bottom:4px;font-weight:700;text-align:left}.newCheckInfo .required{color:red;margin-left:2px}.newCheckInfo .error-message{color:red;grid-column:span 2;text-align:center;margin:0}.newCheckInfo select,.newCheckInfo input[type=text],.newCheckInfo input[type=number],.newCheckInfo input[type=date]{padding:8px;border:1px solid #ccc;border-radius:4px;width:100%;box-sizing:border-box;background-color:#fff;color:#000}.newCheckInfo select:focus,.newCheckInfo input[type=text]:focus,.newCheckInfo input[type=number]:focus,.newCheckInfo input[type=date]:focus{border-color:#1e90ff;outline:none}.newCheckInfo .date-input-wrapper{position:relative}.newCheckInfo .calendar-icon{position:absolute;right:10px;top:50%;transform:translateY(-50%);pointer-events:none}.newCheckInfo button[type=createCheck]{color:#fff;border:none;cursor:pointer;grid-column:span 2;justify-self:center;margin-top:1rem;background-color:#1e90ff}.newCheckInfo button[type=createCheck]:hover{background-color:#1c86ee}.pageContent{width:100%;max-width:800px;border-radius:8px;padding:20px;background:linear-gradient(135deg,#f0f0f0,#fff);box-shadow:0 4px 8px #0003;margin-top:2rem;flex-grow:1;overflow-y:auto}.pageContent h2{margin-bottom:1rem;color:#333}.pageContent table{width:100%;border-collapse:collapse;margin-bottom:1rem}.pageContent table th,.pageContent table td{padding:10px;border:1px solid #ccc;text-align:left}.pageContent table th{background-color:#f9f9f9}.pageContent button{padding:10px 20px;border:none;background-color:#1e90ff;color:#fff;border-radius:5px;cursor:pointer;transition:background-color .3s ease;margin:0 10px}.pageContent button:hover{background-color:#1c86ee}.payeeList,.bankList,.TransList{width:100%;max-width:1000px;height:auto;max-height:100%;overflow-y:auto;margin:0 auto;background-color:#f9f9f9;padding:10px;border-radius:5px;box-shadow:0 2px 5px #0000001a}.payeeList button,.bankList button{margin-bottom:10px;background-color:#1e90ff}.eachPayee,.eachBank,.eachCheck{display:flex;justify-content:space-between;align-items:center;border-radius:5px;margin-bottom:5px;box-shadow:0 2px 5px #0000001a;padding:10px;cursor:pointer;flex:1}.eachCheck{cursor:default}.eachCheck span,.header span{flex:1;text-align:left}.header{display:flex;justify-content:space-between;align-items:center;border-radius:5px;margin-bottom:10px;box-shadow:0 2px 5px #0000001a;padding:10px}.eachCheckPayTo2{font-weight:700;flex-grow:1;text-align:left}.eachCheckNumber2{font-weight:700;flex-grow:2;text-align:center}.eachBankAccount2{font-weight:700;flex-grow:3;text-align:center}.eachCheckAmount2{font-weight:700;flex-grow:4;text-align:right}.eachPayee:hover,.eachBank:hover{background-color:#f0f0f0}.eachPayeeName,.eachBankName,.eachCheckPayTo{font-weight:700;flex-grow:1;text-align:left}.eachPayeeId,.eachBankAcc,.eachCheckAmount{font-weight:400;flex-grow:4;text-align:right}.eachCheckNumber{font-weight:400;flex-grow:3;text-align:center}.eachBankAccount{font-weight:400;flex-grow:2;text-align:center}.popupOverlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.popupContent{background-color:#fff;width:400px;height:auto;padding:20px;border-radius:8px;box-shadow:0 4px 8px #0000001a;z-index:1001;display:flex;flex-direction:column;justify-content:space-between}.popupContent p{color:red;text-align:center;font-size:larger}.popupContent input{font-size:large}.popupContent h2,.popupContent label{color:#2b2525}.popupContent input,.popupContent select{padding:.75rem;border:1px solid #ccc;border-radius:5px;width:100%;box-sizing:border-box;font-size:1em;margin-bottom:1rem}.popupActions{display:flex;justify-content:space-between;margin-top:20px}.popupActions button{color:#fff;border:none;cursor:pointer;padding:.75rem 1.5rem;border-radius:5px;background-color:#007bff;font-size:1em;transition:background-color .3s ease}.popupActions button:hover{background-color:#0056b3}@media (max-width: 1024px){.newCheckInfo,.checkPreview,.pageContent{left:10%;right:10%;width:80%}}@media (max-width: 768px){.newCheckInfo,.checkPreview,.pageContent{left:5%;right:5%;width:90%}.checkPreview{display:flex;flex-direction:column;align-items:flex-start}.checkPreview div{width:100%;text-align:left}}body{margin:0;padding:0;font-family:Roboto,sans-serif;display:flex;justify-content:center;align-items:center;height:100vh}.login-form{background:#ffffffe6;padding:2rem;border-radius:10px;box-shadow:0 4px 8px #0000001a;width:100%;max-width:400px;text-align:left}.login-form h2{margin:0 0 16px;color:#333}.login-form p.app-description{margin-bottom:1rem;color:#555;font-size:.9rem}.login-form label{display:block;margin-bottom:.5rem;font-weight:700}.login-form input{width:100%;padding:.75rem;margin-bottom:1rem;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;background-color:#f5f5f5;color:#333}.login-form button{width:100%;padding:.75rem;border:none;border-radius:5px;background-color:#1e90ff;color:#fff;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.login-form button:hover{background-color:#1c86ee}.login-form :disabled{background-color:#ccc;color:#666;cursor:not-allowed}.login-form a{display:block;text-align:center;margin-top:1rem;color:#1e90ff;text-decoration:none}.login-form a:hover{text-decoration:underline}.login-form__username.invalid input,.login-form__password.invalid input,.login-form__email.invalid input{border-color:red}.login-form p.err-msg{color:red;margin-top:-.5rem;margin-bottom:1rem;font-size:.875rem}.login-form__username,.login-form__password,.login-form__email,.login-form__firstName,.login-form__lastName,.login-form__address,.login-form__apartment,.login-form__city,.login-form__state,.login-form__zipcode{text-align:left}@media (max-width: 768px){.login-form{padding:1rem}}body{margin:0;padding:0;font-family:Roboto,sans-serif;display:flex;justify-content:center;align-items:center;height:80vh}.signup-form{background:#ffffffe6;padding:2rem;border-radius:10px;box-shadow:0 4px 8px #0000001a;width:100%;max-width:800px;text-align:left}.signup-form h2{margin:0 0 16px;color:#333}.signup-form p.app-description{margin-bottom:1rem;color:#555;font-size:.9rem}.signup-form form{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.signup-form__actions{grid-column:span 2}.signup-form label{display:block;margin-bottom:.1rem;font-weight:700}.signup-form input{width:100%;padding:.75rem;margin-bottom:.5rem;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;background-color:#f5f5f5;color:#333}.signup-form button{width:100%;padding:.75rem;border:none;border-radius:5px;background-color:#1e90ff;color:#fff;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.signup-form button:hover{background-color:#1c86ee}.signup-form :disabled{background-color:#ccc;color:#666;cursor:not-allowed}.signup-form a{display:block;text-align:center;margin-top:1rem;color:#1e90ff;text-decoration:none}.signup-form a:hover{text-decoration:underline}.signup-form__username.invalid input,.signup-form__password.invalid input,.signup-form__email.invalid input,.signup-form__firstName.invalid input,.signup-form__lastName.invalid input,.signup-form__address.invalid input,.signup-form__apartment.invalid input,.signup-form__city.invalid input,.signup-form__state.invalid input,.signup-form__zipcode.invalid input{border-color:red}.signup-form p.err-msg{color:red;margin-top:-.5rem;margin-bottom:0rem;font-size:.875rem;grid-column:span 2;min-height:1.25rem}.signup-form__username,.signup-form__password,.signup-form__email,.signup-form__firstName,.signup-form__lastName,.signup-form__address,.signup-form__apartment,.signup-form__city,.signup-form__state,.signup-form__zipcode{text-align:left}@media (max-width: 768px){.signup-form{padding:1rem}.signup-form form{grid-template-columns:1fr}.signup-form p.err-msg{grid-column:span 1}}.sideBar{height:100%;width:20%;position:fixed;top:0;left:0;background:linear-gradient(135deg,#f0f0f0,#fff);box-shadow:0 4px 8px #0003;z-index:1000;display:flex;flex-direction:column;align-items:center;padding:20px}.sideBar button{border-radius:5px;margin-bottom:10px;padding:10px;width:100%;background-color:#1e90ff;color:#fff;border:none;cursor:pointer;transition:background-color .3s ease}.sideBar button:hover{background-color:#1c86ee}.sideBar .profile{margin-top:30px;margin-bottom:60px;width:100px;height:100px;border-radius:50%;background-color:#f0f8ff;background-image:url(/profile.png);background-size:cover;background-position:center;cursor:pointer}.log-out{margin-top:40px;width:100%}.log-out button{width:100%}@media (max-width: 768px){.sideBar{width:100%;height:auto;flex-direction:row;justify-content:space-between}.sideBar .profile{width:50px;height:50px}.sideBar button{width:auto;margin:0 5px}.log-out{margin-top:0}}.popupContent input{width:100%;padding:10px;margin:.5rem 0;border:1px solid #ccc;border-radius:5px;box-sizing:border-box;font-size:1rem;background-color:#fff;color:#333}.popupOverlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.popupContent{background:linear-gradient(135deg,#f0f0f0,#fff);width:90%;max-width:500px;padding:20px;border-radius:10px;box-shadow:0 4px 8px #0003;z-index:1001;display:flex;flex-direction:column;align-items:center;text-align:center}.popupContent h2{margin-bottom:1rem;color:#333}.popupContent form{width:100%;display:flex;flex-direction:column;align-items:center}.popupContent label{margin:.5rem 0;color:#555}.popupContent input{padding:10px;margin:.5rem 0;border:1px solid #ccc;border-radius:5px;width:100%;box-sizing:border-box;background-color:#fff;color:#333}.popupActions{display:flex;justify-content:space-between;width:100%;margin-top:1rem}.popupActions button{padding:10px 20px;border:none;background-color:#1e90ff;color:#fff;border-radius:5px;cursor:pointer;transition:background-color .3s ease;margin:0 10px}.popupActions button:hover{background-color:#1c86ee}@media (max-width: 768px){.popupActions{flex-direction:column}.popupActions button{width:100%;margin:.5rem 0}}.popupOverlayS{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.popupContentS{background:linear-gradient(135deg,#f0f0f0,#fff);width:90%;max-width:500px;padding:20px;border-radius:10px;box-shadow:0 4px 8px #0003;z-index:1001;display:flex;flex-direction:column;align-items:center;text-align:center}.popupContentS h2{margin-bottom:1rem;color:#333}.checkDetailS{width:100%;display:flex;justify-content:space-between;margin-bottom:1rem}.checkDetailS div{width:45%}.checkDetailS p{margin:.5rem 0;color:#555}.popupContentS p{color:#555;margin:.5rem 0}.popupActionsS{display:flex;justify-content:space-between;width:100%;margin-top:1rem}.popupActionsS button{padding:10px 20px;border:none;background-color:#1e90ff;color:#fff;border-radius:5px;cursor:pointer;transition:background-color .3s ease;margin:0 10px}.popupActionsS button:hover{background-color:#1c86ee}@media (max-width: 768px){.checkDetailS{flex-direction:column;align-items:center}.checkDetailS div{width:100%;text-align:center;margin-bottom:1rem}.popupActionsS{flex-direction:column}.popupActionsS button{width:100%;margin:.5rem 0}}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#000;background-color:#f5f5f5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}
