/* driver/styles.css */
:root{
  --bg:#0b0b0c;
  --panel: rgba(17,18,20,0.88);
  --panel2:#16181b;
  --text:#f2f2f2;
  --muted:#a7a7a7;
  --accent:#3ddc97;
  --danger:#ff4d4d;
  --warn:#ffcc00;
  --border: rgba(255,255,255,0.10);
}

*{ box-sizing:border-box; }
html,body{ height:100%; margin:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial; background:var(--bg); color:var(--text); }
#app{ height:100%; position:relative; }
#map{ position:absolute; inset:0; }

.topbar{
  position:absolute; top:12px; left:12px; right:12px;
  display:flex; justify-content:space-between; gap:10px; z-index:999;
}
.brand{
  background: rgba(0,0,0,0.55);
  border:1px solid var(--border);
  padding:10px 12px;
  border-radius:14px;
  backdrop-filter: blur(10px);
  display:flex; gap:10px; align-items:center;
}
.pill{
  background: rgba(0,0,0,0.55);
  border:1px solid var(--border);
  padding:10px 12px;
  border-radius:999px;
  backdrop-filter: blur(10px);
  font-size:13px;
  color:var(--muted);
}

.panel{
  position:absolute; left:12px; right:12px; bottom:12px;
  background: var(--panel);
  border:1px solid var(--border);
  border-radius:18px;
  padding:12px;
  z-index:999;
  backdrop-filter: blur(14px);
}

.panel h3{ margin:0 0 8px 0; font-size:16px; }
.small{ font-size:12px; color:var(--muted); }
.hr{ height:1px; background: rgba(255,255,255,0.08); margin:10px 0; }

.row{ display:flex; gap:10px; }
.row > *{ flex:1; }

.input{
  width:100%;
  background: var(--panel2);
  border:1px solid var(--border);
  border-radius:14px;
  padding:12px;
  color:var(--text);
  outline:none;
}

.btn{
  width:100%;
  border:none;
  border-radius:14px;
  padding:12px;
  font-weight:800;
  cursor:pointer;
}

.btn-primary{ background: var(--accent); color:#032015; }
.btn-ghost{ background: transparent; border:1px solid var(--border); color:var(--text); }
.btn-danger{ background: var(--danger); color:white; }
.btn-warn{ background: var(--warn); color:#1b1600; }

.status{
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background: rgba(0,0,0,0.30);
  font-size:13px;
}
.card{
  border:1px solid var(--border);
  border-radius:16px;
  padding:10px;
  background: rgba(0,0,0,0.25);
}

.leaflet-control-attribution{ display:none; }