body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{height:100vh}.LogIn{background-color:#ececec;height:100vh;justify-content:center}.LogIn,.login-box{align-items:center;display:flex;flex-direction:column}.login-box{background-color:#fff;border-radius:20px;box-shadow:0 5px 15px rgba(0,0,0,.1);height:50vh;justify-content:centered;justify-content:center;width:40vw}.login-form{width:50%}.form-group{margin-bottom:20px;position:relative}.login-label{display:block;font-weight:700;margin-bottom:5px}.login-input{border:1px solid #ccc;border-radius:5px;box-sizing:border-box;padding:10px 35px 10px 10px;width:100%}.button-container{flex-direction:column}.submit{margin-bottom:10px}.forgot-password{margin-top:10px}.link{align-items:center;color:#007bff;cursor:pointer;display:flex;flex-direction:column;justify-content:center}.error-message{font-size:.9em;margin-top:10px}.spinner-container{align-items:center;display:flex;justify-content:center}.spinner{background-color:hsla(0,0%,95%,.8);border:4px solid transparent;border-top-color:#3498db;height:40px;width:40px}.nav-and-content{display:flex}.content{height:90vh;justify-content:center;width:88%}.TopNav,.content{align-items:center;display:flex}.TopNav{background:linear-gradient(90deg,#3a5a40,#588157);box-shadow:0 2px 5px rgba(0,0,0,.1);color:#fbfaf5;height:10vh;justify-content:space-between;padding:0 20px;position:relative}.sungate-logo{flex-grow:1}.logout-button:hover{background-color:#344e41;-webkit-transform:scale(1.05);transform:scale(1.05)}.logout-button:active{background-color:#344e41;-webkit-transform:scale(.95);transform:scale(.95)}.logout-button:focus{box-shadow:0 0 0 3px rgba(52,78,65,.5);outline:none}.listcomponent{border-bottom:1px solid #ececec;display:flex;flex-direction:column}.list-container{border-right:1px solid #ececec;height:90vh;margin:0;width:170px}.AddField{align-items:center;background-color:#fff;border-radius:8px;box-shadow:0 2px 5px rgba(0,0,0,.1);display:flex;flex-direction:column;height:100%;justify-content:space-evenly;margin:0 auto;padding:20px;width:100%}.AddField h1{font-size:24px;margin-bottom:20px;text-align:center}.AddField .add-form-container{width:60%}.AddField .form-group{margin-bottom:15px}.AddField .form-group label{display:block;font-weight:500;margin-bottom:5px}.AddField .form-group input{border:1px solid #ccc;border-radius:4px;font-size:16px;outline:none;padding:8px;transition:border-color .3s ease-in-out;width:98%}.AddField .form-group input:focus{border-color:#588157}.AddField button[type=submit]{background-color:#588157;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px 16px;transition:background-color .3s ease-in-out;width:15%}.AddField button[type=submit]:hover{background-color:#45a049}.history-container{background-color:#f9f9f9;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.1);height:100%;padding:20px;width:100%}h1{font-size:24px;margin-bottom:20px}.history-list{list-style-type:none;padding:0}.history-item{background-color:#fff;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.1);display:flex;flex-direction:column;margin-bottom:10px;padding:15px}.history-date{color:#888;font-size:14px;margin-bottom:8px}.history-content{color:#333;font-size:16px}.SingleField{align-items:start;background-color:#ececec;display:flex;flex-direction:column;height:100%;padding:20px 50px;width:100%}.field-name-container{border-bottom:1px solid #d1d1d1;display:flex;margin-bottom:20px;padding:30px 0 20px;width:100%}.field-name-container :hover{cursor:pointer}.singlefield-button-container{display:flex;gap:20px;justify-content:flex-start;width:100%}.add-zone-button,.configure-button,.delete-field-button{border:none;border-radius:4px;cursor:pointer;font-size:16px;padding:10px 16px;transition:background-color .3s ease-in-out;width:150px}.configure-button{background-color:#588157;color:#fff}.configure-button:hover{background-color:#45a049}.delete-field-button{background-color:#b30000;color:#fff}.delete-field-button:hover{background-color:#d00202}.add-zone-button{align-items:center;background-color:#fbfaf5;color:#000;display:flex;justify-content:center;text-decoration:none}.add-zone-button:hover{background-color:#ececec;border:1px solid #000}.dropdowns-container{flex-direction:column;margin-bottom:40px}.pipes-container{align-items:flex-start;border-bottom:1px solid #d1d1d1;display:flex;flex-direction:column;justify-content:flex-start;margin-bottom:4%;width:100%}.empty-state{border-radius:8px}.empty-state p{font-size:12pt;margin:5px 0}.popup-container{justify-content:space-around}.popup{border-radius:5px;box-shadow:0 2px 10px rgba(0,0,0,.2);padding:20px}.configure-popup-content{align-items:flex-start;display:flex;flex-direction:column}.PipesBar{grid-gap:12px;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));margin:0 auto 5vh;transition:all .3s ease;width:100%}.pipe-section-card{background-color:#fff;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.2);padding:5px 10px}.pipe-column-id-label{border-bottom:1px solid #d1d1d1;font-size:10pt;margin:3px 0;padding:2px 0;width:100%}.pipe-column-container{align-items:center;background-color:#f8f9fa;border-radius:8px;box-shadow:0 2px 6px rgba(0,0,0,.08);display:flex;height:28px;justify-content:center;margin:5px 0;padding:5px 0;transition:box-shadow .2s ease,-webkit-transform .2s ease;transition:transform .2s ease,box-shadow .2s ease;transition:transform .2s ease,box-shadow .2s ease,-webkit-transform .2s ease}.pipe-column-container:hover{box-shadow:0 4px 10px rgba(0,0,0,.15)}.pipe-left,.pipe-right{align-items:center;border-radius:0 8px 8px 0;color:#333;display:flex;flex:1 1;font-size:13px;font-weight:500;height:100%;justify-content:center;padding:5px}.pipe-left:hover,.pipe-right:hover{cursor:pointer;-webkit-filter:saturate(.8);filter:saturate(.8)}.pipe-left{border-radius:8px 0 0 8px;margin-right:4px}.pipe-right{border-radius:0 8px 8px 0}.closed{background-color:#ea4747;color:#fff}.open{background-color:#4dabf7;color:#fff}.pipe-column:last-child{margin-right:0}@media(max-width:768px){.PipesBar{gap:10px;grid-template-columns:repeat(auto-fit,minmax(100px,1fr))}.pipe-column{height:26px}.pipe-left,.pipe-right{font-size:12px}}@media(max-width:480px){.PipesBar{gap:8px;grid-template-columns:1fr}.pipe-column{height:24px}.pipe-left,.pipe-right{font-size:11px}}.AddZonesPopup{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.popup{border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.15);max-width:90%;padding:20px 30px;width:500px}.popup h3{border-bottom:1px solid #d1d1d1;color:#333;font-size:1.5rem;margin-bottom:1.5rem;margin-top:.5rem;padding-bottom:1rem}.form-group,.form-group-input{margin-bottom:1.5rem;text-align:left}.form-group-content{display:flex}.form-group label,.form-group-input label{color:#666;display:block;font-weight:600;margin-bottom:.5rem}.form-group select{border:1px solid #ddd;border-radius:4px;color:#333;font-size:1rem;padding:10px;transition:border-color .3s ease;width:100%}.form-group select:focus{border-color:#5a9;outline:none}.form-group-input input[type=text]{border:1px solid #ddd;border-radius:4px;color:#333;font-size:1rem;padding:10px;transition:border-color .3s ease;width:95%}.form-group-input input[type=text]:focus{border-color:#5a9;outline:none}.selected-pipes-container{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:1.5rem}.selected-pipe{align-items:baseline;background-color:#f3f3f3;border-radius:4px;display:flex;flex-direction:row;font-size:14px;margin-bottom:5px;padding:10px}.remove-pipe-button{border:none;border-radius:4px;color:gray;cursor:pointer;font-size:12px;margin-left:8px;padding:2px 6px;transition:background-color .3s ease}.remove-pipe-button:hover{background-color:#d73838;color:#fff}.modal-footer{display:flex;justify-content:flex-end}.button-container{align-items:center;flex-direction:row}.close-modal-button{background-color:#dc3545;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:1rem;margin-right:10px;padding:10px 16px;transition:background-color .3s ease,color .3s ease}.close-modal-button:hover{background-color:#c82333}.add-button,.add-pipe-button{background-color:#5a9;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:1rem;padding:10px 16px;transition:background-color .3s ease,color .3s ease}.add-button{min-width:105px}.add-pipe-button{margin-left:10px}.add-button:hover,.add-pipe-button:hover{background-color:#489f7a}.add-button:disabled,.add-pipe-button:disabled{background-color:#e0e0e0;color:#aaa;cursor:not-allowed}.success-message{background-color:#d4edda;border:1px solid #c3e6cb;border-radius:4px;color:#155724;font-size:.9rem;margin-bottom:1rem;padding:10px}.nested-dropdown{background:#fff;border:1px solid #ccc;border-radius:8px;max-height:300px;overflow-y:auto;padding:.75rem}.pipe-item{margin-bottom:.5rem}.pipe-header{align-items:center;background:#f7f7f7;border-radius:6px;display:flex;font-weight:700;justify-content:space-between;padding:.5rem}.expand-btn{background:transparent;border:none;cursor:pointer;font-size:.9rem}.gate-list{display:flex;flex-direction:column;margin-left:1.5rem;margin-top:.25rem}.gate-item{margin:.25rem 0}.popup-container{align-items:center;background-color:rgba(0,0,0,.5);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.popup{background-color:#fff;border-radius:10px;box-shadow:0 4px 8px rgba(0,0,0,.2);max-width:500px;text-align:center;width:100%}.popup .pipe-name{color:#333;font-size:24px;font-weight:700;margin-bottom:20px}.popup .left-right-section-container{display:flex;gap:20px;justify-content:space-between;margin-top:20px}.popup .left-section,.popup .right-section{width:45%}.popup .left-section .percentage-title,.popup .right-section .percentage-title{color:#555;font-size:18px;margin-bottom:10px}.popup .left-section .update-title,.popup .right-section .update-title{font-size:16px;margin-bottom:8px}.popup .left-section .percentage-input,.popup .right-section .percentage-input{border:1px solid #ccc;border-radius:4px;font-size:16px;margin-bottom:10px;padding:8px}.popup .left-section .toggle-button,.popup .left-section .update-button,.popup .right-section .toggle-button,.popup .right-section .update-button{background-color:#007bff;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;margin-bottom:20px;padding:10px;width:100%}.popup .left-section .toggle-button:hover,.popup .left-section .update-button:hover,.popup .right-section .toggle-button:hover,.popup .right-section .update-button:hover{background-color:#0096ff}.popup .left-section .toggle-button:disabled,.popup .left-section .update-button:disabled,.popup .right-section .toggle-button:disabled,.popup .right-section .update-button:disabled{background-color:#add8e6;cursor:not-allowed}.popup .left-section .toggle-button,.popup .right-section .toggle-button{border:none;border-radius:5px;cursor:pointer;padding:10px 20px;transition:background-color .3s ease}.popup .left-section .toggle-button.open-gate,.popup .right-section .toggle-button.open-gate{background-color:red;color:#fff}.popup .left-section .toggle-button.close-gate,.popup .right-section .toggle-button.close-gate{background-color:#0096c7;color:#fff}.popup .left-section .gate-toggle .toggle-title,.popup .right-section .gate-toggle .toggle-title{font-size:16px;margin-bottom:8px}.popup .close-button,.popup .rename-button{border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;margin-top:10px;padding:10px;width:60%}.popup .close-button:hover,.popup .rename-button:hover{background-color:#545b62}.popup .close-button:disabled,.popup .rename-button:disabled{background-color:#bcc1c6;cursor:not-allowed}.popup .rename-button{background-color:#6c757d}.popup .close-button{background-color:#dc3545;margin-top:30px}.popup .close-button:hover{background-color:#c82333}.popup .close-button:disabled{background-color:#e59b9b;cursor:not-allowed}.popup .rename-form{align-items:center;display:flex;flex-direction:column;margin-bottom:20px}.popup .rename-form .rename-input{border:1px solid #ccc;border-radius:4px;font-size:16px;margin-bottom:10px;padding:8px;width:80%}.popup .rename-form .update-button{width:80%}.popup .error-message{color:red;font-weight:700}.SingleZone{align-items:center;display:flex;flex-direction:column;height:100%;justify-content:space-evenly;width:100%}.SingleZone .zone-title{font-size:1.5rem;margin-bottom:10px}.SingleZone .pipe-bars{align-items:center;background-color:#f0f0f0;border-radius:10px;display:flex;flex-direction:column;gap:10px;height:65%;padding:20px;width:75%}.SingleZone .pipe-bars .pipe-content{align-items:center;display:flex;flex-direction:column;gap:20px;height:100%;overflow-y:auto;scrollbar-color:#b0b0b0 #f0f0f0;scrollbar-width:thin;width:100%}.SingleZone .pipe-bars .pipe-content::-webkit-scrollbar{width:8px}.SingleZone .pipe-bars .pipe-content::-webkit-scrollbar-track{background:#f0f0f0}.SingleZone .pipe-bars .pipe-content::-webkit-scrollbar-thumb{background-color:#b0b0b0;border-radius:10px}.SingleZone .pipe-bars .pipe-container{align-items:center;display:flex;flex-direction:column;justify-content:center;width:90%}.SingleZone .pipe-bars .pipe-bar{align-items:center;border-radius:8px;color:#fff;display:flex;font-size:1.2rem;font-weight:700;gap:10px;height:100px;justify-content:space-between;padding-left:30px;padding-right:40px;position:relative;width:100%}.SingleZone .pipe-bars .pipe-bar.on{background:linear-gradient(145deg,#3498db,#2980b9)}.SingleZone .pipe-bars .pipe-bar.off{background:linear-gradient(145deg,#e74c3c,#c0392b)}.SingleZone .pipe-bars .pipe-bar .pipe-name{font-size:1.2rem}.SingleZone .pipe-bars .pipe-bar .pipe-status{padding-left:180px}.SingleZone .pipe-bars .pipe-bar .pipe-percentage{color:#fff;font-size:.9rem}.SingleZone .toggle-buttons{display:flex;gap:10px}.SingleZone .toggle-buttons .toggle-button{border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:1rem;font-weight:700;padding:8px 16px;transition:background-color .3s ease}.SingleZone .toggle-buttons .toggle-button.on{background-color:#3498db}.SingleZone .toggle-buttons .toggle-button.on:hover{background-color:#2980b9}.SingleZone .toggle-buttons .toggle-button.on:disabled{background-color:#a5cde8;color:#d9eaf3;cursor:not-allowed;pointer-events:none}.SingleZone .toggle-buttons .toggle-button.off{background-color:#e74c3c}.SingleZone .toggle-buttons .toggle-button.off:hover{background-color:#c0392b}.SingleZone .toggle-buttons .toggle-button.off:disabled{background-color:#f2a5a5;color:#fbecec;cursor:not-allowed;pointer-events:none}.SingleZone .toggle-buttons .toggle-button.disabled{cursor:not-allowed;-webkit-filter:brightness(.9);filter:brightness(.9);opacity:.6;pointer-events:none}.SingleZone .toggle-buttons .toggle-button:disabled{cursor:not-allowed}.SingleZone .back-button,.SingleZone .delete-button{border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:1rem;margin:10px 0;padding:8px 16px;transition:background-color .3s ease}.SingleZone .back-button{background-color:#95a5a6}.SingleZone .back-button:hover{background-color:#7f8c8d}.SingleZone .back-button:disabled{cursor:not-allowed;opacity:.6;pointer-events:none}.SingleZone .delete-button{background-color:#e74c3c}.SingleZone .delete-button:hover{background-color:#c0392b}.SingleZone .delete-button:disabled{cursor:not-allowed;opacity:.6;pointer-events:none}.SingleZone button.rename-button{background-color:#3498db;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:1rem;font-weight:700;margin-top:10px;padding:8px 16px;transition:background-color .3s ease}.SingleZone button.rename-button:hover{background-color:#2980b9}.SingleZone button.rename-button:disabled{cursor:not-allowed;opacity:.6;pointer-events:none}.SingleZone .vertical-pipes{display:flex;flex-direction:column;gap:12px;height:70%;margin-top:2vh;width:90%}.SingleZone .vertical-pipes .pipe-section-card{width:100%}.SingleZone .multi-gate{border-radius:8px;display:flex;height:30px;overflow:hidden;width:100%}.SingleZone .gate-segment{align-items:center;color:#fff;display:flex;font-size:12px;justify-content:center;margin-right:4px;transition:background-color .3s ease}.SingleZone .gate-segment.open{background-color:#4dabf7;height:95%}.SingleZone .gate-segment.closed{background-color:#ea4747;height:95%}.SingleZone .gate-segment.unassigned{background-color:#d1d1d1;color:#777;height:95%}.SingleZone .empty-slot{opacity:.6}.AddSchedule{background-color:#fff;border-radius:1rem;box-shadow:0 4px 12px rgba(0,0,0,.1);color:#333;display:flex;flex-direction:column;font-family:Segoe UI,sans-serif;justify-content:space-evenly;margin:2rem auto;padding:2rem;width:80%}.AddSchedule h1{color:#2a7f62;font-size:1.75rem;margin-bottom:1rem;text-align:center}.AddSchedule label{color:#444;display:block;font-weight:600;margin-bottom:.5rem}.AddSchedule input[type=datetime-local],.AddSchedule input[type=number],.AddSchedule input[type=text]{border:1px solid #ccc;border-radius:.5rem;box-sizing:border-box;font-size:1rem;padding:.5rem;width:100%}.AddSchedule input[type=datetime-local]:focus,.AddSchedule input[type=number]:focus,.AddSchedule input[type=text]:focus{border-color:#2a7f62;outline:none}.AddSchedule .sequence-duration-input{color:#444;display:block;font-weight:600;margin-bottom:0}.AddSchedule .options-container{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:1fr 1fr;margin-top:1rem}.AddSchedule .zone-container{align-items:center;display:flex;flex-direction:column}.AddSchedule .zone-container h2{color:#2a7f62;font-size:1.2rem;margin-bottom:.5rem}.AddSchedule .zone-container .zone-box{display:flex;flex-wrap:wrap;gap:.5rem}.AddSchedule .zone-container .zone-options{background-color:#f4fdf8;border:1px solid #2a7f62;border-radius:1rem;cursor:pointer;padding:.5rem 1rem;transition:background-color .3s ease}.AddSchedule .zone-container .zone-options:hover{background-color:#e0f6eb}.AddSchedule .zone-container .zone-options.selected{background-color:#2a7f62;color:#fff;font-weight:600}.AddSchedule .add-container .duration-container{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:0fr 1fr}.AddSchedule .add-container button{background-color:#2a7f62;border:none;border-radius:.5rem;color:#fff;cursor:pointer;font-size:1rem;margin-top:1rem;padding:.5rem 1rem;transition:background-color .3s ease}.AddSchedule .add-container button:hover{background-color:#246f57}.AddSchedule .sequence-container{grid-column:span 2}.AddSchedule .sequence-container h2{color:#2a7f62;font-size:1.2rem;margin-top:1rem}.AddSchedule .sequence-container .sequence-box{background-color:#f9f9f9;border:1px solid #ddd;border-radius:.5rem;margin-top:.5rem;padding:1rem}.AddSchedule .sequence-container .sequence-item{align-items:center;background-color:#f9fafb;border:1px solid #e2e8f0;border-radius:6px;display:flex;justify-content:space-between;margin-bottom:.5rem;padding:.5rem}.AddSchedule .sequence-container .sequence-item .edit-controls{align-items:center;display:flex;gap:.5rem}.AddSchedule .sequence-container .sequence-item .edit-controls input{border:1px solid #ccc;border-radius:4px;padding:.25rem;width:50px}.AddSchedule .sequence-container .sequence-item .edit-controls button{background:#e2e8f0;border:none;border-radius:4px;cursor:pointer;font-size:1rem;padding:.25rem .5rem}.AddSchedule .sequence-container .sequence-item .edit-controls button:hover{background-color:#cbd5e0}.AddSchedule .sequence-container .sequence-item .edit-controls button:disabled{cursor:not-allowed;opacity:.5}.AddSchedule .datetime-container{margin-top:2rem}.AddSchedule .datetime-container label{display:block;margin-bottom:.5rem}.AddSchedule>button:last-of-type{background-color:#2a7f62;border:none;border-radius:.75rem;color:#fff;cursor:pointer;font-size:1.1rem;margin-top:1rem;padding:.75rem;transition:background-color .3s ease;width:100%}.AddSchedule>button:last-of-type:hover{background-color:#246f57}.SingleSchedule{align-items:center;background-color:#f9fafb;color:#333;display:flex;flex-direction:column;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;height:100%;justify-content:center;padding:2rem;width:100%}.schedule-name{color:#1a202c;font-size:2rem;font-weight:600;margin-bottom:1rem}.start-and-table-container{display:flex;flex-direction:column;gap:1.5rem;max-width:1000px;width:100%}.start-time-container{align-items:center;background:#fff;display:flex;justify-content:space-between;padding:1rem 1.5rem;width:95%}.schedule-table,.start-time-container{border-radius:.75rem;box-shadow:0 2px 6px rgba(0,0,0,.06)}.schedule-table{background-color:#fff;border-collapse:collapse;overflow:hidden;width:100%}.table-header{background-color:#edf2f7;border-bottom:1px solid #e2e8f0;font-weight:600;padding:1rem;text-align:left}.table-row:nth-child(2n){background-color:#f7fafc}.table-row:nth-child(odd){background-color:#fff}.duration,.pipe-list,.time,.zone{border-bottom:1px solid #e2e8f0;padding:1rem}.pipe{background-color:#e6fffa;border-radius:9999px;color:#234e52;display:inline-block;font-size:.875rem;font-weight:500;margin-bottom:.3rem;margin-right:.5rem;padding:.4rem .75rem}.manual-progress,.manual-start{background-color:#588157;border:none;border-radius:.5rem;box-shadow:0 2px 6px rgba(0,0,0,.1);color:#fff;cursor:pointer;font-size:1rem;padding:.75rem 1.5rem;transition:all .2s ease-in-out}.manual-progress:hover,.manual-start:hover{background-color:#45a049;-webkit-transform:translateY(-1px);transform:translateY(-1px)}.manual-progress{margin-top:2rem}.CreateAccount{background-color:#f0f0f0;min-width:100vw}.create-account-box{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.1);padding:20px;width:60%}h2{color:#333;margin-bottom:24px;text-align:center}.create-account-form{display:flex;flex-direction:column}.form-group{margin-bottom:16px}.create-account-label{color:#333;display:block;font-size:16px;margin-bottom:8px}.password-wrapper{align-items:center;display:flex;position:relative}.create-account-input{border:1px solid #ccc;border-radius:4px;box-sizing:border-box;font-size:16px;height:40px;padding:8px 36px 8px 8px;width:100%}.password-toggle{background:transparent;border:none;color:#555;cursor:pointer;padding:0;position:absolute;right:10px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.password-toggle:hover{color:#000}.password-toggle svg{font-size:20px}.password-criteria{font-size:14px;list-style:none;margin-top:10px;padding-left:0;transition:opacity .2s ease}.password-criteria li{align-items:center;display:flex;margin-bottom:6px}.password-criteria li .icon{font-size:18px;margin-right:8px}.password-criteria .valid{color:green}.password-criteria .invalid{color:#b00020}.button-container{display:flex;justify-content:center;margin-top:16px}.submit{background-color:#6200ee;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:16px;padding:10px 20px;transition:background-color .3s}.submit:hover{background-color:#3700b3}.spinner{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:3px solid hsla(0,0%,100%,.3);border-radius:50%;border-top-color:#fff;display:inline-block;height:16px;vertical-align:middle;width:16px}.error-message{color:red;font-size:14px}.error-message,.success-message{margin-bottom:16px;text-align:center}.success-message{-webkit-animation:fadeIn .4s ease-in-out;animation:fadeIn .4s ease-in-out;color:#1b8f2e;font-size:16px;font-weight:700}@-webkit-keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.account-card{background:#fff;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,.1);margin:auto;padding:20px;width:60%}.account-title{font-size:24px;margin-bottom:20px;text-align:center}.account-info{display:flex;flex-direction:column;gap:15px}.account-label{color:#666;font-size:14px;font-weight:700}.account-text{color:#333;font-size:16px}.account-field{align-items:center;background:#f9f9f9;border-radius:6px;display:flex;justify-content:space-between;padding:10px}.account-field-info{flex:1 1}.account-input{border:1px solid #ccc;border-radius:4px;font-size:16px;padding:8px;width:50%}.account-buttons{display:flex;gap:10px}.cancel-button,.edit-button,.submit-button{background:none;border:none;cursor:pointer;font-size:14px;padding:5px 10px}.submit-button{background-color:#4caf50;border-radius:4px;color:#fff;padding:5px 10px;transition:.3s}.submit-button:disabled{background-color:#ccc;cursor:not-allowed}.styled-cancel-button{background-color:#f44336;border-radius:4px;color:#fff;padding:5px 10px;transition:.3s}.styled-cancel-button:hover{background-color:#d32f2f}.group-settings{background-color:#fff;border-radius:12px;box-shadow:0 0 20px rgba(0,0,0,.1);font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;margin:2rem auto;max-width:800px;padding:2rem;width:100%}.group-settings h1{border-bottom:2px solid #e0e0e0;color:#2c3e50;font-size:2rem;margin-bottom:1.5rem;padding-bottom:.5rem}.group-settings h2{color:#34495e;font-size:1.5rem;margin-bottom:1rem;margin-top:2rem}.group-settings button{background-color:#3498db;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:1rem;padding:.6rem 1.2rem;transition:background-color .3s ease}.group-settings button:hover{background-color:#2980b9}.group-settings button:active{-webkit-transform:scale(.98);transform:scale(.98)}.group-settings ul{list-style-type:none;padding:0}.group-settings ul li{align-items:center;background-color:#f8f9fa;border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,.02);display:flex;justify-content:space-between;margin-bottom:.6rem;padding:.8rem 1rem}.group-settings ul li strong{color:#2c3e50}.group-settings ul li span{color:#7f8c8d;font-size:.9rem}.group-settings p{color:#7f8c8d;font-style:italic}.group-settings .invite-item{align-items:center;background-color:#f4f4f4;border-radius:6px;display:flex;justify-content:space-between;margin-bottom:.5rem;padding:.6rem 1rem}.group-settings .invite-item .copy-btn{align-items:center;background:none;border:none;color:#555;cursor:pointer;display:flex;margin:0;padding:.2rem}.group-settings .invite-item .copy-btn:hover{color:#000}.group-settings .copy-message{-webkit-animation:fadeOut 3s forwards;animation:fadeOut 3s forwards;font-size:.85rem}@-webkit-keyframes fadeOut{0%{opacity:1}90%{opacity:1}to{opacity:0}}@keyframes fadeOut{0%{opacity:1}90%{opacity:1}to{opacity:0}}.group-settings .copy-message-container{align-items:center;display:flex}.group-settings .dropdown-wrapper{display:inline-block;margin-left:10px}.group-settings .role-dropdown{border:1px solid #ccc;border-radius:4px;font-size:.9rem;padding:4px 8px}.group-settings .associated-user-item{margin-bottom:10px}.group-settings .role-edit-controls{align-items:center;display:flex;gap:.5rem}.CreateAccount{align-items:center;display:flex;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;justify-content:center;min-height:100vh}.CreateAccount .create-account-box{background-color:#fff;border-radius:1.5rem;box-shadow:0 8px 20px rgba(0,0,0,.1);max-width:650px;padding:2.5rem 3rem;width:100%}.CreateAccount .create-account-box h2{color:#333;font-size:1.75rem;font-weight:600;margin-bottom:1.5rem;text-align:center}.CreateAccount .create-account-box .create-account-form{display:flex;flex-direction:column;gap:1.2rem}.CreateAccount .create-account-box .create-account-form .form-group{display:flex;flex-direction:column}.CreateAccount .create-account-box .create-account-form .form-group .create-account-label{color:#555;font-weight:500;margin-bottom:.5rem}.CreateAccount .create-account-box .create-account-form .form-group .create-account-input{border:1px solid #ccc;border-radius:.75rem;font-size:1rem;padding:.75rem 1rem;transition:border-color .3s ease}.CreateAccount .create-account-box .create-account-form .form-group .create-account-input:focus{border-color:#4a90e2;outline:none}.CreateAccount .create-account-box .create-account-form .form-group .password-hint{color:#777;font-size:.875rem;margin-top:.5rem}.CreateAccount .create-account-box .create-account-form .error-message{background:#fbeaea;border-left:4px solid #d9534f;border-radius:.5rem;color:#d9534f;font-size:.95rem;padding:.75rem 1rem}.CreateAccount .create-account-box .create-account-form .button-container{display:flex;justify-content:center}.CreateAccount .create-account-box .create-account-form .button-container .submit{align-items:center;background-color:#4a90e2;border:none;border-radius:.75rem;color:#fff;cursor:pointer;display:flex;font-size:1rem;justify-content:center;min-width:150px;padding:.75rem 2rem;transition:background-color .3s ease}.CreateAccount .create-account-box .create-account-form .button-container .submit:hover:not(:disabled){background-color:#3a78c2}.CreateAccount .create-account-box .create-account-form .button-container .submit:disabled{background-color:#a0bcd9;cursor:not-allowed}.CreateAccount .create-account-box .create-account-form .button-container .submit .spinner{-webkit-animation:spin 1s linear infinite;animation:spin 1s linear infinite;border:3px solid hsla(0,0%,100%,.3);border-radius:50%;border-top-color:#fff;height:20px;width:20px}@-webkit-keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
/*# sourceMappingURL=main.54557ceb.css.map*/