/* vs-modules.css
   Shared module primitives across app pages (Workspace / Analytics / Jobs / etc.)
*/

.vs-btn {
  height: 38px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(16, 24, 40, 0.12);
  background: #ffffff;
  color: rgba(11, 18, 32, 0.88);
  font-size: 13px;
  cursor: pointer;
}

.vs-btn:hover {
  background: rgba(79, 209, 255, 0.06);
  border-color: rgba(79, 209, 255, 0.25);
}

.vs-btn--primary {
  border: 1px solid rgba(79, 209, 255, 0.35);
  background: linear-gradient(180deg, rgba(79, 209, 255, 0.20), rgba(79, 209, 255, 0.10));
}

.vs-btn--ghost {
  background: rgba(255, 255, 255, 0.65);
}

.vs-select,
select#graphTimeRange,
select#timelineTimeRange {
  height: 38px;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(16, 24, 40, 0.12);
  background: rgba(255, 255, 255, 0.85);
  font-size: 13px;
}

.vs-btn:focus,
.vs-select:focus,
select:focus,
input[type="range"]:focus {
  outline: 2px solid rgba(79, 209, 255, 0.35);
  outline-offset: 2px;
}