body{
    background:#f5f5f5;
    font-size:14px;
    font-family: "Segoe UI", Arial, sans-serif;
}
.detalle-texto{
    line-height:1.7;
    font-size:14px;
    text-align:justify;
    background:#fafafa;
    padding:14px;
    border-radius:6px;
    border:1px solid #e6e6e6;
}
/* estilo general de cabeceras de secciones */
.card-header.cabecera{
    background:#f7f8fa;
    font-weight:600;
    padding:10px 14px;
    border-left:4px solid #6c757d;
    color:#2c3e50;
}

/* variación por tipo de bloque */

.card-header.datos{
    border-left-color:#3c8dbc;
}

.card-header.detalle{
    border-left-color:#27ae60;
}

.card-header.historial{
    border-left-color:#f39c12;
}

.card-header.archivos{
    border-left-color:#8e44ad;
}

.card-header.comentarios{
    border-left-color:#16a085;
}

.card-header.acciones{
    border-left-color:#e74c3c;
}

/* pequeño efecto visual */

.card{
    border:1px solid #e2e5e8;
}

.card:hover{
    box-shadow:0 2px 6px rgba(0,0,0,0.08);
}
.timeline{
    position:relative;
    padding-left:30px;
}

.timeline::before{
    content:"";
    position:absolute;
    left:12px;
    top:0;
    bottom:0;
    width:2px;
    background:#e1e4e8;
}

.timeline-item{
    position:relative;
    margin-bottom:14px;
}

.timeline-icon{
    position:absolute;
    left:-4px;
    top:4px;
    width:24px;
    height:24px;
    border-radius:50%;
    text-align:center;
    line-height:24px;
    font-size:12px;
    color:#fff;
}

.timeline-content{
    margin-left:30px;
    background:#f8f9fa;
    border:1px solid #e5e5e5;
    border-radius:6px;
    padding:10px 12px;
}

.timeline-fecha{
    font-size:12px;
    color:#888;
}

.timeline-contenido{
    background:#f8f9fa;
    padding:8px 12px;
    border-radius:5px;
    border:1px solid #e5e5e5;
    margin-top:4px;
}
.timeline-item:first-child .timeline-contenido{
    border-color:#3c8dbc;
    background:#eef6fc;
}
.icon-registro { background:#3498db; }
.icon-comentario { background:#16a085; }
.icon-documento { background:#8e44ad; }
.icon-resolucion { background:#f39c12; }
.icon-cierre { background:#e74c3c; }
.icon-estado { background:#2ecc71; }
.icon-recepcion { background:#cc8d2e; }
.icon-evaluacion { background:#cc2e8f; }
.icon-notif { background:#100db9; }
.icon-considera { background:#015a26; }
.icon-elevar { background:#8b3907; }
.icon-apelar { background:#DC3545; }
.icon-nulo { background:#ff4c3c; }

.border-left-registro { border-left:5px solid #3498db; }
.border-left-comentario { border-left:5px solid #16a085; }
.border-left-documento { border-left:5px solid #8e44ad; }
.border-left-resolucion { border-left:5px solid #f39c12; }
.border-left-cierre { border-left:5px solid #e74c3c; }
.border-left-estado { border-left:5px solid #2ecc71; }
.border-left-recepcion { border-left:5px solid #cc8d2e; }
.border-left-evaluacion { border-left:5px solid #cc2e8f; }
.border-left-notif { border-left:5px solid #100db9; }
.border-left-considera { border-left:5px solid #015a26; }
.border-left-elevar { border-left:5px solid #8b3907; }
.border-left-apelar { border-left:5px solid #DC3545; }
.border-left-nulo { border-left:5px solid #ff4c3c; }

.alerta-registro   { background-color: rgba(52, 152, 219, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-comentario { background-color: rgba(22, 160, 133, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-documento  { background-color: rgba(142, 68, 173, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-resolucion { background-color: rgba(243, 156, 18, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-cierre     { background-color: rgba(231, 76, 60, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-estado     { background-color: rgba(46, 204, 113, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-recepcion  { background-color: rgba(204, 141, 46, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-evaluacion { background-color: rgba(204, 46, 143, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-notif      { background-color: rgba(16, 13, 185, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-considera  { background-color: rgba(1, 90, 38, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-elevar     { background-color: rgba(139, 57, 7, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-apelar     { background-color: rgba(220, 53, 69, 0.6); padding: 0.75rem 1rem 16px;}
.alerta-nulo       { background-color: rgba(255, 76, 60, 0.6); padding: 0.75rem 1rem 16px;}