/* Android / Material You: violeta "Material 3" (el tono de acento que usa
   Google en su propia referencia de Material You, bien distinto del verde
   de Xbox) + botones en píldora completa + el ripple circular al soltar
   el dedo — la seña de identidad táctil de Material Design. */
:root[data-estilo="android"] {
  --acento-2: #7d5260;
  --radio: 20px;
  --radio-chico: 14px;
}
:root[data-estilo="android"][data-tema="claro"] {
  --verde: #6750a4;
  --verde-claro: #8871c2;
  --gris-100: #f2edf7;
  --gris-200: #e6dff0;
  --superficie: #fffbfe;
  --superficie-alta: #ece6f4;
  --texto: #1c1b1f;
  --borde-tarjeta: none;
  --sombra: 0 1px 2px rgba(0, 0, 0, .12), 0 4px 10px rgba(0, 0, 0, .08);
  --sombra-alta: 0 10px 26px rgba(0, 0, 0, .2);
}
:root[data-estilo="android"][data-tema="oscuro"] {
  --verde: #d0bcff;
  --verde-claro: #e8ddff;
  --gris-100: #141218;
  --gris-200: #211f26;
  --superficie: #211f26;
  --superficie-alta: #2b2930;
  --texto: #e6e0e9;
  --borde-tarjeta: none;
  --sombra: 0 1px 3px rgba(0, 0, 0, .5), 0 4px 12px rgba(0, 0, 0, .35);
  --sombra-alta: 0 14px 32px rgba(0, 0, 0, .5);
}
:root[data-estilo="android"] header.topbar { background-image: none; background: var(--verde); color: #fff; box-shadow: 0 3px 8px rgba(0, 0, 0, .25); }
:root[data-estilo="android"] header.topbar select,
:root[data-estilo="android"] .boton-gestion { background: rgba(255, 255, 255, .18); color: #fff; border-color: rgba(255, 255, 255, .3); border-radius: 999px; }
:root[data-estilo="android"] .btn { border-radius: 999px; }
:root[data-estilo="android"] .card,
:root[data-estilo="android"] .tarjeta-partido,
:root[data-estilo="android"] .fila-liga,
:root[data-estilo="android"] .fila-jugador-plantilla {
  position: relative;
  overflow: hidden;
}
:root[data-estilo="android"] .card::after,
:root[data-estilo="android"] .tarjeta-partido::after,
:root[data-estilo="android"] .fila-liga::after,
:root[data-estilo="android"] .fila-jugador-plantilla::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle, color-mix(in srgb, var(--verde) 35%, transparent) 0%, transparent 70%);
  opacity: 0;
  transform: scale(.4);
  transition: opacity .5s ease, transform .5s ease;
  pointer-events: none;
}
:root[data-estilo="android"] .card:active::after,
:root[data-estilo="android"] .tarjeta-partido:active::after,
:root[data-estilo="android"] .fila-liga:active::after,
:root[data-estilo="android"] .fila-jugador-plantilla:active::after {
  opacity: 1;
  transform: scale(1.6);
  transition: opacity .05s ease, transform .05s ease;
}

/* Iconos de menú propios: el robot "Bugdroid" de Android tiene licencia
   Creative Commons Attribution 3.0 de Google, así que aquí sí se puede
   usar su silueta sin restricción (a diferencia de otros temas). El
   icono de Ajustes es el robot completo; el resto recoge su lenguaje
   geométrico redondeado (Jornada lleva sus dos antenas como detalle). */
:root[data-estilo="android"] nav.bottomnav a .icono svg,
:root[data-estilo="android"] nav.bottomnav a .icono-dbz { display: none; }
:root[data-estilo="android"] nav.bottomnav a .icono-tematico { display: block; }
:root[data-estilo="android"] {
  --icono-tema-jornada: url("../../icons/temas/android/jornada.svg");
  --icono-tema-clasificacion: url("../../icons/temas/android/clasificacion.svg");
  --icono-tema-muro: url("../../icons/temas/android/muro.svg");
  --icono-tema-liga: url("../../icons/temas/android/liga.svg");
  --icono-tema-ajustes: url("../../icons/temas/android/ajustes.svg");
}