/* ============================================================
   locations.labels.css — v3.1.0
   Emplacements : topbar, zones, cards, table sort
   Étiquettes gérées dans popup dédiée (pas de CSS inline ici)
   ============================================================ */

/* ═══════ TOPBAR ═══════ */
.loc-topbar { display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:var(--sp-4); }
.loc-topbar-left { display:flex;align-items:center;gap:10px;flex:1;min-width:0; }
.loc-topbar-right { display:flex;align-items:center;gap:8px; }
.loc-sel { min-width:180px; }
.loc-search-wrap { position:relative;flex:1;min-width:200px;max-width:360px; }
.loc-search-ico { position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--text-muted);pointer-events:none; }
.loc-search-inp { padding-left:36px!important;width:100%; }

/* ═══════ VIEW BAR ═══════ */
.loc-view-bar { display:flex;align-items:center;margin-bottom:var(--sp-3); }
.loc-view-toggle { display:flex;gap:2px;background:var(--bg-elevated);border-radius:10px;padding:3px; }
.loc-vbtn {
  appearance:none;border:none;background:transparent;font-size:13px;font-weight:700;
  padding:7px 14px;border-radius:8px;cursor:pointer;color:var(--text-muted);transition:all .15s;
}
.loc-vbtn:hover { color:var(--text-primary); }
.loc-vbtn.active { background:var(--bg-card);color:var(--text-primary);box-shadow:0 1px 3px rgba(0,0,0,.08); }

/* ═══════ CARDS ═══════ */
.loc-card { margin-bottom:var(--sp-4); }

/* ═══════ ZONES ═══════ */
.loc-zones-empty { text-align:center;color:var(--text-muted);padding:48px 20px;font-size:14px;font-weight:600; }
.loc-zone-group { margin-bottom:var(--sp-5); }
.loc-zone-hdr { display:flex;align-items:center;gap:10px;margin-bottom:var(--sp-3);padding-bottom:var(--sp-2);border-bottom:2px solid var(--border); }
.loc-zone-name { font-size:15px;font-weight:800;color:var(--text-primary); }
.loc-zone-count { font-size:11px;color:var(--text-muted);font-weight:600;background:var(--bg-elevated);padding:2px 8px;border-radius:10px; }
.loc-zone-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px; }

/* ═══════ CARTE EMPLACEMENT ═══════ */
.loc-emplacement {
  background:var(--bg-card);border:1.5px solid var(--border);border-radius:var(--r-lg);
  padding:14px 16px;transition:border-color .2s,box-shadow .2s,transform .15s;
}
.loc-emplacement:hover { border-color:rgba(59,130,246,.35);box-shadow:0 4px 14px rgba(59,130,246,.08);transform:translateY(-1px); }
.loc-card-inactive { opacity:0.55; }
.loc-emp-top { display:flex;align-items:center;gap:12px;margin-bottom:10px; }
.loc-emp-icon { width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:18px;color:#fff;flex-shrink:0; }
.loc-emp-info { flex:1;min-width:0; }
.loc-emp-code { font-size:15px;font-weight:800;color:var(--text-primary);line-height:1.2; }
.loc-emp-label { font-size:12px;color:var(--text-muted);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.loc-emp-meta { display:flex;align-items:center;gap:10px;margin-bottom:10px; }
.loc-emp-type { font-size:11px;font-weight:700;color:var(--text-secondary);background:var(--bg-elevated);border-radius:6px;padding:3px 8px; }
.loc-emp-wh { font-size:11px;color:var(--text-muted); }
.loc-emp-actions { display:flex;gap:6px; }

/* ═══════ TABLE ═══════ */
.loc-type-badge {
  display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;
  padding:3px 10px;border-radius:8px;background:var(--bg-elevated);color:var(--tc,var(--text-secondary));
}
th.sortable { cursor:pointer;user-select:none; }
th.sortable::after { content:' ⇅';opacity:0.3;font-size:11px; }
th.sortable.sorted::after { opacity:1; }
th.sortable.sorted[data-dir="asc"]::after { content:' ↑'; }
th.sortable.sorted[data-dir="desc"]::after { content:' ↓'; }

/* ═══════ RESPONSIVE ═══════ */
@media(max-width:768px){
  .loc-topbar{flex-direction:column;align-items:stretch;}
  .loc-topbar-left{flex-direction:column;}
  .loc-search-wrap{max-width:none;}
  .loc-zone-grid{grid-template-columns:1fr;}
}
