/* ===== BMW KOKPİT ANALİTİK ===== */
.bm-section{padding:64px 0 44px;background:#080b12;position:relative;overflow:hidden}
.bm-section::before{content:'';position:absolute;inset:0;background:
  radial-gradient(ellipse at 20% 50%,rgba(0,255,136,0.03) 0%,transparent 50%),
  radial-gradient(ellipse at 80% 50%,rgba(59,130,246,0.03) 0%,transparent 50%),
  radial-gradient(ellipse at 50% 0%,rgba(168,85,247,0.04) 0%,transparent 40%);pointer-events:none}
.bm-scanline{position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,rgba(0,255,136,0.15),transparent);animation:bmScan 4s linear infinite;z-index:3}
@keyframes bmScan{0%{top:0}100%{top:100%}}
.bm-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.bm-particles span{position:absolute;width:2px;height:2px;background:rgba(0,170,255,0.35);border-radius:50%;animation:bmFloat 10s linear infinite}
@keyframes bmFloat{0%{transform:translateY(110vh) scale(0);opacity:0}10%{opacity:1}90%{opacity:0.8}100%{transform:translateY(-10vh) scale(1.2);opacity:0}}

.bm-header{text-align:center;margin-bottom:44px;position:relative;z-index:2}
.bm-live-pill{display:inline-flex;align-items:center;gap:10px;padding:7px 20px;border-radius:999px;background:rgba(0,255,136,0.05);border:1px solid rgba(0,255,136,0.12);font-size:0.62rem;font-weight:900;letter-spacing:0.18em;color:#00ff88;text-shadow:0 0 12px rgba(0,255,136,0.4);position:relative;margin-bottom:16px}
.bm-live-dot{width:7px;height:7px;border-radius:50%;background:#00ff88;box-shadow:0 0 10px #00ff88,0 0 30px rgba(0,255,136,0.4);animation:bmPulse 1.4s ease-in-out infinite}
.bm-live-ring{position:absolute;left:18px;width:18px;height:18px;border-radius:50%;border:1.5px solid rgba(0,255,136,0.25);animation:bmRing 2s ease-out infinite}
@keyframes bmPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.5;transform:scale(0.8)}}
@keyframes bmRing{0%{transform:scale(0.6);opacity:0.7}100%{transform:scale(2.5);opacity:0}}
.bm-title{font-size:clamp(1.7rem,3.5vw,2.4rem);font-weight:900;color:#fff;margin:0 0 6px;letter-spacing:-0.03em;text-shadow:0 0 60px rgba(0,136,255,0.15)}
.bm-sub{font-size:0.8rem;color:rgba(255,255,255,0.28);margin:0;letter-spacing:0.04em;font-weight:500}

/* Kadranlar — 5 sütun */
.bm-dash{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:36px;position:relative;z-index:2}
.bm-dash-5{grid-template-columns:repeat(5,1fr);gap:12px}
.bm-gauge-wrap{display:flex;flex-direction:column;align-items:center;gap:2px}
.bm-gauge{position:relative;width:100%;max-width:200px;aspect-ratio:1}
.bm-gauge canvas{position:absolute;inset:0;width:100%!important;height:100%!important}

/* Değer + birim: kadranın ALTINDA */
.bm-gauge-info{display:flex;flex-direction:column;align-items:center;margin-top:-8px}
.bm-gauge-val{font-size:clamp(1.5rem,2.2vw,2.2rem);font-weight:900;color:#fff;letter-spacing:-0.04em;line-height:1;font-family:'Inter',sans-serif;text-shadow:0 0 30px rgba(255,255,255,0.08)}
.bm-gauge-unit{font-size:0.52rem;color:rgba(255,255,255,0.25);font-weight:700;text-transform:uppercase;letter-spacing:0.1em;margin-top:2px}
.bm-gauge-lbl{font-size:0.55rem;font-weight:900;color:rgba(255,255,255,0.35);letter-spacing:0.12em;text-transform:uppercase;text-align:center;margin-top:2px}
.bm-gauge-glow{position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(circle,var(--gc),transparent 65%);opacity:0;filter:blur(20px);animation:bmGlow 3s ease-in-out infinite alternate;pointer-events:none}
@keyframes bmGlow{0%{opacity:0.05}100%{opacity:0.15}}

/* Eski overlay stili kaldırıldı — artık kullanılmıyor */
.bm-gauge-center{display:none}

/* Paneller */
.bm-panels{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;position:relative;z-index:2}
.bm-panel{padding:24px;border-radius:14px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.05);backdrop-filter:blur(8px)}
.bm-panel-hdr{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.bm-panel-ico{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;background:rgba(255,71,87,0.12);color:var(--pic,#ff4757);font-size:12px}
.bm-panel-ttl{font-size:0.8rem;font-weight:800;color:rgba(255,255,255,0.75);flex:1}
.bm-hud-tag{font-size:0.55rem;font-weight:900;letter-spacing:0.12em;color:rgba(0,255,136,0.45);padding:2px 8px;border:1px solid rgba(0,255,136,0.12);border-radius:5px}
.bm-cities{display:flex;flex-direction:column;gap:7px}
.bm-city-row{display:flex;align-items:center;gap:10px}
.bm-city-name{font-size:0.73rem;font-weight:700;color:rgba(255,255,255,0.55);min-width:74px}
.bm-city-bar-bg{flex:1;height:5px;border-radius:3px;background:rgba(255,255,255,0.03);overflow:hidden}
.bm-city-bar{height:100%;border-radius:3px;transition:width 1.8s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden}
.bm-city-bar::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent 30%,rgba(255,255,255,0.25) 50%,transparent 70%);animation:bmShimmer 2.5s linear infinite}
@keyframes bmShimmer{0%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.bm-city-cnt{font-size:0.65rem;color:rgba(255,255,255,0.3);font-weight:800;min-width:26px;text-align:right}

/* 7 Günlük Trend — Bar sayıları HER ZAMAN görünür */
.bm-chart{display:flex;align-items:flex-end;gap:8px;height:110px;margin-bottom:14px;padding-bottom:24px;padding-top:24px;position:relative}
.bm-chart::before{content:'';position:absolute;bottom:22px;left:0;right:0;height:1px;background:rgba(255,255,255,0.04)}
.bm-chart-bar{flex:1;border-radius:5px 5px 1px 1px;min-height:4px;transition:height 1.8s cubic-bezier(0.4,0,0.2,1);position:relative;cursor:pointer;overflow:visible}
.bm-chart-bar::before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,0.18),transparent 60%);pointer-events:none}
.bm-chart-bar:hover{filter:brightness(1.4) drop-shadow(0 0 8px currentColor);transform:scaleY(1.08);transform-origin:bottom}
.bm-chart-bar::after{content:attr(data-label);position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:0.52rem;color:rgba(255,255,255,0.2);font-weight:600;white-space:nowrap}

/* Bar üstü sayı — HER ZAMAN görünür */
.bm-bar-cnt{position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-size:0.62rem;color:rgba(255,255,255,0.7)!important;font-weight:900;white-space:nowrap;opacity:1!important;text-shadow:0 1px 3px rgba(0,0,0,0.8)}

.bm-devices{display:flex;gap:10px;flex-wrap:wrap}
.bm-device{display:flex;align-items:center;gap:5px;padding:4px 11px;border-radius:7px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.04)}
.bm-device i{font-size:0.65rem;color:rgba(255,255,255,0.25)}
.bm-device span{font-size:0.65rem;font-weight:700;color:rgba(255,255,255,0.4)}
.bm-footer{display:flex;justify-content:space-between;align-items:center;font-size:0.65rem;color:rgba(255,255,255,0.18);position:relative;z-index:2;padding-top:10px;border-top:1px solid rgba(255,255,255,0.03)}
.bm-ft-left{display:flex;align-items:center;gap:6px}
.bm-ft-dot{width:5px;height:5px;border-radius:50%;background:#00ff88;animation:bmPulse 2s ease-in-out infinite}
.bm-ft-right{padding:3px 12px;border-radius:7px;background:rgba(255,68,87,0.05);color:rgba(255,68,87,0.4);font-weight:700}
@media(max-width:992px){.bm-dash,.bm-dash-5{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.bm-dash,.bm-dash-5{grid-template-columns:repeat(2,1fr)}.bm-panels{grid-template-columns:1fr}.bm-gauge-val{font-size:1.5rem}}
@media(max-width:480px){.bm-section{padding:40px 0 24px}.bm-gauge-val{font-size:1.3rem}.bm-footer{flex-direction:column;gap:8px;text-align:center}}
