/* ============================================================
   Portal docente · colores base de cada asignatura
   ============================================================ */
:root {
  --iaw:  #34a853;
  --dwec: #ea4335;
  --diw:  #fbbc04;
  --sad:  #4285f4;
  --stripe: linear-gradient(90deg, var(--sad) 0 25%, var(--dwec) 25% 50%, var(--diw) 50% 75%, var(--iaw) 75% 100%);

  /* Cabecera neutra (pizarra) para que destaquen los colores de las asignaturas */
  --md-primary-fg-color:        #1f2937;
  --md-primary-fg-color--light: #374151;
  --md-primary-fg-color--dark:  #111827;
  --md-accent-fg-color:         var(--sad);
}
[data-md-color-scheme="default"] { --md-typeset-a-color: #1a73e8; }
[data-md-color-scheme="slate"] {
  --md-primary-fg-color:        #111827;
  --md-primary-fg-color--dark:  #030712;
  --md-accent-fg-color:         #8ab4f8;
  --md-typeset-a-color:         #8ab4f8;
}
/* Elemento activo del menú lateral, legible en ambos modos */
.md-nav__link--active, .md-nav__item .md-nav__link--active { color: var(--md-typeset-a-color); }

/* Franja de 4 colores bajo la cabecera y las pestañas */
.md-header { box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.md-tabs { border-bottom: 4px solid transparent; border-image: var(--stripe) 1; }

/* Cabecera de tablas (mismo criterio que DIW/DWEC, en color pizarra) */
.md-typeset table:not([class]) th {
  background-color: var(--md-primary-fg-color);
  color: #fff !important;
}

/* ---------- Portada ---------- */
.hero {
  position: relative;
  padding: 2rem 1.5rem 1.5rem;
  margin-bottom: 1.5rem;
  border-radius: 12px;
  background: var(--md-code-bg-color);
  overflow: hidden;
}
.hero::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 6px; background: var(--stripe);
}
.md-typeset .hero h1 { margin: 0 0 .3rem; font-weight: 800; color: var(--md-default-fg-color); }
.hero .subtitle { margin: 0; font-size: 1.05em; color: var(--md-default-fg-color--light); }

/* ---------- Tarjetas por asignatura ---------- */
.md-typeset .grid.cards.subjects > ul > li {
  border: 0;
  border-top: 6px solid var(--c);
  border-radius: 10px;
  background: color-mix(in srgb, var(--c) 7%, var(--md-default-bg-color));
  transition: transform .15s ease, box-shadow .15s ease;
}
.md-typeset .grid.cards.subjects > ul > li:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px color-mix(in srgb, var(--c) 30%, transparent);
}
.md-typeset .grid.cards.subjects > ul > li:nth-child(1) { --c: var(--iaw); }
.md-typeset .grid.cards.subjects > ul > li:nth-child(2) { --c: var(--sad); }
.md-typeset .grid.cards.subjects > ul > li:nth-child(3) { --c: var(--dwec); }
.md-typeset .grid.cards.subjects > ul > li:nth-child(4) { --c: var(--diw); }
.md-typeset .grid.cards.subjects .twemoji,
.md-typeset .grid.cards.subjects strong,
.md-typeset .grid.cards.subjects a { color: var(--c); font-weight: 700; }
/* El amarillo de DIW necesita más contraste como texto sobre fondo claro */
[data-md-color-scheme="default"] .md-typeset .grid.cards.subjects > ul > li:nth-child(4) strong,
[data-md-color-scheme="default"] .md-typeset .grid.cards.subjects > ul > li:nth-child(4) .twemoji,
[data-md-color-scheme="default"] .md-typeset .grid.cards.subjects > ul > li:nth-child(4) a { color: #b06000; }

/* Tarjetas del árbol tecnológico: color de la asignatura que las trabaja */
.md-typeset .grid.cards.tech > ul > li {
  --c: var(--iaw);
  border: 1px solid color-mix(in srgb, var(--c) 35%, transparent);
  border-left: 5px solid var(--c);
  border-radius: 10px;
}
.md-typeset .grid.cards.tech > ul > li:nth-child(n+4) { --c: var(--sad); }
.md-typeset .grid.cards.tech > ul > li:hover { border-color: var(--c); box-shadow: 0 4px 14px color-mix(in srgb, var(--c) 25%, transparent); }
.md-typeset .grid.cards.tech .twemoji { color: var(--c); }

/* ---------- Chips de asignatura (en cada ficha técnica) ---------- */
.chips { display: inline-flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: .75rem; color: var(--md-default-fg-color--light); }
.md-typeset a.chip {
  display: inline-flex; align-items: center; gap: .25em;
  padding: .1em .7em; border-radius: 999px;
  font-weight: 700; color: #fff; background: var(--c);
}
.md-typeset a.chip:hover { color: #fff; filter: brightness(1.1); }
.md-typeset a.chip.iaw  { --c: var(--iaw); }
.md-typeset a.chip.sad  { --c: var(--sad); }
.md-typeset a.chip.dwec { --c: var(--dwec); }
.md-typeset a.chip.diw  { --c: var(--diw); color: #202124; }