/* Automatizaciones → «Servidores MCP» (mcp.js): una tarjeta por servidor con su estado y sus herramientas, y el
   formulario para agregar o editar. Colores por uso (espacio.css), así sigue al tema claro y oscuro. */

[data-shown="mcp"] > main.wide { max-width: 56rem; }

.mcp-vacio { color: var(--texto-suave); margin: 1.5rem 0; }
.mcp-lista { display: flex; flex-direction: column; gap: 0.75rem; margin: 1rem 0 0; }

.mcp-tarjeta {
  border: 1px solid var(--borde); border-radius: 12px; background: var(--superficie); padding: 0.9rem 1rem;
  scroll-margin-top: 1rem;
}
.mcp-tarjeta.es-abierta { box-shadow: 0 6px 20px -14px color-mix(in srgb, var(--texto) 40%, transparent); }
.mcp-cabeza { display: flex; justify-content: space-between; align-items: start; gap: 1rem; }
.mcp-titulo { min-width: 0; }
.mcp-titulo h3 { margin: 0; font-size: 1.05rem; }
.mcp-url { margin: 0.15rem 0 0; color: var(--texto-suave); overflow-wrap: anywhere; }
.mcp-meta, .mcp-revisado { margin: 0.3rem 0 0; color: var(--texto-suave); font-size: 0.9em; }
.mcp-error { margin: 0.5rem 0 0; padding-left: 0.6rem; border-left: 3px solid oklch(0.6 0.18 25); overflow-wrap: anywhere; }
.mcp-tarjeta .actions { margin-top: 0.75rem; display: flex; flex-wrap: wrap; gap: 0.5rem; }

.mcp-estado { flex: none; padding: 0.15rem 0.6rem; border-radius: 999px; font-size: 0.85em; background: var(--encima); white-space: nowrap; }
.mcp-estado.es-ok { background: oklch(0.9 0.08 150); color: oklch(0.35 0.1 150); }
.mcp-estado.es-error { background: oklch(0.9 0.07 25); color: oklch(0.42 0.16 25); }

.mcp-herramientas { list-style: none; margin: 0.9rem 0 0; padding: 0; border-top: 1px solid var(--borde); }
.mcp-herramientas li { padding: 0.65rem 0; border-bottom: 1px solid var(--borde); }
.mcp-herramientas p { margin: 0.3rem 0 0; overflow-wrap: anywhere; }
.mcp-herramienta-cabeza { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; }
.mcp-herramienta-cabeza code { font-weight: 600; }
.mcp-parametros { color: var(--texto-suave); font-size: 0.9em; }
.mcp-insignia { padding: 0.05rem 0.5rem; border-radius: 999px; font-size: 0.8em; background: oklch(0.92 0.08 80); color: oklch(0.42 0.1 70); }
.mcp-insignia.es-lectura { background: oklch(0.9 0.06 250); color: oklch(0.4 0.12 250); }

.mcp-form label { display: flex; flex-direction: column; gap: 0.25rem; margin: 0.75rem 0; }
.mcp-form .mono { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: 0.9em; }

@media (max-width: 40rem) {
  .mcp-cabeza { flex-direction: column; gap: 0.5rem; }
}