/* MISTER FAST LiveMapChat WEB V4.3 — Enterprise Driver Card UX */
.mf3306-list{
  display:flex!important;flex-direction:column!important;gap:0!important;width:100%!important;
  border:1px solid #d7e3f1!important;border-radius:18px!important;overflow:hidden!important;
  background:#fff!important;box-shadow:0 8px 24px rgba(0,48,112,.06)!important
}
.mf3306-card{
  display:grid!important;
  grid-template-columns:minmax(245px,1.2fr) minmax(210px,.9fr) minmax(280px,1.15fr) auto!important;
  grid-template-areas:"identity status meta actions"!important;
  align-items:center!important;gap:16px!important;min-height:112px!important;
  padding:16px 18px!important;margin:0!important;border:0!important;
  border-bottom:1px solid #e2eaf4!important;border-radius:0!important;background:#fff!important;
  cursor:pointer!important;scroll-margin-top:88px!important;
  transition:background-color .16s ease,box-shadow .16s ease,transform .16s ease!important
}
.mf3306-card:last-child{border-bottom:0!important}
.mf3306-card:hover{
  z-index:2!important;transform:translateY(-1px)!important;background:#fbfdff!important;
  box-shadow:inset 4px 0 0 #003da5,0 10px 26px rgba(0,52,123,.10)!important
}
.mf3306-card.is-selected{
  z-index:3!important;background:#fffdf3!important;
  box-shadow:inset 5px 0 0 #ffc400,0 10px 28px rgba(0,52,123,.12)!important
}
.mf3306-card-top{
  grid-area:identity!important;display:grid!important;grid-template-columns:62px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;align-items:center!important;gap:2px 12px!important;min-width:0!important
}
.mf3306-avatar{
  grid-row:1/span 2!important;width:62px!important;height:62px!important;min-width:62px!important;
  border:2px solid #ffc400!important;border-radius:50%!important;background:#eef5ff!important;
  color:#003da5!important;font-size:28px!important;box-shadow:0 5px 14px rgba(0,61,165,.10)!important
}
.mf3306-name b{display:block!important;color:#073d82!important;font-size:16px!important;font-weight:900!important}
.mf3306-name small{display:block!important;margin-top:4px!important;color:#6c7f98!important;font-size:10px!important;font-weight:700!important}
.mf3306-distance{
  grid-column:2!important;justify-self:start!important;align-self:start!important;margin-top:4px!important;
  padding:5px 9px!important;border:1px solid #f1d46a!important;border-radius:999px!important;
  background:#fff9de!important;color:#705400!important;font-size:10px!important;font-weight:900!important
}
.mf3306-badges{
  grid-area:status!important;display:flex!important;align-items:center!important;gap:7px!important;
  flex-wrap:wrap!important;margin:0!important;min-width:0!important
}
.mf3306-badge{
  display:inline-flex!important;align-items:center!important;min-height:27px!important;padding:5px 9px!important;
  border:1px solid transparent!important;border-radius:999px!important;font-size:9px!important;font-weight:900!important
}
.mf3306-badge.active{border-color:#bfd3f5!important;background:#eaf2ff!important;color:#003da5!important}
.mf3306-badge.online{border-color:#bce9ce!important;background:#e9f9ef!important;color:#087e3d!important}
.mf3306-badge.offline{border-color:#d7dde5!important;background:#f1f3f6!important;color:#667487!important}
.mf3306-badge.gps{border-color:#bce1f4!important;background:#e9f7ff!important;color:#086c9e!important}
.mf3306-badge.no-gps{border-color:#f0c3c3!important;background:#fff0f0!important;color:#b13a3a!important}
.mf3306-badge.radius{border-color:#f1d46a!important;background:#fff8d8!important;color:#806100!important}
.mf3306-meta{
  grid-area:meta!important;display:grid!important;grid-template-columns:1fr 1fr!important;
  gap:8px!important;margin:0!important;min-width:0!important
}
.mf3306-meta>div{
  min-width:0!important;min-height:58px!important;padding:9px 11px!important;
  border:1px solid #e0e8f2!important;border-radius:12px!important;background:#f7f9fc!important
}
.mf3306-meta small{display:block!important;color:#7a899b!important;font-size:9px!important;font-weight:700!important}
.mf3306-meta b{
  display:block!important;margin-top:4px!important;overflow:hidden!important;color:#244b79!important;
  font-size:10px!important;font-weight:900!important;white-space:nowrap!important;text-overflow:ellipsis!important
}
.mf3306-actions{
  grid-area:actions!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;
  gap:7px!important;flex-wrap:nowrap!important;margin:0!important;min-width:max-content!important
}
.mf3306-actions button,.mf3306-actions a{
  min-width:58px!important;min-height:36px!important;padding:7px 10px!important;
  border:1px solid #c9d8e8!important;border-radius:10px!important;background:#fff!important;color:#174a80!important;
  font-size:10px!important;font-weight:900!important;text-decoration:none!important;
  transition:transform .14s ease,background-color .14s ease,border-color .14s ease,box-shadow .14s ease!important
}
.mf3306-actions button:hover,.mf3306-actions a:hover{
  transform:translateY(-1px)!important;border-color:#8eb0d6!important;background:#edf4fc!important;
  box-shadow:0 5px 12px rgba(0,61,165,.10)!important
}
.mf3306-actions .primary{
  min-width:68px!important;border-color:#ffc400!important;background:#ffc400!important;color:#002d66!important;
  box-shadow:0 6px 14px rgba(255,196,0,.22)!important
}
.mf3306-actions .primary:hover{
  border-color:#003da5!important;background:#003da5!important;color:#fff!important;
  box-shadow:0 7px 17px rgba(0,61,165,.22)!important
}
.mf3306-card:focus-visible{outline:3px solid rgba(0,61,165,.28)!important;outline-offset:-3px!important}
@media(max-width:1280px){
  .mf3306-card{
    grid-template-columns:minmax(220px,1fr) minmax(190px,.8fr) minmax(235px,1fr)!important;
    grid-template-areas:"identity status meta" "identity actions actions"!important;gap:12px 14px!important
  }
}
@media(max-width:900px){
  .mf3306-card{
    grid-template-columns:1fr!important;
    grid-template-areas:"identity" "status" "meta" "actions"!important;gap:11px!important;min-height:0!important
  }
  .mf3306-actions{justify-content:flex-start!important;flex-wrap:wrap!important;min-width:0!important}
  .mf3306-actions button,.mf3306-actions a{flex:1 1 92px!important}
}
@media(max-width:520px){
  .mf3306-list{border-radius:14px!important}.mf3306-card{padding:13px!important}
  .mf3306-meta{grid-template-columns:1fr!important}
  .mf3306-card-top{grid-template-columns:54px minmax(0,1fr)!important}
  .mf3306-avatar{width:54px!important;height:54px!important;min-width:54px!important}
}