/*
 * JARVIS STEP 10-F REV U
 * PROFESSIONAL OPTION BROWSER PRESENTATION
 */

#browserList
.jarvis-step10f-option-row {
  position: relative;
  overflow: hidden;
}

#browserList
.jarvis-step10f-option-row
.jarvis-step10f-option-card {
  position: absolute;
  inset: 0;
  z-index: 2;

  display: grid;
  grid-template-columns:
    minmax(64px, auto)
    minmax(58px, 1fr);
  grid-template-rows:
    auto auto;

  align-content: center;
  column-gap: 8px;
  row-gap: 2px;

  padding:
    5px
    58px
    5px
    9px;

  pointer-events: none;

  background:
    linear-gradient(
      90deg,
      rgba(5, 16, 24, .98) 0%,
      rgba(5, 16, 24, .96) 78%,
      rgba(5, 16, 24, .72) 100%
    );
}

#browserList
.jarvis-step10f-option-main {
  display: flex;
  align-items: center;
  gap: 6px;

  min-width: 0;
}

#browserList
.jarvis-step10f-option-strike {
  font-size: 12px;
  line-height: 1.1;
  font-weight: 750;
  letter-spacing: .01em;

  color: var(
    --text,
    #eaf4f8
  );
}

#browserList
.jarvis-step10f-option-side {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 18px;
  height: 16px;

  border-radius: 4px;

  font-size: 9px;
  line-height: 1;
  font-weight: 800;
}

#browserList
.jarvis-step10f-option-side.is-call {
  color: #63e6be;
  background:
    rgba(
      35,
      199,
      140,
      .12
    );
  border:
    1px solid
    rgba(
      35,
      199,
      140,
      .30
    );
}

#browserList
.jarvis-step10f-option-side.is-put {
  color: #ff8787;
  background:
    rgba(
      250,
      82,
      82,
      .10
    );
  border:
    1px solid
    rgba(
      250,
      82,
      82,
      .28
    );
}

#browserList
.jarvis-step10f-option-meta {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 7px;

  min-width: 0;

  font-size: 9px;
  line-height: 1.1;
  font-weight: 650;

  color:
    rgba(
      191,
      211,
      221,
      .72
    );
}

#browserList
.jarvis-step10f-option-meta
span:last-child {
  color:
    rgba(
      102,
      227,
      196,
      .78
    );
}

#browserList
.jarvis-step10f-option-occ {
  grid-column:
    1 / -1;

  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;

  font-size: 7.5px;
  line-height: 1;
  letter-spacing: .025em;

  color:
    rgba(
      139,
      164,
      176,
      .52
    );
}

#browserList
.jarvis-step10f-option-row:hover
.jarvis-step10f-option-card {
  background:
    linear-gradient(
      90deg,
      rgba(8, 25, 35, .99) 0%,
      rgba(8, 25, 35, .97) 78%,
      rgba(8, 25, 35, .76) 100%
    );
}

#browserList
.jarvis-step10f-option-row.active
.jarvis-step10f-option-card {
  box-shadow:
    inset 2px 0 0
    rgba(
      40,
      210,
      160,
      .85
    );
}