body{background:radial-gradient(circle at top,#0b1c26,#05080d);color:#fff;font-family:Inter,system-ui}.card-glass{background:#ffffff0f;border-radius:24px;padding:30px;box-shadow:0 30px 80px #000000b3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.tank-shell{width:110px;height:300px;border-radius:60px;background:linear-gradient(90deg,#444,#999,#444);padding:6px;position:relative;margin:auto}.tank-inner{background:#0b0f14;width:100%;height:100%;border-radius:50px;overflow:hidden;position:relative}.scale{position:absolute;right:-20px;top:10px;bottom:10px;display:flex;flex-direction:column;justify-content:space-between;font-size:10px;opacity:.6}.liquid{position:absolute;bottom:0;width:100%;transition:height 1.8s ease;overflow:hidden}.liquid.petrol{background:linear-gradient(180deg,#00ffb2,#00b37a);box-shadow:0 0 40px #00ffb2aa}.liquid.diesel{background:linear-gradient(180deg,#ffd54f,#ff9800);box-shadow:0 0 40px #ff9800aa}.wave{position:absolute;top:-20px;width:200%;height:40px;background:#ffffff59;border-radius:100%;animation:wave 4s linear infinite}.wave:nth-child(2){opacity:.5;animation-duration:6s}@keyframes wave{0%{transform:translate(0)}to{transform:translate(-50%)}}.percent{text-align:center;font-size:1.6rem;font-weight:700;margin-top:15px}.label{text-align:center;letter-spacing:1px;opacity:.85}.tank-meta{color:#e6edf3;font-size:.85rem;opacity:.9}.tank-status-badge{padding:4px 10px;border-radius:8px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.status-online{background:#00c85326;color:#00c853;border:1px solid rgba(0,200,83,.3)}.status-offline{background:#ff444426;color:#f44;border:1px solid rgba(255,68,68,.3)}.tank-number-badge{background:#00d9ff26;color:#00d9ff;padding:4px 10px;border-radius:8px;font-size:.7rem;font-weight:700;border:1px solid rgba(0,217,255,.3)}.alert-badge{padding:6px 12px;border-radius:8px;font-size:.75rem;font-weight:600;text-align:center}.error-badge{background:#ff444426;color:#f44;border:1px solid rgba(255,68,68,.3)}.delivery-badge{background:#ffa72626;color:#ffa726;border:1px solid rgba(255,167,38,.3)}.tank-metrics{font-size:.85rem}.metric-section{margin-bottom:16px;padding:12px;background:#ffffff08;border-radius:10px;border-left:3px solid rgba(0,217,255,.5)}.metric-header{font-weight:700;color:#00d9ff;margin-bottom:10px;font-size:.9rem;letter-spacing:.5px}.metric-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05)}.metric-row:last-child{border-bottom:none}.metric-label{color:#a8b8c8;font-weight:500;font-size:.8rem}.metric-value{color:#e6edf3;font-weight:600;text-align:right;font-size:.85rem}.highlight-sales{color:#0f8;font-weight:700}.text-success{color:#00c853!important}.text-warning{color:#ffa726!important}.metric-footer{margin-top:12px;padding-top:8px;border-top:1px solid rgba(255,255,255,.08);text-align:center}.metric-footer .text-muted{color:#7a8a9a!important;font-size:.75rem}.pump-card{transition:transform .3s ease,box-shadow .3s ease;position:relative;overflow:hidden}.pump-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#00d9ff,#0f8);opacity:0;transition:opacity .3s ease}.pump-card:hover{transform:translateY(-5px);box-shadow:0 35px 90px #000c}.pump-card:hover:before{opacity:1}.pump-device{color:#00d9ff;font-size:1.2rem;font-weight:700;margin:0;text-transform:uppercase;letter-spacing:1px}.pump-mode-badge{background:#00d9ff26;color:#00d9ff;padding:3px 10px;border-radius:8px;font-size:.7rem;font-weight:600;border:1px solid rgba(0,217,255,.3)}.badge{padding:4px 12px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.nozzle-idle{background:#9e9e9e33;color:#9e9e9e;border:1px solid rgba(158,158,158,.4)}.nozzle-calling{background:#ffa72633;color:#ffa726;border:1px solid rgba(255,167,38,.4);animation:pulse 2s ease-in-out infinite}.nozzle-authorized{background:#42a5f533;color:#42a5f5;border:1px solid rgba(66,165,245,.4)}.nozzle-dispensing{background:linear-gradient(135deg,#0f8,#00c853);color:#fff;box-shadow:0 0 20px #00ff8880;animation:pulse 1.5s ease-in-out infinite}.nozzle-stopped{background:#f443;color:#f44;border:1px solid rgba(255,68,68,.4)}.nozzle-unknown{background:#9e9e9e33;color:#9e9e9e;border:1px solid rgba(158,158,158,.4)}.pump-nozzle-info{background:#00d9ff0d;padding:10px;border-radius:10px;border-left:3px solid rgba(0,217,255,.6)}.nozzle-header{display:flex;justify-content:space-between;align-items:center}.nozzle-grade{font-size:1rem;font-weight:700;text-transform:uppercase;letter-spacing:1px}.nozzle-tank-badge{background:#ffffff1a;padding:3px 10px;border-radius:6px;font-size:.7rem;color:#e6edf3;font-weight:600}.transaction-box{background:linear-gradient(135deg,#00d9ff1a,#00ff881a);padding:12px;border-radius:12px;border:1px solid rgba(0,217,255,.2)}.transaction-header{font-size:.85rem;font-weight:700;color:#00d9ff;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.transaction-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.transaction-item{display:flex;flex-direction:column;align-items:center}.transaction-label{font-size:.7rem;color:#a8b8c8;margin-bottom:4px;text-transform:uppercase;letter-spacing:.5px}.transaction-value{font-size:1rem;font-weight:700;color:#0f8}.pump-details-compact{background:#ffffff05;padding:10px;border-radius:8px}.detail-row-compact{display:flex;align-items:center;padding:6px 0;font-size:.85rem}.detail-icon{margin-right:8px;font-size:1rem}.detail-text{color:#e6edf3;font-weight:500}.nozzle-totalizer{background:#00ff880d;padding:12px;border-radius:10px;text-align:center;border:1px solid rgba(0,255,136,.2)}.totalizer-label{font-size:.75rem;color:#a8b8c8;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.totalizer-value{font-size:1.3rem;font-weight:700;color:#0f8;margin-bottom:4px}.k-factor-info{color:#7a8a9a;font-size:.7rem}.badge-active{background:linear-gradient(135deg,#f44,#c00);color:#fff;box-shadow:0 0 20px #ff444480;animation:pulse 2s ease-in-out infinite}.badge-cleared{background:linear-gradient(135deg,#00c853,#00a843);color:#fff;box-shadow:0 0 15px #00c85366}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.priority-badge{padding:4px 12px;border-radius:12px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px}.priority-high{background:#f443;color:#f44;border:1px solid rgba(255,68,68,.4)}.priority-medium{background:#ffa72633;color:#ffa726;border:1px solid rgba(255,167,38,.4)}.priority-low{background:#42a5f533;color:#42a5f5;border:1px solid rgba(66,165,245,.4)}.priority-normal{background:#9e9e9e33;color:#9e9e9e;border:1px solid rgba(158,158,158,.4)}.pump-description{color:#e6edf3;font-size:.95rem;line-height:1.5;padding:12px;background:#ffffff08;border-radius:8px;border-left:3px solid #00d9ff}.empty-state{padding:40px 20px}.empty-icon{font-size:4rem;margin-bottom:20px;opacity:.4}.empty-state h4{color:#e6edf3;margin-bottom:10px}.empty-state .text-muted{color:#a8b8c8!important;font-size:.9rem}