/* Kopi af tennissportens tournaments/tournaments-overview.css (tennis-data-hub-pluginet, 11. nov 2026), farvet med
   badmintonpeoples turkis. Tilføjelser for badminton (niveaumærke, niveaufarver, sektion) står nederst. */
/* ============================================================
   Tennis Data Hub — Turneringsoversigt CSS
   Fil: tournaments-overview.css
   Loades kun på sider der bruger [tennis_t_oversigt]-shortcoden.

   Genbruger CSS-tokens fra tdh_shared_css i tennis-data-hub.php:
     --bg, --bg-card, --bg-card-alt, --border, --border-light,
     --text, --text-dim, --text-muted, --primary, --primary-light,
     --primary-mid, --red, --gold

   Navngivning: alle klasser bruger præfikset .tdh-ov- (overview)
   for at undgå kollision med eksisterende .tdh- klasser.
   ============================================================ */

/* ── Wrapper ────────────────────────────────────────────────── */
.tdh-ov-wrap {
  max-width: 1200px;
  margin: 0 auto;
  font-family: 'Roboto Condensed', Arial, sans-serif;
  color: var(--text, #1a1a1a);
}

/* ── Tour-tabs (Herrer / Kvinder) ───────────────────────────── */
.tdh-ov-tour-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  margin-bottom: 24px;
  border-bottom: 2px solid var(--border, #e2dfd8);
}

.tdh-ov-tour-tab {
  background: transparent;
  border: 0;
  border-bottom: 3px solid transparent;
  padding: 16px 12px;
  font-family: inherit;
  font-size: 20px;
  font-weight: 700;
  color: var(--text-muted, #9b9790);
  cursor: pointer;
  transition: all 0.15s ease;
  margin-bottom: -2px;
  letter-spacing: 0.3px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.tdh-ov-tour-tab:hover {
  color: var(--text-dim, #5c5a55);
  background: var(--bg-card-alt, #f3f1ed);
}

.tdh-ov-tour-tab.active {
  color: var(--primary, #015322);
  border-bottom-color: var(--primary, #015322);
}

.tdh-ov-tour-tab-sub {
  font-weight: 400;
  font-size: 13px;
  color: var(--text-muted, #9b9790);
}

.tdh-ov-tour-tab.active .tdh-ov-tour-tab-sub {
  color: var(--text-dim, #5c5a55);
}

/* ── Tour-paneler ───────────────────────────────────────────── */
.tdh-ov-tour-panel { display: none; }
.tdh-ov-tour-panel.active { display: block; }

/* ── Kontrolbjælke (tidsfilter + søgning) ───────────────────── */
.tdh-ov-controls {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

/* Desktop: venstre (tidsfilter) = 50%, højre (søgefelt) = 50%. */
.tdh-ov-controls-left  { flex: 1 1 0; }
.tdh-ov-controls-right { flex: 1 1 0; margin-left: 0; }

/* Tidsfilter-knapper (Igangværende & kommende / Alle) */
.tdh-ov-filter-tabs {
  display: flex;            /* fylder hele controls-left */
  width: 100%;
  background: var(--bg-card-alt, #f3f1ed);
  border: 1px solid var(--border, #e2dfd8);
  border-radius: 8px;
  padding: 4px;
  gap: 2px;
}

.tdh-ov-filter-btn {
  flex: 1;                  /* hver knap = halvdelen af tabs */
  font-family: inherit;
  font-size: 16px;
  font-weight: 600;
  padding: 8px 16px;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: var(--text-dim, #5c5a55);
  cursor: pointer;
  transition: all 0.15s ease;
  white-space: nowrap;
}

.tdh-ov-filter-btn:hover { color: var(--primary, #015322); }
.tdh-ov-filter-btn.active {
  background: var(--primary, #015322);
  color: #fff;
}
.tdh-ov-filter-btn.active:hover { color: #fff; }

/* ── Søgefelt ───────────────────────────────────────────────── */
.tdh-ov-search-wrap {
  position: relative;
  width: 100%;
}

.tdh-ov-search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--text-muted, #9b9790);
  pointer-events: none;
}

.tdh-ov-search {
  width: 100%;
  padding: 9px 14px 9px 36px;
  font-family: inherit;
  font-size: 14px;
  border: 1px solid var(--border, #e2dfd8);
  border-radius: 8px;
  background: var(--bg-card, #fff);
  color: var(--text, #1a1a1a);
  outline: none;
  transition: border-color 0.15s;
  -webkit-appearance: none;
}

.tdh-ov-search:focus {
  border-color: var(--primary, #015322);
}

.tdh-ov-search::placeholder { color: var(--text-muted, #9b9790); }

/* Fjern standard clear-knap i IE/Edge */
.tdh-ov-search::-ms-clear { display: none; }

/* ── Månedsgrupperinger ─────────────────────────────────────── */
.tdh-ov-month-group { margin-bottom: 16px; }

.tdh-ov-month-header {
  display: flex;
  align-items: center;
  padding: 14px 4px 10px;
  border-bottom: 1px solid var(--border-light, #ece9e3);
  margin-bottom: 14px;
}

.tdh-ov-month-title {
  display: inline;   /* h2 er block by default — inline holder count på samme linje */
  font-size: 19px;
  font-weight: 700;
  color: var(--text, #1a1a1a);
  margin: 0;
  padding: 0;        /* Divi sætter padding-bottom: 10px på alle h2 */
  line-height: inherit;
}

.tdh-ov-month-count {
  color: var(--text-muted, #9b9790);
  font-weight: 400;
  font-size: 15px;
  margin-left: 8px;
}

.tdh-ov-month-body {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ── Turnerings-kort (desktop grid) ─────────────────────────── */
/* 6 kolonner: logo | navn+meta | underlag | præmie | deltagere | knap */
.tdh-ov-card {
  display: grid;
  grid-template-columns: 130px 1fr 110px 110px 110px 140px;
  align-items: center;
  column-gap: 28px;
  background: #F4F4F4;
  border: 1px solid var(--border, #e2dfd8);
  border-radius: 8px;
  padding: 18px 22px;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.tdh-ov-card:hover {
  border-color: var(--primary-mid, rgba(1,83,34,0.15));
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.tdh-ov-card.is-past {
  opacity: 0.78;
  background: var(--bg-card-alt, #f3f1ed);
}

/* Wrapper-divs er display:contents på desktop — børn arver grid-position */
.tdh-ov-header-row,
.tdh-ov-stats-row {
  display: contents;
}

/* ── Logo ────────────────────────────────────────────────────── */
.tdh-ov-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
}

.tdh-ov-logo img {
  max-height: 56px;
  max-width: 120px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.tdh-ov-logo-fallback {
  width: 56px;
  height: 56px;
  border-radius: 8px;
  background: var(--primary-light, rgba(1,83,34,0.08));
  color: var(--primary, #015322);
  font-size: 18px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 1px;
  border: 1px solid var(--primary-mid, rgba(1,83,34,0.15));
}

/* ── Turneringsnavn + meta ───────────────────────────────────── */
.tdh-ov-info { min-width: 0; }

.tdh-ov-name {
  font-size: 22px !important;
  font-weight: 700;
  color: var(--text, #1a1a1a);
  margin: 0 0 3px !important;
  padding: 0 !important;        /* Divi sætter padding-bottom: 10px på alle h3 */
  line-height: 1.25;
}

.tdh-ov-meta {
  font-size: 14px;
  color: var(--text-dim, #5c5a55);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

.tdh-ov-meta img {
  width: 20px;
  height: 14px;
  border-radius: 2px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.05);
  vertical-align: middle;
  flex-shrink: 0;
}

.tdh-sep {
  color: var(--text-muted, #9b9790);
  margin: 0 4px;
}

/* ── Underlag-kolonne ────────────────────────────────────────── */
.tdh-ov-surface-col {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 56px;
}

.tdh-ov-surface-bar {
  width: 4px;
  align-self: stretch;
  border-radius: 2px;
  flex-shrink: 0;
}

.tdh-ov-surface-bar.hard  { background: #1d4ed8; }
.tdh-ov-surface-bar.clay  { background: #c2410c; }
.tdh-ov-surface-bar.grass { background: var(--primary, #015322); }

.tdh-ov-surface-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.tdh-ov-surface-name {
  font-size: 18px;
  font-weight: 700;
  color: var(--text, #1a1a1a);
}

.tdh-ov-surface-sub {
  font-size: 16px;
  color: var(--text-dim, #5c5a55);
  margin-top: 2px;
}

/* ── Præmiesum ───────────────────────────────────────────────── */
.tdh-ov-prize {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  line-height: 1.2;
  min-height: 56px;
}

.tdh-ov-prize-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--text, #1a1a1a);
  white-space: nowrap;
  line-height: 1.2;
}

.tdh-ov-prize-label {
  font-size: 16px;
  color: var(--text-dim, #5c5a55);
  font-weight: 400;
  margin-top: 2px;
}

/* ── Deltagere ───────────────────────────────────────────────── */
.tdh-ov-stats {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.tdh-ov-participants {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  line-height: 1.2;
  min-height: 56px;
  justify-content: center;
}

.tdh-ov-participants-value {
  font-size: 18px;
  font-weight: 700;
  color: var(--text, #1a1a1a);
  line-height: 1.2;
}

.tdh-ov-participants-label {
  font-size: 16px;
  color: var(--text-dim, #5c5a55);
  font-weight: 400;
  margin-top: 2px;
}

/* ── Handlingsknap ───────────────────────────────────────────── */
.tdh-ov-action {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.tdh-ov-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--primary, #015322);
  color: #fff;
  border: 1px solid var(--primary, #015322);
  padding: 10px 18px;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.15s ease;
  white-space: nowrap;
  font-family: inherit;
  cursor: pointer;
}

.tdh-ov-btn:hover {
  background: #0f5c5c;
  border-color: #0f5c5c;
  color: #fff;
  text-decoration: none;
}

.tdh-ov-btn.is-past {
  background: transparent;
  color: var(--text-dim, #5c5a55);
  border-color: var(--border, #e2dfd8);
}

.tdh-ov-btn.is-past:hover {
  background: var(--bg-card, #fff);
  border-color: var(--primary, #015322);
  color: var(--primary, #015322);
}

.tdh-ov-btn.is-disabled {
  background: transparent;
  color: var(--text-muted, #9b9790);
  border-color: var(--border-light, #ece9e3);
  cursor: default;
}

.tdh-ov-btn-arrow {
  font-size: 16px;
  line-height: 1;
}

/* ── "Ingen resultater"-besked ───────────────────────────────── */
.tdh-ov-no-results {
  padding: 40px 20px;
  text-align: center;
  color: var(--text-dim, #5c5a55);
  font-size: 16px;
}

.tdh-ov-clear-filters {
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  color: var(--primary, #015322);
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
  margin-left: 4px;
}

/* ── Mobil ───────────────────────────────────────────────────── */
@media (max-width: 768px) {

  .tdh-ov-tour-tab {
    font-size: 17px;
    padding: 13px 8px;
  }

  .tdh-ov-tour-tab-sub {
    font-size: 12px;
  }

  .tdh-ov-controls {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .tdh-ov-controls-left {
    flex: 0 0 auto;        /* nulstil desktop's 25%-bredde — i column-flex bliver flex-basis til højde */
  }

  .tdh-ov-controls-right {
    flex: 0 0 auto;        /* nulstil desktop's 50%-bredde — samme grund */
    max-width: 100%;
    margin-left: 0;
  }

  .tdh-ov-filter-tabs {
    width: 100%;
    justify-content: center;
  }

  .tdh-ov-filter-btn {
    flex: 1;
    text-align: center;
    font-size: 15px;
    padding: 8px 10px;
  }

  .tdh-ov-month-title { font-size: 17px; margin: 0; padding: 0; }

  /* ── Mobil-kort: display:block i stedet for grid ── */
  .tdh-ov-card {
    display: block;
    padding: 12px 16px;
  }

  /* Header-row: søjle-layout skjules, vi viser det som block */
  .tdh-ov-header-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 0;
  }

  /* Logo skjules i header-row — flyttes til stats-rækken via JS */
  .tdh-ov-logo { display: none; }

  .tdh-ov-info { width: 100%; }

  .tdh-ov-name {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25;
    margin: 0 0 2px !important;
    padding: 0 !important;
    text-align: center;
    width: 100%;
  }

  .tdh-ov-meta {
    font-size: 13px;
    margin-bottom: 8px;
    justify-content: center;
    width: 100%;
  }

  /* Stats-rækken: 4 celler i en flex-række */
  .tdh-ov-stats-row {
    display: flex;
    gap: 0;
    padding: 10px 0;
    border-top: 1px solid var(--border-light, #ece9e3);
    border-bottom: 1px solid var(--border-light, #ece9e3);
    margin-bottom: 12px;
  }

  /* Logo i stats-rækken (vist via JS) */
  .tdh-ov-stats-row .tdh-ov-logo {
    display: flex;
    flex: 1;
    align-items: center;
    justify-content: center;
    border-right: 1px solid var(--border-light, #ece9e3);
    padding: 0 6px;
    min-width: 0;
    height: auto;
    min-height: 0;
  }

  .tdh-ov-stats-row .tdh-ov-logo img {
    height: 22px;
    width: auto;
    max-width: 100%;
    object-fit: contain;
  }

  .tdh-ov-stats-row .tdh-ov-logo .tdh-ov-logo-fallback {
    width: 32px;
    height: 32px;
    font-size: 12px;
  }

  /* De 3 stat-celler: underlag, præmie, deltagere */
  .tdh-ov-surface-col,
  .tdh-ov-prize,
  .tdh-ov-stats {
    flex: 1;
    text-align: center;
    border-right: 1px solid var(--border-light, #ece9e3);
    min-width: 0;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
  }

  .tdh-ov-prize,
  .tdh-ov-stats {
    flex-direction: column;
  }

  .tdh-ov-stats { border-right: none; }

  .tdh-ov-surface-name,
  .tdh-ov-prize-value,
  .tdh-ov-participants-value {
    font-size: 14px;
    font-weight: 700;
    display: block;
    line-height: 1.2;
  }

  .tdh-ov-surface-sub,
  .tdh-ov-prize-label,
  .tdh-ov-participants-label {
    font-size: 11px;
    color: var(--text-dim, #5c5a55);
    margin-top: 2px;
    display: block;
  }

  /* Underlag-kolonne på mobil: lodret layout, bjælken skjules */
  .tdh-ov-surface-col {
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 0;
    gap: 0;
  }

  .tdh-ov-surface-bar { display: none !important; }

  .tdh-ov-surface-text {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* Inline farvebjælke (indsættes af JS) */
  .tdh-ov-surface-bar-inline {
    display: inline-block;
    width: 3px;
    height: 13px;
    vertical-align: -2px;
    margin-right: 4px;
    border-radius: 1px;
  }

  .tdh-ov-surface-bar-inline.hard  { background: #1d4ed8; }
  .tdh-ov-surface-bar-inline.clay  { background: #c2410c; }
  .tdh-ov-surface-bar-inline.grass { background: var(--primary, #015322); }

  .tdh-ov-participants {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 0;
    min-width: 0;
  }

  /* Handlingsknap: fuld bredde */
  .tdh-ov-action { display: block; }

  .tdh-ov-btn {
    width: 100%;
    justify-content: center;
    padding: 8px 18px;
    font-size: 15px;
  }
}

/* ── Smal mobil (< 400px) ────────────────────────────────────── */
@media (max-width: 400px) {
  .tdh-ov-filter-btn { font-size: 12px; padding: 7px 8px; }
}
/* ── Badminton ───────────────────────────────────────────────── */
/* Sektionen som tennissidens Divi-sektion 2: hvid, 35 px luft, rækken 80 % / max 1200 px (mobil: 12 px i siderne). */
.bp-ov-section { background: #fff; padding: 35px 0; }
.bp-ov-section .tdh-ov-wrap {
  width: 80%; max-width: 1200px;
  --primary: #1c9090; --primary-light: rgba(28,144,144,0.08); --primary-mid: rgba(28,144,144,0.18);
  --text: #1a1a1a; --text-dim: #5c5a55; --text-muted: #9b9790; --border: #e2dfd8; --border-light: #ece9e3;
  --bg-card: #fff; --bg-card-alt: #f3f1ed;
}
@media (max-width: 767px) { .bp-ov-section .tdh-ov-wrap { width: auto; margin: 0 12px; } }
.tdh-ov-wrap button { font-family: inherit; }
.tdh-ov-name { font-family: inherit; }

/* Uden JS (og før bp-tournaments.js er kørt): kun igangværende og kommende turneringer. */
.tdh-ov-wrap:not(.bp-ov-all) .tdh-ov-card.is-past { display: none; }
.tdh-ov-wrap:not(.bp-ov-all) .tdh-ov-month-group.bp-ov-all-past { display: none; }
.tdh-ov-card.bp-ov-hide, .tdh-ov-month-group.bp-ov-hide { display: none !important; }

/* Niveaumærke i stedet for tennissens ATP/WTA-logo */
.bp-ov-badge {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 120px; height: 56px; border-radius: 8px; color: #fff; line-height: 1.05; text-align: center;
  background: var(--lv, #1c9090);
}
.bp-ov-badge span { font-size: 11px; font-weight: 700; letter-spacing: 1.2px; opacity: .9; }
.bp-ov-badge b { font-size: 22px; font-weight: 700; letter-spacing: .5px; }
.bp-ov-badge span:empty { display: none; }

/* Niveaufarver (mærket og stregen i niveaukolonnen, som tennissens underlagsfarver) */
.bp-lv-wtf   { --lv: #9a7b1c; }
/* Super-farverne er fra BWF's logoer */
.bp-lv-s1000 { --lv: #b08d57; }
.bp-lv-s750  { --lv: #8c8c8c; }
.bp-lv-s500  { --lv: #c0602a; }
.bp-lv-s300  { --lv: #1aa463; }
.bp-lv-s100  { --lv: #64748b; }
.bp-lv-champ { --lv: #b91c1c; }
.tdh-ov-surface-bar[class*="bp-lv-"], .tdh-ov-surface-bar-inline[class*="bp-lv-"] { background: var(--lv); }

@media (max-width: 768px) {
  .tdh-ov-stats-row .tdh-ov-logo .bp-ov-badge { width: auto; height: auto; padding: 4px 8px; border-radius: 4px; }
  .tdh-ov-stats-row .tdh-ov-logo .bp-ov-badge span { font-size: 8px; }
  .tdh-ov-stats-row .tdh-ov-logo .bp-ov-badge b { font-size: 13px; }
}
