body
{
   background-color: #FFFFFF;
   color: #000000;
   font-family: Arial;
   font-weight: normal;
   font-size: 16px;
   line-height: 1.1875;
   margin: 0;
   padding: 0;
}
html,body{
 margin:0;
 width:100%;
 height:100%;
 overflow:hidden;
 font-family:sans-serif;
 direction:rtl;
}

/* WRAPPER واقعی */
#app{
 position:fixed;
 inset:0;
 height:100vh;
 width:100vw;
}

/* MAP */
#map{
 width:100%;
 height:100%;
 pointer-events:auto;
}

/* PANEL */
#panel{
 position:absolute;
 top:16px;
 right:16px;
 width:280px;
 background:rgba(255,255,255,.92);
 backdrop-filter:blur(18px);
 border-radius:18px;
 padding:12px;
 z-index:999;
  pointer-events:auto;
}
@media(max-width:768px){
 #panel{
  right:50%;
  transform:translateX(50%);
  width:92%;
 }
}

/* UI */
button{
 width:100%;
 padding:12px;
 margin-bottom:10px;
 border-radius:14px;
 border:none;
 background:#fff;
 box-shadow:0 8px 18px rgba(0,0,0,.15);
}
.dropdown{display:none}
.item{padding:10px;border-radius:12px}
.item:hover{background:#eee}

/* POPUP */
.brand-card{
 width:220px;
 text-align:center;
 background:#fff;
 border-radius:18px;
 padding:14px;
 box-shadow:0 20px 40px rgba(0,0,0,.25);
}
.brand-card img{width:56px;margin-bottom:6px}