* {
  vertical-align: revert; }

.container {
  padding: unset !important; }
  @media screen and (min-width: 768px) {
    .container .container {
      padding: 0px 40px !important; } }

.selector {
  margin: 0 auto;
  height: 40px;
  width: 100%;
  font-family: "Open Sans";
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
  overflow-x: scroll;
  scrollbar-width: none;
  margin-top: 10%;
  position: relative;
  padding: 0 20px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  -moz-tap-highlight-color: rgba(0, 0, 0, 0);
  -ms-tap-highlight-color: rgba(0, 0, 0, 0);
  -o-tap-highlight-color: rgba(0, 0, 0, 0); }
  .selector::-webkit-scrollbar {
    display: none; }
  .selector--shadow {
    position: relative;
    height: 46px;
    position: absolute;
    display: block;
    z-index: 4;
    right: 0;
    margin-top: 2%; }
    .selector--shadow::before {
      content: "";
      position: absolute;
      right: 0;
      height: 46px;
      width: 70px;
      background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5) 50%, white 100%); }

  .selector__title {
    font-family: "Open Sans";
    font-weight: 700;
    font-size: 0.9em;
    text-transform: uppercase;
    background-image: linear-gradient(#000f72, #000f72);
    background-size: 80px 4px;
    background-repeat: no-repeat;
    background-position-x: left;
    background-position-y: bottom;
    padding: 0 20px 16px;
    display: block;
    margin-top: 4%; }
  @media screen and (min-width: 768px) {
    .selector__title {
      padding: 0 60px 16px; } }

  .selector__wrapper {
    display: grid;
    height: inherit; }
    .selector__wrapper.five {
      width: 700px;
      grid-template-columns: repeat(5, 1fr); }
    .selector__wrapper.six {
      width: 700px;
      grid-template-columns: repeat(6, 1fr); }
    .selector__wrapper.ten {
      width: 900px;
      grid-template-columns: repeat(10, 1fr); }
    .selector__wrapper.twelve {
      grid-template-columns: repeat(12, 1fr);
      width: 100%; }
    /* twelve en móvil: sin padding ni scroll, centrado */
    .selector:has(.selector__wrapper.twelve) {
      padding-left: 0;
      overflow-x: hidden; }

@media screen and (max-width: 767px) {
  .selector:has(.selector__wrapper.twelve) {
    padding-left: 20px;
    padding-right: 20px;
    overflow-x: hidden;
    box-sizing: border-box; }
  .selector:has(.selector__wrapper.twelve) .selector__wrapper.twelve {
    width: 100%; }
}
    .selector__wrapper__item {
      border: 1px solid #0e21a3;
      text-transform: uppercase;
      display: flex;
      justify-content: center;
      align-items: center;
      font-weight: 700;
      color: #0e21a3;
      font-size: 0.75em;
      letter-spacing: -0.4px; }
      .selector__wrapper__item:hover {
        color: #fff;
        background-color: #0e21a3; }
      .selector__wrapper__item.active {
        color: #fff;
        background-color: #0e21a3; }
  @media screen and (min-width: 768px) {
    .selector {
      overflow-x: hidden;
      padding-left: unset; }
      .selector--shadow::before {
        display: none; }
      .selector__wrapper {
        width: 100%; }
        .selector__wrapper__item {
          font-size: 1.1em;
          letter-spacing: unset;
          font-weight: 700; } }

.bracket {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }
  .bracket__wrapper {
    margin-top: 4%;
    overflow: hidden; }
    .bracket__wrapper #bracketDesk svg {
      width: 100%;
      height: auto; }
    @media screen and (min-width: 768px) {
      .bracket__wrapper {
        overflow: initial; } }

#bracketMob {
  margin: 0 auto;
  width: 500px;
  display: block; }
  @media screen and (max-width: 400px) {
    #bracketMob {
      transform: scale(0.9); } }
  @media screen and (min-width: 768px) {
    #bracketMob {
      display: none; } }

#bracketMobSVG {
  transition: transform 1s ease; }

#bracketDesk {
  display: none; }
  @media screen and (min-width: 768px) {
    #bracketDesk {
      display: block; } }

.euroText {
  font-family: "Petrona", serif;
  font-size: 0.9em; }

.cursor {
  cursor: pointer; }

.matches {
  color: #434343;
  padding: 0px 20px 0px;
  margin-bottom: 16%; }
  .matches-display {
    padding: 0px 20px 0px; }
  .matches__container {
    margin-bottom: 8%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: flow-root; }
    .matches__container.closed {
      display: none; }
    .matches__container__title {
      width: 100%;
      font-family: "Open Sans";
      text-transform: uppercase;
      font-weight: 700;
      font-size: 0.9em;
      background-image: linear-gradient(#000f72, #000f72);
      background-size: 85% 1px;
      background-repeat: no-repeat;
      background-position-x: left;
      background-position-y: bottom;
      padding-bottom: 8px;
      margin-top: 4%;
      margin-bottom: 8%;
      display: flex;
      justify-content: space-between;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none; }
      .matches__container__title.calendar {
        background-image: linear-gradient(#000f72, #000f72);
        background-size: 60px 4px;
        padding-bottom: 16px; }
      .matches__container__title .calendarArrow {
        border: 1px solid #0e21a3;
        border-radius: 50%;
        width: 30px;
        aspect-ratio: 1/1;
        display: flex;
        align-items: center;
        align-content: center;
        justify-content: center;
        top: 18px;
        position: relative; }
        .matches__container__title .calendarArrow svg {
          width: 100%;
          margin-bottom: 8%;
          margin-top: 0%; }
        .matches__container__title .calendarArrow.closed {
          transform: rotate(180deg); }
          .matches__container__title .calendarArrow.closed svg {
            margin-top: -8%;
            margin-bottom: 0%; }
      .matches__container__title.today {
        color: #0e21a3;
        background-image: linear-gradient(#0e21a3, #0e21a3) !important; }
    .matches__container__wrapper {
      display: grid;
      grid-template-columns: 100%; }
      .matches__container__wrapper__item {
        margin-bottom: 10px; }
      .matches__container__wrapper__date {
        display: block;
        font-family: "Open Sans";
        text-transform: uppercase;
        font-weight: 700;
        font-size: 0.8em;
        margin-top: 8%;
        margin-bottom: 1.2%; }
        .matches__container__wrapper__date span {
          color: #868686;
          margin-left: 1%; }
      .matches__container__wrapper__group {
        font-family: 'Open sans', sans-serif;
        text-transform: uppercase;
        color: "#434343";
        font-weight: 700;
        font-size: 0.7em;
        margin-bottom: 2%; }
      .matches__container__wrapper__grid {
        background-color: #f7f7f7;
        display: grid;
        grid-template-columns: 80% 20%;
        padding: 2%;
        height: 60px;
        position: relative;
        align-items: center; }
        .matches__container__wrapper__grid.grupos::before {
          position: absolute;
          top: -28px;
          font-size: 0.8em;
          font-family: "Open Sans";
          font-weight: bold; }
        .matches__container__wrapper__grid.grupos.grupoA::before { content: "GRUPO A"; }
        .matches__container__wrapper__grid.grupos.grupoB::before { content: "GRUPO B"; }
        .matches__container__wrapper__grid.grupos.grupoC::before { content: "GRUPO C"; }
        .matches__container__wrapper__grid.grupos.grupoD::before { content: "GRUPO D"; }
        .matches__container__wrapper__grid.grupos.grupoE::before { content: "GRUPO E"; }
        .matches__container__wrapper__grid.grupos.grupoF::before { content: "GRUPO F"; }
        .matches__container__wrapper__grid.grupos.grupoG::before { content: "GRUPO G"; }
        .matches__container__wrapper__grid.grupos.grupoH::before { content: "GRUPO H"; }
        .matches__container__wrapper__grid.grupos.grupoI::before { content: "GRUPO I"; }
        .matches__container__wrapper__grid.grupos.grupoJ::before { content: "GRUPO J"; }
        .matches__container__wrapper__grid.grupos.grupoK::before { content: "GRUPO K"; }
        .matches__container__wrapper__grid.grupos.grupoL::before { content: "GRUPO L"; }
        .matches__container__wrapper__grid__match {
          display: grid;
          grid-template-columns: 1fr 26% 1fr;
          justify-content: space-between;
          align-content: center;
          color: inherit;
          text-decoration: none;
          align-items: center; }
          .matches__container__wrapper__grid__match.big {
            grid-template-columns: 1fr 32% 1fr; }
          .matches__container__wrapper__grid__match__team1, .matches__container__wrapper__grid__match__team2 {
            font-family: "Open sans", sans-serif;
            font-weight: 700;
            margin: 0;
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 0.8em;
            line-height: 1.2em; }
            .matches__container__wrapper__grid__match__team1 img, .matches__container__wrapper__grid__match__team2 img {
              width: 28px;
              height: 28px;
              border: 2px solid #f0f0f0;
              border-radius: 50%; }
          .matches__container__wrapper__grid__match__team1 {
            justify-content: flex-end; }
            .matches__container__wrapper__grid__match__team1 span {
              text-align: right; }
          .matches__container__wrapper__grid__match__team2 {
            justify-content: flex-start; }
          .matches__container__wrapper__grid__match__info > * {
            display: flex;
            font-family: "Open Sans";
            font-size: 1.2em;
            font-weight: 600;
            line-height: 1; }
          .matches__container__wrapper__grid__match__info > .hide {
            display: none !important; }
          .matches__container__wrapper__grid__match__info .goles {
            display: flex;
            justify-content: center;
            gap: 6px; }
          .matches__container__wrapper__grid__match__info .penaltis {
            display: flex;
            justify-content: center;
            align-items: flex-end;
            gap: 2px; }
            .matches__container__wrapper__grid__match__info .penaltis .goles__local,
            .matches__container__wrapper__grid__match__info .penaltis .goles__away {
              margin-bottom: 4%; }
            .matches__container__wrapper__grid__match__info .penaltis .sep {
              margin-bottom: 8%; }
            .matches__container__wrapper__grid__match__info .penaltis .penaltis__local,
            .matches__container__wrapper__grid__match__info .penaltis .penaltis__away {
              font-size: 0.4em;
              font-weight: 400;
              line-height: 1.5; }
          .matches__container__wrapper__grid__match__info .sep {
            font-weight: 300; }
          .matches__container__wrapper__grid__match__info .hour {
            display: flex;
            justify-content: center;
            font-weight: 700; }
        .matches__container__wrapper__grid__aside {
          display: flex;
          flex-direction: column;
          justify-content: space-around;
          align-items: center; }
          .matches__container__wrapper__grid__aside__icon {
            border: 1px solid #c7c7c7;
            border-radius: 50%;
            height: 28px;
            width: 28px;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center; }
            .matches__container__wrapper__grid__aside__icon * {
              width: 70%;
              height: 70%; }
            .matches__container__wrapper__grid__aside__icon .icon-fill path {
              fill: #c7c7c7; }
            .matches__container__wrapper__grid__aside__icon.played {
              border: 1px solid #f3001c; }
              .matches__container__wrapper__grid__aside__icon.played .icon-fill path {
                fill: #f3001c; }
            .matches__container__wrapper__grid__aside__icon .icon-fill.live path.icon-live-outer {
              animation-duration: 2s;
              animation-iteration-count: infinite;
              animation-name: live-outer;
              animation-timing-function: ease-in-out; }
            .matches__container__wrapper__grid__aside__icon .icon-fill.live path.icon-live-inner {
              animation-duration: 2s;
              animation-iteration-count: infinite;
              animation-name: live-inner;
              animation-timing-function: ease-in-out; }
@keyframes live-outer {
  0%   { opacity: 0; }
  33%  { opacity: 0; }
  66%  { opacity: 1; }
  100% { opacity: 1; } }
@keyframes live-inner {
  0%   { opacity: 0; }
  33%  { opacity: 1; }
  66%  { opacity: 1; }
  100% { opacity: 1; } }
  @media screen and (min-width: 768px) {
    .matches {
      padding: 0 60px; }
      .matches-display {
        padding: unset; }
      .matches__container {
        display: block; }
        .matches__container__title {
          margin-bottom: 4%;
          background-size: 95% 1px; }
        .matches__container__wrapper {
          grid-template-columns: repeat(2, 1fr);
          row-gap: 8%;
          column-gap: 2%;
          grid-gap: 8%;
          margin-top: initial; }
          .matches__container__wrapper__item {
            margin-bottom: unset; }
          .matches__container__wrapper__date {
            margin-top: 2%;
            margin-bottom: 0%; }
          .matches__container__wrapper__group {
            margin-bottom: unset; }
          .matches__container__wrapper__grid {
            grid-template-columns: 85% 15%;
            margin-top: 8%; }
            .matches__container__wrapper__grid__match {
              grid-template-columns: 1fr 28% 1fr;
              justify-content: unset;
              padding: 4%; }
              .matches__container__wrapper__grid__match.big {
                grid-template-columns: 1fr 30% 1fr; }
              .matches__container__wrapper__grid__match__team1, .matches__container__wrapper__grid__match__team2 {
                margin: 0px 8%;
                font-size: 0.8em; }
                .matches__container__wrapper__grid__match__team1 img, .matches__container__wrapper__grid__match__team2 img {
                  width: 24px;
                  height: 24px; }
              .matches__container__wrapper__grid__match__info > * {
                font-size: 1.4em; }
              .matches__container__wrapper__grid__match__info .goles {
                gap: 10px; }
            .matches__container__wrapper__grid__aside {
              display: flex;
              flex-direction: column;
              justify-content: space-around;
              align-items: center;
              margin: 16%; }
              .matches__container__wrapper__grid__aside a:first-of-type {
                margin-bottom: 12%; }
              .matches__container__wrapper__grid__aside__icon {
                border: 1px solid #c7c7c7;
                border-radius: 50%;
                height: 18px;
                width: 18px;
                text-align: center;
                display: flex;
                justify-content: center;
                align-items: center; }
                .matches__container__wrapper__grid__aside__icon * {
                  width: 70%;
                  height: 70%; }
                .matches__container__wrapper__grid__aside__icon .icon-fill path {
                  fill: #c7c7c7; }
                .matches__container__wrapper__grid__aside__icon.played {
                  border: 1px solid #f3001c; }
                  .matches__container__wrapper__grid__aside__icon.played .icon-fill path {
                    fill: #f3001c; }
                .matches__container__wrapper__grid__aside__icon .icon-fill.live path.icon-live-outer {
                  animation-duration: 2s;
                  animation-iteration-count: infinite;
                  animation-name: live-outer;
                  animation-timing-function: ease-in-out; }
                .matches__container__wrapper__grid__aside__icon .icon-fill.live path.icon-live-inner {
                  animation-duration: 2s;
                  animation-iteration-count: infinite;
                  animation-name: live-inner;
                  animation-timing-function: ease-in-out; }
    @keyframes live-outer {
      0%   { opacity: 0; }
      33%  { opacity: 0; }
      66%  { opacity: 1; }
      100% { opacity: 1; } }
    @keyframes live-inner {
      0%   { opacity: 0; }
      33%  { opacity: 1; }
      66%  { opacity: 1; }
      100% { opacity: 1; } } }
  @media screen and (min-width: 524px) {
    .matches__container__wrapper__grid {
      height: 80px;
      padding: 0px;
      margin-top: 2%; }
      .matches__container__wrapper__grid__match__info > * {
        font-size: 1.8em; }
      .matches__container__wrapper__grid__match__team1, .matches__container__wrapper__grid__match__team2 {
        font-size: 0.8em; }
      .matches__container__wrapper__grid__aside__icon {
        height: 28px;
        width: 28px;
        padding: 5px; }
        .matches__container__wrapper__grid__aside__icon * {
          width: 100%;
          height: 100%; } }

/* ── SPAIN ─────────────────────────────────────────────────────────────── */
.spain {
  color: #434343;
  padding: 0px 20px 0px; }
  .spain-display {
    padding: 0px 20px 0px; }
  .spain__container {
    margin-bottom: 8%;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: flow-root; }
    .spain__container.closed {
      display: none; }
    .spain__container__title {
      width: 100%;
      font-family: "Open Sans";
      text-transform: uppercase;
      font-weight: 700;
      font-size: 0.9em;
      background-image: none;
      background-size: 80px 4px;
      background-repeat: no-repeat;
      background-position-x: left;
      background-position-y: bottom;
      padding-bottom: 16px;
      margin-top: 4%;
      margin-bottom: 8%;
      display: flex;
      justify-content: space-between;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none; }
      .spain__container__title.calendar {
        background-image: linear-gradient(#000f72, #000f72);
        background-size: 60px 1px;
        padding-bottom: 16px; }
      .spain__container__title .calendarArrow {
        display: none;
        border: 1px solid #0e21a3;
        border-radius: 50%;
        width: 30px;
        aspect-ratio: 1/1;
        align-items: center;
        align-content: center;
        justify-content: center;
        top: 18px;
        position: relative; }
        .spain__container__title .calendarArrow svg {
          width: 100%;
          margin-bottom: 8%;
          margin-top: 0%; }
        .spain__container__title .calendarArrow.closed {
          transform: rotate(180deg); }
          .spain__container__title .calendarArrow.closed svg {
            margin-top: -8%;
            margin-bottom: 0%; }
      .spain__container__title.today {
        color: #0e21a3; }
    .spain__container__wrapper {
      display: grid;
      grid-template-columns: 100%;
      margin-top: 8%; }
      .spain__container__wrapper__date {
        font-family: "Open Sans";
        text-transform: uppercase;
        font-weight: 700;
        font-size: 0.8em;
        margin-top: 8%; }
        .spain__container__wrapper__date span {
          color: #868686;
          margin-left: 1%; }
      .spain__container__wrapper__grid {
        background-color: #f7f7f7;
        display: grid;
        grid-template-columns: 80% 20%;
        padding: 2%;
        height: auto;
        min-height: 60px;
        position: relative;
        align-items: center; }
        .spain__container__wrapper__grid__match {
          display: grid;
          grid-template-columns: 1fr 26% 1fr;
          justify-content: space-between;
          align-content: center;
          color: inherit;
          text-decoration: none;
          align-items: center; }
          .spain__container__wrapper__grid__match.big {
            grid-template-columns: 1fr 32% 1fr; }
          .spain__container__wrapper__grid__match__team1, .spain__container__wrapper__grid__match__team2 {
            font-family: "Open Sans", sans-serif;
            font-weight: 700;
            margin: 0;
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 0.8em;
            line-height: 1.2em; }
            .spain__container__wrapper__grid__match__team1 img, .spain__container__wrapper__grid__match__team2 img {
              width: 28px;
              height: 28px;
              border: 2px solid #f0f0f0;
              border-radius: 50%;
              flex-shrink: 0; }
          .spain__container__wrapper__grid__match__team1 {
            justify-content: flex-end; }
            .spain__container__wrapper__grid__match__team1 span {
              text-align: right; }
          .spain__container__wrapper__grid__match__team2 {
            justify-content: flex-start; }
          .spain__container__wrapper__grid__match__info > * {
            display: flex;
            font-family: "Open Sans";
            font-size: 1.2em;
            font-weight: 700;
            line-height: 1; }
          .spain__container__wrapper__grid__match__info > .hide {
            display: none !important; }
          .spain__container__wrapper__grid__match__info .goles {
            display: flex;
            justify-content: center;
            gap: 6px; }
          .spain__container__wrapper__grid__match__info .penaltis {
            display: flex;
            justify-content: center;
            align-items: flex-end;
            gap: 2px; }
            .spain__container__wrapper__grid__match__info .penaltis .goles__local,
            .spain__container__wrapper__grid__match__info .penaltis .goles__away {
              margin-bottom: 4%; }
            .spain__container__wrapper__grid__match__info .penaltis .sep {
              margin-bottom: 8%; }
            .spain__container__wrapper__grid__match__info .penaltis .penaltis__local,
            .spain__container__wrapper__grid__match__info .penaltis .penaltis__away {
              font-size: 0.4em;
              font-weight: 400;
              line-height: 1.5; }
          .spain__container__wrapper__grid__match__info .sep {
            font-weight: 300; }
          .spain__container__wrapper__grid__match__info .hour {
            display: flex;
            justify-content: center;
            font-weight: 700; }
        .spain__container__wrapper__grid__aside {
          display: flex;
          flex-direction: column;
          justify-content: space-around;
          align-items: center; }
          .spain__container__wrapper__grid__aside__icon {
            border: 1px solid #c7c7c7;
            border-radius: 50%;
            height: 28px;
            width: 28px;
            text-align: center;
            display: flex;
            justify-content: center;
            align-items: center;
            padding: 5px;
            box-sizing: border-box; }
            .spain__container__wrapper__grid__aside__icon * {
              width: 100%;
              height: 100%; }
            .spain__container__wrapper__grid__aside__icon .icon-fill path {
              fill: #c7c7c7; }
            .spain__container__wrapper__grid__aside__icon.played {
              border: 1px solid #f3001c; }
              .spain__container__wrapper__grid__aside__icon.played .icon-fill path {
                fill: #f3001c; }
            .spain__container__wrapper__grid__aside__icon .icon-fill.live path.icon-live-outer {
              animation-duration: 2s;
              animation-iteration-count: infinite;
              animation-name: live-outer;
              animation-timing-function: ease-in-out; }
            .spain__container__wrapper__grid__aside__icon .icon-fill.live path.icon-live-inner {
              animation-duration: 2s;
              animation-iteration-count: infinite;
              animation-name: live-inner;
              animation-timing-function: ease-in-out; }
@keyframes live-outer {
  0%   { opacity: 0; }
  33%  { opacity: 0; }
  66%  { opacity: 1; }
  100% { opacity: 1; } }
@keyframes live-inner {
  0%   { opacity: 0; }
  33%  { opacity: 1; }
  66%  { opacity: 1; }
  100% { opacity: 1; } }

  @media screen and (min-width: 524px) {
    .spain__container__wrapper__grid {
      height: 80px;
      min-height: 80px;
      padding: 0px; }
      .spain__container__wrapper__grid__match__info > * {
        font-size: 1.8em; }
      .spain__container__wrapper__grid__match__team1, .spain__container__wrapper__grid__match__team2 {
        font-size: 0.8em; }
      .spain__container__wrapper__grid__aside {
        justify-content: center; }
        .spain__container__wrapper__grid__aside__icon {
          height: 28px;
          width: 28px; } }

  @media screen and (min-width: 768px) {
    .spain {
      padding: 0 28px; }
      .spain-display {
        padding: unset; }
      .spain__container {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 2%;
        display: grid; }
        .spain__container__esp {
          margin-top: 4%; }
        .spain__container__title {
        margin-bottom: -5%;
        background-size: 95% 1px;
        margin-top: 8%; }
        .spain__container__wrapper {
          margin-top: initial; }
          .spain__container__wrapper__grid {
            grid-template-columns: 85% 15%;
            margin-top: 2%;
            height: 80px;
            min-height: 80px; }
            .spain__container__wrapper__grid__date {
              margin-top: 2%;
              margin-bottom: 2%; }
            .spain__container__wrapper__grid__aside {
              flex-direction: column;
              margin: 16%; }
              .spain__container__wrapper__grid__aside a:first-of-type {
                margin-bottom: 12%; }
              .spain__container__wrapper__grid__aside__icon {
                height: 28px;
                width: 28px;
                padding: 5px;
                box-sizing: border-box; }
            .spain__container__wrapper__grid__match {
              grid-template-columns: 1fr 28% 1fr;
              justify-content: unset;
              padding: 4%; }
              .spain__container__wrapper__grid__match.big {
                grid-template-columns: 1fr 30% 1fr; }
              .spain__container__wrapper__grid__match__team1, .spain__container__wrapper__grid__match__team2 {
                margin: 0px 8%;
                font-size: 0.8em; }
                .spain__container__wrapper__grid__match__team1 img, .spain__container__wrapper__grid__match__team2 img {
                  width: 32px;
                  height: 32px; }
              .spain__container__wrapper__grid__match__info > * {
                font-size: 1.8em; }
              .spain__container__wrapper__grid__match__info .goles {
                gap: 10px; } }

/* ── RESULTS ────────────────────────────────────────────────────────────── */
.results {
  color: #434343;
  overflow-x: hidden; }
  .results__table {
    display: grid;
    grid-template-columns: 1fr 1fr; }
  .results__title,
  .spain__container__title span:first-child {
    font-family: "Open Sans";
    text-transform: uppercase;
    font-weight: 700;
    font-size: 0.9em;
    background-image: linear-gradient(#000f72, #000f72);
    background-size: 80px 4px;
    background-repeat: no-repeat;
    background-position-x: left;
    background-position-y: bottom;
    padding-bottom: 16px;
    display: block; }
  @media screen and (min-width: 1024px) and (max-width: 1200px) {
    .results {
      margin: 0% 2% !important; } }
  @media screen and (min-width: 490px) {
    .results__table {
      grid-template-columns: 38% 1fr; } }
  @media screen and (min-width: 768px) {
    .results {
      padding: 0 60px; }
      .results__table {
        grid-template-columns: 18% 82% !important;
        overflow-x: hidden; } }

.output {
  display: flex;
  flex-direction: column-reverse;
  margin-top: 8%;
  padding: 0px 20px 0px; }
  .output .name-output-container,
  .output .data-output-container {
    display: grid; }
  .output .name-output-container {
    padding-bottom: 10px;
    margin-right: 20px; }
  .output .data-output-container {
    overflow-x: scroll;
    -webkit-overflow-scrolling: touch; }
    .output .data-output-container::-webkit-scrollbar {
      height: 10px; }
    .output .data-output-container::-webkit-scrollbar-track {
      background: #f7f7f7; }
    .output .data-output-container::-webkit-scrollbar-thumb {
      background: #0e21a3; }
    .output .data-output-container.esp::-webkit-scrollbar-thumb {
      background: #f3001c; }
  .output table.name-output {
    border-collapse: unset;
    text-indent: unset;
    border-spacing: 0px 8px;
    font-family: "Open sans";
    position: sticky;
    left: 0;
    background-color: #fff; }
    .output table.name-output th {
      font-weight: unset;
      font-size: 0.8em;
      vertical-align: bottom;
      background-color: #fff; }
      .output table.name-output th div {
        font-size: 0.8em; }
    .output table.name-output tr {
      height: 64px;
      background-color: #f7f7f7; }
      .output table.name-output tr:first-of-type {
        height: 23px; }
      .output table.name-output tr.played td {
        background-color: #edf0ff; }
      .output table.name-output tr.played td:not(.name) {
        color: #0e21a3; }
      .output table.name-output tr.played.esp td:not(.name) {
        color: #f3001c; }
      /* Tercera fila (posición 3 del grupo) */
      .name-output-container table.name-output tbody tr:nth-child(4) td {
        background-color: #f2f3fe; }
    .output table.name-output td:not(.name) {
      color: #646464;
      font-family: "Open sans";
      font-weight: bold;
      text-align: right;
      width: 20px; }
    .output table.name-output td.name {
      font-family: "Open sans", serif;
      font-size: 0.8em;
      position: relative;
      display: grid;
      grid-template-columns: 40% 60%;
      align-items: center;
      grid-gap: 8%;
      height: inherit;
      padding-right: 18%; }
      .output table.name-output td.name img {
        grid-area: 1;
        width: 26px;
        height: 26px;
        justify-self: self-end;
        border: 2px solid #f0f0f0;
        border-radius: 50%; }
  .output table.data-output {
    width: 400px;
    border-collapse: unset;
    text-indent: unset;
    border-spacing: 0px 8px;
    font-family: "Open sans"; }
    .output table.data-output tbody th {
      font-weight: unset;
      font-size: 0.8em;
      vertical-align: bottom; }
      .output table.data-output tbody th div {
        font-size: 0.8em;
        text-align: center; }
    .output table.data-output tbody tr {
      height: 64px; }
      .output table.data-output tbody tr:first-of-type {
        height: 23px; }
      .output table.data-output tbody tr:not(:first-of-type) {
        background-color: #f7f7f7; }
      .output table.data-output tbody tr.played {
        background-color: #e4e5f7; }
        .output table.data-output tbody tr.played td span {
          color: #0e21a3; }
    .output table.data-output tbody td {
      width: 10%; }
      .output table.data-output tbody td:nth-child(1) {
        background-color: #0e21a3;
        color: #fff;
        font-weight: bold; }
        .output table.data-output tbody td:nth-child(1).esp {
          background-color: #f3001c; }
      /* Tercera fila (posición 3 del grupo) */
      .data-output-container table.data-output tbody tr:nth-child(4) {
        background-color: #f2f3fe; }
      .output table.data-output tbody td div {
        height: 100%;
        display: flex;
        justify-content: center;
        flex-direction: row-reverse;
        align-items: center; }
  @media screen and (min-width: 768px) {
    .output {
      padding: unset; }
      .output .data-output-container {
        overflow-x: hidden; }
      .output .name-output-container {
        padding-bottom: 0px;
        margin-right: 0px; }
      .output table.name-output {
        border-spacing: 0px 4px; }
        .output table.name-output td.name img {
          width: 32px;
          height: 32px; }
      .output table.data-output {
        border-spacing: 0px 4px;
        width: 100%;
        margin-left: 0px; } }

.players {
  display: block;
  padding: 0px 20px 0px;
  margin-bottom: 16%; }
  .players__wrapper {
    width: 100%; }
    .players__wrapper--first {
      display: grid;
      grid-template-areas: "title1" "grid1" "title2" "grid2"; }
      .players__wrapper--first .title1 {
        grid-area: title1; }
      .players__wrapper--first .title2 {
        grid-area: title2; }
      .players__wrapper--first .grid1 {
        grid-area: grid1;
        margin-right: 3px; }
      .players__wrapper--first .grid2 {
        grid-area: grid2; }
    .players__wrapper--title {
      margin-top: 20px;
      margin-bottom: 20px; }
      .players__wrapper--title h4 {
        font-family: "Open Sans";
        text-transform: uppercase;
        font-weight: 700;
        font-size: 0.9em;
        background-image: linear-gradient(to right, #f40501 0%, #f40501 17%, #f40501 37%, #f40501 58%, #f40501 80%, #ffffff 100%);
        background-size: 80px 6px;
        background-repeat: no-repeat;
        background-position-x: left;
        background-position-y: bottom;
        padding-bottom: 16px;
        display: block; }
    .players__wrapper--grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-gap: 3px; }
      .players__wrapper--grid--item {
        background-color: #8f0010;
        display: flex;
        flex-direction: column; }
        .players__wrapper--grid--item--img {
          overflow: hidden;
          width: 100%;
          height: 75%;
          background-size: cover; }
          .players__wrapper--grid--item--img img {
            object-fit: cover;
            width: 100%;
            height: 100%; }
        .players__wrapper--grid--item--card {
          background-color: #f3001c;
          height: 25%;
          width: 100%;
          padding: 4% 8%;
          color: #fff;
          font-family: "Open sans", sans-serif; }
          .players__wrapper--grid--item--card--num {
            font-weight: 500;
            font-size: 0.8em; }
          .players__wrapper--grid--item--card--name {
            font-size: 0.6em;
            text-transform: uppercase; }
  @media screen and (min-width: 768px) {
    .players {
      padding: unset;
      margin-bottom: 8%; }
      .players__wrapper--title {
        margin-top: 40px; }
      .players__wrapper--first {
        grid-template-columns: repeat(8, 1fr);
        grid-template-areas: "title1 title2" "grid1 grid2"; }
        .players__wrapper--first .title1 {
          grid-column-start: 1;
          grid-column-end: 2;
          position: absolute; }
        .players__wrapper--first .title2 {
          grid-column-start: 3;
          grid-column-end: 9; }
        .players__wrapper--first .grid1 {
          grid-template-columns: 100%;
          grid-column-start: 1;
          grid-column-end: 2; }
        .players__wrapper--first .grid2 {
          grid-template-columns: repeat(6, 1fr);
          grid-column-start: 3;
          grid-column-end: 9; }
      .players__wrapper--grid {
        grid-template-columns: repeat(8, 1fr); }
        .players__wrapper--grid--item--card--num {
          font-size: 1em; }
        .players__wrapper--grid--item--card--name {
          font-size: 0.7em; } }

.mapstadium {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 20px 0px; }
  .mapstadium__wrapper {
    display: flex;
    justify-content: center;
    align-items: center; }
    .mapstadium__wrapper--item img {
      width: 100%;
      max-width: 350px;
      height: auto; }
  @media screen and (min-width: 768px) {
    .mapstadium__wrapper--item img {
      max-width: 800px; } }

#alert_container_js {
  margin-left: 60px !important;
  margin-right: 60px !important; }
  @media screen and (min-width: 1024px) and (max-width: 1200px) {
    #alert_container_js {
      margin: 0% 2% !important; } }
  @media screen and (max-width: 768px) {
    #alert_container_js {
      margin-left: unset !important;
      margin-right: unset !important;
      padding: 0px 20px 0px !important; } }

.mod .heading {
  border-top: none !important;
  background-color: #edf0ff;
  padding-top: 2%; }

.mod .heading__title::before {
  display: none !important; }

.mod .heading::after {
  display: none !important; }

.mod .heading {
  margin: 40px 0px; }

.mod .heading__title {
  background-image: linear-gradient(to right, #00117f, #00117f);
  background-size: 80px 6px;
  padding-bottom: 16px;
  background-repeat: no-repeat;
  background-position-x: left;
  background-position-y: bottom;
  font-family: "Open Sans";
  text-transform: uppercase;
  font-weight: 700;
  font-size: 0.9em; }

.row-ee.row-ee--mod-50-adv-right, .row-ee.row-ee--horizontal-4, .mod .heading__title {
  margin-left: 60px !important;
  margin-right: 60px !important;
  padding-right: 60px; }

@media screen and (max-width: 768px) {
  .row-ee.row-ee--mod-50-adv-right, .row-ee.row-ee--horizontal-4, .mod .heading__title {
    margin-left: 20px !important;
    margin-right: 20px !important;
    padding-right: 60px; }
}

/* ── FIXES MÓVIL: iguala tarjetas España y Grupos ──────────────────────────
   Aplica a todos los móviles (max-width: 768px).
   Las tarjetas de España y Grupos son idénticas en tipografía y tamaño.
────────────────────────────────────────────────────────────────────────── */

/* Compartido: selector de clases spain y matches */
@media screen and (max-width: 768px) {

  /* ── Tarjeta base: altura automática para nombres largos ── */
  .spain__container__wrapper__grid,
  .matches__container__wrapper__grid {
    height: auto;
    min-height: 64px;
    padding: 0;
    grid-template-columns: 80% 20%; }

  /* ── Zona interior del partido ── */
  .spain__container__wrapper__grid__match,
  .matches__container__wrapper__grid__match {
    grid-template-columns: 1fr 26% 1fr;
    padding: 8px 4px;
    align-items: center; }

  /* ── Nombres de equipo: igual en ambos ── */
  .spain__container__wrapper__grid__match__team1,
  .spain__container__wrapper__grid__match__team2,
  .matches__container__wrapper__grid__match__team1,
  .matches__container__wrapper__grid__match__team2 {
    font-family: "Open Sans", sans-serif;
    font-weight: 700;
    font-size: 0.78em;
    line-height: 1.25em;
    gap: 5px;
    display: flex;
    align-items: center;
    margin: 0; }

  .spain__container__wrapper__grid__match__team1,
  .matches__container__wrapper__grid__match__team1 {
    justify-content: flex-end; }
    .spain__container__wrapper__grid__match__team1 span,
    .matches__container__wrapper__grid__match__team1 span {
      text-align: right; }

  .spain__container__wrapper__grid__match__team2,
  .matches__container__wrapper__grid__match__team2 {
    justify-content: flex-start; }

  /* ── Banderas ── */
  .spain__container__wrapper__grid__match__team1 img,
  .spain__container__wrapper__grid__match__team2 img,
  .matches__container__wrapper__grid__match__team1 img,
  .matches__container__wrapper__grid__match__team2 img {
    width: 24px;
    height: 24px;
    border: 2px solid #f0f0f0;
    border-radius: 50%;
    flex-shrink: 0; }

  /* ── Marcador / hora ── */
  .spain__container__wrapper__grid__match__info > *,
  .matches__container__wrapper__grid__match__info > * {
    font-family: "Open Sans";
    font-size: 1.3rem;
    font-weight: 700;
    color: #434343;
    line-height: 1;
    display: flex; }

  /* ── Iconos aside ── */
  .spain__container__wrapper__grid__aside,
  .matches__container__wrapper__grid__aside {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px; }

  .spain__container__wrapper__grid__aside__icon,
  .matches__container__wrapper__grid__aside__icon {
    height: 24px;
    width: 24px;
    padding: 4px;
    box-sizing: border-box; }

  .spain__container__wrapper__grid__aside__icon *,
  .matches__container__wrapper__grid__aside__icon * {
    width: 100%;
    height: 100%; } }