/* Colores para modo claro */
:root {
  --md-primary-fg-color: #405189;          /* barra superior / enlaces principales */
  --md-primary-fg-color--light: #38BDF8;
  --md-primary-fg-color--dark: #0284C7;
  --md-accent-fg-color: #F97316;           /* color de acento (botones, etc.) */
}

/* Colores para modo oscuro */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #f3f6f9;
  --md-primary-fg-color--light: #BAE6FD;
  --md-primary-fg-color--dark: #38BDF8;
  --md-accent-fg-color: #FDBA74;
}

/* Aumenta el foco visible para usuarios de teclado */
:focus-visible {
  outline: 3px solid #4c9ffe;
  outline-offset: 2px;
}

/* Tablas: scroll horizontal amigable */
.md-typeset table {
  display: block;
  overflow-x: auto;
}

/* Vídeos responsivos */
.video-wrapper { position: relative; padding-bottom: 56.25%; height: 0; }
.video-wrapper iframe, .video-wrapper video {
  position: absolute; top: 0; left: 0; width: 100%; height: 100%;
}