/* app/css/visits-log.css — /visits-log (visit feed) */
.gs-vl{
  --vl-ink:#1B2733; --vl-mut:#8C95A1; --vl-line:#E9EDF2; --vl-bg:#F7F9FB;
  --vl-blue:#2A6FE8; --vl-green:#1FA463;
  font-family:'Open Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  color:var(--vl-ink); max-width:100%; min-width:0;
}

/* ---- toolbar ---- */
.gs-vl .vl-bar{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap;}
.gs-vl .vl-tool{
  display:inline-flex;align-items:center;justify-content:center;height:32px;min-width:32px;
  border:0;background:transparent;border-radius:6px;color:var(--vl-blue);cursor:pointer;
}
.gs-vl .vl-tool:hover{background:var(--vl-bg);}
.gs-vl .vl-tool svg{width:18px;height:18px;}
.gs-vl .vl-live{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;user-select:none;}
.gs-vl .vl-live input{margin:0;}
.gs-vl .vl-live-dot{width:8px;height:8px;border-radius:50%;background:#C7CED8;flex:none;}
.gs-vl .vl-live.on .vl-live-dot{background:var(--vl-green);box-shadow:0 0 0 0 rgba(31,164,99,.5);animation:vl-pulse 2s infinite;}
@keyframes vl-pulse{70%{box-shadow:0 0 0 6px rgba(31,164,99,0);}100%{box-shadow:0 0 0 0 rgba(31,164,99,0);}}
.gs-vl .vl-live-note{color:var(--vl-mut);font-size:11.5px;}
.gs-vl .vl-spacer{flex:1;}
.gs-vl .vl-count{font-size:12.5px;color:var(--vl-mut);}

/* ---- visit card ---- */
.gs-vl .vl-card{
  background:#fff;border:1px solid var(--vl-line);border-radius:10px;
  padding:16px 18px;margin-bottom:12px;box-shadow:0 1px 2px rgba(16,24,40,.04);
  display:grid;grid-template-columns:minmax(210px,260px) 92px 1fr;gap:16px;align-items:start;min-width:0;
}
.gs-vl .vl-card.is-live{border-color:rgba(31,164,99,.45);box-shadow:0 0 0 3px rgba(31,164,99,.07);}

/* col 1 — who */
.gs-vl .vl-when{font-size:13.5px;font-weight:700;line-height:1.35;}
.gs-vl .vl-vid{font-size:12px;color:var(--vl-mut);margin-top:2px;font-variant-numeric:tabular-nums;}
.gs-vl .vl-loc{display:flex;align-items:center;gap:7px;font-size:13px;margin-top:8px;min-width:0;}
.gs-vl .vl-flag{font-size:15px;line-height:1;flex:none;}
.gs-vl .vl-ref{display:flex;align-items:center;gap:7px;font-size:13px;margin-top:8px;min-width:0;}
.gs-vl .vl-ref i{color:var(--vl-mut);flex:none;}
.gs-vl .vl-ref .lbl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gs-vl .vl-badge{
  display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;letter-spacing:.03em;
  text-transform:uppercase;color:var(--vl-green);background:#E7F3EC;border-radius:20px;padding:2px 8px;margin-top:8px;
}

/* col 2 — tech icons */
.gs-vl .vl-tech{display:flex;align-items:center;gap:10px;color:#5A6672;font-size:17px;padding-top:2px;}
.gs-vl .vl-tech i{line-height:1;}

/* col 3 — actions */
.gs-vl .vl-actions{min-width:0;}
.gs-vl .vl-ahead{font-size:13.5px;font-weight:700;margin-bottom:8px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.gs-vl .vl-profile{margin-left:auto;font-size:12.5px;color:var(--vl-blue);text-decoration:none;display:inline-flex;align-items:center;gap:5px;}
.gs-vl .vl-profile:hover{text-decoration:underline;}
.gs-vl .vl-act{display:flex;gap:9px;padding:5px 0;min-width:0;}
.gs-vl .vl-act > i{color:#C7CED8;font-size:14px;line-height:1.5;flex:none;}
.gs-vl .vl-act-b{min-width:0;flex:1;}
.gs-vl .vl-act-t{font-size:13px;line-height:1.4;display:flex;align-items:center;gap:6px;min-width:0;}
.gs-vl .vl-act-t .t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.gs-vl .vl-rep{
  display:inline-flex;align-items:center;gap:2px;font-size:11px;font-weight:700;color:#5A6672;
  background:var(--vl-bg);border-radius:20px;padding:1px 7px;flex:none;
}
.gs-vl .vl-act-u{font-size:12.5px;margin-top:1px;min-width:0;}
.gs-vl .vl-act-u a{color:var(--vl-blue);text-decoration:none;overflow-wrap:anywhere;}
.gs-vl .vl-act-u a:hover{text-decoration:underline;}
.gs-vl .vl-act-time{font-size:11px;color:var(--vl-mut);margin-top:1px;}
.gs-vl .vl-evt{background:#EEF3FF;color:var(--vl-blue);border-radius:5px;padding:0 5px;font-size:11px;font-weight:700;flex:none;}

/* ---- states ---- */
.gs-vl .vl-loading,.gs-vl .vl-empty{padding:34px 0;text-align:center;color:var(--vl-mut);font-size:13px;}
.gs-vl .vl-more{text-align:center;padding:6px 0 2px;}
.gs-vl .vl-morebtn{
  border:1px solid var(--vl-line);background:#fff;border-radius:8px;padding:9px 18px;
  font-size:13px;font-weight:600;color:var(--vl-ink);cursor:pointer;
}
.gs-vl .vl-morebtn:hover{background:var(--vl-bg);}
.gs-vl .vl-morebtn:disabled{opacity:.6;cursor:default;}
.gs-vl .vl-note{font-size:11.5px;color:var(--vl-mut);margin-top:10px;}

/* ---- responsive: stack, never scroll sideways ---- */
@media (max-width:820px){
  .gs-vl .vl-card{grid-template-columns:1fr;gap:10px;}
  .gs-vl .vl-tech{padding-top:0;}
  .gs-vl .vl-profile{margin-left:0;}
}
@media (max-width:576px){
  .gs-vl .vl-card{padding:14px;border-radius:8px;}
  .gs-vl .vl-when{font-size:12.5px;}
  .gs-vl .vl-act-t,.gs-vl .vl-act-u{font-size:12px;}
}