* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    background: #f8fafc;
    color: #1e293b;
    min-height: 100vh;
}

header {
    background: #1e293b;
    padding: 1rem 2rem;
    display: flex;
    align-items: center;
}

.logo {
    color: #fff;
    text-decoration: none;
    font-size: 1.3rem;
    font-weight: 700;
    letter-spacing: -0.5px;
}

main { padding: 2rem; }

.container {
    max-width: 1100px;
    margin: 0 auto;
}

/* CHAT PANEL */
.chat-panel {
    background: #fff;
    border-radius: 12px;
    padding: 2rem;
    box-shadow: 0 1px 3px rgba(0,0,0,.1);
    margin-bottom: 2rem;
}

.chat-panel h2 { margin-bottom: 1.2rem; font-size: 1.3rem; }

label {
    display: block;
    font-size: .85rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: .4rem;
    margin-top: 1rem;
}

input[type=text], textarea {
    width: 100%;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: .7rem 1rem;
    font-size: 1rem;
    font-family: inherit;
    background: #f8fafc;
    transition: border-color .2s;
}

input[type=text]:focus, textarea:focus {
    outline: none;
    border-color: #4f46e5;
    background: #fff;
}

button[type=submit] {
    margin-top: 1.2rem;
    background: #4f46e5;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: .75rem 2rem;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s;
}

button[type=submit]:hover { background: #4338ca; }
button[type=submit]:disabled { background: #94a3b8; cursor: not-allowed; }

.error {
    margin-top: 1rem;
    color: #dc2626;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 6px;
    padding: .6rem 1rem;
    font-size: .9rem;
}

.hidden { display: none !important; }

/* HISTORIAL */
.historial h2 { margin-bottom: 1rem; font-size: 1.1rem; color: #475569; }

.historial ul { list-style: none; }

.doc-item {
    background: #fff;
    border-radius: 8px;
    padding: .75rem 1rem;
    margin-bottom: .5rem;
    display: flex;
    align-items: center;
    gap: .75rem;
    box-shadow: 0 1px 2px rgba(0,0,0,.06);
}

.doc-item a {
    color: #1e293b;
    text-decoration: none;
    font-weight: 600;
    flex: 1;
}

.doc-item a:hover { color: #4f46e5; }

.doc-item small { color: #94a3b8; font-size: .8rem; }

/* BADGES */
.badge {
    font-size: .72rem;
    font-weight: 700;
    padding: .2rem .6rem;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.estado-pendiente { background: #fef9c3; color: #854d0e; }
.estado-procesando { background: #dbeafe; color: #1d4ed8; }
.estado-completado { background: #dcfce7; color: #15803d; }
.estado-error { background: #fee2e2; color: #991b1b; }

/* DETALLE */
.detalle { max-width: 1200px; }

.doc-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.doc-header h1 { font-size: 1.5rem; flex: 1; }

.btn-pdf {
    background: #4f46e5;
    color: #fff;
    text-decoration: none;
    padding: .5rem 1.2rem;
    border-radius: 8px;
    font-size: .9rem;
    font-weight: 600;
    transition: background .2s;
}

.btn-pdf:hover { background: #4338ca; }

/* PANEL GRID */
.panel-grid {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 768px) {
    .panel-grid { grid-template-columns: 1fr; }
}

.panel-agentes, .panel-documento {
    background: #fff;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0,0,0,.1);
}

.panel-agentes h3, .panel-documento h3 {
    font-size: 1rem;
    color: #475569;
    margin-bottom: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    font-size: .8rem;
}

#logs-container {
    max-height: 600px;
    overflow-y: auto;
}

.log-entry {
    border-left: 3px solid #94a3b8;
    padding: .5rem .75rem;
    margin-bottom: .75rem;
    background: #f8fafc;
    border-radius: 0 6px 6px 0;
}

.log-entry strong {
    display: block;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    margin-bottom: .2rem;
    color: #475569;
}

.log-entry p {
    font-size: .9rem;
    line-height: 1.5;
    color: #334155;
}

.waiting { color: #94a3b8; font-style: italic; }

/* DOCUMENTO MARKDOWN */
.doc-contenido {
    line-height: 1.7;
    color: #1e293b;
    min-height: 200px;
}

.doc-contenido h1 { font-size: 1.8em; margin-bottom: .5em; }
.doc-contenido h2 { font-size: 1.3em; margin-top: 1.5em; margin-bottom: .5em; border-bottom: 1px solid #e2e8f0; padding-bottom: .3em; }
.doc-contenido h3 { font-size: 1.1em; margin-top: 1em; }
.doc-contenido p { margin-bottom: .8em; }
.doc-contenido ul, .doc-contenido ol { margin: .5em 0 .5em 1.5em; }
.doc-contenido li { margin-bottom: .3em; }
.doc-contenido code { background: #f1f5f9; padding: .1em .3em; border-radius: 3px; font-size: .9em; }
.doc-contenido pre { background: #f1f5f9; padding: 1em; border-radius: 8px; overflow-x: auto; margin: 1em 0; }

.placeholder { color: #94a3b8; font-style: italic; }
