/* Lista de unidades minimalista (M1) GPSFOX - v3 */

/* ---------- Pestanas Unidades / Eventos / Historial ---------- */
#sidebar .sidebar-content > .nav-tabs { background: #fff !important; border-bottom: 1px solid #eef0f3 !important; padding: 0 8px; }
#sidebar .sidebar-content > .nav-tabs > li > a {
  background: transparent !important; border: 0 !important; border-radius: 0 !important;
  color: #8a93a3 !important; font-size: 13px; padding: 12px 8px 10px !important;
}
#sidebar .sidebar-content > .nav-tabs > li.active > a,
#sidebar .sidebar-content > .nav-tabs > li > a:hover { color: #1e2a4a !important; }
#sidebar .sidebar-content > .nav-tabs > li.active > a { font-weight: 600; box-shadow: inset 0 -2px 0 #1e2a4a; }

/* ---------- Buscador ---------- */
#objects_tab .tab-pane-header { background: #fff !important; padding: 8px 12px 0 !important; }
#objects_tab .tab-pane-header .search .form-control {
  background: transparent !important; border: 0 !important; border-bottom: 1px solid #e5e7eb !important;
  border-radius: 0 !important; box-shadow: none !important; font-size: 13px;
}
#objects_tab .tab-pane-header .search .form-control:focus { border-bottom-color: #1e2a4a !important; }
#objects_tab .tab-pane-header .btn-primary { border-radius: 0 !important; background: #1e2a4a !important; border-color: #1e2a4a !important; }

/* ---------- Filtros ---------- */

#objects_tab[data-gfx-filter="mov"] .group-list > li:not([data-gfx-st="mov"]),
#objects_tab[data-gfx-filter="stop"] .group-list > li:not([data-gfx-st="stop"]),
#objects_tab[data-gfx-filter="off"] .group-list > li:not([data-gfx-st="off"]):not([data-gfx-st="exp"]) { display: none !important; }

/* ---------- Encabezado de grupo ---------- */
#objects_tab .group-heading { background: #fff !important; border-radius: 0 !important; border-top: 1px solid #eef0f3; padding: 10px 14px 6px !important; }
#objects_tab .group-heading > .group-title {
  font-size: 11px !important; letter-spacing: .08em; text-transform: uppercase; color: #8a93a3 !important; font-weight: 600;
}

/* ---------- Filas ---------- */
#objects_tab .group-list { background: #fff !important; }
#objects_tab .group-list > li {
  border: 0 !important; border-top: 1px solid #f0f2f5 !important; border-radius: 0 !important; background: #fff;
}
#objects_tab .group-list > li:hover { background: #fafbfc !important; }
#objects_tab .group-list > li.active { background: #f4f9ec !important; }
#objects_tab .group-list > li > .checkbox { padding: 10px 0 10px 14px !important; }
#objects_tab .group-list > li > .name { padding-top: 9px !important; padding-bottom: 9px !important; padding-left: 12px !important; }
#objects_tab .group-list > li > .details { padding-top: 11px !important; padding-bottom: 9px !important; padding-right: 6px !important; }

/* Nombre con punto de estado */
#objects_tab .group-list > li [data-device="name"] { font-size: 14px; font-weight: 600; color: #1e2a4a; }
#objects_tab .group-list > li[data-gfx-st] [data-device="name"]:before {
  content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  margin: 0 9px 2px 0; vertical-align: middle; background: #b8bec8;
}
#objects_tab .group-list > li[data-gfx-st="mov"]  [data-device="name"]:before { background: #65b200; }
#objects_tab .group-list > li[data-gfx-st="stop"] [data-device="name"]:before { background: #f5a623; }
#objects_tab .group-list > li[data-gfx-st="off"]  [data-device="name"]:before { background: #f43d44; }
#objects_tab .group-list > li[data-gfx-st="exp"]  [data-device="name"]       { color: #9aa3af; }

/* Tiempo relativo (la fecha original queda oculta y se muestra "hace X") */
#objects_tab .group-list > li.gfx-ok [data-device="time"] { display: none !important; }
#objects_tab .group-list > li .gfx-rel { display: block; font-size: 11.5px; color: #8a93a3; margin: 1px 0 0 16px; }

/* Derecha: velocidad solo si se mueve; si no, el estado en texto */
#objects_tab .group-list > li.gfx-ok [data-device="status"],
#objects_tab .group-list > li.gfx-ok [data-device="detect_engine"] { display: none !important; }
#objects_tab .group-list > li .gfx-st { font-size: 12.5px; color: #8a93a3; }
#objects_tab .group-list > li[data-gfx-st="mov"] .gfx-st { display: none; }

/* ---------- Casilla (cuadrito recto) ---------- */
#objects_tab .checkbox label { display: inline-block !important; width: 16px; height: 16px; position: relative; vertical-align: middle; }
#objects_tab .checkbox label::after {
  width: 16px !important; height: 16px !important; border: 1.5px solid #cbd5e1 !important;
  border-radius: 0 !important; background: #fff !important; box-sizing: border-box;
}
#objects_tab .checkbox label::before {
  content: "" !important; position: absolute !important; left: 5.5px; top: 2.5px; z-index: 1;
  width: 5px !important; height: 9px !important; margin: 0 !important; padding: 0 !important;
  background: transparent !important; border: solid transparent; border-width: 0 2px 2px 0;
  border-radius: 0 !important; transform: rotate(45deg); box-sizing: border-box;
}
#objects_tab .checkbox input:checked + label::after { background: #fff !important; border-color: #cbd5e1 !important; }
#objects_tab .checkbox input:checked + label::before { border-color: #6b7280; }
#objects_tab .checkbox input:hover + label::after { border-color: #1e2a4a !important; }

/* ---------- Filtros de estado v2: 4 casillas iguales, sin scroll ---------- */
.gfx-filters { display: grid; grid-template-columns: repeat(4, 1fr); margin: 10px 12px 8px; border: 1px solid #eef0f3; background: #fff; }
.gfx-filters button {
  all: unset; box-sizing: border-box; cursor: pointer; min-width: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 7px 2px 6px; border-bottom: 2px solid transparent;
  font: 10.5px/1.2 "Segoe UI", Roboto, Arial, sans-serif; color: #8a93a3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background .15s;
}
.gfx-filters button + button { border-left: 1px solid #eef0f3; }
.gfx-filters button:hover { background: #fafbfc; color: #1e2a4a; }
.gfx-filters button i {
  order: -1; display: flex; align-items: center; gap: 5px; margin-bottom: 2px;
  font-style: normal; font-size: 15px; font-weight: 700; color: #1e2a4a;
}
.gfx-filters button[data-f="mov"] i:before,
.gfx-filters button[data-f="stop"] i:before,
.gfx-filters button[data-f="off"] i:before { content: ""; width: 7px; height: 7px; border-radius: 50%; }
.gfx-filters button[data-f="mov"] i:before  { background: #65b200; }
.gfx-filters button[data-f="stop"] i:before { background: #f5a623; }
.gfx-filters button[data-f="off"] i:before  { background: #f43d44; }
.gfx-filters button.a { background: #f8fafc; color: #1e2a4a; font-weight: 600; }
.gfx-filters button.a[data-f="all"]  { border-bottom-color: #1e2a4a; }
.gfx-filters button.a[data-f="mov"]  { border-bottom-color: #65b200; }
.gfx-filters button.a[data-f="stop"] { border-bottom-color: #f5a623; }
.gfx-filters button.a[data-f="off"]  { border-bottom-color: #f43d44; }

/* ---------- Velocidad grande (numero + km/h) ---------- */
#objects_tab .group-list > li.gfx-ok [data-device="speed"] { display: none !important; }
#objects_tab .group-list > li .gfx-spd { display: none; white-space: nowrap; }
#objects_tab .group-list > li[data-gfx-st="mov"] .gfx-spd { display: inline-block; }
#objects_tab .group-list > li .gfx-spd b { font-size: 18px; font-weight: 600; letter-spacing: -.03em; color: #1e2a4a; line-height: 1; }
#objects_tab .group-list > li .gfx-spd small { font-size: 10px; font-weight: 600; color: #8a93a3; margin-left: 2px; }
