/* ==========================================================
   ГОЛ МОМЕНТ
   COMPACT PREDICTION CARDS
   ========================================================== */

.gm-compact-card{
  position:relative!important;
  overflow:hidden!important;

  margin:0!important;
  padding:13px 14px 12px!important;

  min-height:0!important;

  color:#f4f8f6!important;

  background:
    radial-gradient(
      circle at 100% 0,
      rgba(24,214,111,.055),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      #11231b 0%,
      #0d1d17 100%
    )!important;

  border:
    1px solid rgba(83,132,103,.27)!important;

  border-radius:16px!important;

  box-shadow:
    0 5px 16px rgba(0,0,0,.14)!important;

  transform:none!important;
}

.gm-compact-card:hover{
  border-color:
    rgba(47,222,123,.38)!important;

  box-shadow:
    0 7px 22px rgba(0,0,0,.18)!important;
}

/* зелёная тонкая подсветка */

.gm-compact-card::before{
  content:"";

  position:absolute;

  left:0;
  top:18px;
  bottom:18px;

  width:2px;

  background:
    linear-gradient(
      180deg,
      transparent,
      #26df78,
      transparent
    );

  opacity:.55;
}

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

.gm-compact-top{
  display:flex;
  align-items:center;

  gap:7px;

  min-height:25px;

  margin-bottom:9px;
}

.gm-compact-number{
  min-width:35px;
  height:25px;

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

  padding:0 8px;

  color:#30e983;

  background:
    rgba(26,201,104,.07);

  border:
    1px solid rgba(40,222,119,.45);

  border-radius:8px;

  font-size:11px;
  line-height:1;

  font-weight:850;

  font-variant-numeric:
    tabular-nums;
}

.gm-compact-time{
  display:flex;
  align-items:center;

  gap:5px;

  color:#aebcb5;

  font-size:10px;
  font-weight:750;

  white-space:nowrap;
}

.gm-compact-clock{
  width:16px;
  height:16px;

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

  color:#e7efeb;

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

  border-radius:50%;

  font-size:9px;
}

.gm-compact-status{
  min-height:23px;

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

  margin-left:2px;

  padding:0 10px;

  border-radius:8px;

  color:#31e781;

  background:
    rgba(29,199,103,.09);

  border:
    1px solid rgba(40,220,119,.31);

  font-size:9px;
  font-weight:850;

  white-space:nowrap;
}

.gm-compact-status.soon{
  color:#d6e1dc;

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

  border-color:
    rgba(255,255,255,.11);
}

/* ==========================================================
   MATCH
   ========================================================== */

.gm-compact-match{
  display:flex;
  align-items:center;

  min-width:0;

  margin-bottom:9px;
}

.gm-compact-dot{
  width:8px;
  height:8px;

  flex:0 0 8px;

  margin-right:9px;

  border-radius:50%;

  background:#31e87f;

  box-shadow:
    0 0 9px rgba(49,232,127,.56);
}

.gm-compact-teams{
  min-width:0;

  overflow:hidden;

  color:#f4f7f5;

  font-size:14px;
  line-height:1.25;

  font-weight:850;

  letter-spacing:-.15px;

  text-overflow:ellipsis;

  white-space:nowrap;
}

/* ==========================================================
   DIVIDER
   ========================================================== */

.gm-compact-line{
  height:1px;

  margin:0 0 9px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(156,184,168,.12) 8%,
      rgba(156,184,168,.12) 92%,
      transparent
    );
}

/* ==========================================================
   BOTTOM
   ========================================================== */

.gm-compact-bottom{
  display:grid;

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

  align-items:center;

  column-gap:13px;
}

.gm-compact-separator{
  width:1px;
  height:30px;

  background:
    rgba(148,177,160,.16);
}

.gm-compact-data{
  min-width:0;
}

.gm-compact-label{
  margin-bottom:3px;

  color:#819188;

  font-size:7px;
  line-height:1;

  font-weight:750;

  letter-spacing:.6px;

  text-transform:uppercase;
}

.gm-compact-value{
  min-height:18px;

  display:flex;
  align-items:center;

  color:#f7faf8;

  font-size:16px;
  line-height:1;

  font-weight:900;
}

.gm-compact-value.coefficient{
  color:#dbe5df;
}

.gm-compact-value.coefficient.empty{
  color:#3ee487;
}

/* ==========================================================
   SHARE BUTTON
   сохраняем существующую рабочую кнопку
   ========================================================== */

.gm-compact-action-slot{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}

.gm-compact-action{
  width:auto!important;
  min-width:88px!important;
  height:36px!important;
  min-height:36px!important;

  margin:0!important;
  padding:0 12px!important;

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

  color:#e5eee9!important;

  background:
    rgba(14,42,29,.72)!important;

  border:
    1px solid rgba(36,208,111,.48)!important;

  border-radius:11px!important;

  box-shadow:none!important;

  font-size:10px!important;
  font-weight:800!important;

  opacity:1!important;

  cursor:pointer;

  transition:
    background .15s ease,
    border-color .15s ease,
    transform .15s ease!important;
}

.gm-compact-action:hover,
.gm-compact-action:active{
  color:#fff!important;

  background:
    rgba(22,122,69,.30)!important;

  border-color:
    rgba(44,231,127,.75)!important;
}

.gm-compact-action:active{
  transform:
    scale(.97)!important;
}

/* ==========================================================
   LIST
   ========================================================== */

.gm-compact-list{
  display:flex!important;
  flex-direction:column!important;

  gap:8px!important;
}

/* ==========================================================
   MOBILE
   ========================================================== */

@media(max-width:700px){

  .gm-compact-card{
    padding:
      12px 12px 11px!important;

    border-radius:
      15px!important;
  }

  .gm-compact-top{
    margin-bottom:
      8px;
  }

  .gm-compact-number{
    min-width:
      34px;

    height:
      24px;

    font-size:
      10px;
  }

  .gm-compact-teams{
    font-size:
      13px;
  }

  .gm-compact-bottom{
    grid-template-columns:
      minmax(67px,1fr)
      1px
      minmax(67px,.85fr)
      auto;

    column-gap:
      9px;
  }

  .gm-compact-action{
    min-width:
      79px!important;

    height:
      34px!important;

    min-height:
      34px!important;

    padding:
      0 9px!important;

    font-size:
      9px!important;
  }

}

/* очень узкие смартфоны */

@media(max-width:360px){

  .gm-compact-bottom{
    grid-template-columns:
      1fr
      1px
      .75fr
      auto;

    column-gap:
      7px;
  }

  .gm-compact-action{
    min-width:
      70px!important;

    padding:
      0 7px!important;
  }

}


/* FAST RENDER */

.gm-compact-card{
  contain:
    layout paint style;
}

@media(max-width:700px){

  .gm-compact-card{
    content-visibility:auto;
    contain-intrinsic-size:140px;
  }

}