
/* ==========================================================
   NOYTRIX TRACKING V14
   ========================================================== */

#screen-tracking {
  padding-top: 10px;
}

.tracking-v14 {
  max-width: 1280px;
  margin: 0 auto 60px;

  border: 1px solid #223b60;
  border-radius: 15px;

  background:
    radial-gradient(
      circle at 50% -10%,
      rgba(28,63,125,.12),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      #071429,
      #051021
    );

  box-shadow:
    0 24px 70px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.025);

  overflow: hidden;
}


/* HEADER */

.tracking-v14-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;

  gap: 30px;

  padding: 24px 28px 18px;
}

.tracking-v14-eyebrow {
  margin: 0 0 7px;

  color: #ffb828;

  font-size: 11px;
  font-weight: 850;
  letter-spacing: .085em;
}

.tracking-v14-head h2 {
  margin: 0;

  color: #f5f7fb;

  font-size: 33px;
  line-height: 1.05;

  letter-spacing: -.035em;

  text-shadow:
    0 10px 28px rgba(0,0,0,.32);
}

.tracking-v14-subtitle {
  max-width: 820px;

  margin: 8px 0 0;

  color: #9aa8bc;

  font-size: 13px;
  line-height: 1.5;
}

.tracking-v14-add {
  min-width: 175px;
  min-height: 45px;

  display: flex;
  align-items: center;
  justify-content: center;

  gap: 7px;

  border: 1px solid rgba(255,220,121,.45);
  border-radius: 9px;

  background:
    linear-gradient(
      135deg,
      #ffd05a,
      #ffb526
    );

  color: #111720;

  font-size: 12px;
  font-weight: 820;

  box-shadow:
    0 10px 30px rgba(255,177,25,.20),
    inset 0 1px 0 rgba(255,255,255,.5);
}

.tracking-v14-add:hover {
  transform: translateY(-1px);

  box-shadow:
    0 14px 34px rgba(255,177,25,.28),
    inset 0 1px 0 rgba(255,255,255,.55);
}


/* STATS */

.tracking-v14-stats {
  display: grid;

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

  gap: 14px;

  padding: 0 28px 15px;
}

.tracking-v14-stats article {
  min-height: 86px;

  display: flex;
  align-items: center;

  gap: 14px;

  padding: 14px 16px;

  border: 1px solid #294366;
  border-radius: 10px;

  background:
    linear-gradient(
      145deg,
      rgba(10,27,54,.95),
      rgba(7,20,41,.94)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025);
}

.stat-icon {
  width: 44px;
  height: 44px;

  flex: 0 0 44px;

  display: grid;
  place-items: center;

  border: 2px solid currentColor;
  border-radius: 50%;

  font-size: 21px;
  font-weight: 800;
}

.stat-icon.blue { color:#589cff; }
.stat-icon.orange { color:#ff9f1d; }
.stat-icon.green { color:#46d98d; }
.stat-icon.red { color:#ff5361; }

.tracking-v14-stats small {
  display: block;

  color: #bac4d5;

  font-size: 11px;
}

.tracking-v14-stats strong {
  display: inline-block;

  margin-top: 3px;

  color: #eef2f7;

  font-size: 25px;
  line-height: 1;
}

.tracking-v14-stats em {
  margin-left: 6px;

  color: #758298;

  font-size: 8px;
}


/* CHANGE ALERT */

.tracking-v14-alert {
  min-height: 49px;

  margin: 0 28px 14px;

  padding: 7px 10px 7px 12px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  border: 1px solid rgba(255,70,84,.60);
  border-radius: 8px;

  background:
    linear-gradient(
      90deg,
      rgba(103,17,30,.24),
      rgba(44,12,25,.10)
    );
}

.tracking-v14-alert > div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tracking-v14-alert > div > span {
  width: 28px;
  height: 28px;

  display: grid;
  place-items: center;

  border: 2px solid #ff5361;
  border-radius: 50%;

  color: #ff5361;
  font-weight: 850;
}

.tracking-v14-alert strong {
  color: #ff6570;

  font-size: 11px;
}

.tracking-v14-alert button {
  min-height: 32px;

  padding: 0 12px;

  border: 1px solid rgba(255,181,31,.52);
  border-radius: 6px;

  background: rgba(255,181,31,.025);

  color: #ffba2e;

  font-size: 9px;
  font-weight: 760;
}


/* FILTERS */

.tracking-v14-toolbar {
  display: grid;

  grid-template-columns:
    minmax(280px,1fr)
    180px
    180px
    44px;

  gap: 10px;

  padding: 0 28px 14px;
}

.tracking-v14-search {
  min-height: 43px;

  display: flex;
  align-items: center;

  gap: 9px;

  padding: 0 13px;

  border: 1px solid #2a4262;
  border-radius: 8px;

  background: #07162d;
}

.tracking-v14-search > span {
  color: #8d9aaf;
  font-size: 19px;
}

.tracking-v14-search input {
  width: 100%;

  border: 0;
  outline: 0;

  background: transparent;

  color: #e8edf4;

  font-size: 11px;
}

.tracking-v14-toolbar select,
.tracking-v14-refresh {
  border: 1px solid #2a4262;
  border-radius: 8px;

  background: #08172e;

  color: #d5ddea;

  font-size: 10px;
}

.tracking-v14-toolbar select {
  padding: 0 12px;
}

.tracking-v14-refresh {
  font-size: 19px;

  color: #b8c5d7;
}


/* MAIN */

.tracking-v14-body {
  display: grid;

  grid-template-columns:
    minmax(0,1fr)
    235px;

  gap: 13px;

  padding: 0 28px 20px;
}

.tracking-v14-table,
.tracking-v14-changes {
  border: 1px solid #29415f;
  border-radius: 9px;

  background:
    rgba(5,16,34,.65);
}

.tracking-v14-table {
  overflow: visible;
}

.tracking-v14-table-head {
  min-height: 42px;

  display: grid;

  grid-template-columns:
    minmax(230px,1.45fr)
    150px
    145px
    115px
    105px;

  align-items: center;

  padding: 0 13px;

  border-bottom: 1px solid #273d5d;

  color: #8895a9;

  font-size: 8.5px;
  font-weight: 700;
}


/* ROWS */

.tracking-v14-row {
  min-height: 64px;

  display: grid;

  grid-template-columns:
    minmax(230px,1.45fr)
    150px
    145px
    115px
    105px;

  align-items: center;

  padding: 7px 13px;

  border-bottom:
    1px solid rgba(37,56,85,.68);
}

.tracking-v14-row:last-child {
  border-bottom: 0;
}

.tracking-v14-row.changed {
  box-shadow:
    inset 2px 0 0 #ffb624;
}

.tracking-object-cell-v14 {
  min-width: 0;

  display: flex;
  align-items: center;

  gap: 10px;
}

.tracking-object-icon-v14 {
  width: 35px;
  height: 35px;

  flex: 0 0 35px;

  display: grid;
  place-items: center;

  border: 1px solid currentColor;
  border-radius: 50%;
}

.tracking-object-icon-v14 svg {
  width: 19px;
  height: 19px;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.7;

  stroke-linecap: round;
  stroke-linejoin: round;
}

.tracking-object-icon-v14.safe { color:#42d78e; }
.tracking-object-icon-v14.medium { color:#ffb728; }
.tracking-object-icon-v14.high,
.tracking-object-icon-v14.critical { color:#ff5361; }

.tracking-object-cell-v14 strong,
.tracking-object-cell-v14 small {
  display: block;
}

.tracking-object-cell-v14 strong {
  color: #edf1f6;

  font-size: 11px;
}

.tracking-object-cell-v14 small {
  max-width: 250px;

  margin-top: 3px;

  overflow: hidden;

  color: #66758c;

  font-size: 8px;

  white-space: nowrap;

  text-overflow: ellipsis;
}


/* RISK */

.tracking-risk-v14 {
  width: max-content;

  display: flex;
  align-items: center;

  gap: 4px;

  padding: 5px 7px;

  border: 1px solid currentColor;
  border-radius: 6px;

  background: rgba(255,255,255,.015);
}

.tracking-risk-v14 strong {
  font-size: 11px;
}

.tracking-risk-v14 small {
  font-size: 8px;
}

.tracking-risk-v14.safe { color:#42d78e; }
.tracking-risk-v14.medium { color:#ffb728; }
.tracking-risk-v14.high,
.tracking-risk-v14.critical { color:#ff5361; }


/* CHANGE */

.tracking-delta-v14 strong,
.tracking-delta-v14 small {
  display: block;
}

.tracking-delta-v14 strong {
  color: #9aa6b8;

  font-size: 11px;
}

.tracking-delta-v14 small {
  margin-top: 3px;

  color: #67758b;

  font-size: 8px;
}

.tracking-delta-v14.up strong { color:#ff5a67; }
.tracking-delta-v14.down strong { color:#46d98d; }

.tracking-last-v14 {
  color: #aab5c5;

  font-size: 9px;
}


/* ACTIONS */

.tracking-row-actions-v14 {
  display: flex;
  align-items: center;
  justify-content: flex-end;

  gap: 5px;
}

.tracking-row-actions-v14 .open {
  min-height: 31px;

  padding: 0 10px;

  border: 1px solid #3465a7;
  border-radius: 6px;

  background: rgba(14,43,84,.38);

  color: #76aff9;

  font-size: 9px;
}

.tracking-more-v14 {
  position: relative;
}

.tracking-more-v14 .more {
  width: 26px;
  height: 31px;

  border: 0;

  background: transparent;

  color: #b4bfd0;

  font-size: 19px;
}

.tracking-context-v14 {
  position: absolute;

  z-index: 80;

  right: 0;
  top: 33px;

  width: 150px;

  padding: 5px;

  border: 1px solid #304762;
  border-radius: 8px;

  background: #08162b;

  box-shadow:
    0 18px 50px rgba(0,0,0,.45);
}

.tracking-context-v14[hidden] {
  display: none !important;
}

.tracking-context-v14 button {
  width: 100%;
  min-height: 34px;

  border: 0;
  border-radius: 6px;

  background: transparent;

  color: #cbd4e1;

  font-size: 10px;
  text-align: left;
}

.tracking-context-v14 button:hover {
  background: rgba(255,255,255,.05);
}

.tracking-context-v14 button.danger {
  color: #ff6370;
}


/* RIGHT COLUMN */

.tracking-v14-changes {
  padding: 14px 13px;
}

.tracking-v14-changes h3 {
  margin: 0 0 14px;

  color: #e5eaf2;

  font-size: 13px;
}

.tracking-change-item-v14 {
  display: grid;

  grid-template-columns:
    30px minmax(0,1fr);

  gap: 9px;

  margin-bottom: 15px;
}

.tracking-change-item-v14 > span {
  width: 29px;
  height: 29px;

  display: grid;
  place-items: center;

  border: 1px solid currentColor;
  border-radius: 50%;

  font-weight: 800;
}

.tracking-change-item-v14 > span.up { color:#ff5764; }
.tracking-change-item-v14 > span.down { color:#43d88f; }

.tracking-change-item-v14 strong {
  color: #cfd7e3;

  font-size: 10px;
}

.tracking-change-item-v14 p {
  margin: 2px 0;

  color: #8592a6;

  font-size: 9px;
}

.tracking-change-item-v14 small {
  color: #57667c;

  font-size: 8px;
}

.tracking-change-empty-v14 {
  display: flex;

  gap: 8px;

  color: #65748a;

  font-size: 9px;
}


/* FOOTER */

.tracking-v14-footer {
  min-height: 68px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 20px;

  padding: 10px 18px;

  border-top: 1px solid #29415f;

  background:
    linear-gradient(
      145deg,
      #08172e,
      #061226
    );
}

.tracking-v14-footer > div {
  display: flex;
  align-items: center;

  gap: 11px;
}

.tracking-v14-footer > div > span {
  width: 29px;
  height: 29px;

  display: grid;
  place-items: center;

  border: 1px solid #4f91ed;
  border-radius: 50%;

  color: #6aa9fb;

  font-weight: 800;
}

.tracking-v14-footer p {
  margin: 0;
}

.tracking-v14-footer strong,
.tracking-v14-footer small {
  display: block;
}

.tracking-v14-footer strong {
  color: #cbd4e0;

  font-size: 10px;
}

.tracking-v14-footer small {
  margin-top: 3px;

  color: #68768b;

  font-size: 8px;
}

#trackingNotificationsV14 {
  min-height: 35px;

  padding: 0 13px;

  border: 1px solid #3671b8;
  border-radius: 6px;

  background: transparent;

  color: #68a9fa;

  font-size: 9px;
}


/* STATES */

.tracking-v14-loading,
.tracking-empty-v14,
.tracking-login-required-v14,
.tracking-error-v14 {
  min-height: 260px;

  display: flex;
  flex-direction: column;

  align-items: center;
  justify-content: center;

  padding: 25px;

  text-align: center;

  color: #738198;
}

.tracking-v14-loading {
  flex-direction: row;

  gap: 9px;

  font-size: 10px;
}

.tracking-v14-loading i {
  width: 13px;
  height: 13px;

  border: 2px solid #314663;
  border-top-color: #ffb624;
  border-radius: 50%;

  animation: trackSpin .8s linear infinite;
}

@keyframes trackSpin {
  to { transform:rotate(360deg); }
}

.tracking-empty-v14 > span,
.tracking-login-required-v14 > span {
  color: #ffb829;

  font-size: 34px;
}

.tracking-empty-v14 strong,
.tracking-login-required-v14 strong {
  margin-top: 9px;

  color: #e1e7f0;

  font-size: 13px;
}

.tracking-empty-v14 p,
.tracking-login-required-v14 p {
  max-width: 390px;

  color: #65748a;

  font-size: 9px;
  line-height: 1.55;
}

.tracking-login-required-v14 button {
  min-height: 35px;

  margin-top: 5px;

  padding: 0 14px;

  border: 1px solid rgba(255,183,32,.38);
  border-radius: 7px;

  background: rgba(255,181,31,.06);

  color: #ffba2f;

  font-weight: 750;
}


/* MODAL */

.tracking-v14-modal {
  position: fixed;

  z-index: 1000;

  inset: 0;

  display: grid;
  place-items: center;
}

.tracking-v14-modal[hidden] {
  display: none !important;
}

.tracking-v14-backdrop {
  position: absolute;

  inset: 0;

  background: rgba(1,6,15,.80);

  backdrop-filter: blur(8px);
}

.tracking-v14-modal-card {
  position: relative;

  z-index: 1;

  width: min(510px,calc(100vw - 30px));

  padding: 28px;

  border: 1px solid #324965;
  border-radius: 15px;

  background:
    linear-gradient(
      145deg,
      #0b1b34,
      #071327
    );

  box-shadow:
    0 32px 90px rgba(0,0,0,.56);
}

.tracking-v14-modal-close {
  position: absolute;

  right: 12px;
  top: 12px;

  width: 30px;
  height: 30px;

  border: 0;
  border-radius: 7px;

  background: rgba(255,255,255,.04);

  color: #8795aa;

  font-size: 20px;
}

.tracking-v14-modal-icon {
  width: 46px;
  height: 46px;

  display: grid;
  place-items: center;

  border: 1px solid rgba(255,182,31,.38);
  border-radius: 12px;

  background: rgba(255,181,31,.05);

  color: #ffb82b;

  font-size: 24px;
}

.tracking-v14-modal-card h3 {
  margin: 15px 0 7px;

  color: #f0f3f7;

  font-size: 19px;
}

.tracking-v14-modal-card > p {
  color: #8997ab;

  font-size: 11px;
  line-height: 1.55;
}

#trackingAddFormV14 {
  display: grid;

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

  gap: 8px;

  margin-top: 18px;
}

#trackingAddInputV14 {
  min-height: 47px;

  padding: 0 13px;

  border: 1px solid #304660;
  border-radius: 9px;

  outline: none;

  background: #071328;

  color: #e6ebf3;
}

#trackingAddSubmitV14 {
  min-height: 47px;

  padding: 0 15px;

  border: 0;
  border-radius: 9px;

  background:
    linear-gradient(
      135deg,
      #ffd05b,
      #ffb526
    );

  color: #111720;

  font-weight: 800;
}

#trackingAddStatusV14 {
  min-height: 20px;

  margin-top: 10px;

  color: #8492a7;

  font-size: 9px;
}


/* TOAST */

.tracking-toast-v14 {
  position: fixed;

  z-index: 2000;

  right: 24px;
  bottom: 24px;

  max-width: 360px;

  padding: 12px 15px;

  border: 1px solid #355172;
  border-radius: 10px;

  background: #0a1a32;

  color: #dce4ef;

  font-size: 11px;

  box-shadow:
    0 18px 50px rgba(0,0,0,.45);

  opacity: 0;

  transform: translateY(10px);

  transition: .2s ease;
}

.tracking-toast-v14.show {
  opacity: 1;
  transform: translateY(0);
}

.tracking-toast-v14.success {
  border-color: rgba(67,214,142,.45);
}

.tracking-toast-v14.error {
  border-color: rgba(255,82,96,.50);
}


/* MOBILE */

@media(max-width:1100px){

  .tracking-v14-stats {
    grid-template-columns: 1fr 1fr;
  }

  .tracking-v14-body {
    grid-template-columns: 1fr;
  }

  .tracking-v14-table {
    overflow-x: auto;
  }

  .tracking-v14-table-head,
  .tracking-v14-row {
    min-width: 850px;
  }
}

@media(max-width:760px){

  .tracking-v14-head {
    flex-direction: column;
  }

  .tracking-v14-add {
    width: 100%;
  }

  .tracking-v14-stats {
    grid-template-columns: 1fr;
  }

  .tracking-v14-toolbar {
    grid-template-columns: 1fr;
  }

  #trackingAddFormV14 {
    grid-template-columns: 1fr;
  }
}


/* ==========================================================
   NOYTRIX TRACKING POLISH V15
   ========================================================== */


/* вся dashboard-карточка занимает оставшуюся высоту */

#screen-tracking .tracking-v14 {
  width: 100%;
  height: 100%;

  min-height: 0;

  margin: 0 auto !important;

  display: grid;

  grid-template-rows:
    auto
    auto
    auto
    auto
    minmax(0, 1fr)
    auto;

  overflow: hidden;

  border-color:
    rgba(53,79,119,.75);

  border-radius: 16px;

  background:
    radial-gradient(
      circle at 72% -10%,
      rgba(36,76,153,.16),
      transparent 37%
    ),
    linear-gradient(
      145deg,
      rgba(7,20,42,.98),
      rgba(4,14,30,.99)
    );

  box-shadow:
    0 25px 75px rgba(0,0,0,.25),
    inset 0 1px 0 rgba(255,255,255,.035);
}


/* ----------------------------------------------------------
   HEADER
   ---------------------------------------------------------- */

.tracking-v14-head {
  padding:
    19px 25px
    14px !important;

  align-items:
    center !important;
}


.tracking-v14-eyebrow {
  margin-bottom:
    5px !important;

  color:
    #ffb927 !important;

  font-size:
    10px !important;

  letter-spacing:
    .105em !important;
}


.tracking-v14-head h2 {
  font-size:
    clamp(27px, 2vw, 34px)
    !important;

  letter-spacing:
    -.04em !important;

  text-shadow:
    0 6px 15px rgba(0,0,0,.30),
    0 18px 38px rgba(0,0,0,.25);
}


.tracking-v14-subtitle {
  margin-top:
    6px !important;

  max-width:
    830px;

  color:
    #8393aa !important;

  font-size:
    11.5px !important;
}


/* Add object */

.tracking-v14-add {
  min-width:
    174px;

  min-height:
    43px !important;

  border-radius:
    10px !important;

  box-shadow:
    0 9px 28px rgba(255,174,21,.20),
    0 0 28px rgba(255,181,31,.04),
    inset 0 1px 0 rgba(255,255,255,.52)
    !important;
}


/* ----------------------------------------------------------
   STATS
   ---------------------------------------------------------- */

.tracking-v14-stats {
  gap:
    12px !important;

  padding:
    0 25px
    12px !important;
}


.tracking-v14-stats article {
  min-height:
    79px !important;

  padding:
    12px 15px !important;

  border-color:
    rgba(47,72,109,.78);

  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease;
}


.tracking-v14-stats article:hover {
  transform:
    translateY(-1px);

  border-color:
    rgba(66,99,148,.90);

  background:
    linear-gradient(
      145deg,
      rgba(13,32,63,.98),
      rgba(7,21,43,.96)
    );
}


.stat-icon {
  width:
    40px !important;

  height:
    40px !important;

  flex-basis:
    40px !important;

  font-size:
    18px !important;
}


.tracking-v14-stats strong {
  font-size:
    23px !important;
}


/* числа получают смысловой цвет */

.tracking-v14-stats
article[data-stat="changed"]
strong {
  color: #ff5a67;
}


.tracking-v14-stats
article[data-stat="stable"]
strong {
  color: #45d98e;
}


.tracking-v14-stats
article[data-stat="attention"]
strong {
  color: #ff5a67;
}


/* ----------------------------------------------------------
   ALERT

   Сейчас у тебя он отображается даже с hidden.
   Это исправляет пустую красную полосу.
   ---------------------------------------------------------- */

.tracking-v14-alert[hidden] {
  display: none !important;
}


.tracking-v14-alert {
  min-height:
    43px !important;

  margin:
    0 25px
    11px !important;
}


/* ----------------------------------------------------------
   TOOLBAR
   ---------------------------------------------------------- */

.tracking-v14-toolbar {
  grid-template-columns:
    minmax(260px, 1fr)
    190px
    190px
    45px
    !important;

  gap:
    9px !important;

  padding:
    0 25px
    11px !important;
}


.tracking-v14-search,
.tracking-v14-toolbar select,
.tracking-v14-refresh {
  min-height:
    40px !important;

  border-color:
    rgba(46,70,105,.88) !important;

  background:
    linear-gradient(
      145deg,
      rgba(8,24,48,.94),
      rgba(6,19,39,.96)
    ) !important;
}


.tracking-v14-search:focus-within {
  border-color:
    rgba(255,183,37,.36)
    !important;

  box-shadow:
    0 0 0 3px
    rgba(255,181,31,.035);
}


/* ----------------------------------------------------------
   MAIN TABLE AREA

   Вот это главное:
   таблица занимает всё оставшееся пространство.
   ---------------------------------------------------------- */

.tracking-v14-body {
  min-height: 0 !important;

  height: 100%;

  grid-template-columns:
    minmax(0, 1fr)
    250px !important;

  gap:
    11px !important;

  padding:
    0 25px
    12px !important;

  overflow: hidden;
}


.tracking-v14-table {
  min-width: 0;
  min-height: 0;

  height: 100%;

  display: flex;
  flex-direction: column;

  overflow: hidden !important;

  border-color:
    rgba(48,72,107,.82) !important;
}


.tracking-v14-table-head {
  flex:
    0 0 41px;

  min-height:
    41px !important;

  background:
    rgba(9,24,47,.72);
}


/*
  Только строки внутри таблицы прокручиваются,
  если объектов станет 20, 50 и т.д.
*/

.tracking-v14-rows {
  flex: 1 1 auto;

  min-height: 0;

  overflow-y: auto;

  overscroll-behavior: contain;

  scrollbar-width: thin;

  scrollbar-color:
    rgba(66,88,122,.45)
    transparent;
}


.tracking-v14-rows::-webkit-scrollbar {
  width: 5px;
}


.tracking-v14-rows::-webkit-scrollbar-track {
  background: transparent;
}


.tracking-v14-rows::-webkit-scrollbar-thumb {
  border-radius: 20px;

  background:
    rgba(72,94,130,.45);
}


/* ----------------------------------------------------------
   SIGN IN EMPTY STATE
   ---------------------------------------------------------- */

.tracking-login-required-v14 {
  height: 100%;

  min-height:
    0 !important;

  padding:
    20px !important;
}


.tracking-login-required-v14 > span {
  width: 43px;
  height: 43px;

  display: grid;
  place-items: center;

  margin-bottom: 2px;

  border:
    1px solid
    rgba(255,181,31,.34);

  border-radius:
    13px;

  background:
    rgba(255,181,31,.04);

  color:
    #ffb829;

  font-size:
    25px !important;

  box-shadow:
    0 0 24px
    rgba(255,181,31,.05);
}


.tracking-login-required-v14 strong {
  font-size:
    12px !important;
}


.tracking-login-required-v14 button {
  min-height:
    38px !important;

  padding:
    0 16px !important;

  border-color:
    rgba(255,183,37,.46);

  border-radius:
    9px;

  background:
    linear-gradient(
      145deg,
      rgba(255,181,31,.10),
      rgba(255,181,31,.035)
    );

  color:
    #ffc13d;

  box-shadow:
    0 8px 25px
    rgba(0,0,0,.18);
}


/* ----------------------------------------------------------
   LATEST CHANGES
   ---------------------------------------------------------- */

.tracking-v14-changes {
  min-width: 0;
  min-height: 0;

  height: 100%;

  overflow: hidden;

  border-color:
    rgba(48,72,107,.82) !important;

  background:
    linear-gradient(
      160deg,
      rgba(7,22,44,.90),
      rgba(5,17,35,.94)
    ) !important;
}


.tracking-v14-changes h3 {
  margin-bottom:
    11px !important;

  font-size:
    12px !important;
}


#trackingChangesV14 {
  height:
    calc(100% - 30px);

  overflow-y: auto;

  scrollbar-width: none;
}


#trackingChangesV14::-webkit-scrollbar {
  display: none;
}


.tracking-change-empty-v14 {
  height:
    calc(100% - 10px);

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 6px;

  text-align: center;

  opacity: .72;
}


.tracking-change-empty-v14 span {
  width: 29px;
  height: 29px;

  display: grid;
  place-items: center;

  border:
    1px solid rgba(65,211,141,.20);

  border-radius: 50%;

  color:
    #42d68d;
}


/* ----------------------------------------------------------
   FOOTER
   ---------------------------------------------------------- */

.tracking-v14-footer {
  min-height:
    57px !important;

  padding:
    8px 18px !important;

  border-top-color:
    rgba(45,68,101,.78) !important;
}


.tracking-v14-footer > div > span {
  width:
    27px !important;

  height:
    27px !important;
}


#trackingNotificationsV14 {
  min-height:
    33px !important;
}


/* ----------------------------------------------------------
   900p / smaller laptop screens
   ---------------------------------------------------------- */

@media(
  min-width: 761px
) and (
  max-height: 850px
) {

  .workspace {
    padding-top:
      10px !important;

    padding-bottom:
      10px !important;
  }


  .workspace-header {
    flex-basis:
      51px;

    min-height:
      51px;
  }


  .tracking-v14-head {
    padding-top:
      13px !important;

    padding-bottom:
      10px !important;
  }


  .tracking-v14-head h2 {
    font-size:
      27px !important;
  }


  .tracking-v14-stats article {
    min-height:
      68px !important;
  }


  .stat-icon {
    width:
      35px !important;

    height:
      35px !important;

    flex-basis:
      35px !important;
  }


  .tracking-v14-footer {
    min-height:
      50px !important;
  }

}


/* ==========================================================
   TRACKING V16 — LAYOUT FIX
   ========================================================== */


/*
  ВАЖНО:
  используем flex, а не старую grid-разметку.
  Из-за hidden alert footer раньше попадал
  в растягиваемую grid-строку и занимал кучу места.
*/

#screen-tracking .tracking-v14 {
  display: flex !important;
  flex-direction: column !important;

  height: 100% !important;

  min-height: 0 !important;
}


.tracking-v14-head,
.tracking-v14-stats,
.tracking-v14-alert,
.tracking-v14-toolbar,
.tracking-notify-v15 {
  flex:
    0 0 auto;
}


/* таблица получает ВСЁ оставшееся пространство */

.tracking-v14-body {
  flex:
    1 1 auto !important;

  min-height:
    0 !important;

  height:
    auto !important;

  padding-bottom:
    9px !important;
}


/* немного увеличиваем полезную часть */

.tracking-v14-table-head {
  min-height:
    45px !important;

  flex-basis:
    45px !important;

  font-size:
    9px !important;
}


.tracking-v14-row {
  min-height:
    68px !important;
}


.tracking-object-cell-v14 strong {
  font-size:
    11.5px !important;
}


.tracking-object-cell-v14 small {
  font-size:
    8.5px !important;
}


.tracking-risk-v14 strong {
  font-size:
    11.5px !important;
}


.tracking-v14-changes h3 {
  font-size:
    12.5px !important;
}


/* ==========================================================
   BOTTOM NOTIFICATION BAR
   ========================================================== */

.tracking-notify-v15 {
  width: 100%;

  min-height:
    62px !important;

  max-height:
    62px !important;

  display: grid !important;

  grid-template-columns:
    minmax(270px, 1fr)
    auto
    auto;

  align-items: center;

  gap: 18px;

  padding:
    8px 16px !important;

  border-top:
    1px solid
    rgba(49,73,108,.86)
    !important;

  background:
    linear-gradient(
      180deg,
      rgba(8,23,45,.98),
      rgba(6,18,36,.99)
    ) !important;

  box-shadow:
    inset 0 1px 0
    rgba(255,255,255,.018);
}


/* LEFT */

.tracking-notify-info-v15 {
  min-width: 0;

  display: flex;

  align-items: center;

  gap: 10px;
}


.tracking-info-icon-v15 {
  width: 29px;
  height: 29px;

  flex:
    0 0 29px;

  display: grid;
  place-items: center;

  border:
    1px solid #4687dc;

  border-radius: 50%;

  color: #68aaff;

  font-size: 11px;

  font-weight: 850;
}


.tracking-notify-info-v15 strong,
.tracking-notify-info-v15 small {
  display: block;
}


.tracking-notify-info-v15 strong {
  overflow: hidden;

  color: #d2dae6;

  font-size: 9.5px;

  font-weight: 650;

  white-space: nowrap;

  text-overflow: ellipsis;
}


.tracking-notify-info-v15 small {
  margin-top: 3px;

  overflow: hidden;

  color: #68778d;

  font-size: 8px;

  white-space: nowrap;

  text-overflow: ellipsis;
}


/* CENTER */

.tracking-notify-controls-v15 {
  display: flex;

  align-items: center;

  gap: 8px;
}


.tracking-notify-label-v15 {
  margin-right: 2px;

  color: #8593a8;

  font-size: 8px;

  font-weight: 750;

  white-space: nowrap;
}


.tracking-channel-list-v15 {
  display: flex;

  align-items: center;

  gap: 5px;
}


/* channel pill */

.tracking-channel-v15 {
  position: relative;

  min-height: 34px;

  display: flex;

  align-items: center;

  gap: 6px;

  padding:
    0 9px;

  border:
    1px solid
    rgba(48,72,108,.88);

  border-radius:
    8px;

  background:
    rgba(8,22,43,.76);

  color: #8b99ae;

  font-size: 8.5px;

  font-weight: 650;

  transition:
    border-color .16s ease,
    background .16s ease,
    color .16s ease;
}


.tracking-channel-v15 svg {
  width: 14px;
  height: 14px;

  fill: none;

  stroke: currentColor;

  stroke-width: 1.6;

  stroke-linecap: round;
  stroke-linejoin: round;
}


.tracking-channel-v15 i {
  width: 6px;
  height: 6px;

  margin-left: 2px;

  border-radius: 50%;

  background: #445268;
}


.tracking-channel-v15.active {
  border-color:
    rgba(255,182,34,.39);

  background:
    linear-gradient(
      145deg,
      rgba(255,181,31,.09),
      rgba(255,181,31,.025)
    );

  color: #dbe2ec;
}


.tracking-channel-v15.active svg {
  color: #ffba2e;
}


.tracking-channel-v15.active i {
  background: #ffb82b;

  box-shadow:
    0 0 9px
    rgba(255,181,31,.36);
}


.tracking-channel-v15:hover:not(.disabled) {
  border-color:
    rgba(255,183,35,.44);
}


.tracking-channel-v15.disabled {
  opacity: .42;
}


/* frequency */

.tracking-frequency-v15 {
  min-height: 34px;

  display: flex;

  align-items: center;

  gap: 6px;

  padding:
    0 7px 0 9px;

  border:
    1px solid
    rgba(48,72,108,.88);

  border-radius:
    8px;

  background:
    rgba(8,22,43,.76);
}


.tracking-frequency-v15 > span {
  color: #74839a;

  font-size: 8px;
}


.tracking-frequency-v15 select {
  border: 0;

  outline: 0;

  background: transparent;

  color: #d2dae7;

  font-size: 8.5px;

  font-weight: 650;
}


.tracking-frequency-v15 select option {
  background: #08162b;

  color: #dce3ed;
}


/* RIGHT SAVE STATE */

.tracking-notify-state-v15 {
  min-width: 96px;

  display: flex;

  justify-content: flex-end;
}


.tracking-notify-status-v15 {
  min-height: 29px;

  display: flex;

  align-items: center;

  padding:
    0 9px;

  border:
    1px solid
    rgba(50,74,109,.72);

  border-radius:
    7px;

  color: #718198;

  font-size: 8px;

  white-space: nowrap;
}


.tracking-notify-status-v15.saved {
  border-color:
    rgba(57,194,127,.22);

  color: #55cb8d;

  background:
    rgba(43,179,112,.035);
}


.tracking-notify-status-v15.saving {
  color: #ffb82b;
}


.tracking-notify-status-v15.error {
  border-color:
    rgba(255,84,97,.32);

  color: #ff6570;
}


.tracking-notify-status-v15.signin {
  border-color:
    rgba(255,181,31,.25);

  color: #d2a13d;
}


/* ==========================================================
   EXTRA SPACE FOR MAIN FUNCTIONALITY
   ========================================================== */

.tracking-v14-head {
  padding-bottom:
    12px !important;
}


.tracking-v14-stats {
  padding-bottom:
    10px !important;
}


.tracking-v14-toolbar {
  padding-bottom:
    9px !important;
}


/*
  Теперь таблица и Latest changes визуально
  почти до самого notification bar.
*/

.tracking-v14-table,
.tracking-v14-changes {
  height: 100% !important;
}


/* compact laptop */

@media(
  min-width: 761px
) and (
  max-height: 850px
) {

  .tracking-notify-v15 {
    min-height:
      54px !important;

    max-height:
      54px !important;

    padding:
      6px 14px !important;
  }


  .tracking-channel-v15,
  .tracking-frequency-v15 {
    min-height:
      31px;
  }


  .tracking-notify-info-v15 small {
    display: none;
  }

}

/* ==========================================================
   TRACKING V17 — CLEAN BOTTOM BAR
   ========================================================== */

.tracking-notify-v15 {
  display: grid !important;
  grid-template-columns: minmax(300px, 1fr) auto auto auto !important;
  align-items: center !important;
  gap: 14px !important;

  min-height: 62px !important;
  max-height: 62px !important;

  padding: 8px 16px !important;
  overflow: hidden !important;
}

.tracking-notify-info-v15 {
  min-width: 0 !important;
  max-width: 420px !important;

  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.tracking-info-icon-v15 {
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;

  display: grid !important;
  place-items: center !important;

  border: 1px solid rgba(83, 142, 228, .95) !important;
  border-radius: 50% !important;

  color: #69a8ff !important;
  font-size: 11px !important;
  font-weight: 800 !important;
}

.tracking-notify-info-v15 strong {
  display: block !important;
  margin: 0 !important;

  color: #d7e0ee !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;

  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.tracking-notify-info-v15 small {
  display: block !important;
  margin-top: 3px !important;

  color: #74839a !important;
  font-size: 10px !important;
  line-height: 1.1 !important;

  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* center controls */
.tracking-notify-controls-v15 {
  display: flex !important;
  align-items: center !important;
  justify-self: center !important;
  gap: 8px !important;
  min-width: 0 !important;
}

.tracking-notify-label-v15 {
  display: none !important;
}

.tracking-channel-list-v15 {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.tracking-channel-v15 {
  min-width: 92px !important;
  height: 32px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;

  padding: 0 10px !important;

  border: 1px solid rgba(48,72,108,.9) !important;
  border-radius: 9px !important;

  background: rgba(8,22,43,.82) !important;
  color: #8998ad !important;

  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1 !important;

  white-space: nowrap !important;
}

.tracking-channel-v15 svg {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;

  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.7 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.tracking-channel-v15 i {
  width: 6px !important;
  height: 6px !important;
  flex: 0 0 6px !important;

  margin-left: 2px !important;
  border-radius: 50% !important;
  background: #435268 !important;
}

.tracking-channel-v15.active {
  border-color: rgba(255,184,36,.42) !important;
  background: linear-gradient(145deg, rgba(255,181,31,.10), rgba(255,181,31,.03)) !important;
  color: #dfe7f3 !important;
}

.tracking-channel-v15.active svg {
  color: #ffb72d !important;
}

.tracking-channel-v15.active i {
  background: #ffb72d !important;
  box-shadow: 0 0 10px rgba(255,183,45,.35) !important;
}

.tracking-channel-v15.disabled {
  opacity: .42 !important;
}

.tracking-frequency-v15 {
  height: 32px !important;
  min-width: 148px !important;

  display: flex !important;
  align-items: center !important;
  gap: 7px !important;
  justify-self: end !important;

  padding: 0 10px !important;

  border: 1px solid rgba(48,72,108,.9) !important;
  border-radius: 9px !important;
  background: rgba(8,22,43,.82) !important;
}

.tracking-frequency-v15 > span {
  color: #7f8ea4 !important;
  font-size: 10px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.tracking-frequency-v15 select {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;

  color: #d7deea !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1 !important;

  min-width: 92px !important;
}

.tracking-frequency-v15 select option {
  background: #08162b !important;
  color: #dce3ed !important;
}

.tracking-notify-state-v15 {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  min-width: 90px !important;
}

.tracking-notify-status-v15 {
  min-height: 32px !important;
  padding: 0 10px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  border: 1px solid rgba(50,74,109,.78) !important;
  border-radius: 9px !important;

  color: #7b8aa1 !important;
  font-size: 11px !important;
  font-weight: 650 !important;
  line-height: 1 !important;

  white-space: nowrap !important;
}

.tracking-notify-status-v15.saved {
  color: #53c987 !important;
  border-color: rgba(57,194,127,.24) !important;
  background: rgba(43,179,112,.04) !important;
}

.tracking-notify-status-v15.saving {
  color: #ffb72d !important;
  border-color: rgba(255,183,45,.24) !important;
}

.tracking-notify-status-v15.error {
  color: #ff6570 !important;
  border-color: rgba(255,84,97,.30) !important;
}

.tracking-notify-status-v15.signin {
  display: none !important;
}

/* чуть больше места таблице */
.tracking-v14-body {
  padding-bottom: 8px !important;
}

/* laptop */
@media (max-width: 1460px) {
  .tracking-notify-v15 {
    grid-template-columns: minmax(240px, 1fr) auto auto !important;
    gap: 10px !important;
  }

  .tracking-notify-state-v15 {
    display: none !important;
  }

  .tracking-notify-info-v15 {
    max-width: 330px !important;
  }

  .tracking-channel-v15 {
    min-width: 84px !important;
    font-size: 10px !important;
    padding: 0 8px !important;
  }

  .tracking-frequency-v15 {
    min-width: 138px !important;
  }
}

