raw: estilos

tipo: css
nombre: estilos completos
---
/* ============================================================
   TRAMA — Mapa completo de estilos
   
   Este nodo documenta TODOS los elementos HTML que el kernel
   genera. Todo lo que ves en pantalla se puede cambiar aquí.
   
   Los valores actuales replican el fallback del kernel.
   Modifícalos, borra lo que no necesites, o crea más nodos
   tipo:css para separar por tema.
   ============================================================ */

/* --- PÁGINA ------------------------------------------------ */

body {
    font-family: monospace;
    font-size: 16px;
    line-height: 1.6;
    max-width: 72ch;              /* ancho de lectura */
    margin: 2rem auto;
    padding: 0 1rem;
    color: #1a1a1a;
    background: #FBF0D9;
}

/* --- NAVEGACIÓN -------------------------------------------- */
/* Generada por nodos tipo:nav, o el fallback del kernel       */

nav {
    border-bottom: 1px solid #ccc;
    padding-bottom: .5rem;
    margin-bottom: 1.5rem;
    font-size: .85rem;
}

nav a {
    color: #555;
    text-decoration: none;
    margin-right: 1rem;
}

nav a:hover {
    color: #000;
}

/* --- TÍTULO DEL NODO --------------------------------------- */
/* h1 aparece en todas las vistas: view, edit, raw, new        */

h1 {
    font-size: 1.2rem;
    font-weight: normal;
    margin-bottom: 1rem;
    color: #333;
}

/* --- CONTENIDO (vista view) -------------------------------- */
/* .content envuelve el texto renderizado del nodo             */

.content p {
    margin-bottom: .8rem;
}

.content a {
    color: #2255aa;
}

.content a:hover {
    text-decoration: none;
}

/* --- METADATOS (vista view, ocultos por defecto) ----------- */
/* Se muestran al hacer click en "meta"                        */

.node-meta {
    background: #f5f5f0;
    padding: .5rem 1rem;
    margin-bottom: 1rem;
    font-size: .85rem;
    border-left: 3px solid #ccc;
}

.node-meta p {
    margin: .15rem 0;
}

.node-meta strong {
    color: #555;
}

/* --- LISTA DE NODOS ---------------------------------------- */
/* Generada por {{nodos}} y {{nodos:tipo}} en contenido,       */
/* y por la vista "new" (lista de todos los nodos)             */

.nodos-lista {
    list-style: none;
    font-size: .85rem;
}

.nodos-lista li {
    margin-bottom: .2rem;
}

.nodos-lista a {
    color: #2255aa;
    text-decoration: none;
}

.nodos-lista a:hover {
    text-decoration: underline;
}

.nodos-lista small {
    color: #999;               /* indicador de tipo */
}

/* --- EDITOR (vista edit) ----------------------------------- */

textarea {
    width: 100%;
    min-height: 60vh;
    font-family: monospace;
    font-size: 16px;
    line-height: 1.6;
    padding: 1rem;
    border: 1px solid #ccc;
    background: #fff;
    resize: vertical;
}

textarea:focus {
    outline: 2px solid #2255aa;
    border-color: #2255aa;
}

/* --- HERRAMIENTAS DEL EDITOR ------------------------------- */
/* Contenido inyectado desde nodos tipo:editor                 */

.editor-tools {
    margin-bottom: .5rem;
}

.editor-tools button {
    font-family: monospace;
    font-size: .8rem;
    padding: .2rem .6rem;
    margin: .1rem;
    cursor: pointer;
    background: #eee;
    border: 1px solid #ccc;
}

.editor-tools button:hover {
    background: #ddd;
}

/* --- BOTONES GENERALES ------------------------------------- */

button {
    font-family: monospace;
    font-size: .9rem;
    padding: .4rem 1rem;
    margin-top: .5rem;
    cursor: pointer;
    background: #eee;
    border: 1px solid #ccc;
}

button:hover {
    background: #ddd;
}

/* --- FORMULARIO NUEVO NODO (vista new) --------------------- */

label {
    font-size: .9rem;
}

input[type="text"] {
    font-family: monospace;
    font-size: 1rem;
    padding: .3rem;
    border: 1px solid #ccc;
}

input[type="text"]:focus {
    outline: 2px solid #2255aa;
    border-color: #2255aa;
}

/* --- ACCIONES (debajo del contenido en vista view/raw) ------ */

.actions {
    margin-top: 1rem;
    font-size: .85rem;
}

.actions a {
    color: #555;
    margin-right: 1rem;
    text-decoration: none;
}

.actions a:hover {
    color: #000;
}

/* --- BOTÓN ELIMINAR ---------------------------------------- */

.del-btn {
    background: none;
    border: none;
    color: #aa3333;
    padding: 0;
    font-size: .85rem;
    cursor: pointer;
}

.del-btn:hover {
    text-decoration: underline;
}

/* Form de eliminar (inline junto a las acciones) */
.del-form {
    display: inline;
}

/* Link cancelar en editor */
.cancel-link {
    margin-left: 1rem;
    font-size: .85rem;
    color: #555;
    text-decoration: none;
}

/* Form de nuevo nodo */
.new-form {
    margin-bottom: 1.5rem;
}

/* Texto "generado por el kernel" en listas automáticas */
.kernel-gen {
    color: #999;
    font-size: .85rem;
}

/* --- VISTA RAW --------------------------------------------- */

pre.raw {
    background: #f5f5f0;
    padding: 1rem;
    overflow-x: auto;
    font-size: .9rem;
    border: 1px solid #ddd;
    white-space: pre-wrap;
    word-wrap: break-word;
}

/* --- FOOTER ------------------------------------------------ */

footer {
    margin-top: 3rem;
    padding-top: .5rem;
    border-top: 1px solid #ccc;
    font-size: .75rem;
    color: #999;
}

/* ============================================================
   ELEMENTOS GENERADOS POR NODOS tipo:render
   (dependen de tus reglas — estos son los del bootstrap)
   ============================================================ */

/* Encabezados: == texto == */
h2 {
    font-size: 1.1rem;
    margin: 1.2rem 0 .5rem;
    font-weight: normal;
    border-bottom: 1px solid #ddd;
    padding-bottom: .2rem;
}

/* Código inline: `texto` */
code {
    background: #f0f0ec;
    padding: .1rem .4rem;
    font-size: .9rem;
}

/* Línea horizontal: --- */
hr {
    border: none;
    border-top: 1px solid #ccc;
    margin: 1rem 0;
}

/* ============================================================
   RELACIONES TIPADAS
   (dependen de las reglas en el nodo "relaciones")
   ============================================================ */

.rel {
    font-size: .85rem;
    padding: .1rem .3rem;
    border-radius: 3px;
    text-decoration: none;
}

.rel-fuente { background: #e8f5e9; color: #2e7d32; }
.rel-ver { background: #e3f2fd; color: #1565c0; }
.rel-contradice { background: #fce4ec; color: #c62828; }
.rel-continua { background: #fff3e0; color: #e65100; }

.rel:hover {
    opacity: .8;
}