/* eabassets - kit/grid.css
   Styles for kit/grid.js: the full-width data grid behind every list, shaped
   like Asset Panda's (toolbar, pinned filters, sticky light header, blue link
   text, status pills, per-row action links, totals). Every colour is a token. */

.dg{--dg-maxh:none;--dg-py:var(--cell-y);--dg-px:var(--cell-x);--dg-headh:38px;display:flex;flex-direction:column;min-width:0;width:100%;font:13px/1.5 var(--font);color:var(--txt);gap:10px}

/* toolbar: search, pinned filters, Filter, View, Columns */
.dg-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:32px}
.dg-tools .dg-search{position:relative;display:flex;align-items:center;flex:0 1 280px;min-width:170px}
.dg-tools .dg-search .sic{position:absolute;left:10px;display:flex;color:var(--faint);pointer-events:none}
.dg-tools .dg-search input.dg-search-i{height:32px;width:100%;padding:0 10px 0 30px;border-radius:var(--radius-ctl)}
.dg-tools .grow{flex:1 1 auto}
.dg-tools .tb{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 11px;border:1px solid var(--line);border-radius:var(--radius-ctl);background:var(--panel);color:var(--muted);font-family:var(--font-head);font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap}
.dg-tools .tb:hover{color:var(--accent);border-color:var(--accent)}
.dg-tools .tb.on{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.dg-tools .tb .ic{display:flex;opacity:.85}
.dg-tools .tb .n{font-size:10.5px;background:var(--accent);color:var(--accent-txt);border-radius:var(--pill);padding:0 6px;line-height:16px}

/* pinned filters (saved views) live in the toolbar, Asset Panda style */
.dg-views{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-height:28px}
.dg-views .lab{font-family:var(--font-head);font-size:10.5px;font-weight:700;color:var(--faint);letter-spacing:.05em;text-transform:uppercase;margin-right:2px}

/* active filter chips */
.dg-filters{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.dg-filters:empty{display:none}

/* totals strip above the grid */
.dg-summary{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dg-summary .s{display:inline-flex;align-items:baseline;gap:8px;padding:8px 14px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--panel);box-shadow:var(--shadow)}
.dg-summary .s .k{font-family:var(--font-head);font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.dg-summary .s .v{font-family:var(--font-head);font-size:16px;font-weight:600;color:var(--heading);font-variant-numeric:tabular-nums}

/* bulk bar (replaces the toolbar while rows are selected) */
.dg-bulk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;border-radius:var(--radius-card);background:var(--brand);color:#fff;font-size:12.5px}
.dg-bulk b{font-family:var(--font-head);font-weight:600}
.dg-bulk .btn{background:rgba(255,255,255,.16);border-color:transparent;color:#fff;height:30px;box-shadow:none}
.dg-bulk .btn:hover{background:rgba(255,255,255,.28);color:#fff;border-color:transparent}
.dg-bulk .btn.danger{color:#fff}
.dg-bulk .sp{flex:1}

/* the table */
.dg-scroll{position:relative;overflow:auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:var(--shadow);max-height:var(--dg-maxh,none);outline:none;scrollbar-gutter:stable}
.dg-scroll:focus-visible{box-shadow:0 0 0 3px var(--accent-soft)}
.dg-t{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;min-width:100%}
.dg-t thead th{
  position:sticky;top:0;z-index:6;height:var(--dg-headh);box-sizing:border-box;
  padding:0 var(--dg-px);text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:var(--panel2);color:var(--muted);
  font:700 11px/1 var(--font-head);letter-spacing:.05em;
  border-bottom:1px solid var(--line);user-select:none;
}
.dg-t thead th.dg-sortable{cursor:pointer}
.dg-t thead th.dg-sortable:hover{color:var(--accent);background:var(--bg2)}
.dg-t thead th.dg-sorted{color:var(--accent)}
.dg-hlab{display:inline-block;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - 18px)}
.dg-sortic{display:inline-flex;vertical-align:middle;margin-left:3px;color:var(--accent)}
.dg-rz{position:absolute;top:0;right:-3px;width:7px;height:100%;cursor:col-resize;z-index:2}
.dg-rz:hover{background:var(--accent-soft)}
.dg-t td{padding:var(--dg-py) var(--dg-px);border-bottom:1px solid var(--line2);background:var(--panel);vertical-align:middle;overflow:hidden}
.dg-t tbody tr:last-child td{border-bottom:0}
.dg-cv{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dg-t td.a-right,.dg-t th.a-right{text-align:right}
.dg-t td.a-center,.dg-t th.a-center{text-align:center}
.dg-numc{font-variant-numeric:tabular-nums}
.dg-t tbody tr.dg-r:hover td{background:var(--bg2)}
.dg-t tbody tr.dg-selected td{background:var(--accent-soft)}
.dg-t tbody tr.dg-selected td:first-child{box-shadow:inset 2px 0 0 var(--accent)}
.dg-t tbody tr.dg-r{cursor:pointer}
.dg-t tbody tr.dg-archived td{opacity:.6}
.dg tbody td.dg-act{box-shadow:inset 0 0 0 2px var(--accent-soft)}
.dg-t tfoot td{position:sticky;bottom:0;z-index:6;background:var(--panel2);border-top:1px solid var(--line);border-bottom:0;font-weight:700;font-variant-numeric:tabular-nums;font-family:var(--font-head);font-size:12px;color:var(--heading)}
.dg-t th.dg-frz,.dg-t td.dg-frz{position:sticky;left:0}
.dg-t td.dg-frz{z-index:5}
.dg-t thead th.dg-frz{z-index:7}
.dg-t th.dg-sel,.dg-t td.dg-sel{width:38px;padding-left:12px;padding-right:0;text-align:center}
.dg-cb{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;vertical-align:middle;margin:0}

/* group bands */
.dg-t tr.dg-band td{position:sticky;top:var(--dg-headh);z-index:4;background:var(--bg2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:7px var(--dg-px);cursor:pointer;user-select:none}
.dg-t tr.dg-band td .bn{display:inline-flex;align-items:center;gap:8px;font:600 12px var(--font-head);color:var(--heading)}
.dg-t tr.dg-band td .bn .ic{display:flex;color:var(--faint);transition:transform var(--t) var(--ease)}
.dg-t tr.dg-band.closed td .bn .ic{transform:rotate(-90deg)}
.dg-t tr.dg-band td .cnt{display:inline-flex;align-items:center;height:18px;padding:0 8px;margin-left:6px;border-radius:var(--pill);background:var(--panel);border:1px solid var(--line);color:var(--muted);font:700 10.5px var(--font-head);font-variant-numeric:tabular-nums}

/* cell types */
.dg-link{color:var(--accent);text-decoration:none;cursor:pointer;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.dg-link:hover{text-decoration:underline}
.dg-check{display:inline-flex;color:var(--green)}
.dg-thumb{width:36px;height:36px;object-fit:cover;border-radius:var(--radius-ctl);display:block;background:var(--panel2);border:1px solid var(--line)}
.dg-thumb.none{display:flex;align-items:center;justify-content:center;color:var(--faint);background:var(--bg2);border-style:dashed}
.dg-t td:has(> .dg-thumb){padding-top:3px;padding-bottom:3px}
.dg-actlink{color:var(--accent);font-weight:600;font-size:12px;cursor:pointer;background:none;border:0;padding:0;font-family:var(--font);text-align:left}
.dg-actlink:hover{text-decoration:underline}
.dg-acts{display:inline-flex;gap:8px;align-items:center}
.dg-colordot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;vertical-align:middle}

/* skeleton rows while the first page loads */
.dg-sk{padding:0}
.dg-sk .r{display:flex;align-items:center;gap:14px;padding:11px var(--dg-px);border-bottom:1px solid var(--line2)}
.dg-sk .r:last-child{border-bottom:0}
.dg-sk .c{height:11px;border-radius:4px;background:var(--bg2);position:relative;overflow:hidden}
.dg-sk .c::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,var(--panel2),transparent);animation:dgshine 1.2s infinite}
@keyframes dgshine{100%{transform:translateX(100%)}}

/* empty */
.dg-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:44px 20px;color:var(--muted);text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-card)}

/* pager */
.dg-pager{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px;flex-wrap:wrap}
.dg-pg-m,.dg-pg-r{display:flex;align-items:center;gap:4px}
.dg-pg-count{color:var(--muted);font-variant-numeric:tabular-nums}
.dg-pg-lab{color:var(--faint);font:700 10.5px var(--font-head);letter-spacing:.05em;text-transform:uppercase;margin-right:2px}
.dg-pg-gap{color:var(--faint);padding:0 2px}
.dg-pill{min-width:28px;height:26px;padding:0 9px;border-radius:var(--radius-ctl);border:1px solid var(--line);background:var(--panel);color:var(--muted);font:12.5px var(--font);cursor:pointer;transition:all var(--t) var(--ease)}
.dg-pill:hover:not(.dis){color:var(--accent);background:var(--bg2)}
.dg-pill.on{background:var(--accent);border-color:var(--accent);color:var(--accent-txt)}
.dg-pill.dis,.dg-pill:disabled{opacity:.4;cursor:default}

/* loading */
.dg-loading .dg-scroll{opacity:.6;pointer-events:none}

/* column chooser */
.dg-colsetup{margin-top:8px;border:1px solid var(--line);border-radius:var(--radius-ctl);overflow:hidden;max-height:50vh;overflow-y:auto}
.dg-cs-row{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--panel);border-bottom:1px solid var(--line2);cursor:grab}
.dg-cs-row:last-child{border-bottom:0}
.dg-cs-row:hover{background:var(--bg2)}
.dg-cs-row.dragging{opacity:.45}
.dg-cs-row.over{box-shadow:inset 0 2px 0 var(--accent)}
.dg-cs-drag{display:flex;color:var(--faint)}
.dg-cs-lab{display:flex;align-items:center;gap:8px;color:var(--txt);cursor:pointer;flex:1}

/* filter builder rows */
.dg-fb{display:flex;flex-direction:column;gap:8px}
.dg-fb .r{display:grid;grid-template-columns:1fr 130px 1.4fr 32px;gap:6px;align-items:center}
.dg-fb .r select,.dg-fb .r input{height:32px}

/* phone: cards instead of a wide table (the table is still one tap away
   from the View menu, and scrolls sideways inside its own card) */
.dg-cards{display:none;flex-direction:column;gap:10px}
.dg-card{display:flex;flex-direction:column;gap:8px;padding:14px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:var(--shadow)}
.dg-card.dg-selected{border-color:var(--accent);background:var(--accent-soft)}
.dg-card .top{display:flex;align-items:center;gap:10px}
.dg-card .top .cb{flex:0 0 auto}
.dg-card .top .dg-thumb{width:44px;height:44px}
.dg-card .top .t{flex:1;min-width:0}
.dg-card .top .t .d{font-family:var(--font-head);font-weight:600;font-size:14.5px;color:var(--accent);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dg-card .top .t .d2{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dg-card .kv{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;font-size:12.5px}
.dg-card .kv .k{color:var(--faint);font-size:10.5px;font-family:var(--font-head);font-weight:700;letter-spacing:.04em}
.dg-card .acts{display:flex;gap:6px;flex-wrap:wrap;padding-top:2px}
.dg-card .acts .btn{height:36px;flex:1 1 auto;min-width:96px}
@media (max-width:760px){
  .dg.dg-mobile .dg-scroll{display:none}
  .dg.dg-mobile .dg-cards{display:flex}
  .dg-tools .dg-search{flex-basis:100%}
  .dg-fb .r{grid-template-columns:1fr 1fr;grid-auto-rows:auto}
  .dg-summary .s{flex:1 1 auto}
}
