/* Mostrar la imagen solo en tablet/desktop */
.sp--desktop-tablet { display: none; }
@media (min-width: 768px) {
  .sp--desktop-tablet { display: block; }
}

/* (Opcional) estilos suaves del resultado */
#resultado-pedido-cab .cpe-card,
#resultado-pedido-det .cpe-card { box-shadow: 0 2px 8px rgba(0,0,0,.04); }

/* Asegurar oculto por defecto (si lo manejas también por JS) */
#resultado-pedido-cab,
#resultado-pedido-det { display: none; }

.lineatemp {
    width: 100%;
    margin: 0 auto;
    padding: 3%;
}

.fila {
    display: flex;
    position: relative;
    margin-bottom: 20px;
}

.fila:last-child {
    margin-bottom: 0;
}

.fila::before {
    content: '';
    position: absolute;
    left: 40px;
    transform: translateX(-50%);
    top: 0;
    width: 9px;
    background: #F8B133;
    height: calc(100% + 20px);
}

.fila:first-child::before {
    top: 50% height: 50%;
}

.fila:last-child::before {
    height: 12px;
}

.columna-linea {
    width: 80px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
}

.disco {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #102A71;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
}

.columna-contenido {
    flex: 1;
    padding-left: 20px;
}

.estado {
    font-weight: bold;
    margin-bottom: 5px;
}

.descripcion p {
    margin: 0 0 10px 0;
}

.fila div:nth-of-type(2) {
    width: 70%;
}

/* Alinea la fecha a la derecha en cada track */
.lineatemp .columna-contenido .estado {
  display: flex;           /* convierte la línea en fila */
  align-items: baseline;   /* alinea tipografías bonito */
  gap: 8px;                /* separa título y fecha */
}

.lineatemp .columna-contenido .estado .fecha {
  margin-left: auto;       /* empuja la fecha a la derecha */
  white-space: nowrap;     /* evita corte de línea en la fecha */
  color: #6b7280;          /* gris suave (opcional) */
  font-weight: 400;        /* más liviano que el título */
  font-size: .9em;         /* un toque más pequeña */
}