.helpev {background: rgb(var(--bg-home));color:#fff;border-radius: 6px;padding: 6px;display: inline-block;margin: 4px 0px;}
.helpdep {background: rgb(var(--bg-away));color:#fff;border-radius: 6px;padding: 6px;display: inline-block;margin: 4px 0px;}
.helpev_opa {background: rgba(var(--bg-home),0.2);border-radius: 6px;padding: 6px;display: inline-block;margin: 4px 0px;border-bottom:solid 1px rgb(var(--bg-home));}
.helpdep_opa {background: rgba(var(--bg-away),0.2);border-radius: 6px;padding: 6px;display: inline-block;margin: 4px 0px;border-bottom:solid 1px rgb(var(--bg-away));}
/* =========================
   ROOT
========================= */
#cornerWrapper {min-height:100vh;}
.corner-root {
  margin: 0px var(--margin-left-right);
  color: var(--text-primary);
}

/* =========================
   TOOLBAR
========================= */
.corner-toolbar {
  display: flex;
  justify-content: space-between;
  column-gap: 12px;
  flex-wrap: wrap;
  position: sticky;top:var(--height-header);z-index: 1;
      background: var(--bg-card);
  margin-bottom: 12px;
}
.corner-toolbar-top {
    display: flex;
    align-items: center;
    --fc-size: 18px;
}

.corner-toolbar-left,
.corner-toolbar-right {
  display: flex;
  gap: 10px;
  align-items: flex-end;flex:1 1 100%;
}

/* =========================
   SELECT WRAPPER
========================= */
.corner-select-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
  flex:1 1 100%;padding: 6px;
}

.corner-select-wrap label {
  font-size: 11px;
  color: var(--text-secondary);
  padding-left: 2px;
  display: block;
}

/* =========================
   SELECT STYLE
========================= */
.corner-select-wrap select {
      cursor: pointer;
    padding: 8px 36px 8px 12px;
    font-size: 13px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,.08);
    background: var(--input-bg2)
    url("data:image/svg+xml;utf8,<svg fill='%23aaa' height='20' viewBox='0 0 20 20' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M5 7l5 6 5-6z'/></svg>")
    no-repeat right 0px center;
    background-size: 16px;
    color: var(--text-primary);
    min-height: 40px;
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
}

/* dropdown arrow */
.corner-select-wrap {
  position: relative;
}


/* hover */

/* focus */
.corner-select-wrap select:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px rgba(75,227,190,0.2);
}

/* =========================
   BUTTONS
========================= */
.corner-toggle {
  height: 42px;
  padding: 0 14px;
  border-radius: 10px;
  border: none;

  background: linear-gradient(
    180deg,
    rgba(255,255,255,0.05),
    rgba(255,255,255,0.02)
  ), #2f475c;

  color: var(--text-primary);
  font-size: 13px;

  cursor: pointer;
  transition: all .15s ease;
}

.corner-toggle:hover {
  background: #375268;
}

.corner-toggle.active {
  background: #178b2c;
}

/* =========================
   LIST
========================= */
.corner-list {
  display: block;
}

/* =========================
   DATE HEADER
========================= */
.corner-date {
  font-weight: 600;
  font-size: 13px;
  opacity: 0.8;
  padding: 10px 4px;
}

/* =========================
   CARD
========================= */
.corner-card {
  background: var(--bg-card2);
  border-radius: 12px;
  margin-bottom: 10px;
  overflow: hidden;
}

/* header */
.corner-card-title {
  padding: 10px 12px;
  font-size: 12px;
  cursor: pointer;

  display: flex;
  gap: 8px;
  align-items: center;
}

.corner-time {
  opacity: 0.6;
  font-size: 12px;
}

/* =========================
   TABLE
========================= */
.corner-table {
      width: 100%;
    border-collapse: separate;
    border-spacing: 2px;
}

.corner-table th {
  font-size: 12px;
  opacity: 0.7;
  padding: 8px 6px;
}

.corner-table td {
  text-align: center;
  font-size: 12px;
}


/* =========================
   TEAM CELLS
========================= */
.corner-table td.tbld {
  font-weight: 700;
}

.corner-table td.crn-home.selected {
  background: rgba(var(--bg-home),1);color: #fff;
}

.corner-table td.crn-away.selected {
  background: rgba(var(--bg-away),1);color: #fff;
}

/* =========================
   ODDS
========================= */
.corner-odd {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 52px;
  height: 32px;

  padding: 0 8px;
  border-radius: 8px;

  background: linear-gradient(
    180deg,
    rgba(75,227,190,0.9),
    rgba(75,227,190,0.7)
  );

  color: #000;
  font-weight: 600;

  cursor: pointer;
  transition: all .15s ease;
}

.corner-odd:hover {
  transform: scale(1.05);
}

/* =========================
   STATES
========================= */
.corner-state {
  padding: 20px;
  text-align: center;
  opacity: 0.7;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 768px) {


  .corner-select-wrap {
    width: 100%;
  }

  .corner-select-wrap select {
    width: 100%;
  }

}

.crnrow-home td:not(.crn-oran) {background: rgba(var(--bg-home),0.2);border-radius: 6px;width: 54px;border-bottom: solid 1px rgb(var(--bg-home));}
.crnrow-away td:not(.crn-oran) {background: rgba(var(--bg-away),0.2);border-radius: 6px;width: 54px;border-bottom: solid 1px rgb(var(--bg-away));}
td.vmid.tac.crn-oran {width: 90px;}
td.vmid.tac.crn-oran .odd {margin: 4px;flex:0 0 55px;width: 55px;font-size: 12px;}
td.vmid.tac.sbgs {width: 20px;background: none;border-color:transparent;}