.legacy-table-card {
  display: none !important;
}

.desktop-local-controls {
  display: contents;
}

.desktop-local-btn,
.desktop-search button,
.desktop-menu-panel button {
  height: 32px;
  border: 1px solid #28394b;
  border-radius: 5px;
  background: #172230;
  color: #eaf2fa;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.desktop-local-btn {
  min-width: 54px;
  padding: 0 8px;
}

.desktop-local-menu {
  position: relative;
}

.desktop-local-menu > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  list-style: none;
}

.desktop-local-menu > summary::-webkit-details-marker {
  display: none;
}

.desktop-menu-panel {
  position: absolute;
  z-index: 180;
  top: calc(100% + 5px);
  left: 0;
  min-width: 250px;
  padding: 8px;
  border: 1px solid #31475c;
  border-radius: 7px;
  background: #0c141c;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .45);
}

.settings-panel {
  width: min(380px, calc(100vw - 24px)) !important;
  max-height: calc(100vh - 24px);
  overflow-y: auto;
}

.desktop-settings-match-display {
  display: grid;
  gap: 7px;
  margin-top: 3px;
  padding-top: 9px;
  border-top: 1px solid #26384a;
}

.desktop-settings-title {
  color: #9eb6c9;
  font-size: 12px;
  font-weight: 700;
}

.settings-embedded-menu {
  width: 100%;
}

.settings-embedded-menu > summary {
  width: 100%;
}

.settings-embedded-menu .desktop-menu-panel {
  position: static;
  width: 100%;
  min-width: 0;
  margin-top: 6px;
  box-shadow: none;
}

.bookmaker-panel {
  width: 270px;
}

.bookmaker-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  margin-bottom: 6px;
}

.bookmaker-pair label {
  color: #8fa3b8;
  font-size: 10px;
}

.bookmaker-detail-fields {
  display: grid;
  gap: 6px;
  margin-top: 7px;
  padding-top: 7px;
  border-top: 1px solid #334155;
}

.bookmaker-detail-fields label {
  color: #8fa3b8;
  font-size: 10px;
}

.bookmaker-pair select {
  display: block;
  width: 100%;
  height: 26px;
  margin-top: 2px;
  border: 1px solid #33485c;
  border-radius: 4px;
  background: #101b25;
  color: #edf6ff;
  font-size: 11px;
}

.bookmaker-detail-fields select {
  display: block;
  width: 100%;
  height: 26px;
  margin-top: 2px;
  border: 1px solid #33485c;
  border-radius: 4px;
  background: #101b25;
  color: #edf6ff;
  font-size: 11px;
}

.bookmaker-actions,
.events-actions {
  display: flex;
  gap: 6px;
  margin-top: 8px;
}

.bookmaker-actions button,
.events-actions button {
  flex: 1;
}

.bookmaker-actions [data-bookmaker-apply] {
  border-color: #c21872;
  background: #c21872;
  color: #fff;
}

.events-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 8px;
  max-height: 260px;
  margin-top: 7px;
  overflow: auto;
}

.events-list label {
  display: flex;
  min-width: 0;
  align-items: center;
  color: #c9d8e6;
  font-size: 11px;
}

.events-list span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.desktop-search {
  display: flex;
  width: 96px;
  height: 32px;
}

.desktop-search input {
  width: 66px;
  min-width: 0;
  border: 1px solid #28394b;
  border-right: 0;
  border-radius: 5px 0 0 5px;
  background: #0d1620;
  color: #fff;
  padding: 0 6px;
  font-size: 11px;
}

.desktop-search button {
  width: 30px;
  border-radius: 0 5px 5px 0;
}

.mobile-odds-toggle {
  display: none;
}

.desktop-match-card {
  background: #080808;
}

.desktop-table-wrap {
  max-height: calc(100vh - 105px);
  overflow: auto !important;
}

.match-overview-table {
  width: max-content !important;
  min-width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 12px;
}

.match-overview-table th,
.match-overview-table td {
  box-sizing: border-box;
  padding: 5px 3px;
  border-right: 1px solid #1f1f1f;
  border-bottom: 1px solid #1f1f1f;
  text-align: center;
  white-space: nowrap;
}

.match-overview-table th {
  position: sticky;
  z-index: 5;
  top: 0;
  height: 38px;
  background: #181818;
  color: #f7f7f7;
}

.match-overview-table tbody tr:nth-child(2n) {
  background: #0f0f0f;
}

.match-overview-table tbody tr:hover {
  background: rgba(80, 80, 80, .48);
}

.match-overview-table .col-seq { width: 28px; min-width: 28px; }
.match-overview-table .col-time { width: 84px; min-width: 84px; }
.match-overview-table .col-league { width: 70px; min-width: 70px; max-width: 70px; }
.match-overview-table .col-status { width: 38px; min-width: 38px; }
.match-overview-table .col-home,
.match-overview-table .col-away { width: 105px; min-width: 105px; max-width: 105px; }
.match-overview-table .col-score { width: 44px; min-width: 44px; }
.match-overview-table .col-euro-summary { width: 145px; min-width: 145px; }
.match-overview-table .col-ya-pan { width: 140px; min-width: 140px; }
.match-overview-table .col-da-pan { width: 135px; min-width: 135px; }
.match-overview-table .col-btts { width: 125px; min-width: 125px; }
.match-overview-table .col-correct-score { width: 300px; min-width: 300px; }
.match-overview-table .col-ex-total-volume { width: 125px; min-width: 125px; }
.match-overview-table .col-history { width: 54px; min-width: 54px; }
.match-overview-table .col-trigger { width: 68px; min-width: 68px; max-width: 68px; }
.match-overview-table .col-detail { width: 50px; min-width: 50px; }

.compact-primary {
  overflow: hidden;
  color: #f4f7fb;
  font-size: 12px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-secondary {
  overflow: hidden;
  color: #f4f7fb;
  font-size: 12px;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.compact-strong {
  color: #ffd166;
  font-weight: 700;
}

.compact-market-label {
  color: #6fb7ff;
  text-align: left;
}

.market-flat-line,
.market-triplet-line {
  overflow: hidden;
  text-align: left;
}

.market-flat-line {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
}

.market-triplet-line {
  display: grid;
  grid-template-columns: 34px minmax(26px, 1fr) 38px minmax(26px, 1fr);
  column-gap: 2px;
}

.market-triplet-line .market-odd {
  color: #f4f7fb;
  text-align: right;
}

.market-triplet-line .market-handicap-value {
  color: #ffd34e;
  font-weight: 700;
  text-align: center;
}

.market-phase {
  color: #647b90;
  font-size: 9px;
}

.desktop-red-card {
  display: inline-block;
  min-width: 13px;
  height: 15px;
  margin-left: 3px;
  border-radius: 2px;
  background: #dc2626;
  color: #fff;
  font-size: 9px;
  font-weight: 800;
  line-height: 15px;
  text-align: center;
}

.match-overview-table td.live-score {
  background: #df58b8 !important;
  color: #170611;
  font-weight: 800;
}

.score-head,
.score-grid-line,
.score-detail-head {
  display: grid;
  grid-template-columns: 34px repeat(9, minmax(0, 1fr));
  align-items: center;
  column-gap: 2px;
  font-size: 10px;
}

.score-grid-line span,
.score-head span,
.score-detail-head span {
  overflow: hidden;
  text-align: center;
  text-overflow: ellipsis;
}

.score-detail-head {
  grid-template-columns: 34px repeat(9, minmax(0, 1fr));
  margin-bottom: 4px;
  color: #7890a4;
}

.score-detail-head::before {
  content: "";
}

.history-head {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
}

.history-head button,
.desktop-history-badge {
  min-width: 0;
  height: 20px;
  padding: 0 3px;
  border: 1px solid #2d5f72;
  border-radius: 3px;
  background: #102a33;
  color: #7fffd4;
  cursor: pointer;
  font-size: 10px;
}

.history-head button.active,
.desktop-history-badge.expanded {
  background: #23718a;
  color: #fff;
}

.history-time-label {
  color: #72b7ff;
  font-size: 9px;
}

.desktop-history-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
}

.desktop-history-copy {
  width: 18px;
  height: 20px;
  padding: 0;
  border: 1px solid #246d78;
  border-radius: 3px;
  background: #0d3239;
  color: #71e6ef;
  cursor: pointer;
  font-size: 10px;
}

.desktop-history-copy.copied {
  background: #187c55;
  color: #fff;
}

.desktop-history-row {
  background: #101a22 !important;
  opacity: .94;
}

.history-loading {
  padding: 12px !important;
  color: #8fa3b8;
}

.match-detail-toggle {
  min-width: 42px;
  height: 24px;
  padding: 0 5px;
  border: 1px solid #2f6f9f;
  border-radius: 4px;
  background: #102a3d;
  color: #8ed0ff;
  cursor: pointer;
  font-size: 10px;
}

.match-detail-toggle[aria-expanded="true"] {
  background: #2f6f9f;
  color: #fff;
}

.match-detail-row > td.match-detail-cell {
  padding: 8px !important;
  border-top: 1px solid #23506d;
  border-bottom: 1px solid #23506d;
  background: #080d12;
  text-align: left;
}

.match-detail-shell {
  width: min(1180px, calc(100vw - 34px));
  min-width: 720px;
  margin: 0 auto;
  color: #dce7f2;
}

.match-detail-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 8px;
}

.detail-history-summary {
  margin-bottom: 6px;
  padding: 5px 8px;
  border: 1px solid #29465f;
  border-radius: 4px;
  background: #0d1b27;
  color: #9ad1ff;
  font-size: 11px;
  text-align: left;
}

.detail-copy-all {
  margin-left: 8px;
  padding: 1px 7px;
  border: 1px solid #2d5f72;
  border-radius: 4px;
  background: #102a33;
  color: #7fffd4;
  font-size: 11px;
  cursor: pointer;
}

.detail-copy-all.copied {
  border-color: #36d399;
  color: #36d399;
}

.match-detail-tab {
  height: 26px;
  padding: 0 10px;
  border: 1px solid #2c4b63;
  border-radius: 4px;
  background: #101a23;
  color: #9eb6c9;
  cursor: pointer;
  font-size: 11px;
}

.match-detail-tab.active {
  border-color: #3185bd;
  background: #174464;
  color: #fff;
}

.match-detail-panel {
  display: none;
}

.match-detail-panel.active {
  display: block;
}

.match-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.match-detail-grid.detail-single-grid {
  grid-template-columns: minmax(0, 1fr);
}

.match-detail-grid.market-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.match-detail-card {
  min-width: 0;
  padding: 8px;
  border: 1px solid #22394a;
  border-radius: 6px;
  background: #0d151c;
}

.match-detail-card.detail-wide {
  grid-column: 1 / -1;
}

.match-detail-card-title {
  margin-bottom: 6px;
  color: #7fc9ff;
  font-size: 13px;
  font-weight: 700;
}

.match-detail-card-subtitle {
  color: #8194a5;
  font-size: 10px;
  font-weight: 400;
}

.match-detail-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
  border-collapse: collapse;
}

.match-detail-table th,
.match-detail-table td {
  position: static !important;
  display: table-cell !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  padding: 4px 6px !important;
  border: 1px solid #1f3443;
  background: transparent;
  font-size: 11px;
  text-align: center;
  white-space: normal;
}

.match-detail-table th {
  background: #111f2a;
  color: #9ec5df;
}

.match-detail-table td:first-child {
  color: #8fa3b8;
  text-align: left;
}

.match-detail-empty,
.detail-kv {
  color: #8194a5;
  font-size: 11px;
  line-height: 1.5;
}

.detail-kv {
  margin-top: 5px;
}

.detail-wrap {
  white-space: normal;
}

@media (min-width: 901px) {
  .toolbar {
    min-height: 118px;
    align-content: flex-start;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    padding: 6px;
    overflow: hidden;
  }

  .toolbar button,
  .toolbar .auto-refresh-minutes,
  .toolbar .stat {
    height: 32px;
  }

  .toolbar button {
    padding-right: 8px;
    padding-left: 8px;
  }

  .toolbar .stat {
    min-width: 58px;
    padding: 0 6px;
  }

  .toolbar #autoRefreshCountdown {
    display: none;
  }

  .toolbar #loadStatus {
    order: 50;
    flex: 1 1 250px;
  }

  .toolbar .auth-panel {
    order: 51;
  }
}

@media (max-width: 900px) {
  .desktop-local-controls .desktop-local-menu,
  .desktop-search {
    display: none;
  }

  .mobile-odds-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .desktop-table-wrap {
    max-height: calc(100vh - 240px);
    overflow: auto !important;
  }

  .match-overview-table .market-column {
    display: none !important;
  }

  html.mobile-odds-expanded .match-overview-table .market-column {
    display: table-cell !important;
  }

  .match-overview-table .col-time { width: 74px; min-width: 74px; }
  .match-overview-table .col-league { width: 54px; min-width: 54px; max-width: 54px; }
  .match-overview-table .col-home,
  .match-overview-table .col-away { width: 88px; min-width: 88px; max-width: 88px; }

  .match-detail-shell {
    width: 100%;
    min-width: 0;
  }

  .match-detail-grid,
  .match-detail-grid.market-grid {
    grid-template-columns: 1fr;
  }
}
