body{margin:0;font-family:Arial,sans-serif;background-color:#f4f4ff;color:#333}.app{display:flex;min-height:100vh}.loading{display:flex;justify-content:center;align-items:center;width:100%}.sidebar{width:250px;background-color:#1a1a1a;color:#fff;padding:20px;box-shadow:2px 0 5px #0000001a;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.sidebar-logo{max-width:120px;height:auto;margin-bottom:25px;padding:5px;background-color:#fff;border-radius:5px;display:block;margin-left:auto;margin-right:auto}.sidebar nav{flex-grow:0}.sidebar button{background:none;border:none;color:#ccc;padding:10px 0;margin-bottom:10px;text-align:left;cursor:pointer;font-size:1rem;transition:color .2s;width:100%}.sidebar button:hover,.sidebar button.active{color:#4caf50;font-weight:700}.btn-logout{background-color:#ff4d4d;color:#fff;padding:10px;border:none;border-radius:5px;width:100%;cursor:pointer;font-size:1rem;transition:background-color .2s;margin-top:15px}.btn-logout:hover{background-color:#e60000}.btn-forgot-pass-sidebar{width:100%;padding:8px;background:none;border:none;color:#007bff;text-align:center;cursor:pointer;font-size:.9rem;margin-bottom:10px}.btn-forgot-pass-sidebar:hover{text-decoration:underline}.main{flex-grow:1;padding:30px;max-width:calc(100vw - 250px)}.main-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid #e5e5e5;margin-bottom:30px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:40px}.card{background-color:#fff;padding:25px;border-radius:8px;box-shadow:0 4px 6px #0000001a}.card h3{font-size:2rem;margin-top:10px;color:#4caf50}.icon-large{width:32px;height:32px;color:#4caf50}.bombonas h3{font-size:1.5rem;margin-bottom:20px;border-bottom:2px solid #ddd;padding-bottom:5px}.bombonas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}.bombona-card{background-color:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000000d;transition:transform .2s;display:flex;flex-direction:column;justify-content:space-between;min-height:250px;height:auto}.bombona-card:hover{transform:translateY(-3px)}.card-info{flex-grow:1;margin-bottom:15px}.detail-text{font-size:.85rem;color:#666;margin:3px 0;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;display:block;line-height:1.2}.detail-text strong{color:#333;font-weight:600;word-break:break-word}.percentual{font-size:1.8rem;font-weight:700;margin:5px 0}.volume-litros{font-size:1.1rem;color:#555;margin-bottom:5px}.volume-litros strong{font-weight:700;color:#333}.status-text{font-size:.9rem;color:#666}.status-text strong{font-weight:700;color:#333}.btn-remover{background-color:#b91c1c;color:#fff;border:none;padding:10px 15px;border-radius:4px;cursor:pointer;transition:background-color .2s;width:100%}.btn-remover:hover{background-color:#a01a1a}.lixeira .bombona-card{background-color:#fcebeb;opacity:1;border:1px solid #ff4d4d;cursor:default}.btn-restaurar{background-color:#4caf50;color:#fff;border:none;padding:10px 15px;border-radius:4px;cursor:pointer;transition:background-color .2s;width:100%}.btn-restaurar:hover{background-color:#43a047}.login-container{display:flex;justify-content:center;align-items:center;min-height:100vh;background-color:#1e1e1e;width:100%}.login-box{background-color:#fff;padding:40px;border-radius:10px;box-shadow:0 10px 25px #0000004d;width:100%;max-width:380px;text-align:center}.login-logo{max-width:150px;height:auto;margin-bottom:30px;padding:10px;background-color:#fff;border-radius:10px}.login-form h3{margin-top:0;margin-bottom:25px;color:#333}.login-form input{width:100%;padding:12px;margin-bottom:15px;border:1px solid #ddd;border-radius:5px;box-sizing:border-box}.btn-login{width:100%;padding:12px;background-color:#4caf50;color:#fff;border:none;border-radius:5px;cursor:pointer;font-size:1rem;transition:background-color .2s;margin-bottom:10px}.btn-login:hover{background-color:#43a047}.error-message{color:#ff4d4d;margin-bottom:15px;font-weight:700}.btn-forgot-pass{background:none;border:none;color:#666;cursor:pointer;font-size:.9rem;margin-top:10px;transition:color .2s}.btn-forgot-pass:hover{color:#4caf50}.btn-voltar{background:none;border:none;color:#666;cursor:pointer;font-size:.9rem;margin-top:20px;display:block;width:100%}.btn-voltar:hover{color:#333}.message-error{color:#ff4d4d;font-weight:700;margin-bottom:10px}.message-success{color:#4caf50;font-weight:700;margin-bottom:10px}.notification-panel{position:absolute;top:55px;right:20px;width:350px;max-height:400px;background-color:#fff;border:1px solid #ddd;border-radius:8px;box-shadow:0 4px 12px #00000026;z-index:1000;display:flex;flex-direction:column;overflow:hidden}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:10px 15px;border-bottom:1px solid #eee;background-color:#f7f7f7}.panel-header h4{margin:0;font-size:1rem;color:#333}.panel-header .close-btn{background:none;border:none;font-size:1.2rem;cursor:pointer;color:#999}.panel-list{overflow-y:auto;padding:10px 15px;flex-grow:1}.notification-item{padding:10px;border-radius:5px;margin-bottom:10px;border-left:4px solid;font-size:.9rem}.notification-item p{margin:3px 0 0;color:#555}.notification-item.desconexao,.notification-item.alerta{border-color:#b91c1c;background-color:#fff0f0}.no-notifications{padding:20px;text-align:center;color:#888}.notification-settings{padding:20px 0}.notification-settings h3{font-size:1.5rem;margin-bottom:20px;border-bottom:2px solid #ddd;padding-bottom:5px}.notification-settings form input[type=text]{padding:10px;border:1px solid #ddd;border-radius:4px;flex-grow:1}.recipients-list{margin-top:20px}.recipient-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #eee}.recipient-item:last-child{border-bottom:none}.recipient-info{display:flex;flex-direction:column}.recipient-info strong{font-size:1rem;color:#333}.recipient-info span{font-size:.85rem;color:#666}.recipient-item .btn-remover{width:100px;padding:6px;margin:0}.alerta-card.alerta,.bombona-card.alerta,.alerta-card.desconexao,.bombona-card.desconectada-card{border-left:8px solid #B91C1C;background-color:#fef2f2;box-shadow:0 4px 6px #b91c1c4d}.alerta-card.alerta p,.bombona-card.alerta p,.alerta-card.desconexao p,.bombona-card.desconectada-card p{color:#b91c1c!important;font-weight:700}.bombona-card.normal{border-left:8px solid #10b981}.bombona-card.baixo{border-left:8px solid #3b82f6}.bombona-card.status-erro-sensor,.bombona-card.sensor-erro{background-color:#fff5f5;border:1px solid #ffcccc;border-left:8px solid #ff4444;box-shadow:0 0 15px #f443}.erro-sensor-section h3{color:#b91c1c;border-bottom-color:#fca5a5}.card.erro-sensor-card h3{color:#ef4444}.error-sensor-box{text-align:center;padding:10px;border-radius:6px;border:1px dashed #ff4444;margin:10px 0}.notification-item.erro-sensor-item{border-color:#f44;background-color:#fff0f0;border-left:5px solid #ff4444}.notification-item.erro-sensor-item strong{color:#b91c1c}.alerta-card.sensor-fail{border-left:8px solid #ff4444;background-color:snow;animation:pulse-border 2s infinite}@keyframes pulse-border{0%{box-shadow:0 0 #f446}70%{box-shadow:0 0 0 10px #f440}to{box-shadow:0 0 #f440}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:2000}.modal-content{background:#fff;padding:20px;border-radius:8px;width:100%;max-width:400px}.btn-mapa-link{display:inline-block;margin:8px 0;font-size:.75rem;color:#2563eb;text-decoration:none;background-color:#eff6ff;padding:4px 10px;border-radius:4px;border:1px solid #bfdbfe;font-weight:700;text-align:center;transition:all .2s}.btn-mapa-link:hover{background-color:#dbeafe;color:#1e40af}