.tsp-root{font:14px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Arial;color:#e6edf3;
  /* Unified "glass" look across public UI blocks (banner, sections, sponsors). */
  --tsp-glass-bg: rgba(17,24,38,.55);
  --tsp-glass-border: rgba(255,255,255,.12);
  --tsp-glass-blur: 10px;
}
.tsp-loading{padding:14px;border:1px solid #1f2a3a;border-radius:14px;background:#0b1320;color:#9fb0c0}

/* When the JS app has rendered, drop the loading placeholder box so the
   public background (e.g. grass) can remain visible around the cards. */
#tsp-app-slot.tsp-loaded{
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:inherit;
}

.tsp-wrap{max-width:1200px;margin:18px auto;padding:0 10px}

/* Public view: show the site's background (e.g. grass) also behind the lower sections.
   Some themes wrap the content area with a solid background; by inheriting the background
   image/properties we keep the same texture visible in side gutters across all sections.
*/
.tsp-view-public{
  /* Ensure the "grass" background is visible behind ALL public sections.
     Many themes render page content on a solid background which prevents the
     site-wide background image from showing in side gutters. We provide a
     lightweight grass texture fallback for the plugin area.
  */
  /* Stay inside the theme's content column so public pages keep the same
     side margins as admin views. We still paint the grass behind the plugin
     area, but we do not force full-bleed layout. */
  width: 100%;
  margin: 0;
  overflow-x: clip;

  /* Background is configurable from WP Admin (Asetukset -> Tulospalvelu).
     We keep the container transparent here and paint the chosen background
     via an inline style injected by the plugin. */
  background: transparent;

  /* Provide consistent left/right breathing room on mobile.
     The inner .tsp-wrap adds additional max-width centering. */
  padding: 18px 12px 26px;

  /* Create a stacking context so our dedicated background layer can sit
     behind the UI regardless of theme wrappers. */
  position: relative;
  min-height: 100vh;
}

/* Admin view: use the same configurable background as public view.
   We keep the layout inside the theme/content column.
*/
.tsp-view-admin{
  width: 100%;
  margin: 0;
  overflow-x: clip;
  padding: 18px 12px 26px;
  position: relative;
}
.tsp-view-admin .tsp-bg-layer{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
}
.tsp-view-admin > *{ position: relative; z-index: 1; }

/* Dedicated background layer (public view)
   - plugin scope: covers the plugin root only
   - page scope: fixed full-viewport background
*/
.tsp-view-public .tsp-bg-layer{
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.tsp-view-public.tsp-bg-scope-plugin .tsp-bg-layer{ position:absolute; }
.tsp-view-public.tsp-bg-scope-page .tsp-bg-layer{ position:fixed; }

/* Ensure all plugin UI renders above the background layer */
.tsp-view-public > *{ position: relative; z-index: 1; }
/* Leave more "grass" visible on the sides on mobile */
.tsp-view-public .tsp-wrap{padding:0 16px;background:transparent}
.tsp-top{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:12px}
.tsp-title{display:flex;flex-direction:column;gap:2px}
.tsp-title h2{margin:0;font-size:18px}
.tsp-title .sub{font-size:12px;color:#9fb0c0}

.tsp-tabs{display:flex;gap:8px;flex-wrap:wrap}
.tsp-tabs-spacer{flex:1 1 auto;min-width:8px}
.tsp-tabbtn{border:1px solid #1f2a3a;background:transparent;color:#e6edf3;padding:8px 10px;border-radius:999px;cursor:pointer}
.tsp-tabbtn.active{border-color:rgba(77,163,255,.85);box-shadow:0 0 0 2px rgba(77,163,255,.15) inset}


.tsp-tabs-actions{display:flex;gap:8px;align-items:center}
.tsp-btn-pill{border-radius:999px;padding:8px 14px}
@media(max-width:520px){.tsp-tabs-actions{width:100%;justify-content:flex-end}}
.tsp-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:980px){.tsp-grid.two{display:grid;grid-template-columns:1fr !important;gap:16px}}

.tsp-card{background:linear-gradient(180deg,#111826,#0f1724);border:1px solid #1f2a3a;border-radius:14px;padding:14px}
.tsp-card h3{margin:0 0 10px 0;font-size:14px;color:#d7e3ef}

/* Public-side "glass" cards (slightly translucent, consistent with sponsors) */
.tsp-view-public .tsp-card{
  background:var(--tsp-glass-bg);
  border:1px solid var(--tsp-glass-border);
  -webkit-backdrop-filter:blur(var(--tsp-glass-blur));
  backdrop-filter:blur(var(--tsp-glass-blur));
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}

.tsp-row{display:flex;gap:10px;flex-wrap:wrap}
.tsp-row > *{flex:1}

/* Filters row: keep the action button (e.g. Tulosta) on the same row on wide views */
.tsp-row-filters{align-items:flex-end}
.tsp-row-filters > *{flex:1 1 170px}
.tsp-row-filters .tsp-actions{flex:0 0 auto;margin-left:auto}

/* Public match list filters: give the dropdowns a bit more room (esp. team) */
#pubTeam{min-width:220px}
#pubSeries{min-width:200px}
#pubGroup{min-width:140px}
#pubStage{min-width:160px}
#pubOrder{min-width:180px}

/* Public match list filters: keep print button on the same row on wider screens */
.tsp-pub-filters{align-items:flex-end;flex-wrap:nowrap}
.tsp-pub-filters > *{flex:1 1 160px}
.tsp-pub-filters .tsp-actions{flex:0 0 auto;margin-left:auto;display:flex;align-items:flex-end}

@media (max-width: 780px){
  .tsp-pub-filters{flex-wrap:wrap}
  .tsp-pub-filters .tsp-actions{width:100%;justify-content:flex-end}
}

.tsp-label{display:block;color:#9fb0c0;font-size:12px;margin:8px 0 4px}
.tsp-input,.tsp-select,.tsp-textarea{width:100%;background:#0b1320;border:1px solid #1f2a3a;color:#e6edf3;padding:9px 10px;border-radius:10px;outline:none}
.tsp-input,.tsp-select{min-height:38px;line-height:1.2}
.tsp-textarea{min-height:90px;resize:vertical}

.tsp-btn{background:#0b1320;border:1px solid #1f2a3a;color:#e6edf3;padding:9px 12px;border-radius:10px;cursor:pointer}
.tsp-btn.primary{border-color:rgba(77,163,255,.6);background:rgba(77,163,255,.12)}
.tsp-btn.good{border-color:rgba(42,209,139,.6);background:rgba(42,209,139,.10)}
.tsp-btn.danger{border-color:#a12a2a;background:#7a1212;color:#fff;font-weight:700}
.tsp-btn.danger:hover{background:#8b1a1a}
.tsp-btn.danger:disabled{opacity:.85;color:#fff}

/*
  ADMIN-NÄKYMÄ: tumma tausta + läpikuultavat "good/danger"-napit.
  Älä pakota tummaa tekstiä näihin (se häviää tummaan taustaan).
  Julkisella/vaalealla taustalla danger-nappi saa edelleen olla tumma.
*/
.tsp-view-admin .tsp-btn.good,
.tsp-view-admin .tsp-btn.danger{color:#e6edf3 !important}
.tsp-view-admin .tsp-btn.good:disabled,
.tsp-view-admin .tsp-btn.danger:disabled{opacity:.9 !important;color:#e6edf3 !important}
.tsp-btn:disabled{opacity:.55;cursor:not-allowed}

.tsp-table{width:100%;border-collapse:collapse;margin-top:6px}
.tsp-table th,.tsp-table td{padding:8px;border-bottom:1px solid #1f2a3a;text-align:left;vertical-align:top}
.tsp-table th{color:#9fb0c0;font-size:12px;font-weight:600}
.tsp-right{text-align:right}
.tsp-center{text-align:center}

.tsp-pill{display:inline-flex;align-items:center;gap:6px;background:#0e2438;border:1px solid #1f2a3a;padding:4px 8px;border-radius:999px;color:#cfe1f2;font-size:12px}
.tsp-muted{color:#9fb0c0}
.tsp-hr{height:1px;background:#1f2a3a;margin:10px 0}
.tsp-note{font-size:12px;color:#9fb0c0;margin-top:8px}

/* Turnausinfo: shown on public view before standings */
.tsp-turnausinfo-text{font-size:14px;line-height:1.4}

/* Turnausinfo map (Google embed) */
.tsp-turnausinfo-map{margin-top:10px;border:1px solid #1f2a3a;border-radius:12px;overflow:hidden;background:#0b1320}
/*
  Public map sizing
  - Keep the map visually large also in landscape phones and desktop.
  - Use a viewport-based max to avoid overly tall embeds.
*/
.tsp-turnausinfo-iframe{width:100%;height:520px;min-height:520px;max-height:none;border:0;display:block}
/* Mobile portrait: slightly smaller to keep the page usable without excessive scrolling */
.tsp-mobile-portrait .tsp-turnausinfo-iframe{height:320px;min-height:320px;max-height:none}


.tsp-banner{border:1px solid rgba(255,204,102,.45);background:rgba(255,204,102,.06);color:#ffe6b0;border-radius:12px;padding:10px 12px;margin-bottom:12px}
.tsp-ok{border-color:rgba(42,209,139,.45);background:rgba(42,209,139,.06);color:#bff7dc}

/* Team logo */
.tsp-logo{width:18px;height:18px;border-radius:4px;object-fit:cover;border:1px solid #1f2a3a;background:#0b1320;flex:0 0 auto;display:inline-block}
.tsp-teamcell{display:flex;align-items:center;gap:8px}
.tsp-teamname{white-space:normal}

/* Desktop public match table: home team (Koti) is right-aligned and rendered as name then logo */
#tulospalvelu-root #pubMatches td.tsp-home{ text-align:right; }
#tulospalvelu-root #pubMatches td.tsp-home .tsp-teamcell{ justify-content:flex-end; }
#tulospalvelu-root #pubMatches td.tsp-home .tsp-teamname{ text-align:right; }

/* Public match list score cell: show penalty shootout score on its own line under the main score */
#tulospalvelu-root #pubMatches .tsp-scorecell{ line-height:1.2; }
#tulospalvelu-root #pubMatches .tsp-score-main{ display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap; }
#tulospalvelu-root #pubMatches .tsp-score-pen{ margin-top:2px; font-size:12px; color:#9fb0c0; }
#tulospalvelu-root #pubMatches .tsp-score-aet{ margin-top:2px; font-size:12px; color:#9fb0c0; }
#tulospalvelu-root .tsp-bracket-aet{ font-size:12px; opacity:.85; }

@media (min-width: 761px){
  .tsp-teamname{white-space:nowrap}
}


/* Tables: fit all viewports without horizontal scrolling.
   We avoid forcing a minimum width and instead let the table shrink,
   wrap long content, and reduce padding/font-size on small screens.
*/
#tulospalvelu-root .tsp-card{overflow-x:hidden}
#tulospalvelu-root .tsp-table{width:100%; table-layout:fixed; border-collapse:separate; border-spacing:0}
#tulospalvelu-root .tsp-table th,
#tulospalvelu-root .tsp-table td{white-space:normal; word-break:break-word}

/* Team names: avoid per-letter wrapping in tight columns (mobile landscape). */
#tulospalvelu-root .tsp-teamname{
  word-break: normal;
  overflow-wrap: break-word;
}

@media (max-width: 900px) and (orientation: landscape){
  /* Public matches table column sizing for mobile landscape */
  #tulospalvelu-root #pubMatches th:nth-child(1),
  #tulospalvelu-root #pubMatches td:nth-child(1){width:14%;}

  #tulospalvelu-root #pubMatches th:nth-child(2),
  #tulospalvelu-root #pubMatches td:nth-child(2){width:10%;}

  #tulospalvelu-root #pubMatches th:nth-child(3),
  #tulospalvelu-root #pubMatches td:nth-child(3){width:14%;}

  #tulospalvelu-root #pubMatches th:nth-child(4),
  #tulospalvelu-root #pubMatches td:nth-child(4){width:22%;}

  #tulospalvelu-root #pubMatches th:nth-child(5),
  #tulospalvelu-root #pubMatches td:nth-child(5){width:10%;}

  #tulospalvelu-root #pubMatches th:nth-child(6),
  #tulospalvelu-root #pubMatches td:nth-child(6){width:22%;}

  /* Ensure home/away names wrap nicely (e.g. "FC" on first line, name on second) */
  #tulospalvelu-root #pubMatches td:nth-child(4) .tsp-teamname,
  #tulospalvelu-root #pubMatches td:nth-child(6) .tsp-teamname{
    white-space: normal;
    word-break: normal;
    overflow-wrap: break-word;
  }
}

/* Prevent the whole page from getting a horizontal scrollbar */
html, body{overflow-x:hidden}

@media (max-width: 760px){
  #tulospalvelu-root .tsp-table th,
  #tulospalvelu-root .tsp-table td{padding:10px 8px;font-size:12px}
  #tulospalvelu-root .tsp-chip{font-size:12px;padding:8px 10px}
}

#tulospalvelu-root .tsp-table input.tsp-input{padding:6px 8px;border-radius:8px;}

/* Inline score entry */
#tulospalvelu-root input.tsp-score{
  width: 56px;
  min-width: 56px;
  text-align: center;
}
#tulospalvelu-root .tsp-saveRow{
  padding: 6px 10px;
}
#tulospalvelu-root .tsp-more{
  padding: 6px 10px;
  margin-left: 6px;
}

/* Team copy checklist */
.tsp-checklist{
  max-height: 220px;
  overflow: auto;
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 12px;
  padding: 10px;
  background: rgba(0,0,0,0.20);
}
.tsp-check{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 6px 4px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}
.tsp-check:last-child{ border-bottom: none; }
.tsp-check input{ width: 18px; height: 18px; }
.tsp-check img{ width: 22px; height: 22px; border-radius: 6px; object-fit: contain; background: rgba(255,255,255,0.85); }
.tsp-check span{ color: #eaf0ff; font-weight: 600; }

/* Team participation modal */
.tsp-modal{ position:fixed; inset:0; background:rgba(0,0,0,.6); display:none; align-items:center; justify-content:center; z-index:99999; }
.tsp-modal.open{ display:flex; }
.tsp-modal-card{ width:min(720px, 92vw); max-height:86vh; overflow:auto; background:rgba(10,16,26,.92); border:1px solid rgba(255,255,255,.12); border-radius:18px; padding:16px; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.tsp-modal-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:14px; flex-wrap:wrap; }
.tsp-chip{ display:inline-flex; gap:6px; align-items:center; padding:4px 10px; border-radius:999px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.12); font-size:12px; }
.tsp-chip b{ font-weight:800; }


/* Force one-column layout for Matches + Standings */
.tsp-grid.onecol{display:grid;grid-template-columns:1fr !important;gap:16px}


/* 1.4.9 responsive fixes: prevent horizontal scrolling */
#tulospalvelu-root, .tsp-wrap { overflow-x: hidden; }
.tsp-wrap * { box-sizing: border-box; }
.tsp-card, .tsp-panel { max-width: 100%; }
table.tsp-table { width: 100%; table-layout: auto; }
table.tsp-table th, table.tsp-table td { overflow-wrap: anywhere; word-break: break-word; }
input, select, textarea { max-width: 100%; min-width: 0; }

/* --- Layout overrides (latest) --- */
/* Admin: generator edit table - make Kenttä and team selects roomier */
#gEditTbl th:nth-child(3), #gEditTbl td:nth-child(3){width:180px !important} /* Kenttä */
#gEditTbl th:nth-child(4), #gEditTbl td:nth-child(4),
#gEditTbl th:nth-child(5), #gEditTbl td:nth-child(5){width:230px !important} /* Koti + Vieras */

/* gEditTbl: make date/time inputs slightly more compact (admin table) */
#gEditTbl input.tsp-input[type="date"],
#gEditTbl input.tsp-input[type="time"]{
  height: 28px;
  padding: 2px 6px;
  font-size: 13px;
}

/*
  Table readability: keep labels and values on a single line.
  Avoid horizontal scrolling by using fixed table layout + truncation.
*/
#tulospalvelu-root table.tsp-table{ table-layout: fixed; }
#tulospalvelu-root table.tsp-table th,
#tulospalvelu-root table.tsp-table td{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: normal;
  /* Prevent occasional glyph clipping on some devices/browsers */
  line-height: 1.35;
}

/* Team cell: logo + name should truncate nicely. */
#tulospalvelu-root .tsp-teamcell{ min-width: 0; }
#tulospalvelu-root .tsp-teamcell > div{ min-width: 0; }
#tulospalvelu-root .tsp-teamcell .tsp-teamname{
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/*
  Public matches list: mobile portrait readability.
  In portrait on narrow screens, hide less critical columns (Aika, Kenttä)
  so Pvm + Koti/Tulos/Vieras remain readable without horizontal scrolling.
  Landscape stays unchanged (all columns visible).
*/
/*
  NOTE: Some themes wrap/relocate the rendered table so root-based selectors may fail.
  Use a robust selector (no root dependency) + !important.
  Additionally, some mobile browsers are inconsistent with orientation media queries,
  so we provide a max-width fallback.
*/
@media (max-width: 900px) and (orientation: portrait){
  #matchesTbl th:nth-child(2),
  #matchesTbl td:nth-child(2),
  #matchesTbl th:nth-child(3),
  #matchesTbl td:nth-child(3){
    display:none !important;
  }
}

@media (max-width: 600px){
  #matchesTbl th:nth-child(2),
  #matchesTbl td:nth-child(2),
  #matchesTbl th:nth-child(3),
  #matchesTbl td:nth-child(3){
    display:none !important;
  }
}


/* JS fallback: if theme lacks viewport meta and media queries don’t trigger,
   we add a class to <html> when screen is narrow + portrait. */
html.tsp-mobile-portrait #matchesTbl th:nth-child(2),
html.tsp-mobile-portrait #matchesTbl td:nth-child(2),
html.tsp-mobile-portrait #matchesTbl th:nth-child(3),
html.tsp-mobile-portrait #matchesTbl td:nth-child(3){
  display:none !important;
}

/* Slightly smaller header text on narrow screens to reduce truncation. */
@media (max-width: 480px){
  #tulospalvelu-root table.tsp-table th,
  #tsp-app-slot table.tsp-table th{ font-size: 12px; }
  #tulospalvelu-root table.tsp-table td,
  #tsp-app-slot table.tsp-table td{ font-size: 13px; }
}



/* === Standings table (public) === */
#tblStand{width:100%;table-layout:fixed}
#tblStand th,#tblStand td{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  /* Prevent occasional glyph clipping in table cells */
  line-height: 1.35;
}
#tblStand th:nth-child(1),#tblStand td:nth-child(1){width:7%;text-align:center}
#tblStand th:nth-child(2),#tblStand td:nth-child(2){width:36%}
#tblStand th:nth-child(n+3),#tblStand td:nth-child(n+3){width:7%;text-align:center}
#tblStand th:nth-child(9),#tblStand td:nth-child(9){width:8%;font-weight:700}

#tblStand th,#tblStand td{padding-left:8px;padding-right:8px}
#tblStand td:nth-child(n+3){padding-left:4px;padding-right:4px}
#tblStand td:nth-child(2) img{max-width:26px;max-height:26px}

/* Small screens: shrink fonts a bit so team names fit better */
@media (max-width:420px){
  #tblStand th,#tblStand td{font-size:12px}
  #tblStand th:nth-child(2),#tblStand td:nth-child(2){font-size:12px}
  #tblStand td:nth-child(2) img{max-width:22px;max-height:22px}
}


/* === Admin: match tables (better field column fit + more even controls) === */
#matchesTbl, #gEditTbl{width:100%;table-layout:fixed}

/* Column sizing (admin edit table)
   - Make Pvm + Aika a bit wider so the selected values don't collapse to “:” on mobile
   - Give Kenttä enough space for readable field names
*/
#gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){width:22%} /* Pvm */
#gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){width:15%} /* Aika */
#gEditTbl th:nth-child(3), #gEditTbl td:nth-child(3){width:23%} /* Kenttä */
#gEditTbl th:nth-child(4), #gEditTbl td:nth-child(4){width:17%} /* Koti */
#gEditTbl th:nth-child(5), #gEditTbl td:nth-child(5){width:11%} /* Vieras */
#gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6){width:12%} /* Poista */

#matchesTbl th:nth-child(1), #matchesTbl td:nth-child(1){width:18%}
#matchesTbl th:nth-child(2), #matchesTbl td:nth-child(2){width:15%}
#matchesTbl th:nth-child(3), #matchesTbl td:nth-child(3){width:17%}

/* Admin: Pvm/Aika kentät – parannetaan kosketettavuutta */
#matchesTbl td:nth-child(1) select,
#matchesTbl td:nth-child(1) input {
  min-width: 140px;
}
#matchesTbl td:nth-child(2) select,
#matchesTbl td:nth-child(2) input {
  min-width: 120px;
}
#matchesTbl th:nth-child(4), #matchesTbl td:nth-child(4){width:16%}
#matchesTbl th:nth-child(5), #matchesTbl td:nth-child(5){width:7%}
#matchesTbl th:nth-child(6), #matchesTbl td:nth-child(6){width:15%}
#matchesTbl th:nth-child(7), #matchesTbl td:nth-child(7){width:12%}

/* Widen date/time controls slightly (admin + responsive tables) */
#matchesTbl td:nth-child(1) select,
#matchesTbl td:nth-child(1) input,
#matchesTbl td:nth-child(2) select,
#matchesTbl td:nth-child(2) input{
  width:100%;
  min-width:7.5em;
  box-sizing:border-box;
}

/* Allow field column to wrap (others stay truncated) */
#gEditTbl td:nth-child(3), #gEditTbl th:nth-child(3),
#matchesTbl td:nth-child(3), #matchesTbl th:nth-child(3){
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}

/* Make in-table inputs/selects more compact and consistent */
#matchesTbl .tsp-input, #matchesTbl .tsp-select,
#gEditTbl .tsp-input, #gEditTbl .tsp-select{
  padding:6px 8px;
  min-height:34px;
  font-size:12px;
  border-radius:8px;
}

@media (max-width: 480px){
  /* Prioritize Kenttä on very small screens */
  #gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){width:22%}
  #gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){width:16%}
  #gEditTbl th:nth-child(3), #gEditTbl td:nth-child(3){width:30%}

  /* Add-match table: ensure Pvm/Aika stay readable on very small screens */
  #matchesTbl th:nth-child(1), #matchesTbl td:nth-child(1){width:22%}
  #matchesTbl th:nth-child(2), #matchesTbl td:nth-child(2){width:16%}
  #matchesTbl th:nth-child(3), #matchesTbl td:nth-child(3){width:24%}
  #matchesTbl th:nth-child(7), #matchesTbl td:nth-child(7){width:14%}
}

/* Ensure date/time selects have enough room and don't shrink to a single character on mobile */
#gEditTbl td:nth-child(1) select.tsp-select,
#gEditTbl td:nth-child(2) select.tsp-select,
#matchesTbl td:nth-child(1) select,
#matchesTbl td:nth-child(2) select{
  width: 100%;
  min-width: 92px;
}

/* Add-match table: make sure the Pvm/Aika dropdowns are readable (avoid ':' and truncated dates). */
#matchesTbl td:nth-child(1) select{ min-width: 140px; }
#matchesTbl td:nth-child(2) select{ min-width: 110px; }

/* If the date/time fields are rendered as inputs (themes/plugins may alter selects), ensure they stay usable */
#matchesTbl td:nth-child(1) input,
#matchesTbl td:nth-child(2) input{
  width: 100%;
  min-width: 110px;
}

/* In the add-match table, do not ellipsize Pvm/Aika cells (otherwise selects show only ':' or truncated dates). */
#matchesTbl td:nth-child(1),
#matchesTbl td:nth-child(2){
  overflow: visible;
  text-overflow: clip;
}


/* === Public: matches table column balance ===
   - Aika column can be tighter
   - Kenttä needs more room
*/
#pubMatches{width:100%;table-layout:fixed}
#pubMatches th:nth-child(1), #pubMatches td:nth-child(1){width:13%}
#pubMatches th:nth-child(2), #pubMatches td:nth-child(2){width:8%}
#pubMatches th:nth-child(3), #pubMatches td:nth-child(3){width:18%}
#pubMatches th:nth-child(4), #pubMatches td:nth-child(4){width:18%}
#pubMatches th:nth-child(5), #pubMatches td:nth-child(5){width:10%}
#pubMatches th:nth-child(6), #pubMatches td:nth-child(6){width:18%}
#pubMatches th:nth-child(7), #pubMatches td:nth-child(7){width:15%}

/* Let Kenttä wrap (public) while keeping others nicely truncated */
#pubMatches th:nth-child(3), #pubMatches td:nth-child(3){
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}



/* --- Public hero banner (1.5.x) --- */
.tsp-hero{
  /* Keep the hero visually connected with the public cards below */
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  /* Match the rest of the public cards (Sarjataulukko / Ottelut) */
  border: 1px solid rgba(255,255,255,.08);
  background: var(--tsp-glass-bg);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  box-shadow: 0 16px 32px rgba(0,0,0,.25);
}
.tsp-hero-head{
  padding: 12px 14px 8px;
  font-weight: 700;
  letter-spacing: 0.2px;
}
.tsp-hero-stage{
  position: relative;
  padding: 8px 12px 12px;
  min-height: 118px;
}
.tsp-hero-slide{
  position:absolute;
  inset: 8px 12px 0 12px;
  transition: transform 320ms ease, opacity 320ms ease;
  will-change: transform, opacity;
}
.tsp-hero-card{
  height: 100%;
  border-radius: 16px;
  padding: 12px 12px;
  background: rgba(11,19,32,0.55);
  border: 1px solid rgba(255,255,255,.08);
}
.tsp-hero-meta{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom: 8px;
}
.tsp-hero-badge{
  display:inline-flex;
  align-items:center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid rgba(255,255,255,0.18);
  background: rgba(255,255,255,0.06);
  white-space: nowrap;
}
.tsp-hero-sub{
  font-size: 12px;
  opacity: 0.88;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* Scoreboard layout: flex is more resilient on small screens and prevents score clipping */
.tsp-hero-scoreboard{
  display:flex;
  align-items:center;
  gap: 8px;
}
.tsp-hero-team{
  display:flex;
  align-items:center;
  gap: 8px;
  min-width: 0;
  flex: 1 1 0;
}
.tsp-hero-team--right{
  justify-content:flex-end;
  text-align:right;
}
.tsp-hero-logo{
  width: 54px;
  height: 54px;
  border-radius: 10px;
  object-fit: contain;
  background: rgba(255,255,255,0.92);
  padding: 2px;
  flex: 0 0 auto;
}
.tsp-hero-logo--ph{
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 900;
  font-size: 14px;
  letter-spacing: .5px;
  color: rgba(0,0,0,0.78);
}

@media (max-width: 420px){
  .tsp-hero-logo{ width: 48px; height: 48px; border-radius: 10px; }
  .tsp-hero-score{ font-size: 20px; padding: 5px 8px; }
}
.tsp-hero-staticon{
  width: 40px;
  height: 40px;
  border-radius: 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  font-size: 18px;
  flex: 0 0 auto;
}
.tsp-hero-teamname{
  font-weight: 700;
  overflow:hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
  display: block;
  text-align: center;
}
.tsp-hero-score{
  font-size: 22px;
  font-weight: 800;
  padding: 6px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
  white-space: nowrap;
}
.tsp-hero-title{
  font-weight: 800;
  font-size: 16px;
  margin-bottom: 8px;
}
.tsp-hero-stat{
  /* Stat row should visually sit "inside" the card like the scoreboard */
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 8px;
  width: 100%;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.14);
  background: rgba(255,255,255,0.06);
}
.tsp-hero-statval{
  font-size: 18px;
  font-weight: 800;
}
/* Dots removed: cleaner banner and no overlap with content */
.tsp-hero-dots{display:none !important}

.tsp-hero-slide--active{ opacity: 1; transform: translateX(0); }
.tsp-hero-slide--next{ opacity: 0; transform: translateX(12px); }
.tsp-hero-slide--next.is-enter{ opacity: 0; transform: translateX(26px); }
.tsp-hero-slide--next.is-enter-active{ opacity: 1; transform: translateX(0); }
.tsp-hero-slide--active.is-exit{ opacity: 0; transform: translateX(-26px); }

/* Public view: keep natural "grass" gaps between sections */
#tsp-hero-slot{ margin: 14px 0 14px; }



/* --- Banner (hero) – scorecard layout (logos edges, score center) --- */
.tsp-hero {
  /* Prevent layout/scroll jumps when slides change */
  min-height: 160px;
}

.tsp-hero-card {
  padding: 0;
}

.tsp-hero-scoreboard.tsp-hero-scoreboard--match,
.tsp-hero-scoreboard.tsp-hero-scoreboard--stat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 140px;
  padding: 18px 18px;
}

.tsp-hero-scoreboard--stat {
  justify-content: center;
}

.tsp-hero-team {
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.tsp-hero-team--right .tsp-hero-teamname {
  text-align: center;
}

.tsp-hero-center {
  width: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;

  /* Do NOT clip the score pill on narrow screens */
  overflow: visible;
  padding: 0 6px;
}

.tsp-hero-logo {
  width: 64px;
  height: 64px;
  border-radius: 16px;
  object-fit: contain;
  background: rgba(255,255,255,0.92);
  padding: 10px;
  box-shadow: 0 10px 24px rgba(0,0,0,0.25);
}

.tsp-hero-logo--fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.tsp-hero-teamname {
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
  /*
    In a column flex container with align-items:center, children may become
    shrink-to-fit on wide screens. Force the name line to stretch to the team
    column width so overflow + ellipsis always works.
  */
  align-self: stretch;
  width: 100%;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tsp-hero-score {
  font-size: 52px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.tsp-hero-sub {
  font-size: 16px;
  opacity: 0.9;
  line-height: 1.15;
  text-align: center;
  max-width: 88%;
  /* Allow wrapping, but do not allow dates to break in the middle. */
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
}
.tsp-hero-date{
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow-wrap: normal !important;
  display: inline-block;
  min-width: max-content;
}

.tsp-hero-subtitle {
  font-size: 20px;
  font-weight: 800;
  text-align: center;
}

.tsp-hero-statline {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  border-radius: 16px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
}

/* Stat slides: keep title on left and value on right (prevents overlap on mobile) */
.tsp-hero-scoreboard--stat { justify-content: flex-start; }

.tsp-hero-statgrid{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.tsp-hero-stattext{
  flex: 1 1 auto;
  min-width: 0;
}

.tsp-hero-scoreboard--stat .tsp-hero-subtitle{
  text-align: left;
  margin: 0;
}

.tsp-hero-scoreboard--stat .tsp-hero-statline{
  flex: 0 0 auto;
}

@media (max-width: 520px){
  .tsp-hero-statgrid{ gap: 12px; }
  .tsp-hero-scoreboard--stat .tsp-hero-statline{ max-width: 88%; }
}


.tsp-hero-statvalue {
  font-size: 20px;
  font-weight: 800;
}

@media (max-width: 640px) {
  .tsp-hero { min-height: 150px; }
  .tsp-hero-scoreboard.tsp-hero-scoreboard--match,
  .tsp-hero-scoreboard.tsp-hero-scoreboard--stat {
    min-height: 126px;
    padding: 14px 14px;
    gap: 8px;
  }
  .tsp-hero-logo { width: 52px; height: 52px; border-radius: 14px; padding: 8px; }
  .tsp-hero-teamname { font-size: 18px; }
  .tsp-hero-score { font-size: 44px; }
  .tsp-hero-sub { font-size: 14px; }
}

/* Mobile portrait: allow long names to wrap (no ellipsis) to avoid overlaps */
@media (max-width: 520px){
  .tsp-hero-teamname,
  .tsp-hero-sub,
  .tsp-hero-subtitle{
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    max-width: 100%;
    /* Avoid "letter-by-letter" wrapping on narrow screens */
    overflow-wrap: break-word;
    word-break: normal;
  }

  /* Keep year/date on one line (prevent 20\n26) */
  .tsp-hero-date{white-space:nowrap;overflow-wrap:normal;word-break:keep-all;min-width:max-content;display:inline-block}

  /* Banner stats slide: stack title + value on mobile so the title doesn't collapse to 1–2 characters */
  .tsp-hero-scoreboard--stat{padding:14px 14px;}
  .tsp-hero-statgrid{flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;}
  .tsp-hero-stattext{width:100%;text-align:center;}
  .tsp-hero-stattext .tsp-hero-subtitle{white-space:normal;word-break:normal;overflow-wrap:anywhere;text-align:center;}
  .tsp-hero-statline{max-width:100%;}

  /* Match cards: show JA/RP badge under the main score on mobile */
  .tsp-matchcard-score-main{flex-direction:column;gap:4px}
  .tsp-matchcard-score-main .tsp-badge{margin:0 auto}

  /* Give teams more room; keep score centered */
  .tsp-hero-team{flex: 1 1 38%; min-width: 0;}
  .tsp-hero-center{flex: 0 0 24%; min-width: 0;}
  .tsp-hero-sub{font-size: 13px;}
}


/* Legacy elements (kept for backward compatibility) */
.tsp-hero-meta, .tsp-hero-badge { display: none !important; }

/* Sarjataulukon lisäasetukset: tasaa pistelokerot samalle tasolle myös kun otsikko katkeaa kahdelle riville */
.tsp-series-settings .tsp-row{align-items:flex-start}
.tsp-series-settings .tsp-row .tsp-label{display:block;min-height:2.6em;line-height:1.3}

.tsp-series-settings .tsp-row input[type="number"]{height:52px;}

/* Admin save bar (mobile-friendly) */
.tsp-savebar{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:flex-end;
  flex:1;
  flex-wrap:wrap;
}

@media (max-width: 640px){
  .tsp-savebar-row{
    position: sticky;
    bottom: 0;
    z-index: 1000;
    background: rgba(8, 14, 26, 0.95);
    padding: 10px;
    border-radius: 16px;
    box-shadow: 0 10px 24px rgba(0,0,0,0.25);
    backdrop-filter: blur(6px);
  }
  .tsp-savebar{
    justify-content: space-between;
    width: 100%;
  }
  #tspSaveBtn{
    padding: 14px 18px;
    font-size: 16px;
    border-radius: 14px;
  }
}

/* Row save feedback */
.tsp-savedflash{
  animation: tsp-savedflash 1.1s ease-out;
}

@keyframes tsp-savedflash{
  0% { background: rgba(46, 204, 113, 0.18); }
  100% { background: transparent; }
}


/* --- Playoff bracket (graphic) --- */
.tsp-playoff-bracket{
  margin:10px 0 14px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  padding:6px 2px 10px;
}
.tsp-bracket-grid{
  display:grid;
  grid-auto-flow:column;
  gap:14px;
  align-items:start;
  min-width:560px;
}
.tsp-bracket-round{min-width:220px}
.tsp-bracket-round-title{font-size:12px;color:#9fb0c0;font-weight:600;margin:0 0 8px 2px}
.tsp-bracket-round-matches{display:flex;flex-direction:column;gap:10px}
.tsp-bracket-match{
  background:#0b1320;
  border:1px solid #1f2a3a;
  border-radius:14px;
  padding:8px 10px;
  margin-bottom:0;
}
.tsp-bracket-match-meta{font-size:11px;color:#7f93a7;margin-bottom:6px}
.tsp-bracket-pen{font-size:11px;color:#7f93a7;opacity:.95;margin-left:6px}
.tsp-bracket-team{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:3px 0}
.tsp-bracket-team-left{display:flex;align-items:center;gap:8px;min-width:0}
.tsp-bracket-team-name{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tsp-bracket-team-score{font-weight:700;min-width:18px;text-align:right}
.tsp-bracket-team.win .tsp-bracket-team-name,
.tsp-bracket-team.win .tsp-bracket-team-score{color:#bff7dc}
.tsp-view-public .tsp-bracket-team.win .tsp-bracket-team-name{font-weight:700}

/* Slightly tighter bracket on small screens */
@media (max-width:760px){
  .tsp-bracket-round{min-width:200px}
  .tsp-bracket-grid{min-width:520px}
}

/* === ADMIN VIEW: background only (do not affect tables/cards) === */
.tsp-view-admin{
  background-color: #ffffff !important;
  background-image: none !important;
}

/* Hide plugin background layer in admin so only white page shows behind UI */
.tsp-view-admin .tsp-bg-layer{
  display: none !important;
}



/* Admin: make the top controls readable regardless of the page background */
.tsp-view-admin .tsp-top{
  background: linear-gradient(180deg,#111826,#0f1724);
  border: 1px solid #1f2a3a;
  border-radius: 14px;
  padding: 14px;
  margin-bottom: 8px;
}
.tsp-view-admin .tsp-title h2{ color:#e6edf3; }
.tsp-view-admin .tsp-title .sub{ color:#9fb0c0; }
.tsp-view-admin .tsp-label{ color:#9fb0c0; }

/* Admin tabs: match the primary button look (like "Tallenna") */
.tsp-view-admin .tsp-tabbtn{
  background:#0b1320;
  border:1px solid rgba(77,163,255,.6);
  color:#e6edf3;
  font-weight:700;
  padding:9px 12px;
}
.tsp-view-admin .tsp-tabbtn.active{
  box-shadow:0 0 0 2px rgba(77,163,255,.15) inset;
  border-color:rgba(77,163,255,.85);
}
/* Version badge (admin only) — removed in v1.1.2 */
.tsp-view-admin::after{
  display:none !important;
  content:"" !important;
}



/* Public view: match cards (mobile) */
.tsp-wrap .tsp-matchcards { margin-top: 8px; display:grid; grid-template-columns:1fr; gap:10px; }
.tsp-wrap .tsp-matchcards-heading {
  margin: 8px 0 2px;
  grid-column: 1 / -1;
  padding: 6px 12px;
  border-radius: 12px;
  background: rgba(108, 143, 47, 0.96);
  border: 1px solid rgba(72, 99, 26, 0.45);
  color: #ffffff;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 0.01em;
  text-align: center;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
}
.tsp-wrap .tsp-matchcard {
  border-radius: 18px;
  padding: 12px 14px;
  margin: 0;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.10);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
  color: #0f172a;
}
.tsp-wrap .tsp-matchcard-top {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  opacity: 1;
  color: #475569;
  margin-bottom: 8px;
}
.tsp-wrap .tsp-matchcard-mid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
}
.tsp-wrap .tsp-matchcard-team {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.tsp-wrap .tsp-matchcard-team.away { justify-content: flex-end; text-align: right; }
.tsp-wrap .tsp-matchcard-name {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 800;
  font-size: 14px;
  /* allow wrapping (no "...") */
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  word-break: normal;
  overflow-wrap: break-word;
  line-height: 1.15;
}

/* Palloliitto-tyylinen asemointi: nimet reunoille, logot kohti keskikohtaa */
.tsp-wrap .tsp-matchcard-team.home .tsp-matchcard-logo-box { margin-left: auto; }
.tsp-wrap .tsp-matchcard-team.away .tsp-matchcard-logo-box { margin-right: auto; }

/* Kun ruutu on kapea, annetaan nimelle hieman enemmän tilaa */
@media (max-width: 420px) {
  .tsp-wrap .tsp-matchcard-name { font-size: 13px; }
}
.tsp-wrap .tsp-matchcard-score {
  font-size: 18px;
  font-weight: 900;
  white-space: nowrap;
  text-align: center;
}
.tsp-wrap .tsp-matchcard-score-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}
.tsp-wrap .tsp-matchcard-score-badge {
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.06);
  color: rgba(15, 23, 42, 0.85);
  border: 1px solid rgba(15, 23, 42, 0.18);
}
.tsp-wrap .tsp-matchcard-score-sub {
  margin-top: 4px;
  font-size: 12px;
  font-weight: 700;
  color: rgba(15, 23, 42, 0.7);
}
.tsp-wrap .tsp-matchcard-bot {
  margin-top: 8px;
  font-size: 12px;
  opacity: 1;
  color: #475569;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
@media (min-width: 1151px) {
  .tsp-wrap .tsp-matchcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.tsp-wrap .tsp-matchcard.tsp-matchcard-full { grid-column: 1 / -1; }

/* Public view: match cards (mobile) - square logo box like banner */
.tsp-wrap .tsp-matchcard-logo-box {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #ffffff;
  /* Thin dark outline to separate logos from white match cards (same idea as standings) */
  border: 1px solid rgba(15, 23, 42, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  overflow: hidden;
}
.tsp-wrap .tsp-matchcard-logo-box img.tsp-matchcard-logo {
  width: 100%;
  height: 100%;
  max-width: 88%;
  max-height: 88%;
  object-fit: contain;
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
  display: block;
}




.tsp-results-input { display:flex; flex-direction:column; gap:10px; }
.tsp-results-card { background:#fff; border-radius:12px; padding:10px; }
.tsp-results-row { display:grid; grid-template-columns:1fr 50px 50px 1fr; gap:8px; align-items:center; }
.tsp-results-row input { text-align:center; font-size:16px; }
.tsp-results-save { margin-top:12px; padding:14px; font-size:18px; border-radius:10px; background:#2563eb; color:#fff; border:none; }

/* Admin results (mobile): result type controls */
.tsp-results-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 8px 0 2px;
}
.tsp-rt-group {
  display: inline-flex;
  gap: 6px;
  padding: 4px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.04);
  border: 1px solid rgba(15, 23, 42, 0.10);
}
.tsp-rt-btn {
  border: none;
  background: transparent;
  padding: 6px 10px;
  min-width: 58px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  color: rgba(15, 23, 42, 0.75);
  cursor: pointer;
}
.tsp-rt-btn.is-active,
.tsp-rt-btn.on,
.tsp-rt-btn.active {
  background: rgba(15, 23, 42, 0.10);
  color: rgba(15, 23, 42, 0.95);
}

.tsp-rt-btn:disabled,
.tsp-res-type-btn:disabled{
  opacity: 0.45;
  cursor: not-allowed;
}
.tsp-pen-wrap {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.tsp-pen-wrap .tsp-pen-label {
  font-size: 12px;
  font-weight: 800;
  color: rgba(15, 23, 42, 0.65);
}
.tsp-pen-wrap input.tsp-pen {
  width: 54px;
  text-align: center;
  font-size: 14px;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(15, 23, 42, 0.18);
  background: rgba(255, 255, 255, 0.85);
}

/* Admin results: mobile cards (editable) */
#resCards { margin-top: 12px; }
.tsp-res-card {
  background: #fff;
  border-radius: 14px;
  padding: 14px 16px;
  box-shadow: 0 10px 26px rgba(0,0,0,.10);
  margin: 14px 0;
}
.tsp-res-card .tsp-res-meta {
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  opacity: .85;
  margin-bottom: 8px;
}
.tsp-res-card .tsp-res-row {
  display: grid;
  grid-template-columns: 1fr auto auto auto auto 1fr;
  gap: 8px;
  align-items: center;
}
.tsp-res-team { font-weight: 700; font-size: 22px; color: #111827; }
.tsp-res-team.left { text-align: left; }
.tsp-res-team.right { text-align: right; }
.tsp-res-logo {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(17,24,39,.25);
  overflow: hidden;
}
.tsp-res-logo img { width: 100%; height: 100%; object-fit: contain; }
.tsp-res-score {
  width: 54px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(17,24,39,.25);
  font-size: 20px;
  font-weight: 800;
  text-align: center;
  outline: none;
}
.tsp-res-dash {
  font-weight: 800;
  font-size: 26px;
  color: #111827;
  opacity: .8;
  line-height: 1;
}
.tsp-res-card .tsp-res-venue {
  margin-top: 8px;
  opacity: .75;
  font-size: 18px;
}
.tsp-res-card .tsp-res-actions {
  margin-top: 12px;
  display: flex;
  justify-content: flex-end;
}
.tsp-res-save {
  border: none;
  padding: 9px 14px;
  border-radius: 10px;
  font-weight: 800;
  font-size: 14px;
  cursor: pointer;
}

/* Tulostyyppi (Jatkoaika / RP) -valinnat */
.tsp-resulttype {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 12px;
}
.tsp-type-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 56px;
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(17,24,39,.25);
  background: rgba(255,255,255,.9);
  color: #111827;
  font-weight: 800;
  font-size: 13px;
  cursor: pointer;
}
.tsp-type-btn.active {
  background: #111827;
  color: #0b1320;
  border-color: #111827;
}
.tsp-type-hint {
  margin-top: 8px;
  text-align: center;
  font-size: 12px;
  opacity: .75;
}

@media (max-width: 860px) {
  #resTbl { display: none !important; }
  #resCards { display: block; }
}
@media (min-width: 861px) {
  #resCards { display: none; }
}

/* Admin mobile results (legacy class names used by JS):
   Provide a clean card layout identical in intent to the public matchcards.
*/
.tsp-rescard {
  background: #ffffff;
  border-radius: 22px;
  padding: 18px 18px 16px;
  box-shadow: 0 10px 30px rgba(2, 6, 23, 0.12);
}
.tsp-rescard-head {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 14px;
}
.tsp-rescard-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.tsp-res-team {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
.tsp-res-home { justify-content: flex-start; }
.tsp-res-away { justify-content: flex-end; }
.tsp-res-teamname {
  font-size: 20px;
  font-weight: 800;
  color: #111827;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Team label shown under the logo in narrow/portrait views */
.tsp-res-teamlabel {
  display: none;
  margin-top: 6px;
  font-size: 12px;
  font-weight: 800;
  color: #111827;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 96px;
}
.tsp-res-score {
  display: flex;
  align-items: center;
  gap: 8px;
}
.tsp-res-input {
  width: 2.4em;
  padding: 10px 8px;
  border-radius: 12px;
  border: 1px solid #d1d5db;
  font-size: 18px;
  font-weight: 900;
  text-align: center;
}
.tsp-res-sep {
  font-size: 22px;
  font-weight: 900;
  color: #111827;
  line-height: 1;
}
.tsp-res-venue {
  margin-top: 14px;
  font-size: 16px;
  color: #6b7280;
}
.tsp-rescard button.tsp-res-save {
  margin-top: 12px;
  width: 100%;
  padding: 10px 14px;
  font-size: 14px;
  border-radius: 10px;
  background: #0b1220;
  color: #ffffff;
}


/* --- Admin mobiili: tulosten syotto korttityyli (Palloliitto-tyyppinen) --- */
.tsp-rescards .tsp-rescard-main{ padding: 18px 18px 10px; display:block; }

.tsp-rescards .tsp-res-grid{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
}

.tsp-rescards .tsp-res-side{
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-width: 0;
}

.tsp-rescards .tsp-res-home{ align-items: flex-start; }
.tsp-rescards .tsp-res-away{ align-items: flex-end; }

.tsp-rescards .tsp-res-logo-wrap{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  width: 100%;
}

/* Admin: tulosten syöttö (mobiilikortit) – sijoita joukkueen logo + nimi reunoille */
.tsp-rescards .tsp-res-home .tsp-res-logo-wrap{ align-items: flex-start; }
.tsp-rescards .tsp-res-away .tsp-res-logo-wrap{ align-items: flex-end; }
.tsp-rescards .tsp-res-teamlabel{ width: 100%; }
.tsp-rescards .tsp-res-home .tsp-res-teamlabel{ text-align: left; }
.tsp-rescards .tsp-res-away .tsp-res-teamlabel{ text-align: right; }

.tsp-rescards .tsp-res-logo-box{
  width: 56px;
  height: 56px;
  background: #fff;
  border: 1px solid rgba(15,23,42,0.25);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  flex: 0 0 auto;
}

.tsp-rescards .tsp-res-logo-box img{
  width: 86%;
  height: 86%;
  object-fit: contain;
  display: block;
}

.tsp-rescards .tsp-res-teamname{ display: none; }

.tsp-rescards .tsp-res-teamlabel{
  display: block;
  font-weight: 800;
  font-size: 12px;
  line-height: 1.15;
  color: #0f172a;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: center;
}

.tsp-rescards .tsp-res-center{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.tsp-rescards .tsp-res-scoreline{
  display: flex;
  align-items: center;
  gap: 8px;
}

.tsp-rescards .tsp-res-scoreline .tsp-res-input{
  width: 54px;
  height: 54px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,0.25);
  background: #fff;
  color: #0f172a;
  text-align: center;
  font-size: 22px;
  font-weight: 900;
  padding: 0;
}

.tsp-rescards .tsp-res-scoreline .tsp-res-sep{
  font-weight: 900;
  font-size: 22px;
  line-height: 1;
  color: #0f172a;
}

.tsp-rescards .tsp-res-type{
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: center;
}

.tsp-rescards .tsp-res-type .tsp-res-typebtn{
  width: auto;
  min-width: 46px;
  padding: 10px 14px;
  border-radius: 999px;
  font-weight: 900;
}

.tsp-rescards .tsp-res-pen{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
}

.tsp-rescards .tsp-res-pen .tsp-res-penlabel{
  font-weight: 800;
  font-size: 12px;
  color: rgba(15,23,42,0.7);
  text-align: center;
}

.tsp-rescards .tsp-res-pen .tsp-res-input{
  width: 46px;
  height: 46px;
  border-radius: 12px;
  font-size: 18px;
  font-weight: 900;
}

.tsp-rescards .tsp-res-save{
  width: 100%;
  margin-top: 14px;
  padding: 14px 16px;
  border-radius: 999px;
  font-weight: 900;
}



/* Admin (results): show team names small + initials placeholder when no logo */
@media (max-width: 900px) {
  .tsp-rescards .tsp-res-teamname{
    font-size: 12px;
    font-weight: 700;
    line-height: 1.15;
    opacity: 0.95;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .tsp-rescards .tsp-res-home .tsp-res-teamname{ text-align: left; }
  .tsp-rescards .tsp-res-away .tsp-res-teamname{ text-align: right; }

  /* Logo box: subtle border for separation */
  .tsp-rescards .tsp-res-logo-box{
    border: 1px solid rgba(15,23,42,0.25);
    background: #fff;
  }

  /* If logo missing, show initials */
  .tsp-rescards .tsp-res-logo-box:empty::after{
    content: attr(data-initials);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 14px;
    font-weight: 900;
    color: rgba(15,23,42,0.65);
  }
}



/* Admin (results): ensure team names are readable on white cards (theme may set white text globally) */
@media (max-width: 900px) {
  .tsp-rescards .tsp-rescard,
  .tsp-rescards .tsp-rescard * {
    color: #0f172a;
  }
  .tsp-rescards .tsp-res-time,
  .tsp-rescards .tsp-res-meta,
  .tsp-rescards .tsp-res-field {
    color: rgba(15, 23, 42, 0.75);
  }
}

@media (max-width: 520px) {
  /* On very narrow screens, move the team name under the logo for better recognition. */
  .tsp-rescards .tsp-res-teamname {
    display: none;
  }
  .tsp-rescards .tsp-res-logo-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
  }
  .tsp-rescards .tsp-res-teamlabel {
    display: block;
  }
}

/* Admin (table): result type (REG / JA / RP) controls */
.tsp-resulttype {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  justify-content: flex-end;
  margin-top: 8px;
}

.tsp-rt-btn {
  border: 1px solid rgba(15, 23, 42, 0.25);
  background: rgba(255, 255, 255, 0.85);
  color: rgba(15, 23, 42, 0.85);
  padding: 6px 10px;
  min-width: 58px;
  border-radius: 999px;
  font-weight: 700;
  line-height: 1;
}

.tsp-rt-btn.active {
  border-color: rgba(15, 23, 42, 0.45);
  background: rgba(15, 23, 42, 0.08);
  color: #0f172a;
}

.tsp-pen {
  display: none;
  justify-content: flex-end;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.tsp-pen label {
  font-size: 12px;
  color: rgba(15, 23, 42, 0.65);
  font-weight: 600;
}

.tsp-pen-score {
  width: 54px;
  text-align: center;
  padding: 10px 10px;
  border-radius: 12px;
  border: 1px solid rgba(15, 23, 42, 0.18);
  background: rgba(255, 255, 255, 0.9);
}

/* Admin mobile results cards: result type (JA/RP) + penalties */
.tsp-res-scoreedit{flex-direction:column;align-items:center;gap:10px;}
.tsp-res-scoreline{display:flex;align-items:center;gap:10px;}
.tsp-res-type-inline{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;}
.tsp-res-type-btn{border:1px solid rgba(0,0,0,0.2);background:#fff;border-radius:999px;padding:6px 10px;min-width:58px;font-weight:700;font-size:12px;line-height:1;cursor:pointer;}
.tsp-res-type-btn.is-active{border-color:rgba(0,0,0,0.55);box-shadow:0 0 0 2px rgba(0,0,0,0.06) inset;}
.tsp-res-pen{display:flex;align-items:center;gap:8px;justify-content:center;}
.tsp-res-pen-label{font-weight:700;font-size:12px;opacity:0.9;}
.tsp-res-pen .tsp-res-input{width:52px;}



/* === 2.8.1: compact NORM / JA / RP buttons (admin result entry) === */
.tsp-res-type-inline{gap:6px;}
.tsp-res-type-btn{
  padding:4px 8px;
  min-width:46px;
  font-size:11px;
}

@media (max-width: 520px){
  .tsp-res-type-inline{gap:5px;}
  .tsp-res-type-btn{
    padding:3px 7px;
    min-width:42px;
    font-size:10.5px;
  }
}

/* === 2.8.1: fix portrait overlap + smaller NORM / JA / RP buttons (admin result entry) === */
.tsp-rescards .tsp-res-center{min-width:0;}
.tsp-rescards .tsp-res-type-inline{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px;
  max-width:180px;
}
.tsp-rescards .tsp-res-type-inline .tsp-res-type-btn{
  padding:4px 8px !important;
  min-width:42px !important;
  font-size:11px !important;
  line-height:1 !important;
  border-radius:999px !important;
  background: rgba(15, 23, 42, 0.10) !important;
  color: rgba(15, 23, 42, 0.90) !important;
  border: 1px solid rgba(15, 23, 42, 0.18) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
.tsp-rescards .tsp-res-type-inline .tsp-res-type-btn.is-active{
  background: rgba(15, 23, 42, 0.18) !important;
  border-color: rgba(15, 23, 42, 0.28) !important;
}

@media (max-width: 520px){
  .tsp-rescards .tsp-res-type-inline{gap:5px;max-width:150px;}
  .tsp-rescards .tsp-res-type-inline .tsp-res-type-btn{
    padding:3px 7px !important;
    min-width:40px !important;
    font-size:10.5px !important;
  }
}

/* --- 2.8.1: Admin tulosten syöttö – pienempi Tallenna-nappi ja logot --- */
/* Pienennä Tallenna-nappi tuloskorteissa (mobiili/admin) */
.tsp-rescards button.tsp-res-save,
.tsp-rescard button.tsp-res-save,
button.tsp-res-save {
  padding: 8px 12px;
  font-size: 14px;
  border-radius: 10px;
}

/* Jos napin leveys on aiemmin pakotettu 100%:ksi, anna sen olla kompaktimpi */
.tsp-rescard button.tsp-res-save {
  width: auto;
  min-width: 140px;
}

/* Pienennä logoboksit tuloskorteissa */
.tsp-rescards .tsp-res-logo-box {
  width: 56px;
  height: 56px;
  border-radius: 14px;
}
.tsp-rescards .tsp-res-logo-box img {
  width: 84%;
  height: 84%;
}

/* Pienennä myös peruslogo-elementti (jos käytössä muissa admin-näkymissä) */
.tsp-res-logo {
  width: 48px;
  height: 48px;
  border-radius: 14px;
}


/* Admin: smaller and centered Save button */
.tsp-res-save,
.tsp-save-btn {
    padding: 6px 14px !important;
    font-size: 13px !important;
    margin: 12px auto 0 auto !important;
    display: block !important;
    max-width: 160px;
}


/* Admin matches table: horizontal scroll on small screens */
.tsp-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
#matchesTbl {
  min-width: 660px;
}
#matchesTbl th, #matchesTbl td {
  white-space: nowrap;
}


/* Admin: matches table column sizing (even distribution + stable selects) */
#matchesTbl {
  table-layout: fixed;
  width: 100%;
  min-width: 680px;
}
#matchesTbl th, #matchesTbl td {
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Ensure inputs/selects take the cell width */
#matchesTbl .tsp-input,
#matchesTbl select {
  width: 100% !important;
  min-width: 0 !important;
}

/* Make delete column narrow and button visible */
#matchesTbl th:last-child,
#matchesTbl td:last-child {
  width: 92px;
}
#matchesTbl td:last-child .tsp-btn {
  width: 100%;
  padding: 6px 10px !important;
  font-size: 13px !important;
}

/* Admin: matches edit table responsive scroll */
#matchesTbl{min-width:680px; table-layout:fixed; width:100%;}
#matchesTbl th,#matchesTbl td{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#matchesTbl .tsp-input,#matchesTbl select{width:100% !important; min-width:0 !important;}
#matchesTbl th:last-child,#matchesTbl td:last-child{width:92px;}


/* Admin: ensure delete buttons in matches table are visible */
#matchesTbl td:last-child { background: transparent; }
#matchesTbl td:last-child .tsp-btn { opacity: 1 !important; visibility: visible !important; }

/* Admin: ensure matches delete button column is visible */
#matchesTbl td:last-child{padding:10px !important;}


/* Admin: schedule editor table (#gEditTbl) responsive + balanced columns */
#gEditTbl {
  table-layout: fixed;
  width: 100%;
  min-width: 680px;
}
#gEditTbl th, #gEditTbl td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#gEditTbl .tsp-input, #gEditTbl .tsp-select, #gEditTbl select { width: 100% !important; min-width: 0 !important; }
#gEditTbl th:last-child, #gEditTbl td:last-child { width: 92px; }
#gEditTbl td:last-child .tsp-btn { width: 100%; }

/* Wrap tables in horizontal scroll on small screens */
.tsp-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }


/* Admin: gEditTbl - make Away (Vieras) column wider */
#gEditTbl th:nth-child(5),
#gEditTbl td:nth-child(5) {
  width: 160px;
}
/* Keep delete column narrow */
#gEditTbl th:nth-child(6),
#gEditTbl td:nth-child(6) {
  width: 120px;
}

/* Ensure horizontal scroll works when table is wider than viewport */
.tsp-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}


/* Admin: equalize Home (Koti) and Away (Vieras) column widths */
#gEditTbl th:nth-child(4),
#gEditTbl td:nth-child(4),
#gEditTbl th:nth-child(5),
#gEditTbl td:nth-child(5) {
  width: 180px;
}

/* Admin: gEditTbl fine-tuning (make Time + Delete a bit wider, Home/Away a bit narrower) */
#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2) { /* Aika */
  width: 105px !important;
}
#gEditTbl th:nth-child(4),
#gEditTbl td:nth-child(4) { /* Koti */
  width: 170px !important;
}
#gEditTbl th:nth-child(5),
#gEditTbl td:nth-child(5) { /* Vieras */
  width: 170px !important;
}
#gEditTbl th:nth-child(6),
#gEditTbl td:nth-child(6) { /* Poista */
  width: 130px !important;
}


/* Admin: gEditTbl - prioritize Pvm/Aika/Kenttä visibility, reduce team columns */
#gEditTbl th:nth-child(1),
#gEditTbl td:nth-child(1) { width: 150px; } /* Pvm */
#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2) { width: 95px; }  /* Aika */
#gEditTbl th:nth-child(3),
#gEditTbl td:nth-child(3) { width: 170px; } /* Kenttä */

/* Team columns slightly narrower to free space for left side */
#gEditTbl th:nth-child(4),
#gEditTbl td:nth-child(4),
#gEditTbl th:nth-child(5),
#gEditTbl td:nth-child(5) { width: 210px; } /* Koti + Vieras */

/* Delete column compact */
#gEditTbl th:nth-child(6),
#gEditTbl td:nth-child(6) { width: 110px; }

/* Ensure selects render readable in small cells */
#gEditTbl td:nth-child(1) .tsp-input,
#gEditTbl td:nth-child(2) .tsp-select,
#gEditTbl td:nth-child(3) .tsp-select,
#gEditTbl td:nth-child(4) .tsp-select,
#gEditTbl td:nth-child(5) .tsp-select {
  font-size: 14px;
}


/* Admin: gEditTbl compact layout for desktop fit */
#gEditTbl { table-layout: fixed; }

#gEditTbl th:nth-child(1),
#gEditTbl td:nth-child(1) { width: 120px; } /* Pvm */

#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2) { width: 80px; }  /* Aika */

#gEditTbl th:nth-child(3),
#gEditTbl td:nth-child(3) { width: 150px; } /* Kenttä */

#gEditTbl th:nth-child(4),
#gEditTbl td:nth-child(4),
#gEditTbl th:nth-child(5),
#gEditTbl td:nth-child(5) { width: 180px; } /* Koti + Vieras */

#gEditTbl th:nth-child(6),
#gEditTbl td:nth-child(6) { width: 95px; } /* Poista */

/* Prevent overflow text from stretching cells */
#gEditTbl th, 
#gEditTbl td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* Admin: slightly increase Pvm & Aika for readability (balanced) */
#gEditTbl th:nth-child(1),
#gEditTbl td:nth-child(1) { width: 135px; } /* Pvm */

#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2) { width: 90px; }  /* Aika */


/* Admin: final tweak – Aika slightly wider */
#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2) { width: 95px; }  /* Aika */


/* Admin: Results entry (desktop) – make action pills + RP/JA/NORM always visible */
@media (min-width: 768px) {
  /* If results table is inside a wrapper, enable horizontal scroll instead of clipping */
  .tsp-results-wrap,
  .tsp-res-wrap,
  .tsp-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Ensure results table can be wider than viewport without hiding columns */
  #resultsTbl,
  #tspResultsTbl,
  .tsp-results-table {
    min-width: 980px;
  }

  /* Action/status pills: smaller and wrapping */
  .tsp-res-flags,
  .tsp-res-status,
  .tsp-result-flags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    justify-content: flex-start;
  }

  .tsp-res-flag,
  .tsp-pill,
  .tsp-chip {
    padding: 4px 10px !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    border-radius: 999px !important;
    white-space: nowrap;
  }

  /* Make the "Toiminnot" column a bit wider so pills + save fit */
  th.tsp-actions,
  td.tsp-actions,
  th.tsp-toiminnot,
  td.tsp-toiminnot {
    width: 220px;
    min-width: 220px;
  }

  /* Save button compact in table */
  .tsp-res-save,
  .tsp-save-btn,
  button.tsp-save {
    padding: 6px 12px !important;
    font-size: 12.5px !important;
    max-width: 140px;
  }

  /* If RP (rankkarit) adds extra score inputs, keep them inline and compact */
  .tsp-rp-score,
  .tsp-pen-score,
  .tsp-rankkari-score {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
  }
  .tsp-rp-score input,
  .tsp-pen-score input,
  .tsp-rankkari-score input {
    width: 54px !important;
    min-width: 54px !important;
    padding: 6px 8px !important;
    font-size: 12.5px !important;
    text-align: center;
  }
}

/* Admin: prevent clipping of action buttons inside table cells */
.tsp-results-table td,
#resultsTbl td,
#tspResultsTbl td {
  overflow: visible;
}


/* Admin: gEditTbl columns (6 cols) - ensure correct mapping after header fix */
#gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1) { width: 135px; } /* Pvm */
#gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2) { width: 95px; }  /* Aika */
#gEditTbl th:nth-child(3), #gEditTbl td:nth-child(3) { width: 150px; } /* Kenttä */
#gEditTbl th:nth-child(4), #gEditTbl td:nth-child(4) { width: 180px; } /* Koti */
#gEditTbl th:nth-child(5), #gEditTbl td:nth-child(5) { width: 180px; } /* Vieras */
#gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6) { width: 95px; }  /* Poista */


/* Admin: gEditTbl delete button – ensure label visible */
#gEditTbl td:nth-child(6) .tsp-btn.danger,
#gEditTbl td:last-child .tsp-btn.danger {
  width: 100%;
  min-width: 80px;
  padding: 8px 12px;
  font-size: 14px;
  line-height: 1.1;
  color: #ffffff;
}


/* Admin: gEditTbl delete column – do not clip button label */
#gEditTbl th:nth-child(6),
#gEditTbl td:nth-child(6) {
  width: 110px !important;
  min-width: 110px !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

#gEditTbl td:nth-child(6) .tsp-btn.danger,
#gEditTbl td:last-child .tsp-btn.danger {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-width: 100px !important;
  padding: 10px 12px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #ffffff !important;
  white-space: nowrap !important;
}

/* Override global ellipsis rule for delete cell if present */
#gEditTbl td:nth-child(6),
#gEditTbl th:nth-child(6) {
  text-overflow: clip !important;
}


/* Admin: gEditTbl delete button column ensures label visible */
#gEditTbl th:nth-child(6),
#gEditTbl td:nth-child(6) {
  width: 110px !important;
  min-width: 110px !important;
  overflow: visible !important;
}
#gEditTbl td:nth-child(6) .tsp-btn.danger {
  width: 100% !important;
  min-width: 100px !important;
}


/* Admin: Results entry table (#resTbl) – actions column compact (more room for team columns) */
#resTbl th.tsp-right,
#resTbl td.tsp-right{
  min-width: 220px;
  width: 220px;
  /* Prevent action buttons from spilling over team name columns on narrow viewports */
  overflow: hidden !important;
  white-space: normal !important;
}

#resTbl td.tsp-right{
  vertical-align: middle;
}

#resTbl .tsp-btn.tsp-saveRow{
  padding: 6px 10px;
  font-size: 12px;
  max-width: 110px;
  min-width: 0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

#resTbl .tsp-resulttype{
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  justify-content: flex-end;
  margin-top: 0;
  min-width: 0;
}

/* Admin results (desktop table): keep Save + (NORM/JA/RP) on the same row */
#resTbl .tsp-actions-row{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: nowrap;
  max-width: 100%;
}

#resTbl .tsp-actions-row > .tsp-saveRow{
  flex: 0 0 auto;
}

#resTbl .tsp-actions-row > .tsp-resulttype{
  flex: 1 1 auto;
}

#resTbl .tsp-rt-btn{
  padding: 3px 7px;
  font-size: 10px;
  line-height: 1.1;
  border-radius: 999px;
  white-space: nowrap;
}

#resTbl .tsp-pen{

  margin-top: 6px;
}

/* If a global ellipsis rule exists for table cells, do not apply it to the actions column */
#resTbl td.tsp-right,
#resTbl th.tsp-right{
  text-overflow: clip !important;
}


/* Final tweak: Pvm +5px, Aika -5px (gEditTbl / schedule table) */
#gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1) { width: 140px !important; min-width: 140px !important; } /* Pvm */
#gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2) { width: 110px !important;  min-width: 110px !important; }  /* Aika */


/* Final date/time fine-tuning */
/* Pvm wider so full date fits */
#gEditTbl th:nth-child(1), 
#gEditTbl td:nth-child(1) { 
    width: 150px !important; 
    min-width: 150px !important; 
}

/* Aika narrower */
#gEditTbl th:nth-child(2), 
#gEditTbl td:nth-child(2) { 
    width: 80px !important;  
    min-width: 80px !important; 
}


/* ===== 2.8.1: Fix: previous Pvm/Aika changes targeted wrong table. ===== */
/* Reset gEditTbl to default sizing */
#gEditTbl th, 
#gEditTbl td { 
  width: auto !important; 
  min-width: unset !important; 
}

/* ===== 2.8.1: Pvm & Aika widths – BOTH relevant tables ===== */

/* 1) Tulosten syöttö / results list table */
#resTbl th:nth-child(1),
#resTbl td:nth-child(1){
  width: 175px !important;
  min-width: 175px !important;
}

#resTbl th:nth-child(2),
#resTbl td:nth-child(2){
  width: 70px !important;
  min-width: 70px !important;
}

#resTbl td:nth-child(1),
#resTbl td:nth-child(2){
  white-space: nowrap !important;
}

/* 2) Muokkaa otteluohjelmaa (valittu sarja+lohko) */
#matchEditTbl th:nth-child(1),
#matchEditTbl td:nth-child(1){
  width: 195px !important;
  min-width: 195px !important;
}

#matchEditTbl th:nth-child(2),
#matchEditTbl td:nth-child(2){
  width: 70px !important;
  min-width: 70px !important;
}

/* Controls inside date/time cells should fill the cell */
#matchEditTbl td:nth-child(1) select,
#matchEditTbl td:nth-child(1) input,
#matchEditTbl td:nth-child(2) select,
#matchEditTbl td:nth-child(2) input{
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}


/* ===== 2.8.1: Minor width tweaks (admin) ===== */

/* Tulosten syöttö: the empty spacer column after Pvm (between Pvm and Aika) narrower */
#resTbl th:nth-child(2),
#resTbl td:nth-child(2){
  width: 24px !important;
  min-width: 24px !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
}

/* Otteluohjelman muokkaus: Aika column a bit wider */
#matchEditTbl th:nth-child(2),
#matchEditTbl td:nth-child(2){
  width: 80px !important;
  min-width: 80px !important;
}


/* ===== 2.8.1 FIX: correct column directions ===== */

/* Tulosten syöttö:
   PVM aavistuksen kapeampi, AIKA leveämpi */
#resTbl th:nth-child(1),
#resTbl td:nth-child(1){
  width: 120px !important;
  min-width: 120px !important;
}

#resTbl th:nth-child(2),
#resTbl td:nth-child(2){
  width: 90px !important;
  min-width: 90px !important;
}


/* ===== 2.8.2: Desktop fixes =====
   - Tulosten syöttö (resTbl): Pvm narrower, Aika wider (do NOT shrink Aika)
   - Otteluohjelman muokkaus (matchEditTbl): Aika select slightly wider
   - Ensure result-type buttons are clickable on desktop
*/
#resTbl{
  table-layout: fixed !important;
}
#resTbl th:nth-child(1),
#resTbl td:nth-child(1){
  width: 130px !important;
  min-width: 130px !important;
  white-space: nowrap !important;
}
#resTbl th:nth-child(2),
#resTbl td:nth-child(2){
  width: 95px !important;
  min-width: 95px !important;
  white-space: nowrap !important;
}

#matchEditTbl{
  table-layout: fixed !important;
}
#matchEditTbl th:nth-child(2),
#matchEditTbl td:nth-child(2){
  width: 90px !important;
  min-width: 90px !important;
}

#resTbl .tsp-rt-btn{
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* ===== 2.9.4: Schedule generator / editor (#gEditTbl) – widen Time (Aika) column ===== */
#gEditTbl{ table-layout: fixed !important; }
#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2){
  width: 120px !important;
  min-width: 120px !important;
}
#gEditTbl td:nth-child(2) select,
#gEditTbl td:nth-child(2) .tsp-select{
  min-width: 92px !important;
}


/* ===== 2.10.8 UI FIX: Muokkaa otteluohjelmaa (valittu sarja+lohko) – ei vaakasrollia ===== */
#gEditTbl{width:100% !important; table-layout:fixed !important;}
#gEditTbl th, #gEditTbl td{white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important;}
#gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){width:12% !important;} /* Pvm */
#gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){width:10% !important;} /* Aika */
#gEditTbl th:nth-child(3), #gEditTbl td:nth-child(3){width:18% !important;} /* Kenttä */
#gEditTbl th:nth-child(4), #gEditTbl td:nth-child(4){width:24% !important;} /* Koti */
#gEditTbl th:nth-child(5), #gEditTbl td:nth-child(5){width:24% !important;} /* Vieras */
#gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6){width:12% !important;} /* Poista */

#gEditTbl .tsp-input, #gEditTbl .tsp-select, #gEditTbl select{width:100% !important; max-width:100% !important; min-width:0 !important; box-sizing:border-box !important;}

/* Poista-nappi yhtenäiseksi muiden Poista-nappien kanssa (ei kirkkaan punaista inline-tyyliä) */
#gEditTbl td:nth-child(6) .tsp-btn{width:100% !important; padding:6px 10px !important; font-size:12px !important; line-height:1.1 !important; color:inherit !important;}

/* ===== 2.10.8 FIX: Muokkaa otteluohjelmaa (valittu sarja+lohko) – pakota mahtumaan ilman vaakasrollausta ===== */
#gEditTbl{width:100% !important;table-layout:fixed !important}
#gEditTbl th,#gEditTbl td{white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important}

/* Sarakejaot (prosentteina, summa 100%) */
#gEditTbl th:nth-child(1),#gEditTbl td:nth-child(1){width:12% !important} /* Pvm */
#gEditTbl th:nth-child(2),#gEditTbl td:nth-child(2){width:12% !important} /* Aika */
#gEditTbl th:nth-child(3),#gEditTbl td:nth-child(3){width:19% !important} /* Kenttä */
#gEditTbl th:nth-child(4),#gEditTbl td:nth-child(4){width:22% !important} /* Koti */
#gEditTbl th:nth-child(5),#gEditTbl td:nth-child(5){width:22% !important} /* Vieras */
#gEditTbl th:nth-child(6),#gEditTbl td:nth-child(6){width:13% !important} /* Poista */

/* Selectit/inputit eivät saa pakottaa min-leveyttä */
#gEditTbl .tsp-input,#gEditTbl .tsp-select,#gEditTbl select{width:100% !important;max-width:100% !important;min-width:0 !important;box-sizing:border-box !important}

/* Poista-nappi saman tyyliseksi kuin muualla (ei inline-punaisia) */
#gEditTbl td:nth-child(6) .tsp-btn{width:100% !important;padding:6px 10px !important;font-size:12px !important;line-height:1.1 !important;color:inherit !important}



/* 2.10.12: Mobile admin schedule editor – ensure full date/time visible */
@media (max-width: 768px){
  /* Make Pvm and Aika wide enough to show full values (dd.mm.yyyy / hh.mm) */
  #gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){
    width: 140px !important;
    min-width: 140px !important;
    max-width: 140px !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  #gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  /* Prevent mobile browsers from truncating select text too aggressively */
  #gEditTbl td:nth-child(1) select,
  #gEditTbl td:nth-child(2) select{
    text-overflow: clip !important;
  }
}


/* ===== 2.10.14: Otteluohjelman käsinmuokkaus (gEditTbl) – Pvm näkyy kokonaan, Poista kompaktimpi ===== */
#gEditTbl{ table-layout: fixed !important; }
#gEditTbl th, #gEditTbl td{ padding:6px !important; }

@media (max-width: 600px){
  /* Mobile: make sure full dd.mm.yyyy fits */
  #gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){ width: 145px !important; min-width:145px !important; }
  #gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){ width: 90px !important;  min-width:90px !important; }
  #gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6){ width: 66px !important;  min-width:66px !important; }
}

@media (min-width: 601px){
  /* Desktop: widen Pvm slightly, keep Poista smaller to avoid truncation */
  #gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){ width: 145px !important; min-width:145px !important; }
  #gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){ width: 90px !important;  min-width:90px !important; }
  #gEditTbl th:nth-child(3), #gEditTbl td:nth-child(3){ width: 175px !important; min-width:175px !important; }
  #gEditTbl th:nth-child(4), #gEditTbl td:nth-child(4),
  #gEditTbl th:nth-child(5), #gEditTbl td:nth-child(5){ width: 200px !important; min-width:200px !important; }
  #gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6){ width: 80px !important;  min-width:80px !important; }
}

/* Smaller delete button inside schedule editor */
#gEditTbl .tsp-del-match{
  padding:5px 8px !important;
  font-size:11px !important;
  min-height:32px !important;
}



/* ===== 2.10.16: gEditTbl Poista-painike kompaktimmaksi ja Aika-sarake hieman leveämmäksi ===== */
#gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6){
  padding-left: 4px !important;
  padding-right: 4px !important;
}
#gEditTbl td:nth-child(6) .tsp-btn,
#gEditTbl td:nth-child(6) button{
  padding: 2px 6px !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  min-width: 0 !important;
}


/* === 2.10.20 fine-tune: Pvm narrower, Poista wider === */
#gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){
  width: 10% !important;
}
#gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6){
  width: 15% !important;
}

/* === 2.10.21 fine-tune: Pvm slightly wider, Koti/Vieras slightly narrower === */
#gEditTbl { table-layout: fixed; }
#gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){ width: 12% !important; } /* Pvm */
#gEditTbl th:nth-child(4), #gEditTbl td:nth-child(4){ width: 19% !important; } /* Koti */
#gEditTbl th:nth-child(5), #gEditTbl td:nth-child(5){ width: 19% !important; } /* Vieras */
#gEditTbl th:nth-child(6), #gEditTbl td:nth-child(6){ width: 17% !important; } /* Poista */

/* Keep date select readable */
#gEditTbl td:nth-child(1) select, #gEditTbl td:nth-child(1) input{
  min-width: 110px !important;
}

/* === 2.10.22 mobile fix: prevent Pvm/Aika overlap on small screens === */
@media (max-width: 640px){
  #gEditTbl { table-layout: fixed; width: 100% !important; }
  #gEditTbl td, #gEditTbl th { overflow: hidden; }
  #gEditTbl td select, #gEditTbl td input{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }
  /* Date/time: allow them to fit without bleeding into neighbor cells */
  #gEditTbl td:nth-child(1) select, #gEditTbl td:nth-child(1) input{ font-size: 14px; }
  #gEditTbl td:nth-child(2) select, #gEditTbl td:nth-child(2) input{ font-size: 14px; }
  #gEditTbl td:nth-child(1), #gEditTbl td:nth-child(2){ padding-left: 6px; padding-right: 6px; }
}

/* === 2.10.23 mobile fix v2: override min-width + allow horizontal scroll === */
@media (max-width: 640px){
  /* Make table scrollable instead of overlapping controls */
  #gEditTbl{
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  #gEditTbl thead, #gEditTbl tbody{
    display: table;
    width: 100%;
    table-layout: fixed;
  }

  /* Force enough room for date + time, and prevent any min-width from leaking */
  #gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){ width: 160px !important; } /* Pvm */
  #gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){ width: 110px !important; } /* Aika */

  #gEditTbl td:nth-child(1) select,
  #gEditTbl td:nth-child(1) input{
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  #gEditTbl td:nth-child(2) select,
  #gEditTbl td:nth-child(2) input{
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* === 2.10.30 mobile: prevent Aika from overlapping Pvm in gEditTbl === */
@media (max-width: 640px){
  /* Ensure first two columns have enough breathing room */
  #gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1){ width: 175px !important; } /* Pvm */
  #gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2){ width: 125px !important; } /* Aika */

  /* Add a small gutter between the two cells */
  #gEditTbl td:nth-child(1){ padding-right: 10px !important; }
  #gEditTbl td:nth-child(2){ padding-left: 10px !important; }

  /* Make sure controls never overflow their cell */
  #gEditTbl td:nth-child(1) select, #gEditTbl td:nth-child(2) select,
  #gEditTbl td:nth-child(1) input,  #gEditTbl td:nth-child(2) input{
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
}

/* === 2.10.31 desktop: make Pvm column a few px wider === */
@media (min-width: 641px){
  #gEditTbl th:nth-child(1),
  #gEditTbl td:nth-child(1){
    width: calc(12% + 12px) !important;
  }
}

/* === 2.10.32 desktop: Pvm a bit wider in gEditTbl === */
@media (min-width: 641px){
  #gEditTbl th:nth-child(1),
  #gEditTbl td:nth-child(1){
    width: calc(12% + 24px) !important; /* widen a few more px */
    min-width: 160px !important;       /* ensure date fits */
  }
}


/* v1.2.4: Public matches table header/columns alignment
   Force fixed table layout and consistent column widths so "Koti / Tulos / Vieras"
   line up with the corresponding cells across themes/browsers. */
.tsp-view-public #matchesTbl{
  width:100% !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
}
.tsp-view-public #matchesTbl th,
.tsp-view-public #matchesTbl td{
  box-sizing:border-box !important;
  vertical-align:middle !important;
}
/* Home / Score / Away columns are 4/5/6 in the matches table */
.tsp-view-public #matchesTbl th:nth-child(4),
.tsp-view-public #matchesTbl td:nth-child(4){
  width:42% !important;
  /* Koti */
  text-align:right !important;
}
.tsp-view-public #matchesTbl th:nth-child(5),
.tsp-view-public #matchesTbl td:nth-child(5){
  width:16% !important;
  text-align:center !important;
  white-space:nowrap !important;
}
.tsp-view-public #matchesTbl th:nth-child(6),
.tsp-view-public #matchesTbl td:nth-child(6){
  width:42% !important;
  /* Vieras */
  text-align:left !important;
}

/* === v1.2.5 hotfix: public match table alignment (Koti/Tulos/Vieras) === */
#pubMatches{width:100%;table-layout:fixed;border-collapse:separate;border-spacing:0}
#pubMatches th,#pubMatches td{box-sizing:border-box;vertical-align:middle}
#pubMatches th:nth-child(4),#pubMatches td:nth-child(4){width:42%;text-align:right}
#pubMatches th:nth-child(5),#pubMatches td:nth-child(5){width:16%;text-align:center;white-space:nowrap}
#pubMatches th:nth-child(6),#pubMatches td:nth-child(6){width:42%;text-align:left}

/* Mobile: hide Pvm/Aika/Kenttä columns completely so headers and rows stay aligned */
html.tsp-mobile-portrait #pubMatches th:nth-child(-n+3),
html.tsp-mobile-portrait #pubMatches td:nth-child(-n+3){
  display:none !important;
  width:0 !important;
  padding:0 !important;
  border:0 !important;
}


/* Public match table alignment: Koti right, Vieras left */
#pubMatches th.tsp-th-home, #pubMatches td.tsp-home { text-align: right; }
#pubMatches th.tsp-th-away, #pubMatches td.tsp-away { text-align: left; }
#pubMatches td.tsp-away .tsp-teamcell { justify-content: flex-start; }
#pubMatches td.tsp-home .tsp-teamcell { justify-content: flex-end; }
#pubMatches th.tsp-th-score, #pubMatches td.tsp-scorecell { text-align: center; }

/* === v1.2.9: mobile landscape readability (public + admin) === */

/* PUBLIC: landscape on small screens (phones/tablets)
   - prevent date/time/field from being truncated with ellipsis
   - keep Home (Koti) right-aligned and Away (Vieras) left-aligned
   - allow long team names to wrap to 2 lines instead of being cut */
@media (max-width: 1024px) and (orientation: landscape) {
  /* Let the table breathe; allow horizontal scroll when needed */
  #pubMatches { table-layout: auto !important; }
  #pubMatches th, #pubMatches td { overflow: visible !important; text-overflow: clip !important; }

  /* Wider meta columns */
  #pubMatches th:nth-child(1), #pubMatches td:nth-child(1) { min-width: 120px; white-space: nowrap; }
  #pubMatches th:nth-child(2), #pubMatches td:nth-child(2) { min-width: 78px;  white-space: nowrap; }
  #pubMatches th:nth-child(3), #pubMatches td:nth-child(3) { min-width: 120px; white-space: nowrap; }

  /* Team columns: wrap nicely */
  #pubMatches td:nth-child(4),
  #pubMatches td:nth-child(6) {
    white-space: normal !important;
  }

  /* Enforce requested alignment */
  #pubMatches td:nth-child(4), #pubMatches th:nth-child(4) { text-align: right !important; }
  #pubMatches td:nth-child(6), #pubMatches th:nth-child(6) { text-align: left !important; }
  #pubMatches td:nth-child(5), #pubMatches th:nth-child(5) { text-align: center !important; }

  /* Long names: allow breaking at spaces + break-word as fallback */
  #pubMatches .tsp-teamname {
    white-space: normal !important;
    /* prevent letter-by-letter vertical stacking on narrow widths */
    overflow-wrap: break-word;
    word-break: normal;
  }
}

/* ADMIN: schedule editor table on landscape phones
   - avoid pvm/aika overlapping by giving columns a minimum width
   - keep table scrollable horizontally */
@media (max-width: 1024px) and (orientation: landscape) {
  #gEditTbl { table-layout: auto !important; min-width: 860px; }
  #gEditTbl th, #gEditTbl td { white-space: nowrap; }
  #gEditTbl th:nth-child(1), #gEditTbl td:nth-child(1) { min-width: 140px; }
  #gEditTbl th:nth-child(2), #gEditTbl td:nth-child(2) { min-width: 90px; }
  #gEditTbl th:nth-child(3), #gEditTbl td:nth-child(3) { min-width: 140px; }
  #gEditTbl th:nth-child(4), #gEditTbl td:nth-child(4) { min-width: 160px; }
  #gEditTbl th:nth-child(5), #gEditTbl td:nth-child(5) { min-width: 160px; }
}


/* Extra time (JA) inputs – styled like penalty inputs */
#tulospalvelu-root .tsp-aet{ display:flex; gap:6px; align-items:center; justify-content:flex-end; margin-top:6px; }
#tulospalvelu-root .tsp-aet-score{ width:52px; text-align:center; }
#tulospalvelu-root .tsp-res-aet{ display:flex; gap:8px; align-items:center; justify-content:center; margin-top:6px; }

/* =========================
   ADMIN: tulosten syöttö (desktop)
   ========================= */

/* Tummempi "Tallenna" (good) jotta vaalea teksti erottuu kaikissa admin-napeissa */
.tsp-view-admin .tsp-btn.good{
  background: #0b5a32 !important;
  border-color: #0b5a32 !important;
  color: #ffffff !important;
  font-weight: 700;
}
.tsp-view-admin .tsp-btn.good:hover{
  filter: brightness(1.08);
}

/* ResTbl: tee K/V-sarakkeet kapeammiksi ja anna joukkueiden nimet rivittyä */
#resTbl th.tsp-th-score,
#resTbl td:nth-child(5),
#resTbl td:nth-child(6){
  width: 56px;
  min-width: 56px;
}

/* Siirrä K/V -merkinnät koti/vieras otsikoihin – jätä score-otsikot tyhjiksi mutta kapeiksi */
#resTbl th.tsp-th-score{ padding-left: 6px; padding-right: 6px; }

/* Pitkät joukkueiden nimet: salli rivittyminen (FC\nAlpha) */
.tsp-view-admin #resTbl .tsp-teamname{
  white-space: normal !important;
  overflow-wrap: break-word;
  word-break: normal;
}

/* =========================
   ADMIN: aikavalitsin (Pvm/Aika)
   ========================= */

/* Aika-kenttä leikkautui: kasvata hieman ("19.00" näkyy kokonaan) */
#tulospalvelu-root input.tsp-input[type="time"]{
  width: 100px;
  min-width: 100px;
}

/* Varmista että Aika-sarake saa tilaa myös taulukossa */
#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2){
  min-width: 110px;
}

/* ===== v1.4.0 layout tweaks: admin result entry + schedule editor ===== */

/* 1) Tallenna (admin ottelutulokset) – tumma vihreä, vaalea teksti */
#resTbl .tsp-btn.good,
#resTbl button.tsp-btn.good,
#resTbl .tsp-saveRow,
#resTbl .tsp-saveRow.tsp-btn {
  background: #0f5c2e !important;
  border-color: #0f5c2e !important;
  color: #ffffff !important;
  text-shadow: none !important;
}
#resTbl .tsp-btn.good:hover,
#resTbl button.tsp-btn.good:hover,
#resTbl .tsp-saveRow:hover {
  filter: brightness(1.05);
}

/* 2) Admin / Ottelut (tulosten syöttö) – korjaa desktop-taulukon sarakeleveydet
   JS renderöi sarakkeet tässä järjestyksessä:
   1 Pvm | 2 Aika | 3 Kenttä | 4 Koti | 5 K | 6 V | 7 Vieras | 8 Toiminnot
*/
#resTbl {
  table-layout: fixed; /* pakottaa leveydet pysymään järkevinä */
}

/* Kiinteät sarakkeet */
#resTbl th:nth-child(1),
#resTbl td:nth-child(1) { width: 120px !important; }

#resTbl th:nth-child(2),
#resTbl td:nth-child(2) { width: 90px !important; }

#resTbl th:nth-child(3),
#resTbl td:nth-child(3) { width: 120px !important; }

/* K & V (maalit) pieniksi */
#resTbl th:nth-child(5),
#resTbl td:nth-child(5),
#resTbl th:nth-child(6),
#resTbl td:nth-child(6) {
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  text-align: center;
}

#resTbl td:nth-child(5) input,
#resTbl td:nth-child(6) input,
#resTbl td:nth-child(5) select,
#resTbl td:nth-child(6) select {
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
}

/* Toiminnot – pidä riittävän leveänä (Tallennus + JA/RP) */
#resTbl th:nth-child(8),
#resTbl td:nth-child(8) {
  width: 260px !important;
  min-width: 260px !important;
  max-width: 260px !important;
}

/* Joukkue-sarakkeille tila + rivitys sanojen välistä (ei kirjain kerrallaan) */
#resTbl th:nth-child(4),
#resTbl td:nth-child(4),
#resTbl th:nth-child(7),
#resTbl td:nth-child(7) {
  width: 24% !important;
}

#resTbl td:nth-child(4),
#resTbl td:nth-child(7) {
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: break-word;
  line-height: 1.15;
}

/* 3) Asetukset / otteluohjelman muokkaus – Aika-sarake leveämmäksi ("19.00" mahtuu) */
#gEditTbl th:nth-child(2),
#gEditTbl td:nth-child(2) {
  width: 95px !important; /* + ~10px */
  min-width: 95px !important;
  max-width: 95px !important;
}

#gEditTbl td:nth-child(2) select,
#gEditTbl td:nth-child(2) input {
  width: 90px !important;
  min-width: 90px !important;
  max-width: 90px !important;
}

/* =====================================================
   1.4.2 FIXES (PUBLIC MATCHES TABLE - DESKTOP)
   - Show full Pvm and Aika
   - Give Kenttä a bit more width
   ===================================================== */

/* Public match list table ids used in different views */
#tulospalvelu-root #matchesTbl,
#pubMatches {
  table-layout: fixed;
}

/* Column widths (desktop). Adjusted so date/time are fully visible. */
#tulospalvelu-root #matchesTbl th:nth-child(1),
#tulospalvelu-root #matchesTbl td:nth-child(1),
#pubMatches th:nth-child(1),
#pubMatches td:nth-child(1) {
  width: 140px;
}

#tulospalvelu-root #matchesTbl th:nth-child(2),
#tulospalvelu-root #matchesTbl td:nth-child(2),
#pubMatches th:nth-child(2),
#pubMatches td:nth-child(2) {
  width: 95px;
}

#tulospalvelu-root #matchesTbl th:nth-child(3),
#tulospalvelu-root #matchesTbl td:nth-child(3),
#pubMatches th:nth-child(3),
#pubMatches td:nth-child(3) {
  width: 190px;
}

/* Make sure date/time are not ellipsized */
#tulospalvelu-root #matchesTbl td:nth-child(1),
#tulospalvelu-root #matchesTbl td:nth-child(2),
#pubMatches td:nth-child(1),
#pubMatches td:nth-child(2) {
  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* Kenttä: allow a bit more content (no aggressive truncation) */
#tulospalvelu-root #matchesTbl td:nth-child(3),
#pubMatches td:nth-child(3) {
  overflow: hidden; /* keep layout tidy */
  text-overflow: ellipsis;
}


/* ===== Sponsorinauha (alabanneri) ===== */
.tsp-sponsor-strip{
  margin: 14px 0 26px;
  padding: 10px 12px;
  border-radius: 14px;
  background: var(--tsp-glass-bg);
  border: 1px solid var(--tsp-glass-border);
  backdrop-filter: blur(var(--tsp-glass-blur));
}
.tsp-sponsor-title{
  font-weight: 800;
  font-size: 13px;
  letter-spacing: .3px;
  opacity: .92;
  margin: 0 0 8px 0;
  text-align: center;
}
.tsp-sponsor-viewport{
  overflow: hidden;
  width: 100%;
}
.tsp-sponsor-track{
  /* Default: static, centered row (no empty gap at the end). */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  width: 100%;
  white-space: nowrap;
}

/* Enable infinite marquee only when JS adds .tsp-sponsor--marquee */
.tsp-sponsor--marquee .tsp-sponsor-track{
  display: inline-flex;
  justify-content: flex-start;
  gap: 0;
  width: max-content;
  will-change: transform;
  animation: tspMarquee var(--tsp-sponsor-speed, 25s) linear infinite;
}
.tsp-sponsor--marquee.tsp-sponsor--right .tsp-sponsor-track{
  animation-name: tspMarqueeRight;
}
.tsp-sponsor-item{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border-radius: 10px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.10);
  margin-right: 0;
}

.tsp-sponsor--marquee .tsp-sponsor-item{
  margin-right: 18px; /* avoids flex "gap" seam issues in 50% marquee loops */
}

.tsp-sponsor-name{
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.1;
  font-weight: 700;
  opacity: .92;
  color: rgba(255,255,255,0.90);
  text-align: center;
  max-width: 220px;
  white-space: normal;
}

/* Place copyright below sponsor strip (public view) */
.tsp-view-public .tsp-brand-footer:not(.tsp-brand-footer-outside){
  display: none;
}
.tsp-brand-footer-outside{
  margin-top: -8px;
  margin-bottom: 22px;
  text-align: center;
  font-size: 12px;
  color: rgba(255,255,255,.55);
}
.tsp-sponsor-logo{
  height: var(--tsp-sponsor-size, 48px);
  width: auto;
  max-width: 200px;
  object-fit: contain;
  display: block;
}
.tsp-sponsor-item:hover{
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.18);
}
@keyframes tspMarquee{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}
@keyframes tspMarqueeRight{
  0%{ transform: translateX(-50%); }
  100%{ transform: translateX(0); }
}
@media (prefers-reduced-motion: reduce){
  .tsp-sponsor-track{ animation: none; }
  .tsp-sponsor-viewport{ overflow-x: auto; }
}
@media (max-width: 480px){
  .tsp-sponsor-strip{ padding: 10px; }
  .tsp-sponsor-logo{ max-width: 160px; }
}

/* === FIXED MAP SIZE (LOCKED) === */
.tsp-public-map-wrapper {
  width: 400px !important;
  height: 300px !important;
  min-width: 400px !important;
  min-height: 300px !important;
  max-width: 400px !important;
  max-height: 300px !important;
  position: relative;
  overflow: hidden;
  flex: 0 0 auto !important;
}

.tsp-public-map-wrapper iframe {
  width: 100% !important;
  height: 100% !important;
  border: 0;
}


/* === MAP SIZE LOCK (PUBLIC) ===
   Lock the tournament map to a stable size and prevent layout-driven resizing.
   - Max width 400px (shrinks on very narrow screens)
   - Fixed height 300px
*/
.tsp-turnausinfo-map{
  width: 100% !important;
  max-width: 400px !important;
  height: 300px !important;
}
.tsp-turnausinfo-iframe{
  width: 100% !important;
  height: 300px !important;
  min-height: 300px !important;
  max-height: 300px !important;
}



/* === Turnausinfo layout: text left, map right on landscape + desktop === */
/* Default: stacked (mobile portrait and narrow screens) */
.tsp-card.tsp-turnausinfo{
  display:block;
}

/* Landscape phones + wider screens: two columns */
@media (orientation: landscape) and (min-width: 640px), (min-width: 900px){
  .tsp-card.tsp-turnausinfo{
    display:flex;
    flex-direction:row;
    align-items:flex-start;
    gap:16px;
  }
  .tsp-card.tsp-turnausinfo .tsp-turnausinfo-text{
    flex:1 1 auto;
    margin:0;
  }
  .tsp-card.tsp-turnausinfo .tsp-turnausinfo-map{
    flex:0 0 auto;
    margin-top:0;
  }
}


/* Hide legacy CSV import (Excel import is used instead) */
#tspImportCsvBtn, #tspImportCsvFile { display:none !important; }

/* Mobile-friendly playoff bracket: collapse by default and allow horizontal scroll when opened */
.tsp-bracket-details {
  margin: 12px 0;
}
.tsp-bracket-details > summary {
  cursor: pointer;
  user-select: none;
  font-weight: 600;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255,255,255,0.06);
  list-style: noneselector: none;
  outline: none;
}
.tsp-bracket-details[open] > summary {
  margin-bottom: 8px;
}
@media (max-width: 768px) {
  #pubBracket, .tsp-bracket {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  /* Reduce bracket card footprint a bit on phones */
  .tsp-bracket .match, .tsp-bracket .tsp-match, .tsp-bracket .bracket-match {
    transform-origin: top left;
  }
}

/* Mobile-friendly playoff bracket: collapsible + scrollable */
.tsp-bracket-details {
  margin: 12px 0;
}
.tsp-bracket-details > summary {
  cursor: pointer;
  user-select: none;
  font-weight: 700;
  padding: 12px 14px;
  border-radius: 14px;
  background: rgba(255,255,255,0.08);
  outline: none;
}
.tsp-bracket-details[open] > summary {
  margin-bottom: 8px;
}
.tsp-bracket-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 6px;
}
@media (max-width: 768px) {
  #pubBracket, .tsp-bracket-scroll { max-width: 100%; }
}

/* Mobile playoff bracket toggle */
.tsp-bracket-toggle{
  display: none;
  width: 100%;
  border: 0;
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 700;
  background: rgba(255,255,255,0.10);
  color: inherit;
  cursor: pointer;
  margin: 12px 0 8px 0;
}
@media (max-width: 768px){
  .tsp-bracket-toggle{ display:block; }
  /* Hide bracket by default on mobile; show only when toggled open */
  #pubBracket{ display:none; }
  #pubBracket.tsp-bracket-open{
    display:block;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    max-width:100%;
  }
}

/* PHONE: hide playoff bracket completely for readability (tablets can still show it) */
@media (max-width: 640px){
  #pubBracket{ display:none !important; }
  #tspBracketToggleBtn, .tsp-bracket-toggle, .tsp-bracket-details{ display:none !important; }
}

.tsp-meta-sep{opacity:.6;padding:0 6px;}

.tsp-unpublished{font-weight:700;text-align:center;padding:14px 10px;}


/* Admin: Otteluohjelman muokkaustaulukko (gEditTbl) – sarakeleveydet niin että Pvm/Poista näkyvät kokonaan */
#tulospalvelu-root #gEditTbl{table-layout:fixed;}
#tulospalvelu-root #gEditTbl th,
#tulospalvelu-root #gEditTbl td{white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

#tulospalvelu-root #gEditTbl th:nth-child(1),
#tulospalvelu-root #gEditTbl td:nth-child(1){width:130px;}   /* Pvm */

#tulospalvelu-root #gEditTbl th:nth-child(2),
#tulospalvelu-root #gEditTbl td:nth-child(2){width:90px;}    /* Aika */

#tulospalvelu-root #gEditTbl th:nth-child(3),
#tulospalvelu-root #gEditTbl td:nth-child(3){width:120px;}   /* Kenttä (hieman pienempi) */

#tulospalvelu-root #gEditTbl th:nth-child(4),
#tulospalvelu-root #gEditTbl td:nth-child(4){width:150px;}   /* Kierros */

#tulospalvelu-root #gEditTbl th:nth-child(5),
#tulospalvelu-root #gEditTbl td:nth-child(5){width:auto;}    /* Koti */

#tulospalvelu-root #gEditTbl th:nth-child(6),
#tulospalvelu-root #gEditTbl td:nth-child(6){width:auto;}    /* Vieras */

#tulospalvelu-root #gEditTbl th:nth-child(7),
#tulospalvelu-root #gEditTbl td:nth-child(7){width:140px;}   /* Poista */

/* Poista-nappi: varmista että teksti näkyy */
#tulospalvelu-root #gEditTbl [data-del-match]{min-width:110px;}


/* 1.8.52 hienosäätö: sarakeleveydet adminissa */
#tulospalvelu-root #gEditTbl th:nth-child(1),
#tulospalvelu-root #gEditTbl td:nth-child(1){width:150px;}

#tulospalvelu-root #gEditTbl th:nth-child(2),
#tulospalvelu-root #gEditTbl td:nth-child(2){width:90px;}

#tulospalvelu-root #gEditTbl th:nth-child(3),
#tulospalvelu-root #gEditTbl td:nth-child(3){width:100px;}

#tulospalvelu-root #gEditTbl th:nth-child(4),
#tulospalvelu-root #gEditTbl td:nth-child(4){width:120px;}

#tulospalvelu-root #gEditTbl th:nth-child(7),
#tulospalvelu-root #gEditTbl td:nth-child(7){width:150px;}


/* 1.8.55: Julkinen Ottelut-suodatinrivi – salli rivittyminen, jotta kaikki valikot (ml. Järjestys) näkyvät myös mobiilissa */
#tulospalvelu-root .tsp-row.tsp-row-filters{flex-wrap:wrap;}
#tulospalvelu-root .tsp-row.tsp-row-filters > div{flex:1 1 220px; min-width:200px;}
@media (max-width: 520px){
  #tulospalvelu-root .tsp-row.tsp-row-filters > div{flex-basis: 160px; min-width:150px;}
}


/* 1.8.68: Mobiilikortin Kenttä-rivin oikeaan reunaan Sarja + Lohko */
@media (max-width: 780px){
  #tulospalvelu-root .tsp-meta{display:flex;justify-content:space-between;gap:10px;align-items:center;}
  #tulospalvelu-root .tsp-meta-right{opacity:.85;font-size:12px;white-space:nowrap;}
}

/* Julkisen suodatinrivien välistys yhtenäiseksi (myös Joukkue ↔ Järjestys) */
#tulospalvelu-root .tsp-pub-filters{gap:16px;}


/* 1.8.69: Mobiilissa näytä Sarja · Lohko ottelukortissa (score-solun alla, oikealle) */
#tulospalvelu-root #pubMatches .tsp-mobile-sg{display:none;}
@media (max-width: 780px){
  #tulospalvelu-root #pubMatches .tsp-mobile-sg{
    display:block;
    margin-top:6px;
    font-size:12px;
    opacity:.85;
    text-align:right;
    white-space:nowrap;
  }
}


/* 1.8.70: näytä Sarja · Lohko myös silloin kun käytössä on html.tsp-mobile-portrait luokitus */
html.tsp-mobile-portrait #tulospalvelu-root #pubMatches .tsp-mobile-sg{
  display:block !important;
  margin-top:6px;
  font-size:12px;
  opacity:.9;
  text-align:right;
  white-space:nowrap;
}
@media (max-width: 780px){
  #tulospalvelu-root #pubMatches .tsp-mobile-sg{
    display:block !important;
  }
}


/* 1.8.71: Mobiili-ottelukortin alaosaan Sarja + Lohko kentän oikealle puolelle */
#tulospalvelu-root .tsp-matchcard-bot{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:baseline;
}
#tulospalvelu-root .tsp-matchcard-bot-right{
  opacity:.85;
  font-size:12px;
  white-space:nowrap;
  text-align:right;
}



/* Clear save feedback */
.tsp-btn.saving{opacity:.75;cursor:wait;position:relative}
.tsp-btn.saving::after{content:"";display:inline-block;width:12px;height:12px;margin-left:8px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;vertical-align:-2px;animation:tspSpin .8s linear infinite}
@keyframes tspSpin{to{transform:rotate(360deg)}}
.tsp-btn.tsp-flash{box-shadow:0 0 0 3px rgba(77,163,255,.25)}

/* 1.9.5: subtle shake for buttons */
@keyframes tspShake{0%{transform:translateX(0)}25%{transform:translateX(-2px)}50%{transform:translateX(2px)}75%{transform:translateX(-2px)}100%{transform:translateX(0)}}
#tulospalvelu-root .tsp-shake{animation:tspShake .25s linear 2;}


/* 1.9.15: success button (green) */
#tulospalvelu-root .tsp-btn.success{background:#1f8f3a;color:#fff;border:1px solid #16732e;}
#tulospalvelu-root .tsp-btn.success:hover{filter:brightness(0.95);}
#tulospalvelu-root .tsp-btn.success:disabled{opacity:.6;cursor:not-allowed;}

/* Public top bar ticker (matches + info) */
.tsp-topbar{
  margin: 10px 0 14px 0;
  padding: 10px 12px;
  border-radius: 14px;
  background: var(--tsp-glass-bg);
  border: 1px solid var(--tsp-glass-border);
  backdrop-filter: blur(var(--tsp-glass-blur));
  -webkit-backdrop-filter: blur(var(--tsp-glass-blur));
  color: #fff;
  overflow: hidden;
}
.tsp-topbar-track{
  width: max-content;
  display:inline-flex;
  align-items:center;
  gap:0;
white-space: nowrap;
  will-change: transform;
  animation: tsp-marquee var(--tsp-marquee-duration, 48s) linear infinite;
}

.tsp-topbar-group{
  display:flex;
  align-items:center;
  gap:14px;
  padding-right:60px;
}

.tsp-topbar-item{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:6px 12px;
  border-radius:9999px;
  background:rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  font-size:13px;
  line-height:1.2;
  white-space:nowrap;
}

.tsp-topbar-item b{ font-weight:800; }

.tsp-topbar-dt{
  opacity:.95;
  font-weight:700;
}

.tsp-topbar-meta{
  opacity:.9;
}

.tsp-topbar-facts{
  display:inline-flex;
  gap:8px;
}

.tsp-topbar-tag{
  opacity:.95;
  font-weight:700;
}

@media (max-width: 768px){
  .tsp-topbar-item{
    font-size:12px;
    padding:6px 10px;
    gap:8px;
  }
}

@keyframes tsp-marquee{
  0%{ transform: translateX(0); }
  100%{ transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce){
  .tsp-topbar-track{ animation: none; }
}

/* =========================================================
 * HERO (upper banner) – marquee ribbon (match facts + nippelitiedot)
 * =======================================================*/

.tsp-hero.tsp-hero--marquee{
  margin: 14px 0 18px;
  padding: 0;
  min-height: auto;
  background: transparent;
}

.tsp-hero--marquee .tsp-hero-marquee{
  background: rgba(12, 16, 26, 0.70);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 14px;
  overflow: hidden;
  padding: 10px 12px;
}

.tsp-hero--marquee .tsp-hero-marquee-track{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
  will-change: transform;
  animation: tspHeroMarquee 45s linear infinite;
}

.tsp-hero--marquee .tsp-hero-marquee-track.is-paused{
  animation-play-state: paused;
}

@keyframes tspHeroMarquee{
  0% { transform: translateX(0); }
  /* Distance is set by JS as --tsp-marquee-distance (px). */
  100% { transform: translateX(calc(-1 * var(--tsp-marquee-distance, 50%))); }
}

.tsp-hero--marquee .tsp-hero-sep{
  opacity: 0.55;
  margin: 0 6px;
}

.tsp-hero--marquee .tsp-hero-chip{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.07);
  border: 1px solid rgba(255,255,255,0.08);
  font-size: 13px;
  line-height: 1.2;
}

/* Info/Nippelitieto -chip */
.tsp-hero--marquee .tsp-hero-chip--info{
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.14);
}

.tsp-hero--marquee .tsp-hero-chip-dt{
  opacity: 0.9;
}

.tsp-hero--marquee .tsp-hero-chip-main{
  font-weight: 600;
}

.tsp-hero--marquee .tsp-hero-chip-main b{
  font-weight: 800;
}

.tsp-hero--marquee .tsp-hero-chip-sub{
  opacity: 0.9;
}

.tsp-hero--marquee .tsp-hero-chip-tag{
  opacity: 0.95;
}

@media (max-width: 768px){
  /* Duration is set by JS for consistent speed across different content lengths. */
  .tsp-hero--marquee .tsp-hero-chip{ font-size: 12px; }
}
/* tsp-small-viewport-height-fix
   When the browser window is made very short (height constrained) on desktop,
   some themes can clip the plugin area so tables appear to run past the visible
   card. Allow vertical scrolling within the public plugin container.
*/
@media (max-height: 720px){
  .tsp-view-public{
    max-height: 100vh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
}


/* Public: pubSeries is hidden (series controlled via Sarjataulukot) */
#pubSeries{display:none !important;}


/* ===== 2.8.2: Admin match editor filter label alignment ===== */
.tsp-editfilters .tsp-editpair{display:flex;flex-direction:column;}
.tsp-editfilters .tsp-editpair .tsp-input{width:220px;max-width:220px;}
@media (max-width: 520px){
  .tsp-editfilters .tsp-editpair .tsp-input{width:100%;max-width:100%;}
}


.tsp-powered{
text-align:center;
font-size:14px;
color:#ffffff;
opacity:0.9;
margin-bottom:6px;
letter-spacing:1px;
}
.tsp-powered a{
color:#ffffff;
text-decoration:none;
}


/* Public matches: card-only layout */
#tulospalvelu-root #pubMatches{display:none !important;}
#tulospalvelu-root #pubMatchesCards{display:grid;}
@media (max-width: 900px){
  #tulospalvelu-root #pubMatchesCards{grid-template-columns:1fr;}
}
@media (min-width: 901px){
  #tulospalvelu-root #pubMatchesCards{grid-template-columns:repeat(2, minmax(0, 1fr));}
}


/* Public matches print view: use compact table instead of cards */
@media print {
  body.tsp-print-matches-table #tulospalvelu-root #pubMatches,
  body.tsp-print-matches-table .tsp-wrap #pubMatches {
    display: table !important;
    width: 100% !important;
    border-collapse: collapse !important;
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 12px !important;
  }
  body.tsp-print-matches-table #tulospalvelu-root #pubMatchesCards,
  body.tsp-print-matches-table .tsp-wrap #pubMatchesCards,
  body.tsp-print-matches-table #pubPrint,
  body.tsp-print-matches-table #pubMore,
  body.tsp-print-matches-table .tsp-matchcards-heading,
  body.tsp-print-matches-table #pubBracket,
  body.tsp-print-matches-table .tsp-topbar,
  body.tsp-print-matches-table .tsp-powered,
  body.tsp-print-matches-table .tsp-row-filters,
  body.tsp-print-matches-table #pubStage,
  body.tsp-print-matches-table #pubTeam,
  body.tsp-print-matches-table #pubOrder,
  body.tsp-print-matches-table label[for=pubStage],
  body.tsp-print-matches-table label[for=pubTeam],
  body.tsp-print-matches-table label[for=pubOrder] {
    display: none !important;
  }
  body.tsp-print-matches-table #tulospalvelu-root #pubMatches th,
  body.tsp-print-matches-table #tulospalvelu-root #pubMatches td,
  body.tsp-print-matches-table .tsp-wrap #pubMatches th,
  body.tsp-print-matches-table .tsp-wrap #pubMatches td {
    border: 1px solid #bfc5cc !important;
    padding: 6px 8px !important;
    vertical-align: middle !important;
    background: #ffffff !important;
    color: #000000 !important;
  }
  body.tsp-print-matches-table #tulospalvelu-root #pubMatches thead,
  body.tsp-print-matches-table .tsp-wrap #pubMatches thead {
    display: table-header-group !important;
  }
  body.tsp-print-matches-table #tulospalvelu-root #pubMatches .tsp-logo-box,
  body.tsp-print-matches-table #tulospalvelu-root #pubMatches img.tsp-logo,
  body.tsp-print-matches-table .tsp-wrap #pubMatches .tsp-logo-box,
  body.tsp-print-matches-table .tsp-wrap #pubMatches img.tsp-logo {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
  }
  body.tsp-print-matches-table #tulospalvelu-root,
  body.tsp-print-matches-table .tsp-wrap {
    background: #ffffff !important;
  }
  body.tsp-print-matches-table #tulospalvelu-root .tsp-card h3,
  body.tsp-print-matches-table .tsp-wrap .tsp-card h3 {
    display: none !important;
  }
  body.tsp-print-matches-table #tulospalvelu-root .tsp-card,
  body.tsp-print-matches-table .tsp-wrap .tsp-card {
    background: #ffffff !important;
    box-shadow: none !important;
    border: 0 !important;
    padding: 0 !important;
  }

}


/* ===== 1.10.73: Teams table on mobile – ensure both Tallenna and Poista are visible ===== */
@media (max-width: 900px){
  #teamsTbl th:last-child,
  #teamsTbl td:last-child{
    width: 150px !important;
    min-width: 150px;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  #teamsTbl td:last-child{
    text-align: right;
  }
  #teamsTbl td:last-child .tsp-btn{
    display: block;
    width: 100%;
    margin: 0 0 8px 0;
  }
  #teamsTbl td:last-child .tsp-btn:last-child{
    margin-bottom: 0;
  }
}