/* =========================================================
   Bloques del blog de Àlvar: cómo se ven en el artículo
   (y en el editor, que carga este mismo fichero).
   Los colores son los de la web (assets/css/alvar.css del tema); las
   variables --ab-* están en tablero.css.
   Las reglas llevan el elemento delante (figure.ab-partida…) para ganar a
   las de .prosa del tema sin !important.
   ========================================================= */

/* ---------- Fragmento de partida: tarjeta azul con el tablero ---------- */
figure.ab-partida {
  margin-block: 2em; padding: 20px 22px 22px;
  background: linear-gradient(135deg, var(--ab-marino-600), var(--ab-marino-800));
  color: var(--ab-crema);
  border-top: 4px solid var(--ab-oro);
  box-shadow: 0 18px 40px rgba(8, 29, 53, .22);
  font-family: "Poppins", system-ui, sans-serif;
  container-type: inline-size;
}
figure.ab-partida:focus-visible { outline: 3px solid var(--ab-oro); outline-offset: 3px; }

.ab-partida__cab { display: grid; gap: 3px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--ab-linea); }
.ab-partida__sello {
  justify-self: start; margin-bottom: 8px;
  background: var(--ab-oro); color: var(--ab-marino-900);
  font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; line-height: 1.4;
  padding: 4px 9px; border-radius: 2px;
}
.ab-partida .ab-partida__titulo { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.4; color: var(--ab-crema); }
.ab-partida .ab-partida__sub { margin: 0; font-size: 13px; line-height: 1.5; color: #b9c4d1; }
.ab-jugador { white-space: nowrap; }
.ab-jugador b { color: var(--ab-oro-claro); font-weight: 700; }
.ab-jugador small { font-size: .78em; font-weight: 500; color: #b9c4d1; }
.ab-partida__contra { margin: 0 .2em; color: var(--ab-oro); }

.ab-partida__cuerpo { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 24px; align-items: stretch; }
.ab-partida__tablero { position: relative; padding-top: 6px; align-self: start; }
.ab-partida__tablero .ab-tablero { border: 6px solid var(--ab-marino-900); outline: 1px solid var(--ab-oro); box-shadow: 0 16px 40px rgba(0, 0, 0, .45); box-sizing: border-box; }
.ab-partida__rotulo {
  position: absolute; left: 10px; top: -8px; z-index: 5;
  background: var(--ab-oro); color: var(--ab-marino-900);
  font: 700 13px/1 "Poppins", system-ui, sans-serif; padding: 7px 11px; border-radius: 2px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, .35);
}

.ab-partida__lateral { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ab-jugadas { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 2px; max-height: 300px; overflow: auto; scrollbar-width: thin; scrollbar-color: var(--ab-oro) transparent; }
.ab-jugadas__num { margin: 0 1px 0 8px; font-size: 13px; font-weight: 600; color: #8fa0b3; }
.ab-jugadas__num:first-child { margin-left: 0; }
.ab-jugadas__j {
  appearance: none; -webkit-appearance: none; cursor: pointer;
  background: transparent; border: 1px solid transparent; border-radius: 3px;
  color: #e3e9f0; font: 500 14px/1.5 "Poppins", system-ui, sans-serif; padding: 2px 7px;
  transition: background .2s, color .2s, border-color .2s;
}
.ab-jugadas__j:hover { border-color: var(--ab-linea); color: #fff; }
.ab-jugadas__j:focus-visible { outline: 2px solid var(--ab-oro); outline-offset: 1px; }
.ab-jugadas__j.ab-activa { background: var(--ab-oro); color: var(--ab-marino-900); font-weight: 700; }
.ab-partida--estatica .ab-jugadas__j { cursor: default; }

.ab-partida .ab-partida__comentario {
  margin: 0; padding: 10px 14px;
  border-left: 3px solid var(--ab-oro); background: rgba(255, 255, 255, .05);
  font-size: 14px; line-height: 1.6; color: #d9e0e8;
}
.ab-partida .ab-partida__comentario[hidden] { display: none; }

.ab-mandos { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin-top: auto; }
.ab-mandos button {
  appearance: none; -webkit-appearance: none; cursor: pointer;
  height: 40px; display: grid; place-items: center; padding: 0;
  background: transparent; color: var(--ab-crema);
  border: 1px solid var(--ab-linea); border-radius: 2px;
  transition: background .2s, color .2s, border-color .2s;
}
.ab-mandos svg { width: 16px; height: 16px; fill: currentColor; }
.ab-mandos button:hover:not(:disabled) { border-color: var(--ab-oro); background: rgba(201, 169, 97, .12); }
.ab-mandos button:focus-visible { outline: 2px solid var(--ab-oro); outline-offset: 2px; }
.ab-mandos button:disabled { opacity: .35; cursor: default; }
.ab-mandos .ab-mandos__play { background: var(--ab-oro); color: var(--ab-marino-900); border-color: var(--ab-oro); }
.ab-mandos .ab-mandos__play:hover:not(:disabled) { background: var(--ab-oro-claro); }
.ab-partida--estatica .ab-mandos { display: none; }

.ab-partida .ab-partida__enlace {
  align-self: flex-start;
  font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ab-oro); text-decoration: none;
}
.ab-partida .ab-partida__enlace:hover { color: var(--ab-oro-claro); }
.ab-partida__datos { display: none; }

@container (max-width: 600px) {
  .ab-partida__cuerpo { grid-template-columns: 1fr; gap: 18px; }
  .ab-jugadas { max-height: none; }
  .ab-mandos { order: -1; margin-top: 0; }
}
@media (max-width: 600px) {
  figure.ab-partida { padding: 16px 14px 18px; margin-inline: -4px; }
}

/* ---------- Posición (diagrama fijo) ---------- */
figure.ab-posicion { margin-top: 2em; margin-bottom: 2em; font-family: "Poppins", system-ui, sans-serif; --ab-ancho: 440px; }
figure.ab-posicion--pequeno { --ab-ancho: 300px; }
figure.ab-posicion--grande { --ab-ancho: 100%; }
.ab-posicion__marco, .ab-posicion .ab-posicion__pie { max-width: var(--ab-ancho); margin-inline: auto; }
.ab-posicion__marco { position: relative; padding-top: 8px; }
.ab-posicion__marco .ab-tablero { border: 6px solid var(--ab-marino-900); outline: 1px solid var(--ab-oro); box-shadow: 0 16px 36px rgba(13, 42, 74, .24); box-sizing: border-box; }
.ab-posicion__turno {
  position: absolute; left: 10px; top: -8px; z-index: 5;
  display: inline-flex; align-items: center;
  background: var(--ab-marino-700); color: var(--ab-crema);
  font: 600 12px/1 "Poppins", system-ui, sans-serif; letter-spacing: .03em;
  padding: 7px 10px; border-radius: 2px; border: 1px solid var(--ab-oro);
  box-shadow: 0 6px 16px rgba(0, 0, 0, .25);
}
.ab-posicion .ab-posicion__pie {
  display: grid; gap: 6px; margin-top: 14px; text-align: center;
  font-size: 14.5px; line-height: 1.55; color: #454d59;
}
.ab-posicion__texto strong, .ab-posicion__texto b { color: var(--ab-marino-700); }
.ab-posicion__enlaces { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px 18px; }
.ab-posicion .ab-posicion__enlaces a {
  font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--ab-marino-500); text-decoration: none;
}
.ab-posicion .ab-posicion__enlaces a:hover { color: var(--ab-oro); }

/* ---------- Cintillo ---------- */
p.ab-cintillo { margin-block: 2.2em .1em; font-family: "Poppins", system-ui, sans-serif; line-height: 1.4; }
/* Antetítulo (el de serie): dorado, espaciado, con una raya delante */
.ab-cintillo .ab-cintillo__texto { display: inline-flex; align-items: center; gap: 12px; color: var(--ab-oro); font-size: 12px; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; }
.ab-cintillo .ab-cintillo__texto::before { content: ""; flex: none; width: 28px; height: 2px; background: var(--ab-oro); }
/* Etiqueta dorada: como la categoría de las tarjetas del blog */
.ab-cintillo.is-style-etiqueta .ab-cintillo__texto { display: inline-block; gap: 0; background: var(--ab-oro); color: var(--ab-marino-900); font-size: 11px; font-weight: 700; letter-spacing: .14em; padding: 5px 10px; border-radius: 2px; }
.ab-cintillo.is-style-etiqueta .ab-cintillo__texto::before { display: none; }
/* Banda azul con el caballo: separa partes del artículo */
p.ab-cintillo.is-style-banda {
  margin-block: 2.6em .2em; padding: 12px 18px;
  background: linear-gradient(135deg, var(--ab-marino-600), var(--ab-marino-800));
  border-left: 4px solid var(--ab-oro);
}
.ab-cintillo.is-style-banda .ab-cintillo__texto { color: var(--ab-crema); font-size: 13px; font-weight: 700; letter-spacing: .16em; }
.ab-cintillo.is-style-banda .ab-cintillo__texto::before { width: 24px; height: 24px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='45' height='45'%3E%3Cg fill='none' fill-rule='evenodd' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 10c10.5 1 16.5 8 16 29H15c0-9 10-6.5 8-21' fill='%23fff'/%3E%3Cpath d='M24 18c.38 2.91-5.55 7.37-8 9-3 2-2.82 4.34-5 4-1.042-.94 1.41-3.04 0-3-1 0 .19 1.23-1 2-1 0-4.003 1-4-4 0-2 6-12 6-12s1.89-1.9 2-3.5c-.73-.994-.5-2-.5-3 1-1 3 2.5 3 2.5h2s.78-1.992 2.5-3c1 0 1 3 1 3' fill='%23fff'/%3E%3Cpath d='M9.5 25.5a.5.5 0 1 1-1 0 .5.5 0 1 1 1 0zm5.433-9.75a.5 1.5 30 1 1-.866-.5.5 1.5 30 1 1 .866.5z' fill='%23000'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat; }
/* El título que va justo después del cintillo, pegado a él */
.ab-cintillo + .wp-block-heading, .ab-cintillo + h2, .ab-cintillo + h3 { margin-top: .3em; }
.ab-cintillo.is-style-banda + .wp-block-heading, .ab-cintillo.is-style-banda + h2, .ab-cintillo.is-style-banda + h3 { margin-top: .9em; }

/* ---------- Idea clave ---------- */
aside.ab-destacado {
  margin-block: 2em; padding: 22px 24px 22px;
  background: #fff; border: 1px solid #e6dcc4; border-top: 3px solid var(--ab-oro);
  box-shadow: 0 6px 22px rgba(13, 42, 74, .08);
  font-family: "Poppins", system-ui, sans-serif;
}
.ab-destacado .ab-destacado__etiqueta {
  display: flex; align-items: center; gap: 10px; margin: 0 0 10px;
  font-size: 11.5px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--ab-oro);
}
.ab-destacado .ab-destacado__etiqueta::before { content: ""; flex: none; width: 22px; height: 22px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='45' height='45'%3E%3Cg fill='none' fill-rule='evenodd' stroke='%230d2a4a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 10c10.5 1 16.5 8 16 29H15c0-9 10-6.5 8-21' fill='%23c9a961'/%3E%3Cpath d='M24 18c.38 2.91-5.55 7.37-8 9-3 2-2.82 4.34-5 4-1.042-.94 1.41-3.04 0-3-1 0 .19 1.23-1 2-1 0-4.003 1-4-4 0-2 6-12 6-12s1.89-1.9 2-3.5c-.73-.994-.5-2-.5-3 1-1 3 2.5 3 2.5h2s.78-1.992 2.5-3c1 0 1 3 1 3' fill='%23c9a961'/%3E%3Cpath d='M9.5 25.5a.5.5 0 1 1-1 0 .5.5 0 1 1 1 0zm5.433-9.75a.5 1.5 30 1 1-.866-.5.5 1.5 30 1 1 .866.5z' fill='%23000'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat; }
.ab-destacado__cuerpo > * { margin-top: 0; margin-bottom: 0; }
.ab-destacado__cuerpo > * + * { margin-top: .8em; }
.ab-destacado__cuerpo p { font-size: 16.5px; line-height: 1.7; }
aside.ab-destacado.is-style-oscuro { background: linear-gradient(135deg, var(--ab-marino-600), var(--ab-marino-800)); border: 0; border-top: 4px solid var(--ab-oro); color: var(--ab-crema); box-shadow: 0 18px 40px rgba(8, 29, 53, .22); }
.ab-destacado.is-style-oscuro .ab-destacado__etiqueta::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='45' height='45'%3E%3Cg fill='none' fill-rule='evenodd' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 10c10.5 1 16.5 8 16 29H15c0-9 10-6.5 8-21' fill='%23fff'/%3E%3Cpath d='M24 18c.38 2.91-5.55 7.37-8 9-3 2-2.82 4.34-5 4-1.042-.94 1.41-3.04 0-3-1 0 .19 1.23-1 2-1 0-4.003 1-4-4 0-2 6-12 6-12s1.89-1.9 2-3.5c-.73-.994-.5-2-.5-3 1-1 3 2.5 3 2.5h2s.78-1.992 2.5-3c1 0 1 3 1 3' fill='%23fff'/%3E%3Cpath d='M9.5 25.5a.5.5 0 1 1-1 0 .5.5 0 1 1 1 0zm5.433-9.75a.5 1.5 30 1 1-.866-.5.5 1.5 30 1 1 .866.5z' fill='%23000'/%3E%3C/g%3E%3C/svg%3E"); }
.ab-destacado.is-style-oscuro p, .ab-destacado.is-style-oscuro li { color: #d9e0e8; }
.ab-destacado.is-style-oscuro strong, .ab-destacado.is-style-oscuro b { color: var(--ab-oro-claro); }
.ab-destacado.is-style-oscuro a { color: var(--ab-oro-claro); }
aside.ab-destacado.is-style-ejercicio { background: #fbf5e6; border: 0; border-left: 4px solid var(--ab-oro); box-shadow: none; }
.ab-destacado.is-style-ejercicio .ab-destacado__etiqueta { color: var(--ab-marino-700); }

/* ---------- Viñetas de ajedrez (estilos de la Lista) ---------- */
.wp-block-list.is-style-ab-peones, .wp-block-list.is-style-ab-casillas, .wp-block-list.is-style-ab-check, .wp-block-list.is-style-ab-numeros { list-style: none; padding-left: 0; }
.is-style-ab-peones > li, .is-style-ab-casillas > li, .is-style-ab-check > li { position: relative; padding-left: 1.9em; }
.is-style-ab-peones > li::before { content: ""; position: absolute; left: .05em; top: .22em; width: 1.25em; height: 1.25em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='45' height='45'%3E%3Cpath d='M22.5 9c-2.21 0-4 1.79-4 4 0 .89.29 1.71.78 2.38C17.33 16.5 16 18.59 16 21c0 2.03.94 3.84 2.41 5.03-3 1.06-7.41 5.55-7.41 13.47h23c0-7.92-4.41-12.41-7.41-13.47 1.47-1.19 2.41-3 2.41-5.03 0-2.41-1.33-4.5-3.28-5.62.49-.67.78-1.49.78-2.38 0-2.21-1.79-4-4-4z' fill='%23c9a961' stroke='%230d2a4a' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.is-style-ab-casillas > li::before {
  content: ""; position: absolute; left: .3em; top: .5em; width: .72em; height: .72em;
  background: conic-gradient(var(--ab-marino-700) 0 25%, var(--ab-oro) 0 50%, var(--ab-marino-700) 0 75%, var(--ab-oro) 0) 0 0 / 100% 100%;
  outline: 1px solid var(--ab-marino-700);
}
.is-style-ab-check > li::before { content: ""; position: absolute; left: .1em; top: .3em; width: 1.15em; height: 1.15em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='10' fill='%23c9a961'/%3E%3Cpath d='M5.6 10.4l2.9 2.9 5.9-6.3' fill='none' stroke='%230d2a4a' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
.wp-block-list.is-style-ab-numeros { counter-reset: ab-numero; }
.is-style-ab-numeros > li { counter-increment: ab-numero; position: relative; padding-left: 2.3em; }
.is-style-ab-numeros > li::before {
  content: counter(ab-numero); position: absolute; left: 0; top: .2em;
  width: 1.65em; height: 1.65em; display: grid; place-items: center; border-radius: 50%;
  background: var(--ab-marino-700); color: var(--ab-oro-claro);
  font-size: .78em; font-weight: 700; line-height: 1;
}

/* ---------- Otros estilos de bloques de WordPress ---------- */
.wp-block-heading.is-style-ab-linea { padding-bottom: .35em; border-bottom: 1px solid var(--ab-oro); }

.wp-block-image.is-style-ab-marco img { border: 6px solid var(--ab-marino-900); outline: 1px solid var(--ab-oro); border-radius: 0; box-shadow: 0 16px 36px rgba(13, 42, 74, .24); box-sizing: border-box; }
.wp-block-image.is-style-ab-captura img { border: 1px solid rgba(13, 42, 74, .16); border-radius: 8px; box-shadow: 0 14px 34px rgba(13, 42, 74, .18); }

hr.wp-block-separator.is-style-ab-caballo {
  width: 100%; height: 30px; margin-block: 2.6em; border: 0; opacity: 1;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='45' height='45'%3E%3Cg fill='none' fill-rule='evenodd' stroke='%230d2a4a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 10c10.5 1 16.5 8 16 29H15c0-9 10-6.5 8-21' fill='%23c9a961'/%3E%3Cpath d='M24 18c.38 2.91-5.55 7.37-8 9-3 2-2.82 4.34-5 4-1.042-.94 1.41-3.04 0-3-1 0 .19 1.23-1 2-1 0-4.003 1-4-4 0-2 6-12 6-12s1.89-1.9 2-3.5c-.73-.994-.5-2-.5-3 1-1 3 2.5 3 2.5h2s.78-1.992 2.5-3c1 0 1 3 1 3' fill='%23c9a961'/%3E%3Cpath d='M9.5 25.5a.5.5 0 1 1-1 0 .5.5 0 1 1 1 0zm5.433-9.75a.5 1.5 30 1 1-.866-.5.5 1.5 30 1 1 .866.5z' fill='%23000'/%3E%3C/g%3E%3C/svg%3E") center / 30px 30px no-repeat,
    linear-gradient(var(--ab-oro), var(--ab-oro)) left center / calc(50% - 28px) 1px no-repeat,
    linear-gradient(var(--ab-oro), var(--ab-oro)) right center / calc(50% - 28px) 1px no-repeat;
}

blockquote.wp-block-quote.is-style-ab-alvar {
  margin-block: 2em; padding: 0 1em; border: 0; text-align: center;
  font-size: 23px; font-weight: 600; line-height: 1.45; color: var(--ab-marino-700);
}
blockquote.wp-block-quote.is-style-ab-alvar::before { content: "“"; display: block; height: .55em; font-size: 72px; font-weight: 800; line-height: 1; color: var(--ab-oro); }
blockquote.wp-block-quote.is-style-ab-alvar cite { display: block; margin-top: 10px; font-size: 12px; font-style: normal; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--ab-oro); }
