.tsa-signal-card{
  position:relative;

  margin:
    7px 3px;

  padding:
    11px 12px 10px;

  border:
    1px solid
    rgba(65,148,211,.30);

  border-radius:
    12px;

  background:
    linear-gradient(
      135deg,
      rgba(20,48,76,.98),
      rgba(10,29,49,.99)
    );

  box-shadow:
    0 6px 16px
    rgba(0,0,0,.28);

  overflow:hidden;

  cursor:pointer;

  transition:
    transform .14s ease,
    border-color .14s ease,
    box-shadow .14s ease;
}


.tsa-signal-card:hover{
  transform:
    translateY(-1px);

  border-color:
    rgba(79,172,235,.55);

  box-shadow:
    0 8px 19px
    rgba(0,0,0,.34);
}


/*
  TWO-SIDE movement colour.
*/

.tsa-signal-card::before,
.tsa-signal-card::after{
  content:"";

  position:absolute;

  top:0;
  bottom:0;

  width:4px;

  opacity:1;
}


.tsa-signal-card::before{
  left:0;
}


.tsa-signal-card::after{
  right:0;
}


.tsa-signal-up::before,
.tsa-signal-up::after{
  background:
    #3ee59a;

  box-shadow:
    0 0 12px
    rgba(62,229,154,.45);
}


.tsa-signal-down::before,
.tsa-signal-down::after{
  background:
    #ff6775;

  box-shadow:
    0 0 12px
    rgba(255,103,117,.42);
}


/*
  BREAK-EVEN:
  NO special colour.
*/

.tsa-signal-flat::before,
.tsa-signal-flat::after{
  background:
    transparent;

  box-shadow:
    none;
}


/* ========================================================
   TOP ROW
   ======================================================== */

.tsa-signal-card .tsa-signal-top{
  display:flex;

  align-items:center;

  justify-content:
    space-between;

  gap:10px;
}


.tsa-signal-card .tsa-signal-symbol-wrap{
  display:flex;

  align-items:
    baseline;

  gap:8px;

  min-width:0;
}


.tsa-signal-card .tsa-signal-symbol{
  color:#f5f9ff;

  font-size:13px;

  font-weight:850;

  letter-spacing:.15px;
}


.tsa-signal-card .tsa-signal-ltp{
  color:#849bb5;

  font-size:9px;

  white-space:nowrap;
}


.tsa-signal-card .tsa-signal-ltp strong{
  margin-left:3px;

  color:#eef6ff;

  font-size:11px;
}


/* ========================================================
   PERFORMANCE
   ======================================================== */

.tsa-signal-card .tsa-signal-performance{
  flex:0 0 auto;

  padding:
    5px 9px;

  border-radius:
    14px;

  font-size:10px;

  font-weight:850;
}


.tsa-signal-card .tsa-perf-up{
  color:#39e99e;

  background:
    rgba(18,108,75,.36);

  border:
    1px solid
    rgba(57,233,158,.30);
}


.tsa-signal-card .tsa-perf-down{
  color:#ff6e7b;

  background:
    rgba(128,37,51,.34);

  border:
    1px solid
    rgba(255,110,123,.30);
}


.tsa-signal-card .tsa-perf-flat{
  color:#b6c4d3;

  background:
    rgba(93,111,132,.16);

  border:
    1px solid
    rgba(142,159,178,.18);
}


/* ========================================================
   DATE / STATUS
   ======================================================== */

.tsa-signal-card .tsa-signal-sub{
  display:flex;

  align-items:center;

  justify-content:
    space-between;

  gap:10px;

  margin-top:7px;
}


.tsa-signal-card .tsa-signal-created{
  color:#8fa7c1;

  font-size:8px;
}


.tsa-signal-card .tsa-signal-status{
  padding:
    3px 8px;

  border-radius:
    11px;

  font-size:8px;

  font-weight:800;
}


.tsa-signal-card .tsa-status-active{
  color:#53d5ff;

  background:
    rgba(31,105,145,.33);
}


.tsa-signal-card .tsa-status-stop{
  color:#ff7884;

  background:
    rgba(128,38,51,.34);
}


.tsa-signal-card .tsa-status-tp{
  color:#41e7a0;

  background:
    rgba(18,108,75,.34);
}


.tsa-signal-card .tsa-status-expired{
  color:#acb8c7;

  background:
    rgba(79,94,114,.25);
}


/* ========================================================
   ENTRY / TP / SL
   ======================================================== */

.tsa-signal-card .tsa-signal-levels{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:7px;

  margin-top:9px;
}


.tsa-signal-card .tsa-signal-level{
  min-width:0;

  padding:
    7px 6px;

  border:
    1px solid
    rgba(55,111,161,.20);

  border-radius:
    8px;

  background:
    rgba(5,19,34,.44);

  text-align:center;
}


.tsa-signal-card .tsa-signal-level span{
  display:block;

  color:#8da1b8;

  font-size:7px;
}


.tsa-signal-card .tsa-signal-level strong{
  display:block;

  margin-top:2px;

  color:#f1f6fc;

  font-size:11px;

  font-weight:850;
}


.tsa-signal-card .tsa-signal-level
.tsa-tp{
  color:#3ce696;
}


.tsa-signal-card .tsa-signal-level
.tsa-sl{
  color:#ff6e79;
}


/* ========================================================
   RUNNING DAYS
   ======================================================== */

.tsa-signal-card .tsa-signal-running{
  margin-top:7px;

  padding-top:6px;

  border-top:
    1px solid
    rgba(72,128,175,.15);

  color:#8198b1;

  font-size:7px;
}


.tsa-signal-card .tsa-signal-running strong{
  margin-left:4px;

  color:#cbd9e8;
}



.tsa-signal-card{box-sizing:border-box;width:calc(100% - 6px);max-width:100%;min-width:0;overflow:visible}
.tsa-signal-card .tsa-signal-top,.tsa-signal-card .tsa-signal-sub,.tsa-signal-card .tsa-signal-symbol-wrap{flex-wrap:wrap;min-width:0}
.tsa-signal-card .tsa-signal-symbol,.tsa-signal-card .tsa-signal-created,.tsa-signal-card .tsa-signal-level strong{overflow-wrap:anywhere;min-width:0}
.tsa-signal-card .tsa-signal-meta,.tsa-signal-card .tsa-signal-source{font:10px/1.5 Arial,Helvetica,sans-serif;color:#8fa7c1;overflow-wrap:anywhere;margin-top:7px}
.tsa-signal-card .tsa-signal-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,86px),1fr));gap:7px;margin-top:9px;padding-top:8px;border-top:1px solid rgba(72,128,175,.2)}
.tsa-signal-card .tsa-signal-fact{min-width:0;padding:6px;border-radius:7px;background:rgba(5,19,34,.3)}
.tsa-signal-card .tsa-signal-fact span{display:block;font:9px/1.4 Arial,Helvetica,sans-serif;color:#8da1b8}
.tsa-signal-card .tsa-signal-fact strong{display:block;font:600 11px/1.5 Arial,Helvetica,sans-serif;color:#eef6ff;overflow-wrap:anywhere}
