:root {
  --bg: #0f1420;
  --panel: #161d2e;
  --panel-alt: #1d263b;
  --border: #2a3550;
  --text: #e6e9f2;
  --text-dim: #9aa4bf;
  --accent: #4f7cff;
  /* Distinct from --accent (used by in-page toolbar controls like the
     Quarter/Month/Week/Day and By Employee/By Job toggles) so the main
     top-level nav reads as a different tier of control at a glance. */
  --nav-accent: #8b5cf6;
  --danger: #e5484d;
  --radius: 8px;
  font-family: -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color-scheme: dark;
}

* {
  box-sizing: border-box;
}

html, body, #root {
  height: 100%;
  margin: 0;
}

body {
  background: var(--bg);
  color: var(--text);
}

button {
  font-family: inherit;
  cursor: pointer;
}

input, select, textarea {
  font-family: inherit;
  background: var(--panel-alt);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 6px 8px;
}

input:focus, select:focus, textarea:focus {
  outline: 2px solid var(--accent);
  outline-offset: -1px;
}

a {
  color: var(--accent);
}

table {
  border-collapse: collapse;
  width: 100%;
}

th, td {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
}

th {
  color: var(--text-dim);
  font-weight: 600;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

tbody tr:nth-child(even) {
  background: var(--panel-alt);
}

.btn {
  background: var(--panel-alt);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 6px;
  padding: 7px 14px;
  font-size: 14px;
}

.btn:hover {
  border-color: var(--accent);
}

.btn-primary {
  background: var(--accent);
  border-color: var(--accent);
  color: white;
  font-weight: 600;
}

.btn-primary:hover {
  filter: brightness(1.1);
}

.btn-danger {
  color: var(--danger);
}

.btn-danger:hover {
  border-color: var(--danger);
}

.toolbar-compact .btn {
  padding: 4px 10px;
  font-size: 13px;
}

.toolbar-compact input,
.toolbar-compact select {
  padding: 4px 8px;
  font-size: 13px;
}

.toolbar-group {
  display: flex;
  gap: 2px;
  padding: 3px;
  background: var(--panel-alt);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.toolbar-group .btn {
  background: transparent;
  border: 1px solid transparent;
}

.toolbar-group .btn:hover {
  border-color: var(--border);
}

.card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
}

.modal {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 20px;
  width: 460px;
  max-width: 92vw;
  max-height: 88vh;
  overflow-y: auto;
}

.modal h2 {
  margin-top: 0;
}

.field {
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.field label {
  font-size: 13px;
  color: var(--text-dim);
}

.field input, .field select, .field textarea {
  width: 100%;
}

.row {
  display: flex;
  gap: 10px;
}

.row > .field {
  flex: 1;
}

.modal-actions {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
}

.modal-actions .right {
  display: flex;
  gap: 8px;
}

/* --- vis-timeline theming --- */

.vis-timeline {
  border: none !important;
  font-family: inherit;
}

.vis-labelset .vis-label {
  border-color: var(--border) !important;
  color: var(--text) !important;
}

.vis-labelset .vis-label.vis-nesting-group {
  font-weight: 600;
  background: var(--panel-alt) !important;
}

.vis-labelset .vis-label.vis-nested-group {
  background: var(--panel) !important;
}

.vis-labelset .vis-label.vis-nesting-group:hover {
  background: var(--border) !important;
}

/* vis-timeline recycles label DOM nodes on collapse/expand and doesn't
   always reset alignment on the reused node — pin it so phase labels
   can't inherit a stray right-aligned state. vis-timeline also flips
   .vis-panel.vis-left to `direction: rtl` internally (a trick to put its
   scrollbar on the left) and resets it back to ltr only on `.vis-content`
   — pin direction as well as text-align, and at both the labelset and
   per-label level, so nothing above `.vis-inner` can leak a stray
   right-to-left context into it. */
.vis-labelset {
  direction: ltr !important;
}

.vis-labelset .vis-label {
  text-align: left !important;
  direction: ltr !important;
}

.vis-labelset .vis-label .vis-inner {
  text-align: left !important;
  direction: ltr !important;
}

.vis-labelset .vis-label.tl-job-group {
  border-left: 3px solid var(--job-color, var(--border));
}

.vis-labelset .vis-label.tl-job-group .vis-inner {
  padding-top: 6px;
  padding-bottom: 6px;
  line-height: 1.5;
}

/* Collapsed job row — the meta line is already hidden (see .tl-job-meta
   rule below), so tighten the remaining single line's own padding too,
   letting more collapsed jobs fit on screen at once. */
.vis-label.vis-nesting-group.tl-job-group:not(.expanded) .vis-inner {
  padding-top: 3px;
  padding-bottom: 3px;
}

.vis-labelset .vis-label.tl-phase-group {
  /* vis-timeline classifies nesting depth per-redraw and can drop the
     vis-group-level-0 class on a collapse/expand cycle, falling through
     to its own indent/width defaults for "unknown" levels. Pin our own
     fixed values so the row looks identical on every redraw. */
  padding-left: 0 !important;
  border-left: 3px solid color-mix(in srgb, var(--job-color, var(--border)) 45%, transparent);
}

/* The real cause of phase rows drifting right after a collapse/expand:
   vis-timeline's own stylesheet computes a "nesting level" per redraw and
   applies `padding-left` (0 to 150px) straight onto `.vis-inner`, keyed by
   classes like `.vis-group-level-9` — a *different element* than the
   `.tl-phase-group` label we already zero out `padding-left` on above,
   and at higher selector specificity (5 class-selectors vs. our 4) that
   our stylesheet's load order can't beat even with `!important`. Chaining
   .tl-phase-group twice is a deliberate specificity bump (repeating a
   class in a selector counts it twice) to clear that bar regardless of
   which level vis-timeline lands on. */
.vis-labelset .vis-label.tl-phase-group.tl-phase-group .vis-inner {
  padding-left: 0 !important;
  /* display:block (not inline-block) deliberately — an inline-block box's
     own horizontal position is governed by its parent's text-align, and
     vis-timeline recycling this row's DOM on collapse/expand can leave it
     right-aligned. A block box ignores text-align for its own position,
     so it can't drift regardless of what the parent's alignment does. */
  display: block !important;
  width: auto !important;
  line-height: 1.5;
}

/* Phase row content — sequence number in a round pill, bold name, and a
   dim date-range/staff-count line underneath. Indented 18px to line up
   with the job header's own text start (10px colour dot + 8px gap). */
.tl-phase-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding-left: 18px;
}

.tl-phase-index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--job-color, var(--accent)) 35%, var(--panel));
  color: var(--text);
  font-size: 10px;
  font-weight: 600;
}

.tl-phase-name {
  font-size: 13px;
  font-weight: 400;
  color: var(--text);
}

.tl-phase-meta {
  padding-left: 18px;
  margin-top: 2px;
  font-size: 11px;
  color: var(--text-dim);
}

/* Collapse/expand caret — a single glyph that rotates rather than the
   default swapped triangle characters, with a hover affordance since
   the whole row toggles the group. */
.vis-label.vis-nesting-group:before {
  content: "\25B6" !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 16px !important;
  height: 16px;
  margin-right: 3px;
  border-radius: 4px;
  color: var(--text-dim);
  font-size: 9px;
  vertical-align: middle;
  transition: transform 0.15s ease, color 0.15s ease, background-color 0.15s ease;
}

.vis-label.vis-nesting-group.expanded:before {
  transform: rotate(90deg);
}

.vis-label.vis-nesting-group:hover:before {
  color: var(--text);
  background-color: rgba(255, 255, 255, 0.08);
}

/* Collapsed job row — drop the client/status meta line so a collapsed job
   shrinks back to a single line, matching how little info it's showing
   (its phases, which is where that context actually applies, are hidden). */
.vis-label.vis-nesting-group:not(.expanded) .tl-job-meta {
  display: none;
}

.vis-foreground .vis-group.vis-nested-group {
  background: var(--panel) !important;
}

/* Job header rows previously only got their panel-alt tint in the label
   sidebar — extend it into the bars area too, so a job's row reads as one
   continuous band rather than two different shades side by side. */
.vis-foreground .vis-group.vis-nesting-group {
  background: var(--panel-alt) !important;
}

.vis-foreground .vis-group {
  border-color: var(--border) !important;
}

/* Alternating row backgrounds — flat rows (Employee view). */
.vis-labelset .vis-label.tl-row-alt,
.vis-foreground .vis-group.tl-row-alt {
  background: var(--panel-alt) !important;
}

/* Job view: alternate per job (header + its phases share a band), blended
   with the existing header/phase shading rather than replacing it. */
.vis-labelset .vis-label.vis-nesting-group.tl-row-alt,
.vis-foreground .vis-group.vis-nesting-group.tl-row-alt {
  background: color-mix(in srgb, var(--panel-alt) 88%, white 12%) !important;
}

.vis-labelset .vis-label.vis-nested-group.tl-row-alt,
.vis-foreground .vis-group.vis-nested-group.tl-row-alt {
  background: color-mix(in srgb, var(--panel) 88%, white 12%) !important;
}

.vis-panel.vis-top,
.vis-panel.vis-bottom,
.vis-panel.vis-left,
.vis-panel.vis-right {
  border-color: var(--border) !important;
}

.vis-time-axis .vis-text.vis-major {
  color: var(--text) !important;
  font-weight: 600;
  font-size: 12.5px;
  letter-spacing: 0.02em;
  padding: 6px 10px 4px !important;
}

.vis-time-axis .vis-text.vis-minor {
  color: var(--text-dim) !important;
  font-size: 12px;
  padding: 4px 8px !important;
}

.vis-time-axis .vis-grid.vis-minor {
  border-color: rgba(255, 255, 255, 0.045) !important;
}

.vis-time-axis .vis-grid.vis-major {
  border-color: #3c4a70 !important;
}

.vis-current-time {
  background-color: var(--accent) !important;
  width: 2px !important;
}

.vis-item {
  border-radius: 5px;
  border-width: 1px;
  color: white;
  font-size: 12px;
}

/* vis-timeline appends its TimeAxis (grid lines) component before its
   ItemSet component, so — with no z-index set anywhere — the itemset's
   own background layer (where weekend/holiday items live) paints over
   the month/day grid lines rather than under them. Pin an explicit
   stacking order: grid lines above everything, then assignment bars,
   then weekend/holiday shading, then the row-band stripes at the bottom.
   All the relevant elements are already `position: absolute` in
   vis-timeline's own stylesheet, so z-index applies directly without
   extra positioning.

   `.vis-group` (row-band stripes) and `.vis-item` (assignment bars) are
   DOM siblings inside the same `.vis-foreground` container — giving that
   whole container one blanket z-index traps them together as a single
   unit, which is exactly what breaks sandwiching the weekend/holiday
   layer between them (a translucent row-band tint stacked on top of an
   already-translucent weekend/holiday tint compounds into a visibly
   duller shade on alternating rows). So z-index the two sibling types
   individually instead — `.vis-group` is left at its default (auto),
   which still loses to any explicit z-index below. */
.vis-itemset .vis-background {
  z-index: 1;
}

.vis-item:not(.vis-background) {
  z-index: 2;
}

.vis-time-axis.vis-background {
  z-index: 3 !important;
  /* Purely decorative grid lines — without this, sitting visually on top
     means native pointer/wheel events target this element instead of
     bubbling through the itemset's own ancestor chain underneath, which
     is where vis-timeline's pan/zoom/select gesture handlers are bound.
     That silently killed all timeline interaction. */
  pointer-events: none;
}

/* Weekend/holiday shading — full-height background items, rendered
   behind every row and every assignment bar. */
.vis-item.vis-background.tl-weekend {
  background-color: rgba(255, 255, 255, 0.07) !important;
  border: none !important;
}

.vis-item.vis-background.tl-holiday {
  background-color: rgba(229, 72, 77, 0.24) !important;
  border: none !important;
}

/* Days where pipeline/quoted estimates plus real assignments would need
   more people than total active headcount. Amber rather than the
   holiday's red — a capacity risk to plan around, not a fixed fact about
   the calendar — and painted after weekend/holiday in the items array so
   it wins on days where more than one kind of shading applies. */
.vis-item.vis-background.tl-overcapacity {
  background-color: rgba(250, 176, 5, 0.22) !important;
  border: none !important;
}

.vis-item.tl-item {
  background-color: var(--job-color, var(--accent));
  border-color: var(--job-color, var(--accent));
}

.vis-item.tl-item.tentative {
  background-image: repeating-linear-gradient(
    45deg,
    var(--job-color, var(--accent)),
    var(--job-color, var(--accent)) 6px,
    rgba(255, 255, 255, 0.18) 6px,
    rgba(255, 255, 255, 0.18) 12px
  );
  border-style: dashed;
}

.vis-item.tl-item.status-complete,
.vis-item.tl-item.status-on_hold {
  opacity: 0.55;
}

.vis-item.tl-item.job-summary {
  background-color: color-mix(in srgb, var(--job-color, var(--accent)) 30%, var(--panel));
  border-width: 1px;
  border-radius: 7px;
  font-weight: 400;
  font-size: 12px;
  color: var(--text);
}

.vis-item.tl-item.job-summary .vis-item-content {
  color: var(--text);
  /* Vertical padding matches what assignment bars actually render at (5px
     — vis-timeline's own built-in default; our .vis-item .vis-item-content
     override below shares its selector's specificity with the library's
     and loses on load order, so it never actually applies) rather than
     that unapplied 3px, so job-summary's height truly matches them. */
  padding: 5px 8px;
}

/* Pipeline/quoted keeps its tinted fill and dashed border (from .tentative)
   here — just without the diagonal stripes, same reasoning as staff-bar
   below: the dashed outline alone already reads as "not confirmed yet". */
.vis-item.tl-item.job-summary.tentative {
  background-image: none;
}

/* Individual staff bars nested under a job's phases — outline-only (no
   fill), so they read as a lighter tier than the filled job-summary
   rollup, while still carrying the same colour via their border alone. */
.vis-item.tl-item.staff-bar {
  background-color: transparent;
  border-width: 1px;
  border-radius: 6px;
  color: var(--text);
}

.vis-item.tl-item.staff-bar .vis-item-content {
  color: var(--text);
}

/* On a pipeline/quoted job, the diagonal-stripe .tentative treatment above
   is meant to read as "not real work yet" — but a staff bar already has no
   fill (see .staff-bar above), so the stripes were just painting solid
   colour into what's supposed to be an empty outline. The dashed border
   alone (still inherited from .tentative) carries that meaning here. */
.vis-item.tl-item.staff-bar.tentative {
  background-image: none;
}

/* Phase headcount estimate — no real employee is assigned yet, so it's an
   unfilled placeholder rather than a solid bar, to avoid reading as an
   actual commitment. Dotted rather than dashed — dashed now specifically
   means "this job is pipeline/quoted" (see .tentative), and an estimate
   can just as easily sit on a confirmed job still firming up headcount,
   so the two need visually distinct borders rather than sharing one. */
.vis-item.tl-item.estimate-bar {
  background-color: transparent;
  border-width: 1px;
  border-style: dotted;
  border-color: var(--job-color, var(--accent));
  border-radius: 6px;
  color: var(--text-dim);
}

.vis-item.tl-item.estimate-bar .vis-item-content {
  color: var(--text-dim);
}

.vis-item.tl-item.conflict {
  box-shadow: 0 0 0 2px var(--danger);
}

/* Leave (sick/annual/ACC/other) on an employee's own row — a distinct
   slate diagonal-stripe treatment so it never reads as job work, which is
   always coloured via --job-color (client or employee colour). */
.vis-item.tl-item.leave-bar {
  background-color: #4a5468;
  background-image: repeating-linear-gradient(45deg, #4a5468, #4a5468 6px, #5b6680 6px, #5b6680 12px);
  border-color: #5b6680;
  border-width: 1px;
  border-radius: 6px;
  color: #fff;
}

.vis-item.tl-item.leave-bar .vis-item-content {
  color: #fff;
}

/* Non-billable time (training, admin, ...) — same diagonal-stripe language
   as leave (also not job work, also always coloured independent of
   --job-color), but a distinct teal so the two are never confused: leave
   means "not here", this means "here, just not on a job". */
.vis-item.tl-item.non-billable-bar {
  background-color: #2f6f68;
  background-image: repeating-linear-gradient(45deg, #2f6f68, #2f6f68 6px, #3f8a82 6px, #3f8a82 12px);
  border-color: #3f8a82;
  border-width: 1px;
  border-radius: 6px;
  color: #fff;
}

.vis-item.tl-item.non-billable-bar .vis-item-content {
  color: #fff;
}

.vis-item.vis-selected {
  box-shadow: 0 0 0 2px white;
}

.vis-item .vis-item-content {
  padding: 3px 8px;
}

.color-swatch-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.color-swatch {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.15);
  padding: 0;
  cursor: pointer;
}

.color-swatch:hover {
  transform: scale(1.1);
}

.color-swatch:disabled {
  cursor: default;
  opacity: 0.6;
}

.color-swatch:disabled:hover {
  transform: none;
}

.color-swatch.selected {
  box-shadow: 0 0 0 2px var(--panel), 0 0 0 4px white;
}

.legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
  font-size: 12px;
  color: var(--text-dim);
}

.legend-swatch {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  margin-right: 5px;
  vertical-align: middle;
}
.vis .overlay{height:100%;left:0;position:absolute;top:0;width:100%;z-index:10}.vis-active{box-shadow:0 0 10px #86d5f8}.vis [class*=span]{min-height:0;width:auto}div.vis-configuration{display:block;float:left;font-size:12px;position:relative}div.vis-configuration-wrapper{display:block;width:700px}div.vis-configuration-wrapper:after{clear:both;content:"";display:block}div.vis-configuration.vis-config-option-container{background-color:#fff;border:2px solid #f7f8fa;border-radius:4px;display:block;left:10px;margin-top:20px;padding-left:5px;width:495px}div.vis-configuration.vis-config-button{background-color:#f7f8fa;border:2px solid #ceced0;border-radius:4px;cursor:pointer;display:block;height:25px;left:10px;line-height:25px;margin-bottom:30px;margin-top:20px;padding-left:5px;vertical-align:middle;width:495px}div.vis-configuration.vis-config-button.hover{background-color:#4588e6;border:2px solid #214373;color:#fff}div.vis-configuration.vis-config-item{display:block;float:left;height:25px;line-height:25px;vertical-align:middle;width:495px}div.vis-configuration.vis-config-item.vis-config-s2{background-color:#f7f8fa;border-radius:3px;left:10px;padding-left:5px}div.vis-configuration.vis-config-item.vis-config-s3{background-color:#e4e9f0;border-radius:3px;left:20px;padding-left:5px}div.vis-configuration.vis-config-item.vis-config-s4{background-color:#cfd8e6;border-radius:3px;left:30px;padding-left:5px}div.vis-configuration.vis-config-header{font-size:18px;font-weight:700}div.vis-configuration.vis-config-label{height:25px;line-height:25px;width:120px}div.vis-configuration.vis-config-label.vis-config-s3{width:110px}div.vis-configuration.vis-config-label.vis-config-s4{width:100px}div.vis-configuration.vis-config-colorBlock{border:1px solid #444;border-radius:2px;cursor:pointer;height:19px;margin:0;padding:0;top:1px;width:30px}input.vis-configuration.vis-config-checkbox{left:-5px}input.vis-configuration.vis-config-rangeinput{margin:0;padding:1px;pointer-events:none;position:relative;top:-5px;width:60px}input.vis-configuration.vis-config-range{-webkit-appearance:none;background-color:transparent;border:0 solid #fff;height:20px;width:300px}input.vis-configuration.vis-config-range::-webkit-slider-runnable-track{background:#dedede;background:-moz-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#dedede),color-stop(99%,#c8c8c8));background:-webkit-linear-gradient(top,#dedede,#c8c8c8 99%);background:-o-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-ms-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:linear-gradient(180deg,#dedede 0,#c8c8c8 99%);border:1px solid #999;border-radius:3px;box-shadow:0 0 3px 0 #aaa;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#dedede",endColorstr="#c8c8c8",GradientType=0);height:5px;width:300px}input.vis-configuration.vis-config-range::-webkit-slider-thumb{-webkit-appearance:none;background:#3876c2;background:-moz-linear-gradient(top,#3876c2 0,#385380 100%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#3876c2),color-stop(100%,#385380));background:-webkit-linear-gradient(top,#3876c2,#385380);background:-o-linear-gradient(top,#3876c2 0,#385380 100%);background:-ms-linear-gradient(top,#3876c2 0,#385380 100%);background:linear-gradient(180deg,#3876c2 0,#385380);border:1px solid #14334b;border-radius:50%;box-shadow:0 0 1px 0 #111927;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#3876c2",endColorstr="#385380",GradientType=0);height:17px;margin-top:-7px;width:17px}input.vis-configuration.vis-config-range:focus{outline:none}input.vis-configuration.vis-config-range:focus::-webkit-slider-runnable-track{background:#9d9d9d;background:-moz-linear-gradient(top,#9d9d9d 0,#c8c8c8 99%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#9d9d9d),color-stop(99%,#c8c8c8));background:-webkit-linear-gradient(top,#9d9d9d,#c8c8c8 99%);background:-o-linear-gradient(top,#9d9d9d 0,#c8c8c8 99%);background:-ms-linear-gradient(top,#9d9d9d 0,#c8c8c8 99%);background:linear-gradient(180deg,#9d9d9d 0,#c8c8c8 99%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#9d9d9d",endColorstr="#c8c8c8",GradientType=0)}input.vis-configuration.vis-config-range::-moz-range-track{background:#dedede;background:-moz-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-webkit-gradient(linear,left top,left bottom,color-stop(0,#dedede),color-stop(99%,#c8c8c8));background:-webkit-linear-gradient(top,#dedede,#c8c8c8 99%);background:-o-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:-ms-linear-gradient(top,#dedede 0,#c8c8c8 99%);background:linear-gradient(180deg,#dedede 0,#c8c8c8 99%);border:1px solid #999;border-radius:3px;box-shadow:0 0 3px 0 #aaa;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#dedede",endColorstr="#c8c8c8",GradientType=0);height:10px;width:300px}input.vis-configuration.vis-config-range::-moz-range-thumb{background:#385380;border:none;border-radius:50%;height:16px;width:16px}input.vis-configuration.vis-config-range:-moz-focusring{outline:1px solid #fff;outline-offset:-1px}input.vis-configuration.vis-config-range::-ms-track{background:transparent;border-color:transparent;border-width:6px 0;color:transparent;height:5px;width:300px}input.vis-configuration.vis-config-range::-ms-fill-lower{background:#777;border-radius:10px}input.vis-configuration.vis-config-range::-ms-fill-upper{background:#ddd;border-radius:10px}input.vis-configuration.vis-config-range::-ms-thumb{background:#385380;border:none;border-radius:50%;height:16px;width:16px}input.vis-configuration.vis-config-range:focus::-ms-fill-lower{background:#888}input.vis-configuration.vis-config-range:focus::-ms-fill-upper{background:#ccc}.vis-configuration-popup{background:rgba(57,76,89,.85);border:2px solid #f2faff;border-radius:4px;color:#fff;font-size:14px;height:30px;line-height:30px;position:absolute;text-align:center;-webkit-transition:opacity .3s ease-in-out;-moz-transition:opacity .3s ease-in-out;transition:opacity .3s ease-in-out;width:150px}.vis-configuration-popup:after,.vis-configuration-popup:before{border:solid transparent;content:" ";height:0;left:100%;pointer-events:none;position:absolute;top:50%;width:0}.vis-configuration-popup:after{border-color:rgba(136,183,213,0) rgba(136,183,213,0) rgba(136,183,213,0) rgba(57,76,89,.85);border-width:8px;margin-top:-8px}.vis-configuration-popup:before{border-color:rgba(194,225,245,0) rgba(194,225,245,0) rgba(194,225,245,0) #f2faff;border-width:12px;margin-top:-12px}div.vis-tooltip{background-color:#f5f4ed;border:1px solid #808074;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;box-shadow:3px 3px 10px rgba(0,0,0,.2);color:#000;font-family:verdana;font-size:14px;padding:5px;pointer-events:none;position:absolute;visibility:hidden;white-space:nowrap;z-index:5}.vis-current-time{background-color:#ff7f6e;pointer-events:none;width:2px;z-index:1}.vis-rolling-mode-btn{background:#3876c2;border-radius:50%;color:#fff;cursor:pointer;font-size:28px;font-weight:700;height:40px;opacity:.8;position:absolute;right:20px;text-align:center;top:7px;width:40px}.vis-rolling-mode-btn:before{content:"\26F6"}.vis-rolling-mode-btn:hover{opacity:1}.vis-custom-time{background-color:#6e94ff;cursor:move;width:2px;z-index:1}.vis-custom-time>.vis-custom-time-marker{background-color:inherit;color:#fff;cursor:auto;font-size:12px;padding:3px 5px;top:0;white-space:nowrap;z-index:inherit}.vis-panel.vis-background.vis-horizontal .vis-grid.vis-horizontal{border-bottom:1px solid;height:0;position:absolute;width:100%}.vis-panel.vis-background.vis-horizontal .vis-grid.vis-minor{border-color:#e5e5e5}.vis-panel.vis-background.vis-horizontal .vis-grid.vis-major{border-color:#bfbfbf}.vis-data-axis .vis-y-axis.vis-major{color:#4d4d4d;position:absolute;white-space:nowrap;width:100%}.vis-data-axis .vis-y-axis.vis-major.vis-measure{border:0;margin:0;padding:0;visibility:hidden;width:auto}.vis-data-axis .vis-y-axis.vis-minor{color:#bebebe;position:absolute;white-space:nowrap;width:100%}.vis-data-axis .vis-y-axis.vis-minor.vis-measure{border:0;margin:0;padding:0;visibility:hidden;width:auto}.vis-data-axis .vis-y-axis.vis-title{bottom:20px;color:#4d4d4d;position:absolute;text-align:center;white-space:nowrap}.vis-data-axis .vis-y-axis.vis-title.vis-measure{margin:0;padding:0;visibility:hidden;width:auto}.vis-data-axis .vis-y-axis.vis-title.vis-left{bottom:0;-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-ms-transform:rotate(-90deg);-o-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transform-origin:left top;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;transform-origin:left bottom}.vis-data-axis .vis-y-axis.vis-title.vis-right{bottom:0;-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg);-webkit-transform-origin:right bottom;-moz-transform-origin:right bottom;-ms-transform-origin:right bottom;-o-transform-origin:right bottom;transform-origin:right bottom}.vis-legend{background-color:rgba(247,252,255,.65);border:1px solid #b3b3b3;box-shadow:2px 2px 10px hsla(0,0%,60%,.55);padding:5px}.vis-legend-text{display:inline-block;white-space:nowrap}.vis-item{background-color:#d5ddf6;border-color:#97b0f8;border-width:1px;color:#1a1a1a;display:inline-block;position:absolute;z-index:1}.vis-item.vis-selected{background-color:#fff785;border-color:#ffc200;z-index:2}.vis-editable.vis-selected{cursor:move}.vis-item.vis-point.vis-selected{background-color:#fff785}.vis-item.vis-box{border-radius:2px;border-style:solid;text-align:center}.vis-item.vis-point{background:none}.vis-item.vis-dot{border-radius:4px;border-style:solid;border-width:4px;padding:0;position:absolute}.vis-item.vis-range{border-radius:2px;border-style:solid;box-sizing:border-box}.vis-item.vis-background{background-color:rgba(213,221,246,.4);border:none;box-sizing:border-box;margin:0;padding:0}.vis-item .vis-item-overflow{height:100%;margin:0;overflow:hidden;padding:0;position:relative;width:100%}.vis-item-visible-frame{white-space:nowrap}.vis-item.vis-range .vis-item-content{display:inline-block;position:relative}.vis-item.vis-background .vis-item-content{display:inline-block;position:absolute}.vis-item.vis-line{border-left-style:solid;border-left-width:1px;padding:0;position:absolute;width:0}.vis-item .vis-item-content{box-sizing:border-box;padding:5px;white-space:nowrap}.vis-item .vis-onUpdateTime-tooltip{background:#4f81bd;border-radius:1px;color:#fff;padding:5px;position:absolute;text-align:center;transition:.4s;-o-transition:.4s;-moz-transition:.4s;-webkit-transition:.4s;white-space:nowrap;width:200px}.vis-item .vis-delete,.vis-item .vis-delete-rtl{box-sizing:border-box;cursor:pointer;height:24px;padding:0 5px;position:absolute;top:0;-webkit-transition:background .2s linear;-moz-transition:background .2s linear;-ms-transition:background .2s linear;-o-transition:background .2s linear;transition:background .2s linear;width:24px}.vis-item .vis-delete{right:-24px}.vis-item .vis-delete-rtl{left:-24px}.vis-item .vis-delete-rtl:after,.vis-item .vis-delete:after{color:red;content:"\00D7";font-family:arial,sans-serif;font-size:22px;font-weight:700;-webkit-transition:color .2s linear;-moz-transition:color .2s linear;-ms-transition:color .2s linear;-o-transition:color .2s linear;transition:color .2s linear}.vis-item .vis-delete-rtl:hover,.vis-item .vis-delete:hover{background:red}.vis-item .vis-delete-rtl:hover:after,.vis-item .vis-delete:hover:after{color:#fff}.vis-item .vis-drag-center{cursor:move;height:100%;left:0;position:absolute;top:0;width:100%}.vis-item.vis-range .vis-drag-left{cursor:w-resize;left:-4px}.vis-item.vis-range .vis-drag-left,.vis-item.vis-range .vis-drag-right{height:100%;max-width:20%;min-width:2px;position:absolute;top:0;width:24px}.vis-item.vis-range .vis-drag-right{cursor:e-resize;right:-4px}.vis-range.vis-item.vis-readonly .vis-drag-left,.vis-range.vis-item.vis-readonly .vis-drag-right{cursor:auto}.vis-item.vis-cluster{border-radius:2px;border-style:solid;text-align:center;vertical-align:center}.vis-item.vis-cluster-line{border-left-style:solid;border-left-width:1px;padding:0;position:absolute;width:0}.vis-item.vis-cluster-dot{border-radius:4px;border-style:solid;border-width:4px;padding:0;position:absolute}.vis-itemset{box-sizing:border-box;margin:0;padding:0;position:relative}.vis-itemset .vis-background,.vis-itemset .vis-foreground{height:100%;overflow:visible;position:absolute;width:100%}.vis-axis{height:0;left:0;position:absolute;width:100%;z-index:1}.vis-foreground .vis-group{border-bottom:1px solid #bfbfbf;box-sizing:border-box;position:relative}.vis-foreground .vis-group:last-child{border-bottom:none}.vis-nesting-group{cursor:pointer}.vis-label.vis-nested-group.vis-group-level-unknown-but-gte1{background:#f5f5f5}.vis-label.vis-nested-group.vis-group-level-0{background-color:#fff}.vis-ltr .vis-label.vis-nested-group.vis-group-level-0 .vis-inner{padding-left:0}.vis-rtl .vis-label.vis-nested-group.vis-group-level-0 .vis-inner{padding-right:0}.vis-label.vis-nested-group.vis-group-level-1{background-color:rgba(0,0,0,.05)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-1 .vis-inner{padding-left:15px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-1 .vis-inner{padding-right:15px}.vis-label.vis-nested-group.vis-group-level-2{background-color:rgba(0,0,0,.1)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-2 .vis-inner{padding-left:30px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-2 .vis-inner{padding-right:30px}.vis-label.vis-nested-group.vis-group-level-3{background-color:rgba(0,0,0,.15)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-3 .vis-inner{padding-left:45px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-3 .vis-inner{padding-right:45px}.vis-label.vis-nested-group.vis-group-level-4{background-color:rgba(0,0,0,.2)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-4 .vis-inner{padding-left:60px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-4 .vis-inner{padding-right:60px}.vis-label.vis-nested-group.vis-group-level-5{background-color:rgba(0,0,0,.25)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-5 .vis-inner{padding-left:75px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-5 .vis-inner{padding-right:75px}.vis-label.vis-nested-group.vis-group-level-6{background-color:rgba(0,0,0,.3)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-6 .vis-inner{padding-left:90px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-6 .vis-inner{padding-right:90px}.vis-label.vis-nested-group.vis-group-level-7{background-color:rgba(0,0,0,.35)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-7 .vis-inner{padding-left:105px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-7 .vis-inner{padding-right:105px}.vis-label.vis-nested-group.vis-group-level-8{background-color:rgba(0,0,0,.4)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-8 .vis-inner{padding-left:120px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-8 .vis-inner{padding-right:120px}.vis-label.vis-nested-group.vis-group-level-9{background-color:rgba(0,0,0,.45)}.vis-ltr .vis-label.vis-nested-group.vis-group-level-9 .vis-inner{padding-left:135px}.vis-rtl .vis-label.vis-nested-group.vis-group-level-9 .vis-inner{padding-right:135px}.vis-label.vis-nested-group{background-color:rgba(0,0,0,.5)}.vis-ltr .vis-label.vis-nested-group .vis-inner{padding-left:150px}.vis-rtl .vis-label.vis-nested-group .vis-inner{padding-right:150px}.vis-group-level-unknown-but-gte1{border:1px solid red}.vis-label.vis-nesting-group:before{display:inline-block;width:15px}.vis-label.vis-nesting-group.expanded:before{content:"\25BC"}.vis-label.vis-nesting-group.collapsed:before{content:"\25B6"}.vis-rtl .vis-label.vis-nesting-group.collapsed:before{content:"\25C0"}.vis-ltr .vis-label:not(.vis-nesting-group):not(.vis-group-level-0){padding-left:15px}.vis-rtl .vis-label:not(.vis-nesting-group):not(.vis-group-level-0){padding-right:15px}.vis-overlay{height:100%;left:0;position:absolute;top:0;width:100%;z-index:10}.vis-labelset{overflow:hidden}.vis-labelset,.vis-labelset .vis-label{box-sizing:border-box;position:relative}.vis-labelset .vis-label{border-bottom:1px solid #bfbfbf;color:#4d4d4d;left:0;top:0;width:100%}.vis-labelset .vis-label.draggable{cursor:pointer}.vis-group-is-dragging{background:rgba(0,0,0,.1)}.vis-labelset .vis-label:last-child{border-bottom:none}.vis-labelset .vis-label .vis-inner{display:inline-block;padding:5px}.vis-labelset .vis-label .vis-inner.vis-hidden{padding:0}.vis-panel{box-sizing:border-box;margin:0;padding:0;position:absolute}.vis-panel.vis-bottom,.vis-panel.vis-center,.vis-panel.vis-left,.vis-panel.vis-right,.vis-panel.vis-top{border:1px #bfbfbf}.vis-panel.vis-center,.vis-panel.vis-left,.vis-panel.vis-right{border-bottom-style:solid;border-top-style:solid;overflow:hidden}.vis-left.vis-panel.vis-vertical-scroll,.vis-right.vis-panel.vis-vertical-scroll{height:100%;overflow-x:hidden;overflow-y:scroll}.vis-left.vis-panel.vis-vertical-scroll{direction:rtl}.vis-left.vis-panel.vis-vertical-scroll .vis-content,.vis-right.vis-panel.vis-vertical-scroll{direction:ltr}.vis-right.vis-panel.vis-vertical-scroll .vis-content{direction:rtl}.vis-panel.vis-bottom,.vis-panel.vis-center,.vis-panel.vis-top{border-left-style:solid;border-right-style:solid}.vis-background{overflow:hidden}.vis-panel>.vis-content{position:relative}.vis-panel .vis-shadow{box-shadow:0 0 10px rgba(0,0,0,.8);height:1px;position:absolute;width:100%}.vis-panel .vis-shadow.vis-top{left:0;top:-1px}.vis-panel .vis-shadow.vis-bottom{bottom:-1px;left:0}.vis-graph-group0{fill:#4f81bd;fill-opacity:0;stroke-width:2px;stroke:#4f81bd}.vis-graph-group1{fill:#f79646;fill-opacity:0;stroke-width:2px;stroke:#f79646}.vis-graph-group2{fill:#8c51cf;fill-opacity:0;stroke-width:2px;stroke:#8c51cf}.vis-graph-group3{fill:#75c841;fill-opacity:0;stroke-width:2px;stroke:#75c841}.vis-graph-group4{fill:#ff0100;fill-opacity:0;stroke-width:2px;stroke:#ff0100}.vis-graph-group5{fill:#37d8e6;fill-opacity:0;stroke-width:2px;stroke:#37d8e6}.vis-graph-group6{fill:#042662;fill-opacity:0;stroke-width:2px;stroke:#042662}.vis-graph-group7{fill:#00ff26;fill-opacity:0;stroke-width:2px;stroke:#00ff26}.vis-graph-group8{fill:#f0f;fill-opacity:0;stroke-width:2px;stroke:#f0f}.vis-graph-group9{fill:#8f3938;fill-opacity:0;stroke-width:2px;stroke:#8f3938}.vis-timeline .vis-fill{fill-opacity:.1;stroke:none}.vis-timeline .vis-bar{fill-opacity:.5;stroke-width:1px}.vis-timeline .vis-point{stroke-width:2px;fill-opacity:1}.vis-timeline .vis-legend-background{stroke-width:1px;fill-opacity:.9;fill:#fff;stroke:#c2c2c2}.vis-timeline .vis-outline{stroke-width:1px;fill-opacity:1;fill:#fff;stroke:#e5e5e5}.vis-timeline .vis-icon-fill{fill-opacity:.3;stroke:none}.vis-time-axis{overflow:hidden;position:relative}.vis-time-axis.vis-foreground{left:0;top:0;width:100%}.vis-time-axis.vis-background{height:100%;left:0;position:absolute;top:0;width:100%}.vis-time-axis .vis-text{box-sizing:border-box;color:#4d4d4d;overflow:hidden;padding:3px;position:absolute;white-space:nowrap}.vis-time-axis .vis-text.vis-measure{margin-left:0;margin-right:0;padding-left:0;padding-right:0;position:absolute;visibility:hidden}.vis-time-axis .vis-grid.vis-vertical{border-left:1px solid;position:absolute}.vis-time-axis .vis-grid.vis-vertical-rtl{border-right:1px solid;position:absolute}.vis-time-axis .vis-grid.vis-minor{border-color:#e5e5e5}.vis-time-axis .vis-grid.vis-major{border-color:#bfbfbf}.vis-timeline{border:1px solid #bfbfbf;box-sizing:border-box;margin:0;overflow:hidden;padding:0;position:relative}.vis-loading-screen{height:100%;left:0;position:absolute;top:0;width:100%}
/*# sourceMappingURL=vis-timeline-graph2d.min.css.map */