
/* =========================================================
   MPD · MODAL DETALLE PARTIDO DESDE GRIDS
   ---------------------------------------------------------
   Guarda este archivo en:
     assets/mp_match_detail_modal_datos_v3.css

   Está pensado para el modal nuevo de Mis Partidos / Confirmar Rutas.
   No usa #datos-page: todo queda encapsulado en .mpd-match-detail-scope.
   ========================================================= */

.mpd-match-detail-modal .modal-dialog{
  width:min(97vw,1900px)!important;
  max-width:min(97vw,1900px)!important;
  height:92vh!important;
  max-height:92vh!important;
  margin:4vh auto!important;
}

.mpd-match-detail-modal-content-shell{
  height:92vh!important;
  max-height:92vh!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border-radius:18px!important;
  background:#101617!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.62)!important;
  color:#EFFFF6!important;
}

.mpd-modal-header{
  flex:0 0 auto!important;
  padding:10px 14px!important;
  background:linear-gradient(135deg,#111819 0%,#162122 55%,#101617 100%)!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
}

.mpd-modal-headerbar{
  width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.mpd-modal-title{
  color:#EFFFF6!important;
  font-size:15px!important;
  line-height:1.1!important;
  font-weight:900!important;
  letter-spacing:.2px!important;
}

.mpd-match-detail-modal .btn-close{
  filter:invert(1) grayscale(1);
  opacity:.85;
}

.mpd-match-detail-modal .btn-close:hover{
  opacity:1;
}

.mpd-modal-body{
  flex:1 1 auto!important;
  min-height:0!important;
  height:100%!important;
  padding:0!important;
  background:#0f1516!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:stable!important;
}

.mpd-modal-body > .dash-spinner,
.mpd-modal-body > div{
  min-height:100%;
}

.mpd-match-detail-body{
  min-height:100%;
  width:100%;
  box-sizing:border-box;
  overflow:visible;
  color:#EFFFF6;
}

.mpd-match-detail-scope{
  --datos-league-accent:rgba(6,190,132,.70);
  --datos-league-soft:rgba(6,190,132,.12);
  --datos-panel-bg:rgba(15,21,22,.92);
  --datos-card-bg:rgba(255,255,255,.045);
  --datos-card-border:rgba(255,255,255,.11);
  color:#EFFFF6;
  box-sizing:border-box;
}

.mpd-match-detail-scope *,
.mpd-match-detail-scope *::before,
.mpd-match-detail-scope *::after{
  box-sizing:border-box;
}

.mpd-match-detail-content{
  width:100%;
  min-height:100%;
  display:flex;
  flex-direction:column;
  min-width:0;
  overflow:visible;
  background:radial-gradient(circle at 20% 0%,rgba(6,190,132,.08),transparent 28%),#0f1516;
}

.mpd-match-detail-top-card{
  flex:0 0 auto;
  width:100%;
  padding:12px 14px 8px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
}

.mpd-match-detail-nav-wrap{
  flex:0 0 auto;
  width:100%;
  padding:8px 14px 6px;
  background:rgba(15,21,22,.72);
  backdrop-filter:blur(8px);
  position:sticky;
  top:0;
  z-index:5;
}

.mpd-match-detail-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:min(100%,760px);
  margin:0 auto;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.10) 50%,rgba(255,255,255,0) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035),0 8px 24px rgba(0,0,0,.24);
}

.mpd-match-detail-nav-btn{
  min-width:0;
  height:32px;
  padding:0 13px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px;
  border:1px solid transparent!important;
  border-radius:999px!important;
  background:transparent!important;
  color:rgba(239,255,246,.78)!important;
  font-size:12px!important;
  font-weight:800!important;
  letter-spacing:.1px;
  cursor:pointer!important;
  transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease,box-shadow .16s ease;
}

.mpd-match-detail-nav-btn img{
  height:18px!important;
  width:18px!important;
  object-fit:contain;
  opacity:.78;
  margin-right:0!important;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.35));
}

.mpd-match-detail-nav-btn:hover{
  color:#EFFFF6!important;
  transform:translateY(-1px);
  background:rgba(255,255,255,.065)!important;
  border-color:rgba(255,255,255,.16)!important;
}

.mpd-match-detail-nav-btn.is-active{
  color:#EFFFF6!important;
  background:linear-gradient(135deg,rgba(6,190,132,.30),rgba(6,190,132,.12))!important;
  border-color:rgba(6,190,132,.52)!important;
  box-shadow:0 0 0 1px rgba(6,190,132,.10),0 8px 22px rgba(6,190,132,.13)!important;
}

.mpd-match-detail-nav-btn.is-active img{
  opacity:1;
}

.mpd-match-detail-panes{
  flex:1 1 auto;
  min-height:0;
  width:100%;
  padding:12px 14px 18px!important;
  overflow:visible;
}

.mpd-match-detail-pane{
  width:100%;
  min-width:0;
  max-width:100%;
  color:#EFFFF6;
}

.mpd-match-detail-pane--clasificacion,
.mpd-match-detail-pane--insights,
.mpd-match-detail-pane--plantillas{
  overflow:visible;
}

.mpd-datos-stack{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:0;
}

.mpd-datos-stage{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:visible;
}

.mpd-datos-layer{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:visible;
}

.mpd-datos-canvas{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow-x:auto!important;
  overflow-y:visible!important;
  padding:0 0 4px;
  border-radius:16px;
  scrollbar-width:thin;
}

.mpd-datos-inner{
  width:100%;
  min-width:1180px;
  border-radius:16px;
  overflow:visible;
}

.mpd-datos-canvas::-webkit-scrollbar,
.mpd-modal-body::-webkit-scrollbar{
  height:10px;
  width:10px;
}

.mpd-datos-canvas::-webkit-scrollbar-track,
.mpd-modal-body::-webkit-scrollbar-track{
  background:rgba(255,255,255,.035);
  border-radius:999px;
}

.mpd-datos-canvas::-webkit-scrollbar-thumb,
.mpd-modal-body::-webkit-scrollbar-thumb{
  background:rgba(6,190,132,.35);
  border-radius:999px;
  border:2px solid rgba(10,15,16,.9);
}

.mpd-team-players-panel{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
  padding:0;
}

.mpd-team-players-panel + .mpd-team-players-panel{
  margin-top:16px;
}

.mpd-match-detail-scope .mpd-detail-overview-grid,
.mpd-match-detail-scope .mpd-detail-overview-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}

.mpd-match-detail-scope .mpd-detail-overview-item{
  min-width:0;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  background:rgba(255,255,255,.045);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 8px 22px rgba(0,0,0,.20);
}

.mpd-match-detail-scope .mpd-detail-overview-label{
  font-size:10px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-weight:900;
  color:rgba(239,255,246,.56);
  margin-bottom:6px;
}

.mpd-match-detail-scope .mpd-detail-overview-value{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#EFFFF6;
  font-size:13px;
  font-weight:800;
}

.mpd-match-detail-scope .datos-league-embedded-card,
.mpd-match-detail-scope .datos-league-classification-card,
.mpd-match-detail-scope .datos-classification-evo-card,
.mpd-match-detail-scope .datos-classification-evo-dual-card,
.mpd-match-detail-scope .datos-teams-goals-section,
.mpd-match-detail-scope .datos-team-players-card{
  background:linear-gradient(180deg,rgba(255,255,255,.060),rgba(255,255,255,.030))!important;
  border:1px solid rgba(255,255,255,.11)!important;
  border-radius:16px!important;
  box-shadow:0 12px 34px rgba(0,0,0,.30)!important;
  color:#EFFFF6!important;
}

.mpd-match-detail-scope .datos-teams-goals-title,
.mpd-match-detail-scope .datos-team-players-title,
.mpd-match-detail-scope .datos-classification-evo-dual-panel-title,
.mpd-match-detail-scope .datos-teams-goals-card-title{
  color:#EFFFF6!important;
}

.mpd-match-detail-scope .datos-teams-goals-subtitle,
.mpd-match-detail-scope .datos-team-players-subtitle,
.mpd-match-detail-scope .datos-classification-evo-dual-panel-subtitle,
.mpd-match-detail-scope .datos-teams-goals-card-subtitle{
  color:rgba(239,255,246,.68)!important;
}

.mpd-match-detail-scope .ag-theme-alpine-dark{
  --ag-background-color:#111819;
  --ag-foreground-color:#EFFFF6;
  --ag-header-background-color:#182122;
  --ag-border-color:rgba(255,255,255,.10);
  --ag-row-hover-color:rgba(6,190,132,.10);
  --ag-selected-row-background-color:rgba(6,190,132,.16);
  border-radius:14px;
  overflow:hidden;
}

.mpd-match-detail-scope .ag-root-wrapper{
  border:1px solid rgba(255,255,255,.10)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:#111819!important;
}

.mpd-match-detail-scope .js-plotly-plot,
.mpd-match-detail-scope .plot-container,
.mpd-match-detail-scope .svg-container{
  max-width:100%!important;
}

@media (max-width: 1100px){
  .mpd-match-detail-nav{
    width:100%;
    overflow-x:auto;
    justify-content:flex-start;
  }
  .mpd-match-detail-nav-btn{
    flex:0 0 auto;
  }
  .mpd-match-detail-scope .mpd-detail-overview-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 720px){
  .mpd-match-detail-modal .modal-dialog{
    width:100vw!important;
    max-width:100vw!important;
    height:100vh!important;
    max-height:100vh!important;
    margin:0!important;
  }
  .mpd-match-detail-modal-content-shell{
    height:100vh!important;
    max-height:100vh!important;
    border-radius:0!important;
  }
  .mpd-match-detail-panes{
    padding:10px!important;
  }
  .mpd-match-detail-scope .mpd-detail-overview-grid{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   SCOPE DATOS_PAGE ORIGINAL -> MODAL PROPIO
   ---------------------------------------------------------
   Las reglas siguientes vienen de los CSS que pasaste de datos_page,
   pero el selector raíz ha sido cambiado a .mpd-match-detail-scope.
   ========================================================= */



/* ==== FUENTE: seccion ligas/seccion de clasificacion en ligas.css ==== */

/* =========================================================
   DATOS · selector de grupos
   ========================================================= */

.mpd-match-detail-scope .datos-group-select-btn {
  padding: 7px 12px;
  font-size: 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.14);
  background: linear-gradient(
    90deg,
    var(--datos-group-soft, rgba(255,255,255,.08)) 0%,
    rgba(255,255,255,0.03) 100%
  );
  color: white;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition:
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.mpd-match-detail-scope .datos-group-select-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.32);
}

.mpd-match-detail-scope .datos-group-select-btn.is-active {
  font-weight: 800;
  border-color: var(--datos-group-accent, rgba(255,255,255,.45));
  background: linear-gradient(
    90deg,
    rgba(255,255,255,.14) 0%,
    rgba(255,255,255,0.06) 100%
  );
  box-shadow: 0 0 18px rgba(255,255,255,.10);
}


/* =========================================================
   DATOS · clasificación grid base
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid {
  --ag-background-color: rgba(4, 7, 8, 0.34);
  --ag-header-background-color: rgba(255, 255, 255, 0.075);
  --ag-odd-row-background-color: rgba(255, 255, 255, 0.028);
  --ag-row-hover-color: rgba(255, 255, 255, 0.085);
  --ag-border-color: rgba(255, 255, 255, 0.075);
  --ag-header-foreground-color: rgba(255,255,255,.92);
  --ag-foreground-color: rgba(255,255,255,.88);

  --ag-font-size: 12px;
  --ag-row-border-color: rgba(255,255,255,.055);
  --ag-secondary-border-color: rgba(255,255,255,.08);
  --ag-selected-row-background-color: rgba(255,255,255,.08);

  width: 100%;
  min-width: 0;
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.085);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 16px 34px rgba(0,0,0,.16);
}

.mpd-match-detail-scope .datos-classification-grid .ag-root-wrapper {
  border-radius: 16px;
  overflow: hidden;
}

.mpd-match-detail-scope .datos-classification-grid .ag-root,
.mpd-match-detail-scope .datos-classification-grid .ag-root-wrapper,
.mpd-match-detail-scope .datos-classification-grid .ag-body,
.mpd-match-detail-scope .datos-classification-grid .ag-body-viewport,
.mpd-match-detail-scope .datos-classification-grid .ag-center-cols-viewport,
.mpd-match-detail-scope .datos-classification-grid .ag-center-cols-clipper {
  min-width: 0;
}


/* =========================================================
   DATOS · clasificación headers
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .ag-header {
  border-bottom: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.085) 0%, rgba(255,255,255,.045) 100%);
}

.mpd-match-detail-scope .datos-classification-grid .ag-header-cell,
.mpd-match-detail-scope .datos-classification-grid .ag-header-group-cell {
  font-weight: 850;
  letter-spacing: .2px;
  border-right: 1px solid rgba(255,255,255,.05);
}

.mpd-match-detail-scope .datos-classification-grid .ag-header-cell-label,
.mpd-match-detail-scope .datos-classification-grid .ag-header-group-cell-label {
  justify-content: center;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-header-fixed {
  background: rgba(8, 10, 10, .96) !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-group-header {
  color: rgba(255,255,255,.92);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-group-general {
  background: linear-gradient(
    180deg,
    rgba(255,255,255,.10) 0%,
    rgba(255,255,255,.045) 100%
  );
  border-left: 1px solid rgba(255,255,255,.08);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-group-home {
  background: linear-gradient(
    180deg,
    rgba(34,197,94,.16) 0%,
    rgba(34,197,94,.055) 100%
  );
  border-left: 1px solid rgba(34,197,94,.22);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-group-away {
  background: linear-gradient(
    180deg,
    rgba(59,130,246,.16) 0%,
    rgba(59,130,246,.055) 100%
  );
  border-left: 1px solid rgba(59,130,246,.22);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-group-sanction,
.mpd-match-detail-scope .datos-classification-grid .datos-clasif-group-extra {
  background: linear-gradient(
    180deg,
    rgba(249,115,22,.15) 0%,
    rgba(249,115,22,.045) 100%
  );
  border-left: 1px solid rgba(249,115,22,.20);
}


/* =========================================================
   DATOS · clasificación celdas base
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .ag-cell {
  display: flex;
  align-items: center;
  border-right: 1px solid rgba(255,255,255,.035);
}

.mpd-match-detail-scope .datos-classification-grid .ag-cell-value {
  width: 100%;
}

.mpd-match-detail-scope .datos-classification-grid .ag-pinned-left-header,
.mpd-match-detail-scope .datos-classification-grid .ag-pinned-left-cols-container {
  border-right: 1px solid rgba(255,255,255,.13);
}

.mpd-match-detail-scope .datos-classification-grid .ag-pinned-left-header .ag-header-cell,
.mpd-match-detail-scope .datos-classification-grid .ag-pinned-left-cols-container .ag-cell {
  background: rgba(7, 9, 9, .96);
}


/* =========================================================
   DATOS · clasificación posición / escudo / equipo
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-pos-cell {
  justify-content: center !important;
  font-size: 13px;
  font-weight: 950;
  color: rgba(255,255,255,.95);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-logo-cell {
  justify-content: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-logo-cell .ag-cell-value {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100%;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-team-cell {
  justify-content: flex-start !important;
  font-size: 12px;
  font-weight: 850;
  letter-spacing: .15px;
  color: rgba(255,255,255,.94);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-team-cell .ag-cell-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* =========================================================
   DATOS · renderers de imagen solo en datos_page
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .datos-img-circle-renderer,
.mpd-match-detail-scope .datos-teams-grid .datos-img-circle-renderer,
.mpd-match-detail-scope .datos-team-players-grid .datos-img-circle-renderer {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  object-fit: contain !important;
  border-radius: 999px !important;
  padding: 3px !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 5px 12px rgba(0,0,0,.18);
}

.mpd-match-detail-scope .datos-classification-grid .datos-img-circle-fallback,
.mpd-match-detail-scope .datos-teams-grid .datos-img-circle-fallback,
.mpd-match-detail-scope .datos-team-players-grid .datos-img-circle-fallback {
  width: 34px;
  height: 34px;
  min-width: 34px;
  min-height: 34px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.14);
  font-size: 15px;
  font-weight: 850;
}


/* =========================================================
   DATOS · renderer equipo con logo
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-team-inline,
.mpd-match-detail-scope .datos-teams-grid .datos-clasif-team-inline {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-width: 0;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-team-logo,
.mpd-match-detail-scope .datos-teams-grid .datos-clasif-team-logo {
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  object-fit: contain;
  border-radius: 999px;
  padding: 2px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-team-logo-fallback,
.mpd-match-detail-scope .datos-teams-grid .datos-clasif-team-logo-fallback {
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.14);
  font-size: 11px;
  font-weight: 900;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-team-name,
.mpd-match-detail-scope .datos-teams-grid .datos-clasif-team-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}


/* =========================================================
   DATOS · clasificación números y colores
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-number-cell {
  justify-content: center !important;
  font-weight: 750;
  color: rgba(255,255,255,.86);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-win-cell {
  justify-content: center !important;
  color: rgba(74, 222, 128, .98) !important;
  font-weight: 900 !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-draw-cell {
  justify-content: center !important;
  color: rgba(250, 204, 21, .98) !important;
  font-weight: 900 !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-loss-cell {
  justify-content: center !important;
  color: rgba(251, 146, 60, .98) !important;
  font-weight: 900 !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-gf,
.mpd-match-detail-scope .datos-classification-grid .datos-clasif-gf-cell {
  justify-content: center !important;
  color: rgba(74, 222, 128, .98) !important;
  font-weight: 950 !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-gc,
.mpd-match-detail-scope .datos-classification-grid .datos-clasif-gc-cell {
  justify-content: center !important;
  color: rgba(248, 113, 113, .98) !important;
  font-weight: 950 !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-dg,
.mpd-match-detail-scope .datos-classification-grid .datos-clasif-dg-cell {
  justify-content: center !important;
  font-weight: 950 !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-dg-pos {
  color: rgba(74, 222, 128, .98) !important;
  font-weight: 950;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-dg-neg {
  color: rgba(248, 113, 113, .98) !important;
  font-weight: 950;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-dg-zero {
  color: rgba(255,255,255,.72) !important;
  font-weight: 850;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-coef-cell {
  justify-content: center !important;
  color: rgba(216, 180, 254, .96);
  font-weight: 850;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-sanction-cell {
  justify-content: center !important;
  color: rgba(248, 113, 113, .95);
  font-weight: 850;
}


/* =========================================================
   DATOS · clasificación puntos
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-points,
.mpd-match-detail-scope .datos-classification-grid .datos-clasif-points-cell {
  justify-content: center !important;
  color: rgba(250, 204, 21, .98);
  font-weight: 950;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-points-badge {
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 14px;
  font-weight: 950;
  line-height: 1;
  border: 1px solid rgba(255,255,255,.34);
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.20), rgba(255,255,255,.065));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 5px 14px rgba(0,0,0,.20);
}


/* =========================================================
   DATOS · clasificación racha
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-cell {
  justify-content: center !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  overflow: visible !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-cell .ag-cell-value {
  width: 100%;
  box-sizing: border-box;
  overflow: visible !important;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  min-width: max-content;
  padding: 0 4px;
  box-sizing: border-box;
  overflow: visible;
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-badge {
  width: 27px;
  height: 27px;
  min-width: 27px;
  min-height: 27px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: white;
  font-size: 12px;
  font-weight: 950;
  line-height: 1;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 4px 10px rgba(0,0,0,.18);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-g {
  background: rgba(34,197,94,.26);
  border-color: rgba(74,222,128,.42);
  color: rgba(187,247,208,1);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-e {
  background: rgba(250,204,21,.24);
  border-color: rgba(250,204,21,.45);
  color: rgba(254,240,138,1);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-p {
  background: rgba(248,113,113,.24);
  border-color: rgba(248,113,113,.45);
  color: rgba(254,202,202,1);
}

.mpd-match-detail-scope .datos-classification-grid .datos-clasif-racha-empty {
  opacity: .55;
  font-size: 12px;
}


/* =========================================================
   DATOS · clasificación filas destacadas
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .ag-row.datos-clasif-row-top4 .ag-cell {
  background: linear-gradient(
    90deg,
    rgba(34,197,94,.075) 0%,
    rgba(34,197,94,.030) 42%,
    rgba(255,255,255,.018) 100%
  ) !important;
}

.mpd-match-detail-scope .datos-classification-grid .ag-row.datos-clasif-row-bottom .ag-cell {
  background: linear-gradient(
    90deg,
    rgba(248,113,113,.080) 0%,
    rgba(248,113,113,.030) 42%,
    rgba(255,255,255,.018) 100%
  ) !important;
}

.mpd-match-detail-scope .datos-classification-grid .ag-row.datos-clasif-row-champion .ag-cell {
  background: linear-gradient(
    90deg,
    rgba(250, 204, 21, .155) 0%,
    rgba(250, 204, 21, .060) 42%,
    rgba(255,255,255,.025) 100%
  ) !important;
  border-top: 1px solid rgba(250,204,21,.22);
  border-bottom: 1px solid rgba(250,204,21,.18);
}

.mpd-match-detail-scope .datos-classification-grid .ag-row.datos-clasif-row-champion .datos-clasif-pos-cell {
  color: rgba(250,204,21,1) !important;
}

.mpd-match-detail-scope .datos-classification-grid .ag-row-hover .ag-cell {
  background-color: rgba(255,255,255,.075) !important;
}


/* =========================================================
   DATOS · clasificación selector modo
   ========================================================= */

.mpd-match-detail-scope .datos-classif-mode-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 8px 20px rgba(0,0,0,.12);
}

.mpd-match-detail-scope .datos-classif-mode-btn {
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid transparent;
  background: transparent;
  color: rgba(255,255,255,.68);
  border-radius: 999px;
  padding: 7px 12px;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  transition:
    background .18s ease,
    color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.mpd-match-detail-scope .datos-classif-mode-btn:hover {
  color: white;
  background: rgba(255,255,255,.07);
}

.mpd-match-detail-scope .datos-classif-mode-btn.is-active {
  color: white;
  background:
    linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,.075));
  border-color: rgba(255,255,255,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 5px 14px rgba(0,0,0,.14);
}

.mpd-match-detail-scope .datos-classif-mode-btn:active {
  transform: translateY(1px);
}


/* =========================================================
   DATOS · clasificación scrollbars
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .ag-icon,
.mpd-match-detail-scope .datos-classification-grid .ag-header-icon {
  opacity: .72;
}

.mpd-match-detail-scope .datos-classification-grid .ag-body-horizontal-scroll,
.mpd-match-detail-scope .datos-classification-grid .ag-body-vertical-scroll {
  background: rgba(0,0,0,.10);
}

.mpd-match-detail-scope .datos-classification-grid ::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}

.mpd-match-detail-scope .datos-classification-grid ::-webkit-scrollbar-track {
  background: rgba(255,255,255,.025);
}

.mpd-match-detail-scope .datos-classification-grid ::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.16);
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-classification-grid ::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,.24);
}














/* =========================================================
   DATOS · clasificación clicable hacia equipo
   ========================================================= */

.mpd-match-detail-scope .datos-classification-grid .ag-row {
  cursor: pointer;
}

.mpd-match-detail-scope .datos-classification-grid .ag-row:hover .datos-clasif-team-cell {
  color: white !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.mpd-match-detail-scope .datos-classification-grid .ag-row:hover .datos-clasif-pos-cell,
.mpd-match-detail-scope .datos-classification-grid .ag-row:hover .datos-clasif-logo-cell,
.mpd-match-detail-scope .datos-classification-grid .ag-row:hover .datos-clasif-team-cell {
  background: rgba(255,255,255,.065) !important;
}

.mpd-match-detail-scope .datos-classification-grid .ag-row.ag-row-selected .ag-cell {
  background: color-mix(
    in srgb,
    var(--datos-league-accent, rgba(255,255,255,.35)) 22%,
    rgba(255,255,255,0.06)
  ) !important;
}


/* ==== FUENTE: seccion ligas/grafico evo clasificacion new.css ==== */

/* =========================================================
   DATOS · Evolución clasificación HTML/SVG
   Responsive 14" / 24"
   ========================================================= */

/* =========================================================
   Card base evolución
   ========================================================= */

.mpd-match-detail-scope .datos-classification-evo-card {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  overflow: hidden;

  color: white;

  border-radius: 18px;
  border: 1px solid rgba(255,255,255,0.075);
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,0.026) 0%,
      rgba(255,255,255,0.010) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.040),
    0 16px 34px rgba(0,0,0,0.14);
}

/* Card de un solo gráfico */
.mpd-match-detail-scope .datos-classification-evo-card--single {
  padding: 14px 16px 12px;
  margin-top: 14px;
}

/* Card dual: posiciones + puntos */
.mpd-match-detail-scope .datos-classification-evo-dual-card {
  padding: 14px 16px 12px;
  margin-top: 14px;

  border-color: rgba(255,255,255,0.080);
  background:
    radial-gradient(circle at 0% 0%, var(--datos-goals-soft, rgba(255,255,255,0.05)), transparent 34%),
    linear-gradient(
      180deg,
      rgba(255,255,255,0.026) 0%,
      rgba(255,255,255,0.010) 100%
    );
}

.mpd-match-detail-scope .datos-classification-evo-body,
.mpd-match-detail-scope .datos-classification-evo-graph-wrap {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

/* Ruta parquet inferior */
.mpd-match-detail-scope .datos-classification-evo-blob {
  font-size: 10px;
  opacity: 0.30;
  margin-top: 8px;
  word-break: break-all;
  color: white;
}


/* =========================================================
   Selector Posición / Puntos
   ========================================================= */

.mpd-match-detail-scope .datos-classif-evo-metric-switch {
  display: inline-flex;
  align-items: center;
  gap: 5px;

  padding: 4px;
  border-radius: 999px;

  background: rgba(255,255,255,0.060);
  border: 1px solid rgba(255,255,255,0.105);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.055),
    0 8px 20px rgba(0,0,0,0.12);
}

.mpd-match-detail-scope .datos-classif-evo-metric-btn {
  appearance: none;
  -webkit-appearance: none;

  border: 1px solid transparent;
  background: transparent;
  color: rgba(255,255,255,0.68);

  border-radius: 999px;

  padding: 7px 13px;

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

  cursor: pointer;

  transition:
    background .18s ease,
    color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.mpd-match-detail-scope .datos-classif-evo-metric-btn:hover {
  color: white;
  background: rgba(255,255,255,0.070);
}

.mpd-match-detail-scope .datos-classif-evo-metric-btn.is-active {
  color: white;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0.170),
      rgba(255,255,255,0.080)
    );

  border-color: rgba(255,255,255,0.185);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.110),
    0 5px 14px rgba(0,0,0,0.14);
}

/* Se mantiene para el modo single o para usos antiguos.
   En modo dual la ocultamos más abajo. */
.mpd-match-detail-scope .datos-classif-evo-static-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 7px 13px;
  border-radius: 999px;

  color: white;
  font-size: 12px;
  font-weight: 850;
  white-space: nowrap;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0.160),
      rgba(255,255,255,0.075)
    );

  border: 1px solid rgba(255,255,255,0.160);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.100),
    0 5px 14px rgba(0,0,0,0.14);
}


/* =========================================================
   Gráfico HTML/SVG base
   ========================================================= */

.mpd-match-detail-scope .datos-evo-html-chart {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  align-items: center;

  overflow: hidden;

  padding: 0;
  margin: 0;

  border: none;
  background: transparent;
  box-shadow: none;
}

/* Contenedor real del gráfico */
.mpd-match-detail-scope .datos-evo-html-chart-inner {
  position: relative;

  width: 100%;
  max-width: 1360px;

  height: clamp(440px, 31vw, 530px);
  min-height: 440px;
  max-height: 530px;

  overflow: hidden;
}

/* SVG principal */
.mpd-match-detail-scope .datos-evo-html-svg {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  display: block;
  user-select: none;
  pointer-events: none;
}

/* Capa de escudos del último punto */
.mpd-match-detail-scope .datos-evo-html-logo-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

/* Escudos finales dentro del gráfico */
.mpd-match-detail-scope .datos-evo-html-logo-btn {
  position: absolute;
  transform: translate(-50%, -50%);

  width: clamp(28px, 1.75vw, 36px);
  height: clamp(28px, 1.75vw, 36px);
  padding: 2px;

  border-radius: 999px;
  border: 1px solid var(--datos-evo-line-color-border);

  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.18), transparent 42%),
    rgba(13, 20, 32, 0.78);

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

  box-shadow:
    0 0 0 1px rgba(255,255,255,0.08),
    0 6px 15px rgba(0,0,0,0.32);

  pointer-events: auto;

  transition:
    transform .15s ease,
    opacity .15s ease,
    filter .15s ease,
    box-shadow .15s ease;
}

.mpd-match-detail-scope .datos-evo-html-logo-btn:hover {
  transform: translate(-50%, -50%) scale(1.09);
  z-index: 5;
}

.mpd-match-detail-scope .datos-evo-html-logo-btn.is-muted {
  opacity: 0.18;
  filter: grayscale(0.45);
}

.mpd-match-detail-scope .datos-evo-html-logo-btn.is-selected {
  transform: translate(-50%, -50%) scale(1.15);
  z-index: 6;

  box-shadow:
    0 0 0 2px var(--datos-evo-line-color-border),
    0 0 20px var(--datos-evo-line-color-soft),
    0 8px 18px rgba(0,0,0,0.40);
}

.mpd-match-detail-scope .datos-evo-html-logo-img {
  width: 100%;
  height: 100%;

  object-fit: contain;
  border-radius: 999px;
  display: block;
}

.mpd-match-detail-scope .datos-evo-html-logo-fallback {
  width: 100%;
  height: 100%;
  border-radius: 999px;

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

  font-size: 9px;
  font-weight: 900;
  color: white;

  background: rgba(255,255,255,0.10);
}


/* =========================================================
   Leyenda inferior de escudos
   ========================================================= */

.mpd-match-detail-scope .datos-evo-html-bottom-legend {
  width: 100%;
  max-width: 1360px;
  box-sizing: border-box;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  padding: 7px 6px 2px;
  margin-top: 2px;

  overflow-x: auto;
  overflow-y: hidden;

  scrollbar-width: thin;
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend::-webkit-scrollbar {
  height: 6px;
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.035);
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.18);
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,0.26);
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend-btn {
  appearance: none;
  -webkit-appearance: none;

  width: clamp(42px, 2.35vw, 52px);
  height: clamp(42px, 2.35vw, 52px);
  min-width: clamp(42px, 2.35vw, 52px);

  padding: 3px;

  border-radius: 999px;
  border: 1px solid var(--datos-evo-line-color-border);

  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.22), transparent 42%),
    rgba(13, 20, 32, 0.76);

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

  cursor: pointer;

  box-shadow:
    0 0 0 1px rgba(255,255,255,0.06),
    0 7px 16px rgba(0,0,0,0.30);

  transition:
    transform .15s ease,
    opacity .15s ease,
    filter .15s ease,
    border-color .15s ease,
    box-shadow .15s ease;
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend-btn:hover {
  transform: translateY(-2px) scale(1.03);
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend-btn.is-muted {
  opacity: 0.25;
  filter: grayscale(0.45);
}

.mpd-match-detail-scope .datos-evo-html-bottom-legend-btn.is-selected {
  transform: translateY(-2px) scale(1.09);

  box-shadow:
    0 0 0 2px var(--datos-evo-line-color-border),
    0 0 20px var(--datos-evo-line-color-soft),
    0 9px 20px rgba(0,0,0,0.36);
}

.mpd-match-detail-scope .datos-evo-html-bottom-logo {
  width: 100%;
  height: 100%;

  object-fit: contain;
  border-radius: 999px;
  display: block;
}

.mpd-match-detail-scope .datos-evo-html-bottom-fallback {
  width: 100%;
  height: 100%;
  border-radius: 999px;

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

  font-size: 10px;
  font-weight: 900;
  color: white;

  background: rgba(255,255,255,0.10);
}


/* =========================================================
   Modo dual: dos gráficos dentro de un único contenedor
   ========================================================= */

.mpd-match-detail-scope .datos-classification-evo-dual-grid {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;

  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
}

.mpd-match-detail-scope .datos-classification-evo-dual-panel {
  min-width: 0;
  width: 100%;
  box-sizing: border-box;

  display: flex;
  flex-direction: column;

  padding: 0;

  border: none;
  background: transparent;
}

.mpd-match-detail-scope .datos-classification-evo-dual-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;

  margin-bottom: 2px;
  min-width: 0;
}

.mpd-match-detail-scope .datos-classification-evo-dual-panel-text {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.mpd-match-detail-scope .datos-classification-evo-dual-panel-title {
  color: white;
  font-size: 15px;
  font-weight: 900;
  line-height: 1.1;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-classification-evo-dual-panel-subtitle {
  color: white;
  opacity: 0.68;

  font-size: 11px;
  font-weight: 650;

  margin-top: 3px;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Por si queda alguna pill antigua dentro del modo dual */
.mpd-match-detail-scope .datos-classification-evo-dual-panel-head .datos-classif-evo-static-badge {
  display: none !important;
}

.mpd-match-detail-scope .datos-classification-evo-dual-chart-shell {
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
}

/* En modo dual bajamos altura para que no quede gigante */
.mpd-match-detail-scope .datos-classification-evo-dual-panel .datos-evo-html-chart-inner {
  max-width: none;

  height: clamp(350px, 18.6vw, 430px);
  min-height: 350px;
  max-height: 430px;
}

/* En modo dual NO queremos leyenda dentro de cada gráfico */
.mpd-match-detail-scope .datos-classification-evo-dual-panel .datos-evo-html-bottom-legend {
  display: none;
}

/* Leyenda compartida bajo ambos gráficos */
.mpd-match-detail-scope .datos-evo-html-bottom-legend--shared {
  width: max-content;
  max-width: 100%;
  box-sizing: border-box;

  margin: 2px auto 0;
  padding: 5px 8px 2px;

  border-top: none;

  justify-content: flex-start;
  gap: 13px;

  flex-wrap: nowrap;
}

/* Escudos algo más grandes en la leyenda compartida */
.mpd-match-detail-scope .datos-evo-html-bottom-legend--shared .datos-evo-html-bottom-legend-btn {
  width: clamp(45px, 2.45vw, 56px);
  height: clamp(45px, 2.45vw, 56px);
  min-width: clamp(45px, 2.45vw, 56px);
}


/* =========================================================
   Modo single: un gráfico con contenedor
   ========================================================= */

.mpd-match-detail-scope .datos-classification-evo-card--single .datos-evo-html-chart-inner {
  height: clamp(445px, 32vw, 540px);
  min-height: 445px;
  max-height: 540px;
}

.mpd-match-detail-scope .datos-classification-evo-card--single .datos-evo-html-bottom-legend {
  margin-top: 4px;
}


/* =========================================================
   Responsive portátil / 14 pulgadas
   ========================================================= */

@media (max-width: 1500px) {
  .mpd-match-detail-scope .datos-classification-evo-dual-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
  }

  .mpd-match-detail-scope .datos-classification-evo-dual-panel .datos-evo-html-chart-inner {
    height: clamp(430px, 38vw, 520px);
    min-height: 430px;
    max-height: 520px;
  }

  .mpd-match-detail-scope .datos-evo-html-bottom-legend--shared {
    justify-content: flex-start;
    gap: 11px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 1400px) {
  .mpd-match-detail-scope .datos-classification-evo-card--single,
  .mpd-match-detail-scope .datos-classification-evo-dual-card {
    padding: 12px 12px 10px;
  }

  .mpd-match-detail-scope .datos-evo-html-chart-inner {
    max-width: 100%;
  }

  .mpd-match-detail-scope .datos-evo-html-bottom-legend {
    max-width: 100%;
  }
}

@media (max-width: 900px) {
  .mpd-match-detail-scope .datos-classification-evo-card--single,
  .mpd-match-detail-scope .datos-classification-evo-dual-card {
    padding: 10px 10px 9px;
    border-radius: 16px;
  }

  .mpd-match-detail-scope .datos-evo-html-chart-inner,
  .mpd-match-detail-scope .datos-classification-evo-card--single .datos-evo-html-chart-inner,
  .mpd-match-detail-scope .datos-classification-evo-dual-panel .datos-evo-html-chart-inner {
    height: 430px;
    min-height: 430px;
    max-height: 430px;
  }

  .mpd-match-detail-scope .datos-evo-html-logo-btn {
    width: 27px;
    height: 27px;
    padding: 2px;
  }

  .mpd-match-detail-scope .datos-evo-html-bottom-legend {
    justify-content: flex-start;
    gap: 9px;
    padding-top: 7px;
  }

  .mpd-match-detail-scope .datos-evo-html-bottom-legend--shared {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    justify-content: flex-start;
  }

  .mpd-match-detail-scope .datos-evo-html-bottom-legend-btn,
  .mpd-match-detail-scope .datos-evo-html-bottom-legend--shared .datos-evo-html-bottom-legend-btn {
    width: 39px;
    height: 39px;
    min-width: 39px;
  }

  .mpd-match-detail-scope .datos-classification-evo-dual-panel-head {
    align-items: center;
  }

  .mpd-match-detail-scope .datos-classification-evo-dual-panel-title {
    font-size: 14px;
  }

  .mpd-match-detail-scope .datos-classification-evo-dual-panel-subtitle {
    font-size: 10px;
  }
}


/* =========================================================
   Pantallas grandes
   ========================================================= */

@media (min-width: 1700px) {
  .mpd-match-detail-scope .datos-evo-html-chart-inner,
  .mpd-match-detail-scope .datos-evo-html-bottom-legend {
    max-width: 1380px;
  }

  .mpd-match-detail-scope .datos-classification-evo-dual-panel .datos-evo-html-chart-inner {
    max-width: none;
  }

  .mpd-match-detail-scope .datos-evo-html-bottom-legend--shared {
    max-width: 100%;
  }
}

@media (min-width: 2100px) {
  .mpd-match-detail-scope .datos-evo-html-chart-inner,
  .mpd-match-detail-scope .datos-evo-html-bottom-legend {
    max-width: 1440px;
  }

  .mpd-match-detail-scope .datos-classification-evo-dual-panel .datos-evo-html-chart-inner {
    max-width: none;
  }

  .mpd-match-detail-scope .datos-evo-html-bottom-legend--shared {
    max-width: 100%;
  }
}


/* ==== FUENTE: seccion ligas/graficos de insights.css ==== */

/* =========================================================
   DATOS · Insights · Rendimiento equipos
   HTML/SVG maps + Casa/Fuera cards
   ========================================================= */

.mpd-match-detail-scope .datos-teams-goals-section{
  width: 100%;
  min-width: 0;
  margin-top: 0;
  color: white;
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-teams-goals-section *{
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-teams-goals-head{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 4px;

  margin-bottom: 12px;
  padding-top: 0;
}

.mpd-match-detail-scope .datos-teams-goals-title{
  font-size: 17px;
  font-weight: 950;
  color: white;
  letter-spacing: .2px;
  line-height: 1.1;
}

.mpd-match-detail-scope .datos-teams-goals-subtitle{
  display: block;
  font-size: 11px;
  line-height: 1.35;
  color: rgba(255,255,255,.54);
  font-weight: 650;
}


/* =========================================================
   Grid principal mapas
   - general
   - casa
   - fuera
   ========================================================= */

.mpd-match-detail-scope .datos-teams-goals-grid{
  display: grid;
  width: 100%;
  min-width: 0;
  gap: 14px;
  align-items: stretch;
}

.mpd-match-detail-scope .datos-teams-goals-grid--two{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mpd-match-detail-scope .datos-teams-goals-grid--three{
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mpd-match-detail-scope .datos-teams-goals-grid.is-selection-mode .datos-teams-goals-card{
  border-color: color-mix(
    in srgb,
    var(--datos-goals-accent) 42%,
    rgba(255,255,255,.10)
  );
}


/* =========================================================
   Cards base
   ========================================================= */

.mpd-match-detail-scope .datos-teams-goals-card{
  min-width: 0;
  overflow: hidden;

  border-radius: 20px;
  border: 1px solid color-mix(
    in srgb,
    var(--datos-goals-accent) 34%,
    transparent
  );

  background:
    radial-gradient(
      circle at 18% 0%,
      var(--datos-goals-soft),
      transparent 44%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.070),
      rgba(255,255,255,.026)
    );

  box-shadow:
    0 16px 42px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.07);

  display: flex;
  flex-direction: column;
}

.mpd-match-detail-scope .datos-teams-goals-card--map{
  min-height: 428px;
}

.mpd-match-detail-scope .datos-teams-record-card{
  width: 100%;
  min-width: 0;

  margin-top: 14px;

  height: 430px;
  max-height: 430px;
  min-height: 430px;

  display: flex;
  flex-direction: column;
}

.mpd-match-detail-scope .datos-teams-goals-card-head{
  padding: 13px 15px 10px;

  border-bottom: 1px solid rgba(255,255,255,.075);

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.045),
      rgba(255,255,255,.015)
    );

  flex: 0 0 auto;
}

.mpd-match-detail-scope .datos-teams-goals-card-title{
  font-size: 14px;
  font-weight: 950;
  color: white;
  line-height: 1.1;
  letter-spacing: .15px;
}

.mpd-match-detail-scope .datos-teams-goals-card-subtitle{
  display: block;
  margin-top: 4px;

  font-size: 11px;
  line-height: 1.35;
  color: rgba(255,255,255,.54);
  font-weight: 650;
}

.mpd-match-detail-scope .datos-teams-goals-card-cols{
  display: none;
}


/* =========================================================
   Mapas GF/GC HTML/SVG
   ========================================================= */

.mpd-match-detail-scope .datos-goals-html-chart{
  width: 100%;
  min-width: 0;

  display: flex;
  flex-direction: column;
  align-items: center;

  padding: 0;
  margin: 0;

  overflow: hidden;

  background: transparent;
  border: none;
  box-shadow: none;
}

.mpd-match-detail-scope .datos-goals-html-chart-inner{
  position: relative;

  width: 100%;
  max-width: 100%;

  height: 350px;
  min-height: 350px;

  overflow: hidden;

  background:
    radial-gradient(
      circle at 50% 42%,
      rgba(255,255,255,.026),
      transparent 48%
    );
}

.mpd-match-detail-scope .datos-goals-html-svg{
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  display: block;

  user-select: none;
  pointer-events: none;
}

.mpd-match-detail-scope .datos-goals-html-logo-layer{
  position: absolute;
  inset: 0;

  pointer-events: none;
}

.mpd-match-detail-scope .datos-goals-html-logo-btn{
  appearance: none;
  -webkit-appearance: none;

  position: absolute;
  transform: translate(-50%, -50%);

  width: clamp(34px, 2.15vw, 46px);
  height: clamp(34px, 2.15vw, 46px);
  padding: 3px;

  border-radius: 999px;
  border: 1px solid var(--datos-goals-team-color-border, rgba(255,255,255,.24));

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255,255,255,.23),
      transparent 42%
    ),
    rgba(13, 20, 32, .80);

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

  cursor: pointer;
  pointer-events: auto;

  box-shadow:
    0 0 0 1px rgba(255,255,255,.07),
    0 8px 18px rgba(0,0,0,.34);

  transition:
    transform .15s ease,
    opacity .15s ease,
    filter .15s ease,
    border-color .15s ease,
    box-shadow .15s ease,
    background .15s ease;
}

.mpd-match-detail-scope .datos-goals-html-logo-btn:hover{
  transform: translate(-50%, -50%) scale(1.10);
  z-index: 10;

  box-shadow:
    0 0 0 1px rgba(255,255,255,.12),
    0 0 18px var(--datos-goals-team-color-soft, rgba(255,255,255,.16)),
    0 10px 24px rgba(0,0,0,.42);
}

.mpd-match-detail-scope .datos-goals-html-logo-btn.is-muted{
  opacity: .20;
  filter: grayscale(.48);
}

.mpd-match-detail-scope .datos-goals-html-logo-btn.is-selected{
  transform: translate(-50%, -50%) scale(1.16);
  z-index: 12;

  border-color: var(--datos-goals-team-color-border, rgba(255,255,255,.72));

  box-shadow:
    0 0 0 2px var(--datos-goals-team-color-border, rgba(255,255,255,.45)),
    0 0 22px var(--datos-goals-team-color-soft, rgba(255,255,255,.20)),
    0 10px 26px rgba(0,0,0,.44);
}

.mpd-match-detail-scope .datos-goals-html-logo-img{
  width: 100%;
  height: 100%;

  object-fit: contain;
  border-radius: 999px;
  display: block;
}

.mpd-match-detail-scope .datos-goals-html-logo-fallback{
  width: 100%;
  height: 100%;

  border-radius: 999px;

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

  font-size: 10px;
  font-weight: 950;
  color: white;

  background:
    radial-gradient(
      circle at 50% 20%,
      rgba(255,255,255,.16),
      rgba(255,255,255,.055)
    );
}


/* =========================================================
   Modo selección
   ========================================================= */

.mpd-match-detail-scope .datos-teams-goals-section.is-selection-mode .datos-goals-html-logo-btn:not(.is-selected){
  opacity: .22;
}

.mpd-match-detail-scope .datos-teams-goals-section.is-selection-mode .datos-goals-html-logo-btn.is-selected{
  opacity: 1;
}


/* =========================================================
   Compatibilidad por si queda algún dcc.Graph antiguo
   ========================================================= */

.mpd-match-detail-scope .datos-teams-goals-graph{
  width: 100%;
  height: 350px;
  min-height: 350px;
}

.mpd-match-detail-scope .datos-teams-goals-graph .js-plotly-plot,
.mpd-match-detail-scope .datos-teams-goals-graph .plotly{
  width: 100% !important;
}

.mpd-match-detail-scope .datos-teams-record-graph{
  min-height: 390px;
}


/* =========================================================
   Estados vacíos
   ========================================================= */

.mpd-match-detail-scope .datos-teams-goals-empty{
  min-height: 330px;

  display: flex;
  flex-direction: column;
  justify-content: center;

  padding: 18px;
  box-sizing: border-box;

  color: white;
  text-align: center;

  background: rgba(255,255,255,.025);
}

.mpd-match-detail-scope .datos-teams-goals-empty-main{
  font-size: 13px;
  font-weight: 850;
  opacity: .82;
}

.mpd-match-detail-scope .datos-teams-goals-empty-sub{
  margin-top: 6px;

  font-size: 11px;
  line-height: 1.35;
  opacity: .52;
}

.mpd-match-detail-scope .datos-teams-goals-blob{
  display: none;
}


/* =========================================================
   Casa / Fuera · Cards con escudos
   ========================================================= */

.mpd-match-detail-scope .datos-teams-record-card > .datos-teams-goals-card-head{
  flex: 0 0 auto;
}

.mpd-match-detail-scope .datos-team-form-list{
  padding: 13px;

  display: flex;
  flex-direction: column;
  gap: 11px;

  flex: 1 1 auto;

  min-height: 0;
  max-height: none;
  height: auto;

  overflow-y: auto;
  overflow-x: hidden;

  align-items: stretch;

  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) transparent;
}

.mpd-match-detail-scope .datos-team-form-list::-webkit-scrollbar{
  width: 7px;
}

.mpd-match-detail-scope .datos-team-form-list::-webkit-scrollbar-track{
  background: transparent;
}

.mpd-match-detail-scope .datos-team-form-list::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.18);
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-team-form-list::-webkit-scrollbar-thumb:hover{
  background: rgba(255,255,255,.26);
}

.mpd-match-detail-scope .datos-team-form-legend{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;

  padding: 0 2px 2px;
  margin-bottom: 1px;

  flex: 0 0 auto;
}

.mpd-match-detail-scope .datos-team-form-legend-item{
  display: inline-flex;
  align-items: center;
  gap: 5px;

  font-size: 10px;
  font-weight: 850;
  color: rgba(255,255,255,.62);

  text-transform: uppercase;
  letter-spacing: .35px;
}

.mpd-match-detail-scope .datos-team-form-legend-dot{
  width: 8px;
  height: 8px;

  border-radius: 999px;
  display: inline-block;
}

.mpd-match-detail-scope .datos-team-form-legend-dot--win{
  background: linear-gradient(180deg, #42e071, #15803d);
  box-shadow: 0 0 10px rgba(34,197,94,.32);
}

.mpd-match-detail-scope .datos-team-form-legend-dot--draw{
  background: linear-gradient(180deg, #facc15, #a16207);
  box-shadow: 0 0 10px rgba(234,179,8,.28);
}

.mpd-match-detail-scope .datos-team-form-legend-dot--loss{
  background: linear-gradient(180deg, #fb7185, #b91c1c);
  box-shadow: 0 0 10px rgba(239,68,68,.28);
}

.mpd-match-detail-scope .datos-team-form-card{
  position: relative;
  overflow: hidden;

  flex: 0 0 auto;

  min-height: 112px;

  padding: 12px 13px;

  border-radius: 17px;

  background:
    radial-gradient(
      circle at 0% 0%,
      color-mix(in srgb, var(--datos-goals-accent) 14%, transparent),
      transparent 42%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.065),
      rgba(255,255,255,.028)
    );

  border: 1px solid rgba(255,255,255,.085);

  box-shadow:
    0 10px 26px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.055);
}

.mpd-match-detail-scope .datos-team-form-card::before{
  content: "";

  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;

  width: 3px;

  border-radius: 999px;

  background: var(--datos-goals-accent);
  opacity: .72;
}

.mpd-match-detail-scope .datos-team-form-top{
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;

  margin-bottom: 11px;
  min-height: 42px;

  flex: 0 0 auto;
}

.mpd-match-detail-scope .datos-team-form-shield-wrap{
  width: 42px;
  height: 42px;
  flex: 0 0 42px;

  border-radius: 999px;

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

  background:
    radial-gradient(
      circle at 50% 20%,
      rgba(255,255,255,.16),
      rgba(255,255,255,.04)
    );

  border: 1px solid rgba(255,255,255,.13);

  box-shadow:
    0 8px 18px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.10);

  overflow: hidden;
}

.mpd-match-detail-scope .datos-team-form-shield{
  width: 32px;
  height: 32px;

  object-fit: contain;
  display: block;
}

.mpd-match-detail-scope .datos-team-form-fallback{
  width: 100%;
  height: 100%;

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

  font-size: 11px;
  font-weight: 950;
  color: white;

  background: rgba(255,255,255,.06);
}

.mpd-match-detail-scope .datos-team-form-team-text{
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-form-name{
  font-size: 13px;
  font-weight: 950;
  color: white;
  line-height: 1.15;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-team-form-meta{
  margin-top: 3px;

  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,.48);

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-team-form-position{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 34px;
  height: 26px;

  padding: 0 8px;

  border-radius: 999px;

  font-size: 11px;
  font-weight: 950;
  color: white;

  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
}

.mpd-match-detail-scope .datos-team-form-bars{
  display: flex;
  flex-direction: column;
  gap: 8px;

  flex: 0 0 auto;
}

.mpd-match-detail-scope .datos-team-form-row{
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) 82px;
  align-items: center;
  gap: 9px;

  min-height: 18px;
}

.mpd-match-detail-scope .datos-team-form-side{
  font-size: 10px;
  font-weight: 950;
  color: rgba(255,255,255,.66);

  text-transform: uppercase;
  letter-spacing: .45px;
}

.mpd-match-detail-scope .datos-team-form-bar-shell{
  height: 14px;

  border-radius: 999px;
  overflow: hidden;

  display: flex;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.070),
      rgba(255,255,255,.030)
    );

  border: 1px solid rgba(255,255,255,.085);

  box-shadow:
    inset 0 2px 7px rgba(0,0,0,.28);
}

.mpd-match-detail-scope .datos-team-form-segment{
  height: 100%;
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-form-segment--win{
  background: linear-gradient(90deg, #15803d, #22c55e);
  box-shadow: 0 0 12px rgba(34,197,94,.26);
}

.mpd-match-detail-scope .datos-team-form-segment--draw{
  background: linear-gradient(90deg, #a16207, #eab308);
  box-shadow: 0 0 12px rgba(234,179,8,.22);
}

.mpd-match-detail-scope .datos-team-form-segment--loss{
  background: linear-gradient(90deg, #b91c1c, #ef4444);
  box-shadow: 0 0 12px rgba(239,68,68,.22);
}

.mpd-match-detail-scope .datos-team-form-segment--empty{
  width: 100%;

  background:
    repeating-linear-gradient(
      45deg,
      rgba(255,255,255,.055),
      rgba(255,255,255,.055) 5px,
      rgba(255,255,255,.025) 5px,
      rgba(255,255,255,.025) 10px
    );
}

.mpd-match-detail-scope .datos-team-form-numbers{
  font-size: 10px;
  font-weight: 850;
  color: rgba(255,255,255,.72);

  text-align: right;
  white-space: nowrap;
}

.mpd-match-detail-scope .datos-team-form-pj{
  opacity: .42;
  font-weight: 800;
}


/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 1450px){
  .mpd-match-detail-scope .datos-teams-goals-grid--three{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/*
   Aquí estaba el problema:
   antes, al pasar a 1 columna, cada mapa ocupaba todo el ancho.
   Ahora, cuando solo cabe uno por fila, se centra y se limita el ancho.
*/
@media (max-width: 1200px) and (min-width: 641px){
  .mpd-match-detail-scope .datos-teams-goals-grid,
  .mpd-match-detail-scope .datos-teams-goals-grid--two,
  .mpd-match-detail-scope .datos-teams-goals-grid--three{
    grid-template-columns: minmax(0, min(100%, 780px));
    justify-content: center;
    justify-items: stretch;
  }

  .mpd-match-detail-scope .datos-teams-goals-card--map{
    width: 100%;
    max-width: 780px;
    min-height: 0;
    margin-left: auto;
    margin-right: auto;
  }

  .mpd-match-detail-scope .datos-goals-html-chart-inner{
    width: 100%;
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .mpd-match-detail-scope .datos-goals-html-logo-btn{
    width: clamp(36px, 4vw, 44px);
    height: clamp(36px, 4vw, 44px);
  }

  .mpd-match-detail-scope .datos-teams-goals-graph{
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }

  .mpd-match-detail-scope .datos-teams-record-card{
    height: auto;
    max-height: none;
    min-height: 0;
  }

  .mpd-match-detail-scope .datos-team-form-list{
    max-height: none;
    height: auto;
    overflow-y: visible;
  }
}

@media (max-width: 640px){
  .mpd-match-detail-scope .datos-teams-goals-section{
    margin-top: 0;
  }

  .mpd-match-detail-scope .datos-teams-goals-grid,
  .mpd-match-detail-scope .datos-teams-goals-grid--two,
  .mpd-match-detail-scope .datos-teams-goals-grid--three{
    grid-template-columns: minmax(0, 1fr);
  }

  .mpd-match-detail-scope .datos-teams-goals-card{
    border-radius: 17px;
  }

  .mpd-match-detail-scope .datos-teams-goals-card--map{
    min-height: 0;
  }

  .mpd-match-detail-scope .datos-teams-goals-card-head{
    padding: 12px 13px 9px;
  }

  .mpd-match-detail-scope .datos-teams-goals-card-title{
    font-size: 13px;
  }

  .mpd-match-detail-scope .datos-teams-goals-card-subtitle{
    font-size: 10px;
  }

  .mpd-match-detail-scope .datos-goals-html-chart-inner{
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 10;
  }

  .mpd-match-detail-scope .datos-goals-html-logo-btn{
    width: 32px;
    height: 32px;
    padding: 2px;
  }

  .mpd-match-detail-scope .datos-teams-goals-graph{
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 10;
  }

  .mpd-match-detail-scope .datos-team-form-top{
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .mpd-match-detail-scope .datos-team-form-shield-wrap{
    width: 38px;
    height: 38px;
    flex-basis: 38px;
  }

  .mpd-match-detail-scope .datos-team-form-shield{
    width: 29px;
    height: 29px;
  }

  .mpd-match-detail-scope .datos-team-form-position{
    display: none;
  }

  .mpd-match-detail-scope .datos-team-form-row{
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .mpd-match-detail-scope .datos-team-form-numbers{
    grid-column: 2 / 3;
    text-align: left;
    margin-top: -3px;
  }
}

@media (min-width: 1700px){
  .mpd-match-detail-scope .datos-goals-html-chart-inner{
    height: 370px;
    min-height: 370px;
  }

  .mpd-match-detail-scope .datos-teams-goals-card--map{
    min-height: 448px;
  }
}

@media (min-width: 2100px){
  .mpd-match-detail-scope .datos-goals-html-chart-inner{
    height: 390px;
    min-height: 390px;
  }

  .mpd-match-detail-scope .datos-teams-goals-card--map{
    min-height: 470px;
  }

  .mpd-match-detail-scope .datos-goals-html-logo-btn{
    width: 48px;
    height: 48px;
  }
}

































/* =========================================================
   DATOS · Insights · Rendimiento casa/fuera en barras
   Versión con escudos en eje X + iconos local/visitante
   Pegar al FINAL del CSS de datos_page
   ========================================================= */

.mpd-match-detail-scope .datos-home-away-bars-card{
  width: 100%;
  min-width: 0;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin-top: 14px;
  overflow: hidden;
}

.mpd-match-detail-scope .datos-home-away-bars-head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.mpd-match-detail-scope .datos-home-away-bars-title-block{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.mpd-match-detail-scope .datos-home-away-bars-controls{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}

/* Mismo look base que el dropdown de grupos, ajustado al ancho de esta zona */
.mpd-match-detail-scope .datos-home-away-dropdown{
  width: 160px;
  min-width: 160px;
  max-width: 190px;
}

.mpd-match-detail-scope .datos-home-away-dropdown--sort{
  width: 205px;
  min-width: 205px;
  max-width: 235px;
}

/* También afecta a los dropdowns de orden de Equipos / Temporada,
   porque ahora comparten clases con los de este gráfico. */
.mpd-match-detail-scope .datos-team-filter-sort.datos-home-away-dropdown--sort{
  width: 205px;
  min-width: 205px;
  max-width: 235px;
}

.mpd-match-detail-scope .datos-home-away-bars-body{
  width: 100%;
  min-width: 0;
  padding: 12px 13px 14px;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.mpd-match-detail-scope .datos-home-away-legend,
.mpd-match-detail-scope .datos-home-away-side-legend{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: 0;
  flex-wrap: wrap;
}

.mpd-match-detail-scope .datos-home-away-legend{
  padding: 0 2px;
}

.mpd-match-detail-scope .datos-home-away-side-legend{
  margin-top: -2px;
  color: rgba(255,255,255,.58);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .35px;
}

.mpd-match-detail-scope .datos-home-away-legend-item,
.mpd-match-detail-scope .datos-home-away-side-legend-item{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 10px;
  font-weight: 900;
  color: rgba(255,255,255,.66);
  text-transform: uppercase;
  letter-spacing: .35px;
}

.mpd-match-detail-scope .datos-home-away-legend-dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  display: inline-block;
}

.mpd-match-detail-scope .datos-home-away-legend-dot--win{
  background: linear-gradient(180deg, #42e071, #15803d);
  box-shadow: 0 0 10px rgba(34,197,94,.30);
}

.mpd-match-detail-scope .datos-home-away-legend-dot--draw{
  background: linear-gradient(180deg, #facc15, #a16207);
  box-shadow: 0 0 10px rgba(234,179,8,.26);
}

.mpd-match-detail-scope .datos-home-away-legend-dot--loss{
  background: linear-gradient(180deg, #fb7185, #b91c1c);
  box-shadow: 0 0 10px rgba(239,68,68,.26);
}

.mpd-match-detail-scope .datos-home-away-legend-dot--gf{
  background: linear-gradient(180deg, #67e8f9, #0284c7);
  box-shadow: 0 0 10px rgba(56,189,248,.28);
}

.mpd-match-detail-scope .datos-home-away-legend-dot--gc{
  background: linear-gradient(180deg, #fb7185, #be123c);
  box-shadow: 0 0 10px rgba(244,63,94,.28);
}

/* Compatibilidad por si queda algún chip C/F antiguo renderizado */
.mpd-match-detail-scope .datos-home-away-side-chip{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 950;
  color: white;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
}

.mpd-match-detail-scope .datos-home-away-side-label{
  line-height: 1;
}

.mpd-match-detail-scope .datos-home-away-side-legend-img{
  width: 18px;
  height: 18px;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.28));
}

.mpd-match-detail-scope .datos-home-away-bars-scroll{
  width: 100%;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 0 4px;
  border-radius: 15px;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.028), transparent 46%),
    rgba(255,255,255,.016);
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.22) transparent;
}

.mpd-match-detail-scope .datos-home-away-bars-scroll::-webkit-scrollbar{
  height: 8px;
}

.mpd-match-detail-scope .datos-home-away-bars-scroll::-webkit-scrollbar-track{
  background: transparent;
}

.mpd-match-detail-scope .datos-home-away-bars-scroll::-webkit-scrollbar-thumb{
  background: rgba(255,255,255,.18);
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-home-away-bars-scroll::-webkit-scrollbar-thumb:hover{
  background: rgba(255,255,255,.28);
}

.mpd-match-detail-scope .datos-home-away-bars-plot{
  position: relative;
  display: block;
  max-width: none;
}

.mpd-match-detail-scope .datos-home-away-bars-svg{
  position: absolute;
  inset: 0;
  display: block;
  max-width: none;
  user-select: none;
  pointer-events: auto;
}

.mpd-match-detail-scope .datos-home-away-bars-overlay{
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.mpd-match-detail-scope .datos-home-away-side-axis-img{
  position: absolute;
  transform: translate(-50%, -50%);
  width: 17px;
  height: 17px;
  object-fit: contain;
  display: block;
  pointer-events: auto;
  filter:
    drop-shadow(0 3px 6px rgba(0,0,0,.36))
    drop-shadow(0 0 5px rgba(255,255,255,.08));
  opacity: .88;
}

.mpd-match-detail-scope .datos-home-away-side-axis-img--home{
  opacity: .92;
}

.mpd-match-detail-scope .datos-home-away-side-axis-img--away{
  opacity: .82;
}

.mpd-match-detail-scope .datos-home-away-team-axis-shield-wrap{
  position: absolute;
  transform: translate(-50%, -50%);
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.22), transparent 43%),
    rgba(11,18,30,.84);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.055),
    0 8px 17px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.08);
  pointer-events: auto;
}

.mpd-match-detail-scope .datos-home-away-team-axis-shield-img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-home-away-team-axis-shield-fallback{
  width: 100%;
  height: 100%;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 950;
  color: white;
  background:
    radial-gradient(circle at 50% 20%, rgba(255,255,255,.16), rgba(255,255,255,.055));
}

.mpd-match-detail-scope .datos-home-away-team-axis-pos{
  position: absolute;
  transform: translate(-50%, -50%);
  min-width: 25px;
  height: 17px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 950;
  color: rgba(255,255,255,.54);
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.07);
  pointer-events: none;
}

@media (max-width: 900px){
  .mpd-match-detail-scope .datos-home-away-bars-head{
    align-items: flex-start;
  }

  .mpd-match-detail-scope .datos-home-away-bars-controls{
    width: 100%;
    justify-content: flex-start;
  }

  .mpd-match-detail-scope .datos-home-away-dropdown,
  .mpd-match-detail-scope .datos-home-away-dropdown--sort,
  .mpd-match-detail-scope .datos-team-filter-sort.datos-home-away-dropdown--sort{
    width: min(100%, 220px);
    min-width: 180px;
    max-width: 100%;
  }

  .mpd-match-detail-scope .datos-home-away-legend,
  .mpd-match-detail-scope .datos-home-away-side-legend{
    justify-content: flex-start;
  }
}

@media (max-width: 640px){
  .mpd-match-detail-scope .datos-home-away-bars-body{
    padding: 11px;
  }

  .mpd-match-detail-scope .datos-home-away-bars-controls{
    gap: 8px;
  }

  .mpd-match-detail-scope .datos-home-away-dropdown,
  .mpd-match-detail-scope .datos-home-away-dropdown--sort,
  .mpd-match-detail-scope .datos-team-filter-sort.datos-home-away-dropdown--sort{
    width: 100%;
    min-width: 0;
  }

  .mpd-match-detail-scope .datos-home-away-team-axis-shield-wrap{
    width: 34px;
    height: 34px;
    padding: 3px;
  }

  .mpd-match-detail-scope .datos-home-away-side-axis-img{
    width: 15px;
    height: 15px;
  }
}

/* =========================================================
   DATOS · Insights · Casa/Fuera
   Leyenda completa en una sola fila
   ========================================================= */

.mpd-match-detail-scope .datos-home-away-legend-row{
  width: 100%;
  min-width: 0;

  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;

  padding: 0 2px 2px;
  margin-top: -1px;
  margin-bottom: 1px;

  flex-wrap: nowrap;
}

.mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-legend,
.mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-side-legend{
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  min-width: 0;
  flex-wrap: nowrap;
  padding: 0;
  margin: 0;
}

.mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-legend--metric{
  padding-right: 3px;
  margin-right: 2px;
}

.mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-side-legend{
  color: rgba(255,255,255,.62);
  font-size: 10px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .35px;
}

.mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-legend-item,
.mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-side-legend-item{
  flex: 0 0 auto;
  white-space: nowrap;
}

@media (max-width: 900px){
  .mpd-match-detail-scope .datos-home-away-legend-row{
    justify-content: flex-start;
    flex-wrap: wrap;
    row-gap: 6px;
  }

  .mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-legend,
  .mpd-match-detail-scope .datos-home-away-legend-row .datos-home-away-side-legend{
    justify-content: flex-start;
    flex-wrap: nowrap;
  }
}


/* =========================================================
   DATOS · Insights · Casa/Fuera
   Mantener gráfico centrado cuando sobra espacio
   ========================================================= */

.mpd-match-detail-scope .datos-home-away-bars-scroll{
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}

.mpd-match-detail-scope .datos-home-away-bars-plot{
  margin-left: auto !important;
  margin-right: auto !important;
}



/* ==== FUENTE: seccion equipos/GRID JUGADORES.css ==== */

/* =========================================================
   DATOS · TEAM DETAIL
   ========================================================= */

.mpd-match-detail-scope .datos-team-body-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.36fr) minmax(0, 1fr);
  gap: 16px;
  align-items: start;

  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-team-info-panel,
.mpd-match-detail-scope .datos-team-players-panel {
  min-width: 0;
  width: 100%;
}



/* =========================================================
   DATOS · TEAM DETAIL · BLOQUE ÚNICO HEADER + CONTENIDO
   ========================================================= */

.mpd-match-detail-scope .datos-team-content-shell {
  width: 100%;
  min-width: 0;

  margin-top: 12px;

  color: white;

  border-radius: 22px;

  background:
    linear-gradient(
      180deg,
      var(--datos-team-soft, rgba(255,255,255,.055)) 0%,
      rgba(255,255,255,.024) 100%
    );

  border: 1px solid
    color-mix(
      in srgb,
      var(--datos-team-accent, rgba(255,255,255,.35)) 24%,
      rgba(255,255,255,.10)
    );

  box-shadow:
    0 18px 40px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.045);

  overflow: hidden;
}

/* Header del equipo pegado al bloque */
.mpd-match-detail-scope .datos-team-content-shell > .datos-team-header-card {
  margin: 0 !important;

  border-radius: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;

  background:
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        var(--datos-team-accent, rgba(255,255,255,.35)) 12%,
        rgba(255,255,255,.040)
      ) 0%,
      rgba(255,255,255,.020) 100%
    ) !important;

  box-shadow: none !important;
}

/* Contenido de la tab dentro del mismo bloque */
.mpd-match-detail-scope .datos-team-content-body {
  width: 100%;
  min-width: 0;

  padding: 14px;

  box-sizing: border-box;

  background: rgba(0,0,0,.035);
}

/* Quitamos separación visual extra del primer hijo */
.mpd-match-detail-scope .datos-team-content-body > div {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* Si el contenido trae card propia, la hacemos respirar dentro del bloque */
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-card,
.mpd-match-detail-scope .datos-team-content-body .datos-team-matches-card,
.mpd-match-detail-scope .datos-team-content-body .datos-league-embedded-card {
  margin: 0 !important;
  border-radius: 18px !important;
}

/* Evita doble sombra demasiado fuerte dentro del bloque */
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-card,
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-panel > div {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 10px 24px rgba(0,0,0,.12) !important;
}


@media (max-width: 760px) {
  .mpd-match-detail-scope .datos-team-content-body {
    padding: 12px;
  }

  .mpd-match-detail-scope .datos-team-content-shell {
    border-radius: 18px;
  }
}


/* =========================================================
   DATOS · CARD JUGADORES
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-card,
.mpd-match-detail-scope .datos-team-players-panel > div {
  position: relative;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;

  overflow: hidden;
  color: white;

  box-shadow:
    0 18px 40px rgba(0, 0, 0, 0.20),
    inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.mpd-match-detail-scope .datos-team-players-card,
.mpd-match-detail-scope .datos-team-players-card *,
.mpd-match-detail-scope .datos-team-players-panel > div,
.mpd-match-detail-scope .datos-team-players-panel > div * {
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-team-players-card::before,
.mpd-match-detail-scope .datos-team-players-panel > div::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255, 255, 255, 0.32),
      transparent
    );

  opacity: 0.72;
  pointer-events: none;
}

.mpd-match-detail-scope .datos-team-players-card::after,
.mpd-match-detail-scope .datos-team-players-panel > div::after {
  content: "";
  position: absolute;
  top: -120px;
  right: -120px;
  width: 260px;
  height: 260px;
  border-radius: 999px;

  background:
    radial-gradient(
      circle,
      color-mix(
        in srgb,
        var(--datos-player-accent, var(--datos-team-accent, rgba(255,255,255,.35))) 18%,
        rgba(255,255,255,.035)
      ) 0%,
      rgba(255, 255, 255, 0.025) 36%,
      transparent 70%
    );

  pointer-events: none;
}


/* =========================================================
   DATOS · JUGADORES · HEADER + PILLS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-header {
  position: relative;
  z-index: 2;

  width: 100%;
  min-width: 0;

  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;

  margin-bottom: 12px;
}

.mpd-match-detail-scope .datos-team-players-title-block {
  min-width: 0;

  display: flex;
  flex-direction: column;
  gap: 4px;
}

.mpd-match-detail-scope .datos-team-players-title {
  color: white;

  font-size: 16px;
  font-weight: 950;
  line-height: 1.1;
  letter-spacing: .15px;
}

.mpd-match-detail-scope .datos-team-players-subtitle {
  max-width: 520px;

  color: rgba(255,255,255,.68);

  font-size: 12px;
  font-weight: 750;
  line-height: 1.25;

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mpd-match-detail-scope .datos-team-players-meta-pills {
  min-width: 0;

  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 7px;
}

.mpd-match-detail-scope .datos-team-players-meta-pill {
  min-height: 28px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;

  padding: 0 10px;

  border-radius: 999px;

  color: rgba(255,255,255,.90);

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

  white-space: nowrap;

  background:
    radial-gradient(
      circle at 30% 20%,
      color-mix(
        in srgb,
        var(--datos-player-accent, var(--datos-team-accent, rgba(255,255,255,.35))) 20%,
        rgba(255,255,255,.075)
      ),
      rgba(255,255,255,.045)
    );

  border: 1px solid
    color-mix(
      in srgb,
      var(--datos-player-accent, var(--datos-team-accent, rgba(255,255,255,.35))) 28%,
      rgba(255,255,255,.14)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 5px 12px rgba(0,0,0,.12);
}

.mpd-match-detail-scope .datos-team-players-meta-pill__label {
  color: rgba(255,255,255,.68);

  font-size: 10.5px;
  font-weight: 850;
  line-height: 1;
}

.mpd-match-detail-scope .datos-team-players-meta-pill__value {
  color: white;

  font-size: 11px;
  font-weight: 950;
  line-height: 1;
}

.mpd-match-detail-scope .datos-team-players-meta-pill.is-fed {
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(59,130,246,.22),
      rgba(59,130,246,.065)
    );

  border-color: rgba(96,165,250,.25);
}

.mpd-match-detail-scope .datos-team-players-meta-pill.is-scope {
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(168,85,247,.20),
      rgba(168,85,247,.060)
    );

  border-color: rgba(192,132,252,.24);
}

.mpd-match-detail-scope .datos-team-players-meta-pill.is-group {
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255,255,255,.15),
      rgba(255,255,255,.045)
    );

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

.mpd-match-detail-scope .datos-team-players-meta-pill.is-count {
  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(34,197,94,.25),
      rgba(34,197,94,.075)
    );

  border-color: rgba(74,222,128,.30);
}

.mpd-match-detail-scope .datos-team-players-meta-pill.is-count .datos-team-players-meta-pill__label,
.mpd-match-detail-scope .datos-team-players-meta-pill.is-count .datos-team-players-meta-pill__value {
  color: rgba(187,247,208,1);
}

.mpd-match-detail-scope .datos-team-players-empty-card {
  position: relative;
  z-index: 1;

  padding: 14px 16px;

  border-radius: 16px;

  background: rgba(255,255,255,0.045);
  border: 1px solid rgba(255,255,255,0.09);

  color: rgba(255,255,255,.76);

  font-size: 12px;
  line-height: 1.45;
}

.mpd-match-detail-scope .datos-team-players-blob-name {
  position: relative;
  z-index: 1;

  margin-top: 10px;

  color: white;

  font-size: 10px;
  opacity: 0.30;

  word-break: break-all;
}


/* =========================================================
   AG GRID · JUGADORES EQUIPO · BASE
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid {
  --ag-background-color: rgba(4, 7, 8, 0.34);
  --ag-header-background-color: rgba(255, 255, 255, 0.075);
  --ag-odd-row-background-color: rgba(255, 255, 255, 0.028);
  --ag-row-hover-color: rgba(255, 255, 255, 0.085);
  --ag-border-color: rgba(255, 255, 255, 0.075);
  --ag-header-foreground-color: rgba(255,255,255,.92);
  --ag-foreground-color: rgba(255,255,255,.88);

  --ag-font-family: inherit;
  --ag-font-size: 12px;
  --ag-row-border-color: rgba(255,255,255,.055);
  --ag-secondary-border-color: rgba(255,255,255,.08);
  --ag-selected-row-background-color: rgba(255,255,255,.08);

  position: relative;
  z-index: 1;

  width: 100%;
  min-width: 0;

  margin-top: 14px;

  border-radius: 16px;
  overflow: hidden;

  border: 1px solid rgba(255,255,255,.085);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 16px 34px rgba(0,0,0,.16);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-root-wrapper {
  border-radius: 16px;
  overflow: hidden;
  border: none !important;
  background: rgba(255,255,255,.025);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-root,
.mpd-match-detail-scope .datos-team-players-grid .ag-root-wrapper,
.mpd-match-detail-scope .datos-team-players-grid .ag-body,
.mpd-match-detail-scope .datos-team-players-grid .ag-body-viewport,
.mpd-match-detail-scope .datos-team-players-grid .ag-center-cols-viewport,
.mpd-match-detail-scope .datos-team-players-grid .ag-center-cols-clipper {
  min-width: 0;
}


/* =========================================================
   AG GRID · FIX SCROLL HORIZONTAL HEADER/BODY
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .ag-center-cols-viewport,
.mpd-match-detail-scope .datos-team-players-grid .ag-center-cols-clipper {
  overflow-x: hidden !important;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-body-viewport,
.mpd-match-detail-scope .datos-team-players-grid .ag-header-viewport {
  overflow-x: hidden !important;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-body-horizontal-scroll {
  overflow-x: auto;
  background: rgba(0,0,0,.10);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-body-horizontal-scroll-viewport {
  overflow-x: auto !important;
}


/* =========================================================
   AG GRID · HEADERS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .ag-header {
  border-bottom: 1px solid rgba(255,255,255,.10);

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.085) 0%,
      rgba(255,255,255,.045) 100%
    );
}

.mpd-match-detail-scope .datos-team-players-grid .ag-header-cell,
.mpd-match-detail-scope .datos-team-players-grid .ag-header-group-cell {
  font-weight: 850;
  letter-spacing: .2px;
  border-right: 1px solid rgba(255,255,255,.05);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-header-cell {
  font-size: 11px;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-header-cell-label,
.mpd-match-detail-scope .datos-team-players-grid .ag-header-group-cell-label {
  justify-content: center;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-header {
  color: rgba(255,255,255,.92);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-header-fixed {
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.10) 0%,
      rgba(255,255,255,.045) 100%
    );
}


/* =========================================================
   AG GRID · HEADERS AGRUPADOS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-main {
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.10) 0%,
      rgba(255,255,255,.045) 100%
    );
  border-left: 1px solid rgba(255,255,255,.08);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-profile {
  background:
    linear-gradient(
      180deg,
      rgba(59,130,246,.16) 0%,
      rgba(59,130,246,.055) 100%
    );
  border-left: 1px solid rgba(59,130,246,.22);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-participation {
  background:
    linear-gradient(
      180deg,
      rgba(34,197,94,.16) 0%,
      rgba(34,197,94,.055) 100%
    );
  border-left: 1px solid rgba(34,197,94,.22);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-attack {
  background:
    linear-gradient(
      180deg,
      rgba(34,197,94,.16) 0%,
      rgba(34,197,94,.055) 100%
    );
  border-left: 1px solid rgba(34,197,94,.22);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-discipline {
  background:
    linear-gradient(
      180deg,
      rgba(239,68,68,.145) 0%,
      rgba(239,68,68,.045) 100%
    );
  border-left: 1px solid rgba(239,68,68,.20);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-extra {
  background:
    linear-gradient(
      180deg,
      rgba(168,85,247,.14) 0%,
      rgba(168,85,247,.045) 100%
    );
  border-left: 1px solid rgba(168,85,247,.18);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-group-code {
  background:
    linear-gradient(
      180deg,
      rgba(148,163,184,.13) 0%,
      rgba(148,163,184,.040) 100%
    );
  border-left: 1px solid rgba(148,163,184,.16);
}


/* =========================================================
   AG GRID · CELDAS BASE
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .ag-row {
  cursor: default;

  border-bottom: 1px solid rgba(255,255,255,.045);

  transition:
    background 0.16s ease,
    transform 0.16s ease,
    box-shadow 0.16s ease;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-cell {
  display: flex;
  align-items: center;

  line-height: 1.2;

  color: rgba(255,255,255,.88);

  border-right: 1px solid rgba(255,255,255,.035);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-cell-value {
  width: 100%;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row-hover .ag-cell {
  background-color: rgba(255,255,255,.075) !important;
  color: white;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row.ag-row-selected .ag-cell {
  background: color-mix(
    in srgb,
    var(--datos-player-accent, var(--datos-team-accent, rgba(255,255,255,.35))) 22%,
    rgba(255,255,255,0.06)
  ) !important;
}


/* =========================================================
   COLUMNA FIJA · JUGADOR
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .ag-pinned-left-header,
.mpd-match-detail-scope .datos-team-players-grid .ag-pinned-left-cols-container {
  box-shadow: 10px 0 18px rgba(0,0,0,.16);
  border-right: 1px solid rgba(255,255,255,.10);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-pinned-left-cols-container .ag-cell {
  background:
    linear-gradient(
      90deg,
      rgba(12,16,25,.90) 0%,
      rgba(12,16,25,.76) 100%
    );
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row-hover .ag-pinned-left-cols-container .ag-cell {
  background: rgba(255,255,255,.075) !important;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-name-cell {
  justify-content: flex-start !important;

  font-size: 12.5px;
  font-weight: 900;
  letter-spacing: .15px;

  color: rgba(255,255,255,.96);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-name-cell .ag-cell-value {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


/* =========================================================
   JUGADORES · IMAGEN / INICIALES
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-image-cell {
  justify-content: center !important;
  padding: 0 !important;
}

.mpd-match-detail-scope .datos-player-img-renderer {
  width: 48px;
  height: 48px;

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

  border-radius: 999px;

  overflow: hidden;

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255,255,255,.18),
      rgba(255,255,255,.055)
    );

  border: 1px solid rgba(255,255,255,.16);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 6px 16px rgba(0,0,0,.20);
}

.mpd-match-detail-scope .datos-player-img-renderer__img {
  width: 100%;
  height: 100%;

  display: block;

  object-fit: cover;
  object-position: center top;

  border-radius: inherit;
}

.mpd-match-detail-scope .datos-player-img-renderer__fallback {
  width: 100%;
  height: 100%;

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

  border-radius: inherit;

  color: white;

  font-size: 13px;
  font-weight: 950;
  letter-spacing: .25px;

  background:
    radial-gradient(
      circle at 30% 20%,
      color-mix(
        in srgb,
        var(--datos-player-accent, var(--datos-team-accent, rgba(255,255,255,.35))) 36%,
        rgba(255,255,255,.12)
      ),
      rgba(255,255,255,.055)
    );
}


/* =========================================================
   PERFIL · EDAD / AÑO / DORSAL / POSICIÓN
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-age-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-year-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-dorsal-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-position-cell {
  justify-content: center !important;

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

  color: rgba(219,234,254,.96);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-dorsal-cell .ag-cell-value {
  width: auto;

  min-width: 30px;
  height: 30px;

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

  border-radius: 999px;

  font-size: 12px;
  font-weight: 950;

  color: rgba(255,255,255,.94);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255,255,255,.18),
      rgba(255,255,255,.060)
    );

  border: 1px solid rgba(255,255,255,.16);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 5px 12px rgba(0,0,0,.16);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-position-cell {
  color: rgba(191,219,254,.98);
}


/* =========================================================
   JUGADORES · NACIONALIDAD / BANDERA
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-flag-cell {
  justify-content: center !important;
  padding: 0 !important;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-flag-cell .ag-cell-value {
  width: 100%;

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

.mpd-match-detail-scope .datos-team-players-grid .datos-player-flag-cell img,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-flag-cell .ag-cell-value img {
  width: 28px;
  height: 28px;

  object-fit: cover;

  border-radius: 999px;

  border: 1px solid rgba(255,255,255,.18);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 5px 12px rgba(0,0,0,.16);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-nationality-cell {
  display: none !important;
}


/* =========================================================
   PARTICIPACIÓN · PJ / TIT / SUP / MINUTOS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-played-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-starts-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-sub-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-callups-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-minutes-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-avg-minutes-cell {
  justify-content: center !important;

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

  color: rgba(220,252,231,.96);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-main-number-cell {
  font-weight: 950 !important;
  color: rgba(187,247,208,1) !important;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-minutes-cell {
  color: rgba(134,239,172,1) !important;
}


/* =========================================================
   ATAQUE · GOLES / ASISTENCIAS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-total-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-assists-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-avg-cell {
  justify-content: center !important;

  font-size: 12px;
  font-weight: 900;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-total-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-avg-cell {
  color: rgba(187,247,208,1);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-assists-cell {
  color: rgba(191,219,254,1);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-pill-cell .ag-cell-value {
  width: auto;

  min-width: 38px;
  min-height: 28px;

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

  padding: 5px 9px;

  border-radius: 999px;

  color: white;

  font-size: 12px;
  font-weight: 950;
  line-height: 1;

  border: 1px solid rgba(255,255,255,.18);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(255,255,255,.20),
      rgba(255,255,255,.060)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 5px 14px rgba(0,0,0,.18);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-cell .ag-cell-value,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-total-cell .ag-cell-value,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-goals-avg-cell .ag-cell-value {
  color: rgba(187,247,208,1);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(34,197,94,.34),
      rgba(34,197,94,.12)
    );

  border-color: rgba(74,222,128,.36);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 5px 14px rgba(0,0,0,.18),
    0 0 12px rgba(34,197,94,.10);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-assists-cell .ag-cell-value {
  color: rgba(191,219,254,1);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(59,130,246,.28),
      rgba(59,130,246,.10)
    );

  border-color: rgba(96,165,250,.30);
}


/* =========================================================
   DISCIPLINA · TARJETAS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-yellow-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-red-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-double-yellow-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-cards-total-cell {
  justify-content: center !important;

  font-size: 12px;
  font-weight: 900;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-yellow-cell {
  color: rgba(254,240,138,1) !important;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-red-cell {
  color: rgba(252,165,165,1) !important;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-double-yellow-cell {
  color: rgba(253,186,116,1) !important;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-card-cell .ag-cell-value {
  width: auto;

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

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

  padding: 5px 8px;

  border-radius: 8px;

  font-size: 12px;
  font-weight: 950;
  line-height: 1;

  background: rgba(255,255,255,.060);
  border: 1px solid rgba(255,255,255,.12);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-yellow-cell .ag-cell-value {
  background: rgba(250,204,21,.14);
  border-color: rgba(250,204,21,.28);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-red-cell .ag-cell-value {
  background: rgba(239,68,68,.16);
  border-color: rgba(248,113,113,.30);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-double-yellow-cell .ag-cell-value {
  background: rgba(249,115,22,.16);
  border-color: rgba(251,146,60,.30);
}


/* =========================================================
   EXTRA · RATING / VALOR / ALTURA / EQUIPO
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-rating-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-value-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-height-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-temp-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-played-total-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-team-pos-cell,
.mpd-match-detail-scope .datos-team-players-grid .datos-player-team-points-cell {
  justify-content: center !important;

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

  color: rgba(233,213,255,.96);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-rating-cell .ag-cell-value {
  color: rgba(216,180,254,1);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(168,85,247,.30),
      rgba(168,85,247,.10)
    );

  border-color: rgba(192,132,252,.30);
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-value-cell .ag-cell-value {
  color: rgba(187,247,208,1);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(34,197,94,.26),
      rgba(34,197,94,.10)
    );

  border-color: rgba(74,222,128,.28);
}


/* =========================================================
   FICHA / CÓDIGOS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .datos-player-code-cell {
  justify-content: center !important;

  color: rgba(255,255,255,.56);

  font-size: 11px;
  font-weight: 750;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-link-cell {
  justify-content: center !important;

  color: rgba(216,180,254,.88);

  font-size: 11px;
  font-weight: 700;

  padding-left: 8px !important;
  padding-right: 8px !important;
}

.mpd-match-detail-scope .datos-team-players-grid .datos-player-link-cell .ag-cell-value {
  width: 100%;

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

  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mpd-match-detail-scope .datos-player-ficha-btn {
  appearance: none;
  -webkit-appearance: none;

  border: 1px solid rgba(216, 180, 254, 0.34);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(216, 180, 254, 0.22),
      rgba(168, 85, 247, 0.10)
    );

  color: rgba(243, 232, 255, 0.96);

  min-width: 82px;
  height: 28px;
  padding: 0 10px;

  border-radius: 999px;

  font-size: 10.5px;
  font-weight: 900;
  line-height: 1;

  cursor: pointer;

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

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 5px 12px rgba(0,0,0,.16);

  transition:
    transform .14s ease,
    border-color .14s ease,
    background .14s ease,
    box-shadow .14s ease;
}

.mpd-match-detail-scope .datos-player-ficha-btn:hover {
  transform: translateY(-1px);

  border-color: rgba(216, 180, 254, 0.58);

  background:
    radial-gradient(
      circle at 30% 20%,
      rgba(216, 180, 254, 0.30),
      rgba(168, 85, 247, 0.16)
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 7px 16px rgba(0,0,0,.22),
    0 0 14px rgba(168,85,247,.12);
}

.mpd-match-detail-scope .datos-player-ficha-btn:active {
  transform: translateY(0);
}

.mpd-match-detail-scope .datos-player-ficha-empty {
  color: rgba(255,255,255,.36);
  font-size: 12px;
  font-weight: 800;
}


/* =========================================================
   FILAS DESTACADAS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .ag-row.datos-player-row-goals .ag-cell {
  background:
    linear-gradient(
      90deg,
      rgba(34,197,94,.045) 0%,
      rgba(34,197,94,.018) 42%,
      rgba(255,255,255,.010) 100%
    );
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row.datos-player-row-minutes .ag-cell {
  background:
    linear-gradient(
      90deg,
      rgba(34,197,94,.034) 0%,
      rgba(34,197,94,.014) 42%,
      rgba(255,255,255,.010) 100%
    );
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row.datos-player-row-cards .ag-cell {
  background:
    linear-gradient(
      90deg,
      rgba(239,68,68,.030) 0%,
      rgba(239,68,68,.012) 42%,
      rgba(255,255,255,.010) 100%
    );
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row-hover .datos-player-name-cell {
  color: white !important;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row-hover .datos-player-pill-cell .ag-cell-value {
  border-color: rgba(255,255,255,.32);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 6px 16px rgba(0,0,0,.22),
    0 0 16px rgba(255,255,255,.05);
}

.mpd-match-detail-scope .datos-team-players-grid .ag-row-hover .datos-player-goals-cell .ag-cell-value,
.mpd-match-detail-scope .datos-team-players-grid .ag-row-hover .datos-player-goals-total-cell .ag-cell-value,
.mpd-match-detail-scope .datos-team-players-grid .ag-row-hover .datos-player-goals-avg-cell .ag-cell-value {
  border-color: rgba(134,239,172,.54);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    0 6px 16px rgba(0,0,0,.22),
    0 0 16px rgba(34,197,94,.14);
}


/* =========================================================
   PAGINACIÓN
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .ag-paging-panel {
  min-height: 44px;

  border-top: 1px solid rgba(255,255,255,.08);

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

  color: rgba(255,255,255,.72);

  font-size: 11px;
  font-weight: 700;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-paging-button {
  color: rgba(255,255,255,.78);
  opacity: .86;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-paging-button:hover {
  color: white;
  opacity: 1;
}


/* =========================================================
   ICONOS / SCROLLBARS
   ========================================================= */

.mpd-match-detail-scope .datos-team-players-grid .ag-icon,
.mpd-match-detail-scope .datos-team-players-grid .ag-header-icon {
  opacity: .72;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-body-vertical-scroll {
  background: rgba(0,0,0,.10);
}

.mpd-match-detail-scope .datos-team-players-grid ::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}

.mpd-match-detail-scope .datos-team-players-grid ::-webkit-scrollbar-track {
  background: rgba(255,255,255,.025);
}

.mpd-match-detail-scope .datos-team-players-grid ::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.16);
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-team-players-grid ::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,.24);
}


/* =========================================================
   DATOS · INFO DEL EQUIPO
   ========================================================= */

.mpd-match-detail-scope .datos-team-info-panel > div {
  position: sticky;
  top: 86px;
  overflow: hidden;

  box-shadow:
    0 16px 34px rgba(0, 0, 0, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.mpd-match-detail-scope .datos-team-info-panel > div::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255, 255, 255, 0.26),
      transparent
    );

  pointer-events: none;
}

.mpd-match-detail-scope .datos-team-info-panel strong {
  color: rgba(255, 255, 255, 0.94);
}

.mpd-match-detail-scope .datos-team-info-panel span {
  color: rgba(255, 255, 255, 0.72);
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1180px) {
  .mpd-match-detail-scope .datos-team-body-grid {
    grid-template-columns: 1fr;
  }

  .mpd-match-detail-scope .datos-team-info-panel > div {
    position: relative;
    top: auto;
  }
}

@media (max-width: 900px) {
  .mpd-match-detail-scope .datos-team-players-header {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .mpd-match-detail-scope .datos-team-players-meta-pills {
    justify-content: flex-start;
  }

  .mpd-match-detail-scope .datos-team-players-subtitle {
    max-width: 100%;
  }

  .mpd-match-detail-scope .datos-team-players-grid {
    --ag-font-size: 11px;
    margin-top: 12px;
  }

  .mpd-match-detail-scope .datos-team-players-grid .datos-player-pill-cell .ag-cell-value {
    min-width: 34px;
    padding: 5px 8px;
    font-size: 11px;
  }

  .mpd-match-detail-scope .datos-team-players-grid .datos-player-name-cell {
    font-size: 12px;
  }

  .mpd-match-detail-scope .datos-player-img-renderer {
    width: 44px;
    height: 44px;
  }

  .mpd-match-detail-scope .datos-player-img-renderer__fallback {
    font-size: 12px;
  }

  .mpd-match-detail-scope .datos-player-ficha-btn {
    min-width: 74px;
    height: 27px;
    font-size: 10px;
    padding: 0 8px;
  }
}

@media (max-width: 760px) {
  .mpd-match-detail-scope .datos-team-body-grid {
    gap: 12px;
  }

  .mpd-match-detail-scope .datos-team-players-grid {
    --ag-font-size: 11px;
    border-radius: 14px;
  }

  .mpd-match-detail-scope .datos-team-players-grid .ag-root-wrapper {
    border-radius: 14px;
  }

  .mpd-match-detail-scope .datos-team-players-grid .ag-header-cell {
    font-size: 10px;
  }

  .mpd-match-detail-scope .datos-team-players-grid .datos-player-name-cell {
    font-size: 12px;
  }

  .mpd-match-detail-scope .datos-player-img-renderer {
    width: 40px;
    height: 40px;
  }

  .mpd-match-detail-scope .datos-player-img-renderer__fallback {
    font-size: 11px;
  }

  .mpd-match-detail-scope .datos-team-players-grid .datos-player-flag-cell img,
  .mpd-match-detail-scope .datos-team-players-grid .datos-player-flag-cell .ag-cell-value img {
    width: 24px;
    height: 24px;
  }
}




.mpd-match-detail-scope .datos-team-players-grid,
.mpd-match-detail-scope .datos-team-players-grid .ag-root-wrapper,
.mpd-match-detail-scope .datos-team-players-grid .ag-root {
  width: 100% !important;
}
















/* =========================================================
   DATOS · TEAM DETAIL · CONTENIDO EMBEBIDO SIN CARD INTERNA
   ========================================================= */

/* Cuando jugadores/partidos van dentro del bloque unido,
   quitamos la card interna para que parezca un único contenedor. */

.mpd-match-detail-scope .datos-team-content-body .datos-team-players-card,
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-panel > div {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;

  padding: 0 !important;
  margin: 0 !important;

  border-radius: 0 !important;
}

/* Quitamos la línea decorativa superior que aparece cerca de "Jugadores" */
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-card::before,
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-panel > div::before {
  display: none !important;
  content: none !important;
}

/* Quitamos también el brillo/radial interno de esa card */
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-card::after,
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-panel > div::after {
  display: none !important;
  content: none !important;
}

/* Dejamos el header de jugadores limpio dentro del bloque */
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-header {
  margin-bottom: 12px;
  padding: 0;
}

/* El grid sí mantiene su propia caja, pero ya no parece una card doble */
.mpd-match-detail-scope .datos-team-content-body .datos-team-players-grid {
  margin-top: 12px;
}



/* ==== FUENTE: seccion equipos/equipos dentro de equipos.css ==== */

/* =========================================================
   DATOS · TEAM DETAIL · TAB EQUIPO v18
   Clasificación + métricas compactas + XI más usado + campo
   ========================================================= */


/* =========================================================
   1. CONTENEDOR BASE
   ========================================================= */

.mpd-match-detail-scope .datos-team-panel-equipo{
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-team-overview-card{
  width: 100%;
  min-width: 0;
  color: white;
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-team-overview-card *{
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-team-overview-blob{
  display: none;
}


/* =========================================================
   2. HEADER INTERNO DE EQUIPO
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-header{
  width: 100%;
  min-width: 0;
  margin-bottom: 14px;
}

.mpd-match-detail-scope .datos-team-overview-header-left{
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-overview-header-logo,
.mpd-match-detail-scope .datos-team-overview-header-logo-fallback{
  width: 54px;
  height: 54px;
  flex: 0 0 54px;
  border-radius: 999px;
  object-fit: contain;

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

  background:
    radial-gradient(circle at 50% 20%, rgba(255,255,255,.18), rgba(255,255,255,.05));

  border: 1px solid rgba(255,255,255,.14);

  box-shadow:
    0 12px 28px rgba(0,0,0,.24),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.mpd-match-detail-scope .datos-team-overview-header-logo-fallback{
  font-size: 18px;
  font-weight: 950;
  color: white;
}

.mpd-match-detail-scope .datos-team-overview-header-text{
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-overview-kicker{
  margin-bottom: 3px;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .55px;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--datos-team-overview-accent) 70%, white 30%);
}

.mpd-match-detail-scope .datos-team-overview-title{
  font-size: 20px;
  font-weight: 950;
  line-height: 1.05;
  color: white;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-team-overview-subtitle{
  margin-top: 5px;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.35;
  color: rgba(255,255,255,.54);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* =========================================================
   3. CARDS BASE
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-stats-card,
.mpd-match-detail-scope .datos-team-overview-xi-card,
.mpd-match-detail-scope .datos-team-overview-empty-card{
  width: 100%;
  min-width: 0;

  border-radius: 22px;
  border: 1px solid color-mix(in srgb, var(--datos-team-overview-accent) 30%, rgba(255,255,255,.08));

  background:
    radial-gradient(circle at 12% 0%, var(--datos-team-overview-soft), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.026));

  box-shadow:
    0 18px 44px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.07);
}

.mpd-match-detail-scope .datos-team-overview-stats-card{
  padding: 14px;
  margin-bottom: 14px;

  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--datos-team-overview-accent) 12%, transparent), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.024));

  border: 1px solid rgba(255,255,255,.085);

  box-shadow:
    0 18px 46px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.065);
}

.mpd-match-detail-scope .datos-team-overview-xi-card{
  padding: 14px;
}


/* =========================================================
   4. TARJETAS SUPERIORES · MÉTRICAS PRINCIPALES
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-stats-grid{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  min-width: 0;
  margin-bottom: 12px;
}

.mpd-match-detail-scope .datos-team-overview-stat-card{
  position: relative;
  overflow: hidden;
  isolation: isolate;

  min-width: 0;
  min-height: 122px;
  padding: 12px 10px;

  border-radius: 17px;
  border: 1px solid rgba(255,255,255,.085);

  background: linear-gradient(180deg, rgba(255,255,255,.068), rgba(255,255,255,.024));

  display: grid;
  grid-template-rows: auto auto 1fr auto;
  align-content: start;
  text-align: center;
}

.mpd-match-detail-scope .datos-team-overview-stat-card::before{
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  opacity: .90;
  background: rgba(255,255,255,.20);
  z-index: 0;
}

.mpd-match-detail-scope .datos-team-overview-stat-card::after{
  content: "";
  position: absolute;
  inset: -35% -35% auto auto;
  width: 120px;
  height: 120px;
  border-radius: 999px;
  opacity: .20;
  background: rgba(255,255,255,.10);
  filter: blur(2px);
  z-index: 0;
}

.mpd-match-detail-scope .datos-team-overview-stat-card > *{
  position: relative;
  z-index: 1;
}

.mpd-match-detail-scope .datos-team-overview-stat-card--accent{
  background:
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--datos-team-overview-accent) 30%, transparent), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.080), rgba(255,255,255,.033));

  border-color: color-mix(in srgb, var(--datos-team-overview-accent) 42%, rgba(255,255,255,.08));
}

.mpd-match-detail-scope .datos-team-overview-stat-label{
  font-size: 10px;
  font-weight: 950;
  color: rgba(255,255,255,.58);
  letter-spacing: .42px;
  text-transform: uppercase;
}

.mpd-match-detail-scope .datos-team-overview-stat-value{
  margin-top: 3px;
  font-size: 25px;
  line-height: 1.02;
  font-weight: 950;
  color: white;
}

.mpd-match-detail-scope .datos-team-overview-stat-sub{
  margin-top: 4px;
  min-height: 12px;
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,.44);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-team-overview-stat-sub.is-empty{
  opacity: 0;
}


/* =========================================================
   5. COLORES BLOOMBERG · ESTADO DE MÉTRICAS
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-stat-card.is-good,
.mpd-match-detail-scope .datos-team-overview-line-item.is-good{
  border-color: rgba(34,197,94,.24);
  background:
    radial-gradient(circle at 92% 0%, rgba(34,197,94,.16), transparent 42%),
    linear-gradient(180deg, rgba(34,197,94,.075), rgba(255,255,255,.022));
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-good::before,
.mpd-match-detail-scope .datos-team-overview-line-item.is-good::before{
  background: linear-gradient(180deg, #4ade80, #16a34a);
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-mid,
.mpd-match-detail-scope .datos-team-overview-line-item.is-mid{
  border-color: rgba(250,204,21,.22);
  background:
    radial-gradient(circle at 92% 0%, rgba(250,204,21,.14), transparent 42%),
    linear-gradient(180deg, rgba(250,204,21,.060), rgba(255,255,255,.022));
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-mid::before,
.mpd-match-detail-scope .datos-team-overview-line-item.is-mid::before{
  background: linear-gradient(180deg, #fde047, #ca8a04);
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-bad,
.mpd-match-detail-scope .datos-team-overview-line-item.is-bad{
  border-color: rgba(248,113,113,.24);
  background:
    radial-gradient(circle at 92% 0%, rgba(248,113,113,.14), transparent 42%),
    linear-gradient(180deg, rgba(248,113,113,.060), rgba(255,255,255,.022));
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-bad::before,
.mpd-match-detail-scope .datos-team-overview-line-item.is-bad::before{
  background: linear-gradient(180deg, #fb7185, #b91c1c);
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-neutral,
.mpd-match-detail-scope .datos-team-overview-line-item.is-neutral{
  border-color: rgba(148,163,184,.18);
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-neutral::before,
.mpd-match-detail-scope .datos-team-overview-line-item.is-neutral::before{
  background: linear-gradient(180deg, rgba(203,213,225,.80), rgba(100,116,139,.80));
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-elite{
  box-shadow:
    0 0 0 1px rgba(34,197,94,.08),
    0 14px 34px rgba(34,197,94,.10),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.mpd-match-detail-scope .datos-team-overview-stat-card.is-risk{
  box-shadow:
    0 0 0 1px rgba(248,113,113,.08),
    0 14px 34px rgba(248,113,113,.08),
    inset 0 1px 0 rgba(255,255,255,.08);
}


/* =========================================================
   6. RANKING + NORMALIZACIÓN · TARJETAS GRANDES
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-metric-meta{
  width: 100%;
  min-width: 0;
  max-width: 100%;

  margin-top: auto;
  padding-top: 9px;

  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "rank"
    "norm"
    "bar";
  row-gap: 4px;

  align-self: stretch;
  justify-self: stretch;
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-empty{
  display: none;
}

.mpd-match-detail-scope .datos-team-overview-metric-rank-row,
.mpd-match-detail-scope .datos-team-overview-metric-norm-row{
  width: 100%;
  min-width: 0;
  max-width: 100%;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.mpd-match-detail-scope .datos-team-overview-metric-rank-row{
  grid-area: rank;
}

.mpd-match-detail-scope .datos-team-overview-metric-norm-row{
  grid-area: norm;
}

.mpd-match-detail-scope .datos-team-overview-metric-rank-label,
.mpd-match-detail-scope .datos-team-overview-metric-norm-label{
  flex: 0 0 auto;

  font-size: 8px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: .34px;
  text-transform: uppercase;
  color: rgba(255,255,255,.36);
}

.mpd-match-detail-scope .datos-team-overview-metric-rank,
.mpd-match-detail-scope .datos-team-overview-metric-norm{
  flex: 0 0 auto;

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

  min-width: 0;

  font-size: 10px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: .24px;
  text-transform: uppercase;

  color: rgba(255,255,255,.78);
}

.mpd-match-detail-scope .datos-team-overview-metric-rank{
  color: white;
}

.mpd-match-detail-scope .datos-team-overview-metric-norm{
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.075);
}

.mpd-match-detail-scope .datos-team-overview-metric-bar{
  grid-area: bar;
  display: block;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 5px;
  margin: 0;
  padding: 0;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.075);
  box-shadow: inset 0 1px 4px rgba(0,0,0,.30);
}

.mpd-match-detail-scope .datos-team-overview-metric-bar-fill{
  display: block;
  height: 100%;
  min-width: 2px;
  border-radius: inherit;
  background: rgba(255,255,255,.44);
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-good .datos-team-overview-metric-bar-fill{
  background: linear-gradient(90deg, #16a34a, #4ade80);
  box-shadow: 0 0 10px rgba(34,197,94,.28);
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-mid .datos-team-overview-metric-bar-fill{
  background: linear-gradient(90deg, #ca8a04, #fde047);
  box-shadow: 0 0 10px rgba(234,179,8,.22);
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-bad .datos-team-overview-metric-bar-fill{
  background: linear-gradient(90deg, #b91c1c, #fb7185);
  box-shadow: 0 0 10px rgba(239,68,68,.22);
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-neutral .datos-team-overview-metric-bar-fill{
  background: linear-gradient(90deg, rgba(100,116,139,.95), rgba(203,213,225,.95));
}


/* =========================================================
   7. TARJETAS PEQUEÑAS · GENERAL / CASA / FUERA
   Valor absoluto en el cuerpo + valores de pos/norm sin labels
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-lines-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  width: 100%;
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-overview-line-card{
  min-width: 0;
  padding: 10px 12px 12px;
  border-radius: 17px;
  background: rgba(255,255,255,.040);
  border: 1px solid rgba(255,255,255,.080);
}

.mpd-match-detail-scope .datos-team-overview-line-head{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  min-width: 0;
  margin-bottom: 7px;
}

.mpd-match-detail-scope .datos-team-overview-line-title{
  margin: 0;
  font-size: 17px;
  line-height: 1.05;
  font-weight: 950;
  letter-spacing: .18px;
  color: white;
}

.mpd-match-detail-scope .datos-team-overview-line-rank{
  display: none !important;
}

.mpd-match-detail-scope .datos-team-overview-line-items{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-overview-line-item{
  position: relative;
  overflow: hidden;

  width: 100%;
  min-width: 0;
  max-width: 100%;
  min-height: 84px;

  padding: 8px 10px 8px 12px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.075);

  background: linear-gradient(180deg, rgba(255,255,255,.058), rgba(255,255,255,.022));

  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  align-content: stretch;
}

.mpd-match-detail-scope .datos-team-overview-line-item > *{
  width: 100%;
  min-width: 0;
  max-width: 100%;
}

.mpd-match-detail-scope .datos-team-overview-line-item::before{
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
}

.mpd-match-detail-scope .datos-team-overview-line-main{
  width: 100%;
  min-width: 0;
  max-width: 100%;

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

.mpd-match-detail-scope .datos-team-overview-line-key{
  min-width: 0;
  color: rgba(255,255,255,.58);
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .42px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-team-overview-line-value{
  display: none;
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-compact{
  width: 100%;
  min-width: 0;
  max-width: 100%;

  margin-top: 0;
  padding-top: 0;

  display: grid;
  grid-template-columns: minmax(0, .72fr) auto;
  grid-template-rows: minmax(0, 1fr) auto;
  grid-template-areas:
    "meta value"
    "bar  bar";
  column-gap: 8px;
  row-gap: 6px;

  align-self: stretch;
  justify-self: stretch;
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-compact.is-empty{
  display: none;
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-compact .datos-team-overview-metric-rank-row,
.mpd-match-detail-scope .datos-team-overview-metric-meta.is-compact .datos-team-overview-metric-norm-row{
  display: none;
}

.mpd-match-detail-scope .datos-team-overview-compact-meta-block{
  grid-area: meta;
  width: 100%;
  min-width: 0;
  max-width: 100%;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 5px;

  align-self: stretch;
}

.mpd-match-detail-scope .datos-team-overview-compact-rank-row,
.mpd-match-detail-scope .datos-team-overview-compact-norm-row{
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
}

/* CAMBIO PEDIDO:
   Se ocultan únicamente los textos "Pos." y "Norm.",
   pero se mantienen visibles sus valores. */
.mpd-match-detail-scope .datos-team-overview-compact-rank-label,
.mpd-match-detail-scope .datos-team-overview-compact-norm-label{
  display: none !important;
}

.mpd-match-detail-scope .datos-team-overview-compact-rank,
.mpd-match-detail-scope .datos-team-overview-compact-norm{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 0;

  font-size: 9px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: .20px;
  color: rgba(255,255,255,.84);
}

.mpd-match-detail-scope .datos-team-overview-compact-rank{
  color: white;
}

.mpd-match-detail-scope .datos-team-overview-compact-norm{
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.075);
}

.mpd-match-detail-scope .datos-team-overview-metric-absolute-value{
  grid-area: value;
  display: flex;
  align-items: center;
  justify-content: flex-end;

  width: auto;
  min-width: 32px;
  max-width: 100%;

  color: white;
  font-size: 22px;
  line-height: 1;
  font-weight: 950;
  letter-spacing: .1px;
  text-align: right;

  align-self: center;
}

.mpd-match-detail-scope .datos-team-overview-metric-absolute-value--no-meta{
  height: 100%;
  width: 100%;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
}

.mpd-match-detail-scope .datos-team-overview-metric-meta.is-compact .datos-team-overview-metric-bar{
  grid-area: bar;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  height: 4px;
}


/* =========================================================
   8. XI MÁS USADO · CABECERA
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-section-head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.mpd-match-detail-scope .datos-team-overview-section-title{
  font-size: 17px;
  font-weight: 950;
  color: white;
  line-height: 1.1;
}

.mpd-match-detail-scope .datos-team-overview-section-subtitle{
  margin-top: 4px;
  font-size: 11px;
  font-weight: 700;
  color: rgba(255,255,255,.50);
}


/* =========================================================
   9. XI MÁS USADO · LISTA Y SUPLENTES
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-xi-layout{
  display: grid;
  grid-template-columns: minmax(360px, .92fr) minmax(420px, 1.08fr);
  gap: 14px;
  align-items: stretch;
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-overview-xi-left{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.mpd-match-detail-scope .datos-team-overview-xi-list,
.mpd-match-detail-scope .datos-team-overview-bench-list{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-overview-xi-player-card{
  appearance: none;
  -webkit-appearance: none;

  min-width: 0;
  padding: 10px;

  border-radius: 17px;
  border: 1px solid rgba(255,255,255,.085);

  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--datos-team-overview-accent) 14%, transparent), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.028));

  color: white;
  cursor: pointer;

  display: grid;
  grid-template-columns: 24px 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  text-align: left;

  box-shadow:
    0 10px 26px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.055);

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

.mpd-match-detail-scope .datos-team-overview-xi-player-card:hover{
  transform: translateY(-1px);
  border-color: color-mix(in srgb, var(--datos-team-overview-accent) 45%, rgba(255,255,255,.12));
  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--datos-team-overview-accent) 20%, transparent), transparent 45%),
    linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
}

.mpd-match-detail-scope .datos-team-overview-xi-rank{
  width: 24px;
  height: 24px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 950;
  color: white;
  background: color-mix(in srgb, var(--datos-team-overview-accent) 36%, rgba(255,255,255,.08));
  border: 1px solid rgba(255,255,255,.11);
}

.mpd-match-detail-scope .datos-team-overview-xi-img-wrap{
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 999px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.12);
}

.mpd-match-detail-scope .datos-team-overview-xi-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mpd-match-detail-scope .datos-team-overview-xi-img-fallback{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 950;
  color: white;
  background: radial-gradient(circle at 50% 20%, rgba(255,255,255,.16), rgba(255,255,255,.055));
}

.mpd-match-detail-scope .datos-team-overview-xi-text{
  min-width: 0;
}

.mpd-match-detail-scope .datos-team-overview-xi-name{
  font-size: 12px;
  font-weight: 950;
  color: white;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-team-overview-xi-meta,
.mpd-match-detail-scope .datos-team-overview-xi-main-metric{
  margin-top: 3px;
  font-size: 10px;
  font-weight: 750;
  color: rgba(255,255,255,.48);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mpd-match-detail-scope .datos-team-overview-xi-main-metric{
  color: rgba(255,255,255,.62);
}

.mpd-match-detail-scope .datos-team-overview-xi-goals{
  min-width: 32px;
  text-align: center;
}

.mpd-match-detail-scope .datos-team-overview-xi-goals-value{
  font-size: 15px;
  line-height: 1;
  font-weight: 950;
  color: #4ade80;
}

.mpd-match-detail-scope .datos-team-overview-xi-goals-label{
  margin-top: 2px;
  font-size: 9px;
  font-weight: 950;
  color: rgba(255,255,255,.45);
}

.mpd-match-detail-scope .datos-team-overview-bench-block{
  min-width: 0;
  padding-top: 12px;
  border-top: 1px solid rgba(255,255,255,.075);
}

.mpd-match-detail-scope .datos-team-overview-bench-head{
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin-bottom: 10px;
}

.mpd-match-detail-scope .datos-team-overview-bench-title{
  font-size: 13px;
  font-weight: 950;
  color: white;
  line-height: 1.1;
}

.mpd-match-detail-scope .datos-team-overview-bench-subtitle{
  font-size: 10px;
  font-weight: 750;
  color: rgba(255,255,255,.48);
  line-height: 1.35;
}

.mpd-match-detail-scope .datos-team-overview-xi-player-card--bench{
  border-color: rgba(255,255,255,.070);
  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--datos-team-overview-accent) 9%, transparent), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.050), rgba(255,255,255,.022));
}

.mpd-match-detail-scope .datos-team-overview-xi-player-card--bench .datos-team-overview-xi-rank{
  background: rgba(255,255,255,.060);
  color: rgba(255,255,255,.76);
}


/* =========================================================
   10. CAMPO DE FÚTBOL
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-field{
  position: relative;
  width: 100%;
  min-height: 560px;
  height: 100%;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--datos-team-overview-accent) 30%, rgba(255,255,255,.10));

  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 50%, rgba(255,255,255,.012) 50%),
    repeating-linear-gradient(0deg, rgba(34,197,94,.18) 0 72px, rgba(22,163,74,.14) 72px 144px),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.035), transparent 42%),
    linear-gradient(180deg, rgba(4,35,20,.86), rgba(2,24,16,.88));

  background-size: 100% 100%, 100% 144px, 100% 100%, 100% 100%;

  box-shadow:
    0 18px 44px rgba(0,0,0,.24),
    inset 0 0 0 2px rgba(255,255,255,.055),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.mpd-match-detail-scope .datos-team-overview-field::before{
  content: "";
  position: absolute;
  inset: 16px;
  border: 2px solid rgba(255,255,255,.16);
  border-radius: 16px;
  pointer-events: none;
}

.mpd-match-detail-scope .datos-team-overview-field-line--mid{
  position: absolute;
  left: 16px;
  right: 16px;
  top: 50%;
  height: 2px;
  background: rgba(255,255,255,.15);
}

.mpd-match-detail-scope .datos-team-overview-field-circle{
  position: absolute;
  left: 50%;
  top: 50%;
  width: 120px;
  height: 120px;
  transform: translate(-50%, -50%);
  border: 2px solid rgba(255,255,255,.15);
  border-radius: 999px;
}

.mpd-match-detail-scope .datos-team-overview-field-box{
  position: absolute;
  left: 50%;
  width: 38%;
  height: 82px;
  transform: translateX(-50%);
  border: 2px solid rgba(255,255,255,.14);
  border-radius: 0 0 14px 14px;
}

.mpd-match-detail-scope .datos-team-overview-field-box--top{
  top: 16px;
  border-top: none;
}

.mpd-match-detail-scope .datos-team-overview-field-box--bottom{
  bottom: 16px;
  border-bottom: none;
  border-radius: 14px 14px 0 0;
}

.mpd-match-detail-scope .datos-team-overview-field-players{
  position: absolute;
  inset: 0;
}

.mpd-match-detail-scope .datos-team-overview-field-player-btn{
  appearance: none;
  -webkit-appearance: none;
  position: absolute;
  transform: translate(-50%, -50%);
  width: 86px;
  min-height: 76px;
  padding: 0;
  border: none;
  background: transparent;
  color: white;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  text-align: center;
}

.mpd-match-detail-scope .datos-team-overview-field-player-btn:hover .datos-team-overview-field-player-img-wrap{
  transform: translateY(-2px) scale(1.06);
  box-shadow:
    0 0 0 2px color-mix(in srgb, var(--datos-team-overview-accent) 48%, rgba(255,255,255,.20)),
    0 14px 26px rgba(0,0,0,.34);
}

.mpd-match-detail-scope .datos-team-overview-field-player-img-wrap{
  width: 48px;
  height: 48px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(5,15,10,.78);
  border: 1px solid rgba(255,255,255,.18);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow:
    0 10px 22px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.10);
  transition: transform .15s ease, box-shadow .15s ease;
}

.mpd-match-detail-scope .datos-team-overview-field-player-img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.mpd-match-detail-scope .datos-team-overview-field-player-fallback{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 950;
  color: white;
  background: radial-gradient(circle at 50% 20%, rgba(255,255,255,.18), rgba(255,255,255,.055));
}

.mpd-match-detail-scope .datos-team-overview-field-player-name{
  max-width: 92px;
  padding: 3px 6px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 900;
  line-height: 1.15;
  color: white;
  background: rgba(0,0,0,.42);
  backdrop-filter: blur(5px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* =========================================================
   11. ESTADOS VACÍOS
   ========================================================= */

.mpd-match-detail-scope .datos-team-overview-field-empty{
  min-height: 260px;
  height: 100%;
  padding: 18px;
  border-radius: 22px;
  border: 1px dashed rgba(255,255,255,.14);
  background: rgba(255,255,255,.025);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.mpd-match-detail-scope .datos-team-overview-field-empty-title,
.mpd-match-detail-scope .datos-team-overview-empty-main{
  font-size: 13px;
  font-weight: 950;
  color: white;
}

.mpd-match-detail-scope .datos-team-overview-field-empty-subtitle,
.mpd-match-detail-scope .datos-team-overview-empty-sub{
  margin-top: 6px;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 700;
  color: rgba(255,255,255,.52);
}


/* =========================================================
   12. RESPONSIVE
   ========================================================= */

@media (max-width: 1500px){
  .mpd-match-detail-scope .datos-team-overview-xi-layout{
    grid-template-columns: minmax(0, 1fr);
  }

  .mpd-match-detail-scope .datos-team-overview-field{
    min-height: 620px;
  }
}

@media (max-width: 1280px){
  .mpd-match-detail-scope .datos-team-overview-line-items{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1150px){
  .mpd-match-detail-scope .datos-team-overview-stats-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .mpd-match-detail-scope .datos-team-overview-lines-grid{
    grid-template-columns: minmax(0, 1fr);
  }

  .mpd-match-detail-scope .datos-team-overview-xi-list,
  .mpd-match-detail-scope .datos-team-overview-bench-list{
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 720px){
  .mpd-match-detail-scope .datos-team-overview-header-left{
    align-items: flex-start;
  }

  .mpd-match-detail-scope .datos-team-overview-title{
    font-size: 17px;
  }

  .mpd-match-detail-scope .datos-team-overview-subtitle{
    white-space: normal;
  }

  .mpd-match-detail-scope .datos-team-overview-stats-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mpd-match-detail-scope .datos-team-overview-line-items{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mpd-match-detail-scope .datos-team-overview-xi-player-card{
    grid-template-columns: 22px 38px minmax(0, 1fr);
  }

  .mpd-match-detail-scope .datos-team-overview-xi-goals{
    display: none;
  }

  .mpd-match-detail-scope .datos-team-overview-field{
    min-height: 520px;
  }

  .mpd-match-detail-scope .datos-team-overview-field-player-btn{
    width: 76px;
  }

  .mpd-match-detail-scope .datos-team-overview-field-player-img-wrap{
    width: 42px;
    height: 42px;
  }
}

@media (max-width: 520px){
  .mpd-match-detail-scope .datos-team-overview-line-items{
    grid-template-columns: minmax(0, 1fr);
  }
}


/* ==== FUENTE: seccion ligas/seccion de equipos en ligas.css ==== */

/* =========================================================
   DATOS · Equipos dentro de Ligas · menú de tarjetas
   + Favoritos de equipos
   ========================================================= */


/* =========================================================
   CARD CONTENEDORA DE LA TAB EQUIPOS
   ========================================================= */

.mpd-match-detail-scope .datos-league-teams-card {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  color: white;
}

.mpd-match-detail-scope .datos-league-teams-card,
.mpd-match-detail-scope .datos-league-teams-card * {
  box-sizing: border-box;
}

.mpd-match-detail-scope .datos-league-teams-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  width: 100%;
  min-width: 0;

  margin-bottom: 16px;
}

.mpd-match-detail-scope .datos-league-teams-card-head-left {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.mpd-match-detail-scope .datos-league-teams-card-title {
  color: white;
  font-size: 15px;
  font-weight: 850;
  line-height: 1.1;
}

.mpd-match-detail-scope .datos-league-teams-card-subtitle {
  color: rgba(255,255,255,.70);
  font-size: 12px;
  font-weight: 650;
  line-height: 1.2;
  margin-top: 4px;
}

.mpd-match-detail-scope .datos-league-teams-card-error {
  color: rgba(255,255,255,.76);
  font-size: 12px;
  line-height: 1.45;
}

.mpd-match-detail-scope .datos-league-teams-card-blob {
  color: white;
  font-size: 10px;
  opacity: .24;
  margin-top: 14px;
  word-break: break-all;
}

.mpd-match-detail-scope .datos-league-teams-menu-empty {
  width: 100%;
  box-sizing: border-box;

  padding: 18px 16px;

  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);

  color: rgba(255,255,255,.72);
  font-size: 12px;
  text-align: center;
}


/* =========================================================
   DATOS · GRID DE TARJETAS DE EQUIPOS
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-cards-grid {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;

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

  gap: 14px;
  margin: 0 auto 18px;
}

/* Compatibilidad antigua */
.mpd-match-detail-scope .datos-league-teams-menu-grid {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;

  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(142px, 1fr));
  gap: 14px;

  align-items: stretch;
}


/* =========================================================
   DATOS · WRAPPER DE CADA EQUIPO
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card {
  position: relative;

  width: 118px;
  flex: 0 0 118px;

  min-width: 118px;
  max-width: 118px;
  min-height: 144px;

  color: white;

  --datos-team-menu-accent-safe: var(--datos-team-menu-accent, rgba(255,255,255,.45));

  isolation: isolate;

  transition:
    transform .18s ease,
    filter .18s ease,
    opacity .18s ease;
}

/*
  IMPORTANTE:
  No usamos :focus-within aquí.
  Si lo usamos, la última estrella clicada deja la tarjeta "bloqueada".
*/
.mpd-match-detail-scope .datos-league-team-card:hover {
  transform: translateY(-3px);
}

.mpd-match-detail-scope .datos-league-team-card.is-favorite {
  z-index: 3;
}


/* =========================================================
   DATOS · BOTÓN PRINCIPAL DE EQUIPO
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card-btn {
  appearance: none;
  -webkit-appearance: none;

  position: relative;
  z-index: 1;

  width: 100%;
  min-width: 0;
  min-height: 144px;

  padding: 0;
  margin: 0;

  border: none;
  background: transparent;

  color: white;
  text-align: center;
  font: inherit;

  cursor: pointer;
  outline: none;

  display: block;

  touch-action: manipulation;
}


/* =========================================================
   DATOS · INTERIOR DE LA TARJETA
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card__inner,
.mpd-match-detail-scope .datos-league-team-card-inner {
  position: relative;

  width: 100%;
  height: 100%;
  min-height: 144px;

  box-sizing: border-box;

  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;

  gap: 10px;

  padding: 13px 10px 11px;

  border-radius: 18px;

  border: 1px solid rgba(255,255,255,.13);

  background:
    radial-gradient(
      circle at 50% 8%,
      color-mix(
        in srgb,
        var(--datos-team-menu-accent-safe) 15%,
        transparent
      ) 0%,
      transparent 48%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.10) 0%,
      rgba(255,255,255,.035) 56%,
      rgba(0,0,0,.18) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 8px 22px rgba(0,0,0,.18);

  overflow: hidden;

  transition:
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease,
    filter .18s ease,
    opacity .18s ease;
}

.mpd-match-detail-scope .datos-league-team-card__inner::before,
.mpd-match-detail-scope .datos-league-team-card-inner::before {
  content: "";
  position: absolute;
  inset: 0;

  pointer-events: none;

  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,.10) 0%,
      transparent 24%,
      transparent 74%,
      rgba(255,255,255,.035) 100%
    );

  opacity: .62;
}

.mpd-match-detail-scope .datos-league-team-card__inner::after,
.mpd-match-detail-scope .datos-league-team-card-inner::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 0;

  height: 2px;

  border-radius: 999px 999px 0 0;

  background: color-mix(
    in srgb,
    var(--datos-team-menu-accent-safe) 64%,
    rgba(255,255,255,.18)
  );

  opacity: .42;
}


/* =========================================================
   DATOS · HOVER NORMAL DE TARJETA
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card:hover .datos-league-team-card__inner,
.mpd-match-detail-scope .datos-league-team-card:hover .datos-league-team-card-inner {
  border-color: color-mix(
    in srgb,
    var(--datos-team-menu-accent-safe) 46%,
    rgba(255,255,255,.20)
  );

  background:
    radial-gradient(
      circle at 50% 5%,
      color-mix(
        in srgb,
        var(--datos-team-menu-accent-safe) 24%,
        transparent
      ) 0%,
      transparent 50%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.13) 0%,
      rgba(255,255,255,.045) 56%,
      rgba(0,0,0,.16) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 12px 28px rgba(0,0,0,.25),
    0 0 22px color-mix(
      in srgb,
      var(--datos-team-menu-accent-safe) 16%,
      transparent
    );
}

.mpd-match-detail-scope .datos-league-team-card-btn:focus-visible .datos-league-team-card__inner,
.mpd-match-detail-scope .datos-league-team-card-btn:focus-visible .datos-league-team-card-inner {
  border-color: var(--datos-team-menu-accent-safe);

  box-shadow:
    0 0 0 2px color-mix(
      in srgb,
      var(--datos-team-menu-accent-safe) 42%,
      transparent
    ),
    0 12px 28px rgba(0,0,0,.25);
}


/* =========================================================
   DATOS · ESTADO FAVORITO
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card__inner,
.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card-inner {
  border-color: color-mix(
    in srgb,
    var(--datos-team-menu-accent-safe) 42%,
    rgba(255,215,64,.42)
  );

  background:
    radial-gradient(
      circle at 50% 6%,
      color-mix(
        in srgb,
        var(--datos-team-menu-accent-safe) 22%,
        transparent
      ) 0%,
      transparent 50%
    ),
    radial-gradient(
      circle at 88% 8%,
      rgba(255,215,64,.18) 0%,
      transparent 34%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.12) 0%,
      rgba(255,255,255,.042) 56%,
      rgba(0,0,0,.16) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 10px 25px rgba(0,0,0,.22),
    0 0 22px color-mix(
      in srgb,
      var(--datos-team-menu-accent-safe) 12%,
      transparent
    );
}

.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card__inner::after,
.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card-inner::after {
  height: 3px;
  opacity: .86;

  background:
    linear-gradient(
      90deg,
      rgba(255,215,64,.92) 0%,
      color-mix(
        in srgb,
        var(--datos-team-menu-accent-safe) 68%,
        rgba(255,215,64,.44)
      ) 100%
    );
}


/* =========================================================
   DATOS · HOVER DE TARJETA FAVORITA
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card.is-favorite:hover .datos-league-team-card__inner,
.mpd-match-detail-scope .datos-league-team-card.is-favorite:hover .datos-league-team-card-inner {
  border-color: color-mix(
    in srgb,
    var(--datos-team-menu-accent-safe) 46%,
    rgba(255,215,64,.64)
  );

  background:
    radial-gradient(
      circle at 50% 5%,
      color-mix(
        in srgb,
        var(--datos-team-menu-accent-safe) 26%,
        transparent
      ) 0%,
      transparent 50%
    ),
    radial-gradient(
      circle at 88% 8%,
      rgba(255,215,64,.25) 0%,
      transparent 36%
    ),
    linear-gradient(
      180deg,
      rgba(255,255,255,.145) 0%,
      rgba(255,255,255,.052) 56%,
      rgba(0,0,0,.15) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 13px 30px rgba(0,0,0,.28),
    0 0 25px rgba(255,215,64,.14),
    0 0 24px color-mix(
      in srgb,
      var(--datos-team-menu-accent-safe) 14%,
      transparent
    );
}


/* =========================================================
   DATOS · BOTÓN FAVORITO
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-favorite-btn {
  appearance: none;
  -webkit-appearance: none;

  position: absolute;
  z-index: 20;

  top: 5px;
  right: 5px;

  width: 27px;
  height: 27px;
  min-width: 27px;
  min-height: 27px;

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

  margin: 0;
  padding: 0 0 1px 0;

  border-radius: 999px;

  border: 1px solid rgba(255,255,255,.18);

  background:
    radial-gradient(
      circle at 50% 30%,
      rgba(255,255,255,.18) 0%,
      rgba(255,255,255,.065) 58%,
      rgba(0,0,0,.20) 100%
    );

  color: rgba(255,255,255,.46);

  font-family: Arial, "Segoe UI Symbol", "Noto Sans Symbols", sans-serif;
  font-size: 14px;
  font-weight: 950;
  line-height: 1;

  cursor: pointer;
  outline: none;

  pointer-events: auto;
  touch-action: manipulation;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    0 6px 14px rgba(0,0,0,.25);

  opacity: .72;

  transition:
    transform .16s ease,
    opacity .16s ease,
    color .16s ease,
    border-color .16s ease,
    background .16s ease,
    box-shadow .16s ease,
    filter .16s ease;
}


/* Hover de estrella cuando la tarjeta NO es favorita */
.mpd-match-detail-scope .datos-league-team-card:not(.is-favorite):hover
.datos-league-team-favorite-btn:not(.is-favorite):not([aria-pressed="true"]) {
  opacity: 1;

  color: rgba(255,255,255,.88);

  border-color: rgba(255,215,64,.34);

  background:
    radial-gradient(
      circle at 50% 30%,
      rgba(255,215,64,.16) 0%,
      rgba(255,255,255,.08) 58%,
      rgba(0,0,0,.16) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 8px 16px rgba(0,0,0,.28),
    0 0 14px rgba(255,215,64,.10);
}

/* Hover propio de la estrella */
.mpd-match-detail-scope .datos-league-team-favorite-btn:hover {
  transform: translateY(-1px) scale(1.08);

  opacity: 1;

  color: rgba(255,255,255,.96);

  border-color: rgba(255,215,64,.54);

  background:
    radial-gradient(
      circle at 50% 30%,
      rgba(255,215,64,.23) 0%,
      rgba(255,255,255,.09) 58%,
      rgba(0,0,0,.15) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 9px 18px rgba(0,0,0,.30),
    0 0 16px rgba(255,215,64,.16);
}

.mpd-match-detail-scope .datos-league-team-favorite-btn:active {
  transform: translateY(0) scale(.96);
}

.mpd-match-detail-scope .datos-league-team-favorite-btn:focus-visible {
  opacity: 1;

  border-color: rgba(255,215,64,.74);

  box-shadow:
    0 0 0 2px rgba(255,215,64,.28),
    0 9px 18px rgba(0,0,0,.28);
}


/* =========================================================
   DATOS · ESTRELLA FAVORITA
   ========================================================= */

/*
  Bloque fuerte:
  aunque el botón no actualice la clase a tiempo,
  si la tarjeta padre tiene .is-favorite, la estrella se pinta amarilla.
*/
.mpd-match-detail-scope .datos-league-team-card.is-favorite > .datos-league-team-favorite-btn,
.mpd-match-detail-scope .datos-league-team-card > .datos-league-team-favorite-btn.is-favorite,
.mpd-match-detail-scope .datos-league-team-card > .datos-league-team-favorite-btn[aria-pressed="true"] {
  opacity: 1;

  color: rgba(255,215,64,1) !important;

  border-color: rgba(255,215,64,.58);

  background:
    radial-gradient(
      circle at 50% 30%,
      rgba(255,215,64,.34) 0%,
      rgba(255,215,64,.13) 55%,
      rgba(0,0,0,.18) 100%
    );

  text-shadow:
    0 0 10px rgba(255,215,64,.52);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.13),
    0 8px 18px rgba(0,0,0,.28),
    0 0 18px rgba(255,215,64,.20);
}

.mpd-match-detail-scope .datos-league-team-card.is-favorite:hover > .datos-league-team-favorite-btn,
.mpd-match-detail-scope .datos-league-team-card > .datos-league-team-favorite-btn.is-favorite:hover,
.mpd-match-detail-scope .datos-league-team-card > .datos-league-team-favorite-btn[aria-pressed="true"]:hover {
  transform: translateY(-1px) scale(1.10);

  color: rgba(255,225,95,1) !important;

  border-color: rgba(255,225,95,.74);

  background:
    radial-gradient(
      circle at 50% 30%,
      rgba(255,215,64,.46) 0%,
      rgba(255,215,64,.18) 56%,
      rgba(0,0,0,.16) 100%
    );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.15),
    0 10px 22px rgba(0,0,0,.32),
    0 0 22px rgba(255,215,64,.26);
}


/* =========================================================
   DATOS · ESCUDO DEL EQUIPO
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card__logo-wrap,
.mpd-match-detail-scope .datos-league-team-card-logo-shell {
  position: relative;
  z-index: 1;

  width: 62px;
  height: 62px;
  min-width: 62px;
  min-height: 62px;

  border-radius: 999px;
  overflow: hidden;

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

  background:
    radial-gradient(
      circle at 50% 35%,
      rgba(255,255,255,.14) 0%,
      rgba(255,255,255,.045) 58%,
      rgba(0,0,0,.16) 100%
    );

  border: 1px solid rgba(255,255,255,.16);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    0 8px 16px rgba(0,0,0,.20);

  transition:
    transform .18s ease,
    box-shadow .18s ease,
    border-color .18s ease,
    background .18s ease;
}

.mpd-match-detail-scope .datos-league-team-card:hover .datos-league-team-card__logo-wrap,
.mpd-match-detail-scope .datos-league-team-card:hover .datos-league-team-card-logo-shell {
  transform: translateY(-1px) scale(1.04);

  border-color: color-mix(
    in srgb,
    var(--datos-team-menu-accent-safe) 38%,
    rgba(255,255,255,.20)
  );

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 11px 22px rgba(0,0,0,.26);
}

.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card__logo-wrap,
.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card-logo-shell {
  border-color: rgba(255,215,64,.32);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 9px 18px rgba(0,0,0,.23),
    0 0 15px rgba(255,215,64,.10);
}

.mpd-match-detail-scope .datos-league-team-card.is-favorite:hover .datos-league-team-card__logo-wrap,
.mpd-match-detail-scope .datos-league-team-card.is-favorite:hover .datos-league-team-card-logo-shell {
  border-color: rgba(255,215,64,.52);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 12px 24px rgba(0,0,0,.28),
    0 0 18px rgba(255,215,64,.14);
}

.mpd-match-detail-scope .datos-league-team-card__img,
.mpd-match-detail-scope .datos-league-team-card-logo {
  width: 44px;
  height: 44px;

  object-fit: contain;

  display: block;
  user-select: none;
  pointer-events: none;

  border-radius: 999px;
}

.mpd-match-detail-scope .datos-league-team-card__fallback,
.mpd-match-detail-scope .datos-league-team-card-initials {
  width: 44px;
  height: 44px;

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

  color: white;

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

  border-radius: 999px;

  background: rgba(255,255,255,.08);
}


/* =========================================================
   DATOS · TEXTO DEL EQUIPO
   ========================================================= */

.mpd-match-detail-scope .datos-league-team-card__name,
.mpd-match-detail-scope .datos-league-team-card-name {
  position: relative;
  z-index: 1;

  width: 100%;
  min-width: 0;

  color: rgba(255,255,255,.96);

  font-size: 12px;
  font-weight: 850;
  line-height: 1.15;
  text-align: center;

  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;

  overflow: hidden;
  text-overflow: ellipsis;

  min-height: 42px;

  word-break: break-word;
  text-wrap: balance;
}

.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card__name,
.mpd-match-detail-scope .datos-league-team-card.is-favorite .datos-league-team-card-name {
  color: rgba(255,255,255,.98);
}

.mpd-match-detail-scope .datos-league-team-card-subtitle {
  position: relative;
  z-index: 1;

  min-height: 18px;

  color: rgba(255,255,255,.62);

  font-size: 10px;
  font-weight: 750;
  line-height: 1.1;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  max-width: 100%;
}

.mpd-match-detail-scope .datos-league-team-card-subtitle.is-empty {
  opacity: 0;
}


/* =========================================================
   DATOS · REDUCIR ANIMACIÓN SI EL SISTEMA LO PIDE
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  .mpd-match-detail-scope .datos-league-team-card,
  .mpd-match-detail-scope .datos-league-team-card__inner,
  .mpd-match-detail-scope .datos-league-team-card-inner,
  .mpd-match-detail-scope .datos-league-team-favorite-btn,
  .mpd-match-detail-scope .datos-league-team-card__logo-wrap,
  .mpd-match-detail-scope .datos-league-team-card-logo-shell {
    transition: none;
  }

  .mpd-match-detail-scope .datos-league-team-card:hover,
  .mpd-match-detail-scope .datos-league-team-favorite-btn:hover {
    transform: none;
  }
}


/* =========================================================
   DATOS · RESPONSIVE
   ========================================================= */

@media (max-width: 1100px) {
  .mpd-match-detail-scope .datos-league-team-cards-grid {
    gap: 12px;
  }

  .mpd-match-detail-scope .datos-league-teams-menu-grid {
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
    gap: 12px;
  }

  .mpd-match-detail-scope .datos-league-team-card {
    width: 112px;
    flex-basis: 112px;
    min-width: 112px;
    max-width: 112px;
  }

  .mpd-match-detail-scope .datos-league-team-card-btn {
    min-height: 138px;
  }

  .mpd-match-detail-scope .datos-league-team-card__inner,
  .mpd-match-detail-scope .datos-league-team-card-inner {
    min-height: 138px;
  }

  .mpd-match-detail-scope .datos-league-team-card__logo-wrap,
  .mpd-match-detail-scope .datos-league-team-card-logo-shell {
    width: 58px;
    height: 58px;
    min-width: 58px;
    min-height: 58px;
  }

  .mpd-match-detail-scope .datos-league-team-card__img,
  .mpd-match-detail-scope .datos-league-team-card-logo,
  .mpd-match-detail-scope .datos-league-team-card__fallback,
  .mpd-match-detail-scope .datos-league-team-card-initials {
    width: 42px;
    height: 42px;
  }

  .mpd-match-detail-scope .datos-league-team-favorite-btn {
    top: 5px;
    right: 5px;

    width: 26px;
    height: 26px;
    min-width: 26px;
    min-height: 26px;

    padding: 0 0 1px 0;

    font-size: 13px;
  }
}

@media (max-width: 620px) {
  .mpd-match-detail-scope .datos-league-team-cards-grid {
    gap: 10px;
  }

  .mpd-match-detail-scope .datos-league-teams-menu-grid {
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
    gap: 10px;
  }

  .mpd-match-detail-scope .datos-league-team-card {
    width: 104px;
    flex-basis: 104px;
    min-width: 104px;
    max-width: 104px;
  }

  .mpd-match-detail-scope .datos-league-team-card:hover {
    transform: translateY(-2px);
  }

  .mpd-match-detail-scope .datos-league-team-card-btn {
    min-height: 132px;
  }

  .mpd-match-detail-scope .datos-league-team-card__inner,
  .mpd-match-detail-scope .datos-league-team-card-inner {
    min-height: 132px;
    border-radius: 16px;
    padding: 12px 9px 10px;
    gap: 9px;
  }

  .mpd-match-detail-scope .datos-league-team-card__logo-wrap,
  .mpd-match-detail-scope .datos-league-team-card-logo-shell {
    width: 54px;
    height: 54px;
    min-width: 54px;
    min-height: 54px;
  }

  .mpd-match-detail-scope .datos-league-team-card__img,
  .mpd-match-detail-scope .datos-league-team-card-logo,
  .mpd-match-detail-scope .datos-league-team-card__fallback,
  .mpd-match-detail-scope .datos-league-team-card-initials {
    width: 39px;
    height: 39px;
  }

  .mpd-match-detail-scope .datos-league-team-card__name,
  .mpd-match-detail-scope .datos-league-team-card-name {
    font-size: 11px;
    min-height: 38px;
  }

  .mpd-match-detail-scope .datos-league-team-card-subtitle {
    font-size: 9px;
  }

  .mpd-match-detail-scope .datos-league-team-favorite-btn {
    top: 4px;
    right: 4px;

    width: 25px;
    height: 25px;
    min-width: 25px;
    min-height: 25px;

    padding: 0 0 1px 0;

    font-size: 12px;
  }
}


/* ==== FUENTE: navegacion equipos.css ==== */

/* =========================================================
   DATOS · navegación de equipos + barra combinada liga/equipos/grupo
   ========================================================= */

.datos-teams-grid .ag-row {
  cursor: pointer;
}

.datos-teams-grid .ag-row:hover {
  filter: brightness(1.08);
}

.datos-team-nav-label,
.datos-team-nav-count,
.datos-team-nav-blob {
  display: none !important;
}

/* =========================================================
   Barra superior combinada
   Desktop:
   Izquierda: liga
   Centro: equipos
   Derecha: dropdown grupo
   ========================================================= */

.datos-team-combined-nav-shell {
  position: relative;

  width: 100%;
  min-width: 0;
  box-sizing: border-box;

  display: grid;
  grid-template-columns: minmax(220px, 330px) minmax(0, 1fr) 170px;
  align-items: center;
  gap: 14px;

  height: 92px;
  min-height: 92px;
  max-height: 92px;

  margin-bottom: 14px;
  padding: 10px 14px;

  border-radius: 18px;
  border: 1px solid color-mix(
    in srgb,
    var(--datos-team-accent) 30%,
    rgba(255,255,255,0.08)
  );

  background:
    linear-gradient(
      180deg,
      var(--datos-team-soft) 0%,
      rgba(0,0,0,0.24) 100%
    );

  color: white;

  /*
    No usamos overflow hidden para que el menú del dropdown
    no quede cortado.
  */
  overflow: visible;
}

/* =========================================================
   Bloque izquierdo · liga seleccionada
   ========================================================= */

.datos-team-combined-left {
  min-width: 0;
  width: 100%;
}

.datos-team-combined-league-head {
  display: flex;
  align-items: center;
  gap: 10px;

  width: 100%;
  min-width: 0;
}

.datos-team-combined-league-icon,
.datos-team-combined-league-icon-fallback {
  width: 42px;
  height: 42px;
  flex: 0 0 auto;
}

.datos-team-combined-league-icon {
  object-fit: contain;
}

.datos-team-combined-league-icon-fallback {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 21px;
}

.datos-team-combined-league-text {
  min-width: 0;

  display: flex;
  flex-direction: column;
  justify-content: center;
}

/*
  Título principal:
  - puede partir en 2 líneas
  - no rompe la barra
*/
.datos-team-combined-league-title {
  color: white;
  font-size: 16px;
  font-weight: 850;
  line-height: 1.12;

  white-space: normal;
  overflow: hidden;

  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

/*
  Subtítulo:
  - una sola línea
  - si no entra, ellipsis
*/
.datos-team-combined-league-subtitle {
  color: rgba(255,255,255,0.66);
  font-size: 11px;
  line-height: 1.15;
  margin-top: 4px;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* =========================================================
   Bloque central · equipos
   ========================================================= */

.datos-team-combined-center {
  min-width: 0;
  width: 100%;

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

/*
  Scroller fijo:
  - reserva espacio para el carril del scrollbar
  - no cambia la altura de la barra
*/
.datos-team-combined-teams-scroll {
  width: 100%;
  height: 72px;
  min-height: 72px;
  max-height: 72px;
  min-width: 0;
  box-sizing: border-box;

  overflow-x: auto;
  overflow-y: hidden;
  display: block;

  padding: 4px 8px 13px 8px;
  scrollbar-gutter: stable both-edges;

  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,0.18) transparent;
}

.datos-team-combined-teams-scroll::-webkit-scrollbar {
  height: 5px;
}

.datos-team-combined-teams-scroll::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.18);
  border-radius: 999px;
}

.datos-team-combined-teams-scroll::-webkit-scrollbar-track {
  background: transparent;
}

.datos-team-combined-teams-scroll::-webkit-scrollbar-corner {
  background: transparent;
}

/* Fila de escudos */
.datos-team-nav-strip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  width: max-content;
  min-width: 100%;

  margin: 0 auto;
  white-space: nowrap;
  flex-wrap: nowrap;
}

.datos-team-combined-team-strip {
  min-width: 100% !important;
  width: max-content !important;
  justify-content: center !important;
  margin: 0 auto !important;
}

/* Mensaje de error/vacío */
.datos-team-combined-error {
  width: 100%;
  text-align: center;
  color: rgba(255,255,255,0.72);
  font-size: 12px;
  line-height: 1.35;
}

/* =========================================================
   Bloque derecho · dropdown grupo
   ========================================================= */

.datos-team-combined-right {
  min-width: 0;
  width: 100%;

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

.datos-team-group-dropdown {
  width: 165px;
  min-width: 165px;
  max-width: 165px;

  flex: 0 0 auto;
  font-size: 12px;
}

/* React Select antiguo usado por dcc.Dropdown */
.datos-team-group-dropdown .Select-control {
  min-height: 36px;
  height: 36px;

  border-radius: 999px !important;
  border: 1px solid color-mix(
    in srgb,
    var(--datos-team-accent) 50%,
    rgba(255,255,255,0.14)
  ) !important;

  background:
    linear-gradient(
      90deg,
      color-mix(
        in srgb,
        var(--datos-team-accent) 22%,
        rgba(255,255,255,0.055)
      ) 0%,
      rgba(255,255,255,0.065) 100%
    ) !important;

  box-shadow: none !important;
}

.datos-team-group-dropdown .Select-control:hover {
  border-color: color-mix(
    in srgb,
    var(--datos-team-accent) 72%,
    rgba(255,255,255,0.22)
  ) !important;
}

.datos-team-group-dropdown .Select-placeholder,
.datos-team-group-dropdown .Select-value,
.datos-team-group-dropdown .Select-value-label {
  color: white !important;
  line-height: 34px !important;
  font-weight: 800;
  font-size: 12px;
}

.datos-team-group-dropdown .Select-value-label {
  max-width: 122px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.datos-team-group-dropdown .Select-input {
  height: 34px !important;
}

.datos-team-group-dropdown .Select-input > input {
  color: white !important;
  font-size: 12px !important;
}

.datos-team-group-dropdown .Select-arrow-zone {
  width: 30px !important;
}

.datos-team-group-dropdown .Select-arrow {
  border-top-color: rgba(255,255,255,0.82) !important;
}

/* Menú */
.datos-team-group-dropdown .Select-menu-outer {
  margin-top: 7px;

  border-radius: 14px !important;
  overflow: hidden;

  background: rgba(14,18,24,0.98) !important;
  border: 1px solid rgba(255,255,255,0.13) !important;
  box-shadow: 0 16px 34px rgba(0,0,0,0.34) !important;

  z-index: 9999 !important;
}

.datos-team-group-dropdown .Select-menu {
  max-height: 260px !important;
}

.datos-team-group-dropdown .Select-option {
  background: rgba(14,18,24,0.98) !important;
  color: rgba(255,255,255,0.86) !important;

  font-size: 12px;
  font-weight: 700;
  padding: 9px 12px;
}

.datos-team-group-dropdown .Select-option:hover,
.datos-team-group-dropdown .Select-option.is-focused {
  background: color-mix(
    in srgb,
    var(--datos-team-accent) 24%,
    rgba(255,255,255,0.08)
  ) !important;
  color: white !important;
}

.datos-team-group-dropdown .Select-option.is-selected {
  background: color-mix(
    in srgb,
    var(--datos-team-accent) 36%,
    rgba(255,255,255,0.08)
  ) !important;
  color: white !important;
}

/* Compatibilidad con versiones nuevas de dcc.Dropdown */
.datos-team-group-dropdown .Select__control {
  min-height: 36px;
  border-radius: 999px !important;
  border: 1px solid color-mix(
    in srgb,
    var(--datos-team-accent) 50%,
    rgba(255,255,255,0.14)
  ) !important;
  background: rgba(255,255,255,0.06) !important;
  box-shadow: none !important;
}

.datos-team-group-dropdown .Select__single-value,
.datos-team-group-dropdown .Select__placeholder,
.datos-team-group-dropdown .Select__input-container {
  color: white !important;
  font-size: 12px;
  font-weight: 800;
}

.datos-team-group-dropdown .Select__menu {
  background: rgba(14,18,24,0.98) !important;
  border: 1px solid rgba(255,255,255,0.13) !important;
  border-radius: 14px !important;
  overflow: hidden;
  box-shadow: 0 16px 34px rgba(0,0,0,0.34) !important;
  z-index: 9999 !important;
}

.datos-team-group-dropdown .Select__option {
  background: rgba(14,18,24,0.98) !important;
  color: rgba(255,255,255,0.86) !important;
  font-size: 12px;
  font-weight: 700;
}

.datos-team-group-dropdown .Select__option--is-focused {
  background: color-mix(
    in srgb,
    var(--datos-team-accent) 24%,
    rgba(255,255,255,0.08)
  ) !important;
  color: white !important;
}

.datos-team-group-dropdown .Select__option--is-selected {
  background: color-mix(
    in srgb,
    var(--datos-team-accent) 36%,
    rgba(255,255,255,0.08)
  ) !important;
  color: white !important;
}

/* =========================================================
   Botón de equipo solo con escudo
   ========================================================= */

.datos-team-nav-btn {
  appearance: none;
  -webkit-appearance: none;

  position: relative;

  width: 56px;
  height: 56px;
  min-width: 56px;
  padding: 0;

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

  border-radius: 17px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.045);

  color: white;
  cursor: pointer;

  flex: 0 0 auto;

  transition:
    background .22s ease,
    border-color .22s ease,
    box-shadow .22s ease,
    transform .22s ease,
    filter .22s ease;
}

.datos-team-nav-btn:hover {
  transform: translateY(-2px);

  border-color: color-mix(
    in srgb,
    var(--datos-team-accent) 65%,
    rgba(255,255,255,0.22)
  );

  background:
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        var(--datos-team-accent) 22%,
        rgba(255,255,255,0.06)
      ) 0%,
      rgba(255,255,255,0.06) 100%
    );

  box-shadow: 0 8px 18px rgba(0,0,0,0.18);
}

.datos-team-nav-btn.is-active {
  transform: translateY(-1px);

  border-color: color-mix(
    in srgb,
    var(--datos-team-accent) 85%,
    rgba(255,255,255,0.40)
  );

  background:
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        var(--datos-team-accent) 32%,
        rgba(255,255,255,0.08)
      ) 0%,
      rgba(255,255,255,0.08) 100%
    );

  box-shadow:
    0 0 0 1px rgba(255,255,255,0.05),
    0 0 22px color-mix(
      in srgb,
      var(--datos-team-accent) 30%,
      transparent
    );
}

.datos-team-nav-logo {
  width: 40px;
  height: 40px;
  object-fit: contain;

  display: block;
  border-radius: 999px;

  filter: drop-shadow(0 3px 5px rgba(0,0,0,0.28));
}

.datos-team-nav-initials {
  width: 40px;
  height: 40px;

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

  border-radius: 999px;
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.12);

  font-size: 13px;
  font-weight: 850;
  color: white;
}

/* Tooltip visual con nombre del equipo */
.datos-team-nav-btn::after {
  content: attr(data-team-name);

  position: absolute;
  left: 50%;
  bottom: calc(100% + 9px);
  transform: translateX(-50%) translateY(4px);

  max-width: 260px;
  padding: 7px 10px;

  border-radius: 10px;
  background: rgba(5,8,12,0.96);
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow: 0 10px 24px rgba(0,0,0,0.28);

  color: white;
  font-size: 11px;
  font-weight: 750;
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;

  opacity: 0;
  pointer-events: none;
  z-index: 80;

  transition:
    opacity .16s ease,
    transform .16s ease;
}

.datos-team-nav-btn:hover::after {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* =========================================================
   Responsive medio
   ========================================================= */

@media (max-width: 1100px) {
  .datos-team-combined-nav-shell {
    grid-template-columns: minmax(180px, 260px) minmax(0, 1fr) 160px;
    gap: 10px;
  }

  .datos-team-group-dropdown {
    width: 155px;
    min-width: 155px;
    max-width: 155px;
  }

  .datos-team-nav-btn {
    width: 52px;
    height: 52px;
    min-width: 52px;
    border-radius: 16px;
  }

  .datos-team-nav-logo,
  .datos-team-nav-initials {
    width: 37px;
    height: 37px;
  }
}

/* =========================================================
   Responsive móvil
   En móvil:
   fila 1: liga izquierda + dropdown derecha
   fila 2: equipos debajo
   ========================================================= */

@media (max-width: 768px) {
  .datos-team-combined-nav-shell {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "league group"
      "teams teams";

    height: auto;
    min-height: 0;
    max-height: none;

    gap: 10px 10px;
    padding: 10px;
    align-items: center;
  }

  .datos-team-combined-left {
    grid-area: league;
    min-width: 0;
    width: 100%;
  }

  .datos-team-combined-right {
    grid-area: group;
    min-width: 0;

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

  .datos-team-combined-center {
    grid-area: teams;
    min-width: 0;
    width: 100%;

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

  .datos-team-combined-league-head {
    min-width: 0;
    width: 100%;
  }

  .datos-team-combined-league-icon,
  .datos-team-combined-league-icon-fallback {
    width: 34px;
    height: 34px;
  }

  .datos-team-combined-league-title {
    font-size: 15px;
    line-height: 1.12;

    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;

    white-space: normal;
    overflow: hidden;
  }

  .datos-team-combined-league-subtitle {
    font-size: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .datos-team-group-dropdown {
    width: 150px;
    min-width: 150px;
    max-width: 150px;
  }

  .datos-team-combined-teams-scroll {
    height: 66px;
    min-height: 66px;
    max-height: 66px;

    padding: 4px 2px 10px;
  }

  .datos-team-combined-team-strip {
    justify-content: flex-start !important;
    min-width: max-content !important;
    width: max-content !important;
    margin: 0 !important;
  }

  .datos-team-nav-strip {
    gap: 9px;
  }

  .datos-team-nav-btn {
    width: 50px;
    height: 50px;
    min-width: 50px;
    border-radius: 15px;
  }

  .datos-team-nav-logo,
  .datos-team-nav-initials {
    width: 35px;
    height: 35px;
  }
}

/* =========================================================
   Responsive móvil muy estrecho
   ========================================================= */

@media (max-width: 460px) {
  .datos-team-combined-nav-shell {
    grid-template-columns: minmax(0, 1fr) 132px;
    gap: 9px;
  }

  .datos-team-group-dropdown {
    width: 132px;
    min-width: 132px;
    max-width: 132px;
  }

  .datos-team-combined-league-title {
    font-size: 14px;
  }

  .datos-team-combined-league-subtitle {
    font-size: 9.5px;
  }
}
/* =========================================================
   MPD · V5 ajustes solicitados
   - tarjeta limpia con GMaps junto al campo
   - sin scroll lateral general en 14''
   - clasificación auto full/compact por JS
   - plantillas con selector local/visitante
   ========================================================= */

.mpd-modal-body,
.mpd-match-detail-body,
.mpd-match-detail-content,
.mpd-match-detail-panes{
  overflow-x:hidden!important;
  max-width:100%!important;
}

.mpd-match-detail-panes{
  flex:1 1 auto!important;
  min-height:0!important;
  padding:12px 14px 18px!important;
}

.mpd-match-hero-card{
  width:min(100%,1040px);
  margin:0 auto;
  border-radius:18px;
  padding:12px 14px;
  background:
    radial-gradient(circle at 50% 0%,rgba(6,190,132,.13),transparent 42%),
    linear-gradient(180deg,rgba(255,255,255,.060),rgba(255,255,255,.026));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 14px 38px rgba(0,0,0,.32),inset 0 0 0 1px rgba(255,255,255,.025);
  color:#EFFFF6;
}

.mpd-match-hero-meta-row,
.mpd-match-hero-extra-chips{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:7px;
}

.mpd-match-hero-extra-chips{
  margin-top:0;
}

.mpd-match-hero-pill{
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(6,190,132,.13);
  border:1px solid rgba(6,190,132,.30);
  color:#EFFFF6;
  white-space:nowrap;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}

.mpd-match-hero-pill--small{
  padding:5px 9px;
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.10);
}

.mpd-match-hero-pill-label{
  font-size:10px;
  font-weight:800;
  opacity:.62;
  letter-spacing:.25px;
  text-transform:uppercase;
}

.mpd-match-hero-pill-value{
  min-width:0;
  max-width:min(420px,70vw);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:900;
}

.mpd-match-hero-main-row{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  gap:16px;
  align-items:center;
  padding:12px 0 10px;
}

.mpd-match-hero-team{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}

.mpd-match-hero-team--local{
  justify-content:flex-end;
  text-align:right;
}

.mpd-match-hero-team--visitante{
  justify-content:flex-start;
  text-align:left;
}

.mpd-match-hero-team--local .mpd-match-hero-team-shield{
  order:2;
}

.mpd-match-hero-team-shield{
  flex:0 0 auto;
  width:46px;
  height:46px;
  border-radius:50%;
  object-fit:cover;
  background:rgba(255,255,255,.04);
  border:2px solid rgba(239,255,246,.92);
  box-shadow:0 3px 10px rgba(0,0,0,.35);
}

.mpd-match-hero-team-name{
  min-width:0;
  max-width:100%;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:17px;
  line-height:1.05;
  font-weight:950;
  color:#EFFFF6;
}

.mpd-match-hero-center{
  min-width:74px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
}

.mpd-match-hero-agecat{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:20px;
}

.mpd-match-hero-age-icon{
  width:22px;
  height:22px;
  border-radius:50%;
  object-fit:contain;
}

.mpd-match-hero-league-icon{
  width:18px;
  height:18px;
  border-radius:50%;
  object-fit:contain;
}

.mpd-match-hero-vs{
  padding:5px 10px;
  border-radius:999px;
  color:#EFFFF6;
  font-size:12px;
  font-weight:950;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.12);
}

.mpd-match-hero-field-row{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:8px;
  max-width:100%;
  min-width:0;
}

.mpd-match-hero-pill--field{
  max-width:min(760px,calc(100% - 42px));
}

.mpd-match-hero-field-empty{
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  opacity:.64;
  color:#EFFFF6;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
}

.mpd-match-hero-map-btn{
  flex:0 0 auto;
  width:30px;
  height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 5px 14px rgba(0,0,0,.24);
  transition:transform .16s ease,background .16s ease,border-color .16s ease;
}

.mpd-match-hero-map-btn:not(.is-disabled):hover{
  transform:translateY(-1px);
  background:rgba(6,190,132,.16);
  border-color:rgba(6,190,132,.42);
}

.mpd-match-hero-map-btn.is-disabled{
  opacity:.38;
  cursor:not-allowed;
}

.mpd-match-hero-map-icon{
  width:18px;
  height:18px;
  object-fit:contain;
  display:block;
}

.mpd-classification-measure-container,
.mpd-classification-content-wrap,
.mpd-classification-content{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}

.mpd-datos-canvas,
.mpd-datos-inner,
.mpd-datos-stage,
.mpd-datos-layer{
  min-width:0!important;
  max-width:100%!important;
  width:100%!important;
  overflow-x:hidden!important;
}

.mpd-match-detail-scope .datos-classification-grid,
.mpd-match-detail-scope .datos-classification-grid .ag-root-wrapper,
.mpd-match-detail-scope .datos-classification-grid .ag-root,
.mpd-match-detail-scope .datos-classification-grid .ag-body,
.mpd-match-detail-scope .datos-classification-grid .ag-body-viewport,
.mpd-match-detail-scope .datos-classification-grid .ag-center-cols-viewport,
.mpd-match-detail-scope .datos-classification-grid .ag-center-cols-clipper{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
}

.mpd-match-detail-scope .datos-classification-grid{
  overflow:hidden!important;
}

.mpd-auto-mode-row{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  margin:0 0 8px;
}

.mpd-auto-mode-label{
  font-size:10px;
  font-weight:850;
  letter-spacing:.35px;
  text-transform:uppercase;
  color:rgba(239,255,246,.55);
}

.mpd-auto-mode-chip{
  padding:4px 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  color:#EFFFF6;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.055);
}

.mpd-auto-mode-chip--full{
  background:rgba(6,190,132,.16);
  border-color:rgba(6,190,132,.38);
}

.mpd-auto-mode-chip--compact{
  background:rgba(96,165,250,.12);
  border-color:rgba(96,165,250,.30);
}

.mpd-match-detail-scope .datos-evo-html-logo-btn,
.mpd-match-detail-scope .datos-evo-html-bottom-legend-btn{
  cursor:pointer!important;
  pointer-events:auto!important;
}

.mpd-match-detail-scope .datos-evo-html-logo-btn:hover,
.mpd-match-detail-scope .datos-evo-html-bottom-legend-btn:hover{
  transform:translateY(-1px) scale(1.03);
}

.mpd-match-detail-scope .datos-teams-goals-grid,
.mpd-match-detail-scope .datos-teams-goals-grid--two,
.mpd-match-detail-scope .datos-teams-goals-grid--three{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr))!important;
  overflow:hidden!important;
}

.mpd-match-detail-scope .datos-teams-goals-card,
.mpd-match-detail-scope .datos-teams-goals-card--map,
.mpd-match-detail-scope .datos-teams-goals-graph,
.mpd-match-detail-scope .datos-home-away-card,
.mpd-match-detail-scope .datos-home-away-chart-shell{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}

.mpd-match-detail-scope .js-plotly-plot,
.mpd-match-detail-scope .plot-container,
.mpd-match-detail-scope .svg-container,
.mpd-match-detail-scope .main-svg{
  max-width:100%!important;
}

.mpd-plantillas-selector{
  width:100%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
  margin-bottom:12px;
}

.mpd-plantillas-team-btn{
  min-width:0;
  height:54px;
  padding:8px 12px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.026));
  color:rgba(239,255,246,.82);
  cursor:pointer;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}

.mpd-plantillas-team-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,.22);
  color:#EFFFF6;
}

.mpd-plantillas-team-btn.is-active{
  color:#EFFFF6;
  border-color:rgba(6,190,132,.52);
  background:linear-gradient(135deg,rgba(6,190,132,.24),rgba(6,190,132,.08));
  box-shadow:0 10px 28px rgba(6,190,132,.13), inset 0 0 0 1px rgba(6,190,132,.10);
}

.mpd-plantillas-team-shield{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:50%;
  object-fit:cover;
  border:1.8px solid rgba(239,255,246,.86);
  box-shadow:0 3px 9px rgba(0,0,0,.30);
}

.mpd-plantillas-team-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  font-weight:900;
}

.mpd-plantillas-content,
.mpd-team-players-panel{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}

.mpd-players-selected-team-header{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:0 0 10px;
  padding:10px 12px;
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.028));
  border:1px solid rgba(255,255,255,.11);
}

.mpd-players-selected-team-shield{
  width:46px;
  height:46px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid rgba(239,255,246,.92);
  box-shadow:0 4px 12px rgba(0,0,0,.32);
}

.mpd-players-selected-team-kicker{
  color:rgba(239,255,246,.58);
  font-size:10px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.45px;
  margin-bottom:3px;
}

.mpd-players-selected-team-name{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#EFFFF6;
  font-size:17px;
  line-height:1.05;
  font-weight:950;
}

.mpd-match-detail-scope .datos-team-players-card,
.mpd-match-detail-scope .datos-team-players-grid,
.mpd-match-detail-scope .datos-player-grid,
.mpd-match-detail-scope .datos-player-grid-wrap{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}

@media (max-width: 1200px){
  .mpd-match-detail-modal .modal-dialog{
    width:98vw!important;
    max-width:98vw!important;
  }
  .mpd-match-detail-panes{
    padding:10px!important;
  }
  .mpd-match-hero-card{
    width:100%;
  }
  .mpd-match-hero-main-row{
    gap:10px;
  }
  .mpd-match-hero-team-name{
    font-size:15px;
  }
  .mpd-match-hero-team-shield{
    width:40px;
    height:40px;
  }
}

@media (max-width: 820px){
  .mpd-match-hero-main-row{
    grid-template-columns:1fr;
    gap:8px;
  }
  .mpd-match-hero-team,
  .mpd-match-hero-team--local,
  .mpd-match-hero-team--visitante{
    justify-content:center;
    text-align:center;
  }
  .mpd-match-hero-team--local .mpd-match-hero-team-shield{
    order:0;
  }
  .mpd-match-hero-center{
    order:2;
  }
  .mpd-plantillas-selector{
    grid-template-columns:1fr;
  }
  .mpd-match-detail-nav{
    justify-content:flex-start;
    overflow-x:auto;
  }
}

/* =========================================================
   MPD V3 · AJUSTES SOLICITADOS
   - Loading solo en apertura: sin loaders internos.
   - Tarjeta partido con campo/maps en la fila superior.
   - Sin chips codacta/liga/grupo.
   - Sin línea visual entre navbar y contenido.
   - Cabeceras propias para clasificación/insights/plantillas.
   - Wheel horizontal en grids de plantillas vía JS.
   ========================================================= */

.mpd-match-detail-top-card{
  padding:10px 14px 6px!important;
  border-bottom:0!important;
  gap:0!important;
}

.mpd-match-hero-extra-chips,
.mpd-match-hero-extra-chips.is-hidden{
  display:none!important;
}

.mpd-match-hero-meta-line{
  width:100%;
  max-width:100%;
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-bottom:8px;
}

.mpd-match-hero-meta-line .mpd-match-hero-meta-row{
  margin:0!important;
  flex:0 1 auto;
  min-width:0;
  max-width:calc(100% - 42px);
  justify-content:center;
}

.mpd-match-hero-meta-line .mpd-match-hero-map-btn{
  flex:0 0 30px;
}

.mpd-match-hero-meta-line .mpd-match-hero-pill--field{
  max-width:min(520px,40vw);
}

.mpd-match-detail-nav-wrap{
  padding:6px 14px 0!important;
  background:transparent!important;
  backdrop-filter:none!important;
  border:0!important;
  box-shadow:none!important;
}

.mpd-match-detail-panes{
  padding:6px 14px 18px!important;
  border:0!important;
}

.mpd-match-detail-nav{
  box-shadow:none!important;
}

.mpd-auto-mode-row,
.mpd-auto-mode-label,
.mpd-auto-mode-chip{
  display:none!important;
}

.mpd-classification-content > .mpd-datos-stack{
  margin-top:0!important;
}

.mpd-section-header{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 0 12px;
  padding:0;
  min-width:0;
}

.mpd-section-title-block{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.mpd-section-title{
  color:#EFFFF6;
  font-size:15px;
  line-height:1.05;
  font-weight:950;
  letter-spacing:.15px;
}

.mpd-section-subtitle{
  color:rgba(239,255,246,.68);
  font-size:12px;
  line-height:1.25;
  font-weight:700;
}

.mpd-section-subtitle--team{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(239,255,246,.82);
}

.mpd-section-competition{
  min-width:0;
  max-width:55%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}

.mpd-section-icons{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:5px;
}

.mpd-section-icons .mpd-match-hero-age-icon,
.mpd-section-icons .mpd-match-hero-league-icon{
  width:24px!important;
  height:24px!important;
  border-radius:50%;
  object-fit:contain;
  display:block;
  box-shadow:0 3px 8px rgba(0,0,0,.22);
}

.mpd-section-icons .mpd-match-hero-league-icon{
  width:21px!important;
  height:21px!important;
}

.mpd-section-competition-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
}

.mpd-section-league{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#EFFFF6;
  font-size:12px;
  line-height:1.05;
  font-weight:950;
}

.mpd-section-group{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(239,255,246,.62);
  font-size:11px;
  line-height:1.05;
  font-weight:800;
}

.mpd-classification-custom-head{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
  flex-wrap:wrap;
}

.mpd-classification-custom-head .mpd-section-header{
  flex:1 1 420px;
  margin:0!important;
}

.mpd-classification-custom-head .datos-classif-mode-switch{
  flex:0 0 auto;
}

.mpd-section-header--players{
  justify-content:flex-start;
  gap:12px;
  margin-bottom:12px;
}

.mpd-section-team-shield{
  flex:0 0 auto;
  width:44px;
  height:44px;
  border-radius:50%;
  object-fit:cover;
  border:2px solid rgba(239,255,246,.90);
  box-shadow:0 4px 12px rgba(0,0,0,.32);
}

.mpd-players-selected-team-header,
.mpd-players-selected-team-shield,
.mpd-players-selected-team-copy{
  display:none!important;
}

.mpd-plantillas-selector{
  margin-bottom:10px!important;
}

.mpd-plantillas-team-btn{
  height:48px!important;
}

.mpd-detail-players-canvas .datos-team-players-grid,
.mpd-match-detail-scope .datos-team-players-grid{
  overflow-x:auto!important;
  overscroll-behavior-x:contain;
}

.mpd-detail-players-canvas .ag-root-wrapper,
.mpd-match-detail-scope .datos-team-players-grid .ag-root-wrapper{
  overflow:hidden!important;
}

.mpd-match-detail-scope .datos-team-players-grid .ag-body-horizontal-scroll,
.mpd-match-detail-scope .datos-team-players-grid .ag-center-cols-viewport{
  overscroll-behavior-x:contain;
}

@media (max-width: 1200px){
  .mpd-match-detail-modal .modal-dialog{
    width:98vw!important;
    max-width:98vw!important;
    margin:2vh auto!important;
  }

  .mpd-match-detail-modal-content-shell{
    height:96vh!important;
    max-height:96vh!important;
  }

  .mpd-match-hero-meta-line{
    align-items:flex-start;
  }

  .mpd-match-hero-meta-line .mpd-match-hero-meta-row{
    justify-content:flex-start;
    overflow-x:auto;
    padding-bottom:2px;
  }

  .mpd-match-hero-meta-line .mpd-match-hero-pill--field{
    max-width:360px;
  }

  .mpd-section-header,
  .mpd-classification-custom-head{
    align-items:flex-start;
  }

  .mpd-section-competition{
    max-width:100%;
    justify-content:flex-start;
  }

  .mpd-section-competition-copy{
    align-items:flex-start;
  }
}

@media (max-width: 760px){
  .mpd-section-header{
    flex-direction:column;
  }

  .mpd-section-header--players{
    flex-direction:row;
  }

  .mpd-match-detail-nav{
    width:100%!important;
    overflow-x:auto;
    justify-content:flex-start;
  }

  .mpd-match-detail-nav-btn{
    flex:0 0 auto;
  }

  .mpd-plantillas-selector{
    grid-template-columns:1fr!important;
  }
}





/* =========================================================
   MPD MODAL · PATCH v4
   - Quita líneas/barras separadoras de ancho completo.
   - Deja el selector Local/Visitante como botones compactos.
   - Devuelve al grid de Plantillas scroll nativo tipo AG Grid
     (vertical + horizontal propio del grid, sin JS de rueda).
   ========================================================= */

/* ---------------------------------------------------------
   1) Quitar líneas/barras separadoras antes/después de tabs
   --------------------------------------------------------- */
.mpd-match-detail-modal .mpd-match-detail-top-card{
  border-bottom:0!important;
  box-shadow:none!important;
  padding-bottom:4px!important;
}

.mpd-match-detail-modal .mpd-match-detail-nav-wrap{
  border:0!important;
  border-top:0!important;
  border-bottom:0!important;
  box-shadow:none!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  padding-top:4px!important;
  padding-bottom:4px!important;
}

.mpd-match-detail-modal .mpd-match-detail-nav{
  background:rgba(8,13,14,.72)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)!important;
}

.mpd-match-detail-modal .mpd-match-detail-panes{
  border:0!important;
  border-top:0!important;
  box-shadow:none!important;
  padding-top:4px!important;
  overflow-x:hidden!important;
}

.mpd-match-detail-modal .mpd-match-detail-pane,
.mpd-match-detail-modal .mpd-datos-stack,
.mpd-match-detail-modal .mpd-datos-stage,
.mpd-match-detail-modal .mpd-datos-canvas,
.mpd-match-detail-modal .mpd-plantillas-content,
.mpd-match-detail-modal .mpd-team-players-panel{
  border-top:0!important;
  border-bottom:0!important;
}

/* Si alguna card interna trae una línea decorativa como separador, la apagamos en el modal. */
.mpd-match-detail-modal .mpd-datos-canvas::before,
.mpd-match-detail-modal .mpd-datos-canvas::after,
.mpd-match-detail-modal .mpd-team-players-panel::before,
.mpd-match-detail-modal .mpd-team-players-panel::after,
.mpd-match-detail-modal .datos-team-players-card::before,
.mpd-match-detail-modal .datos-team-players-card::after{
  display:none!important;
  content:none!important;
}

/* ---------------------------------------------------------
   2) Selector Local / Visitante: botones, no barras completas
   --------------------------------------------------------- */
.mpd-match-detail-modal .mpd-plantillas-selector{
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  margin:0 auto 10px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-btn{
  flex:0 1 330px!important;
  width:min(330px, calc(50% - 8px))!important;
  max-width:330px!important;
  min-width:180px!important;
  height:42px!important;
  padding:6px 13px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  background:rgba(255,255,255,.035)!important;
  box-shadow:none!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-btn.is-active{
  border-color:rgba(6,190,132,.55)!important;
  background:linear-gradient(135deg,rgba(6,190,132,.26),rgba(6,190,132,.08))!important;
  box-shadow:0 8px 22px rgba(6,190,132,.12)!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-shield{
  width:28px!important;
  height:28px!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-name{
  font-size:12px!important;
  line-height:1!important;
}

@media (max-width: 760px){
  .mpd-match-detail-modal .mpd-plantillas-selector{
    flex-direction:column!important;
    align-items:stretch!important;
  }

  .mpd-match-detail-modal .mpd-plantillas-team-btn{
    width:100%!important;
    max-width:none!important;
    flex:0 0 auto!important;
  }
}

/* ---------------------------------------------------------
   3) Plantillas: scroll nativo del AG Grid, como clasificación
      NO usar JS de rueda para convertir vertical en horizontal.
   --------------------------------------------------------- */
.mpd-match-detail-modal .mpd-detail-players-canvas,
.mpd-match-detail-modal .mpd-plantillas-content,
.mpd-match-detail-modal .mpd-team-players-panel{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}

.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-card,
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-panel,
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-panel > div{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}

.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:min(62vh, 680px)!important;
  max-height:680px!important;
  overflow:hidden!important;
  overscroll-behavior:contain!important;
}

.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-root-wrapper,
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-root,
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-body{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}

/* Vertical scroll dentro del grid */
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-body-viewport{
  overflow-y:auto!important;
  overflow-x:hidden!important;
}

/* Horizontal scroll nativo de AG Grid abajo, sincronizado con header/body */
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-center-cols-viewport,
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-center-cols-clipper,
.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-header-viewport{
  overflow-x:hidden!important;
}

.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-body-horizontal-scroll{
  display:block!important;
  height:16px!important;
  min-height:16px!important;
  max-height:16px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  background:rgba(0,0,0,.16)!important;
}

.mpd-match-detail-modal .mpd-detail-players-canvas .datos-team-players-grid .ag-body-horizontal-scroll-viewport{
  overflow-x:auto!important;
  overflow-y:hidden!important;
}

/* Evita que el modal completo cree scroll lateral; solo lo crean los grids/plots internos que lo necesiten. */
.mpd-match-detail-modal .mpd-match-detail-body,
.mpd-match-detail-modal .mpd-match-detail-content,
.mpd-match-detail-modal .mpd-match-detail-panes,
.mpd-match-detail-modal .mpd-match-detail-pane--plantillas{
  max-width:100%!important;
  overflow-x:hidden!important;
}


/* =========================================================
   MPD MODAL · PATCH v5
   Quita la línea superior interna en Clasificación / Insights / Plantillas
   ========================================================= */

/* El contenido de las tabs no debe pintar una línea arriba */
.mpd-match-detail-modal .mpd-match-detail-pane--clasificacion,
.mpd-match-detail-modal .mpd-match-detail-pane--insights,
.mpd-match-detail-modal .mpd-match-detail-pane--plantillas{
  border-top:0!important;
  box-shadow:none!important;
  background:transparent!important;
  padding-top:0!important;
  margin-top:0!important;
}

/* Primer wrapper interno de cada tab */
.mpd-match-detail-modal .mpd-match-detail-pane--clasificacion > *,
.mpd-match-detail-modal .mpd-match-detail-pane--insights > *,
.mpd-match-detail-modal .mpd-match-detail-pane--plantillas > *{
  border-top:0!important;
  box-shadow:none!important;
  margin-top:0!important;
}

/* Canvas/stage internos que suelen crear esa barra */
.mpd-match-detail-modal .mpd-datos-stage,
.mpd-match-detail-modal .mpd-datos-canvas,
.mpd-match-detail-modal .mpd-datos-stack,
.mpd-match-detail-modal .mpd-datos-section,
.mpd-match-detail-modal .mpd-datos-card,
.mpd-match-detail-modal .mpd-classification-stage,
.mpd-match-detail-modal .mpd-insights-stage,
.mpd-match-detail-modal .mpd-plantillas-stage,
.mpd-match-detail-modal .mpd-plantillas-content,
.mpd-match-detail-modal .mpd-team-players-panel{
  border-top:0!important;
  box-shadow:none!important;
}

/* Pseudo-elementos que pueden estar dibujando la raya */
.mpd-match-detail-modal .mpd-match-detail-pane--clasificacion::before,
.mpd-match-detail-modal .mpd-match-detail-pane--clasificacion::after,
.mpd-match-detail-modal .mpd-match-detail-pane--insights::before,
.mpd-match-detail-modal .mpd-match-detail-pane--insights::after,
.mpd-match-detail-modal .mpd-match-detail-pane--plantillas::before,
.mpd-match-detail-modal .mpd-match-detail-pane--plantillas::after,
.mpd-match-detail-modal .mpd-datos-stage::before,
.mpd-match-detail-modal .mpd-datos-stage::after,
.mpd-match-detail-modal .mpd-datos-canvas::before,
.mpd-match-detail-modal .mpd-datos-canvas::after,
.mpd-match-detail-modal .mpd-datos-section::before,
.mpd-match-detail-modal .mpd-datos-section::after,
.mpd-match-detail-modal .mpd-datos-card::before,
.mpd-match-detail-modal .mpd-datos-card::after,
.mpd-match-detail-modal .mpd-team-players-panel::before,
.mpd-match-detail-modal .mpd-team-players-panel::after{
  display:none!important;
  content:none!important;
}

/* Quita borde superior de los bloques importados de datos_page dentro del modal */
.mpd-match-detail-modal [class*="datos-"]{
  border-top-color:transparent!important;
}

/* Pero mantenemos bordes normales de tablas/grids, para no romper AG Grid */
.mpd-match-detail-modal .ag-root-wrapper,
.mpd-match-detail-modal .ag-header,
.mpd-match-detail-modal .ag-row,
.mpd-match-detail-modal .ag-cell{
  border-top-color:inherit;
}

/* Ajuste extra: que el contenido empiece justo debajo del nav */
.mpd-match-detail-modal .mpd-match-detail-nav-wrap + .mpd-match-detail-panes,
.mpd-match-detail-modal .mpd-match-detail-nav + .mpd-match-detail-panes{
  margin-top:0!important;
  padding-top:0!important;
  border-top:0!important;
}

/* =========================================================
   MPD MODAL · PLANTILLAS GRID CLASIFICACION-LIKE v7
   ---------------------------------------------------------
   Reescritura completa del comportamiento del grid de Plantillas.

   Objetivo:
   - Dejar solo selector Local/Visitante + AG Grid.
   - Quitar contenedor/título/cabecera heredados de datos_page.
   - Hacer que Plantillas funcione como Clasificación en lo importante:
       * AG Grid con altura real.
       * Scroll vertical interno del grid.
       * Scroll horizontal nativo abajo.
       * El modal no genera scroll lateral global.
   ========================================================= */

/* ---------- Pane limpio ---------- */
.mpd-match-detail-modal .mpd-detail-pane--plantillas,
.mpd-match-detail-modal .mpd-match-detail-pane--plantillas{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow-x:hidden!important;
  overflow-y:visible!important;
}

.mpd-match-detail-modal .mpd-plantillas-content,
.mpd-match-detail-modal .mpd-plantillas-content--grid-like-classification{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

.mpd-match-detail-modal .mpd-plantillas-content::before,
.mpd-match-detail-modal .mpd-plantillas-content::after,
.mpd-match-detail-modal .mpd-plantillas-content--grid-like-classification::before,
.mpd-match-detail-modal .mpd-plantillas-content--grid-like-classification::after{
  display:none!important;
  content:none!important;
}

/* ---------- Si por fallback aparece la card completa de datos_page, la desvestimos ---------- */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-card,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-card--embedded,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-panel,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-team-players-panel,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-datos-canvas,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-datos-inner,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-detail-players-canvas{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-title-block,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-title,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-subtitle,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-meta-pills,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-blob-name,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-section-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-section-header--players,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-selected-team-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-selected-team-shield,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-selected-team-copy{
  display:none!important;
}

/* ---------- Selector Local / Visitante compacto ---------- */
.mpd-match-detail-modal .mpd-plantillas-selector{
  width:100%!important;
  max-width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  margin:0 0 10px 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-btn{
  flex:0 1 340px!important;
  width:min(340px, calc(50% - 8px))!important;
  max-width:340px!important;
  min-width:190px!important;
  height:42px!important;
  padding:6px 13px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  background:rgba(255,255,255,.035)!important;
  color:#EFFFF6!important;
  box-shadow:none!important;
  cursor:pointer!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-btn.is-active{
  border-color:rgba(6,190,132,.58)!important;
  background:linear-gradient(135deg,rgba(6,190,132,.26),rgba(6,190,132,.08))!important;
  box-shadow:0 8px 22px rgba(6,190,132,.12)!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-shield{
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  border-radius:50%!important;
  object-fit:cover!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-name{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
}

/* ---------- Grid directo: mismo concepto funcional que Clasificación ---------- */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-like-classification,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-direct,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-grid,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-player-grid{
  --ag-background-color:rgba(4,7,8,.34);
  --ag-header-background-color:rgba(255,255,255,.075);
  --ag-odd-row-background-color:rgba(255,255,255,.028);
  --ag-row-hover-color:rgba(255,255,255,.085);
  --ag-border-color:rgba(255,255,255,.075);
  --ag-header-foreground-color:rgba(255,255,255,.92);
  --ag-foreground-color:rgba(255,255,255,.88);
  --ag-font-family:inherit;
  --ag-font-size:12px;
  --ag-row-border-color:rgba(255,255,255,.055);
  --ag-secondary-border-color:rgba(255,255,255,.08);
  --ag-selected-row-background-color:rgba(6,190,132,.16);

  width:100%!important;
  max-width:100%!important;
  min-width:0!important;

  /* Altura grande y estable. Sin esto AG Grid no tiene viewport y se queda sin scroll. */
  height:calc(92vh - 245px)!important;
  min-height:660px!important;
  max-height:none!important;

  display:block!important;
  margin:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.085)!important;
  background:#111819!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 16px 34px rgba(0,0,0,.16)!important;
}

/* Estructura raíz de AG Grid con altura real. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root-wrapper,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-layout-normal{
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  overflow:hidden!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root-wrapper{
  border-radius:16px!important;
  border:0!important;
  background:rgba(255,255,255,.025)!important;
}

/* Cabecera igual de robusta que clasificación. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header{
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.085) 0%,rgba(255,255,255,.045) 100%)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-group-cell{
  font-weight:850!important;
  letter-spacing:.2px!important;
  border-right:1px solid rgba(255,255,255,.05)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-cell-label,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-group-cell-label{
  justify-content:center!important;
}

/* Scroll vertical interno del grid. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-viewport{
  overflow-y:auto!important;
  overflow-x:hidden!important;
}

/* Scroll horizontal nativo abajo, sincronizado por AG Grid. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-center-cols-viewport,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-center-cols-clipper,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-viewport{
  overflow-x:hidden!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll{
  display:block!important;
  height:16px!important;
  min-height:16px!important;
  max-height:16px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  background:rgba(0,0,0,.18)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll-viewport{
  overflow-x:auto!important;
  overflow-y:hidden!important;
}

/* Scrollbar visual coherente con clasificación. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-viewport::-webkit-scrollbar,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll-viewport::-webkit-scrollbar{
  width:10px!important;
  height:10px!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-viewport::-webkit-scrollbar-track,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track{
  background:rgba(255,255,255,.035)!important;
  border-radius:999px!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-viewport::-webkit-scrollbar-thumb,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb{
  background:rgba(6,190,132,.35)!important;
  border-radius:999px!important;
  border:2px solid rgba(10,15,16,.9)!important;
}

/* El modal completo nunca debe sacar scroll lateral por Plantillas. */
.mpd-match-detail-modal .mpd-match-detail-body,
.mpd-match-detail-modal .mpd-match-detail-content,
.mpd-match-detail-modal .mpd-match-detail-panes,
.mpd-match-detail-modal .mpd-detail-pane--plantillas,
.mpd-match-detail-modal .mpd-plantillas-content{
  max-width:100%!important;
  overflow-x:hidden!important;
}

@media (max-width:1200px){
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-like-classification,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-direct,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-grid,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-player-grid{
    height:calc(96vh - 235px)!important;
    min-height:600px!important;
  }
}

@media (max-width:760px){
  .mpd-match-detail-modal .mpd-plantillas-selector{
    flex-direction:column!important;
    align-items:stretch!important;
  }

  .mpd-match-detail-modal .mpd-plantillas-team-btn{
    width:100%!important;
    max-width:none!important;
    flex:0 0 auto!important;
  }

  .mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-like-classification,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-direct,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-grid,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-player-grid{
    height:calc(100vh - 265px)!important;
    min-height:520px!important;
  }
}

/* =========================================================
   MPD MODAL · PLANTILLAS AUTOHEIGHT + HORIZONTAL v8
   ---------------------------------------------------------
   Objetivo:
   - El grid de Plantillas NO tiene scroll vertical interno.
   - La sección crece lo que necesite para mostrar todos los jugadores.
   - El scroll vertical lo hace el body del modal.
   - El scroll lateral lo gestiona un wrapper propio, como ocurre en
     clasificación cuando el contenido ancho no cabe.
   ========================================================= */

/* Pane y contenedor: sin limitar altura, sin esconder vertical */
.mpd-match-detail-modal .mpd-detail-pane--plantillas,
.mpd-match-detail-modal .mpd-match-detail-pane--plantillas,
.mpd-match-detail-modal .mpd-plantillas-content,
.mpd-match-detail-modal .mpd-plantillas-content--grid-like-classification{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow-x:hidden!important;
  overflow-y:visible!important;
}

/* Selector Local / Visitante se mantiene compacto */
.mpd-match-detail-modal .mpd-plantillas-selector{
  width:100%!important;
  max-width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  margin:0 0 10px 0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-btn{
  flex:0 1 340px!important;
  width:min(340px, calc(50% - 8px))!important;
  max-width:340px!important;
  min-width:190px!important;
  height:42px!important;
  padding:6px 13px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  background:rgba(255,255,255,.035)!important;
  color:#EFFFF6!important;
  box-shadow:none!important;
  cursor:pointer!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-btn.is-active{
  border-color:rgba(6,190,132,.58)!important;
  background:linear-gradient(135deg,rgba(6,190,132,.26),rgba(6,190,132,.08))!important;
  box-shadow:0 8px 22px rgba(6,190,132,.12)!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-shield{
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  border-radius:50%!important;
  object-fit:cover!important;
}

.mpd-match-detail-modal .mpd-plantillas-team-name{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
}

/* Wrapper horizontal: aquí vive el scroll lateral. No tiene estilo visual. */
.mpd-match-detail-modal .mpd-plantillas-grid-scroll,
.mpd-match-detail-modal .mpd-plantillas-grid-scroll--autoheight{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  display:block!important;
  padding:0 0 12px 0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow-x:auto!important;
  overflow-y:visible!important;
  scrollbar-width:thin!important;
  overscroll-behavior-x:contain!important;
}

.mpd-match-detail-modal .mpd-plantillas-grid-scroll::-webkit-scrollbar{
  height:11px!important;
  width:11px!important;
}

.mpd-match-detail-modal .mpd-plantillas-grid-scroll::-webkit-scrollbar-track{
  background:rgba(255,255,255,.035)!important;
  border-radius:999px!important;
}

.mpd-match-detail-modal .mpd-plantillas-grid-scroll::-webkit-scrollbar-thumb{
  background:rgba(6,190,132,.36)!important;
  border-radius:999px!important;
  border:2px solid rgba(10,15,16,.9)!important;
}

/* Desvestir cualquier card/cabecera heredada si aparece por fallback */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-card,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-card--embedded,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-panel,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-team-players-panel,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-datos-canvas,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-datos-inner,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-detail-players-canvas{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-title-block,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-title,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-subtitle,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-meta-pills,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-blob-name,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-section-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-section-header--players,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-selected-team-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-selected-team-shield,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-selected-team-copy{
  display:none!important;
}

/* Grid en modo autoHeight: no scroll vertical interno, altura según filas. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-autoheight-horizontal,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-like-classification,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-direct,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-grid,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-player-grid{
  --ag-background-color:rgba(4,7,8,.34);
  --ag-header-background-color:rgba(255,255,255,.075);
  --ag-odd-row-background-color:rgba(255,255,255,.028);
  --ag-row-hover-color:rgba(255,255,255,.085);
  --ag-border-color:rgba(255,255,255,.075);
  --ag-header-foreground-color:rgba(255,255,255,.92);
  --ag-foreground-color:rgba(255,255,255,.88);
  --ag-font-family:inherit;
  --ag-font-size:12px;
  --ag-row-border-color:rgba(255,255,255,.055);
  --ag-secondary-border-color:rgba(255,255,255,.08);
  --ag-selected-row-background-color:rgba(6,190,132,.16);

  width:100%!important;
  max-width:none!important;

  /* min-width viene inline desde Python según columnas.
     Si por cualquier motivo no llega, dejamos fallback ancho. */
  min-width:max(1700px, 100%)!important;

  height:auto!important;
  min-height:0!important;
  max-height:none!important;

  display:block!important;
  margin:0!important;
  border-radius:16px!important;
  overflow:visible!important;
  border:1px solid rgba(255,255,255,.085)!important;
  background:#111819!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 16px 34px rgba(0,0,0,.16)!important;
}

/* En autoHeight AG Grid usa ag-layout-auto-height. No forzar height:100%. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root-wrapper,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-layout-auto-height{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow:visible!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root-wrapper{
  border-radius:16px!important;
  border:0!important;
  background:rgba(255,255,255,.025)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header{
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.085) 0%,rgba(255,255,255,.045) 100%)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-group-cell{
  font-weight:850!important;
  letter-spacing:.2px!important;
  border-right:1px solid rgba(255,255,255,.05)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-cell-label,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-group-cell-label{
  justify-content:center!important;
}

/* Sin scroll vertical interno: todas las filas forman parte del alto del grid. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-viewport,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-center-cols-viewport,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-center-cols-clipper,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-viewport{
  overflow:visible!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}

/* Ocultamos el scroll horizontal interno de AG Grid porque el wrapper externo
   desplaza header + body juntos y evita desincronizaciones. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll{
  display:none!important;
}

/* El modal no debe sacar scroll lateral global; solo el wrapper del grid. */
.mpd-match-detail-modal .mpd-match-detail-body,
.mpd-match-detail-modal .mpd-match-detail-content,
.mpd-match-detail-modal .mpd-match-detail-panes,
.mpd-match-detail-modal .mpd-detail-pane--plantillas,
.mpd-match-detail-modal .mpd-plantillas-content{
  max-width:100%!important;
  overflow-x:hidden!important;
}

@media (max-width:760px){
  .mpd-match-detail-modal .mpd-plantillas-selector{
    flex-direction:column!important;
    align-items:stretch!important;
  }

  .mpd-match-detail-modal .mpd-plantillas-team-btn{
    width:100%!important;
    max-width:none!important;
    flex:0 0 auto!important;
  }

  .mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-autoheight-horizontal,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-like-classification,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-direct,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-grid,
  .mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-player-grid{
    min-width:max(1450px, 100%)!important;
  }
}


/* =========================================================
   MPD PLANTILLAS · PATCH v7
   ---------------------------------------------------------
   Objetivo:
   - Sin scroll vertical interno: el grid crece para todas las filas.
   - Scroll horizontal NATIVO de AG Grid: solo se desplazan las columnas de datos.
   - Foto + jugador quedan pinned a la izquierda, como equipos en clasificación.
   - Cabeceras leaf visibles también en grupos tipo BeSoccer.
   ========================================================= */

.mpd-match-detail-modal .mpd-plantillas-grid-native,
.mpd-match-detail-modal .mpd-plantillas-grid-native--classification-scroll,
.mpd-match-detail-modal .mpd-plantillas-grid-scroll,
.mpd-match-detail-modal .mpd-plantillas-grid-scroll--autoheight{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  display:block!important;
  padding:0 0 12px 0!important;
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  scrollbar-width:thin!important;
}

/* El grid debe ocupar solo el ancho disponible. NO hacerlo min-width:1700px,
   porque si el wrapper externo scrollea se mueven también las columnas pinned. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-classification-scroll,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-autoheight-horizontal,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-like-classification,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-direct,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-team-players-grid,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-player-grid{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  display:block!important;
  margin:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.085)!important;
  background:#111819!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 16px 34px rgba(0,0,0,.16)!important;
}

/* AutoHeight: no scroll vertical interno. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-layout-auto-height,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-root-wrapper{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  border-radius:16px!important;
  border:0!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.025)!important;
}

/* Cuerpo autoHeight: todo visible verticalmente. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-viewport{
  overflow-y:visible!important;
  overflow-x:hidden!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
}

/* El viewport central NO scrollea por CSS externo; lo controla el scroll horizontal nativo de AG Grid. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-center-cols-viewport,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-center-cols-clipper,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-viewport{
  overflow-x:hidden!important;
  overflow-y:visible!important;
  min-width:0!important;
}

/* Reactivar scroll horizontal interno abajo. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll{
  display:block!important;
  height:16px!important;
  min-height:16px!important;
  max-height:16px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  background:rgba(0,0,0,.18)!important;
  border-top:1px solid rgba(255,255,255,.055)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll-viewport{
  overflow-x:auto!important;
  overflow-y:hidden!important;
  height:16px!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-body-horizontal-scroll-container{
  height:16px!important;
}

/* Pinned left: mismo concepto que clasificación. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-pinned-left-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-pinned-left-cols-container{
  border-right:1px solid rgba(255,255,255,.15)!important;
  box-shadow:8px 0 18px rgba(0,0,0,.18)!important;
  z-index:3!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-pinned-left-header .ag-header-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-pinned-left-cols-container .ag-cell{
  background:rgba(7, 11, 12, .98)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-player-pinned-header{
  background:linear-gradient(180deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.045) 100%)!important;
}

/* Cabeceras: evitar columnas aparentemente sin nombre por texto recortado/invisible. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header{
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.085) 0%,rgba(255,255,255,.045) 100%)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-group-cell{
  font-weight:850!important;
  letter-spacing:.15px!important;
  border-right:1px solid rgba(255,255,255,.05)!important;
  padding-left:5px!important;
  padding-right:5px!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-cell-label,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-group-cell-label{
  justify-content:center!important;
  gap:3px!important;
  min-width:0!important;
  width:100%!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-cell-text,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-group-text{
  display:block!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:rgba(239,255,246,.92)!important;
  opacity:1!important;
  font-size:10.5px!important;
  line-height:1.05!important;
}

/* Si hay iconos de filtro/sort, que no tapen todo el texto. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-header-icon,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-icon{
  flex:0 0 auto!important;
  opacity:.62!important;
  transform:scale(.84)!important;
}

/* Celdas y filas: mantener look actual. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-row{
  border-bottom:1px solid rgba(255,255,255,.045)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .ag-cell{
  display:flex!important;
  align-items:center!important;
  border-right:1px solid rgba(255,255,255,.035)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .datos-player-name-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-player-pinned-cell{
  color:#EFFFF6!important;
  font-weight:900!important;
}

/* El modal no debe sacar scroll lateral global; el lateral es interno de AG Grid. */
.mpd-match-detail-modal .mpd-match-detail-body,
.mpd-match-detail-modal .mpd-match-detail-content,
.mpd-match-detail-modal .mpd-match-detail-panes,
.mpd-match-detail-modal .mpd-detail-pane--plantillas,
.mpd-match-detail-modal .mpd-plantillas-content{
  max-width:100%!important;
  overflow-x:hidden!important;
}

/* =========================================================
   MPD PLANTILLAS · GRID NORMAL HORIZONTAL PATCH
   ---------------------------------------------------------
   Objetivo:
   - Plantillas usa un AG Grid limpio como clasificación.
   - NO hay scroll horizontal con la rueda del ratón.
   - Scroll lateral nativo de AG Grid abajo.
   - Foto + jugador quedan pinned a la izquierda.
   - El grid calcula altura para mostrar todas las filas; el scroll vertical
     lo hace el body del modal, no el grid.
   ========================================================= */

/* Contenedor del grid directo */
.mpd-match-detail-modal .mpd-plantillas-grid-native,
.mpd-match-detail-modal .mpd-plantillas-grid-native--classification-scroll{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  max-height:none!important;
  display:block!important;
  padding:0 0 14px 0!important;
  margin:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}

/* Grid Plantillas nuevo */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-classification-like,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-direct{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  display:block!important;
  margin:0!important;
  border-radius:16px!important;
  overflow:hidden!important;
  border:1px solid rgba(255,255,255,.085)!important;
  background:#111819!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 16px 34px rgba(0,0,0,.16)!important;
}

/* Layout normal: altura real del componente desde Python. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-root-wrapper,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-root,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-layout-normal{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-root-wrapper{
  border-radius:16px!important;
  border:0!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.025)!important;
}

/* Sin scroll vertical interno: la altura ya enseña todas las filas. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body-viewport{
  overflow-y:hidden!important;
  overflow-x:hidden!important;
}

/* Importante: no convertir la rueda vertical en scroll horizontal. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-center-cols-viewport,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-center-cols-clipper,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-viewport{
  overflow-x:hidden!important;
  overflow-y:hidden!important;
  min-width:0!important;
}

/* Scroll horizontal nativo de AG Grid abajo. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body-horizontal-scroll{
  display:block!important;
  visibility:visible!important;
  height:18px!important;
  min-height:18px!important;
  max-height:18px!important;
  overflow-x:hidden!important;
  overflow-y:hidden!important;
  background:rgba(0,0,0,.18)!important;
  border-top:1px solid rgba(255,255,255,.055)!important;
  opacity:1!important;
  pointer-events:auto!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body-horizontal-scroll-viewport{
  display:block!important;
  visibility:visible!important;
  height:18px!important;
  min-height:18px!important;
  overflow-x:scroll!important;
  overflow-y:hidden!important;
  pointer-events:auto!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body-horizontal-scroll-container{
  height:18px!important;
  min-height:18px!important;
}

/* Estética del scrollbar horizontal */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body-horizontal-scroll-viewport::-webkit-scrollbar{
  height:14px!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track{
  background:rgba(255,255,255,.035)!important;
  border-radius:999px!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb{
  background:rgba(6,190,132,.42)!important;
  border-radius:999px!important;
  border:3px solid rgba(10,15,16,.92)!important;
}

/* Pinned left: foto + jugador fijos, igual que clasificación deja fijos equipos. */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-pinned-left-header,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-pinned-left-cols-container{
  border-right:1px solid rgba(255,255,255,.15)!important;
  box-shadow:8px 0 18px rgba(0,0,0,.18)!important;
  z-index:3!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-pinned-left-header .ag-header-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-pinned-left-cols-container .ag-cell{
  background:rgba(7,11,12,.98)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .mpd-player-pinned-header{
  background:linear-gradient(180deg,rgba(255,255,255,.10) 0%,rgba(255,255,255,.045) 100%)!important;
}

/* Cabeceras compactas y visibles */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header{
  border-bottom:1px solid rgba(255,255,255,.10)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.085) 0%,rgba(255,255,255,.045) 100%)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-group-cell{
  font-weight:850!important;
  letter-spacing:.15px!important;
  border-right:1px solid rgba(255,255,255,.05)!important;
  padding-left:5px!important;
  padding-right:5px!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-cell-label,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-group-cell-label{
  justify-content:center!important;
  gap:3px!important;
  min-width:0!important;
  width:100%!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-cell-text,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-group-text{
  display:block!important;
  max-width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:rgba(239,255,246,.92)!important;
  opacity:1!important;
  font-size:10.5px!important;
  line-height:1.05!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-header-icon,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-icon{
  flex:0 0 auto!important;
  opacity:.62!important;
  transform:scale(.84)!important;
}

/* Celdas y filas */
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-row{
  border-bottom:1px solid rgba(255,255,255,.045)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .ag-cell{
  display:flex!important;
  align-items:center!important;
  border-right:1px solid rgba(255,255,255,.035)!important;
}

.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .datos-player-name-cell,
.mpd-match-detail-modal .mpd-detail-pane--plantillas .mpd-players-grid-normal-horizontal .mpd-player-pinned-cell{
  color:#EFFFF6!important;
  font-weight:900!important;
}

/* El modal no debe sacar scroll lateral global. */
.mpd-match-detail-modal .mpd-match-detail-body,
.mpd-match-detail-modal .mpd-match-detail-content,
.mpd-match-detail-modal .mpd-match-detail-panes,
.mpd-match-detail-modal .mpd-detail-pane--plantillas,
.mpd-match-detail-modal .mpd-plantillas-content{
  max-width:100%!important;
  overflow-x:hidden!important;
}
