.App{width:100%;height:100vh}*{margin:0;padding:0;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background:linear-gradient(135deg,#fff,#e6e0fa);position:relative;overflow:hidden}.login-container:before,.login-container:after{content:"";position:absolute;background-color:#a594e9;border-radius:50%;z-index:0}.login-container:before{width:300px;height:300px;top:-100px;left:-100px}.login-container:after{width:400px;height:400px;bottom:-150px;right:-150px}.login-box{background:#fff;padding:2rem;border-radius:20px;box-shadow:0 10px 25px #0000001a;width:100%;max-width:400px;position:relative;z-index:1}.logo{text-align:center;margin-bottom:2rem}.logo h1{font-size:2.5rem;color:#333;margin-bottom:.5rem}.tagline{color:#666;font-size:1rem}.input-group{margin-bottom:1.5rem;position:relative}.input-group input{width:100%;padding:.8rem;border:1px solid #ddd;border-radius:8px;font-size:1rem;transition:border-color .3s ease}.input-group input:focus{outline:none;border-color:#a594e9}.password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);cursor:pointer}.button-group{display:flex;gap:1rem;margin-bottom:1rem}.login-button,.register-button{flex:1;padding:.8rem;border:none;border-radius:8px;font-size:1rem;cursor:pointer;transition:background-color .3s ease}.login-button{background-color:#a594e9;color:#fff}.login-button:hover{background-color:#8b7bd3}.register-button{background-color:#e6e0fa;color:#333}.register-button:hover{background-color:#d3c9f7}.forgot-password{text-align:center;margin:1rem 0}.forgot-password a,.supervisor-link a,.student-link a{color:#a594e9;text-decoration:none}.forgot-password a:hover,.supervisor-link a:hover,.student-link a:hover{text-decoration:underline}.supervisor-link,.student-link{text-align:center;margin-top:1.5rem;color:#666}.link-button{background:none;border:none;padding:0;color:#a594e9;text-decoration:none;cursor:pointer;font-size:inherit}.error-message{color:#f44;margin-bottom:1rem;padding:.5rem;background-color:#ffe6e6;border-radius:4px;font-size:.9rem}button:disabled{opacity:.7;cursor:not-allowed}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f8f9fe,#e6e9f5);padding:20px}.login-box{background:#fff;padding:40px;border-radius:20px;box-shadow:0 10px 25px #0000000d;width:100%;text-align:center}.registration-box{max-width:800px}.logo h1{color:#333;margin-bottom:5px;font-size:2.5em}.tagline{color:#666;margin-bottom:30px}.input-row{display:flex;gap:20px;margin-bottom:20px}.input-row .input-group{flex:1;margin-bottom:0}.input-group{margin-bottom:20px}.input-group input{width:100%;padding:12px;border:1px solid #ddd;border-radius:8px;font-size:16px;transition:border-color .3s ease}.input-group input:focus{outline:none;border-color:#6c63ff}.button-group{margin-top:30px}.login-button{background-color:#6c63ff;color:#fff;border:none;padding:12px 30px;border-radius:8px;font-size:16px;cursor:pointer;transition:background-color .3s ease}.login-button:hover{background-color:#5b52e0}.links-section{margin-top:20px}.links-section p{color:#666;margin:10px 0}.link-button{background:none;border:none;color:#6c63ff;cursor:pointer;font-size:inherit;padding:0;text-decoration:none}.link-button:hover{text-decoration:underline}.student-home{min-height:100vh;background-color:#f8f5ff;position:relative;overflow:hidden}.student-home:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(149,128,255,.2),transparent);z-index:0;pointer-events:none}.top-nav{background:#fff;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 10px #0000000d;position:relative;z-index:1}.logo{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#9580ff,#80a0ff);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.nav-buttons{display:flex;gap:1rem}.nav-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border:none;background:none;color:#666;cursor:pointer;transition:all .3s ease;border-radius:20px}.nav-btn.active{background:#9580ff;color:#fff}.nav-btn.logout{color:#ff8080}.main-content{max-width:1200px;margin:0 auto;padding:2rem;position:relative;z-index:1}.welcome-section{margin-bottom:3rem}.welcome-section h1{font-size:2.5rem;color:#333;margin-bottom:.5rem;line-height:1.2}.subtitle{color:#666;font-size:1.2rem}.action-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-bottom:3rem}.action-btn{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem;border:none;background:#fff;border-radius:20px;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease;box-shadow:0 4px 15px #0000000d}.action-btn:hover{transform:translateY(-5px);box-shadow:0 6px 20px #0000001a}.btn-icon{width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:#f8f5ff;border-radius:15px;font-size:1.5rem}.faq-btn{display:flex;align-items:center;gap:.5rem;padding:.8rem 1.5rem;border:none;background:#fff;border-radius:20px;cursor:pointer;margin:0 auto;box-shadow:0 4px 15px #0000000d;transition:transform .3s ease}.faq-btn:hover{transform:translateY(-2px)}@media (max-width: 768px){.action-buttons{grid-template-columns:1fr}.nav-buttons{display:none}}.navbar{background-color:#fff;padding:1rem 2rem;display:flex;justify-content:space-between;align-items:center;box-shadow:0 2px 4px #0000001a}.nav-logo{font-size:1.5rem;font-weight:700;color:#2c3e50}.nav-menu button{margin-left:1rem;padding:.5rem 1rem;border:none;background:none;cursor:pointer;color:#2c3e50}.nav-menu .logout-btn{color:#e74c3c}.dashboard-container{max-width:1200px;margin:2rem auto;padding:0 1rem}.welcome-box{background-color:#fff;padding:2rem;border-radius:8px;margin-bottom:2rem;text-align:center;box-shadow:0 2px 4px #0000001a}.welcome-box h1{color:#2c3e50;margin-bottom:.5rem}.welcome-box p{color:#7f8c8d}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;margin-bottom:2rem}.stat-box{background-color:#fff;padding:1.5rem;border-radius:8px;text-align:center;box-shadow:0 2px 4px #0000001a}.stat-box h3{color:#2c3e50;margin-bottom:1rem}.stat-value{font-size:2rem;font-weight:700;color:#3498db;margin-bottom:.5rem}.stat-label{color:#7f8c8d}.action-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}.action-btn{padding:1rem;border:none;border-radius:8px;background-color:#3498db;color:#fff;font-weight:700;cursor:pointer;transition:background-color .3s}.action-btn:hover{background-color:#2980b9}.checkin-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#fff;z-index:1000}.checkin-modal{width:100%;height:100%;overflow-y:auto;padding:1rem;box-sizing:border-box}.checkin-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background-color:#f8f9fa;position:sticky;top:0;z-index:10}.checkin-header h2{margin:0;color:#2c3e50;font-size:1.25rem}.close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#2c3e50;padding:.5rem;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.map-container{margin-bottom:1.5rem;border-radius:8px;overflow:hidden;position:relative;background-color:#f8f9fa;min-height:400px}.map-loading{position:absolute;top:0;left:0;right:0;bottom:0;background:#ffffffe6;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1}.loading-spinner{width:40px;height:40px;margin-bottom:10px;border:4px solid #f3f3f3;border-top:4px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.map-container{margin-bottom:1.5rem;border-radius:8px;overflow:hidden;position:relative;background-color:#f8f9fa;min-height:400px;height:400px;width:100%;border:1px solid #ddd}#map{height:100%!important;width:100%!important;position:absolute!important;top:0;left:0;right:0;bottom:0}.selected-location-info{position:absolute;bottom:0;left:0;right:0;background:#ffffffe6;padding:1rem;display:flex;justify-content:space-between;align-items:center;font-size:.9rem}.use-location-btn{padding:.5rem 1rem;background-color:#3498db;color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:500;transition:background-color .3s}.use-location-btn:hover{background-color:#2980b9}.location-form{margin-bottom:1.5rem}.input-group{margin-bottom:1rem}.input-group label{display:block;margin-bottom:.5rem;color:#2c3e50}.input-group input{width:100%;padding:.75rem;border:1px solid #ddd;border-radius:4px;font-size:1rem}.input-group input[type=number]{width:150px}.radius-helper{font-size:.8rem;color:#666;margin-top:4px}.input-group input:focus{border-color:#3498db;outline:none;box-shadow:0 0 0 2px #3498db33}.status-section{background-color:#f8f9fa;padding:1rem;border-radius:8px;margin-bottom:1rem}.status-text,.action-text{font-weight:700;color:#3498db}.button-group{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.time-btn{padding:.75rem;border:none;border-radius:4px;background-color:#3498db;color:#fff;font-weight:700;cursor:pointer;transition:background-color .3s}.time-btn:hover{background-color:#2980b9}.time-btn:disabled,.save-btn:disabled{background-color:#bdc3c7;cursor:not-allowed}.status-text.in-range{color:#27ae60}.status-text.out-of-range{color:#e74c3c}.status-text.checked-in{color:#27ae60;font-weight:700}.status-section p{display:flex;justify-content:space-between;margin:.5rem 0;padding:.5rem;border-radius:4px;background-color:#ffffff80}.save-btn{width:100%;padding:.75rem;border:none;border-radius:4px;background-color:#2ecc71;color:#fff;font-weight:700;cursor:pointer;transition:background-color .3s}.save-btn:hover{background-color:#27ae60}.saved-locations{border-top:1px solid #ddd;padding-top:1.5rem}.saved-locations h3{margin:0 0 1rem;color:#2c3e50}.custom-map-control{background-color:#fff;border:0;border-radius:2px;box-shadow:0 1px 4px -1px #0000004d;margin:10px;padding:8px 16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;font-size:14px;cursor:pointer}.custom-map-control:hover{background-color:#f1f3f4}.custom-map-control:active{background-color:#e8eaed}.location-list{max-height:300px;overflow-y:auto;padding:.5rem}.history-entry{background-color:#f8f9fa;border-radius:8px;padding:1rem;margin-bottom:.5rem;border-left:4px solid #3498db;transition:transform .2s}.history-entry:hover{transform:translate(4px)}.history-entry.check-in{border-left-color:#2ecc71}.history-entry.check-out{border-left-color:#e74c3c}.history-time{font-size:.9rem;color:#666;margin-bottom:.5rem}.history-details{display:flex;justify-content:space-between;align-items:center}.history-type{font-weight:500;color:#2c3e50}.history-location{color:#666;font-size:.9rem}.no-history{text-align:center;color:#666;padding:2rem;font-style:italic}.permission-container{padding:2rem;text-align:center;display:flex;flex-direction:column;align-items:center;gap:1rem}.permission-container p{color:#666;margin:0;line-height:1.5}.permission-btn{margin-top:1rem;padding:12px 24px;background-color:#3498db;color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:500;cursor:pointer;transition:background-color .3s}.permission-btn:hover{background-color:#2980b9}.error-text{color:#e74c3c!important;font-weight:500}.saved-locations{margin-bottom:20px}.location-buttons{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:15px}.location-btn{padding:8px 16px;border:1px solid #ddd;border-radius:4px;background:#f5f5f5;cursor:pointer;transition:all .2s}.location-btn.active{background:#007bff;color:#fff;border-color:#0056b3}.add-location-btn{width:100%;padding:8px;margin-top:10px;background:#28a745;color:#fff;border:none;border-radius:4px;cursor:pointer}.add-location-btn:hover{background:#218838}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}